@charset "utf-8";

/***************************************************
  footer-map-responsive.css

  目的：footer内の地図（.area-map / #map-canvas）を
  固定pxの高さ指定（common.cssのheight:400px、
  768px以下でheight:235px）から、aspect-ratioベースの
  指定に置き換え、画面幅に応じて高さが滑らかにスケール
  するようにする。

  common_stylesheetテンプレートで common.css の
  <link> より「後」に読み込むことで、同じセレクタ
  （.area-map）・同じ詳細度のため、後勝ちでこちらが
  common.cssのheight指定を上書きする。

  作成日：2026-08-29
***************************************************/
.area-map {
	height: auto;
	aspect-ratio: 21 / 9;
	min-height: 200px;   /* スマホ等の極端に狭い画面でも地図が潰れすぎないための下限 */
	max-height: 420px;   /* 超ワイドディスプレイ等で縦に伸びすぎないための上限 */
}