@charset "UTF-8";
/* ************************************************************************
   ************************************************************************

    COMMON SETTINGS

   ************************************************************************
   ************************************************************************ */
/* ------------------------------
    RESPONSIVE SETTINGS
  ------------------------------ */
/* ------------------------------
    FONT
  ------------------------------ */
@font-face {
  font-family: "Quentin";
  src: url("../fonts/Quentin.otf") format("opentype");
}
@font-face {
  font-family: "neueplak";
  src: url("../fonts/NeuePlak-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "neueplak";
  src: url("../fonts/NeuePlak-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "neueplak";
  src: url("../fonts/NeuePlak-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "NeuePlakCondensed";
  src: url("../fonts/NeuePlakCondensed-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "NeuePlakCondensed";
  src: url("../fonts/NeuePlakCondensed-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "NeuePlakCondensed";
  src: url("../fonts/NeuePlakCondensed-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "neueplak-wide";
  src: url("../fonts/NeuePlak-WideBold.eot");
  src: local("Neue Plak Wide Bold"), local("NeuePlak-WideBold"), url("../fonts/NeuePlak-WideBold.eot?#iefix") format("embedded-opentype"), url("../fonts/NeuePlak-WideBold.woff2") format("woff2"), url("../fonts/NeuePlak-WideBold.woff") format("woff"), url("../fonts/NeuePlak-WideBold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "neueplak-wide";
  src: url("../fonts/NeuePlak-WideBlack.eot");
  src: local("Neue Plak Wide Black"), local("NeuePlak-WideBlack"), url("../fonts/NeuePlak-WideBlack.eot?#iefix") format("embedded-opentype"), url("../fonts/NeuePlak-WideBlack.woff2") format("woff2"), url("../fonts/NeuePlak-WideBlack.woff") format("woff"), url("../fonts/NeuePlak-WideBlack.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
.t__min {
  font-family: cormorant-garamond, shippori-mincho, sans-serif !important;
}

/* ------------------------------
    COLOR SETTINGS
  ------------------------------ */
/* ------------------------------
    MIXIN
  ------------------------------ */
/* ------------------------------
    TRANSITION TIMING
  ------------------------------ */
/* ------------------------------
    KEYFRAME
  ------------------------------ */
@-webkit-keyframes scrollDown {
  0% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: center top;
            transform-origin: center top;
  }
  45% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: center top;
            transform-origin: center top;
  }
  55% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
  }
  100% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
  }
}
@keyframes scrollDown {
  0% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: center top;
            transform-origin: center top;
  }
  45% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: center top;
            transform-origin: center top;
  }
  55% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
  }
  100% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
  }
}
@-webkit-keyframes loopCl {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}
@keyframes loopCl {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}
@-webkit-keyframes loopClRv {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@keyframes loopClRv {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@-webkit-keyframes floatAnim {
  0% {
    -webkit-transform: scale(1) translatey(0);
            transform: scale(1) translatey(0);
  }
  20% {
    -webkit-transform: scale(1.025) translatey(2rem);
            transform: scale(1.025) translatey(2rem);
  }
  40% {
    -webkit-transform: scale(1) translatey(0);
            transform: scale(1) translatey(0);
  }
  60% {
    -webkit-transform: scale(1.025) translatey(2rem);
            transform: scale(1.025) translatey(2rem);
  }
  80% {
    -webkit-transform: scale(1) translatey(0);
            transform: scale(1) translatey(0);
  }
  100% {
    -webkit-transform: scale(1.025) translatey(2rem);
            transform: scale(1.025) translatey(2rem);
  }
}
@keyframes floatAnim {
  0% {
    -webkit-transform: scale(1) translatey(0);
            transform: scale(1) translatey(0);
  }
  20% {
    -webkit-transform: scale(1.025) translatey(2rem);
            transform: scale(1.025) translatey(2rem);
  }
  40% {
    -webkit-transform: scale(1) translatey(0);
            transform: scale(1) translatey(0);
  }
  60% {
    -webkit-transform: scale(1.025) translatey(2rem);
            transform: scale(1.025) translatey(2rem);
  }
  80% {
    -webkit-transform: scale(1) translatey(0);
            transform: scale(1) translatey(0);
  }
  100% {
    -webkit-transform: scale(1.025) translatey(2rem);
            transform: scale(1.025) translatey(2rem);
  }
}
@-webkit-keyframes BoudingMarker {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-200%);
            transform: translateY(-200%);
  }
  5% {
    opacity: 1;
    -webkit-transform: translateY(-200%);
            transform: translateY(-200%);
  }
  85% {
    opacity: 1;
    -webkit-transform: translateY(10%);
            transform: translateY(10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@keyframes BoudingMarker {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-200%);
            transform: translateY(-200%);
  }
  5% {
    opacity: 1;
    -webkit-transform: translateY(-200%);
            transform: translateY(-200%);
  }
  85% {
    opacity: 1;
    -webkit-transform: translateY(10%);
            transform: translateY(10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@-webkit-keyframes rotateLoop {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes rotateLoop {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
:root {
  --c-bg:#140810; /* 深い赤みのあるダーク */
  --c-card:#1c0f15; /* カード面 */
  --c-grad-1:#ff3650; /* メイン赤 */
  --c-grad-2:#b10028; /* 濃い赤 */
  --c-accent:#001a66; /* アクセント紺 */
  --c-text:#ffffff;
  --c-text-weak:#e9dfe3;
  --c-line:rgba(255,255,255,.12);
  --shadow: 0 10px 30px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.25);
  --radius:28px;
  --radius-sm:14px;
  --color-rd: #c11830;
  --color-bl: #3c4ea4;
  --color-gr: #3c965a;
}

/* ------------------------------
    COMMON SETTINGS
  ------------------------------ */
@media screen and (min-width: 320px) {
  html {
    font-size: 2.56411vw;
  }
}
@media screen and (min-width: 600px) {
  html {
    font-size: 2.56411vw;
  }
}
@media screen and (min-width: 1025px) {
  html {
    font-size: 0.5208335vw;
  }
}
@media screen and (min-width: 1441px) {
  html {
    font-size: 0.5208335vw;
  }
}

body {
  background: none;
  color: #FFF;
}

@media screen and (min-width: 320px) {
  .spBr {
    display: block;
  }
}
@media screen and (min-width: 1025px) {
  .spBr {
    display: none;
  }
}

@media screen and (min-width: 320px) {
  .pcBr {
    display: none;
  }
}
@media screen and (min-width: 1025px) {
  .pcBr {
    display: block;
  }
}

/* ------------------------------
    PAGE SETTING
  ------------------------------ */
.seasonTicketCta {
  margin: 18px 0 26px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(28, 38, 82, 0.18);
  background: rgba(28, 38, 82, 0.04);
  -webkit-box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06);
          box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06);
}
@media screen and (min-width: 600px) {
  .seasonTicketCta {
    padding: 16px;
  }
}
.seasonTicketCta__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 16px;
}
@media screen and (min-width: 1025px) {
  .seasonTicketCta__inner {
    grid-template-columns: 1fr auto;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 16px;
  }
}
.seasonTicketCta__img {
  position: relative;
  display: block;
}
@media screen and (min-width: 320px) {
  .seasonTicketCta__img {
    width: 100%;
  }
}
@media screen and (min-width: 600px) {
  .seasonTicketCta__img {
    width: 30%;
  }
}
.seasonTicketCta__img .img:first-child img {
  border-radius: 8px;
}
.seasonTicketCta__img .img:last-child {
  position: absolute;
  inset: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.seasonTicketCta__img .img:last-child img {
  width: 64%;
}
@media screen and (min-width: 320px) {
  .seasonTicketCta__main {
    width: 100%;
    text-align: center;
  }
}
@media screen and (min-width: 600px) {
  .seasonTicketCta__main {
    width: 65%;
    text-align: left;
  }
}

.seasonTicketCta__eyecatch {
  margin: 0;
  font-weight: 900;
  letter-spacing: 0.02em;
  line-height: 1.5;
  color: #1c2652;
}
@media screen and (min-width: 320px) {
  .seasonTicketCta__eyecatch {
    font-size: 1.35rem;
  }
}
@media screen and (min-width: 1025px) {
  .seasonTicketCta__eyecatch {
    font-size: 3.2rem;
  }
}

.seasonTicketCta__right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
}
@media screen and (min-width: 1025px) {
  .seasonTicketCta__right {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    text-align: right;
  }
}

.seasonTicketCta__btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-decoration: none;
  background: #1c2652;
  color: #fff;
  -webkit-transition: opacity 0.15s ease, -webkit-transform 0.15s ease, -webkit-box-shadow 0.15s ease;
  transition: opacity 0.15s ease, -webkit-transform 0.15s ease, -webkit-box-shadow 0.15s ease;
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease, -webkit-transform 0.15s ease, -webkit-box-shadow 0.15s ease;
}
@media screen and (min-width: 320px) {
  .seasonTicketCta__btn {
    margin: 8px 0;
  }
}
@media screen and (min-width: 600px) {
  .seasonTicketCta__btn {
    margin: 0;
  }
}
.seasonTicketCta__btn:hover {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
  -webkit-box-shadow: 0 12px 22px rgba(0, 0, 0, 0.12);
          box-shadow: 0 12px 22px rgba(0, 0, 0, 0.12);
}
.seasonTicketCta__btn:active {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  opacity: 0.92;
}
.seasonTicketCta__btn:focus-visible {
  outline: 3px solid rgba(28, 38, 82, 0.25);
  outline-offset: 3px;
}

.seasonTicketCta__deadline {
  margin: 0;
  font-weight: 800;
  opacity: 0.9;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 320px) {
  .seasonTicketCta__deadline {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .seasonTicketCta__deadline {
    font-size: 1.6rem;
  }
}
.seasonTicketCta__deadline .label {
  opacity: 0.8;
  margin-right: 0.25em;
}

.fanclubBg {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -10;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.fanclubFv {
  position: relative;
}
@media screen and (min-width: 320px) {
  .fanclubFv {
    padding: 18rem 2.5vw 18rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubFv {
    padding: 19svh 2.5vw 0;
  }
}
.fanclubFv.isMax {
  width: 100%;
  height: 100vh;
  height: 100svh;
}
.fanclubFv__bg {
  position: absolute;
  inset: 0;
}
.fanclubFv__bg img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.fanclubNav {
  position: fixed;
  width: calc(100% - 16px);
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(24px) saturate(140%);
  border-radius: 16px;
  border: solid 1px #f0f0f0;
  -webkit-box-shadow: 0 0 24px -8px rgba(0, 0, 0, 0.16);
          box-shadow: 0 0 24px -8px rgba(0, 0, 0, 0.16);
  z-index: 101;
}
@media screen and (min-width: 320px) {
  .fanclubNav {
    inset: auto auto calc(6rem + 8px) 8px;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav {
    inset: auto auto 8px 8px;
  }
}
@media screen and (min-width: 320px) {
  .fanclubNav.fv {
    padding: 0 16px;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav.fv {
    padding: 0 15vw;
  }
}
@media screen and (min-width: 320px) {
  .fanclubNav.fv .navList {
    gap: 0;
    padding: 10px 0 calc(4rem + 18px);
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav.fv .navList {
    gap: 3rem 2.1rem;
    padding: 0;
  }
}
.fanclubNav.fv .navItem {
  color: #c11830;
}
@media screen and (min-width: 320px) {
  .fanclubNav.fv .navItem {
    font-size: 9.6px;
    padding: 0;
    gap: 0.7rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav.fv .navItem {
    font-size: 1.8rem;
    padding: 2.4rem 0;
    gap: 1.3rem;
  }
}
@media screen and (min-width: 320px) {
  .fanclubNav.fv .navItem .sp {
    display: inline;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav.fv .navItem .sp {
    display: none;
  }
}
@media screen and (min-width: 320px) {
  .fanclubNav.fv .navItem .pc {
    display: none;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav.fv .navItem .pc {
    display: inline;
  }
}
.fanclubNav.fv .navIcon {
  background-color: #c11830;
}
@media screen and (min-width: 320px) {
  .fanclubNav.fv .navIcon {
    display: none;
    width: 2rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav.fv .navIcon {
    display: block;
    width: 3.9rem;
  }
}
@media screen and (min-width: 320px) {
  .fanclubNav.fv .navIcon::before {
    width: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav.fv .navIcon::before {
    width: 2.6rem;
  }
}
.fanclubNav.side {
  width: calc(100% - 32px);
  inset: auto auto calc(6rem + 16px) 16px;
  background: transparent;
  border: none;
}
.fanclubNav .fanclubCv {
  height: 4.2rem;
}
.fanclubNav .fanclubCv .cvIcon {
  width: calc(4.2rem - 8px) !important;
}
@media screen and (min-width: 320px) {
  .fanclubNav .navLinkWrapper {
    display: none;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav .navLinkWrapper {
    display: block;
  }
}
.fanclubNav .navTitle {
  font-family: "neueplak-wide", sans-serif;
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .fanclubNav .navTitle {
    font-size: 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubNav .navTitle {
    font-size: 2.4rem;
  }
}
.fanclubNav .navList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.fanclubNav .navItem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: 700;
}
.fanclubNav .navIcon {
  position: relative;
  background-color: #FFF;
  border-radius: 50%;
  aspect-ratio: 1/1;
}
.fanclubNav .navIcon::before {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(90deg);
          transform: translate(-50%, -50%) rotate(90deg);
  background: #FFF;
  -webkit-mask: url("../images/fanclub2026/arrow-right-solid-full.svg") no-repeat center/100% 100%;
          mask: url("../images/fanclub2026/arrow-right-solid-full.svg") no-repeat center/100% 100%;
  aspect-ratio: 1;
}

.fvLogo {
  display: block;
}
@media screen and (min-width: 320px) {
  .fvLogo {
    width: 80%;
    margin: 0 auto;
  }
}
@media screen and (min-width: 1025px) {
  .fvLogo {
    width: 34%;
    margin: 0 auto;
  }
}

.fvCopy {
  font-style: italic;
  font-weight: 800;
}
@media screen and (min-width: 320px) {
  .fvCopy {
    font-size: 1.8rem;
    margin-top: 6rem;
  }
}
@media screen and (min-width: 1025px) {
  .fvCopy {
    font-size: 5rem;
    margin-top: 15.6rem;
  }
}

.fvTitle {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  font-family: "neueplak-wide", sans-serif;
  font-weight: 800;
}
@media screen and (min-width: 320px) {
  .fvTitle {
    font-size: 4rem;
    letter-spacing: 0.07rem;
    margin-top: 0.8rem;
    line-height: 1.1;
  }
}
@media screen and (min-width: 1025px) {
  .fvTitle {
    font-size: 17.2rem;
    letter-spacing: 0.15rem;
    margin-top: 2.6rem;
    line-height: 0.988;
  }
  .fvTitle .year {
    display: block;
    width: 100%;
    text-align: center;
  }
}

.fvText {
  text-align: center;
}
@media screen and (min-width: 320px) {
  .fvText {
    font-size: 1.3rem;
    line-height: 1.75;
    letter-spacing: 0.02rem;
    margin-top: 6rem;
  }
}
@media screen and (min-width: 1025px) {
  .fvText {
    font-size: 2.2rem;
    line-height: 2;
    letter-spacing: 0.05rem;
    margin-top: 14svh;
  }
}

.fvCvWrapper {
  position: fixed;
  z-index: 100;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-transform: scale(0.75);
          transform: scale(0.75);
}
@media screen and (min-width: 320px) {
  .fvCvWrapper {
    inset: auto -2rem -0.72rem auto;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
@media screen and (min-width: 1025px) {
  .fvCvWrapper {
    inset: auto 0 8rem auto;
    width: auto;
    display: block;
  }
}

.fvCvText {
  line-height: 2;
  font-weight: 800;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  white-space: nowrap;
  letter-spacing: 0.28rem;
  visibility: hidden;
}
@media screen and (min-width: 320px) {
  .fvCvText {
    position: relative;
    inset: auto auto 2.8rem auto;
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    font-size: 2.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .fvCvText {
    position: absolute;
    inset: auto auto 56.8rem 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    font-size: 3.2rem;
  }
}

@-webkit-keyframes loopCircle {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
}

@keyframes loopCircle {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
}
.fvCvBtn {
  position: relative;
  display: block;
  aspect-ratio: 1;
}
@media screen and (min-width: 320px) {
  .fvCvBtn {
    width: 15.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .fvCvBtn {
    width: 33.4rem;
  }
}
.fvCvBtn .fvCvImg {
  position: absolute;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 2;
}
@media screen and (min-width: 320px) {
  .fvCvBtn .fvCvImg {
    top: -10rem;
    left: -160%;
    width: 8rem;
  }
}
@media screen and (min-width: 1025px) {
  .fvCvBtn .fvCvImg {
    top: -20rem;
    left: 50%;
    width: 23rem;
  }
}
.fvCvBtn .fvCvLoop {
  position: absolute;
  z-index: 1;
  inset: -15% -15% auto auto;
  display: block;
  width: 130%;
  height: 130%;
  -webkit-filter: opacity(0.64);
          filter: opacity(0.64);
  -webkit-animation: loopCircle 40000ms linear infinite both;
          animation: loopCircle 40000ms linear infinite both;
}
.fvCvBtn .text {
  position: absolute;
  z-index: 3;
  inset: 0;
  background-color: #1c2652;
  border-radius: 50%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  font-weight: 900;
}
@media screen and (min-width: 320px) {
  .fvCvBtn .text {
    display: none;
    font-size: 2rem;
  }
}
@media screen and (min-width: 600px) {
  .fvCvBtn .text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 4.2rem;
  }
}
.fvCvBtn .text span {
  font-family: "neueplak-wide", sans-serif;
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .fvCvBtn .text span {
    font-size: 1.1rem;
    margin-bottom: 0.8rem;
  }
}
@media screen and (min-width: 600px) {
  .fvCvBtn .text span {
    font-size: 1.4rem;
    margin-bottom: 1.6rem;
  }
}
.fvCvBtn .text small {
  font-size: 60%;
}

#fanclubFvSwiper {
  z-index: 0;
}
@media screen and (min-width: 320px) {
  #fanclubFvSwiper {
    margin-top: 5rem;
  }
}
@media screen and (min-width: 1025px) {
  #fanclubFvSwiper {
    margin-top: 11.7rem;
  }
}
#fanclubFvSwiper .swiper-wrapper {
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
}
#fanclubFvSwiper .swiper-slide {
  aspect-ratio: 3/2;
  border-radius: 0.8rem;
}
@media screen and (min-width: 320px) {
  #fanclubFvSwiper .swiper-slide:nth-child(2n) {
    margin-top: 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  #fanclubFvSwiper .swiper-slide:nth-child(2n) {
    margin-top: 3.2rem;
  }
}

.fanclubMain {
  grid-template-columns: 100%;
  color: #1c2652;
}
@media screen and (min-width: 320px) {
  .fanclubMain {
    font-size: 1.3rem;
    padding: 8rem 5vw 0;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubMain {
    font-size: 2rem;
    padding: 18rem 15vw 0;
  }
}
.fanclubMain .simplePara {
  text-align: center;
}
@media screen and (min-width: 320px) {
  .fanclubMain .simplePara {
    font-size: 1.3rem;
    margin: 24px 0;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubMain .simplePara {
    font-size: 2rem;
    margin: 24px 0;
  }
}

@media screen and (min-width: 320px) {
  .sideNavWrapper {
    position: fixed;
    z-index: 102;
    bottom: 7.4rem;
    left: 2.5vw;
    width: 95vw;
  }
}
@media screen and (min-width: 1025px) {
  .sideNavWrapper {
    display: none;
    position: static;
    z-index: inherit;
    bottom: unset;
    left: unset;
    width: auto;
    padding-top: 26.1rem;
  }
}

/* ===== Animations ===== */
@-webkit-keyframes cvGlowPulse {
  0% {
    opacity: 0.25;
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
  }
  50% {
    opacity: 0.55;
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
  }
  100% {
    opacity: 0.25;
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
  }
}
@keyframes cvGlowPulse {
  0% {
    opacity: 0.25;
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
  }
  50% {
    opacity: 0.55;
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
  }
  100% {
    opacity: 0.25;
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
  }
}
@-webkit-keyframes cvSheen {
  0% {
    -webkit-transform: translateX(-75%);
            transform: translateX(-75%);
  }
  60% {
    -webkit-transform: translateX(110%);
            transform: translateX(110%);
  }
  100% {
    -webkit-transform: translateX(110%);
            transform: translateX(110%);
  }
}
@keyframes cvSheen {
  0% {
    -webkit-transform: translateX(-75%);
            transform: translateX(-75%);
  }
  60% {
    -webkit-transform: translateX(110%);
            transform: translateX(110%);
  }
  100% {
    -webkit-transform: translateX(110%);
            transform: translateX(110%);
  }
}
@-webkit-keyframes cvBasePulse {
  0% {
    -webkit-box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
            box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
  }
  50% {
    -webkit-box-shadow: 0 14px 34px rgba(28, 38, 82, 0.3), 0 3px 10px rgba(28, 38, 82, 0.28);
            box-shadow: 0 14px 34px rgba(28, 38, 82, 0.3), 0 3px 10px rgba(28, 38, 82, 0.28);
  }
  100% {
    -webkit-box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
            box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
  }
}
@keyframes cvBasePulse {
  0% {
    -webkit-box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
            box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
  }
  50% {
    -webkit-box-shadow: 0 14px 34px rgba(28, 38, 82, 0.3), 0 3px 10px rgba(28, 38, 82, 0.28);
            box-shadow: 0 14px 34px rgba(28, 38, 82, 0.3), 0 3px 10px rgba(28, 38, 82, 0.28);
  }
  100% {
    -webkit-box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
            box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
  }
}
@-webkit-keyframes cvRipple {
  0% {
    opacity: 0.4;
    -webkit-transform: scale(0.88);
            transform: scale(0.88);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.18);
            transform: scale(1.18);
  }
}
@keyframes cvRipple {
  0% {
    opacity: 0.4;
    -webkit-transform: scale(0.88);
            transform: scale(0.88);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.18);
            transform: scale(1.18);
  }
}
@-webkit-keyframes cvArrowPush {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
            transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
    -webkit-filter: drop-shadow(0 0 0 rgba(28, 38, 82, 0));
            filter: drop-shadow(0 0 0 rgba(28, 38, 82, 0));
  }
  50% {
    -webkit-transform: translate(-50%, -50%) rotate(-45deg) translateX(8%);
            transform: translate(-50%, -50%) rotate(-45deg) translateX(8%);
    -webkit-filter: drop-shadow(0 2px 6px rgba(28, 38, 82, 0.25));
            filter: drop-shadow(0 2px 6px rgba(28, 38, 82, 0.25));
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
            transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
    -webkit-filter: drop-shadow(0 0 0 rgba(28, 38, 82, 0));
            filter: drop-shadow(0 0 0 rgba(28, 38, 82, 0));
  }
}
@keyframes cvArrowPush {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
            transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
    -webkit-filter: drop-shadow(0 0 0 rgba(28, 38, 82, 0));
            filter: drop-shadow(0 0 0 rgba(28, 38, 82, 0));
  }
  50% {
    -webkit-transform: translate(-50%, -50%) rotate(-45deg) translateX(8%);
            transform: translate(-50%, -50%) rotate(-45deg) translateX(8%);
    -webkit-filter: drop-shadow(0 2px 6px rgba(28, 38, 82, 0.25));
            filter: drop-shadow(0 2px 6px rgba(28, 38, 82, 0.25));
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
            transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
    -webkit-filter: drop-shadow(0 0 0 rgba(28, 38, 82, 0));
            filter: drop-shadow(0 0 0 rgba(28, 38, 82, 0));
  }
}
/* ユーザーの設定を尊重（減速・停止） */
@media (prefers-reduced-motion: reduce) {
  .navCvWrapper .fanclubCv {
    -webkit-animation: none;
            animation: none;
  }
  .navCvWrapper .fanclubCv::before {
    -webkit-animation: none;
            animation: none;
  }
  .navCvWrapper .fanclubCv::after {
    -webkit-animation: none;
            animation: none;
  }
  .navCvWrapper .fanclubCv .cvIcon::after {
    -webkit-animation: none;
            animation: none;
  }
  .navCvWrapper .fanclubCv .cvIcon::before {
    -webkit-animation: none;
            animation: none;
  }
}
.navCvWrapper {
  display: grid;
  gap: 0.8rem;
}
.navCvWrapper .fanclubCv {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #1c2652;
  color: #ffffff;
  overflow: hidden;
  isolation: isolate;
  will-change: transform, box-shadow;
  /* ループ発光（外周の柔らかいグロー） */
  /* シマー（横切りハイライト） */
  /* 呼吸するようなボタン本体のグロー */
  -webkit-box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
          box-shadow: 0 10px 26px rgba(28, 38, 82, 0.18), 0 2px 6px rgba(28, 38, 82, 0.22);
  -webkit-animation: cvBasePulse 4.2s ease-in-out infinite;
          animation: cvBasePulse 4.2s ease-in-out infinite;
}
@media screen and (min-width: 320px) {
  .navCvWrapper .fanclubCv {
    border-radius: 1.2rem;
    padding: 0.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .navCvWrapper .fanclubCv {
    border-radius: 2.4rem;
    padding: 0.8rem;
    margin-top: 7.5rem;
  }
}
.navCvWrapper .fanclubCv::after {
  content: "";
  position: absolute;
  inset: -25%;
  border-radius: inherit;
  background: radial-gradient(60% 60% at 50% 50%, rgba(28, 38, 82, 0.3), rgba(28, 38, 82, 0) 70%);
  -webkit-filter: blur(14px);
          filter: blur(14px);
  -webkit-animation: cvGlowPulse 2.8s ease-in-out infinite;
          animation: cvGlowPulse 2.8s ease-in-out infinite;
  z-index: 0;
  pointer-events: none;
}
.navCvWrapper .fanclubCv::before {
  content: "";
  position: absolute;
  inset: -30% -60%;
  background: linear-gradient(110deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0.18) 48%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.18) 52%, rgba(255, 255, 255, 0) 70%);
  -webkit-transform: translateX(-75%);
          transform: translateX(-75%);
  -webkit-animation: cvSheen 3.6s linear infinite;
          animation: cvSheen 3.6s linear infinite;
  mix-blend-mode: screen;
  z-index: 1;
  pointer-events: none;
}
.navCvWrapper .fanclubCv:hover {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
}
.navCvWrapper .fanclubCv:active {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.navCvWrapper .fanclubCv:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 3px;
}
.navCvWrapper .fanclubCv .cvText {
  position: relative;
  z-index: 2;
  font-weight: 700;
}
.navCvWrapper .fanclubCv .cvText span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 50%;
  gap: 8px;
}
.navCvWrapper .fanclubCv .cvText span svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: white;
}
@media screen and (min-width: 320px) {
  .navCvWrapper .fanclubCv .cvText {
    font-size: 1.6rem;
    letter-spacing: 0.2rem;
    margin-right: 19%;
  }
}
@media screen and (min-width: 1025px) {
  .navCvWrapper .fanclubCv .cvText {
    font-size: 3.2rem;
    letter-spacing: 0.2rem;
    margin-right: 15%;
  }
}
.navCvWrapper .fanclubCv .cvIcon {
  position: relative;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #FFF;
  aspect-ratio: 1;
  /* リップル（アイコン背面のソフトな波紋） */
  /* 矢印（プッシュアニメーション） */
}
.navCvWrapper .fanclubCv .cvIcon svg {
  display: block;
  width: 60%;
  height: 60%;
  stroke: #1c2652;
  stroke-width: 3;
}
@media screen and (min-width: 320px) {
  .navCvWrapper .fanclubCv .cvIcon {
    width: 4rem;
    border-radius: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .navCvWrapper .fanclubCv .cvIcon {
    width: 8rem;
    border-radius: 1.6rem;
  }
}
.navCvWrapper .fanclubCv .cvIcon::after {
  content: "";
  position: absolute;
  inset: -25%;
  border-radius: inherit;
  background: radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 0) 70%);
  -webkit-animation: cvRipple 1.8s ease-out infinite;
          animation: cvRipple 1.8s ease-out infinite;
  pointer-events: none;
  mix-blend-mode: soft-light;
}
.navCvWrapper .fanclubCv .cvIcon::before {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
          transform: translate(-50%, -50%) rotate(-45deg) translateX(0%);
  background: #1c2652;
  -webkit-mask: url("../images/fanclub2026/arrow-right-solid-full.svg") no-repeat center/100% 100%;
          mask: url("../images/fanclub2026/arrow-right-solid-full.svg") no-repeat center/100% 100%;
  aspect-ratio: 1;
}
@media screen and (min-width: 320px) {
  .navCvWrapper .fanclubCv .cvIcon::before {
    width: 2.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .navCvWrapper .fanclubCv .cvIcon::before {
    width: 5.5rem;
  }
}

.fanclubCvNote {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: 800;
}
@media screen and (min-width: 320px) {
  .fanclubCvNote {
    font-size: 1.1rem;
    gap: 0.6rem;
    letter-spacing: 0.05rem;
    margin: 0.4rem 1rem 0 0;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubCvNote {
    font-size: 1.8rem;
    gap: 1.1rem;
    letter-spacing: 0.1rem;
    margin: 1.6rem 4rem 0 0;
  }
}
.fanclubCvNote .cvNoteIcon {
  fill: #FFF;
}
@media screen and (min-width: 320px) {
  .fanclubCvNote .cvNoteIcon {
    width: 1.4rem;
    margin-top: 0.1rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubCvNote .cvNoteIcon {
    width: 3rem;
    margin-top: 0.2rem;
  }
}

.fanclubContents {
  display: block;
}
@media screen and (min-width: 320px) {
  .fanclubContents {
    gap: 3rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubContents {
    gap: 6.5rem;
  }
}

.fanclubSection {
  background-color: #FFF;
  -webkit-box-shadow: 0 0 3.2rem -0.8rem rgba(0, 0, 0, 0.16);
          box-shadow: 0 0 3.2rem -0.8rem rgba(0, 0, 0, 0.16);
}
@media screen and (min-width: 320px) {
  .fanclubSection {
    scroll-margin: 6rem;
    padding: 3.2rem 2rem 4rem;
    border-radius: 3.2rem;
    margin-bottom: 3.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubSection {
    scroll-margin: 10rem;
    padding: 4rem 4.8rem 6.4rem;
    border-radius: 6.4rem;
    margin-bottom: 6.4rem;
  }
}
.fanclubSection p {
  line-height: 1.86;
}
.fanclubSection .sectionTitleEn, .fanclubSection .sectionTitle {
  font-weight: 800;
  text-align: center;
  color: #c11830;
}
.fanclubSection .sectionTitleEn {
  font-family: "NeuePlakCondensed", sans-serif;
  font-weight: 900;
  line-height: 1;
}
@media screen and (min-width: 320px) {
  .fanclubSection .sectionTitleEn {
    font-size: 6.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubSection .sectionTitleEn {
    font-size: 12.1rem;
  }
}
@media screen and (min-width: 320px) {
  .fanclubSection .sectionTitle {
    font-size: 1.8rem;
    letter-spacing: 0.1rem;
    border-bottom: 0.3rem solid #c11830;
    margin-bottom: 24px;
    padding-bottom: 24px;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubSection .sectionTitle {
    font-size: 4.4rem;
    letter-spacing: 0.3rem;
    border-bottom: 0.6rem solid #c11830;
    margin-bottom: 24px;
    padding-bottom: 24px;
  }
}
.fanclubSection .sectionTitleSub {
  position: relative;
  color: #1c2652;
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 320px) {
  .fanclubSection .sectionTitleSub {
    font-size: 1.8rem;
    margin-top: 3rem;
  }
}
@media screen and (min-width: 1025px) {
  .fanclubSection .sectionTitleSub {
    font-size: 3.2rem;
    margin-top: 5rem;
  }
}
.fanclubSection img {
  display: block;
  width: 100%;
  height: auto;
}

.courseText {
  text-align: center;
  color: #121212;
}
@media screen and (min-width: 320px) {
  .courseText {
    font-size: 1.3rem;
    line-height: 1.75;
    letter-spacing: 0.02rem;
    margin-top: 3rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseText {
    font-size: 2.2rem;
    line-height: 2;
    letter-spacing: 0.05rem;
    margin-top: 5rem;
  }
}

.courseTabList {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  color: white;
}
@media screen and (min-width: 320px) {
  .courseTabList {
    margin-top: 3rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseTabList {
    margin-top: 6rem;
  }
}

.courseTabBtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  -webkit-filter: brightness(0.8);
          filter: brightness(0.8);
  border-radius: 999px;
  -webkit-transition: opacity 0.2s ease, -webkit-filter 0.2s ease, -webkit-box-shadow 0.2s ease;
  transition: opacity 0.2s ease, -webkit-filter 0.2s ease, -webkit-box-shadow 0.2s ease;
  transition: opacity 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease;
  transition: opacity 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease, -webkit-filter 0.2s ease, -webkit-box-shadow 0.2s ease;
}
@media screen and (min-width: 320px) {
  .courseTabBtn {
    padding: 16px 0;
    -webkit-box-shadow: 0 0 0.8rem 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 0.8rem 0 rgba(0, 0, 0, 0.2);
    border-radius: 0.8rem 0.8rem 0 0;
  }
}
@media screen and (min-width: 1025px) {
  .courseTabBtn {
    padding: 24px 0;
    -webkit-box-shadow: 0 0 1.6rem 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 1.6rem 0 rgba(0, 0, 0, 0.2);
    border-radius: 1.6rem 1.6rem 0 0;
  }
  .courseTabBtn:hover {
    opacity: 1;
    -webkit-filter: brightness(1);
            filter: brightness(1);
  }
}
.courseTabBtn.youth {
  background-color: var(--color-rd);
}
.courseTabBtn.regular {
  background-color: var(--color-bl);
}
.courseTabBtn.premium {
  background-color: var(--color-gr);
}
.courseTabBtn.isActive {
  -webkit-filter: brightness(1);
          filter: brightness(1);
}
.courseTabBtn .btnTitleEn {
  font-family: "neueplak-wide", sans-serif;
  font-weight: 700;
  opacity: 0.4;
}
@media screen and (min-width: 320px) {
  .courseTabBtn .btnTitleEn {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseTabBtn .btnTitleEn {
    font-size: 1.8rem;
  }
}
.courseTabBtn .btnTitle {
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .courseTabBtn .btnTitle {
    font-size: 1.2rem;
    letter-spacing: 0.05rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseTabBtn .btnTitle {
    font-size: 2.4rem;
    letter-spacing: 0.1rem;
  }
}

.courseTabPanel {
  color: white;
}
@media screen and (min-width: 320px) {
  .courseTabPanel {
    scroll-margin-top: 11rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseTabPanel {
    scroll-margin-top: 18.4rem;
  }
}
.courseTabPanel.youth .coursePanelInner {
  background-color: var(--color-rd);
}
.courseTabPanel.youth .benefitsItem p {
  background-color: var(--color-rd);
}
.courseTabPanel.youth .courseHero {
  background-color: var(--color-rd);
}
.courseTabPanel.youth .courseHero::before {
  background-color: var(--color-rd);
}
.courseTabPanel.regular .coursePanelInner {
  background-color: var(--color-bl);
}
.courseTabPanel.regular .benefitsItem p {
  background-color: var(--color-bl);
}
.courseTabPanel.regular .courseHero {
  background-color: var(--color-bl);
}
.courseTabPanel.regular .courseHero::before {
  background-color: var(--color-bl);
}
.courseTabPanel.premium .coursePanelInner {
  background-color: var(--color-gr);
}
.courseTabPanel.premium .benefitsItem p {
  background-color: var(--color-gr);
}
.courseTabPanel.premium .courseHero {
  background-color: var(--color-gr);
}
.courseTabPanel.premium .courseHero::before {
  background-color: var(--color-gr);
}
.courseTabPanel[hidden] {
  display: none;
}

@media screen and (min-width: 320px) {
  .coursePanelInner {
    padding-bottom: 0.8rem;
    border-radius: 0 0 0.8rem 0.8rem;
    -webkit-box-shadow: 0 0 0.8rem rgba(0, 0, 0, 0.18);
            box-shadow: 0 0 0.8rem rgba(0, 0, 0, 0.18);
  }
}
@media screen and (min-width: 1025px) {
  .coursePanelInner {
    padding-bottom: 1.6rem;
    border-radius: 0 0 1.6rem 1.6rem;
    -webkit-box-shadow: 0 0 1.6rem rgba(0, 0, 0, 0.18);
            box-shadow: 0 0 1.6rem rgba(0, 0, 0, 0.18);
  }
}

.courseHero {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.courseHero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
.courseHero > * {
  position: relative;
  z-index: 1;
}

.courseHeroTag {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: rgba(0, 0, 0, 0.25);
  letter-spacing: 0.08em;
}
@media screen and (min-width: 320px) {
  .courseHeroTag {
    font-size: 1.2rem;
    padding: 0.2rem 0.9rem 0.4rem;
    margin-bottom: 0.6rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseHeroTag {
    font-size: 2rem;
    padding: 0.4rem 1.2rem 0.6rem;
    margin-bottom: 1.2rem;
  }
}

.courseHeroTitle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
}
@media screen and (min-width: 320px) {
  .courseHeroTitle {
    margin: 40px 0 24px;
  }
}
@media screen and (min-width: 1025px) {
  .courseHeroTitle {
    margin: 40px 0 24px;
  }
}

.courseHeroTitleEn {
  font-family: "NeuePlakCondensed", sans-serif;
  font-weight: 900;
  line-height: 1;
}
@media screen and (min-width: 320px) {
  .courseHeroTitleEn {
    font-size: 4rem;
    letter-spacing: 0.1rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseHeroTitleEn {
    font-size: 8rem;
    letter-spacing: 0.2rem;
  }
}

@media screen and (min-width: 320px) {
  .courseHeroTitleJp {
    font-size: 1.8rem;
    letter-spacing: 0.05em;
  }
}
@media screen and (min-width: 1025px) {
  .courseHeroTitleJp {
    font-size: 3.8rem;
    letter-spacing: 0.1em;
  }
}

.courseHeroLead {
  line-height: 1.7;
}
@media screen and (min-width: 320px) {
  .courseHeroLead {
    font-size: 1.3rem;
    margin: 1.6rem 0.4rem 0;
  }
}
@media screen and (min-width: 1025px) {
  .courseHeroLead {
    font-size: 2.4rem;
    margin: 6.4rem 0 0;
  }
}

@media screen and (min-width: 320px) {
  .courseHeroPrice {
    font-size: 1.2rem;
    margin-top: 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseHeroPrice {
    font-size: 2.2rem;
    margin-top: 2.4rem;
  }
}

.courseContent {
  display: grid;
}
@media screen and (min-width: 320px) {
  .courseContent {
    grid-template-columns: 100%;
    margin: 0.8rem;
    gap: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseContent {
    grid-template-columns: repeat(2, 1fr);
    margin: 1.6rem;
    gap: 1.6rem;
  }
}

.coursePriceBlock,
.courseBenefitsBlock {
  background-color: #FFF;
  color: rgba(18, 18, 18, 0.9);
}
@media screen and (min-width: 320px) {
  .coursePriceBlock,
  .courseBenefitsBlock {
    padding: 1.6rem 1.4rem;
    margin: 0.8rem;
    -webkit-box-shadow: 0 0 0.8rem rgba(0, 0, 0, 0.18);
            box-shadow: 0 0 0.8rem rgba(0, 0, 0, 0.18);
    border-radius: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .coursePriceBlock,
  .courseBenefitsBlock {
    padding: 3.2rem;
    margin: 1.6rem;
    -webkit-box-shadow: 0 0 1.6rem rgba(0, 0, 0, 0.18);
            box-shadow: 0 0 1.6rem rgba(0, 0, 0, 0.18);
    border-radius: 1.6rem;
  }
}
@media screen and (min-width: 320px) {
  .coursePriceBlock.premium,
  .courseBenefitsBlock.premium {
    margin: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .coursePriceBlock.premium,
  .courseBenefitsBlock.premium {
    margin: 1.6rem;
  }
}
@media screen and (min-width: 320px) {
  .coursePriceBlock.delivery,
  .courseBenefitsBlock.delivery {
    margin: 0.8rem 0 16px;
  }
}
@media screen and (min-width: 1025px) {
  .coursePriceBlock.delivery,
  .courseBenefitsBlock.delivery {
    margin: 1.6rem 0 32px;
  }
}
.coursePriceBlock.delivery::last-child,
.courseBenefitsBlock.delivery::last-child {
  margin-bottom: 0;
}
.coursePriceBlock .matchesSeat,
.courseBenefitsBlock .matchesSeat {
  margin-bottom: 48px;
}

.courseBlockTitle {
  font-weight: 700;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(0, 0, 0, 0.16);
  text-align: center;
  margin: 0 0 16px;
}
@media screen and (min-width: 320px) {
  .courseBlockTitle {
    font-size: 1.6rem;
    padding-bottom: 0.6rem;
    letter-spacing: 0.06rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseBlockTitle {
    font-size: 3.2rem;
    padding-bottom: 0.8rem;
    letter-spacing: 0.1rem;
  }
}

.courseSubTitle {
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  background: rgba(0, 0, 0, 0.12);
  border-radius: 8px;
  margin: 16px 0 8px;
}
@media screen and (min-width: 320px) {
  .courseSubTitle {
    font-size: 1.3rem;
    padding: 12px 6px;
    letter-spacing: 0.06rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseSubTitle {
    font-size: 2.4rem;
    padding: 12px 6px;
    letter-spacing: 0.1rem;
  }
}

.coursePrice {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  line-height: 1;
}
@media screen and (min-width: 320px) {
  .coursePrice {
    gap: 0.8rem;
    padding: 0.2rem 0 0 0.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .coursePrice {
    gap: 0.8rem;
    padding: 0.4rem 0 0 1.6rem;
  }
}

.coursePriceMain {
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .coursePriceMain {
    font-size: 3.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .coursePriceMain {
    font-size: 5.6rem;
  }
}

@media screen and (min-width: 320px) {
  .coursePriceSub {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .coursePriceSub {
    font-size: 2.2rem;
  }
}

.courseInfoList {
  display: grid;
}
@media screen and (min-width: 320px) {
  .courseInfoList {
    margin-top: 2.4rem;
    row-gap: 0.6rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseInfoList {
    margin-top: 4rem;
    row-gap: 1.6rem;
  }
}

.courseInfoItem {
  display: grid;
  grid-template-columns: auto 1fr;
}
@media screen and (min-width: 320px) {
  .courseInfoItem {
    font-size: 1.25rem;
    -webkit-column-gap: 1.2rem;
       -moz-column-gap: 1.2rem;
            column-gap: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseInfoItem {
    font-size: 2.4rem;
    -webkit-column-gap: 2rem;
       -moz-column-gap: 2rem;
            column-gap: 2rem;
  }
}

.courseInfoTerm {
  font-weight: 600;
}

.courseBenefitsList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (min-width: 320px) {
  .courseBenefitsList {
    gap: 2.4rem 2%;
    padding-top: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseBenefitsList {
    gap: 4rem 2.66%;
    padding-top: 1.6rem;
  }
}
.courseBenefitsList.premium {
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.courseBenefitsList.course .benefitsItem p {
  position: absolute;
  left: 0;
}
@media screen and (min-width: 320px) {
  .courseBenefitsList.course .benefitsItem p {
    bottom: -0.2rem;
  }
}
@media screen and (min-width: 600px) {
  .courseBenefitsList.course .benefitsItem p {
    bottom: 0;
  }
}
@media screen and (min-width: 320px) {
  .courseBenefitsList.merit {
    gap: 2.4rem 2%;
  }
}
@media screen and (min-width: 1025px) {
  .courseBenefitsList.merit {
    gap: 4rem 2%;
  }
}
@media screen and (min-width: 320px) {
  .courseBenefitsList.merit .benefitsItem {
    width: 48%;
  }
}
@media screen and (min-width: 1025px) {
  .courseBenefitsList.merit .benefitsItem {
    width: 32%;
  }
}

.benefitsItem {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (min-width: 320px) {
  .benefitsItem {
    width: 48%;
  }
}
@media screen and (min-width: 1025px) {
  .benefitsItem {
    width: 23%;
  }
}
.benefitsItem img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
}
.benefitsItem .itemTitle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-weight: 700;
  color: goldenrod;
  background-color: #121212;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  text-align: center;
}
@media screen and (min-width: 320px) {
  .benefitsItem .itemTitle {
    font-size: 1.1rem;
    padding-block: 0.4rem 0.6rem;
    border-radius: 1.2rem;
    margin-top: 0.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .benefitsItem .itemTitle {
    font-size: 2rem;
    padding-block: 0.8rem 1.2rem;
    border-radius: 2.4rem;
    margin-top: 0.8rem;
  }
}
.benefitsItem p {
  width: 100%;
  background: #1c2652;
  color: white;
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 320px) {
  .benefitsItem p {
    font-size: 1.1rem;
    padding: 0.3rem 0;
    border-radius: 0.8rem;
    margin-top: 0.4rem;
  }
}
@media screen and (min-width: 600px) {
  .benefitsItem p {
    font-size: 2rem;
    padding: 1rem 0;
    border-radius: 1.6rem;
    margin-top: 0.8rem;
  }
}

.benefitsItemNote {
  color: rgba(0, 0, 0, 0.8);
}
@media screen and (min-width: 320px) {
  .benefitsItemNote {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .benefitsItemNote {
    font-size: 2rem;
  }
}

.courseNotes {
  font-weight: 700;
  color: rgba(18, 18, 18, 0.9);
  text-align: center;
}
@media screen and (min-width: 320px) {
  .courseNotes {
    font-size: 1.3rem;
    margin-top: 2.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseNotes {
    font-size: 2.4rem;
    margin-top: 4rem;
  }
}

.courseDeliveryWrapper {
  overflow: hidden;
}

.courseDelivery, .wp-block-flexible-table-block-table table {
  width: 100%;
  border-collapse: separate;
  table-layout: fixed;
  text-align: center;
  border-radius: 16px;
  color: #1c2652;
}
.courseDelivery th, .courseDelivery td, .wp-block-flexible-table-block-table table th, .wp-block-flexible-table-block-table table td {
  text-align: center;
  border: 1px solid #1c2652;
}
@media screen and (min-width: 320px) {
  .courseDelivery th, .courseDelivery td, .wp-block-flexible-table-block-table table th, .wp-block-flexible-table-block-table table td {
    padding: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseDelivery th, .courseDelivery td, .wp-block-flexible-table-block-table table th, .wp-block-flexible-table-block-table table td {
    padding: 1.6rem;
  }
}
.courseDelivery thead th, .wp-block-flexible-table-block-table table thead th {
  font-weight: 700;
  background: #1c2652 !important;
  color: white;
}
@media screen and (min-width: 320px) {
  .courseDelivery thead th, .wp-block-flexible-table-block-table table thead th {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseDelivery thead th, .wp-block-flexible-table-block-table table thead th {
    font-size: 2.4rem;
  }
}
.courseDelivery thead th:first-child, .wp-block-flexible-table-block-table table thead th:first-child {
  border-radius: 8px 0 0 0;
}
.courseDelivery thead th:last-child, .wp-block-flexible-table-block-table table thead th:last-child {
  border-radius: 0 8px 0 0;
}
.courseDelivery tbody, .wp-block-flexible-table-block-table table tbody {
  font-weight: 400 !important;
}
@media screen and (min-width: 320px) {
  .courseDelivery tbody, .wp-block-flexible-table-block-table table tbody {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseDelivery tbody, .wp-block-flexible-table-block-table table tbody {
    font-size: 2.2rem;
  }
}
.courseDelivery tbody tr:last-child th, .wp-block-flexible-table-block-table table tbody tr:last-child th {
  border-radius: 0 0 0 8px;
}
.courseDelivery tbody tr:last-child td, .wp-block-flexible-table-block-table table tbody tr:last-child td {
  border-radius: 0 0 8px 0;
}

.memberList {
  display: grid;
}
@media screen and (min-width: 320px) {
  .memberList {
    margin: 1.6rem 0 0;
    gap: 2.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .memberList {
    width: 88%;
    margin: 3.2rem auto 1.6rem;
    gap: 2.4rem;
  }
}

.memberItem {
  display: grid;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (min-width: 320px) {
  .memberItem {
    grid-template-columns: 100%;
    font-size: 1.3rem;
    letter-spacing: 0.05rem;
    gap: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .memberItem {
    grid-template-columns: 28% 66%;
    font-size: 2.4rem;
    letter-spacing: 0.1rem;
    gap: 0;
  }
}
.memberItem .itemTitle {
  background-color: #c11830;
  text-align: center;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .memberItem .itemTitle {
    width: 46%;
    padding-block: 0.6rem;
    border-radius: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .memberItem .itemTitle {
    width: auto;
    padding-block: 1.6rem;
    border-radius: 1.6rem;
  }
}
.memberItem .itemTitleSub {
  position: relative;
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .memberItem .itemTitleSub {
    margin-top: 2rem;
    padding-left: 1rem;
  }
}
@media screen and (min-width: 1025px) {
  .memberItem .itemTitleSub {
    margin-top: 3rem;
    padding-left: 2.4rem;
  }
}
.memberItem .itemTitleSub::before {
  position: absolute;
  content: "";
  left: 0;
  height: 100%;
  border-radius: 1rem;
  background-color: #1c2652;
}
@media screen and (min-width: 320px) {
  .memberItem .itemTitleSub::before {
    top: 0.1rem;
    width: 0.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .memberItem .itemTitleSub::before {
    top: 0.2rem;
    width: 0.6rem;
  }
}
@media screen and (min-width: 320px) {
  .memberItem .itemTitleSub:nth-of-type(1) {
    margin-top: 0.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .memberItem .itemTitleSub:nth-of-type(1) {
    margin-top: 0.8rem;
  }
}
.memberItem .itemTitleSub.youth::before {
  background-color: #3c4ea4;
}
.memberItem .itemTitleSub.regular::before {
  background-color: #c11830;
}
.memberItem .itemTitleSub.premium::before {
  background-color: #121212;
}
.memberItem .itemDesc {
  color: rgba(18, 18, 18, 0.9);
}
@media screen and (min-width: 320px) {
  .memberItem .itemDesc {
    padding-left: 2.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .memberItem .itemDesc {
    padding-left: unset;
  }
}
@media screen and (min-width: 320px) {
  .memberItem .small {
    font-size: 85%;
  }
}
@media screen and (min-width: 1025px) {
  .memberItem .small {
    font-size: 75%;
  }
}
.memberItem .itemText {
  line-height: 1.2;
}
@media screen and (min-width: 320px) {
  .memberItem .itemText {
    margin: 0.6rem 0 0 1rem;
  }
}
@media screen and (min-width: 1025px) {
  .memberItem .itemText {
    margin: 1.2rem 0 0 2.4rem;
  }
}

.notesList {
  display: grid;
  color: #121212;
  opacity: 0.9;
}
@media screen and (min-width: 320px) {
  .notesList {
    font-size: 1.3rem;
    margin: 2.4rem 0 0;
    gap: 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  .notesList {
    font-size: 2.4rem;
    margin: 3.2rem 0 1.6rem 2.4rem;
    gap: 2.4rem;
  }
}

.notesItem {
  position: relative;
}
@media screen and (min-width: 320px) {
  .notesItem {
    padding-left: 1rem;
  }
}
@media screen and (min-width: 1025px) {
  .notesItem {
    padding-left: 2.4rem;
  }
}
.notesItem::before {
  position: absolute;
  content: "";
  left: 0;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: #121212;
}
@media screen and (min-width: 320px) {
  .notesItem::before {
    top: 0.7rem;
    width: 0.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .notesItem::before {
    top: 1.5rem;
    width: 0.8rem;
  }
}

.faqList {
  display: grid;
}
@media screen and (min-width: 320px) {
  .faqList {
    gap: 1rem;
    margin-top: 3rem;
  }
}
@media screen and (min-width: 1025px) {
  .faqList {
    gap: 1rem;
    margin-top: 5rem;
  }
}

.faqItem {
  background: #FFF;
  overflow: hidden;
}
@media screen and (min-width: 320px) {
  .faqItem {
    border-radius: 0.8rem;
    -webkit-box-shadow: 0 0 0.8rem 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 0.8rem 0 rgba(0, 0, 0, 0.2);
  }
}
@media screen and (min-width: 1025px) {
  .faqItem {
    border-radius: 1.6rem;
    -webkit-box-shadow: 0 0 1.6rem 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 1.6rem 0 rgba(0, 0, 0, 0.2);
  }
}
.faqItem.isOpen .faqToggleIcon::before {
  -webkit-transform: translate(-50%, -50%) rotate(180deg);
          transform: translate(-50%, -50%) rotate(180deg);
}
.faqItem.isOpen .faqToggleIcon::after {
  -webkit-transform: translate(-50%, -50%) rotate(360deg);
          transform: translate(-50%, -50%) rotate(360deg);
}

.faqQuestion {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: transparent;
  border: 0;
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #1c2652;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
@media screen and (min-width: 320px) {
  .faqQuestion {
    gap: 0.8rem;
    padding: 1.2rem;
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .faqQuestion {
    gap: 1.4rem;
    padding: 2rem;
    font-size: 2.4rem;
  }
}

.qMark {
  display: grid;
  place-items: center;
  background: #1c2652;
  color: #FFF;
  font-family: "neueplak", sans-serif;
  border-radius: 50%;
  aspect-ratio: 1;
}
@media screen and (min-width: 320px) {
  .qMark {
    width: 2.4rem;
    font-size: 1.3rem;
    padding: 0 0 0.2rem 0;
    margin-top: 0.1rem;
  }
}
@media screen and (min-width: 1025px) {
  .qMark {
    width: 3.6rem;
    font-size: 1.8rem;
    padding: 0 0.1rem 0.4rem 0;
    margin-top: 0.2rem;
  }
}

.faqToggleIcon {
  position: relative;
}
@media screen and (min-width: 320px) {
  .faqToggleIcon {
    width: 1.6rem;
    height: 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  .faqToggleIcon {
    width: 2.4rem;
    height: 2.4rem;
  }
}
.faqToggleIcon::before, .faqToggleIcon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  background: #1c2652;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  border-radius: 1rem;
  -webkit-transition: -webkit-transform 0.25s cubic-bezier(0.77, 0.33, 0, 1);
  transition: -webkit-transform 0.25s cubic-bezier(0.77, 0.33, 0, 1);
  transition: transform 0.25s cubic-bezier(0.77, 0.33, 0, 1);
  transition: transform 0.25s cubic-bezier(0.77, 0.33, 0, 1), -webkit-transform 0.25s cubic-bezier(0.77, 0.33, 0, 1);
}
@media screen and (min-width: 320px) {
  .faqToggleIcon::before, .faqToggleIcon::after {
    height: 0.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .faqToggleIcon::before, .faqToggleIcon::after {
    height: 0.3rem;
  }
}
.faqToggleIcon::after {
  -webkit-transform: translate(-50%, -50%) rotate(90deg);
          transform: translate(-50%, -50%) rotate(90deg);
}

.faqAnswer {
  display: grid;
  grid-template-columns: auto 1fr;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  overflow: hidden;
  max-height: 0;
  -webkit-transition: max-height 0.25s cubic-bezier(0.77, 0.33, 0, 1);
  transition: max-height 0.25s cubic-bezier(0.77, 0.33, 0, 1);
}
@media screen and (min-width: 320px) {
  .faqAnswer {
    gap: 0.8rem;
    padding: 0 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .faqAnswer {
    gap: 1.4rem;
    padding: 0 2rem;
  }
}

.aMark {
  display: grid;
  place-items: center;
  background: #c11830;
  color: #FFF;
  font-family: "neueplak", sans-serif;
  border-radius: 50%;
  aspect-ratio: 1;
}
@media screen and (min-width: 320px) {
  .aMark {
    width: 2.4rem;
    margin-top: 1.2rem;
    font-size: 1.3rem;
    padding: 0 0 0.2rem 0;
  }
}
@media screen and (min-width: 1025px) {
  .aMark {
    width: 3.6rem;
    margin-top: 2rem;
    font-size: 1.8rem;
    padding: 0 0.1rem 0.4rem 0;
  }
}

.aBody {
  color: #c11830;
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .aBody {
    font-size: 1.3rem;
    padding: 1.2rem 0 1.6rem;
    line-height: 1.5;
  }
}
@media screen and (min-width: 1025px) {
  .aBody {
    font-size: 2.4rem;
    padding: 1.6rem 0 2rem;
    line-height: 1.75;
  }
}

/* ------------------------------
    HEADER
  ------------------------------ */
@media screen and (min-width: 1025px) {
  #__globalHeader.__transformed {
    top: calc(-3.3rem - 85px);
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__top li a {
    height: 3.2rem;
  }
}
@media screen and (min-width: 320px) {
  #__globalHeader .__top li:first-child a {
    margin: 0 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  #__globalHeader .__top li:first-child a {
    margin: 0 2.4rem;
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__bottom .__logo {
    height: 12.6rem;
    top: calc(50% - 6.3rem);
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__bottom button {
    font-size: 2.1rem;
    padding: 1.6rem 4.8rem 1.6rem 2.4rem;
  }
}
@media screen and (min-width: 320px) {
  #__globalHeader .__bottom button svg {
    right: 1.6rem;
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__bottom button svg {
    right: 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  #__globalHeader .__bottom button svg {
    right: 1.6rem;
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__bottom .__submenu {
    width: 39.4rem;
    font-size: 1.5rem;
  }
}
@media screen and (min-width: 1025px) {
  #__globalHeader .__bottom .__submenu {
    width: 39.4rem;
    font-size: 1.5rem;
  }
}
#__globalHeader .__bottom .__submenu a {
  letter-spacing: 0.06em;
}
@media screen and (min-width: 320px) {
  #__globalHeader .__child::before {
    border-radius: 0.6rem 0.6rem 0 0;
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__child::before {
    border-radius: unset;
  }
}
#__globalHeader .__child .isTwoBlock {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
}
@media screen and (min-width: 320px) {
  #__globalHeader .__child .isTwoBlock {
    grid-column: 1/3;
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__child .isTwoBlock {
    grid-column: unset;
  }
}
@media screen and (min-width: 320px) {
  #__globalHeader .__child .isTwoBlock .block:nth-child(1) {
    margin-bottom: 1.8rem;
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__child .isTwoBlock .block:nth-child(1) {
    margin-bottom: 0;
  }
}
#__globalHeader .__child .isTwoBlock .__matchSliderItem {
  -webkit-transform: translateY(1.2rem);
          transform: translateY(1.2rem);
}
#__globalHeader .__child .isTwoBlock .__matchSliderItem .__matchSliderItemWrapper {
  padding: 1.2rem;
}
#__globalHeader .__child p, #__globalHeader .__child li {
  -webkit-transform: translateY(1.2rem);
          transform: translateY(1.2rem);
}
#__globalHeader .__child p {
  margin-bottom: 1.2rem;
}
#__globalHeader .__child p span:last-child::before, #__globalHeader .__child p span:last-child::after {
  margin: 0 0.6rem;
}
@media screen and (min-width: 600px) {
  #__globalHeader .__child li {
    margin: 0 1.2rem 1.2rem 0;
  }
}
@media screen and (min-width: 320px) {
  #__globalHeader .__child li a {
    font-size: 1.2rem;
    padding: 1rem 1.4rem;
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__child li a {
    font-size: 1.6rem;
    padding: 2rem 2.8rem;
  }
}
#__globalHeader .__child li a span {
  display: inline-block;
}
@media screen and (min-width: 320px) {
  #__globalHeader .__child li a span {
    width: calc(100% - 14px - 1.5rem);
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__child li a span {
    width: calc(100% - 20px - 2.5rem);
  }
}
#__globalHeader .__child li a:hover svg {
  -webkit-transform: translateX(0.6rem);
          transform: translateX(0.6rem);
}
#__globalHeader .__child li svg {
  display: block;
  stroke: #FFF;
  -webkit-transition: -webkit-transform 400ms ease;
  transition: -webkit-transform 400ms ease;
  transition: transform 400ms ease;
  transition: transform 400ms ease, -webkit-transform 400ms ease;
}
@media screen and (min-width: 320px) {
  #__globalHeader .__child li svg {
    width: 14px;
    height: 14px;
    margin-left: 1.5rem;
  }
}
@media screen and (min-width: 600px) {
  #__globalHeader .__child li svg {
    width: 20px;
    height: 20px;
    margin-left: 2.5rem;
  }
}

.__matchSliderItemWrapper .__main {
  margin-bottom: 1.8rem;
}
@media screen and (min-width: 320px) {
  .__matchSliderItemWrapper .__main {
    padding: 0 0 1.8rem;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
@media screen and (min-width: 600px) {
  .__matchSliderItemWrapper .__main {
    padding: 0 5vw 1.8rem;
    -webkit-box-align: unset;
        -ms-flex-align: unset;
            align-items: unset;
  }
}
@media screen and (min-width: 1025px) {
  .__matchSliderItemWrapper .__main {
    padding: 0 5vw 1.8rem;
    -webkit-box-align: unset;
        -ms-flex-align: unset;
            align-items: unset;
  }
}
.__matchSliderItemWrapper time {
  letter-spacing: 0.08em;
}
@media screen and (min-width: 320px) {
  .__matchSliderItemWrapper time {
    font-size: 1rem;
  }
}
@media screen and (min-width: 600px) {
  .__matchSliderItemWrapper time {
    font-size: 1.84vw;
  }
}
@media screen and (min-width: 1025px) {
  .__matchSliderItemWrapper time {
    font-size: 1.84vw;
  }
}
@media screen and (min-width: 1441px) {
  .__matchSliderItemWrapper time {
    font-size: 1.84vw;
  }
}
.__matchSliderItemWrapper .__matchname {
  letter-spacing: 0.06em;
  margin: 1.2rem 0 0.6rem;
}
@media screen and (min-width: 320px) {
  .__matchSliderItemWrapper .__matchname {
    font-size: 1.3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
@media screen and (min-width: 600px) {
  .__matchSliderItemWrapper .__matchname {
    font-size: 1.64vw;
    display: block;
  }
}
@media screen and (min-width: 1025px) {
  .__matchSliderItemWrapper .__matchname {
    font-size: 1.14vw;
    display: block;
  }
}
@media screen and (min-width: 1441px) {
  .__matchSliderItemWrapper .__matchname {
    font-size: 1.04vw;
    display: block;
  }
}

/* ------------------------------
    FOOTER
  ------------------------------ */
#globalFooter {
  position: relative;
  background: #121212;
  color: #FFF;
  margin-top: 10rem;
}
@media screen and (min-width: 320px) {
  #globalFooter {
    padding-bottom: 15rem;
  }
}
@media screen and (min-width: 1025px) {
  #globalFooter {
    padding-bottom: 0;
  }
}
#globalFooter .gFooterInner {
  overflow: hidden;
}
#globalFooter .__footerInner {
  padding: 0 2.5vw;
}
#globalFooter::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  background: url("../images/footLogo.webp") center bottom/contain no-repeat;
}
@media screen and (min-width: 320px) {
  #globalFooter::before {
    height: 1.57rem;
    top: -1.5rem;
  }
}
@media screen and (min-width: 1025px) {
  #globalFooter::before {
    height: 7.1rem;
    top: -6rem;
  }
}

@media screen and (min-width: 320px) {
  #footPartner {
    padding: 4.6rem 2.5vw 5.8rem;
  }
}
@media screen and (min-width: 1025px) {
  #footPartner {
    padding: 6.3rem 2.5vw 7.8rem;
  }
}
#footPartner ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 2.5vw auto 0;
}
@media screen and (min-width: 320px) {
  #footPartner ul {
    padding-top: 2.5vw;
    gap: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  #footPartner ul {
    padding-top: 3.8vw;
    gap: 0;
  }
}
@media screen and (min-width: 320px) {
  #footPartner ul li {
    width: 25vw;
    padding: 0.6rem 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  #footPartner ul li {
    width: 15.8rem;
    padding: 0 1.57rem;
  }
}
@media screen and (min-width: 320px) {
  #footPartner ul li.hama {
    width: 25vw;
  }
}
@media screen and (min-width: 1025px) {
  #footPartner ul li.hama {
    width: 31.5rem;
  }
}
#footPartner ul li.ua {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
}
#footPartner ul li.ua a {
  display: block;
  -webkit-transition: -webkit-transform 400ms ease;
  transition: -webkit-transform 400ms ease;
  transition: transform 400ms ease;
  transition: transform 400ms ease, -webkit-transform 400ms ease;
}
@media screen and (min-width: 320px) {
  #footPartner ul li.ua a {
    width: 8.7rem;
    margin-bottom: 1.8rem;
  }
}
@media screen and (min-width: 1025px) {
  #footPartner ul li.ua a {
    width: 13.4rem;
    margin-bottom: 7rem;
  }
}
#footPartner ul li.ua a:hover {
  -webkit-filter: unset;
          filter: unset;
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
#footPartner ul li.ua a:hover img {
  opacity: 1;
}
#footPartner ul li.ua a img {
  -webkit-filter: unset;
          filter: unset;
}
#footPartner ul a, #footPartner ul img {
  display: block;
  width: 100%;
  height: auto;
}
#footPartner ul a {
  position: relative;
  display: block;
}
#footPartner ul a:hover img:nth-child(1) {
  opacity: 0;
}
#footPartner ul a:hover img:nth-child(2) {
  opacity: 1;
}
#footPartner ul img {
  -webkit-transition: opacity 400ms ease;
  transition: opacity 400ms ease;
}
#footPartner ul img:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 0;
}

#footerSns {
  font-weight: 700;
  font-family: oswald, sans-serif;
  color: #FFF;
}
@media screen and (min-width: 320px) {
  #footerSns {
    padding: 6rem 0;
  }
}
@media screen and (min-width: 1025px) {
  #footerSns {
    padding: 9rem 0 7.8rem;
  }
}
#footerSns .hashTag {
  text-align: center;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (min-width: 320px) {
  #footerSns .hashTag {
    font-size: 5rem;
  }
}
@media screen and (min-width: 1025px) {
  #footerSns .hashTag {
    font-size: 7.2rem;
  }
}
#footerSns ul {
  display: grid;
  width: 95%;
  margin: 1.5rem auto 0;
}
@media screen and (min-width: 320px) {
  #footerSns ul {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 1025px) {
  #footerSns ul {
    grid-template-columns: repeat(7, 1fr);
  }
}
#footerSns li:nth-child(1) a {
  background: #CF2E92;
}
#footerSns li:nth-child(2) a {
  background: #1DA1F2;
}
#footerSns li:nth-child(3) a {
  background: #434343;
}
#footerSns li:nth-child(4) a {
  background: #3EC8B3;
}
#footerSns li:nth-child(5) a {
  background: #DA1725;
}
#footerSns li:nth-child(6) a {
  background: #00B900;
}
#footerSns li:nth-child(7) a {
  background: #222222;
}
#footerSns a {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-shadow: 2px 2px 30px -8px rgba(0, 0, 0, 0);
          box-shadow: 2px 2px 30px -8px rgba(0, 0, 0, 0);
  -webkit-transition: -webkit-box-shadow 300ms ease, -webkit-transform 400ms ease;
  transition: -webkit-box-shadow 300ms ease, -webkit-transform 400ms ease;
  transition: box-shadow 300ms ease, transform 400ms ease;
  transition: box-shadow 300ms ease, transform 400ms ease, -webkit-box-shadow 300ms ease, -webkit-transform 400ms ease;
}
@media screen and (min-width: 320px) {
  #footerSns a {
    padding: 1.2rem 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  #footerSns a {
    padding: 1.5rem 2.2rem;
  }
}
#footerSns a:hover {
  z-index: 1;
  -webkit-box-shadow: 2px 2px 30px -8px rgba(0, 0, 0, 0.6);
          box-shadow: 2px 2px 30px -8px rgba(0, 0, 0, 0.6);
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
#footerSns svg {
  display: block;
  fill: #FFF;
}
@media screen and (min-width: 320px) {
  #footerSns svg {
    width: 2.1rem;
    height: 2.1rem;
  }
}
@media screen and (min-width: 1025px) {
  #footerSns svg {
    width: 2.8rem;
    height: 2.8rem;
  }
}
#footerSns .text {
  padding-top: 5px;
}
@media screen and (min-width: 320px) {
  #footerSns .text {
    font-size: 1.35rem;
  }
}
@media screen and (min-width: 1025px) {
  #footerSns .text {
    font-size: 1.8rem;
  }
}

