.voice{
    background: var(--c-ivory);
}
/* ===== Stats ===== */
.p-voice__stats{
    padding-top: 50px;
    max-width: 1242px;
    margin:0 auto 50px;
    display:flex;
    flex-wrap:wrap;
    gap:50px;
}
.p-voice__stats-pill{
    display:flex;
    flex-shrink:0;
}
.p-voice__stats-card{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:350px;
    height:240px;
    padding:50px 0;
    text-align:center;
}
.p-voice__stats-card--primary{
    background:var(--c-blue);
    color:var(--c-white);
    border-radius:10px 0 0 10px;
}
.p-voice__stats-card--secondary{
    background:var(--c-white);
    color:var(--c-blue);
    border-radius:0 10px 10px 0;
}
.p-voice__stats-num{
    display:flex;
    align-items:baseline;
    justify-content:center;
    gap:2px;
    margin-bottom:38px;
}
.p-voice__stats-num-val{
    font-family:var(--f-en);
    font-weight:400;
    font-size:3.75rem;
    line-height:1;
}
.p-voice__stats-num-unit{
    font-family:var(--f-en);
    font-weight:400;
    font-size:1.25rem;
    line-height:1;
}
.p-voice__stats-card-label{
    font-family:var(--f-a1gothic);
    font-weight:500;
    font-size:1rem;
    line-height:1.625;
}
.p-voice__stats-bars{
    display:flex;
    flex-direction:column;
    gap:24px;
    width:490px;
    max-width:100%;
}
.p-voice__stats-row{
    display:flex;
    flex-direction:column;
    gap:10px;
}
.p-voice__stats-row-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:var(--c-blue);
}
.p-voice__stats-row-label{
    font-family:var(--f-a1gothic);
    font-weight:500;
    font-size:1rem;
    line-height:1;
}
.p-voice__stats-row-val{
    font-family:var(--f-en);
    font-weight:500;
    font-size:1.25rem;
    line-height:1;
}
.p-voice__stats-bar{
    display:flex;
    width:100%;
    height:20px;
    transform:scaleX(0);
    transform-origin:left;
    transition:transform 1s var(--ease);
}
.p-voice__stats-bar.is-inview{
    transform:scaleX(1);
}
.p-voice__stats-bar span{
    display:block;
    height:100%;
}
.p-voice__stats-bar--q1 span:nth-child(1){
    width:59.9%;
    background:var(--c-blue);
}
.p-voice__stats-bar--q1 span:nth-child(2){
    width:32.7%;
    background:var(--c-blue2);
}
.p-voice__stats-bar--q1 span:nth-child(3){
    width:7.4%;
    background:var(--c-white);
}
.p-voice__stats-bar--q2 span:nth-child(1){
    width:46.3%;
    background:var(--c-blue);
}
.p-voice__stats-bar--q2 span:nth-child(2){
    width:41.5%;
    background:var(--c-blue2);
}
.p-voice__stats-bar--q2 span:nth-child(3){
    width:12.2%;
    background:var(--c-white);
}
.p-voice__stats-legend{
    display:flex;
    gap:20px;
    align-items:center;
}
.p-voice__stats-legend-item{
    display:flex;
    align-items:center;
    gap:7px;
}
.p-voice__stats-legend-swatch{
    width:12px;
    height:12px;
    flex-shrink:0;
}
.p-voice__stats-legend-swatch--primary{
    background:var(--c-blue);
}
.p-voice__stats-legend-swatch--secondary{
    background:var(--c-blue2);
}
.p-voice__stats-legend-text{
    font-family:var(--f-a1gothic);
    font-size:1rem;
    line-height:1;
    color:var(--c-black);
}
.p-voice__stats-period{
    font-family:var(--f-a1gothic);
    font-size:1rem;
    line-height:1.625;
    color:var(--c-black);
}
@media(min-width:1440px){
    .p-voice__stats{
        padding-top: 3.472vw;
        max-width: 86.25vw;
        margin-bottom:3.472vw;
        gap:3.472vw;
    }
    .p-voice__stats-card{
        width:24.306vw;
        height:16.667vw;
        padding:3.472vw 0;
    }
    .p-voice__stats-num-val {
        font-size: 4.167vw;
    }
    .p-voice__stats-num{
        margin-bottom: 2.639vw;
    }
    .p-voice__stats-card-label{
        font-size:1.111vw;
    }
    .p-voice__stats-bars{
        width:34.028vw;
        gap:1.667vw;
    }
    .p-voice__stats-row{
        gap:0.694vw;
    }
    .p-voice__stats-row-label{
        font-size:1.111vw;
    }
    .p-voice__stats-row-val{
        font-size:1.389vw;
    }
    .p-voice__stats-bar{
        height:1.389vw;
    }
    .p-voice__stats-legend{
        gap:1.389vw;
    }
    .p-voice__stats-legend-item{
        gap:0.486vw;
    }
    .p-voice__stats-legend-swatch{
        width:0.833vw;
        height:0.833vw;
    }
    .p-voice__stats-legend-text{
        font-size:1.111vw;
    }
    .p-voice__stats-period{
        font-size:1.111vw;
    }
}
@media(min-width:896px) and (max-width:1400px){
    .p-voice__stats{
        padding-left: 40px;
        padding-right: 40px;
    }
}
@media(max-width:896px){
    .p-voice__stats{
        flex-direction:column;
        align-items:stretch;
        gap:20px;
        margin:0 auto 30px;
        padding:0 20px;
        padding-top: 30px;
    }
    .p-voice__stats-pill{
        width:100%;
    }
    .p-voice__stats-card{
        height:130px;
        padding:0;
    }
    .p-voice__stats-card--primary{
        flex:1 1 50%;
    }
    .p-voice__stats-card--secondary{
        flex:1 1 50%;
    }
    .p-voice__stats-num{
        margin-bottom:6px;
    }
    .p-voice__stats-card-label{
        font-size:0.875rem;
        line-height:1.43;
    }
    .p-voice__stats-bars{
        width:100%;
        gap:20px;
    }
    .p-voice__stats-row-label{
        font-size:0.75rem;
    }
    .p-voice__stats-row-val{
        font-size:0.875rem;
    }
    .p-voice__stats-bar{
        height:14px;
    }
    .p-voice__stats-legend-swatch{
        width:10px;
        height:10px;
    }
    .p-voice__stats-legend-text{
        font-size:0.75rem;
    }
    .p-voice__stats-period{
        font-size:0.75rem;
        line-height:1.67;
    }
}
/* ===== Voice card list ===== */
.p-voice__list{
    max-width: 1242px;
    margin-inline: auto;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}
