:root{--ink:#101116;--cobalt:#3448FF;--lime:#D8FF36;--paper:#F6F5F0;--white:#fff;--grey:#858995;--grey-d:#5a5e6b;--text:#2a2c35;--line:#dcdbd3;--wrap:1240px;--hd:72px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Pretendard Variable",Pretendard,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",sans-serif;font-size:16px;line-height:1.75;color:var(--text);background:var(--white);word-break:keep-all;overflow-wrap:break-word;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure,address,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
address{font-style:normal}
mark{background:none;color:var(--lime)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--lime);color:var(--ink);padding:10px 16px;z-index:100}.skip:focus{left:0}
:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
.sec-paper :focus-visible,.sec-white :focus-visible,.intro+article :focus-visible{outline-color:var(--cobalt)}
.wrap{width:min(100% - 48px,var(--wrap));margin-inline:auto}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:2px;font-size:16px;font-weight:800;text-decoration:none;border:2px solid transparent;cursor:pointer;font-family:inherit;line-height:1.2;transition:background .15s,color .15s,border-color .15s;text-align:center}
.btn-lime{background:var(--lime);color:var(--ink)}.btn-lime:hover{background:#fff}
.btn-cobalt{background:var(--cobalt);color:#fff}.btn-cobalt:hover{background:var(--ink)}
.btn-line{background:transparent;color:var(--ink);border-color:var(--ink)}.btn-line:hover{background:var(--ink);color:#fff}
.btn-lg{min-height:64px;padding:0 44px;font-size:18px}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.more{display:inline-block;margin-top:14px;font-size:16px;font-weight:800;text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:1px}

/* header */
.hd{position:sticky;top:0;z-index:50;background:var(--ink);color:#fff;height:var(--hd)}
.hd-in{height:100%;display:flex;align-items:center;gap:32px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;font-size:18px;color:inherit;letter-spacing:-.02em;flex:none}
.logo img{border-radius:8px}
.gnav{flex:1;display:flex;justify-content:center}
.gnav ul{display:flex;gap:4px}
.gnav a{display:block;padding:8px 14px;text-decoration:none;font-size:16px;font-weight:600;color:#d7d9e0;white-space:nowrap;border-bottom:2px solid transparent}
.gnav a:hover{color:#fff}
.gnav a.on{color:#fff;border-bottom-color:var(--lime)}
.hd-cta{flex:none;min-height:44px}
.gnav .hd-cta-m,.burger{display:none}

/* hero */
.hero{background:var(--ink);color:#fff;position:relative;padding:88px 0 0;z-index:2}
.hero-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero-bg svg{width:100%;height:100%}
.hero-in{display:grid;grid-template-columns:65fr 35fr;gap:56px;align-items:start;position:relative}
.hero-text{padding-bottom:112px}
.label{font-size:14px;font-weight:700;letter-spacing:.04em;color:var(--lime);margin-bottom:28px}
.hero h1{font-size:clamp(2.25rem,4.2vw,4rem);line-height:1.1;font-weight:800;letter-spacing:-.04em;color:#e9eaf0;margin-bottom:26px}
.hook{font-size:clamp(2.5rem,5.6vw,5.25rem);line-height:1.12;font-weight:900;letter-spacing:-.045em;color:#fff;margin-bottom:34px;text-wrap:balance}
.hook .ln{display:block}
.hero-p{font-size:18px;color:#c9ccd6;margin-bottom:34px}
.notice{margin-top:34px;font-size:14px;color:#a3a7b4;border-left:3px solid var(--cobalt);padding-left:14px;max-width:560px;line-height:1.65}
.notice strong{color:#fff}
.hero-vis{position:relative;z-index:3;margin-bottom:-120px;will-change:transform}
.hero-vis::before{content:"";position:absolute;z-index:-1;left:36px;top:-28px;bottom:48px;right:calc((min(100vw - 48px,1240px) - 100vw)/2);background:var(--cobalt)}
.hero-vis img{width:100%;aspect-ratio:5/6;object-fit:cover;object-position:50% 20%;background:#0b0c10;margin-right:0}
.hero-vis .cap{position:absolute;left:-24px;bottom:28px;background:var(--lime);color:var(--ink);padding:10px 16px;font-size:14px;font-weight:700;line-height:1.4}
.hero-vis .cap strong{display:block;font-size:18px;font-weight:900}
.band{background:var(--cobalt);color:#fff;position:relative;z-index:1}
.band-in{display:flex;gap:0;padding-right:calc(35% + 56px)}
.band-in li{flex:1;padding:26px 0;font-size:18px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:20px}
.band-in li+li::before{content:"/";color:var(--lime);font-weight:400}
.band-in li:last-child{flex:none}

@media (prefers-reduced-motion:no-preference){
  .hero h1,.label,.hero-p,.hero-cta,.notice{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
  .hook .ln:nth-child(1){animation:rise .8s .12s cubic-bezier(.2,.7,.2,1) both}
  .hook .ln:nth-child(2){animation:rise .8s .26s cubic-bezier(.2,.7,.2,1) both}
  .hero-p{animation-delay:.4s}.hero-cta{animation-delay:.5s}.notice{animation-delay:.6s}
  @keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
  html.js .rv{opacity:0;transform:translateY(34px);transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1)}
  html.js .rv.in{opacity:1;transform:none}
}

/* sections */
.sec{padding:112px 0}
.sec-paper{background:var(--paper)}.sec-white{background:#fff}.sec-cobalt{background:var(--cobalt);color:#fff}.sec-ink{background:var(--ink);color:#fff}
h2{font-size:18px;line-height:1.5;font-weight:800;color:var(--ink)}
.lab{display:inline-block;padding-top:16px;position:relative;margin-bottom:28px;max-width:760px}
.lab::before,.prose h2::before{content:"";position:absolute;left:0;top:0;width:36px;height:4px;background:var(--cobalt)}
.sec-cobalt h2,.sec-ink h2{color:#fff}
.xl{font-size:clamp(2.25rem,4.6vw,4.25rem);line-height:1.12;font-weight:900;letter-spacing:-.045em;text-wrap:balance}
.mega{font-size:clamp(2.5rem,8.4vw,8rem);line-height:1.06;font-weight:900;letter-spacing:-.05em;text-wrap:balance}
h3{font-size:18px;line-height:1.5;font-weight:800;color:var(--ink)}
.small{font-size:14px;color:var(--grey-d);line-height:1.65}
.role{font-size:14px;font-weight:800;color:var(--cobalt);letter-spacing:.02em;margin-bottom:4px}

/* question */
.sec-q{padding-top:176px;padding-bottom:104px}
.sec-q .mega{color:var(--ink);margin:6px 0 64px}
.qrows{border-top:2px solid var(--ink)}
.qrows a{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:34px 20px;border-bottom:1px solid var(--ink);text-decoration:none;font-size:clamp(1.25rem,2.4vw,1.875rem);font-weight:800;letter-spacing:-.025em;color:var(--ink);transition:background .2s,color .2s}
.qrows a:hover,.qrows a:focus-visible{background:var(--cobalt);color:#fff;outline-offset:-3px;outline-color:var(--lime)}
.arw{flex:none;transition:transform .2s}
.qrows a:hover .arw{transform:translateX(8px)}

/* info (cobalt) */
.info{display:grid;grid-template-columns:5fr 6fr;gap:80px;align-items:start}
.info-l{position:sticky;top:calc(var(--hd) + 32px)}
.info-l .xl{margin-bottom:28px}
.info-l>p{color:#e4e7ff;margin-bottom:28px;max-width:520px}
.info-l a{color:#fff}
.info-r{display:grid;gap:24px}
.panel{padding:36px 38px 38px;max-width:560px}
.panel h3{font-size:18px;margin-bottom:12px}
.panel p{font-size:16px;margin-bottom:6px}
.p1{background:#fff;color:var(--text)}
.p2{background:var(--ink);color:#d7d9e0;margin-left:64px}.p2 h3{color:#fff}.p2 .more{color:var(--lime)}
.p3{background:var(--paper);color:var(--text);margin-left:128px}
.p1 .more,.p3 .more{color:var(--cobalt)}
.tbl-dark{border-top-color:#fff!important;color:#fff;font-size:15px}
.tbl-dark th,.tbl-dark td{border-bottom-color:rgba(255,255,255,.3)!important;background:none!important;color:#fff!important}
.tbl-dark th{width:120px;font-weight:700;opacity:.85}

/* plan */
.plan{display:grid;grid-template-columns:5fr 6fr;gap:80px;align-items:start}
.plan-l .xl{margin-bottom:26px}
.plan-l p{margin-bottom:10px;max-width:480px}
.plan-l .more{color:var(--cobalt)}
.plan-r{border-top:2px solid var(--ink)}
.plan-r li{display:grid;grid-template-columns:104px 1fr;gap:16px;padding:30px 0;border-bottom:1px solid var(--line);align-items:start}
.no{font-size:64px;line-height:1;font-weight:900;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px #b9bcc8}
.plan-r h3{margin-bottom:6px}.plan-r p{font-size:16px}

/* statement */
.sec-statement{min-height:78vh;display:flex;align-items:center;padding:120px 0}
.sec-statement .wrap{width:min(100% - 48px,1240px)}
.sec-statement .mega{font-size:clamp(2.5rem,7.2vw,6.5rem);margin-bottom:56px}
.rule{border:0;border-top:1px solid rgba(255,255,255,.35);margin:0}

/* experts */
.ceo{display:grid;grid-template-columns:5fr 6fr;gap:72px;align-items:end;margin-bottom:96px}
.ceo img{width:100%;aspect-ratio:5/6;object-fit:cover;object-position:50% 20%;background:var(--ink)}
.name{font-size:clamp(3rem,7vw,6rem);line-height:1;font-weight:900;letter-spacing:-.05em;color:var(--ink);margin:6px 0 24px}
.name.sm{font-size:clamp(2.25rem,4vw,3.25rem);margin:0}
.ceo p{max-width:520px}
.ceo .small{margin:10px 0 28px}
.role.sub{margin-top:8px}
.links{display:grid;gap:8px;margin-top:6px}
.links a{font-size:16px;font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:var(--cobalt);text-decoration-thickness:2px;text-underline-offset:4px}
.links a:hover{color:var(--cobalt)}
.mates{border-top:2px solid var(--ink)}
.mate{display:grid;grid-template-columns:200px 1fr 1fr;gap:40px;align-items:center;padding:28px 0;border-bottom:1px solid var(--line)}
.mate img{width:200px;height:200px;object-fit:cover;background:var(--ink)}
.tv-news{margin-top:56px;padding:32px 36px;background:#fff;border-left:4px solid var(--cobalt)}
.tv-news .small{margin-top:14px}

/* faq */
.faqsec{display:grid;grid-template-columns:4fr 7fr;gap:80px;align-items:start}
.faq-l{position:sticky;top:calc(var(--hd) + 32px)}
.faq-l .xl{margin-bottom:22px}
.faq{border-top:2px solid var(--ink)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item[hidden]{display:none}
.faq-item summary{list-style:none;cursor:pointer;padding:24px 56px 24px 0;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary h3{font-size:18px}
.faq-item summary::before,.faq-item summary::after{content:"";position:absolute;right:8px;top:50%;width:18px;height:2px;background:var(--ink);transition:transform .2s}
.faq-item summary::after{transform:rotate(90deg)}
.faq-item[open] summary::after{transform:rotate(0)}
.faq-item[open] summary h3{color:var(--cobalt)}
.faq-item p{padding:0 56px 26px 0;font-size:16px}
.faq-more{margin-top:28px}.faq-more[hidden]{display:none}

/* final cta */
.cta-final{min-height:76vh;display:flex;align-items:center;text-align:center;padding:120px 0}
.cta-in{display:grid;justify-items:center;gap:36px}
.cta-final .mega{color:#fff;font-size:clamp(2.5rem,7.6vw,7rem)}
.cta-p{font-size:18px;color:#e4e7ff}

/* sub pages */
.intro{background:var(--ink);color:#fff;padding:72px 0 64px}
.intro .wrap{max-width:900px}
.crumb{display:flex;gap:8px;font-size:14px;color:#a3a7b4;margin-bottom:22px}
.crumb a{text-decoration:none;color:var(--lime);font-weight:700}
.intro h1{font-size:clamp(2.25rem,4.6vw,3.75rem);line-height:1.12;font-weight:900;letter-spacing:-.045em;color:#fff;margin-bottom:22px}
.intro .lead{font-size:18px;max-width:820px;color:#d0d3dd}
.intro .btn{margin-top:22px}
.prose{max-width:900px}
.prose section{margin-bottom:64px}.prose section:last-child{margin-bottom:0}
.prose h2{position:relative;padding-top:16px;margin-bottom:18px;font-size:20px}
.prose p{margin-bottom:14px}.prose .small{margin-top:12px}.prose .btns{margin-top:24px}
.sec .prose{margin-inline:auto}
.tbl{width:100%;border-collapse:collapse;font-size:16px;border-top:2px solid var(--ink)}
.tbl th,.tbl td{padding:14px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;line-height:1.6}
.tbl tbody th{width:180px;background:var(--paper);color:var(--ink);font-weight:800;white-space:nowrap}
.tbl thead th{background:var(--paper);color:var(--ink);font-weight:800}
.tbl-3 tbody th{white-space:normal;width:150px}.tbl-2 td{width:50%}
.list{display:grid;gap:10px;margin-bottom:14px}
ul.list li{padding-left:20px;position:relative}
ul.list li::before{content:"";position:absolute;left:0;top:.8em;width:8px;height:8px;background:var(--cobalt)}
ol.list{counter-reset:o}
ol.list li{counter-increment:o;padding-left:44px;position:relative}
ol.list li::before{content:counter(o);position:absolute;left:0;top:1px;width:28px;height:28px;background:var(--ink);color:var(--lime);font-weight:800;font-size:14px;display:grid;place-content:center}
.wide{margin-bottom:18px;background:var(--ink)}
.wide figcaption{background:var(--paper);padding:10px 16px;font-size:14px;color:var(--grey-d)}
.gal{display:grid;gap:14px}
.gal-4{grid-template-columns:repeat(4,1fr)}
.gal figure{aspect-ratio:3/4;background:var(--paper);overflow:hidden}
.gal img{width:100%;height:100%;object-fit:cover}
.contact{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.contact-c{border:2px solid var(--ink);padding:26px;background:var(--paper);display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.contact-c .k{font-size:14px;color:var(--grey-d);font-weight:800;margin:0}
.contact-c .v{font-size:20px;font-weight:900;color:var(--ink);margin:0 0 10px}
.contact-c .btns{margin-top:auto}
.check{display:grid;gap:10px}
.check label{display:flex;gap:14px;align-items:flex-start;padding:18px 20px;border:1.5px solid var(--ink);background:#fff;cursor:pointer;font-weight:700;color:var(--ink);transition:background .15s}
.check label:hover{background:var(--paper)}
.check input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:1px 0 0;border:2px solid var(--ink);background:#fff;display:grid;place-content:center;cursor:pointer}
.check input::after{content:"";width:12px;height:7px;border-left:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:rotate(-45deg) translate(1px,-1px) scale(0);transition:transform .15s}
.check input:checked{background:var(--lime)}
.check input:checked::after{transform:rotate(-45deg) translate(1px,-1px) scale(1)}
.check label:has(input:checked){background:var(--paper)}
.check-detail span{display:block}.check-detail em{display:block;font-style:normal;font-weight:400;color:var(--text);font-size:15px;margin-top:4px}
.check-count{margin-top:16px;font-size:15px;font-weight:800;color:var(--cobalt)}
.prose .faq{margin-top:4px}

/* footer */
.ft{background:var(--ink);color:#c9ccd6;padding:64px 0 28px;font-size:15px}
.ft-in{display:flex;justify-content:space-between;gap:48px;align-items:flex-start;padding-bottom:36px}
.ft .logo{color:#fff}
.ft-info address{margin-top:18px;display:grid;gap:4px}
.ft a{text-decoration:none}.ft-info address a{color:#fff}.ft-info address a:hover{text-decoration:underline}
.ft-nav ul{display:grid;grid-template-columns:repeat(2,auto);gap:10px 56px}
.ft-nav a{font-weight:700;color:#fff}.ft-nav a:hover{color:var(--lime)}
.ft-bot{border-top:1px solid rgba(255,255,255,.18);padding-top:22px;display:grid;gap:12px}
.ft-note{font-size:14px;color:#a3a7b4;line-height:1.65;max-width:900px}.ft-note a{text-decoration:underline}
.ft-copy{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:14px;color:#a3a7b4}
.ft-copy a{color:#fff;font-weight:700}

/* tablet */
@media (max-width:1100px){
  .gnav a{padding:8px 9px;font-size:15px}.hd-in{gap:14px}
  .info,.plan{gap:48px}.faqsec{gap:48px}
  .p2{margin-left:32px}.p3{margin-left:64px}
  .mate{grid-template-columns:160px 1fr 1fr;gap:24px}.mate img{width:160px;height:160px}
}
@media (max-width:960px){
  :root{--hd:64px}
  .gnav{position:fixed;left:0;right:0;top:var(--hd);background:var(--ink);border-top:1px solid rgba(255,255,255,.14);flex-direction:column;justify-content:flex-start;padding:8px 24px 28px;max-height:calc(100dvh - var(--hd));overflow:auto;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s,transform .2s,visibility .2s}
  .gnav.open{opacity:1;visibility:visible;transform:none}
  .gnav ul{flex-direction:column;gap:0}
  .gnav a{padding:18px 4px;border-bottom:1px solid rgba(255,255,255,.14);font-size:18px;color:#fff}
  .gnav a.on{border-bottom-color:var(--lime)}
  .hd-cta{display:none}
  .gnav .hd-cta-m{display:inline-flex;margin-top:22px;width:100%;color:var(--ink);padding:0 28px;font-size:16px;border-bottom:2px solid transparent}
  .burger{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:48px;height:48px;margin-left:auto;background:none;border:0;cursor:pointer}
  .burger span{display:block;width:24px;height:2px;background:#fff;transition:transform .2s,opacity .2s}
  .burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .burger[aria-expanded=true] span:nth-child(2){opacity:0}
  .burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .hero{padding-top:52px}
  .hero-in{grid-template-columns:1fr;gap:56px}
  .hero-text{padding-bottom:0}
  .hero-vis{margin:0 0 -64px;max-width:520px;width:calc(100% - 20px)}
  .hero-vis::before{left:20px;right:-20px;top:-20px;bottom:40px}
  .band-in{padding-right:0;flex-wrap:wrap;padding-top:80px}
  .band-in li{flex:1 1 50%;padding:14px 0;font-size:17px}
  .band-in li+li::before{display:none}
  .sec{padding:80px 0}
  .sec-q{padding-top:112px}
  .info,.plan,.ceo,.faqsec{grid-template-columns:1fr}
  .info-l,.faq-l{position:static}
  .p2,.p3{margin-left:0}.panel{max-width:none}
  .ceo{gap:36px}.ceo img{max-width:520px}
  .mate{grid-template-columns:120px 1fr;gap:18px 20px}
  .mate img{width:120px;height:120px}
  .mate .links{grid-column:1/-1}
  .sec-statement{min-height:60vh}
  .cta-final{min-height:60vh}
  .contact{grid-template-columns:1fr}
  .ft-in{flex-direction:column;gap:32px}
  .gal-4{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:700px){
  .wrap{width:min(100% - 40px,var(--wrap))}
  .hero{padding-top:40px}
  .label{margin-bottom:20px}
  .hero h1{margin-bottom:20px}
  .hook{margin-bottom:26px}
  .hero-p{font-size:17px}
  .hero-vis{width:calc(100% - 16px)}
  .hero-vis .cap{left:-12px}
  .qrows a{padding:26px 8px}.sec-q .mega{margin-bottom:40px}
  .panel{padding:28px 24px}
  .plan-r li{grid-template-columns:72px 1fr}.no{font-size:44px}
  .sec-statement{min-height:0;padding:88px 0}
  .tbl,.tbl tbody,.tbl tr,.tbl th,.tbl td{display:block;width:100%}
  .tbl thead{display:none}
  .tbl tr{border-bottom:1px solid var(--line);padding:10px 0}
  .tbl th,.tbl td{border:0!important;padding:4px 12px}
  .tbl tbody th{width:100%;background:none;padding-bottom:0;color:var(--cobalt);font-size:14px;white-space:normal}
  .tbl-dark th{color:var(--lime)!important}
  .tbl-2 td:first-child::before{content:"안내하는 내용";color:var(--cobalt);font-weight:800;font-size:14px;display:block}
  .tbl-2 td:last-child::before{content:"하지 않는 일";color:var(--grey-d);font-weight:800;font-size:14px;display:block}
  .tbl-3 tbody td:nth-child(3){color:var(--grey-d);font-size:14px}
  .faq-item summary{padding-right:44px}.faq-item p{padding-right:6px}
  .btns .btn{flex:1 1 auto}
  .intro{padding:48px 0 44px}
  .tv-news{padding:24px 22px}
  .ft{padding-top:44px}.ft-nav ul{gap:10px 32px}.ft-copy{flex-direction:column}
  .cta-final{padding:88px 0;min-height:0}
}
@media (max-width:420px){.btn{padding:0 20px}.mate{grid-template-columns:96px 1fr}.mate img{width:96px;height:96px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media (min-width:961px){
  .hero-vis{align-self:end}
  .hero-vis::before{top:-150px;bottom:56px}
  .band-in{justify-content:flex-start;gap:0}
  .band-in li{flex:none;padding-right:36px}.band-in li+li::before{margin-right:0}
}
@media (max-width:960px){.band-in li:last-child{flex:1 1 50%}.hero-vis .cap{left:0}}