@charset "UTF-8";

.main-image_area {
    background-color: #000;
    width: 100%;
    height: calc(100vh - 85px);
    position: relative;
}
.main-image_area img {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    object-fit: cover;
}

.main-image_area .main-image_catch {
    position: absolute;
    top: 24px;
    right: 146px;
    color: #000;
    font-size: 1.2rem;
    z-index: 100;
}

@media screen and (max-width: 1100px) {
    .main-image_area {
        height: 100vh;
    }
    .main-image_area .main-image_catch {
        display: none;
    }
}
/* -----------------------
        section共通
----------------------- */

.section_container {
    margin: 160px auto 230px;
    max-width: 1366px;
}

.moji {
    display: flex;
    justify-content: flex-end;
}

.moji img {
    max-width: 370px; 
    width: 100%;
}

.area_container {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 7%;
    margin-top: -85px;
    margin-bottom: 130px;
}
.area_container .image {
    width: 56%;
}

.desc_container {
    width: 37%;
}

.desc_catch {
    margin-bottom: 40px;
}

.image_container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7%;
}

.image_l img {
    max-width: 516px;
}
.image_r .image_upper {
    max-width: 570px;
    margin-bottom: 50px;
}
.image_r .image_under {
    max-width: 453px;
    margin-left: 30px;
}


@media screen and (max-width: 760px) {
    .section_container {
        margin: 75px auto 110px;
    }
    .area_container {
        flex-direction: column;
        margin-top: 30px;
        margin-bottom: 40px;
    }
    .moji img {
        max-width: 195px; 
        width: 100%;
    }

    .area_container .image {
        width: 100%;
        margin-bottom: 30px;
    }
    
    .desc_container {
        width: 100%;
    }
    .desc_container .desc_catch {
        margin-bottom: 20px;
    }
    .image_container {
        flex-direction: column-reverse;
        /* padding: 0 25px; */
        gap: 0;
    }
    .image_container img {
        margin-bottom: 20px;
    }
    .image_r .image_upper {
        margin-bottom: 20px;
    }
    .image_r .image_under {
        margin-left: 0;
    }
    
    
}

/* -----------------------
        sen-area
----------------------- */

/* パララックス */
.fixed-image_area.about_middle {
    background-image: url(../img/about/img-about_middle_pc.jpg);
}

@media screen and (max-width: 760px) {
    .fixed-image_area.about_middle {
        height: 257px;
    }
}

/* -----------------------
        waza-area
----------------------- */
.waza-area.section_container {
    margin-bottom: 0;
}

.waza-area .area_container {
    flex-direction: row-reverse;
}

.waza-area .moji {
    justify-content: flex-start;
}

@media screen and (max-width: 760px) {
    .waza-area.section_container {
        margin-bottom: 70px;
    }
    .waza-area .area_container {
        flex-direction: column;
    }
}


/* -----------------------
        kokoro-area
----------------------- */

.kokoro-area.section_container {
    margin-top: -50px;
}


@media screen and (max-width: 760px) {
    .kokoro-area.section_container {
        margin-top: 0;
    }
}
.under_image {
    max-width: 1366px;
    margin: 0 auto 130px;
}