@charset "UTF-8";




/* ======================================== apply ======================================== */
#apply
{
	min-width: 1120px;
}
#apply .sectionInner
{
	background: linear-gradient(
		to bottom,
		rgba(251, 236, 242, 1.0) 0%,
		rgba(251, 236, 242, 1.0) 17rem,
		rgba(255, 255, 255, 1.0) 22rem
	);

	padding: 7.5rem 0 12rem;
	margin: 0 auto;
}



#apply h2
{
	margin: 0 0 1rem;

	color: rgba(221, 74, 126, 1.0);
	font-size: 1.875rem;
	font-weight: bold;
	text-align: center;
	letter-spacing: 0.1rem;
}
#apply .subTitle
{
	margin: 0 0 6rem;

	color: rgba(221, 74, 126, 1.0);
	font-size: 1.1rem;
	font-weight: bold;
	text-align: center;
	letter-spacing: 0.15rem;
}

#apply h3
{
	margin: 0 0 3.25rem;

	color: rgba(16, 39, 100, 1.0);
	font-size: 1.05rem;
	line-height: 2;
	font-weight: bold;
	text-align: center;
	letter-spacing: 0.05rem;
}

#apply .requirements
{
	width: 960px;	height: 480px;
	padding: 2rem;
	margin: 0 auto 2rem;

	background-color: rgba(244, 244, 244, 1.0);
	border-radius: 0.5rem;

	overflow-y: scroll;
}

#apply .requirements p
{
	color: rgba(51, 51, 51, 1.0);
	font-size: 0.8rem;
	line-height: 1.6;
}

#apply .note
{
	margin: 0 0 6.5rem;

	color: rgba(16, 39, 100, 1.0);
	font-size: 1rem;
	text-align: center;
	line-height: 1.5;
	letter-spacing: 0.05rem;
}

#apply .buttons
{
	display: flex;	flex-wrap: wrap;	justify-content: space-between;
	width: 960px;
	margin: 0 auto;
}

#apply .buttons .item
{
	position: relative;
	width: 48%;
}

#apply .buttons .item:first-child::after,
#apply .buttons .item:last-child::after
{
	position: absolute;
	bottom: 2.5rem;

	content: "";
	display: block;
	width: 0rem;	height: 0.2rem;
	background-color: rgba(255, 255, 255, 1.0);
}
#apply .buttons .item:first-child::after{	left: 10.35rem;	}
#apply .buttons .item:last-child::after{	left: 4.1rem;	}


#apply .buttons .item:first-child.MH::after{	animation: applyON 0.2s ease-in-out 0s both;	}
#apply .buttons .item:first-child.MO::after{	animation: applyOFF 0.2s ease-in-out 0s both;	}
#apply .buttons .item:last-child.MH::after{	animation: instagramON 0.2s ease-in-out 0s both;	}
#apply .buttons .item:last-child.MO::after{	animation: instagramOFF 0.2s ease-in-out 0s both;	}

@keyframes applyON{	0%{	width: 0rem;	}	100%{	width: 8rem;	}	}
@keyframes applyOFF{	0%{	width: 8rem;	}	100%{	width: 0rem;	}	}
@keyframes instagramON{	0%{	width: 0rem;	}	100%{	width: 20.5rem;	}	}
@keyframes instagramOFF{	0%{	width: 20.5rem;	}	100%{	width: 0rem;	}	}


/* ======================================== SP ======================================== */
@media screen and (max-width: 767px)
{


#apply{	min-width: 100%;	}
#apply .sectionInner{	width: 100%;	padding: 7.5rem 0 6rem;	}
#apply .subTitle{	margin: 0 0 5.4rem;	}

#apply h3
{
	width: 85vw;
	margin: 0 auto 3.25rem;
	font-size: 1.4rem;
	line-height: 2;
	letter-spacing: 0;
}

#apply .requirements{	width: 85vw;	height: 100vw;	}

#apply .requirements p{	font-size: 1.1rem;	}


#apply .note
{
	margin: 0 0 3rem;

	font-size: 1.3rem;
	font-weight: bold;
	line-height: 1.6;
}

#apply .buttons{	width: 85vw;	}
#apply .buttons .item{	width: 100%;	}
#apply .buttons .item:first-child{	margin: 0 auto 1.5rem;	}

#apply .buttons .item:first-child::after,
#apply .buttons .item:last-child::after
{	display: none;	}


}








/* ======================================== formMotal ======================================== */
#formMotal{	width: 1088px;	padding: 1rem;	}
#formMotal .sectionInner
{
	height: 569px;
	padding: 20rem 0 0;
	margin: 0 auto;

	background: url("../image/apply/formModal_background_PC.jpg") no-repeat top center/cover;
	background-color: rgba(255,255,255,1.0);
	box-shadow: 0 0 1rem rgba(51, 51, 51, 0.3);
}

#formMotal p
{
	margin: 0;

	color: rgba(16, 39, 100, 1.0);
	font-size: 1rem;
	text-align: center;
	line-height: 1.5;
	letter-spacing: 0.05rem;
}

#formMotal iframe
{
	height: 15rem;
	margin: 0 auto;
	overflow-x: hidden;
}



/* ======================================== SP ======================================== */
@media screen and (max-width: 767px)
{

	#formMotal{	width: 90vw;	}
	#formMotal .sectionInner
	{
		height: auto;
		padding: 34rem 0 0;

		background: url("../image/apply/formModal_background_SP.jpg") no-repeat top center/cover;
		background-color: rgba(255,255,255,1.0);
		box-shadow: 0 0 1rem rgba(51, 51, 51, 0.3);
	}







}









/* ======================================== END ======================================== */
