@charset "utf-8";

/* interview */
.interview_ttl {
    color: var(--blue);
    font-weight: 700;
    display: flex;
    flex-direction: column;
    text-transform: uppercase;
}
.interview_ttl_center {
    align-items: center;
    text-align: center;
}
.interview_ttl_txt {
    line-height: 1.4;
}
@media (min-width: 769px) {
    .interview_section {
        padding-inline: 40rem;
    }    
    .interview_ttl_txt {
        font-size: 20rem;
    }
}
@media (max-width: 768px) {
    .interview_section {
        padding-inline: 24rem;
    }
    .interview_ttl {
        align-items: center;
    }
    .interview_ttl_txt {
        font-size: 16rem;
    }
}

/* hr_line */
.hr_line {
    width: 100%;
    margin: 0;
    border: none;
    background: url(../../images/common/line_diagonal.png) repeat-x center / auto 100%;
    border-top: 1px solid rgba(var(--border-color),0.2);
    border-bottom: 1px solid rgba(var(--border-color),0.2);
}
@media (min-width: 769px) {
    .hr_line {
        height: 120rem;
    }
}
@media (max-width: 768px) {
    .hr_line {
        height: 60rem;
    }
}

/* interview_mv */
.interview_mv {
    border-top: 1px solid rgba(var(--border-color),0.2);
}
.interview_mv_content {
    width: 100%;
    position: relative;
}
.interview_mv_ttl {
    line-height: 1.3;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: var(--blue);
    writing-mode: vertical-rl;
    position: absolute;
}
.interview_mv_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.interview_mv_copy {
    font-weight: 700;
    letter-spacing: -0.03em;
    position: relative;
    z-index: 1;
}
.interview_mv_profile_tag {
    display: inline-block;
    font-weight: 700;
    line-height: 1.5;
    color: var(--white);
    background-color: var(--blue);
}
.interview_mv_profile_name {
    display: flex;
    align-items: flex-end;
    color: var(--blue);
    font-weight: 700;
    gap: 17rem;
}
.interview_mv_profile_initial {
    align-self: flex-start;
}
.interview_mv_profile_post {
    line-height: 1.4;
    align-self: flex-end;
}
.interview_mv_profile_history {
    line-height: 1.7;
}
@media (min-width: 769px) {
    .interview_mv_inner {
        padding-inline: 40rem;
    }
    .interview_mv_content {
        min-height: 700rem;
    }
    .interview_mv_ttl {
        font-size: 20rem;
        top: 20rem;
        right: calc(100% + 12rem);
    }
    .interview_mv_img {
        width: 50%;
        height: 100%;
        position: absolute;
        top: 0;
        right: 0;
    }
    .interview_mv_txt_area {
        padding: 22rem 20rem;
    }
    .interview_mv_copy {
        font-size: 60rem;
        line-height: 1.3;
        padding-right: 250rem;
    }
    .interview_mv_profile:not(.interview_mv_profile_space_l) {
        margin-top: 80rem;
    }
    .interview_mv_profile_space_l {
        margin-top: 132rem;
        width: 45%;
    }
    .interview_mv_profile_tag {
        padding: 4rem 18rem;
        font-size: 16rem;
    }
    .interview_mv_profile_name {
        margin-top: 32rem;
    }
    .interview_mv_profile_initial {
        font-size: 35rem;
        line-height: 1;
    }
    .interview_mv_profile_post {
        font-size: 16rem;
    }
    .interview_mv_profile_history {
        font-size: 16rem;
        margin-top: 24rem;
    }
}
@media (max-width: 768px) {
    .interview_mv_inner {
        padding-inline: 24rem;
    }
    .interview_mv_ttl {
        font-size: 16rem;
        top: 5rem;
        right: calc(100% + 2rem);
    }
    .interview_mv_img {
        width: 100%;
        height: 409rem;
    }
    .interview_mv_txt_area {
        margin-top: -112rem;
    }
    .interview_mv_copy {
        font-size: 36rem;
        line-height: 1.25;
    }
    .interview_mv_profile {
        margin-top: 46rem;
        padding: 0 16rem 40rem;
    }
    .interview_mv_profile_tag {
        padding: 4rem 12rem;
        font-size: 14rem;
    }
    .interview_mv_profile_name {
        margin-top: 16rem;
    }
    .interview_mv_profile_initial {
        font-size: 35rem;
        line-height: 1;
    }
    .interview_mv_profile_post {
        font-size: 16rem;
    }
    .interview_mv_profile_history {
        font-size: 14rem;
        margin-top: 16rem;
    }
}

