/* みんなの声 */
    :root {
      --card-bg: #F2EBDD;     /* カードベースカラー */
      --card-border: #6B572A; /* カード外枠 */
      --accent-pink: #EB67B2; /* ５級ピンク */
      --accent-pink-light: #F8CCE5; /* ５級ピンク薄 */
      --accent-pink-deep: #EB67B2; /* ５級ピンク濃 */
      --accent-green: #4DBFCA; /* ４級グリーン */
      --accent-green-light: #B3E4E8; /* ４級グリーン薄 */
      --accent-green-deep: #01A4B3; /* ４級グリーン濃 */
      --accent-orange: #EE716E;/* ３級オレンジ */
      --accent-orange-light: #F8C2C1;/* ３級オレンジ薄 */
      --accent-orange-deep: #EE716E;/* ３級オレンジ濃 */
      --text-main: #565555;   /* カードの文字色 */
      --card-gap: .8rem;
    }
#qualifications_tab #eiken span {
    font-size: 100%;
    padding: 0 .1em;
}
    .section-title {
      font-family: "M PLUS Rounded 1c", "Noto Sans JP", sans-serif;
      font-size: 1.6rem;
      font-weight: 700;
      margin: 4px 0 6px;
    }

    .section-title small {
      display: block;
      font-size: 0.8rem;
      font-weight: 400;
      margin-bottom: 4px;
    }

    .section-subtitle {
      font-size: 0.9rem;
      margin-bottom: 18px;
      line-height: 1.7;
    }

    /* カルーセル全体 */
    .carousel-shell {
      background: rgba(255, 255, 255, 0.6);
      border-radius: 32px;
      border: 1px solid rgba(255, 255, 255, 0.7);
      box-shadow: 0 16px 32px rgba(140, 80, 90, 0.12);
      padding: 20px 5px;
    }

    .carousel-wrapper {
      position: relative;
      display: flex;
      align-items: center;
    }

    .carousel-viewport {
      overflow: hidden;
      width: 100%;
      padding: 4px 0;
    }

    .carousel-track {
      display: flex;
      gap: var(--card-gap);
      padding: 4px 4px 4px 8px;
      transition: transform 0.4s ease;
      will-change: transform;
    }

    /* カード（スマホ：1枚＋次のカードが少し見える） */
    .review-card {
      flex: 0 0 80vw;
      max-width: 80vw;
      background: var(--card-bg);
      box-shadow: var(--shadow-soft);
      border: 1px solid var(--card-border);
      padding: 16px 16px 18px;
      display: flex;
      flex-direction: column;
      min-height: 220px;
      position: relative;
      overflow: hidden;
font-size: 100%;
    }
    /* カード上部の半円アーチ風背景をなんちゃって再現 */
    .review-card::before {
      content: "";
      position: absolute;
      inset: -40px auto auto -40px;
      width: 120px;
      height: 120px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--accent-soft) 0%, #ffffff 55%);
      opacity: 0.65;
      pointer-events: none;
    }

    .review-content {
      position: relative;
      z-index: 1;
    }

    .review-meta {
display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    margin-bottom: 8px;
    gap: 0.5rem;
    font-size: 0.8rem;
        }
#qualifications_tab #eiken .review-txt span {
    font-size: 80%;
}
.review-grade {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: .5em;
    color: white;
    width: 50%;
    aspect-ratio: 1 / .8;
    justify-content: center;
}
.grade5 .review-grade {
    background: var(--accent-pink-deep);
}
.grade4 .review-grade {
    background: var(--accent-green-deep);
}
.grade3 .review-grade {
    background: var(--accent-orange-deep);
}

    .review-grade span.grade-text {
      font-size: 0.8rem;
      font-weight: 700;
    }
	.review-img {
	    width: 50%;
	}
	.review-img img{
	border-radius: .5em;
	}
    .review-name {
      font-size: 0.78rem;
      line-height: 1.4;
    }
.review-name p {
    margin: 0;
}
.grade-num {
		font-family: corporate-logo-ver2, sans-serif;
		font-weight: 700;
    font-size: 3em;
    line-height: 1em;
}
    .review-heading {
font-family: corporate-logo-ver2, sans-serif;
    font-weight: 700;
    margin: 4px 0 6px;
    line-height: 1.3;
    font-size: 1.3rem;
        }
.grade5 .review-heading {
    color: var(--accent-pink);
}
.grade4 .review-heading {
    color: var(--accent-green);
}
.grade3 .review-heading {
    color: var(--accent-orange);
}
p.review-txt span {
    display: block;
    font-size: 90%;
}
    .review-heading span.subline {
      display: block;
      font-size: 0.82rem;
      font-weight: 400;
      margin-top: 2px;
    }

    .review-body {
	    font-family: heisei-maru-gothic-std, sans-serif;
		font-weight: 400;
		font-style: normal;
      font-size: 0.82rem;
      line-height: 1.9;
      margin-top: 2px;
      color: var(--text-main);
      text-align: justify;
    }
.grade5 .review-body span {
    background: var(--accent-pink-light);
}

.grade4 .review-body span {
    background: var(--accent-green-light);
}

.grade3 .review-body span {
    background: var(--accent-orange-light);
}

    /* PCレイアウト（3枚＋4枚目が少し見えている） */
    @media (min-width: 960px) {
      .section-wrapper {
        margin-top: 56px;
      }

      .section-title {
        font-size: 1.8rem;
      }

      .section-subtitle {
        font-size: 0.95rem;
        margin-bottom: 20px;
      }

      .carousel-shell {
        padding: 24px 0 26px;
      }

      .review-card {
flex: 0 0 calc((100% - var(--card-gap)) / 2);
    max-width: calc((100% - var(--card-gap)) / 2);
    min-height: 240px;
    padding: 18px 18px 20px;
          }
    }

    /* ナビボタン（PDFの雰囲気に合わせた柔らかい丸ボタン） */
    .carousel-btn {
      border: none;
      background: #FFFFFF;
      box-shadow: 0 4px 12px rgba(140, 80, 90, 0.35);
      width: 40px;
      height: 40px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: transform 0.12s ease, box-shadow 0.12s ease,
        background 0.12s ease;
      flex-shrink: 0;
    }

    .carousel-btn span {
      font-size: 1.4rem;
      line-height: 1;
      user-select: none;
    }

    .carousel-btn:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 16px rgba(140, 80, 90, 0.45);
      background: #FFF7F5;
    }

    .carousel-btn:disabled {
      opacity: 0.4;
      cursor: default;
      box-shadow: none;
      background: #f3ddd1;
    }

    /* スマホではボタン位置を少し上寄せ */
    @media (max-width: 959.98px) {
      .carousel-wrapper {
        align-items: flex-start;
        position: relative;
      }

     .carousel-btn {
        margin-top: 54px;
        position: absolute;
        bottom: 0;
    	z-index: 1;
      }
      button.carousel-btn.prev {
	    left: 0;
    }
    button.carousel-btn.next {
	    right: 0;
	}
    .review-content {
      width: 72vw;
    }

    }