@charset "UTF-8";

/*
■全日本の画像
アウトライン化したsvgを使用
（県境の線（*_pass）は、線ではなく面になっている。線にすると太すぎるため
■拡大画像
県境が、線の画像を使用。
（面だと細くできないので。
202501 ooka
*/

:root {/* 1400px基準 */
	--px2: min(0.14vw,2px);
	--px3: min(0.21vw,3px);
	--px4: min(0.29vw,4px);
	--px5: min(0.36vw,5px);
	--px6: min(0.43vw,6px);
	--px7: min(0.5vw,7px);
	--px8: min(0.57vw,8px);
	--px9: min(0.64vw,9px);

	--px10: min(0.71vw,10px);
	--px11: min(0.79vw,11px);
	--px12: min(0.86vw,12px);
	--px13: min(0.93vw,13px);
	--px14: min(1vw,14px);
	--px15: min(1.07vw,15px);
	--px16: min(1.14vw,16px);
	--px17: min(1.21vw,17px);
	--px18: min(1.29vw,18px);
	--px19: min(1.36vw,19px);

	--px20: min(1.43vw,20px);
	--px21: min(1.5vw,21px);
	--px22: min(1.57vw,22px);
	--px23: min(1.64vw,23px);
	--px24: min(1.71vw,24px);
	--px25: min(1.79vw,25px);
	--px26: min(1.86vw,26px);
	--px27: min(1.93vw,27px);
	--px28: min(2vw,28px);
	--px29: min(2.07vw,29px);

	--px30: min(2.14vw,30px);
	--px31: min(2.21vw,31px);
	--px32: min(2.29vw,32px);
	--px33: min(2.36vw,33px);
	--px34: min(2.43vw,34px);
	--px35: min(2.5vw,35px);
	--px36: min(2.57vw,36px);
	--px37: min(2.64vw,37px);
	--px38: min(2.71vw,38px);
	--px39: min(2.79vw,39px);

	--px40: min(2.86vw,40px);
	--px41: min(2.93vw,41px);
	--px42: min(3vw,42px);
	--px43: min(3.07vw,43px);
	--px44: min(3.14vw,44px);
	--px45: min(3.21vw,45px);
	--px46: min(3.29vw,46px);
	--px47: min(3.36vw,47px);
	--px48: min(3.43vw,48px);
	--px49: min(3.5vw,49px);
	--px50: min(3.57vw,50px);
}/* ---root */

.forPc{display:block;}
.forSp{display:none;}

	@media screen and (max-width:768px) {
		.forPc{display:none;}
		.forSp{display:block;}
	}/* --- max-width:768px */

.ffNoto{font-family: "Noto Sans JP",sans-serif;}

#mapAll svg{
	width: 100%;
	height: 100%;
}

#mapPref span{
	width: min(42.71vw,598px);
	height: min(49.07vw,687px);
}

#mapPref svg{
	width: 100%;
	height: 100%;
}

.high{fill: #E94D31 !important;transition: all 0.5s 0s ease;}
/* .high.is_selected{fill: #FADBD5 !important;} */

.middle{fill: #EFAAA8 !important;transition: all 0.5s 0s ease;}
/* .middle.is_selected{fill: #FBEEED !important;} */

.low{fill: #F2DADA !important;transition: all 0.5s 0s ease;}
/* .low.is_selected{fill: #FAF4F4 !important;} */

.wrapper{min-width: 0;}

	@media screen and (max-width:768px){
		.wrapper header{
			min-width: 100%;
		}
	}/* --- max-width:768px */

main{
	background: #3a3a3a;
	padding-top: 55px;
}

main img{width: 100%;}

.block{
	position: relative;
}

.block > .secInner{
	/* width: min(100%, 1400px); */
	width: 100%;
	margin: auto;
}

	@media screen and (max-width:768px){

	main{
		padding-top: 41px;
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ mvBlock */

.mvBlock{
	text-align: center;
}

.mvBlock > .secInner{
	padding: min(7.14vw,100px) var(--px20);
	background: #000 url(/images/special/synchroweather/review/bg_mvblock.svg) no-repeat left -0.5vw top;
	background-size: 100% auto;
}

.mvBlock .cap span{
	display: inline-block;
	width: min(14.29vw,200px);
}

.mvBlock .ttlPage{
	margin-top: min(4.14vw,58px);
	position: relative;
	z-index: 20;
}

#screen{
	content: "";
	position: fixed;
	display: block;
	background: #000;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-size: contain !important;
}

.mvBlock .ttlPage .ttl{
	display: inline-block;
	width: min(61.71vw,864px);
	position: relative;
}

.mvBlock .ttlPage .tyre{
	position: absolute;
	display: inline-block;
	width: min(7.14vw,100px);
	top: 0;
	right: 13.1%;
}

.is_loading .ttlPage .tyre{
	animation: tyre 3s;
	animation-fill-mode: forwards;
	animation-iteration-count: infinite;
	animation-timing-function: cubic-bezier(.15,.41,.69,.94);
}

.is_loading .wrapper{
	display: block !important;
}

.is_loading header,
.is_loading .mapBlock,
.is_loading .bgOuter,
.is_loading footer{
	display: none;
}

@keyframes tyre {
	0% { rotate: 0;}
	20% { rotate: 0;}
	50% { rotate: 375deg;}
	100% { rotate: 360deg;}
}

.mvBlock .txtSub{
	margin-top: var(--px35);
}

.mvBlock .txtSub span{
	display: inline-block;
	background: #fff;
	font-size: var(--px16);
	padding: var(--px10) var(--px30);
}

.mvBlock .img{
	margin-top: var(--px25);
}

.mvBlock .img span{
	display: inline-block;
	width: min(8.43vw,118px);
}

	@media screen and (max-width:768px){

	.mvBlock > .secInner{
		padding: 31vw 6.6vw 24.26vw;
		background: #000 url(/images/special/synchroweather/review/sp/bg_mvblock.svg) no-repeat left;
		background-size: 92vw auto;
	}

	.mvBlock .cap span{
		width: 34.66vw;
	}

	.mvBlock .ttlPage{
		margin-top: 9.07vw;
	}

	.mvBlock .ttlPage .ttl{
		width: 100%;
	}

	.mvBlock .ttlPage .tyre{
		width: 25.6%;
		top: auto;
		bottom: 0;
		right: 29%;
	}

	.mvBlock .txtSub{
		margin-top: 7.69vw;
	}

	.mvBlock .txtSub span{
		font-size: 3.2vw;
		padding: 2.66vw 3.2vw;
	}

	.mvBlock .img{
		margin-top: 8.72vw;
	}

	.mvBlock .img span{
		width: 21.33vw;
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ mapBlock */

.mapBlock{
	background: #F5F5F5;
}

.mapBlock > .secInner{
	position: relative;
	background: #F5F5F5;
	width: min(100%, 1400px);
}

/* ############################### mapArea */

#mapArea{
	position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
	overflow: hidden;
	min-height: min(62.86vw,880px);
}

#mapArea .cap{
	text-align: center;
	font-size: var(--px18);
}

#mapArea .caution{
	width: min(72.14vw,1010px);
	text-align: right;
	font-size: var(--px14);
}

#mapArea .zone{
	transition: all 0.3s ease;
}

	@media screen and (max-width:768px){

	#mapArea{
		min-height: 198.67vw;
	}

	#mapArea .cap{
		font-size: 4.27vw;
	}

	#mapArea .caution{
		width: 100%;
		text-align: center;
		font-size: 3.73vw;
	}

	}/* --- max-width:768px */

/* ===================== mapSpot */

.mapBlock #mapSpot{
	width: min(59.79vw,837px);
	margin: min(6.29vw,88px) auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
	position: relative;
}

.mapBlock #mapSpot .map{
	width: min(35.36vw,495px);
}

