/* 상세페이지 디자인 (가로 860px) — 색·글꼴은 .page 의 변수로 바뀜 */
.page{--c:#1F3A6E;--p:#FFC83D;--soft:#F4F5F7;--dark:#152238;--r:18px;--tf:'Pretendard';--bf:'Pretendard';--tw:800;
  --ink:#1b1d22;--gray:#5d6470;--line:#e3e6eb;
  position:relative;width:860px;background:#fff;color:var(--ink);font-family:var(--bf),Pretendard,'Malgun Gothic',sans-serif;
  letter-spacing:-.03em;word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased;line-height:1.5}
.page *{box-sizing:border-box;margin:0;padding:0}
.page img{display:block;width:100%;height:auto}
.page b{font-weight:800;color:var(--c)}
.page .tt{font-family:var(--tf),var(--bf),Pretendard,sans-serif;font-weight:var(--tw)}
.page .mut{color:var(--gray)}
.page .accent{color:var(--c);font-weight:800}

/* 블록 공통 */
.blk{position:relative;padding:90px 60px}
.blk.pad-0{padding-top:0;padding-bottom:0}
.blk.pad-s{padding-top:44px;padding-bottom:44px}
.blk.pad-l{padding-top:130px;padding-bottom:130px}
.blk.nopad{padding:0!important}
.al-center{text-align:center}
.al-left{text-align:left}
.bg-white{background:#fff}
.bg-soft{background:var(--soft)}
.bg-themeSoft{background:color-mix(in srgb,var(--c) 9%,#fff)}
.bg-theme{background:var(--c);color:#fff}
.bg-dark{background:var(--dark);color:#fff}
.bg-theme .mut,.bg-dark .mut{color:rgba(255,255,255,.78)}
.bg-theme b,.bg-dark b,.bg-theme .accent,.bg-dark .accent{color:var(--p)}
.bleed{margin-left:-60px!important;margin-right:-60px!important;border-radius:0!important}

/* 사진 칸 */
.ph{position:relative;overflow:hidden;border-radius:var(--r)}
.ph.fix img{width:100%;height:100%;object-fit:cover}
.ph+.ph{margin-top:20px}

/* 공통 글자 */
.pill{display:inline-block;background:var(--c);color:#fff;font-size:calc(22px*var(--s));font-weight:700;padding:9px 24px;border-radius:999px;margin-bottom:24px}
.bg-theme .pill{background:#fff;color:var(--c)}
.h-small{font-size:calc(30px*var(--s));font-weight:600;margin-bottom:10px;line-height:1.4}
.h-big{font-size:calc(58px*var(--s));line-height:1.28;letter-spacing:-.05em;margin-bottom:46px}
.h-mid{font-size:calc(40px*var(--s));line-height:1.3;margin-bottom:34px}
.heading-only .h-big:last-child{margin-bottom:0}
.desc{font-size:calc(28px*var(--s));line-height:1.7;margin:0 0 20px;opacity:.88}
.heading-only .desc{margin-top:-20px}
.cap{font-size:calc(26px*var(--s));line-height:1.65;margin-top:30px}
.cap b{font-size:1.15em}

/* 대표 */
.hero-st{padding-bottom:0!important;background:linear-gradient(var(--soft),#fff 520px)}
.hero-st.bg-white{background:linear-gradient(var(--soft),#fff 520px)}
.hero-pt{padding-top:0!important}
.hero-txt{padding-bottom:56px}
.hero-txt.top{padding:70px 0 0}
.hero-eyebrow{display:inline-block;font-size:calc(28px*var(--s));font-weight:600;color:var(--gray);border-bottom:3px solid var(--c);padding-bottom:4px;margin-bottom:22px}
.bg-theme .hero-eyebrow,.bg-dark .hero-eyebrow{color:#fff;border-color:var(--p)}
.hero-sub{font-size:calc(54px*var(--s));line-height:1.25;margin-bottom:4px}
.hero-title{font-size:calc(94px*var(--s));color:var(--c);line-height:1.13;letter-spacing:-.05em}
.bg-theme .hero-title,.bg-dark .hero-title{color:#fff}

/* 사진 위 글씨 */
.ov{position:relative}
.ov>.ph{border-radius:var(--r)}
.ov.bleed>.ph,.nopad .ov>.ph{border-radius:0}
.ov-txt{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:70px 60px;color:#fff;
  background:linear-gradient(rgba(0,0,0,0) 35%,rgba(0,0,0,.62));pointer-events:none}
.ov-txt>*{pointer-events:auto}
.ov.pos-top .ov-txt{justify-content:flex-start;background:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,0) 65%)}
.ov.pos-center .ov-txt{justify-content:center;background:rgba(0,0,0,.38)}
.ov-txt .hero-eyebrow{color:#fff;border-color:var(--p);align-self:center}
.al-left .ov-txt .hero-eyebrow{align-self:flex-start}
.ov-txt .hero-title{color:#fff}
.ov-txt b{color:var(--p)}
.ov-small{font-size:calc(28px*var(--s));font-weight:600;opacity:.9;margin-bottom:10px}
.ov-big{font-size:calc(56px*var(--s));line-height:1.25;letter-spacing:-.05em}
.ov-desc{font-size:calc(26px*var(--s));line-height:1.6;margin-top:16px;opacity:.92}
.b-photoText.full{padding-left:0;padding-right:0}
.b-photoText.full .ov.bleed{margin:0!important}

/* 배지 */
.badge{display:inline-flex;flex-direction:column;align-items:center;gap:6px;padding:22px 60px 26px;border-radius:calc(var(--r) + 4px)}
.badge.st-card{background:#fff;border:2px solid var(--c);box-shadow:0 10px 30px rgba(0,0,0,.06)}
.badge.st-fill{background:var(--c);color:#fff}
.badge.st-stamp{border:4px double var(--c);border-radius:999px;padding:26px 70px;background:#fff}
.badge-sub{font-size:calc(20px*var(--s));line-height:1.5;color:var(--gray)}
.badge.st-fill .badge-sub{color:rgba(255,255,255,.85)}
.badge-main{font-size:calc(62px*var(--s));color:var(--c);line-height:1.1;letter-spacing:-.05em}
.badge.st-fill .badge-main{color:#fff}

/* 글 */
.txt p{font-size:calc(28px*var(--s));line-height:1.75}
.txt.st-box{background:var(--soft);border-radius:var(--r);padding:40px 36px}
.bg-soft .txt.st-box{background:#fff}
.txt.st-quote{position:relative;padding:40px 30px}
.txt.st-quote:before,.txt.st-quote:after{content:'“';position:absolute;top:-10px;left:0;font-size:90px;line-height:1;color:var(--c);opacity:.35;font-family:Georgia,serif}
.txt.st-quote:after{content:'”';top:auto;left:auto;right:0;bottom:-40px}
.txt.st-quote p{font-family:var(--tf),var(--bf),sans-serif;font-size:calc(34px*var(--s));line-height:1.6}
.txt.st-big p{font-family:var(--tf),var(--bf),sans-serif;font-weight:var(--tw);font-size:calc(44px*var(--s));line-height:1.4}

/* 강조 띠 */
.bar{font-size:calc(32px*var(--s));line-height:1.45}
.bar.st-fill{background:var(--c);color:#fff;padding:22px 30px;border-radius:calc(var(--r)*.7)}
.bar.st-line{border:3px solid var(--c);color:var(--c);padding:20px 30px;border-radius:calc(var(--r)*.7)}
.bar.st-marker span{background:linear-gradient(transparent 55%,color-mix(in srgb,var(--p) 85%,transparent) 55%);padding:0 6px}
.bar.st-ribbon{position:relative;background:var(--c);color:#fff;padding:22px 30px;margin:0 20px}
.bar.st-ribbon:before,.bar.st-ribbon:after{content:'';position:absolute;top:0;bottom:0;width:24px;background:inherit;clip-path:polygon(0 0,100% 0,60% 50%,100% 100%,0 100%)}
.bar.st-ribbon:before{left:-22px}
.bar.st-ribbon:after{right:-22px;transform:scaleX(-1)}
.bg-theme .bar.st-fill,.bg-theme .bar.st-ribbon{background:#fff;color:var(--c)}
.bg-dark .bar.st-marker span{color:#fff}

/* 사진 여러 장 */
.grid{display:grid;gap:16px}
.grid .ph+.ph{margin-top:0}
.b-photos .h-mid{margin-bottom:30px}

/* 고민 */
.qmark{font-size:calc(120px*var(--s));font-weight:200;opacity:.4;line-height:1;margin-bottom:26px}
.worry-text{font-size:calc(44px*var(--s));line-height:1.5}
.worry-ans{display:inline-block;margin-top:44px;font-size:calc(30px*var(--s));font-weight:700;background:#fff;color:var(--c);padding:16px 36px;border-radius:999px}
.bg-white .worry-ans,.bg-soft .worry-ans,.bg-themeSoft .worry-ans{background:var(--c);color:#fff}

/* 확인 */
.card{background:#fff;color:var(--ink);border-radius:calc(var(--r) + 10px);padding:76px 50px;box-shadow:0 10px 30px rgba(0,0,0,.05)}
.bg-white .card{border:2px solid var(--line);box-shadow:none}
.card .mut{color:var(--gray)}
.card b{color:var(--c)}
.ex{width:84px;height:84px;margin:0 auto 24px;border-radius:50%;background:var(--c);color:#fff;font-size:52px;font-weight:900;line-height:84px;text-align:center}
.al-left .ex{margin-left:0}
.check-small{font-size:calc(32px*var(--s));font-weight:800;color:var(--c);margin-bottom:14px}
.card .h-big{margin-bottom:34px}
.check-strong{margin-top:30px;font-size:calc(27px*var(--s));font-weight:800;line-height:1.6;background:color-mix(in srgb,var(--c) 9%,#fff);border-radius:calc(var(--r)*.7);padding:22px 20px}

/* 포인트 */
.pts{display:grid;gap:20px}
.pt{position:relative}
.pts.st-card .pt{background:#fff;border-radius:var(--r);padding:36px 24px;box-shadow:0 8px 24px rgba(0,0,0,.06);color:var(--ink)}
.bg-white .pts.st-card .pt{background:var(--soft);box-shadow:none}
.pts.st-card .pt .mut{color:var(--gray)}
.pt-img{margin:-36px -24px 24px;border-radius:var(--r) var(--r) 0 0!important}
.pts.st-circle .pt-img,.pts.st-line .pt-img{margin:0 0 20px}
.pt-n{display:inline-block;font-size:calc(18px*var(--s));font-weight:800;color:var(--c);letter-spacing:.04em;margin-bottom:12px}
.pts.st-circle .pt-n{width:74px;height:74px;line-height:74px;border-radius:50%;background:var(--c);color:#fff;font-size:calc(26px*var(--s));letter-spacing:0;text-align:center}
.bg-theme .pts.st-circle .pt-n{background:#fff;color:var(--c)}
.pt-t{font-size:calc(32px*var(--s));line-height:1.3;margin-bottom:10px}
.pt-d{font-size:calc(22px*var(--s));line-height:1.55}
.pts.st-line{gap:0}
.pts.st-line .pt{padding:30px 0;border-bottom:2px solid var(--line)}
.pts.st-line .pt:first-child{border-top:3px solid var(--c)}
.bg-dark .pts.st-line .pt,.bg-theme .pts.st-line .pt{border-color:rgba(255,255,255,.2)}
.pts .ph+.ph{margin-top:0}

/* 비교표 */
.cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:calc(25px*var(--s));overflow:hidden;border-radius:var(--r);background:#fff;color:var(--ink)}
.cmp th,.cmp td{padding:24px 18px;border-bottom:1px solid var(--line);text-align:center;line-height:1.45}
.cmp thead th{font-size:calc(27px*var(--s));font-weight:800;border-bottom:0}
.cmp thead th:first-child{background:#fff}
.cmp thead .ca{background:var(--c);color:#fff}
.cmp thead .cb{background:#e9ebef;color:#5d6470}
.cmp tbody th{background:#f7f8fa;font-weight:700;width:24%;color:#40454e}
.cmp tbody .ca{font-weight:800;color:var(--c);background:color-mix(in srgb,var(--c) 7%,#fff)}
.cmp tbody .cb{color:#80858f}
.cmp tr:last-child>*{border-bottom:0}
.bg-white .cmp{border:1px solid var(--line)}

/* 후기 */
.rvs{display:grid;gap:20px}
.rv{background:#fff;color:var(--ink);border-radius:var(--r);padding:34px 36px;text-align:left;box-shadow:0 8px 24px rgba(0,0,0,.05)}
.bg-white .rv{background:var(--soft);box-shadow:none}
.stars{color:#FFB400;font-size:26px;letter-spacing:2px;margin-bottom:12px}
.rv-t{font-size:calc(26px*var(--s));line-height:1.65}
.rv-w{font-size:calc(20px*var(--s));margin-top:12px;color:var(--gray)!important}

/* 즐기는 법 */
.rcs{display:flex;flex-direction:column;gap:44px;text-align:left}
.rc{display:flex;align-items:center;gap:44px}
.rc.rev{flex-direction:row-reverse;text-align:right}
.rc-img{flex:0 0 400px;margin:0!important}
.rc-txt{flex:1;min-width:0}
.rc-n{display:block;font-size:calc(24px*var(--s));font-weight:800;color:#b5bac3;margin-bottom:8px}
.rc-sub{font-size:calc(24px*var(--s));line-height:1.5;margin-bottom:6px}
.rc-t{font-size:calc(40px*var(--s));color:var(--c);line-height:1.3}
.bg-theme .rc-t,.bg-dark .rc-t{color:#fff}
.rcs.ly-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 20px}
.rcs.ly-grid .rc,.rcs.ly-stack .rc{flex-direction:column;align-items:stretch;gap:18px;text-align:center}
.rcs.ly-grid .rc-img,.rcs.ly-stack .rc-img{flex:none}
.rcs.ly-grid .rc-t{font-size:calc(32px*var(--s))}
.al-left .rcs.ly-grid .rc,.al-left .rcs.ly-stack .rc{text-align:left}

/* 과정 */
.steps{display:flex;flex-direction:column;align-items:stretch}
.st{background:#fff;color:var(--ink);border-radius:var(--r);padding:34px 36px;box-shadow:0 8px 24px rgba(0,0,0,.05)}
.bg-white .st{background:var(--soft);box-shadow:none}
.st .mut{color:var(--gray)}
.st-n{display:inline-block;font-size:calc(20px*var(--s));font-weight:800;color:#fff;background:var(--c);border-radius:999px;padding:6px 18px;margin-bottom:16px}
.st-img{margin-bottom:20px}
.st-t{font-size:calc(34px*var(--s));line-height:1.3;margin-bottom:8px}
.st-d{font-size:calc(24px*var(--s));line-height:1.55}
.st-arrow{color:var(--c);font-size:28px;text-align:center;padding:12px 0;opacity:.6}

/* 정보 */
.info{width:100%;border-collapse:collapse;border-top:3px solid currentColor;text-align:left;font-size:calc(25px*var(--s))}
.info th{width:220px;font-weight:700;padding:22px 24px;border-bottom:1px solid var(--line);vertical-align:top;background:rgba(0,0,0,.035)}
.info td{padding:22px 24px;border-bottom:1px solid var(--line);line-height:1.6}
.bg-dark .info th,.bg-theme .info th{background:rgba(255,255,255,.08)}
.bg-dark .info th,.bg-dark .info td,.bg-theme .info th,.bg-theme .info td{border-color:rgba(255,255,255,.2)}

/* 질문 */
.qna-label{font-size:calc(30px*var(--s));color:var(--c);margin-bottom:6px}
.bg-theme .qna-label,.bg-dark .qna-label{color:var(--p)}
.qa{text-align:left;margin-bottom:32px}
.qa:last-child{margin-bottom:0}
.q{background:var(--c);color:#fff;font-size:calc(27px*var(--s));font-weight:700;padding:20px 28px;border-radius:calc(var(--r)*.7);line-height:1.45}
.q b{color:#fff}
.bg-theme .q{background:#fff;color:var(--c)}
.bg-theme .q b{color:var(--c)}
.a{font-size:calc(25px*var(--s));line-height:1.7;padding:18px 28px 0 70px;text-indent:-42px}
.a>b{display:inline-block;width:42px;text-indent:0}
.a>span{text-indent:0}

/* 안내 */
.notice{list-style:none;text-align:left;background:#fff;color:#4a505a;border-radius:var(--r);padding:34px 40px}
.bg-white .notice{background:var(--soft)}
.notice li{position:relative;font-size:calc(23px*var(--s));line-height:1.7;padding-left:22px;margin:6px 0}
.notice li:before{content:'';position:absolute;left:0;top:.72em;width:8px;height:8px;border-radius:50%;background:var(--c)}

/* 여백 */
.sp.ln-yes{background:linear-gradient(var(--line),var(--line)) center/100% 2px no-repeat}
.sp.ln-dot{background:radial-gradient(circle,#c3c8d0 2px,transparent 2.5px) center/16px 6px repeat-x}
