/* データセンターガイド（/datacenter/）8ページ共通のスタイル。
   共通シェル /assets/mainichi.css のトークン var(--mt-*) を優先して使う。分野色はしごと棚と同じ紺。 */
:root{--dc:#1f4e79;--dc-dark:#163a5b;--dc-pale:#e7eff7;--dc-warn:#7a5a12;--dc-warn-bg:#fdf6e0}
*{box-sizing:border-box}
body{margin:0;background:var(--mt-paper,#f6f6f3);color:var(--mt-ink,#15171c);
  font-family:var(--mt-font,system-ui,sans-serif);line-height:1.75;-webkit-text-size-adjust:100%;
  overflow-wrap:anywhere}
a{color:var(--dc-dark)}
header.dc-hero{background:linear-gradient(135deg,var(--dc-dark),var(--dc));color:#fff;padding:24px 16px 20px}
header.dc-hero .in{max-width:760px;margin:0 auto}
header.dc-hero .kicker{font-size:.78rem;opacity:.9;margin:0 0 4px}
header.dc-hero .kicker a{color:#fff}
header.dc-hero h1{margin:0;font-size:1.35rem;line-height:1.45}
header.dc-hero p.lead{margin:10px 0 0;font-size:.9rem;opacity:.95}
header.dc-hero p.upd{margin:10px 0 0;font-size:.78rem;opacity:.9}
main{max-width:760px;margin:0 auto;padding:8px 16px 48px}
.dc-toc{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px;padding:0;list-style:none}
.dc-toc a{display:inline-flex;align-items:center;min-height:44px;padding:6px 14px;border-radius:var(--mt-r-pill,999px);
  border:1px solid var(--mt-line-strong,#d3d5db);background:var(--mt-card,#fff);color:var(--mt-ink,#15171c);
  text-decoration:none;font-size:.84rem;font-weight:700}
.dc-toc a[aria-current="page"]{background:var(--dc);border-color:var(--dc);color:#fff}
section{background:var(--mt-card,#fff);border:1px solid var(--mt-line,#e6e7eb);border-radius:var(--mt-r,12px);
  padding:18px 16px;margin:18px 0;box-shadow:var(--mt-shadow-1)}
section h2{margin:0 0 10px;font-size:1.12rem;line-height:1.45;color:var(--dc-dark);border-left:4px solid var(--dc);padding-left:8px}
section h3{margin:16px 0 6px;font-size:.98rem;color:var(--dc-dark)}
p{margin:8px 0}
ul,ol{padding-left:1.3em;margin:8px 0}
li{margin:5px 0}
.small{font-size:.8rem;color:var(--mt-sub,#5a606b)}
.src{font-size:.74rem;color:var(--mt-sub,#5a606b);white-space:normal}
.note{background:var(--dc-warn-bg);border:1px solid #e8d99a;border-radius:10px;padding:10px 12px;font-size:.84rem;color:var(--dc-warn);margin:10px 0}
.box{background:var(--dc-pale);border-radius:10px;padding:10px 12px;margin:10px 0;font-size:.92rem}
.num{font-variant-numeric:tabular-nums}
/* 表は横スクロールを表の箱の中だけに閉じ込める */
.tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:10px 0;max-width:100%}
.tbl table{border-collapse:collapse;font-size:.84rem;min-width:100%;font-variant-numeric:tabular-nums}
.tbl th,.tbl td{border:1px solid var(--mt-line,#e6e7eb);padding:7px 8px;text-align:left;vertical-align:top;overflow-wrap:normal;word-break:normal}
.tbl th{background:var(--dc-pale);white-space:nowrap}
.tbl.wide table{min-width:560px}
/* 数字で見る要点 */
.kf-grid{display:grid;grid-template-columns:1fr;gap:10px;margin:10px 0}
@media (min-width:600px){.kf-grid{grid-template-columns:1fr 1fr}}
.kf{border:1px solid var(--mt-line,#e6e7eb);border-radius:var(--mt-r,12px);padding:12px 14px;background:#fff}
.kf .n{display:block;font-size:1.35rem;font-weight:800;color:var(--dc-dark);line-height:1.3;font-variant-numeric:tabular-nums}
.kf .l{display:block;font-size:.86rem;margin-top:4px}
.kf .s{display:block;font-size:.72rem;color:var(--mt-sub,#5a606b);margin-top:4px}
/* 章カード */
.ch-grid{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:600px){.ch-grid{grid-template-columns:1fr 1fr}}
a.dc-ch{display:flex;gap:12px;align-items:flex-start;min-height:44px;padding:14px;border-radius:var(--mt-r,12px);
  border:1px solid var(--mt-line,#e6e7eb);background:#fff;color:var(--mt-ink,#15171c);text-decoration:none}
a.dc-ch:hover{border-color:var(--dc)}
a.dc-ch .no{flex:none;width:36px;height:36px;border-radius:10px;background:var(--dc-pale);color:var(--dc-dark);
  display:flex;align-items:center;justify-content:center;font-weight:800}
a.dc-ch .t{display:block;font-weight:700;font-size:.95rem}
a.dc-ch .d{display:block;font-size:.8rem;color:var(--mt-sub,#5a606b);margin-top:2px;line-height:1.55}
/* 計算アプリのカード（未公開は div で「近日公開」） */
.app-grid{display:grid;grid-template-columns:1fr;gap:10px;margin:10px 0}
@media (min-width:600px){.app-grid{grid-template-columns:1fr 1fr}}
.dc-app{display:flex;gap:12px;align-items:flex-start;min-height:44px;padding:12px 14px;border-radius:var(--mt-r,12px);
  border:1px dashed var(--dc);background:var(--dc-pale);color:var(--mt-ink,#15171c);text-decoration:none}
a.dc-app{border-style:solid;background:#fff}
.dc-app .ico{flex:none;width:36px;height:36px;border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:1.15rem}
.dc-app .t{display:block;font-weight:700;font-size:.92rem}
.dc-app .d{display:block;font-size:.78rem;color:var(--mt-sub,#5a606b);line-height:1.55;margin-top:2px}
.dc-app .soon{display:inline-block;margin-top:6px;font-size:.7rem;font-weight:700;color:var(--dc-dark);background:#fff;
  border:1px solid var(--dc);border-radius:999px;padding:1px 8px}
/* 読む順 */
.route{border-left:3px solid var(--dc);padding:4px 0 4px 10px;margin:10px 0}
.route b{display:block}
/* 前後の章 */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}
.pager a{display:block;min-height:44px;padding:10px 12px;border:1px solid var(--mt-line-strong,#d3d5db);border-radius:var(--mt-r,12px);
  background:#fff;text-decoration:none;color:var(--mt-ink,#15171c);font-size:.84rem}
.pager a span{display:block;font-size:.72rem;color:var(--mt-sub,#5a606b)}
.pager .next{text-align:right;grid-column:2}
.hub-link{display:block;text-align:center;min-height:44px;padding:10px;border-radius:var(--mt-r,12px);background:var(--dc);color:#fff;
  text-decoration:none;font-weight:700;margin:10px 0}
/* 出典 */
#sources ol{font-size:.8rem;padding-left:1.4em}
#sources li{margin:6px 0}
details{border:1px solid var(--mt-line,#e6e7eb);border-radius:10px;padding:8px 12px;margin:8px 0;background:#fbfcfd}
summary{cursor:pointer;font-weight:700;color:var(--dc-dark);min-height:32px}
/* 用語集 */
dl.terms dt{font-weight:800;color:var(--dc-dark);margin-top:14px;scroll-margin-top:72px}
dl.terms dd{margin:4px 0 0 0;font-size:.92rem}
.kana-jump{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:8px 0}
.kana-jump a{display:inline-flex;min-width:44px;min-height:44px;align-items:center;justify-content:center;border:1px solid var(--mt-line-strong,#d3d5db);
  border-radius:10px;background:#fff;text-decoration:none;font-weight:700;color:var(--mt-ink,#15171c)}
footer{max-width:760px;margin:0 auto;padding:16px 16px 40px;font-size:.78rem;color:var(--mt-sub,#5a606b)}