.mapBlock #mapSpot .bttn{
	display: inline-block;
	position: absolute;
}

.mapBlock #mapSpot .bttn a{
  display: flex;
  align-items: center;
  justify-content: space-between;
	gap: var(--px10);
	cursor: pointer;
}
.mapBlock #mapSpot .bttn a:hover{opacity: 0.8;}

.mapBlock #mapSpot .bttn .txt{
	display: inline-block;
	font-weight: bold;
	font-size: var(--px16);
}

.mapBlock #mapSpot .bttn .icon{
	position: relative;
	display: inline-block;
	width: var(--px20);
	height: var(--px20);
	background: #fff;
	border: 1px solid #000;
}

.mapBlock #mapSpot .bttn .icon:before{
	content: "";
	position: absolute;
	display: none;
	background: url(/images/special/synchroweather/review/icon_minus.svg) no-repeat center;
	top: calc(50% - 1px);
	left: calc(50% - var(--px4));
	width: var(--px8);
	height: var(--px2);
	background-size: contain !important;
}

.mapBlock #mapSpot .bttn .icon:after{
	content: "";
	position: absolute;
	display: block;
	background: url(/images/special/synchroweather/review/icon_plus.svg) no-repeat center;
	top: calc(50% - var(--px4));
	left: calc(50% - var(--px4));
	width: var(--px8);
	height: var(--px8);
	background-size: contain !important;
}

	@media screen and (max-width:768px){

	.mapBlock #mapSpot{
		width: 89.33vw;
		margin: 11.73vw auto 0;
	}

	.mapBlock #mapSpot .map{
		width: 100%;
		margin-left: 0;
		padding-bottom: 20vw;
	}

	.mapBlock #mapSpot .bttn a{
		gap: 2.13vw;
	}

	.mapBlock #mapSpot .bttn .txt{
		font-size: 4.27vw;
	}

	.mapBlock #mapSpot .bttn .icon{
		width: 4.27vw;
		height: 4.27vw;
	}

	.mapBlock #mapSpot .bttn .icon:before{
		width: 2vw;
		height: 2vw;
		top: calc(50% - 1vw);
		left: calc(50% - 1vw);
	}

	.mapBlock #mapSpot .bttn .icon:after{
		width: 2vw;
		height: 2vw;
		top: calc(50% - 1vw);
		left: calc(50% - 1vw);
	}

	}/* --- max-width:768px */

/* 地図上、地方ボタンの位置 */
.mapBlock #mapSpot .bttn.hokkaido{top: min(4.14vw,58px);left: min(29.93vw,419px);}
.mapBlock #mapSpot .bttn.chubu{top: min(18.71vw,262px);left: min(26.43vw,370px);}
.mapBlock #mapSpot .bttn.chugoku{top: min(24.43vw,342px);left: min(15vw,210px);}
.mapBlock #mapSpot .bttn.kyushu{top: min(36.86vw,516px);left: min(4.71vw,66px);}
.mapBlock #mapSpot .bttn.tohoku{top: min(15.64vw,219px);left: min(41.79vw,585px);}
.mapBlock #mapSpot .bttn.kanto{top: min(23.14vw,324px);left: min(39.43vw,552px);}
.mapBlock #mapSpot .bttn.kinki{top: min(33vw,462px);left: min(27.71vw,388px);}
.mapBlock #mapSpot .bttn.shikoku{top: min(35.14vw,492px);left: min(20.29vw,284px);}

	@media screen and (max-width:768px){

	.mapBlock #mapSpot .bttn.hokkaido{top: 9.6vw;left: 38.13vw;}
	.mapBlock #mapSpot .bttn.chubu{top: 39.47vw;left: 32.27vw;}
	.mapBlock #mapSpot .bttn.chugoku{top: 60.8vw;left: 2.67vw;}
	.mapBlock #mapSpot .bttn.kyushu{top: 105.87vw;left: 2.67vw;}
	.mapBlock #mapSpot .bttn.tohoku{top: 42.67vw;left: 72vw;}
	.mapBlock #mapSpot .bttn.kanto{top: 69.33vw;left: 68vw;}
	.mapBlock #mapSpot .bttn.kinki{top: 82.67vw;left: 49.07vw;}
	.mapBlock #mapSpot .bttn.shikoku{top: 90.13vw;left: 25.33vw;}

	.mapBlock #mapSpot .bttn.kyushu a{flex-direction:row-reverse;}
	.mapBlock #mapSpot .bttn.kinki a{flex-direction:row-reverse;}

	}/* --- max-width:768px */

/* map上の地方ボタンクリック時のblockの色変え */
#mapArea.is_opened.tgt_hokkaido g:not(.block_hokkaido){filter: grayscale(1);}
#mapArea.is_opened.tgt_chubu g:not(.block_chubu){filter: grayscale(1);}
#mapArea.is_opened.tgt_chugoku g:not(.block_chugoku){filter: grayscale(1);}
#mapArea.is_opened.tgt_kyushu g:not(.block_kyushu){filter: grayscale(1);}
#mapArea.is_opened.tgt_tohoku g:not(.block_tohoku){filter: grayscale(1);}
#mapArea.is_opened.tgt_kanto g:not(.block_kanto){filter: grayscale(1);}
#mapArea.is_opened.tgt_kinki g:not(.block_kinki){filter: grayscale(1);}
#mapArea.is_opened.tgt_shikoku g:not(.block_shikoku){filter: grayscale(1);}
/* com画面の拡大画像の県の色変え */
#mapArea.tgt_hokkaido .comZone g:not(.hokkaido) > *{fill: #C1C1C1}
#mapArea.tgt_aomori .comZone g:not(.aomori) > *{fill: #C1C1C1}
#mapArea.tgt_iwate .comZone g:not(.iwate) > *{fill: #C1C1C1}
#mapArea.tgt_miyagi .comZone g:not(.miyagi) > *{fill: #C1C1C1}
#mapArea.tgt_akita .comZone g:not(.akita) > *{fill: #C1C1C1}
#mapArea.tgt_yamagata .comZone g:not(.yamagata) > *{fill: #C1C1C1}
#mapArea.tgt_fukushima .comZone g:not(.fukushima) > *{fill: #C1C1C1}
#mapArea.tgt_ibaraki .comZone g:not(.ibaraki) > *{fill: #C1C1C1}
#mapArea.tgt_tochigi .comZone g:not(.tochigi) > *{fill: #C1C1C1}
#mapArea.tgt_gumma .comZone g:not(.gumma) > *{fill: #C1C1C1}
#mapArea.tgt_saitama .comZone g:not(.saitama) > *{fill: #C1C1C1}
#mapArea.tgt_chiba .comZone g:not(.chiba) > *{fill: #C1C1C1}
#mapArea.tgt_tokyo .comZone g:not(.tokyo) > *{fill: #C1C1C1}
#mapArea.tgt_kanagawa .comZone g:not(.kanagawa) > *{fill: #C1C1C1}
#mapArea.tgt_niigata .comZone g:not(.niigata) > *{fill: #C1C1C1}
#mapArea.tgt_toyama .comZone g:not(.toyama) > *{fill: #C1C1C1}
#mapArea.tgt_ishikawa .comZone g:not(.ishikawa) > *{fill: #C1C1C1}
#mapArea.tgt_fukui .comZone g:not(.fukui) > *{fill: #C1C1C1}
#mapArea.tgt_yamanashi .comZone g:not(.yamanashi) > *{fill: #C1C1C1}
#mapArea.tgt_nagano .comZone g:not(.nagano) > *{fill: #C1C1C1}
#mapArea.tgt_gifu .comZone g:not(.gifu) > *{fill: #C1C1C1}
#mapArea.tgt_shizuoka .comZone g:not(.shizuoka) > *{fill: #C1C1C1}
#mapArea.tgt_aichi .comZone g:not(.aichi) > *{fill: #C1C1C1}
#mapArea.tgt_mie .comZone g:not(.mie) > *{fill: #C1C1C1}
#mapArea.tgt_shiga .comZone g:not(.shiga) > *{fill: #C1C1C1}
#mapArea.tgt_kyoto .comZone g:not(.kyoto) > *{fill: #C1C1C1}
#mapArea.tgt_osaka .comZone g:not(.osaka) > *{fill: #C1C1C1}
#mapArea.tgt_hyogo .comZone g:not(.hyogo) > *{fill: #C1C1C1}
#mapArea.tgt_nara .comZone g:not(.nara) > *{fill: #C1C1C1}
#mapArea.tgt_wakayama .comZone g:not(.wakayama) > *{fill: #C1C1C1}
#mapArea.tgt_tottori .comZone g:not(.tottori) > *{fill: #C1C1C1}
#mapArea.tgt_shimane .comZone g:not(.shimane) > *{fill: #C1C1C1}
#mapArea.tgt_okayama .comZone g:not(.okayama) > *{fill: #C1C1C1}
#mapArea.tgt_hiroshima .comZone g:not(.hiroshima) > *{fill: #C1C1C1}
#mapArea.tgt_yamaguchi .comZone g:not(.yamaguchi) > *{fill: #C1C1C1}
#mapArea.tgt_tokushima .comZone g:not(.tokushima) > *{fill: #C1C1C1}
#mapArea.tgt_kagawa .comZone g:not(.kagawa) > *{fill: #C1C1C1}
#mapArea.tgt_ehime .comZone g:not(.ehime) > *{fill: #C1C1C1}
#mapArea.tgt_kochi .comZone g:not(.kochi) > *{fill: #C1C1C1}
#mapArea.tgt_fukuoka .comZone g:not(.fukuoka) > *{fill: #C1C1C1}
#mapArea.tgt_saga .comZone g:not(.saga) > *{fill: #C1C1C1}
#mapArea.tgt_nagasaki .comZone g:not(.nagasaki) > *{fill: #C1C1C1}
#mapArea.tgt_kumamoto .comZone g:not(.kumamoto) > *{fill: #C1C1C1}
#mapArea.tgt_oita .comZone g:not(.oita) > *{fill: #C1C1C1}
#mapArea.tgt_miyazaki .comZone g:not(.miyazaki) > *{fill: #C1C1C1}
#mapArea.tgt_kagoshima .comZone g:not(.kagoshima) > *{fill: #C1C1C1}
#mapArea.tgt_okinawa .comZone g:not(.okinawa) > *{fill: #C1C1C1}
.comZone g.kugiri > *{fill: none !important;}

