/* =====================================================================
   要 -KANAME- ／ 覚書（/blog/）の組版
   設計トークン・body・.wrap・.seal・.btn は /assets/kaname.css が持つ。
   ここにあるのは一覧と記事本文の組版だけ。

   料金表・納期表・エリア表の意匠はここに持たない ―― それらは傘（LP）の
   持ち物で、覚書側に器があると写しが生まれる。
   ===================================================================== */

/* ---- ブランド行とパンくず ---- */
.b-top{border-bottom:1px solid var(--line);background:var(--washi-2)}
.b-top-in{display:flex;align-items:center;gap:22px;flex-wrap:wrap;padding:20px 40px}
.b-brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.b-brand-t{display:flex;flex-direction:column;gap:1px}
.b-brand-t .name{font-family:var(--mincho);font-weight:700;font-size:17px;letter-spacing:.06em;line-height:1.2;color:var(--sumi)}
.b-brand-t .latin{font-family:var(--mono);font-size:9.5px;letter-spacing:.3em;color:var(--teal-soft)}
.b-crumb{margin-left:auto;font-size:12.5px;color:var(--sumi-soft);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.b-crumb a{color:var(--teal);text-decoration:none;border-bottom:1px solid var(--line)}
.b-crumb .sep{color:var(--line)}
.b-crumb [aria-current]{color:var(--sumi-soft)}

/* ---- 見出し部（記事・一覧で共用） ---- */
.b-head{padding:56px 0 0;max-width:740px}
.b-cat{font-family:var(--mono);font-size:11px;letter-spacing:.18em;margin:0 0 18px}
.b-cat a{color:var(--shu);text-decoration:none;border-bottom:1px solid var(--shu-pale)}
.b-head h1{font-family:var(--mincho);font-weight:700;font-size:33px;line-height:1.58;
  letter-spacing:.01em;margin:0 0 22px;color:var(--sumi);text-wrap:pretty}
.b-lead{font-size:15.5px;line-height:1.95;color:var(--sumi-soft);margin:0}

/* ---- 日付3種（公開・更新・法令の確認日） ---- */
.b-dates{display:flex;flex-wrap:wrap;gap:10px 30px;margin:0;padding:18px 0 0;
  border-top:1px solid var(--line)}
.b-dates>div{display:flex;align-items:baseline;gap:10px}
.b-dates dt{font-size:11px;letter-spacing:.1em;color:var(--sumi-soft)}
.b-dates dd{margin:0;font-size:13.5px;color:var(--sumi)}
.b-dates .checked dd{color:var(--shu-deep)}

/* ---- 記事本文（許容タグは ARTICLE_SPEC.md の範囲） ---- */
.b-body{padding:38px 0 8px;font-size:16px;line-height:2.0}
.b-body h2{font-family:var(--mincho);font-weight:600;font-size:23px;line-height:1.6;
  margin:52px 0 16px;padding-bottom:10px;border-bottom:1px solid var(--line);color:var(--sumi)}
.b-body h3{font-family:var(--mincho);font-weight:600;font-size:18px;line-height:1.7;
  margin:36px 0 10px;color:var(--sumi)}
.b-body h2:first-child,.b-body h3:first-child{margin-top:0}
.b-body p{margin:0 0 20px}
.b-body ul,.b-body ol{margin:0 0 22px;padding-left:24px}
.b-body li{margin:0 0 9px;line-height:1.92}
.b-body strong{font-weight:500;color:var(--sumi);background:linear-gradient(transparent 64%,rgba(178,58,38,.13) 0)}
.b-body em{font-style:normal;color:var(--shu-deep)}
.b-body a{color:var(--teal)}
.b-body blockquote{margin:0 0 22px;padding:16px 22px;background:var(--washi-2);
  border-left:3px solid var(--teal-soft);border-radius:0 4px 4px 0;color:var(--sumi-soft);font-size:15px}
.b-body blockquote p:last-child{margin-bottom:0}
.b-body code{background:var(--washi-3);border:1px solid var(--line);border-radius:3px;
  padding:1px 6px;font-size:.88em;color:var(--sumi)}
.b-body dl{margin:0 0 22px}
.b-body dt{font-weight:500;color:var(--sumi);margin-top:14px}
.b-body dd{margin:4px 0 0;color:var(--sumi-soft)}
.b-body figure{margin:0 0 24px}
.b-body figcaption{font-size:13px;color:var(--sumi-soft);margin-top:8px;line-height:1.75}

/* 本文中の表。LPの表とは別物で、data-label に依存する再流し込みはしない。
   狭い画面では横スクロールに逃がす（見出し行を失わせないため）。 */
.b-body .t-scroll,.b-body table{margin:0 0 24px}
.b-body table{width:100%;border-collapse:collapse;font-size:14.5px;display:block;overflow-x:auto}
.b-body th{text-align:left;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  font-weight:500;color:var(--sumi-soft);padding:10px 14px;border-bottom:1.5px solid var(--line);white-space:nowrap}
.b-body td{padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.78}

/* ---- 出典 ---- */
.b-sources{max-width:740px;margin:44px 0 0;padding:26px 28px;background:var(--washi-2);
  border:1px solid var(--line);border-radius:4px}
.b-sources h2{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--teal-soft);
  margin:0 0 16px;font-weight:500}