.__footerLink {
  margin: 2.5vw auto 0;
  padding-top: 2.5vw;
}
.__footerLink ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.5vw;
}
.__footerLink a {
  position: relative;
  display: block;
  background: #1c2652;
  border-radius: 1.5px;
  overflow: hidden;
}
.__footerLink a:hover .__img img {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
.__footerLink .__img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.__footerLink .__img img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  opacity: 0.5;
  -webkit-filter: brightness(0.6);
          filter: brightness(0.6);
  -webkit-transition: -webkit-transform 400ms ease;
  transition: -webkit-transform 400ms ease;
  transition: transform 400ms ease;
  transition: transform 400ms ease, -webkit-transform 400ms ease;
}
.__footerLink .__text {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 5vw 0 2.5vw;
}
@media screen and (min-width: 320px) {
  .__footerLink .__text {
    height: 55vw;
  }
}
@media screen and (min-width: 600px) {
  .__footerLink .__text {
    height: 30vw;
  }
}
@media screen and (min-width: 1025px) {
  .__footerLink .__text {
    height: 30vw;
  }
}
.__footerLink .__en {
  font-family: oswald, sans-serif;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (min-width: 320px) {
  .__footerLink .__en {
    font-size: 5.6vw;
    padding-left: 3vw;
    border-left: solid 0.75vw;
  }
}
@media screen and (min-width: 600px) {
  .__footerLink .__en {
    font-size: 3.8vw;
    padding-left: 3vw;
    border-left: solid 0.75vw;
  }
}
@media screen and (min-width: 1025px) {
  .__footerLink .__en {
    font-size: 2vw;
    padding-left: 3vw;
    padding-top: 1rem;
    border-left: solid 0.75vw;
  }
}
.__footerLink .__ja {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 0 3vw;
}
@media screen and (min-width: 320px) {
  .__footerLink .__ja {
    font-size: 3vw;
  }
}
@media screen and (min-width: 600px) {
  .__footerLink .__ja {
    font-size: 1.6vw;
  }
}
@media screen and (min-width: 1025px) {
  .__footerLink .__ja {
    font-size: 1vw;
  }
}
@media screen and (min-width: 320px) {
  .__footerLink .__ja svg {
    width: 2rem;
    height: 2rem;
  }
}
@media screen and (min-width: 1025px) {
  .__footerLink .__ja svg {
    width: 4.4rem;
    height: 4.4rem;
  }
}

.endFooter .inner {
  width: 95%;
  border-top: solid 1px rgba(255, 255, 255, 0.3);
}
@media screen and (min-width: 320px) {
  .endFooter .inner {
    padding: 2.5vw;
    margin: 3rem auto 0;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .inner {
    padding: 2.5vw;
    margin: 3.9rem auto 0;
  }
}
.endFooter .sitemap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.endFooter .sitemap h1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media screen and (min-width: 320px) {
  .endFooter .sitemap h1 {
    width: 100%;
    margin: 4.7rem 0;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .sitemap h1 {
    width: 15%;
    margin: 0;
  }
}
.endFooter .sitemap h1 a, .endFooter .sitemap h1 img {
  display: block;
}
.endFooter .sitemap h1 a {
  -webkit-transition: opacity 500ms ease;
  transition: opacity 500ms ease;
}
@media screen and (min-width: 320px) {
  .endFooter .sitemap h1 a {
    width: 23%;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .sitemap h1 a {
    width: 50%;
  }
}
.endFooter .sitemap h1 a:hover {
  opacity: 0.6;
}
.endFooter .sitemap h1 img {
  display: block;
  width: 100%;
  height: auto;
}
.endFooter .sitemap nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (min-width: 320px) {
  .endFooter .sitemap nav {
    width: 100%;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .sitemap nav {
    width: 80%;
  }
}
.endFooter .sitemap nav div {
  margin-bottom: 2.3rem;
}
@media screen and (min-width: 320px) {
  .endFooter .sitemap nav div {
    width: 45%;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .sitemap nav div {
    width: 15%;
  }
}
.endFooter .sitemap nav h2 {
  font-family: oswald, sans-serif;
  font-weight: 700;
  margin-bottom: 0.7rem;
}
@media screen and (min-width: 320px) {
  .endFooter .sitemap nav h2 {
    font-size: 1.6rem;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .sitemap nav h2 {
    font-size: 2.2rem;
  }
}
.endFooter .sitemap nav li {
  padding: 5px 0;
  line-height: 1;
}
.endFooter .sitemap nav a {
  opacity: 0.85;
  letter-spacing: 0.03em;
  -webkit-transition: opacity 400ms ease;
  transition: opacity 400ms ease;
}
@media screen and (min-width: 320px) {
  .endFooter .sitemap nav a {
    font-size: 1.1rem;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .sitemap nav a {
    font-size: 1.4rem;
  }
}
.endFooter .sitemap nav a:hover {
  opacity: 0.4;
}
.endFooter .copyArea {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background: #121212;
}
@media screen and (min-width: 320px) {
  .endFooter .copyArea {
    padding: 2.5vw;
    font-size: 2.74vw;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}
@media screen and (min-width: 600px) {
  .endFooter .copyArea {
    padding: 2.5vw;
    font-size: 1.14vw;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .copyArea {
    padding: 2.5vw;
    font-size: 0.84vw;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}
@media screen and (min-width: 320px) {
  .endFooter .copyArea p {
    margin-top: 2rem;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .copyArea p {
    margin-top: 0;
  }
}
.endFooter .copyArea p, .endFooter .copyArea ul {
  opacity: 0.8;
}
.endFooter .copyArea ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.endFooter .copyArea ul li {
  padding: 3px 0;
}
.endFooter .copyArea ul li::after {
  content: "/";
}
@media screen and (min-width: 320px) {
  .endFooter .copyArea ul li::after {
    margin: 0 1rem;
  }
}
@media screen and (min-width: 1025px) {
  .endFooter .copyArea ul li::after {
    margin: 0 1.5rem;
  }
}
.endFooter .copyArea ul li:last-child::after {
  display: none;
}
.endFooter .copyArea a:hover {
  text-decoration: underline;
}

/* ===== #howto（お申込方法）内のスケジュール ===== */
.apply-section {
  position: relative;
}
@media screen and (min-width: 320px) {
  .apply-section {
    margin-top: 3rem;
  }
}
@media screen and (min-width: 1025px) {
  .apply-section {
    margin-top: 5rem;
  }
}

.apply-schedule {
  color: #1c2652;
}
.apply-schedule .schedule-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 4px;
}
@media screen and (min-width: 320px) {
  .apply-schedule .schedule-list {
    grid-template-columns: repeat(1, 1fr);
  }
}
@media screen and (min-width: 600px) {
  .apply-schedule .schedule-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
.apply-schedule .item-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 10px;
}
@media screen and (min-width: 320px) {
  .apply-schedule .item-top {
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
}
@media screen and (min-width: 600px) {
  .apply-schedule .item-top {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}
.apply-schedule .tag {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 6px;
  letter-spacing: 0.02em;
  border-radius: 999px;
  border: 1px solid var(--c-line, rgba(255, 255, 255, 0.12));
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
}
@media screen and (min-width: 320px) {
  .apply-schedule .tag {
    padding: 4px 8px;
    font-size: 1.1rem;
  }
}
@media screen and (min-width: 600px) {
  .apply-schedule .tag {
    padding: 6px 10px;
    font-size: 1.2rem;
  }
}
.apply-schedule .tag-keep, .apply-schedule .tag-change {
  background: #c11830;
}
.apply-schedule .tag-new {
  background: rgb(0, 163, 255);
}
.apply-schedule .schedule-item {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 12px;
  min-height: 220px;
  background: #FFF;
  color: #1c2652;
  border: 1px solid #ddd;
  border-radius: var(--radius, 28px);
  padding: clamp(16px, 2.4vw, 24px);
  -webkit-box-shadow: 0 0 24px -12px rgba(0, 0, 0, 0.16);
          box-shadow: 0 0 24px -12px rgba(0, 0, 0, 0.16);
  overflow: hidden;
}
.apply-schedule .schedule-item.isSimple {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: unset;
}
@media screen and (min-width: 320px) {
  .apply-schedule .schedule-item .notes {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 600px) {
  .apply-schedule .schedule-item .notes {
    font-size: 1.8rem;
  }
}
.apply-schedule .schedule-item .notes .notes {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (min-width: 320px) {
  .apply-schedule .schedule-item .notes .notes {
    gap: 0.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .apply-schedule .schedule-item .notes .notes {
    gap: 1.6rem;
  }
}
.apply-schedule .date {
  font-weight: 900;
  letter-spacing: 0.02em;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
}
@media screen and (min-width: 320px) {
  .apply-schedule .date {
    font-size: 1.4rem;
  }
}
@media screen and (min-width: 600px) {
  .apply-schedule .date {
    font-size: 2rem;
  }
}
.apply-schedule .date span {
  background: #c11830;
  color: #FFF;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50%;
}
@media screen and (min-width: 320px) {
  .apply-schedule .date span {
    width: 3.2rem;
    height: 3.2rem;
    font-size: 1.4rem;
  }
}
@media screen and (min-width: 600px) {
  .apply-schedule .date span {
    width: 4.2rem;
    height: 4.2rem;
    font-size: 2.2rem;
  }
}
.apply-schedule .item-ttl {
  margin: 0.2rem 0 0;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (min-width: 320px) {
  .apply-schedule .item-ttl {
    font-size: 1.8rem;
  }
}
@media screen and (min-width: 600px) {
  .apply-schedule .item-ttl {
    font-size: 3rem;
  }
}
.apply-schedule .deadline-card {
  margin-top: clamp(18px, 3.2vw, 28px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 16px;
  padding: clamp(14px, 2.4vw, 22px);
  border-radius: var(--radius, 28px);
  background: #1c2652;
  color: #FFF;
}

.faqAttention {
  /* 既存のカラートークンがあれば自動で馴染むように */
  --_accent: var(--color-accent, #c11830);
  --_text: var(--color-text, #111);
  --_muted: var(--color-text-muted, rgba(0, 0, 0, 0.72));
  --_bg: var(--color-surface, #fff);
  --_soft: color-mix(in srgb, var(--_accent) 8%, var(--_bg));
  --_border: color-mix(in srgb, var(--_accent) 24%, rgba(0, 0, 0, 0));
  border: 1px solid var(--_border);
  background: var(--_soft);
  border-radius: 16px;
  padding: clamp(16px, 2.2vw, 22px);
  display: grid;
  gap: 10px;
  margin-top: 24px;
}
.faqAttention__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--_text);
  line-height: 1.35;
  padding-left: 12px;
  position: relative;
}
@media screen and (min-width: 320px) {
  .faqAttention__title {
    font-size: 1.8rem;
  }
}
@media screen and (min-width: 600px) {
  .faqAttention__title {
    font-size: 2.8rem;
  }
}
.faqAttention__title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.15em;
  width: 4px;
  height: 1.1em;
  border-radius: 999px;
  background: var(--_accent);
}
.faqAttention__text {
  margin: 0;
  color: var(--_muted);
  line-height: 1.7;
}
@media screen and (min-width: 320px) {
  .faqAttention__text {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 600px) {
  .faqAttention__text {
    font-size: 2rem;
  }
}
.faqAttention__link {
  justify-self: start;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  color: var(--_accent);
  font-weight: 700;
  text-decoration: none;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--_accent) 28%, rgba(0, 0, 0, 0));
  background: #fff;
  -webkit-transition: background 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
  transition: background 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
}
.faqAttention__link::after {
  content: "↗";
  font-size: 0.95em;
  opacity: 0.9;
}
.faqAttention__link:hover {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
  -webkit-box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
          box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
}
.faqAttention__link:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--_accent) 35%, #fff);
  outline-offset: 3px;
}

.matchesSeat {
  position: relative;
}
.matchesSeat img {
  display: block;
  width: 100%;
  height: auto;
}

.stadiumSeat {
  position: absolute;
}
@media screen and (min-width: 320px) {
  .stadiumSeat {
    width: 1.8rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat {
    width: 4rem;
  }
}
.stadiumSeat img {
  width: 100%;
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(1) {
    top: 9.7%;
    right: 7rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(1) {
    top: 8.5%;
    right: 19rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(1) {
    top: 9.8%;
    right: 30rem;
  }
}
.stadiumSeat:nth-of-type(2) {
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(2) {
    top: 9%;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(2) {
    top: 12%;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(2) {
    top: 12%;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(3) {
    top: 9.7%;
    left: 7rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(3) {
    top: 8.5%;
    left: 19rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(3) {
    top: 9.8%;
    left: 30rem;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(4) {
    top: 26.5%;
    left: 0.8rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(4) {
    top: 20%;
    left: 6.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(4) {
    top: 23%;
    left: 6.4rem;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(5) {
    top: 58%;
    left: 0.8rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(5) {
    top: 60.4%;
    left: 6.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(5) {
    top: 60%;
    left: 6.4rem;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(6) {
    top: 40%;
    right: 0;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(6) {
    top: 45%;
    right: 7.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(6) {
    top: 45%;
    right: 7.8rem;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(7) {
    top: 73%;
    left: 3.3rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(7) {
    top: 76%;
    left: 19.8%;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(7) {
    top: 76.9%;
    left: 19.8%;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(8) {
    top: 76%;
    left: 6.8rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(8) {
    top: 77.3%;
    left: 16.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(8) {
    top: 82.6%;
    left: 36rem;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(9) {
    top: 78%;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(9) {
    top: 78%;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(9) {
    top: 78%;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
.stadiumSeat:nth-of-type(10) {
  visibility: hidden !important;
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(10) {
    top: 76%;
    left: 12.1rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(10) {
    top: 77.3%;
    left: 29.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(10) {
    top: 81%;
    left: 43.7rem;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(11) {
    top: 76%;
    right: 7.4rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(11) {
    top: 77.3%;
    right: 23.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(11) {
    top: 82.6%;
    right: 36rem;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(12) {
    top: 73%;
    right: 3.8rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(12) {
    top: 76.9%;
    right: 23.5rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(12) {
    top: 76.9%;
    right: 23.5rem;
  }
}
@media screen and (min-width: 320px) {
  .stadiumSeat:nth-of-type(13) {
    top: 76%;
    right: 3.3rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumSeat:nth-of-type(13) {
    top: 76%;
    right: 8.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumSeat:nth-of-type(13) {
    top: 76.9%;
    right: 14rem;
  }
}

.stadiumModal {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100dvh;
  width: 100vw;
  color: #FFF;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.stadiumModal::-webkit-scrollbar {
  display: none;
}
.stadiumModal .stadiumImgWrapper {
  border-radius: 0.3rem;
  background: rgba(255, 255, 255, 0.1);
  -webkit-box-shadow: 0.5rem 0.5rem 2rem 0 rgba(0, 0, 0, 0.15);
          box-shadow: 0.5rem 0.5rem 2rem 0 rgba(0, 0, 0, 0.15);
}
@media screen and (min-width: 320px) {
  .stadiumModal .stadiumImgWrapper {
    width: 90%;
    padding: 1rem 1rem 2.8rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumModal .stadiumImgWrapper {
    width: 80%;
    padding: 1.6rem 1.8rem 3.8rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumModal .stadiumImgWrapper {
    width: 55%;
    padding: 1.6rem 1.8rem 2.8rem;
  }
}
.stadiumModal img {
  width: 100%;
  aspect-ratio: 16/10;
  -o-object-fit: cover;
     object-fit: cover;
}
.stadiumModal .title {
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .stadiumModal .title {
    font-size: 1.6rem;
    letter-spacing: 0.1rem;
    margin-top: 1.5rem;
  }
}
@media screen and (min-width: 600px) {
  .stadiumModal .title {
    font-size: 3rem;
    letter-spacing: 0.2rem;
    margin-top: 2.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .stadiumModal .title {
    font-size: 1.85rem;
    letter-spacing: 0.2rem;
    margin-top: 2.3rem;
  }
}

/* 横スクロール用ラッパ（任意だけどおすすめ） */
.tblScroll {
  position: relative;
  margin-top: 1.2rem;
}
.tblScroll__hint {
  margin: 0 0 0.8rem;
  font-size: 1.2rem;
  opacity: 0.75;
}

/* WPの figure をスクロールコンテナ化（ラップ無しでも効く） */
.wp-block-flexible-table-block-table {
  position: relative;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 16px;
  /* 端のグラデで「横スクロールできます感」 */
}
.wp-block-flexible-table-block-table::after {
  content: "";
  pointer-events: none;
  position: sticky;
  right: 0;
  top: 0;
  display: block;
  width: 28px;
  height: 100%;
  margin-left: auto;
  background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0.95)), to(rgba(255, 255, 255, 0)));
  background: linear-gradient(to left, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0));
}

/* 既存のテーブル共通に効かせつつ、スマホは“潰さず横スクロール”に */
.wp-block-flexible-table-block-table table {
  width: 100%;
  table-layout: auto; /* fixed だと潰れるのでスマホは auto 推奨 */
}

/* ⚠️ 今回の表はヘッダー2行が thead ではなく tbody にあるため、ここで当てる */
.wp-block-flexible-table-block-table table tbody tr:nth-child(-n+2) td {
  background: #1c2652 !important; /* inline の background-color を上書き */
  color: #fff !important;
  font-weight: 700;
}

/* 横スクロール時に見失わないように：ヘッダー2行を sticky */
@media (max-width: 720px) {
  .wp-block-flexible-table-block-table table tbody tr:nth-child(-n+2) td {
    position: sticky;
    top: 0;
    z-index: 3;
  }
  /* さらに「席種」列（1列目）を sticky にするとかなり見やすい */
  .wp-block-flexible-table-block-table table tbody td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: #fff;
  }
  /* ヘッダー行の1列目は、top + left 両方 sticky なので最前面 */
  .wp-block-flexible-table-block-table table tbody tr:nth-child(-n+2) td:first-child {
    z-index: 4;
    background: #1c2652 !important;
    color: #fff !important;
  }
  /* スマホ用に余白・文字サイズ調整（お好みで） */
  .courseDelivery th, .courseDelivery td,
  .wp-block-flexible-table-block-table table th,
  .wp-block-flexible-table-block-table table td {
    padding: 0.8rem;
    font-size: 1.1rem;
    white-space: nowrap; /* 折返しで縦に伸びすぎるのを防ぐ */
  }
  /* 席種名だけは折り返してOKにしたい場合（メインS指定席など） */
  .wp-block-flexible-table-block-table table tbody td:first-child {
    white-space: normal;
    line-height: 1.2;
  }
}
.sectionLi {
  margin: 12px 0;
}
@media screen and (min-width: 320px) {
  .sectionLi {
    padding: 16px 8px 8px 3.2rem;
  }
}
@media screen and (min-width: 600px) {
  .sectionLi {
    padding: 16px 0 8px 5.6rem;
  }
}
.sectionLi li {
  list-style-type: disc;
  line-height: 1.64;
  font-size: 90%;
}
@media screen and (min-width: 320px) {
  .sectionLi li {
    margin-bottom: 8px;
  }
}
@media screen and (min-width: 600px) {
  .sectionLi li {
    margin-bottom: 12px;
  }
}
.sectionLi li a {
  text-decoration: underline;
}
.sectionLi li a:hover {
  text-decoration: none;
}

@media screen and (min-width: 320px) {
  #resale .courseBlockTitle {
    margin: 24px 0 12px;
  }
}
@media screen and (min-width: 600px) {
  #resale .courseBlockTitle {
    margin: 48px 0 16px;
  }
}

.linkRow {
  --_accent: rgb(var(--color-main, 193 24 48));
  --_accentSoft: rgb(var(--color-main, 193 24 48) / .10);
  --_border: rgb(var(--color-main, 193 24 48) / .22);
  --_text: var(--color-text, #111);
  --_muted: rgba(0,0,0,.65);
  margin: 16px 0 0;
  display: grid;
  gap: 10px;
  /* HTMLの <br> は grid gap で不要なので念のため無効化 */
}
.linkRow a {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--_border);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(var(--_accentSoft)));
  background: linear-gradient(180deg, #fff, var(--_accentSoft));
  color: var(--_text);
  text-decoration: none;
  font-weight: 700;
  -webkit-box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.8);
          box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.8);
  -webkit-transition: background 0.12s ease, border-color 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
  transition: background 0.12s ease, border-color 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease, border-color 0.12s ease;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease, border-color 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
  /* 右側の「→」 */
}
.linkRow a::after {
  content: "→";
  color: var(--_accent);
  font-weight: 800;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  opacity: 0.9;
  -webkit-transform: translateX(0);
          transform: translateX(0);
  -webkit-transition: opacity 0.12s ease, -webkit-transform 0.12s ease;
  transition: opacity 0.12s ease, -webkit-transform 0.12s ease;
  transition: transform 0.12s ease, opacity 0.12s ease;
  transition: transform 0.12s ease, opacity 0.12s ease, -webkit-transform 0.12s ease;
}
.linkRow a:hover {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
  border-color: rgb(var(--color-main, 193 24 48)/0.32);
  -webkit-box-shadow: 0 14px 34px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.85);
          box-shadow: 0 14px 34px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.85);
}
.linkRow a:hover::after {
  -webkit-transform: translateX(2px);
          transform: translateX(2px);
  opacity: 1;
}
.linkRow a:active {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08), inset 0 2px 6px rgba(0, 0, 0, 0.06);
          box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08), inset 0 2px 6px rgba(0, 0, 0, 0.06);
}
.linkRow a:focus-visible {
  outline: 3px solid rgb(var(--color-main, 193 24 48)/0.25);
  outline-offset: 3px;
}
.linkRow br {
  display: none;
}
@media screen and (min-width: 320px) {
  .linkRow a {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .linkRow {
    gap: 14px;
  }
  .linkRow a {
    font-size: 2rem;
    padding: 16px 18px;
    border-radius: 18px;
  }
}

.matchTableWrap {
  color: #1c2652;
  margin-top: 24px;
}
.matchTableWrap .matchTableHint {
  margin: 0 0 10px;
  font-weight: 700;
  opacity: 0.72;
}
@media screen and (min-width: 320px) {
  .matchTableWrap .matchTableHint {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .matchTableWrap .matchTableHint {
    font-size: 1.6rem;
  }
}
.matchTableWrap .matchTableScroll {
  border: 1px solid rgba(28, 38, 82, 0.12);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  /* スマホで横スクロール */
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  /* 右端にうっすらグラデ（横スクロール誘導） */
  position: relative;
}
.matchTableWrap .matchTableScroll::after {
  content: "";
  pointer-events: none;
  position: sticky;
  right: 0;
  top: 0;
  display: block;
  width: 28px;
  height: 100%;
  margin-left: auto;
  background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0.96)), to(rgba(255, 255, 255, 0)));
  background: linear-gradient(to left, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0));
}
.matchTableWrap .matchTable {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  text-align: center;
  /* 列が多いので最小幅を確保 → スマホは横スワイプで見やすい */
  min-width: 920px;
  table-layout: auto;
}
.matchTableWrap .matchTable thead {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #fff;
}
.matchTableWrap .matchTable thead th {
  text-align: center;
  font-weight: 900;
  letter-spacing: 0.04em;
  border-bottom: 1px solid rgba(28, 38, 82, 0.12);
  border-right: 1px solid rgba(28, 38, 82, 0.1);
  padding: 12px 12px;
  /* うっすらヘッダートーン */
  background: rgba(28, 38, 82, 0.035);
}
@media screen and (min-width: 320px) {
  .matchTableWrap .matchTable thead th {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 600px) {
  .matchTableWrap .matchTable thead th {
    font-size: 1.6rem;
  }
}
.matchTableWrap .matchTable thead th:last-child {
  border-right: none;
}
.matchTableWrap .matchTable tbody {
  /* ゼブラ（強すぎない） */
  /* 特別価格対象行：ほんのり強調 */
  /* 対戦相手だけ少し読みやすく */
}
.matchTableWrap .matchTable tbody td {
  padding: 12px 12px;
  border-bottom: 1px solid rgba(28, 38, 82, 0.08);
  border-right: 1px solid rgba(28, 38, 82, 0.08);
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .matchTableWrap .matchTable tbody td {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 600px) {
  .matchTableWrap .matchTable tbody td {
    font-size: 1.6rem;
  }
}
.matchTableWrap .matchTable tbody td:last-child {
  border-right: none;
}
.matchTableWrap .matchTable tbody tr:last-child td {
  border-bottom: none;
}
.matchTableWrap .matchTable tbody tr:nth-child(even) td {
  background: rgba(28, 38, 82, 0.03);
}
.matchTableWrap .matchTable tbody tr.is-special td {
  background: rgba(28, 38, 82, 0.045);
}
.matchTableWrap .matchTable tbody td:nth-child(4) {
  text-align: left;
  font-weight: 900;
}
.matchTableWrap .matchTable tbody .specialMark {
  text-align: center;
}
.matchTableWrap .matchTable tbody .specialMark span {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(28, 38, 82, 0.16);
  background: rgba(28, 38, 82, 0.06);
  font-weight: 900;
}
.matchTableWrap .matchTableNotes {
  margin: 12px 0 0;
  padding-left: 1.2em;
}
.matchTableWrap .matchTableNotes li {
  line-height: 1.7;
  opacity: 0.85;
}
@media screen and (min-width: 320px) {
  .matchTableWrap .matchTableNotes li {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .matchTableWrap .matchTableNotes li {
    font-size: 1.6rem;
  }
}

.matchTableWrap.storeTable .matchTable {
  /* 店舗は文字量が多いので少し広めに */
  min-width: 980px;
  /* 店舗名は少し強く */
  /* 列幅の目安（テーブルがautoでも“意図”を与える） */
  /* 販売場所 */
  /* 所在地 */
  /* 営業時間 */
  /* 券種/備考 */
}
.matchTableWrap.storeTable .matchTable thead th {
  white-space: nowrap;
}
.matchTableWrap.storeTable .matchTable tbody td {
  text-align: left; /* 店舗情報は左寄せの方が読める */
  font-weight: 700;
  line-height: 1.7;
  white-space: normal; /* 折り返しOK（brも活かす） */
  vertical-align: top;
}
.matchTableWrap.storeTable .matchTable .storeName {
  font-weight: 900;
  letter-spacing: 0.02em;
  background: rgba(28, 38, 82, 0.02);
  white-space: normal;
}
.matchTableWrap.storeTable .matchTable .storeHours {
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.matchTableWrap.storeTable .matchTable thead th:nth-child(1) {
  width: 22%;
}
.matchTableWrap.storeTable .matchTable thead th:nth-child(2) {
  width: 38%;
}
.matchTableWrap.storeTable .matchTable thead th:nth-child(3) {
  width: 14%;
}
.matchTableWrap.storeTable .matchTable thead th:nth-child(4) {
  width: 26%;
}

/* 価格テーブル用：.matchTableの挙動に合わせて拡張 */
.matchTableWrap--priceTabs {
  /* 列が多いので少しだけ最小幅を上げる */
  /* “内部列”はユーザーに見せない用：切替のためにDOMには残す */
  /* ===== タブで「基本 / 特別」の列を切替 ===== */
}
.matchTableWrap--priceTabs .matchTableTabs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 8px;
  margin: 0 0 10px;
}
.matchTableWrap--priceTabs .matchTableTab {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid rgba(28, 38, 82, 0.18);
  background: rgba(28, 38, 82, 0.03);
  color: #1c2652;
  border-radius: 999px;
  font-weight: 900;
  letter-spacing: 0.04em;
  cursor: pointer;
  -webkit-transition: background 0.15s ease, border-color 0.15s ease, -webkit-transform 0.15s ease;
  transition: background 0.15s ease, border-color 0.15s ease, -webkit-transform 0.15s ease;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, -webkit-transform 0.15s ease;
}
@media screen and (min-width: 320px) {
  .matchTableWrap--priceTabs .matchTableTab {
    font-size: 1.3rem;
    padding: 10px 14px;
  }
}
@media screen and (min-width: 1025px) {
  .matchTableWrap--priceTabs .matchTableTab {
    font-size: 1.5rem;
    padding: 10px 16px;
  }
}
.matchTableWrap--priceTabs .matchTableTab:hover {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
}
.matchTableWrap--priceTabs .matchTableTab:focus-visible {
  outline: 3px solid rgba(28, 38, 82, 0.22);
  outline-offset: 3px;
}
.matchTableWrap--priceTabs .matchTableTab.is-active {
  background: rgba(28, 38, 82, 0.08);
  border-color: rgba(28, 38, 82, 0.28);
  -webkit-box-shadow: 0 10px 22px rgba(0, 0, 0, 0.06);
          box-shadow: 0 10px 22px rgba(0, 0, 0, 0.06);
}
.matchTableWrap--priceTabs .matchTable--prices {
  min-width: 980px;
  table-layout: auto;
  /* ✅ ここが肝：tbodyの th も td と同等に装飾（罫線欠け対策） */
  /* 既存matchTableの nth-child 指定を潰したい場合はこれでOK（price列だけ優先） */
}
.matchTableWrap--priceTabs .matchTable--prices thead th,
.matchTableWrap--priceTabs .matchTable--prices tbody td,
.matchTableWrap--priceTabs .matchTable--prices tbody th {
  white-space: nowrap;
}
.matchTableWrap--priceTabs .matchTable--prices thead th.col-seat {
  width: 20%;
}
.matchTableWrap--priceTabs .matchTable--prices thead th.col-age {
  width: 16%;
}
.matchTableWrap--priceTabs .matchTable--prices thead th.col-kind {
  width: 16%;
}
.matchTableWrap--priceTabs .matchTable--prices thead th.col-adv {
  width: 19%;
}
.matchTableWrap--priceTabs .matchTable--prices thead th.col-day {
  width: 19%;
}
.matchTableWrap--priceTabs .matchTable--prices tbody {
  /* ✅ ゼブラを “行の全セル” に（thも含める） */
}
.matchTableWrap--priceTabs .matchTable--prices tbody th, .matchTableWrap--priceTabs .matchTable--prices tbody td {
  padding: 12px 12px;
  border-bottom: 1px solid rgba(28, 38, 82, 0.08);
  border-right: 1px solid rgba(28, 38, 82, 0.08);
  font-weight: 700;
}
@media screen and (min-width: 320px) {
  .matchTableWrap--priceTabs .matchTable--prices tbody th, .matchTableWrap--priceTabs .matchTable--prices tbody td {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 600px) {
  .matchTableWrap--priceTabs .matchTable--prices tbody th, .matchTableWrap--priceTabs .matchTable--prices tbody td {
    font-size: 1.6rem;
  }
}
.matchTableWrap--priceTabs .matchTable--prices tbody th:last-child, .matchTableWrap--priceTabs .matchTable--prices tbody td:last-child {
  border-right: none;
}
.matchTableWrap--priceTabs .matchTable--prices tbody tr:last-child th,
.matchTableWrap--priceTabs .matchTable--prices tbody tr:last-child td {
  border-bottom: none;
}
.matchTableWrap--priceTabs .matchTable--prices tbody tr:nth-child(even) > * {
  background: rgba(28, 38, 82, 0.03);
}
.matchTableWrap--priceTabs .matchTable--prices tbody tr.is-special > * {
  background: rgba(28, 38, 82, 0.045);
}
.matchTableWrap--priceTabs .matchTable--prices tbody th.seat {
  text-align: left;
  font-weight: 900;
  line-height: 1.35;
  vertical-align: middle;
  background: #fff;
}
.matchTableWrap--priceTabs .matchTable--prices tbody td.age,
.matchTableWrap--priceTabs .matchTable--prices tbody td.kind {
  font-weight: 800;
  opacity: 0.9;
  text-align: center;
}
.matchTableWrap--priceTabs .matchTable--prices tbody td.price {
  text-align: right;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.matchTableWrap--priceTabs .matchTable--prices tbody td.price {
  text-align: right;
}
.matchTableWrap--priceTabs .visuallyHiddenCol {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
  white-space: nowrap;
}
.matchTableWrap--priceTabs.priceMode--basic .price--special {
  display: none;
}
.matchTableWrap--priceTabs.priceMode--basic .thLabel--special {
  display: none;
}
.matchTableWrap--priceTabs.priceMode--basic .thLabel--basic {
  display: inline;
}
.matchTableWrap--priceTabs.priceMode--special .price--basic {
  display: none;
}
.matchTableWrap--priceTabs.priceMode--special .thLabel--basic {
  display: none;
}
.matchTableWrap--priceTabs.priceMode--special .thLabel--special {
  display: inline;
}

/* basic表示時：特別列を隠す */
.matchTableWrap--priceTabs.priceMode--basic .price--special,
.matchTableWrap--priceTabs.priceMode--basic .col-adv--special,
.matchTableWrap--priceTabs.priceMode--basic .col-day--special,
.matchTableWrap--priceTabs.priceMode--basic .thLabel--special {
  display: none;
}

/* special表示時：基本列を隠す */
.matchTableWrap--priceTabs.priceMode--special .price--basic,
.matchTableWrap--priceTabs.priceMode--special .thLabel--basic {
  display: none;
}

/* =========================
 * matchTable (simple 3-col) patch
 *  - 1行目だけ崩れる対策：tbodyのthを .seat 前提に統一
 *  - 既存の.matchTableには影響させない
 * ========================= */
.matchTableWrap--simple .matchTable {
  width: 100%;
  min-width: 520px; /* 横スワイプ前提 */
  border-collapse: separate;
  border-spacing: 0;
}
@media screen and (min-width: 320px) {
  .matchTableWrap--simple .matchTable th:first-child {
    width: 30%;
  }
}
@media screen and (min-width: 600px) {
  .matchTableWrap--simple .matchTable th:first-child {
    width: 30%;
  }
}

.matchTable.isPrice {
  min-width: unset;
}
.matchTable.isPrice th.seat {
  position: sticky;
  left: 0;
  z-index: 100;
}
@media screen and (min-width: 320px) {
  .matchTable.isPrice th.seat {
    width: 30%;
  }
}
@media screen and (min-width: 600px) {
  .matchTable.isPrice th.seat {
    width: 30%;
  }
}

/* 角丸・枠は Scroll 側で持たせる（iOSのoverflow描画対策） */
.matchTableWrap--simple .matchTableScroll {
  border-radius: 16px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  -webkit-transform: translateZ(0); /* iOSの描画安定 */
}

.matchTableWrap--simple .matchTable th,
.matchTableWrap--simple .matchTable td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  background: #fff;
  vertical-align: middle;
  white-space: nowrap;
}

/* ヘッダー */
.matchTableWrap--simple .matchTable thead th {
  text-align: center;
  font-weight: 700;
  background: rgba(0, 0, 0, 0.03);
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* 1列目（席種）— scope違い(row/rowgroup)でも同じ見え方にする */
.matchTableWrap--simple .matchTable tbody th.seat {
  text-align: left;
  font-weight: 700;
}

/* 2列目 */
.matchTableWrap--simple .matchTable tbody td.kind {
  text-align: center;
  font-weight: 600;
}

/* 3列目（価格） */
.matchTableWrap--simple .matchTable tbody td.price {
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* しましま（rowspanでも破綻しにくい） */
.matchTableWrap--simple .matchTable tbody tr:nth-child(even) th,
.matchTableWrap--simple .matchTable tbody tr:nth-child(even) td {
  background: rgba(0, 0, 0, 0.015);
}

/* 最終行のボーダー消し */
.matchTableWrap--simple .matchTable tbody tr:last-child th,
.matchTableWrap--simple .matchTable tbody tr:last-child td {
  border-bottom: 0;
}

/* =========================
 * matchTable schedule patch
 * ========================= */
.matchTable.matchTable--schedule tbody tr.is-special > * {
  background: rgba(193, 24, 48, 0.07) !important; /* 薄赤 */
}

/* hoverがあるデザインでも“赤み”が負けないように */
@media (hover: hover) {
  .matchTable.matchTable--schedule tbody tr.is-special:hover > * {
    background: rgba(193, 24, 48, 0.1);
  }
}
/* ★（特別価格マーク）を少し強調 */
.matchTable.matchTable--schedule .specialMark {
  text-align: center;
  font-weight: 800;
}

/* 「—」を消して空欄でも高さ・見た目が崩れないように */
.matchTable.matchTable--schedule .specialMark:empty::before {
  content: "";
  display: inline-block;
  width: 1em; /* 何も無いと詰まりすぎる場合の“余白” */
}

/* 開催日が長いので折返し許可（スマホで溢れないように） */
.matchTable.matchTable--schedule td[data-label=開催日] {
  white-space: normal;
  line-height: 1.35;
}

/* =========================
  matchTable：先頭列を固定（横スクロール時）
========================= */
/* 先頭列 sticky には border-collapse: collapse が相性悪いことがあるので分離 */
.matchTable {
  border-collapse: separate;
  border-spacing: 0;
}

/* 横スクロールコンテナ側（すでにあれば不要／念のため） */
.matchTableScroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* 先頭列（行タイトル列）を固定：thでもtdでも効かせる */
/* ============================
   .matchTable：先頭列 sticky 安定版
   ============================ */
/* スクロールコンテナ */
.matchTableScroll {
  overflow: auto;
  position: relative;
  isolation: isolate; /* 兄弟要素の重なり事故を遮断 */
}

/* ★重要：collapse だと z-index/sticky が破綻しやすい */
.matchTable {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  position: relative;
}

/* z-index が効く土台を全セルに作る（これが効きます） */
.matchTable th,
.matchTable td {
  position: relative;
  z-index: 1;
  background-clip: padding-box;
}

/* 先頭列を固定して最前面に */
.matchTable tr > :first-child {
  background: var(--su-bg, #fff);
}

/* もしヘッダー行もsticky/topを使っている場合の保険（なくてもOK） */
.matchTable thead th {
  z-index: 3;
}

.matchTable thead tr > :first-child {
  z-index: 6; /* 左上は最強 */
}

.buySteps {
  --_accent: rgb(var(--color-main, 193 24 48));
  --_accentSoft: rgb(var(--color-main, 193 24 48) / .10);
  --_border: rgb(var(--color-main, 193 24 48) / .16);
  --_shadow: 0 12px 28px rgba(0,0,0,.08);
  margin-top: 16px;
}
.buySteps__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
.buySteps__item {
  position: relative;
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  padding: 14px 14px 14px 12px;
  border-radius: 18px;
  border: 1px solid var(--_border);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(var(--_accentSoft)));
  background: linear-gradient(180deg, #fff, var(--_accentSoft));
  -webkit-box-shadow: var(--_shadow);
          box-shadow: var(--_shadow);
  /* ステップの縦ライン（SwiftUIぽい） */
}
.buySteps__item::before {
  content: "";
  position: absolute;
  left: 33px;
  top: 54px;
  bottom: -12px;
  width: 2px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(var(--color-main, 193 24 48)/0.35)), to(rgb(var(--color-main, 193 24 48)/0)));
  background: linear-gradient(180deg, rgb(var(--color-main, 193 24 48)/0.35), rgb(var(--color-main, 193 24 48)/0));
}
.buySteps__item:last-child::before {
  display: none;
}
.buySteps__num {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-weight: 900;
  color: #fff;
  background: var(--_accent);
  -webkit-box-shadow: 0 10px 18px rgb(var(--color-main, 193 24 48)/0.18);
          box-shadow: 0 10px 18px rgb(var(--color-main, 193 24 48)/0.18);
  -webkit-transform: translateY(2px);
          transform: translateY(2px);
}
.buySteps__body {
  min-width: 0; /* 長文折返しのため */
}
.buySteps__ttl {
  margin: 0 0 6px;
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 320px) {
  .buySteps__ttl {
    font-size: 1.4rem;
  }
}
@media screen and (min-width: 1025px) {
  .buySteps__ttl {
    font-size: 2.1rem;
  }
}
.buySteps__desc {
  margin: 0;
  opacity: 0.78;
  line-height: 1.7;
}
@media screen and (min-width: 320px) {
  .buySteps__desc {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1025px) {
  .buySteps__desc {
    font-size: 1.7rem;
  }
}
.buySteps__linkRow {
  margin: 10px 0 0;
}
.buySteps__link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.55em;
  padding: 0.55em 0.9em;
  border-radius: 999px;
  border: 1px solid rgb(var(--color-main, 193 24 48)/0.26);
  background: #fff;
  color: #1c2652;
  font-weight: 900;
  text-decoration: none;
  -webkit-box-shadow: 0 10px 22px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.9);
          box-shadow: 0 10px 22px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  -webkit-transition: border-color 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
  transition: border-color 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
  transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
  transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease, -webkit-transform 0.12s ease, -webkit-box-shadow 0.12s ease;
}
.buySteps__link::after {
  content: "↗";
  color: var(--_accent);
  font-weight: 900;
}
.buySteps__link:hover {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
  border-color: rgb(var(--color-main, 193 24 48)/0.36);
  -webkit-box-shadow: 0 14px 30px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.92);
          box-shadow: 0 14px 30px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.92);
}
.buySteps__link:active {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.buySteps__link:focus-visible {
  outline: 3px solid rgb(var(--color-main, 193 24 48)/0.22);
  outline-offset: 3px;
}
@media screen and (min-width: 1025px) {
  .buySteps__list {
    gap: 16px;
  }
  .buySteps__item {
    grid-template-columns: 54px 1fr;
    gap: 16px;
    padding: 18px 18px 18px 16px;
  }
  .buySteps__item::before {
    left: 40px;
    top: 66px;
  }
  .buySteps__num {
    width: 42px;
    height: 42px;
    font-size: 1.8rem;
  }
}

/* UA / ペア / ピッチサイド（席種詳細カード） */
.seatDetailGroup {
  margin-top: 32px;
}

.seatDetailGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.seatDetailCard {
  background: #fff;
  border: 1px solid rgba(28, 38, 82, 0.12);
  border-radius: 16px;
  overflow: hidden;
  -webkit-box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06);
          box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06);
}

.seatDetailHeader {
  padding: 18px 16px 0;
}
.seatDetailHeader .courseBlockTitle {
  margin-bottom: 10px;
}

.seatDetailHero,
.seatDetailFigure {
  margin: 0;
}
.seatDetailHero img,
.seatDetailFigure img {
  width: 100%;
  height: auto;
  display: block;
}

/* 1枚目の写真は“カードの表紙”感 */
@media screen and (min-width: 320px) {
  .seatDetailHero img {
    aspect-ratio: 16/9;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
@media screen and (min-width: 1025px) {
  .seatDetailHero img {
    aspect-ratio: 16/9;
    -o-object-fit: cover;
       object-fit: cover;
  }
}

.seatDetailBody {
  padding: 16px;
}

.courseBlockTitleSm {
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 18px 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  text-align: left;
}
@media screen and (min-width: 320px) {
  .courseBlockTitleSm {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseBlockTitleSm {
    font-size: 1.6rem;
  }
}

.seatDetailText {
  margin: 0 0 10px;
  line-height: 1.8;
  opacity: 0.92;
}
@media screen and (min-width: 320px) {
  .seatDetailText {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .seatDetailText {
    font-size: 1.6rem;
  }
}

/* 価格と座席数などを横並び（スマホは縦） */
.seatDetailMeta {
  display: grid;
  gap: 14px;
}
@media screen and (min-width: 320px) {
  .seatDetailMeta {
    grid-template-columns: 1fr;
  }
}
@media screen and (min-width: 1025px) {
  .seatDetailMeta {
    grid-template-columns: 1fr 1fr;
  }
}
.seatDetailMeta .seatMetaItem {
  padding: 12px 12px;
  border: 1px solid rgba(28, 38, 82, 0.1);
  border-radius: 14px;
  background: rgba(28, 38, 82, 0.03);
}
.seatDetailMeta .seatMetaItem .courseBlockTitleSm {
  margin-top: 0;
}
.seatDetailMeta .seatMetaItem .seatDetailText {
  margin-bottom: 0;
}

.seatDetailList {
  margin: 0;
  padding-left: 1.2em;
  line-height: 1.8;
}
@media screen and (min-width: 320px) {
  .seatDetailList {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .seatDetailList {
    font-size: 1.6rem;
  }
}
.seatDetailList li {
  margin: 0 0 6px;
}
.seatDetailList a {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.seatDetailList.is-note {
  opacity: 0.9;
}

/* 注意事項が長いので“箱”に入れて視線を整理 */
.seatNoteBox {
  margin-top: 10px;
  padding: 12px 12px;
}

.seatTabs {
  margin-top: 32px;
  color: #1c2652;
}
.seatTabs__head {
  position: sticky;
  top: 0;
  z-index: 10;
  background: white;
  margin-bottom: 12px;
}
.seatTabs__tablist {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding: 6px 2px 2px;
  /* 横スクロールのとき端が切れないように */
}
.seatTabs__tablist::-webkit-scrollbar {
  height: 6px;
}
.seatTabs__tablist::-webkit-scrollbar-thumb {
  background: rgba(28, 38, 82, 0.18);
  border-radius: 999px;
}
.seatTabs__tab {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid rgba(28, 38, 82, 0.18);
  background: rgba(28, 38, 82, 0.03);
  color: #1c2652;
  border-radius: 999px;
  font-weight: 900;
  letter-spacing: 0.04em;
  white-space: nowrap;
  cursor: pointer;
  -webkit-transition: background 0.15s ease, border-color 0.15s ease, -webkit-transform 0.15s ease;
  transition: background 0.15s ease, border-color 0.15s ease, -webkit-transform 0.15s ease;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, -webkit-transform 0.15s ease;
}
@media screen and (min-width: 320px) {
  .seatTabs__tab {
    font-size: 1.2rem;
    padding: 10px 14px;
  }
}
@media screen and (min-width: 1025px) {
  .seatTabs__tab {
    font-size: 1.5rem;
    padding: 10px 16px;
  }
}
.seatTabs__tab:hover {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
}
.seatTabs__tab:focus-visible {
  outline: 3px solid rgba(28, 38, 82, 0.22);
  outline-offset: 3px;
}
.seatTabs__tab.is-active {
  background: #1c2652;
  color: white;
  border-color: rgba(28, 38, 82, 0.28);
  -webkit-box-shadow: 0 10px 22px rgba(0, 0, 0, 0.06);
          box-shadow: 0 10px 22px rgba(0, 0, 0, 0.06);
}

/* パネル */
.seatPanel.is-active {
  display: block;
}

/* 既存カードUI（前回ベースを踏襲） */
.seatDetailCard {
  background: #fff;
  border: 1px solid rgba(28, 38, 82, 0.12);
  border-radius: 16px;
  overflow: hidden;
  -webkit-box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06);
          box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06);
}

.seatDetailHero,
.seatDetailFigure {
  margin: 0;
}
.seatDetailHero img,
.seatDetailFigure img {
  width: 100%;
  height: auto;
  display: block;
}

.seatDetailHero img {
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
}

.seatDetailBody {
  padding: 16px;
}

.courseBlockTitleSm {
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 18px 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  text-align: left;
}
@media screen and (min-width: 320px) {
  .courseBlockTitleSm {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .courseBlockTitleSm {
    font-size: 1.6rem;
  }
}

.seatDetailText {
  margin: 0 0 10px;
  line-height: 1.8;
  opacity: 0.92;
}
@media screen and (min-width: 320px) {
  .seatDetailText {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .seatDetailText {
    font-size: 1.6rem;
  }
}

.seatDetailMeta {
  display: grid;
  gap: 14px;
}
@media screen and (min-width: 320px) {
  .seatDetailMeta {
    grid-template-columns: 1fr;
  }
}
@media screen and (min-width: 1025px) {
  .seatDetailMeta {
    grid-template-columns: 1fr 1fr;
  }
}
.seatDetailMeta .seatMetaItem {
  padding: 12px;
  border: 1px solid rgba(28, 38, 82, 0.1);
  border-radius: 14px;
  background: rgba(28, 38, 82, 0.03);
}
.seatDetailMeta .seatMetaItem .courseBlockTitleSm {
  margin-top: 0;
}
.seatDetailMeta .seatMetaItem .seatDetailText {
  margin-bottom: 0;
}

.seatDetailList {
  margin: 0;
  padding-left: 1.2em;
  line-height: 1.8;
}
@media screen and (min-width: 320px) {
  .seatDetailList {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .seatDetailList {
    font-size: 1.6rem;
  }
}
.seatDetailList li {
  margin: 0 0 6px;
}
.seatDetailList a {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.seatDetailList.is-note {
  opacity: 0.9;
}

/* 注意事項を“折りたたみ”にして縦長をさらに抑える */
.seatNoteDetails {
  margin-top: 12px;
  border: 1px solid rgba(28, 38, 82, 0.12);
  border-radius: 14px;
  background: rgba(28, 38, 82, 0.03);
  overflow: hidden;
}
.seatNoteDetails[open] .seatNoteSummary {
  border-bottom: 1px solid rgba(28, 38, 82, 0.12);
}

.seatNoteSummary {
  list-style: none;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  padding: 12px 12px;
  font-weight: 900;
  letter-spacing: 0.04em;
  background: rgba(28, 38, 82, 0.04);
}
@media screen and (min-width: 320px) {
  .seatNoteSummary {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1025px) {
  .seatNoteSummary {
    font-size: 1.6rem;
  }
}
.seatNoteSummary::-webkit-details-marker {
  display: none;
}
.seatNoteSummary::after {
  content: "＋";
  float: right;
  opacity: 0.7;
}

.seatNoteDetails[open] .seatNoteSummary::after {
  content: "－";
}

.seatNoteBox {
  padding: 12px;
}/*# sourceMappingURL=ticket2026.css.map */