@charset "UTF-8";
/* ==========================================================================
   page-common.css — 固定ページ共通レイヤー  [out]

   ページ名スコープごとにコピーされていた共通の余白を1箇所に集めたもの。
   移行スクリプトが実データから検出して自動生成している。
   各値の (n=..) は、移行前に何ページ分のセレクタで一致していたか。
   新規ページは .page-sec と .blks を書くだけで、この余白が効く。

   【読み込み位置】base → layout → module → page-common → 各セクションCSS
   セクションCSSより前に読むこと。

   【効く範囲】
   ここに書いてあるのは .blks（番号なし）を使う新規ページ用の指定だけ。
   既存ページは .blks-1 .blks-2 … なので当たらず、これまで通り
   各セクションCSSの指定で表示される。移行で見た目は変わらない。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 新規ページ用レイヤー
   セクションは .page-sec、ブロックは .blks を並べるだけ。番号は振らない。
   -------------------------------------------------------------------------- */
.page-sec {
  padding-top: 70px;
  margin-bottom: 200px;
}  /* n=31 */
.page-sec .blks {
  margin-bottom: 90px;
}  /* n=54 */
.page-sec .blks:first-child {
  margin-bottom: 70px;
}  /* n=20 */
.page-sec .blks .heading {
  margin-bottom: 13px;
}  /* n=63 */
.page-sec .blks .heading-2 {
  margin-bottom: 13px;
}  /* n=12 */
.page-sec .blks .txt {
  margin-bottom: 50px;
}  /* n=15 */
.page-sec .blks .group + .group {
  margin-top: 60px;
}  /* n=10 */

@media screen and (max-width: 767px) {
  .page-sec {
    padding-top: 56px;
    margin-bottom: 110px;
  }  /* n=25 */
  .page-sec .blks {
    margin-bottom: 72px;
  }  /* n=54 */
  .page-sec .blks:first-child {
    margin-bottom: 56px;
  }  /* n=18 */
  .page-sec .blks .heading {
    margin-bottom: 10px;
  }  /* n=60 */
  .page-sec .blks .heading-2 {
    margin-bottom: 10px;
  }  /* n=12 */
  .page-sec .blks .txt {
    margin-bottom: 48px;
  }  /* n=8 */
  .page-sec .blks .group + .group {
    margin-top: 48px;
  }  /* n=10 */
}

/* 内側の .page-sec__inner には何も指定しない。
   幅は module.css の m-inner-1 が持つので、必ず併記すること。
     <div class="page-sec__inner m-inner-1"> */

/* 末尾ブロックと入れ子の打ち消し */
.page-sec .blks:last-child {
  margin-bottom: 0;
}
.page-sec .blks .blks {
  margin-bottom: 0;
}

/* 最後のセクション。:last-of-type はクラスなし <section> が混在していて当たらない */
.page-sec--last {
  margin-bottom: 0;
}

/* 背景色付きセクション。既存の共通パーツと同じ #EFF7FF */
.page-sec--bg {
  background: #EFF7FF;
  padding-top: 70px;
  padding-bottom: 70px;
  margin-bottom: 200px;
}

@media screen and (max-width: 767px) {
  .page-sec--bg {
    padding-top: 56px;
    padding-bottom: 56px;
    margin-bottom: 110px;
  }
}

/* --------------------------------------------------------------------------
   2. 既存ページについて

   既存ページ（.blks-1 .blks-2 … を使っているページ）向けの互換レイヤーは
   意図的に置いていない。共通値をここから当てると、移行前は指定が無くて
   0 だった要素にまで余白が付いてしまい、見た目が変わるため。

   既存ページの余白は各セクションCSSがそのまま持っている。
   ページを .blks 表記に書き換えたときに、そのページの個別指定を削れば
   上の共通レイヤーが引き継ぐ。1ページずつ移せる。
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   3. .page-sec デフォルト余白の打ち消し
   移行前にセクション自身の余白を持っていなかったスコープ。
   -------------------------------------------------------------------------- */
.page-sec--about-cmn-1,
.page-sec--department-cmn-1,
.page-sec--hosp-cmn-1 {
  margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   メモ
   - 余白ユーティリティ（.mt-30 等）はここに置いていない。既存の各CSSに
     残っている。新規ページでは .blks で区切る方を先に検討すること。
   - ブレークポイントは 767px に統一。既存には 767 / 768 の混在がある。
   - :where() は Chrome 88 / Safari 14 / Firefox 78 以降で動作する。
   -------------------------------------------------------------------------- */