:root{--bg:#f6f2e9;--ink:#1d2433;--sub:#5b6478;--line:#d9d2c0;--ai:#1f3a5f;--acc:#b5532f;--card:#fffdf8}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.95 "Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif}
a{color:var(--ai)}
.top{background:var(--ai);color:#f6f2e9;text-align:center;padding:20px 16px 36px}
.top .ret{display:block;text-align:left;color:#cfd8e8;font:13px sans-serif;max-width:760px;margin:0 auto 14px}
.mark{color:#e8c98f;width:120px;margin:0 auto}
.top h1{margin:6px 0 0;font-size:34px;letter-spacing:.12em}
.sub{margin:0;color:#e8c98f;letter-spacing:.3em}
.lead{max-width:34em;margin:16px auto 0;font-size:15px;line-height:1.9;text-align:left}
main{max-width:760px;margin:0 auto;padding:20px 16px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.chip{border:1px solid var(--ai);background:none;color:var(--ai);padding:4px 14px;border-radius:99px;font:14px sans-serif;cursor:pointer}
.chip.on{background:var(--ai);color:#fff}
.list{display:grid;gap:12px}
.card{display:block;text-decoration:none;color:inherit;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--acc);padding:14px 16px;border-radius:4px}
.card small{color:var(--sub);font:12px sans-serif}
.card h3{margin:4px 0;font-size:18px;line-height:1.6}
.card p{margin:0;color:var(--sub);font-size:14px;line-height:1.7}
.hero{padding:8px 0 6px;border-bottom:1px solid var(--line)}
.hero .back{font:13px sans-serif}
.meta{font:13px sans-serif;color:var(--sub);margin-top:14px}
.badge{display:inline-block;border:1px solid var(--acc);color:var(--acc);padding:0 8px;border-radius:99px;margin-left:6px;font-size:12px}
h1.t{font-size:26px;line-height:1.5;margin:8px 0}
.q{font-size:17px;color:var(--acc)}
.who{font:13px sans-serif;color:var(--sub)}
h2{font-size:17px;border-bottom:2px solid var(--ai);display:inline-block;margin:28px 0 8px;padding-bottom:2px}
.step{display:flex;gap:12px;margin:14px 0}
.step .n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--ai);color:#fff;text-align:center;font:14px/28px sans-serif}
.step h3{margin:0 0 2px;font-size:16px}.step p{margin:0}
.one{background:var(--ai);color:#fff;padding:14px 18px;border-radius:4px;margin:24px 0;font-size:18px}
.one small{display:block;color:#e8c98f;font:12px sans-serif}
.quote{border-left:3px solid var(--acc);margin:16px 0;padding:4px 14px;background:var(--card)}
.quote cite{display:block;font:12px sans-serif;color:var(--sub)}
details{background:var(--card);border:1px solid var(--line);border-radius:4px;margin:8px 0;padding:6px 12px}
summary{cursor:pointer;font-size:15px}
.panel{background:var(--card);border:1px solid var(--line);padding:10px 14px;border-radius:4px}
.opt{display:block;width:100%;text-align:left;margin:6px 0;padding:8px 12px;border:1px solid var(--ai);background:#fff;border-radius:4px;font:inherit;cursor:pointer}
.opt.ok{background:#dcebdc;border-color:#3f7a3f}.opt.ng{background:#f3dcd6;border-color:var(--acc)}
.why{display:none;font-size:14px;color:var(--sub)}.why.show{display:block}
footer{text-align:center;font:13px sans-serif;color:var(--sub);padding:28px 16px 40px;border-top:1px solid var(--line);margin-top:30px}
.ev dt{font:bold 13px sans-serif;margin-top:6px}.ev dd{margin:0}

.fig{margin:10px 0 4px}.fig img{display:block;width:100%;height:auto;border-radius:6px;box-shadow:0 6px 16px -8px rgba(40,30,10,.5)}.fig figcaption{font:11px sans-serif;color:var(--sub);text-align:right;margin-top:4px}
/* 章ページ：柱の色 */
body[data-p="A"]{--pc:#d08a2e}body[data-p="B"]{--pc:#3f78b5}body[data-p="C"]{--pc:#c24f3f}body[data-p="D"]{--pc:#7a5fb0}body[data-p="E"]{--pc:#2f9482}body[data-p="F"]{--pc:#cc5c85}body[data-p="G"]{--pc:#8a9a30}body[data-p="H"]{--pc:#8a6a3a}
body[data-p] h2{border-bottom-color:var(--pc)}body[data-p] .step .n{background:var(--pc)}body[data-p] .one{border-left-color:var(--pc)}
body[data-p] .one{border-left:6px solid var(--pc)}
.nxg{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:8px 0 24px}
.nxg .tcard{display:block;text-decoration:none;color:inherit;background:#fffaf0;border-radius:6px;border-top:3px solid var(--pc,#8a7c5c);box-shadow:0 1px 0 #d8cdb3,0 8px 18px -12px rgba(40,30,10,.45);padding:12px 16px 14px}
.nxg .tcard:hover{box-shadow:0 1px 0 #d8cdb3,0 14px 24px -12px rgba(40,30,10,.55)}
.nxg small{font:12px sans-serif;color:#7a6f58}.nxg h3{margin:3px 0 6px;font-size:16px;line-height:1.55}.nxg .qq{margin:0;font-size:14px;line-height:1.7;color:#4a4f5e}
.nxg [data-p],.nxg .tcard[data-p]{}
.nxg .tcard[data-p="A"]{--pc:#d08a2e}.nxg .tcard[data-p="B"]{--pc:#3f78b5}.nxg .tcard[data-p="C"]{--pc:#c24f3f}.nxg .tcard[data-p="D"]{--pc:#7a5fb0}.nxg .tcard[data-p="E"]{--pc:#2f9482}.nxg .tcard[data-p="F"]{--pc:#cc5c85}.nxg .tcard[data-p="G"]{--pc:#8a9a30}
.nxg .tcard[data-p="H"]{--pc:#8a6a3a}
.rep{margin:36px 0 8px;padding-top:14px;border-top:1px solid #d8cdb3;font:13px/1.8 sans-serif;color:#6b6250}