@charset "utf-8";

/**************************************
 * section parts
**************************************/
.sec {
  position: relative;
  padding: 48px 17px 60px;
  overflow: hidden;
}

.sec-inner {
  position: relative;
  z-index: 2;
}

.sec-ttl {
  text-align: center;
}

.sec-ttl-main {
  font-size: calc(44 / var(--root-font-size) * 1rem);
  font-weight: 700;
}
.sec-ttl-main::first-letter {
  color: var(--color-fighters-blue);
}

.sec-ttl-sub {
  font-size: calc(20 / var(--root-font-size) * 1rem);
  font-weight: 900;
  color: var(--color-fighters-blue);
}

@media screen and (min-width: 769px) {
  .sec {
    padding: 100px 30px;
  }

  .sec-inner {
    margin: 0 auto;
    max-width: 980px;
  }

  .sec-ttl-main {
    font-size: calc(64 / var(--root-font-size) * 1rem);
  }

  .sec-ttl-sub {
    font-size: calc(24 / var(--root-font-size) * 1rem);
  }
}

/**************************************
* mv
**************************************/
#mv {
  aspect-ratio: 750 / 1200;
  background: center top/cover url(../img/contents/mv-bg.webp);
  overflow: hidden;
}

.mv-logo {
  position: absolute;
  z-index: 1;
  top: 16.2vw;
  left: 50%;
  translate: -50% 0;
  width: 100%;
  height: auto;
}

@media screen and (min-width: 769px) {
  #mv {
    aspect-ratio: 1440 / 951;
    background-image: url(../img/contents/mv-bg__l.webp);
  }

  .mv-logo {
    top: 3.8vw;
  }
}

.mvSlider-container {
  transform: skewY(-10deg);
  translate: 0 -5px;
}
.mvSlider-container._under {
  margin-top: 70vw;
}

.mvSlider {
  pointer-events: none;
  user-select: none;
}

.mvSlider .splide__slide {
  transform: skewY(10deg);
}

@media screen and (min-width: 769px) {
  .mvSlider-container {
    translate: 0 -24px;
  }
  .mvSlider-container._under {
    margin-top: 23.8vw;
  }
}

/**************************************
 * news
**************************************/
#news {
  overflow: visible;
}

#news::before {
  content: '';
  position: absolute;
  z-index: 1;
  top: -60px;
  right: 0;
  display: block;
  width: 31%;
  height: auto;
  aspect-ratio: 235 / 574;
  background: center/contain no-repeat url(../img/contents/news-bg-yashi.webp);
}

.news-list {
  margin: 35px auto 0;
  max-width: 480px;
}

.news-list > li + li {
  margin-top: 16px;
}

.newsCard {
  position: relative;
  background-color: var(--color-fighters-blue);
  border-radius: 0 10px 0 10px;
}
.newsCard::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  display: block;
  width: 0;
  height: 0;
  border-top: 23px solid transparent;
  border-right: 28px solid var(--color-default-black);
}

.newsCard-inner {
  padding: 20px 22px;
}

.newsCard-date {
  font-weight: 500;
  color: var(--color-gold);
}
.newsCard-date > span {
  font-weight: 600;
  font-size: 0.85em;
}

.newsCard-ttl {
  margin-top: 6px;
  font-size: calc(16 / var(--root-font-size) * 1rem);
  font-weight: 500;
  color: var(--color-default-white);
}

@media screen and (min-width: 769px) {
  #news {
    margin-top: -124px;
    overflow: hidden;
  }

  #news::before {
    top: 12px;
    right: 57px;
    width: max(319px, 22.1%);
    aspect-ratio: 319 / 462;
    background-image: url(../img/contents/news-bg-yashi__l.webp);
  }

  .news-list {
    margin-top: 58px;
    max-width: 100%;
  }

  .news-list > li + li {
    margin-top: 24px;
  }

  .newsCard {
    border-radius: 0 20px 0 20px;
  }
  .newsCard::after {
    border-top-width: 45px;
    border-right-width: 55px;
  }

  .newsCard-inner {
    display: flex;
    align-items: center;
    gap: 40px;
    padding: 27px 50px;
  }

  .newsCard-date {
    font-size: calc(18 / var(--root-font-size) * 1rem);
  }

  .newsCard-ttl {
    margin-top: 0;
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }
}

