@charset "UTF-8";
/* Entry SCSS for the LP */
/* ===============================================
  Functions
=============================================== */
/* ===============================================
  Mixins
=============================================== */
/* ===============================================
  Responsive
=============================================== */
@media (min-width: 961px) {
  .sp {
    display: none;
  }
}
@media (max-width: 960px) {
  .pc {
    display: none;
  }
}
/* ===============================================
  Variables
=============================================== */
:root {
  --color-text: #1f0a0a;
  --color-bg: #fff;
  --color-red: #ff1818;
  --color-red-dark: #e20000;
}

/* ===============================================
  Base
=============================================== */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  vertical-align: bottom;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Noto Sans JP", sans-serif;
  color: var(--color-text);
  background: var(--color-bg);
  line-height: 1.8;
}

main {
  overflow: hidden;
}

@supports (overscroll-behavior: none) {
  html, body {
    height: 100%;
    overscroll-behavior-y: none; /* 縦方向のバウンス抑止（必要なら none を全面適用） */
    /* overscroll-behavior: none; */
  }
}
/* ===============================================
  Layout utilities
=============================================== */
.container, #senpai .swiper .swiper-pagination {
  margin: 0 auto;
}
@media (min-width: 961px) {
  .container, #senpai .swiper .swiper-pagination {
    box-sizing: content-box;
    padding: 0 40px;
    max-width: 1128px;
  }
}
@media (max-width: 960px) {
  .container, #senpai .swiper .swiper-pagination {
    width: 87.6923076923vw;
  }
}

/* ===============================================
  Typography
=============================================== */
.sec__ttl {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
@media (min-width: 961px) {
  .sec__ttl {
    gap: 20px;
  }
}
@media (max-width: 960px) {
  .sec__ttl {
    gap: 3.3333333333vw;
  }
}
.sec__ttl small {
  display: flex;
  align-items: center;
  font-feature-settings: "liga" off, "clig" off;
  font-family: "Fugaz One", sans-serif;
  font-style: normal;
  font-weight: 400;
}
@media (min-width: 961px) {
  .sec__ttl small {
    gap: 16px;
    font-size: 25.75px;
    line-height: 24px;
    letter-spacing: -0.2px;
  }
}
@media (max-width: 960px) {
  .sec__ttl small {
    gap: 1.5384615385vw;
    font-size: 4.6153846154vw;
    line-height: 4.6153846154vw;
    letter-spacing: -0.0358974359vw;
  }
}
.sec__ttl small::before {
  content: "";
  display: block;
  background-color: var(--color-text);
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
}
@media (min-width: 961px) {
  .sec__ttl small::before {
    width: 46px;
    height: 46px;
  }
}
@media (max-width: 960px) {
  .sec__ttl small::before {
    width: 8.2051282051vw;
    height: 8.2051282051vw;
  }
}
.sec__ttl span {
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 900;
  line-height: 1;
}
@media (min-width: 961px) {
  .sec__ttl span {
    font-size: 40px;
    letter-spacing: 2px;
  }
}
@media (max-width: 960px) {
  .sec__ttl span {
    font-size: 7.6923076923vw;
    line-height: 11.7948717949vw;
  }
}

.sec__subttl {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 961px) {
  .sec__subttl {
    gap: 6px;
  }
}
@media (max-width: 960px) {
  .sec__subttl {
    gap: 1.5384615385vw;
  }
}
.sec__subttl small {
  font-feature-settings: "liga" off, "clig" off;
  font-family: "Fugaz One", sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
}
@media (min-width: 961px) {
  .sec__subttl small {
    font-size: 18px;
  }
}
@media (max-width: 960px) {
  .sec__subttl small {
    font-size: 3.5897435897vw;
  }
}
.sec__subttl span {
  color: var(--color-red);
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  position: relative;
  z-index: 1;
}
@media (min-width: 961px) {
  .sec__subttl span {
    font-size: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  .sec__subttl span {
    font-size: 4.6153846154vw;
    line-height: 6.1538461538vw;
    letter-spacing: 0.1282051282vw;
  }
}

p.lead {
  font-feature-settings: "liga" off, "clig" off;
  font-style: normal;
  font-weight: 500;
}
@media (min-width: 961px) {
  p.lead {
    margin-top: 40px;
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  p.lead {
    margin-top: 7.9487179487vw;
    font-size: 3.8461538462vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}

p {
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 400;
}
@media (min-width: 961px) {
  p {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.5px;
  }
}
/* ===============================================
  FV
=============================================== */
#fv {
  position: relative;
}
@media (min-width: 961px) {
  #fv {
    aspect-ratio: 1440/900;
    background: url(../images/fv_bg.webp) no-repeat center top/cover;
  }
}
@media (max-width: 960px) {
  #fv {
    aspect-ratio: 390/797;
    background: url(../images/fv_bg_sp.webp) no-repeat center top/cover;
  }
}

.fv__title img {
  position: absolute;
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
}
.fv__title img.fv_txt1 {
  transition: clip-path 0.5s ease-in-out;
}
@media (min-width: 961px) {
  .fv__title img.fv_txt1 {
    width: 91.8055555556%;
    top: -3.3333333333%;
    left: 4.0277777778%;
  }
}
@media (max-width: 960px) {
  .fv__title img.fv_txt1 {
    width: 93.8461538462vw;
    top: -2.5641025641vw;
    left: 3.0769230769vw;
  }
}
.fv__title img.fv_txt2 {
  transition: clip-path 0.5s ease-in-out;
}
@media (min-width: 961px) {
  .fv__title img.fv_txt2 {
    width: 45.4861111111%;
    top: 36.8888888889%;
    left: 3.6805555556%;
  }
}
@media (max-width: 960px) {
  .fv__title img.fv_txt2 {
    width: 93.8461538462vw;
    top: 14.1025641026vw;
    left: 3.0769230769vw;
  }
}

.fv__img img {
  display: block;
  position: absolute;
}
@media (min-width: 961px) {
  .fv__img img.layer1, .fv__img img.layer2 {
    width: 76.3888888889%;
    top: 6.1111111111%;
    left: 37.9861111111%;
  }
}
@media (max-width: 960px) {
  .fv__img img.layer1, .fv__img img.layer2 {
    width: 215.3846153846vw;
    top: 47.1794871795vw;
    left: -27.4358974359vw;
  }
}
.fv__img img.layer1, .fv__img img.layer2 {
  transform: translate(20px, 50px);
  opacity: 0;
  transition: transform 0.5s 0.5s ease-in-out, opacity 0.05s 0.5s linear;
}
.fv__img img.mask {
  width: 100%;
  z-index: 1;
}
@media (min-width: 961px) {
  .fv__img img.mask {
    top: 74.4444444444%;
  }
}
@media (max-width: 960px) {
  .fv__img img.mask {
    top: 183.3333333333vw;
  }
}
.fv__img img.layer2 {
  z-index: 2;
}

#fv.is-active .fv__title img {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
#fv.is-active .fv__img img {
  transform: translate(0, 0);
  opacity: 1;
}

/* ===============================================
  Fixed bottom menus
=============================================== */
.menus {
  position: fixed;
  z-index: 1000;
}
@media (min-width: 961px) {
  .menus {
    left: 0;
    right: 0;
    bottom: 16px;
    pointer-events: none;
  }
}
@media (max-width: 960px) {
  .menus {
    right: 5.1282051282vw;
    bottom: 5.1282051282vw;
  }
}

.menus__inner {
  display: flex;
  margin: auto;
  width: fit-content;
  pointer-events: auto;
}
@media (min-width: 961px) {
  .menus__inner {
    align-items: center;
    justify-content: center;
    gap: 28px;
    padding: 28px 48px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(8px);
    transition: all 0.2s ease-in-out;
  }
}
@media (max-width: 960px) {
  .menus__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    border: 1px solid #FFF;
    border-radius: 10.2564102564vw;
    background: linear-gradient(35deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.6) 100%), rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5.1282051282vw);
    box-shadow: 0 0 5.1282051282vw 0 rgba(0, 0, 0, 0.16);
    padding: 0;
    width: 20.5128205128vw;
    height: 20.5128205128vw;
    max-height: 20.5128205128vw;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    pointer-events: none;
    position: relative;
  }
  .menus__inner::before {
    content: "";
    display: block;
    width: 100%;
    height: 53.8461538462vw;
    background-color: var(--color-red-dark);
    mask-image: url(../images/fv_txt2.svg);
    mask-size: 57.4358974359vw;
    mask-repeat: no-repeat;
    mask-position: center top;
    opacity: 0;
    transition: opacity 0.2s ease;
    position: absolute;
    top: 12.3076923077vw;
    left: 0;
    right: 0;
  }
}

.menus__item {
  display: inline-flex;
  align-items: center;
  color: #1f0a0a;
  font-feature-settings: "palt";
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
@media (min-width: 961px) {
  .menus__item {
    gap: 8px;
    height: 24px;
    font-size: 16px;
    letter-spacing: 1px;
  }
}
@media (max-width: 960px) {
  .menus__item {
    gap: 2.0512820513vw;
    padding: 5.1282051282vw 0;
    width: 100%;
    font-size: 5.1282051282vw;
    letter-spacing: 0.2564102564vw;
    border-bottom: 1px solid rgba(226, 0, 0, 0.3);
    opacity: 0;
    transform: translateY(50%);
  }
  .menus__item:nth-child(1) {
    border-top: 1px solid rgba(226, 0, 0, 0.3);
  }
}
.menus__item::before {
  content: "";
  display: block;
  background-color: var(--color-red-dark);
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
}
@media (min-width: 961px) {
  .menus__item::before {
    width: 26px;
    height: 26px;
  }
}
@media (max-width: 960px) {
  .menus__item::before {
    width: 10.2564102564vw;
    height: 10.2564102564vw;
  }
}
.menus__item:nth-child(1)::before {
  mask-image: url(../images/icn_talk-bubbles.svg);
}
.menus__item:nth-child(2)::before {
  mask-image: url(../images/icn_flag.svg);
}
.menus__item:nth-child(3)::before {
  mask-image: url(../images/icn_horseshoes.svg);
}
.menus__item:nth-child(4)::before {
  mask-image: url(../images/icn_horse-head.svg);
}
@media (min-width: 961px) {
  .menus__item:nth-child(4)::before {
    width: 30px;
    height: 30px;
  }
}
.menus__item:nth-child(5)::before {
  mask-image: url(../images/icn_info.svg);
}
@media (hover: hover) {
  .menus__item:hover {
    color: var(--color-red-dark);
  }
}

@media (min-width: 961px) {
  .menus__btn {
    display: none;
  }
}
@media (max-width: 960px) {
  .menus__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20.5128205128vw;
    height: 20.5128205128vw;
    border-radius: 50%;
    background-image: url(../images/icn_menu.svg);
    background-size: 12.3076923077vw;
    background-position: center center;
    background-repeat: no-repeat;
    position: fixed;
    right: 5.1282051282vw;
    bottom: 5.1282051282vw;
    z-index: 2;
  }
}

