/* ===================================================== */
/* ハザードマップフロートイメージ*/
/* ===================================================== */

.floatimgArea .hazardmapImg_wl {
	z-index: 9999;
	display:flex;
	justify-content: flex-end;
	position: absolute;
	bottom: 10rem;
	right: 0;
	width: 100%;
	max-width: 30rem;
	min-width: 30rem;
	background-color: #fff0;
	filter: drop-shadow(0.3rem 0.3rem 0.2rem rgba(0, 0, 0, 0.3));
}

.floatimgArea .hazardmapImg_wl img {
	max-width: 30rem;
	min-width: 30rem;
	height: 100%;
}

/*--- sp ---*/
@media only screen and (max-width: 768px) {
	.floatimgArea .hazardmapImg_wl {
		position: absolute;
		bottom: 8rem;
		right: 0;
		width: 100%;
		max-width: 25rem;
		min-width: 25rem;
		background-color: #fff0;
	}

	.floatimgArea .hazardmapImg_wl img {
		align-self: flex-end;
		max-width: 25rem;
		min-width: 25rem;
		height: auto;
	}
}

@media only screen and (max-width: 375px) {
	.floatimgArea .hazardmapImg_wl {
		position: absolute;
		display:flex; 
		bottom: 8rem;
		right: 0;
		width: 100%;
		max-width: 19rem;
		min-width: 19rem;
		background-color: #fff0;
	}

	.floatimgArea .hazardmapImg_wl img {
		align-self: flex-end;
		max-width: 19rem;
		min-width: 19rem;
		height: auto;
	}
}

/*--- modal ---*/
.hazardmapImg_wl>button.closeImg {
	position: absolute;
	top: -25px;
	right: 5%;
	width: 20px;
	height: 20px;
}

.hazardmapImg_wl>button.closeImg::before {
	position: absolute;
	top: 0;
	right: 0;
	content: "";
	width: 20px;
	height: 20px;
	background: #fff;
	border-radius: 50%;
}

.hazardmapImg_wl>button.closeImg::after {
	position: absolute;
	top: -2px;
	right: -2px;
	content: "\e5c9";
	font-family: 'Material Icons Round';
	font-weight: 200;
	font-size: 25px;
	color: #2D649A;
}

.modal_overlay.js-modal-close {
	background: rgb(0 0 0 / 0%);
	height: 100vh;
	position: absolute;
	width: 100%;
}

.fixed {
	height: 100%;
	position: fixed;
	width: 100%;
}