@charset "utf-8";

/**sub_main*********************************/
.sub_main .img_area img {
    object-position: 60% bottom;
}

.sub_main .title_04 {
    text-align: center;
}

.sub_main .bottom_text {}

/*700px以上*/
@media (min-width: 700px) {
    .sub_page .img {
        width: 50%;
        height: unset;
        padding: 0;
    }
}

/*900px以上*/
@media (min-width: 900px) {}


/*****teacher_02******************************/
.teacher_02 {
    background-color: #111;
    color: #fff;
}

.teacher_box {
    padding: 1rem 5%;
    margin: 0 0 3rem;
}

.teacher_box .name {
    font-size: clamp(1.25rem, 1.142rem + 0.54vw, 1.813rem);
    /*19-29px*/
    border-bottom: solid 1px #707070;
    padding: 1em 0 0.3em;
}

.teacher_box .name .jp {
    font-size: 60%;
    opacity: 0.8;
    padding: 0 1em;
    display: inline-block;
}



.teacher_box .teacher_box {
    display: flex;
    padding: 2rem;
}

.teacher_box .text {
    font-size: clamp(0.938rem, 0.901rem + 0.18vw, 1.125rem);

    width: 100%;
    padding: 2em 0 0 0;
}

.teacher_box .img {
    width: 100%;
    text-align: center;
}

.photo {
    padding: 0 1rem;
}



/*600px以上*/
@media (min-width: 600px) {
    .teacher_box {
        align-items: stretch;
        display: flex;
        flex-wrap: wrap;
        padding: 0;
    }

    .teacher_box .img {
        width: 50%;
        padding: 1rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .teacher_box .img img {
        width: 100%;
        object-fit: cover;
        height: 100%;
    }

    .teacher_box .comment {
        width: 50%;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .teacher_box .text {
        padding: 2em 3rem 0 0;
        max-width: 960px;
    }


    .photo {
        padding: 0;
    }


    .photo ul {
        display: flex;
        flex-wrap: wrap;
        padding: 1rem;
        gap: 1%;
    }

    .photo li {
        width: calc(100% / 2 - 1%);
        aspect-ratio: 16 / 9;
    }

    .photo li img {
        width: 100%;
        object-fit: cover;
        height: 100%;
    }
}

/*900px以上*/
@media (min-width: 900px) {
    .teacher_box .img {
        width: 30%;
    }

    .teacher_box .comment {
        width: 70%;
        padding: 0 2rem;
    }

    .photo li {
        width: calc(100% / 4 - 1%);
    }
}