@charset "utf-8";




:root {
  --c-teal: #00d6cf;
  --c-teal-d: #21b8bb;
  --c-teal-l: #2eeae4;
  --c-red: #c3002f;
  --c-red-d: #8f0023;
  --c-txt: #323232;
  --c-yellow: #ffe816;
  --c-yellow-d: #ffca00;
  --c-cream: #fffade;
  --c-cream-d: #f8f5e0;
  --c-mint: #d8f2f1;
  --c-grid: #fffbe7;
  
  --c-movie-orange: #FFC6A9;
  --c-movie-blue: #60B5FA;
  --c-movie-pink: #FFA000;
  --c-movie-yellow: #FFA3A6;
}

body {
  font-family: "ShinGoPro", "A-OTF Shin Go Pro", "Hiragino Kaku Gothic ProN",
    "Yu Gothic", "Meiryo", sans-serif;
  color: var(--c-txt);
  background: #fff;
  overflow-x: hidden;
}
.nbf-regular { font-family: "ShinGoPro-Regular", "ShinGoPro", sans-serif; }
.nbf-bold { font-family: "ShinGoPro-Bold", "ShinGoPro", sans-serif; }

main {
  position: relative;
  overflow-x: clip;
  overflow-y: visible;
}


.hd {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 100;
  pointer-events: none;
}
.hd_logo {
  display: block;
  pointer-events: auto;
  margin: calc(var(--winW) * 30) 0 0 calc(var(--winW) * 20);
  width: calc(var(--winW) * 140);
}
.hd_logo img { filter: none; }
.hd_logo_pc { display: none; }
.hd_logo_sp { width: 100%; filter: brightness(0) invert(1); }


.menu_btn img {
  -webkit-user-drag: none;
  user-select: none;
}
.menu_btn {
  position: fixed;
  top: 0;
  right: calc(var(--winW) * 17.5);
  z-index: 110;
  pointer-events: auto;
  
  width: calc(var(--winW) * 70);
  height: calc(var(--winW) * 64);
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
  appearance: none;
}