.animation_ready .interview_mv_copy .text_marker {
    background-size: 0% 80%;
    color: var(--blue);
    transition: background-size 0.3s, color 0.3s;
}
.animation_loaded .interview_mv_copy.is_animated .text_marker {
    background-size: 100% 80%;
    color: var(--white);
}

/* qa */
.qa {
    padding-top: 40rem;
}
.qa_ttl_en {
    letter-spacing: -0.03em;
    line-height: 1.3;
}
.q_ttl {
    background-color: var(--blue);
    color: var(--white);
    line-height: 1.4;
    font-weight: 700;
    display: flex;
    gap: 16rem;
}
.a_ttl {
    font-weight: 700;
    line-height: 1.5;
    color: var(--blue);
}
.a_txt {
    line-height: 1.7;
    text-align: justify;
}
@media (min-width: 769px) {
    .qa_ttl_en {
        font-size: 64rem;
    }    
    .qa_content {
        margin-top: 40rem;
    }
    .qa_block {
        padding-bottom: 100rem;
    }
    .q_ttl {
        padding: 22rem 21rem;
        font-size: 20rem;
    }
    .q_ttl_num {
        font-size: 24rem;
        letter-spacing: 0.1em;
        line-height: 1.3;
    }
    .qa_txt_area {
        padding: 35rem 35rem 0;
        display: flex;
        justify-content: space-between;
        gap:36rem;
    }
    .a_ttl {
        width: 524rem;
        font-size: 35rem;
    }
    .a_txt {
        width: 488rem;
        font-size: 16rem;
    }
    .qa_img {
        margin-top: 56rem;
    }
}
@media (max-width: 768px) {
    .qa_ttl_en {
        font-size: 52rem;
    }    
    .qa_content {
        margin-top: 40rem;
    }
    .qa_block {
        padding-bottom: 60rem;
    }
    .q_ttl {
        padding: 13rem 21rem 16rem 19rem;
        font-size: 18rem;
    }
    .q_ttl_num {
        font-size: 20rem;
        letter-spacing: 0.1em;
        line-height: 1.5;
    }
    .qa_txt_area {
        padding: 24rem 16rem 0;
    }
    .a_ttl {
        font-size: 24rem;
    }
    .a_txt {
        font-size: 14rem;
        letter-spacing: -0.03em;
        margin-top: 16rem;
    }
    .qa_img {
        margin-top: 24rem;
    }
}

/* msg */
.msg_ttl_en {
    letter-spacing: -0.03em;
    line-height: 1.3;
}
.msg_box {
    position: relative;
    overflow: hidden;
}
.msg_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.msg_txt_area {
    background-color: var(--blue);
}
.msg_copy {
    font-weight: 700;
}
.msg_txt {
    color: var(--white);
    font-size: 16rem;
    line-height: 1.7;
    font-weight: 700;
}
@media (min-width: 769px) {
    .msg_ttl_en {
        font-size: 64rem;
    }    
    .msg_content {
        padding-block: 20rem 40rem;
    }
    .msg_box {
        display: flex;
        margin-top: 40rem;
    }
    .msg_img,
    .msg_txt_area {
        width: 50%;
    }
    .msg_txt_area {
        padding: 51rem 80rem;
        display: flex;
        align-items: center;
    }
    .msg_copy {
        color: var(--white);
        position: absolute;
        bottom: -4rem;
        left: 0;
        line-height: 1.4;
        font-size: 32rem;
    }
    .msg_copy_bg {
        background: linear-gradient(transparent 0, var(--blue) 0) no-repeat left center / 100% 80%;
    }
}
@media (max-width: 768px) {
    .msg_ttl_en {
        font-size: 40rem;
    }    
    .msg_content {
        padding-block: 40rem 60rem;
    }
    .msg_box {
        margin-top: 40rem;
    }
    .msg_img,
    .msg_txt_area {
        width: 100%;
    }
    .msg_txt_area {
        padding: 40rem 32rem;
    }
    .msg_copy {
        color: var(--blue);
        line-height: 1.4;
        font-size: 24rem;
        width: 105%;
    }
    .msg_copy_bg {
        background: linear-gradient(transparent 0, var(--white) 0) no-repeat left center / 100% 80%;
    }
    .msg_txt {
        margin-top: 24rem;
    }
}