/* ===================== btnList */

	@media screen and (max-width:768px){
		#listIndexOnMap{display: none}
	}/* --- max-width:768px */

.btnList a{
  display: flex;
  align-items: center;
  justify-content: flex-start;
	background: #000;
	color: #fff;
	font-size: var(--px16);
	font-weight: bold;
	width: 100%;
	position: relative;
	cursor: pointer;
}
.btnList a:hover{background: #333;}

.btnList a:after{
	content: "";
	position: absolute;
	display: block;
	right: var(--px20);
	width: var(--px10);
	height: var(--px10);
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	rotate: -45deg;
	background-size: contain !important;
}

.btnList a.is_nocom{
	background: #5A5A5A;
	color: #000;
}

.btnList a.is_nocom:after{
	display: none;
}

/* --------------------- allZone */

.allZone{
	position: relative;
}

.allZone .btnList{
	position: absolute;
	width: min(14.29vw,200px);
	display: none;
}

.allZone .btnList > div{
  display: grid;
	grid-template-rows: 1fr;
	opacity: 1;
}
.allZone .btnList ul{overflow: hidden;}

.allZone .btnList li{
	border-bottom: 1px solid #5A5A5A;
}
.allZone .btnList li:last-child{border: none;}

.allZone .btnList a{
	padding-left: var(--px20);
	height: var(--px48);
}

/* 地図上ボタンの+-アイコン */
#mapArea.is_opened.tgt_hokkaido #mapSpot .bttn.hokkaido .icon:before{display: block;}
#mapArea.is_opened.tgt_hokkaido #mapSpot .bttn.hokkaido .icon:after{display: none;}
#mapArea.is_opened.tgt_chubu #mapSpot .bttn.chubu .icon:before{display: block;}
#mapArea.is_opened.tgt_chubu #mapSpot .bttn.chubu .icon:after{display: none;}
#mapArea.is_opened.tgt_chugoku #mapSpot .bttn.chugoku .icon:before{display: block;}
#mapArea.is_opened.tgt_chugoku #mapSpot .bttn.chugoku .icon:after{display: none;}
#mapArea.is_opened.tgt_kyushu #mapSpot .bttn.kyushu .icon:before{display: block;}
#mapArea.is_opened.tgt_kyushu #mapSpot .bttn.kyushu .icon:after{display: none;}
#mapArea.is_opened.tgt_tohoku #mapSpot .bttn.tohoku .icon:before{display: block;}
#mapArea.is_opened.tgt_tohoku #mapSpot .bttn.tohoku .icon:after{display: none;}
#mapArea.is_opened.tgt_kanto #mapSpot .bttn.kanto .icon:before{display: block;}
#mapArea.is_opened.tgt_kanto #mapSpot .bttn.kanto .icon:after{display: none;}
#mapArea.is_opened.tgt_kinki #mapSpot .bttn.kinki .icon:before{display: block;}
#mapArea.is_opened.tgt_kinki #mapSpot .bttn.kinki .icon:after{display: none;}
#mapArea.is_opened.tgt_shikoku #mapSpot .bttn.shikoku .icon:before{display: block;}
#mapArea.is_opened.tgt_shikoku #mapSpot .bttn.shikoku .icon:after{display: none;}
/* 地図上のbtnList（県）位置 */
#mapArea .allZone .btnList.hokkaido{top: var(--px43);left: min(13.57vw,190px);}
#mapArea .allZone .btnList.chubu{top: min(3.57vw,50px);left: min(10.71vw,150px);}
#mapArea .allZone .btnList.chugoku{top: min(17.86vw,250px);left: max(-0.71vw,-10px);}
#mapArea .allZone .btnList.kyushu{bottom: 0;left: min(17.86vw,250px);}
#mapArea .allZone .btnList.tohoku{top: min(7.14vw,100px);left: min(48.57vw,680px);}
#mapArea .allZone .btnList.kanto{top: min(14.29vw,200px);left: min(46.43vw,650px);}
#mapArea .allZone .btnList.kinki{bottom: 0;left: min(34.29vw,480px);}
#mapArea .allZone .btnList.shikoku{bottom: 0;left: min(27.14vw,380px);}

	@media screen and (max-width:768px){

	#mapArea .allZone .btnList{display: none;}

	}/* --- max-width:768px */

/* --------------------- spZone */

	@media screen and (max-width:768px){

	#mapArea.is_opened .spZone{
		right: 0;
		visibility: visible;
	}

	}/* --- max-width:768px */

#mapArea .spZone{
	position: absolute;
	background: #F5F5F5;
	top: 0;
	right: -100vw;
	width: 100%;
	height: 100%;
  display: flex;
	align-items: flex-start;
  justify-content: center;
  flex-wrap: wrap;
	padding:  21.33vw 5.33vw 0;
	visibility: hidden;
}

#mapArea .spZone .contSpot{
	width: 100%;
}

#mapArea .spZone .contSpot .txt{
	font-size: 4.27vw;
	text-align: center;
}

#mapArea .spZone .contSpot .btnDiv{
	border-top: 1px solid #D1D1D1;
	padding-top: 10.67vw;
	margin-top: 10.67vw;
}

