.cd-service-box {
    position: relative;
}

.cd-service-box .bg-gray {
    background-color: #fafafa;
    padding-top: 80px;
    padding-bottom: 80px;
}

.cd-service-box .service-div .ser-title span{
    position: relative;
    margin-bottom: 35px;
    padding-bottom: 10px;
    font-size: 25px;
    letter-spacing: 3px;
    display: grid;
}

.cd-service-box .service-div .ser-title span::before {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translate(-50%, 0);
    display: block;
    width: 100%;
    max-width: 360px;
    height: 1px;
    background-color: #B2B2B2;
}

.cd-service-box .service-div .ser-title span::after {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translate(-50%, 0);
    display: block;
    width: 100%;
    max-width: 75px;
    height: 4px;
    background-color: #2778B6;
}


.cd-service-box .service-div p {
    line-height: 185%;
    letter-spacing: 1px;
}

.cd-service-box .service-div .btn-more {
    padding: 10px 22px;
    display: flex;
    align-items: center;
    border-radius: 0;
    margin-top: 2rem;
    transition: 0.3s all linear;
    border-width: 1px;
    border-style: solid;
    border-color: #000000;
}

.cd-service-box .service-div .btn-more:hover {
    transition: 0.3s all linear;
    border-color: rgba(0, 0, 0, 0);
    background: #000000;
}

.cd-service-box .service-div .btn-more .text {
    margin-right: 23px;
    color: #000000;
}

.cd-service-box .service-div .btn-more i {
    color: #000000;
}

.cd-service-box .service-div .btn-more:hover .text, .cd-service-box .service-div .btn-more:hover i {
    color: #fff;
}

.cd-service-box .bg01 {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 33.33%;
    background-position: center center;
    background-image: url(/assets/template/c65074944294ac3668863df4d62cc2d3/img/bg01.jpg);
    background-size: cover
}

@media (max-width: 1199px) {
    .cd-service-box .bg01 {
        width: 25%
    }
}

@media (max-width: 991px) {
    .cd-service-box .bg01 {
        width: 100%;
        height: 200px
    }
}

@media (max-width: 575px) {
    .cd-service-box .bg01 {
        height: 150px
    }
}

.cd-service-box .bg02 {
    position: absolute;
    right: 0;
    top: 0;
    height: 50%;
    width: 33.33%;
    background-position: top center;
    background-image: url(/assets/template/c65074944294ac3668863df4d62cc2d3/img/bg02.jpg);
    background-size: cover
}

@media (max-width: 1199px) {
    .cd-service-box .bg02 {
        width: 25%
    }
}

@media (max-width: 991px) {
    .cd-service-box .bg02 {
        width: 50%;
        height: 200px;
        left: 0;
        right: auto;
        top: auto;
        bottom: 0
    }
}

@media (max-width: 575px) {
    .cd-service-box .bg02 {
        height: 150px
    }
}

.cd-service-box .bg03 {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 50%;
    width: 33.33%;
    background-position: center center;
    background-image: url(/assets/template/c65074944294ac3668863df4d62cc2d3/img/bg03.jpg);
    background-size: cover
}

@media (max-width: 1199px) {
    .cd-service-box .bg03 {
        width: 25%
    }
}

@media (max-width: 991px) {
    .cd-service-box .bg03 {
        width: 50%;
        height: 200px
    }
}

@media (max-width: 575px) {
    .cd-service-box .bg03 {
        height: 150px
    }
}

.cd-service-box .service-div {
    max-width: 350px;
    margin: 0 auto
}

@media (max-width: 991px) {
    .cd-service-box .service-div {
        padding-top: 200px;
        padding-bottom: 200px
    }
}

@media (max-width: 575px) {
    .cd-service-box .service-div {
        padding-top: 150px;
        padding-bottom: 150px
    }
}