.icon-collection {
    background-image: url("../images/icon-collection.png");
    background-repeat: no-repeat;
}

.icon-collections {
    background-image: url("../images/icon-collections.png");
    background-repeat: no-repeat;
}

.icon {
    display: inline-grid !important;
}

i.icon:after, i.icon:before {
    content: '';
    display: inline-grid;
}

.icon-apleft {
    width: 68px;
    height: 50px;
    background-position: -306px 0;
}

.icon-apright {
    width: 68px;
    height: 50px;
    background-position: -376px 0;
}

.list_box .img-block {
    width: 132px;
    height: 132px;
    padding-top: 6px;
    cursor: pointer;
    position: relative;
}

.list_box:hover .img-block {
    animation: fls 0.5s;
    -webkit-animation: fls 0.5s;
}

@keyframes fls {
    0% {
        bottom: 0px;
    }

    50% {
        bottom: 10px;
    }

    100% {
        bottom: 0px;
    }
}

@-moz-keyframes fls {
    0% {
        bottom: 0px;
    }

    50% {
        bottom: 10px;
    }

    100% {
        bottom: 0px;
    }
}

@-ms-keyframes fls {
    0% {
        bottom: 0px;
    }

    50% {
        bottom: 10px;
    }

    100% {
        bottom: 0px;
    }
}

@-webkit-keyframes fls {
    0% {
        bottom: 0px;
    }

    50% {
        bottom: 10px;
    }

    100% {
        bottom: 0px;
    }
}

.icon-solution {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100px;
    height: 100px;
    border-radius: 50%;
    box-shadow: 0 0 8px #808080;
}

.icon-solution-1 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    background-position: 0 0;
    transform: translate(-50%,-50%)
}

.icon-solution-2 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    background-position: -51px 0;
    transform: translate(-50%,-50%)
}

.icon-solution-3 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    background-position: -102px 0;
    transform: translate(-50%,-50%)
}

.icon-solution-4 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    background-position: -153px 0;
    transform: translate(-50%,-50%)
}

.icon-solution-5 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    background-position: -204px 0;
    transform: translate(-50%,-50%)
}

.icon-solution-6 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    background-position: -255px 0;
    transform: translate(-50%,-50%)
}

.icon-server {
    position: relative;
    padding: 38px 42px 24px 42px;
    width: 128px;
    height: 128px;
    box-sizing: content-box;
}

.icon-server-border {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 125px;
    height: 125px;
    border-radius: 50%;
    border: 1px solid #6f6f6f;
}