@media screen and (min-width: 1040px) {
  #news::before {
    right: 17.8vw;
  }
}

/**************************************
 * slogan
**************************************/
#slogan {
  background-color: var(--color-fighters-blue);
  background: center top / 100% repeat-y url(../img/contents/slogan-bg.webp);
}

#slogan .sec-ttl-main {
  font-size: calc(42 / var(--root-font-size) * 1rem);
  color: var(--color-default-white);
}
#slogan .sec-ttl-main::first-letter {
  color: var(--color-gold);
}

#slogan .sec-ttl-sub {
  color: var(--color-default-white);
}

.slogan-logo {
  margin: 18px auto 0;
  max-width: 400px;
}

.slogan-lead {
  margin-top: 24px;
  text-align: center;
  font-size: calc(16 / var(--root-font-size) * 1rem);
  color: var(--color-default-white);
}

@media screen and (min-width: 769px) {
  #slogan {
    background-image: url(../img/contents/slogan-bg__l.webp);
  }

  #slogan .sec-inner {
    max-width: 1100px;
  }

  #slogan .sec-ttl-main {
    font-size: calc(64 / var(--root-font-size) * 1rem);
    line-height: 1.2;
  }

  #slogan .sec-ttl-sub {
    margin-top: 18px;
  }

  .slogan-logo {
    margin-top: 58px;
    max-width: 475px;
  }

  .slogan-lead {
    margin: 43px auto 0;
    max-width: 880px;
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }
}

.sloganThoughts {
  margin: 35px auto 0;
  max-width: 480px;
  padding: 24px 22px 45px;
  background-color: var(--background-color);
  background-image: url(../img/contents/slogan-thoughts-bg.webp);
  background-position: center bottom;
  background-size: 100%;
  background-repeat: no-repeat;
  border-radius: 0 10px 0 10px;
}

.sloganThoughts-inner {
  margin-top: 18px;
}

.sloganThoughts-ttl {
  font-size: calc(20 / var(--root-font-size) * 1rem);
  font-weight: 700;
}

.sloganThoughts-txt {
  margin-top: 10px;
  font-size: calc(16 / var(--root-font-size) * 1rem);
  font-weight: 600;
}

@media screen and (min-width: 769px) {
  .sloganThoughts {
    margin-top: 59px;
    max-width: 100%;
    padding: 48px 60px;
    background-image: url(../img/contents/slogan-thoughts-bg__l.webp);
    background-position: right bottom;
    background-size: 442px 263px;
    border-radius: 0 20px 0 20px;
    display: flex;
    align-items: flex-start;
    gap: 32px;
  }

  .sloganThoughts-img {
    width: calc(55% - 32px);
  }

  .sloganThoughts-inner {
    margin-top: 0;
    width: 45%;
  }

  .sloganThoughts-ttl {
    font-size: calc(24 / var(--root-font-size) * 1rem);
  }

  .sloganThoughts-txt {
    margin-top: 20px;
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }
}

/**************************************
 * message
**************************************/
#message {
  background: center top/100% no-repeat url(../img/contents/message-bg.webp);
  background-color: #ddd598;
}

#message .sec-ttl-main {
  line-height: 1.2;
  font-size: calc(28 / var(--root-font-size) * 1rem);
}
#message .sec-ttl-main > strong {
  font-size: 1.6em;
  color: var(--color-fighters-blue);
}

#message .sec-ttl-sub {
  margin-top: 16px;
}

.message-content {
  margin-top: 35px;
}

.message-x {
  margin-top: 20px;
}

.message-txt {
  margin-top: 28px;
  font-size: calc(16 / var(--root-font-size) * 1rem);
  font-weight: 500;
}