@media (max-width: 960px) {
  .menus.is-active .menus__inner {
    opacity: 1;
    padding: 66.1538461538vw 10.2564102564vw 22.5641025641vw;
    width: 89.7435897436vw;
    height: auto;
    max-height: calc(100vh - 15.3846153846vw);
    overflow-y: auto;
    pointer-events: auto;
  }
  .menus.is-active .menus__inner .menus__item {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.4s;
  }
  .menus.is-active .menus__inner::before {
    opacity: 1;
    transition-delay: 0.4s;
  }
  .menus.is-active .menus__btn {
    background-image: url(../images/icn_close.svg);
  }
}
/* overlay for menus (SP only) */
@media (max-width: 960px) {
  .menus__overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
    z-index: 900; /* under menus (1000) */
  }
  .menus__overlay.is-visible {
    opacity: 1;
    pointer-events: auto;
  }
}
/* hidden style */
@media (min-width: 961px) {
  .menus.is-hidden .menus__inner {
    transform: scaleX(0);
    transition-delay: 0.2s;
  }
  .menus.is-hidden .menus__inner .menus__item {
    opacity: 0;
    transform: translateY(50%);
    transition-delay: 0 !important;
  }
}
/* ===============================================
  Introduction
=============================================== */
#intro {
  overflow: hidden;
  position: relative;
  z-index: 2;
}
@media (min-width: 961px) {
  #intro {
    padding: 365px 0 500px;
  }
}
@media (min-width: 961px) and (max-width: 1440px) {
  #intro {
    padding-top: 25.3472222222vw;
  }
}
@media (max-width: 960px) {
  #intro {
    padding: 51.2820512821vw 0 127.4358974359vw;
  }
}
#intro .floating {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#intro .floating img {
  position: absolute;
}
@media (min-width: 961px) {
  #intro .floating img {
    left: 50%;
  }
}
@media (min-width: 961px) {
  #intro .floating img.logo {
    width: 663px;
    top: 700px;
    transform: translateX(57px);
  }
}
@media (max-width: 960px) {
  #intro .floating img.logo {
    width: 73.0769230769vw;
    top: 222.0512820513vw;
    right: 0;
  }
}
@media (min-width: 961px) {
  #intro .floating img.object1 {
    width: 102px;
    top: 1218px;
    transform: translateX(-593px);
  }
}
@media (max-width: 960px) {
  #intro .floating img.object1 {
    width: 10.4615384615vw;
    top: 338.9743589744vw;
    left: 13.0256410256vw;
  }
}
@media (min-width: 961px) {
  #intro .floating img.object2 {
    width: 120px;
    top: 1323px;
    transform: translateX(272px);
  }
}
@media (max-width: 960px) {
  #intro .floating img.object2 {
    width: 12.3076923077vw;
    top: 341.5384615385vw;
    left: 59.4871794872vw;
  }
}
@media (min-width: 961px) {
  #intro .floating img.image1 {
    width: 384px;
    top: 157px;
    transform: translateX(286px);
    filter: drop-shadow(0 30px 30px rgba(0, 0, 0, 0.15));
  }
}
@media (max-width: 960px) {
  #intro .floating img.image1 {
    width: 39.3846153846vw;
    top: 2.0512820513vw;
    left: 55.3846153846vw;
    filter: drop-shadow(0 3.0769230769vw 3.0769230769vw rgba(0, 0, 0, 0.15));
  }
}
@media (min-width: 961px) {
  #intro .floating img.image2 {
    width: 228px;
    top: 420px;
    transform: translateX(493px);
    filter: drop-shadow(0 30px 30px rgba(0, 0, 0, 0.15));
  }
}
@media (min-width: 961px) and (max-width: 1443px) {
  #intro .floating img.image2 {
    left: 100%;
    transform: translateX(-100%);
  }
}
@media (max-width: 960px) {
  #intro .floating img.image2 {
    width: 23.3846153846vw;
    top: 29.2307692308vw;
    right: 0;
    filter: drop-shadow(0 3.0769230769vw 3.0769230769vw rgba(0, 0, 0, 0.15));
  }
}
@media (min-width: 961px) {
  #intro .floating img.image3 {
    width: 387px;
    top: 560px;
    transform: translateX(-720px);
  }
}
@media (max-width: 960px) {
  #intro .floating img.image3 {
    width: 39.6923076923vw;
    top: 278.7179487179vw;
    left: 0;
  }
}
@media (min-width: 961px) {
  #intro .floating img.image4 {
    width: 206px;
    top: 1035px;
    transform: translateX(-539px);
    filter: drop-shadow(0 30px 30px rgba(0, 0, 0, 0.15));
  }
}
@media (max-width: 960px) {
  #intro .floating img.image4 {
    width: 21.1282051282vw;
    top: 320.2564102564vw;
    left: 18.5641025641vw;
    filter: drop-shadow(0 3.0769230769vw 3.0769230769vw rgba(0, 0, 0, 0.15));
  }
}
@media (min-width: 961px) {
  #intro .floating img.image5 {
    width: 320px;
    top: 1342px;
    transform: translateX(346px);
    filter: drop-shadow(0 30px 30px rgba(0, 0, 0, 0.15));
  }
}
@media (min-width: 961px) and (max-width: 1333px) {
  #intro .floating img.image5 {
    left: 100%;
    transform: translateX(-100%);
  }
}
@media (max-width: 960px) {
  #intro .floating img.image5 {
    width: 32.8205128205vw;
    top: 343.5897435897vw;
    right: 0;
    filter: drop-shadow(0 3.0769230769vw 3.0769230769vw rgba(0, 0, 0, 0.15));
  }
}
#intro .container, #intro #senpai .swiper .swiper-pagination, #senpai .swiper #intro .swiper-pagination {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: auto;
  width: fit-content;
}
@media (min-width: 961px) {
  #intro .container, #intro #senpai .swiper .swiper-pagination, #senpai .swiper #intro .swiper-pagination {
    gap: 120px;
    transform: translateX(-20px);
  }
}
@media (max-width: 960px) {
  #intro .container, #intro #senpai .swiper .swiper-pagination, #senpai .swiper #intro .swiper-pagination {
    gap: 10vw;
    width: auto;
    padding-top: 2.3076923077vw;
    padding-left: 11.0256410256vw;
    transform: none;
  }
}
@media (min-width: 961px) {
  #intro .container .catch img, #intro #senpai .swiper .swiper-pagination .catch img, #senpai .swiper #intro .swiper-pagination .catch img {
    width: 484px;
  }
}
@media (max-width: 960px) {
  #intro .container .catch img, #intro #senpai .swiper .swiper-pagination .catch img, #senpai .swiper #intro .swiper-pagination .catch img {
    width: 69.2307692308vw;
    transform: translateX(0.2564102564vw);
  }
}
@media (min-width: 961px) {
  #intro .container .bodycopy img, #intro #senpai .swiper .swiper-pagination .bodycopy img, #senpai .swiper #intro .swiper-pagination .bodycopy img {
    width: 522px;
    transform: translateX(-3px);
  }
}
@media (max-width: 960px) {
  #intro .container .bodycopy img, #intro #senpai .swiper .swiper-pagination .bodycopy img, #senpai .swiper #intro .swiper-pagination .bodycopy img {
    width: 70.2564102564vw;
  }
}