#mapArea .spZone .contSpot .btnDiv .ttl{
	font-size: 6.4vw;
	font-weight: bold;
	text-align: center;
}

#mapArea .spZone .btnList ul{
	margin-top: 8.53vw;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 5.33vw;
}

#mapArea .spZone .btnList ul a{
	height: 14.93vw;
	font-size: 4.27vw;
	padding: 0 5.33vw;
}

#mapArea .spZone .btnList ul a:after{
	width: 3.2vw;
	height: 3.2vw;
	right: 5.33vw;
}

#mapArea .spZone .bttn{
	text-align: center;
	margin-top: 8vw;
}

/* sp画面のボタン表示 */
#mapArea .spZone .btnList{display: none;}
#mapArea.is_opened.tgt_hokkaido .spZone .btnList.hokkaido{display: block;}
#mapArea.is_opened.tgt_chubu .spZone .btnList.chubu{display: block;}
#mapArea.is_opened.tgt_chugoku .spZone .btnList.chugoku{display: block;}
#mapArea.is_opened.tgt_kyushu .spZone .btnList.kyushu{display: block;}
#mapArea.is_opened.tgt_tohoku .spZone .btnList.tohoku{display: block;}
#mapArea.is_opened.tgt_kanto .spZone .btnList.kanto{display: block;}
#mapArea.is_opened.tgt_kinki .spZone .btnList.kinki{display: block;}
#mapArea.is_opened.tgt_shikoku .spZone .btnList.shikoku{display: block;}

/* ===================== comZone */

#mapArea .comZone{
	position: absolute;
	background: #F5F5F5;
	width: 100%;
	height: 100%;
	right: -100vw;
	visibility: hidden;
}
#mapArea.is_selected_com .comZone{right: 0;visibility: visible;}

#mapArea .comZone .comInner{
	display: table;
	width: 100%;
	height: 100%;
}

	@media screen and (max-width:768px){

	#mapArea.is_selected_com{
		overflow-y: visible;
	}

	#mapArea .comZone .comInner{
		display: block;
	}

	}/* --- max-width:768px */

/* --------------------- mapSide */

#mapArea .comZone .mapSide{
	display: table-cell;
	vertical-align: top;
	padding-top: min(5.71vw,80px);
	padding-left: min(14.29vw,200px);
}

#mapArea .comZone .mapSide .ttl{
	font-size: var(--px32);
	font-weight: bold;
}

#mapArea .comZone .mapSide .txt{
	font-size: var(--px16);
	margin-top: var(--px20);
}




#mapArea .comZone .mapSide .map{
	overflow: hidden;
	width: min(42.86vw,600px);
	height: min(30.36vw,425px);
	margin-top: var(--px40);
	border: 1px solid #E5E5E5;
}

#mapArea .comZone .mapSide .bttn{
	margin-top: min(4.57vw,64px);
}

#mapArea .floatSpot .btnUnselect,
#mapArea .spZone .btnUnselect,
#mapArea .comZone .mapSide .btnUnselect{
	display: inline-block;
}

#mapArea .floatSpot .btnUnselect span,
#mapArea .spZone .btnUnselect span,
#mapArea .comZone .mapSide .btnUnselect span{
	width: min(20vw,280px);
	height: var(--px48);
	border: 2px solid #000;
  display: flex;
  align-items: center;
  justify-content: center;
	font-weight: bold;
	position: relative;
	cursor: pointer;
	font-size: var(--px16);
}

#mapArea .floatSpot .btnUnselect span:before,
#mapArea .spZone .btnUnselect span:before,
#mapArea .comZone .mapSide .btnUnselect span:before{
	content: "";
	position: absolute;
	display: block;
	left: var(--px16);
	width: var(--px12);
	height: var(--px12);
	border-left: 2px solid #000;
	border-bottom: 2px solid #000;
	rotate: 45deg;
	background-size: contain !important;
}

	@media screen and (max-width:768px){

	#mapArea .comZone .mapSide{
		display: flex;
  	align-items: flex-end;
  	flex-wrap: wrap;
		padding: 21.33vw 5.33vw 8.53vw;
		text-align: center;
	}

	#mapArea .comZone .mapSide .ttl{
		width: 100%;
		font-size: 6.4vw;
		margin-top: 10.67vw;
		padding-top: 10.67vw;
		border-top: 1px solid #5a5a5a;
		text-align: center;
	}

	#mapArea .comZone .mapSide .txt{
		width: 100%;
		font-size: 4.27vw;
		margin-top: 0;
		text-align: center;
	}

	#mapArea .comZone .mapSide .map{
		width: 89.33vw;
		height: 60vw;
		margin-top: 8vw;
	}

	#mapArea .comZone .mapSide .bttn{
		display: none;
	}

	#mapArea .floatSpot .btnUnselect,
	#mapArea .spZone .btnUnselect,
	#mapArea .comZone .mapSide .btnUnselect{
		display: inline-block;
	}

	#mapArea .floatSpot .btnUnselect span,
	#mapArea .spZone .btnUnselect span,
	#mapArea .comZone .mapSide .btnUnselect span{
	  display: flex;
	  align-items: center;
	  justify-content: center;
		width: 78.67vw;
		height: 14.93vw;
		font-size: 4.27vw;
	}

	#mapArea .floatSpot .btnUnselect span:before,
	#mapArea .spZone .btnUnselect span:before,
	#mapArea .comZone .mapSide .btnUnselect span:before{
		width: 5.33vw;
		height: 5.33vw;
		left: 6vw;
	}

	#mapArea .floatSpot{
		text-align: center;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
	}

	#mapArea .floatSpot .bttn{
	  display: flex;
	  align-items: center;
	  justify-content: center;
		width: 100%;
		height: 34vw;
		background: #fff;
	}

	}/* --- max-width:768px */

/* --------------------- comSide */