/* about_person */
.about_person {
    display: flex;
}
.about_person_ttl {
    width: 100%;
    display: flex;
    flex-direction: column;
    color: var(--blue);
    font-weight: 700;
    border-bottom: 1px solid rgba(var(--border-color),0.2);
}
.about_person_ttl_en {
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}
.about_person_ttl_txt {
    line-height: 1.4;
}
.about_person_copy {
    font-weight: 700;
}
.about_person_txt {
    line-height: 1.7;
    margin-top: 16rem;
}
@media (min-width: 769px) {
    .about_person_section {
        width: 50%;
    }
    .about_person_section + .about_person_section {
        border-left: 1px solid rgba(var(--border-color),0.2);
    }
    .about_person_ttl {
        height: 151rem;
        justify-content: center;
        padding: 24rem;
    }
    .about_person_ttl_en {
        font-size: 36rem;
    }
    .about_person_ttl_txt {
        font-size: 20rem;
    }
    .about_person_content {
        padding: 20rem 18rem 60rem;
    }
    .about_person_txt_area {
        margin-top: 16rem;
    }
    .about_person_copy {
        font-size: 24rem;
        line-height: 1.4;
    }
    .about_person_txt {
        font-size: 16rem;
    }    
}
@media (max-width: 768px) {
    .about_person {
        flex-direction: column;
    }
    .about_person_section + .about_person_section {
        border-top: 1px solid rgba(var(--border-color),0.2);
    }
    .about_person_ttl {
        padding-block: 24rem;
        gap: 4rem;
    }
    .about_person_ttl_en {
        font-size: 28rem;
    }
    .about_person_ttl_txt {
        font-size: 14rem;
    }
    .about_person_content {
        padding: 24rem 16rem 60rem;
    }
    .about_person_txt_area {
        margin-top: 24rem;
    }
    .about_person_copy {
        font-size: 20rem;
        line-height: 1.5;
    }
    .about_person_txt {
        font-size: 14rem;
    }
}

/* schedule_content */
.schedule_ttl_en {
    font-weight: 700;
    letter-spacing: -0.03em;
}
.schedule_flow_list li {
    display: flex;
    position: relative;
}
.schedule_flow_list li:not(.schedule_flow_txt_center) {
    align-items: flex-start;
}
.schedule_flow_list li.schedule_flow_txt_center {
    align-items: center;
}
.schedule_flow_time_wrap {
    display: flex;
    align-items: center;
}
.schedule_flow_time {
    color: var(--blue);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}
.schedule_flow_icon {
    position: relative;
    z-index: 1;
}
.schedule_flow_name {
    font-weight: 700;
    line-height: 1.4;
}
.schedule_flow_txt {
    line-height: 1.7;
}
@media (min-width: 1211px) {
    .schedule_flow_list li:not(:last-child) {
        height: 142rem;
    }
}
@media (max-width: 1210px) and (min-width: 769px) {
    .schedule_flow_list li:not(:last-child) {
        height: auto;
    }
}
@media (min-width: 769px) {
    .schedule_content {
        padding-block: 40rem 100rem;
    }
    .schedule_ttl_en {
        font-size: 64rem;
        line-height: 1.3;
    }
    .schedule_flow {
        display: flex;
        justify-content: center;
        gap: 30rem;
        margin-top: 60rem;
    }
    .schedule_flow_list {
        width: calc(50% - 15rem);
    }
    .schedule_flow_list li {
        gap: 16rem;
    }    
    .schedule_flow_list li:not(:last-child) {
        padding-bottom: 50rem;
    }
    .schedule_flow_time_wrap {
        gap: 10rem;
    }    
    .schedule_flow_time {
        width: 70rem;
        font-size: 24rem;
    }
    .schedule_flow_icon {
        width: 92rem;
    }
    .schedule_flow_list li:not(:last-child)::after {
        content: "";
        display: block;
        height: 100%;
        position: absolute;
        top: 0;
        background: url(../images/schedule_line.svg) repeat-y center / 100% auto;    
        width: 2rem;
        left: 126rem;
    }
    .schedule_flow_txt_area {
        width: calc(100% - 188rem);
    }
    .schedule_flow_name {
        font-size: 20rem;
    }
    .schedule_flow_txt {
        font-size: 16rem;
        margin-top: 4rem;
    }
}
@media (max-width: 768px) {
    .schedule_content {
        padding-block: 40rem 60rem;
    }
    .schedule_ttl_en {
        font-size: 40rem;
        line-height: 1.1;
        margin-bottom: 4rem;
    }
    .schedule_flow {
        margin-top: 40rem;
    }
    .schedule_flow_list {
        width: 100%;
    }
    .schedule_flow_list li {
        gap: 12rem;
    }
    .schedule_flow_list:has(+ .schedule_flow_list) li,
    .schedule_flow_list:not(:has(+ .schedule_flow_list)) li:not(:last-child) {
        padding-bottom: 40rem;
    }
    .schedule_flow_time {
        width: 52rem;
        font-size: 16rem;
    }
    .schedule_flow_icon {
        width: 64rem;
    }
    .schedule_flow_list li::after {
        content: "";
        display: block;
        height: 100%;
        position: absolute;
        top: 0;
        background: url(../images/schedule_line.svg) repeat-y center / 100% auto;    
        width: 2rem;
        left: 84rem;
    }
    .schedule_flow_list:not(:has(+ .schedule_flow_list)) li:last-child::after {
        display: none;
    }
    .schedule_flow_txt_area {
        width: calc(100% - 128rem);
    }
    .schedule_flow_name {
        font-size: 18rem;
    }
    .schedule_flow_txt {
        font-size: 14rem;
        margin-top: 6rem;
    }
}

