.home-why {
    background-image: url(../../../Design/img/home-why-bg.png);
    background-size: cover;
}

    .home-why .grid.wide {
        max-width: 1290px;
    }

.home-why-container {
    padding-top: 170px;
    padding-bottom: 306px;
}

    .home-why-container .p-cate {
    }

    .home-why-container .p-title {
        color: #fff;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: unset;
        background: unset;
    }

.home-why-list {
    display: grid;
    grid-auto-rows: minmax(min-content,max-content);
    grid-template-columns: repeat(4,minmax(0,1fr));
    column-gap: 60px;
    row-gap: 20px;
    margin-top: 97px;
}

.home-why-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

    .home-why-item:hover::before {
        clip-path: path("M291.47 0.28186H4.01116C1.85411 0.28186 0.105469 2.03051 0.105469 4.18757V204.325C0.105469 206.708 2.22089 208.535 4.57854 208.189L292.038 165.983C293.955 165.701 295.376 164.057 295.376 162.119V4.18755C295.376 2.0305 293.627 0.28186 291.47 0.28186Z");
        width: 295.27px;
        height: 208.564px;
        transform: translateY(51px);
        transition: 0.8s cubic-bezier(.3,1.2,.3,1);
    }

    .home-why-item::before {
        content: '';
        position: absolute;
        width: 74.21px;
        height: 10.94px;
        background-color: var(--default-color-1);
        clip-path: path("M74.5182 6.75345V0.11377L0.310059 11.0497L74.5182 6.75345Z");
        right: 0;
        bottom: 0;
        transition: all ease .3s;
        z-index: 1;
        pointer-events: none;
    }

    .home-why-item:hover::after {
        opacity: .8;
        transform: translate(-14px, -14px) rotate(0);
        transition: 0.8s cubic-bezier(.3,2.2,.3,1);
        transition-delay: .2s;
    }

    .home-why-item::after {
        content: "";
        position: absolute;
        background-color: #FEFEFE;
        width: 271.06px;
        height: 209.35px;
        opacity: .8;
        clip-path: path("M267.423 218.661L4.35612 209.018C2.20051 208.939 0.517102 207.128 0.596115 204.972L7.95352 4.25021C8.04158 1.84777 10.2584 0.0944655 12.6165 0.562215L274.136 52.438C276.017 52.8112 277.349 54.4954 277.279 56.4122L271.469 214.901C271.39 217.057 269.579 218.74 267.423 218.661Z");
        transform: translate(-14px, -14px) rotate(10deg);
        transition: all ease .3s;
        opacity: 0;
        pointer-events: none;
    }

.home-why-top {
    display: flex;
    align-items: center;
    position: relative;
    z-index: 2;
}

.home-why-img {
    max-width: 57px;
}

    .home-why-img img {
        max-width: 100%;
    }

.home-why-title {
    margin: 0;
    font-family: 'baiSB';
    font-size: 20.1px;
    color: #fff;
    text-transform: capitalize;
    padding-left: 15px;
}

.home-why-descript {
    position: relative;
    z-index: 2;
}

    .home-why-descript section {
        color: #fff;
        font-size: 12px;
        line-height: 155%;
        margin-top: 13px;
        padding-right: 28px;
    }




@media(max-width:1023px) {
    .home-why-container {
        padding-top: 160px;
        padding-bottom: 260px;
    }

    .home-why-list {
        margin-top: 50px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 40px;
        row-gap: 78px;
    }

    .home-why-descript section {
        font-size: 14px;
        padding-right: 0;
    }
}

@media(min-width:740px) and (max-width:1023px) {
}

@media(max-width:739px) {
    .home-why-container {
        padding: 25px 0;
    }

    .home-why-item::before,
    .home-why-item::after {
        display: none;
    }

    .home-why-list {
        margin-top: 30px;
        column-gap: 15px;
        row-gap: 15px;
    }

    .home-why-img {
        max-width: 42px;
    }

    .home-why-title {
        font-size: 16px;
    }

    .home-why-item {
        justify-content: unset;
    }

    .home-why-container .p-title {
        font-size: 17px;
    }
}