.bf-case-more {
    color: #ffffff;
    padding: 95px 0 125px;
}

.bf-case-more__head {
    display: flex;
    align-items: center;
    margin-bottom: 5em;
}

.bf-case-more__title {
    flex: 1;
}

.bf-case-more__link {
    color: #666666;
}

.bf-case-more__list {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}

.bf-case-more__list__item {
    width: 33.33%;
    display: flex;
    flex-direction: column;
    margin-bottom: 2em;
    align-items: center;
}

.bf-case-more__list__item:nth-child(3n + 1) {
    align-items: flex-start;
}

.bf-case-more__list__item:nth-child(3n) {
    align-items: flex-end;
}

.bf-case-more__list__item__link {
    display: block;
    text-decoration: none;
    width: 85%;
}

.bf-case-more__list__item__img-wrap {
    overflow: hidden;
    position: relative;
}

.bf-case-more__list__item__img-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.25);
    opacity: 0;
    transition: 0.5s;
}

.bf-case-more__list__item__img {
    display: block;
    width: 100%;
    transition: 0.5s;
}

.bf-case-more__list__item__arrow {
    position: absolute;
    width: 3em;
    line-height: 3em;
    text-align: center;
    background: var(--bf-theme-color1);
    color: #ffffff;
    border-radius: 50%;
    left: 50%;
    top: 50%;
    margin-top: -1.5em;
    margin-left: -1.5em;
    transition: 0.5s;
    opacity: 0;
    transform: scale(0) translateX(-100%);
    z-index: 2;
}

.bf-case-more__list__item__link:hover .bf-case-more__list__item__img {
    transform: scale(1.2);
}

.bf-case-more__list__item__link:hover .bf-case-more__list__item__arrow {
    opacity: 1;
    transform: scale(1) translateX(0);
}

.bf-case-more__list__item__link:hover .bf-case-more__list__item__img-wrap::after {
    opacity: 1;
}

.bf-case-more__list__item__content {
    margin-top: 2em;
}

.bf-case-more__list__item__title {
    color: #ffffff;
    transition: 0.25s;
}

.bf-case-more__list__item__link:hover .bf-case-more__list__item__title {
    color: var(--bf-theme-color1);
}

.bf-case-more__list__item__desc {
    color: #666666;
    margin-top: 1em;
}

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

    .bf-case-more__head {
        margin-bottom: 4.5em;
    }

    .bf-case-more__list__item__content {
        margin-top: 1.8em;
    }

    .bf-case-more__list__item__desc {
        color: #666666;
        margin-top: 0.9em;
    }
}

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

    .bf-case-more__head {
        margin-bottom: 4em;
    }

    .bf-case-more__list__item__content {
        margin-top: 1.6em;
    }

    .bf-case-more__list__item__desc {
        color: #666666;
        margin-top: 0.8em;
    }
}

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

    .bf-case-more__head {
        margin-bottom: 3.5em;
    }

    .bf-case-more__list__item__content {
        margin-top: 1.4em;
    }

    .bf-case-more__list__item__desc {
        color: #666666;
        margin-top: 0.7em;
    }
}

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

    .bf-case-more__head {
        margin-bottom: 3em;
    }

    .bf-case-more__list__item__content {
        margin-top: 1.2em;
    }

    .bf-case-more__list__item__desc {
        color: #666666;
        margin-top: 0.6em;
    }
}

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

    .bf-case-more__head {
        margin-bottom: 2.5em;
    }

    .bf-case-more__list__item {
        width: 100%;
        padding: 0 1em;
        margin-bottom: 2em;
    }

    .bf-case-more__list__item__content {
        margin-top: 1em;
    }

    .bf-case-more__list__item__desc {
        color: #666666;
        margin-top: 0.5em;
    }
}