@media screen and (min-width: 769px) {
  #message {
    background-image: url(../img/contents/message-bg__l.webp);
  }

  #message .sec-inner {
    max-width: 1100px;
  }

  #message .sec-ttl-main {
    font-size: calc(40 / var(--root-font-size) * 1rem);
  }

  #message .sec-ttl-sub {
    margin-top: 12px;
  }

  .message-content {
    margin-top: 56px;
  }

  .message-x {
    margin-top: 40px;
  }

  .message-txt {
    margin-top: 56px;
    text-align: center;
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }
}

/**************************************
 * schedule
**************************************/
#schedule {
  padding-bottom: 50px;
  background: center top/100% repeat-y url(../img/contents/schedule-bg-haibisukasu.webp);
}

.schedule-list > li + li {
  margin-top: 20px;
}

.schedule-miruttl {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
  padding-bottom: 10px;
}
.schedule-miruttl::before,
.schedule-miruttl::after {
  content: '';
  position: absolute;
  bottom: 0;
  display: block;
  width: 4px;
  height: 48px;
  background-color: var(--color-default-black);
}
.schedule-miruttl::before {
  left: -18px;
  rotate: -20deg;
}
.schedule-miruttl::after {
  right: -18px;
  rotate: 20deg;
}

.schedule-mirubtn {
  margin: 12px auto 0;
}

@media screen and (min-width: 769px) {
  #schedule {
    padding-bottom: 100px;
    background-image: url(../img/contents/schedule-bg-haibisukasu__l.webp);
  }

  .schedule-list > li + li {
    margin-top: 24px;
  }

  .schedule-miruttl {
    padding-bottom: 14px;
  }
  .schedule-miruttl::before,
  .schedule-miruttl::after {
    height: 64px;
  }
  .schedule-miruttl::before {
    left: -40px;
  }
  .schedule-miruttl::after {
    right: -40px;
  }
}

.scheduleCard-ttl {
  display: flex;
  font-weight: 700;
}

.scheduleCard-ttl-date {
  padding-right: 10px;
  font-size: calc(20 / var(--root-font-size) * 1rem);
  white-space: nowrap;
}
.scheduleCard-ttl-date .-week {
  font-size: 0.6em;
}
.scheduleCard-ttl-date ._sat {
  color: var(--color-fighters-blue);
}
.scheduleCard-ttl-date ._sun {
  color: red;
}

.scheduleCard-ttl-txt {
  padding-top: 2px;
  font-size: calc(16 / var(--root-font-size) * 1rem);
}

.scheduleCard-ttl-vs {
  display: flex;
  align-items: flex-start;
}
.scheduleCard-ttl-vs > span {
  padding-top: 0.4em;
}

.scheduleCard-ttl-teamlogo {
  display: inline-block;
  width: 2em;
}

.scheduleCard-btncontainer {
  margin: 0 -6px;
  display: flex;
  justify-content: center;
  gap: 9px;
}

.scheduleCard-youtube {
  margin: 0 auto;
  max-width: 480px;
}
* + .scheduleCard-youtube {
  margin-top: 16px;
}
.scheduleCard-youtube iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}

.scheduleCard-divider {
  margin: 0;
  color: var(--color-gray);
}
* + .scheduleCard-divider {
  margin-top: 20px;
}

.scheduleCardBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 150px;
  height: 60px;
  background-color: var(--color-fighters-blue);
  border-radius: calc(1px / 0);
}
.scheduleCardBtn::before {
  content: '';
  display: block;
  background: center/contain no-repeat;
}

.scheduleCardBtn-txt {
  font-size: calc(12 / var(--root-font-size) * 1rem);
  font-weight: 700;
  color: var(--color-default-white);
}

.scheduleCardBtn._report::before {
  width: 15px;
  height: 20px;
  background-image: url(../img/contents/schedule-icon-report.webp);
}

.scheduleCardBtn._picture {
  background-color: var(--color-default-black);
}
.scheduleCardBtn._picture::before {
  width: 20px;
  height: 20px;
  background-image: url(../img/contents/schedule-icon-camera.webp);
}