.menu_btn_pouch {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.menu_btn_pouch picture,
.menu_btn_pouch img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.menu_btn_pouch img,
.menu_btn_chara img {
  filter: none;
}

.menu_btn_chara {
  position: absolute;
  left: 50%;
  bottom: calc(var(--winW) * -1);
  z-index: 0;
  width: calc(var(--winW) * 44);
  transform: translateX(-50%);
  pointer-events: none;
}
@media only screen and (min-width: 769px) {
  .menu_btn_chara {
    bottom: calc(var(--winW) * -5);
  }
}

.close_btn_chara {
  width: calc(var(--winW) * 47);
  bottom: calc(var(--winW) * -9);
  transform: translateX(-50%);
}
@media only screen and (min-width: 769px) {
  .close_btn_chara {
    bottom: calc(var(--winW) * 3);
  }
}

@keyframes menuCharaEnter {
  0%      { bottom: calc(var(--winW) * -1); z-index: 0; }
  70%     { bottom: calc(var(--winW) * 28); z-index: 0; }
  70.001% { z-index: 2; }
  100%    { bottom: calc(var(--winW) * 23); z-index: 2; }
}

@keyframes menuCharaExit {
  0%      { bottom: calc(var(--winW) * 23); z-index: 2; }
  30%     { bottom: calc(var(--winW) * 28); z-index: 2; }
  30.001% { z-index: 0; }
  100%    { bottom: calc(var(--winW) * -1); z-index: 0; }
}
.menu_btn_chara.is-entering {
  animation: menuCharaEnter 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
.menu_btn_chara.is-leaving {
  animation: menuCharaExit 0.35s ease-in forwards;
}
@media only screen and (min-width: 769px) {
  @keyframes menuCharaEnter {
    0%      { bottom: calc(var(--winW) * -3); z-index: 0; }
    70%     { bottom: calc(var(--winW) * 44); z-index: 0; }
    70.001% { z-index: 2; }
    100%    { bottom: calc(var(--winW) * 37); z-index: 2; }
  }
  @keyframes menuCharaExit {
    0%      { bottom: calc(var(--winW) * 37); z-index: 2; }
    30%     { bottom: calc(var(--winW) * 44); z-index: 2; }
    30.001% { z-index: 0; }
    100%    { bottom: calc(var(--winW) * -3); z-index: 0; }
  }
}

@keyframes closeCharaEnter {
  0%      { bottom: calc(var(--winW) * -9);  z-index: 0; }
  70%     { bottom: calc(var(--winW) * 18); z-index: 0; }
  70.001% { z-index: 2; }
  100%    { bottom: calc(var(--winW) * 14); z-index: 2; }
}

@keyframes closeCharaExit {
  0%      { bottom: calc(var(--winW) * 14); z-index: 2; }
  30%     { bottom: calc(var(--winW) * 18); z-index: 2; }
  30.001% { z-index: 0; }
  100%    { bottom: calc(var(--winW) * -9);  z-index: 0; }
}
.close_btn_chara.is-entering {
  animation: closeCharaEnter 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
.close_btn_chara.is-leaving {
  animation: closeCharaExit 0.35s ease-in forwards;
}
@media only screen and (min-width: 769px) {
  @keyframes closeCharaEnter {
    0%      { bottom: calc(var(--winW) * -16);  z-index: 0; }
    70%     { bottom: calc(var(--winW) * 27); z-index: 0; }
    70.001% { z-index: 2; }
    100%    { bottom: calc(var(--winW) * 23); z-index: 2; }
  }
  @keyframes closeCharaExit {
    0%      { bottom: calc(var(--winW) * 23); z-index: 2; }
    30%     { bottom: calc(var(--winW) * 27); z-index: 2; }
    30.001% { z-index: 0; }
    100%    { bottom: calc(var(--winW) * -16);  z-index: 0; }
  }
}


.gnav {
  position: fixed;
  inset: 0;
  z-index: 1000;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
.gnav.is-open {
  visibility: visible;
  opacity: 1;
}
.gnav_overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
  opacity: 0.5;
}

.gnav_panel {
  position: absolute;
  top: 0;
  
  right: calc(var(--winW) * -14);
  width: calc(var(--winW) * 299);
  height: 100%;
  background: #fff;
  border-radius: calc(var(--winW) * 40) 0 0 calc(var(--winW) * 40);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  
  padding-right: calc(var(--winW) * 14);
  
  transform: translateX(40%);
  transition: transform 0.5s ease;
  padding-bottom: calc(var(--winW) * 0);
}
.gnav.is-open .gnav_panel {
  transform: translateX(0);
  transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.gnav_panel .menu_btn { right: calc(var(--winW) * 31); }

.gnav_scale {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
.gnav_scale_inner {
  
  overflow: hidden;
  transform-origin: top center;
}
.gnav_logo {
  width:  calc(var(--winW) * 185);
  margin: calc(var(--winW) * 45.37) auto 0;
}
.gnav_label {
  margin-top: calc(var(--winW) * 13.6);
  font-family: "Nissan Brand", "ShinGoPro", sans-serif;
  font-size: calc(var(--winW) * 12);
  letter-spacing: 0.12em;
  text-align: center;
  color: var(--c-teal);
  line-height: 1.4;
}
.gnav_list {
  width: calc(var(--winW) * 216);
  margin: calc(var(--winW) * 16) auto 0;
  border-top: 1px solid var(--c-teal);
}
.gnav_list li { border-bottom: 1px solid var(--c-teal); }
.gnav_list a {
  display: block;
  padding: calc(var(--winW) * 18) 0;
  font-size: calc(var(--winW) * 16);
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-align: center;
  color: var(--c-teal);
}

.gnav_chara {
  flex: 0 0 auto;
  position: relative;
  width: calc(var(--winW) * 121);
  margin: calc(var(--winW) * 20) 0 0 calc(var(--winW) * 95);
  pointer-events: none;
}



.float_reserve {
  position: fixed;
  right: calc(var(--winW) * -38);
  bottom: calc(var(--winW) * -75);
  transform: translateY(-50%);
  z-index: 90;
  width: calc(var(--winW) * 80);
  transition: transform 0.25s ease;
  cursor: pointer;
}

@media (hover: hover) {
  .float_reserve:hover {
    transform: translateY(-50%) translateX(calc(var(--winW) * -10));
  }
}
.btn_reserve_chara {
  position: absolute;
  width: calc(var(--winW) * 27);
  top: calc(var(--winW) * 14);
  right: calc(var(--winW) * 36.5);
}
@media only screen and (min-width: 769px) {
  .btn_reserve_chara {
    width: calc(var(--winW) * 40);
    top: calc(var(--winW) * 21);
    right: calc(var(--winW) * 60);
  }
}
@keyframes floatReserveIn {
  0%   { right: calc(var(--winW) * -100); }
  70%  { right: calc(var(--winW) * -20); }
  100% { right: calc(var(--winW) * -35); }
}
.float_reserve.is-in {
  animation: floatReserveIn 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes btnReserveCharaHop {
  0%, 100% { transform: translateY(0); }
  10% { transform: translateY(calc(var(--winW) * -3)); }
  20% { transform: translateY(0); }
}



.btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--winW) * 315);
  height: calc(var(--winW) * 68);
  margin: 0 auto;
  border: none;
  border-radius: calc(var(--winW) * 100);
  font-family: inherit;
  font-size: calc(var(--winW) * 18);
  font-weight: bold;
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: rgb(50 50 50);
  cursor: pointer;
  appearance: none;
  text-align: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.btn--yellow {
  background: rgb(255 225 0);
  box-shadow: 0 calc(var(--winW) * 7) 0 0 var(--c-yellow-d);
}
.btn--yellow.btn-light {
  font-weight: bold;
}
.btn--white {
  background: #fff;
  color: #00D6CF;
  box-shadow: 0 calc(var(--winW) * 6) 0 0 #e5e5e5;
}
.btn--red {
  background: var(--c-red);
  color: #fff;
  box-shadow: 0 calc(var(--winW) * 7) 0 0 var(--c-red-d);
}
.btn--red .btn_arrow {
  border-color: #fff;
}

.btn--yellow:hover,
.btn--yellow:active {
  transform: translateY(calc(var(--winW) * 7));
  box-shadow: none;
}
.btn--white:hover,
.btn--white:active {
  transform: translateY(calc(var(--winW) * 6));
  box-shadow: none;
}
.btn--red:hover,
.btn--red:active {
  transform: translateY(calc(var(--winW) * 7));
  box-shadow: none;
}

.btn_char {
  display: inline-block;
  transform-origin: center bottom;
  --char-rotate: 8deg;
}

@keyframes btnCharBounce {
  0%, 30%, 100% { transform: translateY(0) rotate(0deg) scale(1, 1); }
  4% { transform: translateY(calc(var(--winW) * 2.7)) rotate(0deg) scale(1.2, 0.7); }
  9% { transform: translateY(calc(var(--winW) * -6.7)) rotate(var(--char-rotate)) scale(0.85, 1.2); }
  16% { transform: translateY(calc(var(--winW) * 2)) rotate(calc(var(--char-rotate) * -0.4)) scale(1.1, 0.9); }
  23% { transform: translateY(calc(var(--winW) * -3.3)) rotate(calc(var(--char-rotate) * 0.5)) scale(1, 1); }
}

.btn:hover .btn_char,
.gnav_list a:hover .btn_char { animation: btnCharBounce 2s ease infinite; }

.btn:hover .btn_char:nth-child(odd),
.gnav_list a:hover .btn_char:nth-child(odd) { --char-rotate: 8deg; }
.btn:hover .btn_char:nth-child(even),
.gnav_list a:hover .btn_char:nth-child(even) { --char-rotate: -8deg; }
.btn:hover .btn_char:nth-child(1),
.gnav_list a:hover .btn_char:nth-child(1) { animation-delay: 0s; }
.btn:hover .btn_char:nth-child(2),
.gnav_list a:hover .btn_char:nth-child(2) { animation-delay: 0.03s; }
.btn:hover .btn_char:nth-child(3),
.gnav_list a:hover .btn_char:nth-child(3) { animation-delay: 0.06s; }
.btn:hover .btn_char:nth-child(4),
.gnav_list a:hover .btn_char:nth-child(4) { animation-delay: 0.09s; }
.btn:hover .btn_char:nth-child(5),
.gnav_list a:hover .btn_char:nth-child(5) { animation-delay: 0.12s; }
.btn:hover .btn_char:nth-child(6),
.gnav_list a:hover .btn_char:nth-child(6) { animation-delay: 0.15s; }
.btn:hover .btn_char:nth-child(7),
.gnav_list a:hover .btn_char:nth-child(7) { animation-delay: 0.18s; }
.btn:hover .btn_char:nth-child(8),
.gnav_list a:hover .btn_char:nth-child(8) { animation-delay: 0.21s; }
.btn:hover .btn_char:nth-child(9),
.gnav_list a:hover .btn_char:nth-child(9) { animation-delay: 0.24s; }
.btn:hover .btn_char:nth-child(10),
.gnav_list a:hover .btn_char:nth-child(10) { animation-delay: 0.27s; }
.btn:hover .btn_char:nth-child(11),
.gnav_list a:hover .btn_char:nth-child(11) { animation-delay: 0.3s; }
.btn:hover .btn_char:nth-child(12),
.gnav_list a:hover .btn_char:nth-child(12) { animation-delay: 0.33s; }
.btn:hover .btn_char:nth-child(13),
.gnav_list a:hover .btn_char:nth-child(13) { animation-delay: 0.36s; }
.btn:hover .btn_char:nth-child(14),
.gnav_list a:hover .btn_char:nth-child(14) { animation-delay: 0.39s; }
.btn_arrow {
  position: absolute;
  top: 50%;
  right: calc(var(--winW) * 24);
  width: calc(var(--winW) * 11);
  height: calc(var(--winW) * 11);
  margin-top: calc(var(--winW) * -6);
  border-style: solid;
  border-color: var(--c-teal);
  border-width: calc(var(--winW) * 3) calc(var(--winW) * 3) 0 0;
  border-radius: 1px;
  transform: rotate(45deg);
  --arrow-travel: calc(var(--winW) * 5.5); 
}

@keyframes btnArrowSlide {
  0%, 100% { transform: translateX(0) rotate(45deg); }
  50% { transform: translateX(var(--arrow-travel)) rotate(45deg); }
}
.btn:hover .btn_arrow { animation: btnArrowSlide 1s ease-in-out infinite; }


.badge {
  display: block;
  width: fit-content;
  margin: 0 auto;
  padding: calc(var(--winW) * 7) calc(var(--winW) * 22);
  border-radius: calc(var(--winW) * 100);
  background: var(--c-teal);
  color: #fff;
  font-family: "ShinGoPro-Bold", "ShinGoPro", sans-serif;
  font-weight: bold;
  font-size: calc(var(--winW) * 14);
  letter-spacing: 0.1em;
  line-height: 1.4;
}


.lead_flag {
  position: absolute;
  top: calc(var(--winW) * -1);
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 1;
}
.check_flag {
  position: absolute;
  top: calc(var(--winW) * -31);
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 0;
}
.lineup_flag {
  position: absolute;
  top: calc(var(--winW) * -7);
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 1;
}
.prof_flag {
  position: absolute;
  top: calc(var(--winW) * 8);
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 1;
}
.goods_flag {
  position: absolute;
  top: calc(var(--winW) * -1);
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 1;
}
.info_flag {
  position: absolute;
  top: calc(var(--winW) * -8);
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 1;
}

.lead_flag {
  opacity: 0;
  transform: translateY(calc(var(--winW) * -160));
}
.lead_flag.is-in {
  animation: flagBounceIn 0.55s cubic-bezier(0.34, 1.9, 0.64, 1) forwards;
}
@keyframes flagBounceIn {
  0%   { opacity: 0; transform: translateY(calc(var(--winW) * -160)); }
  100% { opacity: 1; transform: translateY(0); }
}
.lead_flag_l, .lead_flag_r {
  position: absolute;
  top: 0;
  width: calc(var(--winW) * 90);
}
.check_flag_l, .check_flag_r {
  position: absolute;
  top: 0;
  width: calc(var(--winW) * 106);
}
.lineup_flag_l, .lineup_flag_r {
  position: absolute;
  top: 0;
  width: calc(var(--winW) * 106);
}
.prof_flag_l, .prof_flag_r {
  position: absolute;
  top: 0;
  width: calc(var(--winW) * 105.6);
}
.goods_flag_l, .goods_flag_r {
  position: absolute;
  top: 0;
  width: calc(var(--winW) * 106);
}
.info_flag_l, .info_flag_r {
  position: absolute;
  top: 0;
  width: calc(var(--winW) * 105.6);
}
.lead_flag_l, .check_flag_l, .prof_flag_l, .goods_flag_l, .info_flag_l {
  left: calc(var(--winW) * 0);
}
.lineup_flag_l {
  left: calc(var(--winW) * -1);
}
.lead_flag_r, .check_flag_r, .lineup_flag_r, .prof_flag_r, .goods_flag_r, .info_flag_r {
  right: calc(var(--winW) * 0);
}


.kv {
  position: relative;
  width: 100%;
  height: calc(var(--winW) * 680);
  overflow: hidden;
  background: var(--c-teal);
  z-index: 3;
}
.kv_movie {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kv_mask {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.25);
}
.kv_ttl {
  position: absolute;
  left: 50%;
  top: calc(var(--winW) * 111);
  width: calc(var(--winW) * 330);
  transform: translateX(-50%);
  z-index: 2;
}
.kv_ttl img { width: 100%; }


.sound_btn {
  position: absolute;
  left: calc(var(--winW) * 10);
  bottom: calc(var(--winW) * 35);
  z-index: 50;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(var(--winW) * 1);
  width: calc(var(--winW) * 70);
  height: calc(var(--winW) * 70);
  padding: 0;
  border: none;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  appearance: none;
  box-shadow: 0 calc(var(--winW) * 3) calc(var(--winW) * 8) rgba(0, 0, 0, 0.25);
}
.sound_btn.is-hide {
  opacity: 0;
  visibility: hidden;
  transform: translateY(calc(var(--winW) * 10));
}
.sound_btn {
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}

.sound_btn.is-fixed {
  position: fixed;
  bottom: calc(var(--winW) * 20);
  opacity: 0;
  visibility: hidden;
}
.sound_btn.is-fixed.is-revealed:not(.is-hide) {
  opacity: 1;
  visibility: visible;
}

.sound_btn:not(.is-fixed) {
  background: none;
  box-shadow: none;
}

.kv_btn {
  position: absolute;
  left: 50%;
  bottom: calc(var(--winW) * 166);
  transform: translateX(-50%);
  z-index: 3;
  width: calc(var(--winW) * 116.6);
  cursor: pointer;
}
.kv_btn img { width: 100%; }

.kv_btn_pic--normal {
  transition: opacity 0.3s ease;
}
.kv_btn_pic--hover {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}
/* :hoverをタッチデバイスにも常時マッチさせていると、iOS Safari特有の
   「:hoverにマッチする要素は1回目のタップでhover状態を確定させるだけで
   実際のタップ（クリック）は2回目まで発火しない」という仕様に引っかかる。
   マウス操作可能な環境（hover:hover）だけに限定することでこれを回避する */
@media (hover: hover) {
  .kv_btn:hover .kv_btn_pic--normal {
    opacity: 0;
  }
  .kv_btn:hover .kv_btn_pic--hover {
    opacity: 1;
  }
}

.modaal-inner-wrapper {
  padding-left: 0;
  padding-right: 0;
}
@media (max-width: 768px) {
  .modaal-video-wrap {
    margin-left: calc(var(--winW) * 4);
    margin-right: calc(var(--winW) * 4);
  }
}

.modaal-video-container {
  padding-bottom: 0 !important;
  height: auto !important;
  max-height: none !important;
  aspect-ratio: 16 / 9;
  width: 100vw;
  max-width: 100vw;
}
@media (min-width: 769px) {
  .modaal-video-container {
    width: 80vw;
    max-width: 80vw;
  }
}

.modaal-video-container:has(iframe[src*="Egt6IH_XQ_E"], iframe[src*="l0UzZELXmzw"]) {
  aspect-ratio: 9 / 16 !important;
  width: 90vw !important;
  max-width: 90vw !important;
  height: auto !important;
  max-height: none !important;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 769px) {
  .modaal-video-container:has(iframe[src*="Egt6IH_XQ_E"], iframe[src*="l0UzZELXmzw"]) {
    width: auto !important;
    max-width: 100% !important;
    height: 100vh !important;
    max-height: 100vh !important;
  }
}

.sound_btn_ico_kv {
  display: block;
  position: relative;
  width: calc(var(--winW) * 70);
  height: calc(var(--winW) * 70);
  color: #fff;
}
.sound_btn.is-fixed .sound_btn_ico_kv {
  color: var(--c-teal);
  width: calc(var(--winW) * 60);
  height: calc(var(--winW) * 60);
}
.sound_btn_ico_kv svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.sound_btn_ico_kv .sound_btn_ico_off { display: none; }
.sound_btn.is-muted .sound_btn_ico_kv .sound_btn_ico_on { display: none; }
.sound_btn.is-muted .sound_btn_ico_kv .sound_btn_ico_off { display: block; }

.sound_btn_txt {
  display: none;
}


.lead {
  position: relative;
  padding: calc(var(--winW) * 106.38) 0 calc(var(--winW) * 165);
  background: #fff;
  text-align: center;
}
.lead_txt {
  font-size: calc(var(--winW) * 16);
  letter-spacing: 0.05em;
  line-height: 1.76;
  color: var(--c-teal);
}
.lead_txt--2 {
  margin-top: calc(var(--winW) * 26);
  letter-spacing: 0.1em;
  line-height: 2;
}


.cp {
  position: relative;
  padding: 0 0 calc(var(--winW) * 140);
  background: linear-gradient(
    to bottom,
    #fff 0,
    #fff 50%,
    var(--c-mint) 50%,
    var(--c-mint) 100%
  );
}

.cp_bg {
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.cp_arch {
  position: absolute;
  left: 50%;
  top: calc(var(--winW) * -150);
  width: calc(var(--winW) * 566);
  height: calc(var(--winW) * 300);
  margin-left: calc(var(--winW) * -283);
  z-index: 3;
  pointer-events: none;
  overflow: hidden;
}

.cp_arch_txt {
  position: absolute;
  width: calc(var(--winW) * 979);
  left: calc(var(--winW) * -205);
  top: calc(var(--winW) * 70);
}

.cp_arch_run_oya {
  display: block;
  position: absolute;
  left: 40%;
  top: calc(var(--winW) * 10);
  width: calc(var(--winW) * 170);
  height: calc(var(--winW) * 190.131);
  margin-left: calc(var(--winW) * -75);
}
.cp_arch_run_ko {
  display: block;
  position: absolute;
  left: 47%;
  top: calc(var(--winW) * 92);
  width: calc(var(--winW) * 82);
  height: calc(var(--winW) * 116.487);
  margin-left: calc(var(--winW) * 10);
}
.cp_inner {
  position: relative;
  z-index: 2;
  width: calc(var(--winW) * 335);
  margin: 0 auto;
  padding-top: calc(var(--winW) * 125);
}



.cp_card {
  position: relative;
  margin-top: calc(var(--winW) * 68);
  transform: scale(0.6);
}
.cp_card:first-child { margin-top: 0; }

@keyframes cpCardEnter {
  0% { transform: scale(0.6); }
  20% { transform: scale(0.6); }
  60% { transform: scale(1.1); }
  100% { transform: scale(1); }
}
.cp_card.is-entering {
  animation: cpCardEnter 0.8s ease forwards;
}
.cp_badge {
  position: absolute;
  left: calc(var(--winW) * -15);
  top: calc(var(--winW) * -55);
  z-index: 3;
  width: calc(var(--winW) * 117);
}

.cp_badge_bg {
  display: block;
  width: 100%;
  height: auto;
  animation: cpBadgeSpin 13s linear infinite;
}
@keyframes cpBadgeSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.cp_badge_txt {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 55%;
  height: auto;
  transform: translate(-50%, -50%);
}

.cp_pop {
  position: absolute;
  left: 50%;
  top: 0;
  z-index: 0;
  width: calc(var(--winW) * 87);
  margin-left: calc(var(--winW) * -45);
}
@keyframes cpPopEnter {
  0%      { top: 0;                         z-index: 0; }
  70%     { top: calc(var(--winW) * -58);   z-index: 0; }
  70.001% { z-index: 3; }
  100%    { top: calc(var(--winW) * -49);   z-index: 3; }
}
@keyframes cpPopEnterPink {
  0%      { top: 0;                         z-index: 0; }
  70%     { top: calc(var(--winW) * -47);   z-index: 0; }
  70.001% { z-index: 3; }
  100%    { top: calc(var(--winW) * -44);   z-index: 3; }
}

.cp_pop.is-entering {
  animation: cpPopEnter 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) 0.8s forwards;
}
.cp_pop.pink.is-entering {
  animation: cpPopEnterPink 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) 0.8s forwards;
}
.cp_card_in {
  position: relative;
  z-index: 2;
  padding: calc(var(--winW) * 54) calc(var(--winW) * 20) calc(var(--winW) * 30);
  border-radius: calc(var(--winW) * 20);
  background-color: #FFFADE;
  background-image: radial-gradient(#fff 22%, transparent 24%),
    radial-gradient(#fff 22%, transparent 24%);
  background-size: calc(var(--winW) * 16) calc(var(--winW) * 16);
  background-position: 0 0, calc(var(--winW) * 8) calc(var(--winW) * 8);
  border: calc(var(--winW) * 6) solid #fff;
  overflow: hidden;
}
.cp_card_a + .cp_card_a {
  margin-top: calc(var(--winW) * 70);
}
.cp_card_in.second {
  padding: calc(var(--winW) * 62) calc(var(--winW) * 20) calc(var(--winW) * 30);
}
.cp_card_flag {
  position: absolute;
  right: calc(var(--winW) * -3);
  top: calc(var(--winW) * -7);
  width: calc(var(--winW) * 90.57);
  z-index: 2;
}
.cp_card_gentei {
  position: absolute;
  right: calc(var(--winW) * 20);
  bottom: calc(var(--winW) * 230);
  width: calc(var(--winW) * 92);
  transform: rotate(-15.23deg);
  z-index: 4;
}
.cp_card_genteichara {
  position: absolute;
  right: calc(var(--winW) * 0);
  bottom: calc(var(--winW) * 120);
  width: calc(var(--winW) * 83);
  z-index: 3;
}
.cp_card_ttl {
  width: calc(var(--winW) * 219);
  margin: 0 auto;
}
.cp_card_ttl--charm { width: calc(var(--winW) * 284.26); }
.cp_card_fig {
  margin-top: calc(var(--winW) * 0);
  border-radius: calc(var(--winW) * 8);
  overflow: hidden;
}
.cp_card_lead {
  margin-top: calc(var(--winW) * 16);
  font-size: calc(var(--winW) * 14);
  letter-spacing: 0.03em;
  line-height: 1.8;
  color: var(--c-txt);
}
.cp_card_lead--charm { text-align: left; }

.cp_card_lead--hang { text-indent: -0.5em; }
.cp_card_imgnote {
  position: absolute;
  font-size: calc(var(--winW) * 11);
  letter-spacing: 0.05em;
  line-height: 1.8;
}
.cp_card_note {
  margin-top: calc(var(--winW) * 14);
  font-size: calc(var(--winW) * 10);
  letter-spacing: 0.05em;
  line-height: 1.71;
}
.cp_card_in.second .cp_card_note {
  margin-top: calc(var(--winW) * 14);
  font-size: calc(var(--winW) * 10);
  letter-spacing: 0em;
  line-height: 2;
}
.cp_card_tag {
  display: inline-block;
  margin-left: calc(var(--winW) * 4);
  padding: 0 calc(var(--winW) * 4);
  border: 1px solid color-mix(in srgb, var(--c-txt) 70%, transparent);
  font-size: calc(var(--winW) * 10);
  line-height: 1.6;
  white-space: nowrap;
}

.charm_slider {
  margin-top: calc(var(--winW) * 0);
}
.charm_slider_pager {
  position: static !important;
  margin-top: calc(var(--winW) * 10);
}


.check {
  position: relative;
  padding: calc(var(--winW) * 40) 0 calc(var(--winW) * 40);
  background: var(--c-mint);
}
.check_cloud_r {
  width: calc(var(--winW) * 114);
  position: absolute;
  top: calc(var(--winW) * 110);
  right: calc(var(--winW) * -41);
}
.check_cloud_l {
  width: calc(var(--winW) * 114);
  position: absolute;
  top: calc(var(--winW) * 113);
  left: calc(var(--winW) * -38);
}
@media only screen and (min-width: 769px) {
  .check_flag {
    top: calc(var(--winW) * -253);
  }
}
.check_ttl {
  position: relative;
  z-index: 2;
  width: calc(var(--winW) * 350);
  margin: 0 auto;
}

.check_ttl dotlottie-wc {
  display: block;
  width: 100%;
  aspect-ratio: 723.429 / 249.448;
}

.check_scroll {
  position: relative;
  z-index: 2;
  height: 300vh;
  margin-top: calc(var(--winW) * 34);
}

.check_stack_sticky {
  position: sticky;
  top: 0;
  display: flex;
  justify-content: center;
  padding: calc(var(--winW) * 20) 0;
  overflow: visible;
}

.check_stack {
  position: relative;
  display: grid;
  width: calc(var(--winW) * 309);
  margin: 0 auto;
  overflow: visible;
}

.check_stack_cloud {
  position: absolute;
  z-index: 4;
  pointer-events: none;
  --exit-y: 0%;
  transform: translateY(var(--exit-y));
}
.check_stack_cloud--l {
  left: calc(var(--winW) * 0);
  top: calc(var(--winW) * 310);
  width: calc(var(--winW) * 300);
}
.check_stack_cloud--r {
  right: calc(var(--winW) * -67);
  top: calc(var(--winW) * 493);
  width: calc(var(--winW) * 322);
}


.ccard {
  grid-area: 1 / 1;
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: calc(var(--winW) * 24);
  border-style: solid;
  border-color: var(--c-teal-l);
  border-width: calc(var(--winW) * 10);
  background: radial-gradient(circle at 40% 40%, #18cbcf 0%, #0cd1cf 50%, #00d6cf 100%);
  padding: calc(var(--winW) * 30) 0 calc(var(--winW) * 43);
  overflow: hidden;
  text-align: center;
  will-change: transform;
  --exit-y: 0%;
  --rotate: 0deg;
  transform: translate(0, var(--exit-y)) rotate(var(--rotate));
  z-index: 3;
}
.ccard--kiite {
  --rotate: -5.23deg;
  transform: translate(calc(var(--winW) * 8), calc(var(--winW) * -59 + var(--exit-y))) rotate(var(--rotate));
  z-index: 2;
  border-color: #ffdf64;
  background: #FCC800;
}
.ccard--notte {
  --rotate: 2.89deg;
  
  --shift-x: -7;
  transform: translate(calc(var(--winW) * var(--shift-x)), calc(var(--winW) * 14 + var(--exit-y))) rotate(var(--rotate));
  z-index: 1;
  border-color: #ffc060;
  background: #FF9A00;
}
.ccard_num { order: 1; }
.ccard_ttl { order: 2; }
.ccard_sub { order: 3; }
.ccard_txt { order: 5; }
.ccard_num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--winW) * 34);
  height: calc(var(--winW) * 34);
  margin: 0 auto;
  border-radius: 50%;
  background: #fff;
  font-family: "Nissan Brand", "ShinGoPro-Bold", sans-serif;
  font-weight: bold;
  font-size: calc(var(--winW) * 14);
  letter-spacing: 0.1em;
  line-height: 1;
  color: #0ed1cf;
}
.ccard--kiite .ccard_num { color: #fcc800; }
.ccard--notte .ccard_num { color: #f7901a; }
.ccard_ttl {
  margin-top: calc(var(--winW) * 14);
}
.ccard_ttl_top {
  width: calc(var(--winW) * 76);
  margin: 0 auto;
}
.ccard--kiite .ccard_ttl_top,
.ccard--notte .ccard_ttl_top { width: calc(var(--winW) * 112); }
.ccard_ttl_btm {
  width: calc(var(--winW) * 200);
  margin: calc(var(--winW) * 4) auto 0;
}
.ccard_sub {
  margin-top: calc(var(--winW) * 14);
  padding: 0 calc(var(--winW) * 10);
  font-size: calc(var(--winW) * 15);
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: #fff;
}
.ccard_visual {
  order: 4;
  position: relative;
  width: 100%;
  height: calc(var(--winW) * 209);
  margin-top: calc(var(--winW) * 10);
}
.ccard_illust {
  position: absolute;
  left: calc(var(--winW) * 4);
  bottom: 0;
  width: calc(var(--winW) * 177);
  margin: 0;
}
.ccard_illust--kiite {
  left: 50%;
  bottom: calc(var(--winW) * 0);
  width: calc(var(--winW) * 223);
  
  transform: translateX(-50%);
}
.ccard_illust--notte {
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(var(--winW) * -14);
  width: calc(var(--winW) * 210);
  
}
.ccard_txt {
  margin-top: calc(var(--winW) * 13);
  padding: 0 calc(var(--winW) * 10);
  font-size: calc(var(--winW) * 13);
  letter-spacing: 0.04em;
  line-height: 2;
  color: #fff;
}
.ccard_car {
  display: block;
  position: absolute;
  right: calc(var(--winW) * 1);
  bottom: 0;
  width: calc(var(--winW) * 103);
  margin: 0;
}
.ccard_car img { margin-top: calc(var(--winW) * -76); }


.movie {
  position: relative;
  padding: calc(var(--winW) * 50) 0 calc(var(--winW) * 45.5);
  background: #fff;
}
.movie_scallop {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  pointer-events: none;
}
.movie_ttl {
  width: calc(var(--winW) * 350);
  margin: 0 auto;
}
.movie_ttl dotlottie-wc {
  display: block;
  width: 100%;
  aspect-ratio: 733.147 / 139.891;
}
.movie_lead {
  margin-top: calc(var(--winW) * 18);
  font-size: calc(var(--winW) * 15.38);
  letter-spacing: 0.1em;
  line-height: 1.8;
  text-align: center;
}

.movie_chara {
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: calc(var(--winW) * 138);
  margin: 0 0 calc(var(--winW) * -79) calc(var(--winW) * -69);
  z-index: -1;
  opacity: 0;
  transform: translateY(15%) scale(0.6);
  pointer-events: none;
}
@keyframes movieCharaPop {
  0% { opacity: 0; transform: translateY(15%) scale(0.6); }
  55% { opacity: 1; transform: translateY(-10%) scale(1.05); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
.movie_chara.is-pop {
  animation: movieCharaPop 0.4s ease-out forwards;
}
@keyframes movieCharaExit {
  0% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(70%) scale(0.85); }
}
.movie_chara.is-exit {
  animation: movieCharaExit 0.4s ease-in forwards;
}

.movie_chara--elgrand {
  width: calc(var(--winW) * 138);
  margin: 0 0 calc(var(--winW) * -79) calc(var(--winW) * -69);
}
.movie_chara--roox {
  width: calc(var(--winW) * 120);
  margin: 0 0 calc(var(--winW) * -39) calc(var(--winW) * -60);
}
.movie_chara--kicks {
  
  width: calc(var(--winW) * 85);
  margin: 0 0 calc(var(--winW) * -32) calc(var(--winW) * -43);
}
.movie_chara--serena {
  width: calc(var(--winW) * 120);
  margin: 0 0 calc(var(--winW) * -40) calc(var(--winW) * -57);
}
.movie_chara--note {
  
  width: calc(var(--winW) * 105);
  margin: 0 0 calc(var(--winW) * -60) calc(var(--winW) * -50);
}
.movie_slider {
  
  margin-top: calc(var(--winW) * 74);
  overflow: visible;
}

.movie_slider img {
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
}

.movie_slider.is-entrance-hidden {
  opacity: 0;
}
.movie_item {
  display: block;
  padding: calc(var(--winW) * 8);
  border-radius: calc(var(--winW) * 20);
  background: var(--c-teal);
  transform: rotate(0deg);
  transition: transform 0.3s ease;
  cursor: pointer;
}
.movie_slider .swiper-slide[data-color="orange"] .movie_item { background: var(--c-movie-orange); }
.movie_slider .swiper-slide[data-color="blue"] .movie_item { background: var(--c-movie-blue); }
.movie_slider .swiper-slide[data-color="pink"] .movie_item { background: var(--c-movie-pink); }
.movie_slider .swiper-slide[data-color="yellow"] .movie_item { background: var(--c-movie-yellow); }

.movie_slider .movie_inner {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  transition-property: transform;
  transition-timing-function: ease;
  transform-origin: center bottom;
}

.movie_thumb_frame {
  display: block;
  aspect-ratio: 1 / 1;
  padding: calc(var(--winW) * 5);
  border-radius: calc(var(--winW) * 13);
  background: #fff;
}
.movie_thumb_clip {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: calc(var(--winW) * 13);
}
.movie_thumb {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  transition: transform 0.3s ease;
}
.movie_thumb img {
  width: 100%;
  height: auto;
  max-height: 100%;
  object-fit: contain;
  border-radius: calc(var(--winW) * 13);
}
@media (hover: hover) {
  .movie_item:hover .movie_thumb {
    transform: scale(1.1);
  }

  .movie_item:hover .movie_play {
    transform: scale(0.9091);
  }
}
.movie_play {
  position: absolute;
  left: 50%;
  top: 80%;
  width: calc(var(--winW) * 42);
  height: calc(var(--winW) * 42);
  margin: calc(var(--winW) * -21) 0 0 calc(var(--winW) * -21);
  border-style: solid;
  border-color: #fff;
  border-width: calc(var(--winW) * 2);
  border-radius: 50%;
}
.movie_play::before {
  content: "";
  position: absolute;
  left: 54%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: calc(var(--winW) * 7) 0 calc(var(--winW) * 7) calc(var(--winW) * 12);
  border-color: transparent transparent transparent #fff;
}
.movie_cap {
  margin-top: calc(var(--winW) * 18);
  font-size: calc(var(--winW) * 16);
  letter-spacing: 0.04em;
  line-height: 1.8;
  text-align: center;
  
  opacity: 0;
  transition: opacity 0.4s ease;
}
.movie_cap.is-shown { opacity: 1; }

.movie_cap_name {
  display: inline-block;
  padding: calc(var(--winW) * 4) calc(var(--winW) * 16);
  margin-bottom: calc(var(--winW) * 4);
  border-radius: calc(var(--winW) * 20);
  background: var(--c-teal);
  color: #fff;
  font-size: calc(var(--winW) * 13);
  font-weight: bold;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
.movie_cap_name[data-color="orange"] { background: var(--c-movie-orange); }
.movie_cap_name[data-color="blue"] { background: var(--c-movie-blue); }
.movie_cap_name[data-color="pink"] { background: var(--c-movie-pink); }
.movie_cap_name[data-color="yellow"] { background: var(--c-movie-yellow); }
.movie_slider_pager {
  position: static !important;
  margin-top: calc(var(--winW) * 58.7);
}

.movie_drag_cursor {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: calc(var(--winW) * 120);
  height: calc(var(--winW) * 120);
  pointer-events: none;
  z-index: 9999;
  --x: 0px;
  --y: 0px;
  transform: translate(var(--x), var(--y)) translate(-50%, -50%);
  will-change: transform;
}
.movie_drag_cursor img { width: 100%; height: 100%; }

.prof_drag_cursor {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: calc(var(--winW) * 120);
  height: calc(var(--winW) * 120);
  pointer-events: none;
  z-index: 9999;
  --x: 0px;
  --y: 0px;
  transform: translate(var(--x), var(--y)) translate(-50%, -50%);
  will-change: transform;
}
.prof_drag_cursor img { width: 100%; height: 100%; }


.lineup {
  position: relative;
  padding: calc(var(--winW) * 52) 0 calc(var(--winW) * 0);
  background: linear-gradient(
    to bottom,
    var(--c-cream) 0%,
    var(--c-cream) 70%,
    #00D6CF 70%,
    #00D6CF 100%
  );
}
.lineup_ttl {
  position: relative;
  z-index: 3;
  width: calc(var(--winW) * 336);
  margin: 0 auto;
}
.lineup_ttl dotlottie-wc {
  display: block;
  width: 100%;
  aspect-ratio: 658.715 / 231.061;
}
.lineup_illust {
  position: absolute;
  z-index: 2;
  width: calc(var(--winW) * 376);
  left: 50%;
  bottom: calc(var(--winW) * 85);
  transform: translateX(-50%);
}

.lineup_lottie {
  position: absolute;
  z-index: 3;
  right: calc(var(--winW) * 99);
  bottom: calc(var(--winW) * -12);
  width: calc(var(--winW) * 183);
  height: calc(var(--winW) * 236.7);
}
.lineup_btn {
  position: relative;
  z-index: 3;
  margin-top: calc(var(--winW) * 220);
}


.shop {
  position: relative;
  height: calc(var(--winW) * 455);
  padding-top: calc(var(--winW) * 0);
  background: linear-gradient(
    to bottom,
    #00D6CF 0,
    #00D6CF 56.7%,
    #00D6CF 56.7%,
    #00D6CF 74%,
    #00D6CF 74%,
    #00D6CF  100%
  );
  
  overflow: visible;
}
.shop_visual {
  position: absolute;
  top: calc(var(--winW) * 0);
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
}

.shop_bg {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  width: 100%;
  margin-left: 0;
}
.shop_bg img { width: 100%; }
.shop_visual picture { display: block; }
.shop_visual picture img { width: 100%; }

@keyframes shopCloudDrift {
  0%   { transform: translateX(120vw); }
  100% { transform: translateX(-140vw); }
}
.shop_cloud {
  position: absolute;
  animation-name: shopCloudDrift;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  
  animation-play-state: paused;
}
.shop_cloud--l1 { left: calc(var(--winW) * -26); top: calc(var(--winW) * 152); width: calc(var(--winW) * 22); animation-duration: 26s;}
.shop_cloud--l2 { left: calc(var(--winW) * 8); top: calc(var(--winW) * 128); width: calc(var(--winW) * 56); animation-duration: 25s;}
.shop_cloud--r1 { left: calc(var(--winW) * 268); top: calc(var(--winW) * 118); width: calc(var(--winW) * 78); animation-duration: 30s;}
.shop_cloud--r2 { left: calc(var(--winW) * 348); top: calc(var(--winW) * 148); width: calc(var(--winW) * 28); animation-duration: 24s;}
.shop_aura { 
  position: absolute;
  left: calc(var(--winW) * 0);
  top: calc(var(--winW) * 238);
  width: calc(var(--winW) * 117);
}
.shop_roox {
  position: absolute;
  left: calc(var(--winW) * 284);
  top: calc(var(--winW) * 227);
  width: calc(var(--winW) * 80);
}
.shop_car {
  position: absolute;
  left: 50%;
  top: calc(var(--winW) * 174);
  width: calc(var(--winW) * 189.27);
  margin-left: calc(var(--winW) * -93);
}

.shop_ttl dotlottie-wc {
  display: block !important;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
}
.shop_ttl dotlottie-wc.is-sp {
  aspect-ratio: 658.771 / 238.219;
}
.shop_ttl dotlottie-wc.is-pc {
  aspect-ratio: 1061.77 / 168.687;
}
@media only screen and (max-width: 768px) {
  .shop_ttl dotlottie-wc.is-sp { position: static; visibility: visible; }
}
@media only screen and (min-width: 769px) {
  .shop_ttl dotlottie-wc.is-pc { position: static; visibility: visible; }
}
.shop_ttl {
  position: absolute;
  left: 50%;
  top: calc(var(--winW) * 20);
  z-index: 3;
  width: calc(var(--winW) * 315);
  margin-left: calc(var(--winW) * -157.5);
}
.shop_btn {
  position: absolute;
  left: 0;
  bottom: calc(var(--winW) * 45);
  z-index: 3;
  width: 100%;
}



.prof {
  position: relative;
  padding: calc(var(--winW) * 55) 0 calc(var(--winW) * 36.6);
  background-color: var(--c-grid);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath d='M0.5 0V20M0 0.5H20' stroke='rgba(0,214,207,0.13)'/%3E%3C/svg%3E");
  background-size: calc(var(--winW) * 14) calc(var(--winW) * 14);
}
.prof_head { position: relative; z-index: 2; }

.prof_ttl {
  width: calc(var(--winW) * 352);
  margin: calc(var(--winW) * -8.36) auto 0;
}

.prof_ttl dotlottie-wc {
  display: block;
  width: 100%;
  aspect-ratio: 718.702 / 237.366;
}
.prof_lead {
  margin-top: calc(var(--winW) * 16);
  font-size: calc(var(--winW) * 15.38);
  letter-spacing: 0.04em;
  line-height: 1.5;
  text-align: center;
}
.prof_lead--pc { display: none; }
.prof_tree {
  position: relative;
  z-index: 2;
  width: calc(var(--winW) * 328);
  margin: calc(var(--winW) * 20) auto 0;
}

.prof_tree dotlottie-wc {
  display: block;
  width: 100%;
  aspect-ratio: 1293.487 / 1391.858;
}
.prof_slider {
  position: relative;
  z-index: 2;
  margin-top: calc(var(--winW) * 25);
  overflow: visible;
}

.prof_slider .swiper-slide {
  width: calc(var(--winW) * 381);
  height: auto;
  background: #fff;
  border-radius: calc(var(--winW) * 40);
  
  padding: calc(var(--winW) * 8);
  opacity: 0;
  transform: translateY(150%) rotate(var(--pcard-rot, 0deg));
}
.prof_slider .swiper-slide.is-shown-instant {
  opacity: 1;
  transform: none;
}
.prof_slider .swiper-slide.is-entering {
  animation: pcardFlyIn 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes pcardFlyIn {
  0%   { opacity: 0; transform: translateY(150%) rotate(var(--pcard-rot, 0deg)); }
  8%   { opacity: 1; }
  70%  { opacity: 1; transform: translateY(-4%) rotate(calc(var(--pcard-rot, 0deg) * -0.15)); }
  100% { opacity: 1; transform: translateY(0) rotate(0deg); }
}
.pcard {
  position: relative;
  height: 100%;
  border-style: solid;
  border-color: var(--c-teal);
  border-width: calc(var(--winW) * 3);
  border-radius: calc(var(--winW) * 32);
  background: #fff;
  padding: 0 0 calc(var(--winW) * 24);
  overflow: hidden;
}
.pcard > * { position: relative; }
.pcard_thumb,
.pcard_name,
.pcard_txt,
.pcard_note,
.pcard_data { position: relative; z-index: 2; }
.pcard_thumb {
  width: calc(var(--winW) * 200);
  margin: calc(var(--winW) * 25) calc(var(--winW) * 46.32);
}
@media only screen and (min-width: 769px) {
  .pcard_thumb {
    width: calc(var(--winW) * 235);
    margin: calc(var(--winW) * 30.3) calc(var(--winW) * 56.12);
  }
}
.pcard_name {
  margin: calc(var(--winW) * 12) calc(var(--winW) * 13.5) 0;
  padding: calc(var(--winW) * 12) 0 0;
  border-top: 1px dashed var(--c-teal);
  font-family: "ShinGoPro-Bold", "ShinGoPro", sans-serif;
  font-weight: bold;
  font-size: calc(var(--winW) * 18);
  letter-spacing: 0.04em;
  line-height: 1.4;
  text-align: center;
  color: var(--c-teal);
}
.pcard_kind {
  display: block;
  margin-top: calc(var(--winW) * 4);
  font-size: calc(var(--winW) * 11);
  letter-spacing: 0.04em;
}
.pcard_ast { font-size: calc(var(--winW) * 8); }
.pcard_txt {
  margin: calc(var(--winW) * 12) calc(var(--winW) * 13.5) 0;
  padding: calc(var(--winW) * 12) calc(var(--winW) * 9) 0;
  border-top: 1px dashed var(--c-teal);
  font-size: calc(var(--winW) * 13);
  letter-spacing: 0.04em;
  line-height: 1.82;
}
.pcard_note {
  margin: calc(var(--winW) * 8) auto 0;
  padding: 0 calc(var(--winW) * 22.5);
  font-size: calc(var(--winW) * 10);
  letter-spacing: calc(var(--winW) * -0.1);
  line-height: 1.6;
}
.pcard_data {
  margin: calc(var(--winW) * 12) calc(var(--winW) * 16) 0;
  padding: calc(var(--winW) * 12) calc(var(--winW) * 9) 0;
  border-top: 1px dashed var(--c-teal);
  font-size: calc(var(--winW) * 13);
  letter-spacing: 0.04em;
  line-height: 1.8;
}
.pcard_data div { display: flex; }
.pcard_data dt::after { content: "："; }
.prof_slider_pager {
  position: static !important;
  margin-top: calc(var(--winW) * 33);
}


.goods {
  position: relative;
  padding: calc(var(--winW) * 69) 0 calc(var(--winW) * 55);
  background: var(--c-mint);
}
.goods_ttl {
  position: relative;
  z-index: 2;
  width: calc(var(--winW) * 345);
  margin: 0 auto;
}
.goods_ttl dotlottie-wc {
  display: block;
  width: 100%;
  aspect-ratio: 674.072 / 219.368;
}
.goods_row {
  margin: calc(var(--winW) * 28) 0 0;
  overflow: unset;
}

@keyframes goodsHop {
  0%   { transform: rotate(-10deg) translateY(0) translateZ(0); }
  50%  { transform: rotate(-10deg) translateY(calc(var(--winW) * -50)) translateZ(0); }
  100% { transform: rotate(-10deg) translateY(0) translateZ(0); }
}

.goods_row .phone.is-hopping {
  animation: goodsHop 500ms ease-in-out;
}
.phone {
  flex: 0 0 auto;
  width: calc(var(--winW) * 128);
  padding: calc(var(--winW) * 0);
  border-radius: calc(var(--winW) * 14);
  background: #fff;
  box-shadow: 0 calc(var(--winW) * 2) calc(var(--winW) * 6) rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

.goods_row .phone {
  
  transform: rotate(-10deg) translateZ(0);
  -webkit-transform: rotate(-10deg) translateZ(0);
  will-change: transform;
}

.phone:not(:first-child) {
  margin-left: calc(var(--winW) * 32);
}
.phone img {
  border-radius: calc(var(--winW) * 10);
}
.goods_chara {
  position: absolute;
  z-index: 2;
  margin-left: calc(var(--winW) * 93);
  bottom: calc(var(--winW) * 152);
  width: calc(var(--winW) * 166);
}
.goods_btn {
  position: relative;
  z-index: 3;
  margin-top: calc(var(--winW) * 229);
}


.info {
  position: relative;
  padding: calc(var(--winW) * 62) 0 calc(var(--winW) * 70);
  background: #fff;
}

.info_ttl {
  width: calc(var(--winW) * 348);
  margin: calc(var(--winW) * -84.55) auto 0;
}

.info_ttl dotlottie-wc {
  display: block;
  width: 100%;
  aspect-ratio: 705.356 / 512;
}

.info_list {
  width: calc(var(--winW) * 290);
  margin: calc(var(--winW) * -63.59) auto 0;
}
.info_list li + li { margin-top: calc(var(--winW) * 26); }
.info_list picture {
  display: block;
  overflow: hidden;
  border-radius: calc(var(--winW) * 14);
}
.info_list img {
  border-radius: calc(var(--winW) * 14);
  transition: transform 0.3s ease;
}
.info_list li:hover img {
  transform: scale(1.1);
}
.info_cap {
  display: block;
  text-align: center;
  margin-top: calc(var(--winW) * 12);
  font-size: calc(var(--winW) * 14);
  letter-spacing: 0.08em;
  line-height: 1.6;
  color: #000;
}


.pagetop {
  padding: calc(var(--winW) * 75) 0 calc(var(--winW) * 0);
  background: #fff;
  text-align: center;
}
.pagetop a {
  display: block;
  position: absolute;
  width: calc(var(--winW) * 128);
  bottom: calc(var(--winW) * -20);
  --pagetop-rest-bottom: calc(var(--winW) * -20);
  left: calc(var(--winW) * 133);
  opacity: 0;
  transform: translateY(60%);
}

.pagetop a.is-pop {
  opacity: 1;
  transform: translateY(0);
  animation:
    pagetopPop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards,
    pagetopIdle 1s linear forwards;
}
@keyframes pagetopPop {
  0% { opacity: 0; transform: translateY(60%); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes pagetopIdle {
  to { bottom: var(--pagetop-rest-bottom); }
}

@keyframes pagetopHoverBounce {
  0%   { bottom: var(--pagetop-rest-bottom); }
  10%  { bottom: calc(var(--pagetop-rest-bottom) * 0.35); }
  20%  { bottom: var(--pagetop-rest-bottom); }
  100% { bottom: var(--pagetop-rest-bottom); }
}
.pagetop a.is-pop:hover {
  animation:
    pagetopPop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards,
    pagetopHoverBounce 2.5s ease-out infinite;
}


.wmodal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.wmodal.is-open { visibility: visible; opacity: 1; }
.wmodal_overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}
.wmodal_box {
  position: relative;
  width: calc(var(--winW) * 335);
  max-height: 80vh;
  border-radius: calc(var(--winW) * 28);
  background: #fff;
  padding: calc(var(--winW) * 10);
  margin-top: calc(var(--winW) * 0);
}
.wmodal_inner {
  height: 100%;
  max-height: calc(80vh - var(--winW) * 20);
  border-style: solid;
  border-color: var(--c-teal);
  border-width: calc(var(--winW) * 3);
  border-radius: calc(var(--winW) * 28);
  padding: calc(var(--winW) * 20) calc(var(--winW) * 13) calc(var(--winW) * 0);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.wmodal_close {
  position: absolute;
  right: calc(var(--winW) * -12);
  top: calc(var(--winW) * -18);
  width: calc(var(--winW) * 46);
  height: calc(var(--winW) * 46);
  border: none;
  border-radius: 50%;
  background: var(--c-teal);
  cursor: pointer;
  appearance: none;
}
.wmodal_close::before,
.wmodal_close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(var(--winW) * 2);
  height: calc(var(--winW) * 17);
  margin: calc(var(--winW) * -8.5) 0 0 calc(var(--winW) * -1);
  background: #fff;
}
.wmodal_close::before { transform: rotate(45deg); }
.wmodal_close::after { transform: rotate(-45deg); }
.wmodal_ttl { text-align: center; }
.wmodal_ttl_sub {
  display: block;
  font-family: "ShinGoPro-Bold", "ShinGoPro", sans-serif;
  font-weight: bold;
  font-size: calc(var(--winW) * 14);
  letter-spacing: 0.05em;
  line-height: 1.8;
  color: var(--c-teal);
}
.wmodal_ttl img {
  width: calc(var(--winW) * 181);
  margin: calc(var(--winW) * 6) auto 0;
}
.wmodal_list {
  margin-top: calc(var(--winW) * 14);
  border-top: 1px solid var(--c-teal);
}
.wmodal_list li {
  display: flex;
  align-items: center;
  gap: calc(var(--winW) * 26);
  padding: calc(var(--winW) * 16) calc(var(--winW) * 10);
  border-bottom: 1px solid var(--c-teal);
}

.wmodal_preview {
  position: relative;
  flex: 0 0 auto;
  display: block;
}
.wmodal_pc { position: relative; }
.wmodal_phone {
  position: relative;
  display: block;
  width: calc(var(--winW) * 67);
  border-radius: calc(var(--winW) * 10);
}
.wmodal_phone img { border-radius: 0 0 calc(var(--winW) * 9) calc(var(--winW) * 9); }
.wmodal_dl {
  flex: 1 1 auto;
  display: block;
}
.wmodal_dl a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: calc(var(--winW) * 162);
  height: calc(var(--winW) * 40);
  border-radius: calc(var(--winW) * 100);
  background: #d8f2f1;
  color: var(--c-txt);
  text-align: center;
}
.wmodal_dl a + a { margin-top: calc(var(--winW) * 11); }
.wmodal_dl b {
  font-family: "Nissan Brand", "ShinGoPro-Bold", sans-serif;
  font-weight: bold;
  font-size: calc(var(--winW) * 14);
  letter-spacing: 0.05em;
  line-height: 1.4;
}
.wmodal_dl small {
  font-family: "Nissan Brand", "ShinGoPro", sans-serif;
  font-size: calc(var(--winW) * 10);
  letter-spacing: 0.06em;
  line-height: 1.4;
}


button.swiper-pagination-bullet {
  padding: 0;
  appearance: none;
  cursor: pointer;
}
.swiper-pagination-bullet {
  width: calc(var(--winW) * 15.38);
  height: calc(var(--winW) * 15.38);
  margin: 0 calc(var(--winW) * 10) !important;
  background: transparent;
  border-style: solid !important;
  border-color: var(--c-teal) !important;
  border-width: calc(var(--winW) * 2) !important;
  opacity: 1;
}
.swiper-pagination-bullet-active { background: var(--c-teal); }

body.is-fixed {
  position: fixed;
  width: 100%;
  overflow: hidden;
}


#gn_footer { position: relative; z-index: 5; }


@media only screen and (min-width: 769px) {

  
  .hd_logo {
    margin: calc(var(--winW) * 32) 0 0 calc(var(--winW) * 39);
    width: calc(var(--winW) * 92);
  }
  .hd_logo_pc { display: block; width: 100%; }
  .hd_logo_sp { display: none; }
  .menu_btn {
    top: 0;
    right: calc(var(--winW) * 26);
    width: calc(var(--winW) * 110);
    height: calc(var(--winW) * 101);
  }
  .menu_btn_chara {
    width: calc(var(--winW) * 72);
    bottom: calc(var(--winW) * -3);
   }

  
  .gnav_panel {
    right: calc(var(--winW) * -26);
    width: calc(var(--winW) * 614);
    border-radius: calc(var(--winW) * 40) 0 0 calc(var(--winW) * 40);
    padding-right: calc(var(--winW) * 26);
    padding-bottom: calc(var(--winW) * 0);
  }
  .gnav_panel .menu_btn { right: calc(var(--winW) * 48); }
  .gnav_logo { width: calc(var(--winW) * 297); margin-top: calc(var(--winW) * 107); }
  .gnav_label { margin-top: calc(var(--winW) * 12); font-size: calc(var(--winW) * 14); }
  .gnav_list { width: calc(var(--winW) * 283); margin-top: calc(var(--winW) * 21); } 
  .gnav_list a {
    padding: calc(var(--winW) * 18) 0;
    font-size: calc(var(--winW) * 16);
    font-weight: bold;
  }
  .gnav_chara {
    width: calc(var(--winW) * 170);
    margin: calc(var(--winW) * 60) 0 0 calc(var(--winW) * 230);
  }

  
  .float_reserve {
    top: 50%;
    bottom: unset;
    width: calc(var(--winW) * 125);
    right: calc(var(--winW) * -150);
  }
  @keyframes floatReserveIn {
    0%   { right: calc(var(--winW) * -150); }
    70%  { right: calc(var(--winW) * -30); }
    100% { right: calc(var(--winW) * -55); }
  }
  .float_reserve:hover .btn_reserve_chara {
    animation: btnReserveCharaHop 2s ease-in-out infinite;
  }

  
  .btn {
    width: calc(var(--winW) * 388);
    height: calc(var(--winW) * 89);
    border-radius: calc(var(--winW) * 100);
    font-size: calc(var(--winW) * 20);
    font-weight: bold;
  }
  .btn--yellow { box-shadow: 0 calc(var(--winW) * 9) 0 0 var(--c-yellow-d); }
  .btn--white {
    box-shadow: 0 calc(var(--winW) * 8) 0 0 #e5e5e5;
    color: #00D6CF;
  }
  .btn--yellow:hover,
  .btn--yellow:active { transform: translateY(calc(var(--winW) * 9)); }
  .btn--white:hover,
  .btn--white:active { transform: translateY(calc(var(--winW) * 8)); }
  .btn_arrow {
    right: calc(var(--winW) * 36);
    width: calc(var(--winW) * 14);
    height: calc(var(--winW) * 14);
    margin-top: calc(var(--winW) * -8);
    border-width: calc(var(--winW) * 4) calc(var(--winW) * 4) 0 0;
    --arrow-travel: calc(var(--winW) * 7);
  }
  .badge {
    padding: calc(var(--winW) * 10.5) calc(var(--winW) * 41);
    font-size: calc(var(--winW) * 20);
  }
  .lead_flag {
    top: calc(var(--winW) * -170);
  }
  .lineup_flag {
    top: calc(var(--winW) * 0);
  }
  .prof_flag {
    top: calc(var(--winW) * 0);
  }
  .goods_flag {
    top: calc(var(--winW) * 0);
  }
  .info_flag {
    top: calc(var(--winW) * -106);
  }
  .lead_flag_l, .lead_flag_r {
    width: calc(var(--winW) * 379);
  }
  .check_flag_l, .check_flag_r {
    width: calc(var(--winW) * 379);
  }
  .lineup_flag_l, .lineup_flag_r {
    width: calc(var(--winW) * 379);
  }
  .prof_flag_l, .prof_flag_r {
    width: calc(var(--winW) * 379);
  }
  .goods_flag_l, .goods_flag_r {
    width: calc(var(--winW) * 379);
  }
  .info_flag_l, .info_flag_r {
    width: calc(var(--winW) * 320);
  }
  .lead_flag_l, .check_flag_l, .lineup_flag_l, .prof_flag_l, .goods_flag_l, .info_flag_l {
    left: calc(var(--winW) * 0);
  }
  .lead_flag_r, .check_flag_r, .lineup_flag_r, .prof_flag_r, .goods_flag_r, .info_flag_r {
    right: calc(var(--winW) * 0);
  }
  .check_flag_r {
    top: calc(var(--winW) * 4);
  }
  
  .prof_flag { top: calc(var(--winW) * 0); }

  
  .kv { height: calc(var(--winW) * 830); }
  .kv_ttl {
    top: calc(var(--winW) * 235);
    width: calc(var(--winW) * 1064);
  }
  .sound_btn {
    left: calc(var(--winW) * 36);
    bottom: calc(var(--winW) * 55);
    width: calc(var(--winW) * 90);
    height: calc(var(--winW) * 90);
  }
  .sound_btn.is-fixed {
    bottom: calc(var(--winW) * 35);
  }
  .sound_btn_ico_kv { width: calc(var(--winW) * 77); height: calc(var(--winW) * 77); }
  .sound_btn.is-fixed .sound_btn_ico_kv { width: calc(var(--winW) * 77); height: calc(var(--winW) * 77); }
  .sound_btn_txt { font-size: calc(var(--winW) * 10); }
  .kv_btn {
    bottom: calc(var(--winW) * 31);
    width: calc(var(--winW) * 166);
  }

  
  .lead { padding: calc(var(--winW) * 116) 0 calc(var(--winW) * 68); }
  .lead_txt { font-size: calc(var(--winW) * 24); letter-spacing: 0.05em; }
  .lead_txt--2 { margin-top: calc(var(--winW) * 34); letter-spacing: 0.1em; }

  
  .cp { padding: 0 0 calc(var(--winW) * 280); }
  .cp_bg {
    top: calc(var(--winW) * 225);
    z-index: 2;
  }
  .cp_arch {
    top: calc(var(--winW) * -55);
    width: calc(var(--winW) * 2415);
    height: calc(var(--winW) * 500);
    overflow: hidden;
    margin-left: calc(var(--winW) * -977);
  }
  .cp_arch_txt {
    width: calc(var(--winW) * 2936);
    left: calc(var(--winW) * -500);
    top: calc(var(--winW) * 140);
  }
  .cp_arch_run_oya {
      left: calc(var(--winW) * 775);
      top: calc(var(--winW) * 26);
      width: calc(var(--winW) * 300);
      height: calc(var(--winW) * 335.525);
      margin-left: 0;
  }
  .cp_arch_run_ko {
      left: calc(var(--winW) * 1000);
      top: calc(var(--winW) * 206);
      width: calc(var(--winW) * 130);
      height: calc(var(--winW) * 184.675);
      margin-left: 0;
  }
  .cp_inner {
    width: calc(var(--winW) * 1280);
    padding-top: calc(var(--winW) * 530);
  }
  
  .cp_card_a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--winW) * 1280);
  }
  .cp_card_a + .cp_card_a {
    margin-top: calc(var(--winW) * 125.2);
  }
  .cp_card_a--1 { height: calc(var(--winW) * 572.22); }
  .cp_card_a--2 { height: calc(var(--winW) * 686.19); }
  .cp_card {
    --winW: min(calc(100vw / 1600), 1px);
    width: calc(var(--winW) * 1280);
    margin-top: 0;
  }
  .cp_badge {
    left: calc(var(--winW) * -60);
    top: calc(var(--winW) * -89);
    width: calc(var(--winW) * 220);
  }
  .cp_pop {
    left: calc(var(--winW) * 561);
    width: calc(var(--winW) * 158);
    margin-left: 0;
  }
  
  @keyframes cpPopEnter {
    0%      { top: 0;                          z-index: 0; }
    70%     { top: calc(var(--winW) * -104);   z-index: 0; }
    70.001% { z-index: 3; }
    100%    { top: calc(var(--winW) * -89);    z-index: 3; }
  }
  @keyframes cpPopEnterPink {
    0%      { top: 0;                         z-index: 0; }
    70%     { top: calc(var(--winW) * -88);   z-index: 0; }
    70.001% { z-index: 3; }
    100%    { top: calc(var(--winW) * -79);   z-index: 3; }
  }
  .cp_card_in {
    padding: calc(var(--winW) * 78) calc(var(--winW) * 48) calc(var(--winW) * 18) calc(var(--winW) * 64);
    border-radius: calc(var(--winW) * 40);
    background-size: calc(var(--winW) * 25) calc(var(--winW) * 25);
    background-position: 0 0, calc(var(--winW) * 11) calc(var(--winW) * 11);
    border: calc(var(--winW) * 10) solid #fff;
  }
  .cp_card_in.second {
    padding: calc(var(--winW) * 20) calc(var(--winW) * 54) calc(var(--winW) * 22);
  }
  .cp_card_flag {
    right: calc(var(--winW) * 0);
    top: calc(var(--winW) * 0);
    width: calc(var(--winW) * 130);
  }
  .cp_card_gentei {
    right: calc(var(--winW) * 35);
    bottom: calc(var(--winW) * 105);
    width: calc(var(--winW) * 216);
    transform: rotate(1.31deg);
  }
  .cp_card_genteichara {
    right: calc(var(--winW) * 0);
    bottom: calc(var(--winW) * 0);
    width: calc(var(--winW) * 196);
  }
  .cp_card_body {
    display: flex;
    align-items: center;
    gap: calc(var(--winW) * 60);
  }
  .cp_card_fig,
  .charm_slider {
    flex: 0 0 auto;
    width: calc(var(--winW) * 521);
    margin-top: 0;
  }
  .cp_card--charm .charm_slider {
     width: calc(var(--winW) * 532);
    }
  .cp_card_txt {
   flex: 1 1 auto;
   margin-top: calc(var(--winW) * 35);
  }
  .cp_card_in.second .cp_card_txt {
    margin-top: calc(var(--winW) * 0);
  }
  .cp_card_ttl {
    width: calc(var(--winW) * 531);
    margin: 0;
  }
  .cp_card_ttl--charm { width: calc(var(--winW) * 552); margin: 0 auto; }
  .cp_card_lead {
    margin-top: calc(var(--winW) * 28);
    font-size: calc(var(--winW) * 20);
    letter-spacing: 0.07em;
    line-height: 2;
  }
  .cp_card_lead--charm {
    margin-top: calc(var(--winW) * 24);
    width: calc(var(--winW) * 530);
    text-align: left;
    letter-spacing: 0.04em;
  }
  .cp_card_imgnote { font-size: calc(var(--winW) * 13); }
  .cp_card_note {
    width: calc(var(--winW) * 1000);
    margin-top: calc(var(--winW) * 70);
    font-size: calc(var(--winW) * 13);
    letter-spacing: 0.1em;
  }
  .cp_card_in.second .cp_card_note {
    margin-top: calc(var(--winW) * 28);
    font-size: calc(var(--winW) * 13);
    letter-spacing: 0.05em;
  }
  .cp_card_tag { font-size: calc(var(--winW) * 11); }
  .charm_slider_pager { margin-top: calc(var(--winW) * 0); }

  
  .check { padding: calc(var(--winW) * 75) 0 calc(var(--winW) * 200); }
  .check_cloud_r {
    width: calc(var(--winW) * 430);
    top: calc(var(--winW) * 300);
    right: calc(var(--winW) * -250);
  }
  .check_cloud_l {
    width: calc(var(--winW) * 330);
    top: calc(var(--winW) * 175);
    left: calc(var(--winW) * -36);
  }
  .check_cloud_l
  .check_flag { top: calc(var(--winW) * -202); }
  .check_ttl { width: calc(var(--winW) * 763); }
  .check_scroll { margin-top: calc(var(--winW) * 50); }
  .check_stack {
    width: calc(var(--winW) * 1280);
  }
  .ccard--kiite {
    --rotate: 5.08deg;
    transform: translate(calc(var(--winW) * 0), calc(var(--winW) * -55 + var(--exit-y))) rotate(var(--rotate));
  }
  .ccard--notte {
    --rotate: -3.89deg;
    --shift-x: -28;
    transform: translate(calc(var(--winW) * var(--shift-x)), calc(var(--winW) * 10 + var(--exit-y))) rotate(var(--rotate));
    background: radial-gradient(circle at 40% 40%, #f27b03 0%, #f9982a 60%, #ffb442 100%);
  }
  .ccard {
    height: calc(var(--winW) * 680);
    padding: calc(var(--winW) * 64) calc(var(--winW) * 60);
    display: block;
    border-width: calc(var(--winW) * 21);
    border-radius: calc(var(--winW) * 50);
    text-align: left;
  }
  .ccard_num {
    width: calc(var(--winW) * 70);
    height: calc(var(--winW) * 67);
    margin: 0 0 0 calc(var(--winW) * 220);
    font-size: calc(var(--winW) * 27);
  }
  .ccard_ttl { margin-top: calc(var(--winW) * 27); }
  .ccard_ttl_top { width: calc(var(--winW) * 148); margin: 0 0 0 calc(var(--winW) * 170); }
  .ccard--kiite .ccard_ttl_top,
  .ccard--notte .ccard_ttl_top { width: calc(var(--winW) * 220); margin-left: calc(var(--winW) * 140); }
  .ccard_ttl_btm { width: calc(var(--winW) * 389); margin: calc(var(--winW) * 6) 0 0 calc(var(--winW) * 60); }
  .ccard_sub {
    padding: 0;
    position: absolute;
    top: calc(var(--winW) * 333);
    left: calc(var(--winW) * 75);
    margin-top: calc(var(--winW) * 0);
    width: calc(var(--winW) * 492);
    font-size: calc(var(--winW) * 28);
    text-align: center;
  }
  .ccard_txt {
    padding: 0;
    position: absolute;
    left: calc(var(--winW) * 55);
    top: calc(var(--winW) * 418);
    width: calc(var(--winW) * 538);
    margin: 0;
    font-size: calc(var(--winW) * 18);
    letter-spacing: 0.08em;
    text-align: center;
  }
  .ccard_visual {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
  }
  .ccard_illust {
    position: absolute;
    left: calc(var(--winW) * 594);
    bottom: auto;
    margin-left: 0;
    top: calc(var(--winW) * 184);
    width: calc(var(--winW) * 404);
    margin: 0;
  }
  .ccard_illust--kiite {
    left: calc(var(--winW) * 631);
    top: calc(var(--winW) * 35);
    bottom: auto;
    width: calc(var(--winW) * 515);
    margin-left: 0;
    transform: unset;
  }
  .ccard_illust--notte {
    left: calc(var(--winW) * 620);
    top: 54%;
    transform: translateY(-50%);
    bottom: auto;
    width: calc(var(--winW) * 536);
    margin-left: 0;
  }
  .ccard_car {
    left: calc(var(--winW) * 1000);
    right: auto;
    top: calc(var(--winW) * 92);
    bottom: auto;
    width: calc(var(--winW) * 237);
    height: calc(var(--winW) * 442);
  }
  .ccard_car img { margin-top: 0; }

  
  .movie { padding: calc(var(--winW) * 170) 0 calc(var(--winW) * 120); }
  .movie_ttl { width: calc(var(--winW) * 727); }
  .movie_lead { margin-top: calc(var(--winW) * 34); font-size: calc(var(--winW) * 20); }
  .movie_chara {
    width: calc(var(--winW) * 273);
    margin: 0 0 calc(var(--winW) * -156) calc(var(--winW) * -136.5);
  }
  .movie_chara--elgrand {
    width: calc(var(--winW) * 272);
    margin: 0 0 calc(var(--winW) * -156) calc(var(--winW) * -136.5);
  }
  .movie_chara--roox {
    width: calc(var(--winW) * 245);
    margin: 0 0 calc(var(--winW) * -80) calc(var(--winW) * -136.5);
  }
  .movie_chara--kicks {
    width: calc(var(--winW) * 151);
    margin: 0 0 calc(var(--winW) * -60) calc(var(--winW) * -80.5);
  }
  .movie_chara--serena {
    width: calc(var(--winW) * 245);
    margin: 0 0 calc(var(--winW) * -85) calc(var(--winW) * -136.5);
  }
  .movie_chara--note {
    width: calc(var(--winW) * 214);
    margin: 0 0 calc(var(--winW) * -130) calc(var(--winW) * -110);
  }
  
  .movie_slider { margin-top: calc(var(--winW) * 160); }
  
  .movie_slider .swiper-slide { width: calc(var(--winW) * 504); }
  .movie_item {
    padding: calc(var(--winW) * 12);
    border-radius: calc(var(--winW) * 30);
  }
  .movie_thumb_frame {
    padding: calc(var(--winW) * 10);
  }
  .movie_thumb_clip {
    border-radius: calc(var(--winW) * 20);
  }
  .movie_thumb img {
      border-radius: calc(var(--winW) * 20);
  }
  .movie_play {
    width: calc(var(--winW) * 85);
    height: calc(var(--winW) * 85);
    margin: calc(var(--winW) * -42.5) 0 0 calc(var(--winW) * -42.5);
    border-width: calc(var(--winW) * 3);
  }
  .movie_play::before {
    border-width: calc(var(--winW) * 14) 0 calc(var(--winW) * 14) calc(var(--winW) * 24);
  }
  .movie_cap { margin-top: calc(var(--winW) * 26); font-size: calc(var(--winW) * 20); }
  .movie_cap_name {
    padding: calc(var(--winW) * 5) calc(var(--winW) * 18);
    margin-bottom: calc(var(--winW) * 6);
    border-radius: calc(var(--winW) * 22);
    font-size: calc(var(--winW) * 18);
  }
  .movie_slider_pager { margin-top: calc(var(--winW) * 44); }
  
  .movie_slider .swiper-wrapper, .movie_slider .swiper-wrapper *,
  .movie_slider .movie_cap, .movie_slider .movie_cap * { cursor: none; }
  .movie_drag_cursor.is-active { display: block; }

  
  .lineup {
    padding: calc(var(--winW) * 112) 0 calc(var(--winW) * 80);
    margin-bottom: -1px;
    background: linear-gradient(
      to bottom,
      var(--c-cream) 0%,
      var(--c-cream) 67.4%,
      #00DAD0 67.4%,
      #00DAD0 100%
    );
  }
  .lineup_ttl { width: calc(var(--winW) * 654); }
  .lineup_illust {
    width: calc(var(--winW) * 1404);
    margin: 0 auto;
    bottom: calc(var(--winW) * 211);
  }
  .lineup_lottie {
    width: calc(var(--winW) * 297);
    height: calc(var(--winW) * 350.3);
    right: calc(var(--winW) * 548);
    bottom: calc(var(--winW) * -3);
  }
  .lineup_btn { margin-top: calc(var(--winW) * 400); }

  
  .shop {
    height: calc(var(--winW) * 916);
    padding-top: 0;
    background: linear-gradient(
      to bottom,
      #00dad0 0,
      #00dad0 42.8%,
      #21b8bb 42.8%,
      #21b8bb 62%,
      #26b7bc 62%,
      #26b7bc 100%
    );
  }
  .shop_visual {
    top: 0;
  }
  .shop_bg {
    top: 0;
    width: 100%;
    margin-left: 0;
  }
  
  .shop_cloud--l1 { left: calc(var(--winW) * 0); top: calc(var(--winW) * 10); width: calc(var(--winW) * 100); animation-duration: 104s; }
  .shop_cloud--l2 { left: calc(var(--winW) * 131); top: calc(var(--winW) * 131); width: calc(var(--winW) * 236); animation-duration: 100s; }
  .shop_cloud--r1 { left: calc(var(--winW) * 1096); top: calc(var(--winW) * -39); width: calc(var(--winW) * 326); animation-duration: 120s; }
  .shop_cloud--r2 { left: calc(var(--winW) * 1469); top: calc(var(--winW) * 77); width: calc(var(--winW) * 130); animation-duration: 96s; }
  .shop_aura { left: calc(var(--winW) * 164); top: calc(var(--winW) * 452); width: calc(var(--winW) * 383); }
  .shop_roox { left: calc(var(--winW) * 1101); top: calc(var(--winW) * 426); width: calc(var(--winW) * 273); }
  .shop_car {
    top: calc(var(--winW) * 350);
    width: calc(var(--winW) * 407);
    margin-left: calc(var(--winW) * -204);
  }
  .shop_ttl {
    top: calc(var(--winW) * 110);
    width: calc(var(--winW) * 1044);
    margin-left: calc(var(--winW) * -522);
  }
  .shop_btn { bottom: calc(var(--winW) * 109); }

  
  .prof {
    padding: calc(var(--winW) * 127) 0 calc(var(--winW) * 80);
    background-size: calc(var(--winW) * 14) calc(var(--winW) * 14);
  }
  .prof_head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: calc(var(--winW) * 1400);
    margin: 0 auto;
  }
  .prof_head .badge {
    margin: calc(var(--winW) * 110) 0 0 calc(var(--winW) * 210);
  }
  .prof_ttl { width: calc(var(--winW) * 701); margin: calc(var(--winW) * -31.46) 0 0 calc(var(--winW) * -30); }
  .prof_lead--sp { display: none; }
  .prof_lead--pc {
    display: block;
    width: calc(var(--winW) * 650);
    margin-top: calc(var(--winW) * 30);
    font-size: calc(var(--winW) * 20);
    line-height: 2;
    letter-spacing: 0.1em;
  }
  .prof_tree {
    position: absolute;
    right: calc(var(--winW) * 108);
    top: calc(var(--winW) * 128);
    width: calc(var(--winW) * 623);
    margin: 0;
  }
  .prof_slider { margin-top: calc(var(--winW) * 160); }
  .pcard { border-radius: calc(var(--winW) * 32); padding-bottom: calc(var(--winW) * 24); }
  .pcard_name { font-size: calc(var(--winW) * 24); }
  .pcard_kind { font-size: calc(var(--winW) * 14.5); }
  .pcard_ast { font-size: calc(var(--winW) * 9.4); }
  .pcard_txt { font-size: calc(var(--winW) * 16); line-height: 1.82; }
  .pcard_note { font-size: calc(var(--winW) * 10); }
  .pcard_data { font-size: calc(var(--winW) * 16); }
  .prof_slider_pager { margin-top: calc(var(--winW) * 48); }
  
  .prof_slider, .prof_slider * { cursor: none; }
  .prof_drag_cursor.is-active { display: block; }

  
  .goods { padding: calc(var(--winW) * 77) 0 calc(var(--winW) * 74); }
  .goods_ttl { width: calc(var(--winW) * 664); }
  .goods_row {
    margin: calc(var(--winW) * 50) 0 0;
  }
  .phone {
    width: calc(var(--winW) * 226);
    padding: calc(var(--winW) * 0);
    border-radius: calc(var(--winW) * 30);
  }
  
  .phone:not(:first-child) {
    margin-left: calc(var(--winW) * 55);
  }
  .phone img { border-radius: calc(var(--winW) * 22); }
  .goods_chara {
    width: calc(var(--winW) * 858);
    margin: 0;
    left: calc(var(--winW) * 316);
    bottom: calc(var(--winW) * 0);
  }
  .goods_btn { margin-top: calc(var(--winW) * 50); }

  
  .info { padding: calc(var(--winW) * 121) 0 calc(var(--winW) * 220); }
  .info_ttl { width: calc(var(--winW) * 614); margin-top: calc(var(--winW) * -160.20); }
  .info_list {
    display: flex;
    justify-content: center;
    gap: calc(var(--winW) * 42);
    width: calc(var(--winW) * 840);
    
    margin-top: calc(var(--winW) * -98.06);
  }
  .info_list li { width: calc(var(--winW) * 399); }
  .info_list li + li { margin-top: 0; }
  .info_list picture { border-radius: calc(var(--winW) * 20); }
  .info_list img { border-radius: calc(var(--winW) * 20); }
  .info_cap { margin-top: calc(var(--winW) * 22); font-size: calc(var(--winW) * 18); }

  
  .pagetop { padding: calc(var(--winW) * 0) 0 calc(var(--winW) * 0); }
  .pagetop a {
    width: calc(var(--winW) * 157);
    bottom: calc(var(--winW) * -25);
    --pagetop-rest-bottom: calc(var(--winW) * -25);
    left: calc(var(--winW) * 732.5);
  }

  
  
  .wmodal_box {
    width: calc(var(--winW) * 1180);
    height: calc(var(--winW) * 804);
    margin-top: 0;
  }
  .wmodal_inner {
    border-radius: calc(var(--winW) * 28);
    padding: calc(var(--winW) * 20) calc(var(--winW) * 40) calc(var(--winW) * 34);
    border-width: calc(var(--winW) * 5);
  }
  .wmodal_close {
    right: calc(var(--winW) * -20);
    top: calc(var(--winW) * -20);
    width: calc(var(--winW) * 56);
    height: calc(var(--winW) * 56);
  }
  .wmodal_ttl_sub { font-size: calc(var(--winW) * 19.5); }
  .wmodal_ttl img { width: calc(var(--winW) * 360.5); }
  .wmodal_list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: calc(var(--winW) * 27.15);
    border-top: 2px solid var(--c-teal);
  }
  .wmodal_list li {
    position: relative;
    flex-direction: column;
    gap: calc(var(--winW) * 18);
    padding: calc(var(--winW) * 28) calc(var(--winW) * 20);
    border-bottom: none;
  }
  
  .wmodal_list li::before,
  .wmodal_list li::after {
    content: "";
    position: absolute;
    background: var(--c-teal);
  }
  .wmodal_list li::before {
    left: calc(var(--winW) * -7);
    right: calc(var(--winW) * 6);
    bottom: 0;
    height: 2px;
  }
  .wmodal_list li::after {
    top: calc(var(--winW) * 10);
    bottom: calc(var(--winW) * 10);
    right: 0;
    width: 2px;
  }
  .wmodal_list li:nth-child(3n)::after { content: none; }
  .wmodal_list li:nth-child(n+4)::before { content: none; }
  
  .wmodal_list li:nth-child(n+4)::after { bottom: calc(var(--winW) * 30); }
  
  .wmodal_preview {
    width: calc(var(--winW) * 190);
    margin: 0 auto;
  }
  .wmodal_pc {
    position: unset;
    width: 100%;
  }
  .wmodal_pc_screen {
    display: block;
    border: calc(var(--winW) * 6) solid #e7e7ea;
    border-bottom: none;
    border-radius: calc(var(--winW) * 8) calc(var(--winW) * 8) 0 0;
    overflow: hidden;
    background: #06d5cf;
    line-height: 0;
  }
  .wmodal_pc_screen img { width: 100%; }
  .wmodal_pc_base {
    display: block;
    height: calc(var(--winW) * 8);
    margin: 0 calc(var(--winW) * -8);
    background: #e7e7ea;
    border-radius: 0 0 calc(var(--winW) * 4) calc(var(--winW) * 4);
    position: relative;
  }
  .wmodal_pc_base::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: calc(var(--winW) * 22);
    height: calc(var(--winW) * 3);
    margin-left: calc(var(--winW) * -11);
    background: #cfcfd2;
    border-radius: 0 0 calc(var(--winW) * 3) calc(var(--winW) * 3);
  }
  .wmodal_phone {
    display: none;
    position: absolute;
    left: 0;
    bottom: 0;
    width: calc(var(--winW) * 62);
    border-radius: calc(var(--winW) * 13);
  }
  .wmodal_dl { width: 100%; }
  .wmodal_dl a {
    width: calc(var(--winW) * 197);
    height: calc(var(--winW) * 48.7);
    margin: 0 auto;
  }
  .wmodal_dl a + a { margin-top: calc(var(--winW) * 14); }
  .wmodal_dl b { font-size: calc(var(--winW) * 17); }
  .wmodal_dl small { font-size: calc(var(--winW) * 13); }

  
  .swiper-pagination-bullet {
    width: calc(var(--winW) * 19.2);
    height: calc(var(--winW) * 19.2);
    margin: 0 calc(var(--winW) * 12) !important;
    border-width: calc(var(--winW) * 2.5) !important;
  }
}

/* PCはSPと違い「スクロール中だけ出て止まると隠れる」スクロールバーがOS標準に無いため、
   JS（index.js）で位置・高さを計算する疑似スクロールバー。SPは端末標準の挙動のまま
   （ネイティブスクロールバーも隠さない）でよいため、非表示化・疑似バーともPCのみに絞る */
.fake_scrollbar {
  display: none;
  position: fixed;
  top: 0;
  right: 2px;
  width: 5px;
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 99999;
}
.fake_scrollbar.is-visible {
  opacity: 1;
}
@media (min-width: 769px) {
  html,
  body {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  html::-webkit-scrollbar,
  body::-webkit-scrollbar {
    display: none;
  }
  .fake_scrollbar {
    display: block;
  }
}