/* Maeshima RC inner hero v0.2.0（C-CORE-V10-D153 2026-09-18：D-153 medical block を末尾に追加。D-154 block は v0.1.0 のまま byte 不変）— D-154／B_GENERAL_INNER_HERO_SPEC v1.0
   Family A `.mrc-inner-hero--compact-logo`：Inner Hero / Logo Motif Compact。Family B `.mrc-photo-hero--editorial`：Photo Hero / Editorial Clean。
   SERUM の #page_header 構造（.catch > span、.overlay、.bg_image）は不変。green rectangle／pill／signboard＝0。H1 は HTML text。Google Fonts 0（system serif／sans のみ）。animation／parallax なし。
   mrc-design-v1 が付かない page（search／map 外の固定 page）でも単独で成立するよう、token は本 file 内で定義する。 */
:root { --mrc-ih-ink: #24352F; --mrc-ih-green: #2F5D50; --mrc-ih-ivory: #FAF8F3; --mrc-ih-sage: #F2F7F3; --mrc-ih-line: #D8E3DC;
        --mrc-ih-serif: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Times New Roman", serif;
        --mrc-ih-sans: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif; }

/* ---------- 共通：green title box の撤去（両 family） ---------- */
body.mrc-inner-hero--compact-logo #page_header .catch,
body.mrc-photo-hero--editorial #page_header .catch { writing-mode: horizontal-tb !important; text-orientation: mixed; font-family: var(--mrc-ih-serif); font-weight: 600; letter-spacing: .03em; line-height: 1.4; box-sizing: border-box; max-width: 100%; }
body.mrc-inner-hero--compact-logo #page_header .catch span,
body.mrc-photo-hero--editorial #page_header .catch span { display: inline-block; background: none !important; padding: 0 !important; border-radius: 0 !important; box-shadow: none; writing-mode: horizontal-tb !important; max-width: 100%; text-wrap: balance; overflow-wrap: anywhere; }