.scheduleCardFarm {
  margin-top: 20px;
  display: flex;
  align-items: flex-start;
}

.scheduleCardFarm-ttl {
  width: 75px;
  padding: 8px 0;
  text-align: center;
  font-weight: 700;
  background-color: #33cc00;
  color: var(--color-default-white);
}

.scheduleCardFarm-txt {
  padding-top: 7px;
  padding-left: 12px;
  font-size: calc(16 / var(--root-font-size) * 1rem);
  font-weight: 600;
}

.scheduleCardFarm-vs {
  display: flex;
  align-items: flex-start;
  padding-top: 4px;
}
.scheduleCardFarm-vs > span {
  padding-top: 0.4em;
}

.scheduleCardFarm-teamlogo {
  display: inline-block;
  width: 2em;
}

@media screen and (min-width: 769px) {
  .scheduleCard-ttl-date {
    padding-top: 2px;
    padding-right: 40px;
    font-size: calc(18 / var(--root-font-size) * 1rem);
  }
  .scheduleCard-ttl-date .-week {
    font-size: 0.85em;
  }

  .scheduleCard-ttl-txt {
    padding-top: 0;
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }

  .scheduleCard-ttl-vs > span {
    padding-top: 0.2em;
  }

  .scheduleCard-ttl-teamlogo {
    margin-top: -0.2em;
  }

  .scheduleCard-btncontainer {
    margin: 0;
    gap: 16px;
  }

  * + .scheduleCard-youtube {
    margin-top: 24px;
  }

  * + .scheduleCard-divider {
    margin-top: 32px;
  }

  .scheduleCardBtn {
    gap: 16px;
    width: 240px;
    height: 64px;
  }

  .scheduleCardBtn-txt {
    font-size: calc(16 / var(--root-font-size) * 1rem);
  }

  .scheduleCardBtn._report::before {
    width: 20px;
    height: 23px;
  }

  .scheduleCardBtn._picture::before {
    width: 25px;
    height: 21px;
  }

  .scheduleCardFarm {
    margin-top: 32px;
  }

  .scheduleCardFarm-ttl {
    width: 90px;
  }

  .scheduleCardFarm-txt {
    padding-top: 8px;
    padding-left: 16px;
  }

  .scheduleCardFarm-vs > span {
    padding-top: 0.3em;
  }
}

/**************************************
 * member
**************************************/
#member {
  padding-top: 40px;
  padding-bottom: 0;
  background-color: var(--color-fighters-blue);
}
#member::after {
  content: '';
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  right: 0;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 750 / 299;
  background: center/cover url(../img/contents/member-bg-haibisukasu.webp);
}

#member .sec-ttl-main {
  color: var(--color-default-white);
}
#member .sec-ttl-main::first-letter {
  color: var(--color-gold);
}

#member .sec-ttl-sub {
  color: var(--color-gold);
}

.member-aclist > li + li {
  margin-top: 20px;
}

.member-teamttl {
  font-size: calc(16 / var(--root-font-size) * 1rem);
  font-weight: 700;
  color: var(--color-fighters-blue);
}

.member-rolettl {
  padding-bottom: 6px;
  border-bottom: 1px solid var(--color-gray);
  font-weight: 600;
}
.member-names + .member-rolettl {
  margin-top: 16px;
}

.member-names {
  margin-top: 12px;
}
.member-names > span {
  display: inline-block;
}

.member-txt {
  margin-top: 24px;
  color: var(--color-default-white);
}

@media screen and (min-width: 769px) {
  #member {
    padding-top: 100px;
  }
  #member::after {
    aspect-ratio: 1440 / 200;
    background-image: url(../img/contents/member-bg-haibisukasu__l.webp);
  }

  .member-aclist > li + li {
    margin-top: 24px;
  }

  .member-teamttl {
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }

  .member-rolettl {
    padding-bottom: 12px;
    border-bottom-width: 2px;
    font-size: calc(18 / var(--root-font-size) * 1rem);
  }
  .member-names + .member-rolettl {
    margin-top: 40px;
  }

  .member-names {
    margin-top: 20px;
  }

  .member-txt {
    margin-top: 36px;
  }
}

