@charset "utf-8";


/*========== top ==========*/
.page_top_wrap { display: flex; flex-direction: column; gap: 20px; }
.page_top_wrap .staff_h1_wrap { display: flex; flex-direction: column; gap: 4px; }
.page_top_wrap .staff_top_img { display: block; width: 100%; max-width: 480px; aspect-ratio: 4 / 3; margin: 0 auto; object-fit: contain; background: #F4F4F4; }
.page_top_wrap .staff_top_content { display: flex; flex-direction: column; gap: 12px; padding: 24px 0; border-bottom: 1px solid #CBCBCB; }
.page_top_wrap .staff_top_content:last-child { border-bottom: none; }
.page_top_wrap .staff_top_button { width: 240px; margin: 0 auto; }
.page_top_wrap .page_top_img { top: -40px; }
@media screen and ( min-width: 768px ) {
    .page_top_wrap .staff_h1_wrap { flex-direction: column-reverse; }
}
@media screen and ( min-width: 1025px ) {
    .page_top_wrap { gap: 40px; }
    .page_top_wrap .staff_top_main_wrap { display: flex; gap: min(5vw, 80px); }
    .page_top_wrap .staff_top_img { align-self: flex-start; flex-shrink: 0; width: 400px; }
    .page_top_wrap .staff_top_contents { flex-grow: 1; }
    .page_top_wrap .staff_top_content { padding: 24px; }
    .page_top_wrap .staff_top_content:first-child { padding-top: 0; }
    .page_top_wrap .staff_top_content:last-child { border-bottom: 1px solid #CBCBCB; }
    .page_top_wrap .staff_top_button { position: absolute; bottom: 0; left: 0; }
}


/*========== middle ==========*/
.page_middle_wrap { display: flex; flex-direction: column; gap: 40px; }
@media screen and ( min-width: 1025px ) {
    .page_middle_contents { width: min(81vw, 1080px); }
    .page_middle_wrap { gap: 80px; }
}

/*----- message -----*/
.staff_message_wrap .staff_message_h2_wrap { text-align: center; }
.staff_message_wrap .staff_message_h2 { margin-top: -1.5em; }
.staff_message_wrap .staff_message_text { margin-top: 40px; }
.staff_message_wrap .staff_message_img_wrap { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.staff_message_wrap .staff_message_img { height: 120px; width: auto; }
@media screen and ( min-width: 1025px ) {
    .staff_message_wrap { position: relative; }
    .staff_message_wrap .staff_message_text { display: block; max-width: calc( 100% - 300px ); margin: 40px auto 0; }
    .staff_message_wrap .staff_message_img { position: absolute; bottom: 0; height: 160px; }
    .staff_message_wrap .staff_message_img:nth-child(1) { left: 0; padding-left: 40px; }
    .staff_message_wrap .staff_message_img:nth-child(2) { right: 0; padding-right: 20px; }
}

/*----- awards -----*/
.staff_awards_wrap { padding: max(5vw, 24px); background: #FFF; }
.staff_awards_wrap .staff_awards_line { display: flex; align-items: center; gap: 8px; }
.staff_awards_wrap .staff_awards_line::before,.staff_awards_wrap .staff_awards_line::after { content: ''; display: block; flex-grow: 1; width: auto; height: 1px; background: #C89E4D; }
.staff_awards_wrap .staff_awards_line .staff_awards_line_img { width: 120px; margin-top: -2%; }
.staff_awards_wrap .staff_awards_content { display: flex; flex-direction: column; gap: 20px; padding: max(5vw, 24px) 0; }
.staff_awards_wrap .staff_awards_text { display: flex; flex-direction: column; gap: 12px; }
.staff_awards_wrap .staff_awards_h2 { font-family: serif; text-align: center; }
.staff_awards_wrap .staff_award_img { display: block; width: 100%; max-width: 480px; aspect-ratio: 4 / 3; margin: 0 auto; object-fit: contain; background: #F4F4F4; }
@media screen and ( min-width: 768px ) {
    .staff_awards_wrap .staff_awards_text { flex-direction: row; gap: 40px; }
}
@media screen and ( min-width: 1025px ) {
    .staff_awards_wrap { padding: 60px 60px; }
    .staff_awards_wrap .staff_awards_line { gap: 20px; }
    .staff_awards_wrap .staff_awards_line .staff_awards_line_img { width: 160px; }
}
@media screen and ( min-width: 1240px ) {
    .staff_awards_wrap .staff_awards_content { flex-direction: row; padding: 40px 24px; }
    .staff_awards_wrap .staff_awards_h2 { text-align: left; }
    .staff_awards_wrap .staff_awards_text { flex-direction: column; gap: 12px; width: 55%; }
    .staff_awards_wrap .staff_award_img_wrap { align-self: flex-end; width: 45%; }
}

/*----- middle_contents -----*/
.staff_middle_contents { display: flex; flex-direction: column; gap: 40px; }
.staff_middle_content { display: flex; flex-direction: column; gap: 24px; padding: max(5vw, 24px); background: #FFF; }
.staff_middle_content .staff_middle_content_heading { padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid #529535; }
.staff_middle_content .staff_middle_content_img { display: block; width: 100%; max-width: 480px; aspect-ratio: 4 / 3; margin: 0 auto; object-fit: contain; background: #F4F4F4; }
@media screen and ( min-width: 1025px ) {
    .staff_middle_content { flex-direction: row; gap: 40px; padding: 60px; }
    .staff_middle_content .staff_middle_content_text_wrap { flex: 1; }
    .staff_middle_content .staff_middle_content_img_wrap { flex: 1; align-self: center; }

}


/*========== bottom ==========*/
.contents_bottom_bg { position: relative; }
.contents_bottom_img { position: absolute; top: -40px; right: 5vw; height: 100px; }
@media screen and ( min-width: 768px ) {
    .contents_bottom_img { right: max(9.5vw, calc(50vw - 540px)); }
}

/*----- private-----*/
.staff_private_wrap { display: flex; flex-direction: column; gap: 24px; }
.staff_private_wrap .staff_private_contents { display: flex; flex-direction: column; gap: 24px; }
.staff_private_wrap .staff_private_content { display: flex; flex-direction: column; gap: 12px; }
.staff_private_wrap .staff_private_img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: #F4F4F4; }
@media screen and ( min-width: 768px ) {
    .staff_private_wrap .staff_private_contents { flex-direction: row; flex-wrap: wrap; gap: 40px; }
    .staff_private_wrap .staff_private_content { width: calc(calc(100% - 40px) / 2); }
}
@media screen and ( min-width: 1025px ) {
    .staff_private_wrap .staff_private_content { width: calc(calc(100% - 80px) / 3); }
}


/*========== 他 ==========*/
.staff_show_bottom_link { justify-content: center; width: 100%; }
.voice_slider .text_lm {font-size: 22px;letter-spacing: 0.03em;}
@media screen and ( min-width: 768px ) {
    .voice_slider .text_lm {font-size: 24px;letter-spacing: 0.08em;}

}