:root { --ink:#132238; --muted:#647185; --line:#dce3ea; --paper:#f6f8fa; --blue:#176eea; --navy:#132a55; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Noto Sans KR", system-ui, sans-serif; line-height:1.65; }
.header, main, footer { max-width:1120px; margin:auto; }
.header { height:82px; display:flex; align-items:center; justify-content:space-between; padding:0 28px; }
.brand { color:var(--ink); font-size:1.4rem; font-weight:700; letter-spacing:-.06em; text-decoration:none; }.brand span { color:var(--blue); }
nav { display:flex; gap:26px; } nav a { color:var(--muted); font-size:.92rem; text-decoration:none; } nav a:hover { color:var(--blue); }
.intro { padding:96px 28px 70px; max-width:820px; }.eyebrow,.card-label { color:var(--blue); font-size:.74rem; font-weight:700; letter-spacing:.1em; margin:0 0 12px; }
h1,h2 { letter-spacing:-.055em; line-height:1.18; margin:0; } h1 { font-size:clamp(2.6rem,6vw,5rem); } h2 { font-size:clamp(1.7rem,3vw,2.45rem); }.lead { color:var(--muted); font-size:1.1rem; margin:25px 0 28px; }
.notice { border-left:3px solid var(--blue); background:#eaf2ff; font-size:.88rem; padding:16px 18px; }.notice strong { color:var(--blue); }
.guides { display:grid; grid-template-columns:1fr 1fr; }.guide-card { background:#fff; min-height:450px; padding:54px; }.guide-card.accent { background:var(--navy); color:#fff; }.accent .card-label { color:#a6c9ff; }.icon { border:1px solid currentColor; border-radius:50%; display:grid; height:43px; margin-bottom:32px; place-items:center; width:43px; font-size:1.45rem; }.guide-card h2 { font-size:2rem; }.guide-card ol { color:var(--muted); font-size:.94rem; margin:27px 0 34px; padding-left:20px; }.guide-card li { margin:9px 0; }.accent ol { color:#d6e1f4; }
.button { display:inline-flex; align-items:center; gap:13px; border-radius:3px; background:var(--blue); color:#fff; font-size:.88rem; font-weight:600; padding:12px 17px; text-decoration:none; }.button:hover { background:#095bc9; }.button span { font-size:1.1rem; }.button.light { background:#fff; color:var(--navy); }
.check { background:#fff; display:grid; gap:60px; grid-template-columns:.78fr 1.22fr; padding:80px 54px; }.check ul { list-style:none; margin:0; padding:0; }.check li { border-top:1px solid var(--line); display:grid; gap:18px; grid-template-columns:42px 1fr; padding:18px 0; }.check li:last-child { border-bottom:1px solid var(--line); }.check span { color:var(--blue); font-size:.8rem; font-weight:700; }.check p { color:var(--muted); font-size:.94rem; margin:0; }
.support { padding:96px 28px; text-align:center; }.support p:not(.eyebrow) { color:var(--muted); margin:18px auto 28px; max-width:560px; }
footer { border-top:1px solid var(--line); display:flex; gap:22px; justify-content:space-between; padding:32px 28px 45px; }footer p { color:var(--muted); font-size:.76rem; margin:0; }
@media (max-width:720px) { .header { height:68px; padding:0 20px; } nav { gap:15px; } nav a { font-size:.8rem; }.intro { padding:66px 20px 52px; }.guides,.check { grid-template-columns:1fr; }.guide-card { min-height:auto; padding:40px 28px; }.check { gap:34px; padding:55px 28px; }.support { padding:70px 20px; } footer { align-items:flex-start; flex-direction:column; gap:8px; padding:28px 20px; } }