:root{--bg:#F6F8F9;--surface:#FFFFFF;--ink:#1F2933;--sub:#5A6672;--rule:#D3DAE0;--accent:#0A55E8;--accent-ink:#FFFFFF;--band:#0A55E8;--band-ink:#FFFFFF;--h3bg:#FFD592;--note:#EAF0F7;--concl-bg:#EDFBF5;--concl-bd:#0E7C66;--memo-bg:#FFF4E5;--memo-bd:#E8731A;--final-bg:#F0F6FF;--final-bd:#2B5FD9;--q-bg:#C9EDF2;--a-bg:#FFD6D6;--good-bg:#EFFBF3;--good-bd:#2FA862;--warn-bg:#FFFAE6;--warn-bd:#E39A15;--cta1:#F04B4B;--cta2:#B91C1C}
@media (prefers-color-scheme:dark){:root{--bg:#141A21;--surface:#1B232C;--ink:#E7ECF1;--sub:#9AA7B4;--rule:#2F3A46;--accent:#8FB0F0;--accent-ink:#0F1620;--band:#2457C5;--h3bg:#5A4220;--note:#1F2A37;--concl-bg:#12302A;--concl-bd:#3FBFA3;--memo-bg:#33261A;--memo-bd:#E8933F;--final-bg:#18263B;--final-bd:#6F9BF0;--q-bg:#1E4A52;--a-bg:#4A2A2E;--good-bg:#14301F;--good-bd:#4CC27F;--warn-bg:#352D12;--warn-bd:#E0AE3C;--cta1:#E24545;--cta2:#A31919}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:4.5rem}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif;font-size:1.0625rem;line-height:1.95;letter-spacing:.02em}
a{color:var(--accent);text-underline-offset:.2em}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
.wrap{max-width:42rem;margin:0 auto;padding:0 1.25rem}
header.site{position:sticky;top:0;z-index:5;background:var(--surface);border-bottom:1px solid var(--rule)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.5rem;flex-wrap:wrap}
header.site .brand{font-weight:900;font-size:1.05rem;color:var(--ink);text-decoration:none}
header.site nav{display:flex;gap:1.1rem;font-size:.9rem}
header.site nav a{color:var(--ink);text-decoration:none;padding:.5rem 0}
header.site nav a:hover{text-decoration:underline}
.hero{padding:3rem 0 2rem}
.genko{display:flex;flex-direction:column;gap:.35rem;margin:0 0 1.25rem}
.genko .row{display:flex}
.genko span{display:inline-block;width:2.05rem;height:2.05rem;line-height:2.05rem;text-align:center;border:1px solid var(--rule);margin-left:-1px;background:var(--surface);font-weight:900;font-size:1.3rem}
.genko .row span:first-child{margin-left:0}
@media (min-width:30rem){.genko span{width:2.6rem;height:2.6rem;line-height:2.6rem;font-size:1.65rem}}
.hero p{margin:0;color:var(--sub);font-size:.98rem}
h1,h2,h3{line-height:1.5;letter-spacing:.02em}
h1{font-size:1.6rem;font-weight:900;margin:1.2rem 0 1rem}
h2{position:relative;font-size:1.22rem;font-weight:900;margin:3.2rem 0 1.6rem;padding:.75rem 1rem;background:var(--band);color:var(--band-ink);text-align:center}
h2::after{content:"";position:absolute;left:50%;bottom:-.6rem;margin-left:-.6rem;border:.6rem solid transparent;border-bottom:0;border-top-color:var(--band)}
h3{font-size:1.08rem;font-weight:900;margin:2.2rem 0 1rem;padding:.6rem 1rem;background:var(--h3bg);text-align:center;position:relative;color:var(--ink)}
h3::after{content:"";position:absolute;left:50%;bottom:-.45rem;margin-left:-.45rem;border:.45rem solid transparent;border-bottom:0;border-top-color:var(--h3bg)}
p,ul,ol{margin:0 0 1.25rem}
li{margin-bottom:.4rem}
.list{list-style:none;padding:0;margin:0}
.list li{margin:0;border-top:1px solid var(--rule)}
.list li:last-child{border-bottom:1px solid var(--rule)}
.list a{display:block;padding:1.1rem 0;text-decoration:none;color:var(--ink)}
.list a:hover .t{text-decoration:underline}
.list .cat{display:block;font-size:.8rem;color:var(--sub)}
.list .t{font-weight:700;font-size:1.05rem;line-height:1.6}
.list .d{display:block;font-size:.88rem;color:var(--sub);line-height:1.7;margin-top:.3rem}
.pr{background:var(--note);border-left:4px solid var(--accent);padding:.7rem 1rem;font-size:.85rem;line-height:1.7;margin:1rem 0 1.5rem}
.meta{font-size:.82rem;color:var(--sub);margin:0}
.toc{background:var(--surface);border:1px solid var(--rule);border-radius:8px;padding:1rem 1.25rem;margin:1.75rem 0;font-size:.95rem}
.toc b{display:block;margin-bottom:.4rem}
.toc ol{margin:0;padding-left:1.3rem}
.toc li{margin-bottom:.15rem}
.table-wrap{overflow-x:auto;margin:0 0 1.5rem}
table{border-collapse:collapse;width:100%;min-width:28rem;font-size:.93rem;line-height:1.7;background:var(--surface)}
th,td{border:1px solid var(--rule);padding:.55rem .75rem;text-align:left;vertical-align:top}
th{background:var(--note)}
.box-title{font-weight:900;margin:0 0 .5rem;font-size:1rem}
.conclusion{background:var(--concl-bg);border:3px solid var(--concl-bd);border-radius:10px;padding:1.1rem 1.25rem;margin:1.75rem 0}
.conclusion .box-title{color:var(--concl-bd)}
.conclusion ul,.conclusion ol,.conclusion p{margin-bottom:.5rem}
.memo{background:var(--memo-bg);border:2px solid var(--memo-bd);border-radius:10px;padding:1.1rem 1.1rem .6rem;margin:1.75rem 0}
.memo .box-title{color:var(--memo-bd)}
.memo .note{font-size:.8rem;color:var(--sub);margin:-.2rem 0 .8rem}
.final{background:var(--final-bg);border:2px solid var(--final-bd);border-radius:10px;padding:1.1rem 1.25rem;margin:1.75rem 0}
.final .box-title{color:var(--final-bd)}
.final p:last-child{margin-bottom:0}
.two{display:grid;grid-template-columns:1fr;gap:1rem;margin:1.75rem 0}
@media (min-width:34rem){.two{grid-template-columns:1fr 1fr}}
.two>div{border:2px solid;border-radius:10px;padding:1rem 1.1rem .5rem;font-size:.95rem;line-height:1.8}
.two .good{background:var(--good-bg);border-color:var(--good-bd)}
.two .warn{background:var(--warn-bg);border-color:var(--warn-bd)}
.two .box-title{font-size:.98rem}
.two ul{padding-left:1.2rem}
.qa{margin:1.75rem 0}
.qa .row{display:flex;align-items:flex-start;gap:.7rem;margin-bottom:.9rem}
.qa .row.a{flex-direction:row-reverse}
.qa .av{flex:0 0 3.2rem;text-align:center;font-size:.7rem;color:var(--sub);line-height:1.3}
.qa .av i{display:flex;align-items:center;justify-content:center;width:2.7rem;height:2.7rem;margin:0 auto .15rem;border-radius:50%;font-style:normal;font-weight:900;font-size:1.15rem;color:var(--ink)}
.qa .q .av i{background:#FFE0B0;border:2px solid #F0B968}
.qa .a .av i{background:#D4E3FF;border:2px solid #8FB0F0}
.qa .bub{position:relative;padding:.8rem 1rem;border-radius:10px;font-size:.95rem;line-height:1.8;color:var(--ink)}
.qa .q .bub{background:var(--q-bg)}
.qa .a .bub{background:var(--a-bg)}
.qa .bub p{margin:0}
.cta{margin:2.25rem 0;text-align:center}
.cta a.pill{display:block;text-decoration:none;font-weight:900;font-size:1.05rem;line-height:1.5;color:#fff;padding:1.05rem 1.2rem;border-radius:999px;background:linear-gradient(180deg,var(--cta1),var(--cta2));box-shadow:0 3px 0 rgba(0,0,0,.18)}
.cta a.pill:focus-visible{outline-color:var(--ink)}
.cta .alt{margin:.8rem 0 0;font-size:.88rem}
.cta small{display:block;margin-top:.55rem;color:var(--sub);font-size:.75rem;line-height:1.6}
.related{margin-top:3rem}
footer.site{margin-top:4rem;border-top:1px solid var(--rule);background:var(--surface);padding:2rem 0;font-size:.85rem;color:var(--sub)}
footer.site nav{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin-bottom:.8rem}
footer.site a{color:var(--sub)}
main{padding-bottom:1rem}
@media (max-width:40rem){header.site{position:static}header.site .wrap{padding-top:.5rem;padding-bottom:.25rem}}
