@charset "UTF-8";

#pxBase .l-section-kv_text img[src$=".svg"] {
    max-width: unset;
    width: auto;
    height: var(--vw-size180);
}
@media screen and (max-width: 991px) {
    #pxBase .l-section-kv_text img[src$=".svg"] {
        height: min(40px, var(--vw-size100));
    }
}

.c-heading__h2-text--value {
    text-align: center;
}

/* p-value */
/* p-value {} */
.p-value__img01 {
    width: min(900px, 100%);
    margin-inline: auto;
    margin-bottom: var(--vw-size40);
}
.p-value__img01 .img-caps {
    position: static;
    margin-top: var(--vw-size10);
}

/* p-position */
/* .p-position {} */
.p-position__wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--vw-size40);
    margin-block: var(--vw-size40)
}
.p-position__title {
    font-size: var(--vw-size28);
    margin-bottom: 1em;
}
.p-position__text {
    font-size: var(--vw-size18);
    margin-bottom: var(--vw-size24);
}
.p-position__chart {
    background-color: #f3f3f3;
}
.p-position__chart picture {
    display: block;
    /* aspect-ratio: 2000 / 1320; */
    overflow: hidden;
}
#pxBase .p-position__chart picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}
.p-position__chart-caption {
    padding: 1% 7.2% 4%;
    font-size: var(--vw-size16);
    line-height: 1.5;
    text-align: left;
}
/* p-ranking */
/* .p-ranking {} */
.p-ranking__bg {
    background-color: #eeeeef;
    padding: var(--vw-size40) var(--vw-size20);
    margin-top: var(--vw-size40);
}
.p-ranking__wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    /* gap: var(--vw-size40); */
}
.p-ranking__title {
    font-size: var(--vw-size22);
    margin-bottom: 0.5em;
    text-align: center;
    letter-spacing: 0.1em;
}
.p-ranking__item-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 4rem;
    width: 80%;
    margin-inline: auto;
}
.p-ranking__text {
    font-size: var(--vw-size20);
}
.p-ranking__caption {
    text-align: center;
    font-size: var(--vw-size30);
    color: #94252a;
}
.p-ranking__item:last-of-type {
    border-left: 3px solid #fff;
}

/* p-emigration */
.p-emigration {
    background-color: #eeeeef;
}
.p-emigration__wrap {
    width: 100%;
    margin-inline: auto;
}
.p-emigration__wrap02 {
    position: relative;
    background-color: #eee;
    margin-block: var(--vw-size40);
    
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 4rem;
    width: 80%;
    margin-inline: auto;
    padding: var(--vw-size40);
}
.p-emigration__wrap03 {
    position: relative;
    background-color: #fff;
    margin-block: var(--vw-size40);
    
    display: grid;
    grid-template-columns: 1fr 3fr;
    align-items: center;
    gap: 4rem;
    /* width: 80%; */
    /* margin-inline: auto; */
    padding: var(--vw-size40);
    margin: var(--vw-size40);
}
.p-emigration__title {
    font-size: var(--vw-size20);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1em;
    margin-bottom: 2rem;
}
.p-emigration__title02 {
    display: inline;
    font-size: var(--vw-size20);
    background-color: #7b6b63;
    color: #fff;
    letter-spacing: 0.1em;
    padding: 0.3em 1.2em;
    border-radius: 4px;
    
    position: absolute;
    top: -10px;
    left: 0;
}
.p-emigration__title03 {
    font-size: var(--vw-size28);
    margin-bottom: 1rem;
}
.p-emigration__title::before,
.p-emigration__title::after {
    display: block;
    content: '';
    background-color: #ebe3bd;
    background-image: linear-gradient(to right, #ebe3bd, #c0ae72);
    height: 2px;
    width: 4em;
}
.p-emigration__title::after {
    transform: scale(-1);
}
.p-emigration__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--vw-size20);
    font-size: var(--vw-size14);
    width: min(1600px, 90%);
    margin-inline: auto;
}
.p-emigration__list li {
    width: calc(100% / 3 - var(--vw-size20));
    border:1px solid #221714;
    line-height: 1.4;
    padding-block: 0.4em;

    display: flex;
    align-items: center;
    overflow: hidden;
    gap: 1rem;
    height: 4em;
}
.p-emigration__list li:before {
    display: block;
    content: '';
    background-color: #d1b769;
    width: 1em;
    height: 200%;
    transform: rotate(10deg) translateX(-0.5em);
}
.p-emigration__item {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: var(--vw-size30);
    align-items: center;
    margin-block: 1rem;
}
.p-emigration__text {
    padding-top: 1em;
}
.p-emigration__text02 {
    text-align: right;
    margin-top: var(--vw-size10);
    font-size: var(--vw-size10);
}
.p-emigration__text03 {
    font-size: var(--vw-size20);
    margin-block: 1em;
}
.p-emigration__icon {
    position: absolute;
    right: 2%;
    top: 5%;
    width: var(--vw-size170);
}