/* ===============================================
  教えて！馬術部センパイ
=============================================== */
#senpai {
  overflow: hidden;
  position: relative;
  z-index: 1;
}
@media (min-width: 961px) {
  #senpai {
    margin-top: -320px;
    padding-bottom: 140px;
  }
}
@media (max-width: 960px) {
  #senpai {
    margin-top: -25.641025641vw;
    padding-bottom: 20.5128205128vw;
  }
}
#senpai .senpai-container {
  position: relative;
}
@media (min-width: 961px) {
  #senpai .senpai-container {
    padding: 295px 0 0;
  }
}
@media (max-width: 960px) {
  #senpai .senpai-container {
    padding: 25.641025641vw 0 0;
  }
}
#senpai .senpai-container .bg {
  width: 100%;
  background: linear-gradient(90deg, #FF1818 0%, #FFE6E6 100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
@media (min-width: 961px) {
  #senpai .senpai-container .bg {
    height: calc(100% + 140px);
  }
}
@media (max-width: 960px) {
  #senpai .senpai-container .bg {
    height: calc(100% + 12.8205128205vw);
  }
}
#senpai .sec__ttl {
  color: #fff;
}
#senpai .sec__ttl small::before {
  background-color: #fff;
  mask-image: url(../images/icn_talk-bubbles.svg);
}
#senpai .lead {
  color: #fff;
}
#senpai .note {
  color: #fff;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 400;
}
@media (min-width: 961px) {
  #senpai .note {
    margin-top: 10px;
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #senpai .note {
    margin-top: 2.5641025641vw;
    font-size: 3.0769230769vw;
    line-height: 5.3846153846vw;
    letter-spacing: 0.1282051282vw;
  }
}
#senpai .swiper {
  overflow: visible;
  position: relative;
}
@media (min-width: 961px) {
  #senpai .swiper {
    margin-top: 62px;
  }
}
@media (max-width: 960px) {
  #senpai .swiper {
    margin-top: 20.5128205128vw;
  }
}
#senpai .swiper .swiper-slide {
  cursor: grab;
  background: transparent;
  border: none;
  overflow: hidden;
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-slide {
    width: calc(100% - 80px);
    max-width: 936px;
    border-radius: 16px;
    filter: drop-shadow(0 30px 30px rgba(0, 0, 0, 0.15));
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-slide {
    width: calc(100% - 12.3076923077vw);
    border-radius: 2.0512820513vw;
    filter: drop-shadow(0 3.8461538462vw 3.8461538462vw rgba(0, 0, 0, 0.15));
  }
}
#senpai .swiper .swiper-slide img {
  width: 100%;
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-slide img {
    aspect-ratio: 936/520;
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-slide img {
    aspect-ratio: 342/581;
  }
}
#senpai .swiper .swiper-pagination {
  display: flex;
  height: fit-content;
  left: 50%;
  transform: translateX(-50%);
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-pagination {
    justify-content: flex-end;
    gap: 26px;
    top: -48px;
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-pagination {
    justify-content: center;
    gap: 6.6666666667vw;
    top: -12.1794871795vw;
  }
}
#senpai .swiper .swiper-pagination .swiper-pagination-bullet {
  margin: 0;
  background: transparent;
  border: 1px solid #fff;
  opacity: 1;
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-pagination .swiper-pagination-bullet {
    width: 16px;
    height: 16px;
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-pagination .swiper-pagination-bullet {
    width: 4.1025641026vw;
    height: 4.1025641026vw;
  }
}
#senpai .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #fff !important;
}
#senpai .swiper .swiper-pagination .swiper-pagination-bullet:hover {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.3) 100%);
}
#senpai .swiper .swiper-buttons {
  height: fit-content;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background: #0f0;
  z-index: 10;
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-buttons {
    width: calc(100% - 80px);
    max-width: 936px;
    top: 46.5%;
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-buttons {
    width: calc(100% - 12.3076923077vw);
    top: 37%;
  }
}
#senpai .swiper .swiper-buttons .swiper-button-prev,
#senpai .swiper .swiper-buttons .swiper-button-next {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.2) 100%);
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.16);
  backdrop-filter: blur(20px);
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-buttons .swiper-button-prev,
  #senpai .swiper .swiper-buttons .swiper-button-next {
    width: 80px;
    height: 80px;
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-buttons .swiper-button-prev,
  #senpai .swiper .swiper-buttons .swiper-button-next {
    width: 12.8205128205vw;
    height: 12.8205128205vw;
  }
}
#senpai .swiper .swiper-buttons .swiper-button-prev::after,
#senpai .swiper .swiper-buttons .swiper-button-next::after {
  content: "";
  display: block;
  background-color: var(--color-red-dark);
  mask-image: url(../images/icn_arrow-right.svg);
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-buttons .swiper-button-prev::after,
  #senpai .swiper .swiper-buttons .swiper-button-next::after {
    width: 48px;
    height: 48px;
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-buttons .swiper-button-prev::after,
  #senpai .swiper .swiper-buttons .swiper-button-next::after {
    width: 7.1794871795vw;
    height: 7.1794871795vw;
  }
}
#senpai .swiper .swiper-buttons .swiper-button-prev {
  left: 0;
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-buttons .swiper-button-prev {
    transform: translateX(-75%) scaleX(-1);
  }
  #senpai .swiper .swiper-buttons .swiper-button-prev:hover {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    animation: flash-prev 0.35s ease-in-out forwards;
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-buttons .swiper-button-prev {
    transform: translateX(-45%) scaleX(-1);
  }
  #senpai .swiper .swiper-buttons .swiper-button-prev:hover {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    animation: flash-prev-sp 0.35s ease-in-out forwards;
  }
}
@keyframes flash-prev {
  0% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.2) 100%);
    transform: translateX(-75%) scaleX(-1);
  }
  20% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.6) 100%);
    transform: translateX(-75%) scaleX(-1.1) scaleY(1.1);
  }
  100% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    transform: translateX(-75%) scaleX(-1);
  }
}
@keyframes flash-prev-sp {
  0% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.2) 100%);
    transform: translateX(-45%) scaleX(-1);
  }
  20% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.6) 100%);
    transform: translateX(-45%) scaleX(-1.1) scaleY(1.1);
  }
  100% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    transform: translateX(-45%) scaleX(-1);
  }
}
#senpai .swiper .swiper-buttons .swiper-button-next {
  right: 0;
}
@media (min-width: 961px) {
  #senpai .swiper .swiper-buttons .swiper-button-next {
    transform: translateX(75%);
  }
  #senpai .swiper .swiper-buttons .swiper-button-next:hover {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    animation: flash-next 0.35s ease-in-out forwards;
  }
}
@media (max-width: 960px) {
  #senpai .swiper .swiper-buttons .swiper-button-next {
    transform: translateX(45%);
  }
  #senpai .swiper .swiper-buttons .swiper-button-next:hover {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    animation: flash-next-sp 0.35s ease-in-out forwards;
  }
}
@keyframes flash-next {
  0% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.2) 100%);
    transform: translateX(75%);
  }
  20% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.6) 100%);
    transform: translateX(75%) scaleX(1.1) scaleY(1.1);
  }
  100% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    transform: translateX(75%);
  }
}
@keyframes flash-next-sp {
  0% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.2) 100%);
    transform: translateX(45%);
  }
  20% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.6) 100%);
    transform: translateX(45%) scaleX(1.1) scaleY(1.1);
  }
  100% {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    transform: translateX(45%);
  }
}

/* ===============================================
  トレセン出張CAMP開催！
=============================================== */
#camp {
  text-align: center;
}
@media (min-width: 961px) {
  #camp {
    margin-top: 153px;
    padding: 100px 0 0;
  }
}
@media (max-width: 960px) {
  #camp {
    margin-top: 15.3846153846vw;
    padding: 16.6666666667vw 0 0;
  }
}
#camp .sec__ttl {
  align-items: center;
  color: #fff;
}
#camp .sec__ttl small::before {
  background-color: #fff;
  mask-image: url(../images/icn_flag.svg);
}
#camp .lead {
  color: #fff;
}
@media (max-width: 960px) {
  #camp .lead {
    padding: 0 6.1538461538vw;
    text-align: left;
  }
}
#camp .camp__movie {
  margin: auto;
  aspect-ratio: 1128/635;
  width: 100%;
  position: relative;
}
@media (min-width: 961px) {
  #camp .camp__movie {
    margin-top: 64px;
    max-width: 1128px;
    box-shadow: 0 40px 40px 0 rgba(0, 0, 0, 0.1);
  }
}
@media (max-width: 960px) {
  #camp .camp__movie {
    margin-top: 6.1538461538vw;
    box-shadow: 0 10.2564102564vw 10.2564102564vw 0 rgba(0, 0, 0, 0.1);
  }
}
#camp .camp__movie .camp__ph {
  width: 100%;
  height: 100%;
  background: #d9d9d9;
  position: absolute;
  top: 0;
  left: 0;
}
#camp .camp__movie .camp__play {
  appearance: none;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
}
@media (min-width: 961px) {
  #camp .camp__movie .camp__play {
    width: 316px;
    height: 316px;
  }
}
@media (max-width: 960px) {
  #camp .camp__movie .camp__play {
    width: 34.5051282051vw;
    height: 34.5051282051vw;
  }
}
#camp .camp__movie .camp__play::before {
  content: "";
  display: block;
  background: #fff;
  mask-image: url(../images/icn_play.svg);
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: right center;
  position: absolute;
  transition: transform 0.3s ease-in-out;
}
@media (min-width: 961px) {
  #camp .camp__movie .camp__play::before {
    width: 120px;
    height: 100px;
  }
}
@media (max-width: 960px) {
  #camp .camp__movie .camp__play::before {
    width: 12.8205128205vw;
    height: 10.2564102564vw;
  }
}
#camp .camp__movie .camp__play::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
  mask-image: url(../images/btn_play.svg);
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  animation: rotate 20s linear infinite;
  transition: opacity 0.3s ease-in-out;
}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
#camp .camp__movie .camp__play:hover::before {
  transform: scale(0.9);
}
#camp .camp__movie .camp__play:hover::after {
  opacity: 0.6;
}
#camp .camp__movie .camp__play.__off {
  pointer-events: none;
}
#camp .camp__movie .camp__play.__off::after {
  animation: none;
}
@media (max-width: 960px) {
  #camp .camp__movie .camp__play.__off {
    transform: translate(-50%, -64%) scale(0.8);
  }
}
#camp .camp__movie .comingsoon {
  color: #fff;
  font-weight: 700;
  line-height: 1;
  position: relative;
  z-index: 1;
}
@media (min-width: 961px) {
  #camp .camp__movie .comingsoon {
    padding-top: 524px;
    font-size: 40px;
    letter-spacing: 2px;
  }
}
@media (min-width: 961px) and (max-width: 1130px) {
  #camp .camp__movie .comingsoon {
    padding-top: 46.3716814159vw;
  }
}
@media (max-width: 960px) {
  #camp .camp__movie .comingsoon {
    padding-top: 43.0769230769vw;
    font-size: 5.1282051282vw;
    letter-spacing: 0.2564102564vw;
  }
}
@media (min-width: 961px) {
  #camp .loop-slider {
    gap: 24px;
    margin-top: 192px;
  }
}
@media (max-width: 960px) {
  #camp .loop-slider {
    gap: 4.1025641026vw;
    margin-top: 25.641025641vw;
  }
}
#camp .loop-slider img {
  object-fit: cover;
  aspect-ratio: 1/1;
}
@media (min-width: 961px) {
  #camp .loop-slider img {
    border-radius: 8px;
    max-width: 359px;
  }
}
@media (max-width: 960px) {
  #camp .loop-slider img {
    border-radius: 2.0512820513vw;
    width: 46.1538461538vw;
  }
}
#camp .insta {
  width: 100%;
  position: relative;
}
@media (min-width: 961px) {
  #camp .insta {
    height: 120px;
  }
}
@media (max-width: 960px) {
  #camp .insta {
    height: 25.641025641vw;
  }
}
#camp .insta .insta__btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  color: #FFF;
  text-decoration: none;
  position: absolute;
  filter: drop-shadow(0 30px 30px rgba(0, 0, 0, 0.15));
}
@media (min-width: 961px) {
  #camp .insta .insta__btn {
    width: 376px;
    top: -507px;
    right: 50px;
  }
}
@media (max-width: 960px) {
  #camp .insta .insta__btn {
    width: 46.9230769231vw;
    top: -67.6923076923vw;
    right: -6.1538461538vw;
  }
}
#camp .insta .insta__btn::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(../images/star_insta.svg);
  background-size: 90%;
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute;
  top: 0;
  left: 0;
  animation: bounce 1.5s infinite;
}
@keyframes bounce {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.025);
  }
}
#camp .insta .insta__btn dl {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}
@media (min-width: 961px) {
  #camp .insta .insta__btn dl {
    gap: 12px;
  }
}
@media (max-width: 960px) {
  #camp .insta .insta__btn dl {
    gap: 0.5128205128vw;
  }
}
#camp .insta .insta__btn dl dt {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-family: "Fugaz One", sans-serif;
  font-style: normal;
  font-weight: 400;
}
@media (min-width: 961px) {
  #camp .insta .insta__btn dl dt {
    gap: 16px;
    font-size: 38px;
    line-height: 28px;
  }
}
@media (max-width: 960px) {
  #camp .insta .insta__btn dl dt {
    gap: 0.5128205128vw;
    font-size: 4.1025641026vw;
    line-height: 5.641025641vw;
  }
}
#camp .insta .insta__btn dl dt::before {
  content: "";
  display: block;
  background-color: #fff;
  mask-image: url(../images/icn_insta.svg);
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
}
@media (min-width: 961px) {
  #camp .insta .insta__btn dl dt::before {
    width: 52px;
    height: 52px;
  }
}
@media (max-width: 960px) {
  #camp .insta .insta__btn dl dt::before {
    width: 6.1538461538vw;
    height: 6.1538461538vw;
  }
}
#camp .insta .insta__btn dl dd {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 700;
}
@media (min-width: 961px) {
  #camp .insta .insta__btn dl dd {
    gap: 12px;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #camp .insta .insta__btn dl dd {
    gap: 1.5384615385vw;
    font-size: 3.0769230769vw;
    line-height: 4.1025641026vw;
    letter-spacing: 0.1282051282vw;
  }
}
#camp .insta .insta__btn:hover::before {
  animation: rotate 8s linear infinite;
}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
#camp .report {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: auto;
  background: #fff;
  position: relative;
}
@media (min-width: 961px) {
  #camp .report {
    gap: 16px;
    padding: 48px 48px 64px;
    max-width: 936px;
    border-radius: 32px;
    box-shadow: 0 30px 30px 0 rgba(0, 0, 0, 0.15);
  }
}
@media (max-width: 960px) {
  #camp .report {
    gap: 3.0769230769vw;
    padding: 8.2051282051vw 6.1538461538vw 12.3076923077vw;
    border-radius: 4.1025641026vw;
    box-shadow: 0 3.8461538462vw 3.8461538462vw 0 rgba(0, 0, 0, 0.15);
  }
}
#camp .report h3 {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 961px) {
  #camp .report h3 {
    gap: 8px;
  }
}
@media (max-width: 960px) {
  #camp .report h3 {
    gap: 1.5384615385vw;
  }
}
#camp .report h3 small {
  font-family: "Fugaz One", sans-serif;
  line-height: 1;
}
@media (min-width: 961px) {
  #camp .report h3 small {
    font-size: 18px;
  }
}
@media (max-width: 960px) {
  #camp .report h3 small {
    font-size: 3.5897435897vw;
  }
}
#camp .report h3 span {
  color: var(--color-red);
  line-height: 1.5;
}
@media (min-width: 961px) {
  #camp .report h3 span {
    font-size: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #camp .report h3 span {
    font-feature-settings: "palt" on;
    font-size: 4.6153846154vw;
    letter-spacing: 0.1282051282vw;
  }
}
#camp .report p.lead {
  margin: 0;
  color: var(--color-text);
}
@media (max-width: 960px) {
  #camp .report p.lead {
    padding: 0;
    font-size: 3.8461538462vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
    text-align: center;
  }
}
#camp .report .slideshow {
  aspect-ratio: 550/328;
  width: 100%;
  height: auto;
  overflow: hidden;
  position: relative;
}
@media (min-width: 961px) {
  #camp .report .slideshow {
    margin-top: 16px;
    max-width: 550px;
  }
}
@media (max-width: 960px) {
  #camp .report .slideshow {
    margin-top: 6.6666666667vw;
  }
}
#camp .report .slideshow img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.8s ease-in-out;
  pointer-events: none;
}
#camp .report .slideshow img.is-active {
  opacity: 1;
}
#camp .present {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  position: absolute;
  z-index: 2;
}
@media (min-width: 961px) {
  #camp .present {
    gap: 4px;
    width: 201px;
    height: 201px;
    bottom: 20px;
    right: 112px;
  }
}
@media (max-width: 960px) {
  #camp .present {
    gap: 1.0256410256vw;
    width: 35.8974358974vw;
    height: 35.8974358974vw;
    bottom: 2.0512820513vw;
    right: 2.0512820513vw;
  }
}
#camp .present::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: var(--color-red);
  mask-image: url(../images/star_red.svg);
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  position: absolute;
  z-index: -1;
}
#camp .present dt {
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-family: "Fugaz One", sans-serif;
  font-style: normal;
  font-weight: 400;
}
@media (min-width: 961px) {
  #camp .present dt {
    font-size: 30px;
    line-height: 28px;
  }
}
@media (max-width: 960px) {
  #camp .present dt {
    font-size: 5.3846153846vw;
    line-height: 5.641025641vw;
  }
}
#camp .present dd {
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 700;
}
@media (min-width: 961px) {
  #camp .present dd {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #camp .present dd {
    font-size: 3.2051282051vw;
    line-height: 5vw;
    letter-spacing: 0.0897435897vw;
  }
}

