/* ============================================================
   ARIFE 푸터 정렬 v2900

   문제 두 가지였다.

   1) 줄이 안 맞았다.
      본문은 가운데 1,180px 인데 푸터만 화면 끝까지 뻗어(좌우 여백 58~64px)
      로고가 본문보다 150px 쯤 왼쪽에 나와 있었다.

   2) 페이지마다 푸터 모양이 달랐다. 실측:
        홈·약관·수익구조 …  로고 좌 / 메뉴 우 → 약관 → 사업자   (기준으로 삼는다)
        요금            …  메뉴가 로고 아래 왼쪽, 약관이 오른쪽
        문의            …  메뉴와 약관 자리가 서로 바뀜
        마켓·기업       …  로고·메뉴·약관이 한 줄에 붙음 (마켓은 사업자 정보가 아예 없었다)

   홈 모양으로 통일하고, 좌우 선을 그 페이지 본문 틀에 맞춘다.

   폭은 페이지마다 본문 틀이 달라서 아래에 따로 적는다. 값은 짐작이 아니라
   1920·1600·1440·1280·1024·768·390px 에서 실제로 재서 얻은 것이다.
   본문 틀이 나중에 바뀌면 이 표만 고치면 된다.
   ============================================================ */

/* ── 페이지별 본문 폭 ──────────────────────────────────────── */
.footer{
  --arife-foot-w:min(1180px,100% - 40px);          /* 기본 .container */
}
body.custom-production-page .footer{ --arife-foot-w:min(1240px,100% - 40px); }
body.trust-license-v310 .footer{     --arife-foot-w:min(1240px,100% - 38px); } /* 라이선스 센터 */
body.pricing-page .footer{           --arife-foot-w:min(1280px,100% - 52px); }
body.access-stage-v308:not(.pricing-page) .footer{ --arife-foot-w:min(1380px,100% - 36px); } /* 문의 */
body.market-v223 .footer{            --arife-foot-w:min(1480px,100% - 48px); }
body.enterprise-license-page .footer{--arife-foot-w:min(1420px,100% - 48px); }
body.desk-page-v1 .footer{           --arife-foot-w:min(1480px,100% - 48px); } /* 거래 데스크 — 마켓과 같은 폭 */
body.trust-legal-v310 .footer{       --arife-foot-w:min(1420px,100% - 48px); } /* 약관·정책 — 본문 폭(v652)과 같게 */

/* 거래 데스크 바닥글 — 다른 상거래 화면과 같은 유리 배경.
   (데스크 몸통은 유리 화면 계열(a-glass-page)이 아니라서 이 유리 규칙을
   못 받는다. 몸통까지 그 계열로 바꾸면 데스크 전체가 다시 칠해지므로
   바닥글만 같은 값으로 맞춘다 — 2026-08-22 실측) */
body.desk-page-v1 .footer:not(#_):not(#_){
  background:
    linear-gradient(180deg,rgba(233,240,249,.42),rgba(255,255,255,.06) 52%,rgba(255,255,255,.2)),
    rgba(227,235,246,.58)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.5);
  backdrop-filter:blur(18px) saturate(1.5)!important;
  border-top:1px solid rgba(255,255,255,.55)!important;
}

/* ── 뼈대 ──────────────────────────────────────────────────
   좌우 여백을 `(남는 폭 ÷ 2)` 로 잡으면 안쪽이 정확히 본문 폭이 된다.
   가운데 정렬을 위해 따로 감싸는 상자를 넣지 않아도 된다.       */
.footer:not(#_):not(#_){
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:0 26px!important;
  padding:40px calc((100% - var(--arife-foot-w)) / 2) 46px!important;
  border-top:1px solid rgba(164,188,231,.13)!important;
  color:#767f8c!important;
  font-size:12px!important;
}

/* 1줄 — 로고(왼쪽) · 메뉴(오른쪽) */
.footer:not(#_):not(#_) > .brand{
  grid-column:1!important;
  grid-row:1!important;
  justify-self:start!important;
  margin:0!important;
}
.footer:not(#_):not(#_) > .footer-links:not(.footer-legal-links){
  grid-column:2!important;
  grid-row:1!important;
  justify-self:end!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
  gap:8px 20px!important;
  margin:0!important;
}

/* 2줄 — 약관. 위에 가는 선 하나로 구분한다. */
.footer:not(#_):not(#_) > .footer-legal-links{
  grid-column:1 / -1!important;
  grid-row:2!important;
  justify-self:stretch!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px 20px!important;
  width:100%!important;
  margin:22px 0 0!important;
  padding:18px 0 0!important;
  border-top:1px solid rgba(164,188,231,.11)!important;
}

/* 3줄 — 사업자 정보. 선을 겹쳐 긋지 않는다. */
.footer:not(#_):not(#_) > .footer-biz{
  grid-column:1 / -1!important;
  grid-row:3!important;
  justify-self:stretch!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px 20px!important;
  width:100%!important;
  margin:14px 0 0!important;
  padding:0!important;
  border-top:0!important;
  font-size:11.5px!important;
  line-height:1.75!important;
}

/* 그 밖에 끼어 있는 것(예: 요금 페이지의 저작권 한 줄)은 사업자 줄과 같은 자리에 */
.footer:not(#_):not(#_) > span{
  grid-column:1 / -1!important;
  grid-row:4!important;
  justify-self:start!important;
  margin:8px 0 0!important;
  font-size:11.5px!important;
}

