@charset "utf-8";
* {
    padding: 0;
    margin: 0;
    transition: all .3s;
}
li,
ol,
ul {
    list-style: none;
}
a {
    text-decoration: none;
}
img {
    max-width: 100%;
    vertical-align: top;
}
input,
select,
button,
textarea {
    border: none;
    border-radius: 0;
    font-family: Microsoft YaHei,Helvetica, Arial;
    font-size: 1.4rem;
}
input,
textarea {
    outline: 0;
    -webkit-appearance: none;
}
.fr{float:right;}
.fl{float:left;}
*{-webkit-tap-highlight-color:rgba(255,255,255,0);}

html {
    font-size: 62.5%;
    font-family: Microsoft YaHei,Helvetica, Arial;
}
body {
    overflow-x: hidden;
    font-size: 1.5rem;
    color: #4d4d4d;
    font-family: Microsoft YaHei,Helvetica, Arial;
}
.ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: block;
}
.hide{display: none!important;}
.wrap{max-width:1200px;margin:0 auto;}

.fakeloader{display: flex;align-items: center;justify-content: center;position: fixed;
    width: 100%;
    height: 100vh;
    top: 0px;
    left: 0px;
    background-color: rgb(255, 255, 255);
    z-index: 999;transition: none;}

@font-face {
    font-family: 'Note-bold';
    src: url('../font/NotoSansHans-Bold.otf');

}
@font-face {
    font-family: 'Note-black';
    src: url('../font/NotoSansHans-Black.otf');
}
@font-face {
    font-family: 'Note-regular';
    src: url('../font/NotoSansHans-Regular.otf');
}
@font-face {
    font-family: 'Note-md';
    src: url('../font/NotoSansHans-Medium.otf');
}
@font-face {
    font-family: 'AvantGardeITC-BookOblique';
    src: url('../font/AvantGardeITC-BookOblique.otf');
}
@font-face {
    font-family: '359-CAI978';
    src: url('../font/359-CAI978.ttf');
}
@font-face {
    font-family: '方正正大黑简体';
    src: url('../font/fz.ttf');
}

@keyframes move_wave {

    0% {

        transform: translateX(0) translateZ(0) scaleY(1);

    }

    50% {

        transform: translateX(-25%) translateZ(0) scaleY(0.55)

    }

    100% {

        transform: translateX(-50%) translateZ(0) scaleY(1)

    }

}
@keyframes move_wave2 {

    0% {

        transform: translateX(0) translateZ(0) scaleY(1);

    }

    50% {

        transform: translateX(-50%) translateZ(0) scaleY(1)

    }

    100% {

        transform: translateX(-100%) translateZ(0) scaleY(1)

    }

}

.waveWrapper {

    overflow: hidden;

    position: absolute;
    
    left: 0;

    right: 0;

    bottom:0;

    top: 0;

    margin: auto;
   

}
.bg1{
     width: 120%;
    left: -13%; 

    bottom:30%;

    top: -30%;
     transform:rotate(-13deg);
}

