@charset "UTF-8";
/* CSS Document */



/* FONT size
---------------------------------------------------------------------
[ px ]	[ % ]
10px 	72  %		19px 	136 %
11px 	79  %		20px 	143 %
12px 	86 %		21px 	150 %
13px 	93 %		22px 	158 %
14px 	100 %		23px 	165 %
15px 	108 %		24px 	172 %
16px 	115 %		25px 	179 %
17px 	122 %		26px 	186 %
18px 	129 %
---------------------------------------------------------------------*/




	



/* min 801px */
@media screen and (min-width: 801px), print {


	
	
/* main
--------------------- */
#main {
	padding-bottom: 0;
}


	
	
/* pagetitle01
--------------------- */
#pagetitle01 {
	padding-bottom: 0;
}
	.mainvisual {
		width: 100%;
		height: 70vh;
		overflow: hidden;
	}
		.mainvisual .mainvisual__video {
			position: fixed !important;
			top: -100px;
			left: 0;
			width: 100vw;
			height: 80vw !important;
			z-index: -1 !important;
		}
			.mainvisual .mainvisual__video iframe {
				width: 100vw;
				height: 80vw !important;
			}

	#pagetitle01 h1 {
		padding-top: 100px;
	}

	#pagetitle01 .text_bg {
		background: #fff;
		padding-bottom: 100px;
	}


	
	
/* main
--------------------- */
#main {
	background: #fff;
}


	
	
/* camera
--------------------- */
#camera {
	padding-bottom: 120px;
}
	#camera p {
		width: 485px;
		font-size: 86%;
		line-height: 30px;
	}
	
	#camera .temp {
		width: 485px;
	}
	

}








/* max 800px */
@media only screen and (max-width: 800px) {





.video {
	margin-top: 50px;
position: relative;
height: 0;
padding: 30px 0 56.25%;
overflow: hidden;
}

.video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


	
	
/* pagetitle01
--------------------- */
#pagetitle01 {
	width: 100%;
	padding-bottom: 0;
}
	#pagetitle01 h1 {
		line-height: 1.4em;
		padding-bottom: 10px;
	}
	
	
	.mainvisual {
		width: 100%;
		height: 60vh;
		overflow: hidden;
	}
		.mainvisual .mainvisual__video {
			position: fixed !important;
			top: -50px;
			left: 0;
			width: 100%;
			height: 80vh !important;
			z-index: -1;
		}
			.mainvisual .mainvisual__video iframe {
				width: 100%;
				height: 80vh !important;
			}

	#pagetitle01 .text_bg {
		background: #fff;
		padding-bottom: 30px;
	}


	
	
/* main
--------------------- */
#main {
	background: #fff;
}


	
	
/* camera
--------------------- */
#camera {
	padding-bottom: 70px;
}
	#camera p {
		font-size: 86%;
		line-height: 30px;
	}
	
	#camera .en {
		padding-top: 20px;
	}	
	


}

	



.fadeInDown {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
}
@-webkit-keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
@keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
.fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	visibility: visible !important;
}