/* ==========================================================================
   scientific-hub-style.css
   Scientific Hubページ（page-scientific-hub.php）専用スタイル
   デザイントークン：ネイビー #004183／コーラル #C63031
   フォント：Zen Old Mincho（見出し）／Zen Kaku Gothic New（本文）
   company-style.css の構成に準拠（同じ子テーマ内でのトーン統一のため）

   ★2026-07-20：本文が小さいとのフィードバックにより、全フォントサイズを
     一律120%（×1.2）にスケールアップ（タイトルも含め同率で拡大し、
     見出しと本文の相対バランスは変更前と同じ比率を維持）。
   ★同日、ヒーロー背景画像枠を追加。会社概要ページで「ブルーが強すぎる」との
     指摘があったため、ネイビーの重ねは最初から薄め（opacity 0.3〜0.5）で実装。
   ========================================================================== */

.sh-page {
  --sh-navy: #004183;
  --sh-coral: #C63031;
  --sh-bg-soft: #F7F9FB;
  --sh-text: #262626;
  font-family: "Zen Kaku Gothic New", sans-serif;
  color: var(--sh-text);
  line-height: 1.8;
}

.sh-page h1,
.sh-page h2,
.sh-page h3 {
  font-family: "Zen Old Mincho", serif;
  color: var(--sh-navy);
}

.sh-page section > div {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 24px;
}

.sh-section-title {
  text-align: center;
  font-size: 1.8rem; /* 旧1.5rem×1.2 */
  margin-bottom: 12px;
  position: relative;
}
.sh-section-title::after {
  content: "";
  display: block;
  width: 48px;
  height: 3px;
  background: var(--sh-coral);
  margin: 12px auto 0;
}
.sh-section-lead {
  text-align: center;
  font-size: 1.1rem; /* 旧0.92rem×1.2 */
  color: #666;
  margin: 0 0 36px;
}

/* ---------- ヒーロー ---------- */
.sh-hero {
  position: relative;
  background: var(--sh-navy);
  padding: 88px 0;
  text-align: center;
  overflow: hidden;
  min-height: 300px;
  display: flex;
  align-items: center;
}
.sh-hero .sh-hero__inner { width: 100%; }
.sh-hero .sh-hero__bg {
  position: absolute;
  inset: 0;
  max-width: none;
  padding: 0;
  margin: 0;
  z-index: 0;
}
.sh-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 0.85;
}
.sh-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  /* 会社概要ページの「ブルーが強すぎる」フィードバックを踏まえ、最初から薄めに設定 */
  background: linear-gradient(180deg, rgba(0,65,131,0.3), rgba(0,65,131,0.5));
}
.sh-hero__inner {
  position: relative;
  z-index: 1;
}
.sh-hero .sh-hero__title {
  /* .sh-page h1,h2,h3 のネイビー指定より詳細度を上げ、ダーク背景上で白文字を確実に優先させる
     （page-company.phpで発生した同種のCSS詳細度バグの再発防止） */
  color: #fff;
  font-size: 2.52rem; /* モバイルファースト基準値。旧2.1rem×1.2 */
  margin: 0 0 16px;
}
.sh-hero__eyebrow {
  color: #fff;
  opacity: 0.7;
  font-size: 1.02rem; /* 旧0.85rem×1.2 */
  letter-spacing: 0.1em;
  margin-bottom: 12px;
}
.sh-hero__sub {
  color: #fff;
  opacity: 0.92;
  font-size: 1.2rem; /* 旧1rem×1.2 */
  line-height: 1.9;
  max-width: 560px;
  margin: 0 auto;
}

/* ---------- 特許 ---------- */
.sh-patents {
  background: #fff;
  padding: 64px 0;
}
.sh-patents__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.sh-patents__item {
  background: var(--sh-bg-soft);
  border-left: 4px solid var(--sh-navy);
  border-radius: 4px;
  padding: 20px 24px;
}
.sh-patents__no {
  display: inline-block;
  font-weight: 700;
  color: var(--sh-coral);
  font-size: 1.02rem; /* 旧0.85rem×1.2 */
  margin-bottom: 6px;
}
.sh-patents__title {
  font-size: 1.22rem; /* 旧1.02rem×1.2 */
  margin: 0 0 6px;
}
.sh-patents__date {
  font-size: 1.02rem; /* 旧0.85rem×1.2 */
  color: #666;
  margin: 0;
}