.icon-server-1 {
    width: 62px;
    height: 56px;
    background-position: 0 -56px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-01 {
    width: 62px;
    height: 56px;
    background-position: 0 -130px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-2 {
    width: 73px;
    height: 56px;
    background-position: -69px -56px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-02 {
    width: 73px;
    height: 56px;
    background-position: -69px -130px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-3 {
    width: 48px;
    height: 56px;
    background-position: -143px -56px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-03 {
    width: 48px;
    height: 56px;
    background-position: -143px -130px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-4 {
    width: 52px;
    height: 73px;
    background-position: -194px -56px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-04 {
    width: 52px;
    height: 73px;
    background-position: -194px -130px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-5 {
    width: 75px;
    height: 70px;
    background-position: -251px -56px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-05 {
    width: 75px;
    height: 70px;
    background-position: -251px -130px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-6 {
    width: 62px;
    height: 62px;
    background-position: -332px -56px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-06 {
    width: 62px;
    height: 62px;
    background-position: -332px -130px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-7 {
    width: 62px;
    height: 62px;
    background-position: -399px -56px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-07 {
    width: 62px;
    height: 62px;
    background-position: -399px -130px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-8 {
    width: 62px;
    height: 62px;
    background-position: 0 -207px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-08 {
    width: 62px;
    height: 62px;
    background-position: 0 -277px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-9 {
    width: 62px;
    height: 60px;
    background-position: -62px -207px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-server-09 {
    width: 62px;
    height: 60px;
    background-position: -62px -277px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-question {
    width: 34px;
    height: 34px;
    background-position: -379px -390px;
}

.icon-pos-app {
    display: block;
    width: 150px;
    height: 105px;
    position: relative;
    margin: 30px auto 0px;
}

    .icon-pos-app:hover {
        -webkit-transition: all 1s;
        -moz-transition: all 1s;
        -o-transition: all 1s;
        transition: all 1s;
        transform: rotate(360deg);
        -ms-transform: rotate(360deg); /* IE 9 */
        -webkit-transform: rotate(360deg); /* Safari and Chrome */
        -o-transform: rotate(360deg); /* Opera */
        -moz-transform: rotate(360deg); /* Firefox */
    }

.icon-app-border {
    width: 149px;
    height: 105px;
    background-position: -128px -207px;
}

.icon-app-borders {
    width: 149px;
    height: 105px;
    background-position: -280px -207px;
}

.icon-app-1 {
    width: 50px;
    height: 42px;
    background-position: 0 -348px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-01 {
    width: 50px;
    height: 42px;
    background-position: 0 -390px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-2 {
    width: 45px;
    height: 42px;
    background-position: -92px -348px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-02 {
    width: 45px;
    height: 42px;
    background-position: -92px -390px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-3 {
    width: 42px;
    height: 42px;
    background-position: -180px -348px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-03 {
    width: 42px;
    height: 42px;
    background-position: -180px -390px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-4 {
    width: 40px;
    height: 42px;
    background-position: -50px -348px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-04 {
    width: 40px;
    height: 42px;
    background-position: -50px -390px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-5 {
    width: 40px;
    height: 42px;
    background-position: -137px -348px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-05 {
    width: 40px;
    height: 42px;
    background-position: -137px -390px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-6 {
    width: 60px;
    height: 46px;
    background-position: -432px -207px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-app-06 {
    width: 60px;
    height: 46px;
    background-position: -432px -256px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.icon-more-dir {
    width: 33px;
    height: 35px;
    background-position: -341px -388px;
}

.icon-more {
    width: 26px;
    height: 26px;
    background-position: -279px -390px;
}

.icon-mores {
    width: 26px;
    height: 26px;
    background-position: -310px -390px;
}

.icon-problem {
    position: absolute;
    top: 0;
    left: -20px;
    width: 31px;
    height: 31px;
    background-position: -243px -390px;
}

.icon-toup {
    width: 50px;
    height: 50px;
    background-position: -417px -348px;
}

/*==============================================商务通的=========================================================*/
.icon-swt-piao {
    width: 435px;
    height: 78px;
    background-position: 0 0;
}

.icon-swt-kfu {
    width: 130px;
    height: 110px;
    background-position: -363px -80px;
}

.icon-close {
    width: 32px;
    height: 32px;
    background-position: -469px 0;
}

.icon-more-case {
    width: 32px;
    height: 32px;
    background-position: -158px -91px;
    margin-top: 10px;
}

.icon-trial {
    width: 32px;
    height: 32px;
    background-position: -197px -91px;
    margin-top: 10px;
}


.swiper-container1 {
    width: 1200px;
    box-sizing: border-box;
    overflow: hidden;
    margin-top: 20px;
}

    .swiper-container1 .swiper-wrapper > .swiper-slide {
        width: 220px !important;
    }

.swiper-slide {
    margin-right: 21px !important;
}

.ser_box {
    height: 328px;
    width: 227px;
    border: 1px solid #d5d5d5;
    text-align: center;
    margin-right: 16px;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}

    .ser_box:hover {
        border: none;
        animation: fls 1s;
        -webkit-animation: fls 1s;
        box-shadow: 0 5px 5px #eee;
    }

        .ser_box:hover span {
            color: #0b5da6;
        }

        .ser_box:hover a {
            color: #0b5da6;
            border: 1px solid #ff7426;
        }

    .ser_box img {
        padding: 38px 42px 24px 42px;
        width: 128px;
        height: 128px;
    }

    .ser_box span {
        font-size: 18px;
        color: #262525;
        font-weight: bold;
    }

    .ser_box p {
        font-size: 14px;
        color: #626262;
        line-height: 22px;
        padding: 10px 32px 0 32px;
        margin-right: 0;
        height: 94px;
        display: block;
    }

    .ser_box a {
        padding: 6px 24px;
        border: 1px solid #808080;
        border-radius: 20px;
        font-size: 14px;
        color: #646363;
    }