/* 原本（Geeklog）のパーツで、SWELLには無いものを再現するCSS
   ------------------------------------------------------------
   2026-08-04 依頼者のHTMLチェックを受けて追加。

   ▼囲み（kakomi_*）
     旧サイトの layout/papalagi/css_custom/papalagi.css にあった指定をそのまま持ってくる。
     「名前＋経歴」などをひとまとめに見せるための、背景色つきの箱。
     ※旧サイトには common.css にも .kakomi_gray があるが、
       あとから読み込まれる papalagi.css の指定（灰色の背景）が実際には効いていたので
       そちらに合わせている。
*/
.kakomi_gray {
  background: #EDEDED;
  padding: 10px;
  margin: 5px 0;
}

.kakomi_blue {
  background: #F0F5FD;
  padding: 10px;
  margin: 5px 0;
}

.kakomi_yellow {
  background-color: #FFFEEE;
  padding: 10px;
  margin: 5px 0;
}

.kakomi_orange {
  background-color: #fff5ee;
  border: 1px dotted #FFCC66;
  padding: 10px;
  margin: 5px 0;
}

.kakomi {
  border: 1px solid #888;
  padding: 5px;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5px;
}

/* 囲みの中の段落は、箱の余白があるので上下の余白を詰める */
.kakomi_gray > p:first-child,
.kakomi_blue > p:first-child,
.kakomi_yellow > p:first-child,
.kakomi_orange > p:first-child { margin-top: 0; }
.kakomi_gray > p:last-child,
.kakomi_blue > p:last-child,
.kakomi_yellow > p:last-child,
.kakomi_orange > p:last-child { margin-bottom: 0; }

/* ▼並んでいる写真の大きさをそろえる
     （2026-08-04 依頼者指摘「2人の画像サイズが同じならいい」）

     元の写真の大きさが違うと、画面幅によって片方だけ大きくなってしまう。
     （例：EFRページ … 松本さん640px／武本さん172px。パソコン幅では両方172pxで
       そろうのに、スマホ幅では松本さんだけ画面いっぱいに広がっていた）

     ★小さいほうに合わせて上限を決める。引き伸ばさないので粗くならず、
       どの画面幅でも同じ大きさで並ぶ。 */
.pg-img-pair figure,
figure.pg-img-pair {
  max-width: var(--pg-img-pair-w, 172px);
  margin-left: auto;
  margin-right: auto;
}

/* ▼中央寄せの表は、表そのものも中央に置く
     （2026-08-04 依頼者指摘「合わない器材を使うと〜の次のテーブル自体も中央揃えに」）
     原本は表を <center> で囲んでおり、旧サイトでは表の箱ごと中央にあった。
     文字だけ中央になって箱が左に寄ったままだと、指摘のとおり中途半端に見える。 */
table.has-text-align-center {
  margin-left: auto;
  margin-right: auto;
}

/* ▼ページ内ジャンプの飛び先が、上に固定されたヘッダーの下に隠れないようにする
     （2026-08-05 依頼者指摘「ボタンの遷移先が現行のページと違うところがある」の対応で、
       「お問い合わせ・資料請求」ボタンをページ内ジャンプに戻したときに追加）

     ヘッダーは画面上部に貼りついたまま（高さ70px）なので、
     そのままジャンプすると見出しがヘッダーの裏に潜り込んでしまう。
     ジャンプ先の少し上で止まるように余白を持たせる。 */
#form,
#access,
#voice,
#tel,
#staff,
#root_01,
#root_02,
#menu1,
#menu2 {
  scroll-margin-top: 90px;
}