/* ==========================================================================
   【2026-09-05】特許セクション演出（モックアップ 特許演出_モックアップ_20260904.html を移植）
   マレーシア特許（4件目）の追加にあわせ、件数カウンター／ヒーローカード／
   日本→マレーシアの弧／タイムライン／国内3件リスト の5ブロック構成に変更。

   ★アニメーションの初期状態（opacity:0 等）は必ず .sh-anim 配下に置くこと。
     .sh-anim は JS が起動したときだけ付与されるため、JS無効・IO非対応・
     prefers-reduced-motion:reduce の環境では全要素が最初から見える完成形になる。
     ここを .sh-anim の外に書くと、JSが死んだ瞬間にセクションが消える。
   ========================================================================== */
.sh-patents {
  --sh-gold-lt: #E8C976;
}

/* ---- ① 件数 ---- */
.sh-count {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 18px;
  margin: 0 0 12px;
}
.sh-count__label,
.sh-count__unit {
  font-family: "Zen Old Mincho", serif;
  font-size: 1.6rem;
  color: var(--sh-navy);
  padding-bottom: .5rem;
}
.sh-count__num {
  font-family: "Zen Old Mincho", serif;
  font-weight: 900;
  font-size: 5rem;
  line-height: 1;
  color: var(--sh-navy);
  font-variant-numeric: tabular-nums;
}
.sh-count__break {
  text-align: center;
  font-size: 1rem;
  color: #666;
  margin: 0 0 8px;
}
.sh-count__break i {
  font-style: normal;
  color: var(--sh-navy);
  font-weight: 700;
}
.sh-count__rule {
  width: 64px;
  height: 1px;
  background: #D9DEE4;
  margin: 28px auto 0;
}
.sh-anim .sh-count__break {
  opacity: 0;
  transform: translateY(8px);
  transition: .7s .5s;
}
.sh-anim .sh-count__break.on {
  opacity: 1;
  transform: none;
}

/* ---- ② マレーシア特許ヒーローカード ---- */
.sh-my { margin: 48px 0 0; }
.sh-anim .sh-my {
  opacity: 0;
  transform: translateY(28px) rotate(-.6deg);
  transition: 1s cubic-bezier(.2,.7,.2,1);
}
.sh-anim .sh-my.on {
  opacity: 1;
  transform: none;
}
.sh-my__eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 18px;
}
/* 【2026-09-05 不具合修正】NEWバッジがグレーで表示されていた。
   原因は下の .sh-my__eyebrow span（クラス+要素＝詳細度0,1,1）が
   .sh-my__new（0,1,0）に競り勝ち、color:#fff と font-size:.72rem を
   #666 / .95rem で上書きしていたこと。
   対処：説明テキスト側を :not(.sh-my__new) で除外し、バッジ側も
   .sh-my__eyebrow を前置して詳細度を上げる（二重に担保）。 */
.sh-my__eyebrow .sh-my__new {
  display: inline-block;
  background: var(--sh-coral);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  padding: 5px 11px;
  border-radius: 2px;
}
.sh-my__eyebrow > span:not(.sh-my__new) {
  font-size: .95rem;
  color: #666;
  letter-spacing: .04em;
}
.sh-my__card {
  position: relative;
  border: 1px solid #E3E7EC;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 18px 44px -22px rgba(0,65,131,.34);
}
.sh-my__band {
  height: 4px;
  background: linear-gradient(90deg, var(--sh-navy) 0%, var(--sh-navy) 48%, var(--sh-coral) 48%, var(--sh-coral) 100%);
}
.sh-my__grid {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
}
.sh-my__doc {
  position: relative;
  background: #fff;
  border-right: 1px solid #EDF0F3;
  padding: 22px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.sh-my__doc img {
  width: 100%;
  height: auto;
  display: block;
}
/* ギミック：金の光が特許証の上を斜めに走る */
.sh-my__doc::after {
  content: "";
  position: absolute;
  inset: -40% -60%;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 42%, rgba(232,201,118,0) 46%, rgba(232,201,118,.55) 50%, rgba(255,255,255,.75) 52%, rgba(232,201,118,.45) 54%, transparent 60%);
  transform: translateX(-120%);
}
.sh-anim .sh-my.on .sh-my__doc::after {
  animation: sh-sweep 2.4s cubic-bezier(.4,0,.2,1) .55s 1 forwards;
}
@keyframes sh-sweep { to { transform: translateX(120%); } }
/* 【2026-09-05】「※特許証の一部を掲載しています」のキャプションは削除指示により撤去。
   復活時に備えてスタイルのみ温存（現在どこからも参照されない）。 */