/* コメント画面の地図の位置 */
#mapArea .comZone .mapSide .map span{display: inline-block;width: 100%;height: auto;}
/* svgのviewportに対するpxで問題ない。 */
#mapArea.tgt_hokkaido .comZone svg .all{transform: scale(2) translate(-434px, 5px);}
#mapArea.tgt_aomori .comZone svg .all{transform: scale(6) translate(-488px, -229px);}
#mapArea.tgt_iwate .comZone svg .all{transform: scale(5) translate(-488px, -293px);}
#mapArea.tgt_miyagi .comZone svg .all{transform: scale(6) translate(-485px, -373px);}
#mapArea.tgt_akita .comZone svg .all{transform: scale(5) translate(-462px, -288px);}
#mapArea.tgt_yamagata .comZone svg .all{transform: scale(6) translate(-451px, -372px);}
#mapArea.tgt_fukushima .comZone svg .all{transform: scale(7) translate(-475px, -440px);}
#mapArea.tgt_ibaraki .comZone svg .all{transform: scale(7) translate(-475px, -495px);}
#mapArea.tgt_tochigi .comZone svg .all{transform: scale(8) translate(-459px, -485px);}
#mapArea.tgt_gumma .comZone svg .all{transform: scale(8) translate(-422px, -494px);}
#mapArea.tgt_saitama .comZone svg .all{transform: scale(12) translate(-452px,-535px);}
#mapArea.tgt_chiba .comZone svg .all{transform: scale(7) translate(-465px,-547px);}
#mapArea.tgt_tokyo .comZone svg .all{transform: scale(10) translate(-454px,-547px);}
#mapArea.tgt_kanagawa .comZone svg .all{transform: scale(9) translate(-443px,-561px);}
#mapArea.tgt_niigata .comZone svg .all{transform: scale(4) translate(-376px,-402px);}
#mapArea.tgt_toyama .comZone svg .all{transform: scale(8) translate(-339px,-489px);}
#mapArea.tgt_ishikawa .comZone svg .all{transform: scale(5) translate(-299px,-462px);}
#mapArea.tgt_fukui .comZone svg .all{transform: scale(7) translate(-273px,-530px);}
#mapArea.tgt_yamanashi .comZone svg .all{transform: scale(7) translate(-400px,-540px);}
#mapArea.tgt_nagano .comZone svg .all{transform: scale(4) translate(-333px,-483px);}
#mapArea.tgt_gifu .comZone svg .all{transform: scale(5) translate(-288px,-516px);}
#mapArea.tgt_shizuoka .comZone svg .all{transform: scale(8) translate(-390px,-575px);}
#mapArea.tgt_aichi .comZone svg .all{transform: scale(8) translate(-337px,-579px);}
#mapArea.tgt_mie .comZone svg .all{transform: scale(5) translate(-266px,-593px);}
#mapArea.tgt_shiga .comZone svg .all{transform: scale(8) translate(-280px,-567px);}
#mapArea.tgt_kyoto .comZone svg .all{transform: scale(7) translate(-248px,-563px);}
#mapArea.tgt_osaka .comZone svg .all{transform: scale(8) translate(-251px,-597px);}
#mapArea.tgt_hyogo .comZone svg .all{transform: scale(8) translate(-218px,-569px);}
#mapArea.tgt_nara .comZone svg .all{transform: scale(8) translate(-272px,-620px);}
#mapArea.tgt_wakayama .comZone svg .all{transform: scale(8) translate(-272px,-637px);}
#mapArea.tgt_tottori .comZone svg .all{transform: scale(8) translate(-174px,-556px);}
#mapArea.tgt_shimane .comZone svg .all{transform: scale(7) translate(-105px,-572px);}
#mapArea.tgt_okayama .comZone svg .all{transform: scale(7) translate(-162px,-572px);}
#mapArea.tgt_hiroshima .comZone svg .all{transform: scale(7) translate(-116px,-589px);}
#mapArea.tgt_yamaguchi .comZone svg .all{transform: scale(7) translate(-51px,-612px);}
#mapArea.tgt_tokushima .comZone svg .all{transform: scale(7) translate(-184px,-634px);}
#mapArea.tgt_kagawa .comZone svg .all{transform: scale(8) translate(-176px,-622px);}
#mapArea.tgt_ehime .comZone svg .all{transform: scale(7) translate(-126px,-655px);}
#mapArea.tgt_kochi .comZone svg .all{transform: scale(7) translate(-143px,-665px);}
#mapArea.tgt_fukuoka .comZone svg .all{transform: scale(8) translate(-12px,-660px);}
#mapArea.tgt_saga .comZone svg .all{transform: scale(8) translate(9px,-668px);}
#mapArea.tgt_nagasaki .comZone svg .all{transform: scale(8) translate(18px,-676px);}
#mapArea.tgt_kumamoto .comZone svg .all{transform: scale(7) translate(-6px,-702px);}
#mapArea.tgt_oita .comZone svg .all{transform: scale(7) translate(-37px,-671px);}
#mapArea.tgt_miyazaki .comZone svg .all{transform: scale(5) translate(-19px,-717px);}
#mapArea.tgt_kagoshima .comZone svg .all{transform: scale(6) translate(8px,-753px);}
#mapArea.tgt_okinawa .comZone svg .all{transform: scale(3) translate(-475px,-742px);}

#mapArea.tgt_hokkaido .comZone svg .hokkaido > .outline{stroke-width: 2px !important;}
#mapArea.tgt_aomori .comZone svg .aomori > .outline{stroke-width: 2px !important;}
#mapArea.tgt_iwate .comZone svg .iwate > .outline{stroke-width: 2px !important;}
#mapArea.tgt_miyagi .comZone svg .miyagi > .outline{stroke-width: 2px !important;}
#mapArea.tgt_akita .comZone svg .akita > .outline{stroke-width: 2px !important;}
#mapArea.tgt_yamagata .comZone svg .yamagata > .outline{stroke-width: 2px !important;}
#mapArea.tgt_fukushima .comZone svg .fukushima > .outline{stroke-width: 2px !important;}
#mapArea.tgt_ibaraki .comZone svg .ibaraki > .outline{stroke-width: 2px !important;}
#mapArea.tgt_tochigi .comZone svg .tochigi > .outline{stroke-width: 2px !important;}
#mapArea.tgt_gumma .comZone svg .gumma > .outline{stroke-width: 2px !important;}
#mapArea.tgt_saitama .comZone svg .saitama > .outline{stroke-width: 2px !important;}
#mapArea.tgt_chiba .comZone svg .chiba > .outline{stroke-width: 2px !important;}
#mapArea.tgt_tokyo .comZone svg .tokyo > .outline{stroke-width: 2px !important;}
#mapArea.tgt_kanagawa .comZone svg .kanagawa > .outline{stroke-width: 2px !important;}
#mapArea.tgt_niigata .comZone svg .niigata > .outline{stroke-width: 2px !important;}
#mapArea.tgt_toyama .comZone svg .toyama > .outline{stroke-width: 2px !important;}
#mapArea.tgt_ishikawa .comZone svg .ishikawa > .outline{stroke-width: 2px !important;}
#mapArea.tgt_fukui .comZone svg .fukui > .outline{stroke-width: 2px !important;}
#mapArea.tgt_yamanashi .comZone svg .yamanashi > .outline{stroke-width: 2px !important;}
#mapArea.tgt_nagano .comZone svg .nagano > .outline{stroke-width: 2px !important;}
#mapArea.tgt_gifu .comZone svg .gifu > .outline{stroke-width: 2px !important;}
#mapArea.tgt_shizuoka .comZone svg .shizuoka > .outline{stroke-width: 2px !important;}
#mapArea.tgt_aichi .comZone svg .aichi > .outline{stroke-width: 2px !important;}
#mapArea.tgt_mie .comZone svg .mie > .outline{stroke-width: 2px !important;}
#mapArea.tgt_shiga .comZone svg .shiga > .outline{stroke-width: 2px !important;}
#mapArea.tgt_kyoto .comZone svg .kyoto > .outline{stroke-width: 2px !important;}
#mapArea.tgt_osaka .comZone svg .osaka > .outline{stroke-width: 2px !important;}
#mapArea.tgt_hyogo .comZone svg .hyogo > .outline{stroke-width: 2px !important;}
#mapArea.tgt_nara .comZone svg .nara > .outline{stroke-width: 2px !important;}
#mapArea.tgt_wakayama .comZone svg .wakayama > .outline{stroke-width: 2px !important;}
#mapArea.tgt_tottori .comZone svg .tottori > .outline{stroke-width: 2px !important;}
#mapArea.tgt_shimane .comZone svg .shimane > .outline{stroke-width: 2px !important;}
#mapArea.tgt_okayama .comZone svg .okayama > .outline{stroke-width: 2px !important;}
#mapArea.tgt_hiroshima .comZone svg .hiroshima > .outline{stroke-width: 2px !important;}
#mapArea.tgt_yamaguchi .comZone svg .yamaguchi > .outline{stroke-width: 2px !important;}
#mapArea.tgt_tokushima .comZone svg .tokushima > .outline{stroke-width: 2px !important;}
#mapArea.tgt_kagawa .comZone svg .kagawa > .outline{stroke-width: 2px !important;}
#mapArea.tgt_ehime .comZone svg .ehime > .outline{stroke-width: 2px !important;}
#mapArea.tgt_kochi .comZone svg .kochi > .outline{stroke-width: 2px !important;}
#mapArea.tgt_fukuoka .comZone svg .fukuoka > .outline{stroke-width: 2px !important;}
#mapArea.tgt_saga .comZone svg .saga > .outline{stroke-width: 2px !important;}
#mapArea.tgt_nagasaki .comZone svg .nagasaki > .outline{stroke-width: 2px !important;}
#mapArea.tgt_kumamoto .comZone svg .kumamoto > .outline{stroke-width: 2px !important;}
#mapArea.tgt_oita .comZone svg .oita > .outline{stroke-width: 2px !important;}
#mapArea.tgt_miyazaki .comZone svg .miyazaki > .outline{stroke-width: 2px !important;}
#mapArea.tgt_kagoshima .comZone svg .kagoshima > .outline{stroke-width: 2px !important;}
#mapArea.tgt_okinawa .comZone svg .okinawa > .outline{stroke-width: 2px !important;}

