@charset "UTF-8";

/* director */

.director {
    padding-top: 20px;
}

.director_container {
    display: flex;
    align-items: center;
    position: relative;
}

.director_box {
    background-image: url(../img/info/director_back.jpg);
    margin-top: 80px;
    max-width: 1223px;
    padding: 101px 302px 173px 18.68%;
}

.director_title {
    font-size: 30px;
    font-weight: 500;
    color: #3a88d6;
}

.director_box h3 {
    padding-top: 5px;
    font-size: 35px;
    color: #717071;
}

.director_subtitle {
    padding-top: 10px;
    font-size: 16px;
    color: #717071;
}

.career{
    padding-top: 60px;
}

.career_box {
    margin-top: 10px;
    max-width: 561px;
    border: 1px solid #ccc;
}

.career_title {
    border: 1px solid #ccc;
    background-color: #3a88d6;
    max-width: 218px;
    width: 39%;
    font-size: 21px;
    color: #fff;
    padding-left: 1rem;
    letter-spacing: 0.1rem;
}

.career_title, .career_detail {
    vertical-align: middle;
}

.career_detail {
    border: 1px solid #ccc;
    background-color: #fff;
    font-size: 21px;
    padding-left: 1rem;
    letter-spacing: 0.1rem;
}

.director_img {
    width: 609px;
    position: absolute;
    top: 27%;
    right: 12.5%;
}

.director_line {
    display: block;
    margin: 0 auto;
    padding: 96px 0; 
}

/* greeting */

.greeting {
    background-image: url(../img/info/greeting.jpg);
    background-size: cover;
    margin-top: 15px;
    padding: 170px 0 224px 0;
}

.greeting_box {
    background-color: #fff;
    border-radius: 52.864px;
    padding: 102px 110px 78px 110px;
}

.greeting_top {
    display: block;
    margin: 0 auto;
}

.greeting_text {
    padding: 38px 0;
    font-size: 25px;
    line-height: 1.8;
}

/* recruit */

.recruit {
    margin-top: 139px;
}

.recruit_title {
    font-size: 30px;
    text-align: center;
    padding-top: 77px;
}

.recruit_pet {
    display: block;
    float: right;
    margin: 70px 117px 0 0;
}

.recruit_container {
    margin: 0 auto;
    padding: 124px 0 46px 0;
    max-width: 961px;
}

.recruit_subtitle {
    font-size: 30px;
}

.recruit_box {
    margin-top: 18px;
}

.recruit_box {
    width: 100%;
}

.recruit_item_title, .recruit_item_text {
    font-size: 16px;
    vertical-align: middle;
}

.recruit_item_title {
    background-color: #3a88d6;
    color: #fff;
    width: 20%;
    padding: 0 20px;
    border: 4px solid #fff;
    text-align: center;
}

.recruit_item_text {
    width: 100%;
    /* max-width: 768px; */
    padding-left: 2rem;
    border: 1px solid #ccc;
    outline: 4px solid #fff;
    outline-offset: 1px;
    margin: 5px; 
}

/* recruit_btn */

.recruit_btn {
    margin: 0 auto;
    border: 1px solid #ccc;
    max-width: 962px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 21.587px;
    font-size: 22px;
    padding: 38px 0;
}

.recruit_mail {
    padding-top: 25px;
}

/* hp_img */

.hp_img {
    background-color: #fcf9f2;
    margin-top: 141px;
    padding: 123px 0 200px 0;
}

.hp_img_box {
    padding: 127px 0 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 80px 58px;
    max-width: 1920px;
    margin: 0 154px;
}

.hp_img_item p {
    font-size: 30px;
    color: #3a88d6;
    font-weight: 500;
    text-align: start;
    padding-top: 20px;
}

/* information */

.information_2 {
    padding-top: 60px;
}

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

    .director_box {
        padding: 71px 272px 143px 14.68%;
    }

    .director_img {
        width: 35%;
        right: 9%;
    }

    /* hp_img */

    .hp_img_box {
        margin: 0 80px;
    }

}


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

    /* director */

    .director_box {
        padding: 71px 272px 143px 8.68%;
    }

    .director_img {
        width: 32%;
        right: 4%;
    }


    /* recruit */

    .recruit_item_title {
        width: 160px;
    }

    .recruit_item_text {
        width: 600px;
    }

    /* hp_img */

    .hp_img_box {
        margin: 0 60px;
    }

}

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

    /* director */

    .director_container {
        flex-direction: column;
    }

    .director_img {
        position: static;
        order: 1;
        padding: 80px 0 0 0;
        width: 65%;
    }

    .director_box {
        order: 2;
        padding: 50px;
        margin-top: 80px;
    }

    .director_line {
        padding: 90px 0;
    }

    /* greeting */

    .greeting_text {
        font-size: 20px;
    }

    /* recruit */

    .recruit_title, .recruit_subtitle {
        font-size: 25px;
    }

    .recruit_box {
        width: 100%;
    }

    .recruit_item_title, .recruit_item_text {
        display: block;
        width: 100%;
    }

    .recruit_item_title {
        text-align: start;
        border: none;
        padding: 10px 0 10px 20px;
    }

    .recruit_item_text {
        padding: 20px 0 20px 20px;
        outline: none;
        margin: 0; 
    }

    /* hp_img */

    .hp_img_box {
        margin: 0 50px;
    }

}

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

    /* director */

    .career_box {
        width: 100%;
    }
    
    .director_title {
        font-size: 26px;
    }

    .director_box h3 {
        font-size: 30px;
    }

    .director_subtitle {
        font-size: 14px;
    }

    .career_title, .career_detail {
        font-size: 19px;
    }

    /* greeting */

    .greeting {
        padding: 120px 0;
    }

    .greeting_box {
        padding: 90px 80px; 
    }

    /* recruit */

    .recruit_title, .recruit_subtitle {
        font-size: 20px;
    }

    .recruit_btn {
        font-size: 18px;
    }

    .recruit_mail {
        width: 280px;
    }

}

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

    /* director */

    .director_img {
        padding: 50px 0 0 0;
    }

    .director_box {
        margin-top: 50px;
    }

    .director_title {
        font-size: 22px;
    }

    .director_box h3 {
        font-size: 26px;
    }

    .director_subtitle {
        font-size: 12px;
    }

    .career_title, .career_detail {
        font-size: 14px;
    }

    .director_line {
        padding: 50px 0;
    }

    /* greeting */

    .greeting {
        padding: 80px 0;
    }

    .greeting_box {
        padding: 60px 30px; 
    }

    .greeting_text {
        font-size: 16px;
    }

    /* recruit */

    .recruit {
        margin-top: 60px;
    }

    .recruit_title, .recruit_subtitle {
        font-size: 18px;
    }

    .recruit_pet {
        margin: 30px 0;
        width: 60%;
    }

    .recruit_btn {
        font-size: 12px;
        padding: 26px 0;
    }

    .recruit_mail {
        width: 200px;
        padding-top: 20px;
    }

    /* hp_img */

    .hp_img {
        margin-top: 60px;
        padding: 60px 0;
    }

    .hp_img_box {
        padding: 50px 10px;
    }

    .hp_img_item p {
        font-size: 26px;
    }

}

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

    .hp_img_item p {
        font-size: 20px;
    }

}

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