@charset "utf-8";

.mv {
    border-bottom: none;
}

.section_ttl {
    color: var(--blue);
}
.data_list {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
.data_list_ttl {
    border-bottom: 1px solid rgba(var(--border-color),0.2);
}
.data_listitem {
    position: relative;
}
.data_caption {
    text-align: right;
    position: absolute;
}
.data_icon {
    display: block;
    margin: auto;
}
.data_icon_txt {
    text-align: center;
}
.data_icon_txt .counter {
    color: var(--blue);
    text-align: right;
    display: inline-block;
    line-height: 1;
    letter-spacing: -0.01em;
}
.data_graph {
    margin: auto;
    position: relative;
}
.data_graph_number_1 {
    color: var(--blue);
}
.data_graph_number_2 {
    color: var(--white);
}
.data_graph_3_1_number_1,
.data_graph_3_1_number_3 {
    color: var(--white);
}
.data_graph_3_1_number_2,
.data_graph_3_1_number_4 {
    color: var(--blue);
}
.data_graph_number_1,
.data_graph_number_2,
.data_graph_number_3 {
    position: absolute;
    text-align: center;
    display: flex;
    flex-direction: column;
    line-height: 1;
}
.data_graph_number_4 {
    position: absolute;
    line-height: 1;
    display: flex;
}
.data_graph_1_4_number_1,
.data_graph_1_4_number_2 {
    min-width: 130rem;
}
.data_graph_number_1 .counter,
.data_graph_number_2 .counter,
.data_graph_number_3 .counter {
    letter-spacing: -0.01em;
    display: inline-block;
    text-align: right;
}
.data_graph_number_4 .counter {
    letter-spacing: -0.01em;
}
.data_listitem_company {
    position: relative;
}
.data_listitem_company .counter {
    color: var(--blue);
}
.icon_4_1 {
    position: absolute;
}
.data_listitem_company_list {
    display: flex;
    flex-wrap: wrap;
}
.data_listitem_company_list .data_caption {
    text-align: left;
    position: relative;
    bottom: 0;
    right: 0;
    display: block;
}
.data_listitem_company_list .data_legend {
    display: block;
}
@media (min-width: 769px) {
    .section_ttl {
        font-size: 35rem;
        padding: 53rem 36rem;
    }
    .data_list {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .data_list_ttl {
        font-size: 20rem;
        line-height: 1.4;
        padding: 0 20rem;
        min-height: 80rem;
        display: flex;
        align-items: center;
        border-bottom: 1px solid rgba(var(--border-color),0.2);
    }
    .data_listitem {
        border-top: 1px solid rgba(var(--border-color),0.2);
    }
    .data_listitem:not(:nth-child(3n)) {
        border-right: 1px solid rgba(var(--border-color),0.2);
    }
    .data_listitem_inner {
        padding: 27rem 16rem 37rem;
    }
    .data_graph {
        width: 100%;
        max-width: 275rem;
    }
    .data_caption {
        font-size: 14rem;
        line-height: 1.7;
        right: 16rem;
        bottom: 8rem;
    }
    .data_graph_number_1,
    .data_graph_number_2 {
        font-size: 20rem;
        gap: 4rem 0;
    }
    .data_graph_number_1,
    .data_graph_number_2,
    .data_graph_number_3 {
        min-width: 80rem;
    }
    .data_graph_number_1 .counter,
    .data_graph_number_2 .counter,
    .data_graph_number_3 .counter {
        min-width: 58rem;
    }
    .data_graph_number_1 .counter,
    .data_graph_number_2 .counter {
        font-size: 50rem;
    }
    .data_graph_3_1_number_1 .counter,
    .data_graph_3_1_number_2 .counter,
    .data_graph_3_1_number_3 .counter,
    .data_graph_3_1_number_4 .counter {
        font-size: 40rem;
    }
    .data_graph_1_4_number_1 .counter,
    .data_graph_1_4_number_2 .counter {
        font-size: 45rem;
    }
    .data_graph_number_1 .data_unit,
    .data_graph_number_2 .data_unit,
    .data_graph_number_3 .data_unit,
    .data_graph_number_4 .data_unit {
        font-size: 18rem;
        margin-left: 2rem;
    }
    .data_graph_number_4 {
        gap: 0 10rem;
    }
    .data_graph_1_1_number_1 {
        top: 50%;
        left: 50%;
        translate: -120rem -70rem;
    }
    .data_graph_1_1_number_2 {
        right: 6%; 
        top: 50%;
        translate: 0rem -20rem;
    }
    .data_graph_1_2_number_1 {
        top: 50%;
        left: 50%;
        translate: -120rem -40rem;
    }
    .data_graph_1_2_number_2 {
        right: 4%; 
        top: 50%;
        translate: 0rem -40rem;
    }
    .data_graph_1_3_number_1 {
        top: 50%;
        left: 50%;
        translate: -90rem -117rem;
    }
    .data_graph_1_3_number_2 {
        top: 51%;
        right: 11.7%;
    }
    .data_graph_1_4_number_1 {
        top: 50%;
        left: 50%;
        translate: -87rem -115rem;
    }
    .data_graph_1_4_number_2 {
        top: 70%;
        left: 50%;
        translate: -36rem -3rem;
    }
    .data_icon_txt .counter {
        font-size: 90rem;
    }
    .data_icon_txt .data_unit {
        font-size: 32rem;
        margin-left: 7rem;
    }
    .icon_1_5 {
        width: 160rem;
        margin-top: 21rem;
        margin-bottom: 28rem;
    }
    .icon_2_1 {
        width: 131rem;
        margin-top: 20rem;
        margin-bottom: 28rem;
    }
    .icon_2_2 {
        width: 124rem;
        margin-top: 17rem;
        margin-bottom: 29rem;
    }
    .icon_2_3 {
        width: 186rem;
        margin-top: 20rem;
        margin-bottom: 25rem;
    }
    .icon_2_4 {
        width: 112rem;
        margin-top: 8rem;
        margin-bottom: 16rem;
    }
    .icon_2_5 {
        width: 125rem;
        margin-top: 2rem;
        margin-bottom: 18rem;
    }
    .icon_3_1 {
        width: 138rem;
        margin-top: 28rem;
        margin-bottom: 22rem;
    }
    .icon_3_2 {
        width: 86rem;
        margin-top: 14rem;
        margin-bottom: 21rem;
    }
    .icon_4_2 {   
        width: 157rem;
        margin-top: 20rem;
        margin-bottom: 25rem;
    }
    .data_graph_3_1_number_1 {
        top: 24.9%;
        left: 63%;
    }
    .data_graph_3_1_number_2 {
        top: 50%;
        left: 50%;
        translate: -98rem 17rem;
    }
    .data_graph_3_1_number_3 {
        top: 50%;
        left: 50%;
        translate:-95rem -96rem;
    }
    .data_graph_3_1_number_4 {
        flex-direction: column;
        top: -7%;
        left: 50%;
        translate: 65rem 0rem;
    }
    .data_graph_3_1_number_4::before {
        content: '';
        display: block;
        position: absolute;
        top: 12rem;
        right: 104%;
        width: 70rem;
        height: 20rem;
        border-top: 1px solid var(--blue);
        border-left: 1px solid var(--blue);
    }
    .data_graph_3_1_number_1 .data_legend,
    .data_graph_3_1_number_2 .data_legend,
    .data_graph_3_1_number_3 .data_legend,
    .data_graph_3_1_number_4 .data_legend {
        font-size: 12rem;
        line-height: 1.2;
    }
    .data_graph_3_1_number_4 .data_legend {
        margin-top: -7rem;
    }
    .data_listitem_company {
        padding: 58rem 20rem 70rem 385rem;
        border-top: 1px solid rgba(var(--border-color),0.2);
    }
    .data_listitem_company .counter {
        font-size: 82rem;
        line-height: 1;
    }
    .data_listitem_company .data_unit {
        font-size: 26rem;
        margin-left: 6rem;
    }
    .data_listitem_company_list {
        gap: 28rem 36rem;
    }
    .data_listitem_company_list .data_caption {
        font-size: 13rem;
        margin-top: 3rem;
    }
    .data_listitem_company_list .data_legend {
        font-size: 20rem;
    }
    .data_listitem_company_list > p:nth-child(1) {
        width: 380rem;
    }
    .data_listitem_company_list > p:nth-child(2) {
        width: 260rem;
    }
    .icon_4_1 {
        width: 240rem;
        position: absolute;
        top: 0;
        margin: auto;
        left: 78rem;
        bottom: 0;
    }
}
@media (max-width: 768px) {
    .section_people .side_border,
    .section_workstyle .side_border,
    .section_childcare .side_border,
    .section_company .side_border {
        padding-bottom: 60rem;
    }
    .section_people,
    .section_workstyle,
    .section_childcare,
    .section_company {
        position: relative;
    }
    .section_people::before,
    .section_workstyle::before,
    .section_childcare::before,
    .section_company::before,
    .section_people::after,
    .section_workstyle::after,
    .section_childcare::after,
    .section_company::after {
        content: '';
        display: block;
        position: absolute;
        background-color: rgba(var(--border-color),0.2);
    }
    .section_people::before,
    .section_workstyle::before,
    .section_childcare::before,
    .section_company::before {
        bottom: 60rem;
        left: 0;
        width: 100vw;
        height: 1px;
    }
    .section_people::after,
    .section_workstyle::after,
    .section_childcare::after,
    .section_company::after {
        bottom: 0;
        left: calc(50% - 1px);
        width: 1px;
        height: 60rem;
    }
    .section_ttl {
        font-size: 28rem;
        text-align: center;
        padding: 21rem 0;
        border-bottom: 1px solid rgba(var(--border-color),0.2);
    }
    .data_list {
        grid-template-columns: 1fr 1fr;
    }
    .data_list_ttl {
        font-size: 16rem;
        line-height: 1.3;
        padding: 16rem 0;
        text-align: center;
        letter-spacing: -0.02em;
    }
    .data_listitem {
        border-bottom: 1px solid rgba(var(--border-color),0.2);
    }
    .data_listitem:last-of-type {
        border-bottom: none;
    }
    .data_listitem:nth-of-type(odd) {
        border-right: 1px solid rgba(var(--border-color),0.2);
    }
    .data_listitem:has(.data_list_ttl:empty) {
        display: none;
    }
    .data_listitem:not(:has(.data_list_ttl:empty)):nth-of-type(odd):nth-last-of-type(2),
    .section_company .data_listitem:not(:has(.data_list_ttl:empty)):nth-of-type(odd):nth-last-of-type(3),
    .section_company .data_listitem:not(:has(.data_list_ttl:empty)):nth-of-type(even):nth-last-of-type(2) {
        border-bottom: none;
    }
    .data_listitem_inner {
        padding: 16rem 9rem 37rem;
    }
    .data_graph {
        width: 91%;
    }
    .data_caption {
        font-size: 12rem;
        line-height: 1.7;
        bottom: 10rem;
        right: 8rem;
    }
    .data_graph_number_1,
    .data_graph_number_2,
    .data_graph_number_3 {
        min-width: 50rem;
    }
    .data_graph_number_1 .counter,
    .data_graph_number_2 .counter,
    .data_graph_number_3 .counter {
        min-width: 30rem;
    }
    .data_graph_number_1,
    .data_graph_number_2 {
        font-size: 10rem;
        gap: 4rem 0;
    }
    .data_graph_number_1 .counter,
    .data_graph_number_2 .counter {
        font-size: 21rem;
    }
    .data_graph_3_1_number_1 .counter,
    .data_graph_3_1_number_2 .counter,
    .data_graph_3_1_number_3 .counter,
    .data_graph_3_1_number_4 .counter {
        font-size: 19rem;
    }
    .data_graph_1_4_number_1 .counter,
    .data_graph_1_4_number_2 .counter {
        font-size: 20rem;
    }
    .data_graph_number_1 .data_unit,
    .data_graph_number_2 .data_unit {
        font-size: 14rem;
        margin-left: 2rem;
    }
    .data_graph_3_1_number_1 .data_unit,
    .data_graph_3_1_number_2 .data_unit,
    .data_graph_3_1_number_3 .data_unit,
    .data_graph_3_1_number_4 .data_unit {
        font-size: 8.56rem;
    }
    .data_graph_1_1_number_1 {
        top: 24%;
        left: 2%;
    }
    .data_graph_1_1_number_2 {
        left: 59%;
        top: 44%;
    }
    .data_graph_1_2_number_1 {
        top: 35%;
        left: 0%;
    }
    .data_graph_1_2_number_2 {
        top: 35%;
        right: 1%; 
    }
    .data_graph_1_3_number_1 {
        top: 7%;
        left: 12%;
    }
    .data_graph_1_3_number_2 {
        top: 51%;
        right: 5.7%; 
    }
    .data_graph_1_4_number_1 {
        top: 7%;
        left: 12%;
    }
    .data_graph_1_4_number_2 {
        top: 66%;
        right: 26%;
    }
    .data_icon_txt .counter {
        font-size: 40rem;
    }
    .data_icon_txt .data_unit {
        font-size: 18rem;
        margin-left: 3rem;
    }
    .icon_1_5 {
        width: 94rem;
        margin-top: 2rem;
        margin-bottom: 13rem;
    }
    .icon_2_1 {
        width: 78rem;
        margin-bottom: 11rem;
    }
    .icon_2_2 {        
        width: 73rem;
        margin-bottom: 11rem;
    }
    .icon_2_3 {
        width: 106rem;
        margin-bottom: 14rem;
    }
    .icon_2_4 {
        width: 59rem;
        margin-top: 1rem;
        margin-bottom: 11rem;
    }
    .icon_2_5 {
        width: 65rem;
        margin-top: 0rem;
        margin-bottom: 12rem;
    }
    .icon_3_1 {
        width: 85rem;
        margin-bottom: 10rem;
    }
    .icon_3_2 {
        width: 44rem;
        margin-top: 10rem;
        margin-bottom: 10rem;
    }
    .icon_4_2 {   
        width: 90rem;
        margin-bottom: 12rem;
    }
    .data_graph_3_1_number_1 {
        top: 28%;
        left: 62%;
        gap: 2rem 0;
    }
    .data_graph_3_1_number_2 {
        top: 57%;
        left: 9%;
        gap: 2rem 0;
    }
    .data_graph_3_1_number_3 {   
        top: 13%;
        left: 9%;
    }
    .data_graph_3_1_number_4 {
        top: -10%;
        right: 50%;
        translate: 60rem 0;
    }
    .data_graph_3_1_number_4::before {
        content: '';
        display: block;
        position: absolute;
        top: 8rem;
        right: 104%;
        width: 32rem;
        height: 10rem;
        border-top: 1px solid var(--blue);
        border-left: 1px solid var(--blue);
    }
    .data_graph_3_1_number_1 .data_legend,
    .data_graph_3_1_number_2 .data_legend,
    .data_graph_3_1_number_3 .data_legend,
    .data_graph_3_1_number_4 .data_legend {
        font-size: 8rem;
        font-size: 5.71rem;
        line-height: 1.2;
    }
    .data_graph_3_1_number_4 .data_legend {
        padding-top: 5rem;
    }
    .data_listitem_company {
        padding: 18rem 10rem 20rem 50%;
        border-bottom: 1px solid rgba(var(--border-color),0.2);
    }
    .data_listitem_company .counter {
        font-size: 40rem;
        line-height: 1;
    }
    .data_listitem_company .data_unit {
        font-size: 18rem;
    }
    .data_listitem_company_list {
        flex-direction: column;
        gap: 15rem 0;
    }
    .data_listitem_company_list > p:nth-child(1) .data_unit {
        display: block;
    }
    .data_listitem_company_list .data_caption {
        font-size: 12rem;
        margin-top: 3rem;
    }
    .data_listitem_company_list .data_legend {
        font-size: 16rem;
    }
    .icon_4_1 {
        width: 112rem;
        position: absolute;
        top: 38rem;
        left: 26rem;
    }
}