@charset "utf-8";

*{margin:0;padding:0}
body{font-size:13px;font-family:arial;-webkit-text-size-adjust:none;line-height:1.62;background-color: #000;-webkit-tap-highlight-color:rgba(0,0,0,0);}
body,html{width:100%;height:100%;overflow:hidden;}
table{border-collapse:collapse;border-spacing:0}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
ul,ol,li{list-style:none;}
em{font-style:normal}
img{border:none;}
input,img{vertical-align:middle;}
input,select,textarea{outline:0;-webkit-appearance:none}
q:before, q:after { content:'' }
.fn-clear:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
.fn-clear{*zoom:1}
a{color:#666;text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0);}
a:active{color:#333;-webkit-tap-highlight-color:rgba(0,0,0,0);}
section,aside,header,footer,hgroup,article{display:block}
.show{display: block}
.hide{display: none}
/*index*/
.p-index {height: 100%; width: 100%; overflow: hidden }
/*模块 m-*/
.m-page { position:absolute; left:0; top:0; height:100%; width:100%}
.m-page.show { z-index:10; display:block; }
.m-page.hide { z-index:5; display:none; }
.m-page.active { z-index:15; display:block; }

.m-box{position:absolute;left:10%;top:50%;width:80%;margin:-120px auto 0;text-align: center;color:#fff;}
.m-img{ width:100%; height:100%;background-position: center;background-position: no-repeat;background-size: 100% 100%}
.m-ico{width:66px;height:66px;margin:0 auto;background-position: center;background-position: no-repeat;background-size: 66px}
/* global */
.p-index{display:none}
.m-page img{/*position:absolute*/}
.m-tips{opacity:0;display:block;position:absolute;bottom:-3%;left:50%;margin-left:-29px;width:60px;height:40px;background:url(../images/arrow.png) no-repeat;background-size:58px auto;
		-webkit-animation:tips ease-out 1s infinite;-webkit-animation-delay:2.4s}
@-webkit-keyframes tips{
	0%{
		opacity:0;
		-webkit-transform:translate(0,0px);
	}
	100%{
		opacity:1;
		-webkit-transform:translate(0,-20px);
	}
}
/* page01 */
.m-page01 .m-img{background-image:url(../images/page-01.jpg);}
.m-01-img1{opacity: 0;position: absolute;width: 30%;top:27%;left:38%;-webkit-animation:slideDown ease-in-out .8s forwards;}
.m-01-img2{opacity:0;width: 90%; position:absolute; top: 45%;left: 5%; -webkit-animation:slideUp ease-in-out .8s forwards;-webkit-animation-delay:1s }
@-webkit-keyframes slideUp{
	0%{
		opacity:0;
		-webkit-transform:translate(0,20px);
	}
	100%{
		opacity:1;
		-webkit-transform:translate(0,0);
	}
}
@-webkit-keyframes slideDown{
	0%{
		opacity:0;
		-webkit-transform:translate(0,-20px);
	}
	100%{
		opacity:1;
		-webkit-transform:translate(0,0);
	}
}
/* page02 */
.m-page02 .m-img{background-image:url(../images/page-02.jpg)}


/* page03 */
.m-page03 .m-img{background-image:url(../images/page-03.jpg)}
/* page04 */
.m-page04 .m-img{background-image:url(../images/page-04.jpg)}

/* page05 */
.m-page05 .m-img{background-image:url(../images/page-05.jpg)}
/* page06 */
.m-page06 .m-img{background-image:url(../images/page-06.jpg)}
/* page07 */
.m-page07 .m-img{background-image:url(../images/page-07.jpg)}
/* page08 */
.m-page08 .m-img{background-image:url(../images/page-08.jpg)}
/* page09 */
.m-page09 .m-img{background-image:url(../images/page-09.jpg)}
/* page10 */
.m-page10 .m-img{background-image:url(../images/page-10.jpg)}
/* page11 */
.m-page11 .m-img{background-image:url(../images/page-11.jpg)}

.m-11-img1{opacity: 0;position: absolute;width: 50%;top: 18%;left: 25%;-webkit-animation:slideDown ease-in-out .8s forwards;}
.m-11-img2{opacity: 0;width: 90%;position: absolute;top: 36%;left: 5%; -webkit-animation:slideUp ease-in-out .8s forwards;-webkit-animation-delay:1s }
/*动画*/

@-webkit-keyframes bounceInRight {
0% {
opacity:0;
-webkit-transform:translateX(2000px);
}
60% {
opacity:1;
-webkit-transform:translateX(-30px);
}
80% {
	opacity:1;
-webkit-transform:translateX(10px);
}
100% {
	opacity:1;
-webkit-transform:translateX(0);
}
}

@-webkit-keyframes vanishIn {
0% {
opacity:0;
-webkit-transform-origin:50% 50%;
-webkit-transform:scale(2, 2);
-webkit-filter:blur(90px);
}
100% {
opacity:1;
-webkit-transform-origin:50% 50%;
-webkit-transform:scale(1, 1);
-webkit-filter:blur(0px);
}
}

@-webkit-keyframes rotateIn {
0% {
opacity:0;
-webkit-transform:scale(0, 0);
}
100% {
opacity:1;
-webkit-transform:scale(1, 1);
}
}

@-webkit-keyframes lightSpeedIn {
0% {
-webkit-transform:translateX(100%) skewX(-30deg);
opacity:0;
}
60% {
-webkit-transform:translateX(-20%) skewX(30deg);
opacity:1;
}
80% {
-webkit-transform:translateX(0%) skewX(-15deg);
opacity:1;
}
100% {
-webkit-transform:translateX(0%) skewX(0deg);
opacity:1;
}
}

@-webkit-keyframes FX-Move{
    0%, 100% {-webkit-transform: translateY(0);}
    10%, 30%, 50%, 70%, 90% {-webkit-transform: translateY(-4px);-webkit-transform: translateX(4px);}
    20%, 40%, 60%, 80% {-webkit-transform: translateX(-4px);-webkit-transform: translateY(4px);}
}



@-webkit-keyframes FX-spin{
    0% {
        opacity:.4;
        -webkit-transform-origin: center center;
        -webkit-transform: rotate(0deg); 
    }

  
    100% {
        opacity:1;
        -webkit-transform-origin: center center;
        -webkit-transform: rotate(360deg);
    }
}
