.casestudy_hero .container {
    padding-block: 20rem 8rem;
    position: relative;
    overflow: hidden;
}

.casestudy_hero_bg {
    position: absolute;
    width: 60.69%;
    right: 0;
    transform: translate(20%, -70%);
    top: 0;
    pointer-events: none;
    z-index: -1;
    filter: blur(15rem);
}

.casestudy_hero_inner {
    align-items: flex-end;
}

.casestudy_hero_des {
    text-align: right;
}

.casestudy_hero_title {
    grid-column: 1/8;
}

.casestudy_hero_des {
    grid-column: 10/13;
}

@media only screen and (max-width: 991px) {
    .casestudy_hero .container {
        padding-block: 10rem;
    }

    .casestudy_hero_des {
        grid-column: 6/9;
    }

    .casestudy_hero_title {
        grid-column: 1/6;
    }

    .casestudy_hero_bg {
        filter: none;
        width: 60rem;
        height: 60rem;
        background: radial-gradient(circle, rgba(230, 38, 54, 0.4) 0%, rgba(230, 38, 54, 0) 70%);
        transform: translate(20%, -30%);
    }

    .casestudy_hero_bg svg {
        display: none;
    }
}

@media only screen and (max-width: 767px) {
    .casestudy_hero_bg {
        width: 60rem;
        height: 60rem;
        transform: translate(20%, -10%);
        filter: none;
        opacity: .7;
    }

    .casestudy_hero .container {
        padding-block: 13.4rem 4.8rem;
    }

    .casestudy_hero_des {
        grid-column: 1/5;
        text-align: left;
    }

    .casestudy_hero_title {
        grid-column: 1/5;
        margin-bottom: 3.2rem;
    }

}

/*casestudy_content  */
.casestudy_content {
    padding-bottom: 10rem;
}

.home_case_subtitle {
    width: max-content;
    margin-inline: auto;
    margin-bottom: 3.2rem;
}

.home_case_title {
    margin-bottom: 5.6rem;
}

.home_case_content_list {
    display: flex;
    flex-wrap: wrap;
}

.home_case_content_item {
    border-bottom: 1px solid #262626;
    width: 50%;
    padding-left: var(--padding-container);
    padding-right: 4.8rem;
    padding-block: 2.4rem;
    cursor: pointer;
    position: relative;
}

.home_case_content_item:nth-child(2n+1) {
    border-right: 1px solid #262626;
}

.home_case_content_item::before {
    background-color: #131313;
    content: "";
    top: 0;
    bottom: 0;
    left: 0;
    position: absolute;
    transition: right .4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    right: 100%;
    pointer-events: none;
    z-index: 1;
}

.home_case_content .home_case_content_item:nth-child(2n) {
    border-left: 1px solid #262626;
    padding-right: var(--padding-container);
    padding-left: 4.8rem;
}


.home_case_content {
    display: flex;
}


.home_case_content_item_txt_title {
    transition: color .4s ease;
}

.home_case_content_item_des {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3.2rem;
    position: relative;
    z-index: 3;
}

.home_case_content_item_txt {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 3;
}

.home_case_content_item_txt_icon {
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr;
}

.home_case_content_item_txt_icon_wrap {
    grid-column: 1/2;
    grid-row: 1/2;
    transition: transform .6s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    width: 4.8rem;
    height: 4.8rem;
}

.home_case_content_item_txt_icon_wrap.active {
    transform: translate(-100%, 100%);
}

.home_case_content_item:hover {

    .home_case_content_item_txt_icon_wrap {
        transform: translate(100%, -100%);
    }

    .home_case_content_item_txt_icon_wrap.active {
        transform: translate(0, 0);
    }

    .home_case_content_item_txt_title {
        color: #F32B3B;
    }

    &::before {
        right: 0;
    }

    .home_case_content_item_img {
        opacity: 1;
        clip-path: inset(0% 0 0% 0);
    }
}

.home_case_content_item_img {
    position: absolute;
    opacity: 0;
    right: 12rem;
    width: 30rem;
    top: 50%;
    transform: translateY(-50%);
    clip-path: inset(50% 0 50% 0);
    transition: opacity .6s cubic-bezier(0.785, 0.135, 0.15, 0.86),
        clip-path .6s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    pointer-events: none;
    z-index: 11;
}

.home_case_content_list {
    margin-bottom: 6.4rem;
}

.home_case_content_list {
    border-top: 1px solid #262626;
}

.home_case_seeview {
    margin-inline: auto;
}

@media only screen and (max-width:991px) {
    .home_case_content_item_img_outer {
        order: 2;
        position: relative;
        width: 100%;
        height: auto;
    }

    .home_case_content_item_des {
        order: 1;
    }

    .home_case_content_item_img {
        position: relative;
        opacity: 1;
        transform: translate(0);
        width: 100%;
        height: 100%;
        clip-path: unset;
        inset: unset;
        margin-bottom: 1.6rem;
        pointer-events: all;
    }
}

@media only screen and (max-width:767px) {
    .home_case_content_item_des {
        margin-bottom: 1.6rem;
    }

    .home_case_subtitle {
        margin-inline: unset;
        margin-bottom: 1.6rem;
    }

    .home_case_title {
        margin-bottom: 4.8rem;
    }

    .home_case_content_list {
        flex-direction: column;
    }

    .home_case_content_item {
        width: 100%;
        padding: 2.4rem 1.6rem;
        border-right: none !important;
    }


    .home_case_content_item_txt_icon_wrap {
        width: 3.2rem;
        height: 3.2rem;
    }


    .home_case_content_item:hover {
        .home_case_content_item_txt_icon_wrap {
            transform: translate(100%);
        }

        .home_case_content_item_txt_icon_wrap.active {
            transform: translate(0, 0);
        }

        .home_case_content_item_txt_title {
            color: auto;
        }

        &::before {
            right: 100%;
        }

        .home_case_content_item_img {
            opacity: 1;
            clip-path: inset(0% 0 0% 0);
        }

    }

    .home_case {
        padding-bottom: 0;
    }

    .home_case_content_list {
        margin-bottom: 3.2rem;
    }

    .casestudy_content {
        padding-bottom: 6.4rem;
    }
}