@charset "utf-8";
#ClCache{display:none;}
@keyframes togglejump {
    0%,
    100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
}

@keyframes rotateIn {
    0% {
        transform: scale(.5) rotateZ(-360deg);
        opacity: .2;
    }
    100% {
        transform: none;
        opacity: 1;
    }
}

.rotateIn {
    animation-name: rotateIn;
}

.rollInLeft {
    animation-name: rollInLeft;
}

@keyframes rollInLeft {
    0% {
        opacity: 0;
        transform: translateX(-100%) rotateY(-180deg);
    }
    100% {
        opacity: 1;
        transform: translateX(-78px) rotateY(0deg);
    }
}


body{ font-family: "Microsoft Yahei" }

.header.transparent-bg {
    background-color: transparent;
}

.header.color-bg {
    background-color: rgba(42, 58, 74, 0.9);
}

.footer {
    display: none;
}

.media-block {
    font-size: 1em;
}

.media-block2{ height: 100%; width: 100%; }
.media-block2 .blk2{height: 100%;  background: url(../img/hyyyback.jpg) no-repeat center center; width: 100%; height: 100% }

.ctn{width: 1200px; margin:0px auto; position: relative;}
.ctn .lftnav{  width: 24em; height: 34em; position: absolute; top:13em; left: 0px; }
.ctn .lftnav span{ display: block; font-size: 4em; color: #fff; margin-bottom: 1em; }

.ctn .lftnav ul li{ display: block; border-radius: 2em 2em; transition: all 0.3s; width: 12em; height: 3em; text-align: center; margin-top:0.5em; line-height: 3em; color: #fff; font-size:1.5em; }


.ctn .lftnav ul li:before,
.ctn .lftnav ul li:after {
  box-sizing: border-box;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  z-index: -1;
}

.ctn .lftnav ul li:nth-child(1){ border:1px solid #0273a4; position: relative; overflow: hidden; }
.ctn .lftnav ul li:nth-child(1):after {
  content: '';
  width: 0;
  height: 0;
  -webkit-transform: rotate(360deg);
  border-style: solid;
  border-width: 0 0 0 0;
  border-color: #0273a4 transparent transparent transparent;
  position: absolute;
  top: 0;
  left: 0;
}
.ctn .lftnav ul li:nth-child(1):hover:after {
  border-width: 15em 15em 0 0;
}
.ctn .lftnav ul li:nth-child(1):active {
  background: #0273a4;
}

.ctn .lftnav ul li:nth-child(2){ border:1px solid #b34313; position: relative; overflow: hidden;   }
.ctn .lftnav ul li:nth-child(2):after {
  content: '';
  width: 0;
  height: 0;
  -webkit-transform: rotate(360deg);
  border-style: solid;
  border-width: 0 0 0 0;
  border-color: #b34313 transparent transparent transparent;
  position: absolute;
  top: 0;
  left: 0;
}
.ctn .lftnav ul li:nth-child(2):hover:after {
  border-width: 15em 15em 0 0;
}
.ctn .lftnav ul li:nth-child(2):active {
  background: #b34313;
}
.ctn .lftnav ul li:nth-child(3){ border:1px solid #59772b;  position: relative; overflow: hidden;  }
.ctn .lftnav ul li:nth-child(3):after {
  content: '';
  width: 0;
  height: 0;
  -webkit-transform: rotate(360deg);
  border-style: solid;
  border-width: 0 0 0 0;
  border-color: #59772b transparent transparent transparent;
  position: absolute;
  top: 0;
  left: 0;
}
.ctn .lftnav ul li:nth-child(3):hover:after {
  border-width: 15em 15em 0 0;
}
.ctn .lftnav ul li:nth-child(3):active {
  background: #59772b;
}
.ctn .rhtctn{ position: absolute; left:27em; top:12em; }
.ctn .lftnav ul li:hover{ border-radius: 3em 3em;; }
.ctn .lftnav li.curm{background: #6495ed}
.dz1{ background: url(../img/19.png) no-repeat center center; background-size: 66em 55em ; width:66em; height:55em  }


.kshchart{width: 100%; margin-left: -20em; margin-top:-3em; text-align: center;}
.kshchart img{ width: 120%;  }
.region-list{position:absolute;left:0;top:0}
.ysdw1 .ysdwctn{ width: 755px; height: 550px; margin-left:30px; }
.ysdw1 .ysdwctn .ysdwyq{width: 180px; height: 180px; position: relative; margin-right:25px; margin-top: 25px;  float: left;}
.ysdw1 .ysdwctn .ysdwyq .ysdwback{
 min-width: 180px;
  min-height: 180px;
  position: absolute;
   left:0px; top:0px;
   background: url(../img/30.png) no-repeat center center; 
   background-size: 90%;
-webkit-animation:run 8s alternate 0s infinite;    
 animation:run 8s alternate 0s infinite;    
    }
.ysdw1 .ysdwctn .ysdwyq .ysdwtitle{color: #fff; text-align: center; font-size: 16px; line-height: 18px; padding-top: 20px  }
.ysdw1 .ysdwctn .ysdwyq .ysdwback:hover{     
            -webkit-animation-play-state:paused; 
            animation-play-state:paused;    

        }     
     
     
       @-webkit-keyframes run{     
            from{     
               -webkit-transform:rotate(0deg); transform:rotate(0deg);     
            }     
            to{     
                -webkit-transform:rotate(360deg); transform:rotate(360deg);     
            }     
        }     


@-webkit-keyframes warn{
0%{-webkit-transform:scale(0);transform:scale(0);opacity:1}
100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}
}
@-moz-keyframes warn{
0%{-moz-transform:scale(0);transform:scale(0);opacity:1}
100%{-moz-transform:scale(1);transform:scale(1);opacity:0}
}
@-o-keyframes warn{
0%{-o-transform:scale(0);transform:scale(0);opacity:1}
100%{-o-transform:scale(1);transform:scale(1);opacity:0}
}
@keyframes warn{
0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0);opacity:1}
100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:0}
}
.area-box .dot{position:absolute;left:0;width:10px;height:10px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background:#137766;opacity:1;filter:alpha(opacity=100)}
.area-box .pulse{position:absolute;top:-28px;left:-28px;height:66px;width:66px;border:2px solid #b7b7b7;-webkit-border-radius:48px;-moz-border-radius:48px;border-radius:48px;-webkit-box-shadow:0 0 4px #137766,0 0 10px #137766 inset;-moz-box-shadow:0 0 4px #137766,0 0 10px #137766 inset;box-shadow:0 0 4px #137766,0 0 10px #137766 inset;opacity:.12;filter:alpha(opacity=0);-webkit-animation:warn 2s ease-out both;-moz-animation:warn 2s ease-out both;-o-animation:warn 2s ease-out both;animation:warn 2s ease-out both;-webkit-animation-iteration-count:infinite;-moz-animation-iteration-count:infinite;-o-animation-iteration-count:infinite;animation-iteration-count:infinite;background:0 0}
.area-box .delay-01{-webkit-animation-delay:0;-moz-animation-delay:0;-o-animation-delay:0;animation-delay:0}
.area-box .delay-02{-webkit-animation-delay:.4s;-moz-animation-delay:.4s;-o-animation-delay:.4s;animation-delay:.4s}
.area-box .delay-03{-webkit-animation-delay:.8s;-moz-animation-delay:.8s;-o-animation-delay:.8s;animation-delay:.8s}
.area-box .delay-04{-webkit-animation-delay:1.2s;-moz-animation-delay:1.2s;-o-animation-delay:1.2s;animation-delay:1.2s}
.area-box .delay-05{-webkit-animation-delay:1.6s;-moz-animation-delay:1.6s;-o-animation-delay:1.6s;animation-delay:1.6s}
.area-box .delay-06{-webkit-animation-delay:2s;-moz-animation-delay:2s;-o-animation-delay:2s;animation-delay:2s}
.area-box .delay-07{-webkit-animation-delay:2.4s;-moz-animation-delay:2.4s;-o-animation-delay:2.4s;animation-delay:2.4s}
.area-box .delay-08{-webkit-animation-delay:-.4s;-moz-animation-delay:-.4s;-o-animation-delay:-.4s;animation-delay:-.4s}
.area-box .delay-09{-webkit-animation-delay:-.8s;-moz-animation-delay:-.8s;-o-animation-delay:-.8s;animation-delay:-.8s}
.area-box .delay-10{-webkit-animation-delay:-1.2s;-moz-animation-delay:-1.2s;-o-animation-delay:-1.2s;animation-delay:-1.2s}
.area-box .delay-11{-webkit-animation-delay:4s;-moz-animation-delay:4s;-o-animation-delay:4s;animation-delay:4s}
.region-list.active .area-box .dot{background:#90c42f}
.region-list.active .area-box .pulse{border-color:#009fd9;top:-39px;left:-39px;height:88px;width:88px;-webkit-box-shadow:0 0 12px #0080d9,0 0 20px #90c42f inset;-moz-box-shadow:0 0 12px #90c42f,0 0 20px #90c42f inset;box-shadow:0 0 12px #90c42f,0 0 20px #90c42f inset}
.region-list.waite .area-box .dot{background:#f90}
.region-list.waite .area-box .pulse{border-color:#f90}
.show-regin{position:absolute;left:2px;height:0;top:0;width:11px;opacity:0;-o-transition:all .5s ease-in-out;-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;transition:all .5s ease-in-out}
.online-node .show-regin,.region-list:hover .show-regin,.underline-node .show-regin,.waite-node .show-regin{height:127px;opacity:1}
.show-regin span{width:80px;position:absolute;left:8px;top:-11px;padding:6px 10px;font-size:14px;color:#ccc;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;text-align:center;white-space:nowrap;}
.postition-10 .show-regin span{left:0}
.postition-6 .show-regin span{left:-72px}
.area-box{z-index:77}
.show-regin{z-index:66}
.region-list.active .show-regin span{position:relative;color:#ccc}
.region-list.waite .show-regin span{color:#ccc}
.postition-1{left:100px;top:110px}
.postition-2{left:461px;top:130px}
.postition-3{left:358px;top:516px}
.postition-4{left:473px;top:348px}
.postition-5{left:526px;top:394px}
.postition-6{left:526px;top:515px}
.postition-7{left:652px;top:200px}
.postition-7.region-list.active .area-box .pulse{top:-50px;left:-50px;width:110px;height:110px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}
.postition-8{left:559px;top:229px}
.postition-9{left:640px;top:485px}
.postition-9.region-list.active .area-box .pulse{top:-50px;left:-50px;width:110px;height:110px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}
.postition-10{left:554px;top:539px}
.postition-11{left:604px;top:300px}
.postition-13{left:270px;top:270px}
.douhao{width:0}

.hynav{ width: 1200px; position: absolute; bottom: 0px; left:50%; margin-left: -600px }
.hynav div{ width: 300px; float: left; height: 70px; line-height: 70px; color: #fff; text-align: center; font-size: 23px; }
.hynav .hynav1{ background: #089cad }
.hynav .hynav2{ background: #90c42f }
.hynav .hynav3{ background: #f6b539 }
.hynav .hynav4{ background: #218bbd }

.blk3{ background: url(../img/zhafback.jpg) no-repeat center center; }
.afctn{ width: 1300px; margin:0px auto; min-height:550px  }
.afctn .afctnmain{width: 820px;height: 456px; float: right; background: url(../img/31.png) no-repeat right;}
.afctn .afctnmain .aftxt1{ font-size: 51px; font-weight: 700 ; color: #fff; line-height: 120px; margin-top: 20px; display: block;}
.afctn .afctnmain .aftxt2{ font-size: 45px; font-weight: 600 ; margin-top:50px;color: #fff;line-height: 80px; display: block;}
.afctn .afctnmain .aftxt3{ font-size: 20px; display: block; margin-top:95px; color: #fff;}
.gaopinzhi-swiper .items-title {
    font-size: 3.57em;
    color: #90c42f;
    font-weight: bold;
    margin: 0;
}

.gaopinzhi-swiper .items-subtitle2
{
      font-size: 1.3em;
    color: #fff;
     text-align: center;
    margin-top:30px;
}

.gaopinzhi-swiper .items-subtitle {
    font-size: 1.714em;
    margin-top: 0.5em;
    text-align: center;
}

.gaopinzhi-swiper {
    height: 100vh;
    overflow: hidden;
}

.gaopinzhi-swiper .swiper-container {
    height: 100%;
}

.gaopinzhi-swiper .swiper-slide {
    overflow: hidden;
}

.gaopinzhi-swiper .swiper-pagination {
    right: auto;
    left: 30px;
     text-align: center;
}

.gaopinzhi-swiper .swiper-pagination-bullet {
    text-align: center;
    width: 10px;
    height: 10px;
    background: #fff;
    opacity: 1;
}

.gaopinzhi-swiper .swiper-pagination-bullet-active {
    width: 20px;
    height: 20px;
    background: #90c42f;
    margin-left: -5px;
    opacity: 1;
}

.gaopinzhi-swiper .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 15px auto;
}

/*建站流程*/

.items-steps .items-block {
    height: 30.857em;
    position: relative;
    margin: 5em 0 2.857em;
}

.items-steps .item {
    width: 156px;
    height: 13.286em;
    float:left;
    display: block;
    background-color: #fff;
    border-radius: 0.357em;
    position: relative;
    box-shadow: 0 0 0.357em 0.143em rgba(135, 135, 135, 0.15);
    backface-visibility: hidden;
}


.items-steps li:nth-of-type(even){margin-top: 211px;}




.items-steps .item.even:after {
    top: -0.5em;
    bottom: auto;
}


.items-steps .img-block {
    width: 5em;
    height: 5em;
    border-radius: 50%;
    background-color: #fff;
    margin-top: -2.5em;
    position: relative;
    transition-duration: 1s;
}

.items-steps .img-block:before {
    content: "";
    width: 100%;
    height: 100%;
    box-shadow: 0 0 0.357em 0.143em rgba(135, 135, 135, 0.15);
    position: absolute;
    z-index: -2;
    border-radius: 50%;
    left: 0;
    top: 0;
}

.items-steps .img-block img {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.items-steps li:hover .img-block {
    transform: rotateZ(360deg);
}



.items-steps .item-title {
    font-size: 1.286em;
    text-align: center;
    margin-bottom: 0.556em;
}

.items-steps .item-p {
    color: #999;
    text-align: center;
    margin-bottom: 0.357em;
}

.items-steps .item.even .item-title {
    margin-top: 15px;
}

.items-steps .item.even .img-block {
    margin: 0 0 0 -35px;
    position: absolute;
    left: 50%;
    bottom: -35px;
}

.items-steps .item-col2 {
    width: 267px;
    transform: translateX(-133.5px);
}

/*#swiper-advantage{ background: url(../img/page2back.jpg) center center no-repeat; }
*/

.fp-tableCell{

    position:relative;
    margin-top:100px;
    }


.fp-tableCell .wrapper{

    width:1200px;

    height:210px;

    margin:0px auto;

    color:#fff;

    }



.fp-tableCell .wrapper li{

    width:25%;

    height:100%;

    text-align: center;

    float:left;

    text-transform:uppercase;

    cursor:pointer;

    transition:all 1s;

    }

.fp-tableCell  h2 {
    display: block;
    font-size: 1.2em;
    line-height: 40px
     
}

.fp-tableCell .PingHei_text{font-size: 1.6em}

.fp-tableCell .wrapper li i{ font-size: 8em; 
    font-weight: 100; 
    margin-bottom: 40px; 
transition: all .3s ease;
     }

.fp-tableCell #menu{display: block; height: 210px}

.fp-tableCell .wrapper li:hover i{

    font-size:10em;


    }



.items-steps .item-col2 .flex-row {
    justify-content: space-around;
}

.items-steps .item-col2 .item-p {
    text-align: left;
}

.items-steps .steps-block {
    position: absolute;
    height: 1.714em;
    width: 100%;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.items-steps .steps-block:before {
    content: "";
    position: absolute;
    width: 98.4%;
    height: 0.571em;
    background-color: #E9E9E9;
    border-radius: 0.143em;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.items-steps .steps-block:after {
    content: url(../img/items-steps-arrow.png);
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0;
}

.items-steps .step {
    float: left;
    margin-left: 150px;
    width: 1.714em;
    height: 1.714em;
    background-color: #fff;
    border-radius: 50%;
    transform: translateX(-0.857em);
    box-shadow: 0 0 0.571em 0 rgba(0, 0, 0, .2);
}

.items-steps .step:before {
    content: "";
    position: absolute;
    width: 0.714em;
    height: 0.714em;
    background-color: #FFAE12;
    border-radius: 50%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s ease;
}

.items-steps .step.cur:before {
    width: 100%;
    height: 100%;
}

.gaopinzhi-swiper #swiper-service .items-more {
    margin-top: 5em;
}

/*企业文化*/
#swiper-culture{ background: url(../img/35.jpg) center center no-repeat; }

.zwyptlft{ width: 523px; height: 487px; float: left; }
.zwyptrht{width: 680px; float: right;}
.bigt{ font-size: 53px; color: #fff; font-weight: 700; margin-bottom: 20px;}

.bigtback{
 min-width:1560px;
  min-height: 1560px;
  position: absolute;
   right:-580px; top:-350px;
   background: url(../img/46.png) no-repeat center center; 
   background-size: 100%;
-webkit-animation:runs 16s  infinite;    
 animation:runs 16s  infinite; 
 z-index: 0;   
    }
      
@-webkit-keyframes runs{     
            from{     
               -webkit-transform:rotate(360deg); transform:rotate(360deg);     
            }     
            to{     
                -webkit-transform:rotate(0deg); transform:rotate(0deg);     
            }     
        }     
.zwyptlft .zwyptnav li{ font-size: 32px; color: #58eefd; padding-left: 76px; width: 444px; line-height: 87px;  display: block;}
.zwyptlft .zwyptnav li:nth-child(1){ background: url(../img/36.png) no-repeat 0px 18px; }
.zwyptlft .zwyptnav li:nth-child(2){ background: url(../img/37.png) no-repeat 0px 18px; }
.zwyptlft .zwyptnav li:nth-child(3){ background: url(../img/38.png) no-repeat 0px 18px; }
.zwyptlft .zwyptnav li span{  font-size:18px; display: none;  color: #fff; line-height: 25px;}
.zwyptlft .zwyptnav li:nth-child(1) span{display: block;}

.zw1 {width: 100%; position: relative; height: 600px}

.zw1 .zw1img1{position: absolute; left: 420px; top:460px;
-webkit-animation-name:'ripple1';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 2s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/}
.zw1 .zw1img2{position: absolute; left: 0px; top:0px;-webkit-animation-name:'ripple2';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 2s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/}
.zw1 .zw1img3{position: absolute; left: 70px; top:15px;-webkit-animation-name:'ripple3';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 2s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/}

@keyframes ripple1 {
0% {
top:430px;
}
100% {
top:460px;
}
}

@keyframes ripple2 {
0% {
top:30px;
}
100% {
top:0px;
}
}

@keyframes ripple3 {
0% {
top:45px;
}
100% {
top:15px;
}
}

.zw2 {width: 100%; position: relative; height: 600px}
.zw2 .zw2img1{position: absolute; left:  0px; top: 100px;
-webkit-animation-name:'ripple21';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 2s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/}
.zw2 .zw2img2{position: absolute; left: 583px; top:100px;-webkit-animation-name:'ripple22';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 2s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/}
.zw2 .zw2img3{position: absolute; left: 0px; top:329px;-webkit-animation-name:'ripple23';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 2s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/}
.zw2 .zw2img4{position: absolute; left: 583px; top:329px;-webkit-animation-name:'ripple24';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 2s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/}

.zw2 .zw2img5{position: absolute; left: 150px; top:100px; }

@keyframes ripple21 {
0% {
left:-20px;
}
100% {
left:0px;
}
}

@keyframes ripple22 {
0% {
left:603px;
}
100% {
left:583px;
}
}

@keyframes ripple23 {
0% {
left:-20px;
}
100% {
left:0px;
}
}

@keyframes ripple24 {
0% {
left:603px;
}
100% {
left:583px;
}
}


.zw3 {width: 100%; position: relative; height: 600px}
.zw3 .zw3img1{position: absolute; width: 123px; height: 130px; left:  410px; top: 80px;
-webkit-animation-name:'ripple31';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 1s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/
animation-name:'ripple31';/*动画属性名，也就是我们前面keyframes定义的动画名*/
animation-duration: 1s;/*动画持续时间*/
animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
animation-delay: 0s;/*动画延迟时间*/
animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
animation-direction: alternate;/*定义动画方式*/
}
.zw3 .zw3img2{position: absolute; left: 0px; top:0px;}



@keyframes ripple31 {
0% {
opacity:0.2;
}
100% {
opacity:1;
}
}


.fp-tableCell2{

    position:relative;
    margin-top:6em;
    }


.fp-tableCell2 .wrapper{

    width:1200px;

    height:170px;

    margin:0px auto;

    color:#fff;

    }



.fp-tableCell2 .wrapper li{

    width:206px;

    height:100%;
    margin-left: 42px;

    text-align: center;

    float:left;

    text-transform:uppercase;

    cursor:pointer;

    transition:all 1s;

    }
 
.fp-tableCell2 #menu{display: block; height: 130px}
.fp-tableCell2 #menu .cur1{  background: url(../img/4-1.png) center center no-repeat; margin-left: 2px; transition: all 0.5s;}
.fp-tableCell2 #menu .cur2{  background: url(../img/5-1.png) center center no-repeat; }
.fp-tableCell2 #menu .cur3{  background: url(../img/6-1.png) center center no-repeat; }
.fp-tableCell2 #menu .cur4{  background: url(../img/7-1.png) center center no-repeat; }
.fp-tableCell2 #menu .cur5{  background: url(../img/8-1.png) center center no-repeat; }
.fp-tableCell2 #menu .s1{  background: url(../img/4.png) center center no-repeat; margin-left: 2px; transition: all 0.5s; }
.fp-tableCell2 #menu .s1:hover{  background: url(../img/4-1.png) center center no-repeat; }
.fp-tableCell2 #menu .s2{  background: url(../img/5.png) center center no-repeat; transition: all 0.5s; }
.fp-tableCell2 #menu .s2:hover{  background: url(../img/5-1.png) center center no-repeat; }
.fp-tableCell2 #menu .s3{  background: url(../img/6.png) center center no-repeat; transition: all 0.5s; }
.fp-tableCell2 #menu .s3:hover{  background: url(../img/6-1.png) center center no-repeat; }
.fp-tableCell2 #menu .s4{  background: url(../img/7.png) center center no-repeat; transition: all 0.5s; }
.fp-tableCell2 #menu .s4:hover{  background: url(../img/7-1.png) center center no-repeat; }
.fp-tableCell2 #menu .s5{  background: url(../img/8.png) center center no-repeat; transition: all 0.5s; }
.fp-tableCell2 #menu .s5:hover{  background: url(../img/8-1.png) center center no-repeat; }

#culturecontent{ width: 1200px; margin:0px auto; overflow: hidden; }
#culturecontent li{width: 98%; margin:0px auto; float: left; display: block; /*border:1px solid #fff;*/ padding-top:30px;}
#culturecontent li .culimg{ width: 470px; height: 278px; float: left; }
#culturecontent li .culimg img{ width: 434px; height: 257px; margin-left:25px }
#culturecontent li .cultext{ width: 647px; height: 260px; float: right; }
#culturecontent li .cultext .culcls{ font-size: 1.8em; color: #90c42f;  line-height: 40px;}
#culturecontent li .cultext .culdetail{ font-size: 1.3em; display: block; margin-top:20px; color: #fff;  line-height: 1.8em;}
/*特色服务*/

.items-fw {margin-top: 2em;}

.items-fw .fw-block {
    font-size: 1.714em;
    text-align: center;
}

.items-fw .fw-block .items-title {
    font-size: 2.083em;
}

.items-fw .fw-block .items-subtitle {
    font-size: 1em;
}

.items-fw .fw-wrap {
    border: 1px solid #eee;
    box-shadow: 0 0.125em 0.125em #eee;
    height: 21.667em;
    background: #fff;
}

.items-fw .fw-block .f-t {
    margin-bottom: 45px;
    display: block;
}

.items-fw .fw-block .fw-head {
    height: 2.833em;
    border-bottom: 1px solid #eee;
}

.items-fw .fw-block .fw-head a {
    display: inline-block;
    height: 3.3em;
    line-height: 3.3em;
    color: #666;
    font-size: 0.833em;
    flex: 1;
    margin: 0 2.25em;
    border-bottom: 0.1em solid #fff;
    cursor: pointer;
}

.items-fw .fw-block .fw-head a.cur {
    border-bottom: 0.083em solid #20b09f;
    color: #20b09f;
    cursor: pointer;
}

.items-fw .body-list {
    padding: 1.083em 1.667em 0;
}

.items-fw .list-b {
    width: 380px;
    height: 15.833em;
    margin-left: 0;
    position: relative;
}

.items-fw .list-b-1 {
    background: url(../../images/special/gaopinzhi/fw-1.jpg) no-repeat 0 0;
}


.items-fw .list-s {
    width: 230px;
    height: 15.833em;
    margin-left: 2%;
}

.items-fw .list-s a {
    display: block;
    overflow: hidden;
    height: 100%;
}

@media screen and (min-width:1500px) {
    .items-fw .list-s {
        margin-left: 3%;
    }
}

.items-fw .b-con {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4.0625em;
    text-align: center;
    color: #fff;
    font-size: 0.667em;
    padding: 0 1.875em;
    background: #20b09f;
    padding-top: 0.9375em;
    transition: all .4s;
    opacity: 0.95;
}

.items-fw .list-b:hover .b-con {
    height: 230px;
    padding-top: 150px;
}

.items-fw .list-s .s-t {
    font-size: 0.75em;
    color: #fff;
    margin-top: 9.444em;
}

.items-fw .ym-wrap {
    height: 2.417em;
}

.items-fw .ym-item {
    flex: 1;
    background: #20b09f;
    font-size: 1em;
    height: 2.458em;
    line-height: 2.458em;
    color: #fff;
}

.items-fw .ym-item a.search {
    display: block;
    cursor: pointer;
}

.items-fw .ym-item a.search:before {
    background: url(../../images/special/gaopinzhi/search-icon.png) no-repeat 0 50%;
    padding-left: 35px;
    content: "";
}

.items-fw .item-center {
    flex: 4;
    border: 0.083em solid #20b09f;
    height: 2.25em;
    background: #fff;
    position: relative;
}

.items-fw .item-center .ym-i {
    width: 80%;
    display: inline-block;
    outline: none;
    border: none;
    flex: 1;
    font-size: 0.75em;
    padding-left: 0.889em;
}

.items-fw .item-center .ym-h {
    width: 18%;
    font-weight: bold;
    border-left: 1px solid #20b09f;
    height: 1.667em;
    line-height: 1.667em;
    color: #333;
    text-align: left;
    padding-left: 0.75em;
    margin-right: 1.25em;
    cursor: pointer;
    background: url(../../images/special/gaopinzhi/ym-icon.png) no-repeat 100% 50%;
}

.items-fw .ym-select {
    position: absolute;
    height: 9em;
    overflow-y: auto;
    right: 0px;
    top: 2.708em;
    background: #fff;
    z-index: 3;
    width: 6.25em;
    border: 1px solid #a7b1b3;
    border-radius: 0.167em;
}

@media screen and (min-width:1500px) {
    .items-fw .ym-select {
        width: 7.5em;
    }
}

.items-fw .ym-select a.a-l {
    display: block;
    line-height: 2.1875em;
    border-bottom: 1px solid #a7b1b3;
    padding-left: 0.9375em;
    color: #333;
    font-size: 0.667em;
    text-align: left;
    cursor: pointer;
}

.items-fw .adv .item {
    flex: 1;
    border: 1px solid #eee;
    margin-left: -1px;
    height: 7.917em;
    background: #fff;
}

.items-fw .adv .item-n {
    flex: none;
    padding: 0 1.25em;
}

.items-fw .adv .item-btn {
    flex: none;
}

.items-fw .adv .e-img {
    margin-top: 2.083em;
    margin-bottom: 0.417em;
}

.items-fw .adv .e-title {
    font-size: 1em;
    color: #666;
}

.items-fw .adv .item-bg {
    background: #fff url(../../images/special/gaopinzhi/email-bg.png) no-repeat 100% 100%;
    padding-top: 2.5em;
    height: 5.417em;
}

.items-fw .adv .item strong {
    font-size: 0.833em;
    font-weight: bold;
    display: block;
}

.items-fw .adv .item-bg span {
    font-size: 0.667em;
    color: #666;
}

.items-fw .adv .item-n strong {
    font-size: 1em;
    line-height: 7.917em;
}

.items-fw .adv .item .button {
    display: block;
    height: 2.111em;
    line-height: 2.111em;
    width: 9.889em;
    text-align: center;
    font-size: 0.75em;
    margin: 0 1.778em;
    cursor: pointer;
}

.items-fw .adv .button.buy {
    background: #1aa090;
    border: 1px solid #1aa090;
    color: #fff;
    margin: 2em 1.778em;
}

.items-fw .adv .button.free {
    background: #fff;
    border: 1px solid #1aa090;
    color: #1aa090;
}

.items-fw .adv .button.buy:hover {
    background: #20b09f;
}

.items-fw .adv .button.free:hover {
    background: #1aa090;
    color: #fff;
}

.items-fw .l-i {
    flex: 1;
    border: 1px solid #eee;
    height: 7em;
    background: #fff;
    margin-left: -1px;
    padding-top: 1.333em;
}

.items-fw .l-i .l-i-t {
    text-align: center;
    font-size: 0.75em;
    margin-bottom: 0.714em;
}

.items-fw .l-i .l-i-t span {
    display: inline-block;
    height: 1.556em;
}

.items-fw .l-i .l-i-t1 span {
    background: url(../../images/special/gaopinzhi/z-1.png) no-repeat 0 0;
    padding-left: 34px;
}

.items-fw .l-i .l-i-t2 span {
    background: url(../../images/special/gaopinzhi/z-2.png) no-repeat 0 0;
    padding-left: 37px;
}

.items-fw .l-i .l-i-t3 span {
    background: url(../../images/special/gaopinzhi/z-3.png) no-repeat 0 0;
    padding-left: 32px;
}

.items-fw .l-i .l-i-b {
    width: 12.667em;
    margin: 0 auto;
    text-align: left;
    font-size: 1em;
    cursor: default;
    overflow: hidden;
}

.big-icon {
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 1.714em;
    line-height: 1.714em;
    color: #20b09f;
    border: 1px solid #20b09f;
    text-align: center;
    font-size: 0.583em;
    border-radius: 1.071em;
    margin-bottom: 0.714em;
}

.sm-icon {
    box-sizing: border-box;
    display: inline-block;
    width: 48%;
    height: 1.714em;
    line-height: 1.714em;
    color: #20b09f;
    border: 1px solid #20b09f;
    text-align: center;
    font-size: 0.583em;
    border-radius: 1.071em;
    margin-right: 0.6em;
    margin-bottom: 0.714em;
    float: left;
}

.sm-last {
    margin-right: 0;
}

.big-icon:hover, .sm-icon:hover {
    background: #20b09f;
    color: #fff;
}

/*选择中企*/

.items-ch .ch-title {
    font-size: 24px;
    text-align: center;
    margin-bottom: 45px;
    display: block;
}

.items-ch a, .items-ch .item {
    flex: 1;
    background-color: #fff;
}

.items-ch .item {
    border: 1px solid #eee;
    height: 4.375em;
    line-height: 4.375em;
    font-size: 1.143em;
    margin: 0 -1px -1px 0;
    padding: 0 0 0 3.125em;
    justify-content: flex-start;
}

.items-ch .item span {
    display: inline-block;
    vertical-align: middle;
    margin: 0 1.25em 0 0;
}

.items-ch .item .i-1 {
    background: url(../../images/special/gaopinzhi/1_2.png) no-repeat 0 0;
    width: 40px;
    height: 40px;
}

.items-ch .item .i-2 {
    background: url(../../images/special/gaopinzhi/2_2.png) no-repeat 0 0;
    width: 40px;
    height: 40px;
}

.items-ch .item .i-3 {
    background: url(../../images/special/gaopinzhi/3_2.png) no-repeat 0 0;
    width: 33px;
    height: 37px;
}

.items-ch .item .i-4 {
    background: url(../../images/special/gaopinzhi/4_2.png) no-repeat 0 0;
    width: 47px;
    height: 40px;
}

.items-ch .item .i-5 {
    background: url(../../images/special/gaopinzhi/5_2.png) no-repeat 0 0;
    width: 40px;
    height: 40px;
}

.items-ch .item .i-6 {
    background: url(../../images/special/gaopinzhi/6_2.png) no-repeat 0 0;
    width: 40px;
    height: 40px;
}

.items-ch .item .i-7 {
    background: url(../../images/special/gaopinzhi/7_2.png) no-repeat 0 0;
    width: 40px;
    height: 40px;
}

.items-ch .item .i-8 {
    background: url(../../images/special/gaopinzhi/8_2.png) no-repeat 0 0;
    width: 40px;
    height: 40px;
}

.items-ch .item:hover {
    background: #20b09f;
    color: #fff;
}

.items-ch .item:hover .i-1 {
    background: url(../../images/special/gaopinzhi/1.png) no-repeat 0 0;
}

.items-ch .item:hover .i-2 {
    background: url(../../images/special/gaopinzhi/2.png) no-repeat 0 0;
}

.items-ch .item:hover .i-3 {
    background: url(../../images/special/gaopinzhi/3.png) no-repeat 0 0;
}

.items-ch .item:hover .i-4 {
    background: url(../../images/special/gaopinzhi/4.png) no-repeat 0 0;
}

.items-ch .item:hover .i-5 {
    background: url(../../images/special/gaopinzhi/5.png) no-repeat 0 0;
}

.items-ch .item:hover .i-6 {
    background: url(../../images/special/gaopinzhi/6.png) no-repeat 0 0;
}

.items-ch .item:hover .i-7 {
    background: url(../../images/special/gaopinzhi/7.png) no-repeat 0 0;
}

.items-ch .item:hover .i-8 {
    background: url(../../images/special/gaopinzhi/8.png) no-repeat 0 0;
}

/*选择我们-立即行动*/

.items-service {
    margin-top: 1.429em;
}

.items-service .flex-row {
    margin-top: 4.286em;
    justify-content: space-between;
}

.items-service .item {
    position: relative;
    width: 25em;
    height: 24.286em;
    text-align: center;
    box-shadow: 0 0 0.214em 0.143em rgba(135, 135, 135, .1);
    background-color: #fff;
}

.items-service .item-title {
    box-sizing: border-box;
    width: 5.417em;
    height: 3.125em;
    margin: 0 auto 2.083em;
    background-color: #293949;
    color: #fff;
    font-size: 1.714em;
    position: relative;
    padding-top: 1.667em;
}

.items-service .item-title:before {
    content: "";
    position: absolute;
    top: -1.667em;
    left: 0;
    width: 0;
    height: 0;
    border-left: 2.708em solid transparent;
    border-right: 2.708em solid transparent;
    border-bottom: 1.667em solid #293949;
    transition: all .3s ease;
}

.lightwrapper {width: 100%; position: relative;}
.lightwrapper .light{padding-left:10px;position:absolute;margin-top:0px;width:854px;-webkit-user-select:none;-moz-user-select:none}
.lightwrapper .light input{display:none}
.lightwrapper .light div i:hover{opacity:1}
.lightwrapper .light div{float:left;width:152px;height:191px; position:relative;background:url(../img/t011df7512152150bb9.png) no-repeat top center}
.lightwrapper .light div i{
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    background:url(../img/t01cfdd74c38452f86c.png) no-repeat top center;
    -webkit-transition:.5s;
    -moz-transition:.5s;
    -ms-transition:.5s;
    -o-transition:.5s;
    transition:.5s;
    -webkit-animation-name:'lightd';/*动画属性名，也就是我们前面keyframes定义的动画名*/
-webkit-animation-duration: 2s;/*动画持续时间*/
-webkit-animation-timing-function: ease; /*动画频率，和transition-timing-function是一样的*/
-webkit-animation-delay: 0s;/*动画延迟时间*/
-webkit-animation-iteration-count: infinite;/*定义循环资料，infinite为无限次*/
-webkit-animation-direction: alternate;/*定义动画方式*/}

@keyframes lightd {
0% {
opacity:0;
}
100% {
opacity:1;
}
}

.items-service .item-title:after {
    content: "";
    position: absolute;
    bottom: -1.667em;
    left: 0;
    width: 0;
    height: 0;
    border-left: 2.708em solid transparent;
    border-right: 2.708em solid transparent;
    border-top: 1.667em solid #293949;
    transition: all .3s ease;
}

.items-service .item-p {
    font-size: 1.143em;
    line-height: 1.875em;
}

.items-service .item-btn {
    position: absolute;
    width: 18.857em;
    height: 2.857em;
    bottom: 2.857em;
    left: 50%;
    transform: translateX(-50%);
    line-height: 2.857em;
}

.items-service .item-btn-a {
    display: block;
    border: 1px solid #20b09f;
    font-size: 1.143em;
    color: #20b09f;
}

.items-service .item:hover {
    transform: translateY(-20px);
    box-shadow: 0 0 10px 5px rgba(135, 135, 135, .1);
}

.items-service .item:hover .item-btn-a {
    background-color: #20b09f;
    color: #fff;
}

.items-service .item:hover .item-title {
    background-color: #20b09f;
}

.items-service .item:hover .item-title:before {
    border-bottom-color: #20b09f;
}

.items-service .item:hover .item-title:after {
    border-top-color: #20b09f;
}

/*我们的强项*/

#swiper-banner #space {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

#swiper-banner .swiper-banner-bg {
    position: absolute;
    width: 100%;
    height: calc(100% - 70px);
    left: 0;
    top: 0;
    background: url(../img/swiper-banner-bg.png) no-repeat center;
    background-size: auto 150%;
    margin-top: 70px; 
    -webkit-animation:fdbga 2s linear 0s 1;    
    animation:fdbga 2s linear 0s 1; 
    opacity: 1;
    transform: rotate(360deg);
   -webkit-transform: rotate(360deg);
   -moz-transform: rotate(360deg);
   -o-transform: rotate(360deg);
   -ms-transform: rotate(360deg);
   
}
 
            

@-webkit-keyframes fdbga{     
            0%{     
             background-size: auto 100%;
              opacity: 0;  
    transform: rotate(0deg);
   -webkit-transform: rotate(0deg);
   -moz-transform: rotate(0deg);
   -o-transform: rotate(0deg);
   -ms-transform: rotate(0deg);
            }     
            70%{     
              background-size: auto 130%;
              opacity: 0.7;
               transform: rotate(360deg);
   -webkit-transform: rotate(360deg);
   -moz-transform: rotate(360deg);
   -o-transform: rotate(360deg);
   -ms-transform: rotate(360deg);
            }     

            100%{     
              background-size: auto 150%;
              opacity: 1;
               transform: rotate(360deg);
   -webkit-transform: rotate(360deg);
   -moz-transform: rotate(360deg);
   -o-transform: rotate(360deg);
   -ms-transform: rotate(360deg);
            }     
        }   

.youshime{ width: 650px; height: 208px; margin:10px auto; margin-top:60px; }

.youshime div{ 
    width: 120px;
    height: 120px;
    border:1px solid #afb1b5;
    float: left;
    margin-left:27px;
     text-align: center;
transform:rotate(45deg);
-ms-transform:rotate(45deg);     /* IE 9 */
-moz-transform:rotate(45deg);    /* Firefox */
-webkit-transform:rotate(45deg); /* Safari 和 Chrome */
-o-transform:rotate(45deg);  /* Opera */
     }

.youshime div span{ 
    font-size:25px;
    font-weight: 600;
    color: #fff;
    line-height: 120px;
    display: block;
    transform:rotate(-45deg);
-ms-transform:rotate(-45deg);     /* IE 9 */
-moz-transform:rotate(-45deg);    /* Firefox */
-webkit-transform:rotate(-45deg); /* Safari 和 Chrome */
-o-transform:rotate(-45deg);  /* Opera */
     }

 .mousedown{

    display: inline-block;

    width:40px;

    height:40px;

    border-radius:50%;

    position:relative;

    margin-top:30px;

    font-size:12px;

    color: #fff;
    }



 .mousedown b{
     color: #fff;
    font-size:50px;

    position:absolute;

    top:0px;

    top:10px\9;

    left:0px;

    animation: mousedown 2s infinite;

    -moz-animation: mousedown 2s infinite;  /* Firefox */

    -webkit-animation: mousedown 2s infinite;   /* Safari 和 Chrome */

    -o-animation: mousedown 2s infinite;    /* Opera */

    }



@keyframes mousedown

{

0% {top:0px; opacity:0.2;}

50%{top:50px; opacity:1;}

100%{top:100px; opacity:0;}

}




#swiper-banner .swiper-banner-contents {
    position: absolute;
    width: 100%;
    height: calc(100% - 70px);
    left: 0;
    top: 0;
    margin-top: 70px;
}

#swiper-banner .swiper-banner-title {
    color: #fff;
    font-size: 4.71em;
    text-align: center;
}

#swiper-banner .swiper-banner-subtitle {
    color: #fff;
    font-size: 2.86em;
    text-align: center;
    margin-top: 0.5em;
}

#swiper-banner .swiper-banner-p {
    color: #fff;
    font-size: 1.57em;
    margin-top: 2.27em;
    line-height: 1.82em;
}

#swiper-banner .swiper-banner-down {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 20px;
    height: 27px;
    width: 36px;
    background: url(../img/swiper-banner-down.svg) no-repeat center;
    animation: togglejump 3s infinite;
}

#swiper-advantage .items-block {
    justify-content: space-between;
}

#swiper-advantage .items-block:first-of-type {
    margin-top: 2em;
}

#swiper-advantage .item {
    width: 16.14em;
    height: 19.86em;
    position: relative;
    perspective: 300;
    -webkit-perspective: 300;
    perspective-origin: 50% 50%;
    transform-style: preserve-3d;
}

#swiper-advantage .item-a-side {
    position: absolute;
    width: 100%;
    height: 100%;
    transform: rotateY(0deg);
    backface-visibility: hidden;
    transition: transform .3s ease-in-out .1s;
}

#swiper-advantage .item-a-side .img-block {
    width: 10.43em;
    height: 10.43em;
    border-radius: 50%;
    margin-top: 2.14em;
}

#swiper-advantage .item.item-1 .item-a-side .img-block {
    background: linear-gradient(to right bottom, #10DBF8, #31C0F8);
}

#swiper-advantage .item.item-2 .item-a-side .img-block {
    background: linear-gradient(to right bottom, #64DFEC, #64B8F1);
}

#swiper-advantage .item.item-3 .item-a-side .img-block {
    background: linear-gradient(to right bottom, #F8B759, #F8897D);
}

#swiper-advantage .item.item-4 .item-a-side .img-block {
    background: linear-gradient(to right bottom, #F36671, #F55981);
}

#swiper-advantage .item.item-5 .item-a-side .img-block {
    background: linear-gradient(to right bottom, #F37CFC, #D16CFE);
}

#swiper-advantage .item.item-6 .item-a-side .img-block {
    background: linear-gradient(to right bottom, #33D8AA, #37D189);
}

#swiper-advantage .item.item-7 .item-a-side .img-block {
    background: linear-gradient(to right bottom, #5C9FF9, #9B81FE);
}

#swiper-advantage .item.item-8 .item-a-side .img-block {
    background: linear-gradient(to right bottom, #78D8F9, #57BDFF);
}

#swiper-advantage .item-a-side img {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

#swiper-advantage .item-a-side .item-a-side-title {
    text-align: center;
    font-size: 1.43em;
    margin-top: 1em;
}

#swiper-advantage .item-b-side {
    transform: rotateY(-180deg);
    backface-visibility: hidden;
    transition: transform .3s ease-in-out .1s;
    position: absolute;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 1.43em;
    border-radius: 0.43em;
}

#swiper-advantage .item.item-1 .item-b-side {
    background: linear-gradient(to right bottom, #10DBF8, #31C0F8);
}

#swiper-advantage .item.item-2 .item-b-side {
    background: linear-gradient(to right bottom, #64DFEC, #64B8F1);
}

#swiper-advantage .item.item-3 .item-b-side {
    background: linear-gradient(to right bottom, #F8B759, #F8897D);
}

#swiper-advantage .item.item-4 .item-b-side {
    background: linear-gradient(to right bottom, #F36671, #F55981);
}

#swiper-advantage .item.item-5 .item-b-side {
    background: linear-gradient(to right bottom, #F37CFC, #D16CFE);
}

#swiper-advantage .item.item-6 .item-b-side {
    background: linear-gradient(to right bottom, #33D8AA, #37D189);
}

#swiper-advantage .item.item-7 .item-b-side {
    background: linear-gradient(to right bottom, #5C9FF9, #9B81FE);
}

#swiper-advantage .item.item-8 .item-b-side {
    background: linear-gradient(to right bottom, #78D8F9, #57BDFF);
}

#swiper-advantage .item-b-side .item-b-side-title {
    font-size: 1.43em;
    color: #fff;
    text-align: center;
}

#swiper-advantage .item-b-side .item-b-side-p {
    font-size: 1.14em;
    color: #fff;
    line-height: 1.75em;
    margin-top: 1.875em;
}

#swiper-advantage .item-b-side .item-b-side-a {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 2.14em;
    width: 8em;
    height: 2.57em;
    text-align: center;
    line-height: 2.57em;
    border-radius: 50px;
    background-color: #fff;
}

#swiper-advantage .item-b-side .item-b-side-a:hover {
    background-color: #eee;
}

#swiper-advantage .item:hover .item-a-side {
    transform: rotateY(180deg);
}

#swiper-advantage .item:hover .item-b-side {
    transform: rotateY(0);
}

.gaopinzhi-swiper .items-more {
    text-align: center;
    margin-top: 1.43em;
}

.gaopinzhi-swiper .advantage-more {
    width: 9.72em;
    height: 2.556em;
    line-height: 2.556em;
    background-color: #20B09F;
    font-size: 1.286em;
}

.gaopinzhi-swiper .advantage-more:hover {
    background-color: #1aa090;
}

/*信息服务*/

#swiper-service {
    background: url(../img/xxfwback.jpg) no-repeat center;
 
}
#swiper-service .media-block{ width: 1200px; height: 500px; margin:0px auto; margin-top:0px;   }
.xxfwnav{ width: 500px; height: 87px;  margin-top: 40px }
.xxfwnav a{ line-height: 70px; padding:15px 26px; font-size: 20px; color: #fff; margin-right:20px; }
.xxfwnav .xxfwnav1{ background: #137766; transition: all 0.5s; }
.xxfwnav .xxfwnav2{ background: #f55718;transition: all 0.5s;  }
.xxfwnav .xxfwnav3{ background: #90c42f;transition: all 0.5s; }
.xxfwnav .xxfwnav1:hover{background: #0e5448;}
.xxfwnav .xxfwnav2:hover{background: #ae3e12;}
.xxfwnav .xxfwnav3:hover{background: #52701b;}
.xxfwctn{ width: 1150px; height: 250px; padding:5px 5px; margin-top:30px;padding-top:5%;  background-color:rgba(225,225,225,0.3)  }
.xxfwctn span{color: #fff;  display: block; font-size: 20px; line-height: 40px; text-indent: 2em;}

.gaopinzhi-swiper #swiper-service .items-subtitle {
    color: #fff;
}

 
.gaopinzhi-swiper #swiper-service-container .items-subtitle {
    color: #fff;
}

#swiper-service-container .items-fw .fw-block > .flex-row:first-of-type {
    margin-top: 0.833em;
}

#swiper-service-container .items-fw .fw-block:last-of-type {
    margin-top: 1.25em;
}

#swiper-service-container .items-fw .fw-block .adv {
    margin-left: 0.083em;
}

/*选择我们*/

#swiper-choose .items-ch .center > .flex-row:first-of-type {
    margin-top: 1.429em;
    background: url(../img/contactback.png) no-repeat center center;
}

.contactt1{ width: 490px;height: 86px; margin:0px auto; text-align: center; line-height: 86px; margin-top: 2.5em; font-size: 3.5em; color:#90c42f; font-weight: 600  }
.contactt2{width: 490px;height: 30px; margin:0px auto;text-align: center;  line-height: 30px; margin-top: 1em; font-size: 1.1em; color:#fff;  }
.bbsdv{ width: 1200px; margin:25px auto; height:85px;   }
.bbsdv li{display: block; width:380px; margin-right:20px; float: left; color: #fff; font-size: 16px; line-height: 20px; margin-right:20px; }
.bbsdv li input{ width: 340px; background: transparent; border:1px solid #fff; height: 48px; line-height: 48px; padding-left: 10px; color: #fff;}
.bbsdv li select{ width: 340px; background: transparent; border:1px solid #fff; height: 48px; line-height: 48px; padding-left: 10px; color: #fff; }
.btnsub{ width: 80px; height: 80px; margin:20px auto; transition: all 1s;   color: #fff; border:1px solid #fff; border-radius: 40px 40px; text-align: center; }
.btnsub:hover{ background: rgba(225,225,225,0.5); }

.btminfo{width: 850px; height: 108px; margin:2px auto; }
.btminfo li{ display: block; font-size: 15px; color: #fff ; line-height: 25px; width: 290px; float: left; margin-right: 110px;}
.btminfo li span{font-size: 34px; color: #90c42f;}

.items-service .item-title.service-baojia {
    background-image: url(../../images/special/gaopinzhi/service-baojia.svg);
    background-repeat: no-repeat;
    background-position: center 0;
}

.items-service .item-title.service-set {
    background-image: url(../../images/special/gaopinzhi/service-set.svg);
    background-repeat: no-repeat;
    background-position: center 0;
}

.items-service .item-title.service-call {
    background-image: url(../../images/special/gaopinzhi/service-call.svg);
    background-repeat: no-repeat;
    background-position: center 0;
}

/*******
**********响应式**********
**********start**********
*******/

@media screen and (max-height: 840px) {
    .media-block {
        font-size: 0.95em;
    }
}

@media screen and (max-height: 790px) {
    .media-block {
        font-size: 0.9em;
    }
}

@media screen and (max-height: 760px) {
    .media-block {
        font-size: 0.85em;
    }
}

@media screen and (max-height: 720px) {
    .media-block {
        font-size: 0.8em;
    }
}

@media screen and (max-height: 670px) {
    .media-block {
        font-size: 0.75em;
    }

.logoimg{ width: 560px ; margin-top:20px;}
.youshime{ width: 550px; height: 120px; margin:10px auto; margin-top:30px; }

.youshime div{ 
    width: 100px;
    height: 100px;
    border:1px solid #afb1b5;
    float: left;
    margin-left:27px;
     text-align: center;
transform:rotate(45deg);
-ms-transform:rotate(45deg);     /* IE 9 */
-moz-transform:rotate(45deg);    /* Firefox */
-webkit-transform:rotate(45deg); /* Safari 和 Chrome */
-o-transform:rotate(45deg);  /* Opera */
     }

.youshime div span{ 
    font-size:22px;
    font-weight: 600;
    color: #fff;
    line-height: 100px;
    display: block;
    transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);     /* IE 9 */
    -moz-transform:rotate(-45deg);    /* Firefox */
    -webkit-transform:rotate(-45deg); /* Safari 和 Chrome */
    -o-transform:rotate(-45deg);  /* Opera */
     }
 
 .mousedown{
    margin-top:-10px;
    }

 .mousedown b{
     
    font-size:40px;
 
    }

.dz1{
 background: url(../img/19.png) no-repeat center center;
 background-size: 48em 40em ; 
 width:48em; height:40em;
 margin-left:1em;
}
.ctn .rhtctn {
    left: 35em;
    top: 10em;
}
.ctn .lftnav {
    left: 8em;
}

.postition-1 {
    left: 150px;
    top: 80px;
}
.postition-4 {
    left: 473px;
    top: 258px;
}

.postition-13 {
    left: 270px;
    top: 220px;
}

.postition-7 {
    left: 565px;
    top: 150px;
}

.postition-9 {
    left: 620px;
    top: 405px;
}

.kshchart {
   display: none;
}


.afctn .afctnmain {
   
    margin-right: 60px;
    margin-top: 30px;
 }

.zwyptlft {
    margin-left: 80px;
    margin-top: 150px;
}

.bigt {
    font-size: 45px;
}

.zwyptlft .zwyptnav li {
    font-size: 28px;
    padding-left: 65px;
    width: 420px;
    line-height: 70px;
   
}

.zwyptlft .zwyptnav li:nth-child(1) {
    background: url(../img/36.png) no-repeat 0px 12px;
}
.zwyptlft .zwyptnav li:nth-child(2) {
    background: url(../img/37.png) no-repeat 0px 12px;
}
.zwyptlft .zwyptnav li:nth-child(3) {
    background: url(../img/38.png) no-repeat 0px 12px;
}

.zw1 {
    
    height: 480px;
    margin-top: 60px;
}

.zw1 .zw1img1 {
    position: absolute;
    width: 80px;
    left: 320px;
    top: 430px;
    -webkit-animation-name: 'mripple1';
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
}
.zw1 .zw1img2 {
    position: absolute;
    width: 120px;
    left:30px;
    top:90px;
    -webkit-animation-name: 'mripple2';
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
}
.zw1 .zw1img3 {
    position: absolute;
    width: 350px;
    left: 70px;
    top: 85px;
    -webkit-animation-name: 'mripple3';
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
}

.zw2 {
    
    height: 400px;
    margin-top: 170px;
}
.zw2 .zw2img1 {
    width: 100px;
}
.zw2 .zw2img2 {
    width: 100px;
    left: 438px;
    -webkit-animation-name: 'mripple22';
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
}
.zw2 .zw2img3 {
    width: 100px;
    top:200px;
}
.zw2 .zw2img4 {
    width: 100px;
    left: 438px;
     top:200px;
     -webkit-animation-name: 'mripple24';
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
}
.zw2 .zw2img5 {
    width: 340px;
    left: 100px;
}
.zw3 {
    
    height: 400px;
    margin-top: 120px;
}
.zw3 .zw3img2 {
    width: 440px;
}
.zw3 .zw3img1 {
    position: absolute;
    width: 93px;
    height: 98.3px;
    left: 270px;
    top: 50px;
}

.xxfwnav {
    width: 500px;
    height: 60px;
    margin-top: 20px;
}

.xxfwctn {
    width: 1100px;
    height:250px;
    padding: 5px 5px;
    padding-top: 5%;
    margin-top: 10px;
    background-color: rgba(225,225,225,0.3);
}
#swiper-service {
    padding-top: 60px;
    padding-left: 40px;
}

.contactt1 {
    margin-top: 0em; 
}

}


@keyframes mripple1 {
0% {
top:420px;
}
100% {
top:400px;
}
}

@keyframes mripple2 {
0% {
top:60px;
}
100% {
top:90px;
}
}

@keyframes mripple3 {
0% {
top:45px;
}
100% {
top:85px;
}
}

@keyframes mripple22 {
0% {
left:468px
}
100% {
left:438px
}
}
@keyframes mripple24 {
0% {
left:468px
}
100% {
left:438px
}
}

/*******
**********响应式**********
**********end**********
*******/
.mobile-inner-header-icon {
    color: #fff;
    height: 50px;
    font-size: 18px;
    text-align: center;
    right: 0px;
    top: 0px;
    width: 50px;
    z-index: 999;
    background: rgba(144,196,47,0.8);
    position: fixed;
    -webkit-transition: background .5s;
    -moz-transition: background .5s;
    -o-transition: background .5s;
    transition: background .5s;
}

.mobile-inner-header-icon:hover {
    background: #90c42f;
    cursor: pointer;
}

.mobile-inner-nav {
    background-color: rgba(0,0,0,0.9);
    width: 100%;
    position: fixed;
    top: 0px;
    left: 10px;
    padding-top: 30px;
    padding-bottom: 80px;
    height: 100%;
    z-index: 99;
    display: none;
}

.showm {
    display: block;
}

.mobile-inner-nav a {
    display: inline-block;
    line-height: 10vh;
    text-decoration: none;
    width: 80%;
    font-size: 2em;
    height: 10vh;
    margin-left: 10%;
    color: #fff;
    border-bottom: solid 1px rgba(255,255,255,0.3);
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    font-weight: 300;
}

.mobile-inner-header-icon span:nth-child(2) {
    transform: translateY(-4px) rotate(0deg);
    transition: all 0.5s;
}
.mobile-inner-header-icon span:nth-child(1) {
    transform: translateY(4px) rotate(0deg);
    transition: all 0.5s;
}
.mobile-inner-header-icon span {
    position: absolute;
    left: calc((100% - 25px) / 2);
    top: calc((100% - 1px) / 2);
    width: 25px;
    height: 1px;
    background-color: #fff;
}
.mobile-inner-header-icon-click span:nth-child(1) {
    transform: translateY(0) rotate(45deg);
}

.mobile-inner-header-icon-click span:nth-child(2) {
    transform: translateY(0) rotate(-45deg);
}