/* ============================================================
   ARIFE 약관·정책 페이지 정렬 v3000
   (이용약관 · 개인정보처리방침 · 취소·환불 정책)

   ── 무엇이 어긋나 있었나 (1440px 실측) ──────────────────────

   1) 위 탭 막대가 본문과 따로 놀았다.
      `.trust-rail-v310` 은 좌우 여백 14px 짜리 전폭 막대라 내용이
      화면 끝에서 시작하는데, 본문은 가운데 860px 였다.
      탭은 L193, 본문은 L290 — 100px 어긋났다.

   2) '문서 내 이동' 색인이 짓뭉개져 있었다.
      두 벌의 규칙이 부딪혔다.
        arife-legal-v1500 … `.legal-page{width:min(1180px,…); 250px + 1fr 2단}`
        arife-site        … `.legal-page{max-width:860px}`
      뒤엣것이 폭을 860 으로 잘라서, 2단 구성이 860 안에 우겨넣어졌다.
      그 바람에 색인이 왼쪽 250px 칸에 갇혔고,
        · 안쪽 이름표가 145px 을 먹어 목록에 73px 만 남았다
        · 가로 스크롤 목록이라 항목이 옆으로 밀려 '1. 구' 처럼 잘렸다
        · 옆 칸(목차)이 길어 상자만 264px 로 늘어나 속이 텅 비었다

   ── 어떻게 고치나 ──────────────────────────────────────────
   읽는 글이라 860px 한 단을 유지한다. 2단을 버리고,
   색인은 원래 설계대로 가로 막대 하나로 되돌린다.
   탭 막대는 배경만 전폭으로 두고 안쪽 내용을 본문 선에 맞춘다.
   ============================================================ */

/* 페이지 틀 — 한 단. `max-width` 와 `width` 가 더는 다투지 않게 둘 다 못 박는다 */
body.policy-reading .legal-page:not(#_):not(#_){
  width:min(860px,calc(100% - 40px))!important;
  max-width:none!important;
  margin:0 auto!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:20px 0!important;
}

/* 색인 — 가로 막대 하나. 항목이 잘리지 않게 칸을 다 내준다 */
.trust-policy-index-v310:not(#_):not(#_){
  grid-column:1 / -1!important;
  width:100%!important;
  align-self:start!important;
}
.trust-policy-index-v310:not(#_):not(#_) > div{
  min-width:0!important;
  overflow-x:auto!important;
}
.trust-policy-index-v310:not(#_):not(#_) a{
  align-self:center!important;   /* 상자가 늘어나도 알약은 제 높이대로 */
  min-height:38px!important;
  white-space:nowrap!important;
}

/* 위 탭 막대 — 바탕은 전폭, 내용은 본문 선에 맞춘다.
   같은 막대를 쓰는 페이지라도 본문 폭이 달라서 따로 적는다(실측값).
     약관·개인정보·환불   860px
     수익 구조           1,180px
     라이선스 센터       1,240px */
body.trust-legal-v310 .trust-rail-v310:not(#_):not(#_){
  padding-inline:calc((100% - min(860px,100% - 40px)) / 2)!important;
}
body.trust-revenue-v310 .trust-rail-v310:not(#_):not(#_){
  padding-inline:calc((100% - min(1180px,100% - 38px)) / 2)!important;
}
body.trust-license-v310 .trust-rail-v310:not(#_):not(#_){
  padding-inline:calc((100% - min(1240px,100% - 38px)) / 2)!important;
}

/* 좁은 화면에서는 이름표를 접고 목록에 폭을 다 준다 (원래 규칙과 같은 뜻) */
@media (max-width:720px){
  .trust-policy-index-v310:not(#_):not(#_){
    grid-template-columns:minmax(0,1fr)!important;
  }
  .trust-policy-index-v310:not(#_):not(#_) > span{ display:none!important; }
}

/* 700px 아래에서는 원래 규칙이 본문 틀을 `100% - 22px`(양옆 11px) 로 좁힌다.
   수익 구조 페이지만 본문이 그 규칙을 그대로 쓰므로 막대·푸터도 11px 로 맞춘다.
   (약관 3종은 위에서 폭을 직접 정해 두어 이미 서로 맞는다) */
@media (max-width:700px){
  body.trust-revenue-v310 .trust-rail-v310:not(#_):not(#_){
    padding-inline:11px!important;
  }
  body.trust-revenue-v310 .footer{ --arife-foot-w:calc(100% - 22px); }
}