.sh-my__doccap {
  position: absolute;
  left: 22px;
  bottom: 10px;
  font-size: .68rem;
  color: #9AA3AD;
  letter-spacing: .02em;
}
.sh-my__data {
  padding: 30px 28px;
  background: var(--sh-bg-soft);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.sh-my__country {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 4px;
}
.sh-my__country img {
  width: 38px;
  height: auto;
  display: block;
}
.sh-my__country b {
  font-family: "Zen Old Mincho", serif;
  font-size: 1.5rem;
  color: var(--sh-navy);
  font-weight: 700;
  letter-spacing: .02em;
}
.sh-my__country small {
  display: block;
  font-size: .7rem;
  color: #8A93A0;
  letter-spacing: .16em;
  font-family: sans-serif;
  margin-top: 2px;
}
.sh-my__no {
  font-family: "Zen Old Mincho", serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--sh-coral);
  letter-spacing: .02em;
  margin: 14px 0 2px;
  line-height: 1.2;
}
.sh-my__dl {
  margin: 14px 0 0;
  border-top: 1px solid #E1E6EC;
  padding-top: 14px;
  font-size: .95rem;
}
.sh-my__dl div {
  display: flex;
  gap: 14px;
  padding: 5px 0;
}
.sh-my__dl dt {
  flex: 0 0 88px;
  color: #7A828C;
  font-size: .85rem;
  margin: 0;
  padding-top: .15em;
}
.sh-my__dl dd {
  margin: 0;
  font-weight: 500;
}
/* 【2026-09-05】NEWバッジと同じ詳細度の取りこぼし。.sh-my__dl dd（0,1,1）が
   .sh-my__owner（0,1,0）に勝ち、font-weight:700 が 500 に潰されていた。
   .sh-my__dl を前置して詳細度を揃える。 */
.sh-my__dl .sh-my__owner {
  color: var(--sh-navy);
  font-weight: 700;
}

/* ---- ③④ 日本→マレーシアの弧／タイムライン ----
   【2026-09-05】確定モックアップに存在しないためマークアップ側を撤去済み。
   復活できるようスタイルのみ温存している（現在どこからも参照されない）。 */
.sh-arc {
  margin: 40px 0 0;
  padding: 34px 0 28px;
  background: var(--sh-bg-soft);
  border-radius: 6px;
  text-align: center;
}
.sh-arc svg {
  width: 100%;
  max-width: 620px;
  height: auto;
  display: block;
  margin: 0 auto;
}
.sh-arc__path {
  fill: none;
  stroke: var(--sh-coral);
  stroke-width: 2.2;
  stroke-linecap: round;
}
.sh-arc__lab {
  font-family: "Zen Old Mincho", serif;
  font-size: 15px;
  fill: var(--sh-navy);
}
.sh-arc__cap {
  font-family: "Zen Old Mincho", serif;
  font-size: 1.15rem;
  color: var(--sh-navy);
  margin: 14px 0 0;
}
.sh-arc__dot { transform-box: fill-box; transform-origin: center; }
.sh-anim .sh-arc__path { stroke-dasharray: 460; stroke-dashoffset: 460; }
.sh-anim .sh-my.on .sh-arc__path {
  animation: sh-draw 1.9s cubic-bezier(.3,.6,.2,1) 1.1s forwards;
}
@keyframes sh-draw { to { stroke-dashoffset: 0; } }
.sh-anim .sh-arc__dot { opacity: 0; }
.sh-anim .sh-my.on .sh-arc__dot--jp { animation: sh-pop .5s ease .9s forwards; }
.sh-anim .sh-my.on .sh-arc__dot--my { animation: sh-pop .5s ease 2.7s forwards; }
@keyframes sh-pop {
  from { opacity: 0; transform: scale(.4); }
  to   { opacity: 1; transform: scale(1); }
}
.sh-anim .sh-arc__cap { opacity: 0; transition: .9s; }
.sh-anim .sh-my.on .sh-arc__cap { opacity: 1; transition-delay: 3s; }

