@charset "utf-8";




/*メインヴィジュアルの設定--------------------------------*/


.main-v-bg {
    position: relative;
}

.main-v div img {
    object-fit: cover;
    width: 100%;
    z-index: -1;
}




/*main-------------------*/

.main-bg {
    padding: 75px 160px 80px;
    background-color: rgba(255, 255, 255, 0.85);
    margin: 30px 0 100px 0;

}

.about-titel {
    font-size: 35px;
    text-align: center;
    margin-bottom: 60px;
    font-weight: normal;

}


.flex {
    display: flex;
    justify-content: space-between;
    gap: 80px;
    max-width: 700px;
    margin: 0 auto;
}

.rowReverse {
    flex-direction: row-reverse;
    margin-top: 50px;
}




/*スマホ版*/
@media screen and (max-width: 896px) {

    /*main-------------------*/

    .main-bg {
        padding: 100px 10% 80px;
        margin: 120px 0 150px 0;

    }

    .main-content {
        max-width: 500px;
    }

    .flex {
        gap: 5%;
        max-width: 700px;
    }

    .rowReverse {
        margin-top: 50px;
    }

    .flex p {
        flex-basis: 60%;
    }

    .flex div {
        flex-basis: 40%;
    }


    .flex-img {
        width: 100%;
        height: auto;
    }

}