/* 셸 — 헤더 캡슐 · 서랍 · 본문 틀 · 푸터 */
/* 푸터 Safe Secure Zone 전용 글꼴 — Montserrat(OFL) 부분집합: 600 은 "afecurZon " 등 쓰는 글자만, 700 은 머리글자 S · Z. 각 4KB 안팎을 CSS 안에 직접(저장소는 코드만 추적 — 글꼴 파일 대신 data URI) · 별도 요청 없음 (2026-10-18 프로님 선택 B) */
@font-face { font-family: 'SSZ Motto'; src: url(data:font/woff2;base64,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) format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'SSZ Motto'; src: url(data:font/woff2;base64,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) format('woff2'); font-weight: 700; font-display: swap; }
@layer layout {
    .wrap { max-width: calc(var(--wrap) + var(--gutter) * 2); margin: 0 auto; padding: 0 var(--gutter); }
    /* ── 셸: 헤더 캡슐 ────────────────────────────────────── */
    .dock { position: sticky; top: 0; z-index: 50; padding: 18px var(--gutter) 0; display: flex; justify-content: center; pointer-events: none; }
    .dock__bar { pointer-events: auto; display: flex; align-items: center; gap: 6px; width: var(--wrap); min-width: 0; max-width: 100%;   /* 본문 그리드 폭에 맞춘다 */ padding: 7px 13px 7px 24px; border-radius: 999px; background: var(--glass); box-shadow: var(--shadow-soft), inset 0 1px 0 var(--white-95); transition: background-color .25s ease, box-shadow .25s ease; }
    /* 스크롤 반응 — 맨 위에서는 히어로 위에 가볍게, 내려가면 불투명도 · 그림자를 올려 본문과 분리 (front.js 가 html.is-scrolled) */
    .is-scrolled .dock__bar { background: var(--white-90); box-shadow: var(--shadow), inset 0 1px 0 var(--white-95); }
    .brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 16px; color: var(--ink); letter-spacing: -0.03em; white-space: nowrap; }
    .brand__logo { flex: none; width: 28px; height: 28px; fill: var(--red); fill-rule: evenodd; }
    .dock .page_h1 { flex: none; display: flex; align-items: center; margin: 0 14px 0 0; font: inherit; color: inherit; letter-spacing: inherit; } /* flex — 인라인 기준선 여백 때문에 로고가 위로 뜨지 않게 */
    .dock__nav { display: flex; align-items: center; gap: 2px; margin-left: auto; }   /* 로고와 계정 묶음 사이 가운데 — 넘치면 auto 가 0 이 되어 스와이프로 이어진다 */
    /* 메뉴 가로 스와이프 — 폭이 모자라면 메뉴를 숨기지 않고 캡슐 안에서 밀어 본다. 넘친 쪽에 페이드 + 이동 단추(front.js)
       그림자(is-on) · 초점 링이 잘리지 않게 트랙을 캡슐 안쪽 여백까지 넓힌다(padding + 같은 크기 음수 margin) */
    .dock__scroller { --clear: 0px; --fade: 54px; position: relative; display: flex; flex: 1 1 auto; min-width: 0; }   /* 바 남은 폭을 채워 계정 링크를 오른쪽 끝으로 */
    .dock__track { position: relative; display: flex; flex: 1 1 auto; align-items: center; gap: 6px; min-width: 0; margin: -20px -6px; padding: 20px 6px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scrollbar-width: none; scroll-padding-inline: 48px; }
    .dock__track::-webkit-scrollbar { display: none; }
    .dock__track { pointer-events: none; } /* 넓힌 위아래 여백이 아래 본문 클릭을 막지 않게 — 메뉴만 받는다 */
    .dock__track > * { pointer-events: auto; }
    .dock__scroller.is-prev .dock__track { -webkit-mask-image: linear-gradient(to right, transparent calc(var(--clear) + 6px), #000 calc(var(--clear) + var(--fade) + 6px)); mask-image: linear-gradient(to right, transparent calc(var(--clear) + 6px), #000 calc(var(--clear) + var(--fade) + 6px)); }
    .dock__scroller.is-next .dock__track { -webkit-mask-image: linear-gradient(to left, transparent calc(var(--clear) + 6px), #000 calc(var(--clear) + var(--fade) + 6px)); mask-image: linear-gradient(to left, transparent calc(var(--clear) + 6px), #000 calc(var(--clear) + var(--fade) + 6px)); }
    .dock__scroller.is-prev.is-next .dock__track { -webkit-mask-image: linear-gradient(to right, transparent calc(var(--clear) + 6px), #000 calc(var(--clear) + var(--fade) + 6px), #000 calc(100% - var(--clear) - var(--fade) - 6px), transparent calc(100% - var(--clear) - 6px)); mask-image: linear-gradient(to right, transparent calc(var(--clear) + 6px), #000 calc(var(--clear) + var(--fade) + 6px), #000 calc(100% - var(--clear) - var(--fade) - 6px), transparent calc(100% - var(--clear) - 6px)); }
    .dock__more { position: absolute; top: 50%; z-index: 1; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: var(--white-85); box-shadow: 0 0 0 1px var(--hair); cursor: pointer; transform: translateY(-50%); }
    .dock__more--prev { left: 0; }
    .dock__more--next { right: 0; }
    .dock__more svg { width: 18px; height: 18px; fill: none; stroke: var(--ink); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
    /* 광학 보정 — 한글 글리프가 줄 상자 안에서 위로 붙어 있어 캡슐 중심보다 약 1.5px 높다. 글자만 내린다 */
    .dock .dock__nav a, .dock .dock__acts .link, .dock .brand { padding-top: 2px; } /* .dock 한 단계 더 — 아래 padding 단축 규칙·1399 구간 규칙보다 우선 */
    .brand__logo { transform: translateY(-1.5px); }
    .dock__nav a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 12px; border-radius: 999px; font-size: 15px; font-weight: 500; color: var(--text); white-space: nowrap; transition: background-color .2s ease, color .2s ease, box-shadow .2s ease; }
    .dock__nav a:hover, .dock__acts .link:hover { color: var(--ink); }   /* 오버 — 글자만 진하게 */
    /* 오버 밑줄 — 가운데서 퍼지는 빛줄: 라일락 → 자주 → 살구 그라데이션 + 옅은 번짐 (배경 메쉬와 같은 색) */
    .dock__nav a, .dock__acts .link { position: relative; }
    .dock__nav a::after, .dock__acts .link::after { content: ''; position: absolute; left: 50%; bottom: 1px; width: calc(100% - 24px); height: 1.5px; border-radius: 2px; background: linear-gradient(90deg, rgba(179, 161, 222, 0), #9a559a 30%, #e0937e 70%, rgba(240, 176, 140, 0)); box-shadow: 0 0 5px rgba(154, 85, 154, .2); opacity: 0; transform: translateX(-50%) scaleX(.3); transition: opacity .25s ease, transform .3s ease; pointer-events: none; }
    .dock__nav a:hover::after, .dock__acts .link:hover::after { opacity: .7; transform: translateX(-50%) scaleX(1); }
    .dock__nav a.is-on, .dock__acts .link.is-on { color: var(--plum-deep); font-weight: 600; }   /* 현재 위치 — 자주 굵은 글자만 */
    .dock__sep { width: 1px; height: 18px; margin: 0 12px; background: var(--hair); }   /* 세로선 양옆 = 메뉴 글자 사이 간격(26) */
    .dock__acts { display: flex; align-items: center; gap: 2px; margin-left: auto; }
    .dock__acts::before { content: ''; width: 1px; height: 18px; margin: 0 15px 0 6px; background: var(--hair); }   /* 계정 묶음 — 메뉴와 세로선 하나로 구분 */
    .dock__acts .link { display: inline-flex; align-items: center; min-height: 36px; padding: 0 11px; font-size: 14px; font-weight: 500; color: var(--muted);   /* 계정 링크 — 메뉴보다 한 단계 작고 옅게 */ border-radius: 999px; white-space: nowrap; }
    .dock__menu { flex: none; display: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--white-85); box-shadow: 0 0 0 1px var(--hair); cursor: pointer; place-items: center; }
    .dock__menu svg { width: 20px; height: 20px; stroke: var(--ink); fill: none; stroke-width: 2; stroke-linecap: round; }
    /* ── 셸: 모바일 드로어 ────────────────────────────────── */
    .drawer { position: fixed; inset: 0; z-index: 100; visibility: hidden; pointer-events: none; overflow: hidden; }
    .drawer__mask { position: absolute; inset: 0; background: var(--shade-22); opacity: 0; transition: opacity .3s ease; }
    .drawer__sheet {
        position: absolute;
        top: 10px;
        right: 10px;
        bottom: 10px;
        width: min(380px, calc(100% - 20px));
        overflow-y: auto;
        padding: 8px 16px 28px;
        border-radius: 28px;
        background: var(--sheet);
        -webkit-backdrop-filter: blur(30px) saturate(170%);
        backdrop-filter: blur(30px) saturate(170%);
        border: 1px solid var(--glass-edge);
        box-shadow: 0 30px 80px -20px var(--shade-45);
        transform: translateX(calc(100% + 20px));
        transition: transform .38s cubic-bezier(.2, .8, .2, 1);
    }
    html.nav-open { overflow: hidden; }
    /* 스크롤 막대 (front.js) — PC 페이지 · 약관 · 처리방침 상자 공용. 배경 없이 오른쪽 끝에 붙는 반투명 막대, 굵기 5 고정, 오버 · 끌 때 색만 진하게 */
    .scroll-bar { position: absolute; top: 0; right: 0; bottom: 0; z-index: 1; width: 14px; }
    .scroll-bar--page { position: fixed; z-index: 95; }
    .scroll-bar[hidden] { display: none; }
    .scroll-bar__thumb { position: absolute; top: 0; right: 3px; width: 5px; height: var(--h, 48px); border-radius: 999px; background: var(--scroll-thumb); transform: translateY(var(--y, 0)); transition: background-color .15s ease; cursor: pointer; touch-action: none; }
    .scroll-bar:hover .scroll-bar__thumb, .scroll-bar.is-drag .scroll-bar__thumb { background: var(--scroll-thumb-hover); }
    .scroll-host { position: relative; }   /* 상자(textarea)를 감싸는 틀 — 막대가 상자 위에 겹친다 */
    .scroll-host .scroll-bar__thumb { right: 8px; }   /* 상자는 둥근 모서리 안쪽으로 — 위아래 띄움은 front.js 가 상자 반경으로 계산(막대 끝 ↔ 모서리 거리 = 오른쪽 간격 8) */
    html.nav-open .drawer { visibility: visible; pointer-events: auto; }
    html.nav-open .drawer__mask { opacity: 1; }
    html.nav-open .drawer__sheet { transform: none; }
    .drawer__top { display: flex; align-items: center; justify-content: space-between; min-height: 56px; margin: 0 -16px; padding: 0 10px 0 20px; }
    .drawer__top strong { font-size: 20px; font-weight: 700; letter-spacing: -0.03em; }
    .drawer__close { min-height: 44px; padding: 0 12px; border: 0; background: none; font-size: 16px; font-weight: 600; color: var(--plum); cursor: pointer; }
    .group__label { margin: 20px 16px 8px; font-size: 14px; font-weight: 500; color: var(--muted); }
    .group { border-radius: 16px; background: var(--white-88); overflow: hidden; box-shadow: 0 1px 2px var(--plum-05); }
    .group a { display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 0 14px; font-size: 16px; font-weight: 500; color: var(--ink); position: relative; }
    .group a.is-on { color: var(--plum); font-weight: 600; }
    .group li + li a::before { content: ''; position: absolute; left: 58px; right: 0; top: 0; height: 1px; background: var(--hair); }
    /* ── 셸: 본문 · 푸터 ──────────────────────────────────── */
    body:has(> .content_main) { display: flex; flex-direction: column; }   /* 짧은 화면 — 본문이 남는 높이를 채워 푸터가 화면 바닥에 */
    body > .content_main { flex: 1 0 auto; width: 100%; }
    .content_main { display: flow-root; padding-top: 40px; padding-bottom: 50px; } /* 푸터 위 50 — 섹션 사이 간격과 같다 (PC · 모바일 공통) */
    .foot { clear: both; padding: 0 0 32px; }
    .foot__panel { border-radius: var(--r-xl); padding: 40px 44px 30px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px 48px; background: var(--white-50); }
    .foot__links { display: grid; grid-template-columns: repeat(3, auto); gap: 0 56px; }
    .foot__links strong { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 600; }
    .foot__links a { display: block; padding: 4px 0; font-size: 15px; color: var(--text); }
    .foot__links a:hover { color: var(--plum); }
    .foot__legal { grid-column: 1 / -1; padding-top: 22px; border-top: 1px solid var(--hair); font-size: 14px; line-height: 1.8; color: var(--muted); }
    .foot__legal span { display: inline-block; margin-right: 14px; }
    .foot__motto { margin-bottom: 10px; color: var(--muted); font-family: 'SSZ Motto', var(--sans); font-size: 15px; font-weight: 600; letter-spacing: .06em; }   /* ssz 풀이 — 법정 표기 위 한 줄, 브랜드 표지처럼 Montserrat. 머리글자 S · S · Z 만 #333 굵게 (2026-10-18) */
    .foot__motto b { color: #333; font-weight: 700; }   /* 프로님 지정값 */
    .foot__legal a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--hair-strong); }
    .foot__legal a:hover { color: var(--plum); }
    /* 인증 로고 — 옛 하단 그림(/img/tail.gif 950×70)의 오른쪽 세 로고를 잘라 쓴다. 흰 바탕은 multiply 로 유리판에 녹인다 */
    .foot__marks { display: flex; align-items: center; gap: 14px; margin-top: 14px; }
    .foot__marks .foot__mark { display: block; height: 40px; min-height: 0; background: url(/img/tail.gif) no-repeat; }
    .foot__marks a.foot__mark { box-sizing: content-box; padding-block: 2px; background-clip: content-box; background-origin: content-box; }   /* 링크는 터치 44 — 그림(40)은 그대로, 위아래 빈 띠 2 */
    .foot__marks .foot__mark--ftc { width: 56px; background-position: -793px -17px; }
    .foot__marks .foot__mark--etc { width: 86px; background-position: -861px -17px; }
    /* PC — 사업자 정보는 왼쪽 칸, 하단 메뉴는 오른쪽 칸 (로고 · 이름은 2026-10-13 뺌) */
    @media (min-width: 1025px) {
        .foot__links { grid-column: 2; grid-row: 1; }
        /* 수평 그리드 — 모토 ↔ 메뉴 제목, 첫 표기 줄 ↔ 메뉴 첫 항목 두 줄만 기준선 일치. 표기 · 메뉴 줄 간격은 원래대로(넓히지 않는다 — 2026-10-18 프로님 지적) */
        .foot__motto { margin: -3px 0 11.8px; }   /* 모토 기준선 = 메뉴 제목, 둘째 줄 = 메뉴 첫 항목 — 실측 보정(Montserrat 15px) */
        .foot__legal { grid-column: 1; grid-row: 1; padding-top: 0; border-top: 0; align-self: start; } /* 위 끝을 하단 메뉴 제목과 맞춘다 — end 면 방문 수 줄이 없는 화면에서 아래로 처졌다 */
    }
    /* 레이어 창 — 담당자 선택(new_sslc) 이 마우스 위치에 띄운다 */
    #layer_window_area { display: none; position: absolute; z-index: 60; padding: 10px; font-size: 14px; border-radius: var(--r-md); background: var(--white); box-shadow: var(--shadow), 0 0 0 1px var(--hair); }
    #layer_window_x { position: absolute; top: -12px; right: -12px; width: 28px; height: 28px; border: 0; border-radius: 50%; background: var(--plum-deep); color: var(--white); font-size: 16px; line-height: 1; cursor: pointer; }
    /* 1399 이하 — 캡슐 안 간격만 좁혀 한 줄을 더 오래 유지 */
    @media (max-width: 1399px) {
        .dock .page_h1 { margin-right: 8px; }
        .dock__nav a { padding: 0 9px; font-size: 14.5px; }
        .dock__sep { margin: 0 7px; }
        .dock__acts::before { margin: 0 9px 0 4px; }
        .dock__acts .link { padding: 0 9px; }
    }
    /* 1024 이하 — 메뉴는 캡슐 안 스와이프로 남기고, 서랍 단추를 오른쪽 끝에 더한다 */
    @media (max-width: 1024px) {
        .dock__menu { display: grid; }
    }
    @media (max-width: 1024px) {
        .foot__panel { grid-template-columns: 1fr; }
    }
    @media (max-width: 768px) {
        .dock { padding-top: 10px; }
        .dock__bar { padding-left: 14px; }
        /* 좁은 캡슐 — 원 대신 가장자리 쉐브론만(누르는 폭 44, 쉐브론은 바깥쪽 24 안) — 메뉴 글자를 덜 가린다 */
        .dock__scroller { --clear: 24px; --fade: 20px; }
        .dock__more { width: var(--tap); height: var(--tap); background: none; box-shadow: none; }
        .dock__more--prev { place-items: center start; padding-left: 4px; }
        .dock__more--next { place-items: center end; padding-right: 4px; }
        .dock__more svg { width: 16px; height: 16px; }
        .content_main { padding-top: 24px; }
        .brand { min-height: var(--tap); }
        .foot__legal a { display: inline-flex; align-items: center; min-height: var(--tap); }
        .foot__panel { padding: 28px 22px 22px; gap: 24px; }
        .foot__links { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; }
        .foot__links a { display: flex; align-items: center; min-height: var(--tap); padding: 0; font-size: 15px; line-height: 1.45; }
        .foot__legal span { margin-right: 10px; }
    }
    /* 400 이하 — 작은 폰 */
    @media (max-width: 400px) {
        .brand { font-size: 15px; }
        .foot__links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 12px; }
        /* 푸터 링크 — 서비스(3) · 회사(3) 한 줄, 고객지원(4)은 아래 두 칸. 한 묶음만 홀로 남는 줄 없음 */
        .foot__links > div:nth-child(2) { order: 1; grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; }
        .foot__links > div:nth-child(2) strong { grid-column: 1 / -1; }
    }
}
