@charset "UTF-8";
/*--------------------------------------------
DATA TEXT
---------------------------------------------*/
[data-before]:before{
	content : attr( data-before );
}
[data-after]:after{
	content : attr( data-after );
}
/*--------------------------------------------
MAP
---------------------------------------------*/
.map-container , .iframe-container{
	position : relative;
}
.map-container > #map , .map-container > iframe , .iframe-container > #map , .iframe-container > iframe{
	width : 100%;
	height : 100%;
	position : absolute;
	top : 0;
	left : 0;
	right : 0;
	bottom : 0;
	margin-left : auto;
	margin-right : auto;
}



@media print,screen and (min-width: 751px){
	.is-sp{
		display : none;
	}
}
@media screen and (max-width: 750px){
	.is-pc{
		display : none;
	}
}
@media (max-width: 1024px){
	.is-mbup{
		display : none;
	}
}
@media (min-width: 1025px){
	.is-mb{
		display : none;
	}
}
/*--------------------------------------------
SUBMIT
---------------------------------------------*/
.submit01{
	border-color : #6cabdf;
	position : relative;
	border-width : 1px;
	border-style : solid;
	overflow : hidden;
	display : block;
	z-index : 1;
}
.submit01 span{
	color : #fff;
	display : flex;
	align-items : center;
	justify-content : center;
	text-align : center;
	width : 100%;
	height : 100%;
	position : relative;
	z-index : 1;
	backface-visibility : hidden;
	will-change : color;
	transition : color .2s ease-in;
}
.submit01 span:after{
	background : url("../images/ui/icon/arrow01.svg") 0 0 / contain no-repeat;
	content : "";
	display : block;
	top : 50%;
	transform : translateY(-50%);
	position : absolute;
	backface-visibility : hidden;
	will-change : right;
	transition : right .2s ease-in;
}
.submit01:before , .submit01:after{
	content : "";
	position : absolute;
	width : 100%;
	height : 100%;
	left : 0;
	top : 0;
}
.submit01:before{
	z-index : -2;
	background-color : #6cabdf;
}
.submit01:after{
	background-color : #fff;
	z-index : -1;
	max-width : 0;
	overflow : hidden;
	backface-visibility : hidden;
	will-change : max-width;
	transition : max-width .2s ease-in;
}
.submit01:hover:after{
	max-width : 100%;
}
.submit01:hover span{
	color : #6cabdf;
}
.submit01:hover span:after{
	background-image : url("../images/ui/icon/arrow01_on.svg");
}
@media screen and (max-width: 750px){
	.submit01{
		width : calc( 500 * 100vw / 750 );
		height : calc( 100 * 100vw / 750 );
		border-radius : calc( 50 * 100vw / 750 );
	}
	.submit01 span{
		font-size : 2.4rem;
	}
	.submit01 span:after{
		width : calc( 8 * 100vw / 750 );
		height : calc( 16 * 100vw / 750 );
		right : calc( 36 * 100vw / 750 );
	}
}
@media print,screen and (min-width: 751px){
	.submit01 span{
		font-size : 2.2rem;
	}
}
@media screen and (min-width: 751px) and (max-width: 1024px){
	.submit01{
		width : calc( 500 * 100vw / 1240 );
		height : calc( 100 * 100vw / 1240 );
		border-radius : calc( 50 * 100vw / 1240 );
	}
	.submit01 span:after{
		width : calc( 8 * 100vw / 1240 );
		height : calc( 16 * 100vw / 1240 );
		right : calc( 36 * 100vw / 1240 );
	}
	.submit01:hover span:after{
		right : calc( 24 * 100vw / 1240 );
	}
	.submit01.size02{
		width : calc( 430 * 100vw / 1240 );
		height : calc( 86 * 100vw / 1240 );
	}
	.submit01.size02 span:after{
		width : calc( 7 * 100vw / 1240 );
		height : calc( 14 * 100vw / 1240 );
		right : calc( 40 * 100vw / 1240 );
	}
}
@media screen and (min-width:1025px) and (max-width: 1919px){
	.submit01{
		width : calc( 500 * 100vw / 1920 );
		height : calc( 100 * 100vw / 1920 );
		border-radius : calc( 50 * 100vw / 1920 );
	}
	.submit01 span:after{
		width : calc( 8 * 100vw / 1920 );
		height : calc( 16 * 100vw / 1920 );
		right : calc( 36 * 100vw / 1920 );
	}
	.submit01:hover span:after{
		right : calc( 24 * 100vw / 1920 );
	}
	.submit01.size02{
		width : calc( 430 * 100vw / 1920 );
		height : calc( 86 * 100vw / 1920 );
	}
	.submit01.size02 span:after{
		width : calc( 7 * 100vw / 1920 );
		height : calc( 14 * 100vw / 1920 );
		right : calc( 40 * 100vw / 1920 );
	}
}
@media print,screen and (min-width: 1920px){
	.submit01{
		width : 500px;
		height : 100px;
		border-radius : 50px;
	}
	.submit01 span:after{
		width : 8px;
		height : 16px;
		right : 36px;
	}
	.submit01:hover span:after{
		right : 24px;
	}
	.submit01.size02{
		width : 430px;
		height : 86px;
	}
	.submit01.size02 span:after{
		width : 7px;
		height : 14px;
		right : 40px;
	}
}
/*--------------------------------------------
BUTTON
---------------------------------------------*/
.btn01{
	color : #fff;
	border : 1px solid #8a8a8a;
	display : flex;
	align-items : center;
	justify-content : center;
	text-align : center;
	font-size : 2.4rem;
	position : relative;
	overflow : hidden;
	backface-visibility : hidden;
	will-change : color;
	transition : color .2s ease-in;
}
.btn01:before , .btn01:after{
	content : "";
	pointer-events : none;
	position : absolute;
	width : 100%;
	height : 100%;
	left : 0;
	top : 0;
}
.btn01:before{
	z-index : -2;
	background-color : #8a8a8a;
}
.btn01:after{
	max-width : 0;
	background-color : #fff;
	z-index : -1;
	backface-visibility : hidden;
	will-change : max-width;
	transition : max-width .2s ease-in;
}
.btn01:hover{
	color : #8a8a8a;
}
.btn01:hover:after{
	max-width : 100%;
}
@media screen and (max-width: 750px){
	.btn01{
		width : calc( 310 * 100vw / 750 );
		height : calc( 100 * 100vw / 750 );
		border-radius : calc( 50 * 100vw / 750 );
	}
}
@media screen and (min-width: 751px) and (max-width: 1024px){
	.btn01{
		width : calc( 310 * 100vw / 1240 );
		height : calc( 100 * 100vw / 1240 );
		border-radius : calc( 50 * 100vw / 1240 );
	}
}
@media screen and (min-width:1025px) and (max-width: 1919px){
	.btn01{
		width : calc( 310 * 100vw / 1920 );
		height : calc( 100 * 100vw / 1920 );
		border-radius : calc( 50 * 100vw / 1920 );
	}
}
@media print,screen and (min-width: 1920px){
	.btn01{
		width : 310px;
		height : 100px;
		border-radius : 50px;
	}
}
/*--------------------------------------------
ANIMATION
---------------------------------------------*/
.is-animation{
	opacity : 0;
	transform : translateY( 100px );
	backface-visibility : hidden;
	will-change : opacity , transform;
	transition : opacity 1s ease , transform 1s ease;
}
.is-animation.animation{
	opacity : 1;
	transform : translateY(0);
}
/*# sourceMappingURL=../maps/module.css.map */