/**************************************
 * information
**************************************/
#information {
  background-color: var(--color-fighters-blue);
}
#information::after {
  content: '';
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  right: 0;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 750 / 299;
  background: center/cover url(../img/contents/information-bg-haibisukasu.webp);
}

#information .sec-ttl-main {
  color: var(--color-default-white);
}
#information .sec-ttl-main::first-letter {
  color: var(--color-gold);
}

#information .sec-ttl-sub {
  color: var(--color-gold);
}

.information-container {
  margin: 35px auto 0;
  padding: 28px 21px;
  background-color: var(--background-color);
  border-radius: 10px;
}

.information-bnr {
  margin: 16px auto 0;
  max-width: 480px;
}

.information-snsttl {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
  padding-bottom: 10px;
}
.information-snsttl::before,
.information-snsttl::after {
  content: '';
  position: absolute;
  bottom: 0;
  display: block;
  width: 4px;
  height: 48px;
  background-color: var(--color-default-black);
}
.information-snsttl::before {
  left: -24px;
  rotate: -20deg;
}
.information-snsttl::after {
  right: -24px;
  rotate: 20deg;
}

.information-snslist {
  margin-top: 20px;
  display: flex;
  justify-content: center;
  gap: 30px;
}

.information-snslist > li {
  width: 50px;
}

.information-snsname {
  margin-top: 8px;
  text-align: center;
  font-size: calc(12 / var(--root-font-size) * 1rem);
}

@media screen and (min-width: 769px) {
  #information::after {
    aspect-ratio: 1440 / 200;
    background-image: url(../img/contents/information-bg-haibisukasu__l.webp);
  }

  #information .sec-inner {
    max-width: 1100px;
  }

  #information .sec-ttl-main {
    line-height: 1.2;
  }

  #information .sec-ttl-sub {
    margin-top: 18px;
  }

  .information-container {
    margin-top: 58px;
    padding: 43px 60px;
    border-radius: 20px;
  }

  .information-bnr {
    margin-top: 27px;
    max-width: 620px;
  }

  .information-snsttl {
    padding-bottom: 20px;
  }
  .information-snsttl::before,
  .information-snsttl::after {
    height: 68px;
  }
  .information-snsttl::before {
    left: -36px;
  }
  .information-snsttl::after {
    right: -36px;
  }

  .information-snslist {
    margin-top: 24px;
    gap: 70px;
  }

  .information-snslist > li {
    width: 60px;
  }

  .information-snsname {
    margin-top: 20px;
    font-size: calc(16 / var(--root-font-size) * 1rem);
  }
}

/**************************************
 * goods
**************************************/
#goods {
  background: center top/100% repeat-y url(../img/contents/goods-bg.webp);
}

@media screen and (min-width: 769px) {
  #goods {
    background-image: url(../img/contents/goods-bg__l.webp);
  }
}

#goods-slider {
  margin: 36px auto 0;
  max-width: 341px;
}

.splide__track {
  overflow: visible;
}

.splide__pagination {
  position: static;
  padding: 22px 24px;
  gap: 10px;
}

.splide__pagination__page {
  margin: 0;
  width: 12px;
  height: 12px;
  background-color: var(--color-default-black);
  opacity: 0.14;
}
.splide__pagination__page.is-active {
  background-color: var(--color-fighters-blue);
  opacity: 1;
  transform: none;
}

@media screen and (min-width: 769px) {
  #goods-slider {
    margin-top: 58px;
    max-width: 425px;
  }

  .splide__pagination {
    padding: 40px;
    gap: 16px;
  }

  .splide__pagination__page {
    width: 16px;
    height: 16px;
  }
}

@media screen and (min-width: 1441px) {
  #goods .sec-inner {
    max-width: 1340px;
    overflow: hidden;
  }

  #goods-slider {
    max-width: 100%;
  }
}