/* ---- ④ タイムライン ---- */
.sh-tl { margin: 56px 0 0; }
.sh-tl__h {
  text-align: center;
  font-size: 1.05rem;
  color: #666;
  margin: 0 0 26px;
}
.sh-tl__track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
.sh-tl__track::before {
  content: "";
  position: absolute;
  left: 6%;
  right: 6%;
  top: 9px;
  height: 2px;
  background: #E1E6EC;
}
.sh-tl__track::after {
  content: "";
  position: absolute;
  left: 6%;
  top: 9px;
  height: 2px;
  background: var(--sh-navy);
  width: 88%;
}
.sh-anim .sh-tl__track::after {
  width: 0;
  transition: width 2.2s cubic-bezier(.3,.6,.2,1) .4s;
}
.sh-anim .sh-tl.on .sh-tl__track::after { width: 88%; }
.sh-tl__step {
  position: relative;
  text-align: center;
  padding-top: 30px;
}
.sh-tl__step::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 50%;
  transform: translateX(-50%);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--sh-navy);
  transition: .4s;
}
.sh-tl__step--last::before {
  background: var(--sh-coral);
  border-color: var(--sh-coral);
  box-shadow: 0 0 0 5px rgba(198,48,49,.16);
}
.sh-anim .sh-tl__step::before { border-color: #CFD6DE; }
.sh-anim .sh-tl__step--last::before { background: #fff; box-shadow: none; }
.sh-anim .sh-tl.on .sh-tl__step::before { border-color: var(--sh-navy); }
.sh-anim .sh-tl.on .sh-tl__step--last::before {
  background: var(--sh-coral);
  border-color: var(--sh-coral);
  box-shadow: 0 0 0 5px rgba(198,48,49,.16);
}
.sh-tl__d {
  display: block;
  font-family: "Zen Old Mincho", serif;
  font-size: 1rem;
  color: var(--sh-navy);
  font-weight: 700;
}
.sh-tl__t {
  display: block;
  font-size: .82rem;
  color: #7A828C;
  margin-top: 2px;
}

/* ---- ③ 国内特許3件 ---- */
.sh-jp {
  margin: 64px 0 0;
  padding-top: 52px;
  border-top: 1px solid #EDF0F3;
}
.sh-jp__h {
  text-align: center;
  font-size: 1.25rem;
  margin-bottom: 6px;
}
.sh-jp__lead {
  text-align: center;
  font-size: .98rem;
  color: #666;
  margin: 0 0 30px;
}
/* 【2026-09-05】国内特許証3枚の実写。原本 kokunai-tokkyo3.jpg は468×292。
   原寸を超えて拡大するとぼけるため、上限を実寸の468pxに合わせて中央に置く。 */
.sh-jp__photo {
  max-width: 468px;
  margin: 0 auto 38px;
}
.sh-jp__photo img {
  width: 100%;
  height: auto;
  display: block;
}
.sh-jp__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.sh-jp__item {
  background: var(--sh-bg-soft);
  border-left: 4px solid var(--sh-navy);
  border-radius: 4px;
  padding: 16px 22px;
  display: flex;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
}
.sh-anim .sh-jp__item {
  opacity: 0;
  transform: translateX(-10px);
  transition: .6s;
}
.sh-anim .sh-jp__item.on {
  opacity: 1;
  transform: none;
}
.sh-jp__no {
  font-weight: 700;
  color: var(--sh-coral);
  font-size: 1.06rem;
}
.sh-jp__date {
  font-size: .95rem;
  color: #666;
}

/* ---- ⑥ 注記 ---- */
.sh-patents__foot {
  margin: 44px auto 0;
  max-width: 760px;
  font-size: .8rem;
  color: #8A929B;
  line-height: 1.9;
  border-top: 1px solid #EDF0F3;
  padding-top: 18px;
}

/* ---- レスポンシブ ---- */
@media (max-width: 760px) {
  .sh-my__grid { grid-template-columns: 1fr; }
  .sh-my__doc {
    border-right: 0;
    border-bottom: 1px solid #EDF0F3;
  }
}
@media (max-width: 640px) {
  .sh-count__num { font-size: 3.8rem; }
  .sh-count__label,
  .sh-count__unit { font-size: 1.3rem; }
  .sh-tl__track { grid-template-columns: 1fr; gap: 22px; }
  .sh-tl__track::before,
  .sh-tl__track::after { display: none; }
  .sh-tl__step { text-align: left; padding: 0 0 0 30px; }
  .sh-tl__step::before { top: 6px; left: 0; transform: none; }
}

/* ---------- 共同研究 ---------- */
.sh-research {
  background: var(--sh-bg-soft);
  padding: 64px 0;
}
.sh-research__list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.sh-research__item {
  background: #fff;
  border-radius: 8px;
  padding: 24px 28px;
  box-shadow: 0 2px 12px rgba(0, 65, 131, 0.06);
}
.sh-research__item h3 {
  font-size: 1.22rem; /* 旧1.02rem×1.2 */
  margin: 0 0 10px;
}
.sh-research__theme {
  font-size: 1.08rem; /* 旧0.9rem×1.2 */
  line-height: 1.9;
  margin: 0;
  color: var(--sh-text);
}

/* ---------- 学会発表実績 ---------- */
.sh-conf {
  background: var(--sh-bg-soft);
  padding: 64px 0;
}
.sh-conf__legend {
  text-align: center;
  font-size: 0.98rem; /* 旧0.82rem×1.2 */
  color: #666;
  margin: 0 0 28px;
}
.sh-conf__legend .is-overseas {
  color: var(--sh-coral);
}
.sh-conf__years {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sh-conf__year {
  background: #fff;
  border-radius: 8px;
  padding: 4px 24px;
}
.sh-conf__year summary {
  padding: 16px 0;
  font-family: "Zen Old Mincho", serif;
  color: var(--sh-navy);
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: 1.1rem;
}
.sh-conf__count {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-size: 0.96rem; /* 旧0.8rem×1.2 */
  color: #888;
}
.sh-conf__list {
  list-style: none;
  margin: 0;
  padding: 0 0 18px;
}
.sh-conf__list li {
  font-size: 1.08rem; /* 旧0.9rem×1.2 */
  padding: 8px 0;
  border-top: 1px solid #E5E9ED;
}
.sh-conf__list li.is-overseas {
  color: var(--sh-coral);
}

/* ---------- その他共同研究機関 ---------- */
.sh-others {
  background: #fff;
  padding: 56px 0 64px;
  text-align: center;
}
.sh-others__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}
.sh-others__list li {
  background: var(--sh-bg-soft);
  border-radius: 999px;
  padding: 8px 20px;
  font-size: 1.06rem; /* 旧0.88rem×1.2 */
}
/* 【2026-09-05】特許セクションと同じスクロール時間差表示。
   チップは中央寄せの折り返しレイアウトなので、横スライドではなく
   下からの浮かび上がりにする（横だと折り返し位置で動きが不揃いに見えるため）。
   ★他の演出と同様、初期状態は必ず .sh-anim 配下に置くこと。
     .sh-anim はJS起動時のみ付与されるため、JS無効時は最初から全件見える。 */
.sh-anim .sh-others__list li {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1);
}
.sh-anim .sh-others__list li.on {
  opacity: 1;
  transform: none;
}

/* ---------- 獣医師による情報発信（2026-08-30追加） ----------
   直前の .sh-conf が var(--sh-bg-soft) のため、背景の交互リズムを保って白地にする。
   カードは製品カードの基準（白背景＋#E5E9ED輪郭線）に合わせている。
   クリーム系背景×輪郭線なしのパターンは過去にNG判定が出ているため使わない。 */
.sh-vet {
  background: #fff;
  padding: 56px 0 72px;
}
.sh-vet__card {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  background: #fff;
  border: 1px solid #E5E9ED;
  border-radius: 12px;
  padding: 28px 32px;
}
.sh-vet__icon {
  flex: none;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--sh-bg-soft);
  color: var(--sh-navy);
}
.sh-vet__body {
  flex: 1 1 auto;
  min-width: 0;
}
.sh-vet__name {
  font-family: "Zen Old Mincho", serif;
  color: var(--sh-navy);
  font-weight: 700;
  font-size: 1.2rem;
  margin: 0 0 8px;
}
.sh-vet__desc {
  font-size: 1.02rem;
  line-height: 1.85;
  margin: 0 0 10px;
}
/* 薬機法上の注記。目立ちすぎず、しかし確実に読める濃度に置く。 */
.sh-vet__note {
  font-size: 0.92rem;
  color: #777;
  margin: 0 0 20px;
}
.sh-vet__btn {
  display: inline-block;
  background: var(--sh-navy);
  color: #fff;
  font-weight: 700;
  font-size: 1.02rem;
  padding: 12px 32px;
  border-radius: 999px;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.sh-vet__btn:hover {
  opacity: 0.85;
  color: #fff;
}

/* ---------- CTA ---------- */
.sh-cta {
  padding: 56px 0 80px;
  text-align: center;
}
.sh-cta__button {
  display: inline-block;
  background: var(--sh-coral);
  color: #fff;
  font-weight: 700;
  font-size: 1.26rem; /* 旧1.05rem×1.2 */
  padding: 16px 52px;
  border-radius: 999px;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.sh-cta__button:hover {
  opacity: 0.85;
  color: #fff;
}

/* ---------- レスポンシブ ---------- */
@media (min-width: 768px) {
  .sh-hero {
    /* 2026-07-29：全ページ共通のコンテンツ最大値に合わせた固定height＋flex中央寄せ方式
       （詳細はcompany-style.css .co-heroのコメント参照） */
    height: 437px;
    padding: 110px 0;
  }
  .sh-hero .sh-hero__title {
    font-size: 3rem;
  }
}

@media (max-width: 767px) {
  .sh-research__item {
    padding: 20px;
  }
  /* スマホではアイコンを上に逃がして本文の折り返しを確保する */
  .sh-vet__card {
    flex-direction: column;
    gap: 16px;
    padding: 24px 20px;
  }
  .sh-vet__btn {
    display: block;
    text-align: center;
  }
}

/* ==========================================================================
   【2026-09-22】改善仕様書T-8：/research/ 分割に伴う追加スタイル
   ========================================================================== */
.sh-hero__eyebrow a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,0.5); }
.sh-hero__eyebrow a:hover { color: #fff; }

/* 入口ページの3カード */
.sh-hubnav { background: var(--sh-bg-soft); padding: 56px 0 64px; }
.sh-hubnav__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.sh-hubnav__card {
  display: block; height: 100%; box-sizing: border-box;
  background: #fff; border: 1px solid #d9e1ea; border-top: 3px solid var(--sh-navy);
  border-radius: 8px; padding: 24px 22px 20px; text-decoration: none; color: var(--sh-text);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.sh-hubnav__card:hover { box-shadow: 0 6px 18px rgba(0,65,131,0.12); transform: translateY(-2px); color: var(--sh-text); }
.sh-hubnav__label { display: block; font-family: "Zen Old Mincho", serif; font-weight: 700; font-size: 1.35rem; color: var(--sh-navy); margin-bottom: 8px; }
.sh-hubnav__desc  { display: block; font-size: 1rem; color: #555; line-height: 1.7; margin-bottom: 14px; }
.sh-hubnav__more  { display: block; font-size: 0.95rem; font-weight: 700; color: var(--sh-coral); }
@media (min-width: 768px) {
  .sh-hubnav__list { grid-template-columns: repeat(3, 1fr); }
}

/* 下層ページ下部の相互リンク */
.sh-subnav { background: var(--sh-bg-soft); padding: 36px 0 44px; border-top: 1px solid #e6ebf0; }
.sh-subnav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px; }
.sh-subnav__list a { color: var(--sh-navy); font-weight: 700; text-decoration: none; font-size: 1.02rem; }
.sh-subnav__list a:hover { text-decoration: underline; }