/*modal
------------------------------------------*/
.modal {
	text-align: center;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100%;
	z-index: 1000;
	overflow-y: auto;
	-ms-scroll-chaining: none;
	overscroll-behavior: contain
}
.modal__bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: calc(100vh + 1px);
	z-index: 1
}
.modal__inner {
	position: absolute;
	top: 50%;
	left: 50%;
	height: auto;
	width: calc(100% - 160px);
	max-width: 1037px;
	-webkit-transform: translate(-50%, -50%);
	transform:         translate(-50%, -50%);
	z-index: 2
}
@media screen and (max-width:767px) {
	.modal__inner {
		width: 100%
	}
}
.modal__inner::after {
	content: "";
	display: block;
	width: 100%;
	padding-top: 56.25%
}
.modal--vertical .modal__inner {
	width: auto
}
.modal--vertical .modal__inner::after {
	padding-top: 0;
	width: 47vh;
	height: 80vh
}
.modal__player {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}
.modal__player iframe,
.modal__player video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}
.modal__close {
	width: 29px;
	position: absolute;
	top: -44px;
	right: -52px
}
@media screen and (max-width:767px) {
	.modal__close {
		top: -39px;
		right: 15px
	}
}
.modal .p-form-mv {
	max-width: 1280px;
	margin: 0 auto
}
.modal .p-form-mv img {
	width: 100%
}

.js-btn-youtube {
	cursor: pointer;
}

/* JavaScriptでfadeIn()fadeOut()やで 2023.4.26 iw */
#modal {
	filter: opacity(0);
	visibility: hidden;
	background: rgba(0, 0, 0, .85);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter:         blur(6px);
	cursor: pointer;
	transition: .8s;
}
#modal.open {
	filter: opacity(1);
	visibility: visible;
}