/* ===============================================
  About
=============================================== */
@media (min-width: 961px) {
  #about {
    padding-top: 100px;
  }
}
@media (max-width: 960px) {
  #about {
    padding-top: 10.2564102564vw;
  }
}
@media (max-width: 960px) {
  #about .container, #about #senpai .swiper .swiper-pagination, #senpai .swiper #about .swiper-pagination {
    width: 100%;
  }
}
#about .ttl-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
#about .ttl-block .sec__ttl {
  align-items: center;
}
@media (max-width: 960px) {
  #about .ttl-block .sec__ttl {
    gap: 1.5384615385vw;
  }
}
#about .ttl-block .sec__ttl small {
  color: var(--color-red);
}
#about .ttl-block .sec__ttl small::before {
  background-color: var(--color-red);
  mask-image: url(../images/icn_horseshoes.svg);
}
@media (min-width: 961px) and (max-width: 960px) {
  #about .ttl-block .lead {
    text-align: left;
  }
}
@media (max-width: 960px) {
  #about .ttl-block .lead {
    margin-top: 5.641025641vw;
    padding: 0 11.9230769231vw;
  }
}
#about .ttl-block .note {
  color: #1F0A0A;
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 400;
}
@media (min-width: 961px) {
  #about .ttl-block .note {
    margin-top: 8px;
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #about .ttl-block .note {
    margin-top: 2.0512820513vw;
    font-size: 3.0769230769vw;
    line-height: 5.3846153846vw;
    letter-spacing: 0.1282051282vw;
  }
}
#about .jobs {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (max-width: 960px) {
  #about .jobs {
    gap: 8.2051282051vw;
    margin-top: 8.2051282051vw;
  }
}
#about .jobs .job {
  position: relative;
}
@media (max-width: 960px) {
  #about .jobs .job {
    width: 100%;
    padding: 0 4.1025641026vw;
  }
}
@media (min-width: 961px) {
  #about .jobs .job .job__img__main {
    width: 100%;
    max-width: 864px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job .job__img__main {
    display: block;
    width: 74.358974359vw;
    margin: 0 auto;
    transform: translateX(1.5384615385vw);
  }
}
#about .jobs .job .job__img__sub {
  position: absolute;
  width: 100%;
}
@media (min-width: 961px) {
  #about .jobs .job .job__img__sub {
    max-width: 515px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job .job__img__sub {
    width: 52.3076923077vw;
  }
}
#about .jobs .job .job__txt {
  display: flex;
  flex-direction: column;
  position: absolute;
  z-index: 1;
}
@media (min-width: 961px) {
  #about .jobs .job .job__txt {
    gap: 6px;
    padding: 70px 32px;
    max-width: 314px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job .job__txt {
    gap: 1.0256410256vw;
    padding: 10.2564102564vw 5.8974358974vw;
    width: 58.4615384615vw;
  }
}
#about .jobs .job .job__txt::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(90deg, var(--color-red) 0%, #FFB144 100%);
  z-index: -1;
}
#about .jobs .job .job__txt .job__ttl {
  color: #FFF;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 700;
}
@media (min-width: 961px) {
  #about .jobs .job .job__txt .job__ttl {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job .job__txt .job__ttl {
    font-size: 4.1025641026vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}
