@charset "utf-8";
/*
 * ======================================
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * ======================================
 *
 * .hb-container / --md / --sm  - 左右padding付きコンテナ（1200 / 1100 / 900px）
 * .hb-sec--*                   - セクション余白のバリエーション（110/90/100-80 等）
 * .hb-heading                  - EN小ラベル + Zen Maru Gothic 見出し（左寄せ）
 * .hb-mb-* / .hb-gap-*         - 共通utilityに刻みがない余白値
 * .hb-reveal                   - スクロールリビール（JSで .is-shown 付与）
 * .hb-btn-outline / --white    - 枠線ボタン / 白ボタン（自動幅・radius 6px）
 * .hb-chip                     - 淡いティール枠のタグチップ
 * .hb-photo                    - background-image 写真ボックス（+ 表示位置modifier）
 * .hb-header* / .hb-logo       - sticky半透明ヘッダーとテキストロゴ
 * .hb-footer*                  - 3カラム + 全幅マップのフッター
 * .hb-mv*                      - TOPメインビュー（CMSスライダー差し替え対応）
 * .hb-cta-banner*              - グラデーション採用CTAバナー
 * .hb-cardbar*                 - 左に色バーが付く見出しカード
 * .hb-merit*                   - チェックアイコン + 点線区切りのカード
 * .hb-newsbox*                 - 枠付きお知らせリスト（日付/カテゴリ/タイトル）
 * .hb-cat / --red / --gray     - カテゴリバッジ
 * .hb-page-hero*               - グラデーション下層ヒーロー
 * .hb-crumb                    - パンくずバー
 * .hb-deflist* / .hb-table*    - 定義リスト / ラベル色付きテーブル
 * .hb-philo* / .hb-policy*     - 理念カード（ピル見出し重ね） / 基本方針
 * .hb-mvv* / .hb-notecard      - MVV / 方眼背景の補足カード
 * .hb-func* / .hb-partner*     - 機能カード / 連携カード
 * .hb-integ*                   - 統合の経緯（病床数の積み上げ）
 * .hb-biz* / .hb-arch*         - 財団の主要事業 / 建築デザイン
 * .hb-want* / .hb-edu*         - 求める人物像（写真＋暗幕） / 教育体制
 * .hb-ladder* / .hb-career*    - クリニカルラダー / キャリアパス
 * .hb-educard* / .hb-dualcta*  - 教育トピックカード / 2枚並びCTA
 * .hb-flow* / .hb-benefit*     - 選考フロー / 福利厚生
 * .hb-voice* / .hb-faq*        - 先輩の声 / Q&A
 * .hb-apply* / .hb-docs*       - 応募方法 / 応募書類
 * .hb-loc* / .hb-around*       - 所在地 / 生活圏マップ
 * .hb-scene* / .hb-life-grid   - 写真にラベルを載せるカード / 3枚グリッド
 * .hb-form* / .hb-contactbox*  - お問い合わせフォーム / 連絡先ボックス
 * .hb-blog* / .hb-side*        - お知らせ一覧・詳細 / サイドバー
 * .hb-pager / .hb-article*     - ページネーション / 記事本文
 * .hb-tag / .hb-morelink       - タグチップ / 一覧を見るリンク
 *
 * ======================================
 * 共通SCSSに不足していたもの
 * ======================================
 *
 * ・値の粒度不足 … 余白(12/14/16/18/22/26/28/32/36/44/52/56/64/72px)、
 *                  font-size(15/17/19/21/23/26/34/38/46/64px)、gap(12/14/16/22/24/26/32/56/64/72px)、
 *                  container の左右padding、セクション padding の非対称指定
 * ・構造不足 …     position:sticky ヘッダー、EN小ラベル+和文見出しの左寄せ2段組、
 *                  ラベル列付きグリッドテーブル、clip-path の矢印型ラダー／STEPバッジ、
 *                  ピル見出しがカード上端に重なる理念ボックス、全幅はみ出しマップ
 * ・状態不足 …     行送りを normal に固定した見出し（lh-* は 1〜2 の刻みのみ）
 * ・装飾パターン不足 … 方眼(グリッド)背景のカード、点線区切り(2px dotted)、
 *                  グラデーション帯（MV下端 / 採用CTA / 下層ヒーロー）
 *
 */

/* ==========================================================================
   0. トークン
   ========================================================================== */
:root {
  --hb-teal: #21827D;
  --hb-teal-b: #30BDB5;
  --hb-teal-pale: #B7E5E1;
  --hb-navy: #314D64;
  --hb-body: #42606F;
  --hb-body2: #5A7383;
  --hb-meta: #8DA1AD;
  --hb-coral: #E4674F;
  --hb-coral-d: #B4513C;
  --hb-line: #E4EBEF;
  --hb-line2: #EEF3F5;
  --hb-line3: #DCE7EB;
  --hb-line4: #C9D6DD;
  --hb-bg-pale: #F5FAFA;
  --hb-bg-beige: #FBF8F4;
  --hb-bg-card: #F7FCFC;
  --hb-badge: #EAF7F6;
  --hb-line-green: #06C755;
}

body { color: var(--hb-navy); }
a { color: var(--hb-teal); }
a:hover { color: var(--hb-coral); opacity: 1; }

/* ==========================================================================
   1. レイアウト基盤
   ========================================================================== */
.hb-container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.hb-container--wide { max-width: 1280px; padding: 0 32px; }
.hb-container--md { max-width: 1150px; }
.hb-container--sm { max-width: 900px; }

/* セクション余白（.section は 100px 0） */
.hb-sec--110 { padding: 110px 0; }
.hb-sec--90 { padding: 90px 0; }
.hb-sec--100-80 { padding: 100px 0 80px; }
.hb-sec--100-70 { padding: 100px 0 70px; }
.hb-sec--90-110 { padding: 90px 0 110px; }
.hb-sec--80-110 { padding: 80px 0 110px; }
.hb-sec--70-110 { padding: 70px 0 110px; }
.hb-sec--pb110 { padding: 0 0 110px; }

/* 余白ユーティリティ（共通の刻みに無い値） */
.hb-mb-6 { margin-bottom: 6px; }
.hb-mb-8 { margin-bottom: 8px; }
.hb-mb-12 { margin-bottom: 12px; }
.hb-mb-14 { margin-bottom: 14px; }
.hb-mb-16 { margin-bottom: 16px; }
.hb-mb-18 { margin-bottom: 18px; }
.hb-mb-22 { margin-bottom: 22px; }
.hb-mb-24 { margin-bottom: 24px; }
.hb-mb-26 { margin-bottom: 26px; }
.hb-mb-28 { margin-bottom: 28px; }
.hb-mb-32 { margin-bottom: 32px; }
.hb-mb-36 { margin-bottom: 36px; }
.hb-mb-44 { margin-bottom: 44px; }
.hb-mb-48 { margin-bottom: 48px; }
.hb-mb-52 { margin-bottom: 52px; }
.hb-mb-56 { margin-bottom: 56px; }
.hb-mb-64 { margin-bottom: 64px; }
.hb-mt-8 { margin-top: 8px; }
.hb-mt-20 { margin-top: 20px; }
.hb-mt-24 { margin-top: 24px; }
.hb-mt-36 { margin-top: 36px; }
.hb-mt-48 { margin-top: 48px; }

.hb-gap-12 { gap: 12px; }
.hb-gap-14 { gap: 14px; }
.hb-gap-16 { gap: 16px; }
.hb-gap-22 { gap: 22px; }
.hb-gap-24 { gap: 24px; }
.hb-gap-26 { gap: 26px; }
.hb-gap-32 { gap: 32px; }
.hb-gap-48 { gap: 48px; }
.hb-gap-56 { gap: 56px; }
.hb-gap-64 { gap: 64px; }
.hb-gap-72 { gap: 72px; }

/* 2カラムグリッド（等分 / 比率） */
.hb-grid2 { display: grid; grid-template-columns: 1fr 1fr; }
.hb-grid2--11-10 { grid-template-columns: 1.1fr 1fr; }
.hb-grid2--14-10 { grid-template-columns: 1.4fr 1fr; }
.hb-grid2--13-10 { grid-template-columns: 1.3fr 1fr; }
.hb-grid2--integ { grid-template-columns: 1.04fr 1fr; }
.hb-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); }
.hb-grid4 { display: grid; grid-template-columns: repeat(4, 1fr); }

/* 写真ボックス（背景画像は style="background-image:url()" で指定） */
.hb-photo {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-color: #EAF6F5;
  border-radius: 8px;
  min-width: 0;
}
.hb-photo--pos-55 { background-position: center 55%; }
.hb-photo--pos-45 { background-position: center 45%; }
.hb-photo--pos-30 { background-position: center 30%; }
.hb-photo--pos-25 { background-position: center 25%; }
.hb-photo--pos-62x { background-position: 62% center; }
.hb-photo--shadow { box-shadow: 0 4px 18px rgba(49, 77, 100, .08); }
.hb-photo--shadow-md { box-shadow: 0 4px 18px rgba(49, 77, 100, .1); }
.hb-photo--down { transform: translateY(40px); }

/* 共通utilityに無い比率 */
.hb-aspect-3-4 { aspect-ratio: 3 / 4; }
.hb-aspect-16-10 { aspect-ratio: 16 / 10; }
.hb-aspect-16-11 { aspect-ratio: 16 / 11; }

/* テキスト */
.hb-lead { font-size: 1.65rem; line-height: 2.15; color: var(--hb-body); }
.hb-lead--tall { line-height: 2.2; }
.hb-lead--lh18 { line-height: 1.8; }
.hb-lead--lh19 { line-height: 1.9; }
.hb-lead--lh195 { line-height: 1.95; }
.hb-lead--lh205 { line-height: 2.05; }
.hb-lead--lh21 { line-height: 2.1; }
/* nursing 看護部メッセージ：本文の行長を抑える */
.hb-lead--w1000 { max-width: 1000px; }
/* access 生活圏マップのリード：PCで文の区切りどおりに改行が収まる文字サイズにする */
.hb-lead--around { font-size: 1.6rem; }
.hb-text { font-size: 1.6rem; line-height: 2; color: var(--hb-body2); }
.hb-note { font-size: 1.4rem; color: var(--hb-meta); }
.hb-note--sm { font-size: 1.3rem; }
.hb-catch { font-family: "Noto Sans JP", sans-serif; font-size: 2.4rem; line-height: 1.55; color: var(--hb-teal); }

/* ==========================================================================
   2. リビール
   ========================================================================== */
