/*
 * @Author: ChenWanzhao
 * @Date: 2023-11-02 16:39:46
 * @LastEditors: ChenWanzhao
 * @LastEditTime: 2023-11-16 17:43:24
 * @Description: 案例-我们的解决方案
 */
.bf-case-solution {
    display: flex;
    color: #ffffff;
    padding: 108px 0;
    border-top: 1px solid var(--bf-theme-color3);
    border-bottom: 1px solid var(--bf-theme-color3);
    margin-top: -1px;
}

.bf-case-solution__left {
    width: 50%;
}

.bf-case-solution__left__title {
    margin-bottom: 1.2em;
}

.bf-case-solution__left__menus {
    list-style: none;
    margin-bottom: 482px;
    line-height: 2em;
    position: sticky;
    top: 120px;
    background: #131313;
    z-index: 2;
}

.bf-case-solution__left__menu {
    color: var(--bf-theme-color-light);
    transition: 0.25s;
}

.bf-case-solution__left__menu.active,
.bf-case-solution__left__menu:hover:not(.active) {
    color: #ffffff;
    cursor: pointer;
    user-select: none;
    font-size: 1.25em;
}

.bf-case-solution-link {
    position: sticky;
    top: 360px;
}

.bf-case-solution-link img {
    display: block;
    width: 100%;
}

.bf-case-solution__right {
    width: 50%;
}

.bf-case-solution__right__chapter {
    margin-bottom: 1.5em;
}

.bf-case-solution__right__chapter__title {
    margin-bottom: 1em;
}

.bf-case-solution__right img {
    display: block;
    width: 100%;
    height: auto;
}

/* 屏幕宽度小于 1600px 时 */
@media screen and (max-width: 1600px) {
    .bf-case-solution {
        padding: 97.2px 0;
    }

    .bf-case-solution__left__menus {
        margin-bottom: 385.6px;
    }
}

/* 屏幕宽度小于 1440px 时 */
@media screen and (max-width: 1400px) {
    .bf-case-solution {
        padding: 86.4px 0;
    }

    .bf-case-solution__left__menus {
        margin-bottom: 289.2px;
    }
}

/* 屏幕宽度小于 1280px 时 */
@media screen and (max-width: 1280px) {
    .bf-case-solution {
        padding: 75.6px 0;
    }

    .bf-case-solution__left__menus {
        margin-bottom: 192.8px;
    }
}

/* 屏幕宽度小于 1024px 时 */
@media screen and (max-width: 1024px) {
    .bf-case-solution {
        padding: 64.8px 0;
        flex-wrap: wrap;
    }

    .bf-case-solution__left {
        width: 100%;
        border-bottom: 1px solid var(--bf-theme-color3);
        padding-bottom: 3em;
        margin-bottom: 3em;
    }

    .bf-case-solution__left__menus {
        margin-bottom: 1em;
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .bf-case-solution__left__menu {
        margin-right: 2em;
        margin-bottom: 2em;
    }

    .bf-case-solution__right {
        width: 100%;
    }
}

/* 屏幕宽度小于 968px 时 */
@media screen and (max-width: 968px) {
    .bf-case-solution {
        padding: 54px 0;
    }

    .bf-case-solution__left__menus {
        margin-bottom: 48.2px;
    }
}
