@charset "UTF-8";
html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  background: #FFF;
  font-size: 1rem;
  line-height: 1.5;
  font-family: Helvetica Neue, Helvetica, Roboto, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Noto, "メイリオ", Meiryo, sans-serif;
  color: #000;
}

img {
  border: none;
  vertical-align: bottom;
}

h1, h2, h3, h4, h5, h6, p, ul, li, dl, dt, dd, section, figure {
  margin: 0;
  padding: 0;
}

ul {
  list-style: none;
}

a {
  display: inline-block;
  text-decoration: underline;
  color: #0050f0;
}

.cap {
  font-family: sans-serif;
}

.indent {
  padding-left: 1em;
  text-indent: -1em;
}

.indent-num {
  padding-left: 1.8em;
  text-indent: -1.8em;
}

.indent-in-indent {
  padding-left: 2em;
  text-indent: -1em;
}

.indent-space {
  padding-left: 1.28em;
  text-indent: -1.28em;
}

.modal-open {
  overflow: hidden;
}

@media (min-width: 768px) {
  body {
    font-size: 14px;
    line-height: 1.5;
  }
  a:hover {
    text-decoration: none;
  }
  a img {
    transition: opacity 300ms;
  }
  a:hover img {
    opacity: 0.85;
  }
  a[target=_blank]:not(:has(img))::after {
    content: "";
    display: inline-block;
    margin-left: 6px;
    margin-right: 6px;
    margin-bottom: 1px;
    background: url("/gpo-jcb/20260708/images/icon_link_ext_blue.svg") 50% 50% no-repeat;
    width: 13px;
    height: 13px;
    vertical-align: -2px;
  }
  button {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
  }
  .sp-view {
    display: none;
  }
  .inner {
    margin: 0 auto;
    width: 1000px;
  }
  .nav {
    position: fixed;
    background: #000;
    width: 100%;
    min-width: 1000px;
    height: 64px;
    z-index: 200;
  }
  .nav-inner {
    display: flex;
    margin: 0 auto;
    width: 1000px;
  }
  .nav-logo {
    width: 158px;
  }
  .nav-link {
    flex: 1;
  }
  .nav-link ul {
    display: flex;
  }
  .nav-link ul li {
    display: flex;
    width: 162px;
    height: 64px;
    text-align: center;
  }
  .nav-link ul a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    line-height: 1.3;
    letter-spacing: 0.04em;
    color: #FFF;
    z-index: 1;
  }
  .nav-link ul a::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #000;
    transform: skewX(-20deg);
    z-index: -1;
  }
  .nav-link ul a:hover {
    color: #000;
  }
  .nav-link ul a:hover::before {
    background: #ffa019;
  }
  .nav-link ul a:focus {
    outline: none;
  }
  .header {
    box-sizing: border-box;
    padding: 64px 0 0 0;
    background: url("/gpo-jcb/20260708/images/pc/hero_bg_photo.jpg") 50% 100% no-repeat, url("/gpo-jcb/20260708/images/pc/hero_bg_loop.png") 50% 100% repeat-x, #FFF;
    height: 600px;
    text-align: center;
  }
  .hero-image {
    text-align: center;
  }
  .hero-highlights {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    width: 922px;
  }
  .cp {
    scroll-margin-top: 64px;
    padding: 0 0 85px 0;
    background: #ffa019;
    width: 100%;
    min-width: 1000px;
  }
  .cp-head {
    text-align: center;
  }
  .cp-banner {
    display: flex;
    justify-content: space-between;
    margin: 0 auto 50px auto;
    width: 908px;
  }
  .camp-head {
    padding: 16px 0;
    background: #000;
    text-align: center;
  }
  .camp-head h3 {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: 23px;
    line-height: 1.5;
    letter-spacing: 0.01em;
    color: #ff8c00;
  }
  .camp-body {
    padding: 30px 50px;
  }
  .camp-body-in {
    --peek-height: 90px;
    --peek-fade: 90px;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
    max-height: var(--peek-height);
  }
  .camp-body-in:not(.is-open) {
    -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - var(--peek-fade)), transparent 100%);
    mask-image: linear-gradient(to bottom, #000 calc(100% - var(--peek-fade)), transparent 100%);
  }
  .camp-body-in.is-static {
    max-height: none !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }
  .camp-row {
    display: flex;
    margin: 25px 0 0 0;
  }
  .camp-row:first-child {
    margin: 0;
  }
  .camp-row-head {
    width: 210px;
  }
  .camp-row-head p {
    box-sizing: border-box;
    padding: 4px 10px;
    background: #ec6200;
    width: 210px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.04em;
    color: #FFF;
    text-align: center;
  }
  .camp-row-body {
    flex: 1;
    padding: 4px 0 0 20px;
  }
  .camp-row-text {
    margin: 20px 0 0 0;
  }
  .camp-row-text p {
    font-size: 14px;
    line-height: 1.6;
  }
  .camp-row-text a {
    display: inline;
  }
  .camp-row-text .bold {
    font-weight: bold;
    font-size: 16px;
    line-height: 1.5;
  }
  .camp-row-text .head {
    font-weight: bold;
    font-size: 16px;
    line-height: 1.5;
    color: #ec6200;
  }
  .camp-row-text .notice {
    font-weight: normal;
    font-size: 12px;
    line-height: 1.6;
  }
  .camp-row-text .sep {
    padding-top: 10px;
  }
  .camp-row-text:first-child {
    margin: 0;
  }
  .camp-row-step {
    margin: 0 0 -5px 0;
  }
  .camp-row-step dl {
    display: flex;
    align-items: center;
    margin: 8px 0 0 0;
  }
  .camp-row-step dl dt {
    display: block;
    box-sizing: border-box;
    padding: 4px 10px;
    background: #000;
    width: 94px;
    font-weight: bold;
    font-size: 15px;
    line-height: 1.5;
    letter-spacing: 0.04em;
    color: #FFF;
    text-align: center;
    border-radius: 30px;
    overflow: hidden;
  }
  .camp-row-step dl dd {
    padding: 0 0 0 10px;
  }
  .camp-row-step dl dd p {
    font-weight: bold;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .camp-row-step dl:first-child {
    margin: 0;
  }
  .camp-row-benefits {
    margin: 15px 0;
  }
  .camp-row-benefits-merchandise {
    display: flex;
    justify-content: space-between;
  }
  .camp-row-benefits-merchandise-box {
    display: flex;
    flex-direction: column;
    width: 318px;
  }
  .camp-row-benefits-merchandise-box-head {
    font-weight: bold;
    font-size: 15px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #ec6200;
  }
  .camp-row-benefits-merchandise-box-players {
    box-sizing: border-box;
    flex: 1;
    margin: 10px 0 0 0;
    padding: 15px 20px;
    background: #eff1f2;
  }
  .camp-row-benefits-merchandise-box-players p {
    font-size: 14px;
    line-height: 1.6;
  }
  .camp-row-benefits-merchandise-box-players .bold {
    padding-bottom: 2px;
    font-weight: bold;
  }
  .camp-row-benefits-notice {
    margin: 10px 0 0 0;
  }
  .camp-row-benefits-notice p {
    font-size: 12px;
    line-height: 1.6;
  }
  .camp-row-notice p {
    font-size: 12px;
    line-height: 1.6;
  }
  .camp-row-timing {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 15px 0 0 0;
  }
  .camp-row-timing table {
    box-sizing: border-box;
    border-collapse: collapse;
    width: 318px;
  }
  .camp-row-timing table th {
    box-sizing: border-box;
    padding: 5px 10px;
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    border-left: 1px solid #000;
  }
  .camp-row-timing table th p {
    font-weight: normal;
    font-size: 14px;
    line-height: 1.5;
  }
  .camp-row-timing table td {
    box-sizing: border-box;
    padding: 5px 10px;
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
  }
  .camp-row-timing table td p {
    font-size: 14px;
    line-height: 1.5;
  }
  .camp-row-timing table thead th {
    border-top: 1px solid #000;
    background: #d4e2f0;
  }
  .camp-row-timing table thead th p {
    font-weight: bold;
  }
  .camp-row-timing table thead td {
    border-top: 1px solid #000;
  }
  .camp-inquiry-number {
    display: block;
    margin: 30px 0 30px auto;
    padding: 5px 10px;
    background: #FFF;
    width: -moz-fit-content;
    width: fit-content;
    border: 1px solid #000;
  }
  .camp-inquiry-number p {
    font-weight: bold;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.04em;
  }
  .camp-button {
    box-sizing: border-box;
    display: block;
    margin: 0 auto;
    padding: 5px 0 5px 16px;
    width: 142px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
    color: #2171e1;
    border: 1px solid #2171e1;
    border-radius: 30px;
    overflow: hidden;
  }
  .camp-button:hover {
    opacity: 0.75;
  }
  .camp-button.close {
    background: url("/gpo-jcb/20260708/images/icon_button_plus.svg") 14px 50% no-repeat, #FFF;
    background-size: 16px 16px;
  }
  .camp-button.open {
    background: url("/gpo-jcb/20260708/images/icon_button_minus.svg") 14px 50% no-repeat, #FFF;
    background-size: 16px 16px;
  }
  .camp-button .label-close {
    display: none;
  }
  .camp-button.open .label-more {
    display: none;
  }
  .camp-button.open .label-close {
    display: inline;
  }
  .camp-button.is-static {
    display: none;
  }
  .camp-enrollment {
    box-sizing: border-box;
    margin: 30px 0 0 0;
    padding: 18px 25px 165px 25px;
    background: url("/gpo-jcb/20260708/images/pc/cp_fast-sta_enroll.png") 50% 100% no-repeat, #dfeaf4;
  }
  .camp-enrollment p {
    font-weight: bold;
    font-size: 15px;
    line-height: 1.6;
  }
  .camp-enrollment .head {
    padding-bottom: 6px;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.6;
    letter-spacing: 0.02em;
  }
  .camp-enrollment .notice {
    font-weight: normal;
    font-size: 12px;
    line-height: 1.6;
  }
  .cp-merchandise {
    scroll-margin-top: 64px;
    margin: 0 auto;
    background: #FFF;
    width: 980px;
  }
  .cp-fast-start {
    scroll-margin-top: 64px;
    margin: 50px auto 0 auto;
    background: #FFF;
    width: 980px;
  }
  .cp-bottom-link {
    padding: 60px 0 0 0;
    text-align: center;
  }
  .cp-bottom-link p {
    font-size: 13px;
    line-height: 1.6;
  }
  .cp-bottom-link .link {
    padding-top: 6px;
    font-size: 14px;
    line-height: 1.6;
  }
  .cp-bottom-link .link a:not(:has(img))::after {
    content: "";
    display: inline-block;
    margin-left: 5px;
    margin-right: 6px;
    margin-bottom: 1px;
    background: url("/gpo-jcb/20260708/images/icon_under_arrow.svg") 50% 50% no-repeat;
    width: 11px;
    height: 6px;
  }
  .card-benefits {
    scroll-margin-top: 64px;
    background: #FFF;
    width: 100%;
    min-width: 1000px;
  }
  .card-benefits-head {
    text-align: center;
  }
  .card-benefits-excite-head {
    margin: 0 0 12px 0;
    text-align: center;
  }
  .card-benefits-excite-box {
    scroll-margin-top: 64px;
    margin: 0 auto;
    background: #eff1f2;
    width: 980px;
  }
  .card-benefits-exclusive {
    padding: 60px 0 0 0;
  }
  .card-benefits-exclusive-head {
    margin: 0 0 12px 0;
    text-align: center;
  }
  .card-benefits-exclusive-1 {
    margin: 0 auto;
    background: #ffe7c5;
    width: 980px;
  }
  .card-benefits-exclusive-sub-head {
    background: #ec6200;
    text-align: center;
  }
  .card-benefits-exclusive-sub-head h4 {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: 22px;
    line-height: 1.5;
    letter-spacing: 0.01em;
    color: #FFF;
  }
  .card-benefits-exclusive-sub-head .number {
    margin: 0 0 4px 8px;
    font-size: 36px;
  }
  .card-benefits-exclusive-sub-body {
    padding: 0 0 30px 0;
  }
  .card-benefits-exclusive-sub-top {
    display: flex;
    align-items: center;
    margin: 40px auto 30px auto;
    width: 880px;
  }
  .card-benefits-exclusive-sub-top-image {
    width: 153px;
  }
  .card-benefits-exclusive-sub-top-text {
    flex: 1;
  }
  .card-benefits-exclusive-sub-top-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: 26px;
    line-height: 1.3;
    letter-spacing: 0.01em;
  }
  .card-benefits-exclusive-sub-text {
    margin: 0 auto;
    width: 880px;
  }
  .card-benefits-exclusive-sub-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 22px;
    line-height: 1.4;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-sub-notice {
    margin: 30px auto 0 auto;
    width: 880px;
  }
  .card-benefits-exclusive-sub-notice p {
    font-size: 12px;
    line-height: 1.6;
  }
  .card-benefits-exclusive-2 {
    margin: 30px auto 0 auto;
    background: #ffe7c5;
    width: 980px;
  }
  .card-benefits-exclusive-3 {
    margin: 30px auto 0 auto;
    background: #ffe7c5;
    width: 980px;
  }
  .card-benefits-exclusive-4 {
    margin: 30px auto 0 auto;
    background: #ffe7c5;
    width: 980px;
  }
  .card-benefits-exclusive-4-main {
    display: grid;
    grid-template-columns: 298px 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas: "dome eastern" "dome museum" "dome yomiuri";
    gap: 18px 18px;
    margin: 0 auto;
    width: 880px;
  }
  .card-benefits-exclusive-4-main-box {
    box-sizing: border-box;
    padding: 15px 20px;
    background: #FFF;
    text-align: center;
  }
  .card-benefits-exclusive-4-main-box:nth-child(1) {
    grid-area: dome;
  }
  .card-benefits-exclusive-4-main-box:nth-child(2) {
    grid-area: eastern;
  }
  .card-benefits-exclusive-4-main-box:nth-child(3) {
    grid-area: museum;
  }
  .card-benefits-exclusive-4-main-box:nth-child(4) {
    grid-area: yomiuri;
  }
  .card-benefits-exclusive-4-main-box p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.01em;
  }
  .card-benefits-exclusive-4-main-box .orange {
    color: #ec6200;
  }
  .card-benefits-exclusive-4-main-box-notice {
    padding: 20px 0 0 0;
    text-align: left;
  }
  .card-benefits-exclusive-4-main-box-notice p {
    font-family: Helvetica Neue, Helvetica, Roboto, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Noto, "メイリオ", Meiryo, sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 1.6;
  }
  .card-benefits-exclusive-5 {
    margin: 30px auto 0 auto;
    background: #ffe7c5;
    width: 980px;
  }
  .card-benefits-exclusive-5-earn {
    margin: 0 auto;
    width: 880px;
  }
  .card-benefits-exclusive-5-earn-head {
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-body {
    display: grid;
    grid-template-columns: 440px 1fr;
    grid-template-rows: auto auto;
    grid-template-areas: "text text" "icon box";
  }
  .card-benefits-exclusive-5-earn-text {
    grid-area: text;
    padding: 30px 0 30px 0;
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-5-earn-icon {
    grid-area: icon;
    align-self: center;
  }
  .card-benefits-exclusive-5-earn-icon ul {
    display: flex;
    gap: 0 13px;
  }
  .card-benefits-exclusive-5-earn-icon ul li {
    width: 94px;
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-icon ul li .text {
    padding-top: 7px;
    font-weight: bold;
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-5-earn-box {
    grid-area: box;
    background: #FFF;
  }
  .card-benefits-exclusive-5-earn-box-head {
    padding: 10px 10px;
    background: #c49a3b;
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-box-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: #FFF;
  }
  .card-benefits-exclusive-5-earn-box-body {
    padding: 10px 10px;
  }
  .card-benefits-exclusive-5-earn-box-text {
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-box-text p {
    font-weight: bold;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-5-earn-box-notice {
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-box-notice p {
    font-size: 12px;
    line-height: 1.6;
  }
  .card-benefits-exclusive-5-use {
    margin: 50px auto 0 auto;
    width: 880px;
  }
  .card-benefits-exclusive-5-use-head {
    margin: 0 0 40px 0;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-gpo {
    padding: 30px 0;
    background: #FFF;
  }
  .card-benefits-exclusive-5-use-gpo-head {
    text-align: center;
  }
  .card-benefits-exclusive-5-use-gpo-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #ec6200;
  }
  .card-benefits-exclusive-5-use-gpo-body {
    display: flex;
    justify-content: space-between;
    margin: 25px auto 0 auto;
    width: 820px;
  }
  .card-benefits-exclusive-5-use-gpo-ippan {
    box-sizing: border-box;
    width: 396px;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-gpo-ippan .head {
    padding: 6px 10px;
    background: #ec6200;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #FFF;
  }
  .card-benefits-exclusive-5-use-gpo-gold {
    box-sizing: border-box;
    width: 396px;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-gpo-gold .head {
    padding: 6px 10px;
    background: #c49a3b;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #FFF;
  }
  .card-benefits-exclusive-5-use-gpo-text {
    margin: 25px auto 0 auto;
    width: 820px;
    text-align: left;
  }
  .card-benefits-exclusive-5-use-gpo-text p {
    font-weight: bold;
    font-size: 15px;
    line-height: 1.5;
    letter-spacing: 0.01em;
  }
  .card-benefits-exclusive-5-use-gpo-text .link {
    padding-top: 7px;
    font-weight: normal;
    font-size: 13px;
    line-height: 1.5;
  }
  .card-benefits-exclusive-5-use-gpo-notice {
    margin: 15px auto 0 auto;
    width: 820px;
  }
  .card-benefits-exclusive-5-use-gpo-notice p {
    font-size: 12px;
    line-height: 1.6;
  }
  .card-benefits-exclusive-5-use-merchandise {
    margin: 20px 0 0 0;
    padding: 30px 0;
    background: #FFF;
  }
  .card-benefits-exclusive-5-use-merchandise-head {
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #ec6200;
  }
  .card-benefits-exclusive-5-use-merchandise-text {
    margin: 0 auto;
    padding: 20px 0 10px 0;
    width: 820px;
  }
  .card-benefits-exclusive-5-use-merchandise-text p {
    font-weight: bold;
    font-size: 15px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #000;
  }
  .card-benefits-exclusive-5-use-merchandise-pro {
    margin: 0 auto;
    width: 820px;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-head {
    padding: 10px 10px;
    background: #000;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #ff8c00;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-body {
    display: flex;
    align-items: flex-end;
    gap: 0 14px;
    margin: 0 auto;
    padding: 20px 0 0 0;
    width: 820px;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box {
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:first-child {
    margin: 0 0 0 24px;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:last-child {
    padding: 0 0 50px 0;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:last-child .text {
    font-size: 15px;
    line-height: 1.5;
    color: #000;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box .text {
    font-weight: bold;
    font-size: 15px;
    line-height: 1.4;
    color: #ec6200;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box .image {
    margin: 8px 0 0 0;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket {
    margin: 40px auto 0 auto;
    width: 820px;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-head {
    padding: 10px 10px;
    background: #000;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #ff8c00;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-body {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    width: 772px;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-ippan {
    padding: 20px 0 0 0;
    width: 372px;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-ippan .text {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #ec6200;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-ippan .image {
    margin: 10px 0 0 0;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-gold {
    padding: 20px 0 0 0;
    width: 372px;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-gold .text {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #c49a3b;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-gold .image {
    margin: 10px 0 0 0;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed {
    margin: 40px auto 0 auto;
    width: 820px;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-head {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 14px;
    padding: 10px 10px;
    background: #000;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #ff8c00;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-head p:first-child {
    padding: 3px 19px;
    background: #c49a3b;
    font-size: 18px;
    color: #FFF;
    border-radius: 30px;
    overflow: hidden;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-body {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    grid-template-areas: "mascot text" "mascot notice";
    padding: 28px 0;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-mascot {
    box-sizing: border-box;
    grid-area: mascot;
    padding: 0 0 0 95px;
    width: 222px;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-text {
    grid-area: text;
    align-self: center;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: 24px;
    line-height: 1.4;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-notice {
    grid-area: notice;
    align-self: center;
    margin: -8px 0 0 0;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-notice p {
    font-size: 12px;
    line-height: 1.6;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-end {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 2;
  }
  .card-benefits-exclusive-5-use-notice {
    margin: 15px 0 0 0;
  }
  .card-benefits-exclusive-5-use-notice p {
    font-size: 12px;
    line-height: 1.6;
  }
  .process {
    scroll-margin-top: 64px;
    background: #FFF;
    width: 100%;
    min-width: 1000px;
  }
  .process-head {
    text-align: center;
  }
  .process-body {
    padding: 0 0 90px 0;
  }
  .process-step-sub-label {
    position: absolute;
    top: 0;
    left: 28px;
    z-index: 2;
  }
  .process-step-sub-label img {
    margin: -20px 0 0 0;
  }
  .process-step-sub-head {
    padding: 15px 10px 15px 160px;
    background: #ec6200;
  }
  .process-step-sub-head h3 {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: 24px;
    line-height: 1.5;
    letter-spacing: 0.01em;
    color: #FFF;
  }
  .process-step-sub-body {
    background: #ffe7c5;
  }
  .process-step-1 {
    position: relative;
    margin: 0 auto;
    padding: 0 0 86px 0;
    background: url("/gpo-jcb/20260708/images/pc/process_step_arrow.png") 50% 100% no-repeat;
    width: 980px;
  }
  .process-step-1 .process-step-sub-body {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 413px 1fr;
    grid-template-rows: 1fr auto;
    grid-template-areas: "text button" "notice notice";
  }
  .process-step-1-text {
    grid-area: text;
    align-self: center;
    padding: 30px 0 0 50px;
  }
  .process-step-1-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 1.6;
    letter-spacing: 0.02em;
  }
  .process-step-1-btn {
    grid-area: button;
    padding: 30px 0 0 0;
  }
  .process-step-1-notice {
    grid-area: notice;
    padding: 30px 50px 30px 50px;
  }
  .process-step-1-notice p {
    font-size: 12px;
    line-height: 1.6;
  }
  .process-step-1-notice .link {
    padding-top: 8px;
    font-size: 13px;
    line-height: 1.6;
  }
  .process-step-2 {
    position: relative;
    margin: 0 auto;
    width: 980px;
  }
  .process-step-2-text {
    padding: 40px 50px 30px 50px;
  }
  .process-step-2-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 1.6;
    letter-spacing: 0.02em;
  }
  .card-details {
    scroll-margin-top: 64px;
    background: #ffa019;
    width: 100%;
    min-width: 1000px;
  }
  .card-details-head {
    text-align: center;
  }
  .card-details-body {
    padding: 20px 0 70px 0;
  }
  .card-details-table-head {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: 24px;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #FFF;
    text-align: center;
  }
  .card-details-table {
    border-collapse: collapse;
    margin: 0 auto;
    width: 880px;
  }
  .card-details-table th {
    box-sizing: border-box;
    padding: 15px 15px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #000;
  }
  .card-details-table th p {
    font-weight: bold;
    font-size: 13px;
    line-height: 1.7;
  }
  .card-details-table td {
    box-sizing: border-box;
    padding: 15px 15px;
    width: 344px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #000;
  }
  .card-details-table td p {
    font-weight: normal;
    font-size: 13px;
    line-height: 1.7;
  }
  .card-details-table tr:first-child td {
    text-align: center;
  }
  .card-details-table tr:first-child td p {
    font-weight: bold;
    color: #ec6200;
  }
  .card-details-table .annual-fee-pre {
    display: inline-block;
  }
  .card-details-table .annual-fee {
    display: inline-block;
    margin: 0 0 0 5px;
    padding: 3px 8px;
    background: #000;
    color: #FFF;
  }
  .card-details-table .bold {
    font-weight: bold;
  }
  .card-details-table .sep {
    padding-top: 15px;
  }
  .card-details-table .no-border {
    padding: 15px 15px 0 15px;
    border-bottom: none;
  }
  .card-details-table-box {
    margin: 30px auto 0 auto;
    padding: 30px 0 50px 0;
    background: #FFF;
    width: 980px;
  }
  .card-details-table-card {
    padding: 8px 0;
  }
  .card-details-table-card-face {
    margin: 0 0 16px 0;
    text-align: center;
  }
  .card-details-table-card-btn {
    text-align: center;
  }
  .notes {
    scroll-margin-top: 64px;
    background: #FFF;
    width: 100%;
    min-width: 1000px;
  }
  .notes-body {
    margin: 0 auto;
    padding: 70px 0 85px 0;
    width: 980px;
  }
  .notes-head {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .notes-notice {
    margin: 20px 0 0 0;
  }
  .notes-notice p {
    font-size: 14px;
    line-height: 1.6;
  }
  .notes-notice .head {
    font-weight: bold;
    font-size: 15px;
    line-height: 1.6;
    color: #ec6200;
  }
  .faq {
    scroll-margin-top: 64px;
    background: #ffa019;
    width: 100%;
    min-width: 1000px;
  }
  .faq-head {
    text-align: center;
  }
  .faq-body {
    padding: 0 0 90px 0;
  }
  .faq-qanda {
    margin: 0 auto;
    background: #FFF;
    width: 980px;
  }
  .faq-qanda-box dt button {
    box-sizing: border-box;
    padding: 25px 20px 25px 102px;
    width: 100%;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.01em;
    text-align: left;
    color: #000;
  }
  .faq-qanda-box dt button:hover {
    opacity: 0.75;
  }
  .faq-qanda-box dt button.close {
    background: url("/gpo-jcb/20260708/images/pc/faq_icon_q.png") 24px 50% no-repeat, url("/gpo-jcb/20260708/images/icon_button_plus_orange.svg") 97% 50% no-repeat, #FFF;
    background-size: auto auto, 37px 37px;
  }
  .faq-qanda-box dt button.open {
    background: url("/gpo-jcb/20260708/images/pc/faq_icon_q.png") 24px 50% no-repeat, url("/gpo-jcb/20260708/images/icon_button_minus_orange.svg") 97% 50% no-repeat, #FFF;
    background-size: auto auto, 37px 37px;
  }
  .faq-qanda-box dd {
    background: url("/gpo-jcb/20260708/images/pc/faq_icon_a.png") 24px 14px no-repeat, #fce8d9;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
    max-height: 0;
  }
  .faq-qanda-box-text {
    box-sizing: border-box;
    padding: 25px 20px 30px 102px;
  }
  .faq-qanda-box-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.5;
    letter-spacing: 0.01em;
  }
  .footer {
    background: #FFF;
    width: 100%;
    min-width: 1000px;
  }
  .footer-jcb {
    display: flex;
    align-items: center;
    margin: 0 auto;
    padding: 40px 0 20px 0;
    width: 980px;
    border-bottom: 1px solid #000;
  }
  .footer-jcb-logo {
    box-sizing: border-box;
    padding: 0 0 0 1px;
    width: 86px;
  }
  .footer-jcb-main {
    flex: 1;
  }
  .footer-jcb-main-text {
    padding: 0 0 5px 0;
  }
  .footer-jcb-main-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.5;
  }
  .footer-jcb-main-link {
    display: flex;
    gap: 0 15px;
  }
  .footer-jcb-main-link li {
    font-size: 13px;
    line-height: 1.5;
  }
  .footer-inquiry {
    margin: 0 auto;
    padding: 25px 0 40px 0;
    width: 980px;
  }
  .footer-inquiry-head {
    padding-bottom: 6px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.5;
  }
  .footer-inquiry-text p {
    font-size: 13px;
    line-height: 1.5;
  }
  .footer-copyright {
    padding: 20px 0 120px 0;
    background: #000;
    width: 100%;
    min-width: 1000px;
    text-align: center;
  }
  .footer-copyright p {
    font-size: 14px;
    line-height: 1.5;
    color: #FFF;
  }
  .fixed-bottom {
    position: fixed;
    left: 0;
    bottom: 0;
    padding: 15px 0;
    background: rgba(0, 0, 0, 0.25);
    width: 100%;
    z-index: 100;
    text-align: center;
    display: none;
    opacity: 0;
    transition: opacity 0.4s ease;
  }
  .fixed-bottom.visible {
    opacity: 1;
  }
  .modal {
    display: none;
  }
}
@media (max-width: 767px) {
  body {
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.5;
  }
  img {
    width: 100%;
    height: auto;
  }
  a[target=_blank]:not(:has(img))::after {
    content: "";
    display: inline-block;
    margin-left: calc(6 / 750 * 100vw);
    margin-right: calc(6 / 750 * 100vw);
    margin-bottom: calc(-1 / 750 * 100vw);
    background: url("/gpo-jcb/20260708/images/icon_link_ext_blue.svg") 50% 50% no-repeat;
    background-size: contain;
    width: calc(19 / 750 * 100vw);
    height: calc(19 / 750 * 100vw);
  }
  button {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
  }
  .pc-view {
    display: none;
  }
  .nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 500;
  }
  .nav-menu-button {
    position: absolute;
    top: 0;
    right: 0;
    background: #FFF;
    width: calc(100 / 750 * 100vw);
    z-index: 503;
  }
  .nav-link {
    position: absolute;
    top: calc(100 / 750 * 100vw);
    left: 0;
    width: 100%;
    z-index: 502;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
    max-height: 0;
  }
  .nav-link ul {
    border-top: 0.2666666667vw solid #dcdcdc;
  }
  .nav-link li a {
    box-sizing: border-box;
    display: block;
    padding: calc(25 / 750 * 100vw) calc(30 / 750 * 100vw) calc(25 / 750 * 100vw) calc(30 / 750 * 100vw);
    background: url("/gpo-jcb/20260708/images/sp/menu_arrow.png") 50% 50% no-repeat, #f7f8f8;
    background-size: 100% auto;
    text-decoration: none;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(1.125rem, 4.4vw, 1.25rem);
    letter-spacing: 0.04em;
    color: #000;
    border-bottom: 0.2666666667vw solid #dcdcdc;
  }
  .header {
    box-sizing: border-box;
    padding: 0 0 4.6666666667vw 0;
    background: url("/gpo-jcb/20260708/images/sp/hero_bg_photo.jpg") 50% 100% no-repeat, #FFF;
    background-size: 100% auto;
  }
  .header-logo {
    background: #000;
  }
  .hero-image {
    text-align: center;
  }
  .hero-highlights {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1.8666666667vw 0;
    margin: 0 auto;
    width: 90.4vw;
  }
  .hero-highlights li {
    width: 45.3333333333vw;
  }
  .hero-highlights li:nth-child(even) {
    margin: 0 0 0 -0.2666666667vw;
  }
  .cp {
    padding: 0 0 12vw 0;
    background: #ffa019;
    width: 100%;
  }
  .cp-head {
    text-align: center;
  }
  .cp-banner {
    margin: 0 auto 10.6666666667vw auto;
    width: 92vw;
  }
  .cp-banner li {
    margin: 4vw 0 0 0;
  }
  .cp-banner li:first-child {
    margin: 0;
  }
  .camp-head {
    padding: 2.1333333333vw 0;
    background: #000;
    text-align: center;
  }
  .camp-head h3 {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: clamp(1.125rem, 4.4vw, 1.25rem);
    line-height: 1.2;
    letter-spacing: 0.01em;
    color: #ff8c00;
  }
  .camp-body {
    padding: 6.6666666667vw 0;
  }
  .camp-body-in {
    --peek-height: calc(90 / 750 * 100vw);
    --peek-fade: calc(90 / 750 * 100vw);
    overflow: hidden;
    transition: max-height 0.4s ease-out;
    max-height: var(--peek-height);
  }
  .camp-body-in:not(.is-open) {
    -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - var(--peek-fade)), transparent 100%);
    mask-image: linear-gradient(to bottom, #000 calc(100% - var(--peek-fade)), transparent 100%);
  }
  .camp-body-in.is-static {
    max-height: none !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }
  .camp-row {
    margin: 6.6666666667vw auto 0 auto;
    width: 84vw;
  }
  .camp-row:first-child {
    margin: 0 auto;
  }
  .camp-row-head p {
    box-sizing: border-box;
    padding: 2vw 1.3333333333vw;
    background: #ec6200;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.2;
    letter-spacing: 0.04em;
    color: #FFF;
    text-align: center;
  }
  .camp-row-body {
    padding: 4vw 0 0 0;
  }
  .camp-row-text {
    margin: 4vw 0 0 0;
  }
  .camp-row-text p {
    font-size: clamp(0.8125rem, 3.4vw, 0.9375rem);
    line-height: 1.5;
  }
  .camp-row-text a {
    display: inline;
  }
  .camp-row-text .bold {
    font-weight: bold;
    font-size: clamp(1.0625rem, 4.2vw, 1.1875rem);
    line-height: 1.5;
  }
  .camp-row-text .head {
    padding-bottom: 1.0666666667vw;
    font-weight: bold;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: #ec6200;
  }
  .camp-row-text .small {
    font-weight: bold;
    font-size: clamp(0.8125rem, 3.4vw, 0.9375rem);
    line-height: 1.3;
  }
  .camp-row-text .notice {
    font-weight: normal;
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.6;
  }
  .camp-row-text .sep {
    padding-top: 3.3333333333vw;
  }
  .camp-row-text .center {
    text-align: center;
  }
  .camp-row-text:first-child {
    margin: 0;
  }
  .camp-row-step {
    margin: 0 0 -0.6666666667vw 0;
  }
  .camp-row-step dl {
    display: flex;
    align-items: center;
    margin: 2.6666666667vw 0 0 2.6666666667vw;
  }
  .camp-row-step dl dt {
    display: block;
    box-sizing: border-box;
    padding: 1.0666666667vw 1.3333333333vw;
    background: #000;
    width: 21.3333333333vw;
    font-weight: bold;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.3;
    letter-spacing: 0.04em;
    color: #FFF;
    text-align: center;
    border-radius: 4.8vw;
    overflow: hidden;
  }
  .camp-row-step dl dd {
    padding: 0 0 0 2.6666666667vw;
  }
  .camp-row-step dl dd p {
    font-weight: bold;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.3;
    letter-spacing: 0.02em;
  }
  .camp-row-step dl:first-child {
    margin: 0 0 0 2.6666666667vw;
  }
  .camp-row-benefits {
    margin: 3.3333333333vw 0;
  }
  .camp-row-benefits-merchandise-box {
    margin: 4vw 0 0 0;
  }
  .camp-row-benefits-merchandise-box:first-child {
    margin: 0;
  }
  .camp-row-benefits-merchandise-box-head {
    font-weight: bold;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.3;
    letter-spacing: 0.02em;
    color: #ec6200;
  }
  .camp-row-benefits-merchandise-box-players {
    box-sizing: border-box;
    margin: 2vw 0 0 0;
    padding: 3.3333333333vw 3.3333333333vw;
    background: #eff1f2;
  }
  .camp-row-benefits-merchandise-box-players p {
    font-size: clamp(0.8125rem, 3.4vw, 0.9375rem);
    line-height: 1.6;
  }
  .camp-row-benefits-merchandise-box-players .bold {
    padding-bottom: 0.2666666667vw;
    font-weight: bold;
  }
  .camp-row-benefits-notice {
    margin: 2.6666666667vw 0 0 0;
  }
  .camp-row-benefits-notice p {
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.6;
  }
  .camp-row-notice p {
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.6;
  }
  .camp-row-timing {
    margin: 4.6666666667vw 0 0 0;
  }
  .camp-row-timing table {
    box-sizing: border-box;
    border-collapse: collapse;
    width: 84vw;
  }
  .camp-row-timing table th {
    box-sizing: border-box;
    padding: 1.0666666667vw 2.1333333333vw;
    text-align: center;
    vertical-align: middle;
    border-right: 0.2666666667vw solid #000;
    border-bottom: 0.2666666667vw solid #000;
    border-left: 0.2666666667vw solid #000;
  }
  .camp-row-timing table th p {
    font-weight: normal;
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.5;
  }
  .camp-row-timing table td {
    box-sizing: border-box;
    padding: 1.0666666667vw 2.1333333333vw;
    text-align: center;
    vertical-align: middle;
    border-right: 0.2666666667vw solid #000;
    border-bottom: 0.2666666667vw solid #000;
  }
  .camp-row-timing table td p {
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.5;
  }
  .camp-row-timing table thead th {
    border-top: 0.2666666667vw solid #000;
    background: #d4e2f0;
  }
  .camp-row-timing table thead th p {
    font-weight: bold;
  }
  .camp-row-timing table thead td {
    border-top: 0.2666666667vw solid #000;
  }
  .camp-row-timing table tbody th {
    width: 37.3333333333vw;
  }
  .camp-inquiry-number {
    display: block;
    margin: 5.3333333333vw 4vw 8vw auto;
    padding: 1.0666666667vw 2.1333333333vw;
    background: #FFF;
    width: -moz-fit-content;
    width: fit-content;
    border: 0.2666666667vw solid #000;
  }
  .camp-inquiry-number p {
    font-weight: bold;
    font-size: clamp(0.75rem, 3.2vw, 0.875rem);
    line-height: 1.3;
    letter-spacing: 0.04em;
  }
  .camp-button {
    box-sizing: border-box;
    display: block;
    margin: 0 auto;
    padding: 1.3333333333vw 0 1.3333333333vw 3.3333333333vw;
    width: 29.3333333333vw;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.75rem, 3.2vw, 0.875rem);
    line-height: 1.5;
    text-align: center;
    color: #2171e1;
    border: 0.2666666667vw solid #2171e1;
    border-radius: 4.8vw;
    overflow: hidden;
  }
  .camp-button:hover {
    opacity: 0.75;
  }
  .camp-button.close {
    background: url("/gpo-jcb/20260708/images/icon_button_plus.svg") 3.2vw 50% no-repeat, #FFF;
    background-size: 3.3333333333vw 3.3333333333vw;
  }
  .camp-button.open {
    background: url("/gpo-jcb/20260708/images/icon_button_minus.svg") 3.2vw 50% no-repeat, #FFF;
    background-size: 3.3333333333vw 3.3333333333vw;
  }
  .camp-button .label-close {
    display: none;
  }
  .camp-button.open .label-more {
    display: none;
  }
  .camp-button.open .label-close {
    display: inline;
  }
  .camp-button.is-static {
    display: none;
  }
  .camp-enrollment {
    box-sizing: border-box;
    margin: 6.6666666667vw auto 0 auto;
    padding: 4.6666666667vw 4.6666666667vw 33.3333333333vw 4.6666666667vw;
    background: url("/gpo-jcb/20260708/images/sp/cp_fast-sta_enroll.png") 50% 100% no-repeat, #dfeaf4;
    background-size: 100% auto;
    width: 84vw;
  }
  .camp-enrollment p {
    font-weight: bold;
    font-size: clamp(0.75rem, 3.2vw, 0.875rem);
    line-height: 1.4;
  }
  .camp-enrollment .head {
    padding-bottom: 2.6666666667vw;
    font-weight: bold;
    font-size: clamp(0.8125rem, 3.4vw, 0.9375rem);
    line-height: 1.3;
    letter-spacing: 0.02em;
  }
  .camp-enrollment .notice {
    padding-top: 2.6666666667vw;
    font-weight: normal;
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.5;
  }
  .cp-merchandise {
    margin: 0 auto;
    background: #FFF;
    width: 92vw;
  }
  .cp-fast-start {
    margin: 6.6666666667vw auto 0 auto;
    background: #FFF;
    width: 92vw;
  }
  .cp-bottom-link {
    padding: 8vw 0 0 0;
    text-align: center;
  }
  .cp-bottom-link p {
    font-size: clamp(0.75rem, 3.2vw, 0.875rem);
    line-height: 1.6;
  }
  .cp-bottom-link .link {
    padding-top: 2vw;
    font-size: clamp(0.75rem, 3.2vw, 0.875rem);
    line-height: 1.6;
  }
  .cp-bottom-link .link a:not(:has(img))::after {
    content: "";
    display: inline-block;
    margin-left: calc(5 / 750 * 100vw);
    margin-right: calc(6 / 750 * 100vw);
    margin-bottom: calc(2 / 750 * 100vw);
    background: url("/gpo-jcb/20260708/images/icon_under_arrow.svg") 50% 50% no-repeat;
    background-size: contain;
    width: calc(16 / 750 * 100vw);
    height: calc(10 / 750 * 100vw);
  }
  .card-benefits {
    background: #FFF;
    width: 100%;
  }
  .card-benefits-head {
    text-align: center;
  }
  .card-benefits-excite-head {
    margin: 0 auto;
    width: 92vw;
  }
  .card-benefits-excite-box {
    margin: 0 auto;
    background: #eff1f2;
    width: 92vw;
  }
  .card-benefits-exclusive {
    padding: 9.3333333333vw 0 0 0;
  }
  .card-benefits-exclusive-head {
    margin: 0 auto;
    width: 92vw;
  }
  .card-benefits-exclusive-1 {
    margin: 0 auto;
    background: #ffe7c5;
    width: 92vw;
  }
  .card-benefits-exclusive-sub-head {
    background: #ec6200;
    text-align: center;
  }
  .card-benefits-exclusive-sub-head h4 {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: clamp(1.3125rem, 5vw, 1.4375rem);
    line-height: 1.5;
    letter-spacing: 0.01em;
    color: #FFF;
  }
  .card-benefits-exclusive-sub-head .number {
    margin: 0 0 0.5333333333vw 1.3333333333vw;
    font-size: clamp(1.9375rem, 7vw, 2.0625rem);
  }
  .card-benefits-exclusive-sub-body {
    padding: 0 0 5.3333333333vw 0;
  }
  .card-benefits-exclusive-sub-top {
    display: flex;
    align-items: center;
    margin: 5.3333333333vw auto 4vw auto;
    width: 92vw;
  }
  .card-benefits-exclusive-sub-top-image {
    width: 32vw;
  }
  .card-benefits-exclusive-sub-top-image img {
    width: 29.3333333333vw;
  }
  .card-benefits-exclusive-sub-top-text {
    flex: 1;
  }
  .card-benefits-exclusive-sub-top-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: clamp(1.1875rem, 4.6vw, 1.3125rem);
    line-height: 1.4;
    letter-spacing: 0.01em;
  }
  .card-benefits-exclusive-sub-text {
    margin: 0 auto;
    width: 84vw;
  }
  .card-benefits-exclusive-sub-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.4;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-sub-notice {
    margin: 4vw auto 0 auto;
    width: 84vw;
  }
  .card-benefits-exclusive-sub-notice p {
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.6;
  }
  .card-benefits-exclusive-2 {
    margin: 4vw auto 0 auto;
    background: #ffe7c5;
    width: 92vw;
  }
  .card-benefits-exclusive-3 {
    margin: 4vw auto 0 auto;
    background: #ffe7c5;
    width: 92vw;
  }
  .card-benefits-exclusive-4 {
    margin: 4vw auto 0 auto;
    background: #ffe7c5;
    width: 92vw;
  }
  .card-benefits-exclusive-4-main {
    display: flex;
    flex-direction: column;
    gap: 2.6666666667vw 0;
    margin: 0 auto;
    width: 84vw;
  }
  .card-benefits-exclusive-4-main-box {
    box-sizing: border-box;
    padding: 3.3333333333vw 4vw;
    background: #FFF;
    text-align: center;
  }
  .card-benefits-exclusive-4-main-box:nth-child(1) {
    order: 2;
  }
  .card-benefits-exclusive-4-main-box:nth-child(2) {
    order: 1;
  }
  .card-benefits-exclusive-4-main-box:nth-child(3) {
    order: 3;
  }
  .card-benefits-exclusive-4-main-box:nth-child(4) {
    order: 4;
  }
  .card-benefits-exclusive-4-main-box p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: clamp(1rem, 4vw, 1.125rem);
    line-height: 1.4;
    letter-spacing: 0.01em;
  }
  .card-benefits-exclusive-4-main-box .orange {
    color: #ec6200;
  }
  .card-benefits-exclusive-4-main-box-notice {
    padding: 2.6666666667vw 0 0 0;
    text-align: left;
  }
  .card-benefits-exclusive-4-main-box-notice p {
    font-family: Helvetica Neue, Helvetica, Roboto, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Noto, "メイリオ", Meiryo, sans-serif;
    font-weight: normal;
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.6;
  }
  .card-benefits-exclusive-5 {
    margin: 4vw auto 0 auto;
    background: #ffe7c5;
    width: 92vw;
  }
  .card-benefits-exclusive-5-earn {
    margin: 0 auto;
    width: 92vw;
  }
  .card-benefits-exclusive-5-earn-head {
    margin: 0 auto;
    padding: 2.6666666667vw 0 0 0;
    width: 50.6666666667vw;
  }
  .card-benefits-exclusive-5-earn-text {
    margin: 0 auto;
    padding: 4vw 0 4vw 0;
    width: 84vw;
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-5-earn-icon {
    margin: 0 auto;
    width: 84vw;
  }
  .card-benefits-exclusive-5-earn-icon ul {
    display: flex;
    justify-content: center;
    gap: 0 3.4666666667vw;
  }
  .card-benefits-exclusive-5-earn-icon ul li {
    width: 16.8vw;
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-icon ul li .text {
    padding-top: 2.6666666667vw;
    font-weight: bold;
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-5-earn-box {
    margin: 4vw auto 0 auto;
    background: #FFF;
    width: 84vw;
  }
  .card-benefits-exclusive-5-earn-box-head {
    padding: 2.6666666667vw 1.3333333333vw;
    background: #c49a3b;
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-box-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: #FFF;
  }
  .card-benefits-exclusive-5-earn-box-body {
    padding: 4vw 4vw;
  }
  .card-benefits-exclusive-5-earn-box-text {
    text-align: center;
  }
  .card-benefits-exclusive-5-earn-box-text p {
    font-weight: bold;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.4;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-5-earn-box-notice {
    margin: 2.6666666667vw 0 0 0;
    text-align: left;
  }
  .card-benefits-exclusive-5-earn-box-notice p {
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.6;
  }
  .card-benefits-exclusive-5-use {
    margin: 8vw auto 0 auto;
    width: 92vw;
  }
  .card-benefits-exclusive-5-use-head {
    margin: 0 auto;
    width: 50.6666666667vw;
  }
  .card-benefits-exclusive-5-use-body {
    margin: 6.6666666667vw 0 0 0;
  }
  .card-benefits-exclusive-5-use-gpo {
    margin: 0 auto;
    padding: 5.3333333333vw 0;
    background: #FFF;
    width: 84vw;
  }
  .card-benefits-exclusive-5-use-gpo-head {
    text-align: center;
  }
  .card-benefits-exclusive-5-use-gpo-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(1.25rem, 4.8vw, 1.375rem);
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: #ec6200;
  }
  .card-benefits-exclusive-5-use-gpo-body {
    display: flex;
    justify-content: space-between;
    margin: 5.3333333333vw auto 0 auto;
    width: 73.3333333333vw;
  }
  .card-benefits-exclusive-5-use-gpo-ippan {
    box-sizing: border-box;
    width: 35.2vw;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-gpo-ippan .head {
    padding: 1.6vw 1.3333333333vw;
    background: #ec6200;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #FFF;
  }
  .card-benefits-exclusive-5-use-gpo-gold {
    box-sizing: border-box;
    width: 35.2vw;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-gpo-gold .head {
    padding: 1.6vw 1.3333333333vw;
    background: #c49a3b;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #FFF;
  }
  .card-benefits-exclusive-5-use-gpo-text {
    margin: 4.6666666667vw auto 0 auto;
    width: 73.3333333333vw;
    text-align: left;
  }
  .card-benefits-exclusive-5-use-gpo-text p {
    font-weight: bold;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.4;
    letter-spacing: 0.01em;
  }
  .card-benefits-exclusive-5-use-gpo-text .link {
    padding-top: 1.6vw;
    font-weight: normal;
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.5;
  }
  .card-benefits-exclusive-5-use-gpo-notice {
    margin: 3.3333333333vw auto 0 auto;
    width: 73.3333333333vw;
  }
  .card-benefits-exclusive-5-use-gpo-notice p {
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.6;
  }
  .card-benefits-exclusive-5-use-merchandise {
    margin: 2.6666666667vw auto 0 auto;
    padding: 5.3333333333vw 0;
    background: #FFF;
    width: 84vw;
  }
  .card-benefits-exclusive-5-use-merchandise-head {
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(1.25rem, 4.8vw, 1.375rem);
    line-height: 1.3;
    letter-spacing: 0.02em;
    color: #ec6200;
  }
  .card-benefits-exclusive-5-use-merchandise-text {
    margin: 0 auto;
    padding: 5.3333333333vw 0 2vw 0;
    width: 73.3333333333vw;
  }
  .card-benefits-exclusive-5-use-merchandise-text p {
    font-weight: bold;
    font-size: clamp(0.8125rem, 3.4vw, 0.9375rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #000;
  }
  .card-benefits-exclusive-5-use-merchandise-pro {
    margin: 0 auto;
    width: 73.3333333333vw;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-head {
    padding: 2.6666666667vw 1.3333333333vw;
    background: #000;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: #ff8c00;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-body {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    grid-template-areas: "goods1 goods2 goods3" "text text text";
    margin: 0 auto;
    padding: 2.6666666667vw 0 0 0;
    width: 73.3333333333vw;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box {
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(1), .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(2), .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(3) {
    display: flex;
    flex-direction: column;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(1) .text, .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(2) .text, .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(3) .text {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.3;
    color: #ec6200;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(1) .image, .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(2) .image, .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(3) .image {
    margin: 2vw auto 0 auto;
    width: 21.3333333333vw;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(1) {
    grid-area: goods1;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(2) {
    grid-area: goods2;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(3) {
    grid-area: goods3;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(4) {
    grid-area: text;
    margin: 5.3333333333vw 0 0 0;
  }
  .card-benefits-exclusive-5-use-merchandise-pro-box:nth-child(4) .text {
    font-weight: bold;
    font-size: clamp(0.8125rem, 3.4vw, 0.9375rem);
    line-height: 1.5;
    color: #000;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket {
    margin: 6.6666666667vw auto 0 auto;
    width: 73.3333333333vw;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-head {
    padding: 2.6666666667vw 1.3333333333vw;
    background: #000;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: #ff8c00;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-body {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    width: 68vw;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-ippan {
    padding: 2.6666666667vw 0 0 0;
    width: 32.6666666667vw;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-ippan .text {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #ec6200;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-ippan .image {
    margin: 2vw 0 0 0;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-gold {
    padding: 2.6666666667vw 0 0 0;
    width: 32.6666666667vw;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-gold .text {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #c49a3b;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-ticket-gold .image {
    margin: 2vw 0 0 0;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed {
    margin: 6.6666666667vw auto 0 auto;
    width: 73.3333333333vw;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-head {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 2.6666666667vw;
    padding: 2.6666666667vw 1.3333333333vw;
    background: #000;
    text-align: center;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-head p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.75rem, 3.2vw, 0.875rem);
    line-height: 1.3;
    letter-spacing: 0.02em;
    color: #ff8c00;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-head p:first-child {
    padding: 0.8vw 2.9333333333vw;
    background: #c49a3b;
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    color: #FFF;
    border-radius: 4vw;
    overflow: hidden;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-head p:last-child {
    text-align: left;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-body {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    grid-template-areas: "mascot text" "notice notice";
    padding: 3.7333333333vw 0;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-mascot {
    box-sizing: border-box;
    grid-area: mascot;
    padding: 0 0 0 3.3333333333vw;
    width: 18.9333333333vw;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-mascot img {
    width: 13.2vw;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-text {
    grid-area: text;
    align-self: center;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.3;
    letter-spacing: 0.02em;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-notice {
    grid-area: notice;
    padding: 2.6666666667vw 4vw 0 4vw;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-notice p {
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.6;
  }
  .card-benefits-exclusive-5-use-merchandise-autographed-end {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 2;
  }
  .card-benefits-exclusive-5-use-notice {
    margin: 3.3333333333vw auto 0 auto;
    width: 84vw;
  }
  .card-benefits-exclusive-5-use-notice p {
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.6;
  }
  .process {
    background: #FFF;
    width: 100%;
  }
  .process-head {
    text-align: center;
  }
  .process-body {
    padding: 0 0 13.3333333333vw 0;
  }
  .process-step-sub-label {
    position: absolute;
    top: 0;
    left: 3.4666666667vw;
    z-index: 2;
  }
  .process-step-sub-label img {
    margin: -1.4666666667vw 0 0 0;
    width: 17.3333333333vw;
  }
  .process-step-sub-head {
    padding: 4vw 1.3333333333vw 4vw 23.2vw;
    background: #ec6200;
  }
  .process-step-sub-head h3 {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: clamp(1.0625rem, 4.2vw, 1.1875rem);
    line-height: 1.5;
    letter-spacing: 0.01em;
    color: #FFF;
  }
  .process-step-sub-body {
    background: #ffe7c5;
  }
  .process-step-1 {
    position: relative;
    margin: 0 auto;
    padding: 0 0 16.6666666667vw 0;
    background: url("/gpo-jcb/20260708/images/sp/process_step_arrow.png") 50% 100% no-repeat;
    background-size: 100% auto;
    width: 92vw;
  }
  .process-step-1 .process-step-sub-body {
    box-sizing: border-box;
  }
  .process-step-1-text {
    margin: 0 auto;
    padding: 5.3333333333vw 0 0 0;
    width: 84vw;
  }
  .process-step-1-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.4;
    letter-spacing: 0.02em;
  }
  .process-step-1-btn {
    margin: 5.3333333333vw auto 0 auto;
    width: 73.0666666667vw;
  }
  .process-step-1-notice {
    margin: 0 auto;
    padding: 5.3333333333vw 0 5.3333333333vw 0;
    width: 84vw;
  }
  .process-step-1-notice p {
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.6;
  }
  .process-step-1-notice .link {
    padding-top: 2vw;
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.6;
  }
  .process-step-2 {
    position: relative;
    margin: 0 auto;
    width: 92vw;
  }
  .process-step-2-text {
    margin: 0 auto;
    padding: 5.3333333333vw 0 5.3333333333vw 0;
    width: 84vw;
  }
  .process-step-2-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .card-details {
    background: #ffa019;
    width: 100%;
  }
  .card-details-head {
    text-align: center;
  }
  .card-details-body {
    padding: 4.6666666667vw 0 6.6666666667vw 0;
  }
  .card-details-table-head {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 900;
    font-size: clamp(1.25rem, 4.8vw, 1.375rem);
    line-height: 1.3;
    letter-spacing: 0.02em;
    color: #FFF;
    text-align: center;
  }
  .card-details-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .card-details-table {
    border-collapse: separate;
    border-spacing: 0;
    margin: 0 4vw 0 0;
    width: 136vw;
  }
  .card-details-table th {
    position: sticky;
    left: 0;
    box-sizing: border-box;
    padding: 2.6666666667vw 2vw;
    background: #FFF;
    text-align: left;
    vertical-align: top;
    border-bottom: 0.2666666667vw solid #000;
  }
  .card-details-table th p {
    font-weight: bold;
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.7;
  }
  .card-details-table td {
    box-sizing: border-box;
    padding: 2.6666666667vw 2vw;
    background: #FFF;
    width: 54.6666666667vw;
    text-align: left;
    vertical-align: top;
    border-bottom: 0.2666666667vw solid #000;
  }
  .card-details-table td p {
    font-weight: normal;
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.7;
  }
  .card-details-table tr:first-child td {
    text-align: center;
  }
  .card-details-table tr:first-child td p {
    font-weight: bold;
    color: #ec6200;
  }
  .card-details-table .annual-fee {
    margin: 0.6666666667vw 0 0 0;
    padding: 0.4vw 1.0666666667vw;
    background: #000;
    width: -moz-fit-content;
    width: fit-content;
    color: #FFF;
  }
  .card-details-table .bold {
    font-weight: bold;
  }
  .card-details-table .sep {
    padding-top: 2vw;
  }
  .card-details-table .no-border {
    padding: 2vw 2vw 0 2vw;
    border-bottom: none;
  }
  .card-details-table-box {
    box-sizing: border-box;
    margin: 6vw 0 0 auto;
    padding: 4.8vw 4.8vw;
    background: #FFF;
    width: 96vw;
  }
  .card-details-table-card {
    padding: 1.0666666667vw 0;
  }
  .card-details-table-card-face {
    margin: 0 auto 3.7333333333vw auto;
    width: 21.4666666667vw;
    text-align: center;
  }
  .card-details-table-card-btn {
    margin: 0 auto;
    width: 49.2vw;
    text-align: center;
  }
  .notes {
    background: #FFF;
    width: 100%;
  }
  .notes-body {
    margin: 0 auto;
    padding: 10.6666666667vw 0 9.3333333333vw 0;
    width: 92vw;
  }
  .notes-head {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(1rem, 4vw, 1.125rem);
    line-height: 1.5;
    letter-spacing: 0.02em;
  }
  .notes-notice {
    margin: 4vw 0 0 0;
  }
  .notes-notice p {
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.6;
  }
  .notes-notice .head {
    padding-bottom: 0.6666666667vw;
    font-weight: bold;
    font-size: clamp(0.75rem, 3.2vw, 0.875rem);
    line-height: 1.4;
    color: #ec6200;
  }
  .faq {
    background: #ffa019;
    width: 100%;
  }
  .faq-head {
    text-align: center;
  }
  .faq-body {
    padding: 0 0 8vw 0;
  }
  .faq-qanda {
    margin: 0 auto;
    background: #FFF;
    width: 92vw;
  }
  .faq-qanda-box dt button {
    box-sizing: border-box;
    padding: 3.3333333333vw 2.6666666667vw 3.3333333333vw 14.6666666667vw;
    width: 100%;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.3;
    letter-spacing: 0.01em;
    text-align: left;
    color: #000;
  }
  .faq-qanda-box dt button:hover {
    opacity: 0.75;
  }
  .faq-qanda-box dt button.close {
    background: url("/gpo-jcb/20260708/images/sp/faq_icon_q.png") 2.4vw 50% no-repeat, url("/gpo-jcb/20260708/images/icon_button_plus_orange.svg") 96% 50% no-repeat, #FFF;
    background-size: 9.3333333333vw auto, 4.8vw 4.8vw;
  }
  .faq-qanda-box dt button.open {
    background: url("/gpo-jcb/20260708/images/sp/faq_icon_q.png") 2.4vw 50% no-repeat, url("/gpo-jcb/20260708/images/icon_button_minus_orange.svg") 96% 50% no-repeat, #FFF;
    background-size: 9.3333333333vw auto, 4.8vw 4.8vw;
  }
  .faq-qanda-box dd {
    background: url("/gpo-jcb/20260708/images/sp/faq_icon_a.png") 2.4vw 1.8666666667vw no-repeat, #fce8d9;
    background-size: 9.3333333333vw auto;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
    max-height: 0;
  }
  .faq-qanda-box-text {
    box-sizing: border-box;
    padding: 3.3333333333vw 2.6666666667vw 4vw 14.6666666667vw;
  }
  .faq-qanda-box-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    line-height: 1.5;
    letter-spacing: 0.01em;
  }
  .footer {
    display: flex;
    flex-direction: column;
    background: #FFF;
    width: 100%;
  }
  .footer-jcb {
    order: 2;
    display: flex;
    align-items: center;
    margin: 0 auto;
    padding: 4vw 0 8vw 0;
    width: 92vw;
  }
  .footer-jcb-logo {
    box-sizing: border-box;
    width: 16.8vw;
    text-align: right;
  }
  .footer-jcb-logo img {
    width: 13.2vw;
  }
  .footer-jcb-main {
    flex: 1;
    padding: 0 0 0 6vw;
  }
  .footer-jcb-main-text {
    padding: 0 0 0.6666666667vw 0;
  }
  .footer-jcb-main-text p {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.5;
  }
  .footer-jcb-main-link li {
    margin: 1.0666666667vw 0 0 0;
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.6;
  }
  .footer-jcb-main-link li:first-child {
    margin: 0;
  }
  .footer-inquiry {
    order: 1;
    margin: 0 auto;
    padding: 5.3333333333vw 0 5.3333333333vw 0;
    width: 92vw;
    background: repeating-linear-gradient(to right, #000 0, #000 calc(3 / 750 * 100vw), transparent calc(3 / 750 * 100vw), transparent calc(6 / 750 * 100vw)) 50% 100% no-repeat;
    background-size: 100% calc(3 / 750 * 100vw);
  }
  .footer-inquiry-head {
    padding-bottom: 2vw;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: clamp(0.875rem, 3.6vw, 1rem);
    line-height: 1.5;
  }
  .footer-inquiry-text {
    padding: 0 0 0 1.3333333333vw;
  }
  .footer-inquiry-text p {
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    line-height: 1.5;
  }
  .footer-copyright {
    order: 3;
    padding: 4vw 0 21.3333333333vw 0;
    background: #000;
    width: 100%;
    text-align: center;
  }
  .footer-copyright p {
    font-size: clamp(0.625rem, 2.8vw, 0.75rem);
    line-height: 1.5;
    color: #FFF;
  }
  .fixed-bottom {
    position: fixed;
    left: 0;
    bottom: 0;
    padding: 2vw 0;
    background: rgba(0, 0, 0, 0.25);
    width: 100%;
    z-index: 100;
    text-align: center;
    display: none;
    opacity: 0;
    transition: opacity 0.4s ease;
  }
  .fixed-bottom.visible {
    opacity: 1;
  }
  .fixed-bottom ul {
    margin: 0 auto;
    width: 62.6666666667vw;
  }
  .modal-nav-shadow {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(247, 248, 248, 0.5);
    z-index: 499;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
  }
  .modal-nav-shadow.visible {
    opacity: 1;
    display: block;
  }
}
@media (prefers-reduced-motion: reduce) {
  .camp-body-in {
    transition: none;
  }
}