﻿/*-----------------------------全局样式-------------------------------------*/
dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,span,a,input,textarea,p,blockquote,th,td,header,nav,footer,article,section,aside,time,figure{margin:0;padding:0;-webkit-tap-highlight-color:rgba(0,0,0,0)}
h1,h2,h3,h4,h5,h6{font-size:14px;font-weight:normal}
ul{list-style:none}
legend{display:none}
fieldset,img{border:none;vertical-align:middle}
em,cite,i{font-style:normal}
input,button,textarea{outline:none;border:0;vertical-align:middle;border:0;font-family:Microsoft YaHei}
input[type="submit"],input[type="reset"],input[type="button"],button {-webkit-appearance:none;border-radius:0}
select{-webkit-appearance:none;-moz-appearance:none;appearance:none}
textarea{resize:none}
html{height:100%;-webkit-text-size-adjust:none;overflow:hidden}
body{font:12px/18px Microsoft YaHei;position:relative;margin:0 auto;color:#000;min-width:320px;word-break:break-all;height:100%;overflow:hidden;max-width:640px}
body a{color:#000;text-decoration:none;cursor:pointer}
body a:hover,body a:active,body a:focus{text-decoration:none;outline:none}
/*-----------------------------动画-------------------------------------*/
.swiper-container{overflow:hidden;width:100%;height:100%;position:absolute;left:0;top:0;max-width:640px;right:0;margin:auto;background:url('../images/bg.png') no-repeat;}
.swiper-wrapper{height:100%;overflow:hidden}
.swiper-slide{width:100%;height:100%;overflow:hidden;position:relative;float:left}
.button{position:absolute;background-image:url(../images/button.png);background-repeat:no-repeat;background-size:171px;text-indent:-9999px}
.loading{position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden;background:#3c9ffc;z-index:200}
.logo00{position: absolute;left: 32%;top: 18%;width: 35%;}
.percent{height:30px;line-height:30px;font-size:20px;color:#fff;position:absolute;top:50%;left:0;text-align:center;right:0;margin:auto;white-space:nowrap;font-family:'Broadway';text-shadow:#1f7ce6 1px 1px 0}
.percent-line{position:absolute;top:50%;height:1px;left:0;margin:auto;background-color: #fff;background-size:100%;-webkit-transition:width 0.3s linear;transition:width 0.3s linear}
.animate{opacity:0}
/*-----------------------------首屏-------------------------------------*/

img{width: 100%;}

.con{width: 80%;height: 80%;margin-left: 10%;margin-top: 10%;position: relative;}

.logo0{position: absolute;left: 32%;top: 8%;width: 35%;}
.t01{position: absolute;top: 38%;width: 60%;left: 20%;}
/*1*/
.t11{position: absolute;top: 20px;width: 80%;left: 10%;}
.t12{position: absolute;bottom: 70px;width: 60%;left: 20%;}
.btn11{position: absolute;width: 23%;right: 30px;top: 17%;}
.btn12{position: absolute;width: 23%;right: 30px;top: 32%;}
.btn13{position: absolute;width: 23%;right: 30px;top: 47%;}

/* 2 */
.bg2{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 1;z-index: 9;}


/* 5 */
.logo{position: absolute;left: 32%;top: 5%;width: 35%;}
.t51{position: absolute;width: 80%;top: 27%;left: 10%;}
.t52{position: absolute;width: 50%;top: 37%;left: 25%;}
.t53{position: absolute;width: 80%;top: 47%;left: 10%;}

.btn51{position: absolute;width: 78%;top: 56%;left: 11%;}
.btn52{position: absolute;width: 78%;top: 66%;left: 11%;}
.btn53{position: absolute;width: 78%;top: 76%;left: 11%;}



.go-next{width: 20%;position: absolute;right: 30px;bottom: 20px;z-index: 9;
	opacity: 0.1;
	/* IE10、Firefox and Opera，IE9以及更早的版本不支持 */
	animation-name: breath;
	animation-duration: 3s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;

	-webkit-animation-name: breath;
	-webkit-animation-duration: 3s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
}
@keyframes breath {
	from { opacity: 0.1; }
	50%  { opacity:   1; }
	to   { opacity: 0.1; }
}
@-webkit-keyframes breath {
	from { opacity: 0.1; }
	50%  { opacity:   1; }
	to   { opacity: 0.1; }
}


@media screen and (max-height:504px){
	.t12{position: absolute;bottom: 50px;width: 60%;left: 20%;}
}
@media screen and (max-height:469px){
	.con{width: 75%;height: 80%;margin-left: 12.5%;margin-top: 5%;position: relative;}
	.t11{position: absolute;top: 10px;width: 80%;left: 10%;}
	.t12{position: absolute;bottom: 40px;width: 60%;left: 20%;}
	.btn11{position: absolute;width: 23%;right: 20px;top: 18%;}
	.btn12{position: absolute;width: 23%;right: 20px;top: 32%;}
	.btn13{position: absolute;width: 23%;right: 20px;top: 46%;}

	/* 5 */
	.logo{position: absolute;left: 32%;top: 5%;width: 35%;}
	.t51{position: absolute;width: 80%;top: 25%;left: 10%;}
	.t52{position: absolute;width: 50%;top: 36%;left: 25%;}
	.t53{position: absolute;width: 80%;top: 44%;left: 10%;}

	.btn51{position: absolute;width: 78%;top: 54%;left: 11%;}
	.btn52{position: absolute;width: 78%;top: 65%;left: 11%;}
	.btn53{position: absolute;width: 78%;top: 76%;left: 11%;}
	.go-next{width: 20%;position: absolute;right: 30px;bottom: 10px;z-index: 9;}
}

@media screen and (max-height:416px){
	.con{width: 75%;height: 80%;margin-left: 12.5%;margin-top: 5%;position: relative;}
	.t11{position: absolute;top: 20px;width: 80%;left: 10%;}
	.t12{position: absolute;bottom: 0px;width: 60%;left: 20%;}
	.btn11{position: absolute;width: 23%;right: 20px;top: 18%;}
	.btn12{position: absolute;width: 23%;right: 20px;top: 36%;}
	.btn13{position: absolute;width: 23%;right: 20px;top: 54%;}

	/* 5 */
	.logo{position: absolute;left: 32%;top: 5%;width: 35%;}
	.t51{position: absolute;width: 80%;top: 28%;left: 10%;}
	.t52{position: absolute;width: 50%;top: 41%;left: 25%;}
	.t53{position: absolute;width: 80%;top: 53%;left: 10%;}

	.btn51{position: absolute;width: 78%;top: 66%;left: 11%;}
	.btn52{position: absolute;width: 78%;top: 77%;left: 11%;}
	.btn53{position: absolute;width: 78%;top: 88%;left: 11%;}
	.go-next{width: 20%;position: absolute;right: 30px;bottom: 10px;z-index: 9;}
}

@media screen and (min-width:360px){}
@media screen and (min-width:375px){}
@media screen and (min-width:384px) and (max-height: 580px){
	.logo0{position: absolute;left: 32%;top: 8%;width: 35%;}
	.t01{position: absolute;top: 35%;width: 60%;left: 20%;}
	.con{width: 75%;height: 80%;margin-left: 12.5%;margin-top: 5%;position: relative;}
	.t11{position: absolute;top: 20px;width: 80%;left: 10%;}
	.t12{position: absolute;bottom: 60px;width: 60%;left: 20%;}
	.btn11{position: absolute;width: 23%;right: 30px;top: 16%;}
	.btn12{position: absolute;width: 23%;right: 30px;top: 31%;}
	.btn13{position: absolute;width: 23%;right: 30px;top: 46%;}

	/* 5 */
	.logo{position: absolute;left: 32%;top: 5%;width: 35%;}
	.t51{position: absolute;width: 80%;top: 25%;left: 10%;}
	.t52{position: absolute;width: 50%;top: 36%;left: 25%;}
	.t53{position: absolute;width: 80%;top: 45%;left: 10%;}

	.btn51{position: absolute;width: 78%;top: 55%;left: 11%;}
	.btn52{position: absolute;width: 78%;top: 65%;left: 11%;}
	.btn53{position: absolute;width: 78%;top: 75%;left: 11%;}
	.go-next{width: 20%;position: absolute;right: 30px;bottom: 10px;z-index: 9;}
}
@media screen and (min-width:414px){\
	.btn11{right: 20px;top: 18%;}
	.btn12{right: 30px;top: 31%;}
	.btn13{right: 30px;top: 46%;}
}



.focus,.shares{
	position: absolute;top: 0;left: 0;z-index: 99;display: none;
	img{width: 100%;height: 100%;}
}
.overly{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.9);z-index: 88;display: none;}