/* 読みもの（/articles）。crefi のルール：白 / #222 / #666 / 罫線 #e5e5e5 / 赤 #C8203F の1色、角丸4px、影と勾配なし */
:root{--red:#C8203F;--red-dark:#A8182F;--ink:#222;--sub:#666;--line:#e5e5e5;--line-strong:#ccc;--hover:#fafafa;--r:4px}
*,*::before,*::after{box-sizing:border-box}*{margin:0}html{-webkit-text-size-adjust:100%}
body{background:#fff;color:var(--ink);font:400 15px/1.8 "Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}img{display:block;max-width:100%;height:auto}
h1,h2,h3,h4{font-weight:700;line-height:1.5;text-wrap:balance;word-break:auto-phrase}p,li,dd{text-wrap:pretty;word-break:auto-phrase}ul,ol{padding-left:1.4em}
.ar-in{width:min(1120px,calc(100% - 32px));margin-inline:auto}
.ar-util{border-bottom:1px solid var(--line);color:var(--sub);font-size:12px}.ar-util .ar-in{display:flex;justify-content:space-between;gap:12px;padding:6px 0}
.ar-site-header{border-bottom:1px solid var(--line)}.ar-site-header .ar-in{display:flex;min-height:64px;align-items:center;justify-content:space-between;gap:16px}.ar-site-header nav{display:flex;align-items:center;gap:20px;font-size:14px;font-weight:700}
.ar-site-footer{margin-top:80px;padding:32px 0 40px;border-top:1px solid var(--line);color:var(--sub);font-size:12px}.ar-site-footer nav{display:flex;flex-wrap:wrap;gap:8px 18px;margin-bottom:10px;color:var(--ink);font-size:13px}
.ar-button{display:inline-flex;min-height:44px;padding:0 22px;border:1px solid var(--red);border-radius:var(--r);background:var(--red);color:#fff;align-items:center;justify-content:center;font-weight:700}.ar-button:hover{background:var(--red-dark);text-decoration:none}.ar-button.small{min-height:36px;padding:0 14px;font-size:13px}.ar-button.block{display:flex;width:100%;margin-top:12px}.ar-button.outline{background:#fff;color:var(--red)}.ar-button.outline:hover{background:var(--hover)}
.ar-breadcrumb{display:flex;flex-wrap:wrap;gap:6px;margin:24px 0 18px;color:var(--sub);font-size:12px}.ar-breadcrumb a{text-decoration:underline;text-underline-offset:3px}
.ar-page-title{padding-top:12px;border-top:2px solid var(--ink);font-size:28px}.ar-lead{max-width:62ch;margin-top:10px;color:#444}
.ar-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.ar-tabs a{display:inline-flex;min-height:40px;padding:0 16px;border:1px solid var(--line-strong);border-radius:var(--r);align-items:center;gap:8px;font-size:14px;font-weight:700}.ar-tabs a:hover{border-color:var(--red);color:var(--red);text-decoration:none}.ar-tabs span{color:var(--sub);font-size:12px;font-weight:400}
.ar-group{margin-top:44px}.ar-group>h2{margin-bottom:18px;padding-left:10px;border-left:4px solid var(--red);font-size:19px;line-height:1.4}
.ar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 22px;padding:0;list-style:none}
.ar-card a{display:flex;height:100%;flex-direction:column;gap:10px}.ar-card a:hover{text-decoration:none}.ar-card a:hover strong{text-decoration:underline;text-underline-offset:3px}
.ar-eyecatch{width:100%;aspect-ratio:16/9;border:1px solid var(--line);border-radius:var(--r);background:var(--hover);object-fit:cover}
.ar-card-body{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.ar-card strong{font-size:15px;line-height:1.6}.ar-card time{color:var(--sub);font-size:12px}
.ar-card.compact a{display:grid;grid-template-columns:104px 1fr;gap:10px;align-items:start}.ar-card.compact strong{font-size:13px;line-height:1.55}
.ar-list-compact{display:grid;gap:14px;padding:0;list-style:none}
.ar-chip{display:inline-block;padding:1px 8px;border:1px solid var(--red);border-radius:var(--r);color:var(--red);font-size:11px;font-weight:700;line-height:1.8}.ar-chip.creator{border-color:var(--ink);color:var(--ink)}
.ar-layout{display:grid;grid-template-columns:minmax(0,720px) 300px;gap:56px;justify-content:center;align-items:start}
.ar-header h1{margin:10px 0 8px;font-size:clamp(22px,3vw,28px)}.ar-dates{margin-bottom:18px;color:var(--sub);font-size:12px}
.ar-share{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.ar-share a{display:inline-flex;min-height:34px;padding:0 12px;border:1px solid var(--line-strong);border-radius:var(--r);align-items:center;font-size:12px;font-weight:700}.ar-share a:hover{border-color:var(--ink);text-decoration:none}
.ar-summary{margin:24px 0;padding:18px 20px;border:1px solid var(--red);border-radius:var(--r)}.ar-summary h2,.ar-toc h2{margin-bottom:6px;font-size:14px}.ar-summary h2{color:var(--red)}.ar-summary p{font-size:15px}
.ar-toc{margin:24px 0;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r);background:var(--hover)}.ar-toc ol{font-size:14px}.ar-toc li+li{margin-top:4px}.ar-toc a{text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:3px}
.ar-inline-cta{margin:28px 0;text-align:center}.ar-inline-cta .ar-button{min-width:min(100%,320px);min-height:48px}
.ar-body{font-size:16px;line-height:1.9}.ar-body>p,.ar-body>ul,.ar-body>ol{margin-top:16px}.ar-body li+li{margin-top:6px}
.ar-body h2{margin:52px 0 16px;padding-top:12px;border-top:2px solid var(--ink);font-size:clamp(19px,2.4vw,22px);scroll-margin-top:16px}.ar-body h3{margin:30px 0 8px;padding-left:10px;border-left:4px solid var(--red);font-size:17px}
.ar-body a:not(.ar-button),.ar-summary a,.ar-author a{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.ar-note{margin-top:16px;padding:12px 16px;border-left:3px solid var(--line-strong);background:var(--hover);color:#444;font-size:14px}
.ar-table{margin-top:18px;overflow-x:auto}.ar-table table{width:100%;min-width:480px;border-collapse:collapse;font-size:14px;line-height:1.65}.ar-table caption{margin-bottom:6px;color:var(--sub);font-size:12px;text-align:left}.ar-table th,.ar-table td{padding:10px 12px;border:1px solid var(--line-strong);text-align:left;vertical-align:top}.ar-table th{background:var(--hover);white-space:nowrap}
.ar-cta{display:flex;margin:40px 0;padding:22px;border:2px solid var(--red);border-radius:var(--r);align-items:center;justify-content:space-between;gap:20px}.ar-cta p{font-size:14px}.ar-cta strong{display:block;margin-bottom:2px;color:var(--red);font-size:16px}.ar-cta .ar-button{flex:none}
.ar-faq,.ar-sources,.ar-related{margin-top:52px}.ar-faq h2,.ar-sources h2,.ar-related h2{margin-bottom:14px;padding-left:10px;border-left:4px solid var(--red);font-size:18px;line-height:1.4}.ar-faq dt{margin-top:16px;font-weight:700}.ar-faq dt::before{content:"Q. ";color:var(--red)}.ar-faq dd{margin-top:3px;color:#444}
.ar-sources ul{font-size:13px}.ar-sources li+li{margin-top:6px}.ar-sources a{color:var(--sub);text-decoration:underline;word-break:break-all}
.ar-author{margin-top:52px;padding:18px 20px;border:1px solid var(--line-strong);border-radius:var(--r)}.ar-author-label{margin-bottom:10px;color:var(--sub);font-size:12px;font-weight:700}.ar-author>div{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:start}.ar-author-logo{display:grid;width:64px;height:64px;place-items:center;border-radius:50%;background:var(--red);color:#fff;font-size:15px;font-weight:700}.ar-author p{font-size:14px;color:#444}.ar-author strong{display:block;margin-bottom:2px;color:var(--ink);font-size:15px}
.ar-aside{position:sticky;top:20px;display:grid;gap:22px;margin-top:62px}.ar-aside-box{padding:18px;border:1px solid var(--line);border-radius:var(--r)}.ar-aside-box h2{margin-bottom:10px;font-size:15px}.ar-aside-box>p{color:#444;font-size:13px}
.ar-figure{margin:30px 0;padding:20px 20px 16px;border:1px solid var(--line-strong);border-radius:var(--r)}.ar-figure-title{display:block;margin-bottom:14px;font-size:14px;font-weight:700}.ar-figure-title::before{display:inline-block;margin-right:8px;padding:0 7px;border-radius:var(--r);background:var(--ink);color:#fff;font-size:11px;vertical-align:2px;content:"図解"}.ar-figure-caption{margin-top:12px;color:var(--sub);font-size:12px}
.dg-steps{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:22px;padding:0;list-style:none}.dg-steps li{position:relative;display:flex;padding:14px 10px 12px;border:1.5px solid var(--ink);border-radius:var(--r);flex-direction:column;align-items:center;gap:6px;text-align:center}.dg-steps li+li::before{position:absolute;top:50%;left:-18px;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:9px solid var(--red);transform:translateY(-50%);content:""}.dg-step-no{display:grid;width:24px;height:24px;place-items:center;border-radius:50%;background:var(--red);color:#fff;font-size:12px;font-weight:700}.dg-steps strong{font-size:14px;line-height:1.5}.dg-steps small{color:var(--sub);font-size:12px;line-height:1.5}
.dg-compare,.dg-branches{display:grid;gap:14px}.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.dg-col{border:1.5px solid var(--line-strong);border-radius:var(--r);overflow:hidden}.dg-col h4{padding:9px 12px;background:var(--hover);font-size:14px;text-align:center}.dg-col.good{border-color:var(--ink)}.dg-col.good h4{background:var(--ink);color:#fff}.dg-col.bad{border-color:var(--red)}.dg-col.bad h4{background:var(--red);color:#fff}.dg-col ul{padding:12px 12px 12px 1.8em;font-size:14px;line-height:1.65}.dg-col li+li{margin-top:6px}
.dg-scale-bar{display:block;width:100%;height:auto}.dg-scale-list{margin-top:8px;padding:0;list-style:none;border-top:1px solid var(--line)}.dg-scale-list li{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:10px 4px;border-bottom:1px solid var(--line);align-items:baseline}.dg-scale-list b{color:var(--red);font-size:15px}.dg-scale-list strong{display:block;font-size:14px}.dg-scale-list small{display:block;color:var(--sub);font-size:12px;line-height:1.6}
.dg-formula{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center}.dg-term{display:flex;min-width:110px;padding:10px 14px;border:1.5px solid var(--ink);border-radius:var(--r);flex-direction:column;align-items:center;gap:2px}.dg-term b{font-size:19px}.dg-term small{color:var(--sub);font-size:12px}.dg-term.result{border-color:var(--red)}.dg-term.result b{color:var(--red)}.dg-op{color:var(--red);font-size:21px;font-weight:700}
.dg-question{margin:0 auto 16px;padding:10px 14px;border-radius:var(--r);background:var(--ink);color:#fff;font-weight:700;text-align:center}.dg-branch-item{display:flex;padding:12px;border:1.5px solid var(--line-strong);border-radius:var(--r);flex-direction:column;gap:6px}.dg-condition{align-self:flex-start;padding:0 8px;border:1px solid var(--line-strong);border-radius:var(--r);font-size:12px;font-weight:700}.dg-branch-item strong{font-size:14px;line-height:1.6}.dg-branch-item small{color:var(--sub);font-size:12px;line-height:1.6}
@media(max-width:1023px){.ar-layout{grid-template-columns:minmax(0,1fr);gap:40px}.ar-aside{position:static;margin-top:0}.ar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.ar-util .ar-in{flex-direction:column;gap:0}.ar-site-header nav a:not(.ar-button){display:none}.ar-site-header nav a[href="/articles"]{display:inline}.ar-grid{grid-template-columns:minmax(0,1fr);gap:22px}.ar-grid .ar-card a{display:grid;grid-template-columns:128px 1fr;gap:12px;align-items:start}.ar-grid .ar-card strong{font-size:14px}.ar-cta{flex-direction:column;align-items:stretch}.ar-figure{padding:16px 14px}.dg-steps{grid-auto-flow:row;gap:18px}.dg-steps li+li::before{top:-14px;left:50%;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid var(--red);border-bottom:0;transform:translateX(-50%)}.cols-2,.cols-3{grid-template-columns:minmax(0,1fr)}.dg-term{min-width:0}}
