@charset "UTF-8";
/* ウィンターパス2026 首都圏発着エリア */
/* https://www.driveplaza.com/etc/drawari/2026_winter_pass/shutoken.html */

/* ▼モバイルファースト (全環境に共通のデザイン) */
/* 首都圏発着 目的地エリア選択マップ */
.l-container .areaSelectMap_shutoken {
	position: relative;
	width: 100%;
	height: auto;
	background: url("../../../../../assets/img/etc/drawari/2026_winter_pass/bg_map_shutoken.png");
	background-size: 100%;
	background-repeat: no-repeat;
  margin: 0 auto;
}
.l-container .areaSelectMap_shutoken::before {
	display: block;
	content: "";
  padding-top: 121.4285%;
}
.l-container .areaSelectMap_shutoken [class^="arrival_"],
.l-container .areaSelectMap_shutoken [class*=" arrival_"] { display: block; position: absolute; width: 21%; transition: 0.3s; }
.l-container .areaSelectMap_shutoken .arrival_01 { top:  3%; left: 69%; } /* 蔵王 */
.l-container .areaSelectMap_shutoken .arrival_02 { top: 24%; left: 58%; } /* 猪苗代・磐梯 */
.l-container .areaSelectMap_shutoken .arrival_03 { top: 45%; left: 56.5%; } /* 那須・塩原 */
.l-container .areaSelectMap_shutoken .arrival_04 { top: 49%; left: 25%; } /* 湯沢・沼田・水上 */
.l-container .areaSelectMap_shutoken .arrival_05 { top: 50%; left: 3.5%; } /* 白馬・志賀・妙高 */
.l-container .areaSelectMap_shutoken .arrival_06 { bottom: 16.75%; left: 12%; } /* 菅平・軽井沢 */
.l-container .areaSelectMap_shutoken .arrival_01:hover, .l-container .areaSelectMap_shutoken .arrival_01:active, 
.l-container .areaSelectMap_shutoken .arrival_02:hover, .l-container .areaSelectMap_shutoken .arrival_02:active,
.l-container .areaSelectMap_shutoken .arrival_03:hover, .l-container .areaSelectMap_shutoken .arrival_03:active,
.l-container .areaSelectMap_shutoken .arrival_04:hover, .l-container .areaSelectMap_shutoken .arrival_04:active,
.l-container .areaSelectMap_shutoken .arrival_05:hover, .l-container .areaSelectMap_shutoken .arrival_05:active,
.l-container .areaSelectMap_shutoken .arrival_06:hover, .l-container .areaSelectMap_shutoken .arrival_06:active { opacity: 1.0; transform: scale(1.1); }
.l-container .areaSelectMap_shutoken .departure {
  display: block;
  position: absolute;
  width: 40%;
  transition: 0.3s;
  bottom: 2%;
  left: 48%;
}
.l-container .areaSelectMap_shutoken img.grayscale { filter: grayscale(100%) contrast(50%) brightness(135%); }

/* ▼タブレット～PC用として付け足すデザイン */
@media only screen and (min-width: 641px) {
    /* 首都圏発着 目的地エリア選択マップ */
    .l-container .areaSelectMap_shutoken {
      width: 80%;
    }
}