@charset "utf-8";
/* ============================================================
   sub.css — PUBLIC ENTRYPOINT (서브 공통)
   서브 페이지에서 반복되는 역할 클래스. 페이지 고유 스타일은 assets/css/pages/<page>.css
   ============================================================ */

/* 본문 래퍼 — 시안: 1440 · 섹션 간격 60 · 하단 160 */
.sub-content{padding-bottom:clamp(80px,8.33vw,160px)}
.sub-content > .inner{display:flex;flex-direction:column;gap:clamp(40px,3.13vw,60px)}

/* ---------- 섹션 인트로 (ghost 영문 + eyebrow + 제목 + 설명 + CTA) ---------- */
.sec-intro{position:relative;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px 40px;padding-top:clamp(32px,2.5vw,48px)}
.sec-intro__ghost{position:absolute;left:clamp(-30px,-1.56vw,-10px);top:0;font-family:var(--ff-inter);font-weight:700;font-size:clamp(54px,5.63vw,108px);line-height:1.05;letter-spacing:-.037em;color:#f5f5f5;white-space:nowrap;pointer-events:none;user-select:none;z-index:0}
.sec-intro__text{position:relative;z-index:1;flex:1 1 640px;min-width:0}
.sec-intro__eyebrow{font-family:var(--ff-inter);font-weight:700;font-size:14px;line-height:1.4;letter-spacing:.15em;color:var(--kjs-accent-orange)}
.sec-intro__title{margin-top:clamp(20px,2.03vw,39px);font-size:clamp(28px,2.29vw,44px);font-weight:400;line-height:1.35;color:#27272c;letter-spacing:-.01em}
.sec-intro__title strong{font-weight:700}
.sec-intro__desc{margin-top:clamp(14px,1.04vw,20px);font-size:clamp(15px,.94vw,18px);line-height:1.65;color:#616166}
.sec-intro .btn-pill{position:relative;z-index:1;flex:none}

/* ---------- pill 버튼 (teal · ↗) ---------- */
.btn-pill{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border-radius:100px;background:var(--kjs-brand-deep-teal);color:#fff;line-height:1;white-space:nowrap;transition:background-color .3s,box-shadow .3s,translate .3s var(--ease-out)}
.btn-pill__txt{font-family:var(--ff-pre);font-weight:700;font-size:18px}
.btn-pill__arrow{font-family:var(--ff-inter);font-size:23px;transition:translate .3s var(--ease-out)}
.btn-pill:hover{background:var(--kjs-accent-orange);box-shadow:0 10px 24px rgba(246,137,49,.32);translate:0 -2px}
.btn-pill:hover .btn-pill__arrow{translate:3px -3px}
.btn-pill--orange{background:var(--kjs-accent-orange)}
.btn-pill--orange:hover{background:var(--kjs-brand-deep-teal);box-shadow:0 10px 24px rgba(0,49,71,.28)}
@media (max-width:767.98px){ .btn-pill{padding:14px 24px} .btn-pill__txt{font-size:16px} .btn-pill__arrow{font-size:19px} }

/* ---------- 번호 항목 박스 (회색 라운드 · 행마다 제목/본문) ---------- */
.info-box{background:#f5f5f5;border-radius:20px;padding:clamp(32px,3.65vw,70px) clamp(20px,3.13vw,60px);display:flex;flex-direction:column;gap:clamp(30px,2.6vw,50px)}
.info-box__row{display:flex;gap:30px;align-items:flex-start;padding-bottom:clamp(30px,2.6vw,50px);border-bottom:1px solid #ccc}
.info-box__row:last-child{padding-bottom:0;border-bottom:0}
.info-box__head{display:flex;align-items:center;gap:20px;flex:0 0 400px;max-width:400px}
.num-badge{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;border-radius:6px;background:var(--kjs-accent-orange);color:#fff;font-family:var(--ff-pre);font-weight:700;font-size:20px;line-height:1}
.info-box__title{font-size:clamp(22px,1.56vw,30px);font-weight:700;line-height:1.4;color:#000}
.info-box__body{flex:1 1 auto;min-width:0}
@media (max-width:1023.98px){
  .info-box__row{flex-direction:column;gap:18px}
  .info-box__head{flex:none;max-width:none}
}

/* ---------- 점 목록 (주황 4px dot) ---------- */
.dot-list{display:flex;flex-direction:column;gap:10px}
.dot-list > li{position:relative;padding-left:16px;font-size:clamp(16px,1.04vw,20px);line-height:1.8;color:#000}
.dot-list > li::before{content:"";position:absolute;left:0;top:calc(.9em - 2px);width:4px;height:4px;border-radius:4px;background:var(--kjs-accent-orange)}
.dot-list b,.dot-list strong{font-weight:600}

/* ---------- 공통 타이포 보조 ---------- */
.t-orange{color:var(--kjs-accent-orange)}
.t-teal{color:var(--kjs-brand-deep-teal)}
.br-pc{display:inline}
@media (max-width:1023.98px){ .br-pc{display:none} }

/* ---------- 법적 고지 문서 (개인정보처리방침 · 면책공고 · 이용약관) ---------- */
.doc-legal{max-width:1080px;font-size:16px;line-height:1.8;color:#333}
.doc-legal h2{margin-top:48px;font-size:22px;font-weight:700;color:#111;line-height:1.4}
.doc-legal h2:first-child{margin-top:0}
.doc-legal h3{margin-top:24px;font-size:18px;font-weight:600;color:#111}
.doc-legal p,.doc-legal ul,.doc-legal ol,.doc-legal table{margin-top:12px}
.doc-legal ul{list-style:disc;padding-left:1.4em}
.doc-legal ol{list-style:decimal;padding-left:1.4em}
.doc-legal table{width:100%;font-size:15px}
.doc-legal th,.doc-legal td{border:1px solid #ddd;padding:12px 14px;text-align:left;vertical-align:top}
.doc-legal th{background:#f7f7f7;font-weight:600}
.doc-legal .doc-legal__date{margin-top:48px;color:#777;font-size:15px}
.doc-legal .table-wrap{overflow-x:auto}

/* 공통 보정 — LNB 없는 페이지의 본문 상단 여백 · 긴 ghost 영문의 모바일 폭 제한 */
.sub-hero + .sub-content{padding-top:clamp(56px,5.21vw,100px)}
@media (max-width:767.98px){ .sec-intro__ghost{font-size:min(54px,12.5vw);max-width:100%;overflow:hidden} }