@charset "utf-8";
/* CSS Document */
.section{
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
}
#section0{
	background-image:url(images/top/head.jpg);
}
#section2{
	width:100%;
	padding-top:56.25%;
	background-image:url(../images/top/img_1.jpg);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: 50% 50%;
	z-index: 1;
	position:relative;
	background-attachment:fixed;
}
#myVideo,.myVideo{
	position: absolute;
	right: 0;
	bottom: 0;
	top:0;
	right:0;
	width: 100%;
	height: 100%;
	background-size: 100% 100%;
	background-color: black; /* in case the video doesn't fit the whole page*/
	background-image: /* our video */;
	background-position: center center;
	background-size: contain;
	object-fit: cover; /*cover video background */
	z-index:3;
}
#section0 .layer{
	position: absolute;
	z-index: 4;
	width: 35%;
	left: 0;
	top: 36%;
	right:0;
	margin:auto;

	/* 
	* Preventing flicker on some browsers 
	* See http://stackoverflow.com/a/36671466/1081396  or issue #183
	*/
	-webkit-transform: translate3d(0,0,0);
	-ms-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

/*solves problem with overflowing video in Mac with Chrome */
#section0{
	overflow: hidden;
}
/* Hiding video controls 
* See: https://css-tricks.com/custom-controls-in-html5-video-full-screen/
* --------------------------------------- */
video::-webkit-media-controls {
  display:none !important;
}

.back1{
	width:100%;
	padding-top:56.25%;
	background-image:url(../../images/top/bg_1.jpg);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: 50% 50%;
	z-index: 1;
	position:relative;
	background-attachment:fixed;
}
.back1 .tex1{
	float: right;
	background-image:url(../../images/top/tex_1-1.png);
	background-repeat:no-repeat;
	background-position:0px 0;
	position:relative;
}
.back1 .tex1 p{
	position:absolute;
	background-image:url(../../images/top/tex_1-1.png);
	background-repeat:no-repeat;
	top:0;
	height:250px;
	opacity:0;
}
.back1 .tex1 .text-1-1{
	background-position:-65px 0;
	width:50px;
	right:0;
}
.back1 .tex1 .text-1-2{
	background-position:0px 0;
	width:50px;
	right:65px;
}
.back1 .tex2{
	/*background-image:url(../images/top/tex_1-2.png);
	background-repeat:no-repeat;
	background-position:0px 0;*/
	position:relative;
	float: left;
	width:343px;
	height:459px;
}
.back1 .tex2 p{
	position:absolute;
	background-image:url(../../images/top/tex_1-2.png);
	background-repeat:no-repeat;
	top:0;
	width:26px;
	height:459px;
	opacity:0;
}
.back1 .tex2 .text-2-1{
	background-position:-312px 0;
	right:5px;
}
.back1 .tex2 .text-2-2{
	background-position:-277px 0;
	right:40px;
}
.back1 .tex2 .text-2-3{
	background-position:-244px 0;
	right:73px;
}
.back1 .tex2 .text-2-4{
	background-position:-210px 0;
	right:107px;
}
.back1 .tex2 .text-2-5{
	background-position:-175px 0;
	right:142px;
}
.back1 .tex2 .text-2-6{
	background-position:-142px 0;
	right:175px;
}
.back1 .tex2 .text-2-7{
	background-position:-109px 0;
	right:208px;
}
.back1 .tex2 .text-2-8{
	background-position:-75px 0;
	right:242px;
}
.back1 .tex2 .text-2-9{
	background-position:-40px 0;
	right:277px;
}
.back1 .tex2 .text-2-10{
	background-position:-7px 0;
	right:310px;
}
/**/
.back2{
	width:100%;
	padding-top:56.25%;
	background-image:url(../../images/top/bg_2.jpg);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: 50% 50%;
	z-index: 1;
	position:relative;
	background-attachment:fixed;
}
.back2 .tex1{
	float: right;
	/*background-image:url(../images/top/tex_2-1.png);
	background-repeat:no-repeat;
	background-position:0px 0;*/
	position:relative;
}