@keyframes hb-rise {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes hb-float-in {
  from { opacity: 0; transform: translateY(60px); }
  to { opacity: .4; transform: translateY(0); }
}
.hb-js .hb-reveal { opacity: 0; }
.hb-js .hb-reveal.is-shown {
  animation-name: hb-rise;
  animation-duration: .9s;
  animation-timing-function: cubic-bezier(.22, .8, .3, 1);
  animation-fill-mode: both;
}
.hb-js .hb-reveal--d08.is-shown { animation-delay: .08s; }
.hb-js .hb-reveal--d10.is-shown { animation-delay: .1s; }
.hb-js .hb-reveal--d12.is-shown { animation-delay: .12s; }

@media (prefers-reduced-motion: reduce) {
  .hb-js .hb-reveal { opacity: 1; }
  .hb-js .hb-reveal.is-shown { animation: none; }
}

/* ==========================================================================
   3. 見出し
   ========================================================================== */
.hb-heading { text-align: start; }
.hb-heading .heading__en {
  display: block;
  font-weight: 700;
  font-size: 1.2rem;
  letter-spacing: .22em;
  line-height: normal;
  color: var(--hb-teal-b);
  margin-bottom: 14px;
}
.hb-heading .heading__ja {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: 3.4rem;
  letter-spacing: .04em;
  line-height: normal;
  color: var(--hb-navy);
  margin-top: 0;
}
.hb-heading--lg .heading__ja { font-size: 3.8rem; letter-spacing: .05em; }
/* 見出しに添える補足（例：財団概要（公立沖縄北部医療センター 指定管理者）） */
.hb-heading .heading__note {
  display: inline-block;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: normal;
  color: var(--hb-body2);
  margin-left: 6px;
}
@media (max-width: 639px) {
  .hb-heading .heading__note { display: block; margin-left: 0; margin-top: 6px; font-size: 1.3rem; }
}
.hb-heading--wrap .heading__ja { letter-spacing: .04em; line-height: 1.5; }
.hb-heading--white .heading__en { color: #FFFFFF; }
.hb-heading--white .heading__ja { color: #FFFFFF; }
.hb-heading--36 .heading__ja { font-size: 3.6rem; }

/* 小見出し（カード内） */
.hb-subttl {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.1rem;
  line-height: normal;
  color: var(--hb-teal);
}
.hb-subttl--23 { font-size: 2.3rem; }
.hb-subttl--20 { font-size: 2rem; }
.hb-subttl--19 { font-size: 1.9rem; }
.hb-subttl--18 { font-size: 1.8rem; }

/* ==========================================================================
   4. ボタン・チップ
   ========================================================================== */
.hb-btn-outline.btn {
  width: auto;
  max-width: none;
  text-align: start;
  gap: 10px;
  border-width: 1px;
  border-radius: 6px;
  padding: 16px 28px;
  font-size: 1.5rem;
  font-weight: 700;
}
.hb-btn-white {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex: none;
  background: #FFFFFF;
  color: var(--hb-teal);
  font-size: 1.5rem;
  font-weight: 700;
  padding: 18px 30px;
  border-radius: 6px;
}
.hb-btn-white--sm { padding: 16px 28px; }

.hb-chip {
  border: 1px solid var(--hb-teal-pale);
  color: var(--hb-teal);
  font-size: 1.3rem;
  font-weight: 500;
  padding: 9px 16px;
  border-radius: 4px;
  background: #F2FBFA;
}
.hb-tag {
  background: var(--hb-bg-pale);
  color: var(--hb-body);
  font-size: 1.3rem;
  padding: 7px 14px;
  border-radius: 4px;
}

.hb-cat {
  font-size: 1.2rem;
  font-weight: 500;
  color: var(--hb-teal);
  background: var(--hb-badge);
  padding: 6px 12px;
  border-radius: 4px;
  text-align: center;
}
.hb-cat--red { color: var(--hb-coral-d); background: #FBEFEC; }
.hb-cat--gray { color: var(--hb-body2); background: var(--hb-line2); }

.hb-morelink { font-size: 1.4rem; font-weight: 500; color: var(--hb-teal); }

/* ==========================================================================
   5. ヘッダー
   ========================================================================== */
.hb-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--hb-line);
}
.hb-header__inner {
  max-width: 1280px;
  padding: 0 32px;
  height: 84px;
  gap: 32px;
}
.hb-header__end { display: flex; align-items: center; gap: 26px; }

/* ロゴの字送り・行間はフッターのロゴ（.hb-footer__name / __en）と同じ見た目に揃える */
.hb-logo { gap: 0; }
.hb-logo .header-logo__body { gap: 6px; }
.hb-logo .header-logo__name {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.1rem;
  letter-spacing: .04em;
  color: var(--hb-navy);
  line-height: normal;
  white-space: nowrap;
}
.hb-logo .header-logo__sub {
  font-family: "Noto Sans", sans-serif;
  font-size: 1rem;
  letter-spacing: .18em;
  color: var(--hb-teal-b);
  line-height: normal;
  font-weight: 400;
}
.hb-logo:hover { opacity: .75; }

.hb-nav { gap: 26px; margin-left: 0; margin-right: 0; }
.hb-nav .header__nav-item a {
  flex-direction: row;
  padding: 0;
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--hb-navy);
  white-space: nowrap;
}
.hb-nav .header__nav-item a::after { display: none; }
.hb-nav .header__nav-item a:hover { color: var(--hb-coral); }

/* グローバルナビのドロップダウン（ページ内セクションへのアンカー） */
.hb-nav__item { position: relative; }
.hb-nav__caret { font-size: .9rem; margin-left: 6px; color: var(--hb-teal-b); transition: transform .3s ease; }
.hb-nav__item:hover .hb-nav__caret,
.hb-nav__item:focus-within .hb-nav__caret { transform: rotate(180deg); }
.hb-nav__drop {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, 8px);
  z-index: 60;
  min-width: 230px;
  padding: 6px 0;
  background: #FFFFFF;
  border: 1px solid var(--hb-line3);
  border-radius: 6px;
  box-shadow: 0 10px 28px rgba(18, 54, 66, .14);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
}
.hb-nav__item:hover .hb-nav__drop,
.hb-nav__item:focus-within .hb-nav__drop {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
/* ボタンとメニューの間の隙間でホバーが切れないよう、上側に当たり判定を足す */
.hb-nav__drop::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }
.hb-nav .hb-nav__drop a {
  display: block;
  padding: 11px 20px;
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--hb-body);
  white-space: normal;
}
.hb-nav .hb-nav__drop a:hover { background: var(--hb-bg-pale); color: var(--hb-teal); opacity: 1; }

/* PCナビは1101pxから表示されるが、コンテナ幅1280pxを下回る帯では
   ロゴ＋ナビ＋右側ボタンが収まらないので、この帯だけ余白と文字を詰める */
@media (min-width: 1101px) and (max-width: 1319px) {
  .hb-header__inner { padding: 0 20px; gap: 16px; }
  .hb-header__end { gap: 14px; }
  .hb-nav { gap: 14px; }
  .hb-nav .header__nav-item a { font-size: 1.3rem; }
  .hb-nav__caret { margin-left: 4px; font-size: .8rem; }
  .hb-header__right { gap: 8px; margin-left: 0; }
  .hb-header__cta { padding: 11px 14px; gap: 6px; }
  .hb-header__ghost { padding: 11px 12px; font-size: 1.3rem; }
  .hb-header__line { padding: 11px 12px; font-size: 1.3rem; gap: 6px; }
  .hb-header__line i { font-size: 1.6rem; }
}