.waveWrapperInner {

    position: absolute;

    width: 100%;

    overflow: hidden;

    height: 100%;

    bottom: -1px;

    background:linear-gradient(#2566f6,#2d7ff2);

}


.bgTop {

    z-index: 15;

    opacity: 0.5;

}

.bgMiddle {

    z-index: 10;

    opacity: 0.75;

}

.bgBottom {

    z-index: 5;

}

.wave {

    position: absolute;

    left: 0;

    width: 200%;

    height: 100%;

    background-repeat: repeat no-repeat;

    background-position: 0 bottom;

    transform-origin: center bottom;

}

.waveTop {

    background-size: 50% 100px;

}

.waveAnimation .waveTop {

  animation: move-wave 3s;

   -webkit-animation: move-wave 3s;

   -webkit-animation-delay: 1s;

   animation-delay: 1s;

}

.waveMiddle {

    background-size: 50% 120px;

}

.waveAnimation .waveMiddle {

    animation: move_wave 10s linear infinite;

}

.waveBottom {

    background-size: 50% 100px;

}

.waveAnimation .waveBottom {

    animation: move_wave 15s linear infinite;

}
.head.active{position: fixed;
    width: 100%;
    top: 0;
    z-index: 11;background: #2d7ff2;}
.head.active    header ul{margin-top: 45px;}
.head.active  header>a img{width: 280px; }
.head.active .info2.wrap{padding:10px 0;position: static;transform: translateX(0); transition: padding .3s;}
header{position: relative;z-index: 20;padding:25px 0; }
header ul{float: right;margin-top: 30px;white-space: nowrap;margin-right: -145px;}
header li{display: inline-block;margin-left:30px;}
header li a{color:#fff;position: relative;}
header li a:after{position: absolute;bottom:-5px;width: 0;height: 1px;left:0;background: #fff;content: "";transition: all .3s;}

header li .cur:after,header li:hover a:after{width: 100%;}
header .tel{position: absolute;top:20px;right:-145px;color:#fff;}
header span{vertical-align: middle;font-size: 1.7rem;font-family: "359-CAI978";margin-left: 5px;}
header img{vertical-align: middle;}
.banner form  div{display: none;}
.banner form.active{position: fixed;width: 100%;
    padding: 20px 8% 40px;background: #2d7ff2;bottom: 0;z-index: 35;}
.banner form.active div{display:block;position: absolute;top:20px;right:20px;    width: 20px;cursor: pointer;}
.index_ad{margin-top: 10vh;}
.index_ad .swiper-wrapper{will-change:transform;}
.index_ad .swiper-slide{display: flex;justify-content:space-between;opacity: 1;transition: all .3s;}
.index_ad .swiper-slide .txt{color:#fff;opacity: 1;transition: all .3s;}
.index_ad .swiper-slide img{opacity: 1;transition: all .3s;}
.index_ad .swiper-slide .txt div:first-child{font-family:'Note-bold'!important;font-size: 4.0rem; }
.index_ad .swiper-slide .txt p,.index_ad .swiper-slide .txt span{font-family:'Note-bold'!important; }
.index_ad .swiper-slide .txt .line{width: 0;height:4px;background: #fff;margin:30px 0 50px;transition: all .3s;box-shadow: 2px 2px 10px #222;}
.index_ad .swiper-slide .txt .des{font-size: 2.2rem;/*text-shadow:0 0 10px #ccc;*/color:#286cf2;background: #fff;border-radius: 30px;display: table;padding:5px 30px;font-weight: 600;}
.index_ad .swiper-slide .txt:hover .line{width:0;}

.server{margin-top:10vh;}
.title{text-align: center;}
.title p{font-size: 3.4rem;margin-bottom: 5px;}
.title span{font-family: "AvantGardeITC-BookOblique";font-size: 2.4rem;}
.server ul{margin: 7vh auto;}
.server li, .sermod, .sermod2{height:316px;}
.server ul{overflow: hidden;}
.server ul li{float: left;width:240px;    overflow: hidden;color:#fff;    transition: all .3s;}
.server ul .active{width:465px;}
.server ul li:nth-child(n+2){margin-left: 5px;}

.server ul li .sermodwrap{width: 465px;}
.server ul li .sermod{background: red;width: 240px;box-sizing: border-box;float: left;position: relative;padding:10% 5%;}
.server ul li .sermod2{width: 225px;float: left;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.server ul li .sermod2 a{font-size:14px;transition:all .2s;color:#fff;position: relative;z-index: 10;display: block;width: 55%;padding:5px 3px;border:1px solid #898b8c;margin:3px 0;text-align: center;border-radius:2px;}
.sermod b{
    position: absolute;
    width: 0;
    right: -12px;
    height: 0;
    top: 50%;
    margin-top: -5px;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 12px solid #4f9cdb;
    z-index: 10;
}
.sermod img{max-height:45px;}
.sermod2{position: relative;}
.sermod2:after{
    content:"";
    background: #000;
    left: 0;
    opacity: .5;
    filter: "alpha(opacity=50)";
    filter: alpha(opacity=50);
    zoom: 1;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    position: absolute;
}
.server ul li:nth-child(1) .sermod{background: #4f9cdb;}
.server ul li:nth-child(1) .sermod b{border-left-color: #4f9cdb;}
.server ul li:nth-child(1) .sermod2 a:hover{background: #4f9cdb;border-color: #4f9cdb;}
.server ul li:nth-child(2) .sermod{background: #7a99ed;}
.server ul li:nth-child(2) .sermod b{border-left-color: #7a99ed;}
.server ul li:nth-child(2) .sermod2 a:hover{background: #7a99ed;border-color: #7a99ed;}
.server ul li:nth-child(3) .sermod{background: #51d2b7;}
.server ul li:nth-child(3) .sermod b{border-left-color: #51d2b7;}
.server ul li:nth-child(3) .sermod2 a:hover{background: #51d2b7;border-color: #51d2b7;}
.server ul li:nth-child(4) .sermod{background: #fdad73;}
.server ul li:nth-child(4) .sermod b{border-left-color: #fdad73;}
.server ul li:nth-child(4) .sermod2 a:hover{background: #fdad73;border-color: #fdad73;}

.sermod .link{color:#fff;margin-top: 20%;display: block;}
.sermod h4{font-size: 2.5rem;font-weight: normal;margin:20px 0 40px;}

.process{background:#f7f8f9;padding:7vh 0 10vh;}
.process ul{display: flex;justify-content: space-between;align-items: center;margin-top:8vh;}
.process li{display: inline-block;}
.process li p{margin-top: 20px;text-align: center;}
.process li:nth-child(n+2){opacity: 0;transition: all 2s ;}

.materials{margin:7vh 0;}
.materials .wrap{display: flex;justify-content: space-between;align-items: center;margin-top:5vh;}
.materials .pic img:nth-child(n+2){display: none;}
.materials .m-list{padding-right: 5%;}
.materials .m-list p{background:url(../images/correct.png) no-repeat;padding:3px 0 5px 40px;font-size: 1.7rem;margin-bottom: 10px;cursor:pointer;}
.materials .m-list span{display: block;margin-top: 50px;font-size: 1.2rem;}

.anim{position: relative;}
.anim .wrap{position: relative;z-index: 31;color:#fff;padding:8vh 0 15vh;overflow: hidden; }
.anim .wrap .ques{float: left;width: 50%;}
.anim .wrap .share{margin-left: 55%;border-left: 1px dashed #fff;padding-left: 5%;}
.anim .wrap a{color:#fff;}
.anim .wrap h3{font-size: 3rem;font-weight: normal;}
.anim .wrap .en{font-family: "AvantGardeITC-BookOblique";font-size: 2rem;margin:15px 0 40px;}
.bg2 .waveWrapperInner{background: #3a7eed;}
.bg2 .waveBottom{background-size: 50% 150px;}
.anim .ques li{margin-bottom: 30px;}
.anim .ques li span{font-size: 1.5rem;}
.anim .ques li p{line-height: 2;color:#aecbfd;margin-top: 5px;font-size: 1.3rem;}
.anim .ques #mq{max-height: 350px;overflow: hidden;}
.anim .share li{margin-bottom: 30px;}
.anim .share li span{position: relative;font-size: 1.5rem;}
.anim .share li p{line-height: 2;color:#aecbfd;margin-top: 5px;font-size: 1.3rem;height: 52px;    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;}
.anim .share li span:before{position: absolute;content: "◆";left:-25px;font-size: 2rem;top:-3px;}

.ani2{overflow:hidden;width: 100%;display: flex;flex-shrink: 0;margin-top: 20px;}
.ani2 img{animation: move_wave2 4s linear infinite;}
.ani2 img:nth-child(2){transform: rotateY(360deg);}

.message{padding:7vh 0 10vh;background: #f3f7f8;}
.message .txt{color:#787878;text-align: center;margin:3vh 0 10vh;}
.message form{text-align: center;}
.message input{width: 200px;padding:10px;margin: 0 10px;}
.message button{color:#fff;background: #10c9c3;display: block;margin: 20px auto;padding:10px 20px;margin-top: 40px;outline: none;cursor: pointer;}

.area{padding:7vh 0 15vh;}
.area .wrap{position: relative;margin-top: 10vh;}
.area .swiper-button-next{right:-50px;zoom:0.6;}
.area .swiper-button-prev{left:-50px;zoom:0.6;}
.area .swiper-slide .avatar{width: 112px;height:113px;background: url(../images/city.png);margin:0 auto;position: relative;}
.area .swiper-slide .avatar p{position: absolute;right:-25px;top:50%;transform: translateY(-50%);color:#2d7ff2;font-size: 2.7rem;font-weight: lighter;}
.area .swiper-slide{text-align: center;padding:25px 0;background: #fff;}
.area .swiper-slide p:nth-child(2){font-size: 2.0rem;margin:15px 0;}
.area .swiper-slide span:nth-child(3){font-size: 1.2rem;}
.area .swiper-slide p:nth-child(4){font-size: 4.0rem;color:#2d7ff2;}
.area .swiper-slide span:nth-child(5){font-size: 1.5rem;color:#2d7ff2;}
.area .swiper-slide:hover .avatar p,.area .swiper-slide:hover p:nth-child(2),.area .swiper-slide:hover p:nth-child(4),.area .swiper-slide:hover span:nth-child(3),.area .swiper-slide:hover span:nth-child(5){color:#fff;}
.area .swiper-slide:hover{background: #2d7ff2;}

.service {padding:7vh 0 10vh;}
.service ul {display: flex;justify-content:space-between;margin-top: 5vh;}
.service ul li{text-align: center;}
.service ul li div{position: relative;}
.service ul li:hover img{filter:grayscale(0);}
.service ul  li:hover i {
  opacity: 1;
  transform: scale(1);
}
.service ul  li:hover {color:#4f8cde;}
.service ul li div i {
  position: absolute;
  left: 0;
  top: 0;
  transform: scale(0.7);
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  opacity: 0;
  border-radius: 100px;
  border: 2px solid #c7dfff;
  transition: all 275ms cubic-bezier(0.37, 0.74, 0.15, 1.65);
}

.service ul li div{width: 200px;height:200px;border-radius: 100%;display: flex;align-items: center;justify-content: center;margin-bottom:30px;}
.service ul li div img{width: 60%;filter:grayscale(100%);}
.service ul li span{font-size: 2rem;}
.service ul li p{;margin-top: 15px;}

.team{color:#fff;padding:7vh 0 10vh;}
.team .txt{text-align: center;font-size: 3rem;margin: 20vh 0 ;}

.number{padding:5vh 0;}
.number .wrap{overflow: hidden;}

.number .wrap >div{width: 25%;float: left;text-align: center;vertical-align: middle;box-sizing: border-box;}
.number.number2 .wrap >div{width: 33.3%;}
.number .wrap >div .txt{display: inline-block;vertical-align: middle;text-align: left;color:#828484;margin-left: 10px;}
.number .wrap >div .txt span{}
.number .wrap >div .txt p{font-size: 2.3rem;font-family: "359-CAI978";}
.number .wrap >div:nth-child(n+2){border-left: 1px solid #e5e5e5;} 

.number2 {background: #f3f7f8;}
.number2 a {text-align: center;display: inline-block;margin-right: 10px;color:#828484;}
.number2 a img{display: table;margin-bottom:5px;width: 41px;}

footer{color:#828484;background: #2a2a2a;    padding-bottom: 130px; }
footer .wrap{overflow: hidden;}
footer .addr {overflow: hidden;padding:3vh 0;border-bottom: 1px  dotted #828484;}
footer .addr ul{width: 22%;margin-left: 4%;float: left;line-height: 1.6;}
footer .addr ul:first-child{margin-left: 0;}
footer .menu{width: 70%;}
footer .menu a{color:#828484;}
footer .menu dd:hover a{color:#fff;}
footer .menu dl{width: 22%;margin-left: 4%;float: left;line-height: 2;}
footer .menu dd{font-size: 1.3rem;margin-left:0;transition: all .3s;}
footer .menu dd:hover{margin-left:10px;}
footer .menu dt{margin-bottom: 5px;font-size: 1.6rem;}
footer .menu dl:first-child{margin-left: 0;}
footer .wx{float: right;}
footer .wx img{display: block;margin-bottom: 10px;width: 107px;}
footer .wx div{display: inline-block;text-align: center;}
footer .wx div:first-child{margin-right: 20px;}
.m-w{border-bottom: 1px  dotted #828484;padding:3vh 0;overflow: hidden;}
.copyright{text-align: center;padding:30px 0;font-size: 1.2rem;}
.copyright a{color:#828484;}
.icp{margin-top: 10px;}

.info2.wrap{position: absolute;left:50%;transform: translateX(-50%);width: 1200px;    transition: padding .3s;}

.banner{position: relative;}
.banner form{position: absolute;bottom: 40px;left:50%;transform: translateX(-50%);width: 1000px;box-sizing:border-box;}
.banner form p{color:#fff;margin-bottom: 10px;text-shadow: 0 0 10px #333; }
.banner form p span{color:#fe4c8d;font-size: 1.7rem;margin:0 10px;}
.banner form input{width: 35%;padding:10px 0 10px 20px;box-sizing: border-box;border-radius: 15px;}
.banner form button{width: 25%;padding:10px 0 ;box-sizing: border-box;border-radius: 15px;background: #10c9c3;color:#fff;cursor: pointer;}

.advantages{margin-top: 10vh;}
.advantages ul{overflow: hidden;padding:50px 0;}
.advantages ul li{position:relative;width: 32%;margin-bottom: 20px;float:left;}
.advantages ul li:hover{transform:translateY(-30px);}
.advantages ul li:nth-child(3n-1){margin:0 2% 20px 2%;}
.advantages ul li div{position: absolute;top:20%;left:14%;}
.advantages ul li div span{font-size: 2.5rem;}
.advantages ul li div p{font-size: 1.5rem;margin-top: 40px;}

.public{background: #2b73f6;color:#fff;padding:100px 0;}
.public .list{background: #fff;color:#4d4d4d;display: flex;justify-content: space-between;padding:30px 3%;box-sizing: border-box;margin-top: 70px;}
.public .list ul{position: relative;}
.public .list ul:nth-child(n+2){padding-left: 50px;}
.public .list ul:nth-child(n+2):before{content: "";position:absolute;left:0;top:0;height: 100%;width: 1px;background: #acccf2;}
.public .list ul li{margin-bottom: 15px;}
.public .list ul li i{display: inline-block;width: 40px;height:40px;background: #acccf2;color:#fff;font-size: 2rem;font-style: normal;text-align:center;line-height: 40px;vertical-align: middle;}
.public .list ul li p{font-size: 1.6rem;}
.public .list ul li span{font-size: 1.2rem;}
.public .list ul li div{display:inline-block;vertical-align: middle;max-width: calc(100% - 50px);margin-left: 10px;}
.public .list ul:last-child li:last-child{background: #605ca8;margin-top: 50px;color:#fff;text-align: center;padding:15px 0;}
.public .list ul:last-child li:last-child p{font-size: 1.3rem;}

.trust{margin-top: 10vh;}
.trust ul{overflow: hidden;margin:70px auto 40px;}
.trust li{position: relative;width: 20.5%;margin-right: 6%;float:left;text-align: center;margin-bottom: 50px;}
.trust li span{font-size: 1.7rem;}
.trust li p{width: 90%;margin:5px auto;font-size: 1.4rem;margin-top: 10px;}
.trust li:nth-child(4n-3) span{color:#e95f58;}
.trust li:nth-child(4n-2) span{color:#38cfad;}
.trust li:nth-child(4n-1) span{color:#4e9bdd;}
.trust li:nth-child(4n) span{color:#ebb944;}
.trust li:nth-child(4n){margin-right: 0;}
.trust li:nth-child(4n-3):after,.trust li:nth-child(4n-1):after{content:'';position: absolute;top:30%;right:-28%;width:31%;height: 48%;background: url(../images/tt-1.png) no-repeat;}
.trust li:nth-child(4n-2):after{content:'';position: absolute;top:30%;right:-28%;width:31%;height: 48%;background: url(../images/tt-2.png) no-repeat;}
.trust>a{display: table;margin:0 auto 70px;background: #005ee6;color:#fff;padding:8px 40px;border-radius: 20px;box-shadow: 2px 3px 15px #005ee6;}
.trust>a:hover{background:#fff ;color:#005ee6;transition: background .3s;}

.demeanor{background: #f7f8f9;padding:70px 0;}
.demeanor .wrap{position: relative;margin-top: 70px;}
.demeanor .swiper-button-next{right:-50px;zoom:0.8;}
.demeanor .swiper-button-prev{left:-50px;zoom:0.8;}

.prepare{margin-top: 10vh;}
.prepare .wrap{display: flex;align-items: center;margin:70px auto;}
.prepare .wrap img{max-width: 50%;}
.prepare .wrap ul{margin-left: 100px;}
.prepare .wrap li span{font-style: italic;font-size: 1.8rem;background: #2d7ff2;border-radius: 50%;display: inline-block;width: 25px;height:25px;padding-right:3px;vertical-align: middle;text-align: center;color:#fff;}
.prepare .wrap li p{display: inline-block;max-width: calc(100% - 50px);white-space: nowrap;margin-left: 20px;vertical-align: middle;}
.prepare .wrap ul li{margin-bottom: 15px;}

.get{padding:70px 0;background: #f7f8f9;}
.get .wrap{margin-top:60px;}

.why{background: url(../images/why.png);background-size: 100% auto;color:#fff;padding:70px 0;}
.why .vs{position: relative;width: 23%;margin:0 auto;background-color: #fff;padding:10px 100px;margin:75px auto 30px;}
.why .vs img{position:absolute;left:50%;top:-75px;transform: translateX(-50%);}
.why .vs{display: flex;justify-content: space-between;border-radius: 30px;}
.why .vs span{color:#005ee6;font-size: 2.2rem;}
.why .vs span:last-child{color:#61d9d5;}
.why ul{margin:0 auto;display: table;}
.why ul li{position: relative;margin:18px 0;}
.why ul li p{position: absolute;white-space: nowrap;top:15px;font-size: 1.8rem;}
.why ul li span{background: #005ee6;border-radius: 50%;border:1px solid #fff;display: inline-block;width: 50px;height: 50px;font-size: 1.8rem;text-align: center;line-height: 50px;}
.why ul li p:first-child{right:150%;}
.why ul li p:last-child{left:150%;}

.later .swiper-slide{padding:50px 30px 30px 30px;box-sizing: border-box;}
.later .swiper-slide{background-size: 100% 100%;}
.later .swiper-slide h3{color:#005ee6;font-size: 2.5rem;font-weight: normal;margin-bottom: 20px;}
.later .swiper-slide div{height: 150px;margin-bottom: 50%;line-height: 1.6;color:#4d4d4d;}
.later .swiper-slide span{color:#2d7ff2;text-shadow: 0 0 10px #aaa;}

.application {text-align: center;margin:70px 0 200px;}
.application ul{margin-top: 50px;}
.application ul li{ display:inline-block;width: 10%;position: relative;vertical-align: top;margin:0 15px;}
.application ul li:nth-child(even){transform: translateY(50px);}
.application ul li div{border:2px solid #2777ea; width:80px;margin:0 auto;height: 80px;display: flex;align-items: center;justify-content: center;border-radius: 50%;}
.application ul li p{white-space: nowrap;position: absolute;bottom: -40px;left: 50%;transform: translateX(-50%);}
.application ul li:nth-child(odd):after{position: absolute;content:'';width:50px;height: 2px;background:#2777ea;right:-40px;transform:rotateZ(20deg);bottom:10px;}
.application ul li:nth-child(even):not(:last-child):after{position: absolute;content:'';width:50px;height: 2px;background:#2777ea;right:-45px;transform:rotateZ(-20deg);top:20px;}

.need{background-image:url(../images/need.png);background-repeat: no-repeat;padding-bottom: 180px;}
.need .wrap{display: flex;flex-direction:column;align-items:flex-end;margin-top: 70px; font-size: 1.8rem;}
.need .wrap div{width: 50%;margin-bottom: 20px;}
.need .wrap div i{font-family: "AvantGardeITC-BookOblique";font-size:2.2rem;}

.brand ul{overflow: hidden;margin: 100px auto 70px;}
.brand li{float: left;width: 23.5%;margin-right: 2%;margin-bottom: 20px;text-align: center;color:#fff;}
.brand li:hover img{transform: rotate(360deg);transition: all 0.6s;}
.brand li div{height: 100px;display: flex;align-items: center;justify-content: center;}
.brand li p{font-size: 2rem;}
.brand li a{display: table;color:#fff;border:1px solid #fff;margin:20px auto 40px;padding:5px 30px;border-radius: 20px;}
.brand li:nth-child(4n){margin-right: 0;background: #fdad73;}
.brand li:nth-child(4n-1){background-color: #51d2b7;}
.brand li:nth-child(4n-2){background-color: #7a99ed;}
.brand li:nth-child(4n-3){background-color: #4f9cdb;}

.demeanor .swiper-slide p{text-align: center;margin-top: 10px;font-size: 2rem;color:#4d4d4d;}
.later .swiper-slide p{text-align: left;font-size: 1.5rem;margin-top: 0;}

.change{background: #f7f8f9;padding:70px 0;}
.change .intro{text-align: center;margin:30px auto 60px;font-size: 1.6rem;}
.change .intro span{color:#68727c;}
.change .intro p{color:#fe4c8d;}
.change ul{overflow: hidden;}
.change li{float:left;width: 30%;margin-bottom:50px;/*background:#fff url(../images/changebg.png) no-repeat left bottom;*/background-size:100% auto;display: flex;justify-content: center;align-items: center;flex-direction: column;padding:5% 0;}
.change li:nth-child(3n-1){margin:0 5% 20px 5%;}
.change li p{height: 40px;display: flex;align-items: center;justify-content: center;font-size: 1.6rem;text-align: center;}
.change li span{margin-bottom:50px;font-family:"方正正大黑简体";display: flex;width: 100px;height:100px;align-items: center;justify-content: center;font-size: 2.5rem;background: #f0f0f0;border-radius: 50%;}
.change li:hover span{background: linear-gradient(to right,#54bdf2,#f246bc);color:#fff;}
.layui-layer{transition: none;}

.info .swiper-container{float: left;width: 50%;}
.info .b-info{margin: 40px 0 70px;overflow: hidden;}
.info .info-list{overflow: hidden;}
.info .swiper-pagination-bullet{background: #cdcecc;width:15px;height:8px;opacity: 1;border-radius: 5px;}
.info .swiper-pagination-bullet-active{background: #4f9cdb;width: 20px;}
.info .swiper-container-horizontal>.swiper-pagination-bullets{bottom:15%;}
.info .swiper-slide img{width: 100%;}
.info .swiper-slide p{position: absolute;left:0;width: 100%;bottom:0;padding:15px 0;color:#fff;background: rgba(0,0,0,0.8);text-align: center;overflow: hidden;white-space:nowrap;text-overflow: ellipsis;}
.info .info-hot{margin-left: 55%;}
.info .info-hot a{border-bottom: 1px solid #c9c9c9;padding-bottom:20px;display: block;margin-bottom: 25px;}
.info .info-hot a:hover h3{color:#4f9cdb;}
.info .info-hot h3{color:#3f3a39;font-size: 1.6rem;}
.info .info-hot span{color:#a5a5a5;font-size: 1.3rem;display: block;margin: 10px 0;}
.info .info-hot p{color:#666;font-size: 1.3rem;display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;}
.info .info-list a{float: left;width: 23.5%;margin-left: 2%;margin-bottom: 30px;background: #f5f5f5;padding:40px 20px;box-sizing: border-box;}
.info .info-list a:hover{background: #4f9cdb;}
.info .info-list a:hover h3,.info .info-list a:hover span,.info .info-list a:hover p,.info .info-list a:hover span:last-child{color: #fff;}
.info .info-list a h3{color:#3f3a39;font-size: 1.6rem;display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;height: 40px;}
.info .info-list a span{color:#a5a5a5;font-size: 1.3rem;}
.info .info-list a div{margin-top: 10px;}
.info .info-list a span:last-child{color:#4f9cdb;}
.info .info-list a p{color:#666666;font-size: 1.3rem;;display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;height: 70px;margin:15px 0;}
.info .info-list a:nth-child(4n-3){margin-left: 0;}
.page{text-align: center;margin: 50px 0 65px;}
.page a{color:#4f9cdb;font-size: 1.3rem;border:1px solid #4f9cdb;padding:5px 10px;margin:0 5px;}
.page a:hover{background: #4f9cdb;color:#fff;}

.detail h1{color:#3f3a39;font-size: 1.8rem;margin:25px 0;}
.detail .content{float: left;width: 70%;}
.detail .n-hot{margin-left: 75%;}
.detail .share{color:#a5a5a5;font-size: 1.3rem;padding:15px ;background: #f6f6f6;}
.detail .share a{float: right;margin-top: -3px;}
.detail .main{color:#666;font-size: 1.3rem;line-height: 2.4;}
.detail .main img{margin: 20px auto;display: table;}
.detail .n-page{clear: left;padding: 50px 0;}
.detail .n-page a{clear: left;color:#666;font-size: 1.3rem;line-height: 2.4;display: table;}
.detail .n-page a:hover{color:#4f9cdb;}
.detail .n-hot h2{color:#fff;font-size: 2rem;background: #4f9cdb;padding:15px;font-weight: normal;margin-bottom: 20px;}
.detail .n-hot a{border-bottom: 1px solid #c9c9c9;padding-bottom:20px;display: block;margin-bottom: 20px;}
.detail .n-hot a:hover h3{color:#4f9cdb;}
.detail .n-hot h3{color:#3f3a39;font-size: 1.5rem;}
.detail .n-hot span{color:#a5a5a5;font-size: 1.3rem;display: block;margin: 10px 0;}
.detail .n-hot p{color:#666;font-size: 1.3rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;}

.bshare-custom {
    text-align: right;
    margin-top: 10px;
}
#mq+a{margin-top: 40px;display: table;}
.detail.clearfix{margin-top: 50px;}


/****************phone*************/
#site-navigation {
    margin-left: auto;
    position: fixed;
    z-index: 125;
    top:28px;
    right:30px;
    display: none;
}

#site-navigation .menu-toggle {
    cursor: pointer;
    width: 45px;
    z-index: 120;
    position: relative
}

#site-navigation .menu-toggle span {
    transition: all 300ms ease-in-out;
    width: 40px;
    height: 3px;
    display: block;
    margin-bottom: 9px;
    background: #fff;
}

#site-navigation .menu-toggle div {
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    margin-top: 10px
}
.m #site-navigation .menu-toggle span{background: #282828;}
.m #site-navigation .menu-toggle div{color: #282828;}
#site-navigation .menu-toggle.active span:first-of-type {
    transform: translate(0, 12px) rotate(45deg)
}

#site-navigation .menu-toggle.active span:nth-child(2) {
    opacity: 0
}

#site-navigation .menu-toggle.active span:last-of-type {
    transform: translate(0, -12px) rotate(-45deg)
}

#site-navigation .menu-main_menu-container {
    opacity: 0;
    visibility: hidden;
    transition: all 500ms ease-in-out;
    position: fixed;
    background: #3e97f4;
    top: 0;
    left: 0;
    right: 0;
    bottom: 35%;
    z-index: 110;
    padding-top: 40px;
    transform:  translateY(-50%);transition:.5s ease;
}

#site-navigation .menu-main_menu-container.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

#site-navigation .menu-main_menu-container ul {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 0;
    margin: 0
}

#site-navigation .menu-main_menu-container ul li {
    width: 100%;
    display: block;
    text-align: center
}

#site-navigation .menu-main_menu-container ul li a {
    margin: 0 auto;
    display: inline-block;
    text-align: center;
    color: #fff;
    font-weight: 300;
    font-size: 17px;
    line-height: 40px;
    text-transform: uppercase
}
#site-navigation .menu-main_menu-container ul li.cur a {    border-bottom: 1px solid;}
#site-navigation .menu-main_menu-container ul li a:hover {
    color: #eb2961;
    text-decoration: none;
    font-weight: 900
}
#site-navigation .menu-main_menu-container ul li div a{display: block;font-size: 2.1rem;line-height: 50px;}

/*sch.php*/
.s-head{position:relative;background: url(../images/s-bg.png) no-repeat center center/cover;text-align: center;color:#fff;padding:100px 0;}
.s-head p{font-size: 6rem;margin-bottom: 10px;}
.s-head span{font-size: 2rem;}
.s-head .icon{position:absolute;bottom:0;left:50%;transform: translate(-50%,50%);background: #fff;padding:30px 27px;border-radius: 50%;box-shadow:1px 2px 5px 1px #ddd;}
.s-form{max-width: 1000px;margin:0 auto;}
.s-form h3{color:#fff;display: table;margin:120px auto 50px;background: #eb4a3f;padding:5px 15px;font-weight: normal;border-radius: 20px;}
.s-form .f1,.s-form .f2{display: flex;justify-content: space-between;text-align: center;border:1px solid #d2d2d2;border-radius: 40px;padding:20px 40px;}
.s-form .f1>div{width: 25%;}
.s-form .f1>div p{color:#eb4a3f;margin-bottom: 10px;}
.s-form input,.s-form select{width: 100%;background:#f0f0f0;padding: 10px 15px;border-radius: 20px;outline: none;-webkit-appearance: none;    box-sizing: border-box;}
.s-form select{background:#f0f0f0  url(../images/s-icon.png) no-repeat right 10px center;transition: none;}
.s-form select.active{background-image: url(../images/s-icon2.png);}
.s-form .f2{flex-wrap: wrap;margin-top: 25px;}
.s-form .f2>div{width: 40%;margin-bottom: 10px;}
.s-form .f2>div p{color:#eb4a3f;margin-bottom: 10px;}
.s-form .submit{text-align: center;margin:40px 0 80px;}
.s-form .submit button,.s-form .submit a{display: inline-block;width:20%;padding:15px 5px;background: #cc0000;color:#fff;outline: none;font-size: 2rem;}
.s-form .submit button{cursor: pointer;background: #eb4a3f;}
.s-form .submit a:nth-child(2){margin:0 25px;}

.s-foot{background: #f5f5f5;padding:40px 0;text-align: center;color:#9ea7ad;}

.footNav{display: none;}

@media screen and (max-width: 1550px){
  .need .wrap div{width: 43%;}
}
@media screen and (max-width: 1450px){
    header ul{margin-right: 0;}
    header .tel{right: 0;}
  
}
@media screen and (max-width: 768px){
    #site-navigation{display: block;}
   header>a img{width: 230px;}
   header ul{display: none;}
   header .tel{display: none;}
   header span{font-size: 1.3rem;}
   header .tel{top:4px;right:5px;}
   .server{margin-top: 5vh;}
   .title p{font-size: 2.1rem;}
   .title span{font-size: 2rem;}
   .server ul li{width: 50%;}
   .server ul li .sermodwrap,.server ul li .active{width: 100vw;}
   .server ul li .sermod{width: 50%;padding:5%;}
   .sermod h4{font-size: 1.8rem;margin: 20px 0 20px;}
   .sermod .link{margin-top: 15%;}
   .sermod p{font-size: 1.4rem;}
   .sermod img{max-height: 35px;}
   .server ul li .sermod2{display: none;}
   .sermod b{display: none;}
   .server ul li.active{width: 50%;}
   .server ul li:nth-child(n+2){margin-left: 0;}
   .server li, .sermod, .sermod2,.server ul .active{height:220px;}
   .process ul{padding:0 10px;}
   .materials .wrap{flex-wrap: wrap;justify-content: center;}
   .materials .wrap .pic,.materials .m-list{width: 80%;}
   .materials .m-list p{font-size: 1.5rem;}
   .materials .m-list span{margin-top: 30px;}
   .anim .wrap .ques{float: none;margin:0 20px;width: auto;}
   .anim .wrap .share{margin-left: 0;border-left: none;margin:0 20px;width: auto;}
   .anim .wrap h3{font-size: 2.4rem;}
   .anim .wrap .share{padding-left: 0;margin-top: 50px;}
   .anim .wrap .share ul{margin-left: 15px;}
   .anim .share li span:before{left:-20px;}
   .bg2 .waveBottom{background-size: 90% 100px;}
   .message input{width: 275px;margin:5px 10px;}
   .message .txt{margin: 3vh 0 6vh;}
   .area .wrap .swiper-container{margin:0 10px;}
   .area .swiper-slide .avatar p{font-size: 2.4rem;}
   .area .swiper-slide p:nth-child(2){    font-size: 1.6rem;}
   .area .swiper-slide p:nth-child(4){    font-size: 2.4rem;}
   .service ul{flex-wrap: wrap;padding:0 20px;margin-top: 3vh;}
   .service ul li div{width: 130px;height:130px;margin:0 auto 10px;}
   .service ul li span{font-size: 1.7rem;}
   .service ul li p{font-size: 1.4rem;}
   .banner form input{    padding: 5px 0 5px 5px;font-size: 12px;    border-radius: 10px;}
   .banner form button{    padding: 5px 0 5px;    border-radius: 10px;}
   .banner form.active{padding-bottom: 20px;}
   .team .txt{margin: 7vh 0;font-size: 2rem}
   .number .wrap >div .txt p{font-size: 1.6rem;}
   .number .wrap >div .txt span{font-size: 1.3rem;}
   .number .wrap >div>img{height: 25px;vertical-align: middle;}
   footer .addr{padding: 3vh 20%;font-size: 14px;}
   footer .addr ul{width: auto;float: none;margin-left: 0;}
   .m-w .menu{display: none;}
   footer .wx{float:none;display: table;margin:0 auto;}
   footer .wx div:first-child{margin-right: 65px;}
   footer .wx img{max-width: 95px;}
   footer{padding-bottom: 90px;}
   .number2 a{    font-size: 14px;margin-right: 25px;}
   .info2.wrap{width: 100%;background: #2d7ff2; padding:0 10px 10px;box-sizing: border-box;position: fixed;}
   .info2.wrap>a img{margin-top: 15px;}
   .banner{padding-top: 91px;}
   .banner form{background: #2d7ff2;position: static;width: auto;transform: none;padding:20px;left:0;}
   .prepare .wrap{display: block;}
   .prepare .wrap img{max-width: 80%;display: table;margin: 0 auto 15px;}
   .why ul li p{font-size: 1.5rem;}
   .why .vs{width: 70%;padding: 10px 34px;}
   .later .swiper-slide{padding: 30px 15px;}
   .later .swiper-slide h3{font-size: 1.8rem;}
   .later .swiper-slide p{font-size: 1.4rem;}
   .later .swiper-slide div{margin-bottom: 15%;}
   .advantages ul li{width: 50%;}
   .advantages ul li:nth-child(3n-1){margin:0 0 20px;}
   .advantages ul li div span{font-size: 1.7rem;}
   .advantages ul li div p{margin-top: 15px;}
   .advantages ul li div{    left: 12%;width: 75%;}
   .public .list{display: block;}
   .public .list ul:nth-child(n+2){padding-left:0 ;}
   .public .list ul:nth-child(n+2):before{display: none;}
   .public{padding: 70px 0 0;}
   .trust li{margin-bottom: 20px;}
   .trust li:nth-child(4n+1){clear: left;}
   .trust li span{font-size: 1.4rem;}
   .trust li:nth-child(4n-2):after,.trust li:nth-child(4n-3):after, .trust li:nth-child(4n-1):after{background-size: contain;}
   .demeanor .swiper-slide p{font-size: 1.6rem;}
   .demeanor .wrap{margin:40px 10px 0;}
   .change{padding-bottom: 0;}
   .change li span{font-size: 2rem;margin-bottom: 25px;}
   .change li p{font-size: 1.4rem;}
   .change li{width: 32%;padding:0;}
   .change li:nth-child(3n-1){margin: 0 2% 20px;}
   .application ul li{zoom:0.7;}
   .application ul li p{width: 152%;top: 120%;white-space:normal;}
   .application ul li:nth-child(odd):after{width: 26px;}
   .application ul li:nth-child(even):not(:last-child):after{width: 26px;}
   .application{margin-bottom: 120px;}
   .need{    background-size: cover;}
   .need .wrap div{width: 100%;padding:0 10px 7px;text-align: left;box-sizing: border-box;margin-bottom: 7px;}
   .need .wrap{font-size: 1.6rem;margin-top: 50px;padding-bottom: 30px;text-shadow: 0 0 10px #333;}
   .demeanor .swiper-button-next,.area .swiper-button-next,.demeanor .swiper-button-prev,.area .swiper-button-prev{display: none;}
   .brand li{    width: 48%;margin-right: 4%;}
   .brand li:nth-child(even){  margin-right: 0;}
   .brand ul{margin: 60px auto 30px;padding:0 15px;}
   .brand li p{font-size: 1.6rem;}
   .brand li a{padding: 3px 20px;margin: 15px auto 25px;font-size: 1.4rem;}
   .number .wrap >div{width: 50%;margin-bottom: 10px;}
   .number{padding: 3vh 0;}
   .number.number2 .wrap >div{width: 50%;}
   .number.number2 .wrap >div:last-child{width: 100%;}
   .brand li div{height:80px;}
   .demeanor{padding: 50px 0;}
   .info .swiper-container{float: none;width: auto;margin:10px;}
   .info .swiper-slide p{padding: 10px;box-sizing: border-box;font-size: 1.4rem;}
   .info .info-hot{margin-left: 20px;margin-right: 20px;margin-top: 30px;}
   .info .info-hot h3{font-size: 1.5rem;}
   .info .info-list a{width: 48%;margin-left: 4%;padding:  15px;}
   .info .info-list a:nth-child(4n-3){margin-left: 4%;}
   .info .info-list a:nth-child(odd){margin-left:0;}
   .info .b-info{margin-bottom: 30px;}
   .info .info-list{padding:0 10px;}
   .info .info-list a h3{font-size: 1.4rem;}
   .page{margin: 20px 0 40px;}
   .page a{padding: 3px 5px;}
   .why .vs span{ font-size: 1.8rem;} 
   .service ul li{width: 50%;}
   .server ul{padding: 0 10px;}

   .s-head p{font-size: 3rem;}
   .s-head .icon{    padding: 18px 15px;}
   .s-form .f1, .s-form .f2{display: block;margin-left:20px;margin-right: 20px;}
   .s-form .f1>div{width: initial;margin-bottom: 10px;}
   .s-form .f2>div{width: initial;}
   .s-form h3{    margin: 70px auto 30px;}
   .s-form .submit button, .s-form .submit a{font-size: 1.2rem;width: 22%;}

   .footNav{position: fixed;left: 0;bottom: 0;z-index: 999;width: 100%;display: block;}
   .footNav ul{display: flex;}
   .footNav ul li{width: 50%;}
   .footNav ul li a{text-align: center;font-size: 16px;padding: 15px 0;display: block;color: #fff;}
   .footNav ul li:nth-child(1) a{background: #fc9518;}
   .footNav ul li:nth-child(2) a{background: #7a99ed;}


    .detail{padding: 0 15px;}
    .detail h1{font-size: 1.5rem}
   .detail .content{float: initial;width: 100%;}
   .detail .n-hot{margin-top: 30px;margin-left: 0}
   .detail .n-page{padding: 30px 0;}
   .detail .n-page a{line-height: 2;margin-bottom: 20px;}
}