:root{--g:#0f7a55;--gd:#0a5a3f;--gl:#e7f4ee;--ink:#1d2526;--mut:#6a7475;--line:#d9dedc;--bg:#f7f8f6;--warn:#c2410c;--bad:#c62828;--good:#1b7f3a;--y:#fff6c7;--o:#ffe2c2}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",sans-serif;font-size:16px;line-height:1.6;word-break:keep-all}
a{color:var(--g)}
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:18px;padding:10px 20px;background:#fff;border-bottom:1px solid var(--line);flex-wrap:wrap}
.logo{font-size:20px;text-decoration:none;color:var(--ink);white-space:nowrap}.logo b{color:var(--g)}.logo small{font-size:12px;color:var(--mut);margin-left:6px}
.top nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}.top nav a{padding:6px 10px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:14px}.top nav a.on,.top nav a:hover{background:var(--gl);color:var(--gd)}
.probtn{padding:7px 14px;border-radius:999px;background:var(--g);color:#fff;text-decoration:none;font-size:14px;font-weight:700;white-space:nowrap}.probtn.ok{background:var(--gl);color:var(--gd)}
main{max-width:1180px;margin:0 auto;padding:24px 20px 60px;display:block}
footer{border-top:1px solid var(--line);padding:24px 20px;color:var(--mut);font-size:13px;text-align:center}
h1{font-size:26px;line-height:1.35;margin:6px 0 10px}h2{font-size:20px;margin:28px 0 10px}h3{font-size:16px;margin:16px 0 6px}
.muted{color:var(--mut)}.hidden{display:none!important}
.btn{display:inline-block;border:0;border-radius:10px;padding:9px 16px;background:var(--g);color:#fff;font-weight:700;font-size:15px;cursor:pointer;text-decoration:none;font-family:inherit}.btn:hover{background:var(--gd)}.btn:disabled{opacity:.4;cursor:default}
.btn.ghost{background:#fff;color:var(--gd);border:1.5px solid var(--g)}.btn.big{padding:14px 24px;font-size:17px}
.hero{padding:40px 0 20px}.hero h1{font-size:34px}.hero em{font-style:normal;color:var(--g);background:linear-gradient(transparent 62%,#c8ead9 62%)}.hero p{font-size:18px;max-width:720px}.cta{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin:18px 0}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;text-decoration:none;color:var(--ink);transition:.15s}.card:hover{border-color:var(--g);box-shadow:0 4px 16px rgba(15,122,85,.1)}.card h3{margin:8px 0 4px}.card p{margin:0;color:var(--mut);font-size:14px}.card.locked{opacity:.75}
.ico{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 8px;border-radius:12px;background:var(--gl);color:var(--gd);font-weight:800;font-family:Consolas,monospace}
.how ol{padding-left:22px}.how li{margin:6px 0}
.group h2{font-size:18px}.list{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.row{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--line);text-decoration:none;color:var(--ink)}.row:first-child{border-top:0}.row:hover{background:var(--gl)}
.row .st{width:26px;text-align:center;color:var(--mut)}.row.done .st{color:var(--good);font-weight:800}.row .t{flex:1}.row .lv{font-size:12px;color:var(--mut)}.row.locked{color:var(--mut)}
.tag{font-size:12px;padding:2px 8px;border-radius:999px;background:#fff3d6;color:#8a5a00;font-weight:700}
.crumbs{font-size:14px;color:var(--mut);margin:0}
.task{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 20px;margin:10px 0 16px}.task h1{font-size:22px}.task .q{font-size:17px;margin:6px 0}
.rules{list-style:none;padding:0;margin:8px 0 0}.rules li{color:var(--warn);font-weight:700}
main>.work,main>.side{display:block}
@media(min-width:1000px){main{display:grid;grid-template-columns:minmax(0,1fr) 340px;column-gap:22px}main>*{grid-column:1/-1}main>.work{grid-column:1}main>.side{grid-column:2;grid-row:span 3}}
.fxbar{display:flex;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px}
.cellname{min-width:64px;text-align:center;font-family:Consolas,monospace;font-size:14px;color:var(--mut);border-right:1px solid var(--line);padding-right:8px}
.fxl{font-style:italic;font-weight:700;color:var(--mut);font-family:Georgia,serif;padding:0 4px}
.fx{flex:1;border:0;outline:0;font-family:Consolas,"D2Coding",monospace;font-size:17px;padding:8px 6px;min-width:0;background:transparent}
.tip{font-size:13px;color:var(--mut);margin:6px 2px 12px}
.sheetwrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:10px;max-height:560px}
table.sheet{border-collapse:collapse;font-size:14px;font-family:"Malgun Gothic","Apple SD Gothic Neo",sans-serif}
table.sheet th{background:#f0f2f1;color:#5b6466;font-weight:600;border:1px solid #dfe3e1;padding:3px 8px;position:sticky;top:0;z-index:1;min-width:34px}
table.sheet tr th:first-child{position:sticky;left:0;z-index:2}table.sheet th.corner{z-index:3}
table.sheet td{border:1px solid #e3e6e4;padding:4px 9px;white-space:nowrap;min-width:64px;cursor:cell;height:28px}table.sheet td.n{text-align:right}table.sheet td.hd{background:#f6faf8;font-weight:700;text-align:center}
table.sheet td:hover{outline:2px solid #9bd3bb;outline-offset:-2px}
td.tgt{background:var(--y)}td.good{background:#dcf3e3!important}td.bad{background:#fde0de!important;box-shadow:inset 0 0 0 2px var(--bad)}
td.inrange{box-shadow:inset 0 0 0 1px #9bd3bb}td.cfon{background:var(--o)!important}td.miss{box-shadow:inset 0 0 0 2px var(--bad);outline:2px dashed var(--bad);outline-offset:-4px}
table.sheet.small td,table.sheet.small th{position:static}
table.crit input.ci{width:150px;border:0;outline:0;font:inherit;padding:2px}table.crit input.hdr{font-weight:700}table.crit td{padding:2px 6px;background:#fff}
.msg{margin:12px 0;padding:0;border-radius:10px;font-size:15px}.msg.ok,.msg.no{padding:12px 14px}.msg.ok{background:#e1f5e8;color:#11632c}.msg.no{background:#fdecea;color:#9b1c1c}.msg .cmp{margin-top:6px;font-family:Consolas,monospace;font-size:13px}
.side .steps,.side .fnhelp,.answer{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:14px}
.steps ol{padding-left:20px;margin:6px 0 10px}.steps li{margin-bottom:8px}.steps li p{margin:2px 0 0;font-size:14.5px}
.fnhelp summary{cursor:pointer;font-weight:700}.fnhelp dt{font-family:Consolas,monospace;font-weight:700;margin-top:8px;font-size:14px;color:var(--gd)}.fnhelp dd{margin:2px 0 0;font-size:14px;color:#3f4849}
.answer{border-color:var(--g)}.code{background:#1f2a28;color:#e9f1ee;border-radius:10px;padding:12px 14px;overflow:auto;font-family:Consolas,"D2Coding",monospace;font-size:15px;white-space:pre-wrap}
.code .fs{color:#ffd28a}.code .fr{color:#8fd6ff}.code .ff{color:#9ff0c3}
.code.fill{background:#fff;color:var(--ink);border:1px solid var(--line);line-height:2.1}
input.blank{font-family:Consolas,monospace;font-size:15px;border:0;border-bottom:2px solid var(--g);background:#eef8f3;padding:2px 6px;margin:0 2px;outline:0}input.blank.good{border-color:var(--good);background:#dcf3e3}input.blank.bad{border-color:var(--bad);background:#fde0de}
.pre{white-space:pre-wrap}
.acts{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.pager{display:flex;justify-content:space-between;margin-top:26px}
table.fmt{border-collapse:collapse;background:#fff;width:100%;border:1px solid var(--line);border-radius:10px;overflow:hidden}table.fmt th,table.fmt td{border-bottom:1px solid var(--line);padding:8px 12px;text-align:right}table.fmt th{background:#f0f2f1;font-size:13px}table.fmt td.out{font-family:"Malgun Gothic",sans-serif}
.guide{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 26px;max-width:860px}.guide .when{background:var(--gl);padding:12px 14px;border-radius:10px}
.guide ol.big li{margin:8px 0}.guide ul.warn li{color:#8a2d0b}.guide ul.check li{list-style:'☐  '}.ex{border:1px dashed var(--line);border-radius:10px;padding:10px 14px}
.examtop{display:flex;gap:16px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;position:sticky;top:58px;z-index:5;flex-wrap:wrap}.examtop .timer{color:var(--warn);font-weight:700;margin-left:auto}
.exam{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:18px;margin-top:14px}@media(max-width:800px){.exam{grid-template-columns:1fr}}
.qbody{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 22px}.qbody .subj{color:var(--mut);font-size:13px;margin:0}.qq{font-size:18px;white-space:pre-wrap}
.choices{list-style:none;padding:0}.ch{display:flex;gap:10px;padding:11px 14px;border:1.5px solid var(--line);border-radius:10px;margin:8px 0;cursor:pointer}.ch:hover{border-color:var(--g)}.ch .no{font-weight:700;color:var(--gd)}.ch.sel{border-color:var(--g);background:var(--gl)}.ch.right{border-color:var(--good);background:#dcf3e3}.ch.wrong{border-color:var(--bad);background:#fde0de}
.exp{background:#f6f7f5;border-radius:10px;padding:12px 14px;margin-top:10px}.exp p{margin:4px 0 0}
.palette{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;align-content:start}.pb{border:1px solid var(--line);background:#fff;border-radius:8px;padding:7px 0;cursor:pointer;font:inherit;font-size:13px}.pb.ans{background:var(--gl)}.pb.cur{outline:2px solid var(--g)}.pb.right{background:#dcf3e3}.pb.wrong{background:#fde0de}
.result table.score{border-collapse:collapse;background:#fff}.score th,.score td{border:1px solid var(--line);padding:8px 16px}.score tr.fail td{color:var(--bad);font-weight:700}
.price{background:#fff;border:2px solid var(--g);border-radius:18px;padding:20px 24px;max-width:640px}.price li{margin:6px 0}
@media(max-width:640px){.hero h1{font-size:26px}main{padding:16px 12px 50px}.top{padding:8px 12px}.top nav{order:3;flex-basis:100%;overflow-x:auto;flex-wrap:nowrap}.fx{font-size:15px}}

.vguide{max-width:1100px}.vguide .when{background:var(--gl);padding:12px 14px;border-radius:10px}
.vindex{display:grid;gap:10px;margin:14px 0 22px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.vsec{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}.vsec>b{min-width:72px;color:var(--gd);padding-top:5px}
.chips{display:flex;gap:6px;flex-wrap:wrap;flex:1;min-width:0}
.chip{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:5px 12px;font:inherit;font-size:14px;cursor:pointer;color:var(--ink)}.chip:hover{border-color:var(--g)}.chip.on{background:var(--g);border-color:var(--g);color:#fff}
.vdetail h2{margin-top:6px}.say{background:#fff8e6;border:1px solid #ecd28f;border-radius:12px;padding:10px 14px;margin-bottom:14px}.say ul{margin:6px 0 0;padding-left:20px}
.slides{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;outline:0}
.snav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.sct{font-weight:700;color:var(--mut);font-variant-numeric:tabular-nums}
.stagewrap{overflow-x:auto;display:flex;justify-content:center;background:#eef1f0;border-radius:10px;padding:10px}
.stage{position:relative;width:100%;flex:none}.stage img{display:block;width:100%;height:100%;border-radius:4px;box-shadow:0 1px 6px rgba(0,0,0,.18)}
.mbox{position:absolute;border:3px solid #e8483b;border-radius:6px;box-shadow:0 0 0 2px rgba(255,255,255,.7);pointer-events:none;transition:.15s}
.mdot{position:absolute;width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:50%;background:#e8483b;color:#fff;font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px #fff,0 2px 6px rgba(0,0,0,.35);pointer-events:none}
.mbox.hl{border-color:#ffb300;box-shadow:0 0 0 4px rgba(255,179,0,.45)}.mdot.hl{background:#ffb300;transform:scale(1.2)}
.mcaps{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:6px}.mcaps li{display:flex;gap:10px;align-items:flex-start;padding:6px 8px;border-radius:8px;cursor:default}.mcaps li:hover{background:#fff4d6}
.mn{flex:none;width:24px;height:24px;border-radius:50%;background:#e8483b;color:#fff;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.vcheck{margin-top:14px;background:#f1f7f4;border-radius:12px;padding:10px 14px}.vcheck ul{margin:6px 0 0;padding-left:20px}
.mring{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:3px solid #e8483b;box-shadow:0 0 0 2px rgba(255,255,255,.8);pointer-events:none}
.mdot.off{margin:-40px 0 0 -40px}.mring.hl{border-color:#ffb300}
.tlist{display:grid;gap:10px;margin-top:14px}.tcard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px}
.tcard summary{cursor:pointer;font-weight:700;list-style-position:outside}.tsec{display:inline-block;font-size:12px;font-weight:700;color:var(--gd);background:var(--gl);border-radius:999px;padding:1px 8px;margin-right:8px}
.tbody{margin-top:10px}.tbody ol{padding-left:22px}.tbody li{margin:4px 0}.tnote{background:#f6f7f5;border-radius:8px;padding:8px 12px;color:#3f4849}
.mapbody{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 20px;margin-top:14px}.tablewrap{overflow-x:auto;margin:10px 0}
.mapbody table{border-collapse:collapse;font-size:13.5px;min-width:900px}.mapbody th,.mapbody td{border:1px solid var(--line);padding:6px 8px;vertical-align:top;text-align:left}.mapbody th{background:#f0f2f1;position:sticky;top:0}
.mapbody h2{border-top:2px solid var(--gl);padding-top:14px}
.chipgroup{display:inline-block;min-width:3.5em;font-size:.9rem;color:var(--mut);align-self:center}
.chips+.chips{margin-top:6px}
.tabs{display:flex;gap:6px;margin:0 0 10px}
.tabs button{border:1px solid var(--line,#ccc);background:transparent;color:inherit;border-radius:999px;padding:6px 14px;font:inherit;cursor:pointer}
.tabs button.on{background:var(--g);border-color:var(--g);color:#fff}
.vbaed{width:100%;box-sizing:border-box;font-family:ui-monospace,Consolas,"D2Coding",monospace;font-size:14px;line-height:1.55;padding:10px 12px;border:1px solid var(--line,#ccc);border-radius:8px;background:#fff;color:inherit;tab-size:4;resize:vertical;min-height:220px}
.code .vk{color:#8ab4ff;font-weight:600}.code .vc{color:#86c79a}
.vbabox{border:1px solid var(--line);border-radius:8px;background:#fff;overflow:hidden}
.vbaline{display:flex;align-items:center;gap:4px;padding:6px 12px;font-family:ui-monospace,Consolas,"D2Coding",monospace;font-size:14px;background:#f3f5f4}
.vbaline .vk{color:#1d4ed8;white-space:pre}
.vbahdr{flex:1;min-width:0;font:inherit;border:1px dashed var(--line);border-radius:4px;padding:4px 6px;background:#fff}
.vbabox .vbaed{border:0;border-radius:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.top nav{gap:10px 14px;align-items:center}
.navg{display:flex;align-items:center;gap:2px;flex-wrap:nowrap}
.navl{font-size:12px;font-weight:700;color:var(--mut);margin-right:4px;white-space:nowrap}
.top nav .navg a{padding:5px 8px;font-size:13.5px;white-space:nowrap}
.cardsh{font-size:17px;margin:26px 0 10px}
.row .kind{font-size:12px;color:var(--mut);border:1px solid var(--line);border-radius:999px;padding:1px 8px;white-space:nowrap}
/* ── 대표 기능(배우기·풀기) ── */
.tcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.tcard2{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;text-decoration:none;color:var(--ink)}
.tcard2:hover{border-color:var(--g);box-shadow:0 4px 14px rgba(15,122,85,.1)}.tcard2.locked{opacity:.7}
.tcard2 .tt{display:flex;gap:8px;align-items:center}.tcard2 .tt b{font-size:17px}
.tcard2 p{margin:6px 0 8px;color:var(--mut);font-size:14px;line-height:1.5}
.tcard2 .tm{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:13px}
.fq{font-size:12px;padding:2px 9px;border-radius:999px;background:#eef1ef;color:#4a5556;white-space:nowrap}
.fq.hi{background:#0f7a55;color:#fff}.fq.mid{background:#d8efe3;color:#0a5a3f}.fq.zero{background:#f3f3f3;color:#999}
.thead{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.thead h1{margin:0}
.lead{font-size:16px;color:#3c4647;margin:6px 0 14px}
.tabs.big a{display:inline-block;padding:9px 22px;border-radius:999px;border:1px solid var(--line);text-decoration:none;color:var(--ink);font-weight:600;background:#fff}
.tabs.big a.on{background:var(--g);border-color:var(--g);color:#fff}
.learn{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:start;margin-top:16px}
.toc{position:sticky;top:76px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:14px;max-height:calc(100vh - 100px);overflow:auto}
.toc ol{margin:6px 0 0;padding-left:20px}.toc li{margin:5px 0}.toc a{color:var(--ink);text-decoration:none}.toc a:hover{color:var(--g)}.toc small{color:var(--mut)}
.lsec{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 22px;margin-bottom:16px;scroll-margin-top:80px;transition:box-shadow .3s}
.lsec.focus{box-shadow:0 0 0 3px #f5b84a}
.lsec h2{display:flex;align-items:center;gap:10px;font-size:20px;margin:0 0 12px}
.lsec h2 .num{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--g);color:#fff;font-size:14px}
.dosteps{margin:0 0 14px;padding-left:22px;font-size:16px;line-height:1.75}.dosteps li{margin:4px 0}.dosteps b{color:var(--gd)}
.lsec .say{background:var(--gl);border-radius:10px;padding:10px 14px;margin:0 0 12px;font-size:15px}.lsec .say ul{margin:4px 0 0;padding-left:20px}
.note{background:#fff8e6;border-left:4px solid #e2b04a;padding:8px 12px;border-radius:6px;font-size:14px}
.secTypes{margin-top:12px}.secTypes summary{cursor:pointer;color:var(--g);font-weight:600;font-size:14px}
.ttable{border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-top:8px}
.trow+.trow{border-top:1px solid var(--line)}
.tline{display:grid;grid-template-columns:minmax(150px,1.1fr) 2fr auto auto;gap:10px;align-items:center;padding:9px 12px;cursor:pointer;font-size:14px}
.tline:hover{background:#f7faf8}.tn{font-weight:600}.ts{color:var(--mut)}
.tline .go{font-size:13px;color:var(--g);text-decoration:none;white-space:nowrap}
.tmore{padding:0 14px 10px;font-size:13.5px;color:#3c4647;line-height:1.6}.tmore p{margin:4px 0}
.psec{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 22px;margin:16px 0}
.psec h2{margin:0 0 6px;font-size:20px}
.cq{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:8px 0 10px;font-size:16px}.cq .cnt{color:var(--mut);font-size:13px}.cq .score{margin-left:auto;color:var(--g);font-size:13px}
.stage.click{cursor:crosshair}
.mbox.show{border:3px solid #1b9b4b;background:rgba(27,155,75,.12)}
.clickdot{position:absolute;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px #333}
.clickdot.ok{background:#1b9b4b}.clickdot.no{background:#c62828}
.golearn{font-size:13.5px;color:var(--g);white-space:nowrap}
.chq{border-top:1px solid var(--line);padding:12px 0}.chq:first-child{border-top:0}.chq .q{font-size:16px;margin:0 0 8px}
.chs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}
.chbtn{text-align:left;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit;font-size:15px;cursor:pointer;color:var(--ink)}
.chbtn:hover{border-color:var(--g)}.chbtn.good{background:#dcf3e3;border-color:#1b9b4b}.chbtn.bad{background:#fde0de;border-color:#c62828}
.exam1{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:12px 0;background:#fcfdfc}.exam1.done{border-color:#1b9b4b}
.exam1 h3{margin:0 0 8px}.files{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:14px;margin-bottom:8px}
.btn.sm{padding:5px 12px;font-size:13.5px}
.esteps{padding-left:22px;font-size:15.5px;line-height:1.7}.esteps li{margin:4px 0}
.oldlist{margin-top:28px}.oldlist>summary{cursor:pointer;color:var(--mut);font-size:15px}
@media(max-width:860px){.learn{grid-template-columns:1fr}.toc{position:static}.tline{grid-template-columns:1fr;gap:4px}}
/* 메뉴 안내 · 용어 사전 */
.appsw{display:flex;gap:8px;margin:6px 0 14px;flex-wrap:wrap}.appsw a{padding:6px 12px;border-radius:8px;border:1px solid var(--line,#d9dde3);text-decoration:none;color:inherit;font-size:14px}.appsw a.on{background:#1f6f43;color:#fff;border-color:#1f6f43}
.rtabs{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 16px}.rtabs a{padding:7px 12px;border-radius:999px;background:#f1f3f5;color:#333;text-decoration:none;font-size:14px;cursor:pointer}.rtabs a.on{background:#222;color:#fff}
.rtab h2{margin:6px 0 4px}.rtab .when{color:#555;margin:0 0 8px}.rtab .note{background:#fff8e1;border-left:4px solid #ffb300;padding:8px 12px;border-radius:6px;font-size:14px}
.rscroll{overflow-x:auto;border:1px solid #e3e6ea;border-radius:10px;background:#fafafa;padding:18px 18px 10px;margin:10px 0 14px}
.rstage{position:relative;max-width:none}.rstage img{width:100%;display:block;user-select:none}
.rstage .mbox{border-width:2px}.rstage .mdot{width:22px;height:22px;margin:-11px 0 0 -11px;font-size:12px}
.mbox.dim{border-color:#b9bec5;box-shadow:none}.mdot.dim{background:#9aa1a9}
.rgroups{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.rgroups li{display:flex;gap:10px;padding:10px 12px;border:1px solid #e3e6ea;border-radius:10px;background:#fff;cursor:default}
.rgroups li .mn{flex:0 0 24px;height:24px;border-radius:50%;background:#e8483b;color:#fff;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.rgroups li.dim{opacity:.62}.rgroups li.dim .mn{background:#9aa1a9}
.rgroups li p{margin:3px 0 6px;font-size:14px;line-height:1.55}
.qbs{display:flex;flex-wrap:wrap;gap:4px}.qbs.none{font-size:12px;color:#8a9097}
.qb{font-size:12px;padding:2px 8px;border-radius:999px;background:#e8f3ec;color:#1f6f43;text-decoration:none;font-weight:600}
.rextra{margin-top:22px}.rextra li{margin:6px 0;line-height:1.6}
.tsearch{width:100%;max-width:520px;padding:10px 12px;border:1px solid #cfd4da;border-radius:10px;font-size:15px;margin:6px 0 4px}
.terms{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.term{border:1px solid #e3e6ea;border-radius:10px;padding:10px 12px;background:#fff}.term .th{display:flex;justify-content:space-between;align-items:center;gap:8px}
.term .tc{font-size:11px;color:#8a9097}.term p{margin:4px 0 6px;font-size:14px;line-height:1.6}.term code{display:block;font-size:13px;background:#f5f6f8;padding:4px 8px;border-radius:6px;margin-bottom:6px;white-space:pre-wrap}
.rmore{margin:18px 0 26px}.rmore h3{margin:0 0 4px}
.stagewrap{padding:34px}
.rstage .rnums{position:absolute;left:0;right:0;top:100%;height:30px}.rstage .rnums .mdot{top:16px}
.rscroll{padding-bottom:40px}
@media (max-width:600px){.stagewrap{padding:22px}.stage .mdot{width:20px;height:20px;margin:-10px 0 0 -10px;font-size:12px;box-shadow:0 0 0 2px #fff,0 1px 4px rgba(0,0,0,.3)}}
/* 상단 메뉴: 엑셀·액세스 드롭다운 */
.top nav{gap:2px 6px;align-items:center;flex-wrap:wrap}
.top nav>a{white-space:nowrap}
.navdd{position:relative}
.navbtn{font:inherit;font-size:14px;background:none;border:0;padding:6px 10px;border-radius:8px;color:var(--ink);cursor:pointer;white-space:nowrap}
.navbtn .car{font-size:10px;margin-left:4px;color:var(--mut)}
.navbtn.on,.navbtn:hover,.navdd.open .navbtn{background:var(--gl);color:var(--gd)}
.ddm{display:none;position:absolute;left:0;top:100%;z-index:50;min-width:200px;background:var(--card,#fff);border:1px solid var(--line,#ddd);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:6px}
.navdd:hover .ddm,.navdd:focus-within .ddm,.navdd.open .ddm{display:block}
.navdd:hover::after{content:'';position:absolute;left:0;right:0;top:100%;height:6px}
.top nav .ddm a{display:block;padding:8px 10px;border-radius:7px;font-size:14px;white-space:nowrap}
.top nav .ddm a b{color:var(--gd);font-weight:700;margin-right:2px}
.top nav .ddm a.ddg{border-top:1px solid var(--line,#eee);margin-top:4px;padding-top:10px}
@media(max-width:640px){.top nav{overflow:visible;flex-wrap:wrap}.ddm{position:fixed;left:12px;right:12px;top:auto;min-width:0}}
/* 실기 기출 회차 */
.ground{background:#fff;border:1px solid var(--line);border-radius:12px;margin:8px 0;padding:0 14px}
.ground summary{cursor:pointer;padding:12px 0;font-size:15px}
.ground[open] summary{border-bottom:1px solid var(--line);margin-bottom:8px}
.gqs{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px 18px;padding-bottom:12px}
.gq h3{font-size:15px;margin:6px 0}.gq h3 a{color:var(--gd);text-decoration:none}
.gitems{margin:0;padding-left:0;list-style:none}.gitems li{margin:6px 0;display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.glab{font-weight:700;color:var(--mut);min-width:26px}
.gchips{display:flex;flex-wrap:wrap;gap:4px}.gtop{margin:6px 0 10px}
.gchip{display:inline-block;padding:3px 9px;border-radius:999px;background:var(--gl);color:var(--gd);font-size:13px;text-decoration:none;border:1px solid #cfe7dc}
.gchip:hover{background:#d6eee3}.gchip.locked{background:#f2f3f2;color:var(--mut);border-color:var(--line)}
.gchip small{color:var(--mut);margin-left:2px}
.gfn{font-size:12px;color:var(--mut);font-family:Consolas,monospace;width:100%;padding-left:30px}
.gitems li{display:grid;grid-template-columns:minmax(32px,auto) 1fr;align-items:start;gap:2px 4px}
.gitems li .gchips{grid-column:2}.gitems li .gfn{grid-column:2;padding-left:2px;width:auto}
.gitems li .glab{padding-top:3px}
/* 필기: 연도별 회차 */
.wjump{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 4px}.wjump a{padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;text-decoration:none;color:var(--gd);font-size:14px}.wjump a:hover{background:var(--gl)}
.years{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.yrow{display:flex;align-items:center;gap:16px;padding:12px 16px;border-top:1px solid var(--line);flex-wrap:wrap}.yrow:first-child{border-top:0}
.yrow h3{margin:0;width:70px;font-size:17px}
.ychips{display:flex;gap:8px;flex-wrap:wrap}
.ychip{display:flex;flex-direction:column;align-items:center;min-width:74px;padding:7px 12px;border-radius:10px;border:1px solid var(--line);text-decoration:none;color:var(--ink);background:#fafbfa}
.ychip:hover{border-color:var(--g);background:var(--gl)}.ychip b{font-size:15px}.ychip small{color:var(--mut);font-size:12px}
.ychip.done{border-color:#bfe0cf;background:var(--gl)}
.freebox{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin:-8px 0 26px}
.free1{display:block;background:#fff;border:2px solid var(--g);border-radius:16px;padding:16px 18px;text-decoration:none;color:var(--ink)}.free1:hover{background:var(--gl)}
.free1 h3{margin:6px 0 4px;font-size:19px}.free1 p{margin:0;color:var(--mut);font-size:14px}
.ftag{display:inline-block;background:var(--g);color:#fff;font-size:12px;font-weight:700;padding:2px 9px;border-radius:999px}
.cta{flex-wrap:wrap}
.subq{margin:10px 0 18px}.subh{font-size:17px;margin:10px 0 8px;display:flex;align-items:center;gap:6px}.subh small{color:var(--mut);font-weight:400}
.subn{display:inline-block;background:var(--gd);color:#fff;border-radius:8px;padding:2px 9px;font-size:14px}
.also{font-size:12px;color:#8a5a00;background:#fff4dc;border-radius:999px;padding:1px 8px}
.ychip.wide{min-width:120px;max-width:170px}.ychip.wide small{text-align:center;line-height:1.3}
.subjsets .ground .ychips{padding:4px 0 14px}

.ychip .ysrc{font-size:11px;font-weight:700;color:#0f7a55}.ychip.mock .ysrc{color:#8a6d1f}
.tline button.go.pic{border:1px solid var(--g);background:#fff;border-radius:8px;padding:3px 9px;cursor:pointer;font-weight:600}
.tline button.go.pic.on{background:var(--g);color:#fff}
.tpics{padding:10px 4px 16px;border-top:1px dashed var(--line)}.tpics .tphow{font-size:14px;margin:0 0 8px}.tpics .golearn{display:inline-block;margin-top:8px;font-size:13px;color:var(--g)}
.term .tpicbtn{margin-top:6px;border:1px solid var(--g);background:#fff;color:var(--g);border-radius:8px;padding:3px 10px;font-size:13px;font-weight:600;cursor:pointer}.term .tpicbtn.on{background:var(--g);color:#fff}.term .tpics{border-top:none;padding:8px 0 0}
/* 새 형식(layout) */
.rules{background:#fff4f0;border:1px solid #f3c9b8;border-radius:14px;padding:12px 16px;margin-bottom:16px;font-size:15px}.rules ul{margin:6px 0 0;padding-left:20px}.rules li{margin:3px 0}
.items{margin-top:14px}.ih3{font-size:15px;color:var(--gd);margin:6px 0 10px}
.icard{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px;background:#fcfdfc}
.ihead{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.ihead .it{font-size:16px;flex:1 1 auto}
.ihead button.go.pic,.vt button.go.pic{border:1px solid var(--g);background:#fff;color:var(--g);border-radius:8px;padding:3px 10px;cursor:pointer;font-weight:600;font-size:13px}
.ihead button.go.pic.on,.vt button.go.pic.on{background:var(--g);color:#fff}
.isay{margin:6px 0 4px;color:var(--mut);font-size:14px}
.isteps{margin:6px 0 4px;padding-left:22px;font-size:15px;line-height:1.7}.isteps li{margin:2px 0}.isteps b{color:var(--gd)}
.itrap{margin:6px 0 0;font-size:13.5px;color:#7a3b12}
.icard .tpics,.vrow .tpics{border-top:1px dashed var(--line);margin-top:8px}
.vh{font-size:15px;margin:16px 0 8px;color:var(--gd)}
.vtable{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.vrow{padding:10px 14px;font-size:14.5px}.vrow+.vrow{border-top:1px solid var(--line)}
.vt{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.vsay{color:var(--mut);margin:4px 0}
.vexpr{margin:4px 0;font-size:15px}.vexpr code{background:#eef5f1;padding:2px 6px;border-radius:6px;white-space:pre-wrap;word-break:break-all}
.vexp{margin:2px 0;color:#3c4647}
.vsec h2 .num{width:auto;padding:0 8px;border-radius:14px}
.learn code,.rules code{background:#eef5f1;padding:1px 5px;border-radius:5px;font-family:Consolas,"D2Coding",monospace;font-size:.93em;white-space:pre-wrap;word-break:break-word}

.betabar{background:#fff4d6;border-bottom:1px solid #f0d58a;color:#5a4300;padding:8px 16px;font-size:14px;text-align:center}

/* 사진 크게 보기 모달 */
body.modal-open{overflow:hidden}
.mback{position:fixed;inset:0;z-index:1000;background:rgba(15,23,30,.62);display:flex;align-items:flex-start;justify-content:center;padding:28px 16px;overflow-y:auto}
.mcard{background:#fff;border-radius:16px;width:min(1180px,100%);box-shadow:0 20px 60px rgba(0,0,0,.35);margin:auto 0}
.mhead{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;border-radius:16px 16px 0 0;z-index:1}
.mhead b{font-size:18px}
.mclose{border:0;background:#f1f3f5;border-radius:8px;width:36px;height:36px;font-size:18px;cursor:pointer}
.mclose:hover{background:#e3e6ea}
.mbody{padding:12px 16px 18px}
.mbody .mdesc{margin:0 0 8px}
.mbody .slides{border:0;padding:6px 0 0}
.mbody .stage{max-width:100%!important}
@media (max-width:600px){.mback{padding:0}.mcard{border-radius:0;min-height:100%}.mhead{border-radius:0}}

.swipehint{display:none}
@media (max-width:600px){.mbody .stagewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.mbody .stagewrap{justify-content:flex-start;padding:22px 72px}.mbody .stage{width:max(100%,calc(var(--sw)*.78));max-width:none!important}.mbody .swipehint{display:block;text-align:center;font-size:13px;color:#6b7680;margin:6px 0 0}}