#about .jobs .job .job__txt .job__desc {
  color: #FFF;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 400;
}
@media (min-width: 961px) {
  #about .jobs .job .job__txt .job__desc {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job .job__txt .job__desc {
    font-size: 3.0769230769vw;
    line-height: 5.3846153846vw;
    letter-spacing: 0.1282051282vw;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job1 {
    margin-top: 146px;
    margin-left: -70px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job1 {
    padding-top: 30.7692307692vw;
    padding-bottom: 38.2051282051vw;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job1 .job__img__sub {
    top: -106px;
    left: -252px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job1 .job__img__sub {
    width: 52.3076923077vw;
    top: 0;
    left: 0;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job1 .job__txt {
    right: -167px;
    bottom: -14px;
  }
}
@media (min-width: 961px) and (max-width: 1128px) {
  #about .jobs .job.job1 .job__txt {
    right: calc((100vw - 864px + 70px) / -2);
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job1 .job__txt {
    right: 0;
    bottom: 0;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job2 {
    margin-top: 44px;
    margin-right: -70px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job2 {
    padding-top: 41.0256410256vw;
    padding-bottom: 27.9487179487vw;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job2 .job__img__sub {
    right: -253px;
    bottom: -106px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job2 .job__img__sub {
    right: 0;
    bottom: 0;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job2 .job__txt {
    top: 6px;
    left: -167px;
  }
}
@media (min-width: 961px) and (max-width: 1128px) {
  #about .jobs .job.job2 .job__txt {
    left: calc((100vw - 864px + 70px) / -2);
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job2 .job__txt {
    top: 0;
    left: 0;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job3 {
    margin-top: 334px;
    margin-left: -70px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job3 {
    padding-top: 30.7692307692vw;
    padding-bottom: 38.2051282051vw;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job3 .job__img__sub {
    top: -184px;
    left: -252px;
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job3 .job__img__sub {
    top: 0;
    left: 0;
  }
}
@media (min-width: 961px) {
  #about .jobs .job.job3 .job__txt {
    right: -167px;
    bottom: 8px;
  }
}
@media (min-width: 961px) and (max-width: 1128px) {
  #about .jobs .job.job3 .job__txt {
    right: calc((100vw - 864px + 70px) / -2);
  }
}
@media (max-width: 960px) {
  #about .jobs .job.job3 .job__txt {
    right: 0;
    bottom: 0;
  }
}
#about .jobs__cta {
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 961px) {
  #about .jobs__cta {
    margin-top: 40px;
  }
}
@media (max-width: 960px) {
  #about .jobs__cta {
    margin-top: 8.2051282051vw;
  }
}
#about .jobs__cta .jobs__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 32px;
  border-radius: 100px;
  background: linear-gradient(243deg, #FFB144 5.43%, var(--color-red) 80.7%);
  box-shadow: 0 0 60px 0 #F00 inset, 0 24px 24px 0 rgba(0, 0, 0, 0.16);
  color: #fff;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  position: relative;
}
@media (min-width: 961px) {
  #about .jobs__cta .jobs__btn {
    width: 446px;
    height: 88px;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #about .jobs__cta .jobs__btn {
    width: 82.0512820513vw;
    height: 22.5641025641vw;
    font-size: 4.1025641026vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}
#about .jobs__cta .jobs__btn[target=_blank]::after {
  content: "";
  display: block;
  background: url(../images/icn_external-link.svg) no-repeat center center/contain;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
@media (min-width: 961px) {
  #about .jobs__cta .jobs__btn[target=_blank]::after {
    right: 32px;
    width: 24px;
    height: 24px;
  }
}
@media (max-width: 960px) {
  #about .jobs__cta .jobs__btn[target=_blank]::after {
    right: 4.1025641026vw;
    width: 6.1538461538vw;
    height: 6.1538461538vw;
  }
}
@media (hover: hover) {
  #about .jobs__cta .jobs__btn {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  #about .jobs__cta .jobs__btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 0 60px 0 #F00 inset, 0 24px 24px 0 rgba(0, 0, 0, 0.12);
  }
}

/* ===============================================
  Schedule
=============================================== */
@media (min-width: 961px) {
  .schedule {
    padding-top: 160px;
  }
}
@media (max-width: 960px) {
  .schedule {
    padding-top: 35.641025641vw;
  }
}
.schedule .sec__subttl {
  position: relative;
}
.schedule .sec__subttl::before {
  content: "1Day Schedule";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  font-feature-settings: "liga" off, "clig" off;
  font-family: "Fugaz One", sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  opacity: 0.15;
  white-space: nowrap;
  background: linear-gradient(243deg, #FFB144 -0.36%, var(--color-red) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media (min-width: 961px) {
  .schedule .sec__subttl::before {
    font-size: 120px;
    letter-spacing: -2px;
  }
}
@media (max-width: 960px) {
  .schedule .sec__subttl::before {
    font-size: 15.3846153846vw;
    letter-spacing: -0.5128205128vw;
  }
}

/* schedule: SP tabs */
@media (min-width: 961px) {
  .schedule__tabs {
    display: none;
  }
}
@media (max-width: 960px) {
  .schedule__tabs {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5384615385vw;
    padding: 0 6.1538461538vw;
    margin-top: 10.5128205128vw;
    position: relative;
    z-index: 2;
  }
}

.schedule__tab {
  appearance: none;
  background-color: #FFF0E2;
  color: #FCA34F;
  text-align: center;
  font-feature-settings: "liga" off, "clig" off;
  font-family: "Fugaz One", sans-serif;
  font-size: 6.6666666667vw;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  padding: 4.358974359vw 0 2.8205128205vw;
  width: 43.0769230769vw;
  height: 13.8461538462vw;
  border-radius: 2.0512820513vw 2.0512820513vw 0 0;
  cursor: pointer;
  border: 1px solid transparent;
  border-bottom-color: var(--color-red);
}
.schedule__tab[aria-controls=raceday] {
  background-color: #FFE9E9;
  color: var(--color-red);
}
.schedule__tab[aria-selected=true] {
  background-color: #fff;
  border-color: var(--color-red);
  border-bottom-color: #fff;
}

/* schedule: SP visibility */
@media (max-width: 960px) {
  .schedule__container .schedule__table.is-active {
    display: table;
  }
}
@media (min-width: 961px) {
  .schedule__container {
    margin-top: 118px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 80px;
  }
}
@media (max-width: 960px) {
  .schedule__container {
    margin-top: -1px;
    padding: 6.1538461538vw 6.1538461538vw 13.8461538462vw;
    border-top: 1px solid var(--color-red);
    position: relative;
    z-index: 1;
  }
}
.schedule__container table {
  caption-side: bottom;
}
@media (min-width: 961px) {
  .schedule__container table {
    max-width: 428px;
  }
}
@media (max-width: 960px) {
  .schedule__container table {
    display: none;
  }
}
.schedule__container table thead dl {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
@media (min-width: 961px) {
  .schedule__container table thead dl {
    gap: 8px;
    padding-bottom: 15px;
  }
}
@media (max-width: 960px) {
  .schedule__container table thead dl {
    padding-bottom: 2.0512820513vw;
  }
}
.schedule__container table thead dl dt {
  color: #FCA34F;
  font-family: "Fugaz One", sans-serif;
}
@media (min-width: 961px) {
  .schedule__container table thead dl dt {
    font-feature-settings: "liga" off, "clig" off;
    font-family: "Fugaz One", sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 50px;
    line-height: 40px;
  }
}
@media (max-width: 960px) {
  .schedule__container table thead dl dt {
    display: none;
  }
}
.schedule__container table thead dl dd {
  color: #1F0A0A;
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}
@media (min-width: 961px) {
  .schedule__container table thead dl dd {
    font-size: 12px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  .schedule__container table thead dl dd {
    font-size: 3.0769230769vw;
  }
}
.schedule__container table tbody img {
  width: 100%;
}
.schedule__container table caption {
  color: var(--color-red);
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}
@media (min-width: 961px) {
  .schedule__container table caption {
    margin-top: 16px;
    font-size: 12px;
    letter-spacing: 0.5px;
    text-align: center;
  }
}
@media (max-width: 960px) {
  .schedule__container table caption {
    margin-top: 5.1282051282vw;
    font-size: 2.8205128205vw;
    line-height: 5.3846153846vw;
    letter-spacing: 0.1282051282vw;
    text-align: left;
  }
}
.schedule__container table#raceday thead th dt {
  color: var(--color-red);
}
.schedule__container .schedule__table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  position: relative;
}
.schedule__container .schedule__table .image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.schedule__container .schedule__table .image img {
  position: absolute;
}
@media (min-width: 961px) {
  .schedule__container .schedule__table .image img {
    border-radius: 4px;
    box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.16);
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table .image img {
    border-radius: 1.0256410256vw;
    box-shadow: 0 2.0512820513vw 2.0512820513vw 0 rgba(0, 0, 0, 0.16);
  }
}
.schedule__container .schedule__table#weekday .image .image1 {
  width: 200px;
  top: 226px;
  left: 210px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#weekday .image .image1 {
    width: 19.7044334975vw;
    top: 22.2660098522vw;
    left: 20.6896551724vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#weekday .image .image1 {
    width: 40vw;
    top: 32.5641025641vw;
    left: 42.3076923077vw;
  }
}
.schedule__container .schedule__table#weekday .image .image2 {
  width: 138px;
  top: 498px;
  left: 317px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#weekday .image .image2 {
    width: 13.5960591133vw;
    top: 49.0640394089vw;
    left: 31.2315270936vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#weekday .image .image2 {
    width: 27.6923076923vw;
    top: 87.1794871795vw;
    left: 63.5897435897vw;
  }
}
.schedule__container .schedule__table#weekday .image .image3 {
  width: 118px;
  top: 571px;
  left: 217px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#weekday .image .image3 {
    width: 11.6256157635vw;
    top: 56.2561576355vw;
    left: 21.3793103448vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#weekday .image .image3 {
    width: 23.8461538462vw;
    top: 101.7948717949vw;
    left: 43.0769230769vw;
  }
}
.schedule__container .schedule__table#weekday .image .image4 {
  width: 118px;
  top: 834px;
  left: 276px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#weekday .image .image4 {
    width: 11.6256157635vw;
    top: 82.1674876847vw;
    left: 27.1921182266vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#weekday .image .image4 {
    width: 23.8461538462vw;
    top: 154.6153846154vw;
    left: 55.3846153846vw;
  }
}
.schedule__container .schedule__table#weekday .image .image5 {
  width: 138px;
  top: 909px;
  left: 317px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#weekday .image .image5 {
    width: 13.5960591133vw;
    top: 89.5566502463vw;
    left: 31.2315270936vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#weekday .image .image5 {
    width: 27.6923076923vw;
    top: 169.4871794872vw;
    left: 63.5897435897vw;
  }
}
.schedule__container .schedule__table#weekday .image .image6 {
  width: 151px;
  top: 1268px;
  left: 304px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#weekday .image .image6 {
    width: 14.8768472906vw;
    top: 124.9261083744vw;
    left: 29.9507389163vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#weekday .image .image6 {
    width: 30.2564102564vw;
    top: 241.5384615385vw;
    left: 61.0256410256vw;
  }
}
.schedule__container .schedule__table#weekday .image .image7 {
  width: 178px;
  top: 1557px;
  left: 92px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#weekday .image .image7 {
    width: 17.5369458128vw;
    top: 153.3990147783vw;
    left: 9.0640394089vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#weekday .image .image7 {
    width: 35.3846153846vw;
    top: 299.4871794872vw;
    left: 18.7179487179vw;
  }
}
.schedule__container .schedule__table#raceday .image .image1 {
  width: 138px;
  top: 270px;
  left: 314px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#raceday .image .image1 {
    width: 13.5960591133vw;
    top: 26.6009852217vw;
    left: 30.9359605911vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#raceday .image .image1 {
    width: 27.6923076923vw;
    top: 52.3076923077vw;
    left: 63.5897435897vw;
  }
}
.schedule__container .schedule__table#raceday .image .image2 {
  width: 118px;
  top: 343px;
  left: 230px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#raceday .image .image2 {
    width: 11.6256157635vw;
    top: 33.7931034483vw;
    left: 22.6600985222vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#raceday .image .image2 {
    width: 23.8461538462vw;
    top: 64.1025641026vw;
    left: 45.641025641vw;
  }
}
.schedule__container .schedule__table#raceday .image .image3 {
  width: 138px;
  top: 594px;
  left: 314px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#raceday .image .image3 {
    width: 13.5960591133vw;
    top: 58.5221674877vw;
    left: 30.9359605911vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#raceday .image .image3 {
    width: 27.6923076923vw;
    top: 115.8974358974vw;
    left: 63.5897435897vw;
  }
}
.schedule__container .schedule__table#raceday .image .image4 {
  width: 138px;
  top: 950px;
  left: 314px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#raceday .image .image4 {
    width: 13.5960591133vw;
    top: 93.5960591133vw;
    left: 30.9359605911vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#raceday .image .image4 {
    width: 27.6923076923vw;
    top: 189.7435897436vw;
    left: 63.5897435897vw;
  }
}
.schedule__container .schedule__table#raceday .image .image5 {
  width: 138px;
  top: 1429px;
  left: 65px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#raceday .image .image5 {
    width: 13.5960591133vw;
    top: 140.7881773399vw;
    left: 6.4039408867vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#raceday .image .image5 {
    width: 27.6923076923vw;
    top: 289.2307692308vw;
    left: 14.358974359vw;
  }
}
.schedule__container .schedule__table#raceday .image .image6 {
  width: 186px;
  top: 1487px;
  left: 178px;
}
@media (min-width: 961px) and (max-width: 1015px) {
  .schedule__container .schedule__table#raceday .image .image6 {
    width: 18.3251231527vw;
    top: 145.5172413793vw;
    left: 17.5369458128vw;
  }
}
@media (max-width: 960px) {
  .schedule__container .schedule__table#raceday .image .image6 {
    width: 36.4102564103vw;
    top: 300.5128205128vw;
    left: 37.9487179487vw;
  }
}

