/* /note/ 전용. 시험지 조판(exam-paper-seltaek.css)은 싣지 않는다 — 이 페이지엔 시험지 마크업이 없다. */
:root{
  --text:#111827; --text-2:#374151; --text-3:#6b7280;
  --border:#D6DCE3; --success:#0B875A; --danger:#C2413F;
  --primary:#2451DF; --bg:#F5F6F8; --surface:#ffffff;
  --ui-font:"Pretendard Variable",Pretendard,"Noto Sans KR",system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{background:var(--bg);}
body{color:var(--text);font-family:var(--ui-font);line-height:1.75;word-break:keep-all;-webkit-text-size-adjust:100%;}
.note-wrap{max-width:760px;margin:0 auto;padding:22px 20px 60px;}
.note-crumb{font-size:12px;color:#9aa2af;margin-bottom:12px;}
.note-crumb a{color:#9aa2af;text-decoration:none;} .note-crumb b{color:var(--primary);font-weight:700;}
h1{font-size:27px;font-weight:800;line-height:1.35;letter-spacing:-.02em;margin:6px 0 10px;}
.note-meta{font-size:12.5px;color:var(--text-3);margin-bottom:20px;}
.note-meta .tag{display:inline-block;font-weight:800;color:var(--primary);background:rgba(36,81,223,.10);border-radius:999px;padding:3px 11px;margin-right:8px;}
h2{font-size:19px;font-weight:800;letter-spacing:-.01em;margin:34px 0 12px;padding-top:16px;border-top:1px solid var(--border);}
p{font-size:15.5px;color:var(--text-2);margin:0 0 12px;}
.note-lead{font-size:16px;color:var(--text);}
b{font-weight:700;color:var(--text);}

.note-tldr{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px;margin:18px 0 6px;}
.note-tldr-h{font-size:13px;font-weight:800;color:var(--primary);margin-bottom:8px;}
.note-tldr ol{margin:0;padding-left:19px;} .note-tldr li{font-size:15px;color:var(--text-2);margin:6px 0;}

.note-cmp{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0 14px;}
@media(max-width:560px){.note-cmp{grid-template-columns:1fr;}}
.note-cmp-col{border:1px solid var(--border);border-radius:12px;padding:13px 15px;background:var(--surface);}
.note-cmp-col.old{background:#fbfbfc;} .note-cmp-col.old .note-cmp-h{color:#9aa2af;}
.note-cmp-col.new{border-color:rgba(36,81,223,.35);} .note-cmp-col.new .note-cmp-h{color:var(--primary);}
.note-cmp-h{font-size:12px;font-weight:800;margin-bottom:8px;letter-spacing:.02em;}
.note-cmp-col ul{margin:0;padding-left:17px;} .note-cmp-col li{font-size:14px;color:var(--text-2);margin:5px 0;line-height:1.6;}
.note-cmp-col.old li{color:#8b93a1;}

.note-ul{margin:10px 0 14px;padding-left:19px;}
.note-ul li{font-size:15.5px;color:var(--text-2);margin:7px 0;line-height:1.7;}
.note-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0 16px;}
@media(max-width:640px){.note-steps{grid-template-columns:1fr;}}
.note-step{border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:13px 15px;font-size:14px;color:var(--text-2);line-height:1.65;}
.note-step .n{display:block;font-size:12px;font-weight:800;color:var(--primary);margin-bottom:7px;line-height:1.35;}
.note-tip{background:rgba(36,81,223,.05);border-left:3px solid var(--primary);border-radius:0 10px 10px 0;padding:12px 15px;font-size:15px;margin:14px 0;}
.note-quote{border-left:3px solid var(--primary);background:var(--surface);padding:13px 16px;border-radius:0 10px 10px 0;margin:12px 0 14px;font-size:15px;color:var(--text-2);line-height:1.9;}
.note-warn{background:#fffdf5;border:1px solid #f0e2bd;border-radius:12px;padding:15px 17px;margin:16px 0;}
.note-warn-h{font-size:13.5px;font-weight:800;color:#8a6a1f;margin-bottom:8px;}
.note-warn p{font-size:14.5px;margin:0 0 9px;} .note-warn p:last-child{margin:0;}

.note-tbl{width:100%;border-collapse:collapse;margin:12px 0 8px;background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;font-size:14px;}
.note-tbl th{background:#f3f5f8;font-weight:800;font-size:12.5px;color:var(--text-3);text-align:left;padding:9px 13px;}
.note-tbl td{padding:10px 13px;border-top:1px solid var(--border);color:var(--text-2);}
.note-tbl td.y{color:var(--success);font-weight:800;white-space:nowrap;}
.note-tbl td.n{color:#94a3b8;font-weight:700;white-space:nowrap;}

.note-axis{margin:16px 0 18px;}
.note-axis-h{font-size:14.5px;font-weight:800;margin-bottom:9px;display:flex;align-items:center;gap:9px;}
.note-axis-n{font-size:11.5px;font-weight:800;color:var(--primary);background:rgba(36,81,223,.10);border-radius:999px;padding:2px 9px;}
.note-links{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px;}
@media(max-width:640px){.note-links{grid-template-columns:1fr;}}
.note-links a{display:block;border:1px solid var(--border);background:var(--surface);border-radius:10px;padding:9px 12px;text-decoration:none;transition:.14s;}
.note-links a:hover{border-color:var(--primary);}
.note-links b{display:block;font-size:13.5px;color:var(--primary);font-weight:800;}
.note-links span{display:block;font-size:12.5px;color:var(--text-3);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.note-cta{display:block;text-align:center;background:var(--primary);color:#fff;font-weight:800;font-size:15px;text-decoration:none;border-radius:12px;padding:15px 18px;margin:26px 0 8px;}
.note-cta-sub{text-align:center;font-size:12px;color:var(--text-3);}
.note-foot{margin-top:34px;padding-top:16px;border-top:1px solid var(--border);font-size:11.5px;color:#9aa2af;text-align:center;}
.note-more{margin:26px 0 0;} .note-more-h{font-size:13px;font-weight:800;color:var(--text-3);margin-bottom:8px;}