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

.ani{
	transition:all 0.4s ease;
	-moz-transition:all 0.4s ease; /* Firefox 4 */
	-webkit-transition:all 0.4s ease; /* Safari and Chrome */
	-o-transition:all 0.4s ease; /* Opera */
}
.wrap{ min-width:1200px; min-height:100vh; background:#d7e4ed url(../images/default/bg.jpg) center no-repeat; background-size:cover; position:relative; overflow:hidden;}

.wrap img.light{ display:block; height:56vh; position:absolute; left:50%; top:0; z-index:2; transform:translateX(-50%);
	-webkit-animation-duration:0.3s;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-duration:0.3s;
}
.wrap img.logo{ display:block; height:18vh; position:absolute; left:50%; top:16%; z-index:3; margin-left:-15.4vh;
	-webkit-animation-duration:1.0s;
	animation-duration:1.0s;
	-webkit-animation-duration:1.0s;
	animation-duration:1.0s;
}

.wrap img.mark{ display:block; height:9.6vh; position:absolute; left:50%; bottom:60%; z-index:3; transform:translateX(-1460%);
	-webkit-animation-duration:0.6s;
	animation-duration:0.6s;
	-webkit-animation-duration:0.6s;
	animation-duration:0.6s;
}
.wrap img.slogan{ display:block; height:11.3vh; position:absolute; left:50%; top:40%; z-index:3; margin-left:-54vh;
	-webkit-animation-duration:0.8s;
	animation-duration:0.8s;
	-webkit-animation-duration:0.8s;
	animation-duration:0.8s;
}
.wrap div.slogan{ display:block; width:108vh; height:11.3vh; position:absolute; left:50%; top:40%; z-index:3; margin-left:-54vh;
	-webkit-animation-duration:0.8s;
	animation-duration:0.8s;
	-webkit-animation-duration:0.8s;
	animation-duration:0.8s;
}
.wrap div.slogan div{ display:block; width:20%; height:11.3vh; float:left;
	-webkit-animation-duration:0.6s;
	animation-duration:0.6s;
	-webkit-animation-duration:0.6s;
	animation-duration:0.6s;
}
.wrap div.slogan div.txt1{ background:url(../images/default/slogan.png) left 0 center no-repeat; background-size:500% 100%;}
.wrap div.slogan div.txt2{ background:url(../images/default/slogan.png) left -21.6vh center no-repeat; background-size:500% 100%;}
.wrap div.slogan div.txt3{ background:url(../images/default/slogan.png) left -43.2vh center no-repeat; background-size:500% 100%;}
.wrap div.slogan div.txt4{ background:url(../images/default/slogan.png) left -64.8vh center no-repeat; background-size:500% 100%;}
.wrap div.slogan div.txt5{ background:url(../images/default/slogan.png) left -86.4vh center no-repeat; background-size:500% 100%;}

.wrap em.home{ display:block; width:29vh; position:absolute; left:50%; top:62%; z-index:9; margin-left:-14.5vh;
	-webkit-animation-duration:0.8s;
	animation-duration:0.8s;
	-webkit-animation-duration:0.8s;
	animation-duration:0.8s;
}
.wrap em.home a{ display:block; width:100%;}
.wrap em.home img{ display:block; width:29vh;}

.wrap img.left{ display:block; height:76vh; position:absolute; left:0; top:0; z-index:1;
	-webkit-animation-duration:2s;
	animation-duration:2s;
	-webkit-animation-duration:2s;
	animation-duration:2s;
}
.wrap img.right{ display:block; height:92vh; position:absolute; right:0; bottom:0; z-index:1;
	-webkit-animation-duration:2s;
	animation-duration:2s;
	-webkit-animation-duration:2s;
	animation-duration:2s;
}

.wrap img.middle{ display:block; height:49vh; position:absolute; left:50%; bottom:0; z-index:2; transform:translateX(-50%);}
.wrap img.bottom{ display:block; height:20vh; position:absolute; left:50%; bottom:0; z-index:3; transform:translateX(-50%);}

@-webkit-keyframes xmove1{
	0%{ transform:translateX(-100%) scaleX(-1);}
	50%{ transform:translateX(-0%) scaleX(-1);}
	100%{ transform:translateX(100%) scaleX(-1);}
}
@-webkit-keyframes xmove2{
	0%{ transform:translateX(-100%);}
	50%{ transform:translateX(-0%);}
	100%{ transform:translateX(100%);}
}
@-webkit-keyframes xmove3{
	0%{ transform:translateX(-100%);}
	50%{ transform:translateX(-100%);}
	100%{ transform:translateX(-0%);}
}
.wrap img.float1{ display:block; width:100%; position:absolute; left:0; bottom:0; z-index:5;
    transform:scaleX(-1);
	animation: xmove1 80s linear infinite;
	-moz-animation: xmove1 80s linear infinite;
	-webkit-animation: xmove1 80s linear infinite;
	-o-animation: xmove1 80s linear infinite;
}
.wrap img.float2{ display:block; width:100%; position:absolute; left:0; bottom:0; z-index:5; margin-left:100%;
	animation: xmove2 80s linear infinite;
	-moz-animation: xmove2 80s linear infinite;
	-webkit-animation: xmove2 80s linear infinite;
	-o-animation: xmove2 80s linear infinite;
}
.wrap img.float3{ display:block; width:100%; position:absolute; left:0; bottom:0; z-index:5;
	animation: xmove3 80s linear infinite;
	-moz-animation: xmove3 80s linear infinite;
	-webkit-animation: xmove3 80s linear infinite;
	-o-animation: xmove3 80s linear infinite;
}





/**/