/* ===============================================
  How to
=============================================== */
#howto {
  position: relative;
  z-index: 2;
}
#howto .howto-container:first-child {
  position: relative;
}
@media (min-width: 961px) {
  #howto .howto-container:first-child {
    padding-top: 320px;
  }
}
@media (max-width: 960px) {
  #howto .howto-container:first-child {
    padding-top: 31.2820512821vw;
  }
}
#howto .howto-container:first-child .bg {
  width: 100%;
  background: linear-gradient(90deg, #FF1818 0%, #FFE6E6 100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
@media (min-width: 961px) {
  #howto .howto-container:first-child .bg {
    height: calc(100% + 80px);
  }
}
@media (max-width: 960px) {
  #howto .howto-container:first-child .bg {
    height: calc(100% + 30.7692307692vw);
  }
}
#howto .sec__ttl {
  align-items: center;
  color: #fff;
}
#howto .sec__ttl small::before {
  background-color: #fff;
  mask-image: url(../images/icn_horse-head.svg);
}
#howto .lead {
  color: #fff;
  text-align: center;
}
@media (max-width: 960px) {
  #howto .lead {
    margin-top: 4.1025641026vw;
    padding: 0 6.1538461538vw;
    text-align: left;
    font-size: 3.8461538462vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}
#howto .flow {
  text-align: center;
}
@media (min-width: 961px) {
  #howto .flow {
    margin-top: 76px;
  }
}
@media (max-width: 960px) {
  #howto .flow {
    margin-top: 10.2564102564vw;
    padding: 0 6.1538461538vw;
  }
}
#howto .flow img {
  width: 100%;
  max-width: 936px;
}
#howto .adblock,
#howto .cases {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: auto;
  background: #fff;
}
@media (min-width: 961px) {
  #howto .adblock,
  #howto .cases {
    margin-top: 62px;
    padding: 64px 96px 56px;
    max-width: 936px;
    gap: 48px;
    border-radius: 16px;
    box-shadow: 0 30px 30px 0 rgba(0, 0, 0, 0.15);
  }
}
@media (max-width: 960px) {
  #howto .adblock,
  #howto .cases {
    margin-top: 12.3076923077vw;
    padding: 8.2051282051vw 6.1538461538vw;
    gap: 8.2051282051vw;
    border-radius: 4.1025641026vw;
    box-shadow: 0 3.8461538462vw 3.8461538462vw 0 rgba(0, 0, 0, 0.15);
  }
}
#howto .adblock .ttl-block .lead,
#howto .cases .ttl-block .lead {
  color: var(--color-text);
}
@media (min-width: 961px) {
  #howto .adblock .ttl-block .lead,
  #howto .cases .ttl-block .lead {
    margin-top: 16px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .ttl-block .lead,
  #howto .cases .ttl-block .lead {
    margin-top: 4.1025641026vw;
    text-align: center;
  }
}
#howto .adblock .admission,
#howto .cases .admission {
  display: flex;
  flex-direction: column;
  width: 100%;
}
@media (min-width: 961px) {
  #howto .adblock .admission,
  #howto .cases .admission {
    gap: 16px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .admission,
  #howto .cases .admission {
    gap: 3.0769230769vw;
  }
}
#howto .adblock .admission .ad,
#howto .cases .admission .ad {
  display: flex;
  align-items: center;
  width: 100%;
  background-color: #FFF3CC;
}
@media (min-width: 961px) {
  #howto .adblock .admission .ad,
  #howto .cases .admission .ad {
    gap: 32px;
    padding: 8px;
    max-width: 744px;
    border-radius: 16px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .admission .ad,
  #howto .cases .admission .ad {
    gap: 2.5641025641vw;
    padding: 2.0512820513vw;
    border-radius: 3.0769230769vw;
  }
}
#howto .adblock .admission .ad dt,
#howto .cases .admission .ad dt {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  background: linear-gradient(90deg, #FFA629 0%, #FFDB66 100%);
}
@media (min-width: 961px) {
  #howto .adblock .admission .ad dt,
  #howto .cases .admission .ad dt {
    padding: 16px;
    border-radius: 16px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .admission .ad dt,
  #howto .cases .admission .ad dt {
    max-width: 33.5897435897vw;
    padding: 3.0769230769vw 0;
    border-radius: 3.0769230769vw;
  }
}
#howto .adblock .admission .ad dt .ad__time,
#howto .cases .admission .ad dt .ad__time {
  color: #FFF;
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
}
@media (min-width: 961px) {
  #howto .adblock .admission .ad dt .ad__time,
  #howto .cases .admission .ad dt .ad__time {
    margin-top: 4px;
    font-size: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .admission .ad dt .ad__time,
  #howto .cases .admission .ad dt .ad__time {
    font-size: 4.6153846154vw;
    letter-spacing: 0.1282051282vw;
  }
}
#howto .adblock .admission .ad dt .ad__title,
#howto .cases .admission .ad dt .ad__title {
  color: #FFF;
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
}
@media (min-width: 961px) {
  #howto .adblock .admission .ad dt .ad__title,
  #howto .cases .admission .ad dt .ad__title {
    font-size: 24px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .admission .ad dt .ad__title,
  #howto .cases .admission .ad dt .ad__title {
    font-size: 4.1025641026vw;
    letter-spacing: 0.1282051282vw;
  }
}
#howto .adblock .admission .ad dd,
#howto .cases .admission .ad dd {
  width: 100%;
}
@media (max-width: 960px) {
  #howto .adblock .admission .ad dd,
  #howto .cases .admission .ad dd {
    padding: 0 2.0512820513vw 1.0256410256vw;
    font-size: 3.3333333333vw;
    line-height: 5.1282051282vw;
    letter-spacing: -0.0512820513vw;
  }
}
#howto .adblock .admission .ad:nth-child(even),
#howto .cases .admission .ad:nth-child(even) {
  background-color: #FFE6E6;
}
#howto .adblock .admission .ad:nth-child(even) dt,
#howto .cases .admission .ad:nth-child(even) dt {
  background: linear-gradient(90deg, #FF81BC 0%, #FF9FA1 100%);
}
#howto .adblock .adblock__banner,
#howto .cases .adblock__banner {
  text-align: center;
}
#howto .adblock .adblock__banner p,
#howto .cases .adblock__banner p {
  text-align: center;
  font-feature-settings: "liga" off, "clig" off;
  font-style: normal;
  font-weight: 500;
}
@media (min-width: 961px) {
  #howto .adblock .adblock__banner p,
  #howto .cases .adblock__banner p {
    margin-bottom: 16px;
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .adblock__banner p,
  #howto .cases .adblock__banner p {
    margin-bottom: 3.3333333333vw;
    font-size: 3.8461538462vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}
