@charset "utf-8";
/* CSS Document */



/**************************
アイフレーム用モーダル
**************************/
.iframe_modal{
	position: fixed;
	display: none;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1200;
  background: rgba(0,0,0,0.4);
}

.iframe_modal_wrap{
	position: relative;
	width: 850px;
	height: 610px;
	background: rgba(255,255,255,0.9);
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -48%);
	transform: translate(-50%, -48%);
}


.iframe_modal .img_reception{
	position: absolute;
	bottom: -34px;
	display: none;
}


@media only screen and (min-width: 0px) and (max-width:1084px) {
	.iframe_modal .img_reception img{
		width: 28vw;
	}
}

@media only screen and (min-width: 0px) and (max-height:378px) {
	.iframe_modal .img_reception img{
		height: 106vh;
		object-fit: contain;
		object-position: bottom;
	}
}

@media only screen and (min-width: 1085px) {
	.iframe_modal .img_reception{
		right: 70%;
	}
}

@media only screen and (min-width: 0px) and (max-width:928px) {
	.iframe_modal_wrap{
		width: 86vw;
		height: 86%;
	}
}

@media only screen and (max-height:644px) {
	.iframe_modal_wrap{
		width: 86vw;
		height: 86%;
	}
}

@media only screen and (min-width: 1920px) and (max-width:3839px) {
	.iframe_modal_wrap{
		width: 1134px;
		height: 810px;
	}
}
@media only screen and (min-width: 3840px) {
	.iframe_modal_wrap{
		width: 1620px;
		height: 2268px;
	}
}



/*--- 動画拡大時に適用 ---*/
.iframe_modal_wrap_movlarge{
	background: rgba(255,255,255,0);
	transform: translate(-50%, -40%);
}
@media only screen and (max-width:928px) {
	.iframe_modal_wrap_movlarge{
		background: rgba(255,255,255,0);
		width: 430px;
		height: 320px;
		transform: translate(-50%, -47%);
	}
}

@media only screen and (min-width: 0px) and (max-width:568px) {
	.iframe_modal_wrap_movlarge{
		width: 376px;
		height: 290px;
	}
}

@media only screen and (min-height: 440px) and (max-height:644px) {
	.iframe_modal_wrap_movlarge{
		width: 528px;
		height: 370px;
	}
}

@media only screen and (max-height:320px) {
	.iframe_modal_wrap_movlarge{
		width: 376px;
		height: 290px;
	}
}
/*----------------------*/


.iframe_modal_wrap .iframe{
	position : absolute;
	width: 100%;
  height: 100%;
}

.iframe_modal_wrap .iframe .iframe_rap{
	height: 100%;
}

.iframe_modal_wrap .iframe iframe{
	width: 100%;
	height: 100%;
	overflow: hidden;
	overflow-y: scroll;
}

.iframe_modal_wrap .iframe .iframe_modal_close{
	position: absolute;
	width: 48px;
	height: 48px;
	background-color: #3E3E3E;
	right: -24px;
	top: -27px;
	cursor: pointer;
	border-radius: 40px;
	transition: 1s ease;
}

.iframe_modal_wrap .iframe .iframe_modal_close::before, 
.iframe_modal_wrap .iframe .iframe_modal_close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px; /* 棒の幅（太さ） */
  height: 24px; /* 棒の高さ */
  background: #fff; /* バツ印の色 */
}

.iframe_modal_wrap .iframe .iframe_modal_close::before {
  transform: translate(-50%,-50%) rotate(45deg);
}

.iframe_modal_wrap .iframe .iframe_modal_close::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}

/*--- 動画拡大時に適用 ---*/

.iframe_modal_wrap .iframe .iframe_modal_close_movlarge{
	top: -20px;
	transition: 1s ease;
}
@media only screen and (min-width: 0px) and (max-width:928px) {
	.iframe_modal_wrap .iframe .iframe_modal_close_movlarge{
		right: -56px;
		top: 0;
		transition: 1s ease;
	}	
}

/*-------------------*/


.iframe_modal_wrap .iframe .iframe_modal_close span{
	margin-left : -10%;
}

@media screen and (max-width: 840px) {
	.iframe_modal_wrap .iframe .iframe_modal_close span{
		font-size: 10px;
	}
}

@media screen and (max-width: 840px) {
	.iframe_rap{
		-webkit-overflow-scrolling: touch;
		overflow: auto;
	}
}




/**************************
END アイフレーム用モーダル
**************************/





/**************************
END アイフレーム用モーダル
**************************/