.p-voice__list > li {
    scroll-margin-top: 82px;
}
@media(max-width:1024px){
    .p-voice__list > li {
        scroll-margin-top: 68px;
    }
}
.p-voice__card{
    height:100%;
    background:var(--c-white);
    display:flex;
    flex-direction:column;
    gap:30px;
    padding:30px;
    min-height:259px;
}
.p-voice__card-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}
.p-voice__card-ttl{
    font-family:var(--f-serif);
    font-weight:500;
    font-size:1.375rem;
    line-height:1.545;
    color:var(--c-black);
}
.p-voice__card-icon{
    flex-shrink:0;
    width:68px;
    height:68px;
}
.p-voice__card-body{
    font-family:var(--f-a1gothic);
    font-weight:400;
    font-size:1rem;
    line-height:1.875;
    color:var(--c-black);
}
@media(min-width:1440px){
    .p-voice__list{
        max-width: 86.25vw;
        gap:2.083vw;
    }
    .p-voice__card{
        gap:2.083vw;
        padding:2.083vw;
        min-height:17.986vw;
    }
    .p-voice__card-ttl{
        font-size:1.528vw;
    }
    .p-voice__card-icon{
        width:4.722vw;
        height:4.722vw;
    }
    .p-voice__card-body{
        font-size:1.111vw;
    }
}
@media(min-width:896px) and (max-width:1400px){
    .p-voice__list{
        padding-left: 40px;
        padding-right: 40px;
    }
    .p-voice__stats {
        gap: 0;
        justify-content: space-between;
    }
    .p-voice__stats-pill {
        width: 49%;
    }
    .p-voice__stats-card {
        width: 50%;
        height: 240px;
        padding: 50px 0;
    }
    .p-voice__stats-bars {
        width: 49%;
    }
    .p-voice__list {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media(min-width:896px) and (max-width:1024px){
    .p-voice__stats {
        flex-direction: column;
        align-items: stretch;
        gap: 40px;
    }
    .p-voice__stats-pill {
        width: 100%;
    }
    .p-voice__stats-bars {
        width: 100%;
    }
}
@media(max-width:896px){
    .p-voice__list{
        grid-template-columns:1fr;
        gap:20px;
        padding:0 20px;
    }
    .p-voice__card{
        padding:20px;
        gap:20px;
        min-height:0;
    }
    .p-voice__card-head{
        gap:14px;
    }
    .p-voice__card-ttl{
        font-size:1.25rem;
        line-height:1.5;
    }
    .p-voice__card-body{
        font-size:0.75rem;
    }
}
/* ===== CTA ===== */
.p-voice__list-cta{
    max-width: 1242px;
    margin-inline: auto;
    display:flex;
    padding:50px 0 100px;
}
@media(min-width:1440px){
    .p-voice__list-cta{
        max-width: 86.25vw;
        padding:3.472vw 0 6.944vw;
    }
}
@media(min-width:896px) and (max-width:1400px){
    .p-voice__list-cta{
        padding-left: 40px;
        padding-right: 40px;
    }
}
@media(max-width:896px){
    .p-voice__list-cta{
        padding:50px 20px;
    }
}
@media(max-width:375px){
    .p-voice__stats-num-val {
        font-size: 16vw;
    }
    .p-voice__card-ttl {
        font-size: 4.8vw;
    }
}