#howto .adblock .adblock__banner a,
#howto .cases .adblock__banner a {
  display: inline-block;
  filter: drop-shadow(0 24px 24px rgba(0, 0, 0, 0.16));
}
@media (max-width: 960px) {
  #howto .adblock .adblock__banner a,
  #howto .cases .adblock__banner a {
    filter: drop-shadow(0 6.1538461538vw 6.1538461538vw rgba(0, 0, 0, 0.16));
  }
}
#howto .adblock .adblock__banner a[target=_blank],
#howto .cases .adblock__banner a[target=_blank] {
  position: relative;
}
#howto .adblock .adblock__banner a[target=_blank]::after,
#howto .cases .adblock__banner a[target=_blank]::after {
  content: "";
  display: block;
  background-color: #fff;
  mask: url(../images/icn_external-link.svg) no-repeat center center/contain;
  position: absolute;
}
@media (min-width: 961px) {
  #howto .adblock .adblock__banner a[target=_blank]::after,
  #howto .cases .adblock__banner a[target=_blank]::after {
    width: 20px;
    height: 20px;
    right: 10px;
    bottom: 10px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .adblock__banner a[target=_blank]::after,
  #howto .cases .adblock__banner a[target=_blank]::after {
    width: 4.8717948718vw;
    height: 4.8717948718vw;
    right: 2.4358974359vw;
    bottom: 2.4358974359vw;
  }
}
#howto .adblock .adblock__banner a img,
#howto .cases .adblock__banner a img {
  width: 100%;
}
@media (min-width: 961px) {
  #howto .adblock .adblock__banner a img,
  #howto .cases .adblock__banner a img {
    max-width: 360px;
    border-radius: 8px;
  }
}
@media (max-width: 960px) {
  #howto .adblock .adblock__banner a img,
  #howto .cases .adblock__banner a img {
    max-width: 82.0512820513vw;
    border-radius: 2.0512820513vw;
  }
}
@media (hover: hover) {
  #howto .adblock .adblock__banner a,
  #howto .cases .adblock__banner a {
    transition: transform 0.3s ease, filter 0.3s ease;
  }
  #howto .adblock .adblock__banner a:hover,
  #howto .cases .adblock__banner a:hover {
    transform: translateY(-2px);
    filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.08));
  }
}
@media (min-width: 961px) {
  #howto .cases {
    margin-top: 64px;
    gap: 26px;
  }
}
@media (max-width: 960px) {
  #howto .cases {
    margin-top: 12.3076923077vw;
    padding-top: 8.7179487179vw;
    padding-bottom: 1.7948717949vw;
    gap: 4.1025641026vw;
  }
}
#howto .cases .scroll-container {
  position: relative;
}
@media (min-width: 961px) {
  #howto .cases .scroll-container {
    margin: 36px auto 24px;
    padding: 30px 81px 30px 32px;
    width: 810px;
    background: url(../images/modelcase_bg.svg) center top no-repeat;
    background-size: contain;
  }
}
@media (max-width: 960px) {
  #howto .cases .scroll-container {
    margin: 4.1025641026vw auto 1.5384615385vw;
    padding: 4.1025641026vw 10.5128205128vw 4.1025641026vw 2.8205128205vw;
    width: 87.6923076923vw;
    background: url(../images/modelcase_bg_sp.svg) center top no-repeat;
    background-size: contain;
  }
}
#howto .cases .scroll-container .container-window {
  overflow-x: auto;
  scrollbar-width: auto;
  scrollbar-color: #ff0000 #ececec;
}
@media (min-width: 961px) {
  #howto .cases .scroll-container .container-window {
    margin-top: -40px;
    padding-bottom: 36px;
  }
}
@media (max-width: 960px) {
  #howto .cases .scroll-container .container-window {
    margin-top: -6.1538461538vw;
    padding-bottom: 6.1538461538vw;
  }
}
#howto .cases .cases__img {
  display: block;
  height: auto;
  max-width: none;
}
@media (min-width: 961px) {
  #howto .cases .cases__img {
    width: 980px;
  }
}
@media (max-width: 960px) {
  #howto .cases .cases__img {
    width: 131.0256410256vw;
  }
}
#howto .cases .attention {
  border: 1px solid #FFF;
  background: rgba(255, 255, 255, 0.5);
  position: absolute;
  top: 44%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: opacity 0.3s ease;
  pointer-events: none;
}
@media (min-width: 961px) {
  #howto .cases .attention {
    width: 120px;
    height: 120px;
    border-radius: 8px;
    box-shadow: 0 16px 16px 0 rgba(0, 0, 0, 0.16);
    backdrop-filter: blur(5px);
  }
}
@media (max-width: 960px) {
  #howto .cases .attention {
    width: 16.4102564103vw;
    height: 16.4102564103vw;
    border-radius: 2.0512820513vw;
    box-shadow: 0 2.0512820513vw 2.0512820513vw 0 rgba(0, 0, 0, 0.16);
    backdrop-filter: blur(1.2820512821vw);
  }
}
#howto .cases .attention::before {
  content: "";
  display: block;
  background: url(../images/icn_swipe-right.svg) no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: swipe-right 2s ease infinite;
}
@media (min-width: 961px) {
  #howto .cases .attention::before {
    width: 64px;
    height: 64px;
  }
}
@media (max-width: 960px) {
  #howto .cases .attention::before {
    width: 9.2307692308vw;
    height: 9.2307692308vw;
  }
}
@keyframes swipe-right {
  0%, 20% {
    transform: translate(-66%, -50%);
  }
  60%, 100% {
    transform: translate(-33%, -50%);
  }
}
#howto .cases .attention.is-hidden {
  opacity: 0;
}
@media (min-width: 961px) {
  #howto .support {
    margin-top: 192px;
  }
}
@media (max-width: 960px) {
  #howto .support {
    margin-top: 30.7692307692vw;
  }
}
#howto .support .lead {
  color: var(--color-text);
}
@media (min-width: 961px) {
  #howto .support .lead {
    margin-top: 16px;
  }
}
@media (max-width: 960px) {
  #howto .support .lead {
    margin-top: 3.8461538462vw;
    padding: 0;
    text-align: left;
    font-size: 3.8461538462vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}
#howto .support .support__block {
  margin: auto;
}
@media (min-width: 961px) {
  #howto .support .support__block {
    max-width: 746px;
  }
}
@media (max-width: 960px) {
  #howto .support .support__block {
    margin-top: 8.2051282051vw;
    width: 100%;
  }
}
#howto .support .support__ttl {
  font-weight: 700;
}
@media (min-width: 961px) {
  #howto .support .support__ttl {
    margin-top: 40px;
    font-size: 18px;
    font-weight: 700;
  }
}
@media (max-width: 960px) {
  #howto .support .support__ttl {
    margin-top: 6.1538461538vw;
    font-size: 4.1025641026vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}
@media (min-width: 961px) {
  #howto .support .support__desc {
    margin-top: 8px;
  }
}
@media (max-width: 960px) {
  #howto .support .support__desc {
    margin-top: 2.0512820513vw;
    font-size: 3.5897435897vw;
    line-height: 6.1538461538vw;
    letter-spacing: 0.1282051282vw;
  }
}
#howto .support .support__table {
  border-collapse: collapse;
  width: 100%;
  background: #fff;
  border: 1px solid #c3c3c3;
}
@media (min-width: 961px) {
  #howto .support .support__table {
    margin-top: 20px;
    border-radius: 4px;
  }
}
@media (max-width: 960px) {
  #howto .support .support__table {
    margin-top: 7.6923076923vw;
    border-radius: 1.0256410256vw;
  }
}
#howto .support .support__table .support__row--head th {
  font-weight: 400;
  line-height: 1.7;
}
@media (min-width: 961px) {
  #howto .support .support__table .support__row--head th {
    padding: 14px 24px;
    font-size: 14px;
  }
}
@media (max-width: 960px) {
  #howto .support .support__table .support__row--head th {
    padding: 3.8461538462vw;
    font-size: 3.3333333333vw;
    line-height: 5.1282051282vw;
  }
}
#howto .support .support__table td {
  border-top: 1px solid #c3c3c3;
  line-height: 1.7;
  vertical-align: middle;
}
@media (min-width: 961px) {
  #howto .support .support__table td {
    padding: 14px 24px;
    height: 80px;
    font-size: 14px;
  }
}
@media (max-width: 960px) {
  #howto .support .support__table td {
    padding: 2.3076923077vw 4.1025641026vw;
    font-size: 3.3333333333vw;
    line-height: 5.1282051282vw;
  }
}
#howto .support .support__table td span {
  display: block;
}
@media (min-width: 961px) {
  #howto .support .support__table td span {
    padding-left: 1em;
  }
}
@media (max-width: 960px) {
  #howto .support .support__table td span {
    padding-left: 1em;
    text-indent: -1em;
  }
}
#howto .support .support__table .support__cell--right {
  border-left: 1px solid #c3c3c3;
  text-align: center;
}
@media (min-width: 961px) {
  #howto .support .support__table .support__cell--right {
    width: 194px;
  }
}
@media (max-width: 960px) {
  #howto .support .support__table .support__cell--right {
    width: 25.1282051282vw;
  }
}
#howto .support .support__note {
  list-style: none;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}
@media (min-width: 961px) {
  #howto .support .support__note {
    margin-top: 18px;
    font-size: 12px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #howto .support .support__note {
    margin-top: 2.5641025641vw;
    font-size: 3.0769230769vw;
    letter-spacing: 0.1282051282vw;
  }
}
#howto .faq {
  margin: auto;
  border-top: 1px solid rgba(255, 24, 24, 0.3);
}
@media (min-width: 961px) {
  #howto .faq {
    margin-top: 80px;
    padding: 120px 95.5px;
    max-width: 936px;
  }
}
@media (max-width: 960px) {
  #howto .faq {
    margin-top: 14.1025641026vw;
    padding: 13.0769230769vw 0;
  }
}
#howto .faq .sec__subttl {
  position: relative;
}
#howto .faq .sec__subttl::before {
  content: "Q and A";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  font-feature-settings: "liga" off, "clig" off;
  font-family: "Fugaz One", sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  opacity: 0.15;
  white-space: nowrap;
  background: linear-gradient(243deg, #FFB144 -0.36%, var(--color-red) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media (min-width: 961px) {
  #howto .faq .sec__subttl::before {
    font-size: 120px;
    letter-spacing: -2px;
  }
}
@media (max-width: 960px) {
  #howto .faq .sec__subttl::before {
    font-size: 15.3846153846vw;
    letter-spacing: -0.2564102564vw;
  }
}
#howto .faq .faq__list {
  display: flex;
  flex-direction: column;
  margin: auto;
  width: 100%;
}
@media (min-width: 961px) {
  #howto .faq .faq__list {
    gap: 40px;
    margin-top: 84px;
    max-width: 746px;
  }
}
@media (max-width: 960px) {
  #howto .faq .faq__list {
    gap: 8.2051282051vw;
    margin-top: 10.2564102564vw;
  }
}
#howto .faq .faq__item {
  width: 100%;
  background: #fff;
  position: relative;
}
@media (min-width: 961px) {
  #howto .faq .faq__item {
    padding: 32px 48px;
    border-radius: 24px;
    box-shadow: 0 16px 30px rgba(0, 0, 0, 0.16);
  }
}
@media (max-width: 960px) {
  #howto .faq .faq__item {
    padding: 5.1282051282vw 6.1538461538vw 4.1025641026vw;
    border-radius: 4.1025641026vw;
    box-shadow: 0 3.0769230769vw 5.1282051282vw rgba(0, 0, 0, 0.16);
  }
}
#howto .faq .faq__item .icon {
  display: block;
  background-image: url(../images/icn_plus.svg), linear-gradient(90deg, var(--color-red) 0%, #FFB144 100%);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  border: 2px solid #fff;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 46%);
  cursor: pointer;
}
@media (min-width: 961px) {
  #howto .faq .faq__item .icon {
    width: 30px;
    height: 30px;
  }
}
@media (max-width: 960px) {
  #howto .faq .faq__item .icon {
    width: 7.6923076923vw;
    height: 7.6923076923vw;
    border-width: 1.2820512821vw;
  }
}
@media (hover: hover) {
  #howto .faq .faq__item .icon:hover {
    background-image: url(../images/icn_plus.svg), linear-gradient(90deg, var(--color-red-dark) 0%, var(--color-red-dark) 100%);
  }
}
#howto .faq .faq__item .faq__a {
  min-height: 0;
  height: 0;
  overflow: hidden;
  transition: margin-top 0.5s ease-out, padding 0.5s ease-out, height 0.5s ease, opacity 0.2s ease;
  opacity: 0;
}
#howto .faq .faq__item.is-open .icon {
  background-image: url(../images/icn_minus.svg), linear-gradient(90deg, var(--color-red) 0%, #FFB144 100%);
}
@media (hover: hover) {
  #howto .faq .faq__item.is-open .icon:hover {
    background-image: url(../images/icn_minus.svg), linear-gradient(90deg, var(--color-red-dark) 0%, var(--color-red-dark) 100%);
  }
}
#howto .faq .faq__item.is-open .faq__a {
  height: auto;
  opacity: 1;
  transition: margin-top 0.5s ease, height 0.5s ease, opacity 0.2s ease;
}
@media (min-width: 961px) {
  #howto .faq .faq__item.is-open .faq__a {
    margin-top: 24px;
    padding: 24px 0 0 66px;
  }
}
@media (max-width: 960px) {
  #howto .faq .faq__item.is-open .faq__a {
    margin-top: 1.0256410256vw;
    padding: 4.1025641026vw 0 0 11.0256410256vw;
  }
}
#howto .faq .faq__q {
  list-style: none;
  background: url(../images/txt_q.svg) no-repeat;
  background-position: left top;
  cursor: pointer;
}
#howto .faq .faq__q::-webkit-details-marker {
  display: none;
}
@media (min-width: 961px) {
  #howto .faq .faq__q {
    background-size: 43px;
  }
}
@media (max-width: 960px) {
  #howto .faq .faq__q {
    background-size: 8.2051282051vw;
    background-position: left 0.5128205128vw top 1.5384615385vw;
  }
}
@media (hover: hover) {
  #howto .faq .faq__q:hover {
    color: var(--color-red-dark);
  }
}
#howto .faq .faq__q p {
  font-weight: 700;
}
@media (min-width: 961px) {
  #howto .faq .faq__q p {
    padding: 18px 0 18px 66px;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #howto .faq .faq__q p {
    padding: 4.6153846154vw 0 4.6153846154vw 12.3076923077vw;
    font-size: 4.1025641026vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}
