/* 서비스 이용약관 (/terms) · 개인정보 처리방침 (/privacy) — 장식 없이 읽기 좋은 문서: 목차(왼쪽에 붙어 따라옴, 지금 읽는 조항 표시) + 40em 본문 + 인쇄용.
   본문은 운영 설정 문구 그대로 (App\Support\LegalDoc 이 조항 · 날짜 · 연락처만 나눈다) */
.l-head { padding-bottom: clamp(36px, 4.4vw, 56px); }
.l-head h1 { font-size: var(--fs-3xl); }
.dates { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 4px 28px; font-size: var(--fs-s); color: var(--ink-2); }
.dates div { display: flex; gap: 8px; }
.dates dt { color: var(--slate); }
.dates dd { font-weight: 650; font-variant-numeric: tabular-nums; }
.l-sec { padding: clamp(24px, 3vw, 40px) 0 clamp(88px, 10vw, 128px); }
.l-grid { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: clamp(40px, 6vw, 96px); align-items: start; }

/* 목차 */
.toc { position: sticky; top: 104px; }
.toc h2 { font-size: var(--fs-s); font-weight: 650; }
.toc ol { margin-top: 12px; border-left: 1px solid var(--line); }
.toc ol a { display: flex; gap: 8px; margin-left: -1px; padding: 7px 0 7px 16px; border-left: 2px solid transparent; font-size: var(--fs-s); line-height: 1.5; color: var(--ink-2); }
.toc ol a span { flex: none; min-width: 1.2em; color: var(--slate); font-variant-numeric: tabular-nums; }
@media (hover: hover) { .toc ol a:hover { color: var(--ink); } }
.toc a[aria-current="true"] { border-left-color: var(--cobalt); color: var(--cobalt); font-weight: 650; }
.toc a[aria-current="true"] span { color: var(--cobalt); }
.toc .also { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line-2); font-size: var(--fs-xs); color: var(--slate); }
.toc .also .link { display: inline-block; margin-top: 4px; font-size: var(--fs-s); }

/* 본문 */
.doc { max-width: 40em; }
.doc section + section { margin-top: 52px; }
.doc section { scroll-margin-top: 104px; }
.doc h2 { display: flex; gap: 10px; font-size: var(--fs-l); line-height: 1.4; font-weight: 700; letter-spacing: -.03em; }
.doc h2 span { flex: none; color: var(--slate); font-weight: 500; font-variant-numeric: tabular-nums; }
.doc p, .doc li, .doc dl { font-size: var(--fs-m); line-height: 1.9; color: var(--ink-2); }
.doc h2 + * { margin-top: 14px; }
.doc p + ul, .doc p + dl { margin-top: 12px; }
.doc ul { display: grid; gap: 8px; }
.doc li { position: relative; padding-left: 20px; }
.doc li::before { content: ""; position: absolute; left: 4px; top: .86em; width: 5px; height: 5px; border-radius: 50%; background: #A3ABBB; }
.doc li b { color: var(--ink); font-weight: 650; }
.doc a { color: var(--cobalt); font-weight: 650; text-decoration: underline; text-underline-offset: 4px; }
.doc .who { margin-top: 14px; padding: 18px 22px; border-radius: 16px; background: var(--mist); }
.doc .who dl { margin-top: 2px; display: grid; gap: 2px; }
.doc .who dl div { display: grid; grid-template-columns: 3.4em minmax(0, 1fr); gap: 12px; }
.doc .who dt { color: var(--slate); }
.doc .who .org { font-weight: 650; color: var(--ink); }

@media (max-width: 860px) {
    .l-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
    .toc { position: static; padding: 20px 22px; border-radius: 16px; background: var(--mist); }
    .toc ol { border-left: 0; margin-top: 8px; }
    .toc ol a { margin-left: 0; padding: 7px 0; border-left: 0; }
    .toc a[aria-current="true"] { color: var(--ink-2); font-weight: 400; } .toc a[aria-current="true"] span { color: var(--slate); }
    .toc .also { margin-top: 14px; padding-top: 14px; }
    .doc section + section { margin-top: 44px; }
}
/* 860px 이하 — 공용 CSS 가 html 에 scroll-padding-top(머리 캡슐 자리)을 주므로 여기선 틈만 */
@media (max-width: 860px) { .doc section { scroll-margin-top: 16px; } }
/* 모바일 덜어내기 — 목차는 접힌 한 줄 */
@media (max-width: 760px) {
    .toc { padding: 4px 18px; }
    .toc h2 .m-tg { min-height: 52px; }
    .toc .m-n { margin-left: 8px; font-weight: 500; color: var(--slate); }
    .toc .m-tg { justify-content: flex-start; }
    .toc .m-tg::after { margin-left: auto; }
    .toc ol { margin-top: 0; }
    .toc .m-body { padding-bottom: 16px; }
    .l-grid { gap: 32px; }
    .doc .who dd a { display: inline-block; padding: 12px 0; margin: -12px 0; }
    .toc ol a { padding: 11px 0; }   /* 펼친 목차 — 누르는 자리 44px */
    .toc .also .link { padding: 10px 0; margin: -6px 0 -10px; }
}
@media print {
    .m-body { display: block !important; }
    .gnb, .toc, .crumb, .disclaimer, .foot, .kakao, .flash { display: none !important; }
    .p-head { padding: 0 0 16px; background: none; }
    .l-grid { display: block; }
    .doc { max-width: none; }
    .doc p, .doc li, .doc dl { font-size: 11pt; line-height: 1.7; color: #000; }
    .doc section { break-inside: avoid; }
}
/* 조항을 알아보지 못해 원문을 그대로 그릴 때 */
.doc.raw > * + * { margin-top: 14px; }
.doc.raw h2, .doc.raw h3 { margin-top: 40px; font-size: var(--fs-l); line-height: 1.4; font-weight: 700; letter-spacing: -.03em; color: var(--ink); }
.doc.raw strong, .doc.raw b { color: var(--ink); font-weight: 650; }
.l-intro { margin-bottom: 44px; }
.l-intro > * + * { margin-top: 12px; }
