/* トップページの見出し「未来を生きる力を育む」を、画面の幅に応じて
   なめらかに大きさが変わるようにする（2026-11-14）。

   これまでは画面の幅に関わらず文字の大きさが固定（2.3rem）だったため、
   画面の大きい（幅の広い）パソコンで見ると、文字が相対的に小さく見えていた。
   480px（スマホ）〜1920px（大きいパソコン）の間をなめらかに繋ぎ、
   480px以下は今までと同じ大きさ、1920px以上は今までよりひとまわり大きくする。

   style.css 自体（191行目・圧縮済み）は触らない決まりのため、
   このファイルを style.css の後に読み込んで上書きする。 */

#background .mainvisuText .titleMain .mainvisualMain {
  font-size: clamp(2.3rem, calc(1.567rem + 2.444vw), 4.5rem);
  letter-spacing: clamp(0.2rem, calc(0.1rem + 0.333vw), 0.5rem);
}
#background .mainvisuText .titleMain .sub {
  font-size: clamp(1.3rem, calc(0.9rem + 1.333vw), 2.5rem);
}

/* メニューを開いている間だけ、見出しを元の大きさに戻す。
   広げた見出しのままだと、開いたメニューの文字と重なってしまうため
   （#wrap に menu_on が付く。詳しくは menu-mid-width-fix.css 参照）。 */
#wrap.menu_on #background .mainvisuText .titleMain .mainvisualMain {
  font-size: 2.3rem;
  letter-spacing: 0.5rem;
}
#wrap.menu_on #background .mainvisuText .titleMain .sub {
  font-size: 1.3rem;
}
