html, body { position: relative; height: 100%; min-width: 1000px; }
.swiper-container { width: 100%; height: 100%; }
.swiper-container .swiper-pagination { right: 25px; }
.swiper-container .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background: #fff; opacity:0.7; margin:20px 0; }
.swiper-container .swiper-pagination .swiper-pagination-bullet-active { width:30px; height: 30px; background: url("../images/pagination-active.png") no-repeat; margin-left: -10px;border-radius:0; }
.swiper-container .swiper-slide { position: relative; }
.page1 { background: url("../images/page1.jpg") no-repeat top center; background-size: cover; }
.page1 .particle { width: 1566px; height: 855px; background: url("../images/particle.png") no-repeat top center; background-size: cover; position: fixed; top: 50%; left: 50%; margin-top: -427px; margin-left: -783px; transition: transform 2s; -webkit-transition: -webkit-transform 2s; }
.page1 .p1_con { width: 936px; padding: 0 32px; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 0); -webkit-ransform: translate(-50%, 0); z-index: 9; }
.page1 .p1_con .p1_phone { float:right; }
.page1 .p1_con .p1_phone img{ vertical-align:middle;}
.page1 .p1_con .p1_main { float: left; width: 374px; padding-left:70px }
.page1 .p1_con .title { margin-top:100px; text-align: center; }
.page1 .p1_con .title img { animation-delay: 2.3s; }
.page1 .p1_con .title .logo { margin: 0 auto; animation-delay: 1s; }
.page1 .p1_con .download { margin-top:30px; text-align:center; }
.page1 .p1_con .download img { vertical-align: top; }
.page1 .p1_con .download img:hover { opacity: 0.8; }
.page1 .p1_con .download .erweima {animation-delay: 1s; }
.page1 .p1_con .download .version {animation-delay: 1.3s; font-size:14px; color:#fff;}
.page1 .p1_con .download .and { margin:30px 0 14px; animation-delay: 1.5s; }
.page1 .bottom { position: absolute; bottom: 0; right: -150px; z-index: 9; }

.page2 { background: url("../images/page2.png") no-repeat top center; background-size: cover; }
.page2 .p2_con { width: 936px; height: 630px; padding: 0 32px; position: absolute; top: 50%; left: 50%; margin-top: -275px; margin-left: -500px; z-index: 9; }
.page2 .p2_con .p2_main { float:right; width:350px; margin-left: 32px; }
.page2 .p2_con .p2_main .p2_xing { position: relative; }
.page2 .p2_con .p2_phone { float:left; position: relative; width:485px; }
.page2 .p2_s2 { position: absolute; top:50%; left:50px; margin-top:-42px; }
.page2 .p2_z3 { position: absolute; top:51%; left:74px; }
.page2 .p2_z4 { position: absolute; top:65%; left:0; }
.page2 .p2_star { position: absolute; top:22%; left:444px; }
.page2 .p2_s6 { position: absolute;top:88%; left:464px; }
.page2 .p2_s7 { position: absolute; top:15%; left:444px; }
.page2 .p2_txt { margin-top:40px;}
.page2 .p2_big{ position:absolute; top:50%; margin-top:100px; right:100px;}

.page3 { background: url("../images/page3.png") no-repeat top center; background-size: cover; }
.page3 .p3_con { width: 936px; height: 630px; padding: 0 32px; position: absolute; top: 50%; left: 50%; margin-top: -275px; margin-left: -500px; z-index: 9; }
.page3 .p3_con .p3_phone { float:right; width:350px; position:relative; margin-right:120px; }
.page3 .p3_con .p3_main { float:left; position:relative;width:400px; padding-left:60px;margin-top:100px;}
.page3 .p3_con .p3_main .p3_xing { overflow: hidden; }
.page3 .p3_con .p3_main .p3_xing img { float: right; }
.page3 .p3_1 { position: absolute; top:50%; right:-20px; margin-top:-350px; }
.page3 .p3_2 { position: absolute; top:50%; left:0px;  margin-top:-330px;}
.page3 .p3_s3 { position: absolute; top:50%; right:54px; margin-top:-216px; }
.page3 .p3_z4 { position: absolute; top:50%; right:0; margin-top:-220px; }
.page3 .p3_s5 { position: absolute;top:50%; right:0px; margin-top:-170px; }
.page3 .p3_s6 { position: absolute;top:50%; right:-10px; margin-top:130px;}
.page3 .p3_z7 { position: absolute; top:50%; left:50%; margin:120px 0 0 50px }
.page3 .p3_s8 { position: absolute; top:50%; left:50%; margin:150px 0 0 25px }
.page3 .p3_s9 { position: absolute;top:50%; right:30px; margin-top:160px;}
.page3 .p3_z10 { position: absolute;top:50%; right:25px; margin-top:215px; }
.page3 .p3_z11 { position: absolute;top:50%; left:50%;margin:60px 0 0 -135px }
.page3 .p3_z12 { position: absolute;top:50%; left:50%;margin:230px 0 0 -385px }
.page3 .p3_big{ position:absolute; top:60%; left:170px;}

.page4 { background: url("../images/page4.png") no-repeat top center; background-size: cover; }
.page4 .p4_con { width: 936px; height: 630px; padding: 0 32px; position: absolute; top: 50%; left: 50%; margin-top: -275px; margin-left: -500px; z-index: 9; }
.page4 .p4_con .p4_main { float:right; width: 417px; position: relative; margin-top:70px;}
.page4 .p4_con .p4_main .p4_xing { overflow: hidden; position: relative; }
.page4 .p4_con .p4_phone { float: left; position: relative; width: 374px; }
.page4 .p4_1 { position: absolute; top:50%; left:0px; margin-top:-350px; }
.page4 .p4_2 { position: absolute; top:50%; right:120px;  margin-top:-340px;}
.page4 .p4_3s { position: absolute; top:50%; left:50%;margin:-286px 0 0 -55px; }
.page4 .p4_4s { position: absolute; top:50%;left:50%;margin:-56px 0 0 -460px; }
.page4 .p4_5z { position: absolute;top:50%;left:50%;margin:-20px 0 0 -430px;}
.page4 .p4_6s { position: absolute;top:50%;left:50%;margin:56px 0 0 -480px;}
.page4 .p4_7z { position: absolute; top:50%; left:50%; margin:20px 0 0 335px }
.page4 .p4_8z { position: absolute; top:50%; left:50%; margin:150px 0 0 -65px }
.page4 .p4_9s { position: absolute;top:50%; left:50%; margin:180px 0 0 105px}
.page4 .p4_10s { position: absolute;top:50%; left:50%; margin:220px 0 0 -55px }
.page4 .p4_big{ position:absolute; top:60%; right:115px;}

.page5 { background: url("../images/page5.png") no-repeat top center; background-size: cover; }
.page5 .p5_con { width: 936px; height: 630px; padding: 0 32px; position: absolute; top: 50%; left: 50%; margin-top: -275px; margin-left: -500px; z-index: 9; }
.page5 .p5_con .p5_phone { float:right; width:350px;position:relative; margin-right:100px; }
.page5 .p5_con .p5_main { float:left; position:relative;margin-top:70px; margin-left:100px;  }
.page5 .p5_con .p5_main .p5_xing { overflow: hidden; }
.page5 .p5_con .p5_main .p5_xing img { float: right; }
.page5 .p5_1 { position: absolute; top:50%;right:-20px;  margin-top:-400px; }
.page5 .p5_2 { position: absolute; top:50%; left:0px;  margin-top:-360px;}
.page5 .p5_3s { position: absolute; top:50%; right:54px; margin-top:-216px; }
.page5 .p5_4s { position: absolute; top:50%; right:30px; margin-top:160px; }
.page5 .p5_5s { position: absolute;top:50%;right:0px; margin-top:-170px; }
.page5 .p5_6z { position: absolute;top:50%;left:50%;margin:56px 0 0 -80px;}
.page5 .p5_7s { position: absolute; top:50%;  right:-10px; margin-top:130px; }
.page5 .p5_8z { position: absolute; top:50%;  right:0; margin-top:-220px;  }
.page5 .p5_9z { position: absolute;top:50%; right:25px; margin-top:215px;}
.page5 .p5_10z { position: absolute;top:50%;  left:50%; margin:120px 0 0 50px}
.page5 .p5_11s { position: absolute;top:50%;  left:50%; margin:150px 0 0 25px }
.page5 .p5_12z { position: absolute;top:50%; left:50%;margin:230px 0 0 -385px }
.page5 .p5_big{ position:absolute; top:56%; left:205px;}
.none { display: none; }
.a1 { animation-delay: 0s; position: absolute; top: 0; left:50px; }
.a2 { animation-delay: 0.5s; position: absolute; top: 73px; left:107px; }
.a3 { animation-delay:1s; position: absolute; top: 589px; left:50px; }
.opacity { opacity: 0; }
p { visibility: hidden; }
.mb10 { margin-bottom: 10px; }
.wrap { width: 1000px; margin: 0 auto; }
.top_bar { height: 60px; padding: 10px 0; background-color: #fff; position: fixed; top: 0; z-index: 9; width: 100%; }
.tb_right { line-height: 30px; float: right; padding-top: 15px; }
.tb_right a { display: inline-block; margin-right: 30px; color: #666; font-size: 16px; }
.tb_right a:hover { color: #70b5fe; }
a.down_btn { padding: 0 22px; border: 1px solid #70b5fe; border-radius: 15px; }
a.down_btn:hover { background-color: #70b5fe; color: #fff; }
.qr_btn{ background:url(images/qr.jpg) no-repeat 91px 9px; padding-right:15px;position:relative; width:88px;}
.qr_btn img{ display:none; width:99px; height:99px;border:1px solid #ddd;}
.qr_btn:hover img{ display:block; }


@media screen and (min-height: 1000px) {
.page1 .p1_con { bottom: 50%; left: 50%; transform: translate(-50%, 50%); -webkit-ransform: translate(-50%, 50%); z-index: 9; }
}
.zhuan { animation: zhuan 4s infinite linear; -webkit-animation: zhuan 4s infinite linear; }
 @keyframes zhuan {
 from {
 transform: rotate(0deg);
}
 to {
 transform: rotate(360deg);
}
}
@-webkit-keyframes zhuan {
 from {
 -webkit-transform: rotate(0deg);
}
 to {
 -webkit-transform: rotate(360deg);
}
}
.shan { animation: shan 4s infinite linear; -webkit-animation: shan 4s infinite linear; }
 @keyframes shan {
 0% {
 opacity: 0;
}
 50% {
 opacity: 1;
}
 100% {
 opacity: 0;
}
}
@-webkit-keyframes shan {
 0% {
 opacity: 0;
}
 50% {
 opacity: 1;
}
 100% {
 opacity: 0;
}
}
.bounceInUp { animation: bounceInUp 1.4s linear 2s; -webkit-animation: bounceInUp 1.4s linear 2s; }
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
/*# sourceMappingURL=index.css.map */