/* other */
.other_ttl_en {
    font-weight: 700;
    letter-spacing: -0.03em;
}
.other_slide a {
    display: block;
    position: relative;
}
.other_slide_data {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    display:flex;
}
.other_slide_position {
    background-color: var(--blue);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
}
.other_slide_en {
    position: absolute;
    z-index: 1;
}
.other_slide_btn_wrap {
    display: flex;
}
.other_slide_btn {
    border: 1px solid var(--blue);
    background-color: var(--white);
    position: relative;
}
.other_slide_btn::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    clip-path: polygon(0 0, 0% 100%, 100% 50%);
    background-color: var(--blue);
}
.other_slide_prev {
    scale: -1;
}
@media (min-width: 769px) {
    .other_ttl {
        padding: 40rem 24rem;
    }
    .other_ttl_en {
        font-size: 64rem;
        line-height: 1.3;
    }
    .other_inner {
        position: relative;
    }
    .other_slide_position {
        padding: 3rem 12rem;
        font-size: 10rem;
    }
    .other_slide_en {
        width: 21rem;
        top: 10rem;
        right: 11rem;
    }
    .other_slide_txt {
        font-size: 19rem;
    }
    .other_slide_btn_wrap {
        width: 140rem;
        gap: 8rem;
        position: absolute;
        top: -130rem;
        right: 24rem;
    }
    .other_slide_btn {
        width: 66rem;
        height: 66rem;
        cursor: pointer;
    }
    .other_slide_btn::after {
        width: 14.4%;
        height: 23.52%;
    }
    @media (hover: hover) {
        .other_slide_btn,
        .other_slide_btn::after {
            transition: background-color 0.3s;
        }
        .other_slide_btn:hover {
            background-color: var(--blue);
        }
        .other_slide_btn:hover::after {
            background-color: var(--white);
        }
    }
}
@media (max-width: 768px) {
    .other_ttl_wrap {
        padding-inline: 24rem;
    }
    .other_ttl {
        padding: 40rem 16rem;
    }
    .other_ttl .interview_ttl {
        align-items: flex-start;
        gap: 8rem;
    }
    .other_ttl_en {
        font-size: 40rem;
        line-height: 1.1;
    }
    .other_slider {
        width: calc(100% + 24rem);
    }
    .other_slide_position {
        width: 49rem;
        height: 22rem;
        font-size: 11rem;
    }
    .other_slide_en {
        width: 20rem;
        top: 10rem;
        right: 8rem;
    }
    .other_slide_txt {
        font-size: 19rem;
    }
    .other_slide_btn_wrap {
        width: 100%;
        gap: 8rem;
        margin-top: 16rem;
        justify-content: flex-end;
        padding-bottom: 60rem;
    }
    .other_slide_btn {
        width: 48rem;
        height: 48rem;
    }
    .other_slide_btn::after {
        width: 13rem;
        height: 15rem;
    }
}