header:not(.sticky) .site-logo .logo-white {
    display: inline;
}

header:not(.sticky) .site-logo .logo-black {
    display: none;
}

header:not(.sticky).site-header {
    background: rgba(255, 255, 255, 0);
}

header:not(.sticky) .navigation ul li a {
    color: #fff;
}

header:not(.sticky) .header-buttons .myb-btn.myb-btn-outline {
    border-color: #fff;
    color: #fff;
}

header:not(.sticky) .header-buttons .myb-btn.myb-btn-outline:hover {
    border-color: #00B665;
}


.section-1 {
    height: 28vw;
    color: #fff;
    margin-bottom: 5vw;
    overflow: visible;
}

.section-1 h1.heading {
    font-size: 2.81vw;
    text-align: left;
    color: #FFFFFF;
}

.section-1 p.subheading {
    font-size: 1.35vw;
    text-align: left;
    color: #FFFFFF;
}

.section-1 .wrapper {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.section-1 .wrapper::after {
    content: ' ';
    position: absolute;
    right: -3vw;
    z-index: 1;
}

.section-2 {
    padding: 7.2vw 0;
}

.case-wrapper {
    margin-bottom: 7.2vw;
}

.case-wrapper:last-child {
    margin-bottom: 0;
}

.case-detail {
    color: #090230;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 3.2vw;
}

.case-detail-content {
    padding-right: 3vw;
}

.case-detail-content .title {
    margin-bottom: 4vw;
}

.case-detail-content h1 {
    font-size: 1.8em;
}

.case-wrapper.case-wrapper-right .case-detail-content {
    padding-right: 0;
    padding-left: 4.2vw;
}

.case-detail .title {
    position: relative;
}

.case-detail .title:before {
    content: ' ';
    display: block;
    position: absolute;
    width: 80px;
    height: 73.6px;
    background: url("../imgs/case/detail/badge-retail.png") no-repeat;
    background-size: 100% 100%;
    margin-left: calc(-80px - 1.7vw);
    top: -10px;
}

.case-wrapper.case-wrapper-right .case-detail .title:before {
    right: calc(-80px - 1.7vw);
    top: -10px;
    margin-left: 0;
}

.case-detail .title p {
    font-size: 1.25vw;
    margin-bottom: 0em;
}

.case-detail .title h1 {
    margin-top: 0;
    color: #2F6563;
}

.case-detail .problem {
    margin-top: 2vw;
}

.section-2 h2 {
    color: #2F6563;
    font-size: 1.25vw;
    position: relative;
    margin-bottom: 0.6vw;
}

.section-2 h2:before {
    content: ' ';
    width: 16px;
    height: 16px;
    background-color: #66cccc30;
    border-radius: 50%;
    position: absolute;
    left: -1.7vw;
    top: 50%;
    margin-top: -8px;
}

.case-detail .problem p {
    font-size: 1.12vw;
    line-height: 2.24vw;
    margin-bottom: 0;
}

.case-detail ol li {
    font-size: 1.12vw;
    line-height: 2.24vw;
}

.case-detail ol {
    padding-left: 22px;
}

.case-detail .problem ul {
    padding-left: 18px;
    margin: 0;
}

.case-detail .problem ul li {
    line-height: 2.24vw;
    font-size: 1.12vw;
}

.case-detail a.myb-btn-s {
    background-color: #2F6563;
    font-size: 14px;
    padding-left: 2.58333vw;
    padding-right: 2.58333vw;
}

.case-result {
    margin-top: -1.5vw;
    line-height: 2.24vw;
    color: #090230;
    font-size: 1.12vw;
}

.case-result h2 {
    margin-bottom: .5vw;
}

.case-result-content {
    background-color: #e3eae2;
    padding: 1.3vw 1.3vw 1.3vw 1.7vw;
    border-radius: 2px;
    margin-left: -1.7vw;
}

.case-wrapper.case-wrapper-right .case-result h2 {
    margin-left: calc(4.2vw + 261px);
}

.case-wrapper.case-wrapper-right .case-result .case-result-content {
    padding-left: 8.8vw;
}

.case-wrapper.case-wrapper-right .case-detail-img {
    margin-top: 4vw;

}

.case-result ul, .case-result ol {
    margin: 0;
    padding-left: 22px;
}

.case-result ul li, .case-result ol li {
    line-height: 2.24vw;
}

.font-lg {
    font-weight: bold;
    font-size: 1.3vw;
}

/**行业个性化**/

/*零售行业*/
.section-retail {
    background-color: #F89402;
}

.section-retail .wrapper::after {
    right: -4.2vw;
    width: 256px;
    height: 307px;
    bottom: 0;
    margin-bottom: -94px;
    background: url("../imgs/case/detail/banner-retail.png") no-repeat;
    background-size: 100% 100%;
}

/*餐饮行业*/
.section-food {
    background-color: #a12f2f;
}

.section-food .wrapper::after {
    width: 498px;
    height: 303px;
    bottom: 0;
    margin-bottom: -140px;
    background: url("../imgs/case/detail/banner-food.png") no-repeat;
    background-size: 100% 100%;
}

/*酒店行业*/
.section-hotel {
    background-color: #2F6563;
}

.section-hotel .wrapper::after {
    width: 488px;
    height: 251px;
    bottom: 0;
    margin-bottom: -108px;
    background: url("../imgs/case/detail/banner-hotel.png") no-repeat;
    background-size: 100% 100%;
}

/*医疗行业*/
.section-healthy {
    background-color: #66CCCC;
}

.section-healthy .wrapper::after {
    width: 290px;
    height: 245px;
    bottom: 0;
    margin-bottom: -108px;
    background: url("../imgs/case/detail/banner-healthy.png") no-repeat;
    background-size: 100% 100%;
}

/*教育培训行业*/
.section-education {
    background-color: #337887;
}

.section-education .wrapper::after {
    width: 262px;
    height: 278px;
    bottom: 0;
    margin-bottom: -108px;
    background: url("../imgs/case/detail/banner-education.png") no-repeat;
    background-size: 100% 100%;
}

/*旅游行业*/
.section-trip {
    background-color: #4E1D4C;
}

.section-trip .wrapper::after {
    width: 354px;
    height: 321px;
    bottom: 0;
    margin-bottom: -108px;
    background: url("../imgs/case/detail/banner-trip.png") no-repeat;
    background-size: 100% 100%;
}

/*物业行业*/
.section-property {
    background-color: #C2C6AC;
}

.section-property .wrapper::after {
    width: 400px;
    height: 170px;
    bottom: 0;
    margin-bottom: -68px;
    background: url("../imgs/case/detail/banner-property.png") no-repeat;
    background-size: 100% 100%;
}

/*运动健身行业*/
.section-fitness {
    background-color: #232B35;
}

.section-fitness .wrapper::after {
    width: 278px;
    height: 207px;
    bottom: 0;
    margin-bottom: -68px;
    background: url("../imgs/case/detail/banner-fitness.png") no-repeat;
    background-size: 100% 100%;
}

/*汽车行业*/
.section-car {
    background-color: #263A4C;
}

.section-car .wrapper::after {
    width: 580px;
    height: 143px;
    bottom: 0;
    margin-bottom: -38px;
    background: url("../imgs/case/detail/banner-car.png") no-repeat;
    background-size: 100% 100%;
}


/*政务行业*/
.section-government {
    background-color: #006666;
}

.section-government .wrapper::after {
    width: 500px;
    height: 325px;
    bottom: 0;
    margin-bottom: -128px;
    margin-right: -30px;
    background: url("../imgs/case/detail/banner-government.png") no-repeat;
    background-size: 100% 100%;
}

/*软件系统行业*/
.section-software {
    background-color: #3578ba;
}

.section-software .wrapper::after {
    width: 300px;
    height: 306px;
    bottom: 0;
    margin-bottom: -70px;
    background: url("../imgs/case/detail/banner-software.png") no-repeat;
    background-size: 100% 100%;
}

/*生产制造行业*/
.section-manufacturing {
    background-color: #242424;
}

.section-manufacturing .wrapper::after {
    width: 350px;
    height: 357px;
    bottom: 0;
    margin-bottom: -90px;
    background: url("../imgs/case/detail/banner-manufacturing.png") no-repeat;
    background-size: 100% 100%;
}

/*房地产*/
.section-estate {
    background-color: #50111f;
}

.section-estate .wrapper::after {
    width: 462px;
    height: 155px;
    bottom: 0;
    margin-bottom: -20px;
    background: url("../imgs/case/detail/banner-estate.png") no-repeat;
    background-size: 100% 100%;
}

/*美容美发*/
.section-beauty {
    background-color: #99cc98;
}

.section-beauty .wrapper::after {
    width: 350px;
    height: 240px;
    bottom: 0;
    margin-bottom: -70px;
    background: url("../imgs/case/detail/banner-beauty.png") no-repeat;
    background-size: 100% 100%;
}

/*售后服务*/
.section-after-sales {
    background-color: #404f78;
}

.section-after-sales .wrapper::after {
    width: 450px;
    height: 254px;
    bottom: 0;
    margin-bottom: -60px;
    background: url("../imgs/case/detail/banner-after-sales.png") no-repeat;
    background-size: 100% 100%;
}

.case-wrapper.case-wrapper-retail .title:before {
    background-image: url("../imgs/case/detail/badge-retail.png");
}

.case-wrapper.case-wrapper-hotel .title:before {
    background-image: url("../imgs/case/detail/badge-hotel.png");
}

.case-wrapper.case-wrapper-food .title:before {
    background-image: url("../imgs/case/detail/badge-food.png");
}

.case-wrapper.case-wrapper-healthy .title:before {
    background-image: url("../imgs/case/detail/badge-healthy.png");
}

.case-wrapper.case-wrapper-education .title:before {
    background-image: url("../imgs/case/detail/badge-education.png");
}

.case-wrapper.case-wrapper-trip .title:before {
    background-image: url("../imgs/case/detail/badge-trip.png");
}

.case-wrapper.case-wrapper-property .title:before {
    background-image: url("../imgs/case/detail/badge-property.png");
}

.case-wrapper.case-wrapper-fitness .title:before {
    background-image: url("../imgs/case/detail/badge-fitness.png");
}

.case-wrapper.case-wrapper-car .title:before {
    background-image: url("../imgs/case/detail/badge-car.png");
}

.case-wrapper.case-wrapper-government .title:before {
    background-image: url("../imgs/case/detail/badge-government.png");
}

.case-wrapper.case-wrapper-software .title:before {
    background-image: url("../imgs/case/detail/badge-software.png");
}

.case-wrapper.case-wrapper-software .title:before {
    background-image: url("../imgs/case/detail/badge-manufacturing.png");
}

.case-wrapper.case-wrapper-manufacturing .title:before {
    background-image: url("../imgs/case/detail/badge-manufacturing.png");
}

.case-wrapper.case-wrapper-estate .title:before {
    background-image: url("../imgs/case/detail/badge-estate.png");
}

.case-wrapper.case-wrapper-beauty .title:before {
    background-image: url("../imgs/case/detail/badge-beauty.png");
}

.case-wrapper.case-wrapper-after-sales .title:before {
    background-image: url("../imgs/case/detail/badge-after-sales.png");
}

.case-wrapper.case-wrapper-retail .case-result-content {
    background-color: #fffef0;
}

.case-wrapper.case-wrapper-hotel .case-result-content {
    background-color: #F6F8F6;
}

.case-wrapper.case-wrapper-food .case-result-content {
    background-color: #FAF8F3;
}

.case-wrapper.case-wrapper-healthy .case-result-content {
    background-color: #EBF8FF;
}

.case-wrapper.case-wrapper-education .case-result-content {
    background-color: #E1E9DC;
}

.case-wrapper.case-wrapper-trip .case-result-content {
    background-color: #F5F0E6;
}

.case-wrapper.case-wrapper-property .case-result-content {
    background-color: #FBF5E7;
}

.case-wrapper.case-wrapper-car .case-result-content {
    background-color: #DDE8EE;
}

.case-wrapper.case-wrapper-fitness .case-result-content {
    background-color: #d6d3bf;
}

.case-wrapper.case-wrapper-government .case-result-content {
    background-color: #fdf4ec;
}

.case-wrapper.case-wrapper-software .case-result-content {
    background-color: #eeeeee;
}

.case-wrapper.case-wrapper-manufacturing .case-result-content {
    background-color: #f8fcff;
}

.case-wrapper.case-wrapper-estate .case-result-content {
    background-color: #fbf5e7;
}

.case-wrapper.case-wrapper-beauty .case-result-content {
    background-color: #fefef7;
}

.case-wrapper.case-wrapper-after-sales .case-result-content {
    background-color: #bcdffd;
}

@media (max-width: 900px) {
    .section-1 {
        height: 300px;
    }

    .section-1 h1.heading {
        font-size: 6.13vw;
    }

    .section-1 p.subheading {
        font-size: 3.73vw;
    }

    .section-2 {
        padding: 18vw 0;
    }

    .case-detail .title p {
        font-size: 4.2vw;
    }

    .case-detail .title h1 {
        font-size: 6.1vw;
        margin-top: 1vw;
    }

    .section-2 h2 {
        font-size: 4.8vw;
    }

    .case-detail-img {
        display: none;
    }

    .case-detail .problem p, .case-detail ol li, .case-result, .case-result ul li, .case-result ol li {
        font-size: 3.2vw;
        line-height: 1.6;
    }

    .case-detail .title:before {
        width: 51px;
        height: 47px;
        margin-left: calc(-47px - 5vw);
        top: 22px;
    }

    .section-2 .case-wrapper {
        padding-left: 50px;
    }

    .section-2 h2:before {
        left: -25px;
    }

    .section-2 h2 {
        margin-bottom: 1.5vw;
    }

    .case-wrapper {
        margin-bottom: 22vw;
    }

    .case-result {

        margin-right: -25px;
    }

    .case-result-content {
        padding: 3.3vw 3.3vw 3.3vw 3.7vw;
    }

    .font-lg {
        font-size: 4.8vw;
    }

    .section-2 .case-wrapper.case-wrapper-right {
        padding-left: 0;
        padding-right: 50px;
    }

    .case-wrapper.case-wrapper-right .case-detail .title:before {
        right: calc(-47px - 5vw);
        top: 22px;
    }

    .case-wrapper.case-wrapper-right .case-result {
        margin-right: -50px;
    }

    .case-wrapper.case-wrapper-right .case-result h2 {
        margin-left: 16px;
    }

    .section-retail .wrapper::after {
        width: 128px;
        height: 154px;
        margin-bottom: -68px;
    }

    .section-food .wrapper::after {
        width: 199.2px;
        height: 112.8px;
        margin-bottom: -46px;
    }
    .section-hotel .wrapper::after {
        width: 212px;
        height: 109px;
        margin-bottom: -56px;
    }

    .section-healthy .wrapper::after {
        width: 145px;
        height: 123px;
        margin-bottom: -56px;
    }
    .section-education .wrapper::after {
        width: 131px;
        height: 139px;
        margin-bottom: -56px;
    }

    .section-trip .wrapper::after {
        width: 177px;
        height: 161px;
        margin-bottom: -66px;
    }
    .section-property .wrapper::after {
        width: 200px;
        height: 85px;
        margin-bottom: -32px;
    }

    .section-fitness .wrapper::after {
        width: 139px;
        height: 103px;
        margin-bottom: -36px;
    }
    .section-car .wrapper::after {
        width: 232px;
        height: 57.2px;
        margin-bottom: -22px;
    }

    .section-government .wrapper::after {
        width: 250px;
        height: 162.5px;
        margin-bottom: -65px;
    }

    .section-software .wrapper::after {
        width: 120px;
        height: 122.4px;
        margin-bottom: -45px;
    }
    .section-manufacturing .wrapper::after {
        width: 140px;
        height: 142.8px;
        margin-bottom: -45px;
    }
    .section-estate .wrapper::after {
        width: 231px;
        height: 77.5px;
        margin-bottom: -10px;
    }

    .section-beauty .wrapper::after {
        width: 175px;
        height: 120px;
        margin-bottom: -36px;
    }
    .section-after-sales .wrapper::after {
        width: 225px;
        height: 127px;
        margin-bottom: -36px;
    }

}