#howto .faq .faq__a {
  overflow: hidden; /* 中身のはみ出し防止 */
  border-top: 1px solid rgba(255, 24, 24, 0.3);
  background: url(../images/txt_a.svg) no-repeat;
  margin-top: 0;
}
@media (min-width: 961px) {
  #howto .faq .faq__a {
    padding: 0 0 0 66px;
    background-size: 43px;
    background-position: left 26px;
  }
}
@media (max-width: 960px) {
  #howto .faq .faq__a {
    padding: 0 0 0 11.0256410256vw;
    background-size: 8.2051282051vw;
    background-position: left 0 top 4.6153846154vw;
  }
}
#howto .faq .faq__a p {
  font-feature-settings: "liga" off, "clig" off;
  font-style: normal;
  font-weight: 500;
}
@media (min-width: 961px) {
  #howto .faq .faq__a p {
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #howto .faq .faq__a p {
    font-size: 3.8461538462vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
    padding-right: 2.0512820513vw;
  }
}
#howto .faq .faq__a p a {
  color: var(--color-red);
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}
#howto .faq .faq__a p a:hover {
  text-decoration: none;
}

/* ===============================================
  Footer
=============================================== */
#footer {
  background: #000 url("../images/footer_bg.webp") center top no-repeat;
  background-size: 100%;
  color: #fff;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
@media (min-width: 961px) {
  #footer {
    margin-top: -335px;
    padding: 335px 0 40px;
  }
}
@media (max-width: 960px) {
  #footer {
    margin-top: -30.7692307692vw;
    padding: 28.7179487179vw 0 20.5128205128vw;
    background-image: url("../images/footer_bg_sp.webp");
  }
}
#footer .sec__ttl {
  align-items: center;
}
#footer .sec__ttl small {
  color: var(--color-red);
}
#footer .sec__ttl small::before {
  background-color: var(--color-red);
  mask-image: url(../images/icn_info.svg);
}
#footer .footbnrs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin: auto;
  width: fit-content;
}
@media (min-width: 961px) {
  #footer .footbnrs {
    gap: 24px;
    margin-top: 64px;
  }
}
@media (max-width: 960px) {
  #footer .footbnrs {
    gap: 5.641025641vw;
    margin-top: 8.2051282051vw;
    padding: 0;
    grid-template-columns: 1fr;
    width: 100%;
  }
}
#footer .footbnrs .footbnr {
  display: block;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 12px;
  overflow: hidden;
  position: relative;
}
@media (min-width: 961px) {
  #footer .footbnrs .footbnr {
    width: 360px;
  }
}
@media (max-width: 960px) {
  #footer .footbnrs .footbnr {
    width: 100%;
    border-radius: 3.0769230769vw;
  }
}
#footer .footbnrs .footbnr img {
  display: block;
  width: 100%;
  height: auto;
}
#footer .footbnrs .footbnr[target=_blank]::after {
  content: "";
  display: block;
  background-color: #747474;
  mask: url(../images/icn_external-link.svg) no-repeat center center/contain;
  position: absolute;
}
@media (min-width: 961px) {
  #footer .footbnrs .footbnr[target=_blank]::after {
    width: 20px;
    height: 20px;
    right: 10px;
    bottom: 10px;
  }
}
@media (max-width: 960px) {
  #footer .footbnrs .footbnr[target=_blank]::after {
    width: 4.8717948718vw;
    height: 4.8717948718vw;
    right: 2.4358974359vw;
    bottom: 2.4358974359vw;
  }
}
#footer .footbnrs .footbnr.bk::after {
  background-color: #fff;
}
@media (hover: hover) {
  #footer .footbnrs .footbnr {
    transition: transform 0.3s ease, filter 0.3s ease;
  }
  #footer .footbnrs .footbnr:hover {
    transform: translateY(-2px);
    filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.16));
  }
}
@media (min-width: 961px) {
  #footer .loop-slider {
    gap: 34px;
    margin-top: 80px;
  }
}
@media (max-width: 960px) {
  #footer .loop-slider {
    gap: 4.1025641026vw;
    margin-top: 9.7435897436vw;
    padding: 0 4.1025641026vw;
  }
}
@media (min-width: 961px) {
  #footer .loop-slider img {
    width: 1303px;
  }
}
@media (max-width: 960px) {
  #footer .loop-slider img {
    width: 134.358974359vw;
  }
}
@media (min-width: 961px) {
  #footer .sns {
    margin-top: 80px;
  }
}
@media (max-width: 960px) {
  #footer .sns {
    margin-top: 10.2564102564vw;
  }
}
#footer .sns h2 {
  color: #FFF;
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-family: "Fugaz One", sans-serif;
  font-style: normal;
  font-weight: 400;
}
@media (min-width: 961px) {
  #footer .sns h2 {
    font-size: 38px;
    line-height: 24px;
  }
}
@media (max-width: 960px) {
  #footer .sns h2 {
    font-size: 7.1794871795vw;
    line-height: 1;
  }
}
#footer .sns ul {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 961px) {
  #footer .sns ul {
    gap: 24px;
    margin-top: 40px;
  }
}
@media (max-width: 960px) {
  #footer .sns ul {
    gap: 6.1538461538vw;
    margin-top: 10.2564102564vw;
  }
}
@media (min-width: 961px) {
  #footer .sns ul .sns__btn img {
    width: 72px;
  }
}
@media (max-width: 960px) {
  #footer .sns ul .sns__btn img {
    width: 18.4615384615vw;
  }
}
@media (hover: hover) {
  #footer .sns ul .sns__btn img {
    transition: transform 0.1s ease;
  }
  #footer .sns ul .sns__btn:hover img {
    transform: scale(1.05);
  }
}
#footer .footer__supported {
  color: #fff;
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 700;
}
@media (min-width: 961px) {
  #footer .footer__supported {
    margin-top: 80px;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #footer .footer__supported {
    margin-top: 20.5128205128vw;
    font-size: 4.1025641026vw;
    line-height: 6.6666666667vw;
    letter-spacing: 0.1282051282vw;
  }
}
#footer .footer__copyright {
  color: #FFF;
  text-align: center;
  font-feature-settings: "pwid" on, "palt" on, "liga" off, "clig" off;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}
@media (min-width: 961px) {
  #footer .footer__copyright {
    margin-top: 8px;
    font-size: 12px;
    letter-spacing: 0.5px;
  }
}
@media (max-width: 960px) {
  #footer .footer__copyright {
    margin-top: 2.0512820513vw;
    font-size: 3.0769230769vw;
    line-height: 5.3846153846vw;
    letter-spacing: 0.1282051282vw;
  }
}

/* ===============================================
  Others
=============================================== */
.btn__pagetop {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: linear-gradient(243deg, #FFB144 5.43%, #FF1818 80.7%);
  box-shadow: 0 0 60px 0 #F00 inset, 0 24px 24px 0 rgba(0, 0, 0, 0.16);
  color: #fff;
  aspect-ratio: 1/1;
  border-radius: 50%;
  cursor: pointer;
  position: fixed;
  z-index: 500;
  transition: transform 0.3s ease;
}
@media (min-width: 961px) {
  .btn__pagetop {
    width: 88px;
    right: 42px;
    bottom: 27px;
  }
}
@media (min-width: 961px) and (max-width: 1200px) {
  .btn__pagetop {
    bottom: 110px;
  }
}
@media (max-width: 960px) {
  .btn__pagetop {
    display: none;
  }
}
.btn__pagetop img {
  width: 100%;
  filter: drop-shadow(0 24px 24px rgba(0, 0, 0, 0.16));
}
.btn__pagetop {
  opacity: 0;
  pointer-events: none;
  transform: translateY(10%);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.btn__pagetop.is-active {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.btn__pagetop:hover {
  transform: scale(1.05);
}

/* Swiper minimal styles (placeholder) */
.swiper {
  width: 100%;
}

.swiper-slide {
  background: #fff;
  border-radius: 12px;
  padding: 0;
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.12);
}

.swiper-button-prev,
.swiper-button-next {
  color: #222;
}

.swiper-pagination-bullet {
  background: #222;
  opacity: 0.3;
}

.swiper-pagination-bullet-active {
  opacity: 1;
}

/* loop-slider */
.loop-slider {
  display: flex;
  will-change: transform;
  animation: loop-marquee var(--loop-duration, 30s) linear infinite;
}

@keyframes loop-marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-1 * var(--loop-width, 0px)));
  }
}
@media (prefers-reduced-motion: reduce) {
  .loop-slider {
    animation: none;
  }
}
body._debug #fv {
  background: transparent;
}
@media (min-width: 961px) {
  body._debug {
    background: url(../images/bajyutsubu_pc2.png) no-repeat center top/1440px;
  }
}
@media (max-width: 960px) {
  body._debug {
    background: url(../images/bajyutsubu_sp2.png) no-repeat center top/100%;
  }
  body._debug .adblock {
    margin-top: 25.1282051282vw !important;
    background-color: transparent !important;
  }
  body._debug #footer {
    margin-top: 144.8717948718vw;
  }
}