.hb-header__right { gap: 10px; margin-left: 6px; height: auto; }
.hb-header__cta {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--hb-teal);
  color: #FFFFFF;
  font-size: 1.4rem;
  font-weight: 700;
  padding: 13px 22px;
  border-radius: 6px;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(33, 130, 125, .24);
  transition: background .3s ease;
}
.hb-header__cta:hover { background: #186B67; color: #FFFFFF; opacity: 1; }
.hb-header__cta-en {
  font-family: "Noto Sans", sans-serif;
  font-size: 1rem;
  letter-spacing: .12em;
  opacity: .8;
}
.hb-header__ghost {
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--hb-navy);
  border: 1px solid var(--hb-line4);
  padding: 12px 18px;
  border-radius: 6px;
  white-space: nowrap;
  transition: border-color .3s ease, color .3s ease;
}
.hb-header__ghost:hover { border-color: var(--hb-teal-b); color: var(--hb-teal); opacity: 1; }
.hb-header__line {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--hb-line-green);
  color: #FFFFFF;
  font-size: 1.4rem;
  font-weight: 700;
  padding: 12px 18px;
  border-radius: 6px;
  white-space: nowrap;
  transition: background .3s ease;
}
.hb-header__line:hover { background: #05A948; color: #FFFFFF; opacity: 1; }
.hb-header__line i { font-size: 1.9rem; }

/* SPナビ下部 */
.hb-sp-nav__bottom { display: flex; flex-direction: column; gap: 12px; }
.hb-sp-nav__cta,
.hb-sp-nav__line,
.hb-sp-nav__tel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px;
  border-radius: 6px;
  font-size: 1.5rem;
  font-weight: 700;
}
.hb-sp-nav__cta { background: #FFFFFF; color: var(--hb-teal); }
.hb-sp-nav__line { background: var(--hb-line-green); color: #FFFFFF; }
.hb-sp-nav__tel { border: 1px solid rgba(255, 255, 255, .5); color: #FFFFFF; }
.hb-sp-nav__cta:hover,
.hb-sp-nav__line:hover,
.hb-sp-nav__tel:hover { opacity: .85; }
/* SPナビ：英字ラベルは共通CSSの .75rem では小さすぎるので上げ、和文と矢印の間隔を空ける */
.sp-nav__en { font-size: 1.1rem; }
.sp-nav__link::after { margin-left: 10px; }


/* ==========================================================================
   6. フッター
   ========================================================================== */
.hb-footer { background: #3B5C75; padding: 72px 0 0; }
.hb-footer__grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 56px;
  padding-bottom: 56px;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
}
.hb-footer__name {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.1rem;
  letter-spacing: .04em;
  color: #FFFFFF;
  margin: 0 0 6px;
  line-height: normal;
}
.hb-footer__en {
  font-family: "Noto Sans", sans-serif;
  font-size: 1rem;
  letter-spacing: .18em;
  color: #7FD8D2;
  margin: 0 0 28px;
  line-height: normal;
}
.hb-footer__info { font-size: 1.5rem; line-height: 2; color: #C3D2DB; margin: 0 0 20px; }
.hb-footer__info:last-child { margin-bottom: 0; }
.hb-footer__col { display: flex; flex-direction: column; gap: 16px; }
.hb-footer__label {
  font-family: "Noto Sans", sans-serif;
  font-size: 1.1rem;
  letter-spacing: .2em;
  color: #7FD8D2;
  margin: 0 0 6px;
  line-height: normal;
}
.hb-footer__link { font-size: 1.5rem; color: #E4EDF2; }
.hb-footer__link:hover { color: #7FD8D2; opacity: 1; }
.hb-footer__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--hb-teal-b);
  color: #0E3C3A;
  font-size: 1.5rem;
  font-weight: 700;
  padding: 16px;
  border-radius: 6px;
  transition: background .3s ease;
}
.hb-footer__btn:hover { background: #7FD8D2; color: #0E3C3A; opacity: 1; }
.hb-footer__btn--ghost {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, .35);
  color: #FFFFFF;
  font-weight: 400;
}
.hb-footer__btn--ghost:hover { background: transparent; border-color: #7FD8D2; color: #FFFFFF; }
.hb-footer__line {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 8px;
  background: rgba(255, 255, 255, .06);
  border-radius: 6px;
  padding: 16px;
  transition: background .3s ease;
}
.hb-footer__line:hover { background: rgba(255, 255, 255, .12); opacity: 1; }
.hb-footer__line img {
  width: 64px;
  height: 64px;
  flex: none;
  border-radius: 4px;
  object-fit: contain;
  background: #FFFFFF;
}
.hb-footer__line span { font-size: 1.3rem; line-height: 1.8; color: #C3D2DB; }

.hb-footer__map { width: calc(100% + 80px); height: 300px; margin: 0 -40px; border-radius: 0; }
.hb-footer__map iframe { display: block; }

.hb-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 26px 0;
  gap: 20px;
}
.hb-footer__copy {
  font-family: "Noto Sans", sans-serif;
  font-size: 1.2rem;
  color: #8FA6B4;
  margin: 0;
}
.hb-footer__note { font-size: 1.2rem; color: #8FA6B4; margin: 0; }
.hb-footer__note a { color: #7FD8D2; }

.hb-sp-bar i { display: block; font-size: 1.6rem; margin-bottom: 3px; color: var(--hb-teal); }

/* ==========================================================================
   7. TOP：メインビュー
   ========================================================================== */
/* メインビューの高さはCMSスライダーの設定（--swiper-wrapper-height など）に任せる。
   #slideshow を通常フローに置いてスライダーの高さがそのままセクションの高さになるようにし、
   キャッチコピーと暗幕はその上に重ねる。min-height はCMS未設定・静止画時の保険 */
.hb-mv {
  position: relative;
  min-height: 420px;
  overflow: hidden;
  background: #17565C;
}
.hb-mv__bg { position: relative; }
/* 静止画（差し戻し用）のスライドだけを敷き込む。
   直下の子だけに限定する — CMSスライダーの .swiper-slide はSwiperが位置を制御するので、
   ここで position:absolute を当てると全スライドが重なりスライド動作が壊れる */
.hb-mv__bg > .swiper-slide { position: absolute; inset: 0; }
.hb-mv__slide {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 55%;
  background-color: #1B6E74;
}
.hb-mv__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(90deg, rgba(20, 86, 90, .58) 0%, rgba(20, 86, 90, .34) 52%, rgba(20, 86, 90, .06) 100%);
}
.hb-mv__inner {
  position: absolute;  /* スライダーの上に重ねる（高さはスライダー側が決める） */
  inset: 0;
  margin-inline: auto;
  z-index: 3;
  /* キャッチ（.hb-mv__copy）を同じマスに重ねて、写真の切り替わりに合わせて入れ替える。
     grid にすることで、コンテナの左右paddingを効かせたまま重ねられる */
  display: grid;
  align-content: center;
}
/* キャッチの切り替え（1枚だけ .is-active／JSが動かない環境では1枚目が出たまま） */
.hb-mv__copy {
  grid-area: 1 / 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity .8s ease;
}
.hb-mv__copy.is-active { opacity: 1; visibility: visible; }
/* 表示に切り替わるたびに、初回と同じ「ふわり」を出す */
.hb-mv__copy .hb-mv__en,
.hb-mv__copy .hb-mv__ttl,
.hb-mv__copy .hb-mv__txt { animation: none; }
.hb-mv__copy.is-active .hb-mv__en { animation: hb-rise 1s cubic-bezier(.22, .8, .3, 1) .1s both; }
.hb-mv__copy.is-active .hb-mv__ttl { animation: hb-rise 1.1s cubic-bezier(.22, .8, .3, 1) .25s both; }
.hb-mv__copy.is-active .hb-mv__txt { animation: hb-rise 1.1s cubic-bezier(.22, .8, .3, 1) .45s both; }
.hb-mv__en {
  font-family: "Noto Sans", sans-serif;
  font-size: 1.3rem;
  letter-spacing: .24em;
  color: #9FE3DD;
  margin: 0 0 26px;
  animation: hb-rise 1s cubic-bezier(.22, .8, .3, 1) .1s both;
}
.hb-mv__ttl {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: 6.4rem;
  line-height: 1.35;
  letter-spacing: .04em;
  color: #FFFFFF;
  margin: 0;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .44);
  animation: hb-rise 1.1s cubic-bezier(.22, .8, .3, 1) .25s both;
}
.hb-mv__txt {
  max-width: 640px;
  font-size: 1.7rem;
  line-height: 2.1;
  color: #EAF7F6;
  margin: 34px 0 0;
  text-shadow: 0 1px 10px rgba(0, 0, 0, .52);
  animation: hb-rise 1.1s cubic-bezier(.22, .8, .3, 1) .45s both;
}
.hb-mv__bar {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 0;
  height: 6px;
  background: linear-gradient(90deg, #30BDB5, #7FD8D2, #E4674F);
}

/* ==========================================================================
   8. TOP：各セクション
   ========================================================================== */
/* 装飾画像 */
.hb-deco { position: absolute; height: auto; pointer-events: none; z-index: 0; }
.hb-deco--wreath-bl { left: -140px; bottom: -160px; width: 620px; opacity: .45; }
.hb-deco--wreath-tr { right: -150px; top: -120px; width: 560px; opacity: .4; animation: hb-float-in 1.6s cubic-bezier(.22, .8, .3, 1) .3s both; }
.hb-deco--haibi { top: -118px; right: -40px; width: 208px; opacity: .6; }
/* 文章ブロック左下に添えるハイビスカス小（右上の haibi と対にする）。
   本文に重ならないよう、ブロックの下端より外へ出す。原寸92pxなので拡大しない */
.hb-deco--haibi-s { left: -8px; bottom: -96px; width: 92px; }

/* 左に色バーの付く見出しカード */
.hb-cardbar {
  background: #FFFFFF;
  border-radius: 8px;
  padding: 28px 38px;
  box-shadow: 0 2px 12px rgba(49, 77, 100, .07);
}
.hb-cardbar__ttl {
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.6rem;
  line-height: normal;
  color: var(--hb-navy);
  margin: 0 0 16px;
}
.hb-cardbar__ttl::before {
  content: "";
  width: 6px;
  height: 30px;
  border-radius: 3px;
  background: var(--hb-teal-b);
  flex: none;
}
.hb-cardbar--coral .hb-cardbar__ttl::before { background: var(--hb-coral); }

/* チェック + 点線区切りのカード */
.hb-merit {
  background: var(--hb-bg-card);
  border-radius: 8px;
  padding: 44px 40px;
}
.hb-merit--white {
  background: #FFFFFF;
  padding: 38px 33px;
  box-shadow: 0 2px 10px rgba(49, 77, 100, .06);
}
.hb-merit__ttl {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.1rem;
  line-height: normal;
  color: var(--hb-teal);
  margin: 0 0 14px;
}
.hb-merit__ttl i { flex: none; font-size: 2.4rem; color: var(--hb-teal-b); line-height: 1; }
.hb-merit__ttl--bar { gap: 14px; font-size: 2rem; margin-bottom: 16px; }
.hb-merit__ttl--bar::before {
  content: "";
  width: 6px;
  height: 26px;
  border-radius: 3px;
  background: var(--hb-teal-b);
  flex: none;
}
.hb-merit__rule { border-top: 2px dotted var(--hb-teal-pale); margin: 0 0 18px; }

/* 距離リスト（那覇空港から 車で90分） */
.hb-dist__head { font-size: 1.5rem; font-weight: 700; color: var(--hb-navy); margin: 0 0 14px; line-height: normal; }
.hb-dist { display: flex; flex-direction: column; gap: 14px; }
.hb-dist__row {
  display: flex;
  align-items: baseline;
  gap: 16px;
  border-bottom: 1px solid var(--hb-line);
  padding-bottom: 14px;
}
.hb-dist__label { font-size: 1.5rem; color: var(--hb-body2); min-width: 200px; }
.hb-dist__value { font-size: 1.9rem; color: var(--hb-teal); font-weight: 500; }

/* TOP 沖縄北部で暮らす：名護の写真はPCではボタンの下に置く */
/* 左カラムが右の位置カードより縦に伸びすぎないよう、PCは横長（21:9）に抑える */
.hb-living__photo { margin-top: 36px; aspect-ratio: 21 / 9; background-position: center 85%; }
/* 右の位置カードを広めに（about 財団概要の .hb-grid2--11-10 は 1.1fr 1fr のまま） */
@media (min-width: 897px) {
  .hb-living.hb-grid2--11-10 { grid-template-columns: 1fr 1.2fr; }
  /* 位置カード（白背景）を左カラムと同じ高さまで伸ばす */
  .hb-living__side { align-self: stretch; }
  .hb-living__side .hb-locmap { flex: 1; justify-content: center; }
}
@media (max-width: 896px) {
  .hb-living__photo { aspect-ratio: 16 / 10; }
  /* SPは従来どおり ボタン→写真72px・写真→位置カード20px の間隔に揃える */
  .hb-living.hb-gap-72 { gap: 20px; }
  .hb-living__photo { margin-top: 72px; }
}

/* 名護市の位置カード */
/* 地図は市町村名が入るため、横並びではなく縦積みにして大きく見せる */
.hb-locmap {
  position: relative;
  background: #FFFFFF;
  border-radius: 8px;
  padding: 24px 28px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 18px;
}
.hb-locmap img { width: 100%; max-width: 360px; height: auto; margin-inline: auto; }
.hb-locmap__ttl { font-size: 1.5rem; font-weight: 700; color: var(--hb-navy); margin: 0 0 8px; }
.hb-locmap__txt { font-size: 1.6rem; line-height: 1.9; color: var(--hb-body2); margin: 0; }

/* 採用CTAバナー */
.hb-cta-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  background: linear-gradient(100deg, #21827D 0%, #30BDB5 100%);
  border-radius: 8px;
  padding: 44px 52px;
  box-shadow: 0 6px 24px rgba(33, 130, 125, .22);
  overflow: hidden;
  position: relative;
  transition: box-shadow .3s ease;
}
.hb-cta-banner:hover { box-shadow: 0 10px 32px rgba(33, 130, 125, .34); opacity: 1; }
.hb-cta-banner__en {
  font-family: "Noto Sans", sans-serif;
  font-weight: 700;
  font-size: 1.2rem;
  letter-spacing: .22em;
  color: #BFEDE9;
  margin: 0 0 12px;
  line-height: normal;
}
.hb-cta-banner__ttl {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: 3.4rem;
  letter-spacing: .04em;
  color: #FFFFFF;
  margin: 0 0 14px;
  line-height: normal;
}
.hb-cta-banner__ttl--30 { font-size: 3rem; }
.hb-cta-banner__txt { font-size: 1.6rem; line-height: 1.9; color: #E9F8F7; margin: 0; }

/* お知らせリスト（枠付き） */
.hb-newsbox {
  background: #FFFFFF;
  border: 1px solid var(--hb-line);
  border-radius: 8px;
  overflow: hidden;
}
.hb-newsbox__item {
  display: grid;
  grid-template-columns: 120px 150px 1fr;
  gap: 24px;
  align-items: center;
  padding: 28px 36px;
  border-bottom: 1px solid var(--hb-line2);
  transition: background .3s ease;
}
.hb-newsbox__item:last-child { border-bottom: none; }
.hb-newsbox__item:hover { background: var(--hb-bg-pale); opacity: 1; }
.hb-newsbox__date { font-family: "Noto Sans", sans-serif; font-size: 1.3rem; color: var(--hb-meta); }
.hb-newsbox__ttl { font-size: 1.6rem; color: var(--hb-navy); }

/* ==========================================================================
   9. レスポンシブ
   ========================================================================== */
@media (max-width: 1100px) {
  .hb-header__inner { height: 64px; padding: 0 20px; }
  .hb-logo .header-logo__name { font-size: 1.7rem; }
  .hb-logo .header-logo__sub { font-size: .9rem; letter-spacing: .12em; }
}

@media (max-width: 896px) {
  .hb-container { padding: 0 24px; }
  .hb-sec--110 { padding: 60px 0; }
  .hb-sec--90 { padding: 50px 0; }
  .hb-sec--100-80 { padding: 56px 0 44px; }
  .hb-sec--100-70 { padding: 56px 0 40px; }
  .hb-sec--90-110 { padding: 50px 0 60px; }
  .hb-sec--80-110 { padding: 44px 0 60px; }
  .hb-sec--70-110 { padding: 40px 0 60px; }
  .hb-sec--pb110 { padding: 0 0 60px; }

  .hb-heading .heading__ja { font-size: 2.6rem; }
  .hb-heading--lg .heading__ja { font-size: 2.8rem; }
  .hb-catch { font-size: 2rem; }

  .hb-grid2,
  .hb-grid2--11-10,
  .hb-grid2--13-10,
  .hb-grid2--14-10,
  .hb-grid2--integ,
  .hb-grid3,
  .hb-grid4 { grid-template-columns: 1fr; }

  .hb-photo--down { transform: none; }

  .hb-mv { min-height: 380px; }
  .hb-mv__ttl { font-size: 3.8rem; }
  .hb-mv__txt { font-size: 1.5rem; line-height: 1.9; margin-top: 24px; }
  .hb-mv__en { margin-bottom: 18px; }

  .hb-cardbar { padding: 24px 26px; }
  .hb-cardbar__ttl { font-size: 2.2rem; }
  .hb-merit { padding: 32px 28px; }
  .hb-merit--white { padding: 30px 26px; }

  .hb-cta-banner { flex-direction: column; align-items: flex-start; gap: 24px; padding: 34px 28px; }
  .hb-cta-banner__ttl { font-size: 2.6rem; }
  .hb-cta-banner__ttl--30 { font-size: 2.4rem; }

  .hb-newsbox__item { grid-template-columns: auto 1fr; gap: 10px 16px; padding: 20px 22px; }
  .hb-newsbox__ttl { grid-column: 1 / -1; }
  .hb-newsbox__date { justify-self: start; }
  .hb-cat { justify-self: start; }

  .hb-footer__grid { grid-template-columns: 1fr; gap: 36px; padding-bottom: 36px; }
  .hb-footer__map { width: calc(100% + 48px); margin: 0 -24px; height: 240px; }
  .hb-footer__bottom { flex-direction: column; align-items: flex-start; gap: 10px; }

  .hb-dist__label { min-width: 150px; }
  /* 位置マップは狭い画面でも画像とテキストを横並びのまま見せる */
  .hb-locmap { padding: 20px; gap: 16px; }
  .hb-locmap img { max-width: 240px; }
  /* 2枚並びを保つグリッド（SPで1カラムに落とさない） */
  .hb-grid2.hb-grid2--keep-sp { grid-template-columns: 1fr 1fr; }
  /* 理事長あいさつの写真・肩書きは中央寄せ */
  .hb-message__side { margin-inline: auto; text-align: center; }

  .hb-deco--wreath-bl { width: 340px; left: -100px; bottom: -90px; }
  .hb-deco--wreath-tr { width: 300px; right: -90px; top: -70px; }
  .hb-deco--haibi { width: 120px; top: -70px; right: -10px; }
  .hb-deco--haibi-s { width: 68px; left: -4px; bottom: -60px; }
}

@media (max-width: 639px) {
  .hb-container { padding: 0 20px; }
  .hb-heading .heading__en { font-size: 1.1rem; margin-bottom: 10px; }
  .hb-heading .heading__ja { font-size: 2.2rem; }
  .hb-heading--lg .heading__ja { font-size: 2.4rem; }
  .hb-lead { font-size: 1.45rem; line-height: 1.95; }
  .hb-cardbar { padding: 24px 22px; }
  .hb-merit { padding: 24px 22px; }
  .hb-text { font-size: 1.45rem; line-height: 1.9; }
  .hb-catch { font-size: 1.8rem; }

  .hb-mv { min-height: 340px; }
  .hb-mv__ttl { font-size: 2.8rem; }
  .hb-mv__en { font-size: 1.1rem; letter-spacing: .18em; }

  .hb-cardbar__ttl { font-size: 1.9rem; }
  .hb-cardbar__ttl::before { height: 24px; }
  .hb-merit__ttl { font-size: 1.7rem; }
  /* TOP 新病院で働く魅力：アイコン付きで幅が狭いため、見出しが1行に収まるよう画面幅に合わせて縮める */
  .hb-merit__ttl--fit { font-size: min(1.8rem, 4.1vw); }
  .hb-cta-banner__ttl { font-size: 2.2rem; }
  .hb-btn-outline.btn { padding: 14px 22px; font-size: 1.4rem; }
  .hb-btn-white { padding: 15px 24px; font-size: 1.4rem; }

  .hb-footer { padding-top: 48px; }
  .hb-footer__map { width: calc(100% + 40px); margin: 0 -20px; height: 220px; }
  .hb-footer__line img { width: 56px; height: 56px; }

  .hb-dist__row { flex-direction: column; gap: 4px; }
  .hb-dist__label { min-width: 0; }
}

/* ==========================================================================
   10. 下層共通：ページヒーロー / パンくず
   ========================================================================== */
.hb-page-hero {
  position: relative;
  height: 300px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.hb-page-hero__inner { width: 100%; position: relative; }
.hb-page-hero__en {
  font-family: "Noto Sans", sans-serif;
  font-size: 1.3rem;
  letter-spacing: .24em;
  color: #BFEDE9;
  margin: 0 0 14px;
}
.hb-page-hero__ttl {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: 4.6rem;
  letter-spacing: .06em;
  color: #FFFFFF;
  margin: 0;
  line-height: normal;
}
.hb-page-hero--about { background: linear-gradient(110deg, #23888D, #47CDC5); }
.hb-page-hero--nursing { background: linear-gradient(110deg, #2F8163, #74C08F); }
.hb-page-hero--nursing .hb-page-hero__en { color: #D6EFDF; }
.hb-page-hero--recruit { background: linear-gradient(110deg, #26938D, #47CDC5); }
.hb-page-hero--access { background: linear-gradient(110deg, #17798C, #45BCD3); }
.hb-page-hero--news { background: linear-gradient(110deg, #3E6480, #6188A0); height: 260px; }
.hb-page-hero--news .hb-page-hero__en { color: #B9CBD6; }
.hb-page-hero--news .hb-page-hero__ttl { font-size: 4.2rem; }

/* ヒーロー右端のあしらい（p01〜p05）。元画像はティールの水彩なので、
   filter で白へ置き換えてグラデーション背景に白抜きで浮かせる */
.hb-page-hero__deco {
  position: absolute;
  top: 50%;
  right: -20px;
  transform: translateY(-50%);
  width: 280px;
  height: auto;
  opacity: .22;
  filter: brightness(0) invert(1);
  pointer-events: none;
  z-index: 0;
}

.hb-crumb { background: var(--hb-bg-pale); border-bottom: 1px solid var(--hb-line); }
.hb-crumb__inner { padding-top: 16px; padding-bottom: 16px; font-size: 1.3rem; color: var(--hb-body2); }
.hb-crumb__inner .breadcrumb__link { color: var(--hb-body2); }
.hb-crumb__inner .breadcrumb__link:hover { color: var(--hb-teal); }
.hb-crumb__inner .breadcrumb__current { color: var(--hb-body2); }
.hb-crumb__inner .breadcrumb__item:not(:last-child)::after { content: "／"; margin: 0; color: var(--hb-body2); }

/* ヘッダーが sticky なので、ナビのドロップダウンで飛んだ先が隠れないよう scroll-margin を確保する */
main section[id] { scroll-margin-top: 92px; }
@media (max-width: 1100px) { main section[id] { scroll-margin-top: 72px; } }

/* ==========================================================================
   11. 下層共通：テーブル / 定義リスト
   ========================================================================== */
.hb-table {
  width: 100%;
  background: #FFFFFF;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(49, 77, 100, .06);
}
.hb-table th,
.hb-table td {
  border: none;
  border-bottom: 1px solid var(--hb-line2);
  font-size: 1.6rem;
  padding: 22px 32px;
  vertical-align: middle;
  text-align: start;
}
.hb-table th {
  width: 220px;
  background: var(--hb-teal);
  color: #FFFFFF;
  font-weight: 500;
}
.hb-table td { color: var(--hb-body); font-weight: 400; }
.hb-table__sub { display: inline-block; margin-top: 6px; font-size: 1.5rem; color: var(--hb-body2); }
.hb-table tr:last-child th,
.hb-table tr:last-child td { border-bottom: none; }

.hb-deflist { border-top: 2px solid var(--hb-navy); margin: 0; }
.hb-deflist__row {
  display: grid;
  grid-template-columns: 130px 1fr;
  padding: 20px 0;
  border-bottom: 1px solid var(--hb-line2);
}
.hb-deflist__dt { font-size: 1.5rem; font-weight: 500; color: var(--hb-navy); }
.hb-deflist__dd { font-size: 1.6rem; color: var(--hb-body); margin: 0; }
.hb-deflist--wide .hb-deflist__row { grid-template-columns: 200px 1fr; padding: 22px 0; }
.hb-deflist--wide .hb-deflist__dt { font-size: 1.6rem; }
.hb-deflist--wide .hb-deflist__dd { line-height: 1.9; }

/* ==========================================================================
   12. about：理事長あいさつ / 理念 / MVV / 機能 / 統合 / 財団概要
   ========================================================================== */
.hb-message { display: grid; grid-template-columns: 280px 1fr; gap: 56px; align-items: start; }
.hb-message__side { position: sticky; top: 110px; }
.hb-portrait {
  aspect-ratio: 3 / 4;
  border-radius: 8px;
  background: repeating-linear-gradient(135deg, #EAF6F5, #EAF6F5 14px, #E0F0EE 14px, #E0F0EE 28px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #7FAFAC;
  font-size: 1.3rem;
  text-align: center;
  line-height: 1.8;
}
.hb-portrait--photo { background: none; overflow: hidden; }
.hb-portrait--photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hb-message__org { font-size: 1.3rem; color: var(--hb-meta); margin: 16px 0 4px; }
.hb-message__name { font-family: "Noto Sans JP", sans-serif; font-size: 1.9rem; color: var(--hb-navy); margin: 0; }
.hb-message__kana { font-size: 1.2rem; color: var(--hb-meta); margin: 6px 0 0; }
.hb-message__body p { font-size: 1.65rem; line-height: 2.2; color: var(--hb-body); margin: 0 0 24px; }
.hb-message__body p:last-child { margin-bottom: 0; }
.hb-message__body p.hb-message__mvv {
  background: var(--hb-bg-card);
  border-left: 3px solid var(--hb-teal-b);
  border-radius: 0 6px 6px 0;
  padding: 20px 24px;
  line-height: 2;
  text-align: left;
}

/* 理念・基本方針カード（ピル見出しが上端に重なる） */
.hb-philo {
  position: relative;
  background: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(49, 77, 100, .07);
  text-align: center;
  padding: 72px 56px 64px;
  margin: 30px 0 54px;
}
.hb-philo--policy { padding: 76px 56px 56px; margin: 30px 0 0; }
.hb-philo__pill {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: .12em;
  color: #FFFFFF;
  background: var(--hb-teal-b);
  border-radius: 30px;
  padding: 15px 52px;
  margin: 0;
  white-space: nowrap;
}
.hb-philo__txt {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 3rem;
  line-height: 2;
  letter-spacing: .05em;
  color: var(--hb-navy);
  margin: 0;
}
.hb-philo__intro {
  font-size: 1.6rem;
  line-height: 2.1;
  color: var(--hb-body);
  margin: 0 0 44px;
}

.hb-policy { display: flex; flex-direction: column; gap: 20px; text-align: left; }
.hb-policy__item { background: var(--hb-bg-pale); border-radius: 8px; padding: 38px 33px; }
.hb-policy__ttl {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 2rem;
  font-weight: 700;
  color: var(--hb-teal);
  margin: 0 0 18px;
  line-height: normal;
}
.hb-policy__num {
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--hb-teal-b);
  color: #FFFFFF;
  font-family: "Noto Sans", sans-serif;
  font-size: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hb-policy__txt { font-size: 1.6rem; line-height: 2.1; color: var(--hb-body); margin: 0; }

/* MVV */
.hb-mvv__label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--hb-teal);
  margin: 0 0 20px;
  line-height: normal;
}
.hb-mvv__label i { flex: none; font-size: 1.6rem; color: var(--hb-teal-b); }
.hb-mvv__txt {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.8rem;
  line-height: 1.6;
  color: var(--hb-navy);
  margin: 0;
}
.hb-mvv__cell { padding: 8px 0; }
.hb-mvv__cell--right { padding: 8px 0 8px 40px; border-left: 1px solid #DCE3E7; }
.hb-mvv__rule { border-top: 1px solid #DCE3E7; margin: 44px 0 0; }
.hb-mvv__label--values { margin: 40px 0 24px; }

.hb-valuecard {
  background: rgb(252, 252, 252);
  border-radius: 8px;
  padding: 38px 33px;
  box-shadow: 2px 4px 6px -1px rgba(0, 0, 0, .15);
}
.hb-valuecard__ttl {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 1.9rem;
  color: var(--hb-navy);
  margin: 0 0 12px;
  line-height: normal;
}
/* 両端揃えにすると全角スペース区切りの箇所が不自然に開くため、左揃えのまま */
.hb-valuecard__txt { font-size: 1.5rem; line-height: 1.95; color: var(--hb-body2); margin: 0; }

.hb-notecard {
  border-top: 4px solid var(--hb-teal-b);
  border-radius: 8px;
  padding: 38px 33px;
  background-color: #FFFFFF;
  background-image: linear-gradient(#F1F2F4 1px, transparent 1px), linear-gradient(90deg, #F1F2F4 1px, transparent 1px);
  background-size: 14px 14px;
  box-shadow: 2px 4px 6px -1px rgba(0, 0, 0, .15);
}
.hb-notecard__ttl {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.1rem;
  color: var(--hb-teal);
  margin: 0 0 18px;
  line-height: normal;
}
.hb-notecard__txt { font-size: 1.6rem; line-height: 2.1; color: var(--hb-body); margin: 0; }

/* 新病院の機能 */
.hb-func {
  border: 1px solid var(--hb-line3);
  border-radius: 6px;
  padding: 38px 33px;
  background: #FFFFFF;
  box-shadow: 0 1px 6px rgba(49, 77, 100, .05);
}
.hb-func__ttl {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 1.9rem;
  color: var(--hb-navy);
  margin: 0 0 12px;
  line-height: normal;
}
.hb-func__ttl i { flex: none; align-self: center; font-size: 1.5rem; color: var(--hb-teal-b); }
.hb-func__num { flex: none; color: var(--hb-teal); font-size: 1.6rem; }
.hb-func__txt { font-size: 1.5rem; line-height: 1.95; color: var(--hb-body2); margin: 0; }
/* 機能カードの箇条書き（別紙①の項目立てに合わせる） */
.hb-func__list { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.hb-func__list li {
  position: relative;
  padding-left: 16px;
  font-size: 1.5rem;
  line-height: 1.9;
  color: var(--hb-body2);
}
.hb-func__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.05em;
  width: 7px;
  height: 1px;
  background: var(--hb-teal-b);
}

/* 連携カード */
.hb-partner { border: 1px solid var(--hb-line3); border-radius: 8px; padding: 38px 33px; }
.hb-partner__ttl { font-size: 1.9rem; font-weight: 700; color: var(--hb-teal); margin: 0 0 14px; line-height: normal; }
.hb-partner__txt { font-size: 1.6rem; line-height: 2; color: var(--hb-body2); margin: 0; }

/* 統合の経緯 */
.hb-integ { display: flex; flex-direction: column; gap: 16px; }
.hb-integ__row {
  background: #FFFFFF;
  border-radius: 6px;
  padding: 26px 30px;
  box-shadow: 0 1px 6px rgba(49, 77, 100, .06);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.hb-integ__name { font-size: 1.6rem; color: var(--hb-navy); }
.hb-integ__num { font-family: "Noto Sans", sans-serif; font-size: 2rem; color: var(--hb-teal); }
.hb-integ__arrow { text-align: center; color: var(--hb-teal-b); font-size: 2.2rem; line-height: normal; }
.hb-integ__row--total {
  background: linear-gradient(100deg, #21827D, #30BDB5);
  padding: 32px 30px;
  box-shadow: 0 4px 16px rgba(33, 130, 125, .2);
}
.hb-integ__row--total .hb-integ__name { font-size: 1.7rem; color: #FFFFFF; font-weight: 500; }
.hb-integ__row--total .hb-integ__num { font-size: 2.6rem; color: #FFFFFF; }

/* 財団概要：主要事業 */
.hb-biz { background: var(--hb-bg-pale); border-radius: 8px; padding: 38px 33px; }
.hb-biz__label { font-size: 1.4rem; font-weight: 500; color: var(--hb-navy); margin: 0 0 24px; }
.hb-biz__list { display: flex; flex-direction: column; gap: 20px; }
.hb-biz__ttl {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.6rem;
  color: var(--hb-teal);
  margin: 0 0 6px;
  font-weight: 500;
  line-height: normal;
}
.hb-biz__ttl i { flex: none; font-size: 1.5rem; color: var(--hb-teal-b); }
.hb-biz__txt { font-size: 1.5rem; line-height: 1.9; color: var(--hb-body2); margin: 0; }

/* 建築デザイン */
.hb-arch__catch {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 2.2rem;
  line-height: 1.9;
  color: var(--hb-teal);
  margin: 0 0 24px;
}

/* ==========================================================================
   13. 下層のレスポンシブ
   ========================================================================== */
@media (max-width: 896px) {
  .hb-page-hero { height: 220px; }
  .hb-page-hero--news { height: 200px; }
  .hb-page-hero__ttl { font-size: 3.2rem; }
  .hb-page-hero--news .hb-page-hero__ttl { font-size: 3rem; }
  .hb-page-hero__deco { width: 190px; right: -26px; opacity: .2; }

  .hb-table th, .hb-table td { padding: 16px 20px; font-size: 1.5rem; }
  .hb-table th { width: 150px; }
  .hb-deflist__row { grid-template-columns: 1fr; gap: 6px; }
  .hb-deflist--wide .hb-deflist__row { grid-template-columns: 1fr; }

  .hb-message { grid-template-columns: 1fr; gap: 32px; }
  .hb-message__side { position: static; max-width: 280px; }
  .hb-message__body p { font-size: 1.5rem; line-height: 2; }

  .hb-philo { padding: 60px 28px 40px; margin: 30px 0 44px; }
  .hb-philo--policy { padding: 62px 20px 36px; }
  .hb-philo__pill { font-size: 1.4rem; padding: 12px 26px; }
  .hb-philo__txt { font-size: 2rem; line-height: 1.9; }
  .hb-policy__item { padding: 26px 22px; }
  .hb-policy__ttl { font-size: 1.7rem; }
  /* about 基本方針：番号付きで幅が狭いため、見出しが1行に収まるよう画面幅に合わせて縮める */
  .hb-policy__ttl--fit { font-size: min(1.7rem, calc(7.6vw - 13.4px)); }

  .hb-mvv__cell--right { padding: 8px 0; border-left: none; border-top: 1px solid #DCE3E7; padding-top: 24px; }
  .hb-mvv__txt { font-size: 2.1rem; }
  .hb-notecard { padding: 28px 24px; }

  .hb-integ__row { padding: 20px 22px; }
  .hb-biz { padding: 28px 24px; }
  .hb-arch__catch { font-size: 1.8rem; }
}

@media (max-width: 639px) {
  .hb-page-hero { height: 180px; }
  .hb-page-hero__ttl { font-size: 2.6rem; }
  /* 見出しが2行になっても読みにくくならないよう、さらに小さく端へ逃がす */
  .hb-page-hero__deco { width: 124px; right: -38px; opacity: .16; }
  .hb-page-hero__en { font-size: 1.1rem; letter-spacing: .18em; margin-bottom: 10px; }
  .hb-philo__txt { font-size: 1.7rem; }
  .hb-mvv__txt { font-size: 1.8rem; }
  .hb-valuecard { padding: 24px 20px; }
}

/* ==========================================================================
   14. nursing：求める人物像 / 教育体制 / ラダー / キャリア / 職場の雰囲気
   ========================================================================== */
.hb-want {
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 25%;
  background-color: #FCFDFD;
  border-top: 1px solid var(--hb-line2);
}
.hb-want__overlay { position: absolute; inset: 0; background: rgba(22, 68, 66, .58); }
/* 暗幕を明るくしたぶん、写真に重なる文字は影でコントラストを補う */
.hb-want .heading__en,
.hb-want .heading__ja,
.hb-want__catch,
.hb-want__close { text-shadow: 0 2px 12px rgba(0, 22, 20, .5); }
.hb-want__catch {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 2.4rem;
  line-height: 1.7;
  color: #9FE3DD;
  margin: 0 0 56px;
}
.hb-want__close { font-size: 2rem; font-weight: 700; line-height: 1.9; color: #FFFFFF; margin: 44px 0 0; }
.hb-want__cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  text-align: left;
  background: var(--hb-teal);
  border-radius: 8px;
  padding: 38px 46px;
  margin-top: 56px;
  box-shadow: 0 4px 18px rgba(33, 130, 125, .2);
  transition: background .3s ease;
}
.hb-want__cta:hover { background: #186B67; opacity: 1; }
.hb-want__cta-ttl { font-size: 1.9rem; font-weight: 700; color: #FFFFFF; margin: 0 0 8px; line-height: normal; }
.hb-want__cta-txt { font-size: 1.5rem; color: #CFEFEC; margin: 0; }
.hb-want__cta-btn {
  flex: none;
  background: #FFFFFF;
  color: var(--hb-teal);
  font-size: 1.5rem;
  font-weight: 700;
  padding: 16px 28px;
  border-radius: 6px;
}

/* 教育体制 */
.hb-edu__note { font-size: 1.5rem; line-height: 1.9; color: var(--hb-body2); margin: 0 0 44px; }
.hb-edu__ttl {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.3rem;
  color: var(--hb-teal);
  margin: 0 0 18px;
  line-height: normal;
}
.hb-edu__txt { font-size: 1.6rem; line-height: 2.05; color: var(--hb-body); margin: 0; }
.hb-edu__box { border: 1px solid var(--hb-teal-pale); border-radius: 10px; background: #FFFFFF; padding: 38px 33px; }
.hb-edu__head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 20px; gap: 16px; }
.hb-edu__head p { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-size: 2.1rem; color: var(--hb-teal); margin: 0; line-height: normal; }
.hb-edu__head span { font-size: 1.1rem; color: var(--hb-meta); }
.hb-edu__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px 28px;
  font-size: 1.5rem;
  line-height: 1.7;
  color: var(--hb-body);
}
.hb-edu__sub { font-size: 1.1rem; color: #7B8F9C; }

/* クリニカルラダー */
.hb-ladder { display: grid; grid-template-columns: 300px 1fr; gap: 28px; align-items: stretch; }
.hb-ladder__skills { background: #A9DDE4; border-radius: 10px; padding: 38px 33px; }
.hb-ladder__skills-ttl { font-size: 1.7rem; font-weight: 700; color: #1B4A55; margin: 0 0 22px; line-height: normal; }
.hb-ladder__skills-list { display: flex; flex-direction: column; gap: 16px; font-size: 1.6rem; color: #1B4A55; }
.hb-ladder__skills-list span { display: flex; align-items: center; gap: 12px; }
.hb-ladder__skills-list i { flex: none; font-size: 2.2rem; color: #FFFFFF; }
/* レベル５→１の順に並べる（上下矢印は非表示） */
.hb-ladder__main { display: block; }
.hb-ladder__levels { display: flex; flex-direction: column; gap: 10px; }
.hb-ladder__row {
  display: grid;
  grid-template-columns: 150px 1fr;
  align-items: center;
  gap: 16px;
  padding: 20px 26px 20px 22px;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
}
.hb-ladder__badge {
  background: #FFFFFF;
  color: var(--hb-teal);
  font-size: 1.3rem;
  font-weight: 700;
  padding: 8px 0;
  border-radius: 20px;
  text-align: center;
}
.hb-ladder__row p { font-size: 1.6rem; line-height: 1.8; margin: 0; color: #1C4E4B; }
.hb-ladder__row--1 { background: #CFEEEB; }
.hb-ladder__row--2 { background: #B9E6E2; }
.hb-ladder__row--3 { background: #9FDDD8; }
.hb-ladder__row--4 { background: #85D3CD; }
.hb-ladder__row--4 p { color: #14413E; }
.hb-ladder__row--5 { background: #69C8C1; }
.hb-ladder__row--5 p { color: #12403C; }

/* キャリアパス（破線コネクター） */
.hb-career { display: grid; grid-template-columns: 328px 1fr; gap: 0; margin-top: 24px; }
.hb-career__body {
  border-left: 2px dashed #69C8C1;
  border-top: 2px dashed #69C8C1;
  border-radius: 10px 0 0 0;
  padding: 26px 0 0 26px;
}
.hb-career__label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--hb-teal);
  margin: 0 0 18px;
  line-height: normal;
}
.hb-career__label i { flex: none; font-size: 1.5rem; color: #69C8C1; }
.hb-career__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.hb-career__card {
  background: var(--hb-teal-b);
  border-radius: 8px;
  padding: 22px 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  color: #FFFFFF;
  line-height: 1.55;
  white-space: nowrap;
}
.hb-career__card b { font-size: 1.6rem; font-weight: 700; }
.hb-career__card small { font-size: 1.2rem; font-weight: 500; opacity: .9; }
.hb-career__card--solid {
  background: var(--hb-teal);
  align-items: center;
  font-size: 1.5rem;
  font-weight: 700;
}

/* 教育の3カード */
.hb-educard { background: #FFFFFF; border: 1px solid var(--hb-teal-pale); border-radius: 12px; padding: 38px 33px; }
.hb-educard--wide { padding: 38px 33px; }
.hb-educard__ttl {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 1.8rem;
  color: var(--hb-teal);
  margin: 0 0 16px;
  line-height: normal;
}
/* 3カラムの狭いカードは両端揃えにすると字間が開きすぎるので、左揃えのまま */
.hb-educard__txt { font-size: 1.5rem; line-height: 1.95; color: var(--hb-body2); margin: 0; }

/* nursing 下部の2カードCTA */
.hb-dualcta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 8px;
  padding: 48px 44px;
}
.hb-dualcta--recruit {
  background: linear-gradient(100deg, #21827D 0%, #30BDB5 100%);
  box-shadow: 0 6px 24px rgba(33, 130, 125, .22);
  transition: box-shadow .3s ease;
}
.hb-dualcta--recruit:hover { box-shadow: 0 10px 32px rgba(33, 130, 125, .34); opacity: 1; }
.hb-dualcta--line {
  background: var(--hb-line-green);
  box-shadow: 0 6px 24px rgba(6, 199, 85, .2);
  transition: background .3s ease;
}
.hb-dualcta--line:hover { background: #05A948; opacity: 1; }
.hb-dualcta__icon { font-size: 3.4rem; color: #FFFFFF; margin-bottom: 16px; line-height: 1; }
.hb-dualcta__ttl { font-size: 2.6rem; font-weight: 700; color: #FFFFFF; margin: 0 0 14px; line-height: normal; }
.hb-dualcta__ttl--sm { font-size: 2.2rem; margin-bottom: 12px; }
.hb-dualcta__txt { font-size: 1.6rem; line-height: 1.9; color: #E9F8F7; margin: 0; }
.hb-dualcta__txt--line { font-size: 1.5rem; color: #E7FBEF; }

@media (max-width: 896px) {
  .hb-want__catch { font-size: 1.9rem; margin-bottom: 36px; }
  .hb-want__close { font-size: 1.7rem; }
  .hb-want__cta { flex-direction: column; align-items: flex-start; gap: 20px; padding: 28px 24px; margin-top: 36px; }

  .hb-edu__list { grid-template-columns: repeat(2, 1fr); }
  .hb-edu__box { padding: 24px 22px; }
  .hb-edu__ttl { font-size: 1.9rem; }

  .hb-ladder { grid-template-columns: 1fr; gap: 20px; }
  .hb-ladder__row { grid-template-columns: 120px 1fr; gap: 14px; padding: 16px 24px 16px 18px; }
  .hb-career { grid-template-columns: 1fr; }
  .hb-career__body { border-left: none; border-radius: 0; padding: 20px 0 0; }
  .hb-career__grid { grid-template-columns: repeat(2, 1fr); }
  .hb-career__card { white-space: normal; }

  .hb-dualcta { padding: 32px 26px; }
  .hb-dualcta__ttl { font-size: 2.1rem; }
  .hb-dualcta__ttl--sm { font-size: 1.9rem; }
}

@media (max-width: 639px) {
  .hb-want__catch { font-size: 1.6rem; }
  .hb-edu__list { grid-template-columns: 1fr; }
  .hb-ladder__skills { padding: 24px 22px; }
  .hb-ladder__row { grid-template-columns: 1fr; gap: 10px; padding: 24px 20px; clip-path: none; border-radius: 8px; }
  .hb-ladder__badge { justify-self: start; padding: 6px 18px; }
  .hb-ladder__row p { font-size: 1.4rem; }
  .hb-edu__sub { font-size: 1.2rem; }
  .hb-educard__txt { font-size: 1.45rem; }
  .hb-educard,
  .hb-educard--wide { padding: 24px 22px; }
  .hb-career__grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   15. recruit：福利厚生 / 選考フロー / 先輩の声 / Q&A / 応募方法
   ========================================================================== */
/* 福利厚生カード：アイコンは見出しの左に置く（アイコンが2行ぶんを縦に貫く） */
.hb-benefit {
  background: #FFFFFF;
  border-radius: 8px;
  padding: 38px 33px;
  box-shadow: 0 2px 10px rgba(49, 77, 100, .06);
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 18px;
  align-items: center;
  align-content: start;  /* カードの高さが揃っても見出しの位置を揃える */
}
.hb-benefit__icon {
  grid-row: 1;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--hb-badge);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--hb-teal);
  font-size: 2.4rem;
  flex: none;
}
.hb-benefit__ttl {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2rem;
  color: var(--hb-navy);
  margin: 0;
  line-height: normal;
}
/* 説明文は「アイコン＋見出し」の下に、左端から全幅で置く（左のインデントは付けない） */
.hb-benefit .hb-text { grid-column: 1 / -1; margin-top: 14px; }

/* 選考フロー */
.hb-flow {
  display: flex;
  flex-direction: column;
  background: var(--hb-bg-card);
  border-radius: 8px;
  padding: 38px 33px;
  border-bottom: 3px solid var(--hb-teal-b);
}
.hb-flow--2 { border-bottom-color: #2AAFA9; }
.hb-flow--3 { border-bottom-color: #25A09E; }
.hb-flow--4 { background: var(--hb-badge); border-bottom-color: var(--hb-teal); }
.hb-flow__step {
  align-self: flex-start;
  font-family: "Noto Sans", sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: .16em;
  color: #FFFFFF;
  background: var(--hb-teal-b);
  margin: 0 0 18px;
  padding: 8px 26px 8px 16px;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);
}
.hb-flow--2 .hb-flow__step { background: #2AAFA9; }
.hb-flow--3 .hb-flow__step { background: #25A09E; }
.hb-flow--4 .hb-flow__step { background: var(--hb-teal); }
.hb-flow__ttl { font-size: 1.8rem; font-weight: 700; color: var(--hb-navy); margin: 0 0 12px; line-height: normal; }
.hb-flow__txt { font-size: 1.4rem; line-height: 1.95; color: var(--hb-body2); margin: 0; }

.hb-docs { background: var(--hb-bg-beige); border-radius: 8px; padding: 38px 33px; }
.hb-docs__ttl { font-size: 1.5rem; font-weight: 700; color: var(--hb-navy); margin: 0 0 14px; line-height: normal; }
/* 応募書類（新卒／中途で分けて記載） */
.hb-docs__list { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.hb-docs__row { display: grid; grid-template-columns: 72px 1fr; gap: 16px; align-items: baseline; }
.hb-docs__row dt { font-size: 1.5rem; font-weight: 700; color: var(--hb-teal); }
.hb-docs__row dd { font-size: 1.5rem; line-height: 1.9; color: var(--hb-body); margin: 0; }
@media (max-width: 639px) {
  .hb-docs__row { grid-template-columns: 1fr; gap: 4px; }
}

/* 先輩の声 */
.hb-voice {
  display: flex;
  gap: 24px;
  background: #FFFFFF;
  border-radius: 8px;
  padding: 38px 33px;
  box-shadow: 0 2px 10px rgba(49, 77, 100, .06);
}
.hb-voice__avatar {
  width: 88px;
  height: 88px;
  flex: none;
  border-radius: 50%;
  background: var(--hb-badge);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--hb-teal);
  font-size: 4rem;
}
.hb-voice__avatar--coral { background: #FBEFEC; color: var(--hb-coral-d); }
.hb-voice__head { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; flex-wrap: wrap; }
.hb-voice__name { font-size: 1.8rem; font-weight: 700; color: var(--hb-navy); }
.hb-voice__badge { font-size: 1.2rem; color: var(--hb-teal); background: var(--hb-badge); padding: 4px 12px; border-radius: 20px; }
.hb-voice__txt { font-size: 1.5rem; line-height: 2; color: var(--hb-body2); margin: 0; }

/* Q&A */
.hb-faq { background: #FFFFFF; border-radius: 8px; padding: 38px 33px; box-shadow: 0 1px 6px rgba(49, 77, 100, .05); }
.hb-faq__q { display: flex; gap: 14px; font-size: 1.7rem; font-weight: 700; color: var(--hb-navy); margin: 0 0 14px; line-height: normal; }
.hb-faq__q::before { content: "Q"; flex: none; color: var(--hb-teal-b); font-size: 2rem; }
.hb-faq__a { display: flex; gap: 14px; font-size: 1.6rem; line-height: 2; color: var(--hb-body2); margin: 0; }
.hb-faq__a::before { content: "A"; flex: none; color: var(--hb-coral); font-size: 2rem; font-weight: 700; }

/* 応募方法 */
.hb-apply { background: #FFFFFF; border-radius: 8px; padding: 44px 40px; box-shadow: 0 2px 10px rgba(49, 77, 100, .06); }
.hb-apply--flex { display: flex; flex-direction: column; }
.hb-apply__ttl {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.1rem;
  color: var(--hb-navy);
  margin: 0 0 24px;
  line-height: normal;
}
.hb-apply__addr { font-size: 1.6rem; line-height: 2; color: var(--hb-body); margin: 0 0 24px; }
.hb-apply__meta { border-top: 1px solid var(--hb-line2); padding-top: 24px; display: flex; flex-direction: column; gap: 10px; }
.hb-apply__meta p { font-size: 1.6rem; color: var(--hb-body); margin: 0; }
.hb-apply__note { font-size: 1.3rem; color: var(--hb-meta); margin: 22px 0 24px; }
.hb-apply__map { height: 220px; border-radius: 8px; }
.hb-apply__qr { display: flex; gap: 26px; align-items: center; margin-bottom: 28px; }
.hb-apply__qr img { width: 120px; height: 120px; flex: none; border-radius: 6px; object-fit: contain; background: #FFFFFF; }
.hb-apply__qr p { font-size: 1.6rem; line-height: 2; color: var(--hb-body2); margin: 0; }
.hb-apply__line {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--hb-line-green);
  color: #FFFFFF;
  font-size: 1.5rem;
  font-weight: 700;
  padding: 18px;
  border-radius: 6px;
  transition: background .3s ease;
}
.hb-apply__line:hover { background: #05A948; color: #FFFFFF; opacity: 1; }
/* LINEの下に置くフォーム相談ブロック（ボタンはページ下部の採用問い合わせフォームへ） */
.hb-apply__sub { border-top: 1px solid var(--hb-line2); margin-top: 28px; padding-top: 26px; }
.hb-apply__sub-ttl { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-size: 1.7rem; color: var(--hb-navy); margin: 0 0 12px; line-height: normal; }
.hb-apply__sub-txt { font-size: 1.6rem; line-height: 2; color: var(--hb-body2); margin: 0 0 20px; }
.hb-apply__form {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: var(--hb-teal);
  color: #FFFFFF;
  font-size: 1.5rem;
  font-weight: 700;
  padding: 18px;
  border-radius: 6px;
  transition: background .3s ease;
}
.hb-apply__form:hover { background: #186B67; color: #FFFFFF; opacity: 1; }
.hb-apply__form i { font-size: 1.3rem; }

@media (max-width: 896px) {
  .hb-benefit { padding: 28px 24px; }
  .hb-flow { padding: 24px 20px; }
  .hb-voice { flex-direction: column; gap: 16px; padding: 26px 22px; }
  .hb-voice__avatar { width: 64px; height: 64px; font-size: 3rem; }
  .hb-faq { padding: 24px 22px; }
  .hb-faq__q { font-size: 1.6rem; }
  .hb-apply { padding: 30px 24px; }
  .hb-apply__qr { gap: 18px; }
  .hb-apply__qr img { width: 96px; height: 96px; }
}

/* ==========================================================================
   16. access：所在地 / 生活圏マップ / 北部で暮らす / お問い合わせフォーム
   ========================================================================== */
.hb-loc {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--hb-line3);
  border-radius: 8px;
  overflow: hidden;
  background: #FFFFFF;
}
.hb-loc--primary { border-color: var(--hb-teal-pale); background: var(--hb-bg-card); }
.hb-loc__body { padding: 38px 33px; }
/* 所在地は1カラムで縦に積む（財団事務局を新病院の下に置く） */
.hb-locgrid { display: grid; grid-template-columns: 1fr; }
.hb-loc__label { font-size: 1.2rem; font-weight: 500; letter-spacing: .1em; color: var(--hb-body2); margin: 0 0 14px; }
/* 施設名を見出しとして見せるとき（例：公立沖縄北部医療センター） */
.hb-loc__label--lg { font-family: "Zen Maru Gothic", sans-serif; font-size: 2.4rem; font-weight: 700; letter-spacing: .04em; line-height: 1.4; color: var(--hb-navy); margin-bottom: 18px; }
.hb-loc--primary .hb-loc__label--lg { color: var(--hb-teal); }
.hb-loc--primary .hb-loc__label { color: var(--hb-teal); }
.hb-loc__addr { font-size: 1.8rem; line-height: 1.95; color: var(--hb-navy); margin: 0 0 10px; }
.hb-loc__sub { font-size: 1.5rem; color: var(--hb-body2); margin: 0; }
.hb-loc__map { margin-top: auto; border-radius: 0; }
.hb-loc__map iframe { height: 420px; }

/* 生活圏マップ */
.hb-around { display: grid; grid-template-columns: 360px 1fr; gap: 36px; align-items: start; }
/* アクセスページ冒頭：沖縄本島の位置図＋新病院までの所要時間 */
.hb-around__intro { display: grid; grid-template-columns: 440px 1fr; gap: 48px; align-items: center; }
.hb-around__intro .hb-around__dist { margin-top: 0; }
.hb-around__intro .hb-locmap__ttl { font-size: 2rem; }
.hb-around__intro .hb-locmap__txt { margin-bottom: 28px; }
.hb-around__mapbox {
  position: relative;
  background: #FCFDFD;
  border: 1px solid var(--hb-line);
  border-radius: 8px;
  padding: 28px 24px 24px;
}
.hb-around__mapbox img { width: 100%; height: auto; display: block; }
.hb-around__dist { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.hb-around__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  background: var(--hb-bg-pale);
  border-radius: 6px;
  padding: 16px 22px;
  gap: 12px;
}
.hb-around__row span:first-child { font-size: 1.5rem; color: var(--hb-body2); }
.hb-around__row span:last-child { font-size: 1.7rem; font-weight: 700; color: var(--hb-teal); }
/* 生活圏マップの凡例（地図上のラベル色と対） */
.hb-legend__item {
  font-size: 1.3rem;
  font-weight: 700;
  color: #002060;
  padding: 7px 14px;
  border-radius: 4px;
}
.hb-legend__item--super { background: #FFE3D2; }
.hb-legend__item--home  { background: #D6F1FF; }
.hb-legend__item--food  { background: #FFF7CC; color: #C00000; }
.hb-legend__item--gym   { background: #F8DCF4; }
.hb-legend__item--cvs   { background: var(--hb-bg-pale); }

.hb-around__figure {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #EAE2D6;
  background: #F4F6F7;
}
.hb-around__figure img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.hb-around__shot { border: 1px solid var(--hb-line); border-radius: 8px; overflow: hidden; }
.hb-around__shot-img {
  aspect-ratio: 4 / 3;
  background-color: #EDF2F4;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.hb-around__shot p { font-size: 1.3rem; color: var(--hb-body); margin: 0; padding: 12px 14px; }

/* 北部で暮らす（写真ラベル） */
.hb-scene { position: relative; border-radius: 8px; overflow: hidden; }
.hb-scene__label {
  position: absolute;
  left: 20px;
  bottom: 18px;
  background: rgba(255, 255, 255, .92);
  color: var(--hb-teal);
  font-size: 1.3rem;
  font-weight: 700;
  padding: 8px 16px;
  border-radius: 6px;
}
.hb-scene__label--sm { left: 16px; bottom: 16px; font-size: 1.2rem; padding: 7px 14px; }

/* お問い合わせフォーム */
.hb-form { background: #FFFFFF; border-radius: 8px; padding: 56px 52px; box-shadow: 0 2px 12px rgba(49, 77, 100, .07); }
.hb-form__stack { display: flex; flex-direction: column; gap: 28px; }
.hb-form__label { display: block; font-size: 1.4rem; font-weight: 500; color: var(--hb-navy); margin-bottom: 12px; }
.hb-form__label--tight { margin-bottom: 10px; }
.hb-form__req { color: var(--hb-coral); font-size: 1.2rem; }
.hb-form__types { display: flex; gap: 12px; }
.hb-form__type {
  flex: 1;
  border: 1px solid var(--hb-line4);
  color: var(--hb-body2);
  font-size: 1.5rem;
  padding: 16px;
  border-radius: 6px;
  text-align: center;
  background: #FFFFFF;
  cursor: pointer;
}
.hb-form__type.is-active {
  border: 2px solid var(--hb-teal-b);
  background: #F2FBFA;
  color: var(--hb-teal);
  font-weight: 500;
}
.hb-form__field {
  width: 100%;
  height: 54px;
  border: 1px solid var(--hb-line4);
  border-radius: 6px;
  background: #FCFDFD;
  padding: 0 16px;
  font-family: inherit;
  font-size: 1.5rem;
  color: var(--hb-navy);
  outline: none;
  transition: border-color .3s ease;
}
.hb-form__field--area { height: 180px; padding: 14px 16px; line-height: 1.9; resize: vertical; }
.hb-form__field:focus { border-color: var(--hb-teal-b); }
.hb-form__submit {
  background: var(--hb-teal);
  color: #FFFFFF;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 19px 72px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(33, 130, 125, .24);
  font-family: inherit;
  transition: background .3s ease;
}
.hb-form__submit:hover { background: #186B67; }
.hb-form__note { font-size: 1.2rem; color: #A8B8C2; margin: 0; text-align: center; }

/* フォーム下の連絡先カード（TEL・LINEはリンク、FAXは表示のみ） */
.hb-contactbox {
  position: relative;
  background: #FFFFFF;
  border-radius: 10px;
  padding: 30px 20px 26px;
  text-align: center;
  border: 1px solid var(--hb-line3);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  overflow: hidden;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
/* 上端のアクセントライン */
.hb-contactbox::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--hb-teal), var(--hb-teal-b));
}
.hb-contactbox__ico {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--hb-badge);
  color: var(--hb-teal);
  font-size: 1.7rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
}
.hb-contactbox__label {
  font-family: "Noto Sans", sans-serif;
  font-size: 1.1rem;
  font-weight: 500;
  letter-spacing: .2em;
  color: var(--hb-meta);
  margin: 0;
}
.hb-contactbox__value { font-family: "Noto Sans", sans-serif; font-size: 2.1rem; color: var(--hb-navy); margin: 0; line-height: normal; }
.hb-contactbox__cap { font-size: 1.2rem; color: var(--hb-body2); margin-top: auto; padding-top: 6px; }
.hb-contactbox__cap i { font-size: 1rem; margin-left: 6px; }

/* リンクのカードだけ浮かせる */
a.hb-contactbox:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(33, 130, 125, .16);
  border-color: var(--hb-teal-b);
  opacity: 1;
}

/* FAXは受け取り専用なのでアイコンを控えめにする */
.hb-contactbox--fax::before { background: var(--hb-line4); }
.hb-contactbox--fax .hb-contactbox__ico { background: var(--hb-line2); color: var(--hb-body2); }

/* LINEはブランドカラーで塗る */
.hb-contactbox--line { background: linear-gradient(135deg, #06C755, #04A249); border-color: transparent; }
.hb-contactbox--line::before { background: rgba(255, 255, 255, .45); }
.hb-contactbox--line .hb-contactbox__ico { background: rgba(255, 255, 255, .22); color: #FFFFFF; font-size: 2.2rem; }
.hb-contactbox--line .hb-contactbox__label { color: rgba(255, 255, 255, .82); }
.hb-contactbox--line .hb-contactbox__value { font-family: "Noto Sans JP", sans-serif; font-size: 1.6rem; font-weight: 500; color: #FFFFFF; }
.hb-contactbox--line .hb-contactbox__cap { color: rgba(255, 255, 255, .85); }
.hb-contactbox--line:hover { box-shadow: 0 12px 26px rgba(4, 162, 73, .28); border-color: transparent; }

@media (max-width: 896px) {
  .hb-loc__body { padding: 28px 24px; }
  .hb-loc__map iframe { height: 260px; }
  .hb-around { grid-template-columns: 1fr; gap: 28px; }
  .hb-around__intro { grid-template-columns: 1fr; gap: 28px; }
  .hb-form { padding: 32px 24px; }
  .hb-form__types { flex-direction: column; }
  .hb-form__submit { padding: 17px 48px; width: 100%; }
}

/* ==========================================================================
   17. blog：お知らせ一覧・詳細（メイン + 右サイドバー）
   ========================================================================== */
.hb-blog { display: grid; grid-template-columns: 1fr 300px; gap: 56px; align-items: start; }

.hb-blog__filter { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 36px; }
.hb-blog__filter-item {
  border: 1px solid var(--hb-line4);
  color: var(--hb-body2);
  font-size: 1.3rem;
  padding: 10px 20px;
  border-radius: 4px;
}
.hb-blog__filter-item.is-current {
  background: var(--hb-teal);
  border-color: var(--hb-teal);
  color: #FFFFFF;
  font-weight: 500;
}
/* TOPのお知らせ上に置くカテゴリタブ（一覧ページより余白を詰める） */
.hb-blog__filter--top { margin-bottom: 20px; }

.hb-blog__list { display: flex; flex-direction: column; }
.hb-blog__item {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 26px;
  padding: 26px 0;
  border-bottom: 1px solid var(--hb-line2);
  transition: opacity .3s ease;
}
.hb-blog__item:hover { opacity: .7; }
.hb-blog__thumb {
  aspect-ratio: 16 / 10;
  border-radius: 6px;
  background: repeating-linear-gradient(135deg, #EAF6F5, #EAF6F5 12px, #E0F0EE 12px, #E0F0EE 24px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #7FAFAC;
  font-size: 1.2rem;
}
.hb-blog__thumb--red { background: repeating-linear-gradient(135deg, #F7EDE9, #F7EDE9 12px, #F2E3DD 12px, #F2E3DD 24px); color: #C08D7E; }
.hb-blog__thumb--gray { background: repeating-linear-gradient(135deg, #EDF2F4, #EDF2F4 12px, #E4EBEF 12px, #E4EBEF 24px); color: var(--hb-meta); }
.hb-blog__body { padding-top: 6px; }
.hb-blog__meta { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; flex-wrap: wrap; }
.hb-blog__date { font-family: "Noto Sans", sans-serif; font-size: 1.3rem; color: var(--hb-meta); }
.hb-blog__ttl { font-size: 1.8rem; font-weight: 500; line-height: 1.7; color: var(--hb-navy); margin: 0 0 10px; }
.hb-blog__excerpt { font-size: 1.5rem; line-height: 1.9; color: #7B8F9C; margin: 0; }
.hb-blog .hb-cat { padding: 5px 12px; }

.hb-pager { display: flex; justify-content: center; gap: 8px; margin-top: 48px; }
.hb-pager__item {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--hb-line4);
  color: var(--hb-body2);
  border-radius: 4px;
  font-size: 1.4rem;
}
.hb-pager__item.is-current { background: var(--hb-teal); border-color: var(--hb-teal); color: #FFFFFF; }

/* サイドバー */
.hb-side { display: flex; flex-direction: column; gap: 32px; }
.hb-side__box { background: var(--hb-bg-pale); border-radius: 8px; padding: 38px 33px; }
.hb-side__ttl {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--hb-navy);
  margin: 0 0 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--hb-line3);
  line-height: normal;
}
.hb-side__list { display: flex; flex-direction: column; gap: 14px; font-size: 1.5rem; color: var(--hb-body2); }
.hb-side__recent { display: flex; flex-direction: column; gap: 18px; }
.hb-side__recent-date { font-family: "Noto Sans", sans-serif; font-size: 1.2rem; color: var(--hb-meta); margin: 0 0 5px; }
.hb-side__recent-ttl { font-size: 1.5rem; line-height: 1.7; color: var(--hb-body); margin: 0; }
.hb-side__link-box { border: 1px solid var(--hb-line3); border-radius: 8px; padding: 26px; }
.hb-side__link-box p { font-size: 1.5rem; line-height: 1.9; color: var(--hb-body2); margin: 0 0 14px; }
.hb-side__link-box a { font-size: 1.5rem; }
.hb-side__cta {
  background: var(--hb-teal);
  color: #FFFFFF;
  border-radius: 8px;
  padding: 30px 26px;
  display: block;
  transition: background .3s ease;
}
.hb-side__cta:hover { background: #186B67; color: #FFFFFF; opacity: 1; }
.hb-side__cta-ttl { font-size: 1.6rem; font-weight: 700; margin: 0 0 8px; color: #FFFFFF; line-height: normal; }
.hb-side__cta-txt { font-size: 1.3rem; line-height: 1.8; margin: 0; color: #CFEFEC; }

/* 記事詳細 */
.hb-article__meta { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; flex-wrap: wrap; }
.hb-article__meta .hb-cat { padding: 6px 14px; }
.hb-article__ttl {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: 3.4rem;
  line-height: 1.65;
  letter-spacing: .03em;
  color: var(--hb-navy);
  margin: 0 0 36px;
}
.hb-article__hero {
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  background: repeating-linear-gradient(135deg, #EAF6F5, #EAF6F5 14px, #E0F0EE 14px, #E0F0EE 28px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #7FAFAC;
  font-size: 1.3rem;
  margin-bottom: 44px;
}
.hb-article__body p { font-size: 1.7rem; line-height: 2.2; color: var(--hb-body); margin: 0 0 28px; }
.hb-article__body p:last-child { margin-bottom: 36px; }
.hb-article__h2 {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: 2.3rem;
  color: var(--hb-navy);
  margin: 44px 0 20px;
  padding-left: 14px;
  border-left: 4px solid var(--hb-teal-b);
  line-height: normal;
}
.hb-article__back {
  border: 1px solid var(--hb-line4);
  color: var(--hb-body2);
  font-size: 1.4rem;
  padding: 15px 40px;
  border-radius: 6px;
  transition: border-color .3s ease, color .3s ease;
}
.hb-article__back:hover { border-color: var(--hb-teal-b); color: var(--hb-teal); opacity: 1; }

@media (max-width: 1100px) {
  .hb-blog { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 639px) {
  .hb-blog__item { grid-template-columns: 1fr; gap: 14px; }
  .hb-blog__ttl { font-size: 1.6rem; }
  .hb-article__ttl { font-size: 2.2rem; }
  .hb-article__h2 { font-size: 1.9rem; }
}

/* === PAGE STYLES BELOW === */

/* --- 個別の上書き（utility との優先順位調整） --- */
.hb-heading.text-center { text-align: center; }
.hb-career__card--solid { line-height: normal; }
.hb-deflist__sub { font-size: 1.5rem; color: var(--hb-body2); }

/* access：北部で暮らす 上段（古宇利大橋・21世紀の森ビーチ・備瀬のフクギ並木）。PCは3枚の高さを古宇利大橋に揃える */
.hb-life-top { display: grid; grid-template-columns: 1.4fr 1fr 1fr; }
.hb-life-top > .hb-scene + .hb-scene { aspect-ratio: auto; }

/* access：北部で暮らす 下段グリッド（1fr 1fr 1.2fr） */
.hb-life-grid { display: grid; grid-template-columns: 1fr 1fr 1.2fr; }
/* 上段・下段の6枚は高さを統一する（PCは固定高さ、SPは同じ縦横比） */
.hb-life-top > .hb-scene,
.hb-life-grid > .hb-scene { aspect-ratio: auto; height: 260px; }
.hb-mt-32 { margin-top: 32px; }
.hb-mt-40 { margin-top: 40px; }
@media (max-width: 896px) {
  .hb-life-top,
  .hb-life-grid { grid-template-columns: 1fr; }
  .hb-life-top > .hb-scene,
  .hb-life-top > .hb-scene + .hb-scene,
  .hb-life-grid > .hb-scene { height: auto; aspect-ratio: 16 / 10; }
}
.hb-gap-8 { gap: 8px; }
.hb-form__type { background: transparent; }
.hb-form__submit { text-align: start; }
.hb-contactbox__value--link { display: block; padding-top: 4px; }
.hb-form__field { display: block; }
.hb-mt-56 { margin-top: 56px; }

/* ==========================================================================
   18. SP固定バーまわりの調整（共通コンポーネントの補正）
   ========================================================================== */
/* 共通SCSSの疑似要素は Font Awesome 5 のファミリー名を指定しているため、
   FA6 を読み込む本サイト用にファミリー名を合わせる */
.sp-nav__link::after,
.header__tel::before { font-family: "Font Awesome 6 Free"; }

/* SPナビは写真の上に重なるため不透明にして可読性を確保する */
.sp-nav { background: linear-gradient(135deg, #26938D, #1E7E79); }

@media (max-width: 896px) {
  /* SP固定バー（高さ約60px）に本文が隠れないよう逃がす */
  .hb-footer__bottom { padding-bottom: 76px; }
  .page-top { bottom: 76px; }
  /* フッターのサイトマップはSPでは出さない（ハンバーガーナビ・下部固定バーで足りる） */
  .hb-footer__col--sitemap { display: none; }
}

/* ==========================================================================
   19. ブログCMS（お知らせ）まわりの調整
   記事1件ぶんのマークアップはCMS管理画面のテンプレート側で組むため、
   ここでは「入れ物」と「CMSが吐く素のタグ」だけを整える
   ========================================================================== */

/* TOPの最新のお知らせ：3件までを枠内に収め、それ以降はスクロールで見せる。
   1件の高さは PC 86px（padding 28px×2 ＋ 1行）／SP 104px（padding 20px×2 ＋ 2段組）なので、
   その3件ぶんを max-height にする */
.hb-newsbox--scroll { max-height: 258px; }

/* お知らせ一覧ページ：画面の縦幅に収まるところまで表示し、それ以降はスクロールで見せる
   （ヘッダー約74px ＋ 上下の余白ぶんを引く） */
.hb-newsbox--scroll-vh { max-height: calc(100vh - 220px); min-height: 73px; }

.hb-newsbox--scroll,
.hb-newsbox--scroll-vh {
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: var(--hb-line4) transparent;
}
.hb-newsbox--scroll::-webkit-scrollbar,
.hb-newsbox--scroll-vh::-webkit-scrollbar { width: 6px; }
.hb-newsbox--scroll::-webkit-scrollbar-thumb,
.hb-newsbox--scroll-vh::-webkit-scrollbar-thumb { background: var(--hb-line4); border-radius: 3px; }
.hb-newsbox--scroll::-webkit-scrollbar-track,
.hb-newsbox--scroll-vh::-webkit-scrollbar-track { background: transparent; }

.hb-newsbox .hb-blog__empty { padding: 40px 36px; }

/* カテゴリバッジの色分け。CMSはカテゴリ名だけを出力するので、
   js/common.js がカテゴリ名から下のクラスを付ける（対応表はJS側） */
.hb-cat--recruit  { color: #1B6D69; background: #E2F2F1; }  /* 採用情報：ティール */
.hb-cat--event    { color: #C1462E; background: #FBEBE7; }  /* 説明会・イベント：コーラル */
.hb-cat--hospital { color: #1C6C9C; background: #E6F0F8; }  /* 新病院情報：ブルー */
.hb-cat--progress { color: #8A6111; background: #FAF2DF; }  /* 開院準備の進捗：アンバー */
.hb-cat--bid      { color: #4B5EA6; background: #EBEEF9; }  /* 公募・入札情報：インディゴ */
.hb-cat--other    { color: #5C6F7B; background: #EDF2F4; }  /* その他：グレー */

/* カテゴリ絞り込みタブ（aタグ化したのでhoverを付ける） */
.hb-blog__filter-item { transition: border-color .3s ease, color .3s ease, background .3s ease; }
.hb-blog__filter-item:not(.is-current):hover { border-color: var(--hb-teal-b); color: var(--hb-teal); opacity: 1; }
.hb-blog__filter-item.is-current:hover { color: #FFFFFF; opacity: 1; }

/* 記事が0件のとき */
.hb-blog__empty { font-size: 1.6rem; line-height: 1.9; color: var(--hb-body2); padding: 40px 0; margin: 0; }

/* 一覧の下に置く財団サイトの案内（区切り線＋一文＋テキストリンクだけの控えめな表示） */
.hb-newsnote {
  margin-top: 40px;
  padding-top: 22px;
  border-top: 1px solid var(--hb-line2);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;  /* PCは中央ぞろえ（SPは下の指定で左寄せ） */
  gap: 6px 18px;
  font-size: 1.4rem;
  line-height: 1.9;
  color: var(--hb-body2);
}
.hb-newsnote a { color: var(--hb-teal); text-decoration: underline; white-space: nowrap; }
.hb-newsnote a i { font-size: 1.05rem; margin-left: 6px; }

/* 月別アーカイブで絞り込み中の表示 */
.hb-newsfilter {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 16px;
  font-size: 1.4rem;
  color: var(--hb-body2);
  margin: 0 0 20px;
}
.hb-newsfilter span { font-weight: 500; color: var(--hb-navy); }
.hb-newsfilter a { font-size: 1.3rem; color: var(--hb-teal); text-decoration: underline; }

/* サイドバー：月別アーカイブ（CMSは <ul><li><a> を返す） */
.hb-side__list a { color: var(--hb-body2); transition: color .3s ease; }
.hb-side__list a:hover { color: var(--hb-teal); opacity: 1; }
.hb-side__archive ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.hb-side__archive li { margin: 0; }
.hb-side__archive br { display: none; }

/* 記事詳細：アイキャッチ（CMSの画像URLを流し込む） */
.hb-article__hero--photo { background: none; display: block; overflow: hidden; }
.hb-article__hero--photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* CMSがカテゴリ名を返すまでは空のバッジを出さない */
.hb-article__meta .hb-cat:has(span:empty) { display: none; }

/* 記事本文（CMSのリッチテキスト出力）。h2は .hb-article__h2 と同じ見え方に揃える */
.hb-article__body img { max-width: 100%; height: auto; border-radius: 6px; margin: 0 0 28px; }
.hb-article__body a { color: var(--hb-teal); text-decoration: underline; }
.hb-article__body strong { font-weight: 700; color: var(--hb-navy); }
.hb-article__body ul,
.hb-article__body ol { margin: 0 0 28px; padding-left: 1.4em; font-size: 1.6rem; line-height: 2.2; color: var(--hb-body); }
.hb-article__body li { margin-bottom: 8px; }
.hb-article__body h2 {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: 2.3rem;
  color: var(--hb-navy);
  margin: 44px 0 20px;
  padding-left: 14px;
  border-left: 4px solid var(--hb-teal-b);
  line-height: normal;
}
.hb-article__body h3 {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: 1.9rem;
  color: var(--hb-navy);
  margin: 36px 0 16px;
  line-height: normal;
}
.hb-article__body table { width: 100%; border-collapse: collapse; margin: 0 0 28px; font-size: 1.6rem; }
.hb-article__body th,
.hb-article__body td { border: 1px solid var(--hb-line3); padding: 14px 16px; line-height: 1.9; text-align: start; }
.hb-article__body th { background: var(--hb-bg-pale); font-weight: 500; color: var(--hb-navy); white-space: nowrap; }

/* 前後の記事（CMSの page_link 出力：.pages > .page_next / .page_prev） */
.hb-article__pager { margin-top: 48px; font-size: 1.4rem; }
.hb-article__pager .pages {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  border-top: 1px solid var(--hb-line2);
  padding-top: 24px;
}
.hb-article__pager .page_prev { margin-inline-start: auto; text-align: end; }
/* 同じカテゴリーに前後の記事が無いときはCMSが空の枠だけを返すので、区切り線を出さない */
.hb-article__pager .pages:empty { display: none; }
.hb-article__pager a { color: var(--hb-body2); transition: color .3s ease; }
.hb-article__pager a:hover { color: var(--hb-teal); opacity: 1; }

@media (max-width: 896px) {
  /* SPは1件が2段組（104px）になるので、3件ぶんの高さに合わせ直す */
  .hb-newsbox--scroll { max-height: 312px; }
  /* SP固定バー（約60px）ぶんも引く */
  .hb-newsbox--scroll-vh { max-height: calc(100vh - 240px); }
}

@media (max-width: 639px) {
  .hb-article__body h2 { font-size: 1.9rem; }
  .hb-article__body table { font-size: 1.5rem; }
  .hb-article__body th { white-space: normal; }
  .hb-newsnote { justify-content: flex-start; }
}

/* ==========================================================================
   20. スマホ（〜639px）の見え方の調整
   ========================================================================== */
@media (max-width: 639px) {
  /* about：理念の一文は画面幅で自然に折り返し、左揃えで読ませる（デザインの<br>は効かせない） */
  .hb-philo__txt { text-align: left; }
  .hb-philo__txt br { display: none; }
  /* about：基本方針の導入文も左揃え */
  .hb-philo__intro { text-align: left; font-size: 1.45rem; }
  /* about：理事長挨拶の本文 */
  .hb-message__body p { font-size: 1.45rem; }

  /* about：基本方針・Valuesカード・補足カードの本文は狭い画面では一段小さく */
  .hb-policy__txt { font-size: 1.38rem; }
  .hb-valuecard__txt { font-size: 1.45rem; }
  .hb-notecard__txt { font-size: 1.35rem; line-height: 1.9; }

  /* about：定義テーブルの見出し列を狭めて本文の幅を稼ぐ */
  .hb-table th { width: 88px; }
  .hb-table th, .hb-table td { padding: 10px 15px; font-size: 1.35rem; }

  /* about：機能カード・連携カードの余白を詰める */
  .hb-func,
  .hb-partner { padding: 25px 20px; }
  .hb-func__ttl { font-size: 1.6rem; }
  .hb-notecard__ttl { font-size: 1.8rem; }
  .hb-func__list li { position: relative; padding-left: 16px; font-size: 1.45rem; line-height: 1.8; }
  .hb-partner__ttl { font-size: 1.7rem; }
  .hb-partner__txt { font-size: 1.45rem; line-height: 1.8; }

  /* お知らせのカテゴリタブは狭い画面では小さめに */
  .hb-blog__filter-item { font-size: 1.2rem; padding: 8px 15px; }

  /* ==========================================================================
     狭い画面の本文サイズを揃える（PCで1px上げたぶん、SPでは読みやすい大きさに戻す）
     本文まわりは 1.35〜1.5rem に収める
     ========================================================================== */
  /* 募集要項・応募書類などの定義リスト */
  .hb-deflist__dt { font-size: 1.4rem; }
  .hb-deflist__dd { font-size: 1.4rem; }
  .hb-deflist--wide .hb-deflist__dt { font-size: 1.4rem; }
  .hb-deflist__sub { font-size: 1.35rem; }
  .hb-docs__row dt,
  .hb-docs__row dd { font-size: 1.4rem; }

  /* よくあるご質問 */
  .hb-faq__a { font-size: 1.45rem; }

  /* 教育体制・キャリア */
  .hb-edu__txt { font-size: 1.45rem; }
  .hb-edu__note { font-size: 1.4rem; }
  .hb-ladder__skills-list { font-size: 1.45rem; }

  /* カード・バナーの説明文 */
  .hb-func__txt,
  .hb-biz__txt,
  .hb-voice__txt,
  .hb-flow__txt,
  .hb-cta-banner__txt,
  .hb-dualcta__txt { font-size: 1.4rem; }
  .hb-dualcta__txt--line { font-size: 1.35rem; }

  /* 応募方法・所在地まわり */
  .hb-apply__addr { font-size: 1.5rem; }
  .hb-apply__meta p,
  .hb-apply__sub-txt { font-size: 1.4rem; }
  .hb-apply__qr p { font-size: 1.45rem; }
  .hb-locmap__txt,
  .hb-loc__sub,
  .hb-dist__label { font-size: 1.4rem; }

  /* お知らせ一覧・サイドバー */
  .hb-blog__excerpt { font-size: 1.35rem; }
  .hb-side__list,
  .hb-side__recent-ttl,
  .hb-side__link-box p,
  .hb-side__link-box a { font-size: 1.4rem; }

  /* フッター */
  .hb-footer__info,
  .hb-footer__link { font-size: 1.4rem; }
  /* 施設名・住所・電話のブロックは中央揃え、住所とTELの間は詰める */
  .hb-footer__about { text-align: center; }
  .hb-footer__info--addr { margin-bottom: 0; }
  .hb-footer__label { text-align: center; }

  /* recruit・nursing：よくあるご質問の質問文 */
  .hb-faq__q { font-size: 1.6rem; }

  /* TOP・お知らせ一覧：お知らせのタイトル（CMS出力） */
  .hb-newsbox__ttl { font-size: 1.4rem; }
  .hb-faq__q::before,
  .hb-faq__a::before { font-size: 1.5rem; }

  /* nursing：求める人物像の締め文とCTA見出し */
  .hb-want__close { text-align: center; text-wrap: balance; word-break: auto-phrase; }
  /* 見出しが1行に収まるよう画面幅に合わせて縮める */
  .hb-want__cta-ttl { font-size: min(1.8rem, calc(5.5vw - 5px)); }

  /* nursing：LINEカードはアイコンを見出しの左に置く */
  .hb-dualcta--line {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 14px;
    align-items: center;
  }
  .hb-dualcta--line .hb-dualcta__icon { grid-row: 1 / span 2; margin-bottom: 0; font-size: 2.8rem; }

  /* recruit：福利厚生（アイコン左並びは共通指定。SPはアイコンと余白を詰める） */
  .hb-benefit { column-gap: 14px; }
  .hb-benefit__icon { width: 44px; height: 44px; font-size: 1.9rem; }
  .hb-benefit__ttl { margin-bottom: 6px; font-size: 1.8rem; }

  /* access：北部で暮らすの写真は縦幅を揃える */
  .hb-scene.hb-photo { aspect-ratio: 16 / 10; }
}

@media (max-width: 639px) {
  /* nursing：職場の雰囲気のあしらい。写真・見出し・本文にかからない位置へ寄せる
     （右上は写真の下端を避け、左下のハイビスカスは文字のない右下へ回す） */
  .hb-deco--haibi { top: -60px; right: -6px; }
  .hb-deco--haibi-s { left: auto; right: 6px; bottom: -57px; width: 68px; }
}

/* キャリアパス：カード内を折り返せないと 897〜1100px で横にはみ出すため、
   その帯では折り返しと縮小を許可する（レイアウト自体は2カラムのまま） */
@media (max-width: 1100px) {
  .hb-career__body,
  .hb-career__grid,
  .hb-career__card { min-width: 0; }
  .hb-career__card { white-space: normal; }
}

/* ==========================================================================
   21. CMSフォーム（お問い合わせ）の色味あわせ
   マークアップとレイアウトはCMS側（mail-form.css）。送信ボタンだけサイトの配色に揃える
   ========================================================================== */
/* CMSフォームの .form-contents が自前で内側の余白（35px 30px）を持つため、
   外枠（.hb-form）側のパディングは持たせない（上下の余白が二重になるのを防ぐ） */
.hb-form--cms { padding: 0; overflow: hidden; }

/* 送信ボタンの色（お問い合わせ 1-1 ／ 採用 2-1 の両方。
   CMS側がID付きセレクタで色を当てているので、こちらもID付きで指定する） */
#cms-contact-1-1-area .submit-btn,
#cms-contact-2-1-area .submit-btn {
  background: var(--hb-teal);
  border-radius: 6px;
  transition: background .3s ease, opacity .3s ease;
}
#cms-contact-1-1-area .submit-btn:hover,
#cms-contact-2-1-area .submit-btn:hover { background: #186B67; }

@media (max-width: 639px) {
  /* SPは左右の余白をもう少し詰めて入力欄の幅を稼ぐ */
  #cms-contact-1-1-area .form-contents,
  #cms-contact-2-1-area .form-contents { padding: 28px 20px; }
}

/* 追従ヘッダーに隠れないよう、アンカーで飛んだときの上余白を確保 */
#hb-recruit-form { scroll-margin-top: 100px; }
@media (max-width: 1100px) { #hb-recruit-form { scroll-margin-top: 84px; } }

/* SP固定バー：ラベルが共通CSSの .75rem では小さいので少し大きくする */
.sp-fixed-bar__link { font-size: 1.1rem; }
.sp-fixed-bar__link i { font-size: 1.9rem; display: block; margin-bottom: 4px; }

/* スマホだけで改行する箇所（フォームのリード文など） */
.hb-br-sp { display: none; }
@media (max-width: 639px) { .hb-br-sp { display: inline; } }
/* PCだけで改行する（文の切れ目で折り返させたいとき）。スマホでは幅が足りないので無効 */
.hb-br-pc { display: inline; }
@media (max-width: 639px) { .hb-br-pc { display: none; } }
/* 語の途中で折り返して1〜2文字だけ次の行に残らないよう、ひとまとまりで改行させる */
.hb-nowrap { white-space: nowrap; }
/* スマホは幅が狭く、まとまりごと次の行へ送ると行末が大きく空くため解除する */
@media (max-width: 639px) { .hb-nowrap { white-space: normal; } }
/* 短い語のまとまり（スマホでも分けない） */
.hb-keep { white-space: nowrap; }

@media (max-width: 639px) {
  /* メインビューの高さ：CMS設定（PC想定の100vh）に対し、スマホは60vhにする */
  #slideshow #main_slider.slider_wrapper { --swiper-wrapper-height: 60vh; }
}

@media (max-width: 639px) {
  /* TOP病院について：背景あしらいがチップやボタンと重なるので、右上ほど薄くフェードさせる */
  .hb-deco--wreath-bl {
    opacity: .34;
    -webkit-mask-image: linear-gradient(to top right, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 82%);
    mask-image: linear-gradient(to top right, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 82%);
  }
}

/* ==========================================================================
   22. スマホでは text-wrap の折り返し調整（balance）を無効化
   狭い画面では最終行を揃えようとして行ごとの文字数が不揃いになり、かえって読みにくいため
   ========================================================================== */
@media (max-width: 896px) {
  .hb-want__close { text-wrap: wrap; }
}

/* ==========================================================================
   23. 配置の指定は本文の両端揃え（justify）より優先する
   main.css の .text-center より site.css の本文クラスが後に来るため、
   併用したときに中央寄せが効かなくなるのを防ぐ
   ========================================================================== */
.text-center { text-align: center; }
.text-right { text-align: right; }