/* 星評価の見た目 */
.acf-rating {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    --star-size: 20px;
    --star-gap: 4px;
    --star-color-full: #00BA64;
    /* 緑 */
    --star-color-empty: #E6E6E6;
    /* グレー */
    font-size: 0;
    /* 星の隙間の余白調整（数値は別要素に） */
}

.acf-rating__stars {
    display: inline-flex;
    gap: var(--star-gap);
    line-height: 1;
}

.acf-rating__star {
    display: inline-flex;
    width: var(--star-size);
    height: var(--star-size);
}

/* currentColor で色を切り替え */
.acf-rating__star.is-full svg {
    fill: var(--star-color-full);
}

.acf-rating__star.is-empty svg {
    fill: var(--star-color-empty);
}

/* 半星用（左半分だけ緑、全体グレーの上に重ねる） */
.acf-rating__star.is-half .half .empty {
    fill: var(--star-color-empty);
}

.acf-rating__star.is-half .half .half-fill {
    fill: var(--star-color-full);
}

/* 数値の表示（例: 4 や 4.5） */
.acf-rating__value {
    color: #00BA64;
    text-align: center;
    font-family: Roboto;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    position: relative;
    top: 3px;
}

/* ===== Likert Scale ===== */
.acf-scale {
    --track-color: #E6E6E6;
    /* ライン/未選択ドット（薄いグレー） */
    --active-color: #00BA64;
    /* 選択ドット（緑） */
    --label-color: #000;
    /* 左右ラベル */
    --text-color: #000;
    /* 質問文の色 */
    --dot-size: 10px;
    /* PHPから上書き可 */
    --dot-gap: 24px;
}

.acf-scale__question {
    color: var(--text-color);
    font-weight: 600;
    margin-bottom: 8px;
}

.acf-scale__row {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 30px;
}

