@charset 'UTF-8';
/*
 * Mixin for placeholder
 * @include placeholderColor(#00ff00);
 */
/*
 * Mixin for placeholder
 * @include placeholderColor(#00ff00);
 */
/* -----------------------------------------------------------------
モーダル
----------------------------------------------------------------- */
.u-box-modal {
	display : -webkit-box;
	display : -ms-flexbox;
	display : flex;
	-ms-flex-wrap : wrap;
	    flex-wrap : wrap;
	gap : 20px 15px;
}
@media print, screen and (min-width: 768px) {
	.u-box-modal {
		gap : 40px 30px;
	}
}

.u-box-modal__content {
	width : 90%;
	padding : 0;
	border : 0;
}
.u-box-modal__content::-webkit-backdrop {
	background-color : rgba(0, 0, 0, 0.5);
}
.u-box-modal__content::backdrop {
	background-color : rgba(0, 0, 0, 0.5);
}
@media print, screen and (min-width: 768px) {
	.u-box-modal__content {
		width : 70%;
		max-width : 980px;
	}
}
.u-box-modal__content.u-box-modal__content--youtube {
	overflow : visible;
	background-color : transparent;
}
.u-box-modal__content.u-box-modal__content--youtube iframe {
	width : 100%;
	height : auto;
	aspect-ratio : 16 / 9;
	border : none;
}
.u-box-modal__content.u-box-modal__content--youtube .u-box-modal__content-close {
	bottom : 100%;
	right : 0;
	top : auto;
}

.u-box-modal__content-inner {
	padding : 15px;
}

.u-box-modal__content-header {
	padding-right : 20px;
	font-size : 25.6px;
	font-size : 1.6rem;
	font-weight : bold;
}
@media print, screen and (min-width: 768px) {
	.u-box-modal__content-header {
		font-size : 1.8rem;
	}
}

.u-box-modal__content-close {
	position : absolute;
	top : 10px;
	right : 10px;
}

.u-box-modal__content-close-btn {
	display : block;
	padding : 14px;
	background-color : transparent;
	border : none;
	background-color : #06c;
}
@media print, screen and (min-width: 768px) {
	.u-box-modal__content-close-btn {
		padding : 20px;
	}
}

.u-box-modal__content-close-btn-img {
	display : block;
	width : 20px;
	height : 20px;
	-webkit-transform-origin : center;
	    -ms-transform-origin : center;
	        transform-origin : center;
	-webkit-transform : rotate(45deg);
	    -ms-transform : rotate(45deg);
	        transform : rotate(45deg);
}
@media print, screen and (min-width: 768px) {
	.u-box-modal__content-close-btn-img {
		width : 24px;
		height : 24px;
	}
}