@charset "UTF-8";

/*　モーダル */

/* common　:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/

.mPageOpen{
	cursor: pointer;
}


#mPageBase{
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
	background: rgba(0, 0, 0, 0.85);
	text-align: left;
}
#mPageBase.open{
	display: block;
}

#mPageBase #mPageIn{
	display: flex;
	align-items:center;
	width: 100%;
	height: 100%;
}

#mPageBody {
	position:relative;
	box-sizing:border-box;
	z-index: 9999;
	bottom: 0;
	left:0;
	margin: auto;
}


#mPageBase.mLink #mPageBody {
	background:#ffffff;
}


/*--------------------------------------------------------------------*/
#mPageBase.mLink #mPageContsInr{
	display:block;
}

#mPageBase.mImg #mPageContsInr{
	display:none;
}




#mPageContsInr p{
	text-align: center;
}

#mPageTtl{
	text-align:center;	
}
#mPageTtl::after{
	content:"";
	display:block;
	margin:0 auto 0;
}


#mPageBtnWrap{
	display:flex;
	justify-content: center;
}

#mPageBtnWrap li{
	text-align:center;
	display:table;
}

#mPageLinkClose{
	border:1px solid var(--cGray75);
	color:var(--cGray75);
	cursor:pointer;
}


#mPageLinkClose,#mPageLinkBlank a{
	width:100%;
	display:table-cell;
	vertical-align: middle;
}

#mPageLinkBlank a{
	border:1px solid var(--cRed);
	color:var(--cRed);
}


/*--------------------------------------------------------------------*/
#mPageBase.mLink #mPageContsImg{
	display:none;
}

#mPageBase.mImg #mPageContsImg{
	display:block;
}



/*--------------------------------------------------------------------*/
#mPageClose {
	position:absolute;
	display: table;
}

#mPageClose > span {
	display: table-cell;
	width: 100%;
	color: #fff;
	vertical-align: middle;
	text-align:center;
	cursor: pointer;
	font-weight:bold;
	border-radius:50%;
	text-align:center;
}
#mPageClose > span:hover {	}

#mPageClose > span img{
	width: 60%;
	margin:0 auto;
}

#mPageBase.mLink #mPageClose > span{
	background:var(--cRed);
}

#mPageBase.mLink #mPageClose > span:hover{
	background:var(--cRedHv);
}



/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/
/* common :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/



/*PC ONLY　:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (min-width: 421px) {
/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/

	#mPageBody {
		width:700px;
		padding-bottom:10px;
		max-height:94dvh;
		border-radius:12px;
	}

	#mPageClose {
		top:-25px;
		right:-15px;
		width:47px;
		height:47px;
	}

	#mPageConts {
		position:relative;
		box-sizing:border-box;	
		width:100%;
		padding:1px;
		margin:20px auto 0;
	}

	#mPageConts #mPageContsInr{
		box-sizing:border-box;
		display:block;
		width:94%;
		margin:0 auto;
		padding:0 0px 20px 0;
		overflow-x:hidden;
		overflow-y:auto;
		max-height:80dvh;	
	}

/*--------------------------------------------------------------------*/


	#mPageTgt{
		width:700px;
		height:450px;
	}



/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/
}		/* 421px -> :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/



/*sp only　:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (max-width: 420px){
/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/

	#mPageBody {
		width: 93%;
		margin: 0 auto;
		border-radius:2vw;
	}

	#mPageClose {
		top:-4vw;
		right:-3vw;
		width:8vw;
		height:8vw;
	}


	#mPageConts {
		box-sizing:border-box;
		padding:1vw 1vw 2vw 2vw;
		width:98%;
		margin:3vw auto 0;
		text-align: left;
		max-height:94dvh;
}


	#mPageConts #mPageContsInr{
		box-sizing:border-box;
		display:block;
		width:88vw;
		margin:0 auto;
		overflow-x:hidden;
		overflow-y:auto;
		min-height:50vw;	
	}



	#mPageTgt{
		max-width:88vw;
		height:50.5vw;
		position:relative;
	}


/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/
}	/* -> 420px :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/





