@charset "utf-8";
/* ==========================================================================
   voice.css — 働く人の声を聞く (Voice) subpage.
   ========================================================================== */

.sub_anchor_nav {
    max-width: 500px;
}

.page_mv_ttl img{
    margin-bottom: 5px;
}

/* --------------------------------------------------------------------------
   医師インタビュー (Doctor Interviews)
   -------------------------------------------------------------------------- */
.sec_interview {
    width: 94.93%;
    max-width: 800px;
    margin: 70px auto 0;
}
.sec_interview .sec_ttl{
    max-width: 55%;
    margin: 0 auto;
}
.interview_list { margin-top: 80px; }
.interview_item {
    display: flex;
    align-items: center;
    gap: 90px;
    margin-bottom: 80px;
}
.interview_item.rev { flex-direction: row-reverse; }
.interview_avatar {
    width: 210px;
    height: 210px;
    flex: none;
    border-radius: 50%;
    overflow: hidden;
}
.interview_avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.interview_body { flex: 1; }
.interview_ttl {
    font-size: 20px;
    font-weight: 700;
    color: #0D9A32;
    margin-bottom: 14px;
    line-height: 1.5;
}
.interview_text {
    font-size: 14px;
    color: var(--sub4-color);
    line-height: 1.9;
}
.interview_role {
    font-size: 13px;
    margin-top: 14px;
    text-align: right;
}
.interview_item:nth-child(1) .interview_role { color: #063877; } /* Teal */
.interview_item:nth-child(2) .interview_role { color: #77066F; text-align: left; } /* Blue */
.interview_item:nth-child(3) .interview_role { color: #063877; } /* Pink */
.interview_item:nth-child(4) .interview_role { color: #77066F; text-align: left; } /* Purple */
.interview_item:nth-child(5) .interview_role { color: #063877; } /* Green */
.interview_item:nth-child(6) .interview_role { color: #77066F; text-align: left; } /* Orange */
.interview_item:nth-child(7) .interview_role { color: #063877; } /* Lavender */
.interview_item:nth-child(8) .interview_role { color: #77066F; text-align: left; } /* Navy */
.interview_item:nth-child(9) .interview_role { color: #063877; } /* Red */

/* --------------------------------------------------------------------------
   専攻医アンケート (Resident Survey Section)
   -------------------------------------------------------------------------- */
.sec_survey {
    margin: 90px auto;
    padding: 70px 0 60px;
    background: #F3FCFF;
    max-width: 1350px;
    -webkit-border-radius: 73px;
            border-radius: 73px;
}
.survey_head {
    width: 94.93%;
    max-width: 1065px;
    margin: 0 auto;
}
.survey_lead {
    font-size: 14px;
    color: var(--sub4-color);
    margin: 40px 0 24px;
    line-height: 1.8;
    text-align: center;
}

/* Unified Survey Block */
.survey_block {
    width: 94.93%;
    max-width: 860px;
    margin: 44px auto 0;
    border-radius: 12px;
    padding: 28px 24px;
    box-sizing: border-box;
}

/* Header: Icon + Title */
.survey_header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 20px;
}
.survey_icon {
    width: 102px;
    height: 66px;
    object-fit: contain;
    flex-shrink: 0;
}
.survey_name {
    font-size: 33px;
    font-weight: 400;
    color: #1a75e8;
    margin: 0;
    line-height: 1.3;
}

/* Legend Pill / Capsule */
.survey_legend {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
    max-width: 755px;
    padding: 10px 24px;
    background-color: var(--sub3-color);
    border: 1px solid #d8ecfb;
    border-radius: 9999px;
    box-sizing: border-box;
    margin: 0 auto 24px;
}
.survey_legend_years { display: flex; align-items: center; gap: 10px; }
.survey_legend_item { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #4a6b82; }
.survey_legend_color { width: 16px; height: 16px; border-radius: 2px; display: inline-block; }
.survey_legend_color--2023 { background-color: #c5ded9; }
.survey_legend_color--2024 { background-color: #bbd5ed; }
.survey_legend_color--2025 { background-color: #55a3ed; }
.survey_legend_scales { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.survey_legend_scale_item { font-size: 14px; color: #4a6b82; white-space: nowrap; }

/* Score Section */
.survey_score_wrap { text-align: center; margin-bottom: 16px; }
.survey_score {
    font-family: "Meiryo", sans-serif;
    font-size: 53px;
    font-weight: 700;
    color: var(--main-color);
    line-height: 1.1;
}
.survey_score .max { font-size: 25px; color: var(--sub12-color); }
.survey_avg { font-size: 16px; color: var(--sub12-color); margin-top: 2px; }

/* Graph Area */
.survey_graph {
    margin-top: 12px;
    background: var(--sub3-color);
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(31, 111, 192, .08);
    padding: 20px;
}
.survey_graph img { width: 100%; height: auto; display: block; }

/* Points List Section */
/* ---------- Points List Section (.survey_points) ---------- */
.survey_points {
    width: 94.93%;
    max-width: 1277px;
    margin: 50px auto 0;
    background-color: #ffffff;
    border-radius: 14px;
    border: 1px solid #D5ECF8;
    padding: 32px 40px;
    box-sizing: border-box;
}

.survey_points h3 {
    font-family: var(--font-notoseriif);
    font-size: 33px;
    font-weight: 500;
    color: #353679;
    margin-bottom: 20px;
    padding-left: 0; /* Removed left accent bar */
}

.survey_points h3::before {
    display: none; /* Removed left accent bar */
}

.survey_points ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.survey_points ul li {
    font-size: 18px;
    color: #356AAD; /* Soft blue text matching design */
    line-height: 1.8;
    padding-left: 18px;
    position: relative;
    margin-bottom: 10px;
}

.survey_points ul li:last-child {
    margin-bottom: 0;
}

.survey_points ul li::before {
    content: '・';
    position: absolute;
    left: 0;
    top: 0;
    color: #356AAD;
    font-weight: bold;
}


@media only screen and (min-width: 768px) and (max-width: 1350px) {
    .sub_anchor_nav {
        max-width: 5.00rem;
    }

    /* --------------------------------------------------------------------------
       医師インタビュー (Doctor Interviews)
       -------------------------------------------------------------------------- */
    .sec_interview {
        max-width: 10.00rem;
        margin: .70rem auto 0;
    }
    .interview_list { margin-top: .40rem; }
    .interview_item {
        gap: .48rem;
        margin-bottom: .56rem;
    }
    .interview_avatar {
        width: 2.10rem;
        height: 2.10rem;
    }
    .interview_ttl {
        font-size: .20rem;
        margin-bottom: .14rem;
    }
    .interview_text {
        font-size: .14rem;
    }
    .interview_role {
        font-size: .13rem;
        margin-top: .14rem;
    }

    /* --------------------------------------------------------------------------
       専攻医アンケート (Resident Survey Section)
       -------------------------------------------------------------------------- */
    .sec_survey {
        margin: .90rem 0 0;
        padding: .70rem 0 .60rem;
    }
    .survey_head {
        max-width: 10.65rem;
    }
    .survey_lead {
        font-size: .14rem;
        margin: .40rem 0 .24rem;
    }

    /* Unified Survey Block */
    .survey_block {
        max-width: 8.60rem;
        margin: .44rem auto 0;
        border-radius: .12rem;
        padding: .28rem .24rem;
    }

    /* Header: Icon + Title */
    .survey_header {
        gap: .16rem;
        margin-bottom: .20rem;
    }
    .survey_icon {
        width: 1.02rem;
        height: .66rem;
    }
    .survey_name {
        font-size: .33rem;
    }

    /* Legend Pill / Capsule */
    .survey_legend {
        gap: .12rem;
        max-width: 7.55rem;
        padding: .10rem .24rem;
        border: .01rem solid #d8ecfb;
        margin: 0 auto .24rem;
    }
    .survey_legend_years { gap: .20rem; }
    .survey_legend_item { gap: .08rem; font-size: .14rem; }
    .survey_legend_color { width: .16rem; height: .16rem; border-radius: .02rem; }
    .survey_legend_scales { gap: .10rem; }
    .survey_legend_scale_item { font-size: .14rem; }

    /* Score Section */
    .survey_score_wrap { margin-bottom: .16rem; }
    .survey_score {
        font-size: .53rem;
    }
    .survey_score .max { font-size: .25rem; }
    .survey_avg { font-size: .16rem; margin-top: .02rem; }

    /* Graph Area */
    .survey_graph {
        margin-top: .12rem;
        border-radius: .10rem;
        box-shadow: 0 .08rem .20rem rgba(31, 111, 192, .08);
        padding: .20rem;
    }

    /* Points List Section */
    .survey_points {
        max-width: 10.65rem;
        margin: .50rem auto 0;
        border-radius: .16rem;
        padding: .32rem .40rem;
    }

    .survey_points h3 {
        font-size: .26rem;
        margin-bottom: .20rem;
    }

    .survey_points ul li {
        font-size: .14rem;
        padding-left: .18rem;
        margin-bottom: .10rem;
    }
}
/* --------------------------------------------------------------------------
   SP Responsive Adjustments
   -------------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
    .sub_anchor_nav{ max-width: 6.8rem; }
    .sec_interview { margin-top: .9rem; max-width: 6.8rem; }
    .sec_interview .sec_ttl{ max-width: 100%; }
    .interview_list { margin-top: .5rem; }
    .interview_item, .interview_item.rev {
        flex-direction: column;
        gap: .3rem;
        margin-bottom: .8rem;
        text-align: center;
    }
    .interview_body{ text-align: left; }
    .interview_avatar { width: 2.6rem; height: 2.6rem; }
    .interview_ttl { font-size: .34rem; }
    .interview_text { font-size: .26rem; text-align: left; }
    .interview_role { text-align: left; font-size: .24rem; }

    .sec_survey { margin-top: 1rem; padding: .8rem .2rem; max-width: 6.6rem;border-radius: .73rem; }
    .survey_head{ width: 100%; }
    .survey_lead { font-size: .26rem; margin: .6rem 0; }
    .survey_block { width: 100%; margin-top: .6rem; padding: .4rem 0; }
    .survey_header { gap: .2rem; margin-bottom: .3rem; }
    .survey_icon { width: 1.2rem; height: .8rem; }
    .survey_name { font-size: .33rem; }

    .survey_legend {
        border-radius: 16px;
        padding: 12px 16px;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    .survey_legend_years { gap: 12px; }
    .survey_legend_scales { gap: 6px 12px; font-size: 12px; }

    .survey_legend_item span,
    .survey_legend_scale_item{
        font-size: .24rem;
    }

    .survey_score { font-size: .8rem; }
    .survey_graph { padding: .24rem; }
    .survey_points {
        width: 100%;
        margin: .60rem auto 0;
        border-radius: .16rem;
        padding: .40rem .32rem;
    }

    .survey_points h3 {
        font-size: .36rem;
        margin-bottom: .24rem;
    }

    .survey_points ul li {
        font-size: .24rem;
        padding-left: .24rem;
        margin-bottom: .16rem;
        line-height: 1.6;
    }

    .survey_avg{
        font-size: .24rem;
    }
}