@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-inner{height: 500px;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; 1;}

@-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(#svgPath);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(#svgPath);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;}
.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%}

.block-item{height:400px;text-align: center;border-radius: 15px;padding:30px;box-sizing: border-box;}


@media screen and (min-width:640px){
    .block-item:hover #path19{-webkit-animation: moveSVG01 3s;-moz-animation: moveSVG01 3s;-o-animation: moveSVG01 3s;animation: moveSVG01 3s;}
    .block-item:hover #path20{-webkit-animation: moveSVG02 3s;-moz-animation: moveSVG02 3s;-o-animation: moveSVG02 3s;animation: moveSVG02 3s;}
    .block-item:hover #path6{-webkit-animation: moveSVG04 2s;-moz-animation: moveSVG04 2s;-o-animation: moveSVG04 2s;animation: moveSVG04 2s;}
    .block-item:hover #path8{-webkit-animation: moveSVG03 2s;-moz-animation: moveSVG03 2s;-o-animation: moveSVG03 2s;animation: moveSVG03 2s;}
    .block-item:hover #path10{-webkit-animation: moveSVG05 2s;-moz-animation: moveSVG05 2s;-o-animation: moveSVG05 2s;animation: moveSVG05 2s;}
    .block-item:hover #path11{-webkit-animation: moveSVG06 2s;-moz-animation: moveSVG06 2s;-o-animation: moveSVG06 2s;animation: moveSVG06 2s;}
    .block-item:hover #path21{-webkit-animation: moveSVG07 2s;-moz-animation: moveSVG07 2s;-o-animation: moveSVG07 2s;animation: moveSVG07 2s;}
    .block-item:hover #path22{-webkit-animation: moveSVG08 2s;-moz-animation: moveSVG08 2s;-o-animation: moveSVG08 2s;animation: moveSVG08 2s;}
    .block-item:hover #path28{-webkit-animation: cloudMove 2s ;-moz-animation: cloudMove 2s;-o-animation: cloudMove 2s;animation: cloudMove 2s;}
    .block-item:hover #path30{-webkit-animation: cloudMove 2s ;-moz-animation: cloudMove 2s;-o-animation: cloudMove 2s;animation: cloudMove 2s;}
    .block-item:hover #path31{-webkit-animation: cloudMove 2s ;-moz-animation: cloudMove 2s;-o-animation: cloudMove 2s;animation: cloudMove 2s;}
    .block-item:hover #path32{-webkit-animation: cloudMove 2s ;-moz-animation: cloudMove 2s;-o-animation: cloudMove 2s;animation: cloudMove 2s;}
    .block-item:hover #path33{-webkit-animation: moveSVG09 2s;-moz-animation: moveSVG09 2s;-o-animation: moveSVG09 2s;animation: moveSVG09 2s;}
    .block-item:hover #path34{-webkit-animation: moveSVG10 2s;-moz-animation: moveSVG10 2s;-o-animation: moveSVG10 2s;animation: moveSVG10 2s;}
}