.acf-scale__edge {
    color: var(--label-color);
    white-space: nowrap;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

/* 右側ラベルを右寄せしたい場合は幅を指定して調整 */
.acf-scale__edge--left,
.acf-scale__edge--right {
    width: 3.5em;
}

.acf-scale__track {
    position: relative;
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0 var(--dot-size);
    /* 端の丸がはみ出ないよう少し内側に */
}

/* 背景の水平ライン */
.acf-scale__track::before {
    content: "";
    position: absolute;
    left: var(--dot-size);
    right: var(--dot-size);
    top: 50%;
    height: 2px;
    background: var(--track-color);
    transform: translateY(-50%);
}

/* ドット（未選択） */
.acf-scale__dot {
    width: var(--dot-size);
    height: var(--dot-size);
    border-radius: 50%;
    background: var(--track-color);
    border: 2px solid var(--track-color);
    box-sizing: border-box;
}

/* 選択位置だけ緑 */
.acf-scale__dot.is-active {
    background: var(--active-color);
    border-color: var(--active-color);
    z-index: 1;
}

/* アクセシビリティ（画面外テキスト） */
.screen-reader-text {
    position: absolute !important;
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.Single-curriculum__top__section {
    padding-bottom: 60px;
}

@media screen and (max-width: 960px) {
    .Single-curriculum__top__section {
        padding-bottom: 16px;
    }
}

.Single-curriculum__title::before {
    display: none;
}

section.voice-wrap {
    background-color: #EDFCDD;
    padding: 80px 0;
    display: flex;
    flex-direction: column;
    gap: 56px;
}

@media screen and (max-width: 960px) {
    section.voice-wrap {
        padding: 40px 16px;
        gap: 24px;
    }
}

.voice-box {
    width: 960px;
    margin: auto;
    background-color: #fff;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.08);
    border-radius: 20px;
    padding: 56px 80px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

@media screen and (max-width: 960px) {
    .voice-box {
        width: 100%;
        padding: 32px 16px;
        gap: 24px;
    }
}

.voice-box .star-image {
    display: flex;
    justify-content: space-between;
}

@media screen and (max-width: 960px) {
    .voice-box .star-image {
        flex-direction: column;
        gap: 16px;
    }
}

.voice-box .star-image .left {
    display: flex;
    flex-direction: column;
    width: 390px;
    gap: 16px;
}



@media screen and (max-width: 960px) {
    .voice-box .star-image .left {
        width: 100%;
    }
}

.voice-box .star-image .left .content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.voice-box .star-image .left .content h2 {
    font-size: 12px;
    font-style: normal;
    font-family: "NotoSansJpMedium";
    font-weight: 500;
    line-height: 150%;
}

.voice-box .star-image .left .acf-scale {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.voice-box .star-image .left .acf-scale h2 {
    font-size: 12px;
    font-style: normal;
    font-family: "NotoSansJpMedium";
    font-weight: 500;
    line-height: 150%;
}

.voice-box .star-image .right {
    width: 354px;
}

@media screen and (max-width: 960px) {
    .voice-box .star-image .right {
        width: 100%;
    }
}

.voice-box .star-image .right img {
    border: 1px solid #000;
}

.voice-box .enquete-text {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

@media screen and (max-width: 960px) {
    .voice-box .enquete-text {
        gap: 16px;
    }
}

.voice-box .enquete-text .content {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.voice-box .enquete-text .content h2 {
    color: var(--color-Green, #00BA64);
    font-size: 18px;
    font-style: normal;
    font-family: "NotoSansJpMedium";
    font-weight: 500;
    line-height: 150%;
}

@media screen and (max-width: 960px) {
    .voice-box .enquete-text .content h2 {
        font-size: 16px;
    }
}

.voice-box .enquete-text .content p {
    color: var(--color-black, #222);
    font-size: 15px;
    font-style: normal;
    font-family: "NotoSansJpMedium";
    font-weight: 500;
    line-height: 150%;
}

@media screen and (max-width: 960px) {
    .voice-box .enquete-text .content p {
        font-size: 14px;
    }
}

.voice-box .company {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.voice-box .company div {
    display: flex;
}

.voice-box .company div span {
    color: #222;
    font-size: 12px;
    font-style: normal;
    font-family: "NotoSansJpMedium";
    font-weight: 500;
    line-height: 150%;
    /* 18px */
}

.voice-box .company .company-logo img {
    width: auto;
    max-width: 181px;
}

@media screen and (max-width: 960px) {
    .voice-box .company .company-logo img {
        max-width: 136px;
    }
}

section.voice-wrap .voice-return {
    display: flex;
    align-items: center;
    justify-content: center;
}

section.voice-wrap .voice-return a {
    color: var(--color-black, #222);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-family: "NotoSansJpBold";
    font-weight: 700;
    line-height: 120%;
    letter-spacing: 1.6px;
    border-radius: 4px;
    border: 1px solid var(--color-black, #222);
    background: var(--color-white, #FFF);
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    display: flex;
    padding: 16px 40px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    transition: all .3s ease-in-out;
}

section.voice-wrap .voice-return a:hover {
    opacity: .7;
}

section.voice-wrap .voice-return a::before {
    content: "";
    display: block;
    width: 8px;
    height: 11px;
    background-image: url("../../images/return-button.svg");
    background-repeat: no-repeat;
    background-size: cover;
}

.voice-more {
    display: flex;
    justify-content: center;
}

.voice-more a {
    display: flex;
    padding: 16px 40px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    background: var(--gradation, linear-gradient(90deg, #A8DB4C 0%, #37BFAA 100%));
    color: #FFF;
    text-align: center;
    font-family: "NotoSansJpBold";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    /* 19.2px */
    letter-spacing: 1.6px;
    transition: all .3s ease-in-out;
}

.voice-more a:hover {
    opacity: .7;
}

/* ===== Pagination ===== */
.p-pagination {
    display: flex;
    justify-content: center;
    margin: 24px 0;
}

.p-pagination__list {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.p-pagination__item {
    display: flex;
}

.p-pagination__num,
.p-pagination__num:link,
.p-pagination__num:visited {
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    border-radius: 9999px;
    text-decoration: none;
    color: #666;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 1px;
}

@media screen and (max-width: 960px) {

    .p-pagination__num,
    .p-pagination__num:link,
    .p-pagination__num:visited {
        width: 48px;
        height: 48px;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        letter-spacing: 0.8px;
    }
}

.p-pagination__num:hover {
    text-decoration: none;
}

.p-pagination__num.is-current {
    background: #00BA64;
    color: #fff;
}

.p-pagination__dots span {
    color: #666;
    display: inline-block;
    padding: 0 6px;
}

/* 矢印 */
.p-pagination__arrow,
.p-pagination__arrow:link,
.p-pagination__arrow:visited {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    color: #333;
    text-decoration: none;
}

.p-pagination__arrow:hover {
    background: rgba(0, 0, 0, 0.05);
}

.p-pagination__arrow.is-disabled {
    color: #cbd5e1;
    /* グレーアウト */
    pointer-events: none;
    background: transparent;
}

.Voice__section {
    background-color: #EDFCDD;
    padding: 60px 0 80px 0;
    overflow: hidden;
    margin-bottom: 48px;
}

@media screen and (max-width: 960px) {
    .Voice__section {
        padding: 32px 0;
    }
}

.Voice__section .sp-only {
    display: none;
}

@media screen and (max-width: 960px) {
    .Voice__section .sp-only {
        display: block;
    }
}

.Voice__section .voice-title {
    color: var(--color-black, #222);
    text-align: center;
    font-size: 28px;
    font-style: normal;
    font-family: "NotoSansJpBold";
    font-weight: 700;
    line-height: 150%;
    letter-spacing: 1.4px;
    margin-top: 70px;
    margin-bottom: 32px;
}

@media screen and (max-width: 960px) {
    .Voice__section .voice-title {
        margin-top: 16px;
        margin-bottom: 16px;
        font-size: 14px;
        line-height: normal;
        letter-spacing: 0.7px;
    }
}

.Voice__section .voice-box {
    width: auto;
}

.Voice__section .voice-box .star-image {
    gap: 40px;
}

.Voice__section .voice-box .left .star-text .content {
    text-align: left;
}

.Voice__section .voice-box .left .star-text {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media screen and (max-width: 960px) {
    .Voice__section .voice-box .left .star-text {
        gap: 8px;
    }
}

@media screen and (max-width: 960px) {
    .voice-box .star-image .right {
        display: flex;
        justify-content: center;
    }
}

.slick-slider .slick-slide {
    margin: 0 48px;
}

@media screen and (max-width: 960px) {
    .slick-slider .slick-slide {
        margin: 0 16px;
    }
}

.Voice__section .more-button {
    margin-top: 100px;
    display: flex;
    justify-content: center;
}

.Voice__section .more-button a {
    display: flex;
    width: 390px;
    height: 96px;
    padding: 24px 0;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 150px;
    border: 3px solid var(--color-white, #FFF);
    background: linear-gradient(90deg, #A8DB4C 0%, #37BFAA 100%);
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    color: #FFF;
    text-align: center;
    font-size: 26px;
    font-style: normal;
    font-family: "NotoSansJpBold";
    font-weight: 700;
    line-height: 120%;
    letter-spacing: 2.6px;
    transition: all .3s ease-in-out;
}

@media screen and (max-width: 960px) {
    .Voice__section .more-button a {
        width: 368px;
        height: 66px;
        padding: 20px 0;
        font-size: 18px;
        line-height: normal;
        letter-spacing: 1.8px;
        margin: 0 4vw;
    }
}

.Voice__section .more-button a:hover {
    opacity: .7;
}

.Voice__section .slick-dots li button::before {
    border: 0;
    width: 8px;
    height: 8px;
}

.Voice__section .slick-dots li button::before {
    background-color: #D9D9D9;
}

.Voice__section .slick-dots li.slick-active button::before {
    background-color: #00BA64;
}

.Voice__section .slick-dots {
    display: flex;
    justify-content: center;
    gap: 16px;
}

.Voice__section .slick-dots li {
    width: 8px;
    height: 8px;
    margin: 0;
}

.voice-archive .voice-box .star-image .left,
.Voice__section .voice-box .star-image .left {
    justify-content: space-between;
}

.voice-archive .voice-box .star-image .left .star-text {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ナビ一式（矢印＋ドット）を横並び・中央寄せ */
.voice-slider-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
}

/* ドットの位置は“静的”に（Slick のデフォ位置を無効化） */
.voice-slider-nav .slick-dots {
    position: static;
    display: flex;
    gap: 12px;
    margin: 0;
    width: auto;
}

.voice-slider-nav .slick-dots li {
    margin: 0;
}

.voice-slider-nav .slick-dots li button {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #DCEFDA;
    /* 薄い緑 */
    text-indent: -9999px;
    overflow: hidden;
    padding: 0;
    border: 0;
}

.voice-slider-nav .slick-dots li.slick-active button {
    background: #26C06E;
    /* 緑 */
}

/* 矢印（丸ボタン） */
.voice-slider-nav .slick-prev,
.voice-slider-nav .slick-next {
    width: 32px;
    height: 32px;
    border: none;
    display: grid;
    place-items: center;
    cursor: pointer;
    position: unset;
}

.voice-slider-nav .slick-arrow::before {
    width: 10px;
    height: 16px;
    position: relative;
    top: 1px;
}

.voice-slider-nav .slick-prev::before {
    background-image: url("../../images/slider-allow-prev.svg");
}

.voice-slider-nav .slick-next::before {
    background-image: url("../../images/slider-allow-next.svg");
}

.voice-slider-nav .slick-arrow {
    background: transparent !important;
    border-radius: 0;
    transform: unset;
}

.voice-slider-nav .slick-arrow.slick-prev {
    order: 0;
}

.voice-slider-nav .slick-arrow.slick-next {
    order: 2;
}

/* 無効時の見た目（infinite:false の場合のみ効く） */
.voice-slider-nav .slick-arrow.slick-disabled {
    background: #E7F4E4;
    color: #A8C0A2;
    cursor: default;
}

/* ====== Lightbox ====== */
.c-lightbox[hidden] {
    display: none !important;
}

.c-lightbox {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(0, 0, 0, 0.6);
    z-index: 100005;
    padding: 24px;
}

.c-lightbox__body {
    max-width: min(1200px, 95vw);
    max-height: 90vh;
    display: grid;
    place-items: center;
}

.c-lightbox__body img {
    max-width: 100%;
    max-height: 90vh;
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    background: #fff;
}

.c-lightbox__close {
    position: absolute;
    top: 12px;
    right: 12px;
    border: none;
    background: rgba(255, 255, 255, 0.9);
    font-size: 28px;
    width: 44px;
    height: 44px;
    line-height: 44px;
    border-radius: 50%;
    cursor: pointer;
}

.c-lightbox__close:hover,
.c-lightbox__close:focus {
    background: #fff;
}

.js-lightbox {
    display: inline-block;
    cursor: zoom-in;
    position: relative;
}

.js-lightbox::after {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background-image: url("../../images/expansion.svg");
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    right: 20px;
    bottom: 20px;
    opacity: .8;
}

.js-lightbox:hover {
    opacity: .8;
}