@media screen and (max-width: 991px) {
    .p-position__wrap {
        grid-template-columns: 1fr;
        margin-bottom: 0;
    }
    .p-position__title {
        font-size: var(--vw-size20);
        text-align: center;
    }
    .p-position__title-word {
        white-space: nowrap;
    }
    .p-position__text {
        font-size:  var(--vw-size15);
    }
    .p-position__chart-caption {
        font-size:  var(--vw-size8);
    }
    .p-ranking {
        padding-top: var(--vw-size40);
    }
    .p-ranking__inner {
        padding-inline: 0;
    }
    .p-ranking__wrap {
        width: min(500px, 100%);
        grid-template-columns: 1fr;
        /* padding: var(--vw-size20) 0 0; */
        /* gap: var(--vw-size40); */
    }
    .p-ranking__item-wrap {
        grid-template-columns: 1fr;
        gap: 2em;
    }
    .p-ranking__item {
        padding-block: var(--vw-size20);
    }
    .p-ranking__img {
        max-width: var(--vw-size200);
        margin-inline: auto;
    }
    .p-ranking__title {
        font-size: var(--vw-size20);
        margin-bottom: 1em;
    }
    .p-ranking__caption {
        font-size: var(--vw-size20);
    }
    .p-ranking__text {
        font-size: var(--vw-size14);
    }
    .p-ranking__item:last-of-type {
        border-left: none;
        border-top: 3px solid #fff;
    }
    .p-emigration__wrap {
        width: min(400px,100%);
    }
    .p-emigration__list {
        width: min(400px,100%);
        display: grid;
        grid-template-columns: 1fr;
        font-size: var(--vw-size16);
    }
    .p-emigration__list li {
        width: 100%;
        font-size: var(--vw-size15);
    }
    .p-emigration__title {
        font-size: var(--vw-size18);
        gap: 0.5rem;
    }
    .p-emigration__title::before,
    .p-emigration__title::after {
        /* width: 1rem; */
        display: none;
    }
    .p-emigration__title02 {
        font-size: var(--vw-size16);
    }
    .p-emigration__title03 {
        font-size: var(--vw-size20);
        text-align: center;
    }
    .p-emigration__wrap02 {
        width: min(500px, 100%);
        grid-template-columns: 1fr;
        padding-inline: var(--vw-size20);
    }
    .p-emigration__wrap03 {
        width: min(500px, 100%);
        grid-template-columns: 1fr;
        padding: var(--vw-size20);
        margin: var(--vw-size20) auto;
    }
    .p-emigration__item {
        grid-template-columns: 1fr;
        gap: var(--vw-size12);
    }
    .p-emigration__text {
        width: 90%;
        margin-inline: auto;
    }
    .p-emigration__text03 {
        font-size: var(--vw-size14);
    }
    .p-emigration__icon {
        width: var(--vw-size100);
        top: 1%;
    }
}

@media screen and (max-width: 768px) {
    .p-value__img01__wrap {
        overflow: scroll;
        margin-inline: calc(var(--side-padding)*2/-1);
    }
    .p-value__img01 {
        width: 200%;
    }
    .scroll-hint-icon-wrap {
        width: 200vw;
    }

}