.goodsSlide {
  padding: 24px 22px 32px;
  background-color: #fff;
  border-radius: 10px;
}

.goodsSlide-name {
  padding-bottom: 5px;
  border-bottom: 1px solid var(--color-gray);
  font-size: calc(16 / var(--root-font-size) * 1rem);
  font-weight: 600;
}

.goodsSlide-info {
  margin-top: 16px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.goodsSlide-info + .goodsSlide-info {
  margin-top: 8px;
}

.goodsSlide-info > dt {
  width: 60px;
  padding: 2px 0;
  background-color: var(--color-default-black);
  text-align: center;
  color: var(--color-default-white);
}

.goodsSlide-info > dd {
  width: calc(100% - 60px - 8px);
  padding-top: 2px;
}

.goodsSlide-price {
  position: relative;
  margin-top: 5px;
  text-align: right;
  font-size: calc(28 / var(--root-font-size) * 1rem);
  font-weight: 900;
  color: var(--color-fighters-blue);
}
.goodsSlide-price::before {
  content: '¥';
  font-size: 0.7em;
}
.goodsSlide-price._each {
  margin-left: auto;
  width: fit-content;
  padding-left: 0.8em;
}
.goodsSlide-price._each::after {
  content: '各';
  position: absolute;
  left: 0;
  bottom: 0.3em;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 0.7em;
}

.goodsSlide-btn {
  margin: 16px auto 0;
}

@media screen and (min-width: 769px) {
  .goodsSlide {
    padding: 32px 32px 40px;
    border-radius: 20px;
  }

  .goodsSlide-name {
    padding-bottom: 10px;
    border-bottom-width: 2px;
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }

  .goodsSlide-info {
    margin-top: 24px;
    gap: 16px;
  }
  .goodsSlide-info + .goodsSlide-info {
    margin-top: 10px;
  }

  .goodsSlide-info > dt {
    width: 76px;
    padding: 8px 0;
  }

  .goodsSlide-info > dd {
    width: calc(100% - 76px - 16px);
    padding-top: 8px;
  }

  .goodsSlide-price {
    margin-top: 8px;
    font-size: calc(40 / var(--root-font-size) * 1rem);
  }

  .goodsSlide-btn {
    margin-top: 20px;
  }
}

/**************************************
 * access
**************************************/
#access::after {
  content: '';
  position: absolute;
  z-index: 1;
  bottom: 0;
  right: 0;
  display: block;
  width: 191px;
  height: 150px;
  background: center/cover url(../img/contents/access-bg-yashi.webp);
}

.access-place {
  margin-top: 30px;
}

.access-list > li + li {
  margin-top: 20px;
}

.access-headline {
  padding-bottom: 6px;
  border-bottom: 1px solid var(--color-gray);
  font-weight: 600;
}

.access-txt {
  margin-top: 12px;
}

.access-address {
  margin-top: 8px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.access-address-label {
  width: 55px;
  padding: 2px 0;
  text-align: center;
  background-color: var(--color-default-black);
  color: var(--color-default-white);
}

.access-address-value {
  width: calc(100% - 55px - 12px);
  padding: 2px 0;
}

.access-fanarea {
  margin: 16px auto 0;
  max-width: 480px;
}

@media screen and (min-width: 769px) {
  #access::after {
    width: 569px;
    height: 291px;
    background-image: url(../img/contents/access-bg-yashi__l.webp);
  }

  .access-place {
    margin-top: 48px;
  }

  .access-list > li + li {
    margin-top: 40px;
  }

  .access-headline {
    padding-bottom: 10px;
    border-bottom-width: 2px;
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }

  .access-txt {
    margin-top: 18px;
    font-size: calc(20 / var(--root-font-size) * 1rem);
  }

  .access-address {
    margin-top: 10px;
    gap: 16px;
  }

  .access-address-label {
    width: 76px;
    padding: 8px 0;
  }

  .access-address-value {
    width: calc(100% - 76px - 16px);
    padding: 8px 0;
  }

  .access-fanarea {
    margin-top: 20px;
    max-width: 800px;
  }
}