/* ── 글자 ──────────────────────────────────────────────────
   '개인정보처리방침'만 하늘색·굵은 글씨라 혼자 튀었다. 법으로 강조가
   필요한 항목이라 굵기는 남기고 색만 나머지와 맞춘다. */
.footer:not(#_):not(#_) a{
  color:#8d97a5!important;
  font-size:12px!important;
}
.footer:not(#_):not(#_) a:hover{ color:#eaf2ff!important; }
.footer:not(#_):not(#_) .footer-legal-links a.privacy{
  color:#aab5c4!important;
  font-weight:700!important;
}
.footer:not(#_):not(#_) .footer-biz b{
  color:#98a3b2!important;
  font-weight:600!important;
}
.footer:not(#_):not(#_) .brand img{
  display:block!important;
  height:15px!important;
  width:auto!important;
}

/* ── 좁은 화면 ────────────────────────────────────────────
   로고 옆에 메뉴 5개를 붙이면 넘친다. 한 칸으로 세워 쌓는다. */
@media (max-width:720px){
  .footer:not(#_):not(#_){
    grid-template-columns:minmax(0,1fr)!important;
    padding:32px calc((100% - var(--arife-foot-w)) / 2) 38px!important;
  }
  .footer:not(#_):not(#_) > .footer-links:not(.footer-legal-links){
    grid-column:1!important;
    grid-row:2!important;
    justify-self:start!important;
    justify-content:flex-start!important;
    margin-top:16px!important;
  }
  .footer:not(#_):not(#_) > .footer-legal-links{ grid-row:3!important; margin-top:18px!important; }
  .footer:not(#_):not(#_) > .footer-biz{ grid-row:4!important; }
  .footer:not(#_):not(#_) > span{ grid-row:5!important; }
}

/* ══════════════════════════════════════════════════════════
   꼬리말 글자를 모드에 맞춘다 v5150 — 2026-08-31

   위 124 줄의 `.footer a{color:#8d97a5}` 와 `:hover{#eaf2ff}` 는
   **어두운 꼬리말**을 전제로 고른 값이다. 그런데 밝은 화면에서는
   꼬리말이 밝다. 다른 시트가 덮어 주는 쪽(AI 스튜디오 등)은 괜찮았지만,
   아무도 안 덮는 쪽(마이페이지·로그인)에서는 그대로 남아 2.78 이었다
   (실측 — 「맞춤 제작」「수익 구조」「판매 등록」「구독 요금」「문의」).

   호버 색이 더 나빴다 — 밝은 바닥에 #eaf2ff 를 얹으면 마우스를 대는
   순간 글자가 사라진다. 오늘 로그인 창에서 고쳤던 것과 같은 병이다.

   모드마다 제 색을 준다. 밝은 쪽 #445263 은 6.7, 어두운 쪽 #a8b0ba 는
   5.4 로, 둘 다 본문보다는 한 걸음 물러나 있다. */
html:not([data-theme="dark"]) body:not(#_u):not(#_v):not(#_w):not(#_x):not(#_y):not(#_z):not(#_1):not(#_2):not(#_3) .footer a{
  color:#445263 !important; -webkit-text-fill-color:#445263 !important;
}
html:not([data-theme="dark"]) body:not(#_u):not(#_v):not(#_w):not(#_x):not(#_y):not(#_z):not(#_1):not(#_2):not(#_3) .footer a:hover{
  color:#1c56be !important; -webkit-text-fill-color:#1c56be !important;
}
html:not([data-theme="dark"]) body:not(#_u):not(#_v):not(#_w):not(#_x):not(#_y):not(#_z):not(#_1):not(#_2):not(#_3) .footer .footer-legal-links a.privacy{
  color:#33404f !important; -webkit-text-fill-color:#33404f !important;
}
html[data-theme="dark"] body:not(#_u):not(#_v):not(#_w):not(#_x):not(#_y):not(#_z):not(#_1):not(#_2):not(#_3) .footer a{
  color:#a8b0ba !important; -webkit-text-fill-color:#a8b0ba !important;
}
html[data-theme="dark"] body:not(#_u):not(#_v):not(#_w):not(#_x):not(#_y):not(#_z):not(#_1):not(#_2):not(#_3) .footer a:hover{
  color:#eaf2ff !important; -webkit-text-fill-color:#eaf2ff !important;
}

/* 사업자 정보 라벨 v5200 — 2026-08-31
   위 v5150 은 꼬리말의 **링크**만 모드에 맞췄다. 그 아래 사업자 정보 줄의
   라벨(<b> 상호·대표·사업자등록번호·통신판매업신고·주소·전화·문의)은
   여전히 어두운 꼬리말용 회색(#98a3b2) 그대로라, 밝은 화면에서 2.41 이었다
   (실측 — 마이페이지·계정 화면). 법으로 적어 두는 줄이라 안 읽히면 안 된다.
   밝은 쪽 #5b6673 은 흰 바닥에서 5.8, 어두운 쪽은 원래 값이 5.4 로 맞다. */
html:not([data-theme="dark"]) body:not(#_u):not(#_v):not(#_w):not(#_x):not(#_y):not(#_z):not(#_1):not(#_2):not(#_3) .footer .footer-biz b{
  color:#5b6673 !important; -webkit-text-fill-color:#5b6673 !important;
}
html:not([data-theme="dark"]) body:not(#_u):not(#_v):not(#_w):not(#_x):not(#_y):not(#_z):not(#_1):not(#_2):not(#_3) .footer .footer-biz{
  color:#5b6673 !important;
}