@charset "UTF-8";

:root{
  --navy:#0b2f63;
  --navy-deep:#06234c;
  --blue:#1168d7;
  --blue2:#2096e5;
  --sky:#eaf6ff;
  --sky2:#f6fbff;
  --green:#31b760;
  --text:#0e2340;
  --muted:#5f7288;
  --line:#dce8f2;
  --white:#fff;
  --shadow:0 12px 32px rgba(20,67,110,.10);
  --radius:18px;
}


/* =========================================================
   MEDICAL CHART THEME COLORS
   カルテ別ブランドカラー
========================================================= */

/* デフォルト：会社の健康診断・その他 */
:root{
  --chart-accent:#4A90C2;
  --chart-soft:#F4F8FC;
}

/* お金のカルテ */
.chart-theme--money{
  --chart-accent:#2C5FAD;
  --chart-soft:#EAF1FA;
}

/* 利益のカルテ */
.chart-theme--profit{
  --chart-accent:#2F8F6F;
  --chart-soft:#EAF6F1;
}

/* 原価のカルテ */
.chart-theme--cost{
  --chart-accent:#C9793A;
  --chart-soft:#FBF1E6;
}

/* 組織のカルテ */
.chart-theme--organization{
  --chart-accent:#7C5EA3;
  --chart-soft:#F2EDF8;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Noto Sans JP",system-ui,-apple-system,sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit}
.shujii-container{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.pc-only{display:inline}

/* HEADER */
.shujii-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,232,242,.8)}
.shujii-header__inner{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.shujii-logo{display:grid;text-decoration:none;line-height:1;min-width:265px}
.shujii-logo small{font-size:9px;font-weight:700;letter-spacing:.03em;color:#334b66;margin-bottom:7px}
.shujii-logo strong{font-size:25px;font-weight:900;letter-spacing:.02em;color:var(--navy-deep)}
.shujii-logo span{font-size:10px;letter-spacing:.08em;margin-top:6px;color:#53677e}
.shujii-nav{display:flex;align-items:center;gap:22px}
.shujii-nav a{text-decoration:none;font-size:12px;font-weight:800;color:#253c56;white-space:nowrap}
.shujii-nav a:hover,.shujii-nav a.is-active{color:var(--blue)}
.shujii-nav__cta{padding:13px 16px;border-radius:10px;background:var(--blue);color:#fff!important;box-shadow:0 7px 18px rgba(17,104,215,.18)}
.shujii-burger{display:none}

/* VISUAL HERO - no crop */
.shujii-visual-hero{padding:24px 0 0;background:linear-gradient(180deg,#f7fbff 0%,#fff 100%)}
.shujii-visual-hero__wrap{width:min(1440px,calc(100% - 32px));margin-inline:auto;overflow:hidden;border:1px solid #e2edf6;border-radius:26px;background:#fff;box-shadow:0 14px 40px rgba(17,69,112,.10)}
.shujii-visual-hero__image{display:block!important;width:100%!important;height:auto!important;max-width:100%!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important}

/* COMMON */
.shujii-section{padding:82px 0}
.shujii-section__head{margin-bottom:34px}
.shujii-section__head--center{text-align:center;max-width:820px;margin-left:auto;margin-right:auto;margin-bottom:38px}
.shujii-section__head--split{display:flex;align-items:flex-end;justify-content:space-between;gap:28px}
.shujii-section__eyebrow{display:inline-block;color:#227dcc;font-family:"Space Grotesk",sans-serif;font-size:11px;font-weight:700;letter-spacing:.16em}
.shujii-section__head h2,.shujii-health-intro h2,.shujii-selfcheck h2,.shujii-consultation h2{margin:9px 0 0;font-size:clamp(28px,3.4vw,42px);line-height:1.4;color:var(--navy-deep);font-weight:900}
.shujii-section__head p,.shujii-health-intro p{margin:10px 0 0;color:#4c6077;font-size:14px;line-height:1.95}
.shujii-text-link,.shujii-section__more a{color:var(--blue);font-size:13px;font-weight:800;text-decoration:none;white-space:nowrap}
.shujii-text-link:hover,.shujii-section__more a:hover{text-decoration:underline}
.shujii-section__more{text-align:center;margin-top:25px}

/* HEALTH CHECK */
.shujii-section--health{padding-top:76px;background:#fff}
.shujii-health-intro{max-width:850px;margin:0 auto 34px;text-align:center}
.shujii-health-card{display:grid;grid-template-columns:92px minmax(0,1fr) auto;align-items:center;gap:26px;max-width:1080px;margin:0 auto;padding:30px 34px;border:1px solid #bcdcf3;border-radius:22px;background:linear-gradient(135deg,#f5fbff 0%,#fff 55%,#f8fcff 100%);box-shadow:var(--shadow);text-decoration:none;transition:.2s ease}
.shujii-health-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(20,67,110,.14)}
.shujii-health-card__mark{width:76px;height:76px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#1784d9;border:1px solid #c6e3f7;font-size:42px;font-weight:300;box-shadow:0 8px 22px rgba(31,132,217,.10)}
.shujii-health-card__body>span{color:#1d78c7;font-size:10px;font-weight:800;letter-spacing:.08em}
.shujii-health-card h3{margin:4px 0 0;color:var(--navy-deep);font-size:26px;font-weight:900}
.shujii-health-card p{margin:8px 0 0;color:#526980;font-size:13px;line-height:1.85}
.shujii-health-card__arrow{color:#1268d2;font-size:13px;font-weight:800;white-space:nowrap}
.shujii-health-card__arrow b{font-size:18px}

/* 4 CHARTS */
.shujii-section--charts{background:linear-gradient(180deg,#f8fbfe 0%,#f3f8fc 100%)}
.shujii-chart-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.shujii-chart-card{min-height:340px;display:flex;flex-direction:column;padding:26px 22px 22px;border:1px solid #dce9f3;border-radius:18px;background:#fff;box-shadow:0 8px 22px rgba(24,72,113,.07);text-decoration:none;transition:.2s ease}
.shujii-chart-card:hover{transform:translateY(-5px);border-color:var(--chart-accent);box-shadow:0 15px 34px rgba(24,72,113,.12)}
.shujii-chart-card__symbol{width:54px;height:54px;display:grid;place-items:center;border-radius:14px;background:var(--chart-soft);color:var(--chart-accent);font-size:28px;font-weight:900}
.shujii-chart-card__label{margin-top:18px;color:var(--chart-accent);font-family:"Space Grotesk",sans-serif;font-size:9px;font-weight:700;letter-spacing:.14em}
.shujii-chart-card h3{margin:3px 0 0;color:var(--navy-deep);font-size:21px;font-weight:900}
.shujii-chart-card strong{display:block;margin-top:15px;color:#243e58;font-size:13px;line-height:1.75}
.shujii-chart-card p{margin:10px 0 0;color:#61758a;font-size:11.5px;line-height:1.85}
.shujii-chart-card__link{margin-top:auto;padding-top:20px;color:var(--chart-accent);font-size:12px;font-weight:800}
.shujii-chart-card__link b{font-size:16px}

/* RECENT */
.shujii-section--recent{background:#fff}
.shujii-recent-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.shujii-recent-card{overflow:hidden;border:1px solid #e0e9f1;border-radius:18px;background:#fff;box-shadow:0 8px 22px rgba(20,67,110,.06);text-decoration:none;transition:.2s ease}
.shujii-recent-card:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(20,67,110,.11)}
.shujii-recent-card>img{width:100%;aspect-ratio:16/9;object-fit:cover}
.shujii-recent-card__body{padding:20px}
.shujii-recent-card__body>span{color:var(--blue);font-size:10px;font-weight:800}
.shujii-recent-card h3{margin:7px 0 0;color:var(--navy-deep);font-size:17px;line-height:1.6}
.shujii-recent-card p{margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.8}
.shujii-recent-card b{display:block;margin-top:15px;color:var(--blue);font-size:11px}
.shujii-recent-empty{padding:34px;text-align:center;border:1px dashed #cbdce9;border-radius:18px;background:#fafcff}
.shujii-recent-empty p{margin:0 0 16px;color:var(--muted)}

/* PRESCRIPTION */
.shujii-section--prescription{background:#f7fbff}
.shujii-tag-list{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.shujii-tag-list a{padding:11px 18px;border:1px solid #98c8ec;border-radius:999px;background:#fff;color:#0d4e9b;text-decoration:none;font-size:12px;font-weight:800;transition:.18s ease}
.shujii-tag-list a:hover{transform:translateY(-2px);background:#eef8ff}

/* BUTTONS */
.shujii-btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:10px;font-size:13px;font-weight:800;text-decoration:none;transition:.2s ease}
.shujii-btn:hover{transform:translateY(-2px)}
.shujii-btn--primary{color:#fff;background:linear-gradient(135deg,#0d5fc6,#147de8);box-shadow:0 8px 18px rgba(15,102,212,.18)}
.shujii-btn--ghost{color:#0958bd;background:#fff;border:1px solid #1b6ed3}
.shujii-btn--green{color:#fff;background:var(--green);box-shadow:0 8px 18px rgba(49,183,96,.18)}
.shujii-btn--large{min-height:56px;padding:14px 24px;font-size:14px}
/* 白ボタンスタイル（濃い背景上で一番目立たせる用） */
.shujii-btn--white {color: var(--blue);background: #ffffff;box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);}
.shujii-btn--white:hover {background: #f0f7ff;color: var(--navy-deep);}

/* ※ グリーンボタンはCSS内に定義済みの var(--green) スタイルが適用されます */

/* SELF CHECK */
.shujii-section--selfcheck{background:#fff}
.shujii-selfcheck{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:40px;padding:38px 42px;border:1px solid #d9e8f3;border-radius:22px;background:linear-gradient(135deg,#eef8ff,#fff);box-shadow:var(--shadow)}
.shujii-selfcheck p{margin:10px 0 0;color:#526980;font-size:13px}
.shujii-selfcheck__note{font-weight:800;color:#1a69bc!important}

/* CONSULTATION */
.shujii-section--consultation{padding-top:20px;background:#fff}
.shujii-consultation{padding:54px 36px;text-align:center;border-radius:24px;background:linear-gradient(135deg,#f3fff7 0%,#fff 60%);border:1px solid #d8efdf}
.shujii-consultation p{margin:13px auto 0;max-width:780px;color:#4f6578;font-size:13px;line-height:1.95}
.shujii-consultation .shujii-btn{margin-top:24px}


/* ---------- カルテ別カテゴリーチップ ---------- */
.media-article-page .media-category-chip{
  display:inline-flex;
  align-items:center;
  padding:5px 11px;
  color:var(--chart-accent);
  background:var(--chart-soft);
  border:1px solid var(--chart-accent);
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  line-height:1.3;
  text-decoration:none;
}

.shujii-recent-category{
  display:inline-flex;
  align-items:center;
  width:max-content;
  padding:4px 9px;
  color:var(--chart-accent);
  background:var(--chart-soft);
  border-radius:999px;
  font-size:10px;
  font-weight:800;
}

/* ARTICLE INDEX */
.article-index-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:48px 0 18px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.article-index-head__eyebrow{display:block;margin-bottom:6px;color:var(--blue);font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.article-index-head h2{margin:0;font-size:clamp(1.35rem,2vw,1.75rem);line-height:1.45;color:var(--navy-deep)}
.article-index-count{flex:none;color:var(--muted);font-size:.75rem;font-weight:700;letter-spacing:.08em}
.article-index-list{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:#fff}
.article-index-row{display:grid;grid-template-columns:180px minmax(0,1fr) 32px;align-items:center;gap:30px;padding:25px 24px;color:var(--text);background:#fff;border-bottom:1px solid var(--line);text-decoration:none;transition:background-color .18s ease}
.article-index-row:nth-child(even){background:#f6fbff}.article-index-row:last-child{border-bottom:0}.article-index-row:hover{background:#eaf6ff}
.article-index-meta{display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.article-index-date{color:var(--muted);font-size:.78rem;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.article-index-tag{display:inline-flex;align-items:center;min-height:25px;padding:4px 10px;color:var(--chart-accent,var(--blue));background:var(--chart-soft,#fff);border:1px solid var(--chart-accent,#bcdaf1);border-radius:999px;font-size:.7rem;font-weight:800;line-height:1.2}
.article-index-content{min-width:0}
.article-index-title{margin:0;color:var(--navy-deep);font-size:clamp(1rem,1.5vw,1.15rem);font-weight:800;line-height:1.65}
.article-index-description{display:-webkit-box;overflow:hidden;margin:7px 0 0;color:var(--muted);font-size:.86rem;line-height:1.75;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.article-index-arrow{display:grid;width:32px;height:32px;place-items:center;justify-self:end;color:var(--blue);border:1px solid #bcdaf1;border-radius:50%;background:rgba(255,255,255,.75);font-size:.9rem;transition:transform .18s ease,background-color .18s ease}
.article-index-row:hover .article-index-arrow{transform:translateX(3px);background:#fff}

/* =========================================================
   ARTICLE DETAIL — 本文・見出し・表・引用・リスト
========================================================= */
.media-article-page .media-reading-wrap{
  width:min(100% - 40px, 820px);
  max-width:820px;
  margin:0 auto;
  padding:56px 0 72px;
}
.media-article-page .media-cover{
  display:block;
  width:100%;
  height:auto;
  margin:0 0 38px;
  border-radius:18px;
  box-shadow:0 14px 34px rgba(25,71,112,.10);
}
.media-article-page .media-text{
  color:#26384d;
  font-size:16px;
  line-height:2;
  letter-spacing:.015em;
  overflow-wrap:anywhere;
}
.media-article-page .media-text > *:first-child{margin-top:0}
.media-article-page .media-text > *:last-child{margin-bottom:0}
.media-article-page .media-text p{
  margin:1.45em 0;
}

/* ---------- H2：サブタイトル ---------- */
.media-article-page .media-text h2{
  margin:60px 0 26px;
  padding:.65em .85em;
  color:#17324D;
  background:var(--chart-soft);
  border:0;
  border-left:solid 5px var(--chart-accent);
  border-radius:0;
  font-size:clamp(1.35rem,2.2vw,1.7rem);
  font-weight:900;
  line-height:1.55;
  letter-spacing:.02em;
}

/* ---------- H3：小見出し（鮮やかな濃いブルー装飾） ---------- */
.media-article-page .media-text h3 {
  position: relative;
  margin: 42px 0 24px;
  padding: 0 0 10px 22px;
  color: #17324D;
  border: 0;
  font-size: clamp(1.15rem, 1.8vw, 1.4rem);
  font-weight: 900;
  line-height: 1.55;
  letter-spacing: .015em;
}
.media-article-page .media-text h3::before {
  position: absolute;
  content: '';
  bottom: -2px;
  left: 0;
  width: 0;
  height: 0;
  border-left: solid 12px transparent;
  border-bottom: solid 12px var(--chart-accent);
}
.media-article-page .media-text h3::after {
  position: absolute;
  content: '';
  bottom: -2px;
  left: 8px;
  width: calc(100% - 8px);
  border-bottom: solid 2px var(--chart-accent);
}

.media-article-page .media-text h2 + p,
.media-article-page .media-text h3 + p{
  margin-top:0;
}

/* ---------- H4：小見出し ---------- */
.media-article-page .media-text h4{
  margin:36px 0 14px;
  color:#1c456b;
  font-size:1.05rem;
  font-weight:900;
  line-height:1.7;
}

/* ---------- 強調・リンク ---------- */
.media-article-page .media-text strong{
  color:#102f50;
  font-weight:800;
  background:linear-gradient(transparent 68%,var(--chart-soft) 68%);
}
.media-article-page .media-text a{
  color:#126bc1;
  text-decoration-thickness:1px;
  text-underline-offset:4px;
}
.media-article-page .media-text a:hover{color:#0b4e91}

/* ---------- 箇条書き ---------- */
.media-article-page .media-text ul,
.media-article-page .media-text ol{
  margin:1.55em 0;
  padding:20px 24px 20px 46px;
  border:1px solid #e0eaf2;
  border-radius:12px;
  background:#fbfdff;
}
.media-article-page .media-text li{
  margin:.55em 0;
  padding-left:.2em;
}
.media-article-page .media-text li::marker{
  color:var(--chart-accent);
  font-weight:800;
}

/* ---------- 引用 ---------- */
.media-article-page .media-text blockquote{
  position:relative;
  margin:32px 0;
  padding:25px 28px 25px 54px;
  color:#27445f;
  background:var(--chart-soft);
  border:1px solid var(--chart-soft);
  border-radius:14px;
}
.media-article-page .media-text blockquote::before{
  content:"+";
  position:absolute;
  top:23px;
  left:20px;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  color:#fff;
  background:var(--chart-accent);
  border-radius:6px;
  font-family:Arial,sans-serif;
  font-size:17px;
  font-weight:900;
  line-height:1;
}
.media-article-page .media-text blockquote p{
  margin:.55em 0;
}

/* ---------- 表 ---------- */
.media-article-page .media-text table{
  width:100%;
  margin:30px 0;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid #dce7ef;
  border-radius:12px;
  overflow:hidden;
  font-size:.92rem;
  line-height:1.7;
}
.media-article-page .media-text th,
.media-article-page .media-text td{
  padding:13px 15px;
  border-right:1px solid #e3ebf2;
  border-bottom:1px solid #e3ebf2;
  text-align:left;
  vertical-align:top;
}
.media-article-page .media-text th{
  color:#173b60;
  background:var(--chart-soft);
  font-weight:800;
}
.media-article-page .media-text tr:last-child th,
.media-article-page .media-text tr:last-child td{border-bottom:0}
.media-article-page .media-text th:last-child,
.media-article-page .media-text td:last-child{border-right:0}

/* ---------- 本文画像 ---------- */
.media-article-page .media-text img{
  display:block;
  max-width:100%;
  height:auto;
  margin:34px auto;
  border-radius:12px;
}

/* ---------- 区切り ---------- */
.media-article-page .media-text hr{
  display:block;
  width:100%;
  height:1px;
  margin:52px 0;
  padding:0;
  border:0;
  background:#E1E5EA;
  opacity:1;
}

/* ---------- 記事下ナビ ---------- */
.media-article-page .article-nav{
  margin-top:58px;
  padding-top:24px;
  border-top:1px solid #dce7ef;
}
.media-article-page .article-nav a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#176bbb;
  font-size:.9rem;
  font-weight:800;
  text-decoration:none;
}
.media-article-page .article-nav a:hover{text-decoration:underline}

/* =========================================================
   BREADCRUMB & MINI SIZING
========================================================= */
.media-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 16px;
  font-size: 11px;
  line-height: 1.4;
  color: #72869d;
}
.media-breadcrumb a {
  color: #536b85;
  text-decoration: none;
  font-weight: 700;
  transition: color .15s ease;
}
.media-breadcrumb a:hover {
  color: var(--blue);
  text-decoration: underline;
}
.media-breadcrumb__sep {
  color: #b5c7d8;
  font-size: 10px;
}
.media-breadcrumb span[aria-current="page"] {
  color: #1a334e;
  font-weight: 700;
}

/* リスト・詳細ヒーロー */
.media-list-hero {
  padding: 38px 0 32px;
  background: linear-gradient(180deg, #f7fbff 0%, #fff 100%);
  border-bottom: 1px solid #e1edf6;
}
.media-list-hero h1 {
  margin: 6px 0 0;
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 900;
  color: var(--navy-deep);
  line-height: 1.35;
}
.media-list-hero p {
  margin: 8px 0 0;
  color: #556c84;
  font-size: 13.5px;
}

/* =========================================================
   CATEGORY CARDS FILTER
========================================================= */
.shujii-section--list-body {
  padding: 42px 0 80px;
}
.shujii-category-filter {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 42px;
}
.shujii-filter-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid #dbe8f2;
  background: #fff;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(20, 67, 110, 0.04);
  transition: all .2s ease;
}
.shujii-filter-card:hover {
  transform: translateY(-2px);
  border-color: #b7d7f0;
  box-shadow: 0 8px 20px rgba(17, 104, 215, 0.1);
}
.shujii-filter-card.is-active {
  background: linear-gradient(135deg, #1168d7 0%, #0d54b1 100%);
  border-color: #0d54b1;
  box-shadow: 0 8px 20px rgba(17, 104, 215, 0.22);
}
.shujii-filter-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.shujii-filter-card__badge {
  font-family: "Space Grotesk", sans-serif;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  color: #6287a8;
}
.shujii-filter-card.is-active .shujii-filter-card__badge {
  color: #b9d8ff;
}
.shujii-filter-card__icon {
  font-size: 13px;
  font-weight: 900;
  color: var(--blue);
}
.shujii-filter-card.is-active .shujii-filter-card__icon {
  color: #fff;
}
.shujii-filter-card__title {
  font-size: 13.5px;
  font-weight: 900;
  color: var(--navy-deep);
  line-height: 1.4;
}
.shujii-filter-card.is-active .shujii-filter-card__title {
  color: #fff;
}


/* カルテ別フィルターカラー */
.shujii-filter-card__badge{
  color:var(--chart-accent,#6287a8);
}
.shujii-filter-card__icon{
  color:var(--chart-accent,var(--blue));
}
.shujii-filter-card.is-active{
  background:var(--chart-soft,#EAF1FA);
  border-color:var(--chart-accent,var(--blue));
  box-shadow:0 8px 20px rgba(17,104,215,.10);
}
.shujii-filter-card.is-active .shujii-filter-card__badge,
.shujii-filter-card.is-active .shujii-filter-card__icon{
  color:var(--chart-accent,var(--blue));
}
.shujii-filter-card.is-active .shujii-filter-card__title{
  color:var(--navy-deep);
}

/* =========================================================
   PAGINATION
========================================================= */
.site-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 48px;
}
.site-pagination a,
.site-pagination .current {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  border: 1px solid #dbe8f2;
}
.site-pagination a {
  background: #fff;
  color: var(--navy-deep);
  transition: .15s ease;
}
.site-pagination a:hover {
  background: #f1f8ff;
  border-color: var(--blue);
  color: var(--blue);
}
.site-pagination .current {
  background: var(--blue);
  color: #fff;
  border-color: var(--blue);
}

/* =========================================================
   FOOTER
========================================================= */
.shujii-footer {
  margin-top: 80px;
  background: #061c38;
  color: #8fa7c4;
  padding: 56px 0 32px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.shujii-footer__main {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 48px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.shujii-footer__brand {
  max-width: 380px;
}
.shujii-logo--footer small {
  color: #7997ba;
}
.shujii-logo--footer strong {
  color: #ffffff;
  font-size: 22px;
}
.shujii-logo--footer span {
  color: #5c7d9f;
}
.shujii-footer__desc {
  margin: 14px 0 0;
  font-size: 12px;
  line-height: 1.8;
  color: #8ca3bf;
}
.shujii-footer__nav {
  display: flex;
  gap: 52px;
}
.shujii-footer__nav-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.shujii-footer__nav-group strong {
  font-size: 12px;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: .05em;
  margin-bottom: 4px;
}
.shujii-footer__nav-group a {
  color: #9cb4d0;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: color .15s ease;
}
.shujii-footer__nav-group a:hover {
  color: #ffffff;
  text-decoration: underline;
}
.shujii-footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 24px;
  font-size: 11px;
  color: #637f9e;
}

/* =========================================================
   RESPONSIVE MEDIA QUERIES
========================================================= */
@media(max-width:1020px){
  .shujii-nav{gap:14px}.shujii-nav a{font-size:11px}
  .shujii-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shujii-recent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:780px){
  .shujii-container{width:min(100% - 28px,1180px)}
  .shujii-header__inner{min-height:68px}.shujii-logo{min-width:auto}.shujii-logo small{display:none}.shujii-logo strong{font-size:21px}
  .shujii-burger{display:block;width:42px;height:42px;border:0;background:transparent;padding:8px}.shujii-burger span{display:block;height:2px;margin:5px 0;background:var(--navy-deep)}
  .shujii-nav{position:absolute;top:68px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:12px 20px 20px;background:#fff;border-bottom:1px solid var(--line)}
  .shujii-nav.is-open{display:flex}.shujii-nav a{padding:12px 4px;border-bottom:1px solid #edf3f8}.shujii-nav__cta{margin-top:10px;text-align:center}
  .shujii-visual-hero{padding-top:14px}.shujii-visual-hero__wrap{width:calc(100% - 20px);border-radius:16px}
  .shujii-section{padding:60px 0}.shujii-section__head--split{display:block}.shujii-section__head--split .shujii-text-link{display:inline-block;margin-top:16px}
  .shujii-health-card{grid-template-columns:64px 1fr;gap:18px;padding:24px}.shujii-health-card__mark{width:60px;height:60px;font-size:34px}.shujii-health-card__arrow{grid-column:2;margin-top:-4px}
  .shujii-selfcheck{grid-template-columns:1fr;gap:24px;padding:30px}
  .shujii-consultation{padding:42px 24px}
  .article-index-head{align-items:flex-start;margin-top:36px}.article-index-count{padding-top:5px}.article-index-row{grid-template-columns:minmax(0,1fr) 28px;gap:14px;padding:20px 18px}.article-index-meta{grid-column:1/-1;flex-direction:row;align-items:center;gap:10px;margin-bottom:-4px}.article-index-content{grid-column:1}.article-index-arrow{grid-column:2;grid-row:2;width:28px;height:28px}.article-index-description{margin-top:5px;font-size:.82rem;-webkit-line-clamp:2}
  .shujii-category-filter {grid-template-columns: repeat(2, 1fr);}
  .shujii-footer__main {flex-direction: column; gap: 32px;}
  .shujii-footer__nav {width: 100%; justify-content: space-between; gap: 24px;}
  .shujii-footer__bottom {flex-direction: column; gap: 8px; text-align: center;}
}
@media(max-width:767px){
  .media-article-page .media-reading-wrap{width:min(100% - 30px,820px);padding:38px 0 58px;}
  .media-article-page .media-cover{margin-bottom:30px;border-radius:12px;}
  .media-article-page .media-text{font-size:15px;line-height:1.95;}
  .media-article-page .media-text h2{margin:48px 0 22px;padding:.65em .75em;border-left-width:4px;font-size:1.28rem;line-height:1.55;}
  .media-article-page .media-text h3{margin:36px 0 22px;padding:0 0 10px 20px;font-size:1.14rem;line-height:1.55;}
  .media-article-page .media-text h3::before{border-left-width:10px;border-bottom-width:10px;}
  .media-article-page .media-text h3::after{left:7px;width:calc(100% - 7px);border-bottom-width:2px;}
  .media-article-page .media-text hr{margin:42px 0;}
  .media-article-page .media-text ul,.media-article-page .media-text ol{padding:17px 16px 17px 37px;}
  .media-article-page .media-text blockquote{padding:21px 18px 21px 48px;}
  .media-article-page .media-text blockquote::before{top:20px;left:16px;width:22px;height:22px;font-size:15px;}
  .media-article-page .media-text table{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;}
}
@media(max-width:560px){
  .pc-only{display:none}
  .shujii-section{padding:52px 0}
  .shujii-chart-grid,.shujii-recent-grid{grid-template-columns:1fr}
  .shujii-chart-card{min-height:0}
  .shujii-health-intro{text-align:left}.shujii-health-card{grid-template-columns:1fr;gap:14px;text-align:left}.shujii-health-card__mark{width:54px;height:54px}.shujii-health-card__arrow{grid-column:1}
  .shujii-selfcheck{padding:26px 22px}.shujii-btn--large{width:100%;text-align:center}
  .shujii-consultation{padding:36px 20px}
  .article-index-head{display:block}.article-index-count{display:block;margin-top:8px}.article-index-list{border-radius:8px}.article-index-row{padding:18px 15px}
}
/* =========================================================
   ARTICLE TOC — コンパクトで階層が分かる目次
========================================================= */
.media-article-page .media-article-toc{
  margin:0 0 48px;
  padding:22px 24px 20px;
  background:#f8fbfd;
  border:1px solid #dce8f2;
  border-radius:14px;
}
.media-article-page .media-article-toc__head{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-bottom:14px;
  padding-bottom:12px;
  border-bottom:1px solid #dce8f2;
}
.media-article-page .media-article-toc__head .shujii-section__eyebrow{
  font-size:9px;
  letter-spacing:.14em;
}
.media-article-page .media-article-toc__head strong{
  color:#17324d;
  font-size:14px;
  font-weight:900;
}
.media-article-page .media-article-toc__body ul{
  list-style:none;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
}
.media-article-page .media-article-toc__body > ul{
  display:grid;
  gap:2px;
}
.media-article-page .media-article-toc__body li{
  margin:0;
  padding:0;
}
.media-article-page .media-article-toc__body a{
  position:relative;
  display:block;
  padding:7px 8px 7px 25px;
  color:#344b63;
  font-size:13px;
  font-weight:700;
  line-height:1.6;
  text-decoration:none;
  border-radius:7px;
  transition:color .15s ease,background-color .15s ease;
}
.media-article-page .media-article-toc__body > ul > li > a::before{
  content:"";
  position:absolute;
  top:15px;
  left:8px;
  width:6px;
  height:6px;
  border:2px solid var(--chart-accent);
  border-radius:50%;
}
.media-article-page .media-article-toc__body a:hover{
  color:var(--chart-accent);
  background:#fff;
}
.media-article-page .media-article-toc__body ul ul{
  margin:0 0 3px 25px;
  padding:0 0 0 12px;
  border-left:1px solid #dbe5ed;
}
.media-article-page .media-article-toc__body ul ul a{
  padding:4px 8px;
  color:#728398;
  font-size:11.5px;
  font-weight:600;
  line-height:1.5;
}
.media-article-page .media-article-toc__body ul ul a:hover{
  color:var(--chart-accent);
}



/* =========================================================
   RELATED ARTICLES
   記事下の関連記事
========================================================= */
.media-related-articles{
  padding:46px 0 18px;
  background:#f7fafc;
  border-top:1px solid #e3ebf2;
  border-bottom:1px solid #e3ebf2;
}

.media-related-articles .media-wrap{
  width:min(100% - 40px,820px);
  margin:0 auto;
}

.media-related-articles .media-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:20px;
}

.media-related-articles .media-eyebrow{
  display:block;
  margin-bottom:4px;
  color:#7a8da1;
  font-family:"Space Grotesk",sans-serif;
  font-size:9px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.media-related-articles .media-section-head h2{
  margin:0;
  color:#17324d;
  font-size:20px;
  font-weight:900;
  line-height:1.45;
}

.media-related-articles .media-card-grid--related{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.media-related-articles .media-article-card{
  position:relative;
  display:block;
  min-width:0;
  padding:20px 22px 21px;
  color:inherit;
  background:#fff;
  border:1px solid #dce7ef;
  border-radius:14px;
  box-shadow:0 5px 16px rgba(25,71,112,.045);
  text-decoration:none;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.media-related-articles .media-article-card:hover{
  transform:translateY(-2px);
  border-color:#b9d2e5;
  box-shadow:0 10px 24px rgba(25,71,112,.09);
}

.media-related-articles .media-article-card__body{
  display:flex;
  flex-direction:column;
  min-height:100%;
}

.media-related-articles .media-article-card__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
}

.media-related-articles .media-article-card__meta span{
  display:inline-flex;
  align-items:center;
  min-height:23px;
  padding:3px 8px;
  color:var(--chart-accent);
  background:var(--chart-soft);
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  line-height:1.3;
}

.media-related-articles .media-article-card__meta time{
  color:#8797a8;
  font-size:10px;
  font-weight:600;
  letter-spacing:.02em;
}

.media-related-articles .media-article-card h3{
  margin:0;
  color:#163552;
  font-size:15.5px;
  font-weight:900;
  line-height:1.65;
}

.media-related-articles .media-article-card p{
  display:-webkit-box;
  overflow:hidden;
  margin:8px 0 0;
  color:#66798d;
  font-size:11.5px;
  line-height:1.75;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
}

.media-related-articles .media-article-card::after{
  content:"記事を読む  →";
  display:block;
  margin-top:15px;
  color:#176bc0;
  font-size:10.5px;
  font-weight:800;
}

/* 1件だけの場合は横長カードに */
.media-related-articles .media-card-grid--related > .media-article-card:only-child{
  grid-column:1 / -1;
}

.media-related-articles .media-card-grid--related > .media-article-card:only-child h3{
  font-size:16.5px;
}

@media(max-width:767px){
  .media-related-articles{
    padding:34px 0 14px;
  }

  .media-related-articles .media-wrap{
    width:min(100% - 30px,820px);
  }

  .media-related-articles .media-section-head{
    margin-bottom:15px;
  }

  .media-related-articles .media-section-head h2{
    font-size:18px;
  }

  .media-related-articles .media-card-grid--related{
    grid-template-columns:1fr;
    gap:12px;
  }

  .media-related-articles .media-article-card{
    padding:18px 18px 19px;
    border-radius:12px;
  }

  .media-related-articles .media-article-card h3,
  .media-related-articles .media-card-grid--related > .media-article-card:only-child h3{
    font-size:15px;
  }

  .media-related-articles .media-article-card p{
    font-size:11px;
    -webkit-line-clamp:2;
  }
}

/* =========================================================
   BOTTINO BRIDGE — 記事とサービスを控えめにつなぐ
========================================================= */
.shujii-section--bridge{
  padding:36px 0 18px;
  background:#fff;
}
.media-article-page .media-reading-wrap--bridge{
  width:min(100% - 40px,820px);
  max-width:820px;
  margin:0 auto;
  padding:0;
}
.shujii-bridge-box{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:30px;
  padding:24px 26px;
  border-top:1px solid #dce8f2;
  border-bottom:1px solid #dce8f2;
}
.shujii-bridge-box__eyebrow{
  display:block;
  margin-bottom:5px;
  color:#7b8da0;
  font-family:"Space Grotesk",sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:.16em;
}
.shujii-bridge-box h2{
  margin:0;
  color:#17324d;
  font-size:17px;
  font-weight:900;
  line-height:1.55;
}
.shujii-bridge-box p{
  margin:6px 0 0;
  color:#64768a;
  font-size:12px;
  line-height:1.75;
}
.shujii-bridge-box__link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#176bc0;
  font-size:12px;
  font-weight:800;
  text-decoration:none;
  white-space:nowrap;
}
.shujii-bridge-box__link span{
  transition:transform .15s ease;
}
.shujii-bridge-box__link:hover span{
  transform:translateX(3px);
}

/* =========================================================
   FINAL CTA — 最後だけ明確に次の行動を提示
========================================================= */
.shujii-section--final-cta{
  padding:34px 0 76px;
  background:#fff;
}
.media-article-page .media-reading-wrap--cta{
  width:min(100% - 40px,820px);
  max-width:820px;
  margin:0 auto;
  padding:0;
}
.shujii-cta-box{
  overflow:hidden;
  border:1px solid #d8e5ef;
  border-radius:20px;
  background:#f8fbfd;
  box-shadow:0 10px 28px rgba(20,67,110,.06);
}
.shujii-cta-box__head{
  padding:34px 36px 28px;
}
.shujii-cta-box__eyebrow{
  display:block;
  margin-bottom:8px;
  color:#227dcc;
  font-family:"Space Grotesk",sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:.16em;
}
.shujii-cta-box__head h2{
  margin:0;
  color:#102f50;
  font-size:clamp(24px,3vw,31px);
  font-weight:900;
  line-height:1.5;
}
.shujii-cta-box__head p{
  max-width:600px;
  margin:10px 0 0;
  color:#607389;
  font-size:13px;
  line-height:1.85;
}
.shujii-cta-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid #d8e5ef;
}
.shujii-cta-option{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:215px;
  padding:26px 28px;
  color:inherit;
  background:#fff;
  text-decoration:none;
  transition:background-color .18s ease,transform .18s ease;
}
.shujii-cta-option + .shujii-cta-option{
  border-left:1px solid #d8e5ef;
}
.shujii-cta-option:hover{
  background:#f4f9fd;
}
.shujii-cta-option__label{
  color:#71849a;
  font-family:"Space Grotesk",sans-serif;
  font-size:8px;
  font-weight:800;
  letter-spacing:.14em;
}
.shujii-cta-option strong{
  display:block;
  margin-top:8px;
  color:#163552;
  font-size:17px;
  font-weight:900;
  line-height:1.55;
}
.shujii-cta-option p{
  margin:8px 0 20px;
  color:#687b90;
  font-size:11.5px;
  line-height:1.75;
}
.shujii-cta-option__arrow{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:auto;
  color:#176bc0;
  font-size:11.5px;
  font-weight:800;
}
.shujii-cta-option__arrow span{
  transition:transform .15s ease;
}
.shujii-cta-option:hover .shujii-cta-option__arrow span{
  transform:translateX(3px);
}
.shujii-cta-option--consult .shujii-cta-option__arrow{
  color:#268653;
}

@media(max-width:767px){
  .media-article-page .media-article-toc{
    margin-bottom:38px;
    padding:18px 16px;
    border-radius:12px;
  }
  .media-article-page .media-article-toc__body a{
    padding-top:6px;
    padding-bottom:6px;
    font-size:12.5px;
  }
  .media-article-page .media-article-toc__body ul ul a{
    font-size:11px;
  }

  .shujii-section--bridge{
    padding:26px 0 12px;
  }
  .media-article-page .media-reading-wrap--bridge{
    width:min(100% - 30px,820px);
  }
  .shujii-bridge-box{
    grid-template-columns:1fr;
    gap:14px;
    padding:20px 4px;
  }
  .shujii-bridge-box h2{
    font-size:15px;
  }

  .shujii-section--final-cta{
    padding:26px 0 58px;
  }
  .media-article-page .media-reading-wrap--cta{
    width:min(100% - 30px,820px);
  }
  .shujii-cta-box{
    border-radius:16px;
  }
  .shujii-cta-box__head{
    padding:26px 22px 22px;
  }
  .shujii-cta-box__head h2{
    font-size:23px;
  }
  .shujii-cta-options{
    grid-template-columns:1fr;
  }
  .shujii-cta-option{
    min-height:0;
    padding:22px;
  }
  .shujii-cta-option + .shujii-cta-option{
    border-left:0;
    border-top:1px solid #d8e5ef;
  }
  .shujii-cta-option strong{
    font-size:16px;
  }
}