@charset "utf-8";


/* MAP
------------------------------------------------------*/

/* MAP BODY PARTS */
.map__main-bg {
	fill: #deeabe;
}

.map__main-outline {
	fill: #ccd9a9;
}
.map__main-bg.is-active,
.map__main-outline.is-active {
	fill: #90ab48;
}
.map__out-bg {
	fill: #f4f4f4;
}
.map__city {
	display: none;
	isolation: isolate;
}
.map__city-circle {
	fill: #b1c185;
}
.map__selectarea .map__city-circle{
	fill: #b1c185;
}
.map__selectarea.is-active .map__city-circle,
.map__selectarea.is-active .map__bt-line{
	fill: #b39050;
}

.map__city-txt {
	fill: none;
	stroke: #fff;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 3px;
}
.map__city-txt--color {
	fill: #323743;
}
.map__bt-line {
	fill: #c0ce95;
}
.map__wave {
	fill: #fff;
}

/* MAP  */
.mapsearch {
	margin-top: 8px
}
.mapsearch__hd {
	margin: 0 -15px
}
.mapsearch__hd:not(.-noslide) {
	overflow-y: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}
.mapsearch__hd::-webkit-scrollbar {
	height: 8px
}
.mapsearch__hd::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 10px
}
.mapsearch__hd::-webkit-scrollbar-thumb {
	background: #888;
	border-radius: 10px
}
.mapsearch__hd::-webkit-scrollbar-thumb:hover {
	background: #555
}
.mapsearch__hd-block {
	position: relative;
	background: #f5f5f5
}
.mapsearch__hd-bt{
	position: absolute;
	transform: translate(-50%, -50%);
	
}
.mapsearch__hd-txt{
	position: relative;
	display: block;
    padding: 6px 2.0rem 6px 8px;
    line-height: 1;
    color: #b39050;
    font-size: 1.2rem;
    font-weight: bold;
    border-radius: 50vw;
    background: #fff;
    box-shadow: 2px 2px 0px 0px rgba(140, 180, 242, 0.4);
    white-space: nowrap;
    transition: background .2s ease-out;		
}
.mapsearch__hd-bt.is-active .mapsearch__hd-txt {
	color: #fff;
	background: #b39050;
}
.mapsearch__hd-txt .m-ico{
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	font-size: 2.0rem;
	line-height: 1;
}

.mapsearch__hd-spot {
	position: absolute;
	font-weight: 700
}

.mapsearch__hd-block {
	width: 100%
}
.mapsearch__hd-img {
	width: 100%;
	background: #c4e5fd;
}
.mapsearch .cassette{
	margin-top: 8px;
}


.mapsearch__hd-bt:first-child {
	left: 63%;
	top: 10%;
}
.mapsearch__hd-bt:nth-child(2) {
	left: 45%;
	top: 23%;
}
.mapsearch__hd-bt:nth-child(3) {
	left: 90%;
	top: 60%;
}
.mapsearch__hd-bt:nth-child(4) {
	left: 27%;
	top: 47%;
}
.mapsearch__hd-bt:nth-child(5) {
	left: 68%;
	top: 77%;
}
.mapsearch__hd-bt:nth-child(6) {
	left: 45%;
	top: 93%;
}
.mapsearch__hd-bt:nth-child(7) {
	left: 49%;
	top: 81%;
}
.mapsearch__hd-bt:nth-child(8) {
	left: 37%;
	bottom: 56%;
}


.guidemap__spotlist-item {
	position: absolute;
	display: inline-flex;
	align-items: flex-start;
	flex-wrap: wrap;
	transform: translateX(-50%);
	color: #323743;
	line-height: 1.3;
	font-size: 1.2rem;
	font-weight: 500;
	text-shadow: 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%), 0 0 2px rgb(255 255 255 / 80%);
}
.guidemap__spotlist-item:first-child {
	left: 77%;
	top: 24%;
}
.guidemap__spotlist-item:nth-child(2) {
	left: 54%;
	top: 37%;
}
.guidemap__spotlist-item:nth-child(3) {
	left: 69%;
	top: 48%;
}
.guidemap__spotlist-item:nth-child(4) {
	right: 58%;
	top: 67%;
}
.guidemap__spotlist-item:nth-child(5) {
	left: 46%;
	bottom: 28.5%;
}
.guidemap__spotlist-item:nth-child(6) {
	left: 35%;
	top: 78.5%;
}


@media print, screen and (min-width:960px) {
	.mapsearch {
		display: flex;
		align-items: flex-start;
		margin-top: 16px
	}
	.mapsearch__hd {
		flex: 1;
		margin: 0
	}
	
	.mapsearch__hd-bt:not(.is-active):hover .mapsearch__hd-txt{
		background: #f3eee5;
		
	}
	.mapsearch__hd-txt{
		display: block;
		padding: 16px calc(3.5rem + 8px) 16px 24px;
		font-size: 100%;
		letter-spacing: .1em;
	}
	
	
	.mapsearch__hd-pin {
		font-size: 3.5rem
	}
	.mapsearch__hd-block {
		width: 100%
	}
	.mapsearch__hd-txt .m-ico{
		font-size: 3.0rem;
		line-height: 1;
	}
	
	.mapsearch__hd-spot {
		font-size: 1.8rem
	}
	.mapsearch .cassette {
		margin: 0;
		width: 440px
	}
	.mapsearch .cassette .cassette__item {
		margin-top: 0;
		padding: 0 4px;
		min-height: 640px;
	}
	.mapsearch .cassette__link {
		border-radius: 0
	}
	.mapsearch .cassette .slider-controls.-bottom {
		
	}
}

/* MODEL COURSE
------------------------------------------------------*/
.modelcourse__comingsoon{
	text-align: center;
	font-size: 1.6rem;
	font-weight: bold;
}
.modelcourse__txt{
	text-align: center;
}

@media print, screen and (min-width:960px) {
	.modelcourse__comingsoon{
		font-size: 2.2rem;
	}
	.modelcourse__txt{
		font-size: 1.8rem;
	}
}
