@charset "utf-8";


/*banner*/
.h460{height: 460px !important;}
.h560{height: 560px !important;}
.h680{height: 680px !important;}
.banner{height:680px;}
.banner-item{height: 100%;position: relative}
.swiper-slide{background-position:center center;background-size: auto 100%;}
.kkBanner-box{overflow: hidden}
.kkBanner-box *{color:#fff}
.kkBanner-box,.kkBanner-box ul{width:100%;height: 100%;position: relative}
.kkBanner-box ul li{height: 100%;width:100%;background-repeat: repeat-x;background-color: #07054d;background-position: center center;background-size:  auto 100%}
.kkBanner-box ul li .wrapper{height: 100%;}
.kkBanner-box ul li .route{background: url("../../img/line-bg.png");height:100%;position: relative;background-repeat: no-repeat;background-position: center 323px;width: 738px;margin: 0 auto;}
.kkBanner-box ul li .kkcloud{position: absolute;right: -42px;}
.kkBanner-box ul li .woman{position: absolute;bottom: 20px;left: 507px;}
.kkBanner-box ul li .man{position: absolute;bottom: 25px;left: 75px;}
.kkBanner-box ul li .light{background: url("../../img/light.png");width:64px;height:257px;background-size: 100% 100%;position: absolute}
.kkBanner-box ul li .light-01{bottom: 10px;left: 270px;}
.kkBanner-box ul li .light-02{bottom: 93px;left: 414px;}
.kkBanner-box ul li .info_l{width: 50%;z-index: 99}
.kkBanner-box ul li h1{font-size: 34px;font-weight: normal;line-height: 70px;}
.kkBanner-box ul li p{font-size: 18px;margin:10px 0 90px 0}
.kkBanner-box ul li a{display: block;width:130px;line-height: 40px;background-color: #3e5afb;text-align: center;border-radius: 3px;}
.kkBanner-box ul li>a{width: 100%;height: 100%;background: transparent;}

.kkBanner-box01{overflow: hidden}
.kkBanner-box01,.kkBanner-box01 ul{width:100%;height: 100%;position: relative}
.kkBanner-box01 ul li .wrapper{height: 100%;}
.kkBanner-box01 .swiper-slide > a{height: 100%;}
/*.icon{background: url("../../img/icon.png");display: block;width: 16px;height:16px;position: absolute;bottom: 15px;left: 25px;opacity: 0}*/
/*.icon01{background-position: 0 0;-webkit-animation:popMove 3s linear .5s infinite ;-moz-animation:popMove 3s linear .5s infinite ;-o-animation:popMove 3s linear .5s infinite ;left: 30px;animation: popMove 3s linear .5s infinite ;}*/
/*.icon02{background-position: 16px 0;-webkit-animation: popMove 5s ease 1s infinite;-moz-animation: popMove 5s ease 1s infinite;-o-animation: popMove 5s ease 1s infinite;animation: popMove 5s ease 1s infinite;left: 20px;}*/
/*.icon03{background-position: 32px 0;-webkit-animation: popMove 3s ease 2.2s infinite;-moz-animation: popMove 3s ease 2.2s infinite;-o-animation: popMove 3s ease 2.2s infinite;animation: popMove 3s linear 2.2s infinite;left: 25px;}*/
/*.icon04{background-position: 48px 0;-webkit-animation: popMove 4s ease 3s infinite;-moz-animation: popMove 4s ease 3s infinite;-o-animation: popMove 4s ease 3s infinite;animation: popMove 4s ease-in-out 3s infinite;left: 40px;}*/
/*.icon05{background-position: 64px 0;-webkit-animation: popMove 2.5s ease 1.5s infinite;-moz-animation: popMove 2.5s ease 1.5s infinite;-o-animation: popMove 2.5s ease 1.5s infinite;animation: popMove 2.5s ease-out 1.5s infinite;left: 15px;}*/
/*.icon06{background-position: 0 -16px;-webkit-animation: popMove 3s ease 1.2s infinite;-moz-animation: popMove 3s ease 1.2s infinite;-o-animation: popMove 3s ease 1.2s infinite;animation: popMove 3s linear 1.2s infinite ;left: 10px;}*/
/*.icon07{background-position: 64px -16px;-webkit-animation: popMove 4s ease 2.4s infinite;-moz-animation: popMove 4s ease 2.4s infinite;-o-animation: popMove 4s ease 2.4s infinite;animation: popMove 4s linear 2.4s infinite ;left: 24px;}*/
/*.icon08{background-position: 32px -16px;-webkit-animation: popMove 5s ease 3.6s infinite;-moz-animation: popMove 5s ease 3.6s infinite;-o-animation: popMove 5s ease 3.6s infinite;animation: popMove 5s linear 3.6s infinite ;left: 35px;}*/
/*.icon09{background-position: 48px -16px;-webkit-animation: popMove 2s ease .5s infinite;-moz-animation: popMove 2s ease .5s infinite;-o-animation: popMove 2s ease .5s infinite;animation: popMove 2s linear .5s infinite ;left: 42px;}*/

.banner-default{background-image:url(../../images/images3.0/banner/banner-default.png);background-position:center 60%;background-repeat: no-repeat}


.banner-inner{height: 450px;background-size: auto 100%;background-position:  center center;background-color: #283874;}

.swiper-pagination-bullet{border-radius:5px;background-color:#fff;opacity:.3;-webkit-transition:opacity .5s, background-color .5s, width .5s;-moz-transition:opacity .5s, background-color .5s, width .5s;-ms-transition:opacity .5s, background-color .5s, width .5s;-o-transition:opacity .5s, background-color .5s, width .5s;transition:opacity .5s, background-color .5s, width .5s}
.swiper-pagination-bullet-active{background-color:#fff;width:40px;border-radius:5px;opacity:1}


@-webkit-keyframes popMove {
    10% {
        opacity: 1;
    }
    25% {
        -webkit-transform: translate(20%, 0%);
    }
    50% {
        -webkit-transform: translate(-80%, 0%);
    }
    100% {
        bottom: 240px;
    }
}

@-moz-keyframes popMove {
    10% {
        opacity: 1;
    }
    25% {
        -moz-transform: translate(20%, 0%);
    }
    50% {
        -moz-transform: translate(-80%, 0%);
    }
    100% {
        bottom: 240px;
    }
}

@-ms-keyframes popMove {
    10% {
        opacity: 1;
    }
    25% {
        -ms-transform: translate(20%, 0%);
    }
    50% {
        -ms-transform: translate(-80%, 0%);
    }
    100% {
        bottom: 240px;
    }
}

@-o-keyframes popMove {
    10% {
        opacity: 1;
    }
    25% {
        -o-transform: translate(20%, 0%);
    }
    50% {
        -o-transform: translate(-80%, 0%);
    }
    100% {
        bottom: 240px;
    }
}

@keyframes popMove {
    10% {
        opacity: 1;
    }
    25% {
        transform: translate(20%, 0%);
    }
    50% {
        transform: translate(-80%, 0%);
    }
    100% {
        bottom: 240px;
    }
}

.kkBanner-box .point{background: url("../../img/point.png");width: 19px;height:19px;display: block;background-size: 100% 100%;position: absolute;opacity:1}
.kkBanner-box .point-01{bottom: 104px;left: 435px;-webkit-animation: movePoint01 5s infinite;-moz-animation: movePoint01 5s infinite;-o-animation: movePoint01 5s infinite;animation: movePoint01 5s infinite;}
.kkBanner-box .point-02{bottom: 104px;left: 437px;-webkit-animation: movePoint02 12s infinite;-moz-animation: movePoint02 12s infinite;-o-animation: movePoint02 12s infinite;animation: movePoint02 12s infinite;}
.kkBanner-box .point-03{bottom: 21px;left: 282px;-webkit-animation: movePoint03 5s ease 5s infinite;nimation: movePoint03 5s ease 5s infinite;-o-animation: movePoint03 5s ease 5s infinite;animation: movePoint03 5s ease 5s infinite;}
.kkBanner-box .point-04{bottom: 21px;left: 285px;-webkit-animation: movePoint04 6s ease 12s infinite;-moz-animation: movePoint04 6s ease 12s infinite;-o-animation: movePoint04 6s ease 12s infinite;animation: movePoint04 6s ease 12s infinite;}

@-webkit-keyframes movePoint01 {

    25%{
        -webkit-transform: translate(-84px,12px);
    }
    55%{
        -webkit-transform: translate(-8px,59px);
    }
    100%{
        -webkit-transform:translate(-152px,82px);
    }
}

@-moz-keyframes movePoint01 {

    25%{
        -moz-transform: translate(-84px,12px);
    }
    55%{
        -moz-transform: translate(-8px,59px);
    }
    100%{
        -moz-transform:translate(-152px,82px);
    }
}


@-ms-keyframes movePoint01 {

    25%{
        -ms-transform: translate(-84px,12px);
    }
    55%{
        -ms-transform: translate(-8px,59px);
    }
    100%{
        -ms-transform:translate(-152px,82px);
    }
}

@-o-keyframes movePoint01 {

    25%{
        -o-transform: translate(-84px,12px);
    }
    55%{
        -o-transform: translate(-8px,59px);
    }
    100%{
        -o-transform:translate(-152px,82px);
    }
}


@keyframes movePoint01 {

    25%{
        transform: translate(-84px,12px);
    }
    55%{
        transform: translate(-8px,59px);
    }
    100%{
        transform:translate(-152px,82px);
    }
}

@-webkit-keyframes movePoint02 {
    25%{
        -webkit-transform: translate(142px,-21px);
    }
    35%{
        -webkit-transform: translate(262px,52px);
    }
    45%{
        -webkit-transform:translate(172px,65px);
    }
    55%{
        -webkit-transform: translate(89px,17px);
    }
    75%{
        -webkit-transform: translate(-45px,36px);
    }

    85%{
        -webkit-transform: translate(-8px,59px);
    }
    100%{
        -webkit-transform:translate(-152px,82px);
    }
}

@-moz-keyframes movePoint02 {
    25%{
        -moz-transform: translate(142px,-21px);
    }
    35%{
        -moz-transform: translate(262px,52px);
    }
    45%{
        -moz-transform:translate(172px,65px);
    }
    55%{
        -moz-transform: translate(89px,17px);
    }
    75%{
        -moz-transform: translate(-45px,36px);
    }

    85%{
        -moz-transform: translate(-8px,59px);
    }
    100%{
        -moz-transform:translate(-152px,82px);
    }
}

@-o-keyframes movePoint02 {
    25%{
        -o-transform: translate(142px,-21px);
    }
    35%{
        -o-transform: translate(262px,52px);
    }
    45%{
        -o-transform:translate(172px,65px);
    }
    55%{
        -o-transform: translate(89px,17px);
    }
    75%{
        -o-transform: translate(-45px,36px);
    }

    85%{
        -o-transform: translate(-8px,59px);
    }
    100%{
        -o-transform:translate(-152px,82px);
    }
}


@keyframes movePoint02 {

    25%{
        transform: translate(142px,-21px);
    }
    35%{
        transform: translate(262px,52px);
    }
    45%{
        transform:translate(172px,65px);
    }
    55%{
        transform: translate(89px,17px);
    }

    75%{
        transform: translate(-45px,36px);
    }

    85%{
        transform: translate(-8px,59px);
    }
    100%{
        transform:translate(-152px,82px);
    }
}

@-webkit-keyframes movePoint03 {
    25%{
        -webkit-transform: translate(-86px,9px)
    }
    75%{
        -webkit-transform:translate(-289px,-111px);
    }
    100%{
        -webkit-transform: translate(-197px,-126px);
    }
}

@-moz-keyframes movePoint03 {
    25%{
        -moz-transform: translate(-86px,9px)
    }
    75%{
        -moz-transform:translate(-289px,-111px);
    }
    100%{
        -moz-transform: translate(-197px,-126px);
    }
}

@-ms-keyframes movePoint03 {
    25%{
        -ms-transform: translate(-86px,9px)
    }
    75%{
        -ms-transform:translate(-289px,-111px);
    }
    100%{
        -ms-transform: translate(-197px,-126px);
    }
}

@-o-keyframes movePoint03 {
    25%{
        -o-transform: translate(-86px,9px)
    }
    75%{
        -o-transform:translate(-289px,-111px);
    }
    100%{
        -o-transform: translate(-197px,-126px);
    }
}


@keyframes movePoint03 {
    25%{
        transform: translate(-86px,9px)
    }
    75%{
        transform:translate(-289px,-111px);
    }
    100%{
        transform: translate(-197px,-126px);
    }
}

@-webkit-keyframes movePoint04 {
    25%{
        -webkit-transform: translate(-71px,-51px);
    }
    50%{
        -webkit-transform:translate(-31px,-59px);
    }
    100%{
        -webkit-transform: translate(-106px,-109px);
    }
}

@-moz-keyframes movePoint04 {
    25%{
        -moz-transform: translate(-71px,-51px);
    }
    50%{
        -moz-transform:translate(-31px,-59px);
    }
    100%{
        -moz-transform: translate(-106px,-109px);
    }
}

@-ms-keyframes movePoint04 {
    25%{
        -ms-transform: translate(-71px,-51px);
    }
    50%{
        -ms-transform:translate(-31px,-59px);
    }
    100%{
        -ms-transform: translate(-106px,-109px);
    }
}

@-o-keyframes movePoint04 {
    25%{
        -o-transform: translate(-71px,-51px);
    }
    50%{
        -o-transform:translate(-31px,-59px);
    }
    100%{
        -o-transform: translate(-106px,-109px);
    }
}

@keyframes movePoint04 {
    25%{
        transform: translate(-71px,-51px);
    }
    50%{
        transform:translate(-31px,-59px);
    }
    100%{
        transform: translate(-106px,-109px);
    }
}

.banner01 .animate-box{background-image: url(../../img/banner/banner1-bg.png);background-position: right center;background-repeat: no-repeat;position: relative;width:580px;height:680px;}

#banner01-1{top: 200px;left: 272px;width: 128px;height:108px;-webkit-animation: cloudMove 3s infinite;-moz-animation: cloudMove 3s infinite;-o-animation: cloudMove 3s infinite;animation: cloudMove 3s infinite}
#banner01-2{top: 375px;left: 25px;}
#banner01-3{top: 430px;left: 466px;width: 46px;height:35px;}
#banner01-3 img{-webkit-animation: blockMove 4.5s linear infinite;-moz-animation: blockMove 4.5s linear infinite;-o-animation: blockMove 4.5s linear infinite;animation: blockMove 4.5s linear infinite;opacity: 0}
#banner01-3 img:nth-child(2){-webkit-animation-delay: 1.5s;-moz-animation-delay: 1.5s;-o-animation-delay: 1.5s;animation-delay: 1.5s}
#banner01-3 img:nth-child(3){-webkit-animation-delay: 3s;-moz-animation-delay: 3s;-o-animation-delay: 3s;animation-delay: 3s}
#banner01-5{top: 127px;left: 231px;}

#banner01-4{width:68px;height:92px;text-align: center;left: 480px;top: 374px;}
#banner01-4 img:not(:nth-child(4)){-webkit-animation: blockShow 5s infinite;-moz-animation: blockShow 5s infinite;-o-animation: blockShow 5s infinite;animation: blockShow 5s infinite;opacity: 0}
#banner01-4 img:nth-child(2){-webkit-transform: translate(0,-15px);-moz-transform: translate(0,-15px);-ms-transform: translate(0,-15px);-o-transform: translate(0,-15px);transform: translate(0,-15px);-webkit-animation-delay: 1s;-moz-animation-delay: 1s;-o-animation-delay: 1s;animation-delay: 1s}
#banner01-4 img:nth-child(3){-webkit-transform: translate(0,-30px);-moz-transform: translate(0,-30px);-ms-transform: translate(0,-30px);-o-transform: translate(0,-30px);transform: translate(0,-30px);-webkit-animation-delay: 2s;-moz-animation-delay: 2s;-o-animation-delay: 2s;animation-delay: 2s}
#banner01-4 img:nth-child(4){-webkit-transform: translate(-6px,-72px);-moz-transform: translate(-6px,-72px);-ms-transform: translate(-6px,-72px);-o-transform: translate(-6px,-72px);transform: translate(-6px,-72px);z-index: 1}
#banner01-4 .maskLight{-webkit-transform: translate(30px,-43px);-moz-transform: translate(30px,-43px);-ms-transform: translate(30px,-43px);-o-transform: translate(30px,-43px);transform: translate(30px,-43px);width:64px;background-color: rgba(62,90,251,0.2);-webkit-animation: light 1s linear forwards 2s;-moz-animation: light 1s linear forwards 2s;-o-animation: light 1s linear forwards 2s;animation: light 1s linear forwards 2s;border-bottom-left-radius:30px;border-bottom-right-radius:30px}

#banner01-6 {width:155px;height:178px;left: 410px;top: 80px;-webkit-animation: cloudMove 3s linear 2s infinite;-moz-animation: cloudMove 3s linear 2s infinite;-o-animation: cloudMove 3s linear 2s infinite;animation: cloudMove 3s linear 2s infinite}
#banner01-6 img{-webkit-animation: picMove 8s ease infinite;-moz-animation: picMove 8s ease infinite;-o-animation: picMove 8s ease infinite;animation: picMove 8s ease infinite}
#banner01-6 .block-opacity{width:150px;height:180px;background-image: url(../../img/banner/banner1-08.png);background-repeat: no-repeat}
#banner01-6 .block-opacity:nth-child(2){-webkit-animation: shadowMove 8s ease infinite;-moz-animation: shadowMove 8s ease infinite;-o-animation: shadowMove 8s ease infinite;animation: shadowMove 8s ease infinite}


.banner02 .animate-box{background-image: url(../../img/banner/banner2-bg.png);background-position: center 245px;background-repeat: no-repeat;position: relative;width:580px;height:680px;}
.banner02 .animate-box img:nth-child(5){left: 167px;top: 123px;}
.banner02 .animate-box img:nth-child(6){left: 162px;top: 336px;}

.banner02 .blc01{top:55px;left: 69px}
.banner02 .blc02{top:51px;left: 404px}
.banner02 .blc03{top: 270px;left: 360px;}
.banner02 .blc04{top: 255px;left: 90px;}
.banner02 .blc-item{background-image: url(../../img/banner/banner2-01.png);width:107px;height:71px;position: relative;}
.banner02 .blc-item:nth-child(1){top: 172px;}
.banner02 .blc-item:before{content: '';display: block;width: 80px;height: 80px;background-color: #6671b2;border-radius: 7px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform: rotateY(0deg) rotateX(56deg) rotateZ(45deg);-moz-transform: rotateY(0deg) rotateX(56deg) rotateZ(45deg);-ms-transform: rotateY(0deg) rotateX(56deg) rotateZ(45deg);-o-transform: rotateY(0deg) rotateX(56deg) rotateZ(45deg);transform: rotateY(0deg) rotateX(56deg) rotateZ(45deg);position: absolute;top: -9px;left: 13px;}
.banner02 .blc.active .blc-item:before{ -webkit-animation: backColor 2s 2s forwards; -moz-animation: backColor 2s 2s forwards; -o-animation: backColor 2s 2s forwards;animation: backColor 2s 2s forwards;
    /*background: -webkit-linear-gradient(#36cdff, #6740f7);background: -o-linear-gradient(#36cdff, #6740f7);background: -moz-linear-gradient(#36cdff, #6740f7);background: linear-gradient(#36cdff, #6740f7);*/
}
.banner02 .blc-item:last-child:before{width: 0;left: 0}
.banner02 .blc-item:nth-child(2){top: 86px;}
.banner02 .blc-item .dot{width: 4px;height: 4px;background-color: #e9f01f;border-radius: 5px;position: absolute;top: 60px;left: 63px;-webkit-animation: activeLight 5s 2s infinite;-moz-animation: activeLight 5s 2s infinite;-o-animation: activeLight 5s 2s infinite;animation: activeLight 5s 2s infinite}
.banner02 .blc-item:nth-child(2) .dot{-webkit-animation: activeLight 3s 4s infinite;-moz-animation: activeLight 3s 4s infinite;-o-animation: activeLight 3s 4s infinite;animation: activeLight 3s 4s infinite}
.banner02 .blc-item:nth-child(3) .dot{-webkit-animation: activeLight 4s 3s infinite;-moz-animation: activeLight 4s 3s infinite;-o-animation: activeLight 4s 3s infinite;animation: activeLight 4s 3s infinite}
.banner02 .blc-item .dot:nth-child(2){top: 57px;left: 69px;}
.banner02 .blc-item .dot:nth-child(3){top: 54px;left: 75px;}
#banner02-1{left: 235px;top: 190px;width: 95px;height:72px;-webkit-animation: cloudMove 2s linear infinite;-moz-animation: cloudMove 2s linear infinite;-o-animation: cloudMove 2s linear infinite;animation: cloudMove 2s linear infinite;z-index: 10}
.banner02 .float{width: 180px;height: 150px;left: 198px;top: 233px;}
.float i{width:8px;height:8px;display: block;opacity:0;-webkit-animation: popMove 3s linear .5s infinite;-moz-animation: popMove 3s linear .5s infinite;-o-animation: popMove 3s linear .5s infinite;animation: popMove 3s linear .5s infinite}
.float i:nth-child(2n){border-radius: 5px;-webkit-animation-delay: 2s;-moz-animation-delay: 2s;-o-animation-delay: 2s;animation-delay: 2s;-webkit-animation-duration: 2s;-moz-animation-duration: 2s;-o-animation-duration: 2s;animation-duration: 2s}
.float i:nth-child(1){background-color: #83d4a0;bottom: 63px;left: 39px;-webkit-animation-delay: 2s;-moz-animation-delay: 2s;-o-animation-delay: 2s;animation-delay: 2s;-webkit-animation-duration: 2s;-moz-animation-duration: 2s;-o-animation-duration: 2s;animation-duration: 2s;}
.float i:nth-child(2){background-color: #35bafe;bottom: 80px;left: 90px;-webkit-animation-delay: 4s;-moz-animation-delay: 4s;-o-animation-delay: 4s;animation-delay: 4s;-webkit-animation-duration: 3s;-moz-animation-duration: 3s;-o-animation-duration: 3s;animation-duration: 3s}
.float i:nth-child(3){background-color: #638afa;left: 60px;bottom: 62px;-webkit-animation-delay: 5s;-moz-animation-delay: 5s;-o-animation-delay: 5s;animation-delay: 5s;-webkit-animation-duration: 5s;-moz-animation-duration: 5s;-o-animation-duration: 5s;animation-duration: 5s}
.float i:nth-child(4){background-color: #638afa;left: 131px;bottom: 70px;-webkit-animation-delay: 4s;-moz-animation-delay: 4s;-o-animation-delay: 4s;animation-delay: 4s;-webkit-animation-duration: 3s;-moz-animation-duration: 3s;-o-animation-duration: 3s;animation-duration: 3s;}
.float i:nth-child(5){background-color: #cfd1ff;left: 100px;bottom: 50px;-webkit-animation-delay: 3s;-moz-animation-delay: 3s;-o-animation-delay: 3s;animation-delay: 3s;-webkit-animation-duration: 4s;-moz-animation-duration: 4s;-o-animation-duration: 4s;animation-duration: 4s}
.banner02 .arrow-up-left{clip-path: url(style.css);background: -webkit-linear-gradient( top,#9c3ade, rgba(103,64,247,0));background: -o-linear-gradient(top, #9c3ade,rgba(103,64,247,0));background: -moz-linear-gradient(top,#9c3ade,rgba(103,64,247,0));background: linear-gradient(top,#9c3ade, rgba(103,64,247,0));width:17px;height:85px;left: 126px;top: 307px;animation: cloudMove 3s linear .5s infinite}
.banner02 .arrow-up-right{clip-path: url(style.css);background: -webkit-linear-gradient( top,#9c3ade, rgba(103,64,247,0));background: -o-linear-gradient(top, #9c3ade,rgba(103,64,247,0));background: -moz-linear-gradient(top,#9c3ade,rgba(103,64,247,0));background: linear-gradient(top,#9c3ade, rgba(103,64,247,0));width:17px;height:85px;right: 126px;top: 307px;animation: cloudMove 3s linear .5s infinite}

.banner03 .animate-box{background-image: url(../../img/banner/banner3-bg.png);background-position: right 200px;background-repeat: no-repeat;position: relative;width:580px;height:680px;}
.banner03 #line01{left: 462px;top: 469px;}
.banner03 #line01 path{stroke-dasharray: 100;-webkit-animation: dash 5s linear infinite;-moz-animation: dash 5s linear infinite;-o-animation: dash 5s linear infinite;animation: dash 5s linear infinite;}
.banner03 #line02{left: 238px;top: 388px;}
.banner03 #line02 path{stroke-dasharray: 100;-webkit-animation: dash 5s linear infinite;-moz-animation: dash 5s linear infinite;-o-animation: dash 5s linear infinite;animation: dash 5s linear infinite;}

#banner3-01{left: 257px;top: 218px;-webkit-animation: cloudMove 3s linear infinite;-moz-animation: cloudMove 3s linear infinite;-o-animation: cloudMove 3s linear infinite;animation: cloudMove 3s linear infinite}
#banner3-02{left: 440px;top: 240px;-webkit-animation: cloudMove 2s linear 1s infinite;-moz-animation: cloudMove 2s linear 1s infinite;-o-animation: cloudMove 2s linear 1s infinite;animation: cloudMove 2s linear 1s infinite}
#banner3-03{left: 540px;top: 310px;}
#banner3-04{left: 396px;top:298px;}
#banner3-05{left: 175px;top:254px;}
#banner3-06{width:92px;height:84px;left: 454px;top: 494px;}
#banner3-06 .dot-item i{width:5px;height:5px;background-color:#e9f01f;display: block;border-radius: 5px }
#banner3-07{left: 300px;top: 271px;}
#banner3-08{left: 560px;top: 315px;-webkit-animation: cloudMove 7s linear infinite;-moz-animation: cloudMove 7s linear infinite;-o-animation: cloudMove 7s linear infinite;animation: cloudMove 7s linear infinite}

.banner04 .animate-box{background-image: url(../../img/banner/banner4-bg.png);background-position: right 140px;background-repeat: no-repeat;position: relative;width:580px;height:680px;}
#banner4-01{left: 479px;top: 206px;}
#banner4-02{left: 125px;top: 157px;}
#banner4-03{left: 120px;top:345px;-webkit-animation: cloudMove 7s linear infinite;-moz-animation: cloudMove 7s linear infinite;-o-animation: cloudMove 7s linear infinite;animation: cloudMove 7s linear infinite}
#banner4-03-1{left: 93px;top:378px;width:66px;-webkit-animation: cloudMove 5s linear 1s infinite;-moz-animation: cloudMove 5s linear 1s infinite;-o-animation: cloudMove 5s linear 1s infinite;animation: cloudMove 5s linear 1s infinite}
#banner4-03-2{left: 67px;top:405px;width:51px;-webkit-animation: cloudMove 3s linear 2s infinite;-moz-animation: cloudMove 3s linear 2s infinite;-o-animation: cloudMove 3s linear 2s infinite;animation: cloudMove 3s linear 2s infinite}
#banner4-04{left: 317px;top:204px;}
#banner4-05{left: 275px;top:335px;}
#banner4-06{left: 180px;top:195px;}
.banner04 .float{width:110px;height:150px;left: 286px;top:312px;}
.banner04 #line03{left: 239px;top: 492px;stroke-dasharray: 50;-webkit-animation: dash 10s linear infinite;-moz-animation: dash 10s linear infinite;-o-animation: dash 10s linear infinite;animation: dash 10s linear infinite;}
.banner04 #line04{left: 285px;top: 486px;stroke-dasharray: 50;-webkit-animation: dash 8s linear infinite;-moz-animation: dash 8s linear infinite;-o-animation: dash 8s linear infinite;animation: dash 8s linear infinite;}
.banner04 #line05{left: 262px;top: 409px;stroke-dasharray: 50;-webkit-animation: dash 5s linear infinite;-moz-animation: dash 5s linear infinite;-o-animation: dash 5s linear infinite;animation: dash 5s linear infinite;}
.banner04 #line06{left: 384px;top: 419px;stroke-dasharray: 50;-webkit-animation: dash 7s linear infinite;-moz-animation: dash 7s linear infinite;-o-animation: dash 7s linear infinite;animation: dash 7s linear infinite;}
.banner04 #line07{left: 254px;top: 377px;stroke-dasharray: 50;-webkit-animation: dash 10s linear infinite;-moz-animation: dash 10s linear infinite;-o-animation: dash 10s linear infinite;animation: dash 10s linear infinite;-webkit-transform: rotate(177deg);-moz-transform: rotate(177deg);-ms-transform: rotate(177deg);-o-transform: rotate(177deg);transform: rotate(177deg);}

@-webkit-keyframes cloudMove{
    0%{
        -webkit-transform: translateY(0px);
    }
    50%{
        -webkit-transform: translateY(-5px);
    }
    100%{
        -webkit-transform: translateY(0px);
    }
}

@-moz-keyframes cloudMove{
    0%{
        -moz-transform: translateY(0px);
    }
    50%{
        -moz-transform: translateY(-5px);
    }
    100%{
        -moz-transform: translateY(0px);
    }
}

@-ms-keyframes cloudMove{
    0%{
        -ms-transform: translateY(0px);
    }
    50%{
        -ms-transform: translateY(-5px);
    }
    100%{
        -ms-transform: translateY(0px);
    }
}

@-o-keyframes cloudMove{
    0%{
        -o-transform: translateY(0px);
    }
    50%{
        -o-transform: translateY(-5px);
    }
    100%{
        -o-transform: translateY(0px);
    }
}

@keyframes cloudMove{
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-5px);
    }
    100%{
        transform: translateY(0px);
    }
}

@-webkit-keyframes dash {
    to {
        stroke-dashoffset: 1000;
    }
}

@-moz-keyframes dash {
    to {
        stroke-dashoffset: 1000;
    }
}

@-ms-keyframes dash {
    to {
        stroke-dashoffset: 1000;
    }
}

@-o-keyframes dash {
    to {
        stroke-dashoffset: 1000;
    }
}

@keyframes dash {
    to {
        stroke-dashoffset: 1000;
    }
}

@-webkit-keyframes explandWidth {
    from{
        width: 0;
    }
    to {
        width: 88px;
    }
}

@-moz-keyframes explandWidth {
    from{
        width: 0;
    }
    to {
        width: 88px;
    }
}

@-ms-keyframes explandWidth {
    from{
        width: 0;
    }
    to {
        width: 88px;
    }
}

@-o-keyframes explandWidth {
    from{
        width: 0;
    }
    to {
        width: 88px;
    }
}

@keyframes explandWidth {
    from{
        width: 0;
    }
    to {
        width: 88px;
    }
}

@-webkit-keyframes blockMove {
    0%{
        -webkit-transform: translate(0,0);
        opacity: 1;
    }
    65%{
        -webkit-transform: translate(-70px,-39px);
        opacity: 1;
    }
    90%{
        -webkit-transform:translate(-106px,-63px) scale(0.6);
        opacity: 1;
    }
    100%{
        -webkit-transform:translate(-106px,-63px) scale(0.6);
        opacity: 0;
    }
}

@-moz-keyframes blockMove {
    0%{
        -moz-transform: translate(0,0);
        opacity: 1;
    }
    65%{
        -moz-transform: translate(-70px,-39px);
        opacity: 1;
    }
    90%{
        -moz-transform:translate(-106px,-63px) scale(0.6);
        opacity: 1;
    }
    100%{
        -moz-transform:translate(-106px,-63px) scale(0.6);
        opacity: 0;
    }
}

@-ms-keyframes blockMove {
    0%{
        -ms-transform: translate(0,0);
        opacity: 1;
    }
    65%{
        -ms-transform: translate(-70px,-39px);
        opacity: 1;
    }
    90%{
        -ms-transform:translate(-106px,-63px) scale(0.6);
        opacity: 1;
    }
    100%{
        -ms-transform:translate(-106px,-63px) scale(0.6);
        opacity: 0;
    }
}

@-o-keyframes blockMove {
    0%{
        -o-transform: translate(0,0);
        opacity: 1;
    }
    65%{
        -o-transform: translate(-70px,-39px);
        opacity: 1;
    }
    90%{
        -o-transform:translate(-106px,-63px) scale(0.6);
        opacity: 1;
    }
    100%{
        -o-transform:translate(-106px,-63px) scale(0.6);
        opacity: 0;
    }
}


@keyframes blockMove {
    0%{
        transform: translate(0,0);
        opacity: 1;
    }
    65%{
        transform: translate(-70px,-39px);
        opacity: 1;
    }
    90%{
        transform:translate(-106px,-63px) scale(0.6);
        opacity: 1;
    }
    100%{
        transform:translate(-106px,-63px) scale(0.6);
        opacity: 0;
    }
}

@-webkit-keyframes light {
    0%{
        height:0;
    }
    100%{
        height:85px;
    }

}
@-moz-keyframes light {
    0%{
        height:0;
    }
    100%{
        height:85px;
    }

}
@-ms-keyframes light {
    0%{
        height:0;
    }
    100%{
        height:85px;
    }
}
@-o-keyframes light {
    0%{
        height:0;
    }
    100%{
        height:85px;
    }
}
@keyframes light {
    0%{
        height:0;
    }
    100%{
        height:85px;
    }

}

@-webkit-keyframes blockShow {
    0%{
        opacity: 0;
    }
    20%{
        opacity: 1;
    }
    100%{
        opacity: 1;
    }
}

@-moz-keyframes blockShow {
    0%{
        opacity: 0;
    }
    20%{
        opacity: 1;
    }
    100%{
        opacity: 1;
    }
}

@-ms-keyframes blockShow {
    0%{
        opacity: 0;
    }
    20%{
        opacity: 1;
    }
    100%{
        opacity: 1;
    }
}

@-o-keyframes blockShow {
    0%{
        opacity: 0;
    }
    20%{
        opacity: 1;
    }
    100%{
        opacity: 1;
    }
}

@keyframes blockShow {
    0%{
        opacity: 0;
    }
    20%{
        opacity: 1;
    }
    100%{
        opacity: 1;
    }
}


@-webkit-keyframes picMove {
    0%{
        -webkit-transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(-30px,0);;
    }
    100%{
        -webkit-transform: translate(0,0);
    }
}


@-moz-keyframes picMove {
    0%{
        -moz-transform: translate(0,0);
    }
    50%{
        -moz-transform: translate(-30px,0);;
    }
    100%{
        -moz-transform: translate(0,0);
    }
}


@-ms-keyframes picMove {
    0%{
        -ms-transform: translate(0,0);
    }
    50%{
        -ms-transform: translate(-30px,0);;
    }
    100%{
        -ms-transform: translate(0,0);
    }
}

@-o-keyframes picMove {
    0%{
        -o-transform: translate(0,0);
    }
    50%{
        -o-transform: translate(-30px,0);;
    }
    100%{
        -o-transform: translate(0,0);
    }
}

@keyframes picMove {
    0%{
        transform: translate(0,0);
    }
    50%{
        transform: translate(-30px,0);;
    }
    100%{
        transform: translate(0,0);
    }
}

@-webkit-keyframes shadowMove {
    0%{
        -webkit-transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(20px,-10px );
    }
    100%{
        -webkit-transform: translate(0,0);
    }
}

@-moz-keyframes shadowMove {
    0%{
        -moz-transform: translate(0,0);
    }
    50%{
        -moz-transform: translate(20px,-10px );
    }
    100%{
        -moz-transform: translate(0,0);
    }
}

@-ms-keyframes shadowMove {
    0%{
        -ms-transform: translate(0,0);
    }
    50%{
        -ms-transform: translate(20px,-10px );
    }
    100%{
        -ms-transform: translate(0,0);
    }
}

@-o-keyframes shadowMove {
    0%{
        -o-transform: translate(0,0);
    }
    50%{
        -o-transform: translate(20px,-10px );
    }
    100%{
        -o-transform: translate(0,0);
    }
}

@keyframes shadowMove {
    0%{
        transform: translate(0,0);
    }
    50%{
        transform: translate(20px,-10px );
    }
    100%{
        transform: translate(0,0);
    }
}

@-webkit-keyframes backColor {
    0%{
        background-color: #6671b2;
    }
    100%{
        background: -webkit-linear-gradient(#36cdff, #6740f7);
    }
}
@-moz-keyframes backColor {
    0%{
        background-color: #6671b2;
    }
    100%{
        background: -moz-linear-gradient(#36cdff, #6740f7);
    }
}

@-ms-keyframes backColor {
    0%{
        background-color: #6671b2;
    }
    100%{
        background: -ms-linear-gradient(#36cdff, #6740f7);
    }
}

@-o-keyframes backColor {
    0%{
        background-color: #6671b2;
    }
    100%{
        background: -o-linear-gradient(#36cdff, #6740f7);
    }
}

@keyframes backColor {
    0%{
        background-color: #6671b2;
    }
    100%{
        background: linear-gradient(#36cdff, #6740f7);
    }
}

@-webkit-keyframes activeLight {
    0%{
        background-color:#e9f01f ;
    }
    50%{
        background-color:#3e5afb ;
    }
    100%{
        background-color:#e9f01f ;
    }
}

@-moz-keyframes activeLight {
    0%{
        background-color:#e9f01f ;
    }
    50%{
        background-color:#3e5afb ;
    }
    100%{
        background-color:#e9f01f ;
    }
}

@-ms-keyframes activeLight {
    0%{
        background-color:#e9f01f ;
    }
    50%{
        background-color:#3e5afb ;
    }
    100%{
        background-color:#e9f01f ;
    }
}

@-o-keyframes activeLight {
    0%{
        background-color:#e9f01f ;
    }
    50%{
        background-color:#3e5afb ;
    }
    100%{
        background-color:#e9f01f ;
    }
}

@keyframes activeLight {
    0%{
        background-color:#e9f01f ;
    }
    50%{
        background-color:#3e5afb ;
    }
    100%{
        background-color:#e9f01f ;
    }
}


/*seciton*/
.section{padding: 80px 0;overflow: hidden;background-position: center center;background-size: auto 100%;}
.section-header{text-align: center;padding:0 0 50px 0;}
.section-header h1{font-size: 24px;color:#04304b;line-height: 42px;}
.section-header span{line-height: 30px;font-size: 14px;}

.section-h1{text-align: center;margin-bottom: 30px;}
.section-h1 h1{font-size: 24px;text-align: center;margin-bottom: 20px;}
.section-h1 span{font-size:14px;}
.section-h1 p{line-height: 25px;width: 90%;margin:0 5%}

.section-bg{background-position: center center;background-size: 100% 100%;}
.section-bg h1,.section-bg span{color:#fff}

/*section02*/
.block-item02{width: 18.5%;min-width:140px;height:500px;display:inline-block;position: relative;vertical-align: top;box-sizing: border-box;cursor: pointer;overflow: hidden;max-width: 200px;}
.block-item02:after{content:'';position: absolute;top:0;left: 0;width:100%;height: 100%;background-color: rgba(4,48,75,0.75)}
.block-item02-1{background-image: url(../../img/section02-1.png);}
.block-item02-2{background-image: url(../../img/section02-2.png);}
.block-item02-3{background-image: url(../../img/section02-3.png);}
.block-item02-4{background-image: url(../../img/section02-4.png);}
.block-item02-5{background-image: url(../../img/section02-5.png);}
.block-item-box{position: absolute;top: 0;left: 0;width:100%;z-index:2;text-align: center;}
.block-item-box p{font-size: 18px;color:#3bfdfc;font-weight: bold;word-break: keep-all;margin-top: 35px;}
.block-item-box span{font-size: 14px;color:#3bfdfc;width:220px;position: absolute;top: 200%;left: 50%;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%);display: block;text-align: justify}

.section02-icon{background: url("../../img/section02-icon.png");display: block;width: 88px;height:102px;margin: 150px auto 55px auto;background-size:500% 100%;}
.section02-icon02{background-position:-100% 0; }
.section02-icon03{background-position:-200% 0; }
.section02-icon04{background-position:-300% 0; }
.section02-icon05{background-position:-400% 0; }

.block-item02.active{max-width: 280px;width: 26%;min-width: 260px;}
.block-item02.active:after{background-color: rgba(75,137,243,.75)}
.block-item02.active .section02-icon{margin-top: 100px;margin-bottom: 75px;-webkit-transform: scale(1.25) rotate(360deg);-moz-transform: scale(1.25) rotate(360deg);-ms-transform: scale(1.25) rotate(360deg);-o-transform: scale(1.25) rotate(360deg);transform: scale(1.25) rotate(360deg);}
.block-item02.active span{top: 110%;}

.cdn01 .block-item02.active .section02-icon{display: none}
.cdn01 .block-item02.active:after{background-color: rgba(75,137,243,1)}
.cdn01 .block-item-box p{margin-top: 25px;margin-bottom: 5px;}
.cdn01 .block-item02.active span{width:240px;line-height: 24px;white-space:normal;}


/*section05*/
.block-item05{width: 31%;padding:20px 30px;box-shadow: 0 0 50px rgba(0,0,0,0.1);border-radius: 10px;float:left;margin-right: 3.5%;box-sizing: border-box;}
.block-item05:last-child{margin-right: 0}
.block-item05 .animate-image{width: 100%;height:100px;background-image: url(../../img/section05-bg.jpg);background-size:100% 100%;margin-bottom: 20px;text-align: center;position: relative;}
.block-item05 .animate-image img{position: absolute;top:50%;left: 50%;}
.block-item05:nth-child(1) .animate-image img{width:68px;}
.block-item05:nth-child(2) .animate-image img{width:72px;}
.block-item05:nth-child(3) .animate-image img{width:66px;}
.block-item05 h1{font-size: 18px;line-height: 40px;padding-left: 3px;}
.block-item05 .block-list li{line-height: 32px;position: relative;padding-left: 10px;}
.block-item05 .block-list li a{width: 100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display: inline-block;}
.block-item05 .block-list li:hover *{color:#4b89f3}
.block-item05 .block-list li span{margin-left: 8%;/*display:inline-block;*/width: 75%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;vertical-align: bottom;}
.block-item05 .more-link{color:#4b89f3;font-size: 14px;/* font-weight: bold; */margin: 12px 0;display: block;}
.block-item05 .more-link:hover{text-decoration: underline}

/*scrtion06*/
.section06 .section-body{overflow: hidden}
.section06 li{width: 20%;text-align: center;cursor: pointer;-webkit-filter: grayscale(100%);filter: grayscale(100%);opacity: 0.3;height: 85px;position: relative;display: inline-block;}
.section06 li:nth-child(5n){margin-right: 0;}
.section06 li:hover{-webkit-filter: none;filter: none;opacity: 1}
.section06 li img{vertical-align: middle;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform: translate(-50%,-50%);;position: absolute;left: 50%;top:50%;}
#Lunbo ul{position: relative}


/*helper*/
.container{margin: 15px auto 150px auto;position: relative}
.left-menu{width:120px;text-align: center;padding:10px;box-shadow: 0 8px 20px rgba(0,0,0,0.1);margin-top: 25px;}
.left-menu li a{color: #04304b;}
.left-menu li.on a{background-color: #4b89f3;color: #fff;border-radius: 4px;}
.location{padding-left: 25px;line-height: 55px;}
.news-list{width:950px;/*overflow: hidden;*/}
.list-item,.list-wrapper{overflow: hidden}
.list-item li{padding: 0 25px;}
.list-item li:hover{box-shadow: 0 0 30px rgba(0,0,0,0.1);}
.list-item li:hover .new-item{border:0}
.new-item{padding:40px 0;border-bottom: 1px solid #e5eaed}
.new-pic{width:240px;height: 160px;}
.new-pic img{width:100%;height: 100%;}
.new-info{width:618px;}
.new-info h1{font-size: 24px;line-height: 45px;margin-bottom: 10px}
.new-info h1 a{width: calc(100% - 110px);float: left;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.new-info h1 span{font-size: 18px;vertical-align: middle}
.new-info p{line-height: 25px;text-align: justify}

/*page*/
.page{margin:40px 0;}
.page li{height:35px;display: inline-block;line-height: 35px;text-align: center;box-sizing: border-box;background-color: #f5f8fc;border-radius: 4px;margin: 0 2px}
.page li *{display: block;font-size:12px;white-space: nowrap;padding: 0 15px;}
.page li.prev,.page li.next{font-family: SimSun}
.page li:last-child{border-right: 0}
.page li.active{background-color: #4b89f3;}
.page li.active *{color:#fff;}

/*helper-detail*/
.new-detail{padding:0 25px;/*overflow: hidden*/}
.new-detail>h1{font-size: 24px;text-align: center;margin:35px 0}
.new-detail-info{padding-bottom: 55px;border-bottom: 1px solid #e5eaed}
.new-detail-info p{line-height: 25px;text-align: justify}
.new-detail .qqgroup{width:530px;margin:40px auto;padding:40px 48px;box-sizing: border-box;border:1px solid #f2f2f2}
.new-detail .qqgroup p{font-size: 18px;line-height: 43px;}


/*server*/
.icon-server{background: url("../../img/icon-server.png");display: inline-block;width: 72px;height:80px;vertical-align: middle;margin-right: 18px;}
.icon-server02{background-position: -72px 0}
.icon-server03{background-position: -144px 0}
.icon-server04{background-position: -216px 0}
.service li{padding:38px 0;}
.server-right{display: inline-block;vertical-align: middle}
.server-right h1{font-weight: normal;margin-bottom: 15px;}
.server-right p{line-height: 24px;}


/*solution*/
.banner-svg{height:560px;background-color: #001e44;position: relative;overflow: hidden;background-repeat: no-repeat;background-position:  center center;background-size: auto 100%;}
.solution-title{margin:0 auto;width:450px;position: relative;top:40%;z-index: 10;color: #fff;}
.solution-title h1{text-align: center;font-size: 36px;font-weight: normal;line-height: 75px;}
.solution-title p{line-height: 24px;}
.solution-title>*{color:#fff;}
.solution-title a{width:100px;line-height: 40px;display: block;margin:0 auto;background-color: #3bfdfc;color:#001e44;border-radius: 40px;text-align: center;margin-top: 25px;}

.animate-box{position: absolute;right: 0;top:0;width:100%;height: 100%;}
.animate-box *{position: absolute}
.animate-star{width:55px;top:162px;right: 445px;-webkit-animation: ballMove 5s linear infinite;-moz-animation: ballMove 5s linear infinite;-o-animation: ballMove 5s linear infinite;animation: ballMove 5s linear infinite;}
.animate-meteor{width:100%;height:720px;}
.animate-meteor img{width:280px;}
.animate-meteor img:nth-child(1){right: 600px;bottom: -100px;-webkit-animation:meteorMove 8s linear infinite;-moz-animation:meteorMove 8s linear infinite;-o-animation:meteorMove 8s linear infinite;animation:meteorMove 8s linear infinite;}
.animate-meteor img:nth-child(2){right: 445px;bottom: -100px;-webkit-animation:meteorMove 12s linear 3s infinite;-moz-animation:meteorMove 12s linear 3s infinite;-o-animation:meteorMove 12s linear 3s infinite;animation:meteorMove 12s linear 3s infinite;}
.animate-light{width:600px;top: 365px;right: -230px;z-index: 2;}
.animate-light img{width:600px;-webkit-animation:rotate180 30s linear infinite;-moz-animation:rotate180 30s linear infinite;-o-animation:rotate180 30s linear infinite;animation:rotate180 30s linear infinite;-webkit-transform-origin: center center;-moz-transform-origin: center center;-ms-transform-origin: center center;-o-transform-origin: center center;transform-origin: center center}
.animate-light .big-star{width:350px;right: 165px;bottom: -350px;}

@-webkit-keyframes meteorMove {
    from{
        -webkit-transform: translate(0,0);
    }
    to{
        -webkit-transform: translate(900px,-900px);
    }
}

@-moz-keyframes meteorMove {
    from{
        -moz-transform: translate(0,0);
    }
    to{
        -moz-transform: translate(900px,-900px);
    }
}

@-ms-keyframes meteorMove {
    from{
        -ms-transform: translate(0,0);
    }
    to{
        -ms-transform: translate(900px,-900px);
    }
}

@-o-keyframes meteorMove {
    from{
        -o-transform: translate(0,0);
    }
    to{
        -o-transform: translate(900px,-900px);
    }
}

@keyframes meteorMove {
    from{
        transform: translate(0,0);
    }
    to{
        transform: translate(900px,-900px);
    }
}

@-webkit-keyframes ballMove {
    0%{
        -webkit-transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(360deg);
    }
}

@-moz-keyframes ballMove {
    0%{
        -moz-transform: rotate(0deg);
    }
    100%{
        -moz-transform: rotate(360deg);
    }
}

@-ms-keyframes ballMove {
    0%{
        -ms-transform: rotate(0deg);
    }
    100%{
        -ms-transform: rotate(360deg);
    }
}

@-o-keyframes ballMove {
    0%{
        -o-transform: rotate(0deg);
    }
    100%{
        -o-transform: rotate(360deg);
    }
}

@keyframes ballMove {
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}

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

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

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

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

@keyframes rotate180 {
    from{
        transform: rotate(0deg);
    }
    to{
        transform: rotate(360deg);
    }
}

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

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

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

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

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


.light-circle{width:150px;top: 88px;right: 400px;}

.skip-div-wrapper{height: 60px;}

.skip-title{color:#fff;display: inline-block;position: relative;margin-right: 30px;}
.skip-title i{background: url(../../images/icon-classfiy.png);width:26px;height:27px;display: inline-block;background-size: 100% 100%;position: absolute;top:-3px;left: -36px;}
.skip-title span{color:#fff;font-weight: bold;font-size: 14px;}

.animate-skip{text-align: center;background-color: #193456;width:100%;z-index:9;top:0;font-size: 0;}
.animate-skip:after{content:'';display:table;clear:both;}
.animate-skip>*{font-size: 14px;}
.animate-skip ul{display: inline-block;}
.animate-skip ul li{display: inline-block;line-height: 60px;min-width: 100px;cursor: pointer;margin:0 10px}
.animate-skip ul li a{color:#fff;display: block}
.animate-skip ul li.on a{font-weight: bold;color:#3bfdfc}
.animate-skip[data-block-name="rhcdn"] ul{float:left}
.animate-skip01 span{color:#fff;display: block;width:180px;line-height: 60px;}
.animate-skip span + ul,.animate-skip01 span + ul{display:inline-block}
.animate-skip01 .btn{width:100px;height:40px;line-height: 40px;background-color: #3bfdfc;display: block;margin:10px 0 10px 5px}

/*.animate-skip ul{display: inline-block;}
.animate-skip ul li{display: inline-block;line-height: 60px;width: 100px;cursor: pointer;}
.animate-skip ul li a{color:#fff;display: block}
.animate-skip ul li.on a{font-weight: bold;color:#3bfdfc}

.animate-skip01 span{color:#fff;display: block;width:180px;line-height: 60px;}
.animate-skip01 .btn{width:100px;height:40px;line-height: 40px;background-color: #3bfdfc;display: block;margin:10px 0}*/

.animate-skip01 ul li.on a{font-weight: normal;color:#fff;position: relative}
.animate-skip01 ul li.on a:after{content:'';width:100%;height:2px;background-color: #3bfdfc;display: block;position: absolute;bottom:0;left: 0}
.solution01 li{text-align: center;padding:55px;box-sizing: border-box;}
.solution01 li .img-item{height: 80px;}
.solution01 li img{vertical-align: middle;display:inline-block}
.solution01 li p{font-size: 18px;line-height: 45px;font-weight: bold;margin-top:20px;}
.solution01 li span{font-size: 14px;line-height: 24px;display: block;white-space: normal;text-align: justify}
#strength{overflow: hidden}
#strength>ul{white-space: nowrap;position: relative}

.animate-skip02{background-color: #f5f7ff}
.animate-skip02 ul{display: block}
.animate-skip02 ul li{min-width: 180px;margin: 0 !important;}
.animate-skip02 ul li a{color:#04304b;padding: 0 5px}
.animate-skip02 ul li.on a{background-color: #4b8af4;color:#fff;font-weight: normal}

.solution02 .wrapper{width:840px;}
.solution02 p{line-height: 2em;}

.select{text-align: center;margin:25px 0;overflow-x: auto;-webkit-overflow-scrolling:touch;}
.select::-webkit-scrollbar {display:none}
.select ul{display: inline-block;white-space: nowrap;padding:0 15px;}
.select li{display: inline-block;margin: 0 10px;}
.select li a{line-height: 30px;display: inline-block}
.select li.on a{font-weight: bold;position: relative;}
.select li.on a:after{content:'';position: absolute;bottom: 0;left: 50%!important;width:50px;height:2px;background-color: #2b68fe;transform: translate(-50%);}
.solution03 .select ul{border-bottom: 1px solid #e5e5e5;}

.select-img{text-align: center;margin:50px 0}
.select-box p{margin:15px 0;white-space: normal}

.solution03 .wrapper{width:600px;}
.dot-animate .dotted{-webkit-animation: float 5s linear infinite;-moz-animation: float 5s linear infinite;-o-animation: float 5s linear infinite;animation: float 5s linear infinite;position: absolute;top: 184px;left: 264px;}

@-webkit-keyframes float {
    0%{
        -webkit-transform: translateY(0);
    }
    50%{
        -webkit-transform: translateY(30px);
    }
    100%{
        -webkit-transform: translateY(0);
    }
}

@-moz-keyframes float {
    0%{
        -moz-transform: translateY(0);
    }
    50%{
        -moz-transform: translateY(30px);
    }
    100%{
        -moz-transform: translateY(0);
    }
}

@-ms-keyframes float {
    0%{
        -ms-transform: translateY(0);
    }
    50%{
        -ms-transform: translateY(30px);
    }
    100%{
        -ms-transform: translateY(0);
    }
}

@-o-keyframes float {
    0%{
        -o-transform: translateY(0);
    }
    50%{
        -o-transform: translateY(30px);
    }
    100%{
        -o-transform: translateY(0);
    }
}


@keyframes float {
    0%{
        transform: translateY(0);
    }
    50%{
        transform: translateY(30px);
    }
    100%{
        transform: translateY(0);
    }
}


/*cloudServer*/

#banner-cs,#banner-oss{background: #222642;background: -webkit-linear-gradient(left,#222642, #3472e7);background: -o-linear-gradient(left,#222642, #3472e7);background: -moz-linear-gradient(left,#222642, #3472e7);background: linear-gradient(left,#222642, #3472e7);background-position:center center;background-size:auto 100%;background-repeat:no-repeat;overflow: hidden;position: relative}
#banner-cs .banner-bg{position: absolute;}
.banner-info{height: 100%;}
.banner-info .info_l h1{font-size: 32px;line-height: 70px;}
.banner-info .info_l p{font-size: 14px;margin:0 auto 40px auto}
.banner-info .info_l a{background-color: #3bfdfc;width:200px;line-height: 50px;display: inline-block;border-radius: 50px;color:#222642;text-align: center;margin-right: 15px}
.banner-info .info_l a.link{background-color: transparent;color: #3bfdfc;width: auto;text-decoration: none}
.info_l{position: absolute;top:50%; z-index: 9}
.info_l>*{color:#fff;}
.info_l p{line-height: 25px;width: 435px}
.info_l p a{color:#3bfdfc;text-decoration: underline}
#banner-cs .expland-round{position: absolute;top: -60px;left: -284px;width: 800px;height: 800px;opacity: .3;}
#banner-cs .expland-round01{top: 0;left: 212px;opacity: .1;}
#banner-cs .expland-round i{display: block;width: 1000px;height:1000px;border:1px solid #2b5cbd;position: absolute;bottom: -72px;left: -300px;-webkit-animation:explandRound 30s linear infinite;-moz-animation:explandRound 30s linear infinite;-o-animation:explandRound 30s linear infinite;animation:explandRound 30s linear infinite;transform-origin: center center;border-radius: 1000px;opacity: 0}
#banner-cs .expland-round01 i{top: -310px;left: 141px;bottom: auto;border:1px solid #fff;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform: translate(-50%,-50%);-webkit-animation:explandRound 20s linear infinite;-moz-animation:explandRound 20s linear infinite;-o-animation:explandRound 20s linear infinite;animation:explandRound 20s linear infinite;}
#banner-cs .expland-round i:nth-child(2){-webkit-animation-delay:.2s;-moz-animation-delay:.2s;-o-animation-delay:.2s;animation-delay:.2s }
#banner-cs .expland-round i:nth-child(3){-webkit-animation-delay:.8s;-moz-animation-delay:.8s;-o-animation-delay:.8s;animation-delay:.8s }
#banner-cs .expland-round i:nth-child(4){-webkit-animation-delay:1.5s;-moz-animation-delay:1.5s;-o-animation-delay:1.5s;animation-delay:1.5s }
#banner-cs .expland-round i:nth-child(5){-webkit-animation-delay:2.3s;-moz-animation-delay:2.3s;-o-animation-delay:2.3s;animation-delay:2.3s }
#banner-cs .expland-round i:nth-child(6){-webkit-animation-delay:3.2s;-moz-animation-delay:3.2s;-o-animation-delay:3.2s;animation-delay:3.2s }
#banner-cs .expland-round i:nth-child(7){-webkit-animation-delay:4.2s;-moz-animation-delay:4.2s;-o-animation-delay:4.2s;animation-delay:4.2s }
#banner-cs .expland-round i:nth-child(8){-webkit-animation-delay:5.3s;-moz-animation-delay:5.3s;-o-animation-delay:5.3s;animation-delay:5.3s }
#banner-cs .expland-round i:nth-child(9){-webkit-animation-delay:6.5s;-moz-animation-delay:6.5s;-o-animation-delay:6.5s;animation-delay:6.5s }
#banner-cs .expland-round i:nth-child(10){-webkit-animation-delay:7.8s;-moz-animation-delay:7.8s;-o-animation-delay:7.8s;animation-delay:7.8s }
#banner-cs .expland-round i:nth-child(11){-webkit-animation-delay:9.2s;-moz-animation-delay:9.2s;-o-animation-delay:9.2s;animation-delay:9.2s }
#banner-cs .expland-round i:nth-child(12){-webkit-animation-delay:10.7s;-moz-animation-delay:10.7s;-o-animation-delay:10.7s;animation-delay:10.7s }
#banner-cs .expland-round i:nth-child(13){-webkit-animation-delay:12.3s;-moz-animation-delay:12.3s;-o-animation-delay:12.3s;animation-delay:12.3s }
#banner-cs .expland-round i:nth-child(14){-webkit-animation-delay:14s;-moz-animation-delay:14s;-o-animation-delay:14s;animation-delay:14s }
#banner-cs .expland-round i:nth-child(15){-webkit-animation-delay:15.8s;-moz-animation-delay:15.8s;-o-animation-delay:15.8s;animation-delay:15.8s }
#banner-cs #cloud-cs,#animate-svg{-webkit-animation:cloudTransform 20s linear infinite;-moz-animation:cloudTransform 20s linear infinite;-o-animation:cloudTransform 20s linear infinite;animation:cloudTransform 20s linear infinite}

#banner-cs .animate-box,#banner-oss .animate-box{background-position: center;background-repeat: no-repeat;background-size: 88%;position: relative;width: 500px;height:680px;}
#banner-cs .animate-box{background-image: url(../../img/bannercs-bg.png);}
#banner-oss .animate-box{width: 572px}
#bannercs-01{width: 120px;top: 113px;left: 100px;-webkit-animation: cloudMove 3s .3s infinite;-moz-animation: cloudMove 3s .3s infinite;-o-animation: cloudMove 3s .3s infinite;animation: cloudMove 3s .3s infinite;}
#bannercs-02{top: 79px;left: 215px;-webkit-animation: cloudMove 2s 1s infinite;-moz-animation: cloudMove 2s 1s infinite;-o-animation: cloudMove 2s 1s infinite;animation: cloudMove 2s 1s infinite;}
#bannercs-03{width: 120px;top: 148px;left: 326px;-webkit-animation: cloudMove 5s .5s infinite;-moz-animation: cloudMove 5s .5s infinite;-o-animation: cloudMove 5s .5s infinite;animation: cloudMove 5s .5s infinite;}
#bannercs-04{top:300px;left: 173px;-webkit-animation: cloudMove 7s 1.2s infinite;-moz-animation: cloudMove 7s 1.2s infinite;-o-animation: cloudMove 7s 1.2s infinite;animation: cloudMove 7s 1.2s infinite;}

@-webkit-keyframes explandRound {
    from{
        opacity: 1;
        -webkit-transform: scale(0.01);
    }
    to{
        opacity: 1;
        -webkit-transform: scale(1);
    }
}

@-moz-keyframes explandRound {
    from{
        opacity: 1;
        -webkit-transform: scale(0.01);
    }
    to{
        opacity: 1;
        -webkit-transform: scale(1);
    }
}

@-ms-keyframes explandRound {
    from{
        opacity: 1;
        -webkit-transform: scale(0.01);
    }
    to{
        opacity: 1;
        -webkit-transform: scale(1);
    }
}

@-o-keyframes explandRound {
    from{
        opacity: 1;
        -webkit-transform: scale(0.01);
    }
    to{
        opacity: 1;
        -webkit-transform: scale(1);
    }
}

@keyframes explandRound {
    from{
        opacity: 1;
        -webkit-transform: scale(0.01);
    }
    to{
        opacity: 1;
        -webkit-transform: scale(1);
    }
}


@-webkit-keyframes cloudTransform {
    0%{
        -webkit-transform: skew(0deg) translateY(0);
    }
    20%{
        -webkit-transform: skew(15deg) translateY(10px);
    }
    40%{
        -webkit-transform: skew(0deg) translateY(0);
    }
    60%{
        -webkit-transform: skew(-15deg) translateY(10px);
    }
    100%{
        -webkit-transform: skew(0deg) translateY(0);
    }
}

@-moz-keyframes cloudTransform {
    0%{
        -moz-transform: skew(0deg) translateY(0);
    }
    20%{
        -moz-transform: skew(15deg) translateY(10px);
    }
    40%{
        -moz-transform: skew(0deg) translateY(0);
    }
    60%{
        -moz-transform: skew(-15deg) translateY(10px);
    }
    100%{
        -moz-transform: skew(0deg) translateY(0);
    }
}

@-ms-keyframes cloudTransform {
    0%{
        -ms-transform: skew(0deg) translateY(0);
    }
    20%{
        -ms-transform: skew(15deg) translateY(10px);
    }
    40%{
        -ms-transform: skew(0deg) translateY(0);
    }
    60%{
        -ms-transform: skew(-15deg) translateY(10px);
    }
    100%{
        -ms-transform: skew(0deg) translateY(0);
    }
}

@-o-keyframes cloudTransform {
    0%{
        -o-transform: skew(0deg) translateY(0);
    }
    20%{
        -o-transform: skew(15deg) translateY(10px);
    }
    40%{
        -o-transform: skew(0deg) translateY(0);
    }
    60%{
        -o-transform: skew(-15deg) translateY(10px);
    }
    100%{
        -o-transform: skew(0deg) translateY(0);
    }
}

@keyframes cloudTransform {
    0%{
        transform: skew(0deg) translateY(0);
    }
    20%{
        transform: skew(15deg) translateY(10px);
    }
    40%{
        transform: skew(0deg) translateY(0);
    }
    60%{
        transform: skew(-15deg) translateY(10px);
    }
    100%{
        transform: skew(0deg) translateY(0);
    }
}

.server-icon{background: url("../images/server-icon.png");vertical-align: middle;margin-right: 18px;position: absolute;}
.icon-base{background-position:-252px -84px;width:122px;height:71px;bottom: 0}
.rotate-bg{background-position:-252px 0;width:73px;height:84px;left: 26px;top:26px;}
.cubes01{background-position:0 0;width:42px;height:42px;left: 42px;top: 48px;}
.cubes02{background-position:-42px 0;width:42px;height:42px;left: 42px;top: 48px;}
.cubes03{background-position:-84px 0;width:42px;height:42px;left: 42px;top: 48px;}
.cubes04{background-position:-126px 0;width:42px;height:42px;left: 42px;top: 48px;}
.cubes05{background-position:-168px 0;width:42px;height:42px;left: 42px;top: 48px;}
.cubes06{background-position:-210px 0;width:42px;height:42px;left: 42px;top: 48px;}
.function-bg{background-position:-291px -155px;width:89px;height:103px;position: relative;margin:0 auto}
.function-bg i{width:84px;height:84px;top:14px;left: 2px;}
.function-bg img{z-index: 2;position: relative}
.cloudServer02 li:hover i {-webkit-animation:moveIcon 3s;-moz-animation:moveIcon 3s ;-o-animation:moveIcon 3s ;animation:moveIcon 3s  }
@keyframes moveIcon {
    0%{
        transform: translate(0,0);
    }
    30%{
        transform: translate(-5px,5px);
    }
    80%{
        transform: translate(5px,-5px);
    }
    100%{
        transform: translate(0,0);
    }
}


.server-icon01{background-position:0 -42px;}
.server-icon02{background-position:-84px -42px;}
.server-icon03{background-position:-168px -42px;}
.server-icon04{background-position:0 -126px;}
.server-icon05{background-position:-84px -126px;}
.server-icon06{background-position:-168px -126px;}

.server-icon07{background-position:0 -210px;}
.server-icon08{background-position:-48px -210px;}
.server-icon09{background-position:-96px -210px;}
.server-icon10{background-position:-144px -210px;}
.server-icon11{background-position:-192px -210px;}
.server-icon12{background-position:-240px -210px;}

.server-icon13{background-position:-381px -42px;}
.server-icon14{background-position:-465px -42px;}
.server-icon15{background-position:-381px -126px;}
.server-icon16{background-position:-465px -126px;}

.server-icon17{background-position:-381px -211px;}
.server-icon18{background-position:-465px -211px;}
.server-icon19{background-position:-381px -295px;}


.cloudServer00 .section-body{margin:60px auto 0 auto}
.cloudServer00 .content-item{width: 100%}
.cloudServer00 li{width:22%;float:left;vertical-align: top;margin-right: 4%;}
.cloudServer00 li:last-child{margin-right: 0}
.cloudServer00 li .block-icon{width:125px;height:125px;margin:0 auto;position: relative;text-align: center}
.cloudServer00 li h1{text-align:center;line-height: 50px;margin-top:20px;font-size: 20px;}
.cloudServer00 li h3{font-weight: bold;font-size: 18px;height: 85px;vertical-align: middle;text-align: center}
/*.cloudServer00 li p{margin:0 0 0 45px;line-height: 24px;}*/
.cloudServer00 li p{margin:0 0 0 0px;line-height: 24px;}
.cloudServer00 li img{position: relative;top:45px;}


.cloudServer01 .section-body{padding:120px 0 100px 0;background-color: #04304b;position: relative}
.cloudServer01 .section-body *{color:#fff}
.cloudServer01 .wrapper{min-height: 304px;}
.cloudServer01 .word-div{width: 49%;line-height: 24px;padding: 20px 0;text-align: justify;}
.cloudServer01 .word-div01{width: 530px;line-height: 24px;padding: 20px 0;text-align: justify;position: absolute;top:10%;right: 0}
.cloudServer01  table{line-height: 24px;}
.cloudServer01  table th,.cloudServer01  table td{padding:10px 0;vertical-align: top}
.cloudServer01  table th{min-width: 70px;}
.cloudServer01  table span{font-size: 18px;font-weight: bold;margin:0 5px;}
.cloudServer01 .select{position: absolute;bottom: -30px;left: 50%;background-color: #fff;line-height: 60px;margin: 0;border-radius: 30px;box-shadow: 1px 0 30px rgba(4,48,75,0.1);}
.cloudServer01 .select li a:after{content:'';position: absolute;bottom: 0;left: 0;height:2px;background-color: #04304b}
.cloudServer01 .select a{color:#04304b;display: block;line-height: 50px;padding: 0 20px;}
.cloudServer01 .select .on{font-weight: bold;}
.cloudServer01 .select .on a:after{width:100%;}
.cloudServer01 .swiper-container{overflow: visible;}
.cloudServer01 .list-type.swiper-wrapper{display: block;}

.cloudServer02 li{padding:55px;box-sizing: border-box;border-radius: 15px;font-size: 14px;}
.cloudServer02 li p{text-align: center;font-weight: bold;line-height: 45px;margin-top: 20px;}
.cloudServer02 li span{line-height: 24px;text-align: justify;display: block;}

.cloudServer03 i{width:48px;height: 48px;position: relative;display: inline-block;margin-right: 0}
.cloudServer03 table{border-collapse: collapse;border:1px solid #e6e6e6}
.cloudServer03 th,.cloudServer03 td{border:1px solid #e6e6e6}
.cloudServer03 th{font-size: 18px;width:170px;height:100px;}
.cloudServer03 td{padding:0 20px}

.cloudServer04 li{margin: 15px 0;}

.cloudServer05 .block-item05 h1{padding-left: 10px;}
.cloudServer05 li:before{content:'';width: 2px;height: 2px;display: inline-block;background-color: #001e44;position: absolute;top: 16px;left: 0;}
.cloudServer05 .block-item05 .more-link{padding-left: 10px;}
.cloudServer05 .block-item05 .animate-image img{width:114px;}

/*banner-cdn*/

#banner-cdn{height:560px;  background: -webkit-linear-gradient(#283870, #3756c7);background: -o-linear-gradient(#283870, #3756c7);background: -moz-linear-gradient(#283870, #3756c7);background: linear-gradient(#283870, #3756c7);}
#banner-cdn .banner-item{height: 100%}
#banner-cdn .info_l{top:55%;}
#banner-cdn .info_l h1{line-height: 50px;white-space: nowrap}
#banner-cdn .info_l p{line-height: 25px;text-align: justify;}
#banner-cdn .info_l a{width: 100px;line-height: 40px;display: inline-block;background-color: #3bfdfc;color: #001e44;border-radius: 40px;text-align: center;margin-top: 25px;}

.cdn-animate{position: absolute;top:55%;right: 0}
.svg-line path{stroke-dasharray: 100; -webkit-animation: dash 8s linear infinite; -moz-animation: dash 8s linear infinite; -o-animation: dash 8s linear infinite;animation: dash 8s linear infinite;}
#image-4{-webkit-animation: cloudMove 5s linear infinite; -moz-animation: cloudMove 5s linear infinite; -o-animation: cloudMove 5s linear infinite;animation: cloudMove 5s linear infinite;}
#man-hand{-webkit-animation: handWave 5s linear infinite; -moz-animation: handWave 5s linear infinite; -o-animation: handWave 5s linear infinite;animation: handWave 5s linear infinite;-webkit-transform-origin: right top;-moz-transform-origin: right top;-ms-transform-origin: right top;-o-transform-origin: right top;transform-origin: right top;}
#picture .ball01{offset-path: path('M530.328,209.941l18,11.883c8.228,5.655.538,6.259-3.91,6.91l-20.663,2.755c7.889,5.607,7.255,12.2,2.866,12.839L510.645,246.4l10.093,6.792c8.228,5.654,6.58,9.393,2.132,10.044L460.1,271.829c-4.447.651-14.723-3.405-22.951-9.059l-3.407-2.341-4.135.842a67.575,67.575,0,0,1,11.634,6.374l30.969,21.444c8.228,5.654,2.592,10.3-1.856,10.954L332.706,320.57c-4.447.651-18.782,5.048-27.01-.606l-38.123-25.7-14.28,2.908c-1.38.2-5.2-1.768-10.063-4.746a3.554,3.554,0,0,1-1.033.309l-27.906,4.561c-11.184,1.749-12.846.183-21.074-5.471L40.826,185.563a48.314,48.314,0,0,1-4.155-3.175c-0.394-.257-0.787-0.515-1.173-0.78L16.588,168.9c-8.228-5.654-5.372-6.984-.924-7.635l11.565-1.692L8.3,146.723c-8.228-5.654-5.871-7.269-1.423-7.92l73.7-10.784c4.329-.633,14.173,3.2,22.282,8.614l33.766-4.941c4.447-.651,6.631-3.523,22.951,9.06L175.4,151.629l25.853-3.783L167.015,124.3c-8.227-5.654-6.061-7.148-1.613-7.8l66.8-9.774a67.372,67.372,0,0,1-7.737-4.564L197.3,83.723c-8.228-5.654-5.87-7.269-1.423-7.92l73.7-10.784c4.448-.651,14.723,3.405,22.951,9.06l21.742,14.941a47.829,47.829,0,0,1,4.241,3.252l35.263-5.16c4.447-.651,14.722,3.405,22.951,9.059l22.393,15.389,30.1-4.405c4.448-.65,14.723,3.406,22.951,9.06l40.411,27.77c8.228,5.654,11.293,10.765,6.845,11.416l-20.249,2.963L524.61,189.59c8.228,5.654,11.293,10.765,6.845,11.416l-14,2.049A66.94,66.94,0,0,1,530.328,209.941ZM255.566,110.026a67.526,67.526,0,0,1,7.737,4.565l5.959,4.1,51.652-7.558-8.147-5.6c-1.464-1.244-2.732-2.337-3.839-3.311Z'); offset-distance: 0%; }
#picture .ball02{offset-path: path('M494.247,211.719l-42.282,6.339L475,232a3.353,3.353,0,0,1-1.753,5.719L398,249c-2.19.293-4.082,1.44-8-2l-37-23c-2.543-2.69-.437-5.427,1.753-5.72l41.684-6.333-20.165-12.535L339,205c-2.19.293-4.082,1.44-8-2l-33.318-20.711-58.449,8.352L258,202a3.353,3.353,0,0,1-1.753,5.719L199,215c-2.19.293-4.082,1.44-8-2l-37-23c-2.543-2.69-.437-5.426,1.753-5.72l19.4-2.511-8.436-4.855L111,184c-2.19.293-4.082,1.439-8-2L87,172c-2.543-2.69-.437-5.426,1.753-5.72l14.612-1.891L77,148c-2.543-2.69-.437-5.426,1.753-5.72L97,140c4.564-.793,4.282-0.215,8,2l30.186,18.27L145,159c4.565-.793,4.282-0.215,8,2l6.483,3.814a6.406,6.406,0,0,1,3.8-2.041L309.792,141.62,304,138c-2.543-2.69-.437-5.426,1.753-5.72L362,125c4.565-.793,4.282-0.215,8,2l17,10a3.353,3.353,0,0,1-1.753,5.719l-24.725,3.145,25.547,13.918a5.991,5.991,0,0,1-1,9.5l28.506,17.254L450,181c4.565-.793,4.282-0.215,8,2l38,23A3.353,3.353,0,0,1,494.247,211.719ZM141.753,228.28L198,221c4.565-.793,4.282-0.215,8,2l3.706,2.18L242,221c4.565-.793,4.282-0.215,8,2l17,10a3.353,3.353,0,0,1-1.753,5.719L236.2,242.413,257,255a3.353,3.353,0,0,1-1.753,5.719L236,263c-2.19.293-4.082,1.44-8-2l-23.524-14.623A8.386,8.386,0,0,1,200,244l-3.428-2.143L164,246c-2.19.293-4.082,1.439-8-2l-16-10C137.457,231.31,139.563,228.573,141.753,228.28Zm153,0L313,226c4.564-.793,4.282-0.215,8,2l30.186,18.27L361,245c4.565-.793,4.282-0.215,8,2l17,10a3.353,3.353,0,0,1-1.753,5.719l-15,1.907L393,279a3.353,3.353,0,0,1-1.753,5.719L372,287c-2.19.293-4.082,1.44-8-2l-26.316-16.359L327,270c-2.19.293-4.082,1.439-8-2l-16-10c-2.543-2.69-.437-5.427,1.753-5.72l14.612-1.891L293,234C290.457,231.31,292.563,228.573,294.753,228.28Z'); offset-distance: 0%;}
#r01{-webkit-animation: red-ball 40s linear 10s alternate infinite;-moz-animation: red-ball 40s linear 10s alternate infinite;-o-animation: red-ball 40s linear 10s alternate infinite;animation: red-ball 40s linear 10s alternate infinite;}
#r02{-webkit-animation: red-ball 30s linear alternate infinite;-moz-animation: red-ball 30s linear alternate infinite;-o-animation: red-ball 30s linear alternate infinite;animation: red-ball 30s linear alternate infinite;}
#r03{-webkit-animation: red-ball 20s linear 5s alternate infinite;-moz-animation: red-ball 20s linear 5s alternate infinite;-o-animation: red-ball 20s linear 5s alternate infinite;animation: red-ball 20s linear 5s alternate infinite;}
#r04{-webkit-animation: red-ball 40s linear 3s alternate infinite;-moz-animation: red-ball 40s linear 3s alternate infinite;-o-animation: red-ball 40s linear 3s alternate infinite;animation: red-ball 40s linear 3s alternate infinite;}
#r05{-webkit-animation: red-ball 30s linear 15s alternate infinite;-moz-animation: red-ball 30s linear 15s alternate infinite;-o-animation: red-ball 30s linear 15s alternate infinite;animation: red-ball 30s linear 15s alternate infinite;}
#r06{-webkit-animation: red-ball 15s linear alternate infinite;-moz-animation: red-ball 15s linear alternate infinite;-o-animation: red-ball 15s linear alternate infinite;animation: red-ball 15s linear alternate infinite;}


.section-cdn .block-item{height: auto;}
.section-cdn .block-item h1{font-size: 18px;}
.section-cdn .block-item p{text-align: justify}

.section-cdn .collapse-wrap{display: none;}
.section-cdn .collapse-group .panel-collapse{padding: 20px;}
.section-cdn .collapse-wrap li{position: relative;margin-bottom: 15px;}
.section-cdn .collapse-wrap li:last-child{margin-bottom: 0;}
.section-cdn .collapse-wrap li::before{content: '';display: block;width: 4px;height: 4px;border-radius: 50%;position: absolute;left: -8px;top: 7px;background-color: #000;}
.section-cdn .collapse-wrap b{display: inline-block;line-height: 18px;margin-bottom: 10px;}
.section-cdn .collapse-wrap p{line-height: 18px;}

.cdn-select li{width: auto;padding: 0 10px;margin: 0 15px;}
.cdn-select li.on{border:1px solid #04304b;border-radius: 30px;}
.cdn-select li.on a{font-weight: normal}
.cdn-select li.on a:after{width: 0}

.cdn-applicate{padding:50px 20px 0 50px; }
.cdn-app-l{}
.cdn-app-r{width: 45%;height:425px;position: relative;}
.cdn-app-r .select-box{position: absolute;top:50%;}
.cdn-app-r .select-box>div{margin-bottom: 30px;padding: 0 30px;}
.cdn-app-r h3{font-size: 14px;}
.cdn-app-r p{padding-left: 15px;text-align: justify;}

#cdn-app-svg .cdn-icon{opacity: .3}

/*cdn - 计费说明*/
.charging p{margin-bottom: 20px;text-align: justify;font-size: 14px;}
.charging .color{color:#4b89f3;font-weight: bold}
.charging table{width:100%;border-collapse: collapse;margin-bottom: 20px;}
.charging table th{max-width:140px;padding:0 10px;text-align: left;border:1px solid #e6e6e6;font-weight: normal}
.charging table td{height: 60px;border:1px solid #e6e6e6;text-align: center}
.charging table thead{background-color: #f7f7f7;}
.charging table tr:nth-child(2n){background-color: #f7f7f7}



@-webkit-keyframes handWave {
    0%{
        -webkit-transform: rotate(0deg);
    }
    50%{
        -webkit-transform: rotate(-10deg);
    }
    100%{
        -webkit-transform: rotate(0deg);
    }
}
@-moz-keyframes handWave {
    0%{
        -moz-transform: rotate(0deg);
    }
    50%{
        -moz-transform: rotate(-10deg);
    }
    100%{
        -moz-transform: rotate(0deg);
    }
}
@-ms-keyframes handWave {
    0%{
        -ms-transform: rotate(0deg);
    }
    50%{
        -ms-transform: rotate(-10deg);
    }
    100%{
        -ms-transform: rotate(0deg);
    }
}
@-o-keyframes handWave {
    0%{
        -o-transform: rotate(0deg);
    }
    50%{
        -o-transform: rotate(-10deg);
    }
    100%{
        -o-transform: rotate(0deg);
    }
}
@keyframes handWave {
    0%{
        transform: rotate(0deg);
    }
    50%{
        transform: rotate(-10deg);
    }
    100%{
        transform: rotate(0deg);
    }
}

@-webkit-keyframes red-ball {
    from {
        offset-distance: 0%;
    }
    to {
        offset-distance: 100%;
    }
}

@-moz-keyframes red-ball {
    from {
        offset-distance: 0%;
    }
    to {
        offset-distance: 100%;
    }
}

@-ms-keyframes red-ball {
    from {
        offset-distance: 0%;
    }
    to {
        offset-distance: 100%;
    }
}

@-o-keyframes red-ball {
    from {
        offset-distance: 0%;
    }
    to {
        offset-distance: 100%;
    }
}

@keyframes red-ball {
    from {
        offset-distance: 0%;
    }
    to {
        offset-distance: 100%;
    }
}


/*huaweiCloud*/
#kkhwBanner,#kkhwBanner ul{position: relative}
#kkhwBanner .swiper-slide{height: 680px;display:block;position: relative;background-size: auto 100%}
#kkhwBanner li{width: 100%;height: 100%;background-position: center center;background-repeat: no-repeat;background-size: 100% 100%;}
#banner-hw{position: relative}
#banner-hw #animate-canvas{height: 100%;position: absolute;top:0;left: 0;width: 100%;background-color: #0c0a46}
#banner-hw .banner-item{height: 100%;position: relative}
.banner-hw{position: relative;z-index:2;height: 100%}
.banner-hw .info_l h1{line-height: 50px;}
.banner-hw .info_l a.btn{width: 160px;line-height:50px;display: inline-block;background-color: #3bfdfc;color: #001e44;border-radius: 40px;text-align: center;margin: 50px 10px 35px 0;}
.banner-hw .info_l a.link{text-decoration: underline;color:#fff}
.banner-hw .info_r{width: 580px;position: absolute;right: 0;top: 55%;}
.banner-hw .info_r svg{width: 580px;}

#cloud01{-webkit-animation:cloudMove 3s infinite;-moz-animation:cloudMove 3s infinite;-o-animation:cloudMove 3s infinite;animation:cloudMove 3s infinite; }
#cloud02{-webkit-animation:cloudMove 3s 1s infinite;-moz-animation:cloudMove 3s 1s infinite;-o-animation:cloudMove 3s 1s infinite;animation:cloudMove 3s 1s infinite; }
#cloud03{-webkit-animation:cloudMove01 5s infinite;-moz-animation:cloudMove01 5s infinite;-o-animation:cloudMove01 5s infinite;animation:cloudMove01 5s infinite; }

#_group_49{-webkit-animation: popTwinkle 10s linear 3s infinite;-moz-animation: popTwinkle 10s linear 3s infinite;-o-animation: popTwinkle 10s linear 3s infinite;animation: popTwinkle 10s linear 3s infinite}
#_group_50{-webkit-animation: popTwinkle 8s linear 4s infinite;-moz-animation: popTwinkle 8s linear 4s infinite;-o-animation: popTwinkle 8s linear 4s infinite;animation: popTwinkle 8s linear 4s infinite}
#_group_55{-webkit-animation: popTwinkle 10s linear infinite;-moz-animation: popTwinkle 10s linear infinite;-o-animation: popTwinkle 10s linear infinite;animation: popTwinkle 10s linear infinite}
#_group_56{-webkit-animation: popTwinkle 6s linear 2s infinite;-moz-animation: popTwinkle 6s linear 2s infinite;-o-animation: popTwinkle 6s linear 2s infinite;animation: popTwinkle 6s linear 2s infinite}

@-webkit-keyframes popTwinkle {
    0%{
        opacity: 0;
    }
    50%{
        opacity: 1;
        transform:translateY(-30px);
    }
    100%{
        opacity: 0;
        transform:translateY(-50px);
    }
}

@-moz-keyframes popTwinkle {
    0%{
        opacity: 0;
    }
    50%{
        opacity: 1;
        transform:translateY(-30px);
    }
    100%{
        opacity: 0;
        transform:translateY(-50px);
    }
}

@-ms-keyframes popTwinkle {
    0%{
        opacity: 0;
    }
    50%{
        opacity: 1;
        transform:translateY(-30px);
    }
    100%{
        opacity: 0;
        transform:translateY(-50px);
    }
}


@-o-keyframes popTwinkle {
    0%{
        opacity: 0;
    }
    50%{
        opacity: 1;
        transform:translateY(-30px);
    }
    100%{
        opacity: 0;
        transform:translateY(-50px);
    }
}

@keyframes popTwinkle {
    0%{
        opacity: 0;
    }
    50%{
        opacity: 1;
        transform:translateY(-30px);
    }
    100%{
        opacity: 0;
        transform:translateY(-50px);
    }
}

@-webkit-keyframes cloudMove01 {
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-15px);
    }
    100%{
        transform: translateY(0px);
    }
}
@-moz-keyframes cloudMove01 {
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-15px);
    }
    100%{
        transform: translateY(0px);
    }
}
@-ms-keyframes cloudMove01 {
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-15px);
    }
    100%{
        transform: translateY(0px);
    }
}
@-o-keyframes cloudMove01 {
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-15px);
    }
    100%{
        transform: translateY(0px);
    }
}
@keyframes cloudMove01 {
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-45px);
    }
    100%{
        transform: translateY(0px);
    }
}

#light,#light01,.light{-webkit-animation: blockShow 5s forwards;-moz-animation: blockShow 5s forwards;-o-animation: blockShow 5s forwards;animation: blockShow 5s forwards}
.cloudMove{-webkit-animation: cloudMove01 5s infinite;-moz-animation: cloudMove01 5s infinite;-o-animation: cloudMove01 5s infinite;animation: cloudMove01 5s infinite}

.col-6 li{width: 48%;}
.col-6 li:nth-child(2n){margin-right: 0}
.col-6  li .content-item{width: 320px;margin:0 auto;text-align: justify}
.col-6  li .content-item h1{font-size: 18px;font-weight: bold;text-align: center}
.col-6  li .content-item p{margin:0}
.huaweiCloud00 .sm-show{display: none;}
.huaweiCloud01 .section-h1 a{display: none;}
.huaweiClou0d2 .select{margin:40px 0}
.huaweiCloud02 .select-box{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;justify-content: center;}
.huaweiCloud02 .select-box li{padding: 30px;-webkit-box-flex: 0;-webkit-flex: none;-ms-flex: none;flex: none; margin-bottom: 45px}
.huaweiCloud02 .select-box li.box-shadow,.common-plan li>div.box-shadow{box-shadow: 1px 1px 30px rgba(55,125,236,0.1);}
.huaweiCloud02 .select li{padding:0}
.huaweiCloud02 .common-plan{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;margin:50px auto 0 auto ;width: 1000px;}
.huaweiCloud02 .common-plan li{-webkit-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1; margin:0;padding:0;height: 320px;position: relative;}
.common-plan li>div{padding:10px 30px 30px;border-radius: 15px;position: absolute;width: 110%;height: 100%;background-color: #fff;box-sizing: border-box}
.common-plan li.active .box-shadow{background:url(../../images/gradient-bg.png) repeat-x;background: -webkit-linear-gradient(top,#377aec,#3ae9fa);background: -moz-linear-gradient(top,#377aec,#3ae9fa);background: -o-linear-gradient(top,#377aec,#3ae9fa);background:-ms-linear-gradient(top,#377aec,#3ae9fa);linear-gradient(top,#377aec,#3ae9fa);FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#377aec, endColorStr=#3ae9fa);color:#fff;-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1);-o-transform: scale(1.1);transform: scale(1.1)}
.common-plan li.active .box-shadow>*{color:#fff}

.hover-show{width:100%;height:100%;background:url(../../images/gradient-bg.png) repeat-x;background: -webkit-linear-gradient(top,#377aec,#3ae9fa);background: -moz-linear-gradient(top,#377aec,#3ae9fa);background: -o-linear-gradient(top,#377aec,#3ae9fa);background:-ms-linear-gradient(top,#377aec,#3ae9fa);linear-gradient(top,#377aec,#3ae9fa);FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#377aec, endColorStr=#3ae9fa);border-radius: 10px;padding:30px;box-sizing: border-box;text-align: justify;position: absolute;top:0;left: 0;opacity: 0;transition: all .3s;-moz-transition: all .3s;-webkit-transition: all .3s;-o-transition: all .3s;}
.hover-show>*{color:#fff}

.huaweiCloud03 li,.aliCloud02 li{position: relative;min-height:228px;cursor: pointer;padding:50px 0;box-sizing: border-box}
.huaweiCloud03 li img{height: 53px;}
.huaweiCloud03 li p,.aliCloud02 li p{font-weight: bold;line-height: 40px;text-align: center;white-space: nowrap}
.aliCloud02 li p{margin-bottom:20px}
.huaweiCloud03 li span, .aliCloud02 li span{line-height: 26px;}
.huaweiCloud03 li:hover .hover-show,.aliCloud02 li:hover .hover-show{opacity: 1}
.icon-hw,.icon-ali{background: url(../../images/icon-hw.png);background-position: center center;background-repeat: no-repeat;background-size: 100%; margin:0 auto;text-align: center}
.icon-hw{width:84px;height:84px;}
.icon-ali{width: 114px;height: 114px;}
.icon-ali img{margin-top:10px;}

/*华为云 弹框 */
.mask{background-color: rgba(0,0,0,0.5);position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 99999999999;display: none}
.related-pop{position: fixed;top:50%;left: 50%;width: 596px;background-color: #fff;border-radius: 15px;display: none}
.related-pop .close{font-size: 24px;width: 55px;line-height: 55px;text-align: center;color:#b9c5cd}
.related-pop .pop-tips{padding:30px 0}
.related-pop p{line-height: 30px;}
.related-pop .btn-div{margin-top: 10px;margin-bottom:40px;text-align: center;}
.related-pop .btn-div .btn{width: 130px;line-height: 40px;border-radius: 20px;text-align: center;display: inline-block;background-color: #eee;margin:0 5px;font-size: 14px;color:#04304b}
.related-pop .btn-div .btn-common{background-color: #4b89f3;color:#fff}


#certification .close{position: absolute;top: -70px;right: 0;background-color: rgba(255, 255, 255, .1);}


/*阿里云 / 腾讯云*/
#banner-ali{background-color: #191361;position: relative;background: -webkit-linear-gradient(60deg,#191361, #1c1773);background: -o-linear-gradient(60deg,#191361, #1c1773);background: -moz-linear-gradient(60deg,#191361, #1c1773);background: linear-gradient(60deg,#191361, #1c1773);overflow: hidden;}
#banner-tencen{background-color: #0c0a46;position: relative}
.banner-ali #animate-canvas, #animate-svg{height: 100%;position: absolute;top: 0;left: 0;width: 100%;}
#banner-ali03,#banner-tencent06{-webkit-animation-duration: 8s;-moz-animation-duration: 8s;-o-animation-duration: 8s;animation-duration: 8s;}
#banner-ali06,#banner-tencent05{-webkit-animation-delay: 2s;-moz-animation-delay: 2s;-o-animation-delay: 2s;animation-delay: 2s;}
.aliCloud00 li{width: 30%;margin-right: 5%;}
.aliCloud00 li:nth-child(3n){margin-right: 0}
.aliCloud00 li p{margin:0 30px;text-align: justify;min-height: 96px;}
.aliCloud02 ul{margin-top: 20px !important;}
.aliCloud02 li{width: 306px;border-radius: 15px;margin: 40px 80px 40px 0;}
.aliCloud02 li:nth-child(3n){margin-right:0}
.aliCloud02 li.box-shadow{
    box-shadow: 1px 1px 30px rgba(55,125,326,0.1);
}

.list-type{text-align: center;white-space: nowrap}
.list-type li{text-align: center;background-color: #fff;width:280px;padding:45px 30px;display: inline-block;margin:0 15px;cursor: pointer;box-sizing: border-box}
.aliCloud01 .list-type *,.tencentCloud02 .list-type *{color:#04304b}
.list-type li samp{display: inline-block;padding:0 10px;line-height: 28px;border-radius: 15px;background-color: #4b89f3;color:#fff !important;font-weight: bold;}
.list-type li .price{font-size: 22px;line-height: 40px;font-weight: bold}
.list-type li .price.sm{font-size: 20px;line-height: normal}
.list-type li .btn{width:100px;line-height: 30px;border:1px solid #e6e6e6;display: block;margin:20px auto 0 auto}
.list-type .desc{border-bottom: 1px dashed #d2d2d2}
.list-type li:hover{background:url(../../images/gradient-bg.png) repeat-x;background: -webkit-linear-gradient(top,#377aec,#3ae9fa);background: -moz-linear-gradient(top,#377aec,#3ae9fa);background: -o-linear-gradient(top,#377aec,#3ae9fa);background:-ms-linear-gradient(top,#377aec,#3ae9fa);linear-gradient(top,#377aec,#3ae9fa);FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#377aec, endColorStr=#3ae9fa);-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1);-o-transform: scale(1.1);transform: scale(1.1)}
.list-type li:hover *{color:#fff; }
.list-type li:hover .desc{border-color: #fff}
.list-type li:hover samp{color:#4b89f3 !important;background-color: #fff;}
.list-type li:hover .btn{background-color: #4b89f3;border:1px solid #4b89f3}
.swiper-scalc{overflow: initial;}
.swiper-scalc .swiper-wrapper{display: block;}


/*.tencentCloud01 li p{margin-bottom: 20px;font-weight: bold;line-height: 40px;text-align: center;white-space: nowrap;}*/
.tencentCloud02 .list-type li{width:240px;margin:0 10px}
#banner-tencent02{-webkit-animation-duration: 10s;-moz-animation-duration: 10s;-o-animation-duration: 10s;animation-duration: 10s;}
/*#banner-tencent04{-webkit-animation: picMove 8s ease infinite;-moz-animation: picMove 8s ease infinite;-o-animation: picMove 8s ease infinite;animation: picMove 8s ease infinite}*/




/*阿里云分销*/
.aliyunBanner{height: 680px;background-image: url(../../images/bannerBg-fx.jpg);background-position: center center;background-size: auto 100%;background-repeat: no-repeat;overflow: hidden}
.aliyunBanner>div{height: 100%}

.animate-item{position: absolute;top: 40%;left: 50%;-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);transform: translateX(-50%);height: 60%;width: 700px;}
.animate-item>div,.move-item>div,.move-item01>div{position: absolute;}
.block01{background-image: url(../../images/block01.png);width:154px;height:164px;left: auto;bottom: 28px;}
.block02{background-image: url(../../images/block02.png);width:202px;height: 232px;left: 115px;bottom: -82px;z-index: 5;}
.block03{background-image: url(../../images/block03.png);width:160px;height:172px;left: 265px;bottom: 33px;}
.block04{background-image: url(../../images/block04.png);width:160px;height:181px;left: 375px;bottom: -55px;z-index: 5;}
.block05{background-image: url(../../images/block05.png);width:241px;height:300px;left: 480px;bottom: -15px;}

.move-item{left: 63px;bottom: 220px;}
.block06{background-image: url(../../images/block06.png);width:45px;height: 68px;-webkit-animation:itemMove01 6s linear 1s infinite;-moz-animation:itemMove01 6s linear 1s infinite;-o-animation:itemMove01 6s linear 1s infinite;animation:itemMove01 6s linear 1s infinite;}
.block07,.block08{background-image: url(../../images/block07.png);width:45px;height: 68px;}
.block07{left: -8px;top:-5px}
.block08{left: -16px;top:-10px;-webkit-animation:itemMove 6s linear 1s infinite;-moz-animation:itemMove 6s linear 1s infinite;-o-animation:itemMove 6s linear 1s infinite;animation:itemMove 6s linear 1s infinite}

@-webkit-keyframes itemMove {
    0%{
        -webkit-transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(5px,5px);
    }
    100%{
        -webkit-transform: translate(0,0);
    }
}
@-moz-keyframes itemMove {
    0%{
        -moz-transform: translate(0,0);
    }
    50%{
        -moz-transform: translate(5px,5px);
    }
    100%{
        -moz-transform: translate(0,0);
    }
}
@-o-keyframes itemMove {
    0%{
        -o-transform: translate(0,0);
    }
    50%{
        -o-transform: translate(5px,5px);
    }
    100%{
        -o-transform: translate(0,0);
    }
}
@-ms-keyframes itemMove {
    0%{
        -ms-transform: translate(0,0);
    }
    50%{
        -ms-transform: translate(5px,5px);
    }
    100%{
        -ms-transform: translate(0,0);
    }
}
@keyframes itemMove {
    0%{
        transform: translate(0,0);
    }
    50%{
        transform: translate(5px,5px);
    }
    100%{
        transform: translate(0,0);
    }
}

@-webkit-keyframes itemMove01 {
    0%{
        -webkit-transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(-5px,-5px);
    }
    100%{
        -webkit-transform: translate(0,0);
    }
}
@-moz-keyframes itemMove01 {
    0%{
        -moz-transform: translate(0,0);
    }
    50%{
        -moz-transform: translate(-5px,-5px);
    }
    100%{
        -moz-transform: translate(0,0);
    }
}
@-o-keyframes itemMove01 {
    0%{
        -o-transform: translate(0,0);
    }
    50%{
        -o-transform: translate(-5px,-5px);
    }
    100%{
        -o-transform: translate(0,0);
    }
}
@-ms-keyframes itemMove01 {
    0%{
        -ms-transform: translate(0,0);
    }
    50%{
        -ms-transform: translate(-5px,-5px);
    }
    100%{
        -ms-transform: translate(0,0);
    }
}
@keyframes itemMove01 {
    0%{
        transform: translate(0,0);
    }
    50%{
        transform: translate(-5px,-5px);
    }
    100%{
        transform: translate(0,0);
    }
}

.move-item01{left: 630px;bottom: 340px;}
.block09{background-image: url(../../images/block09.png);width:100px;height: 126px;-webkit-animation:itemMove02 8s linear 3s infinite;-moz-animation:itemMove02 8s linear 3s infinite;-o-animation:itemMove02 8s linear 3s infinite;animation:itemMove02 8s linear 3s infinite}
.block10,.block11{background-image: url(../../images/block10.png);width:100px;height: 126px;}
.block10{left: 8px;top:-5px}
.block11{left: 16px;top:-10px;-webkit-animation:itemMove03 8s linear 3s infinite;-moz-animation:itemMove03 8s linear 3s infinite;-o-animation:itemMove03 8s linear 3s infinite;animation:itemMove03 8s linear 3s infinite}

@-webkit-keyframes itemMove02 {
    0%{
        -webkit-transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(5px,-5px);
    }
    100%{
        -webkit-transform: translate(0,0);
    }
}
@-moz-keyframes itemMove02 {
    0%{
        -moz-transform: translate(0,0);
    }
    50%{
        -moz-transform: translate(5px,-5px);
    }
    100%{
        -moz-transform: translate(0,0);
    }
}
@-o-keyframes itemMove02 {
    0%{
        -o-transform: translate(0,0);
    }
    50%{
        -o-transform: translate(5px,-5px);
    }
    100%{
        -o-transform: translate(0,0);
    }
}
@-ms-keyframes itemMove02 {
    0%{
        -ms-transform: translate(0,0);
    }
    50%{
        -ms-transform: translate(5px,-5px);
    }
    100%{
        -ms-transform: translate(0,0);
    }
}
@keyframes itemMove02 {
    0%{
        transform: translate(0,0);
    }
    50%{
        transform: translate(5px,-5px);
    }
    100%{
        transform: translate(0,0);
    }
}

@-webkit-keyframes itemMove03 {
    0%{
        -webkit-transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(-5px,5px);
    }
    100%{
        -webkit-transform: translate(0,0);
    }
}

@-moz-keyframes itemMove03 {
    0%{
        -moz-transform: translate(0,0);
    }
    50%{
        -moz-transform: translate(-5px,5px);
    }
    100%{
        -moz-transform: translate(0,0);
    }
}

@-o-keyframes itemMove03 {
    0%{
        -o-transform: translate(0,0);
    }
    50%{
        -o-transform: translate(-5px,5px);
    }
    100%{
        -o-transform: translate(0,0);
    }
}

@-ms-keyframes itemMove03 {
    0%{
        -ms-transform: translate(0,0);
    }
    50%{
        -ms-transform: translate(-5px,5px);
    }
    100%{
        -ms-transform: translate(0,0);
    }
}

@keyframes itemMove03 {
    0%{
        transform: translate(0,0);
    }
    50%{
        transform: translate(-5px,5px);
    }
    100%{
        transform: translate(0,0);
    }
}

.info{text-align: center;color:#fff;position: absolute;top:45%;width: 100%;z-index: 20}
.info h1,.info p{color:#fff}
.info h1{font-size: 34px;margin-bottom: 25px;}
.info p{font-size: 18px;font-weight: bold;margin-bottom: 35px;}
.info li{display: inline-block;position: relative}
.info li:after{content:'';width:2px;background-color: #fff;height: 16px;display:block;position: absolute;right: -1px;top:2px}
.info li:last-child:after{display: none}
.info li p{font-size: 16px;padding:0 30px;}
.info .btn{width:160px;line-height: 50px;background-color: #3bfdfc;border-radius: 50px;display: inline-block;margin:10px 0}

.shake{-webkit-animation:cloudMove 4s linear 1s infinite;-moz-animation:cloudMove 4s linear 1s infinite;-o-animation:cloudMove 4s linear 1s infinite;animation:cloudMove 4s linear 1s infinite}
.shake:nth-child(2){-webkit-animation-delay: 3s;-moz-animation-delay: 3s;-o-animation-delay: 3s;animation-delay: 3s;}
.shake:nth-child(3){-webkit-animation-delay: 2s;-moz-animation-delay: 2s;-o-animation-delay: 2s;animation-delay: 2s}
.shake:nth-child(4){-webkit-animation-delay: 4s;-moz-animation-delay: 4s;-o-animation-delay: 4s;animation-delay: 4s}
.shake:nth-child(5){-webkit-animation-delay: 3s;-moz-animation-delay: 3s;-o-animation-delay: 3s;animation-delay: 3s}

.section-step{width:850px;margin:30px auto 0 auto}
.section-step li{display: inline-block;width:33.3333333%;text-align: center;margin:40px 0 0 0;position: relative}
.section-step li img{display: block;margin:0 auto;}
.section-step li:after{content:'';display:block;width:41px;height:20px;clip-path: url("style.css");position: absolute;right: -25px;top: 60%;-webkit-animation: shakeMove 4s linear infinite;-moz-animation: shakeMove 4s linear infinite;-o-animation: shakeMove 4s linear infinite;animation: shakeMove 4s linear infinite;background-image: url(../../images/arrow.png);}

.section-step-mobile{display: none;}
.section-step li:nth-child(3):after{top: auto;bottom: -60px;right: 43%;-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);-ms-transform: rotate(90deg);-o-transform: rotate(90deg);transform: rotate(90deg);-webkit-animation: upMove 4s linear infinite;-moz-animation: upMove 4s linear infinite;-o-animation: upMove 4s linear infinite;animation: upMove 4s linear infinite;}
.section-step li:nth-child(4):after,.section-step li:nth-child(5):after{-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);-ms-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);-webkit-animation: shakeMove 4s linear 1s infinite;-moz-animation: shakeMove 4s linear 1s infinite;-o-animation: shakeMove 4s linear 1s infinite;animation: shakeMove 4s linear 1s infinite}
.section-step li:nth-child(6):after{display: none}
.step-title{border:1px solid #345278;border-radius: 10px;margin-bottom: 20px;display: inline-block;padding:0 10px;position: relative}
.step-title p{font-size: 14px;padding:10px 0}

.section-step li:nth-child(4) .step-title{left: -100px;top:35px}
.section-step li:nth-child(6) .step-title{right: -110px;top:35px}
@-webkit-keyframes shakeMove {
    0%{
        right:0;
    }
    50%{
        right:-25px;
    }
    100%{
        right:0;
    }
}
@-moz-keyframes shakeMove {
    0%{
        right:0;
    }
    50%{
        right:-25px;
    }
    100%{
        right:0;
    }
}
@-ms-keyframes shakeMove {
    0%{
        right:0;
    }
    50%{
        right:-25px;
    }
    100%{
        right:0;
    }
}

@-o-keyframes shakeMove {
    0%{
        right:0;
    }
    50%{
        right:-25px;
    }
    100%{
        right:0;
    }
}
@keyframes shakeMove {
    0%{
        right:0;
    }
    50%{
        right:-25px;
    }
    100%{
        right:0;
    }
}
@-webkit-keyframes upMove {
    0%{
        bottom: -30px;
    }
    50%{
        bottom: -60px;
    }
    100%{
        bottom: -30px;
    }
}

@-moz-keyframes upMove {
    0%{
        bottom: -30px;
    }
    50%{
        bottom: -60px;
    }
    100%{
        bottom: -30px;
    }
}
@-ms-keyframes upMove {
    0%{
        bottom: -30px;
    }
    50%{
        bottom: -60px;
    }
    100%{
        bottom: -30px;
    }
}
@-o-keyframes upMove {
    0%{
        bottom: -30px;
    }
    50%{
        bottom: -60px;
    }
    100%{
        bottom: -30px;
    }
}
@keyframes upMove {
    0%{
        bottom: -30px;
    }
    50%{
        bottom: -60px;
    }
    100%{
        bottom: -30px;
    }
}

.resonList{text-align: center;position: relative;padding:40px 0;margin-top: 40px;}
.resonList li{text-align: left;position: absolute;font-size: 15px;color:#04304b;font-weight: bold}
.resonList li span:before{content:'';width:8px;height: 8px;display: block;background-color: #002c99;border-radius: 8px;position: absolute;}
.resonList li span:after{content:'';width: 8px;height: 8px;display: block;background-color: #002c99;opacity: .5;border-radius: 8px;position: absolute;-webkit-animation: spread 2s infinite;-moz-animation: spread 2s infinite;-o-animation: spread 2s infinite;animation: spread 2s infinite}

.resonList li:nth-child(1){left: 70px;top: 132px;}
.resonList li:nth-child(3){left: 92px;top: 321px;}
.resonList li:nth-child(2){right: -3px;top: 80px;}
.resonList li:nth-child(4){right: 84px;top: 315px;}

.resonList li:nth-child(2n) span:before,.resonList li:nth-child(2n) span:after{left: -25px;top: 5px;}
.resonList li:nth-child(2n+1) span:before,.resonList li:nth-child(2n+1) span:after{right: -25px;top: 5px;}

.resonList li:after{content:'';width:50px;height:1px;background-color: #002c99;display: block;position: absolute;right: -116px;top: 26px;}
.resonList li:before{content:'';width:50px;height:1px;background-color: #002c99;display: block;position: absolute;right: -116px;top: 26px;}
.resonList li:nth-child(2n+1):after{right: -116px;top: 26px;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);}
.resonList li:nth-child(2n+1):before{right: -73px;top: 8px;}
.resonList li:nth-child(2n):after{left: -116px;top: 26px;-webkit-transform: rotate(135deg);-moz-transform: rotate(135deg);-ms-transform: rotate(135deg);-o-transform: rotate(135deg);transform: rotate(135deg);}
.resonList li:nth-child(2n):before{left: -73px;top: 8px;}

.resonListBg{width: 625px;margin: 0 auto;position: relative;}
.resonListBg .bgItem{position: relative;z-index: 1;}
.resonListBg .moveItem{position: absolute;left: 466px;top: 28px;-webkit-animation: cloudMove 3s infinite;-moz-animation: cloudMove 3s infinite;-o-animation: cloudMove 3s infinite;animation: cloudMove 3s infinite;}
.resonListBg .lineItem{position: absolute;left: 453px;bottom: 132px;z-index: 3;width: 26px;height:32px;}
.resonListBg .lineItem .lineImgItem{position: absolute;-webkit-animation: lineMove 2s infinite;-moz-animation: lineMove 2s infinite;-o-animation: lineMove 2s infinite;animation: lineMove 2s infinite;width: 0;height: 18px;left: 0;overflow: hidden;background:url(../../images/block20.png) no-repeat;}
.resonListBg .lineItem .lineImgItem:nth-child(2){top: 4px;left: 1px;-webkit-animation-delay: .3s;-moz-animation-delay: .3s;-o-animation-delay: .3s;animation-delay: .3s}
.resonListBg .lineItem .lineImgItem:nth-child(3){top: 9px;left: 2px;-webkit-animation-delay: .6s;-moz-animation-delay: .6s;-o-animation-delay: .6s;animation-delay: .6s}
.resonListBg .lineItem .lineImgItem:nth-child(4){top: 13px;left: 4px;-webkit-animation-delay: .9s;-moz-animation-delay: .9s;-o-animation-delay: .9s;animation-delay: .9s}
.resonListBg .manItem{position: absolute;left: 457px;bottom: 30px;z-index: 5;}

@-webkit-keyframes lineMove {
    to{
        width:28px;
    }
}
@-moz-keyframes lineMove {
    to{
        width:28px;
    }
}
@-ms-keyframes lineMove {
    to{
        width:28px;
    }
}
@-o-keyframes lineMove {
    to{
        width:28px;
    }
}
@keyframes lineMove {
    to{
        width:28px;
    }
}
@-webkit-keyframes spread {
    to{
        -webkit-transform: scale(3);
        opacity: 0;
    }
}
@-moz-keyframes spread {
    to{
        -moz-transform: scale(3);
        opacity: 0;
    }
}
@-ms-keyframes spread {
    to{
        -ms-transform: scale(3);
        opacity: 0;
    }
}
@-o-keyframes spread {
    to{
        -o-transform: scale(3);
        opacity: 0;
    }
}
@keyframes spread {
    to{
        transform: scale(3);
        opacity: 0;
    }
}

.hot-product{background-color:#14389e}
.hot-product h1{color:#fff}
.hot-product .section-body{margin-top:60px;}

.hot-product li{width: 24%;float: left;background-color: #fff;border-radius: 5px;padding:50px 12px 40px 12px;box-sizing: border-box;margin-right: 1.33333333333%;min-height: 380px;}
.hot-product li:last-child{margin:0}
.hot-product li p{font-size: 18px;color:#05376f;font-weight: bold;text-align: center;margin-bottom: 15px;}
.hot-product li span{text-align: justify;line-height: 24px;min-height: 120px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5; white-space: normal}
.item-icon{width:78px;height: 65px;margin:0 auto 45px auto;background: url(../../images/item-icon-bg.png);position: relative;padding:12px 0;text-align: center;}
.item-icon .item-icon-cover{width: 100%;height: 100%;display: block;position: absolute;top:0;background: url(../../images/item-icon-top.png)}
.item-icon:after{content:'';display: block;width: 20px;height: 2px;background-color: #05376f;position: absolute;bottom: -20px;left: 29px;}
.hot-product li:hover .item-icon img{-webkit-animation: moveIcon 3s;-moz-animation: moveIcon 3s;-o-animation: moveIcon 3s;animation: moveIcon 3s}


.footer-slogan{width:815px;height:90px;background: -webkit-linear-gradient(left,#155bc8, #2b4ca8);background: -o-linear-gradient(left,#155bc8, #2b4ca8);background: -ms-linear-gradient(left,#155bc8, #2b4ca8);background: -moz-linear-gradient(left,#155bc8, #2b4ca8);background: linear-gradient(left,#155bc8, #2b4ca8);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#155bc8', endColorstr='#2b4ca8',GradientType=0 ); border-radius: 90px;margin:0 auto;position: relative}
.footer-slogan p{line-height: 90px;color:#fff;font-size: 24px;font-weight: bold;text-align: center}

.left-wave,.right-wave{position: absolute;bottom: 0;height: 100%}
.left-wave{left: -70px;}
.right-wave{right: -70px;}
.right-wave .point-item{left: auto;right: 0}
.leaves{width: 145px;height:90px;overflow-y: hidden;position: relative;}
.leaves::-webkit-scrollbar{display: none}
.leaf01,.leaf02,.leaf03,.leaf04{position: absolute;bottom: 0;background-repeat: no-repeat}
.leaf01{width:80px;height:41px;background-image: url(../../images/leaf01.png);-webkit-transform-origin: right bottom;-moz-transform-origin: right bottom;-ms-transform-origin: right bottom;-o-transform-origin: right bottom;transform-origin: right bottom;-webkit-animation: leafWave 8s infinite;-moz-animation: leafWave 8s infinite;-o-animation: leafWave 8s infinite;animation: leafWave 8s infinite;bottom: -10px;}
.leaf02{width:101px;height:103px;background-image: url(../../images/leaf02.png);left: 26px;bottom: -29px;-webkit-transform-origin: right bottom;-moz-transform-origin: right bottom;-ms-transform-origin: right bottom;-o-transform-origin: right bottom;transform-origin: right bottom;-webkit-animation: leafWave 12s infinite;-moz-animation: leafWave 12s infinite;-o-animation: leafWave 12s infinite;animation: leafWave 12s infinite;}
.leaf03{width:102px;height:103px;background-image: url(../../images/leaf03.png);right: 26px;bottom: -29px;-webkit-transform-origin: left bottom;-moz-transform-origin: left bottom;-ms-transform-origin: left bottom;-o-transform-origin: left bottom;transform-origin: left bottom;-webkit-animation: leafWave01 12s infinite;-moz-animation: leafWave01 12s infinite;-o-animation: leafWave01 12s infinite;animation: leafWave01 12s infinite}
.leaf04{width:80px;height:41px;background-image: url(../../images/leaf04.png);right: 0;-webkit-transform-origin: left bottom;-moz-transform-origin: left bottom;-ms-transform-origin: left bottom;-o-transform-origin: left bottom;transform-origin: left bottom;-webkit-animation: leafWave01 8s infinite;-moz-animation: leafWave01 8s infinite;-o-animation: leafWave01 8s infinite;animation: leafWave01 8s infinite;bottom: -10px;}

@-webkit-keyframes leafWave {
    50%{
        -webkit-transform: rotate(10deg);
    }
}
@-moz-keyframes leafWave {
    50%{
        -moz-transform: rotate(10deg);
    }
}
@-o-keyframes leafWave {
    50%{
        -o-transform: rotate(10deg);
    }
}
@-ms-keyframes leafWave {
    50%{
        -ms-transform: rotate(10deg);
    }
}
@keyframes leafWave {
    50%{
        transform: rotate(10deg);
    }
}

@-webkit-keyframes leafWave01 {
    50%{
        -webkit-transform: rotate(-10deg);
    }
}
@-moz-keyframes leafWave01 {
    50%{
        -moz-transform: rotate(-10deg);
    }
}
@-ms-keyframes leafWave01 {
    50%{
        -ms-transform: rotate(-10deg);
    }
}
@-o-keyframes leafWave01 {
    50%{
        -o-transform: rotate(-10deg);
    }
}
@keyframes leafWave01 {
    50%{
        transform: rotate(-10deg);
    }
}

.point-item{position: absolute;left: 0;bottom:0}
.point-item>div{position: absolute; opacity: 0;bottom: 0}
.right-wave .point-item{-webkit-transform: scaleX(-1);-moz-transform: scaleX(-1);-ms-transform: scaleX(-1);-o-transform: scaleX(-1);transform: scaleX(-1);}

.point-01{width:10px;height:10px;border-radius: 10px;background-color: #2b4ca8;opacity: 0.3;left: 26px;-webkit-animation: popMove 5s linear infinite;-moz-animation: popMove 5s linear infinite;-o-animation: popMove 5s linear infinite;animation: popMove 5s linear infinite;}
.point-02{width:20px;height:20px;border-radius: 10px;background-color: #d0d7ec;opacity: .7;left: 3px;-webkit-animation: popMove 3s linear .5s infinite;-moz-animation: popMove 3s linear .5s infinite;-o-animation: popMove 3s linear .5s infinite;animation: popMove 3s linear .5s infinite;}
.point-03{width:8px;height:8px;border-radius: 10px;background-color: #2b4ca8;opacity: .4;left: -12px;-webkit-animation: popMove 8s linear 5.5s infinite;-moz-animation: popMove 8s linear 5.5s infinite;-o-animation: popMove 8s linear 5.5s infinite;animation: popMove 8s linear 5.5s infinite;}
.point-04{width:12px;height:12px;border-radius: 10px;background-color: #b8c3e2;opacity: 1;left: 0;-webkit-animation: popMove 10s linear 4.5s infinite;-moz-animation: popMove 10s linear 4.5s infinite;-o-animation: popMove 10s linear 4.5s infinite;animation: popMove 10s linear 4.5s infinite}
.point-05{width:12px;height:12px;border-radius: 10px;background-color: #899bce;opacity: .8;left: -13px;-webkit-animation: popMove 12s linear 2.5s infinite;-moz-animation: popMove 12s linear 2.5s infinite;-o-animation: popMove 12s linear 2.5s infinite;animation: popMove 12s linear 2.5s infinite}

.point-06{width:15px;height:15px;border-radius: 10px;background-color: #2b4ca8;opacity: .8;left: -10px;-webkit-animation: popMove 15s linear 6s infinite;-moz-animation: popMove 15s linear 6s infinite;-o-animation: popMove 15s linear 6s infinite;animation: popMove 15s linear 6s infinite}
.point-07{width:6px;height:6px;border-radius: 10px;background-color: #899bce;opacity: .3;left: 27px;-webkit-animation: popMove 6s linear 3s infinite;-moz-animation: popMove 6s linear 3s infinite;-o-animation: popMove 6s linear 3s infinite;animation: popMove 6s linear 3s infinite}
.point-08{width:9px;height:9px;border-radius: 10px;background-color: #d0d7ec;opacity: .8;left: -5px;-webkit-animation: popMove 9s linear infinite;-moz-animation: popMove 9s linear infinite;-o-animation: popMove 9s linear infinite;animation: popMove 9s linear infinite}
.point-09{width:7px;height:7px;border-radius: 10px;background-color: #b8c3e2;opacity: .5;left: 17px;-webkit-animation: popMove 12s linear infinite;-moz-animation: popMove 12s linear infinite;-o-animation: popMove 12s linear infinite;animation: popMove 12s linear infinite}
.point-10{width:12px;height:12px;border-radius: 10px;background-color: #d0d7ec;opacity: .2;left: 5px;-webkit-animation: popMove 7s linear 3s infinite;-moz-animation: popMove 7s linear 3s infinite;-o-animation: popMove 7s linear 3s infinite;animation: popMove 7s linear 3s infinite}


@-webkit-keyframes pointMove {
    25% {
        -webkit-transform: translate(20%, 0%);
    }
    50% {
        -webkit-transform: translate(-80%, 0%);
    }
    75% {
        bottom: 0;
    }
}

@-moz-keyframes pointMove {
    25% {
        -moz-transform: translate(20%, 0%);
    }
    50% {
        -moz-transform: translate(-80%, 0%);
    }
    75% {
        bottom: 0;
    }
}

@-ms-keyframes pointMove {
    25% {
        -ms-transform: translate(20%, 0%);
    }
    50% {
        -ms-transform: translate(-80%, 0%);
    }
    75% {
        bottom: 0;
    }
}

@-o-keyframes pointMove {
    25% {
        -o-transform: translate(20%, 0%);
    }
    50% {
        -o-transform: translate(-80%, 0%);
    }
    75% {
        bottom: 0;
    }
}

@keyframes pointMove {
    25% {
        transform: translate(20%, 0%);
    }
    50% {
        transform: translate(-80%, 0%);
    }
    75% {
        bottom: 0;
    }
}

/*天翼云*/
#banner-ty{background: -moz-linear-gradient(left top, #050e58 0%, #112c74 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#050e58), color-stop(100%,#112c74));background: -webkit-linear-gradient(left top, #050e58 0%,#112c74 100%);background: -o-linear-gradient(top, #050e58 0%,#112c74 100%);background: -ms-linear-gradient(left top, #050e58 0%,#112c74 100%);background: linear-gradient(to right bottom, #050e58 0%,#112c74 100%);}
#banner-ty .info_r{position: absolute;top:50%;right: -30px}
.banner-tianyi{background-image: url(../../images/tianyiCloud.png);width:670px;height: 430px;background-size: 100% 100%;position: relative;top:30px}

#tianyi01{width: 72px;position: absolute;left: 150px;top:20px;}
#tianyi02{width: 72px;position: absolute;right: 125px;top: 37px;}
#tianyi03{width: 72px;position: absolute;left: 167px;top: 216px;}


/*华为云*/
.huaweiCloud02 li:hover .item-icon i{-webkit-animation: none;-moz-animation: none;-o-animation: none;animation: none}
.huaweiCloud02 li:hover .item-icon img{-webkit-animation: moveIcon 3s;-moz-animation: moveIcon 3s;-o-animation: moveIcon 3s;animation: moveIcon 3s}
.huaweiCloud02 li .item-icon:after{display: none}
.huaweiCloud02 li .item-icon{margin-bottom: 30px;}

.hw-rights{margin-right: 120px;}
.hw-rights h3{font-size: 24px;font-weight: bold;margin-bottom: 50px;}
.hw-rights li{width: 400px;height: 39px;background: url(../../images/rights-bg.png);margin-bottom: 30px;line-height: 39px;padding-left: 75px;box-sizing: border-box;position: relative;background-repeat: no-repeat;background-size: 100% 100%}
.hw-rights li i{display: block;position: absolute;width: 40px;height: 39px;left: 3px;top:0;background-position: center center;background-repeat: no-repeat}
.hw-rights li i.right-icon01{background-image: url(../../images/right-icon01.png)}
.hw-rights li i.right-icon02{background-image: url(../../images/right-icon02.png)}
.hw-rights li i.right-icon03{background-image: url(../../images/right-icon03.png)}
.hw-rights li i.right-icon04{background-image: url(../../images/right-icon04.png)}
.hw-rights li i.right-icon05{background-image: url(../../images/right-icon05.png)}
.hw-rights li i.right-icon06{background-image: url(../../images/right-icon06.png)}

.hw-purchase ul{margin:50px 0 0 0}
.hw-purchase li{display: inline-block;text-align: center;position: relative;padding-right: 100px;margin-right: 15px;}
.hw-purchase li span{display: block;padding:5px 10px;border:1px solid #193456;border-radius: 5px;margin-top: 5px;}
.hw-purchase li:before{content:'';display: block;width: 70px;height: 5px;background-color: #0d2f9e;position: absolute;;right: 6px;top:37%;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%)}
.hw-purchase li:after{content:''; display:block;width:0;height:0;border-top:6px solid transparent;border-bottom: 6px solid transparent;border-left: 6px solid #0d2f9e;position: absolute;;right: 0;top:37%;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%)}
.hw-purchase li:last-child{padding:0;margin:0}
.hw-purchase li:last-child:before,.hw-purchase li:last-child:after{display: none}

.btn-default{display:inline-block;width:140px;line-height: 40px;text-align: center;background-color: #3bfdfc;border-radius: 20px;color:#222642 !important;}


/*最新活动*/
.banner-lastest{height: 450px;}
.switch-style-1,.switch-style-2{margin-bottom: 50px;}
.switch-style-1{text-align: center;background-color: #f5f7ff}
.switch-style-1 a{display: inline-block;line-height: 50px;width: 140px;}
.switch-style-1 a.on{color:#4b89f3;border-bottom: 2px solid #4b89f3;font-weight: bold}

.switch-style-2{font-size: 0;text-align: center}
.switch-style-2 a{display: inline-block;text-align: center;font-size: 12px;color:#596b7b;line-height: 38px;width: 120px;border-top:1px solid #d6e3fd;border-bottom:1px solid #d6e3fd;border-left:1px solid #d6e3fd;box-sizing: border-box}
.switch-style-2 a:last-child{border-right: 1px solid #d6e3fd}
.switch-style-2 a.on{color:#4b89f3;font-weight: bold;background-color: #d6e3fd}

/*.switch-contennt{width: 1100px;margin:0 auto}*/
.switch-list{margin-bottom:100px;}
.switch-list li{width: 344px;margin: 0 7px 20px 7px;float: left;border:1px solid #e3e9f9;background-color: #fbfcff;}
/*.switch-list li a img{width: 100%;height:100%;position: absolute;top:0;left: 0}*/

.empty-activity{text-align: center;padding:100px 0 150px 0}
.empty-activity p{color:#75838f}

/*融合CDN*/
.table{border:1px solid #e6e6e6;border-collapse: collapse;}
.table td{border:1px solid #e6e6e6;padding:15px 30px;line-height: 25px}

.cdn-fun{position: relative;}
.cdn-fun .select-box{position:relative;}
.cdn-fun-l{width: 45%;text-align: center}
.cdn-fun-l>img{display: inline-block;vertical-align: bottom}
.cdn-fun-r{width: 55%;position: absolute;right: 0;top: 50%;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%);float: none;}
.cdn-fun-r .select-box{position: absolute;top:50%;}

#ball01{-webkit-animation: cloudMove01 3s linear infinite;-moz-animation: cloudMove01 3s linear infinite;-o-animation: cloudMove01 3s linear infinite;animation: cloudMove01 3s linear infinite}
#ball02{-webkit-animation: cloudMove02 5s linear infinite;-moz-animation: cloudMove02 5s linear infinite;-o-animation: cloudMove02 5s linear infinite;animation: cloudMove02 5s linear infinite}
@-webkit-keyframes cloudMove02 {
    0%{
        -webkit-transform: translateY(0px) scale(.7);
    }
    50%{
        -webkit-transform: translateY(-70px) scale(.7);
    }
    100%{
        -webkit-transform: translateY(0px) scale(.7);
    }
}
@-moz-keyframes cloudMove02 {
    0%{
        -moz-transform: translateY(0px) scale(.7);
    }
    50%{
        -moz-transform: translateY(-70px) scale(.7);
    }
    100%{
        -moz-transform: translateY(0px) scale(.7);
    }
}
@-ms-keyframes cloudMove02 {
    0%{
        -ms-transform: translateY(0px) scale(.7);
    }
    50%{
        -ms-transform: translateY(-70px) scale(.7);
    }
    100%{
        -ms-transform: translateY(0px) scale(.7);
    }
}
@-o-keyframes cloudMove02 {
    0%{
        -o-transform: translateY(0px) scale(.7);
    }
    50%{
        -o-transform: translateY(-70px) scale(.7);
    }
    100%{
        -o-transform: translateY(0px) scale(.7);
    }
}
@keyframes cloudMove02 {
    0%{
        transform: translateY(0px) scale(.7);
    }
    50%{
        transform: translateY(-70px) scale(.7);
    }
    100%{
        transform: translateY(0px) scale(.7);
    }
}


.red{color:#e53636}

#banner-cdn .info_l a{width: 100px;line-height: 40px;display: inline-block;background-color: #3bfdfc;color: #001e44;border-radius: 40px;text-align: center;margin-top: 25px;}


/* 融合-cdn 价格明细 */
.section-block{margin: 20px 0 0 0;line-height: 30px;}
.section-block li{display: inline-block;margin-right: 40px;}
h3.block-title{font-size: 18px;font-weight: bold;color:#04304b;margin:30px 0}
h3.block-title:before{content:'';display: inline-block;width: 4px;height: 18px;background-color: #0078ff;vertical-align: middle;margin-right: 15px;}
h4.block-title{font-size: 14px;font-weight: bold;color:#04304b;margin: 0 0 5px;}
h4.block-title:before{content:'';display: inline-block;width: 6px;height: 6px;background-color: #0078ff;vertical-align: middle;margin-right: 10px;border-radius: 6px}
.table01{width: 100%;border-collapse: collapse}
.table01 tr:nth-child(2n){background-color: #f5f8fa}
.table01 th,.table01 td{border-right: 1px dashed #ccd5db}
.table01 th:last-child,.table01 td:last-child{border-right: 0}
.table01 th{line-height: 60px;background-color: #4b89f3;color:#fff;width: 25%;min-width: 90px;}
.table01 td{text-align: center;padding: 15px 5px;}
.table-scroll{overflow:auto}

.table02{border-collapse: collapse;font-size: 12px}
.table02 th,.table02 td{border: 1px solid #dfe7ed}
.table02 th{line-height: 25px;background-color: #f1f5f8;color:#04304b;width: 25%;min-width: 85px;height:60px;font-weight: normal;}
.table02 td{text-align: center;padding: 15px 5px;}


/*混合云总*/
.banner-product{height: 560px;background-image: url(../images/banner-product.jpg);background-position: center center;position: relative}
.banner-product .info{position: absolute;top:50%;}
.banner-product h1{font-size: 30px;}
.banner-product ul{margin-top: 70px;}
.banner-product li{padding: 0 40px;height: 30px;vertical-align: middle;margin: 5px 0;}

.mix-product li{width: 49%;min-height: 390px;float: left;text-align: center;background-color: #fff;margin:90px 2% 30px 0;padding:35px 42px;box-sizing: border-box;border-radius: 10px;}
.mix-product li:nth-child(2n){margin-right: 0}
.mix-product li .product-inner{margin-top: -110px;}
.product-inner h3{font-size: 18px;color:#04304b;font-weight: bold;margin:15px 0}
.product-inner p{text-align: justify;line-height: 22px; margin-bottom: 15px;}
.product-inner a{display:block;}
.product-inner .btn{width: 140px;line-height: 40px;background-color: #4b89f3;color:#fff;margin:0 auto;border-radius: 4px;}
.product-inner .btn:hover{background-color: #377aed}
.strength{margin-top: 15px;margin-bottom: 30px;text-align: left;display: inline-block;}
.strength span{font-weight: bold;margin: 6px;display: inline-block;}
.strength span i{display:inline-block;width: 20px;height: 20px;background-color: #d5e5ff;border-radius: 20px;vertical-align: middle;margin-right: 10px;position: relative}
.strength span i:before{content:'';display:block;width: 8px;height: 6px;border-bottom: 2px solid #4b89f3;border-left: 2px dashed #4b89f3;-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);position: absolute;top: 4px;left: 5px;}
#pop01{animation-duration: 3s}
#pop02{animation-duration: 5s}
#pop03{animation-duration: 7s}
#pop04{animation-duration: 5s}
#pop05{animation-duration: 3s}

#line01,#line02,#line03,#line04{-webkit-animation: lineMove 3s linear infinite;-moz-animation: lineMove 3s linear infinite;-o-animation: lineMove 3s linear infinite;animation: lineMove 3s linear infinite}
#line05,#line06{-webkit-animation: lineMove 3s linear infinite;-moz-animation: lineMove 3s linear infinite;-o-animation: lineMove 3s linear infinite;animation: lineMove 3s linear infinite}
@keyframes lineMove {
    0%{
        stroke-dasharray: 0, 1350;
    }
    100%{
        stroke-dasharray: 1350, 1350;
    }
}

.banner-purchase{height: 480px;position: relative;background: -webkit-radial-gradient(#234ab0,#1d2276);background: -o-radial-gradient(#234ab0,#1d2276);background: -moz-radial-gradient(#234ab0,#1d2276);background: radial-gradient(#234ab0,#1d2276);}
.banner-purchase .wrapper{height: 100%}
.banner-purchase .info_l,.banner-purchase .cdn-animate{position: absolute;top: 50%;}
.banner-purchase .info_l{z-index: 9;}
.banner-purchase .info_l h1{font-size: 28px;color:#fff;margin: 0;line-height: 45px;}

.purchase-promise{width: 100%;background-color: #18246b;}
.purchase-promise li{color:#fff;padding: 15px 0 15px 50px;position: relative;box-sizing: border-box;margin-right: 115px;display: inline-block}
.purchase-promise li:last-child{margin:0}
.purchase-promise li i{position:absolute;top:22px;left:0;display:block;width: 40px;height: 40px;background-image: url(../images/purchase-icon.png);background-repeat:no-repeat;background-size:400% 100%;}
.purchase-promise li:nth-child(2) i{background-position: -40px 0}
.purchase-promise li:nth-child(3) i{background-position: -80px 0}
.purchase-promise li:nth-child(4) i{background-position: -120px 0}
.purchase-promise li p{color:#fff;font-size: 16px;font-weight: bold;line-height: 32px;}
.purchase-promise li span{color:#fff;font-size: 14px;display: block;width: 100%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden}

.switch-style-3{text-align: center;font-size: 0;margin-bottom: 30px;}
.switch-style-3 a{display: inline-block;max-width: 180px;width:18%;line-height: 50px;text-align: center;background-color: #fff;border-left:1px solid #4b89f3;border-top:1px solid #4b89f3;border-bottom:1px solid #4b89f3;font-size: 14px;}
.switch-style-3 a:hover{text-decoration: none}
.switch-style-3 a:last-child{border-right: 1px solid #4b89f3}
.switch-style-3 a.active{background-color: #4b89f3;color:#fff}

.purchase-list{padding: 80px 0}
.purchase-list .skip-btn{float: right;margin:-10px 100px 10px 0}

/*vps*/
.banner-vps{height: 400px;background-color: #263b94;}

/* tip */
.tip-box{background-color:#edf3fe;}
.tip{padding:24px 0;}
.tip-image{width:14px;height:13px;display:inline-block;background-image: url(../images/tip.png);margin-right:12px;position: absolute;left: 0;top: 6px;}
.tip p{line-height:26px;margin:0 55px;color:#236ae3;padding-left: 25px;position: relative;}
.tip p span{font-weight:bold;color:#236ae3;}

/* content */
.content-wrap{overflow-x:auto}
.content-box{width:955px;margin:77px auto 185px;}

.content-left h3{display: none;}
.content-left{width:230px;border-radius:12px;padding: 15px;box-sizing: border-box;box-shadow:-6px -6px 8px -4px #f7f7f7,6px -6px 8px -4px #f7f7f7,6px 6px 8px  -4px  #f7f7f7,6px 6px 8px  -4px  #f7f7f7;}
.content-left .vps_nav{min-height:50px;}
.content-left p{height:50px;line-height:50px;color:#04304b;cursor: pointer;white-space: nowrap;}
.content-left p .p-vps{margin-top:13px;margin-left:24px;margin-right:10px;width:24px;height:24px;line-height:24px;font-size:10px;display:inline-block;text-align:center;color:#fff;background-image: url(../images/circle-1.png)}
.content-left p .p-i{float:right;margin-top:22px;margin-right:25px;width:5px;height:10px;display:inline-block;background-image: url(../images/left.png)}
.content-left p.on{color:#fff;background-color: #4b89f3;border-radius: 6px;}
.content-left .on .p-vps{color:#4b89f3;background-image: url(../images/circle-2.png)}
.content-left .on .p-i{width:11px;height:5px;display:inline-block;background-image: url(../images/down.png)}
/* .content-left ul{display:none;} */
.content-left .scrollbar{display: none;}
.content-left .active ~ .scrollbar{display: block;}
.content-left li{font-size:12px; margin:8px auto;color:#5a6c7b;line-height:36px;text-indent:20px;box-sizing: border-box}
.content-left li:hover{background-color:#4f8af1;}
.content-left li:hover a{color:#fff;}
.content-left .li_on a{color:#4f8af1;}
.content-left a{display: block;line-height: 36px;text-indent: 20px;}

.content-right{width:682px;}
.content-right h3{font-size:16px;color:#04304b;font-weight:bold;height:18px;line-height:18px;margin:12px 0 30px 0;border-left:4px solid #4b89f3;padding-left:16px;}
.content-right .ul-li{width: 48%;min-height: 388px;padding-bottom: 75px;border:1px solid #e8ecfb;border-radius:5px;margin-right: 4%;margin-bottom:40px;float:left;box-sizing: border-box;position: relative;}
.block-control{display: none;}

.content-div h4{margin:0 20px;height:20px;line-height:20px;padding-top:28px;padding-bottom:19px;font-size:16px;color:#04304b;text-align:center;border-bottom:1px dashed #e8ecfb}
.content-div .params-wrap{padding:0 40px}
.content-div .params-box{padding: 20px 10px 20px 10px;}
.content-div .params-box-line{line-height: 38px;}
.content-div .params-price{height:34px;margin-top: 15px;}
.content-div .params-price .label{float:left;width:43px;line-height:34px;}
.content-div .params-price .sel{float:left;width: calc(100% - 45px);max-width: 160px;height:32px;border: 1px solid #e5e5e5;background:#fff;background: url(../images/select.png) no-repeat 140px 13px;}
.content-div .params-price .sel p{height:100%;line-height:32px;padding-left:12px;padding-right:25px;}
.content-div .params-price .sel ul{border: 1px solid #e0e0e0;width:159px;left: -1px;background: #fff;line-height: 2;max-height: 142px;overflow: auto;z-index: 10;}
.content-div .params-price .sel ul li{padding-left:12px;}
.content-div .params-price .sel ul .on{background: #4b89f3;color: #fff;}
.content-div li:nth-child(2n){margin-right:0;}

.content-div .params-box-element{display: inline-block;min-width: 48%;margin: 8px 0;line-height: 25px;white-space: nowrap;}
.content-div a{width: calc(100% - 80px);height:40px;line-height:40px;display:inline-block;background-color:#4b89f3;border:1px solid #4b89f3;border-radius:4px;color:#fff;text-align:center;position: absolute;bottom: 30px;}
.content-div .remark{text-align:center;margin-top:23px;line-height:16px;white-space: nowrap}

.poi{cursor: pointer;}
/*文字超出部分显示省略号*/
.wot{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.abs{position: absolute}
.rel{position: relative}



/*短信服务*/
.banner-msg{background: -webkit-linear-gradient(#2d2b90, #4163f6);background: -o-linear-gradient(#2d2b90, #4163f6);background: -moz-linear-gradient(#2d2b90, #4163f6);background: linear-gradient(#2d2b90, #4163f6);}
.banner-msg .info_l a{display: inline-block;border:1px solid #fff;color:#fff;background-color: transparent;width: 120px;line-height: 40px}
.banner-msg .info_r{width: 635px;height:405px;position: absolute;top: 55%;right: 0;}
.banner-msg .info_r .animate-box{background-image: url(../images/m-banner-bg.png);background-size: 100% 100%;}
.animate-box *{background-size: 100% 100%;}
.m-banner-c01{width: 75px;height: 155px;background-image: url(../images/m-banner-c01.png);top: 161px;left: 115px;animation: cloudMove 3s infinite;}
.m-banner-c02{width: 69px;height: 66px;background-image: url(../images/m-banner-c02.png);top: 35px;left: 37px;animation: cloudMove 5s infinite;}
.m-banner-c03{width: 80px;height: 97px;background-image: url(../images/m-banner-c03.png);top: -45px;left: 400px;animation: cloudMove 6s infinite;}
.m-banner-c04{width: 390px;height: 260px;background-image: url(../images/m-banner-c04.png);top: 25px;left: 120px;animation: cloudMove 7s infinite;}
.m-banner-c05{width: 60px;height: 75px;background-image: url(../images/m-banner-c05.png);top: -36px;left: 385px;animation: cloudMove 6s infinite;}

/*短信服务 -产品功能*/
/* .msg01{background: url(../images/sec02-bg.jpg);background-repeat: no-repeat;background-size: 100% 100%}
.msg02msg02 .title h3,.msg01 .title p{color:#fff}
.msg01 ul{margin:60px 0 0 0}
.msg01 li{display: inline-block;width: 212px;height: 350px;background-repeat: no-repeat;cursor: pointer}
.msg01 li *{-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;transition: all .3s;}
.msg01 li>div{background-color:rgba(0,0,0,0.8);padding: 100px 20px;height:100%;box-sizing: border-box;text-align: center;color:#fff;overflow: hidden;}
.msg01 li>div *{color:#fff}
.msg01 li:nth-child(1){background-image:url(../images/img01.jpg)}
.msg01 li:nth-child(2){background-image:url(../images/img02.jpg)}
.msg01 li:nth-child(3){background-image:url(../images/img03.jpg)}
.msg01 li:nth-child(4){background-image:url(../images/img04.jpg)}
.msg01 li:nth-child(5){background-image:url(../images/img05.jpg)}
.msg01 li h3{font-size: 18px;font-weight: normal;margin: 20px 0 160px 0;}
.msg01 li p{text-align: justify;white-space: normal} */

.msg01{background: url(../images/sec02-bg.jpg);background-repeat: no-repeat;background-size: 100% 100%}
.msg02msg02 .title h3,.msg01 .title p{color:#fff}
.msg01 ul{margin:60px 0 0 0}
.msg01 li{display: inline-block;width: 212px;height: 350px;background-repeat: no-repeat;cursor: pointer;position: relative;}
.msg01 li *{-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;transition: all .3s;}
.msg01 li>.pannel{position: relative;padding: 100px 20px;height:100%;box-sizing: border-box;text-align: center;color:#fff;overflow: hidden;}
.msg01 li>.pannel *{color:#fff}
.msg01 li .bg{display: block;width: 100%;height: 100%;position: absolute;background-repeat: no-repeat;background-position: center;background-size: cover;}
.msg01 li .bg::before{content: '';display: block;width: 100%;height: 100%;position: absolute;background-color: rgba(0,0,0,0.8);top: 0;left: 0;}
.msg01 li .bg>*{display: none;}
.msg01 li:nth-child(1) .bg{background-image:url(../images/img01.jpg)}
.msg01 li:nth-child(2) .bg{background-image:url(../images/img02.jpg)}
.msg01 li:nth-child(3) .bg{background-image:url(../images/img03.jpg)}
.msg01 li:nth-child(4) .bg{background-image:url(../images/img04.jpg)}
.msg01 li:nth-child(5) .bg{background-image:url(../images/img05.jpg)}
.msg01 li h3{font-size: 18px;font-weight: normal;margin: 20px 0 160px 0;}
.msg01 li p{text-align: justify;white-space: normal}
.msg01.msg01-4-wrap li{width: 267px;}
.msg01 .section-h1 p{margin-top: 20px;}
.viewmore{display:block;width: 135px;color: #fff;line-height: 35px;border: 1px solid #fff;border-radius: 18px;text-align: center;margin: 0 auto;}
.msg01 .viewmore{display: none;}

.msg01 li:hover>.pannel{background-color: #295cf6;padding-top: 20px}
.msg01 li:hover .icon-msg{position: relative;top:-100px}
.msg01 li:hover h3{margin-bottom: 30px;margin-top: -60px}


/*msg02*/
.switch li{display: inline-block;font-size: 18px;text-align: center}
.switch *{-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;transition: all .3s;}

.msg02{padding-bottom: 0}
.msg02 .switch{margin-top: 50px}
.msg02 .switch-btn{padding:0 60px;border-bottom: 2px solid #e5e5e5;font-size: 0}
.msg02 .switch li{width: 200px;margin:0 58px;padding:30px 0;position: relative;cursor: pointer}
.msg02 .switch li:after{content:'';display:block;height: 2px;width: 0;background-color: #2b68fe;position:relative;bottom: -32px;left:50%;-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-o-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;transition: all .3s;}
.msg02 .switch li.on:after{width: 95px}
.msg02 .switch li p{margin-top:15px}
.msg02 .switch-content{padding:70px 0}
.msg-content dl{font-size: 0}
.msg-content dd{margin-bottom: 80px;width: 220px;line-height: 60px;border:1px solid #ccc;background-color: #eff1f5;box-sizing: border-box}
.msg-content dd:last-child{margin-bottom: 0}
.msg-content dd.on{background-color: #2b68fe;border-color:#2b68fe;}
.msg-content dd a{display:block;text-align: center;color:#333;font-size: 14px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}
.msg-content dd.on a{color:#fff}
.mid-content{width: 640px;padding:0 65px;box-sizing: border-box}
.msg-pop{color:#fff;display: block;max-width: 502px;height: 246px;padding:40px;box-sizing: border-box;font-size: 16px;line-height: 24px;position: relative;margin:0 auto;}
.msg-pop:before{content:'';background-image: url(../images/msg01.png);display: block;width: 100%;height:100%;position: absolute;top:18px;left: -12px;background-size: 100% 100%}
.msg-pop:after{content:'';background-image: url(../images/msg.png);display: block;width: 100%;height: 100%;position: absolute;top:0;left: 0;background-size: 100% 100%}
.msg-pop p{position: relative;z-index: 8;color:#fff}
.msg-phone{max-width: 470px;height: 304px;background-image: url(../images/phone.png);margin:60px auto 0 auto;background-size: 100%;background-repeat: no-repeat;}
.flow .msg-phone{position: relative;left: -125px;}


/*接入引导*/
.flow{border:1px solid #ecf1fb;padding: 80px 100px;height: 1040px;position: relative;box-sizing: border-box;}
.flow h3{text-align: center;font-size: 24px;font-weight: normal}
.flow-list{margin: 70px 0;}
.flow-list li{width: 290px;display: inline-block;vertical-align: top}
.flow-list li i{display: inline-block;width: 39px;height: 45px;background-image: url(../images/flow-icon.png);line-height: 45px;text-align: center;font-style: normal;font-size: 20px;}
.flow-list li span{font-size: 20px;color:#333;margin:0 20px}
.flow-list li p{margin-left: 65px;font-size: 14px}
.flow-list li:nth-child(2){margin-left: 180px;width: 360px;}
.flow-list li:nth-child(3),.flow-list li:nth-child(4),.flow-list li:nth-child(5){position: absolute}
.flow-list li:nth-child(3){bottom: 460px;right: 70px;}
.flow-list li:nth-child(3) .red{margin-top:20px}
.flow-list li:nth-child(4){bottom: 257px;right: 148px;}
.flow-list li:nth-child(5){bottom: 220px;left: 100px;width: 360px;}

/*帮助中心*/
.help-l{width: 245px;line-height: 70px;border:1px solid #ecf1fb}
.help-l li{border-bottom: 1px solid #ecf1fb}
.help-l li.on{background-color: #295cf6}
.help-l li:last-child{border-bottom: 0}
.help-l li a{display:block;color:#333;text-align: center;font-size: 14px}
.help-l li.on a{color:#fff}
.help-r{width: 755px;background-color: #f7f8fa;padding:0 35px;color:#333;line-height: 24px}
.help-r h3{font-size: 24px;font-weight: normal;text-align: center;margin:40px 0}
.help-r table{border-collapse: collapse;;background-color: #fff;width: 100%}
.help-r th,.help-r td{border:1px solid #ecf1fb;padding:23px 15px;vertical-align: top;color:#04304b}
.help-r th{font-weight: normal;white-space: nowrap;}

/*价格明细*/
.tips{padding:20px;text-align: center;}
.tips-blue{background-color: #f0f8ff;}
.tips-blue *{color:#0a8dfc}

.p-title{text-align: left;font-size: 18px;line-height: 32px;}
.p-title p{display: inline-block}
.p-title .message-service-icon{display: inline-block;width:32px ;height: 32px;vertical-align: middle;margin-right: 5px}
.message-service-icon01{background-image: url(../images/kkcloud-message-service-icon01.png);}
.message-service-icon02{background-image: url(../images/kkcloud-message-service-icon02.png);}
.p-content{margin:20px 0 60px;line-height: 24px;}
.p-content table{width: 100%;text-align: center;border-collapse: collapse;}
.p-content table th{background-color: #d9dfea;font-weight: normal;width: 33.3333333%}
.p-content table td,.p-content table th{border:1px solid #ecf1fb;padding:25px 0}

.package{margin:50px 0;/*text-align: center*/}
.package li{text-align: center;width: 255px;display: inline-block;border:1px solid #ecf1fb;border-radius: 10px;position: relative;padding:0 0 30px 0;margin: 0 13px 20px 0}
.package li:nth-child(4n){margin-right: 0}
.package li .tag{display:block;width: 164px;height: 47px;line-height: 35px;color:#fff;font-size: 14px;background-image: url(../images/tag.png);background-size: 100% 100%;margin:17px 0 17px -7px;}
.package li .btn{display:block;width: 160px;line-height: 50px;color:#fff;background-color: #0a8dfc;border-radius: 25px;margin:0 auto}
.package li .price{font-size: 16px;}
.package li .price-single{background-image: url(../images/package-bg.png);background-repeat: no-repeat;background-position: center center;line-height: 120px;}
.package li .price-single .f28{color: #078bfc;}


.icon-msg{background: url(../images/icon-msg.png);display: inline-block;}
.icon-msg64-75{width: 64px;height: 75px;}
.icon-msg84-84{width: 84px;height: 84px;}
.icon-msg58-58{width: 58px;height: 58px;}
.icon-msg01{background-position: 0 0}
.icon-msg02{background-position: -64px 0 }
.icon-msg03{background-position: -128px 0 }
.icon-msg04{background-position: -192px 0 }
.icon-msg05{background-position: -256px 0 }
.icon-msg06{background-position: -320px 0 }
.icon-msg07{background-position: 0 -75px }
.icon-msg08{background-position: -84px -75px }
.icon-msg09{background-position: -168px -75px }
.icon-msg10{background-position: -252px -75px }
.icon-msg11{background-position: -336px -75px }
.icon-msg12{background-position: 0 -159px }
.icon-msg13{background-position: -58px -159px }
.icon-msg14{background-position: -116px -159px }
.icon-msg15{background-position: -174px -159px }


#banner-cs.banner-hwc{background: -webkit-linear-gradient(#283870, #3756c7);background: -o-linear-gradient(#283870, #3756c7);background: -moz-linear-gradient(#283870, #3756c7);background: linear-gradient(#283870, #3756c7);}
#banner-cs.banner-hwc .animate-box{width:572px;background-image: url(../images/hwc-animate-bg.png);background-size: 100%}
.hwc-scene .cdn-fun-r{box-sizing: border-box;width: 50%;}
.p-indent{margin:20px 0 !important;line-height: 25px;position: relative;padding-left: 100px}
.title-tag{width: 100px;display: inline-block;position: absolute;left: 0;top:0}

.animate01-1{background-image: url("../images/hwc-animate01-1.png");width: 66px;height: 71px;top: 387px;left: 165px;}
.animate01-2{width: 114px;height: 120px;background: -webkit-linear-gradient(rgba(151,237,255,0), #3bdafc);background: -o-linear-gradient(rgba(151,237,255,0), #3bdafc);background: -moz-linear-gradient(rgba(151,237,255,0), #3bdafc);background: linear-gradient(rgba(151,237,255,0), #3bdafc);top: 227px;left: 260px;}
.animate01-3{background-image: url("../images/hwc-animate01-3.png");width: 242px;height: 208px;top: 234px;left: 196px;}
.animate01-4{width: 114px;height: 120px;top: 227px;left: 260px;}
.animate01-4:before,.animate01-4:after{content:'';display: block;width: 100%;height: 100px;background-image: url("../images/hwc-animate01-4.png");background-repeat:no-repeat;background-size: 100%;position: absolute;bottom:-63px;-webkit-animation: fadeOutUp 3s infinite;-moz-animation: fadeOutUp 5s infinite;-o-animation: fadeOutUp 5s infinite;animation: fadeOutUp 5s infinite;}
.animate01-4:before{-webkit-animation-delay: 2s;-moz-animation-delay: 2s;-o-animation-delay: 2s;animation-delay: 2s}

.animate02-1{top: 494px;left: 349px;}
.animate02-1 path{stroke: none;fill: #3bdafc;-webkit-animation: changeColor 3s infinite;-moz-animation: changeColor 3s infinite;-o-animation: changeColor 3s infinite;animation: changeColor 3s infinite}

@keyframes changeColor {
    0%{
        fill:url(style.css)
    }
    50%{
        fill:url(style.css)
    }
    100%{
        fill:url(style.css)
    }
}

.animate03-1{top: 217px;left: 414px;}
.animate03-1 path{fill:url(style.css)}
.animate03-2{width: 68px;height: 74px;background-image: url(../images/hwc-animate05.png);background-size: 100%;background-color:rgba(0,255,255,0.3);top: 217px;left: 414px;-webkit-clip-path: url(style.css);clip-path: url(style.css); background-position: 0 0;-webkit-animation:bgMove 3s linear infinite;-moz-animation:bgMove 3s linear infinite;-o-animation:bgMove 3s linear infinite;animation:bgMove 3s linear infinite }

@keyframes bgMove {
    to{
        background-position: 0 100%;
    }
}


/*下拉样式 2019-11-18 新增*/
.select-skin{position: relative;width: 90px;border:1px solid #d1d9df;cursor: pointer;background-color: rgba(209,217,223,.1);}
.select-title input{width: 100%;height: 24px;font-size: 12px;text-align: center;background-color: transparent;color:#d1d9df;padding-right: 20px;box-sizing: border-box;border:0;cursor: pointer;}
.select-title input::placeholder{color:#d1d9df}
.select-title:after{content:'';display: block;width: 0;height: 0;border-width: 4px;border-style: solid;border-color: #d1d9df transparent transparent transparent;position: absolute;right: 8px;top: 10px;}
.pre_server_select-list dd{color:#d1d9df;font-size: 12px;line-height: 25px;padding:0 10px}
.pre_server_select-list dd:hover{background-color: rgba(75,137,243,.1);}
.pre_server_select-list dl{margin: 0px}
/*.select-list dd{color:#d1d9df;font-size: 12px;line-height: 25px;padding:0 10px}
.select-list dd:hover{background-color: rgba(75,137,243,.1);}*/
.select-skin:hover{background-color: rgba(75,137,243,.1);;border:1px solid #4b89f3}

#fix-appoint .select-skin{position: absolute;right: 55px;top: 18px;z-index: 9}

/*帮助中心  2019-11-20 新增*/
input{outline: none}
input::-ms-clear{display: none;}
input::-ms-reveal{display: none;}

.dropdown{width: 190px;line-height: 38px;background-color: transparent;position: relative;}
.dropdown .dropdown-header{position: relative;border:1px solid #cad3e0;cursor: pointer;}
.dropdown .dropdown-header input{width: 100%;height: 24px;font-size: 12px;text-align: left;background-color: transparent;color:#d1d9df;box-sizing: border-box;border:0;cursor: pointer;padding:0 10px}
.dropdown .dropdown-header:after{content:'';display: block;width: 0;height: 0;border-width: 4px;border-style: solid;border-color: #5a6c7b transparent transparent transparent;position: absolute;right: 8px;top: 10px;}
.dropdown .dropdown-header:after{border-width: 5px;top:15px}
.dropdown .dropdown-header input{font-size: 14px;color:#04304b}
.dropdown .dropdown-list{border:1px solid #cad3e0;position: absolute;top:39px;background-color: #fff;width: 100%;box-sizing: border-box;max-height: 200px;overflow: auto}
.dropdown .dropdown-list dd{font-size: 14px;line-height: 40px;color:#04304b;padding:0 10px;cursor: pointer}
.dropdown .dropdown-list dd a{display: block}
.dropdown .dropdown-list dd.selected{background-color: #4b89f3}
.dropdown .dropdown-list dd.selected a{color:#fff}
.dropdown .dropdown-list dd:hover{background-color: #e6e6e6;}
.dropdown .dropdown-list dd:hover a{color:#04304b}

.header-nobanner{background-color: #193456}
.md-show,.sm-show{display: none}
.md-hide,.sm-hide{display: block}


/* cdn - 计算器 */
.w1180{width: 1180px;margin:0 auto}
.counter{margin-top:30px;margin-bottom: 30px}
.counter-l,.counter-r{background-color: #fff;border-radius: 8px;}
.counter-l{width: 900px;padding:10px 35px 50px;box-sizing: border-box}
.counter-l .block-title{margin-left: -20px;margin-top: 15px;margin-bottom:20px;}
.counter-l .block-title:before{margin-right: 10px}
.counter-r{width: 260px}
.counter-l-item{margin-bottom: 30px}

.counter-item{padding: 10px 0}
.counter-item-select{margin:5px 0}
.select-skin01{width: 215px;border:1px solid #dfe7ed;background-color: #fff;border-radius: 6px;display: inline-block;box-sizing: border-box;}
.select-skin01:hover{background-color: #fff}
.select-skin01 .select-title input{height: 40px;font-size: 14px}
.select-skin01 .select-title input{text-align: left;color:#04304b;padding:0 10px}
.select-skin01 .select-title input::-webkit-input-placeholder,.select-skin01 .select-title input:-moz-placeholder,.select-skin01 .select-title input::-moz-placeholder,.select-skin01 .select-title input:-ms-input-placeholder{text-align: left;color:#04304b;padding:0 10px}
.select-skin01 .select-title:after{border-color:#04304b transparent transparent transparent;border-width: 5px;top:18px;right: 10px}
.select-skin01 .select-list{position: absolute;top: 38px;width:100%;background-color: #fff;border-bottom-left-radius: 6px;border-bottom-right-radius: 6px;border:1px solid #dfe7ed;display: none;z-index: 99;box-sizing: border-box;}
.select-skin01 .select-list dd{line-height: 40px;padding:0 10px}
.select-skin01 .select-list dd:hover{background-color: #4b89f3;color:#fff}

.counter-item .round-btn{display:inline-block;vertical-align:middle;margin-left:10px;width: 24px;height: 24px;background-image: url(../images/round-btn.png)}
.counter-item .round-btn.reduce{background-position: -24px 0}

.dragger{max-width: 500px;width:100%;height: 16px;background-color: #eaf0f5;border-radius: 8px;display: inline-block;vertical-align: middle;cursor: pointer;touch-action: none;}
.dragger-item{width:26px;height:16px;background-color: #669dfc;border-top-left-radius: 8px;border-bottom-left-radius: 8px;position: relative;transition: width .1s}
.dragger-btn{position: absolute;right: -28px;top:-4px;width: 56px;height: 24px;border-radius: 12px;background-image: url(../images/drag-btn.png);cursor: pointer;box-shadow:  0 0 20px rgba(75,137,243,.6)}
.dragger-btn.active{background-position: 0 24px}

.number{width:160px;display: inline-block;vertical-align: middle;margin-left: 10px;border:1px solid #dfe7ed;border-radius: 6px}
.number-input{float: left}
.number-input input{width: 60px;height: 40px;border: 0;border-right: 1px solid #dfe7ed;padding: 0 10px;border-top-left-radius: 6px;border-bottom-left-radius: 6px;}
.number-input input:focus{outline: none}
.number-select{width: 78px;vertical-align: top;border: 0}
.number-select:hover{border: 0}

.drag-tips{color:#8e99a2}

.counter-r>*{padding:0 15px}

.counter-r{border:1px solid #4b89f3;border-top:3px solid #4b89f3;}
.counter-r-header{line-height: 60px;border-bottom: 1px solid #ecf1f4;}
.counter-r-header h3{font-size: 14px}

.counter-r-body{padding-top:20px;padding-bottom: 20px}
.counter-r-body li{line-height: 30px;margin-bottom: 15px}
.counter-r-body li span{vertical-align: top}
.counter-r-detail-value{display: block;float: right;width: calc(100% - 72px);}
.counter-r-detail-value-inline{display: inline-block}

.counter-r-footer{background-color: #4b89f3;color:#fff;border-bottom-left-radius: 6px;border-bottom-right-radius: 6px;line-height: 52px;margin-top:30px}
.counter-r-footer-r{color:#fff;padding: 11px 0;line-height: 26px;}
.counter-r-footer-r .price{font-weight: bold;font-size: 20px;color:#fff}
.counter-r-footer-r .select-skin01{width: 54px;line-height: 22px;border-radius: 0;margin-left: 5px;display: block;background-color: #95b9e9;border: 1px solid #4782e6;}
.counter-r-footer-r .select-skin01 input{height: 26px;color: #fff;}
.counter-r-footer-r .select-skin01 .select-list{top:26px;border-radius: 0}
.counter-r-footer-r .select-skin01 .select-list dd{line-height: 24px;}
.counter-r-footer-r .select-skin01 .select-title:after{top:11px;border-color:#fff transparent transparent transparent}
.counter-r-footer-r .select-skin01 .select-list dd:hover{background-color: #4b89f3;}

/* 视频播放弹出层 2020-04-01 */
.video-overview{display: none;position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 9999999;background-color: rgba(0, 0, 0, 0.5);}
.video-overview.open{display: block;}
.video-overview .video-card{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);padding: 15px;width: 100%;max-width: 920px;box-sizing: border-box;background-color: #1f2026;background-image: -webkit-linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0),rgba(0,0,0,0.7));background-image: -moz-linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0),rgba(0,0,0,0.7));background-image: -o-linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0),rgba(0,0,0,0.7));background-image: linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0),rgba(0,0,0,0.7));}
.video-overview .video-card .videotop-tool{position: absolute;height: 20%;width: 100%;top: 0;left: 0;opacity: 0;background-image: -webkit-linear-gradient(rgba(0,0,0,1), rgba(255,255,255,0));background-image: -moz-linear-gradient(rgba(0,0,0,1), rgba(255,255,255,0));background-image: -o-linear-gradient(rgba(0,0,0,1), rgba(255,255,255,0));background-image: linear-gradient(rgba(0,0,0,1), rgba(255,255,255,0));-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.video-overview .video-card img{opacity: 0;position: absolute;top: 15px;right: 15px;cursor: pointer;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.video-overview .video-card:hover img{display: block;opacity: 1;}
.video-overview .video-card:hover .videotop-tool{display: block;opacity: 1;}
.video-card video{width: 100%;}

/* 企业宣传片 */
.fix-qq>ul .xuanchuan-wrap{border: none;background-color: transparent;background-image: url(../img/xuanchuan-bg.png);background-repeat: no-repeat;background-size: 100%;line-height: 50px;}
.fix-qq>ul .xuanchuan-wrap a{border: none;line-height: 1;height: 50px;display: inline-block;vertical-align: middle;letter-spacing: -1px;background-color: transparent;}
.fix-qq>ul .xuanchuan-wrap svg{height: 50px;line-height: 50px;}
.fix-qq>ul>li.on, .fix-qq>ul>.xuanchuan-wrap:hover {background-color: transparent;}
.fix-qq>ul>li.on, .fix-qq>ul>.xuanchuan-wrap:hover a {background-color: transparent;}


/*2020-05-20  补充 最新活动页 */
.activity-item{margin: 25px;position: relative;display: block; }
.activity-item .activity-info{width: 220px;position: relative;z-index: 1}
.activity-item .activity-icon{position: absolute;right: 0;top:50%;margin-top: -45px;width: 80px;height: 89px;}
.activity-item .tag{background-color: #4b89f3;color:#fff;padding: 5px 7px;font-size: 12px;margin-right: 5px;display: inline-block;vertical-align: top}
.activity-item .tag_red{background-color: #fa0247;color:#fff;padding: 5px 7px;font-size: 12px;margin-right: 5px;display: inline-block;vertical-align: top}
.activity-item .title{display: inline-block;font-size: 16px;line-height: 25px;}
.activity-item .subtitle{margin: 10px 0;line-height: 1.8em;width: 90%;height: 50px}
.activity-item .btn{width:76px;line-height:26px;text-align:center;padding: 0;border:1px solid #e3e9f9;font-size: 12px;display: inline-block;color:#596b7b;}
.activity-icon img{width: 100%;height: 100%;}

/*.switch-list li .activity-item{width: 100%;padding-bottom: 50%;display: block;position: relative;}*/
.switch-list li:hover{border:1px solid #abbdec;box-shadow: 0 0 10px #ecf1fe}
.switch-list li:hover .activity-item .btn{border:1px solid #abbdec}


/* 快快云优化 2020-05-11 */
.linear-bg{background: -webkit-linear-gradient(to bottom, #31418d, #4954bf);background: -o-linear-gradient(to bottom, #31418d, #4954bf);background: -moz-linear-gradient(to bottom, #31418d, #4954bf);background: linear-gradient(to bottom, #31418d, #4954bf);filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#31418d, endcolorstr=#4954bf, gradientType=0);}

.banner-left{padding-left: 45px;left: 0;max-width: 450px;width: 50%}
.banner-left *{color:#fff}
.banner-left h1{font-size: 30px;margin-bottom: 15px}
.banner-left p{line-height: 1.8em}

.banner-left,.banner-right{position: absolute;top: 55%;transform: translateY(-50%);}
.banner-right{right: 0}
.banner-animate{background-repeat: no-repeat;background-position: center center}

.banner02-1 {fill: #fff;}
.banner02-1 {opacity: 0.2;}
.banner02-2 {fill: #3bfdfc;}
.banner02-3 {fill:url(style.css)}
.banner02-4-1,.banner02-4-2 {fill: #1f2a8c;animation: fillColor 10s infinite}
.banner02-4-2{animation-duration: 10s}

.dandelion{animation: dandelion 16s infinite;opacity: 0}
.dandelion2{animation-delay: 3s}
.dandelion4{animation-delay: 6s}
.dandelion5{animation-delay: 5s}
.dandelion6{animation-delay: 11s}
.dandelion7{animation-delay: 9s}
.dandelion8{animation-delay: 7s}
.dandelion9{animation-delay: 13s}
@keyframes fillColor {
    0%{
        fill: #1f2a8c
    }
    50%{
        fill: #38eaff
    }
    100%{
        fill: #1f2a8c
    }
}

@keyframes dandelion {
    0%{
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}


.article{margin: 35px 0}
.article-l{width: 220px;background-color: #fafbff}
.article-l-title{padding: 0 10px}
.article-l-title h2{line-height: 60px;font-size: 18px;border-bottom: 1px dashed #e4e6f5;padding-left: 35px}
.article-l-title .iconfont{color:#4b8af4;font-size: 24px;margin-right: 10px;vertical-align: top}
.article-l-menu li{line-height: 45px;margin:10px 0;position: relative}
.article-l-menu i.iconfont{display:inline-block;width:24px;text-align:center;font-size: 20px;vertical-align: middle;margin-right: 10px}
.article-l-menu li a{display: block;padding-left: 45px}
.article-l-menu .arrow{position:absolute;right: 20px;line-height: 45px;opacity: 0;color:#fff;font-size: 12px}

.article-l-menu li.on{background-color: #4b8af4}
.article-l-menu li.on *{color:#fff}
.article-l-menu li.on .arrow{opacity: 1}

.article-localtion{border-bottom: 1px solid #edeffa;padding-left: 20px}
.article-localtion li{display: inline-block;line-height: 40px;}
.article-localtion li:after{content: '\\'}
.article-localtion li:last-child:after{display: none}
.article-r{width: 830px}

.article-content li{padding: 30px 20px;border:1px solid #fff;border-bottom: 1px solid #edeffa;box-sizing: border-box}
.article-content li:hover{border:1px solid #4b8af4;box-shadow: 2px 0 10px rgba(75,138,244,.33)}
.article-date{background-color: #4b8af4;width: 80px;height: 80px;color:#fff;text-align: center;box-sizing: border-box;padding: 14px 0;display: inline-block;font-family: Arial;}
.article-date span{display: block;font-size: 36px;font-weight: bold;color:#fff;}
.article-info{width:calc(100% - 100px);float: right}
.article-info h3{font-size: 18px;font-weight: normal;margin: 12px 0}
.article-info .desc{color:#707f8b}

.company-point{margin-top: 70px}
.company-point li{text-align: center;float: left;width: 25%}
.company-point li .num{font-size: 44px;position: relative}
.company-point li .num:after{content:'';display: block;width: 20px;height: 1px;background-color: #04304b;margin: 10px auto 15px;transition: all .3s}
.company-point li:hover .num:after{width: 50px}

.company-intro .intro-item{line-height: 1.8em}

.about01{background-size: cover;}
.group-slider-item{float: left}
.group-age{padding-bottom: 20px;border-bottom: 2px solid #505c7f;position: relative}
.group-age:before{content:'';display:block;width: 20px;height: 20px;position: absolute;left: 95px;bottom: -10px;background-color: #fff;opacity: .2;border-radius: 20px}
.group-age:after{content:'';display:block;width: 10px;height: 10px;border-radius: 10px;background-color: #fff;position: absolute;left: 100px;bottom: -5px}
.group-age-tag{background-color: #687393;width: 90px;text-align: center;line-height: 34px;display: block;position: relative;margin-left: 60px}
.group-age-tag b{color:#fff;font-size: 18px;margin-right: 3px}
.group-age-tag:after{content:'';display: block;width: 0;height: 0;border-width: 5px;border-style:solid;border-color: #687393 transparent transparent transparent;position: absolute;bottom: -10px;left: 50%;margin-left:-5px
}
.group-info{padding:25px 20px}
.group-info *{color:#fff}
.group-info p{line-height: 2.2em;position: relative;padding-left: 40px}
.group-info span{position: absolute;left: 0;top:0}

.swiper-slide-active .group-age:before,.swiper-slide-active .group-age:after{background-color: #4b8af4}
.swiper-slide-active .group-age:before{animation: zoom 2s infinite;opacity: 1}
.swiper-slide-active .group-age-tag,.group-age-tag:hover{background-color: #4b8af4}
.swiper-slide-active .group-age-tag:after,.group-age-tag:hover:after{border-top-color: #4b8af4}

.group-slider{overflow: hidden}
.group-prev,.group-next{background-color: rgba(255,255,255,.2);margin-top: -122px;z-index: 7;}
.group-prev{left:-50px}
.group-next{right:-50px}
.group-prev:hover,.group-next:hover{opacity:.8}

@keyframes zoom {
    0%{
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    100%{
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0;
    }
}

.culture-item{margin-top: 30px}
.culture-item li{float: left;width: 31%;height:155px;background-image: url(../images/about/culture-bg.png);padding: 30px 40px;box-sizing: border-box;vertical-align: top;border:1px solid #4b8af4;margin-right: 3.5%;}
.culture-item li:nth-child(3n){margin-right: 0}
.culture-item li span.icon{display:block;width: 94px;height: 62px;background-repeat: no-repeat;background-position: center center;background-color: #fff;margin: -65px 0 15px -20px;}
.culture-item li span.icon01{background-image: url(../images/about/icon01-7.png)}
.culture-item li span.icon02{background-image: url(../images/about/icon01-8.png)}
.culture-item li span.icon03{background-image: url(../images/about/icon01-9.png)}
.culture-item li h4{font-size: 16px;margin-bottom: 10px}
.culture-item li p{color:#48697d;margin-right: 20px}
.culture-item li:hover{box-shadow: 7px 0 27px rgba(75,138,244,.15)}

.contact>*{padding: 10px;box-shadow: 0 0 5px rgba(36,51,47,.1);float: left;position: relative;width: 50%;box-sizing: border-box}
.contact-photo{width: 100%;height: 358px;background-image: url(../images/about/contact.jpg);}
.contact-address{width:410px;background-color: rgba(36,51,94,.85);padding: 20px 55px;box-sizing: border-box;position: absolute;right: 10px;top:50%;margin-top: -85px}
.contact-address *{color:#fff;line-height: 1.8em}
.contact-address h2{font-size: 18px;}
.contact-address h2:after{content:'';display: block;width: 26px;height: 2px;background-color: #fff;margin: 15px 0}
.contact-address .f24{font-size: 24px}
.contact-map{width: 100%;height: 358px;overflow: hidden}
.amap-logo,.amap-copyright{display: none !important;}

.service-strength li{width: 45%;position: relative;}
.service-strength li .icon{width: 51px;height: 56px;display: block;background-size: 100% 100%;position: absolute;left: 0}
.service-strength li .icon01{background-image: url(../images/about/icon01-10.png)}
.service-strength li .icon02{background-image: url(../images/about/icon01-11.png)}
.service-strength li .icon03{background-image: url(../images/about/icon01-12.png)}
.service-strength li .icon04{background-image: url(../images/about/icon01-13.png)}
.service-strength li .strength-info{padding-left: 68px}
.service-strength li h2{margin: 15px 0;font-size: 20px}
.service-strength li .strength-desc{height: 88px;overflow: hidden;line-height: 1.6em;text-align: justify}

.strength-animate{margin: 20px 0;position: relative}
.animate-path{position: absolute;left: 50%;transform: translateX(-50%)}
.animate-path .p{fill: none;stroke: #3475e2;stroke-width: 1px;stroke-dasharray: 4 2;fill-rule: evenodd; animation: dash 30s linear infinite}
.strength-animate .animate-bg{width:100%;height: 360px;background-image: url(../images/about/strength-bg.png);background-position: center center;position: relative;z-index: 1}
.animate-chart{position: absolute;top: 0;left: 50%;transform: translateX(-50%);z-index: 2}

.animate-m .m01{position: absolute;left: 420px;bottom: 88px;}
.animate-m .m02{position: absolute;left: 661px;bottom: 130px;}

.strength-p-1 {fill: #7b81b7;}
.strength-p-1, .strength-p-10, .strength-p-11, .strength-p-12, .strength-p-17, .strength-p-18, .strength-p-2, .strength-p-3, .strength-p-4, .strength-p-5, .strength-p-6, .strength-p-7, .strength-p-8, .strength-p-9 {fill-rule: evenodd;}
.strength-p-13, .strength-p-2, .strength-p-8 {fill: #3bfdfc;}
.strength-p-2 {filter: url(style.css);}
.strength-p-3 {fill: #eeeefa;}
.strength-p-4 {fill: #c6caea;}
.strength-p-5 {fill: #d4d6ed;}
.strength-p-6 {fill: #9395be;}
.strength-p-7 {fill: #6578ff;}
.strength-p-9 {fill:none;stroke: #22447a;}
.strength-p-10 {fill:none;stroke: #96fb28;animation: dash 60s infinite;stroke-dasharray: 20 20;}
.strength-p-12 {fill: #8389c2;}
.strength-p-14 {fill: #e3635f;}
.strength-p-15 {fill: #aa4efd;}
.strength-p-16 {fill: #fff443;}
.strength-p-17 {fill: url(style.css);}
.strength-p-18 {fill: none;stroke: #3bfdfc;stroke-width: 1px;stroke-dasharray: 80 80;animation: dash 60s infinite;}

.screenGroup02{animation-duration: 3s}

.aniScroll{-webkit-animation: fadeScroll 10s ease-out infinite;animation:  fadeScroll 10s ease-out infinite;}
@-webkit-keyframes fadeScroll {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
    20% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    90% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    100% {
        opacity: 0;
    }
}

.strength-p-13,.strength-p-14,.strength-p-15,.strength-p-16{stroke-dasharray: 0;offset-distance: 0%;animation-name: follow; animation-iteration-count: infinite;animation-timing-function: linear}
.strength-p-13{
    offset-path: path('M570.265,126.532l-0.562.327v-6.076a2.909,2.909,0,0,1,.169-0.929,3.77,3.77,0,0,1,.289-0.644l2.82-4.977a5.656,5.656,0,0,0,.425-0.944,4.3,4.3,0,0,0,.245-1.357v-22.4a1.684,1.684,0,0,0-.669-1.518l-2.819-1.681a1.153,1.153,0,0,1-.458-1.039V66.228l0.563-.33,0,19.071a0.736,0.736,0,0,0,.294.665l2.82,1.679a2.1,2.1,0,0,1,.835,1.888l0,22.4a5.323,5.323,0,0,1-.306,1.691,6.885,6.885,0,0,1-.53,1.177l-2.82,4.979a2.432,2.432,0,0,0-.185.411,1.882,1.882,0,0,0-.108.6v6.077');
    animation-duration: 3s;
    animation-delay: 1s;
}
.strength-p-14{
    offset-path: path('M566.316,128.842l-0.561.327,0-39.97,0.564-.331,0,39.974');
    animation-duration: 8s;
    animation-delay: 3s;
}
.strength-p-15{
    offset-path: path('M562.371,123.712l-0.564.329,0-33.107a5.323,5.323,0,0,1,.306-1.69,6.853,6.853,0,0,1,.53-1.177l2.82-4.978a2.436,2.436,0,0,0,.185-0.412,1.852,1.852,0,0,0,.107-0.595V68.538l0.563-.331V81.752a3,3,0,0,1-.169.932,3.942,3.942,0,0,1-.289.643l-2.822,4.979a5.6,5.6,0,0,0-.423.94,4.248,4.248,0,0,0-.245,1.36l0,33.107');
    animation-duration: 7s;
    animation-delay: 2s;
}
.strength-p-16{
    offset-path: path('M550.525,138.076l-0.562.329V128.133a2.971,2.971,0,0,1,.169-0.93,3.777,3.777,0,0,1,.29-0.645l2.821-4.978a5.7,5.7,0,0,0,.424-0.944,4.314,4.314,0,0,0,.246-1.355V101.974a1.685,1.685,0,0,0-.667-1.518l-2.821-1.677a1.156,1.156,0,0,1-.457-1.04V77.773l0.563-.329,0,19.967a0.742,0.742,0,0,0,.294.665l2.82,1.679a2.093,2.093,0,0,1,.833,1.89V118.95a5.375,5.375,0,0,1-.308,1.695,6.9,6.9,0,0,1-.527,1.172l-2.821,4.977a2.492,2.492,0,0,0-.186.413,1.888,1.888,0,0,0-.108.6v10.272');
    animation-duration: 5s;
}

@keyframes follow {
    from {
        offset-distance: 0%;
    }
    to {
        offset-distance: 100%;
    }

}



.btn_a {
	    margin-top: 20px;
    display: inline-block;
    width: 108px;
    line-height: 34px;
    border: 1px solid #e6e6e6;
    text-align: center;
}

.btn_a:hover {
    background-color: #4b8af4;
    border: 1px solid #4b8af4;
    color: #fff;
}