/* --------------------- comSide */

#mapArea .comZone .comSide{
	display: table-cell;
	width: min(37.14vw,520px);
	background: #E5E5E5;
	vertical-align: top;
}

#mapArea .comZone .comSide .ttl{
  display: flex;
  align-items: center;
  justify-content: center;
	width: 100%;
	height: min(6.43vw,90px);
	font-size: var(--px18);
}

/* コメント画面のmapタイトル 、コメント部分、コメント部分のタイトル*/
#mapArea .comZone .mapSide .ttl span{display: none;font-size: var(--px32);}
#mapArea .comZone .comSide .pref{display: none;}
#mapArea .comZone .ttl span{display: none;font-size: var(--px18);}
#mapArea.tgt_hokkaido .comZone .comInner .hokkaido{display: inline-block;}
#mapArea.tgt_aomori .comZone .comInner .aomori{display: inline-block;}
#mapArea.tgt_iwate .comZone .comInner .iwate{display: inline-block;}
#mapArea.tgt_miyagi .comZone .comInner .miyagi{display: inline-block;}
#mapArea.tgt_akita .comZone .comInner .akita{display: inline-block;}
#mapArea.tgt_yamagata .comZone .comInner .yamagata{display: inline-block;}
#mapArea.tgt_fukushima .comZone .comInner .fukushima{display: inline-block;}
#mapArea.tgt_ibaraki .comZone .comInner .ibaraki{display: inline-block;}
#mapArea.tgt_tochigi .comZone .comInner .tochigi{display: inline-block;}
#mapArea.tgt_gumma .comZone .comInner .gumma{display: inline-block;}
#mapArea.tgt_saitama .comZone .comInner .saitama{display: inline-block;}
#mapArea.tgt_chiba .comZone .comInner .chiba{display: inline-block;}
#mapArea.tgt_tokyo .comZone .comInner .tokyo{display: inline-block;}
#mapArea.tgt_kanagawa .comZone .comInner .kanagawa{display: inline-block;}
#mapArea.tgt_niigata .comZone .comInner .niigata{display: inline-block;}
#mapArea.tgt_toyama .comZone .comInner .toyama{display: inline-block;}
#mapArea.tgt_ishikawa .comZone .comInner .ishikawa{display: inline-block;}
#mapArea.tgt_fukui .comZone .comInner .fukui{display: inline-block;}
#mapArea.tgt_yamanashi .comZone .comInner .yamanashi{display: inline-block;}
#mapArea.tgt_nagano .comZone .comInner .nagano{display: inline-block;}
#mapArea.tgt_gifu .comZone .comInner .gifu{display: inline-block;}
#mapArea.tgt_shizuoka .comZone .comInner .shizuoka{display: inline-block;}
#mapArea.tgt_aichi .comZone .comInner .aichi{display: inline-block;}
#mapArea.tgt_mie .comZone .comInner .mie{display: inline-block;}
#mapArea.tgt_shiga .comZone .comInner .shiga{display: inline-block;}
#mapArea.tgt_kyoto .comZone .comInner .kyoto{display: inline-block;}
#mapArea.tgt_osaka .comZone .comInner .osaka{display: inline-block;}
#mapArea.tgt_hyogo .comZone .comInner .hyogo{display: inline-block;}
#mapArea.tgt_nara .comZone .comInner .nara{display: inline-block;}
#mapArea.tgt_wakayama .comZone .comInner .wakayama{display: inline-block;}
#mapArea.tgt_tottori .comZone .comInner .tottori{display: inline-block;}
#mapArea.tgt_shimane .comZone .comInner .shimane{display: inline-block;}
#mapArea.tgt_okayama .comZone .comInner .okayama{display: inline-block;}
#mapArea.tgt_hiroshima .comZone .comInner .hiroshima{display: inline-block;}
#mapArea.tgt_yamaguchi .comZone .comInner .yamaguchi{display: inline-block;}
#mapArea.tgt_tokushima .comZone .comInner .tokushima{display: inline-block;}
#mapArea.tgt_kagawa .comZone .comInner .kagawa{display: inline-block;}
#mapArea.tgt_ehime .comZone .comInner .ehime{display: inline-block;}
#mapArea.tgt_kochi .comZone .comInner .kochi{display: inline-block;}
#mapArea.tgt_fukuoka .comZone .comInner .fukuoka{display: inline-block;}
#mapArea.tgt_saga .comZone .comInner .saga{display: inline-block;}
#mapArea.tgt_nagasaki .comZone .comInner .nagasaki{display: inline-block;}
#mapArea.tgt_kumamoto .comZone .comInner .kumamoto{display: inline-block;}
#mapArea.tgt_oita .comZone .comInner .oita{display: inline-block;}
#mapArea.tgt_miyazaki .comZone .comInner .miyazaki{display: inline-block;}
#mapArea.tgt_kagoshima .comZone .comInner .kagoshima{display: inline-block;}
#mapArea.tgt_okinawa .comZone .comInner .okinawa{display: inline-block;}

	@media screen and (max-width:768px){

	#mapArea .comZone .mapSide .ttl span{
		font-size: 6.4vw;
	}

	#mapArea .comZone .comSide{
		display: block;
		width: 100%;
		padding-bottom: 34vw;
	}

	#mapArea .comZone .comSide .ttl{
		width: 100%;
		height: 19.73vw;
		font-size: 4.27vw;
	}

	#mapArea .comZone .comSide .ttl span{
		font-size: 4.27vw;
	}

	}/* --- max-width:768px */

/* --------------------- comSide */

#mapArea .comZone .comSide .tabOuter{
	position: relative;
	width: min(37.14vw,520px);
	overflow-x: auto;
	scrollbar-width: thin;
	white-space: nowrap;
}

#mapArea .comZone .comSide .tabList{
	display: block;
	font-size: 0;
}

#mapArea .comZone .comSide .tabList > li{
	display: inline-block;
	width: calc(min(37.14vw,520px) / 3);
}

#mapArea .comZone .comSide .tabList > li .btnTab{
	cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
	width: 100%;
	height: var(--px48);
	background: #000;
	border-right: 1px solid #5A5A5A;
	color: #fff;
	font-size: var(--px16);
	font-weight: bold;
}
#mapArea .comZone .comSide .tabList > li:last-child .btnTab{border: none;}
#mapArea .comZone .comSide .tabList > li .btnTab.is_active{background: #fff;}
#mapArea .comZone .comSide .tabList > li .btnTab.is_active span{
	color: #000;
	background: url(/images/special/synchroweather/review/border_yellow.png) repeat-x center bottom max(-0.36vw,-5px);
	padding: 0 var(--px5);
	background-size: auto 60%;
}
#mapArea .comZone .comSide .tabList > li .btnTab.is_disabled{
	color: #5A5A5A;
}

#mapArea .comZone .comOuter{
	height: min(53vw,742px);
	background: #fff;
	overflow-y: auto;
	scrollbar-width: thin;
}

#mapArea .comZone .comList{
	padding: var(--px10) var(--px40);
}

#mapArea .comZone .comSide .comList > li{display: none;}
#mapArea .comZone .comSide .comList > li.is_active{display: block;}

