/*====== Keyvisual =====*/
#kvContainer{
	position: relative; width: 100%;
	background-color: #000;
}

#kv1,#kv2,#kv3{
	position: absolute; overflow: hidden;
	width: 100%; height: 100%; top: 0; left: 0;
	background-position: left top;
	background-size: cover;
	background-repeat: no-repeat;
	
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translate(-400px, 0); transform: translate(-400px, 0);
	transition: all .3s ease-in;
}

#kv1{background-image: url("/_common/img/kv/sp/bg01.jpg");}
#kv2{background-image: url("/_common/img/kv/sp/bg02.jpg");}
#kv3{background-image: url("/_common/img/kv/sp/bg03.jpg");}

.kv_change, .kvtitle_change, .kvsubtitle_change{
	-webkit-opacity: 1 !important; opacity: 1 !important;
	-webkit-transform:translate(0, 0) !important; transform: translate(0, 0) !important;
}

#kv1 img{
	position: absolute;
	width: 100%; bottom: 0px; right: 0px;
	
	-webkit-opacity: 0; opacity: 0; -webkit-transform-origin: bottom; transform-origin: bottom;
	-webkit-transform:scale(0, 0); transform: scale(0, 0);
	transition: all .6s ease-in;
}

#kv1 img.img_change{
	-webkit-opacity: 1; opacity: 1;
	-webkit-transform:scale(1, 1); transform: scale(1, 1);
}

.kvtitle1, .kvtitle2, .kvtitle3{
	position: absolute;
	width: 85%; height: 0px; overflow: hidden;
	left: 0; bottom: 50px;
	background-position: left top;
	background-size: cover;
	background-repeat: no-repeat;
	
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translate(-300px, 0); transform: translate(-300px, 0);
	transition: all .6s ease-in;
}

.kvtitle1{background-image: url("/_common/img/kv/sp/title01.png");} 
.kvtitle2{background-image: url("/_common/img/kv/sp/title02.png");} 
.kvtitle3{background-image: url("/_common/img/kv/sp/title03.png");}

.kv_subtitle{
	position: absolute; left: 20px;
	font-family: Roboto;
	color: #ffffff;
	font-size: 14px;
	font-weight: 900;
	letter-spacing: .05em;
	text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.3);
	
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translate(-300px, 0); transform: translate(-300px, 0);
	transition: all .6s ease-in;
}

/*====== footer =====*/
/*
#facebook, #twitter{
	margin: 20px auto; background-color: #fff; 
	box-shadow: 0px 0px 18px 2px rgba(0, 0, 0, 0.1);
}

#facebook, #twitter{
	position: absolute; left:0; right: 0; margin: 20px auto; background-color: #fff; 
	box-shadow: 0px 0px 18px 2px rgba(0, 0, 0, 0.1);
}
#facebook{top: 20px;}
*/

/*====== section 1 =====*/
.sec_wrapper01, .sec_container01{height: fit-content; border-top-right-radius: 20px;}
.sec_wrapper01{background-image: url("/_common/img/home/bg01.jpg"); background-size: cover; background-repeat:no-repeat; background-position: top 0px right -330px; margin-top: -20px;}
.sec_container01{background-color: rgba(0,0,0,.85);}
.sec_box01{padding: 40px 0px 50px;}

h2.sec01_title{
	display: block; width: 100%; height: fit-content; 
	font-size: 16px !important; line-height: 28px !important; font-weight: 900 !important; color: #fff;
}

h3.sec01_title{
	display: block; width: fit-content; height: fit-content;
	font-size: 12px !important; font-weight: 900 !important; color: #fff;
}

.sec01_content_left, .sec01_content_right{margin-top: 40px;}
.sec01_content_left{width: 100%; text-align: center; height: fit-content;}
.sec01_content_left img{width: 50%;}
.sec01_content_left span{display: block; font-size: 12px !important; font-weight: 900 !important; color: #fff; margin-top: 10px;}
.sec01_content_right{width: 100%;}
.sec01_content_right div{font-size:12px !important; line-height:18px !important;}

/*====== section 2 & 3 =====*/
h2:not(sec01_title){display: block; font-size: 18px !important; font-weight: 900 !important;}

/*====== section 2 =====*/
h2.sec02_title{color: #000 !important; margin-bottom: 25px;}

/*====== section 3 =====*/z
.sec_wrapper03, .sec_container03{position: relative; height: fit-content;}
.sec_wrapper03{background-image: url("/_common/img/home/bg02.jpg"); background-size: cover; background-repeat:no-repeat; margin-bottom: 20px;}
.sec_box03{margin: 25px auto;}

h2.sec03_title{display: block; color: #fff !important; margin-bottom: 10px;}
h3.sec03_title, .register_btn span{display: block; font-size: 16px; font-weight: 900; color: #fff !important; margin-bottom: 5px;}
.sec_box03 p{font-size: 12px !important; line-height: 18px !important; font-weight:500 !important; color:#fff; margin-bottom:15px;}

.register_btn{float: left; width: 100%; height: fit-content; margin: 10px 0;}

.register_btn a.btn_tell{
	float: left !important;
    width: 200px !important;
    height: 40px !important;
	border-radius: 20px !important;
	margin: 10px 0 !important;
}

.register_btn a.btn_tell div{
    width: 140px !important;
    height: 20px !important;
    background-size: 20px !important;
}

.register_btn a.btn_tell span {
    font-size: 18px !important;
}

