/* =========================================================
  okc-page-clinics.css  (PAGE DIFF / CLINIC PAGES)
  Scope:
  - .outline_page_scope.okc-page-clinics
  - .clinic-page--temmabashi
  - .clinic-page--okamoto

  対象：
  - 天満橋甲状腺クリニック
  - 岡本甲状腺クリニック

  方針：
  - テーマCSSは触らず、両院ページ共通差分のみをスコープ配下で上書き
  - 余白は okc-foundation.css の変数（--sp-*）に準拠
  - 予約ページには適用しない（loader側で除外）
========================================================= */


/* =========================================================
  C-0) MV → 直下コンテンツの間隔
========================================================= */
.outline_page_scope.okc-page-clinics .page_mv + .container{
  margin-top: var(--sp-m) !important;
}

@media (max-width: 767.98px){
  .outline_page_scope.okc-page-clinics .page_mv + .container{
    margin-top: var(--sp-s) !important;
  }
}


/* =========================================================
  C-1) MV背景画像（ページ個別）
========================================================= */
.outline_page_scope.okc-page-clinics.clinic-page--temmabashi .page_mv{
  background-image: url(/wp-content/themes/thyroid2023/images/omm_mv.jpg);
}

.outline_page_scope.okc-page-clinics.clinic-page--okamoto .page_mv{
  background-image: url(/wp-content/themes/thyroid2023/images/okamoto_mv.jpg);
}


/* =========================================================
  C-2) H1（院名＋英字名）
========================================================= */
.outline_page_scope.okc-page-clinics .clinic_page_title .clinic_page_title__ja{
  white-space: nowrap;
  font-size: 0.9em;
}

.outline_page_scope.okc-page-clinics .clinic_page_title .clinic_page_title__en{
  display: block;
}

@media (max-width: 575.98px){
  .outline_page_scope.okc-page-clinics .clinic_page_title .clinic_page_title__ja{
    font-size: 0.84em;
  }
}


/* =========================================================
  C-2-1) ページタイトル → 院長挨拶セクションの間隔調整
  目的：
  - H1下の空白を両院ページ専用で適切に詰める
========================================================= */
.outline_page_scope.okc-page-clinics .clinic_page_title{
  margin-bottom: 0 !important;
}

.outline_page_scope.okc-page-clinics .clinic_page_title + section.pt-5{
  padding-top: 48px !important;
}

@media (max-width: 767.98px){
  .outline_page_scope.okc-page-clinics .clinic_page_title + section.pt-5{
    padding-top: 24px !important;
  }
}


/* =========================================================
  C-3) 院長メッセージ
========================================================= */
.outline_page_scope.okc-page-clinics .outline_message .message_top h2.message_catch{
  margin: 0;
  line-height: 1.35;
}

.outline_page_scope.okc-page-clinics .outline_message .message_top h2.message_catch strong{
  display: inline-block;
}

@media (max-width: 767.98px){
  .outline_page_scope.okc-page-clinics .outline_message .message_top img.sp{
    display: block;
    margin: 0 0 14px 0;
  }
}


/* =========================================================
  C-4) スケジュール：担当医入り表
========================================================= */
.outline_page_scope.okc-page-clinics .table_reserve{
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.outline_page_scope.okc-page-clinics .table_reserve table{
  min-width: 720px;
}

.outline_page_scope.okc-page-clinics .doc-pill{
  display: inline-block;
  padding: 2px 8px;
  margin: 2px 4px 2px 0;
  border-radius: 999px;
  background: #eef3fb;
  color: #1f3c88;
  font-size: 0.95em;
  white-space: nowrap;
  line-height: 1.6;
}

.outline_page_scope.okc-page-clinics .doc-small{
  font-size: 0.85em;
}

.outline_page_scope.okc-page-clinics .doc-asterisk{
  color: #d23;
  font-weight: 700;
  margin-left: 2px;
}

.outline_page_scope.okc-page-clinics .doc-empty{
  color: #9aa3af;
}


/* =========================================================
  C-5) 電話予約ボックス
========================================================= */
.outline_page_scope.okc-page-clinics .reserve-callout{
  margin-top: 10px;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  text-align: center;
  line-height: 1.8;
}


/* =========================================================
  C-6) 予約CTAの器
========================================================= */
.outline_page_scope.okc-page-clinics section.posted_cta_block{
  margin-top: var(--sp-m) !important;
  padding: 0 !important;
  text-align: center;
}


/* =========================================================
  C-7) ACCESS：近隣図カード
========================================================= */
.outline_page_scope.okc-page-clinics .access_section .clinic_card h3.clinic_name{
  font-weight: 700;
  font-size: 1rem;
  margin: 0 0 .5rem 0;
}

.outline_page_scope.okc-page-clinics .access_section .clinic_card iframe{
  border: 0;
}

@media (max-width: 767.98px){
  .outline_page_scope.okc-page-clinics .access_section .clinic_card{
    border: 1px solid rgba(0,0,0,.10);
    background: #fff;
    padding: 14px 14px 16px;
    margin-top: 14px;
    border-radius: 6px;
  }

  .outline_page_scope.okc-page-clinics .access_section .clinic_card .row{
    margin-top: 0 !important;
  }

  .outline_page_scope.okc-page-clinics .access_section .clinic_card + .clinic_card{
    margin-top: 18px;
  }

  .outline_page_scope.okc-page-clinics .access_section .clinic_card iframe{
    margin-bottom: 10px;
  }

  .outline_page_scope.okc-page-clinics .access_section .clinic_card h3.clinic_name{
    font-size: 1.05em;
    margin-bottom: .5rem;
  }
}


/* =========================================================
  C-8) 関連リンク
========================================================= */
.outline_page_scope.okc-page-clinics .clinic_related_links .border_box{
  height: 100%;
}

.outline_page_scope.okc-page-clinics .clinic_related_links .clinic_related_links__cta{
  text-align: center;
}

.outline_page_scope.okc-page-clinics .clinic_related_links .clinic_related_links__cta_row{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.outline_page_scope.okc-page-clinics .clinic_related_links .cta_btn{
  min-width: 220px;
}

@media (max-width: 767.98px){
  .outline_page_scope.okc-page-clinics .clinic_related_links .cta_btn{
    width: 100%;
    min-width: 0;
  }
}


/* =========================================================
  C-9) 関連リンクセクション上余白
========================================================= */
.outline_page_scope.okc-page-clinics section.clinic_related_links{
  margin-top: var(--sp-s) !important;
}


/* =========================================================
  C-10) SP微調整
========================================================= */
@media (max-width: 767.98px){
  .outline_page_scope.okc-page-clinics .reserve-callout{
    font-size: 0.95rem;
  }
}


/* =========================================================
  C-11) SPのみ：最後のセクション → フッター間の下余白
  目的：
  - スマホで関連リンクの直後にフッターが詰まりすぎないようにする
========================================================= */
@media (max-width: 767.98px){
  .outline_page_scope.okc-page-clinics section.clinic_related_links{
    padding-bottom: var(--sp-m) !important;
  }
}