@layer design, page;
@layer page {

:root{--navy:#071f55;--navy2:#102b60;--blue:#2d6df6;--teal:#0b919b;--ink:#2b3647;--muted:#607084;--line:#dfe7f0;--soft:#f4f7fb;--white:#fff}
    *{box-sizing:border-box;border-radius:0}
    html{scroll-behavior:smooth}
    body{margin:0;background:#f3f6fa;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Pretendard","Segoe UI",sans-serif;font-size:15px;line-height:1.72;letter-spacing:-.016em;word-break:keep-all}
    a{color:inherit;text-decoration:none} img{display:block;max-width:100%;height:auto}
    .skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:#fff;padding:10px;z-index:999}
    .header{position:sticky;top:0;z-index:100;background:#172f55;color:#fff}
    .header-inner{max-width:1180px;min-height:48px;margin:0 auto;padding:0 22px;display:flex;align-items:center;gap:20px}
    .logo{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:800;white-space:nowrap}.logo-mark{width:20px;height:20px;background:#2d6df6;display:flex;align-items:center;justify-content:center;font-size:12px}
    .nav{display:flex;align-items:center;gap:18px;flex:1}.nav a{font-size:12px;color:#fff;min-height:48px;display:flex;align-items:center}
    .actions{display:flex;align-items:center;gap:16px}.actions a{font-size:12px}.quote{background:#2d6df6;padding:7px 15px;font-weight:700}
    .page{max-width:1060px;margin:0 auto;padding:20px 18px 58px}.breadcrumb{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 12px;color:#758295;font-size:12.5px}
    .article{background:#fff;border:1px solid var(--line);box-shadow:0 10px 26px rgba(7,31,85,.08);overflow:hidden}
    .hero{padding:30px 34px 25px;background:linear-gradient(180deg,#fff 0%,#f9fcff 100%);border-bottom:1px solid #edf2f7}
    .hero-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}.pill{display:inline-flex;align-items:center;height:25px;padding:0 10px;border:1px solid #d7e4f6;background:#eef5ff;color:var(--navy);font-size:12px;font-weight:650}
    .hero-links{display:flex;gap:6px}.hero-links a{height:29px;padding:0 10px;border:1px solid #dbe4ee;background:#fff;color:#526174;font-size:12px;display:flex;align-items:center}
    h1{margin:0;color:var(--navy);font-size:28px;line-height:1.38;letter-spacing:-.04em;font-weight:720}.hero-desc{max-width:780px;margin:12px 0 0;color:#536276;font-size:14.5px}
    .body{max-width:790px;margin:0 auto;padding:34px 22px 48px}.visual{width:100%;margin:0 0 26px;border:1px solid #dfe8f2;background:#fff}.visual img{width:100%}.cover img{aspect-ratio:1/1;object-fit:cover}
    .summary{margin:0 0 26px;padding:17px;border:1px solid var(--line);background:#fbfdff}.summary-title{margin:0 0 7px;color:var(--navy);font-size:15px;font-weight:700}.summary p{margin:0}
    .toc{margin:0 0 28px;padding:15px 16px;border:1px solid var(--line)}.toc-title{margin:0 0 7px;color:var(--navy);font-size:15.5px;font-weight:700}.toc ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 20px;margin:0;padding-left:20px;color:#526174}.toc li{font-size:14px}
    .section{margin-top:34px;padding-top:25px;border-top:1px solid #e8eef5}.section:first-of-type{margin-top:0;padding-top:0;border-top:0}
    h2{margin:0 0 11px;color:var(--navy);font-size:20px;line-height:1.42;letter-spacing:-.035em}h3{margin:18px 0 7px;color:var(--navy2);font-size:16px}p{margin:0 0 12px;font-size:14.7px}strong{color:var(--navy);font-weight:700}
    .table-wrap{margin:17px 0;border:1px solid var(--line);overflow-x:auto}.info-table{width:100%;border-collapse:collapse;min-width:590px}.info-table th,.info-table td{padding:10px 11px;border-bottom:1px solid #edf2f7;text-align:left;vertical-align:top;font-size:13.2px}.info-table th{background:#f7fafc;color:var(--navy);font-weight:700}.info-table td:first-child{width:27%;color:var(--navy);font-weight:650}.info-table tr:last-child td{border-bottom:0}
    .checklist{margin:15px 0 0;padding:0;list-style:none;display:grid;gap:7px}.checklist li{position:relative;padding:10px 11px 10px 32px;border:1px solid #e3edf6;background:#fbfdff;font-size:13.8px}.checklist li:before{content:"";position:absolute;left:11px;top:14px;width:12px;height:12px;background:var(--teal)}.checklist li:after{content:"";position:absolute;left:14px;top:15px;width:4px;height:7px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
    .photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0 8px}.photo{margin:0;border:1px solid var(--line);background:#fff}.photo.wide{grid-column:1/-1}.photo img{width:100%;height:300px;object-fit:cover;background:#edf2f7}.photo.portrait img{object-fit:contain}.caption{padding:11px 12px;border-top:1px solid #e8eef5}.caption span{display:inline-flex;margin-bottom:6px;padding:2px 7px;background:#eaf8fa;color:#087e85;font-size:11px;font-weight:700}.caption strong{display:block;margin-bottom:3px;font-size:13.7px}.caption p{margin:0;color:#607084;font-size:12.8px;line-height:1.52}
    .note{margin:16px 0;padding:12px 13px;background:#f1fbfc;border:1px solid #cdeced;color:#46566a;font-size:13.5px}.points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0}.point{padding:14px;border:1px solid #e3edf6;background:#fbfdff}.point strong{display:block;margin-bottom:4px}.point p{margin:0;color:#5d6c80;font-size:12.9px}
    .faq{margin-top:14px;border-top:1px solid var(--line)}.faq-item{padding:13px 0;border-bottom:1px solid var(--line)}.faq-q{margin:0 0 4px;color:var(--navy);font-size:14.3px;font-weight:700}.faq-a{margin:0;color:#536276;font-size:13.8px}
    .cta{margin-top:38px;padding:24px 22px;background:linear-gradient(135deg,#071f55 0%,#0b2f6f 62%,#0b9aa2 100%);color:#fff}.cta h2{color:#fff;margin:0 0 8px}.cta p{color:#eaf6ff}.buttons{display:flex;gap:8px;flex-wrap:wrap}.btn{min-height:36px;padding:0 14px;background:#fff;color:var(--navy);font-size:12.9px;font-weight:700;display:inline-flex;align-items:center}.btn.sub{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.34)}
    .tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}.tag{padding:5px 8px;background:#f1f5f9;color:#56667a;font-size:12px}
    .footer{margin-top:26px;padding:32px 22px 28px;background:#10284d;color:#c9dcf4;border:1px solid #263f66}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:24px}.footer-brand,.footer h4{color:#fff}.footer-brand{font-size:18px;font-weight:800}.footer p,.footer li,.footer a{font-size:13px;color:#c9dcf4}.footer ul{list-style:none;margin:0;padding:0}.footer-copy{margin-top:22px;padding-top:16px;border-top:1px solid #2f476d;font-size:12px}
    .top{position:fixed;right:24px;bottom:24px;width:46px;height:46px;background:#2d6df6;color:#fff;border-radius:999px;box-shadow:0 10px 24px rgba(45,109,246,.28);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800}
    @media(max-width:860px){body{word-break:normal}.header{position:static}.header-inner{padding:12px 14px;align-items:flex-start;flex-direction:column;gap:10px}.nav{width:100%;gap:12px;flex-wrap:wrap}.nav a{min-height:28px}.actions{width:100%}.page{padding:14px 10px 44px}.hero{padding:24px 17px 20px}h1{font-size:23px}.body{padding:28px 15px 40px}.toc ol{grid-template-columns:1fr}.photo-grid{grid-template-columns:1fr}.photo.wide{grid-column:auto}.photo img{height:280px}.points{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.top{right:14px;bottom:14px;width:42px;height:42px}}
    @media(max-width:560px){.footer-grid{grid-template-columns:1fr}.photo.portrait img{height:340px}}

.kb-header{
  position:sticky;
  top:0;
  z-index:100;
  width:100%;
  background:#172f55;
  color:#fff;
  border:0;
  box-shadow:none;
  backdrop-filter:none;
}
.kb-header *{box-sizing:border-box}
.kb-header-inner{
  max-width:1180px;
  min-height:48px;
  margin:0 auto;
  padding:0 22px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:22px;
}
.kb-logo{
  display:flex;
  align-items:center;
  gap:7px;
  color:#fff;
  font-size:13px;
  line-height:1;
  font-weight:800;
  letter-spacing:-.02em;
  white-space:nowrap;
  text-decoration:none;
}
.kb-logo-mark{
  width:20px;
  height:20px;
  flex:0 0 20px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#2d6df6;
  color:#fff;
  border:0;
  border-radius:0;
  font-size:12px;
  line-height:1;
  font-weight:800;
}
.kb-nav{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:18px;
  flex-wrap:nowrap;
}
.kb-nav a,
.kb-contact{
  min-height:48px;
  padding:0;
  display:inline-flex;
  align-items:center;
  background:transparent;
  color:#fff;
  border:0;
  border-radius:0;
  font-size:12px;
  line-height:1.2;
  font-weight:560;
  opacity:.96;
  white-space:nowrap;
  text-decoration:none;
}
.kb-nav a:hover,
.kb-nav a:focus-visible,
.kb-contact:hover,
.kb-contact:focus-visible{color:#d9e7ff;opacity:1}
.kb-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  white-space:nowrap;
}
.kb-actions .kb-contact{min-height:30px}
.kb-quote{
  height:30px;
  min-height:30px;
  padding:0 15px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#2d6df6;
  color:#fff;
  border:0;
  border-radius:0;
  font-size:12px;
  line-height:1;
  font-weight:700;
  text-decoration:none;
}
.kb-quote:hover,.kb-quote:focus-visible{background:#1f5fe8;color:#fff}
@media(max-width:860px){
  .kb-header{position:static}
  .kb-header-inner{
    min-height:auto;
    padding:12px 14px;
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }
  .kb-nav{
    width:100%;
    gap:12px;
    flex-wrap:wrap;
  }
  .kb-nav a{min-height:28px}
  .kb-actions{
    width:100%;
    margin-left:0;
    justify-content:flex-start;
  }
}
@media(max-width:560px){
  .kb-nav{display:none}
}

}
