/* =========================================================
  okc-page-home.css  (PAGE DIFF / HOME)
  Scope: .outline_page_scope.okc-page-home

  方針：
  - テーマCSSは触らず、HOME差分のみをスコープ配下で上書き
  - 余白は okc-foundation.css の変数（--sp-*）に準拠
  - CTAは FOUNDATION の .cta_btn を使用
  - 病気ボタンは CTA化しつつ、PC/SPの配列を維持
========================================================= */


/* =========================================================
  H-0) MV（トップ画像）→ 直下コンテンツの間隔をFOUNDATIONに統一
  - PC：sp-m（72px）
  - SP：sp-s（40px）
========================================================= */
.outline_page_scope.okc-page-home .home_mv + .container{
  margin-top: var(--sp-m) !important;
}
@media (max-width: 767.98px){
  .outline_page_scope.okc-page-home .home_mv + .container{
    margin-top: var(--sp-s) !important;
  }
}


/* =========================================================
  H-1) MV（スマホ）キャッチコピー：2行のみ中央寄せ
========================================================= */
.outline_page_scope.okc-page-home .mv_catch.sp .mv_catch_text{
  text-align: center !important;
}


/* =========================================================
  H-2) トップ専用：診療体制ブロック（home-only-message）
========================================================= */
.outline_page_scope.okc-page-home .home-only-message{
  position: relative;
  background: #fff;
  border: 1px solid #AEC3CA;
  border-radius: 8px;
  padding: 26px 28px 24px;
  box-shadow: 0 6px 18px rgba(15,23,42,.08);
}

/* 上部アクセントライン */
.outline_page_scope.okc-page-home .home-only-message::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #29BCBC;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

/* 見出し */
.outline_page_scope.okc-page-home .home-only-message__title{
  font-weight: 700;
  font-size: 20px;
  line-height: 1.55;
  letter-spacing: .02em;
  color: #2F8F88;
}

/* 主文 */
.outline_page_scope.okc-page-home .home-only-message__lead{
  color: #445066;
  font-size: 1.05rem;
  line-height: 1.9;
  margin-bottom: 6px;
}

/* 院名（主役） */
.outline_page_scope.okc-page-home .home-only-message__clinic{
  color: #2F8F88;
  font-weight: 800;
  letter-spacing: .02em;
}

/* SP：余白調整 */
@media (max-width: 767.98px){
  .outline_page_scope.okc-page-home .home-only-message{
    padding: 20px 18px 18px;
  }
}


/* =========================================================
  H-2-1) HOME：院ページへのサブ導線（ピル）
  ※メインCTA（cta_btn）とは統一せず、現状の軽さを維持
========================================================= */
.outline_page_scope.okc-page-home .home-only-message .clinic-entry-links{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 12px 0 10px;
}

