﻿html,
body {background: #fff;min-height: 100%;}

.w1200{position:relative;}


.head{background:url(../images/bg1.png) center center no-repeat;background-size:100% 100%;height:504px;}
.head .logolay{position:absolute;top:16px;left:0px;}
.head .logolay img{float:left;margin-right:10px;}
.head .logolay span{float:left;height:26px;line-height:26px;color:#fff;font-size:24px;}
.head .headimg{position:absolute;width:100%;background:url(../images/headword.png) center center no-repeat;height:173px;left:0px;top:120px;}
.head .downbtn{cursor:pointer;transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;background:url(../images/downbtn.png) center center no-repeat;width:326px;height:94px;left:50%;margin-left:-163px;top:350px;position:absolute;}
.head .downbtn span{height:66px;line-height:66px;float:left;width:100%;font-size:30px;color:#347aeb;text-align:center;text-indent:30px}
.head .downbtn i{float:left;width:100%;height:28px;line-height:28px;text-align:center;color:#4b5f7c;}
.head .downbtn:hover{transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);}
.iconbanner{height:280px;}
.icos{float:left;width:100%;padding:20px 0px;}
.icos li{float:left;width:200px; -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;}
.icos li .img{float:left;height:80px;width:100%;text-align:center;line-height:80px;}
.icos li .img img{cursor:pointer;height:60px}
.icos li:hover { -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);}
.icos li .word{float:left;width:100%;height:30px;text-align:center;font-size:16px;}

.jieshao{background:url(../images/bg2.png) center center no-repeat;height:1290px;background-size:100% 100%;}
.jieshao .title{height:60px;line-height: 60px;padding:20px 0px;width:100%;text-align:center;font-size:34px;}
.function-img-text {float:left;width:100%;margin-top:80px;
    font-size: 0;
    padding: 60px 0;
}

.function-img {
    display: inline-block;
    width: 65%;
    text-align: center;
}

.function-img-center {
    cursor:pointer;
    position: relative;
    max-width: 100%;
}

.function-img-center .pic {
    display: block;
}

.function-img-center .gif {
    position: absolute;width: 720px;
    left: 0px;
    top: -20%;
}

.function-img-center .gif.pos-2 {
    left:0px;
    top: 10%;
}

.function-text {
    width: 35%;
    display: inline-block;
    text-align: center;
    vertical-align: top;
}

.function-text-center {
  
    text-align: left;
    padding: 65px 0;
}

.function-text-center.pd-45 {
    padding: 45px 0;
}

.function-text-center h3 {
    font-size: 28px;
    color: #373737;
    line-height: 1.5;
}

.function-text-center h4 {
    font-size: 18px;
    color: #6F6F6F;
    line-height: 1.5;
    margin-top: 10px;
}

.function-text-center p {
    font-size: 16px;
    color: #6F6F6F;
    line-height: 1.8;
    margin-top: 10px;
    margin-bottom: 35px;
}

.dwon-btn {
    display: inline-block;
    width: 200px;
    text-align: center;
    font-size: 0;
    background-color: #0089FF;
    border-radius: 4px;transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
}

.dwon-btn span {
    display: inline-block;
    padding-left: 34px;
    line-height: 56px;
    background: url("../images/ico-dwon-white.png") no-repeat left center;
    font-size: 20px;
    color: #fff;
}

.dwon-btn:hover {
    background-color: #2199FF;transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
}

.dwon-btn:active {
    background-color: #0A83EA;
}



.youshi{background:url(../images/bg3.png) center center no-repeat;height:500px;cursor:pointer}
.foot{float:left;width:100%;background-color:#000;color:#fff;text-align:center;height:50px;line-height:50px;font-size:14px;}






.banner-wrapper {
  height: 643px;
  background: url(../images/home_bg_nor_banner2.png) top center no-repeat #fff;  /*background-size: cover;*/background-size:100% 100%;
  /*background: url(../images/home_bg_nor_banner.png) no-repeat center;
  background-size: cover;*/ }
  .banner-wrapper .nav-wrapper {
    height: 85px; }
    .banner-wrapper .nav-wrapper .navbar-left {
      float: left;
      line-height: 85px; }
      .banner-wrapper .nav-wrapper .navbar-left img {
        width: 38px;
        height: 38px;
        vertical-align: middle;
        margin-right: 10px; }
      .banner-wrapper .nav-wrapper .navbar-left .pro-name {
        vertical-align: middle;
        font-weight: 400;
        color: #f8f8f8;
        font-size: 28px; }
    .banner-wrapper .nav-wrapper .navbar-right {
      float: right;margin-right:56px;
      padding-top: 20px; }
      .banner-wrapper .nav-wrapper .navbar-right a {
        line-height: 45px;
        text-align: center; }
        .banner-wrapper .nav-wrapper .navbar-right a .iconfont {
          font-size: 16px;
          margin-right: 15px; }
  .banner-wrapper .banner-content {
    padding-top: 47px; }
    .banner-wrapper .banner-content .banner-left {
      width: 547px;
      float: left; }
      .banner-wrapper .banner-content .banner-left .pro-name {
        font-size: 46px;
        font-weight: 600;
        color: white;
        position:relative;
        margin-bottom: 17px; }
              .banner-wrapper .banner-content .banner-left .pro-name i{
                position:absolute;background:url(../images/yellowbg.png);background-size:100% 100%;top:-0px;left:52%;font-size:17px;color:#000000;white-space:nowrap;padding:0px 5px;
  
              animation: pronamei 1s infinite both;
        -webkit-animation: pronamei 1s infinite both;
        -moz-animation: pronamei 1s infinite both;
        -o-animation: pronamei 1s infinite both;

       }





      .banner-wrapper .banner-content .banner-left .pro-character {
        font-size: 28px;
        font-weight: 400;
        color: white;
        line-height: 25px;letter-spacing:2px;
        margin-bottom: 37px; }
      .banner-wrapper .banner-content .banner-left .pro-fn {
        font-size: 21px;
        font-weight: 400;
        color: white;
        line-height: 48px;
        margin-bottom: 40px; }
       .btn-download {
        width: 180px;
        height: 58px;
        line-height: 58px;
        margin-bottom: 12px; }
        .btn-download .iconfont {
          font-size: 24px;
          margin: 0 20px 0 19px;
          vertical-align: middle; }
      .banner-wrapper .banner-content .banner-left .version-info p {
        font-size: 14px;
        font-weight: 400;
        color: white;
        line-height: 24px; }
    .banner-wrapper .banner-content .banner-right {
      float: right; margin-right:0px;margin-top:0px;}
      .banner-wrapper .banner-content .banner-right img {
        width: 650px; }

.service-wrapper {
  background: url(../images/home_bg_nor_advantages.png) no-repeat center;
  background-size: cover;
  padding-bottom: 35px; }
  .service-wrapper .module-title {
/*    padding: 94px 0 64px;*/
    font-size: 36px;
    font-weight: 400;
    color: black;
    line-height: 36px;
    text-align: center; }
  .service-wrapper .service-content .fixed-item:first-child img {
    width: 579px;
    height: 412px; }
  .service-wrapper .service-content .fixed-item {cursor:pointer;
    width: 579px;
    height: 412px;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap; }
    .service-wrapper .service-content .fixed-item img {
      width: 600px;
      height: 394px; }
    .service-wrapper .service-content .fixed-item p {
      width:470px; }
    .service-wrapper .service-content .fixed-item .service-word {
      white-space: nowrap;
      font-size: 22px;
      font-weight: 500;
      color: black;
      line-height: 22px;
      margin-bottom: 24px;
      height: 22px; }
      .service-wrapper .service-content .fixed-item .service-word .iconfont {
        font-size: 30px;
        margin-right: 15px;
        color: #fff;
        vertical-align: middle; }
    .service-wrapper .service-content .fixed-item .service-word-content {
      font-size:20px;
      font-weight: 400;
      color: #1a1a1a;
      line-height: 40px;
}


.btn-download {
  display: block;
  width: 170px;
  height: 45px;
  background: #ffffff;
  border-radius: 2px;
  color: #007cff;
  font-size: 16px; }

.btn-download:hover {transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);webkit-transition: all .3s;-webkit-transition: all .3s;
  /*background: linear-gradient(180deg, #fd6b5b 0%, #fc4242 100%);*/
 /* box-shadow: 0px 2px 7px 0px #bc4c59; */}




.btnactive{position:relative;overflow:hidden;}
.btnactive:before{content:"";position:absolute;width:200%;height:500%;left:0%;top:0%;margin-left:-50%;margin-top:-50%;border-radius:50%; background: rgba(0, 0, 0, .1); animation: spread 1.5s infinite both;
        -webkit-animation: spread 1.5s infinite both;
        -moz-animation: spread 1.5s infinite both;
        -o-animation: spread 1.5s infinite both;}

 @keyframes spread {
        0% {
            transform: scale(0);
            -webkit-transform: scale(0);
            -moz-transform: scale(0);
            transform: scale(0);
        }
        100% {
            transform: scale(1);
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            transform: scale(1);
        }
    }
    
    @-webkit-keyframes spread {
        0% {
            transform: scale(0);
            -webkit-transform: scale(0);
            -moz-transform: scale(0);
            transform: scale(0);
        }
        100% {
            transform: scale(1);
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            transform: scale(1);
        }
    }
    
    @-moz-keyframes spread {
        0% {
            transform: scale(0);
            -webkit-transform: scale(0);
            -moz-transform: scale(0);
            transform: scale(0);
        }
        100% {
            transform: scale(1);
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            transform: scale(1);
        }
    }
    
    @-o-keyframes spread {
        0% {
            transform: scale(0);
            -webkit-transform: scale(0);
            -moz-transform: scale(0);
            transform: scale(0);
        }
        100% {
            transform: scale(1);
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            transform: scale(1);
        }
    }





@keyframes pronamei {
        0% {
            top:-5px;
        }
       
        50%{
          top:5px;
        }
       
        100% {
            top:-5px;
        }
    }
    
    @-webkit-keyframes pronamei {
         0% {
            top:-5px;
        }
       
        50%{
          top:5px;
        }
       
        100% {
            top:-5px;
        }
    }

.pr{position: relative;}
.ys{position: absolute;font-size: 24px;}
.ys1{left:216px;top:212px}
.ys2{left:606px;top:212px}
.ys3{left:943px;top:212px}
.ys4{left:216px;top:363px}
.ys5{left:606px;top:363px}
.ys6{left:943px;top:363px}