/* ===== 下層ヘッダー専用（.is-sub 配下に限定） ===== */
:root{
  --c-green:#1cc0a3;        /* 帯や線のグリーン */
  --c-green-dark:#10a58c;
  --c-yellow:#fff3a8;       /* アクティブタブ/予約バブルの黄 */
  --c-salmon:#f28c86;       /* 電話番号のサーモン */
}


/* --- 上段：キャッチコピー / パンくず --- */
.is-sub .subhead__top{
  position: relative;
  padding: 14px 16px 6px;
  text-align: center;
}
.is-sub .subhead__catch{
  margin: 0; font-size: 14px; color: var(--c-green-dark); letter-spacing: .04em;
}
.is-sub .subhead__crumbs{
  position: absolute; right: 20px; top: 30px;
  font-size: 12px; color: #535353;
}
.is-sub .subhead__crumbs a{ color:#f28c86; text-decoration: none; }
.is-sub .subhead__crumbs .sep{ margin: 0 .5em; }

/* --- 中段：ロゴ中央 / 右CTA --- */
.is-sub .subhead__middle{
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  gap: 16px; padding: 8px 16px 12px;
}
.is-sub .brand{ grid-column: 2; text-align: center; margin: 0; }
.is-sub .brand__logo img{ max-height: 64px; width: auto; display:inline-block; }
.is-sub .brand__en{ display:none; margin-top: 6px; font-size: 13px; color: var(--c-green-dark); letter-spacing:.08em; }

.is-sub .subhead__cta{ grid-column: 3; justify-self: end; display: grid; gap: 8px; }
.is-sub .cta__bubble{
  display:inline-block; padding: 8px 14px; background: var(--c-yellow); border-radius: 18px;
  text-decoration:none; color:#c66; font-weight:700; line-height:1; box-shadow: inset 0 -2px rgba(255,255,255,.7);
  text-align: center;
}
.is-sub .cta__tel{ display:flex; align-items: center; gap: 8px; justify-content: flex-end; }
.is-sub .badge{
  display:inline-block; font-size: 12px; padding: 3px 8px; border:2px solid #f4b6b3; border-radius: 0px; color:#d26f6b; background:#fff;
}
.is-sub .tel{
  font-size: 28px; font-weight: 800; color: var(--c-salmon); text-decoration:none; letter-spacing:.02em;
}

/* --- 下段：グリーン帯ナビ --- */
.is-sub .subnav{
  border-top: 3px solid var(--c-green);
  border-bottom: 3px solid var(--c-green);
}
.is-sub .subnav__list{
  margin: 0; padding: 0; list-style:none; display:flex; gap: 24px; align-items: stretch; justify-content: center;
}
.is-sub .subnav__list > li > a{
  display:block; padding: 14px 20px; color: #12a089; text-decoration:none; font-weight:700; letter-spacing:.02em;
}

/* --- 下段：グリーン帯ナビ --- */
.is-sub .subnav{
  border-top: 3px solid var(--c-green);
  border-bottom: 3px solid var(--c-green);
}
.is-sub .subnav__list{
  margin: 0; padding: 0; list-style:none; display:flex; gap: 24px; align-items: stretch; justify-content: center;
}
.is-sub .subnav__list > li > a{
  display:block; padding: 22px 20px; color: #12a089; text-decoration:none; font-weight:700; letter-spacing:.02em;
  transition: background-color 0.3s, color 0.3s;
}

/* 追加：hover 時の背景色 */
.is-sub .subnav__list > li > a:hover {
  background-color: var(--c-yellow); /* #fff3a8 */
}

.clinic-contact {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 20px;
    background: #59d3b2;
    border: 4px solid #59d3b2;
}

.clinic-contact .reserve {
    background: #ffffff;
    color: #00b388;
    padding: 15px 20px;
    font-size: 20px;
}

.clinic-contact .tel {
    background: #59d3b2;
    color: #fff;
    padding: 8px 14px;
    font-size: 22px;
    font-weight: 300;
    text-decoration: none;
}

@media (max-width: 768px) {
    .clinic-contact .reserve {
        padding: 13px 13px;
        font-size: 20px;
        text-wrap: nowrap;
    }
	
	    .clinic-contact .tel {
        padding: 8px 14px;
        font-size: 17px;
    }
	
	    .clinic-contact {
        gap: 10px;
        margin-bottom: 20px;
    }
	
	.clinic-contact .tel {
        padding: 8px 14px;
        font-size: 17px;
    }
}

/* --- ページタイトル（必要なら） --- */
.is-sub .page_ttl_wrap{ padding: 20px 16px; }
.is-sub .page_ttl{ margin:0; font-size: clamp(20px, 2.6vw, 32px);  color: #31af8b; text-align:center; font-weight: 500;}

/* --- レスポンシブ --- */
@media (max-width: 960px){
  .is-sub .subhead__crumbs{ display:none; }
  .is-sub .brand{ grid-column: 1 / -1; }
  .is-sub .subhead__cta{ grid-column: 2; justify-self: end; }
  .is-sub .tel{ font-size: 24px; }
  .is-sub .subnav__list{ gap: 8px; overflow-x:auto; white-space: nowrap; padding: 0 8px; }
  .is-sub .subnav__list > li > a{ padding: 12px 14px; }
  .is-sub .subhead__catch { font-size: 13px;}
}
@media (max-width: 560px){
  .is-sub .brand__logo img{ max-height: 54px; }
  .is-sub .cta__bubble{ padding: 7px 12px; font-size: 14px; }
  .is-sub .tel{ font-size: 22px; }
}