/* 既存CSSの上書き分 */
#fv.p-fv {
  height: 100svh;
  margin-bottom: 0;
}

@media screen and (min-width: 1400px) {
  #fv.p-fv {
    height: clamp(600px, 100svh, 1030px);
  }
}
@media screen and (max-width: 480px) {
  #fv.p-fv {
    height: 100svh;
  }
}

#fv.p-fv .fv-title-area {
  top: auto;
  bottom: 31.4%;
  z-index: 3;
}

@media screen and (max-width: 767px) {
  #fv.p-fv .fv-title-area {
    bottom: 24%;
  }
}

#fv.p-fv .sns-area {
  bottom: 5.3%;
  z-index: 3;
}
@media screen and (max-width: 1000px) {
  #fv.p-fv .sns-area {
    bottom: 1.3%;
  }
}

#top #match {
  padding-top: 100px;
}

@media screen and (max-width: 768px) {
  #top #match {
    padding-top: 100px;
  }
}

/* TOPページ MV改修分（2025/11） */
/* メインスライダー */
.p-fv__mainSlider-wrapper {
  position: relative;
  height: calc(100% - 114.5px);
}
.p-fv__mainSlider-wrapper::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 1;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  .p-fv__mainSlider-wrapper {
    height: 100%;
  }
}

.p-fv__mainSlider-bg {
  position: absolute;
  width: 100%;
  height: 27%;
  bottom: 0;
  left: 0;
  background: linear-gradient(
    to top,
    rgba(25, 22, 33, 1) 0%,
    rgba(84, 84, 84, 0) 100%
  );
  z-index: 2;
}

.p-topMv__swiper-container {
  height: 100%;
}

.p-topMv__swiper {
  height: 100%;
}

.p-topMv__swiper-slide {
  width: 100%;
  height: 100%;
}
.p-topMv__swiper-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

/* サブスライダー */
.p-fv__subSlider-wrapper {
  position: absolute;
  width: 644px;
  height: 166px;
  bottom: 0;
  right: 10px;
  z-index: 3;
}
@media (min-width: 1400px) {
  .p-fv__subSlider-wrapper {
    right: calc(50% - 720px - 50px);
  }
}
@media screen and (max-width: 767px) {
  .p-fv__subSlider-wrapper {
    width: 100%;
    right: auto;
    height: auto;
    -webkit-padding-after: 49px;
    padding-block-end: 49px;
  }
}

.p-topMv2__swiper-container {
  position: relative;
  height: inherit;
  padding-inline: 33px;
}
@media screen and (max-width: 767px) {
  .p-topMv2__swiper-container {
    padding-inline: 0;
  }
}

.p-topMv2__swiper {
  height: 106px;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .p-topMv2__swiper {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }
}

.p-topMv2__swiper-slide {
  aspect-ratio: 220 / 106;
}
.p-topMv2__swiper-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}
@media screen and (max-width: 767px) {
  .p-topMv2__swiper-slide {
    width: 38%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    transform: translateX(50%) !important;
  }
}

.p-topMv2__swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: absolute;
  left: 50%;
  translate: -50%;
}
@media screen and (max-width: 767px) {
  .p-topMv2__swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal {
    height: 10px;
    bottom: 10px;
  }
}

.p-topMv2__swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal
  .swiper-pagination-bullet {
  opacity: 1;
  width: 8px;
  height: auto;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #ffffff;
  margin-inline: 5px;
}
.p-topMv2__swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal
  .swiper-pagination-bullet-active {
  background: #c2c2c2;
}

.p-topMv2__swiper-button-prev,
.p-topMv2__swiper-button-next {
  position: absolute;
  width: 13px;
  height: 25px;
  top: 37px;
  cursor: pointer;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
.p-topMv2__swiper-button-prev:hover,
.p-topMv2__swiper-button-next:hover {
  opacity: 0.7;
}
@media screen and (max-width: 767px) {
  .p-topMv2__swiper-button-prev,
  .p-topMv2__swiper-button-next {
    display: none;
  }
}

.p-topMv2__swiper-button-prev {
  left: 0;
  background: url(../../img/icon-arrow_l.svg) no-repeat center center/cover;
}

.p-topMv2__swiper-button-next {
  right: 0;
  background: url(../../img/icon-arrow_r.svg) no-repeat center center/cover;
}

/* 右側のスラッシュ背景 */
#fv.p-fv .slash1-1 {
  bottom: -170px;
  left: 60%;
  z-index: 2;
  width: min(40%, 560px);
}
#fv.p-fv .slash1-2 {
  bottom: -20px;
  left: 61.5%;
  z-index: 2;
  width: min(55%, 700px);
}
#fv.p-fv .slash1-3 {
  bottom: -20px;
  left: 81%;
  z-index: 2;
  width: min(55%, 700px);
}

@media screen and (min-width: 1400px) {
  #fv.p-fv .slash1-1 {
    left: calc(50% + 220px);
  }
  #fv.p-fv .slash1-2 {
    left: calc(50% + 190px);
  }
  #fv.p-fv .slash1-3 {
    left: calc(50% + 460px);
  }
}

@media screen and (max-width: 768px) {
  #fv.p-fv .slash1-1 {
    bottom: -3%;
    left: 53%;
  }
  #fv.p-fv .slash1-2 {
    bottom: 6%;
    left: 55%;
  }
  #fv.p-fv .slash1-3 {
    bottom: -2%;
    left: 67%;
  }
}

@media screen and (max-width: 480px) {
  #fv.p-fv .slash1-1 {
    bottom: -3%;
    top: initial;
  }
  #fv.p-fv .slash1-2 {
    bottom: 5%;
    top: initial;
  }
  #fv.p-fv .slash1-3 {
    bottom: -2%;
    top: initial;
  }
}

/* 左側のスラッシュ背景 */
#fv.p-fv .slash2-1 {
  position: absolute;
  right: 83%;
  top: 150px;
  z-index: 2;
  width: min(55%, 622px);
}
#fv.p-fv .slash2-2 {
  position: absolute;
  right: 68%;
  top: 224px;
  z-index: 2;
  width: min(50%, 621px);
}

@media screen and (min-width: 1440px) {
  #fv.p-fv .slash2-1 {
    /* left: calc(50% - 1092px); */
    left: calc(50% - 1300px);
  }
  #fv.p-fv .slash2-2 {
    left: calc(50% - 883px);
  }
}

@media screen and (max-width: 768px) {
  #fv.p-fv .slash2-1 {
    width: 25rem;
    /* right: 52%; */
    right: 70%;
    top: initial;
    bottom: 9%;
  }
  #fv.p-fv .slash2-2 {
    width: 25rem;
    right: 52%;
    top: initial;
    bottom: -6%;
  }
}

@media screen and (max-width: 480px) {
  #fv.p-fv .slash2-1 {
  }
  #fv.p-fv .slash2-2 {
  }
}