/* ---------- Family A｜Inner Hero / Logo Motif Compact ---------- */
body.mrc-inner-hero--compact-logo #page_header {
  height: auto !important; min-height: 210px; padding: 56px 24px 52px;                       /* PC 180〜230px 目安。長い H1 は自然に伸びる */
  display: flex; align-items: center; justify-content: center;
  background-color: var(--mrc-ih-ivory);
  background-image: url("mrc-logo-motif.svg"), linear-gradient(180deg, #FFFFFF 0%, var(--mrc-ih-ivory) 100%);   /* 1 層目（上）＝site-owned motif（右下、薄く）、2 層目＝white→warm ivory */
  background-repeat: no-repeat, no-repeat; background-size: 640px auto, 100% 100%; background-position: right -60px bottom -80px, 0 0;
}
body.mrc-inner-hero--compact-logo #page_header .bg_image,
body.mrc-inner-hero--compact-logo #page_header .overlay { display: none !important; }    /* SERUM 既定の header 写真／overlay は使わない（写真を主要 visual としない page） */
body.mrc-inner-hero--compact-logo #page_header .catch { color: var(--mrc-ih-ink); text-align: center; font-size: clamp(1.6rem, .9rem + 2.2vw, 2.4rem); padding: 0; margin: 0; max-width: 24em; }
body.mrc-inner-hero--compact-logo #page_header .catch span { color: var(--mrc-ih-ink); text-shadow: none; word-break: auto-phrase; }   /* Chrome：句単位の改行（非対応 browser は balance のみ） */
body.mrc-inner-hero--compact-logo #bread_crumb { border-top: 1px solid var(--mrc-ih-line); }   /* hero → breadcrumb：細線のみ（色帯なし） */
@media only screen and (max-width: 800px) {
  body.mrc-inner-hero--compact-logo #page_header { min-height: 150px; padding: 36px 20px 32px; background-size: 380px auto, 100% 100%; background-position: right -50px bottom -60px, 0 0; }
  body.mrc-inner-hero--compact-logo #page_header .catch { font-size: clamp(1.35rem, 1rem + 2.2vw, 1.7rem); }
}
@media (prefers-reduced-motion: reduce) { body.mrc-inner-hero--compact-logo #page_header .catch span { transition: none; transform: none; opacity: 1; } }

/* ---------- Family B｜Photo Hero / Editorial Clean ---------- */
body.mrc-photo-hero--editorial #page_header { justify-content: flex-start; overflow: hidden; }
body.mrc-photo-hero--editorial #page_header .bg_image img { object-position: 50% 45%; }
body.mrc-photo-hero--editorial #page_header .overlay {
  background: linear-gradient(90deg, rgba(36, 53, 47, .58) 0%, rgba(36, 53, 47, .44) 40%, rgba(36, 53, 47, .22) 70%, rgba(36, 53, 47, .08) 100%) !important;   /* text-side soft gradient：写真の内容は残す */
}
body.mrc-photo-hero--editorial #page_header .catch {
  position: relative; text-align: left; color: #fff; max-width: min(100%, 80%); font-size: clamp(1.5rem, .75rem + 3vw, 2.85rem);
  padding: 0 24px 0 max(24px, calc((100vw - 1280px) / 2 + 40px)); margin: 0;
}
body.mrc-photo-hero--editorial #page_header .catch span { display: block; max-width: 22em; color: #fff; text-shadow: none; word-break: normal; }
/* 文字域背後の縁なし局所 assist（Layer 3d と同じ考え方）：左は画面外へ、右は透明へ、上下は mask で溶かす */
body.mrc-photo-hero--editorial #page_header .catch::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none; inset: -40% -280px -40% -100vw;
  background: linear-gradient(90deg, rgba(36, 53, 47, .60) 0%, rgba(36, 53, 47, .58) calc(100% - 280px), rgba(36, 53, 47, .30) calc(100% - 140px), rgba(36, 53, 47, 0) 100%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000 28%, #000 72%, rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000 28%, #000 72%, rgba(0,0,0,0) 100%);
}
@media only screen and (max-width: 800px) {
  body.mrc-photo-hero--editorial #page_header .overlay { background: linear-gradient(90deg, rgba(36, 53, 47, .60) 0%, rgba(36, 53, 47, .48) 50%, rgba(36, 53, 47, .30) 80%, rgba(36, 53, 47, .18) 100%) !important; }
  body.mrc-photo-hero--editorial #page_header .catch { max-width: 100%; padding: 0 20px; font-size: clamp(1.5rem, 1rem + 3vw, 1.9rem); }
  body.mrc-photo-hero--editorial #page_header .catch span { max-width: 100%; }
  body.mrc-photo-hero--editorial #page_header .catch::before { inset: -40% -120px -40% -100vw; background: linear-gradient(90deg, rgba(36, 53, 47, .62) 0%, rgba(36, 53, 47, .60) calc(100% - 120px), rgba(36, 53, 47, 0) 100%); }
}
@media (prefers-reduced-motion: reduce) { body.mrc-photo-hero--editorial #page_header .catch span { transition: none; transform: none; opacity: 1; } }

/* ---------- D-153｜Medical Inner Hero / Logo Motif（C-CORE-V10-D153 2026-09-18、B_MEDICAL_INNER_HERO_SPEC v1.0）scope：body.mrc-inner-hero--medical-logo-motif ----------
   /medical-contents/ 配下（疾患・治療薬・医学 hub・同系統 inner page）。旧 Variant B の大きな deep-green 単色面（Layer 3e）／photo hero を標準から外し、
   white→warm ivory→very pale sage の light background＋site-owned mrc-medical-logo-motif.svg（右〜右下、低 opacity のリボン状流線＋白細線）。
   H1 は dark ink-green の system serif を背景へ直置き（box／pill／signboard なし）、左寄せで breadcrumb の左端（SERUM 930px 列）に揃える。短い accent 1 本のみ（H2 rule とは別）。
   高さは auto（PC min 280px／mobile min 200px：spec §5 の 240〜320／180〜240 目安）。長い H1 は自然に伸びる。breadcrumb は hero 直下、細線 1px のみ。
   mrc-inner-hero.php が同 page の Variant B class（mrc-hero--editorial*／mrc-hero-role--*）を外すため、競合する design-system Layer 3d／3e は適用されない。
   rollback＝本 block と mrc-medical-logo-motif.svg の削除（＋PHP の medical 判定除去）→ Variant B へ戻る。 */
body.mrc-inner-hero--medical-logo-motif #page_header {
  height: auto !important; min-height: 280px; padding: 64px 24px 60px; box-sizing: border-box;
  display: flex; align-items: center; justify-content: flex-start; overflow: hidden;
  background-color: var(--mrc-ih-ivory);
  background-image: url("mrc-medical-logo-motif.svg"), linear-gradient(180deg, #FFFFFF 0%, var(--mrc-ih-ivory) 100%);   /* 1 層目（上）＝site-owned motif、2 層目＝white→warm ivory */
  background-repeat: no-repeat, no-repeat; background-size: 880px auto, 100% 100%; background-position: right -40px bottom -70px, 0 0;
}
body.mrc-inner-hero--medical-logo-motif #page_header .bg_image,
body.mrc-inner-hero--medical-logo-motif #page_header .overlay { display: none !important; }   /* 写真・overlay は使わない（img の request 自体は PHP 側で 1×1 GIF に差し替え） */
body.mrc-inner-hero--medical-logo-motif #page_header .catch {
  position: static; color: var(--mrc-ih-ink); text-align: left; writing-mode: horizontal-tb !important;
  font-family: var(--mrc-ih-serif); font-weight: 600; font-size: clamp(1.7rem, 1rem + 2vw, 2.6rem); line-height: 1.45; letter-spacing: .03em;
  margin: 0; padding: 0 24px 0 max(24px, calc((100% - 930px) / 2)); max-width: min(100%, 78%); box-sizing: border-box;   /* 左端＝breadcrumb 列（930px 中央寄せ）の左端。PC 1440 → 176px。文字域は 78%−padding≒786px（18 字/行：33 字の SLE H1 も 2 行） */
}
body.mrc-inner-hero--medical-logo-motif #page_header .catch span {
  display: block; max-width: 24em; color: var(--mrc-ih-ink); background: none !important; padding: 0 !important; border-radius: 0 !important; box-shadow: none; text-shadow: none;
  text-wrap: balance; word-break: normal; overflow-wrap: anywhere; writing-mode: horizontal-tb !important;   /* editorial と同じく PC は balance のみ（auto-phrase は短行が増えるため不使用） */
}
body.mrc-inner-hero--medical-logo-motif #page_header .catch::before { display: none !important; }   /* Variant B の局所 assist は不要 */
body.mrc-inner-hero--medical-logo-motif #page_header .catch::after { content: ""; display: block; width: 48px; height: 2px; margin-top: .6em; background: rgba(47, 93, 80, .55); }   /* spec §4：短い accent 1 本のみ */
body.mrc-inner-hero--medical-logo-motif #bread_crumb { border-top: 1px solid var(--mrc-ih-line); }   /* hero → breadcrumb：細線のみ（色帯なし） */
@media only screen and (max-width: 800px) {
  body.mrc-inner-hero--medical-logo-motif #page_header { min-height: 200px; padding: 40px 20px 36px; background-size: 500px auto, 100% 100%; background-position: right -110px bottom -70px, 0 0; }   /* 390：motif を右下へ crop、H1 背後には薄い裾のみ */
  body.mrc-inner-hero--medical-logo-motif #page_header .catch { font-size: clamp(1.35rem, 1rem + 2.2vw, 1.7rem); max-width: 100%; padding: 0; }
  body.mrc-inner-hero--medical-logo-motif #page_header .catch span { max-width: 100%; word-break: auto-phrase; }   /* mobile：D-134 Layer 3c と同じく句単位の改行（左寄せなので行長の不揃いは許容。非対応 browser は balance のみ） */
  body.mrc-inner-hero--medical-logo-motif #page_header .catch::after { width: 40px; margin-top: .5em; }
}
@media (prefers-reduced-motion: reduce) { body.mrc-inner-hero--medical-logo-motif #page_header .catch span { transition: none; transform: none; opacity: 1; } }