@-webkit-keyframes moveSVG01 {
    0%{
        -webkit-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
    50%{
        -webkit-transform:translate(21px,16px) skew(-34deg) rotate(-6deg) scale(.5)
    }
    100%{
        -webkit-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
}
@-moz-keyframes moveSVG01 {
    0%{
        -moz-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
    50%{
        -moz-transform:translate(21px,16px) skew(-34deg) rotate(-6deg) scale(.5)
    }
    100%{
        -moz-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
}


@-ms-keyframes moveSVG01 {
    0%{
        -ms-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
    50%{
        -ms-transform:translate(21px,16px) skew(-34deg) rotate(-6deg) scale(.5)
    }
    100%{
        -ms-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
}

@-o-keyframes moveSVG01 {
    0%{
        -o-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
    50%{
        -o-transform:translate(21px,16px) skew(-34deg) rotate(-6deg) scale(.5)
    }
    100%{
        -o-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
}


@keyframes moveSVG01 {
    0%{
        transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
    50%{
        transform:translate(21px,16px) skew(-34deg) rotate(-6deg) scale(.5)
    }
    100%{
        transform:translate(0,0) skew(0deg) rotate(0deg) scale(1)
    }
}

@-webkit-keyframes moveSVG02 {
    0%{
        -webkit-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
    50%{
        -webkit-transform:translate(-45px,-22px) skew(36deg) rotate(10deg) scale(1.65)
    }
    100%{
        -webkit-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
}

@-moz-keyframes moveSVG02 {
    0%{
        -moz-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
    50%{
        -moz-transform:translate(-45px,-22px) skew(36deg) rotate(10deg) scale(1.65)
    }
    100%{
        -moz-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
}

@-ms-keyframes moveSVG02 {
    0%{
        -ms-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
    50%{
        -ms-transform:translate(-45px,-22px) skew(36deg) rotate(10deg) scale(1.65)
    }
    100%{
        -ms-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
}

@-o-keyframes moveSVG02 {
    0%{
        -o-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
    50%{
        -o-transform:translate(-45px,-22px) skew(36deg) rotate(10deg) scale(1.65)
    }
    100%{
        -o-transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
}

@keyframes moveSVG02 {
    0%{
        transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
    50%{
        transform:translate(-45px,-22px) skew(36deg) rotate(10deg) scale(1.65)
    }
    100%{
        transform:translate(0,0) skew(0deg) rotate(0deg) scale(1);
    }
}

@-webkit-keyframes moveSVG03 {
    0%{
        -webkit-transform:scale(1) translate(0,0);
    }
    50%{
        -webkit-transform:scale(1.5) translate(33px,-51px)
    }
    100%{
        -webkit-transform:scale(1) translate(0,0);
    }
}

@-moz-keyframes moveSVG03 {
    0%{
        -moz-transform:scale(1) translate(0,0);
    }
    50%{
        -moz-transform:scale(1.5) translate(33px,-51px)
    }
    100%{
        -moz-transform:scale(1) translate(0,0);
    }
}

@-ms-keyframes moveSVG03 {
    0%{
        -ms-transform:scale(1) translate(0,0);
    }
    50%{
        -ms-transform:scale(1.5) translate(33px,-51px)
    }
    100%{
        -ms-transform:scale(1) translate(0,0);
    }
}

@-o-keyframes moveSVG03 {
    0%{
        -o-transform:scale(1) translate(0,0);
    }
    50%{
        -o-transform:scale(1.5) translate(33px,-51px)
    }
    100%{
        -o-transform:scale(1) translate(0,0);
    }
}

@keyframes moveSVG03 {
    0%{
        transform:scale(1) translate(0,0);
    }
    50%{
        transform:scale(1.5) translate(33px,-51px)
    }
    100%{
        transform:scale(1) translate(0,0);
    }
}

@-webkit-keyframes moveSVG04 {
    0%{
        -webkit-transform:scale(1) translate(0,0);
    }
    50%{
        -webkit-transform:scale(.6) translate(-49px,88px);
    }
    100%{
        -webkit-transform:scale(1) translate(0,0);
    }
}

@-moz-keyframes moveSVG04 {
    0%{
        -moz-transform:scale(1) translate(0,0);
    }
    50%{
        -moz-transform:scale(.6) translate(-49px,88px);
    }
    100%{
        -moz-transform:scale(1) translate(0,0);
    }
}

@-ms-keyframes moveSVG04 {
    0%{
        -ms-transform:scale(1) translate(0,0);
    }
    50%{
        -ms-transform:scale(.6) translate(-49px,88px);
    }
    100%{
        -ms-transform:scale(1) translate(0,0);
    }
}

@-o-keyframes moveSVG04 {
    0%{
        -o-transform:scale(1) translate(0,0);
    }
    50%{
        -o-transform:scale(.6) translate(-49px,88px);
    }
    100%{
        -o-transform:scale(1) translate(0,0);
    }
}

@keyframes moveSVG04 {
    0%{
        transform:scale(1) translate(0,0);
    }
    50%{
        transform:scale(.6) translate(-49px,88px);
    }
    100%{
        transform:scale(1) translate(0,0);
    }
}

@-webkit-keyframes moveSVG05 {
    0%{
        -webkit-transform:scale(1) translate(0,0);
    }
    50%{
        -webkit-transform:translate(0,-48px)
    }
    100%{
        -webkit-transform:scale(1) translate(0,0);
    }
}

@-moz-keyframes moveSVG05 {
    0%{
        -moz-transform:scale(1) translate(0,0);
    }
    50%{
        -moz-transform:translate(0,-48px)
    }
    100%{
        -moz-transform:scale(1) translate(0,0);
    }
}

@-ms-keyframes moveSVG05 {
    0%{
        -ms-transform:scale(1) translate(0,0);
    }
    50%{
        -ms-transform:translate(0,-48px)
    }
    100%{
        -ms-transform:scale(1) translate(0,0);
    }
}

@-o-keyframes moveSVG05 {
    0%{
        -o-transform:scale(1) translate(0,0);
    }
    50%{
        -o-transform:translate(0,-48px)
    }
    100%{
        -o-transform:scale(1) translate(0,0);
    }
}

@keyframes moveSVG05 {
    0%{
        transform:scale(1) translate(0,0);
    }
    50%{
        transform:translate(0,-48px)
    }
    100%{
        transform:scale(1) translate(0,0);
    }
}

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

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

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

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

@keyframes moveSVG06 {
    0%{
        transform:translate(0,0);
    }
    50%{
        transform:translate(0,48px)
    }
    100%{
        transform:translate(0,0);
    }
}

@-webkit-keyframes moveSVG07 {
    0%{
        -webkit-transform:translate(0,0);
    }
    50%{
        -webkit-transform:translate(20px,61px) scale(0.6);
    }
    100%{
        -webkit-transform:translate(0,0);
    }
}

@-moz-keyframes moveSVG07 {
    0%{
        -moz-transform:translate(0,0);
    }
    50%{
        -moz-transform:translate(20px,61px) scale(0.6);
    }
    100%{
        -moz-transform:translate(0,0);
    }
}

@-ms-keyframes moveSVG07 {
    0%{
        -ms-transform:translate(0,0);
    }
    50%{
        -ms-transform:translate(20px,61px) scale(0.6);
    }
    100%{
        -ms-transform:translate(0,0);
    }
}

@-o-keyframes moveSVG07 {
    0%{
        -o-transform:translate(0,0);
    }
    50%{
        -o-transform:translate(20px,61px) scale(0.6);
    }
    100%{
        -o-transform:translate(0,0);
    }
}

@keyframes moveSVG07 {
    0%{
        transform:translate(0,0);
    }
    50%{
        transform:translate(20px,61px) scale(0.6);
    }
    100%{
        transform:translate(0,0);
    }
}
@-webkit-keyframes moveSVG08 {
    0%{
        -webkit-transform:translate(0,0);
    }
    50%{
        -webkit-transform:translate(-13px,-73px) scale(1.3);
    }
    100%{
        -webkit-transform:translate(0,0);
    }
}
@-moz-keyframes moveSVG08 {
    0%{
        -moz-transform:translate(0,0);
    }
    50%{
        -moz-transform:translate(-13px,-73px) scale(1.3);
    }
    100%{
        -moz-transform:translate(0,0);
    }
}
@-ms-keyframes moveSVG08 {
    0%{
        -ms-transform:translate(0,0);
    }
    50%{
        -ms-transform:translate(-13px,-73px) scale(1.3);
    }
    100%{
        -ms-transform:translate(0,0);
    }
}
@-o-keyframes moveSVG08 {
    0%{
        -o-transform:translate(0,0);
    }
    50%{
        -o-transform:translate(-13px,-73px) scale(1.3);
    }
    100%{
        -o-transform:translate(0,0);
    }
}
@keyframes moveSVG08 {
    0%{
        transform:translate(0,0);
    }
    50%{
        transform:translate(-13px,-73px) scale(1.3);
    }
    100%{
        transform:translate(0,0);
    }
}

@keyframes moveSVG09 {
    0%{
        transform:translate(0,0);
    }
    50%{
        transform:translate(23px,-1px) scale(0.5);
    }
    100%{
        transform:translate(0,0);
    }
}

@keyframes moveSVG10 {
    0%{
        transform:translate(0,0);
    }
    50%{
        transform:translate(-46px,3px) scale(2);
    }
    100%{
        transform:translate(0,0);
    }
}

.block-item:last-child{margin-right: 0}
.block-item h1{font-size: 24px;color:#04304b;margin-top:10px;line-height: 60px;}
.block-item p{height: 36px}
.block-item p,.block-item b{font-size: 14px;}
.block-item b{line-height: 55px;margin-bottom: 20px;}
.block-item a{width:100px;height:40px;line-height: 40px;border:1px solid #e6e6e6;color:#222642;display: block;margin:0 auto;font-size: 14px;}
.block-item a:hover{background-color: #4b89f3;color:#fff;border:1px solid #4b89f3}


/*svg*/
.cls-1, .cls-4, .cls-5,.cls-7, .cls-8, .cls-9 ,.cls-12, .cls-13, .cls-15 ,.cls-18, .cls-19, .cls-20,.cls-23, .cls-24, .cls-26, .cls-27, .cls-28,.cls-30, .cls-31, .cls-32, .cls-33{fill-rule: evenodd;}
.cls-2,.cls-3 , .cls-4, .cls-5, .cls-7 ,.cls-9 ,.cls-10,.cls-11,.cls-13, .cls-15,.cls-16,.cls-17,.cls-18 ,.cls-19,.cls-21, .cls-22 ,.cls-24,.cls-25,.cls-26,.cls-27,.cls-28 ,.cls-29,.cls-30,.cls-31,.cls-34, .cls-35   {fill: url(#linearGradient);}
.cls-1 {fill: none;stroke: #040bb3;stroke-width: .5px;}
.cls-8 {fill: none;stroke: #040bb3;stroke-linejoin: round;stroke-width: 1px;}
.cls-12{fill: #3339c1;}
.cls-12, .cls-14 ,.cls-20,.cls-32, .cls-33 ,.cls-23  {stroke: #3339c1;stroke-width: 1px;}
.cls-14 , .cls-20,.cls-32, .cls-33 ,.cls-23  {fill: none;}




/*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;}


/*section03*/
.section03 .wrapper{padding:0 !important;}
.chinaBox{position: relative}
.chinaBox svg{width: 100%}
.server-position{position: absolute;top:0;left: 0;width: 100%;height:100%;}
.server-item{position: absolute;}
.server-item>.server{background-image: url(../../img/server.png);display: block;position: relative;z-index: 20;}
.server-item>.server01{background-position: 0 0;width:20px;height:36px;position:  relative;z-index: 10;}
.server-item>.server02{background-position: 20px 0;width:19px;height:38px;}
.server-item:nth-child(1){top: 36%;left: 66%;z-index: 0;}
.server-item:nth-child(2){top: 72%;left: 70%;}
.server-item:nth-child(3){top: 50%;left: 56%;}
.server-item:nth-child(4){top: 53%;left: 53%;}
.server-item:nth-child(5){top: 74%;left: 69%;z-index: 11;}
.server-item:nth-child(6){top: 37%;left: 63%;}
.server-item:nth-child(7){top: 40%;left: 66%;z-index: 1;}
.server-item:nth-child(8){top: 66%;left: 44%;}
.server-item:nth-child(9){top: 70%;left: 45%;}
.server-item:nth-child(10){top: 54%;left: 57%;z-index: 11;}


.server-item .wave{-webkit-transform-style: preserve-3d;transform-style: preserve-3d;-webkit-transform: rotateZ(90deg) rotateY(45deg) rotateZ(-45deg) translate(-50%,-50%);-moz-transform: rotateZ(90deg) rotateY(45deg) rotateZ(-45deg) translate(-50%,-50%);-ms-transform: rotateZ(90deg) rotateY(45deg) rotateZ(-45deg) translate(-50%,-50%);-o-transform: rotateZ(90deg) rotateY(45deg) rotateZ(-45deg) translate(-50%,-50%);transform: rotateZ(90deg) rotateY(45deg) rotateZ(-45deg) translate(-50%,-50%);position: absolute;top: 0;left: 50%;z-index: 1;}
.wave-item{position: absolute;left: 50%;top: 50%;-webkit-transform-origin:center center;-moz-transform-origin: center center;-ms-transform-origin: center center;-o-transform-origin: center center;transform-origin: center center;border-radius: 3px;border:1px solid #3bfdfc;-webkit-animation: wave 3s infinite linear;-moz-animation: wave 3s infinite linear;-o-animation: wave 3s infinite linear;animation: wave 3s infinite linear;width:60px;height:60px;}
.wave-item:nth-child(2){-webkit-animation-delay: 1s;-moz-animation-delay: 1s;-o-animation-delay: 1s;animation-delay: 1s}
.wave-item:nth-child(3){-webkit-animation-delay: 2s;-moz-animation-delay: 2s;-o-animation-delay: 2s;animation-delay: 2s}
@-webkit-keyframes  wave{
    0% {
        -webkit-transform: scale(0);
        opacity: 1;
    }
    90%{
        -webkit-transform: scale(1);
    }
    100%{
        -webkit-transform: scale(0);
        opacity: 0
    }
}

@-moz-keyframes  wave{
    0% {
        -moz-transform: scale(0);
        opacity: 1;
    }
    90%{
        -moz-transform: scale(1);
    }
    100%{
        -moz-transform: scale(0);
        opacity: 0
    }
}

@-ms-keyframes  wave{
    0% {
        -ms-transform: scale(0);
        opacity: 1;
    }
    90%{
        -ms-transform: scale(1);
    }
    100%{
        -ms-transform: scale(0);
        opacity: 0
    }
}

@-o-keyframes  wave{
    0% {
        -o-transform: scale(0);
        opacity: 1;
    }
    90%{
        -o-transform: scale(1);
    }
    100%{
        -o-transform: scale(0);
        opacity: 0
    }
}
@keyframes  wave{
    0% {
        transform: scale(0);
        opacity: 1;
    }
    90%{
        transform: scale(1);
    }
    100%{
        transform: scale(0);
        opacity: 0
    }
}

/*section04*/
.section04{height: 660px;background-color: #04304b;position: relative}
.section04-bg{width:50%;height: 100%;background-image: url(../../img/section04.png);background-repeat:no-repeat;background-position: right -285px;position: absolute;left: 0;top:0;min-width: 540px;}
.section04 .section-body{height: 100%}
.section04 .body-r{width: 50%;height:100%;padding-left: 140px;padding-top:140px;box-sizing: border-box;}
.section04 .body-l{width: 50%;height:100%;}
.section04 .section-header{text-align: left;}
.section04 .section-header h1{color:#fff;}
.section04 .section-header span{color:#fff;}

.section04 .section-data li{margin-bottom: 50px;}
.section04 .section-data .rotate-item{width:50px;height:50px;position: relative;display: inline-block}
.section04 .section-data .rotate-item img{position: absolute;top:0;left: 0}
.section04 .section-data .rotate-item img.cw{-webkit-animation:rotateCW 5s linear infinite;-moz-animation:rotateCW 5s linear infinite;-o-animation:rotateCW 5s linear infinite;animation: rotateCW 5s linear infinite}
.section04 .section-data .rotate-item img.ac{-webkit-animation:rotateAC 5s infinite;-moz-animation:rotateAC 5s infinite;-o-animation:rotateAC 5s infinite;animation: rotateAC 5s infinite}
.section04 .section-data .data-title{display: inline-block;vertical-align: top;margin-left: 25px;text-align: left}
.section04 .section-data .data-title p{color:#3bfdfc;line-height: 30px;font-size: 24px;}
.section04 .section-data .data-title p span{font-size: 24px;}
.section04 .section-data .data-title span{font-size: 14px;color:#3bfdfc}

.chart-animate{height: 100%;position: relative}
.chart-animate li{background-image: url(../../img/section04-1.png);display: block;position: absolute}
.chart-animate li:nth-child(1){background-position: 0 0;width: 67px;height: 129px;top: 179px;left: 173px;}
.chart-animate li:nth-child(2){background-position: 69px 0;width: 67px;height: 177px;top: 168px;left: 234px;}
.chart-animate li:nth-child(3){background-position: 138px 0;width: 70px;height: 150px;top: 234px;left: 299px;}
.chart-animate li:nth-child(4){background-position: 69px 0;width: 68px;height: 177px;top: 242px;left: 364px;}
.chart-animate li:nth-child(5){background-position: 139px 0;width: 71px;height: 148px;top: 308px;left: 425px;}

.section04 .animate-word{position: absolute;bottom: 222px;left: 123px;-webkit-transform: rotate(30deg);-moz-transform: rotate(30deg);-ms-transform: rotate(30deg);-o-transform: rotate(30deg);transform: rotate(30deg);text-shadow: 0 8px 0 rgba(4,48,75,0.1);}
.section04 .animate-word h1{font-size: 24px;color: #31667b;font-weight: bold;white-space: nowrap}
.section04 .animate-word p{font-size: 28px;color: #31667b;font-weight: bold;letter-spacing: 5px;position: relative;left: -16px;top: -5px;}
.section04 .animate-word .skew-item{-webkit-transform: skew(32deg);-moz-transform: skew(32deg);-ms-transform: skew(32deg);-o-transform: skew(32deg);transform: skew(32deg);}

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

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

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

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

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


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


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


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


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

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


/*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}

/* 首页 了解快快 */
.section-intro{background-image: url(../img/intro-bg.png);background-repeat: no-repeat;background-size: cover;background-position: center;}
.section-intro .row-vertical-center{display: table;margin: -20px;}
.section-intro .row-vertical-center>div{width: 50%;display: table-cell;box-sizing: border-box;vertical-align: middle;float: none;padding: 20px;}
.video-pc-bg{width: 100%;}
.block-intro:nth-child(1) .video-wrap{position: relative;}
.block-intro:nth-child(1) .video-wrap .video-poster{width: 100%;}
.block-intro:nth-child(1) .video-wrap .playVideo{position: absolute;width: 78.8%;height: 81.62%;top: 6.23%;left: 10.7%;z-index: 11;}
.block-intro:nth-child(1) .video-wrap .intro-shadow{position: absolute;width: 100%;top: 75%;left: 5%;z-index: 9;}
.video-pc-bg{position: relative;z-index: 10;}
.block-intro:nth-child(1) .video-wrap .playVideo .player-btn{width: 76px;height: 77px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);margin-top: 4px;}
.section-intro .intro-content h3, .section-intro .intro-content p{color: #fff;text-indent: 2em;line-height: 25px;text-align: justify;}
.block-intro h3{font-size: 20px;}


/*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{font-size: 0;border-radius: 35px;overflow: hidden;border:1px solid #dedede;margin:60px 25px 0 0;background: -webkit-linear-gradient(#fff, #f3f3f3);background: -o-linear-gradient(#fff, #f3f3f3);background: -moz-linear-gradient(#fff, #f3f3f3);background: linear-gradient(#fff, #f3f3f3);}
.page li{height:35px;display: inline-block;line-height: 35px;text-align: center;border-right:1px solid #dededede;box-sizing: border-box;}
.page li *{color:#999;display: block;font-size:14px;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}
.animate-skip:after{content:'';display:table;clear:both;}
.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}

.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: 0;width:100%;height:1px;background-color: #04304b}

.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{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: block;border-radius: 50px;color:#222642;text-align: center;margin-right: 15px}
.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{background-image: url(../../img/bannercs-bg.png);background-position: center;background-repeat: no-repeat;background-size: 88%;position: relative;width: 500px;height:680px;}
#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;font-weight: normal;line-height: 50px;margin-top: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 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%;}

.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%;width: 41%;}
#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}

.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}

.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}


/*阿里云 / 腾讯云*/
#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: 60px !important;}
.aliCloud02 li{width: 306px;border-radius: 15px;margin: 0 80px 0 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}



.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("#arrow");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 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}
/*.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{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 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-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;}

.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 li:hover>div{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;}


.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(#lg01)
    }
    50%{
        fill:url(#lg02)
    }
    100%{
        fill:url(#lg01)
    }
}

.animate03-1{top: 217px;left: 414px;}
.animate03-1 path{fill:url(#avatar)}
.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(#mask);clip-path: url(#mask); 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}
.dropdown .dropdown-list dd{font-size: 14px;line-height: 40px;color:#04304b;padding:0 10px;cursor: pointer}
.dropdown .dropdown-list dd:hover{background-color: #4b89f3;color:#fff}

.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 .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}