/* 모든 페이지 공통: 머리글·모바일 메뉴·바닥글 (페이지 CSS 뒤에 읽음) */
html{scroll-padding-top:96px}
body{margin:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:8px 14px;font-weight:700}
.skip:focus{top:12px}
.nav .logo{flex:none}
.mnu{display:none;font:inherit;font-size:15px;font-weight:700;height:40px;padding:0 14px;border:1.5px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer;border-radius:2px}
.mnu[aria-expanded="true"]{background:var(--ink);color:#fff}
.mnav{border-top:1px solid var(--line);background:#fff}
.nav .mnav .in{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;height:auto;padding-block:6px 14px;align-items:stretch}
.mnav a{padding:12px 0;font-size:16px;font-weight:700;border-bottom:1px solid var(--line2)}
.mnav a:hover{color:var(--brick)}
footer{background:#0E1115;color:#9AA2AC;padding-block:40px 48px;font-size:14px}
footer .in{display:grid!important;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:32px}
footer b{color:#fff;font-size:14px;display:block;margin-bottom:10px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
footer a:hover{color:#fff}
footer .copy{grid-column:1/-1;border-top:1px solid #262C33;padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12px}
.sample{font-family:inherit;font-size:10.5px;font-weight:600;border:1px solid #5A626C;color:#8C949E;padding:0 5px;margin-left:6px;vertical-align:1px;white-space:nowrap}
main .sample{border-color:var(--line);color:var(--mute)}
.docs span.off{background:var(--ink);padding:16px 18px;font-size:14px;font-weight:600;display:flex;justify-content:space-between;gap:10px;color:#6F7782}
.docs span.off span{font-size:12px;color:#8C949E}
a.u{color:var(--brick);text-decoration:underline;text-underline-offset:3px}
@media (max-width:1000px){
  .mnu{display:inline-flex;align-items:center}
  .nav .r{gap:10px}
  footer .in{grid-template-columns:1fr 1fr}
}
@media (min-width:1001px){.mnav{display:none!important}}
@media (max-width:720px){
  html{scroll-padding-top:80px}
  footer .in{grid-template-columns:1fr}
  .nav .logo img{height:32px;width:auto}
  .nav .r .btn.p.sm{display:none}
}
.nw{display:inline-block}
/* v0.4 머리글: 로고 확대 · 메뉴 1줄 + 프로그램 줄 */
.nav .in{height:84px;gap:44px}
.nav .logo img{height:56px;width:auto}
.nav nav{gap:32px}
.pbar{background:var(--bg2);border-bottom:1px solid var(--line)}
.pbar .in{display:flex;align-items:stretch;gap:0;height:50px}
.pbar .pl{display:flex;align-items:center;padding:0 18px 0 0;margin-right:10px;font-size:15px;font-weight:800;color:var(--ink);border-right:1px solid var(--line);white-space:nowrap}
.pbar .pl::after{content:"›";margin-left:10px;color:var(--mute);font-weight:400}
.pbar .pl.on,.pbar .pl:hover{color:var(--brick)}
.pbar .pls{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1}
.pbar .pls::-webkit-scrollbar{display:none}
.pbar .pls a{display:flex;align-items:center;gap:8px;padding:0 14px;font-size:16px;font-weight:700;color:var(--ink2);white-space:nowrap;border-bottom:3px solid transparent;margin-bottom:-1px}
.pbar .pls a img{width:22px;height:22px;flex:none}
.pbar .pls a em{font-style:normal;font-size:11px;font-weight:700;color:#fff;background:#0E8A7B;padding:0 6px}
.pbar .pls a:hover{color:var(--ink);background:#fff}
.pbar .pls a.on{color:var(--ink);background:#fff;border-bottom-color:var(--brick)}
.mnav a img{width:20px;height:20px;vertical-align:-4px;margin-right:8px}
/* 홈 요금 띠 */
.pstrip{border-block:var(--hair);background:#fff;padding-block:40px}
.pstrip .in{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:40px;align-items:center}
.pstrip h2{font-size:28px;margin-top:6px}
.pstrip dl{display:flex;gap:0;margin:0}
.pstrip dl div{padding:0 26px;border-left:var(--hair)}
.pstrip dt{font-size:13px;color:var(--mute);font-weight:600}
.pstrip dd{margin:2px 0 0;font-size:16px}
.pstrip dd b{font-family:var(--disp);font-size:24px}
@media (max-width:1100px){.nav nav{gap:22px}.nav .in{gap:28px}}
@media (max-width:1000px){.pstrip .in{grid-template-columns:1fr}.pstrip dl div:first-child{border-left:0;padding-left:0}}
@media (max-width:720px){
  .nav .in{height:64px}
  .nav .logo img{height:38px}
  .pbar .in{height:46px;padding-inline:0}
  .pbar .pl{padding-left:16px}
  .pbar .pls a{padding:0 11px;font-size:15px}
  .pstrip dl{flex-direction:column;gap:10px}
  .pstrip dl div{border-left:0;padding:0}
}
.win .real{display:block;cursor:zoom-in}.win .real img{display:block;width:100%;height:auto}
.tour{grid-template-columns:minmax(0,1.85fr) minmax(0,1fr)}@media (max-width:1000px){.tour{grid-template-columns:1fr}}