.outline_page_scope.okc-page-home .home-only-message .clinic-entry-link{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;

  border: 1px solid rgba(54,177,167,0.35);
  border-radius: 999px;
  text-decoration: none;
  color: inherit;
  background: transparent;
  transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.outline_page_scope.okc-page-home .home-only-message .clinic-entry-name{
  font-weight: 400;
  letter-spacing: .02em;
}

.outline_page_scope.okc-page-home .home-only-message .clinic-entry-arrow{
  color: rgba(54,177,167,0.85);
  font-weight: 700;
}

.outline_page_scope.okc-page-home .home-only-message .clinic-entry-link:hover,
.outline_page_scope.okc-page-home .home-only-message .clinic-entry-link:focus-visible{
  border-color: rgba(54,177,167,0.7);
  background-color: rgba(54,177,167,0.06);
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
  transform: translateY(-1px);
}

@media (max-width: 576px){
  .outline_page_scope.okc-page-home .home-only-message .clinic-entry-links{
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }
}

/* 補足文 */
.outline_page_scope.okc-page-home .home-only-message__sublead{
  color: #445066;
  font-size: 0.95rem;
  line-height: 1.9;
  margin-bottom: 0;
}

/* 3ポイント */
.outline_page_scope.okc-page-home .home-only-message__points{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
}

.outline_page_scope.okc-page-home .home-only-message__point{
  padding: 14px 16px;
  border-radius: 6px;
  background: #FAFAFA;
  border: 1px solid #E3E8F0;
}

.outline_page_scope.okc-page-home .home-only-message__label{
  font-weight: 700;
  color: #29BCBC;
  margin-bottom: 6px;
  font-size: 16px;
}

.outline_page_scope.okc-page-home .home-only-message__text{
  color: #717B90;
  line-height: 1.9;
}


/* =========================================================
  H-8) 診療体制ブロック ↔ 2枚カード（top_catch）の間隔
  - PC：margin-bottom
  - SP：margin collapse 回避のため section.pt-5 に padding-bottom
========================================================= */
.outline_page_scope.okc-page-home .home-only-message{
  margin-bottom: var(--sp-m) !important; /* 72px */
}

@media (max-width: 767.98px){
  .outline_page_scope.okc-page-home .home-only-message{
    margin-bottom: 0 !important;
  }
  .outline_page_scope.okc-page-home section.pt-5{
    padding-bottom: var(--sp-s) !important; /* 40px */
  }
}


/* =========================================================
  H-3) HOME：クリニック紹介ブロック本文フォントサイズ
========================================================= */
.outline_page_scope.okc-page-home .home_link p{
  font-size: 17px;
}


/* =========================================================
  H-10) HOME：カード内CTA（「詳しくはこちら」）の扱い
========================================================= */
.outline_page_scope.okc-page-home .home_link_text .cta_btn{
  max-width: 260px;
  margin-left: auto;
  margin-right: 0;
}


/* =========================================================
  H-4) HOME：お知らせ（Display Posts）整形
========================================================= */
.outline_page_scope.okc-page-home .home_news .excerpt-dash{
  display: none !important;
}

.outline_page_scope.okc-page-home .home_news .display-posts-listing .listing-item{
  padding: 22px 0;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.outline_page_scope.okc-page-home .home_news .display-posts-listing .listing-item:last-child{
  border-bottom: none;
}

.outline_page_scope.okc-page-home .home_news .display-posts-listing .title{
  display: block;
  font-weight: 700;
  color: #2F8F88;
  text-decoration: none;
  line-height: 1.6;
  font-size: 1.05rem;
  letter-spacing: .02em;
}
.outline_page_scope.okc-page-home .home_news .display-posts-listing .title:hover{
  opacity: 0.85;
}

.outline_page_scope.okc-page-home .home_news .display-posts-listing .excerpt{
  color: #717B90;
  line-height: 1.85;
  font-size: .95rem;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.outline_page_scope.okc-page-home .home_news .home_news_list .display-posts-listing + .display-posts-listing{
  border-top: 1px solid rgba(47,143,136,0.4);
  margin-top: 18px;
  padding-top: 18px;
}


/* =========================================================
  H-11) HOME：posted_cta_block（CTAの器）
========================================================= */
.outline_page_scope.okc-page-home section.posted_cta_block{
  margin-top: var(--sp-m) !important;
  padding: 0 !important;
  text-align: center;
}


/* =========================================================
  H-5) HOME：病気について（背景除去）
========================================================= */
.outline_page_scope.okc-page-home .home_about{
  background: transparent !important;
  background-image: none !important;
}

.outline_page_scope.okc-page-home .home_about::before,
.outline_page_scope.okc-page-home .home_about::after{
  content: none !important;
}

.outline_page_scope.okc-page-home .home_about > div,
.outline_page_scope.okc-page-home .home_about .home_about_innner{
  background: transparent !important;
  background-image: none !important;
}

.outline_page_scope.okc-page-home .home_about .home_about_catch{
  color: #717B90;
  font-size: 17px;
}


/* =========================================================
  H-12) HOME：病気についてのボタン（CTA化＋配列維持）
  - FOUNDATIONのcta_btnの max-width を、このブロック内だけ無効化して“列幅100%”へ
========================================================= */
.outline_page_scope.okc-page-home .home_about_link .cta_btn{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}


/* =========================================================
  H-7) HOME：アクセス → ABOUT ILLNESS の余白（FOUNDATIONスケール）
  - PC：セクション内の上下リズムを維持
========================================================= */
.outline_page_scope.okc-page-home section.home_about_section{
  padding-top: var(--sp-s) !important; /* 40px */
  margin-top: 0 !important;
}

.outline_page_scope.okc-page-home .home_about_section .home_about{
  padding-top: var(--sp-s) !important;     /* 40px */
  padding-bottom: var(--sp-m) !important;  /* 72px（PC側：本文の呼吸） */
}


/* =========================================================
  H-13) HOME：病気について（SPのみ）
  目的：
  - 説明文 → ボタンの間を詰める（mt-3/mt-2の合算を抑制）
  - ボタン → フッターの間は詰めすぎない（section側で下余白を確保）
========================================================= */
@media (max-width: 767.98px){
  /* 説明文ブロックの下余白は最小化（ボタンが外にあるため） */
  .outline_page_scope.okc-page-home .home_about_section .home_about{
    padding-bottom: var(--sp-s) !important; /* 40px：0にしない */
  }

  /* ボタンブロックの上余白（mt-3を最小化） */
  .outline_page_scope.okc-page-home .sp.home_about_link.mt-3{
    margin-top: 0.25rem !important; /* 4px */
  }

  /* 先頭行の mt-2 を無効化 */
  .outline_page_scope.okc-page-home .sp.home_about_link > div.mt-2:first-child{
    margin-top: 0 !important;
  }

  /* ボタン → フッターの余白（最終セクション自体に下余白を付ける） */
  .outline_page_scope.okc-page-home section.home_about_section{
    padding-bottom: var(--sp-m) !important; /* 72px（確定） */
  }
}


/* =========================================================
  H-6) ACCESS：近隣図（カード化）
========================================================= */
.outline_page_scope.okc-page-home .access_section .clinic_card h3.clinic_name{
  font-weight: 700;
  font-size: 1rem;
  margin: 0 0 .5rem 0;
}

.outline_page_scope.okc-page-home .access_section .clinic_card iframe{
  border: 0;
}

@media (max-width: 767.98px){
  .outline_page_scope.okc-page-home .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-home .access_section .clinic_card .row{
    margin-top: 0 !important;
  }

  .outline_page_scope.okc-page-home .access_section .clinic_card + .clinic_card{
    margin-top: 18px;
  }

  .outline_page_scope.okc-page-home .access_section .clinic_card iframe{
    margin-bottom: 10px;
  }

  .outline_page_scope.okc-page-home .access_section .clinic_card h3.clinic_name{
    font-size: 1.05em;
    margin-bottom: .5rem;
  }
}

@media (min-width: 768px){
  .outline_page_scope.okc-page-home .access_section .clinic_card + .clinic_card{
    margin-top: 40px;
  }
}