/* -------------------------------------------------------------------------
 * gmap_shim.css
 * Leaflet 地図をこのサイトの既存 CSS と共存させるための調整。
 * ------------------------------------------------------------------------- */

/* 既存サイトの img 系ルールがタイル画像に効いてしまうのを防ぐ。 */
.leaflet-container img {
	max-width: none !important;
	max-height: none !important;
	border: none !important;
	vertical-align: baseline;
	background: none;
}

/* 既存サイトの box-sizing 指定に左右されないようにする。 */
.leaflet-container,
.leaflet-container * {
	-webkit-box-sizing: content-box;
	   -moz-box-sizing: content-box;
	        box-sizing: content-box;
}

/* Leaflet は内部で z-index 200〜1000 を使う。そのままだとタイルやコントロールが
 * ページ側のポップアップ（グラフのオーバーレイ、ナビのドロップダウン等）より
 * 前面に出てしまい、「地図が上に重なって見える」状態になる。
 * 地図コンテナ自身に z-index を与えて独立した重なり文脈を作り、
 * 内部の z-index がコンテナの外へ影響しないようにする。 */
.leaflet-container {
	font-family: inherit;
	background: #f2f2f2;
	position: relative;
	z-index: 0;
}

/* 出典表示（地理院タイル・OpenStreetMap）。小さめに表示する。 */
.leaflet-container .leaflet-control-attribution {
	font-size: 10px;
	line-height: 14px;
	background: rgba( 255, 255, 255, 0.75);
}

.leaflet-container .leaflet-control-attribution a {
	color: #0645ad;
	text-decoration: none;
}

/* 情報吹き出し（InfoBubble）用のオーバーレイ・ペイン。
 * 地図のドラッグを妨げないよう、既定ではマウス操作を透過させる。 */
.gmap_shim_overlay_root {
	overflow: hidden;
}

/* 情報吹き出しのマウス操作の可否は js/gmap_shim.js が
 * map_settings.js の info_window_clickable を見てインラインで指定します
 * （pointer-events は子要素に継承されます）。 */

/* Leaflet は z-index 200〜1000 を使うため、そのままだとグローバルナビの
 * ドロップダウン（観測データ）が地図の下に潜って途中で切れて見える。
 * ナビを地図より前面に出す。（position: relative は見た目を変えません） */
#main_menu {
	position: relative;
	z-index: 1100;
}

#main_menu .items {
	z-index: 1100;
}

/* 観測点マーカーの画像に既存の装飾が付かないようにする。 */
img.gmap_shim_marker_icon {
	max-width: none !important;
	border: none !important;
	background: none !important;
}