@charset "utf-8";
.service_01{ position: relative; margin-top: 50px; margin-bottom: 50px;box-shadow: 0 6px 13px 0 rgba(69,69,69,0.13);}
.service_01 .number{ position: absolute; right:5%; top: -5%; z-index: 1; color: #f7f9f9; font-size: 140px;font-family: 'Swiss721BTBlackCondensed'; }
.service_01  .service_01_left{ position: relative; z-index: 2; float: left; width: 40%; background-repeat: no-repeat; background-size: cover; background-position:  center center; height: 550px;}




.service_01  .service_01_right{ position: relative; z-index: 2; float: right; width:54%; padding-left: 3%; padding-right: 3%; padding-top: 50px;}
.service_01  .service_01_right .titile{ font-size: 30px; color: #3b3b41; font-weight: bold; margin-bottom: 40px;}
.service_01  .service_01_right .titile span{ position: relative}
.service_01  .service_01_right .titile span::after {
    left: 0%;
    position: absolute;
    bottom: -25px;
    content: " ";
    width: 42px;
    margin-left: 0;
    border-bottom: 3px solid #268184;
    -webkit-transition: .3s;
    transition: .3s;
}
.service_01  .service_01_right  .service_wenzi{}
.mySwiper {
    width: 100%;
    height:340px;
}

.mySwiper .swiper-slide {
    height: 340px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 30px; overflow-y: scroll
}
.mySwiper .swiper-scrollbar {
    background: rgba(0,107,110,.1);
}
.mySwiper .swiper-scrollbar-drag {
    background: rgba(0,107,110,.9);
}


.service_02{ position: relative; margin-top: 50px; margin-bottom: 50px;box-shadow: 0 6px 13px 0 rgba(69,69,69,0.13);}
.service_02 .number{ position: absolute; left:45%; top: -5%; z-index: 1; color: #f7f9f9; font-size: 140px;font-family: 'Swiss721BTBlackCondensed'; }
.service_02  .service_01_left{ position: relative; z-index: 2; float: right; width: 40%; background-repeat: no-repeat; background-size: cover; background-position:  center center; height: 550px;}
.service_02  .service_01_right{ position: relative; z-index: 2; float: left; width:54%; padding-left: 3%; padding-right: 3%; padding-top: 50px;}
.service_02  .service_01_right .titile{ font-size: 30px; color: #3b3b41; font-weight: bold; margin-bottom: 40px;}
.service_02  .service_01_right .titile span{ position: relative}
.service_02  .service_01_right .titile span::after {
    left: 0%;
    position: absolute;
    bottom: -25px;
    content: " ";
    width: 42px;
    margin-left: 0;
    border-bottom: 3px solid #268184;
    -webkit-transition: .3s;
    transition: .3s;
}
.service_02  .service_01_right  .service_wenzi{}


.success_case{ background-color: #f2f7f8; padding: 80px 0;}
.success_case .tit{ text-align: center; color: #3b3b41; font-size: 30px; font-weight: bold; margin-bottom: 60px;}
.success_case .tit span{ position: relative;}
.success_case .tit span::after {

    left:50%;
    position: absolute;
    bottom: -25px;
    content: " ";
    width: 42px;
    margin-left:-21px;
    border-bottom: 3px solid #268184;
    -webkit-transition: .3s;
    transition: .3s;

}
.success_case_lists{}
.success_case_lists .item{}
.success_case_lists .item .left_pic{ float: left; width: 50%; height: 400px; background-repeat: no-repeat; background-size: cover; background-position: center center;border-radius:30px;}
.success_case_lists .item .right_font{ float: right; width: 45%; text-align: left; padding-top: 30px;}
.success_case_lists .item .right_font .titile{ margin-bottom: 30px; color: #00696c; font-weight: bold; font-size: 32px;}
.success_case_lists .item .right_font .descipes{ font-size: 16px;line-height:30px;
    height:120px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp:4;
    color: #4c4c51;}
.success_case_lists .slick-dots{width: auto; left: 55%; bottom: 60px;}
.success_case_lists .slick-dots li button{ width: 12px; height: 12px; background-color:#c2dbdc;}
.success_case_lists .slick-dots li.slick-active button {
    background: #006b6e;
}

@media screen and (max-width: 1400px){

    .service_01  .service_01_left{ height: 450px;}
    .mySwiper {
        width: 100%;
        height: 240px;
    }

    .service_02 .service_01_left {
        height: 450px;
    }
    .success_case_lists .item .left_pic{ height: 340px}
    .service_01,.service_02{box-shadow:none;}

}

@media (max-width:768px) {
    .service_01 .service_01_left {
        float: none;
        width: initial;
        height: 300px;
    }
    .service_01 .service_01_right {
        position: relative;
        z-index: 2;
        float: none;
        width: initial;
        padding-left: 3%;
        padding-right: 3%;
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .service_02 .service_01_left {
        position: relative;
        z-index: 2;
        float: none;
        width: initial;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        height: 300px;
    }
    .service_02 .service_01_right {
        position: relative;
        z-index: 2;
        float: none;
        width: initial;
        padding-left: 3%;
        padding-right: 3%;
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .success_case {
        padding: 40px 0;
    }
    .success_case_lists .item .left_pic {
        float: none;
        width: initial;
        height: 250px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        border-radius: 20px;
    }
    .success_case_lists .item .right_font {
        float: none;
        width: initial;
        text-align: left;
        padding-top: 30px;
    }
    .success_case_lists .item .right_font .titile {
        margin-bottom:20px;
        color: #00696c;
        font-weight: bold;
        font-size: 26px;
    }
    .success_case_lists .item .right_font{ padding-bottom: 40px;}
    .success_case_lists .slick-dots {
        width: 100%;
        left: 0;
        bottom:0px;
    }

}