body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,legend,button,input,textarea,th,td,html{margin:0;padding:0;}
img{ width:100%; border:0;}a{text-decoration:none; color:#333;}
a,button,button:active,input,span,label{ -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent;}
html,body{ -webkit-font-smoothing:antialiased; font-family: Helvetica, STHeiTi, sans-serif; font-size:16px; line-height:1.6; -webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased; }
ul,ol{list-style: none;}
.flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
.flex-v{-webkit-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
.flex-u{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;}
.flex-align-center{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;}
.flex-pack-center{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}
.flex-pack-justify{-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}
.btn{ box-sizing:border-box; display:inline-block; vertical-align:middle; margin:0 .2rem; padding:0 .5rem; min-width:1.8rem; height:.8rem; line-height:.8rem; font-size:.32rem; color:#333; text-align:center; border-radius:.8rem; background-clip:padding-box; background-color:#ffd500;}
.btn:active{ background-color:#f3cb00;}

body{ background: #fff; padding-bottom: 1.33rem;}
.header { height:.8rem; overflow: hidden; position: relative;}
.header .logo{ width: .47rem; height: .47rem; position: absolute; top: .16rem; left: .2rem;}
.header .logo img{ width:100%; margin: 0;}
.header .btn-top{ background: #3a7cf7; border-radius:50rem; color: #fff; text-align: center; font-size: .2rem; width: .93rem; height: .44rem; line-height: .44rem; position: absolute; top: .18rem; right: .2rem; }

.banner{ background: url("../img/bg-banner.png") no-repeat; background-size: cover; width: 100%; height: 5.08rem; }
.ban-txt{ color: #464d5d; text-align: center; padding-top: .8rem; }
.ban-txt > h2{ font-size: .85rem; line-height: .85rem;}
.ban-txt > p{ font-size: .26rem; line-height: .26rem; margin-top: .2rem; }
.ban-item{ text-align: center; margin-top: 1rem; }
.ban-item ul li{ font-size: .185rem; display: inline-block; color: #464d5d; padding-right: .26rem;}
.ban-item ul li:last-child{ padding: 0; }
.ban-item ul li:before{background: url("../img/ico-safe.png") no-repeat; background-size: cover; content: ""; display:inline-block;  vertical-align: middle; width: .38rem; height: .38rem; margin-right: .1rem; }

.btn-wp{text-align: center; padding-top: .35rem; }
.btn-wp a{ display: inline-block; width:2rem; height: .82rem; line-height: .82rem; border-radius: 50px; color: #fff; padding-left: .7rem; overflow: hidden; position: relative; font-size: .27rem;  }
/* .btn-wp a:first-child{ margin-right: .6rem; } */
.btn-wp a:before{content: "";  width: .56rem; height: .56rem; position: absolute; left:.4rem; top: .12rem; }
.btn-wp .btn-adr:before{background: url("../img/ico-adr.png") no-repeat; background-size: cover;}
.btn-wp .btn-ios:before{background: url("../img/ico-ios.png") no-repeat; background-size: cover;}
.btn-adr{ background: #3a7cf7; }
.btn-ios{ background: #464d5d; }

.btn-wp .def:before{background: url("../img/ico-adr.png") no-repeat; background-size: cover;}
.def{ background: #3a7cf7; }

.btn-wp .oppo:before{background: url("../img/oppo.png") no-repeat; background-size: cover;}
.oppo{ background: #3a7cf7; }

.btn-wp .huawei:before{background: url("../img/huawei.png") no-repeat; background-size: cover;}
.huawei{ background: #3a7cf7; }

.btn-wp .meizu:before{background: url("../img/meizu.png") no-repeat; background-size: cover;}
.meizu{ background: #3a7cf7; }

.btn-wp .xiaomi:before{background: url("../img/xiaomi.png") no-repeat; background-size: cover;}
.xiaomi{ background: #3a7cf7; }

.btn-wp .zte:before{background: url("../img/zte.png") no-repeat; background-size: cover;}
.zte{ background: #3a7cf7; }

.btn-wp .vivo:before{background: url("../img/vivo.png") no-repeat; background-size: cover;}
.vivo{ background: #3a7cf7; }


.cont01{ background: #fff;  height: 6rem;  padding-bottom: .6rem;}
.cont01 .img-wp{padding-top: .6rem;}
.cont01 .img-wp img{ width: 5.3rem; height: 3.98rem; vertical-align: top;}
.img-wp{ text-align: center; }
.img-wp img{ vertical-align: top;}
.title{ color: #3a7cf7; padding-top: .6rem; height: .7rem; overflow: hidden; text-align: center;}
.title > h2{ font-size: .45rem; line-height: .45rem;}
.title > p{ font-size: .108rem; font-weight: 200; text-transform:uppercase; letter-spacing: .04rem; margin-top: .03rem; }

.cont02{ background: #f5f5f5; height: 7.6rem; position: relative; }
.cont02 .img-wp img{ width: 6.6rem; height: 6.44rem; }
.cont02 ol.list{ color: #3a7cf7; width:3rem; position: absolute; top: 2.3rem; left: 50%; margin-left: -1.5rem;font-size: .22rem;}
.cont02 ol.list li{ letter-spacing: .06rem; }
.cont02 ol.list li:nth-child(1){height: .8rem; line-height: .85rem; text-align: left; padding-left: .75rem; }
.cont02 ol.list li:nth-child(2){height: 1.1rem; line-height: 1.2rem;  text-align: right; padding-right: .9rem;}
.cont02 ol.list li:nth-child(3){height: 1.1rem; line-height: 1rem;  text-align: left; padding-left: .9rem;}
.cont02 ol.list li:nth-child(4){height: .8rem; line-height: .7rem;  text-align: right; padding-right: .75rem;}

.cont03{ background: #fff; height: 7.6rem; position: relative; }
.cont03 .img-wp img{ width: 7.5rem; height: 5.65rem; }
.cont03 ol.list{ color: #fff; width:7.24rem; position: absolute; top: 3.82rem; left: 50%; margin-left: -3.62rem;font-size: .22rem; display: -webkit-flex; display: flex; align-items: center;}
.cont03 ol.list li{ flex-wrap: nowrap; width: 1.85rem; margin-left: .5rem; }
.cont03 ol.list li h3{ font-size: .185rem; }
.cont03 ol.list li p{ font-size: .14rem; line-height: .21rem; -webkit-transform:scale(0.8,0.8); -webkit-text-size-adjust:none; }

.cont04{ background: #f5f5f5; height: 6.02rem; position: relative; }
.cont04 .img-wp {width: 7.5rem; margin: .36rem auto 0; position: relative; }
.cont04 .img-wp .img-txt{ position: relative;z-index: 2;  padding-left: 1.53rem;}
.cont04 .img-wp .img-txt .list{ font-size: 0; }
.cont04 .img-wp .txt-list{ position: absolute; top: .8rem; left: 0; z-index: 1; width: 1.33rem; padding-left: .20rem;}
.cont04 .img-wp .txt-list li{ border-bottom: #b6b6b6 solid 1px; color: #464d5d; text-align: left; font-size: .17rem; font-weight: bold; height: .5rem; line-height: .7rem; overflow: hidden; }
.cont04 ol.list{ color: #fff; width: 5.6rem;text-align: center;}
.cont04 ol.list >li{ background: url("../img/cont04.png") no-repeat; background-size: cover;display: inline-block; width: 1.6rem; height: 3.58rem; margin-right: .4rem; overflow: hidden; }
.cont04 ol.list >li:last-child{ margin-right:0;}
.cont04 ol.list >li h3{ font-size: .245rem; margin-top: .35rem; line-height: .35rem;  width: 1.6rem;  height: .83rem; }
.cont04 ol.list >li p{ font-size: .14rem; line-height: .21rem; }
.cont04 ol.list >li >ul >li{ height: .49rem; line-height: .49rem; font-size:.17rem; }
.cont04 ol.list >li >ul >li img{ width: .25rem; height: .25rem; vertical-align: middle; }

.cont05{ background: #fff; height: 6.95rem; position: relative; }
.cont05 .img-wp img{ width: 7.5rem; height: 5.6rem; }

.cont06{ background: #fff; height: 5.5rem; position: relative; }
.cont06 .img-wp {padding-top: .2rem;}
.cont06 .img-wp img{ width: 6.92rem; height: 3.42rem; }

.footer{ background: #464d5d; height: .83rem; padding-top: .2rem; text-align: center; }
.footer p{ color: #fff; font-size: .22rem; line-height: .28rem;}

.fixed-btn{ position: fixed; left: 0; right: 0; bottom: 0; z-index: 10; height: 1.33rem;}
.fixed-btn .opc-bg{ background: #fff; content: ""; position: absolute; left: 0; top: 0; right: 0; z-index: 1; opacity: .5; width: 100%; height: 100%; }
.fixed-btn .btn-wp{ position: relative; z-index: 2; height: 1.33rem; padding-top: .25rem; }