@charset "utf-8";
@import url('html5_reset.css');

/*------------------------------------------------
共通
-------------------------------------------------*/


/*
全体レイアウト
----------------------------------*/

body {
	/*width: 1000px;*/
	margin:0 auto !important;

}

body #guide .inner {/*追加*/
    width: 69%;
    margin: 0 auto;
}

@media only screen and (max-width:754px) {
	body{
		width: 100%;
		margin:0 auto !important;/*追加*/
	}
	body #guide .inner {/*追加*/
    width: 90%;
    margin: 0 auto;
	
}
	body #guide .pc {/*追加*/
      display: none; }
    body #guide .sp {/*追加*/
      display: block; } 
}

#container {
	width: 1000px;
	margin:0 auto !important;/*追加*/
	
}

#container_header {
	width: 1000px;
	margin:0 auto !important;/*追加*/
}


@media only screen and (max-width:754px) {/*追加*/
	#container{
		width: 100%;
	}
}
@media only screen and (max-width:754px) {/*追加*/
	#container_header{
		width: 100%;
	}
}

.fv_movie_box {
	position: relative;
}


.fv_movie {
	position: absolute;
	top: 1200px;
	left: 110px;
	filter: drop-shadow(-25px 25px 15px rgba(0, 0, 0, .2));
}




/*
サイズ調整
----------------------------------*/

#container_header img {
	width: 100%;
	height: auto;
}

#container img {
	width: 100%;
	height: auto;
}




@media only screen and (max-width:754px) {
	#container_header img {
		width: 100%;
		height: auto;
	}

	#container img {
		width: 100%;
		height: auto;
	}
}




/*
動画サイズ
----------------------------------*/

#v_f {
	width: 600px;
	min-height: 60%;
	min-height: 60vh;
/*
	min-height: 50%;
	min-height: 50vh;
	min-width: 50%;
	min-width: 50vw
	*/
}

.v_f_mb_30 {
	margin:0 0 50px 0;
}

@media only screen and (max-width:754px) {
	#v_f {
		min-height: 60%;
		min-height: 60vh;
		min-width: 50%;
		min-width: 50vw
		/*
		width: 100%;
		*/
		height: auto;
	}
}

@media only screen and (max-width:754px) {
	.v_f_mb_30 {
		margin:0 0 0 0;
	}
}

#v_f_b {
	width: 60%;
	height: auto;
}

@media only screen and (max-width:754px) {
	#v_f_b {
		width: 100%;
		height: auto;
	}
}


/*
アニメーション調整
----------------------------------*/

.fade_area{
	overflow: hidden;
}

.fadeUp{
	animation-name:fadeUpAnime;
	animation-duration:1.2s;
	animation-fill-mode:forwards;
	opacity:0;
}

@keyframes fadeUpAnime{
	from {
		opacity: 0;
		transform: translateY(100px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadeUpTrigger{
	opacity: 0;
}

.zoomIn {
	animation-name: zoomInAnime;
	animation-duration: 1.2s;
	animation-fill-mode: forwards;
}

@keyframes zoomInAnime{
	0% {
		opacity: 0;
		transform: scale(0.6);
	}

	100% {
		opacity: 1;
		transform: scale(1);
	}
}

/*左右のアニメーション*/
.rightAnime{
	opacity: 0;/*事前に透過0にして消しておく*/
}

.slideAnimeLeftRight {
	animation-name:slideTextX100;
	animation-duration:1.4s;
	animation-fill-mode:forwards;
	opacity: 0;
}

@keyframes slideTextX100 {
	from {
	transform: translateX(-100%); /*要素を左の枠外に移動*/
	opacity: 0;
	}
	
	to {
	transform: translateX(0);/*要素を元の位置に移動*/
	opacity: 1;
	}
}

.slideAnimeRightLeft {
	animation-name:slideTextX-100;
	animation-duration:1.4s;
	animation-fill-mode:forwards;
	opacity: 0;
}

@keyframes slideTextX-100 {
	from {
	transform: translateX(100%);/*要素を右の枠外に移動*/
	opacity: 0;
	}

	to {
	transform: translateX(0);/*要素を元の位置に移動*/
	opacity: 1;
	}
}



.fade_area {
	position: relative;
	width: 100%;
}
.fade_position_top {
	position: absolute;
	top:0;
}
.fade_position_vioice {
	position: absolute;
	top:14%;
  left: 0;
}
.fade_position_13_01 {
	position: absolute;
	top:3%;
  left: 9.4%;
}
.fade_position_13_02 {
	position: absolute;
	top:37%;
  left: 19.6%;
}
.fade_position_13_03 {
	position: absolute;
	bottom:17%;
  left: 12.6%;
}
.fade_position_07_01_s02_txt {
	position: absolute;
	top:4%;
  left: 18%;
}

.fade_position_tc0102 {
	position: absolute;
	bottom:5%;
}

.fade_position_tc0301 {
	position: absolute;
	top:52.4%;
}

/*reCAPTCHAバッジ（ロゴマーク）を消す*/
.grecaptcha-badge { visibility: hidden; }