/* Frame Lightの共通表現。記事の本文・表・注意色・購入リンクの構造を維持する。 */
:root {
 --bg:#f7fafc; --surface:#fff; --surface-2:#f0f7fa; --surface-3:#e0e9ef;
 --text:#102f45; --text-body:#38566b; --muted:#536c7d; --faint:#536c7d;
 --border:#e0e9ef; --accent:#007f96; --accent-hover:#006c81;
 --accent-text:#006b80; --accent-dim:#e3f7fb; --accent-border:#9edbe5;
 --link:#007b91; --link-soft:#007b91; --link-soft-hover:#005f73;
 --on-accent:#fff;
}
body {font-family:"BIZ UDPGothic","Yu Gothic UI","Meiryo",sans-serif;background:#f7fafc;}
.container {background:transparent;border:0;box-shadow:none;}
.container.doc,.container.article,.container.list {max-width:940px;}
.site-header {min-height:88px;margin-bottom:42px;background:transparent;border-bottom:1px solid var(--border);gap:18px;}
.site-brand,.doc .site-brand {display:inline-flex;align-items:center;gap:9px;color:#102f45;font-size:25px;font-weight:800;letter-spacing:-1.1px;text-decoration:none;white-space:nowrap;}
.site-brand img {width:33px;height:33px;flex:none;border-radius:9px;box-shadow:0 4px 16px #16b6d426;}
.site-brand .brand-dot {color:#008da9;}
.site-nav > a {border-radius:7px;}
.site-nav > .site-nav-cta {background:#12354b;color:white;padding-inline:14px;}
.site-nav > .site-nav-cta:hover {background:#20526c;}
.article h1,.doc h1,.list h1 {font-size:clamp(26px,3.2vw,36px);font-weight:750;line-height:1.55;letter-spacing:-.045em;max-width:25em;}
.article h2,.doc h2 {color:#12354b;font-size:22px;font-weight:700;border:0;margin-top:42px;padding-bottom:0;}
.article h3 {margin-top:28px;}
.article .lead {font-size:17px;line-height:1.9;}
.article p,.article li,.article .note-box,.doc p,.doc dd {overflow-wrap:anywhere;}
.article .toc,.article .note-box {border:0;border-radius:12px;background:#edf4f8;padding:20px 24px;}
.article .callout {border-radius:12px;}
.article .verdict {border-radius:14px;overflow:hidden;box-shadow:0 8px 28px #12354b0a;}
.article .cta,.navlink {border-radius:8px;}
.article .cta {background:#ddf7fb;border-color:#a7dae5;color:#006b80;font-weight:700;padding:13px 18px;}
.article .cta:hover {background:#c8f0f6;}
.list .art-card {border:0;border-radius:14px;box-shadow:0 6px 24px #12354b0a;padding:22px;margin-bottom:18px;}
.list .art-card:hover {background:#effaff;box-shadow:0 8px 26px #16b6d416;}
.list .art-card .t {font-size:17px;font-weight:700;}
.list .art-card .gauge {border-color:var(--border);}
footer {margin-top:54px;padding-top:24px;border-color:var(--border);font-size:13px;}
@media(max-width:640px) {
 .container {padding-inline:20px;}
 .site-header {margin-inline:0;padding:12px 0;min-height:76px;gap:10px;flex-wrap:wrap;margin-bottom:30px;}
 .site-brand,.doc .site-brand {font-size:23px;}
 .site-brand img {width:29px;height:29px;}
 .site-nav {justify-content:flex-start;gap:2px;}
 .site-nav > a {font-size:11px;padding:8px;}
 .site-nav > .site-nav-cta {padding-inline:10px;}
 .article h1,.doc h1,.list h1 {font-size:25px;}
 .article h2,.doc h2 {font-size:21px;margin-top:34px;}
 .article .toc,.article .note-box {padding:16px;}
 .article table {background:linear-gradient(to right,#f7fafc 40%,#f7fafc00) left / 48px 100%,linear-gradient(to left,#f7fafc 40%,#f7fafc00) right / 48px 100%,radial-gradient(farthest-side at 0 50%,#007f9638,#007f9600) left / 18px 100%,radial-gradient(farthest-side at 100% 50%,#007f9638,#007f9600) right / 18px 100%;background-repeat:no-repeat;background-attachment:local,local,scroll,scroll;}
 .list .art-card {padding:18px;}
}