.back2 .tex1 p{
	position:absolute;
	background-image:url(../../images/top/tex_2-1.png);
	background-repeat:no-repeat;
	top:0;
	height:389px;
	opacity:0;
}

.back2 .tex1 .text-1-1{
	background-position:-72px 0;
	width:50px;
	right:0;
}
.back2 .tex1 .text-1-2{
	background-position:-7px 0;
	width:50px;
	right:65px;
}
.back2 .tex2{
	/*background-image:url(../images/top/tex_3-2.png);
	background-repeat:no-repeat;
	background-position:0px 0;*/
	position:relative;
	float: left;
	width:280px;
	height:472px;
}
.back2 .tex2 p{
	position:absolute;
	background-image:url(../../images/top/tex_3-2.png);
	background-repeat:no-repeat;
	top:0;
	width:34px;
	height:520px;
	opacity:0;
}
.back2 .tex2 .text-2-1{
	background-position:-242px 0;
	right:4px;
}
.back2 .tex2 .text-2-2{
	background-position:-208px 0;
	right:38px;
}
.back2 .tex2 .text-2-3{
	background-position:-174px 0;
	right:72px;
}
.back2 .tex2 .text-2-4{
	background-position:-140px 0;
	right:106px;
}
.back2 .tex2 .text-2-5{
	background-position:-106px 0;
	right:140px;
}
.back2 .tex2 .text-2-6{
	background-position:-72px 0;
	right:174px;
}
.back2 .tex2 .text-2-7{
	background-position:-38px 0;
	right:208px;
}
.back2 .tex2 .text-2-8{
	background-position:-4px 0;
	right:242px;
}

/**/
.back3{
	width:100%;
	padding-top:56.25%;
	background-image:url(../../images/top/bg_3.jpg);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: 50% 50%;
	z-index: 1;
	position:relative;
	background-attachment:fixed;
}
.back3 .tex1{
	float: right;
	/*background-image:url(../images/top/tex_3-1.png);
	background-repeat:no-repeat;
	background-position:0px 0;*/
	position:relative;

}
.back3 .tex1 p{
	position:absolute;
	background-image:url(../../images/top/tex_3-1.png);
	background-repeat:no-repeat;
	background-position:0px 0;
	top:0;
	height:463px;
	opacity:0;
}
.back3 .tex1 .text-1-1{
	background-position:-65px 0;
	width:50px;
	right:0;
}
.back3 .tex1 .text-1-2{
	background-position:0px 0;
	width:50px;
	right:65px;
}
.back3 .tex2{
	/*background-image:url(../images/top/tex_2-2.png);
	background-repeat:no-repeat;
	background-position:0px 0;*/
	position:relative;
	float: left;
	width: 395px;
	height: 520px;
	margin-top: -52px;
}
.back3 .tex2 p{
	position:absolute;
	background-image:url(../../images/top/tex_2-2.png);
	background-repeat:no-repeat;
	top:0;
	width:34px;
	height:472px;
	opacity:0;
}
.back3 .tex2 .text-2-1{
	background-position:-370px 0;
	right:60px;
}
.back3 .tex2 .text-2-2{
	background-position:-336px 0;
	right:94px;
}
.back3 .tex2 .text-2-3{
	background-position:-302px 0;
	right:128px;
}
.back3 .tex2 .text-2-4{
	background-position:-268px 0;
	right:162px;
}
.back3 .tex2 .text-2-5{
	background-position:-234px 0;
	right:196px;
}
.back3 .tex2 .text-2-6{
	background-position:-200px 0;
	right:230px;
}
.back3 .tex2 .text-2-7{
	background-position:-166px 0;
	right:264px;
}
.back3 .tex2 .text-2-8{
	background-position:-132px 0;
	right:298px;
}
.back3 .tex2 .text-2-9{
	background-position:-98px 0;
	right:332px;
}
.back3 .tex2 .text-2-10{
	background-position:-62px 0;
	right:368px;
}