/* 全局 */
html,body{margin:0px;padding:0px;background:#171518;}
.page{position:absolute;top:0px;left:0px;width:100%;height:100%;}
.full{position:absolute;top:0px;left:0px;width:100%;height:100%;}

.tips{
	width:44px;height:55px;
	position:absolute;bottom:30px;left:50%;margin-left:-22px;z-index:123567;
	background:url(images/tips.png?1) no-repeat;
	animation: tips 1.5s linear infinite;
	-webkit-animation: tips 1.5s linear infinite;
}
@-webkit-keyframes tips{
	0%{ -webkit-transform: translate3d(0px, 0px, 0px); opacity: 0;}
	50%{ -webkit-transform: translate3d(0px, -15px, 0px); opacity: 1;}
	100%{ -webkit-transform: translate3d(0px, 0px, 0px); opacity: 0;}
}

/* 音乐 */
@-webkit-keyframes music{
	0%{ -webkit-transform: rotate(0deg);}
	100%{ -webkit-transform: rotate(360deg);}
}
.music{position:fixed;top:0px;right:0px;z-index:123567;}
.music .ico{position:absolute;top:0px;right:0px;z-index:123;}
.music .img{position:absolute;top:20px;right:15px;width:69px;height:69px;border-radius:69px;text-align:center;}
.music .on{
	-webkit-animation: music 2s infinite linear;
	-webkit-animation-fill-mode: both;
}
.music .gou{position:absolute;top:0px;right:0px;width:72px;height:79px;}

/* Loading */
.loading{position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:123567231;background:#212121;}
.loading .roundSpinner {margin: 400px auto 0;width: 150px;text-align: center;}
.loading .roundSpinner > div {
	width: 30px;height: 30px;background-color: #fff;border-radius: 100%;display: inline-block;
	-webkit-animation: bouncedelay 1.4s infinite ease-in-out;
	animation: bouncedelay 1.4s infinite ease-in-out;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
.loading .roundSpinner .bounce1 {-webkit-animation-delay: -0.32s;animation-delay: -0.32s;}
.loading .roundSpinner .bounce2 {-webkit-animation-delay: -0.16s;animation-delay: -0.16s;}
@-webkit-keyframes bouncedelay {
	0%, 80%, 100% { -webkit-transform: scale(0.0) }
	40% { -webkit-transform: scale(1.0) }
}
@-webkit-keyframes bouncedelay {
	0%, 80%, 100% {
		transform: scale(0.0);
		-webkit-transform: scale(0.0);
	} 40% {
		transform: scale(1.0);
		-webkit-transform: scale(1.0);
	}
}

/* 动画 */
@-webkit-keyframes rotate{
	0%{ -webkit-transform: rotate(0deg) ;opacity: .8;}
	100%{ -webkit-transform: rotate(360deg) ;opacity: 1;}
}
@-webkit-keyframes rotate1{
	0%{ -webkit-transform: rotate(0deg) ;}
	100%{ -webkit-transform: rotate(360deg) ;}
}
@-webkit-keyframes hand{
	0%{ -webkit-transform: translate3d(0px, 0px, 0px) ;opacity: .3;}
	50%{ -webkit-transform: translate3d(20px, -20px, 0px) ;opacity: 1;}
	100%{ -webkit-transform: translate3d(0px, 0px, 0px) ;opacity: .3;}
}
@-webkit-keyframes scale{
	0%{ -webkit-transform: scale3d(1, 1, 1) ;opacity: 1;}
	50%{ -webkit-transform: scale3d(2, 2, 2) ;opacity: .5;}
	100%{ -webkit-transform: scale3d(1, 1, 1) ;opacity: 1;}
}
@-webkit-keyframes scale12{
	0%{ -webkit-transform: scale3d(1.2, 1.2, 1.2);}
	100%{ -webkit-transform: scale3d(1, 1, 1);}
}
@-webkit-keyframes scale3{
	0%{ -webkit-transform: scale3d(1, 1, 1);opacity: 1;}
	100%{ -webkit-transform: scale3d(1.5, 1.5, 1.5);opacity: 0;}
}
@-webkit-keyframes scale4{
	0%{ -webkit-transform: scale3d(1, 1, 1) ;opacity: 1;}
	50%{ -webkit-transform: scale3d(1.1, 1.1, 1.1) ;opacity: .8;}
	100%{ -webkit-transform: scale3d(1, 1, 1) ;opacity: 1;}
}
@-webkit-keyframes scale12fadeOut{
	0%{ -webkit-transform: scale3d(1.2, 1.2, 1.2);opacity: 1;}
	100%{ -webkit-transform: scale3d(1, 1, 1);opacity: 0;}
}
@-webkit-keyframes godown{
	0%{ -webkit-transform: translate3d(0px, -300px, 0px) ;opacity: 0;}
	100%{ -webkit-transform: translate3d(0px, 0px, 0px) ;opacity: 1;}
}
@-webkit-keyframes fadein{
	0%{ opacity: 0;}
	100%{ opacity: 1;}
}
@-webkit-keyframes fadeOut{
	0%{ opacity: 1;}
	100%{ opacity: 0;}
}
@-webkit-keyframes rollIn {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
		transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
	}
	100% {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@-webkit-keyframes lightSpeedIn {
	0% {
		-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
		transform: translate3d(100%, 0, 0) skewX(-30deg);
		opacity: 0;
	}
	60% {
		-webkit-transform: skewX(20deg);
		transform: skewX(20deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: skewX(-5deg);
		transform: skewX(-5deg);
		opacity: 1;
	}
	100% {
		-webkit-transform: none;
		transform: none;
		opacity: 1;
	}
}
@-webkit-keyframes bounceIn {
	0%, 20%, 40%, 60%, 80%, 100% {
		-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
		transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
	}
	0% {
		opacity: 0;
		-webkit-transform: scale3d(.3, .3, .3);
		transform: scale3d(.3, .3, .3);
	}
	20% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1);
		transform: scale3d(1.1, 1.1, 1.1);
	}
	40% {
		-webkit-transform: scale3d(.9, .9, .9);
		transform: scale3d(.9, .9, .9);
	}
	60% {
		opacity: 1;
		-webkit-transform: scale3d(1.03, 1.03, 1.03);
		transform: scale3d(1.03, 1.03, 1.03);
	}
	80% {
		-webkit-transform: scale3d(.97, .97, .97);
		transform: scale3d(.97, .97, .97);
	}
	100% {
		opacity: 1;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
/*@-webkit-keyframes line1{
	0%{ -webkit-transform: translate3d(0px, 100px, 0px) ;opacity: 0;}
	100%{ -webkit-transform: translate3d(0px, 0px, 0px) ;opacity: 1;}
}
@-webkit-keyframes line2{
	0%{ -webkit-transform: translate3d(0px, -100px, 0px) ;opacity: 0;}
	100%{ -webkit-transform: translate3d(0px, 0px, 0px) ;opacity: 1;}
}*/
/*@-webkit-keyframes line1{
	0%{ opacity: 1;}
	50%{ opacity: .5;}
	100%{ opacity: 1;}
}
@-webkit-keyframes line2{
	0%{ opacity: 1;}
	50%{ opacity: .5;}
	100%{ opacity: 1;}
}*/
@-webkit-keyframes line1{
	0%{ -webkit-transform: translate3d(-300px, 0px, 0px);opacity: 0;}
	100%{ -webkit-transform: translate3d(0px, 0px, 0px);opacity: 1;}
}
@-webkit-keyframes line2{
	0%{ -webkit-transform: translate3d(300px, 0px, 0px);opacity: 0;}
	100%{ -webkit-transform: translate3d(0px, 0px, 0px);opacity: 1;}
}

/* 金币 */
.flakeList{position:absolute;top:260px;left:0px;width:100%;z-index: 50;}
.flake{
	width: 50px; height:50px;
	transform: translateZ(0);
	position: absolute;
	-webkit-animation-fill-mode: forwards; 
	-webkit-animation-direction: alternate; 
	-webkit-animation-iteration-count: infinite; 
	-webkit-animation-timing-function: ease-in-out;
}
/*金币动画*/
.flakeAm{
	-webkit-animation: flakeAm 5s steps(60) infinite; 
    animation: flakeAm 5s steps(60) infinite; 
}
@-webkit-keyframes flakeAm {
	0% {background-position: 0px 0px;}
	100% {background-position: -3000px 0px; }
}

/* 图片遮罩 */
.saoguang{
	-webkit-mask: url(images/mask.png);
	-webkit-mask-size: 600px 280px;
	-webkit-mask-position: -600px 0px;
	-webkit-mask-repeat: no-repeat;
}
.saoguang2{
	-webkit-mask: url(images/mask.png);
	-webkit-mask-size: 600px 280px;
	-webkit-mask-position: 600px 0px;
	-webkit-mask-repeat: no-repeat;
}
/* 遮罩动画帧 */
@-webkit-keyframes txtMaskShine {
	0% { -webkit-mask-position: -600px 0px; opacity: 0;}
	100% {-webkit-mask-position: 500px 0px; opacity: 1;}
}
@-webkit-keyframes txtMaskShine2 {
	0% { -webkit-mask-position: 600px 0px; opacity: 0;}
	100% {-webkit-mask-position: -500px 0px; opacity: 1;}
}

/* fuben */
.fuben{z-index:12;overflow:hidden;display:none;}

/* welcome */
.welcome{z-index:12;overflow:hidden;}
.welcome .topon{
	-webkit-animation: top 2s both;
}
@-webkit-keyframes top{
	0%{ -webkit-transform: translate3d(0px, 0px, 0px);opacity: 1;}
	100%{ -webkit-transform: translate3d(0px, -800px, 0px);opacity: 1;}
}
.welcome .btmon{
	-webkit-animation: btm 2s both;
}
@-webkit-keyframes btm{
	0%{ -webkit-transform: translate3d(0px, 0px, 0px);opacity: 1;}
	100%{ -webkit-transform: translate3d(0px, 800px, 0px);opacity: 1;}
}
.welcome .top{position:absolute;top:0px;left:0px;z-index:11;opacity:0;}
.welcome .btm{position:absolute;bottom:0px;left:0px;z-index:11;opacity:0;}

/* 1 */
@-webkit-keyframes p1title{
	0%{ -webkit-transform: translate3d(0px, 300px, 0px) scale3d(0, 0, 0);opacity: 0;}
	50%{ -webkit-transform: translate3d(0px, 0px, 0px) scale3d(1.3, 1.3, 1.3);opacity: 1;}
	100%{ -webkit-transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1);opacity: 1;}
}
@-webkit-keyframes ico{
	0%{ -webkit-transform: scale3d(0, 0, 0);opacity: 0;}
	50%{ -webkit-transform: scale3d(1.5, 1.5, 1.5);opacity: 1;}
	100%{ -webkit-transform: scale3d(1, 1, 1);opacity: 1;}
}
@-webkit-keyframes line{
	0%{ -webkit-transform: scale3d(0, 0, 0);opacity: 0;}
	100%{ -webkit-transform: scale3d(1, 1, 1);opacity: 1;}
}
.page1 .mask{z-index:20;}
.page1 .p1{position:absolute;top:150px;left:0px;width:100%;text-align:center;z-index:10;}
.page1 .p2{position:absolute;top:540px;left:220px;z-index:10;}
.page1 .p3{position:absolute;top:390px;left:210px;z-index:10;}
.page1 .p4{position:absolute;top:0px;left:0px;text-align:center;z-index:1;}
.page1 .ico div{position:absolute;z-index:2;}
.page1 .ico div.i1{top:140px;left:30px;}
.page1 .ico div.i2{top:80px;left:400px;}
.page1 .ico div.i3{top:245px;left:500px;}
.page1 .ico div.i4{top:510px;left:20px;}
.page1 .ico div.i5{top:520px;left:550px;}
.page1 .ico div.i6{top:780px;left:50px;}
.page1 .ico div.i7{top:750px;left:450px;}
.page1 .ico div.i8{top:900px;left:262px;}
.page1 .line div{position:absolute;z-index:1;}
.page1 .line div.l1{top:80px;left:480px;}
.page1 .line div.l2{top:90px;left:80px;}
.page1 .line div.l3{top:590px;left:120px;}
.page1 .line div.l4{top:600px;left:500px;}
.page1 .line div.l5{top:800px;left:120px;}
.page1 .line div.l6{top:200px;left:100px;}
.page1 .line div.l7{top:500px;left:320px;}
.page1 .line div.l8{top:160px;left:40px;}
.page1 .line div.l9{top:130px;left:60px;}
.page1 .line div.l10{top:100px;left:200px;}
.page1 .line div.l11{top:260px;left:90px;}
.page1 .p5{position:absolute;bottom:20px;left:0px;width:100%;text-align:center;z-index:10;}


/* 2 */
.page2 .l1{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page2 .l11{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:11;}
.page2 .l2{position:absolute;top:230px;left:0px;width:100%;text-align:center;z-index:10;}
.page2 .l21{position:absolute;top:230px;left:0px;width:100%;text-align:center;z-index:11;}
.page2 .p1{position:absolute;top:100px;left:0px;width:100%;text-align:center;z-index:10;}
.page2 .arc{position:absolute;top:330px;left:240px;z-index:5;}
.page2 .p2{position:absolute;top:360px;left:173px;z-index:10;}
.page2 .p3{position:absolute;top:285px;left:190px;z-index:1;}
.page2 .p4{position:absolute;bottom:170px;left:0px;width:100%;text-align:center;z-index:10;}
.page2 .p5{position:absolute;bottom:50px;left:0px;width:100%;text-align:center;z-index:10;}


/* 3 */
.page3 .l1{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page3 .l11{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page3 .l2{position:absolute;top:230px;left:0px;width:100%;text-align:center;z-index:10;}
.page3 .l21{position:absolute;top:230px;left:0px;width:100%;text-align:center;z-index:10;}
.page3 .p1{position:absolute;top:100px;left:0px;width:100%;text-align:center;z-index:10;}
@-webkit-keyframes xuanfu{
	0%{-webkit-transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1);}
	50%{-webkit-transform: translate3d(0px, 30px, 0px) scale3d(1.05, 1.05, 1.05);}
	100%{-webkit-transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1);}
}
.page3 .p2{position:absolute;top:300px;left:0px;width:100%;text-align:center;z-index:10;}
.page3 .p3{position:absolute;bottom:150px;left:0px;width:100%;text-align:center;z-index:10;}
.page3 .p4{position:absolute;bottom:30px;left:0px;width:100%;text-align:center;z-index:10;}


/* 4 */
@-webkit-keyframes road{
	0%{ opacity: 0;}
	79%{ opacity: 1;}
	80%{ opacity: 1;}
	90%{ opacity: 1;}
	100%{ opacity: 0;}
}
@-webkit-keyframes qiu{
	0%{-webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);}
	10%{-webkit-transform: translate3d(0px, 100px, 0px) rotate(360deg);}
	30%{-webkit-transform: translate3d(350px, 60px, 0px) rotate(720deg);}
	35%{-webkit-transform: translate3d(420px, 100px, 0px) rotate(900deg);}
	45%{-webkit-transform: translate3d(420px, 200px, 0px) rotate(1080deg);}
	55%{-webkit-transform: translate3d(370px, 270px, 0px) rotate(900deg);}
	60%{-webkit-transform: translate3d(320px, 250px, 0px) rotate(720deg);}
	70%{-webkit-transform: translate3d(230px, 180px, 0px) rotate(360deg);}
	85%{-webkit-transform: translate3d(170px, 80px, 0px) rotate(180deg);}
	95%{-webkit-transform: translate3d(70px, 10px, 0px) rotate(90deg);}
	100%{-webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);}
}
@-webkit-keyframes fudong{
	0%{-webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);}
	50%{-webkit-transform: translate3d(0px, 20px, 0px) rotate(-1deg);}
	100%{-webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);}
}
.page4 .l1{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page4 .l11{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page4 .l2{position:absolute;top:250px;left:0px;width:100%;text-align:center;z-index:10;}
.page4 .l21{position:absolute;top:250px;left:0px;width:100%;text-align:center;z-index:10;}
.page4 .p1{position:absolute;top:100px;left:0px;width:100%;text-align:center;z-index:10;}
.page4 .p2{position:absolute;top:380px;left:0px;width:100%;text-align:center;z-index:5;}
.page4 .p21{position:absolute;top:480px;left:178px;z-index:20;}
.page4 .p3{position:absolute;top:380px;left:70px;z-index:10;}
.page4 .p4{position:absolute;bottom:130px;left:0px;width:100%;text-align:center;z-index:10;}
.page4 .p5{position:absolute;bottom:50px;left:0px;width:100%;text-align:center;z-index:10;}

/* 5 */
.page5 .l1{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page5 .l11{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page5 .l2{position:absolute;top:195px;left:0px;width:100%;text-align:center;z-index:10;}
.page5 .l21{position:absolute;top:195px;left:0px;width:100%;text-align:center;z-index:10;}
.page5 .p1{position:absolute;top:100px;left:0px;width:100%;text-align:center;z-index:10;}
.page5 .love{position:absolute;top:350px;left:50%;width:490px;height:468px;margin-left:-245px;z-index:10;}
.page5 .love div{position:absolute;}
.page5 .love div.a1{top:0px;left:0px;z-index:10;}
.page5 .love div.a2{top:93px;left:80px;z-index:9;}
.page5 .love div.a3{top:105px;left:205px;z-index:8;}
.page5 .love div.a4{top:140px;left:250px;z-index:7;}
.page5 .love div.a5{top:182px;left:255px;z-index:6;}
.page5 .love div.a6{top:185px;left:170px;z-index:5;}
.page5 .love div.a7{top:300px;left:200px;z-index:4;}
.page5 .love div.a8{top:0px;right:0px;z-index:3;}
.page5 .love div.a9{bottom:50px;right:80px;z-index:2;}
.page5 .p2{position:absolute;top:380px;left:0px;width:100%;text-align:center;z-index:10;}
.page5 .p3{position:absolute;bottom:10px;left:0px;width:100%;text-align:center;z-index:10;}

/* 6 */
.page6 .l1{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page6 .l11{position:absolute;top:30px;left:0px;width:100%;text-align:center;z-index:10;}
.page6 .l2{position:absolute;top:245px;left:0px;width:100%;text-align:center;z-index:10;}
.page6 .l21{position:absolute;top:245px;left:0px;width:100%;text-align:center;z-index:10;}
.page6 .p1{position:absolute;top:100px;left:0px;width:100%;text-align:center;z-index:10;}
@-webkit-keyframes shan{
	0%{opacity: 0;}
	35%{opacity: 0;}
	40%{opacity: 1;}
	45%{opacity: 0;}
	55%{opacity: 1;}
	70%{opacity: 0;}
	100%{opacity: 0;}
}
.page6 .gomap{position:absolute;top:732px;left:82px;width:235px;height:91px;z-index:30;}
.page6 .guanzhu{position:absolute;top:732px;left:327px;width:235px;height:91px;z-index:30;}
.page6 .p2{position:absolute;top:340px;left:0px;width:100%;text-align:center;z-index:10;}
.page6 .p3{position:absolute;bottom:10px;left:0px;width:100%;text-align:center;z-index:10;}