/* article 固有の変数 */
:root{
  --img-phead:url("../img/p-bright.webp");
}


/* ===== 記事ページ ===== */
.ahead{background:var(--frame);padding:34px 0 30px;}
.ahead-in{max-width:760px;margin:0 auto;padding-inline:var(--pad);}
.crumb{font-size:11.5px;font-family:var(--fu);letter-spacing:.04em;color:var(--muted);margin:0 0 18px;}
.crumb a{text-decoration:none;color:var(--navy);}
.crumb a:hover{text-decoration:underline;}
.crumb span{margin:0 7px;opacity:.55;}
.ameta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;}
.cat{font-size:10.5px;font-weight:900;color:#fff;background:var(--navy);border-radius:99px;padding:4px 12px;}
.date{font-size:11.5px;font-weight:700;color:var(--muted);font-family:var(--fu);}
.ahead h1{font-size:clamp(23px,3.6vw,34px);font-weight:900;line-height:1.6;letter-spacing:.02em;margin:0 0 14px;}
.ahead p.lede{font-size:14px;line-height:2;color:var(--muted);margin:0;}

/* 本文 */
.body{max-width:760px;margin:0 auto;padding:0 var(--pad);}
.toc{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:22px 22px 24px;margin:0 0 40px;}
.toc b{display:block;font-size:13px;font-weight:900;color:var(--navy);margin:0 0 12px;letter-spacing:.04em;}
.toc ol{margin:0;padding:0 0 0 20px;}
.toc li{font-size:13.5px;line-height:1.5;padding:6px 0;}
.toc a{color:var(--ink);text-decoration:none;}
.toc a:hover{color:var(--navy);text-decoration:underline;}

.body h2{font-size:clamp(19px,2.8vw,25px);font-weight:900;line-height:1.6;margin:48px 0 18px;padding-left:14px;border-left:5px solid var(--blue);scroll-margin-top:calc(var(--hdr) + 14px);text-align:left;letter-spacing:.01em;}
.body h3{text-align:left;}
.body h3{font-size:17px;font-weight:900;line-height:1.6;margin:32px 0 12px;}
.body p{font-size:14.5px;line-height:2.1;margin:0 0 18px;}
.body strong{color:var(--navy);font-weight:900;}
.body ul{margin:0 0 20px;padding:0;list-style:none;}
.body ul li{font-size:14px;line-height:1.95;padding:7px 0 7px 24px;position:relative;}
.body ul li::before{content:"";position:absolute;left:5px;top:16px;width:7px;height:7px;border-radius:50%;background:var(--blue-l);}
.note{border:1px solid var(--line);border-left:4px solid var(--blue-l);border-radius:8px;background:var(--surface);padding:18px 20px;margin:0 0 24px;}
.note p{font-size:13.5px;line-height:2;margin:0;color:var(--muted);}
.note p+p{margin-top:10px;}

.cwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:12px;background:var(--surface);margin:0 0 12px;}
table.cmp{border-collapse:collapse;width:100%;min-width:560px;font-size:13.5px;}
table.cmp th,table.cmp td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle;}
table.cmp thead th{background:var(--navy);color:#fff;font-size:12.5px;font-weight:900;border-bottom:0;}
table.cmp thead th.me{background:var(--blue);}
table.cmp tbody th{text-align:left;font-weight:900;font-size:13px;white-space:nowrap;background:var(--frame);}
table.cmp td.me{background:#F2F7FE;font-weight:800;color:var(--navy);}
table.cmp tbody tr:last-child th,table.cmp tbody tr:last-child td{border-bottom:0;}
.shint{display:none;font-size:11.5px;color:var(--muted);text-align:right;margin:0 0 7px;}
@media (max-width:900px){.shint{display:block;}}

.inbox{border:2px solid var(--navy);border-radius:12px;padding:22px 22px 24px;margin:30px 0 34px;background:var(--surface);}
.inbox b{display:block;font-size:14.5px;font-weight:900;color:var(--navy);margin:0 0 10px;}
.inbox p{font-size:13.5px;line-height:1.95;margin:0 0 14px;color:var(--muted);}
.inbox a{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:900;color:var(--navy);text-decoration:none;border-bottom:2px solid var(--blue-l);padding-bottom:2px;}
.inbox a i{font-style:normal;font-size:10px;color:var(--blue);}

.aftr{margin:44px 0 0;padding:22px 0 0;border-top:1px solid var(--line);}
.aftr p{font-size:12.5px;color:var(--muted);line-height:1.9;margin:0;}

/* 関連記事 */
.rel{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.rc{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:18px 18px 16px;}
.rc .m{font-size:10.5px;font-weight:900;color:#B4741A;background:#FFF2D6;border-radius:3px;padding:2px 7px;display:inline-block;margin:0 0 9px;}
.rc h3{font-size:15px;font-weight:900;line-height:1.6;margin:0 0 7px;}
.rc p{font-size:12.5px;line-height:1.9;color:var(--muted);margin:0;}

/* 最終CTA */
.fin{background:var(--deep);color:#fff;text-align:center;}
.fin h2{color:#fff;}
.fin p{opacity:.9;font-size:14px;line-height:2;}
.fin .fb{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--coral);color:#fff;text-decoration:none;font-weight:900;font-size:16px;border-radius:99px;padding:17px 44px;margin-top:22px;box-shadow:0 8px 22px rgba(239,136,128,.4);transition:transform .2s,box-shadow .2s;}
.fin .fb:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(239,136,128,.5);}
.fin .sub{display:block;margin-top:14px;font-size:12.5px;opacity:.75;}
.fin .sub a{color:var(--blue-l);font-weight:700;}

@media (max-width:900px){
  .ahead{padding:26px 0 24px;}
  .body p{font-size:14px;}
  .body h2{margin-top:38px;}
  .rel{grid-template-columns:1fr;}
  .fin .fb{font-size:15px;padding:16px 30px;width:100%;box-sizing:border-box;}
}