:root{--ink:#3b2a20;--muted:#7a6555;--line:#f0e1d2;--bg:#fffaf3;--soft:#fff3e6;--accent:#e07b39;--w:#fff;--r:14px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;line-height:1.8;font-size:16px}
a{color:var(--accent)}img{max-width:100%;height:auto}
.wrap{max-width:72rem;margin:0 auto;padding:0 16px}
h1,h2,h3{font-family:"Zen Maru Gothic","Noto Sans JP",sans-serif;line-height:1.4;margin:0}
h1{font-size:1.6rem;font-weight:900;margin:1rem 0 .6rem}h1 small{display:block;font-size:.85rem;color:var(--muted);font-family:"Noto Sans JP",sans-serif;font-weight:700;margin-top:.3rem}
h2{font-size:1.2rem;font-weight:900;margin:2rem 0 .8rem;padding-left:.7rem;border-left:5px solid var(--accent)}
section{margin:0 0 1rem}p{margin:.5rem 0}.lead{font-size:1rem}.note{font-size:.8rem;color:var(--muted)}.kicker{font-size:.78rem;color:var(--muted);font-weight:700;margin:0}
.sp{display:none}@media(max-width:600px){.sp{display:inline}}
header.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;gap:1rem;padding:.5rem 16px;min-height:60px}
header.site .logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}header.site .logo img{display:block;width:40px;height:40px}
.logo-t b{display:block;font-family:"Zen Maru Gothic",sans-serif;font-size:1.25rem;font-weight:900;line-height:1.1}.logo-t small{display:block;font-size:.62rem;color:var(--accent);letter-spacing:.08em}
.gnav{margin-left:auto;display:flex;align-items:center;gap:1.1rem}.gnav a{text-decoration:none;color:var(--ink);font-weight:700;font-size:.88rem}.gnav a[aria-current]{color:var(--accent)}
.nav-toggle,.burger{display:none}
@media(max-width:820px){
 .logo-t small{display:none}
 .burger{display:grid;place-items:center;width:2.6rem;height:2.6rem;margin-left:auto;cursor:pointer;z-index:60}
 .burger span,.burger span::before,.burger span::after{display:block;width:1.5rem;height:2.5px;border-radius:2px;background:var(--ink);content:"";position:relative;transition:.2s}
 .burger span::before{position:absolute;top:-7px}.burger span::after{position:absolute;top:7px}
 .gnav{position:fixed;inset:0;background:var(--ink);flex-direction:column;justify-content:center;gap:1.6rem;transform:translateX(100%);transition:transform .25s;margin:0}
 .gnav a{color:#fff;font-size:1.15rem}.nav-toggle:checked~.gnav{transform:none}
 .nav-toggle:checked~.burger span{background:transparent}.nav-toggle:checked~.burger span::before{top:0;transform:rotate(45deg);background:#fff}.nav-toggle:checked~.burger span::after{top:0;transform:rotate(-45deg);background:#fff}
}
.crumbs{font-size:.78rem;color:var(--muted);margin:.8rem 0 0;white-space:nowrap;overflow-x:auto}.crumbs a,.crumbs span{margin-right:.3rem}.crumbs a::after{content:"›";margin-left:.3rem;color:var(--muted)}
.pr{font-size:.74rem;color:var(--muted);background:var(--w);border:1px solid var(--line);border-radius:8px;padding:.3rem .7rem;margin:.6rem 0 0}
.howto{background:var(--w);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.2rem;margin:1.5rem 0}.howto h2{margin-top:.2rem}.howto ul{padding-left:1.2rem;margin:.4rem 0}.howto li{margin:.3rem 0;font-size:.92rem}
.tscroll{overflow:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--w)}
table.facts{border-collapse:collapse;width:100%;font-size:.9rem}table.facts th,table.facts td{padding:.55rem .8rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}table.facts th{width:14rem;background:#f9fafb;font-weight:700;white-space:nowrap}table.facts td.num{color:#1d4ed8;font-weight:800}
table.rubric th{width:auto}table.rubric thead th{font-size:.78rem;color:var(--muted)}
.product .p-head{display:grid;grid-template-columns:260px 1fr;gap:1.4rem;background:var(--w);border:1px solid var(--line);border-radius:var(--r);padding:1.2rem;margin:1rem 0}
.p-img{aspect-ratio:1/1;background:#f9fafb;border:1px solid var(--line);border-radius:10px;overflow:hidden}.p-img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.p-main h1{font-size:1.35rem;margin:.2rem 0 .6rem}
.p-score{display:inline-flex;align-items:baseline;gap:.2rem;border-radius:10px;padding:.3rem .8rem;margin:0 0 .6rem;font-weight:900}.p-score b{font-size:1.8rem}.p-score small{font-size:.8rem}
.p-score.good{background:#ecfdf5;color:#15803d}.p-score.mid{background:#fff7ed;color:#c2410c}
.p-nums{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:.4rem 0 .8rem;max-width:26rem}.p-nums div{background:#f9fafb;border:1px solid var(--line);border-radius:10px;padding:.5rem .7rem}.p-nums dt{font-size:.7rem;color:var(--muted);font-weight:700}.p-nums dd{margin:0;font-size:1.2rem;font-weight:900;color:#1d4ed8}
.p-btns{display:flex;gap:.6rem;flex-wrap:wrap;margin:.4rem 0}.p-btns .rk-btn{padding:.7rem 1.3rem}
.prtag{font-size:.62rem;background:#fff;color:#111;border-radius:4px;padding:0 .3rem;margin-left:.5rem;vertical-align:middle}
.breakdown{list-style:none;margin:0;padding:0;background:var(--w);border:1px solid var(--line);border-radius:var(--r)}.breakdown li{display:grid;grid-template-columns:12rem 1fr 4rem;gap:.3rem 1rem;align-items:center;padding:.6rem 1rem;border-bottom:1px solid var(--line);font-size:.9rem}.breakdown li:last-child{border:0}
.breakdown .bar{display:block;height:.6rem;background:#f3f4f6;border-radius:999px;overflow:hidden}.breakdown .bar i{display:block;height:100%;background:#1d4ed8;border-radius:999px}
.breakdown .bp{font-weight:900;color:#1d4ed8;text-align:right}.breakdown .bp small{color:var(--muted);font-weight:400}.breakdown .bw{grid-column:2/4;font-size:.78rem;color:var(--muted)}
@media(max-width:720px){.product .p-head{grid-template-columns:1fr}.p-img{max-width:16rem;margin:0 auto}.breakdown li{grid-template-columns:1fr 4rem}.breakdown .bar{grid-column:1/3}.breakdown .bw{grid-column:1/3}table.facts th{width:9rem;white-space:normal}}
footer.site{margin-top:3rem;border-top:1px solid var(--line);background:var(--w)}footer.site .wrap{padding:1.5rem 16px 2rem}
.fcols{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1rem}.fcols b{display:block;font-size:.8rem;color:var(--muted);margin-bottom:.3rem}.fcols a{display:block;font-size:.88rem;color:var(--ink);text-decoration:none;margin:.2rem 0}
@media(max-width:600px){.fcols{grid-template-columns:1fr}}
footer .src{font-size:.74rem;color:var(--muted)}footer .op{font-size:.78rem;color:var(--muted)}
.more{margin:1.2rem 0}
