:root{--navy:#17284f;--blue:#3159a6;--teal:#1aa39b;--ink:#263247;--muted:#66748a;--line:#e3e9f1;--bg:#f4f7fb;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,"Malgun Gothic","Apple SD Gothic Neo",sans-serif;line-height:1.8}
a{color:inherit;text-decoration:none}a:hover{color:var(--teal)}img{max-width:100%;display:block}.wrap{width:min(1100px,calc(100% - 36px));margin:auto}
.top{background:#101b37;color:#dce6fa;font-size:12px}.top .wrap{padding:7px 0;display:flex;justify-content:space-between;gap:10px}
header{background:#fff;border-bottom:1px solid var(--line)}header .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 0}
.brand{display:flex;align-items:center;gap:12px;color:var(--navy);font-weight:800;font-size:20px;line-height:1.25}.brandmark{width:42px;height:42px;display:grid;place-items:center;color:#fff;border-radius:13px;background:linear-gradient(135deg,var(--blue),var(--teal));font-size:22px}.brand small{display:block;font-size:10px;letter-spacing:1px;color:var(--muted);font-weight:600;margin-top:4px}
.search{border:1px solid var(--line);border-radius:22px;padding:9px 15px;color:#7a8798;font-size:12px;min-width:250px}
nav{background:var(--navy);color:#fff}nav .wrap{display:flex;gap:27px;overflow-x:auto;white-space:nowrap;padding:12px 0;font-size:13px}
main{padding:26px 0 54px}.crumb{font-size:12px;color:var(--muted);margin:0 0 18px}.hero{border-radius:20px;background:linear-gradient(115deg,rgba(18,37,79,.97),rgba(43,88,150,.91));color:white;padding:34px;display:grid;grid-template-columns:1.4fr .6fr;gap:25px;align-items:center}.eyebrow{color:#a8eee5;font-size:11px;font-weight:800;letter-spacing:1.5px}.hero h1{font-size:clamp(27px,4vw,42px);line-height:1.32;letter-spacing:-1px;margin:9px 0 14px}.hero p{margin:0;color:#e2eafa;font-size:14px}.hero-art{min-height:150px;border:1px solid #ffffff40;border-radius:18px;background:#ffffff12;display:grid;place-items:center;font-size:54px}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}.chip{border:1px solid #ffffff55;border-radius:20px;padding:4px 10px;font-size:11px}
.sectionhead{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:32px 0 15px}h2{color:var(--navy);font-size:23px;line-height:1.4;margin:0 0 8px;letter-spacing:-.5px}.sectionhead p{font-size:13px;color:var(--muted);margin:0}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px;align-items:start}.articles{display:grid;gap:14px}.article{background:#fff;border:1px solid var(--line);border-radius:15px;padding:18px;display:grid;grid-template-columns:minmax(0,1fr) 145px;gap:18px;align-items:center;box-shadow:0 4px 16px #17284f08}.tag{display:inline-block;background:#e7f7f5;color:#137e79;border-radius:5px;padding:3px 8px;font-size:10px;font-weight:800}.article h3{font-size:18px;line-height:1.45;margin:8px 0;color:#1b376d}.article p{font-size:13px;color:var(--muted);margin:0}.meta{font-size:11px;color:#8b96a6;margin-top:9px}.thumb{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;background:#eaf0f8}
aside{display:grid;gap:14px}.sidebox,.panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px}.sidebox h3{margin:0 0 10px;font-size:16px;color:var(--navy)}.sidebox ul{margin:0;padding-left:18px;font-size:13px;color:#56647a}.sidebox li+li{margin-top:7px}.notice{background:#eef6ff;border-left:3px solid var(--blue);border-radius:7px;padding:12px;font-size:12px;color:#465875}
.panel{margin-top:20px;padding:24px}.panel h2{font-size:21px}.panel h3{font-size:17px;color:#233e72;margin:20px 0 6px}.panel p,.panel li{font-size:14px;color:#536176}.panel p{margin:0 0 13px}.panel ul{padding-left:21px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.step{border:1px solid var(--line);border-radius:11px;background:#f7f9fc;padding:14px}.step b{display:block;color:var(--blue);margin-bottom:4px}.step span{font-size:12px;color:var(--muted)}.feature-img{width:100%;max-height:380px;object-fit:cover;border-radius:12px;margin:14px 0}.callout{background:#f0f8f7;border:1px solid #d7efec;padding:15px;border-radius:10px;margin:15px 0;color:#365d5b;font-size:13px}
footer{background:#101b37;color:#cbd6e9}footer .wrap{padding:26px 0;display:flex;justify-content:space-between;gap:20px;font-size:12px}footer strong{color:#fff}
@media(max-width:760px){header .wrap{align-items:flex-start;flex-direction:column;gap:12px}.search{width:100%;min-width:0}.hero{grid-template-columns:1fr;padding:24px}.hero-art{min-height:80px;font-size:38px}.layout{grid-template-columns:1fr}.article{grid-template-columns:minmax(0,1fr) 100px;padding:14px;gap:12px}.article h3{font-size:16px}.steps{grid-template-columns:1fr}.sectionhead{align-items:flex-start;flex-direction:column}footer .wrap{flex-direction:column}}