/* guidewayz — C안. 흰 회색 바탕, 먹색 한 가지. 색은 쓰지 않고 굵기와 선으로만 구분 */
:root{--bg:#F6F6F4;--card:#FFFFFF;--ink:#1C1C1C;--muted:#5C5C5C;--line:#D9D9D5;--accent:#1C1C1C;--accent-soft:#EDEDEA;
--sans:"Gothic A1","Noto Sans KR",system-ui,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.8 var(--sans);word-break:keep-all;font-variant-numeric:tabular-nums}
article p,article li{overflow-wrap:anywhere}
a{color:var(--ink);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--muted)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}
body.wide .wrap{max-width:1160px}
header.site{border-bottom:1px solid var(--ink)}
.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;padding:20px 20px 16px}
.brand{font-size:1.3rem;font-weight:800;letter-spacing:-.02em;color:var(--ink);text-decoration:none}
nav.main{display:flex;flex-wrap:wrap;gap:2px 20px;font-size:.95rem}
nav.main a{text-decoration:none;padding:6px 0}
nav.main a:hover{color:var(--ink);text-decoration:underline}
.crumbs{font-size:.85rem;color:var(--muted);margin:28px 0 4px}.crumbs a{color:var(--muted)}
h1,h2,h3{font-weight:800;letter-spacing:-.025em}
h1{font-size:2.1rem;line-height:1.3;margin:8px 0 12px}
h2{font-size:1.45rem;line-height:1.4;margin:2.2em 0 .6em}
h3{font-size:1.15rem;margin:1.6em 0 .4em}
.meta{color:var(--muted);font-size:.88rem;margin-bottom:28px}
article p{margin:0 0 1.05em}
article ul,article ol{padding-left:1.3em}article li{margin:.3em 0}
strong{font-weight:800}
table{border-collapse:collapse;width:100%;font-size:.93rem;margin:1em 0 1.5em}
th,td{padding:10px 12px 10px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
th{font-weight:800;border-bottom:2px solid var(--ink)}
td:last-child,th:last-child{padding-right:0}
.num{text-align:right}
.tbl{overflow-x:auto}
.tbl-hint{font-size:.8rem;color:var(--muted);margin:-1.1em 0 1.5em;text-align:right}
blockquote{margin:1.4em 0;padding:.2em 0 .2em 1.1em;border-left:3px solid var(--ink)}
.note{background:var(--card);border-top:2px solid var(--ink);padding:14px 18px;margin:1.6em 0}
.fig{margin:1.8em 0 2em}
.fig img{display:block;width:100%;max-width:600px;height:auto;margin:0 auto;background:var(--card)}
.fig figcaption{max-width:600px;margin:10px auto 0;font-size:.85rem;color:var(--muted);line-height:1.6}
.sources{margin:3em 0 1em;padding:18px 0 0;border-top:1px solid var(--ink);font-size:.88rem;color:var(--muted)}
.sources h2{font-size:1rem;margin:0 0 .4em;color:var(--ink)}
.list{list-style:none;padding:0;margin:0}
.list li{padding:14px 0;border-bottom:1px solid var(--line)}
.list a{font-weight:700;text-decoration:none}
.list a:hover{text-decoration:underline;color:var(--ink)}
.list p{margin:.2em 0 0;color:var(--muted);font-size:.9rem;line-height:1.7}
.sec{margin:2.6em 0}.sec h2{margin-top:0}.sec h2 a{text-decoration:none}
/* 계산기 */
body .gw-calc{border-radius:0;border:0;border-top:2px solid var(--ink);background:var(--card);padding:18px 18px 8px}
body .gw-f input,body .gw-f select{border-radius:0;border-color:#8A8A86}
body .gw-total{color:var(--ink)}
/* 홈 */
.hero{padding:40px 0 8px}
.hero h1{font-size:3rem;line-height:1.2;max-width:15em;margin:0}
.hero .lead{max-width:38em;margin:18px 0 0;color:#3E3E3E}
.chart{margin:28px 0 8px}.chart .scroll{overflow-x:auto}
.chart svg{display:block;width:100%;min-width:640px;height:auto;overflow:visible}
.chart figcaption{font-size:.85rem;color:var(--muted);margin-top:10px}
.split{display:flex;flex-wrap:wrap;gap:24px 56px;margin:2.6em 0}
.split>div{flex:1 1 320px;min-width:0}
.split .wide{flex:999 1 520px}
.pick{list-style:none;margin:0;padding:0}
.pick li{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 24px;padding:14px 0;border-bottom:1px solid var(--line)}
.pick a{flex:1 1 280px;text-decoration:none}
.pick a:hover{text-decoration:underline}
.pick b{font-weight:800;white-space:nowrap}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:0 48px;margin-top:1em}
footer.site{margin-top:64px;border-top:1px solid var(--ink);font-size:.85rem;color:var(--muted)}
.foot{padding:22px 20px 40px}.foot p{margin:.3em 0}
.foot .links a{color:var(--muted);margin-right:16px}
@media (max-width:640px){
h1{font-size:1.7rem}
.hero h1{font-size:2.05rem}
h2{font-size:1.3rem}
}