.main_visual {
    position: relative;
    height: 50vh;
    background-image: url("../../images/recruit/main_v.webp");
    background-size: cover;
    background-position: center;
}

.main_visual::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(3, 54, 92, 0.5); 
    z-index: 1;
}
p{
    line-height: 3em;
}
.main_visual * {
    position: relative;
    z-index: 2;
}
.top_main_txt{
    top: 40%;
    max-width: 1080px;
    margin: auto;
    left: 0;
}
.top_main_title{
    color: #fff;
}
.top_main_subtitle{
    color: #fff;
    margin-top: 0;
}
.wrap{
    max-width: 1054px;
    width: 100%;
    margin: 100px auto;
}
.message{
    margin: 100px auto 150px;
}
.wrap2{
    background: #E5F4FF;
    padding: 50px 0;
}
.recruit_parent {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    justify-content: space-between;
    margin: 80px auto;
}
.recruit_parent img{
    max-width: 320px;
    width: 100%;
    justify-content: space-between;
}
.recruit_parent span{
    line-height: 2.2em;
    letter-spacing: 0.8px;
}
.recruitperson_parent span{
    line-height: 2.2em;
    letter-spacing: 0.8px;
}
.recruit_child1 { 
    grid-area: 1 / 1 / 2 / 2; 
    max-width: 320px;
    margin: 0 10px;
}
.recruit_child2 { 
    grid-area: 1 / 2 / 2 / 3; 
    max-width: 320px;
    margin: 0 10px;
}
.recruit_child3 { 
    grid-area: 1 / 3 / 2 / 4; 
    max-width: 320px;
    margin: 0 10px;
}

.recruit_title{
    text-align: center;
    display: grid;
    color: #0E5696;
    font-family:'MPLUS 1p Medium';

}
.recruitperson_parent{
    max-width: 1080px;
    width: 100%;
    padding: 50px 0;
    margin: auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    justify-content: space-between;
}
.recruitperson_parent img{
    max-width: 250px;
    width: 100%;
    justify-content: space-between;
}
.recruitperson_child1 { 
    grid-area: 1 / 1 / 2 / 2; 
    max-width: 250px;
    margin: 0 10px;
}
.recruitperson_child2 { 
    grid-area: 1 / 2 / 2 / 3; 
    max-width: 250px;
    margin: 0 10px;
}
.recruitperson_child3 { 
    grid-area: 1 / 3 / 2 / 4; 
    max-width: 250px;
    margin: 0 10px;
    
}
.sdgs_act_box {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin: 50px auto;
}
.act_box_ttl {
    text-align: center;
    margin: 10px auto;
    color: #0E5696;
    font-size: 20px;
    font-family:'MPLUS 1p Medium';
}
.act_box1 {
    background: #E5F4FF;
    border-radius: 25px;
    max-width: 480px;
    width: 100%;
    padding: 30px 40px;
    margin: 0 10px;
    line-height: 1.7;
}
.act_box2 {
    background: #E5F4FF;
    border-radius: 25px;
    max-width: 480px;
    width: 100%;
    padding: 30px 40px;
    margin: 0 10px;
    line-height: 1.7;
}
.act_box_sdgs_img {
    margin-top: 30px;
}
.act_box_sdgs_img img{
    margin-right: 5px;
}
.wrap2 p{
    color: #0E5696;
    font-family:'MPLUS 1p Medium';
    line-height: 2.3em;
    }  
.sdgs_p{
    letter-spacing: 0.8px;
    line-height: 2;
}
@media screen and (max-width: 540px) {
    .top_main_txt{
        left: 10px;
    }
    .title_en span{
        line-height: 0.9 !important;
    }
    .wrap{
        width: calc(100% - 20px);
    }
    .wrap2 p{
        margin: 10px;
    }
    .recruit_parent{
        justify-items: center;
    }
    .recruit_child1 { 
    grid-area: 1 / 1 / 1 / 4; 
    max-width: calc(100% - 30px);
    margin-top: 50px;
}
.recruit_child2 { 
    grid-area: 2 / 1 / 2 / 4; 
    max-width: calc(100% - 30px);
    margin-top: 50px;
}
.recruit_child3 { 
    grid-area: 3 / 1 / 3 / 4;
    max-width: calc(100% - 30px);
    margin-top: 50px;
}
.recruit_parent img{
    max-width: 540px;
    width: 100%;
}
.wrap2{
    padding: 0;
}

.recruitperson_parent{
    justify-items: center;   
    padding: 0;
}
.recruitperson_parent img{
    max-width: 540px;
    width: 80%;
}
.recruitperson_child1 { 
    grid-area: 1 / 1 / 1 / 4; 
    max-width: calc(100% - 30px);
    margin-top: 50px;
    text-align: center;
}
.recruitperson_child2 { 
    grid-area: 2 / 1 / 2 / 4; 
    max-width: calc(100% - 30px);
    margin-top: 50px;
    text-align: center;
}
.recruitperson_child3 { 
    grid-area: 3 / 1 / 3 / 4;
    max-width: calc(100% - 30px);
    margin-top: 50px;
    text-align: center;
}
    
.sdgs_act_box{
    display: block;
}  
.act_box_sdgs_img{
    display: flex;
}
    .act_box1{
        margin: 40px 10px;
        width: auto;
    }
    .act_box2{
        width: auto;
    }
    
}