#mapArea .comZone .comWrap > li{
	padding: var(--px30) 0;
	border-top: 1px solid #ccc;
}
#mapArea .comZone .comWrap > li:first-child{border: none;}

#mapArea .comZone .comWrap .com{
	font-size: var(--px14);
}

#mapArea .comZone .comWrap .name{
	font-size: var(--px12);
	margin-top: var(--px24);
}

	@media screen and (max-width:768px){

	#mapArea .comZone .comSide .tabOuter{
		width: 100vw;
	}

	#mapArea .comZone .comSide .tabList > li{
		width: calc(100vw / 3);
	}

	#mapArea .comZone .comSide .tabList > li .btnTab{
		height: 12.8vw;
		font-size: 3.73vw;
	}
	#mapArea .comZone .comSide .tabList > li .btnTab.is_active span{
		background: url(/images/special/synchroweather/review/border_yellow.png) repeat-x center bottom -1.33vw;
		padding: 0 1.33vw;
		background-size: auto 70%;
	}

	#mapArea .comZone .comOuter{
		overflow-y: visible;
		height: auto;
	}

	#mapArea .comZone .comList{
		padding: 2.67vw 5.33vw;
	}

	#mapArea .comZone .comWrap > li{
		padding: 8vw 0;
	}

	#mapArea .comZone .comWrap .com{
		font-size: 3.73vw;
	}

	#mapArea .comZone .comWrap .name{
		font-size: 3.2vw;
		margin-top: 6.4vw;
	}

	}/* --- max-width:768px */

/* ===================== iconScroll */

.mapBlock .iconScroll{
	position: absolute;
	top: max(-5vw,-70px);
	left: 50%;
	margin-left: max(-2.36vw,-33px);
}

.mapBlock .iconScroll .icon{
	display: block;
	width: min(4.64vw,65px);
}

.mapBlock .iconScroll .line{
	display: block;
	margin-top: var(--px8);
	width: 0;
	height: min(5vw,70px);
	border-right: 1px solid #666;
	left: 50%;
	position: absolute;
	animation: excon 3s;
	animation-fill-mode: forwards;
	animation-iteration-count: infinite;
	animation-timing-function: cubic-bezier(.15,.41,.69,.94);
}

