@charset "utf-8";


/* ------------------reasons-------------- */
.reasons{
    padding: 104px 0 136px;
}


.reasons-list__item-01,
.reasons-list__item-02,
.reasons-list__item-03{
    display: flex;
    margin-bottom: 80px;
    padding: 80px;
    scroll-margin-top: 84px;
    align-items: center;
    column-gap: 64px;
    background: url(/assets/img/reasons/bg_item.png) top left/cover;
    position: relative;
}

.reasons-list__item-01{
    background-color: #141414;
}

.reasons-list__item-02{
    background-color: #262626;
}

.reasons-list__item-03{
    margin-bottom: 0;
    background-color: #343434;
}


.reasons-item__number{
    width: 40px;
    aspect-ratio: 1/1;
    text-align: center;
    font-size: 20px;
    font-weight: 500;
    line-height: 40px;
    color: var(--color-text-primary);
    background-color: var(--white);
    position: absolute;
    top: 40px;
    left: 40px;
}


.reasons-item__inner{
    width: calc(100% - 466px - 64px);
}

.reasons-item__title{
    margin-bottom: 40px;
    color: var(--white);
}

.reasons-item__title-ja{
    display: block;
    margin-bottom: 8px;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.8;
}

.reasons-item__title-en{
    display: block;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.8;
    text-transform: uppercase;
}

.reasons-item__text{
    color: var(--white);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
}

.reasons-item__image{
    width: 466px;
}

.reasons-item__image img{
    display: block;
    width: 100%;
}


@media screen and (max-width:750px) {



    /* ------------------reasons-------------- */
    .reasons{
        padding: calc((100 / 390) * 56 * 1vw) 0 calc((100 / 390) * 72 * 1vw);
    }


    .reasons-list__item-01,
    .reasons-list__item-02,
    .reasons-list__item-03{
        display: block;
        padding: calc((100 / 390) * 96 * 1vw) calc((100 / 390) * 24 * 1vw) calc((100 / 390) * 48 * 1vw);
        scroll-margin-top: calc((100 / 390) * 72 * 1vw);
        background: url(/assets/img/reasons/bg_item_sp.png) top left/cover;
    }

    .reasons-list__item-01{
        background-color: #141414;
    }

    .reasons-list__item-02{
        background-color: #262626;
    }
    
    .reasons-list__item-03{
        margin-bottom: 0;
        background-color: #343434;
    }
    

    .reasons-item__number{
        width: calc((100 / 390) * 40 * 1vw);
        font-size: calc((100 / 390) * 20 * 1vw);
        line-height: calc((100 / 390) * 40 * 1vw);
        top: calc((100 / 390) * 24 * 1vw);
        left: calc((100 / 390) * 24 * 1vw);
    }


    .reasons-item__inner{
        width: 100%;
    }

    .reasons-item__title{
        margin-bottom: calc((100 / 390) * 32 * 1vw);
    }

    .reasons-item__title-ja{
        margin-bottom: calc((100 / 390) * 6 * 1vw);
        font-size: calc((100 / 390) * 20 * 1vw);
    }

    .reasons-item__title-en{
        font-size: calc((100 / 390) * 12 * 1vw);
    }

    .reasons-item__text{
        margin-bottom: calc((100 / 390) * 40 * 1vw);
        font-size: calc((100 / 390) * 15 * 1vw);
    }

    .reasons-item__image{
        width: 100%;
    }

    .reasons-item__image img{
        display: block;
        width: 100%;
    }




}