.fs24{font-size: 24px;}
.fs44{font-size: 44px;}
.wrapper{
  width:1200px;margin:0 auto;
}
header{
  height:66px;background-color: #1d80df;padding: 0;
}
header .logo{
  width: 206px;height:40px;display: inline-block;
  margin-top: 13px;
  float: left;
  background: url(/Public/images/logo.png) no-repeat 0 -108px transparent;
}
header .navs{
  float: right;line-height: 66px;font-size: 16px;
}
header .navs a{
  display: inline-block;
  padding: 0 20px;color:#fff;
  text-decoration: none;
}
header .navs a.active{
  background-color: #fff;color:#1d80df;
}

.banner{
  height: 590px;position: relative;
  background: url(./images/banner_bg.jpg) no-repeat center 0 #b9cbe2;
}

.banner .b_abs{
  position: absolute;
  left:50%;top:50%;
}
.banner .logo{
    margin: -140px 0 0 -540px;
}
.banner .text{
    margin: -60px 0 0 -540px;
    color: #fff;
    font-size: 28px;
    opacity: 0.8;
}
.banner .btn{
  border-color: #fff;height: 52px;line-height: 52px;
  background-color: transparent;font-size: 18px;color:#fff;
  width:200px;text-align: left;border-radius: 5px;
}
.banner .btn:hover{
  background-color: #dfe7f2;color:#727272;
}
.banner .btn img,.banner .btn span{
  display: inline-block;
  vertical-align: middle;
  height: 35px;line-height: 35px;
}
.banner .ios{
    margin: 11px 0 0 -540px;
}
.banner .android{
    margin: 91px 0 0 -540px;
}
.banner .qrcode{
    margin: 10px 0 0 -288px;
    width: 144px;
}
.banner .hand{
    margin: -208px 0 0 100px;
}

.box{overflow: hidden;}
.white-box{background-color: #fff;}
.gray-box{background-color: #eeeeee;}
.box .wrapper{
  padding: 80px 0;position: relative;
}
.box .abs{
  position: absolute;
}
.box .z1{z-index: 1}
.box .z2{z-index: 2}
.box .z3{z-index: 3}
.box .info{font-size: 16px;}
.box .info .title{color:#1d80df;font-size: 34px;}
.box .info p{margin-top: 6px;line-height: 1.8;}

.ts-list{
  height:164px;
  font-size: 14px;
  margin: 0 80px;
}
.ts-list li{
  float:left;
  width: 240px;
  padding-left: 20px;
}
.ts-list p{position: relative;}
.ts-list .fa{
  font-size: 80px;
  color:#ddd;
}
.ts-list .fs18{
  margin:10px 0;
  color:#333;
}
.ts-list li:hover .fa,.ts-list li:hover .fs18{color:#1d80df;}


.mark{font-size: 100px;color:#ddd;font-family: "SimSun";line-height: 0;display: inline-block;position: relative;top: 30px;}

/*box1*/
.box1 .wrapper{height: 220px;}
.box1 .summary{
  font-size: 14px;
  line-height: 1.8;
  margin: 10px 0 0 100px;
  width: 640px;
}
.box1 .box1_1{
  position: absolute;
  left: 900px;
  bottom:-20px;
}

/*box2*/
.box2 .wrapper{height: 400px;}
.box2 .box2_1{
    left: 100px;
}
.box2 .box2_2{
    left: 104px;

    top: 80px;
}
.box2 .box2_3{
    left: 387px;

    top: 213px;
}
.box2 .info{margin: 60px 0 0 740px;}

/*box3*/
.box3 .wrapper{height: 460px;}
.box3 .box3_1{
    left: 760px;

}
.box3 .box3_2{
    left: 630px;

    top: 120px;
}
.box3 .info{margin: 60px 0 0 140px;}

/*box4*/
.box4 .wrapper{height: 460px;}
.box4 .box4_1{
  z-index:10;
}
.box4 .box4_2{
  z-index:12;
  left: 120px;
  top: 20px;
}
.box4 .box4_3{
  z-index:11;
  left: 120px;
  top: 20px;
}
.box4 .box4_4{
  z-index:13;
  left: 250px;
  top: 50px;
}
.box4 .info{
  margin: 100px 0 0 740px;
}

/*box5*/
.box5 .wrapper{height: 380px;}
.box5 .img{
  position: absolute;
  z-index: 1;
  left: 740px;
}
.box5 .box5_1{z-index: 3}
.box5 .box5_2{
  z-index: 2;
  left: -200px;
}
.box5 .box5_3{
  z-index: 1;
  left: 200px;
}
.box5 .info{
  margin: 80px 0 0 80px;
}
.box5 .box5_4{
  top:120px;left:480px;z-index: 2;
}

.icon-list{
  height: 200px;
  width: 600px;
  margin: 40px auto;
}
.icon-list .item{
  float:left;font-size: 16px;
  width: 160px;
  text-align: center;
  margin: 0 20px;
}
.icon-list .item .icon{
  position: relative;
  display: inline-block;text-indent: -999px;
  overflow: hidden;
  height: 160px;
  width: 160px;
  background: url(./images/box6_1.png) no-repeat 0 0 transparent;
}
.icon-list .item .ios{background-position: 0 0;}
.icon-list .item .android{background-position: -192px 0;}
.icon-list .item .qrcode{ 
  position: absolute;
  left: 8px;
  top: 8px;
  width: 139px;
  height: 138px;
}

.banner-bottom{
  height: 427px;
  background: url(./images/banner_bottom.jpg) no-repeat center 0 #5d6671;
}

/* footer */
.footer{padding: 24px 0;background: #222324;color:#fff;line-height: 2;}
.footer .wrapper{position: relative;}
.footer .cl-gray{color:#adadad;}
.footer .cl-gray a{display:inline-block;text-decoration:none;height:20px;line-height:20px;}
.footer .cl-gray img{float: left;}
.footer .cl-gray p{float:left;height:20px;line-height:20px;margin: 0px 0px 0px 5px;color:#adadad;}
.footer .other-links{margin-bottom:20px;}
.footer .other-links a{margin: 0px 8px;color:#fff;}
.footer .icon{position: absolute;right:40px;bottom:0px;text-align: center;}