@keyframes excon {
	0% { transform: translateY(0);opacity: 0;}
	20% { transform: translateY(0);opacity: 1;}
	100% { transform: translateY(var(--px30));opacity: 0;}
}

	@media screen and (max-width:768px){

	.mapBlock .iconScroll{
		top: -19vw;
		margin-left: -5.065vw;
	}

	.mapBlock .iconScroll .icon{
		width: 10.13vw;
	}

	.mapBlock .iconScroll .line{
		margin-top: 2vw;
		height: 18.67vw;
	}

	@keyframes excon {
		0% { transform: translateY(0);opacity: 0;}
		20% { transform: translateY(0);opacity: 1;}
		100% { transform: translateY(3vw);opacity: 0;}
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ bgOuter */

.bgOuter{
	position: relative;
	background: #000;
	width: 100%;
	margin: auto;
	overflow: hidden;
}

.bgOuter .tyre{
	position: absolute;
	opacity: 0.7;
}

.bgOuter .tyre.upper{width: min(65.43vw,916px);top: min(6.14vw,86px);right: max(-8.36vw,-117px);}
.bgOuter .tyre.middle{width: min(64.29vw,900px);top: min(46.07vw,645px);left: max(-18.64vw,-261px);}
.bgOuter .tyre.bottom{width: min(32.14vw,450px);bottom: max(-7.14vw,-100px);right: max(-3vw,-42px);}

	@media screen and (max-width:768px){

	.bgOuter{
		width: 100%;
	}

	.bgOuter .tyre.upper{width: 112.53vw;top: -5.07vw;right: -46.67vw;}
	.bgOuter .tyre.middle{width: 154.67vw;top: 172.73vw;left: -61.07vw;}
	.bgOuter .tyre.bottom{width: 84.53vw;bottom: -19.73vw;right: -30.13vw;}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ movBlock */

.movBlock > .secInner{
	padding: min(11.79vw,165px) 0 min(5vw,70px);
}

.movBlock .ttlMain{
	text-align: center;
}

.movBlock .ttlMain span{
	display: inline-block;
	width: min(17.86vw,250px);
}

.movBlock .txtSub{
	text-align: center;
	font-size: var(--px20);
	color: #fff;
	margin-top: var(--px34);
}

	@media screen and (max-width:768px){

	.movBlock > .secInner{
		padding: 25.64vw 0 16vw;
	}

	.movBlock .ttlMain span{
		width: 43.59vw;
	}

	.movBlock .txtSub{
		font-size: 4.8vw;
		margin-top: 6.4vw;
	}

	}/* --- max-width:768px */

/* ############################### movSliderOuter */

.movBlock .movSliderOuter{
	margin-top: min(4.57vw,64px);
}

.movBlock .slick-slide{
	margin: 0 var(--px20);
}

.movBlock .slick-slide .txtOuter{
	background: #272727;
	padding: var(--px20);
}

.movBlock .slick-slide .txtOuter .ttl{
	font-size: var(--px16);
	color: #fff;
	display: block;
}

.movBlock .slick-slide .txtOuter .date{
	font-size: var(--px14);
	color: #fff;
	opacity: 0.6;
	display: block;
	margin-top: var(--px5);
}

.movBlock .slick-slide .btnMov{
	cursor: pointer;
}

.movBlock .slick-slide .btnMov .imgOuter{
	position: relative;
	object-fit: cover;
  display: flex;
  align-items: center;
  justify-content: center;
}
.movBlock .slick-slide .btnMov .imgOuter:hover{opacity: 0.8;}

.movBlock .slick-slide .btnMov .imgOuter:after{
	content: "";
	position: absolute;
	display: block;
	background: url(/images/special/synchroweather/review/icon_mov.svg) no-repeat center;
	top: 50%;
	left: 50%;
	margin-top: max(-1.64vw,-23px);
	margin-left: max(-1.64vw,-23px);
	width: min(4vw,56px);
	height: min(4vw,56px);
	background-size: contain !important;
}

.movBlock .slick-slide .btnMov.is_soon{
	pointer-events: none;
	background: #8D8B8B;
}
.movBlock .slick-slide .btnMov.is_soon .imgOuter:after{display: none;}

	@media screen and (max-width:768px){

	.movBlock .movSliderOuter{
		margin-top: 14.9vw;
	}

	.movBlock .slick-slide{
		margin: 0 2.66vw;
	}

	.movBlock .slick-slide .txtOuter{
		padding: 4.2vw;
	}

	.movBlock .slick-slide .txtOuter .ttl{
		font-size: 4.26vw;
	}

	.movBlock .slick-slide .txtOuter .date{
		font-size: 3.7vw;
		margin-top: 1.33vw;
	}


	.movBlock .slick-slide .btnMov .imgOuter:after{
		margin-top: -7.5vw;
		margin-left: -7.5vw;
		width: 15vw;
		height: 15vw;
	}

	}/* --- max-width:768px */

/* ############################### controler */

.movBlock .controlerWrap{
	text-align: center;
	margin: min(3.93vw,55px) auto 0;
}

.movBlock .controler{
	display: inline-block;
	position: relative;
}

.movBlock .controler .dots{
	position: relative;
	margin: auto;
}

.movBlock .controler .slick-dots{
  display: flex;
  align-items: center;
  justify-content: center;
	position: relative;
	bottom: max(-0.21vw,-3px);
}

.movBlock .controler .slick-dots li{
	padding: 0 var(--px10);
	width: var(--px12);
	height: var(--px12);
	text-align: center;
}

.movBlock .controler .slick-dots li button{
	background: #fff;
	border-radius: var(--px10);
	width: var(--px12);
	height: var(--px12);
	opacity: 0.2;
}
.movBlock .controler .slick-dots .slick-active button{opacity: 1 !important;}

.movBlock .controler .bttn{
	display: inline-block;
	position: absolute;
	top: 0;
	right: max(-5.71vw,-80px);
}

.movBlock .controler .bttn > span{
	display: inline-block;
}

.movBlock .controler .bttn img{
	width: auto;
	height: 100%;
}

.movBlock .controler .bttn .btnStop{
	display: none;
	width: var(--px24);
	height: var(--px20);
	cursor: pointer;
	line-height: 1;
}
.movBlock .is_playing .controler .bttn .btnStop{display: flex;align-items: center;}
.movBlock .controler .bttn .btnStop span{
	display: inline-flex;
	line-height: 1;
}

.movBlock .controler .bttn .btnPlay{
	display: flex;
	align-items: center;
	width: var(--px24);
	height: var(--px20);
	cursor: pointer;
	line-height: 1;
}
.movBlock .is_playing .controler .bttn .btnPlay{display: none;}
.movBlock .controler .bttn .btnPlay span{
	display: inline-flex;
	line-height: 1;
}

.movBlock .slick-prev{
	background: #000;
	width: min(5.71vw,80px);
	height: min(8.57vw,120px);
	left: 0;
	z-index: 2;
	margin-top: var(--px20);
}

.movBlock .slick-prev:before{
	content: "";
	position: absolute;
	display: block;
	width: var(--px40);
	height: var(--px40);
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	background-size: contain !important;
	rotate: 45deg;
	top: 50%;
	margin-top: max(-1.43vw,-20px);
	left: var(--px30);
}

.movBlock .slick-next{
	background: #000;
	width: min(5.71vw,80px);
	height: min(8.57vw,120px);
	right: 0;
	z-index: 2;
	margin-top: var(--px20);
}

.movBlock .slick-next:before{
	content: "";
	position: absolute;
	display: block;
	width: var(--px40);
	height: var(--px40);
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	background-size: contain !important;
	rotate: -45deg;
	top: 50%;
	margin-top: max(-1.43vw,-20px);
	right: var(--px30);
}

	@media screen and (max-width:768px){

	.movBlock .controler{
		display: block;
		margin: 8.53vw auto 0;
	}

	.movBlock .controler > li{
		display: block;
		text-align: center;
	}

	.movBlock .controler .slick-dots{
		bottom: 0;
	}

	.movBlock .controler .slick-dots li{
		padding: 0 2.6vw;
		width: auto;
		height: auto;
	}
	.movBlock .controler > li:first-child{padding-right: 0;}

	.movBlock .controler .slick-dots li button{
		border-radius: 1.5vw;
		width: 2.13vw;
		height: 2.13vw;
	}

	.movBlock .slick-dots li button:before{
		font-family: 'slick';
		font-size: 1.6vw;
		line-height: 20px;
		position: absolute;
		top: 50%;
		left: 50%;
		margin-top: -2.6vw;
		margin-left: -1.4vw;
		width: 5.33vw;
		height: 5.33vw;
		content: '•';
		text-align: center;
		opacity: .25;
		color: black;
		-webkit-font-smoothing: antialiased;
	}

	.movBlock .controler .bttn{
		position: relative;
		right: auto;
		height: 13.33vw;
	  display: flex;
	  align-items: flex-end;
	  justify-content: center;
	}

	.movBlock .controler .bttn .btnStop{
		width: 4.5vw;
		height: auto;
	}

	.movBlock .controler .bttn .btnPlay{
		width: auto;
		height: 3.73vw;
		display: flex;
	}

	.movBlock .controler .bttn .btnPlay span{
		display: flex;
	}

	.movBlock .controler .bttn .btnPlay img{
		height: 100%;
	}

	.movBlock .slick-prev{
		width: 15vw;
		height: 21.33vw;
		margin-top: -20vw;
	}

	.movBlock .slick-prev:before{
		width: 5.33vw;
		height: 5.33vw;
		rotate: 45deg;
		top: 50%;
		margin-top: -2.665vw;
		left: 6vw;
	}

	.movBlock .slick-next{
		width: 15vw;
		height: 21.33vw;
		margin-top: -20vw;
	}

	.movBlock .slick-next:before{
		width: 5.33vw;
		height: 5.33vw;
		rotate: -45deg;
		top: 50%;
		margin-top: -2.665vw;
		right: 6vw;
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ newsBlock */

.newsBlock{
	text-align: center;
}

.newsBlock > .secInner{
	padding: min(7.86vw,110px) var(--px20) min(4.28vw,60px);
}

.newsBlock .ttlMain{
	text-align: center;
}

.newsBlock .ttlMain span{
	display: inline-block;
	width: min(16.57vw,232px);
}

.newsBlock .txtSub{
	text-align: center;
	font-size: var(--px20);
	color: #fff;
	margin-top: var(--px34);
}

.newsBlock .newsList{
	margin-top: var(--px44);
	font-size: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
}

.newsBlock .newsList li{
	display: block;
	margin: 0 var(--px20) var(--px20) var(--px20);
}



.newsBlock .newsList a{
	width: min(22.5vw,315px);
	height: auto;
	object-fit: cover;
	display: block;
	cursor: pointer;
}

.newsBlock .newsList a img {
	width: 100%;
	height: auto;
	display: block;
}
.newsBlock .newsList a:hover{opacity: 0.8;}

.newsBlock .newsList span{
  display: flex;
  align-items: center;
  justify-content: center;
}

.newsBlock .newsList .is_soon{pointer-events: none;}

.newsBlock .newsList .is_soon span{
  display: flex;
  align-items: center;
  justify-content: center;
	background: #8D8B8B;
	width: 100%;
	height: 100%;
}

.newsBlock .newsList .is_soon img{
	display: inline-block;
	width: min(12.71vw,178px);
}

	@media screen and (max-width:768px){

	.newsBlock > .secInner{
		padding: 16vw 5.33vw min(4.28vw,60px);
	}

	.newsBlock .ttlMain span{
		width: 41vw;
	}

	.newsBlock .txtSub{
		font-size: 4.8vw;
		margin-top: 6.4vw;
	}

	.newsBlock .newsList{
		width: 100%;
		margin-top: 4vw;
	}

	.newsBlock .newsList li{
		display: block;
		margin: 10.66vw auto 0;
	}

	.newsBlock .newsList a{
		width: 100%;
		height: 59.73vw;
	}

	.newsBlock .newsList .is_soon img{
		width: 47.47vw;
	}

	}/* --- max-width:768px */


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ svg */

/* 全日本 */
#mapAll .ns-1,
#mapAll .ns-2,
#mapAll .ns-3,
#mapAll .ns-4,
#mapAll .ns-5,
#mapAll .ns-6,
#mapAll .ns-7,
#mapAll .ns-8,
#mapAll .ns-9 {
  fill: none;
  stroke-width: 0;
  stroke: none;
}

#mapAll .ns-5,
#mapAll .ns-6,
#mapAll .ns-3 {
  fill-rule: evenodd;
}

/* 拡大する県ごとの */
#mapPref .s-1,
#mapPref .s-2,
#mapPref .s-3,
#mapPref .s-4,
#mapPref .s-5,
#mapPref .s-6,
#mapPref .s-7,
#mapPref .s-8,
#mapPref .s-9,
#mapPref .s-10,
#mapPref .s-11,
#mapPref .s-12,
#mapPref .s-13,
#mapPref .s-14,
#mapPref .s-15,
#mapPref .s-16 {
  fill: none;
  vector-effect: non-scaling-stroke;
  stroke-width: 1px;
  stroke: #555;
}

#mapPref .s-5,
#mapPref .s-6,
#mapPref .s-3 {
  /* fill-rule: evenodd; */
}