.b-sources ul{margin:0;padding-left:20px;font-size:14px;line-height:1.85}
.b-sources li{margin:0 0 8px}
.b-note{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);
  font-size:13px;line-height:1.85;color:var(--sumi-soft)}

/* ---- 記事末（注記 ＋ CTA1本 ＋ 概要への1行） ---- */
.b-tail{max-width:740px;margin:44px 0 0;padding:30px 0 0;border-top:1.5px solid var(--sumi)}
.b-scope{font-size:13.5px;line-height:1.88;color:var(--sumi-soft);margin:0 0 24px}
.b-cta{margin:0 0 16px}
.b-cta .btn{font-size:14.5px;padding:14px 30px}
.b-back{font-size:13.5px;color:var(--sumi-soft);margin:0}
.b-back .sep{color:var(--line);margin:0 10px}

/* ---- 同カテゴリの他記事 ---- */
.b-related{max-width:740px;margin:40px 0 0}
.b-related h2{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--teal-soft);
  margin:0 0 14px;font-weight:500}
.b-related ul{list-style:none;margin:0;padding:0}
.b-related li{display:flex;align-items:baseline;gap:16px;padding:12px 0;border-top:1px solid var(--line)}
.b-related a{font-size:14.5px;color:var(--teal);text-decoration:none;border-bottom:1px solid var(--line)}
.b-related .d{margin-left:auto;font-size:11.5px;color:var(--sumi-soft);flex:0 0 auto}

/* ---- 一覧 ---- */
.b-index{list-style:none;margin:38px 0 0;padding:0;max-width:740px}
.b-index li{padding:24px 0;border-top:1px solid var(--line)}
.b-index li:last-child{border-bottom:1px solid var(--line)}
.b-index .t{font-family:var(--mincho);font-weight:600;font-size:19px;line-height:1.62;
  color:var(--sumi);text-decoration:none;border-bottom:1px solid var(--line)}
.b-index .t:hover{color:var(--shu-deep)}
.b-index .d{margin:10px 0 0;font-size:14px;line-height:1.85;color:var(--sumi-soft)}
.b-index .m{margin:8px 0 0;font-size:11.5px;letter-spacing:.06em;color:var(--teal-soft)}
.b-index .m .sep{margin:0 8px;color:var(--line)}
.b-empty{margin:38px 0 0;font-size:14.5px;color:var(--sumi-soft)}

/* ---- 棚の一覧（トップのみ） ---- */
.b-shelves{max-width:740px;margin:52px 0 0;padding-top:30px;border-top:1.5px solid var(--sumi)}
.b-shelves h2{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--teal-soft);
  margin:0 0 18px;font-weight:500}
.b-shelves ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.b-shelves li{background:var(--washi-2);border:1px solid var(--line);
  border-left:3px solid var(--teal-soft);border-radius:0 4px 4px 0;padding:18px 22px}
.b-shelves a{font-family:var(--mincho);font-weight:600;font-size:17px;color:var(--sumi);text-decoration:none}
.b-shelves .n{font-family:var(--mono);font-size:11px;color:var(--sumi-soft);margin-left:12px}
.b-shelves .d{margin:6px 0 0;font-size:13px;line-height:1.78;color:var(--sumi-soft)}

/* ---- 記事・一覧の下端の余白 ---- */
.b-article,.b-list,.b-404{padding-bottom:70px}
.b-404 h1{font-family:var(--mincho);font-weight:700;font-size:28px;margin:70px 0 18px;color:var(--sumi)}
.b-404 p{font-size:15px;color:var(--sumi-soft)}

/* ================= narrow ================= */
@media (max-width:760px){
  .b-top-in{padding:14px 20px;gap:12px}
  .b-crumb{margin-left:0;width:100%;font-size:11.5px;gap:6px}
  .b-brand-t .name{font-size:15.5px}

  .b-head{padding-top:32px}
  .b-head h1{font-size:23px;line-height:1.62;margin-bottom:16px}
  .b-lead{font-size:14.5px}
  .b-dates{gap:8px 20px;padding-top:14px}
  .b-dates dd{font-size:12.5px}

  .b-body{padding-top:26px;font-size:15.5px;line-height:1.98}
  .b-body h2{font-size:19px;margin:38px 0 12px}
  .b-body h3{font-size:16.5px;margin:26px 0 8px}
  .b-body ul,.b-body ol{padding-left:20px}

  .b-sources{padding:20px 18px;margin-top:34px}
  .b-tail{margin-top:34px;padding-top:24px}
  .b-cta .btn{width:100%;font-size:15px}
  .b-back .sep{display:block;height:0;overflow:hidden;margin:6px 0}

  .b-index{margin-top:26px}
  .b-index li{padding:18px 0}
  .b-index .t{font-size:17px}
  .b-shelves{margin-top:38px;padding-top:24px}
  .b-shelves li{padding:15px 17px}

  .b-article,.b-list,.b-404{padding-bottom:48px}
}
