@charset "UTF-8";

/*---------------------------------------------------------------------------------
CSS構成
// 絶対に変更しないCSS
./assets/vendor/**.css

// メインで利用しているCSS
- style.css                 SCSSを集約したCSS

// SCSS構成
- external                  ./assets/vendor/**.cssを上書きする ※基本触らない
- foundation                基本の文字設定やWebフォントの読み込みなど ※基本触らない
- global                    @mixin, @function, 変数など ※基本触らない
- layout                    各ページを構成する大枠のレイアウト ※基本触らない
- object                    パーツやブロック
    ├─component             繰り返し使用される小さな単位のパーツ
    └─project               セクションや大きなブロック
- page                      下層ページ固有のスタイル
---------------------------------------------------------------------------------*/
/* ================================================================
external
================================================================ */
:root {
  /* container */
  --container-pd: max(2dvw, 40px);
  --container-value--base: 1140;
  --container-value--fluid01: 1800;
  --container-value--fluid02: 1600;
  --container-value--fluid03: 1400;
  --container-base: calc(var(--container-value--base) * 1px + var(--container-pd) * 2);
  --container-fluid01: calc(var(--container-value--fluid01) * 1px + var(--container-pd) * 2);
  --container-fluid02: calc(var(--container-value--fluid02) * 1px + var(--container-pd) * 2);
  --container-fluid03: calc(var(--container-value--fluid03) * 1px + var(--container-pd) * 2);
  --container-base--wide: calc(var(--container-value--base) / 2000 * 100dvw + var(--container-pd) * 2);
  --container-fluid01--wide: calc(var(--container-value--fluid01) / 2000 * 100dvw + var(--container-pd) * 2);
  --container-fluid02--wide: calc(var(--container-value--fluid02) / 2000 * 100dvw + var(--container-pd) * 2);
  --container-fluid03--wide: calc(var(--container-value--fluid03) / 2000 * 100dvw + var(--container-pd) * 2);
  /* space */
  --space-unit: .2dvw;
  --space-100: max(calc(var(--space-unit) * 25), 3.75rem);
  --space-section: calc(var(--space-100) * 1.36);
  --space-parallax_top: calc(var(--space-100) * 50);
  /* z-index */
  --z-back_to_top: 1000;
  --z-header: 5000;
  --z-dropdown: 6000;
  --z-fixed-cta: 7000;
  --z-nav: 8000;
  --z-hamburger: 9000;
  --z-modal: 9500;
  --loading: 9999;
  /* color */
  /* == color-primitive == */
  --base-brand-400: #7cf772;
  --base-blue-400: #000099;
  --base-green-400: #00991d;
  --base-ac_gray-400: #808080;
  --base-ac_gray-900: #333333;
  --base-yellow-400: #c79f14;
  --base-red-400: #dd2323;
  --base-black-100: #222222;
  --base-black-300: #2e2e2e;
  --base-black-400: hsl(0, 0%, 8%);
  --base-white-400: #ffffff;
  --base-white-700: #f7f7f7;
  --base-white-900: #f5f5f5;
  --base-gray-100: #e5e5e5;
  --base-gray-200: #dadada;
  --base-gray-300: #d4d4d4;
  --base-gray-400: #bfbfbf;
  --base-gray-500: #b6b6b6;
  --base-gray-600: #a7a7a7;
  --base-gray-700: #9a9a9a;
  --base-gray-800: #737373;
  --base-gray-900: #696969;
  /* == color-semantic == */
  --bg-body: var(--base-gray-100);
  --bg-body--translucent: rgba(221, 221, 221, .95);
  --bg-light: var(--base-white-400);
  --bg-middle: var(--base-gray-200);
  --bg-dark: var(--base-black-300);
  --accent-brand: var(--base-brand-400);
  --accent-futsal: var(--base-blue-400);
  --accent-tennis: var(--base-green-400);
  --accent-drone: var(--base-ac_gray-400);
  --accent-pickle: var(--base-yellow-400);
  --accent-white: var(--base-white-700);
  --accent-gray: var(--base-gray-800);
  --caution-red: var(--base-red-400);
  --button-primary: var(--base-black-400);
  --button-secondary: var(--base-white-900);
  --line-hr: var(--base-gray-500);
  --line-item: var(--base-gray-600);
  --line-button: var(--base-gray-400);
  --band-category: var(--base-gray-900);
  --table-header: var(--base-gray-300);
  --table-frame: var(--base-black-400);
  --text-black: var(--base-black-400);
  --text-white: var(--base-white-400);
  --scrollbar-bg: var(--base-gray-400);
  --scrollbar-thumb: var(--base-gray-700);
  /* background */
  --bg-noise: url(../assets/images/common/noise.png) repeat center / 100px;
  /* font */
  --ff-ja-primary: "Noto Sans JP";
  --ff-en-primary: "DM Sans";
  --ff-en-secondary: "Oswald";
  --ff-base: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    "Noto Sans JP",
    sans-serif;
  --fs-xxs: max(.5dvw, .5625rem);
  --fs-xs: max(.6dvw, .625rem);
  --fs-sm: max(.7dvw, .75rem);
  --fs-md: max(.8dvw, .875rem);
  --fs-lg: max(.9dvw, 1rem);
  --fs-xl: max(1dvw, 1.125rem);
  --fs-xxl: max(1.1dvw, 1.25rem);
  --ls-min: -0.04em;
  --ls-narrow: 0em;
  --ls-base: 0.05em;
  --ls-wide: 0.1em;
  --ls-en-primary: 0.05em;
  --lh-single: 1;
  --lh-min: 1.25;
  --lh-narrow: 1.5;
  --lh-base: 1.75;
  --lh-wide: 2.0;
  /* animation */
  --animation-button: 0.3s;
  --animation-header: 0.2s;
  --animation-hamburger: 0.5s;
  --animation-nav: 0.3s;
  --animation-banner: 0.3s;
  --animation-modal: 0.2s;
  --animation-input: 0.1s;
  --animation-fade: 1.6s;
  /* filter */
  --filter-brand: brightness(0) saturate(100%) invert(96%) sepia(75%) saturate(910%) hue-rotate(47deg) brightness(104%) contrast(94%);
  --filter-black: none;
  --filter-white: brightness(0) saturate(100%) invert(100%) sepia(4%) saturate(21%) hue-rotate(215deg) brightness(104%) contrast(100%);
  /* aspect-ratio */
  --ar-gold-primary: 1.618 / 1;
  --ar-gold-secondary: 1.7321 / 1;
  --ar-silver-primary: 1.414 / 1;
  --ar-silver-secondary: 2.414 / 1;
}

/* 
destyle-custom
---------------------------------------------------------------- */
*,
::before,
::after {
  min-width: initial;
}

/*
bootstrap-custom
---------------------------------------------------------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
  padding: 0;
  margin: 0;
  font-size: initial;
  line-height: 1;
}

hr {
  margin: initial;
  color: inherit;
  border: initial;
  border-top: initial;
  opacity: initial;
}

p {
  margin: 0;
}

address {
  margin: 0;
}

tbody,
td,
tfoot,
th,
thead,
tr {
  font-weight: 400;
  border: none;
}

a {
  color: #000;
  text-decoration: none;
}

svg,
img,
embed,
object,
iframe form {
  vertical-align: bottom;
}

figure {
  margin: initial;
}

ul,
ol,
dl {
  padding: 0;
  margin: 0;
}

dt,
dd {
  margin: 0;
  font-weight: 400;
}

.shadow {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.card {
  border: none;
}

.icon-link {
  display: initial;
  gap: initial;
  -webkit-box-align: initial;
  -ms-flex-align: initial;
  align-items: initial;
  text-decoration-color: initial;
  text-underline-offset: initial;
  -webkit-backface-visibility: initial;
  backface-visibility: initial;
}

.lead {
  font-size: inherit;
  font-weight: initial;
}

.table> :not(caption)>*>* {
  padding: inherit;
  color: inherit;
  background-color: inherit;
  border-bottom-width: inherit;
  -webkit-box-shadow: inherit;
  box-shadow: inherit;
}

.bg-white {
  --bs-bg-opacity: initial;
  background-color: initial !important;
}

/* ================================================================
foundation
================================================================ */
/*
base
---------------------------------------------------------------- */
html {
  font-size: 1rem;
  overflow-x: clip;
}

body {
  font-family: YakuHanJP, var(--ff-ja-primary), var(--ff-base);
  font-size: var(--fs-md);
  letter-spacing: var(--ls-base);
  color: var(--text-black);
  font-feature-settings: "palt";
  -webkit-font-feature-settings: "palt";
  background: var(--bg-noise) var(--bg-body);
  overflow-wrap: anywhere;
  word-break: normal;
  line-break: strict;
  overflow-x: clip;
}

div {
  line-height: var(--lh-single);
}

p {
  line-height: var(--lh-base);
}

a {
  display: inline-block;
  color: var(--text-black);
}

@media (any-hover: hover) {
  a[href^="tel:"] {
    pointer-events: none;
    cursor: text;
  }
}

img,
picture {
  display: inline-block;
  width: 100%;
  height: auto;
}

svg {
  display: inline-block;
}

use {
  display: inline-block;
  width: 100%;
  height: auto;
}

/* form */
::-webkit-input-placeholder {
  color: var(--accent-gray);
}

::-moz-placeholder {
  color: var(--accent-gray);
}

:-ms-input-placeholder {
  color: var(--accent-gray);
}

::-ms-input-placeholder {
  color: var(--accent-gray);
}

::placeholder {
  color: var(--accent-gray);
}

.label-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0.5em 1em;
}

label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.5em;
}

label>span {
  margin-bottom: 0.25em;
  line-height: var(--lh-single);
  white-space: nowrap;
}

label>input {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

input:not([type=file]),
input:not([type=checkbox]),
input:not([type=radio]),
textarea,
select {
  padding: 0.725em 0.725em 0.775em;
  background: var(--text-white);
  border: 1px solid var(--band-category);
  border-radius: 2px;
  font-size: 0.875em;
  -webkit-transition: -webkit-filter var(--animation-button);
  transition: -webkit-filter var(--animation-button);
  transition: filter var(--animation-button);
  transition: filter var(--animation-button), -webkit-filter var(--animation-button);
}

input:not([type=file]):focus,
input:not([type=checkbox]):focus,
input:not([type=radio]):focus,
textarea:focus,
select:focus {
  -webkit-filter: brightness(0.975);
  filter: brightness(0.975);
}

@media (any-hover: hover) {

  input:not([type=file]):hover,
  input:not([type=checkbox]):hover,
  input:not([type=radio]):hover,
  textarea:hover,
  select:hover {
    -webkit-filter: brightness(0.975);
    filter: brightness(0.975);
  }
}

input:not([type=file]),
textarea {
  width: 100%;
}

textarea {
  height: 8lh;
  line-height: var(--lh-base);
}

label:has(input[type=checkbox]),
label:has(input[type=radio]) {
  font-size: 1em;
  cursor: pointer;
}

input[type=radio],
input[type=checkbox] {
  width: 1.25em;
  aspect-ratio: 1/1;
  padding: 0;
  border: solid 1px var(--band-category);
  background: var(--text-white);
  border-radius: 1px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  cursor: pointer;
}

input[type=radio] {
  border-radius: 50%;
}

input[type=radio]::before {
  -webkit-transition: opacity var(--animation-input);
  transition: opacity var(--animation-input);
  opacity: 1;
  -webkit-animation: radioChecked 0.2s forwards;
  animation: radioChecked 0.2s forwards;
}

@-webkit-keyframes radioChecked {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes radioChecked {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

input[type=radio]:checked::before {
  content: "";
  display: block;
  width: 60%;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: var(--text-black);
  opacity: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

input[type=checkbox]::before {
  content: "";
  display: block;
  width: 1.2em;
  aspect-ratio: 2/1;
  border-left: 0.275em solid var(--text-black);
  border-bottom: 0.275em solid var(--text-black);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  opacity: 0;
  -webkit-transition: opacity var(--animation-input);
  transition: opacity var(--animation-input);
  position: absolute;
  top: 0.1em;
}

input[type=checkbox]:checked::before {
  opacity: 1;
}

.select-wrapper {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
}

.select-wrapper::before {
  content: "";
  display: block;
  width: 0.5em;
  aspect-ratio: 2/1;
  background: var(--text-black);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  position: absolute;
  z-index: 10;
  top: 50%;
  right: 0.75em;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.select-wrapper select {
  padding-right: 1.75em;
}

.page-confirmation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 0.5em;
}

@media screen and (max-width: 576px) {
  .page-confirmation {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }
}

/*
br
---------------------------------------------------------------- */
/* === .br === */
.br-sm {
  display: none;
}

@media screen and (max-width: 576px) {
  .br-sm {
    display: block;
  }
}

.br-md {
  display: none;
}

@media screen and (max-width: 768px) {
  .br-md {
    display: block;
  }
}

.br-lg {
  display: none;
}

@media screen and (max-width: 992px) {
  .br-lg {
    display: block;
  }
}

.br-xl {
  display: none;
}

@media screen and (max-width: 1200px) {
  .br-xl {
    display: block;
  }
}

.br-xxl {
  display: none;
}

@media screen and (max-width: 1400px) {
  .br-xxl {
    display: block;
  }
}

/* === .br-none === */
@media screen and (max-width: 575px) {
  .br-none-sm {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .br-none-md {
    display: none;
  }
}

@media screen and (max-width: 991px) {
  .br-none-lg {
    display: none;
  }
}

@media screen and (max-width: 1199px) {
  .br-none-xl {
    display: none;
  }
}

@media screen and (max-width: 1399px) {
  .br-none-xxl {
    display: none;
  }
}

/*
animation
---------------------------------------------------------------- */
/* .js-fadeUp */
.js-fadeUp {
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(12px);
  transform: translateY(12px);
}

.js-fadeUp.is-animated {
  -webkit-animation-name: fadeUp;
  animation-name: fadeUp;
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-timing-function: ease;
  animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes fadeUp {
  0% {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(12px);
    transform: translateY(12px);
  }

  80% {
    opacity: 1;
    visibility: visible;
  }

  100% {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeUp {
  0% {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(12px);
    transform: translateY(12px);
  }

  80% {
    opacity: 1;
    visibility: visible;
  }

  100% {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/* .js-fadeIn */
.js-fadeIn {
  opacity: 0;
  visibility: hidden;
}

.js-fadeIn.is-animated {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
    visibility: hidden;
  }

  100% {
    opacity: 1;
    visibility: visible;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
    visibility: hidden;
  }

  100% {
    opacity: 1;
    visibility: visible;
  }
}

/* === animation-custom === */
/* delay */
@media screen and (min-width: 768px) {
  .animation-delay-1 {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-2 {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-3 {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-4 {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-5 {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-6 {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-7 {
    -webkit-animation-delay: 0.7s;
    animation-delay: 0.7s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-8 {
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-9 {
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-10 {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-11 {
    -webkit-animation-delay: 1.1s;
    animation-delay: 1.1s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-12 {
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-13 {
    -webkit-animation-delay: 1.3s;
    animation-delay: 1.3s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-14 {
    -webkit-animation-delay: 1.4s;
    animation-delay: 1.4s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-15 {
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-16 {
    -webkit-animation-delay: 1.6s;
    animation-delay: 1.6s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-17 {
    -webkit-animation-delay: 1.7s;
    animation-delay: 1.7s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-18 {
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-19 {
    -webkit-animation-delay: 1.9s;
    animation-delay: 1.9s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-20 {
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-21 {
    -webkit-animation-delay: 2.1s;
    animation-delay: 2.1s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-22 {
    -webkit-animation-delay: 2.2s;
    animation-delay: 2.2s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-23 {
    -webkit-animation-delay: 2.3s;
    animation-delay: 2.3s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-24 {
    -webkit-animation-delay: 2.4s;
    animation-delay: 2.4s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-25 {
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-26 {
    -webkit-animation-delay: 2.6s;
    animation-delay: 2.6s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-27 {
    -webkit-animation-delay: 2.7s;
    animation-delay: 2.7s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-28 {
    -webkit-animation-delay: 2.8s;
    animation-delay: 2.8s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-29 {
    -webkit-animation-delay: 2.9s;
    animation-delay: 2.9s;
  }
}

@media screen and (min-width: 768px) {
  .animation-delay-30 {
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
  }
}

/* duration */
.is-animated.animation-duration-1 {
  -webkit-animation-duration: 0.1s;
  animation-duration: 0.1s;
}

.is-animated.animation-duration-2 {
  -webkit-animation-duration: 0.2s;
  animation-duration: 0.2s;
}

.is-animated.animation-duration-3 {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
}

.is-animated.animation-duration-4 {
  -webkit-animation-duration: 0.4s;
  animation-duration: 0.4s;
}

.is-animated.animation-duration-5 {
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
}

.is-animated.animation-duration-6 {
  -webkit-animation-duration: 0.6s;
  animation-duration: 0.6s;
}

.is-animated.animation-duration-7 {
  -webkit-animation-duration: 0.7s;
  animation-duration: 0.7s;
}

.is-animated.animation-duration-8 {
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
}

.is-animated.animation-duration-9 {
  -webkit-animation-duration: 0.9s;
  animation-duration: 0.9s;
}

.is-animated.animation-duration-10 {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}

.is-animated.animation-duration-11 {
  -webkit-animation-duration: 1.1s;
  animation-duration: 1.1s;
}

.is-animated.animation-duration-12 {
  -webkit-animation-duration: 1.2s;
  animation-duration: 1.2s;
}

.is-animated.animation-duration-13 {
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
}

.is-animated.animation-duration-14 {
  -webkit-animation-duration: 1.4s;
  animation-duration: 1.4s;
}

.is-animated.animation-duration-15 {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
}

.is-animated.animation-duration-16 {
  -webkit-animation-duration: 1.6s;
  animation-duration: 1.6s;
}

.is-animated.animation-duration-17 {
  -webkit-animation-duration: 1.7s;
  animation-duration: 1.7s;
}

.is-animated.animation-duration-18 {
  -webkit-animation-duration: 1.8s;
  animation-duration: 1.8s;
}

.is-animated.animation-duration-19 {
  -webkit-animation-duration: 1.9s;
  animation-duration: 1.9s;
}

.is-animated.animation-duration-20 {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.is-animated.animation-duration-21 {
  -webkit-animation-duration: 2.1s;
  animation-duration: 2.1s;
}

.is-animated.animation-duration-22 {
  -webkit-animation-duration: 2.2s;
  animation-duration: 2.2s;
}

.is-animated.animation-duration-23 {
  -webkit-animation-duration: 2.3s;
  animation-duration: 2.3s;
}

.is-animated.animation-duration-24 {
  -webkit-animation-duration: 2.4s;
  animation-duration: 2.4s;
}

.is-animated.animation-duration-25 {
  -webkit-animation-duration: 2.5s;
  animation-duration: 2.5s;
}

.is-animated.animation-duration-26 {
  -webkit-animation-duration: 2.6s;
  animation-duration: 2.6s;
}

.is-animated.animation-duration-27 {
  -webkit-animation-duration: 2.7s;
  animation-duration: 2.7s;
}

.is-animated.animation-duration-28 {
  -webkit-animation-duration: 2.8s;
  animation-duration: 2.8s;
}

.is-animated.animation-duration-29 {
  -webkit-animation-duration: 2.9s;
  animation-duration: 2.9s;
}

.is-animated.animation-duration-30 {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

/* ================================================================
layout
================================================================ */
/* .l-wrapper */
.l-wrapper {
  min-height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* .l-header */
.l-header {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--z-header);
}

/* .l-main */
.l-main {
  /* l-main内の要素が存在しない場合、
     親要素のサイズをl-mainに割り当てる */
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

/* .l-container */
.l-container {
  max-width: var(--container-base);
  padding-inline: var(--container-pd);
  margin-inline: auto;
}

@media screen and (min-width: 2001px) {
  .l-container {
    max-width: var(--container-base--wide);
  }
}

.l-container .ct-fluid01 {
  margin-inline: calc(50% - 50dvw);
}

.l-container .ct-fluid01>.inner {
  max-width: var(--container-fluid01);
  margin-inline: auto;
  padding-inline: var(--container-pd);
}

@media screen and (min-width: 2001px) {
  .l-container .ct-fluid01>.inner {
    max-width: var(--container-fluid01--wide);
  }
}

.l-container .ct-fluid02 {
  margin-inline: calc(50% - 50dvw);
}

.l-container .ct-fluid02>.inner {
  max-width: var(--container-fluid02);
  margin-inline: auto;
  padding-inline: var(--container-pd);
}

@media screen and (min-width: 2001px) {
  .l-container .ct-fluid02>.inner {
    max-width: var(--container-fluid02--wide);
  }
}

.l-container .ct-fluid03 {
  margin-inline: calc(50% - 50dvw);
}

.l-container .ct-fluid03>.inner {
  max-width: var(--container-fluid03);
  margin-inline: auto;
  padding-inline: var(--container-pd);
}

@media screen and (min-width: 2001px) {
  .l-container .ct-fluid03>.inner {
    max-width: var(--container-fluid03--wide);
  }
}

@media screen and (max-width: 768px) {
  .l-container {
    max-width: 100%;
    padding-inline: 5%;
  }

  .l-container .ct-fluid01>.inner,
  .l-container .ct-fluid02>.inner,
  .l-container .ct-fluid03>.inner {
    max-width: 100%;
    padding-inline: 5%;
  }
}

/* .l-footer */
.l-footer {
  /* 1ページ内のコンテンツ高さが100vhに満たない場合
     p-footerを画面最下部に寄せる */
  justify-self: end;
}

/* ================================================================
object
================================================================ */
/*
.c-band
---------------------------------------------------------------- */
.c-band {
  display: inline-block;
  padding: 0.4em;
  padding-bottom: 0.45em;
}

.c-band.role-category {
  color: var(--text-white);
  background: var(--band-category);
}

.c-band.italic {
  padding: 0.2em 0.5em 0.25em;
  font-style: italic;
  font-weight: 700;
  line-height: var(--lh-single);
  clip-path: polygon(0.5em 0%, 100% 0%, calc(100% - 0.5em) 100%, 0% 100%);
}

/*
.c-desc
---------------------------------------------------------------- */
.c-desc {
  line-height: var(--lh-base);
  text-align: justify;
  -moz-text-align-last: left;
  text-align-last: left;
}

.c-desc p:not(:first-child) {
  margin-top: 0.75em;
}

/*
.c-ul
---------------------------------------------------------------- */
.c-ul li {
  padding-left: 1.15em;
  line-height: var(--lh-narrow);
  position: relative;
}

.c-ul li::before {
  content: "";
  display: block;
  width: 0.25em;
  aspect-ratio: 1/1;
  background: var(--text-black);
  position: absolute;
  top: calc(1em * var(--lh-narrow) / 2 - 0.125em + 0.05em);
  left: 0.375em;
}

.c-ul li:not(:first-child) {
  margin-top: 0.4em;
}

/*
.c-ol
---------------------------------------------------------------- */
.c-ol {
  counter-reset: my-counter;
  margin-top: 0.5em;
}

.c-ol li {
  padding-left: 1.5em;
  line-height: var(--lh-narrow);
  position: relative;
}

.c-ol li::before {
  content: counter(my-counter);
  counter-increment: my-counter;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 1.35em;
  aspect-ratio: 1/1;
  border: 1px solid var(--text-black);
  border-radius: 50%;
  font-family: var(--ff-en-primary);
  font-size: 0.75em;
  font-weight: 500;
  position: absolute;
  top: calc(1.35em * var(--lh-narrow) / 2);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
}

.c-ol li:not(:first-of-type) {
  margin-top: 0.25em;
}

/*
.c-dl
---------------------------------------------------------------- */
.c-dl>div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  white-space: nowrap;
  line-height: var(--lh-narrow);
}

.c-dl>div:not(:first-of-type) {
  margin-top: 0.25em;
}

.c-dl dt::after {
  content: "：";
  display: inline-block;
  margin-inline: 0.25em;
}

/*
.c-scroll-down
---------------------------------------------------------------- */
.c-scroll-down {
  position: relative;
}

.c-scroll-down>svg {
  width: max(7dvw, 100px);
  margin: max(0.5dvw, 9px);
  overflow: visible;
  -webkit-animation: scrollDownRotate 18s linear infinite;
  animation: scrollDownRotate 18s linear infinite;
}

@-webkit-keyframes scrollDownRotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes scrollDownRotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.c-scroll-down textPath {
  font-family: var(--ff-en-primary);
  font-weight: 200;
  font-size: max(0.5dvw, 9px);
  fill: var(--text-white);
}

.c-scroll-down::before {
  content: "";
  width: 6.8%;
  aspect-ratio: 6.7/5.02;
  -webkit-mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  background: var(--text-white);
  opacity: 0.7;
  position: absolute;
  margin: auto;
  inset: 0;
}

/*
.c-button
---------------------------------------------------------------- */
.c-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: max(18dvw, 16.25rem);
  padding: 1.75em 1.25em;
  border: 1px solid transparent;
  border-radius: 2px;
  font-weight: 500;
  -webkit-transition: opacity var(--animation-button), -webkit-filter var(--animation-button);
  transition: opacity var(--animation-button), -webkit-filter var(--animation-button);
  transition: opacity var(--animation-button), filter var(--animation-button);
  transition: opacity var(--animation-button), filter var(--animation-button), -webkit-filter var(--animation-button);
}

.c-button .arrow {
  width: 0.72em;
  aspect-ratio: 1/1;
  -webkit-mask: url(../assets/images/common/arrow-button.svg) no-repeat center/contain;
  mask: url(../assets/images/common/arrow-button.svg) no-repeat center/contain;
}

@media screen and (max-width: 576px) {
  .c-button {
    max-width: 300px;
    width: 100%;
  }
}

@media (any-hover: hover) {
  .c-button:hover {
    opacity: 0.85;
  }
}

.c-button.bg-black {
  background: var(--button-primary);
  font-weight: 500;
  color: var(--text-white);
}

.c-button.bg-black .arrow {
  background: var(--accent-brand);
}

.c-button.bg-white {
  border-color: var(--line-button);
  background: var(--button-secondary) !important;
  color: var(--text-black);
}

.c-button.bg-white .arrow {
  background: var(--text-black);
}

@media (any-hover: hover) {
  .c-button.bg-white:hover {
    -webkit-filter: brightness(0.95);
    filter: brightness(0.95);
  }
}

.c-button.role-reception {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: max(10dvw, 12.5rem);
  padding: 1.4285714286em 1em;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--text-white);
}

.c-button.role-reception>.arrow {
  width: 0.72em;
  aspect-ratio: 1/1;
  -webkit-mask: url(../assets/images/common/arrow-button.svg) no-repeat center/contain;
  mask: url(../assets/images/common/arrow-button.svg) no-repeat center/contain;
  background: var(--text-white);
}

.c-button[href*="tel:"]>.text {
  width: 100%;
  margin-right: 1em;
  margin-bottom: -0.1em;
  text-align: center;
  font-family: var(--ff-en-primary);
  font-size: var(--fs-xl);
  font-weight: 500;
}

.c-button[href*="tel:"]>.icon {
  width: 1em;
  aspect-ratio: 1/1;
  -webkit-mask: url(../assets/images/common/icon-tel.svg) no-repeat center/contain;
  mask: url(../assets/images/common/icon-tel.svg) no-repeat center/contain;
  background: var(--accent-brand);
}

/*
.c-section-title
---------------------------------------------------------------- */
.c-section-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  margin-bottom: calc(var(--space-100) * 0.6);
  white-space: nowrap;
  position: relative;
}

.c-section-title::before {
  content: attr(data-en);
  font-family: var(--ff-en-primary);
  font-size: max(11dvw, 160px);
  font-weight: 800;
  color: var(--accent-white);
  line-height: 0.75;
  white-space: pre;
  opacity: 0.6;
  position: absolute;
  z-index: -10;
}

.c-section-title .ja {
  margin-bottom: 0.75em;
  font-size: var(--fs-md);
  font-weight: 500;
}

.c-section-title .ja::before {
  content: "- ";
}

.c-section-title .en {
  font-family: var(--ff-en-primary);
  font-size: max(4dvw, 60px);
  font-weight: 800;
  line-height: 0.75;
}

.c-section-title[class*=left-] {
  text-align: start;
}

.c-section-title[class*=left-]::before {
  left: 100%;
}

.c-section-title[class*=right-] {
  text-align: end;
}

.c-section-title[class*=right-]::before {
  right: 100%;
}

.c-section-title[class*=-start]::before {
  top: 0;
}

.c-section-title[class*=-center]::before {
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.c-section-title[class*=-end]::before {
  bottom: 0;
}

@media screen and (max-width: 576px) {
  .c-section-title::before {
    font-size: max(17.3611111111dvw, 5.25rem);
    opacity: 0.5;
  }

  .c-section-title .en {
    font-size: max(10.4166666667dvw, 3.25rem);
  }

  .c-section-title[class*=left-],
  .c-section-title[class*=right-],
  .c-section-title[class*=-start],
  .c-section-title[class*=-center],
  .c-section-title[class*=-end] {
    text-align: start;
  }

  .c-section-title[class*=left-]::before,
  .c-section-title[class*=right-]::before,
  .c-section-title[class*=-start]::before,
  .c-section-title[class*=-center]::before,
  .c-section-title[class*=-end]::before {
    inset: initial !important;
    bottom: 25% !important;
    right: -10% !important;
  }
}

.c-section-title[data-en=INSTAGRAM] {
  margin-bottom: calc(var(--space-100) * 1.2);
}

/*
.c-md-title
---------------------------------------------------------------- */
.c-md-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 0.25em 1em;
  margin-bottom: 0.8em;
  font-size: var(--fs-lg);
  font-weight: 500;
  line-height: var(--lh-narrow);
}

@media screen and (max-width: 768px) {
  .c-md-title {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
  }
}

.c-md-title .main {
  font-weight: 500;
}

.c-md-title .main .small {
  margin-inline: 0.2222222222em;
  font-size: 0.8888888889em;
}

.c-md-title .sub {
  font-size: var(--fs-sm);
}

/*
.c-page-title
---------------------------------------------------------------- */
.c-page-title {
  position: relative;
}

.c-page-title>.inner {
  margin-top: 0 !important;
}

.c-page-title .loop-text {
  margin-inline: calc(50% - 50dvw);
  font-size: max(16.5dvw, 180px);
  color: var(--text-black);
  opacity: 0.05;
  position: absolute;
  z-index: -10;
  top: calc(54% - 0.375em);
}

.c-page-title .section-title {
  padding-top: calc(var(--space-100) * 2);
}

.c-page-title .section-title .ja {
  font-size: max(1dvw, 16px);
  font-weight: 700;
}

.c-page-title .section-title .en {
  font-size: max(4.5dvw, 68px);
}

/*
.c-paging
---------------------------------------------------------------- */
.c-paging {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5em;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 2em;
  font-family: var(--ff-en-primary);
}

.c-paging .paging-text {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: grid;
  place-content: center;
}

.c-paging .paging-text>a {
  display: grid;
  place-content: center;
  width: 1.5em;
  aspect-ratio: 1/1;
}

.c-paging .paging-text>a[rel=prev],
.c-paging .paging-text>a[rel=next] {
  width: 2em;
  aspect-ratio: 1/1;
  background: var(--text-black);
  border-radius: 50%;
}

.c-paging .paging-text>a .arrow::before {
  content: "";
  display: block;
  width: 0.5em;
  aspect-ratio: 6.7/5.02;
  -webkit-mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  background: var(--text-white);
}

.c-paging .paging-text>a[rel=prev] .arrow::before {
  rotate: 90deg;
}

.c-paging .paging-text>a[rel=next] .arrow::before {
  rotate: -90deg;
}

.c-paging .paging-text.current {
  width: 1.5em;
  position: relative;
}

.c-paging .paging-text.current::before {
  content: "";
  display: block;
  width: 75%;
  height: 1px;
  background: var(--text-black);
  position: absolute;
  bottom: -0.5em;
  left: 12.5%;
}

/*
.c-file
---------------------------------------------------------------- */
.c-file {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-column-gap: 0.4em;
  -moz-column-gap: 0.4em;
  column-gap: 0.4em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.5em 0.6em;
  background: var(--text-black);
  font-weight: 500;
}

.c-file>.icon {
  width: 0.8461538462em;
  aspect-ratio: 384/512;
  -webkit-mask: url(../assets/images/common/icon-file.svg) no-repeat center/contain;
  mask: url(../assets/images/common/icon-file.svg) no-repeat center/contain;
  background: var(--accent-brand);
}

.c-file>.text {
  margin-bottom: 0.15em;
  color: var(--text-white);
}

/*
.c-hr
---------------------------------------------------------------- */
.c-hr {
  margin: calc(var(--space-100) * 1.36) calc(50% - 50dvw);
  border-bottom: 1px dashed var(--line-hr);
  opacity: 0.75;
}

/*
.c-hamburger
---------------------------------------------------------------- */
.c-hamburger {
  display: block;
  width: max(3.4dvw, 68px);
  aspect-ratio: 1/1;
  background: var(--accent-brand);
  border-radius: max(0.4032258065dvw, 2px);
  position: relative;
  z-index: var(--z-hamburger);
}

@media screen and (max-width: 992px) {
  .c-hamburger {
    width: max(6.8548387097dvw, 56px);
  }
}

.c-hamburger span {
  display: block;
  width: 44.1176470588%;
  height: 2px;
  background: var(--text-black);
  position: absolute;
  left: 27.9411764706%;
  -webkit-transition: var(--animation-hamburger);
  transition: var(--animation-hamburger);
}

.c-hamburger span:nth-child(1) {
  top: 38.2352941176%;
}

.c-hamburger span:nth-child(2) {
  top: calc(50% - 1px);
}

.c-hamburger span:nth-child(3) {
  bottom: 38.2352941176%;
}

.c-hamburger.is-active span:nth-child(1) {
  top: 48.5294117647%;
  rotate: 45deg;
}

.c-hamburger.is-active span:nth-child(2) {
  opacity: 0;
}

.c-hamburger.is-active span:nth-child(3) {
  bottom: 48.5294117647%;
  rotate: -45deg;
}

/*
.c-content-table
---------------------------------------------------------------- */
.c-content-table {
  font-size: max(0.75dvw, 0.875rem);
}

.c-content-table .table-header {
  margin-bottom: 1.3333333333em;
  padding-inline: 1em;
  font-size: var(--fs-lg);
  background: var(--text-black);
  color: var(--text-white);
}

@media screen and (max-width: 768px) {
  .c-content-table .table-header {
    font-size: 1.1em;
  }
}

.c-content-table .table-list {
  display: grid;
  gap: 2.6666666667em max(4dvw, 1em);
}

.c-content-table .table-list.grid-col-2 {
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
}

@media screen and (max-width: 576px) {
  .c-content-table .table-list.grid-col-2 {
    grid-template-columns: minmax(0, 1fr);
  }
}

.c-content-table .table-list+.table-list {
  margin-top: 2.6666666667em;
}

.c-content-table .table-item {
  min-width: 0;
}

.c-content-table .table-wrapper {
  white-space: nowrap;
}

.c-content-table table {
  width: 100%;
  border: 1px dashed var(--table-frame);
  border-collapse: collapse;
  text-align: center;
}

.c-content-table th,
.c-content-table td {
  padding: 1.6em;
  border: 1px dashed var(--table-frame);
  font-weight: 500;
  vertical-align: middle;
}

.c-content-table th .small,
.c-content-table td .small {
  display: block;
  font-size: 0.8em;
  margin-top: 0.4em;
  line-height: var(--lh-min);
}

.c-content-table th .file,
.c-content-table td .file {
  font-size: max(0.65dvw, 0.6875rem);
}

.c-content-table th {
  background: var(--table-header);
}

.c-content-table td.cell-file {
  padding-inline: 0.8em;
}

.c-content-table .price-list .price-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.c-content-table .price-list .price-item:not(:first-child) {
  margin-top: 0.25em;
}

.c-content-table .price-list dt,
.c-content-table .price-list dd {
  font-weight: 500;
}

.c-content-table .price-list dt::after {
  content: "：";
}

.c-content-table .note {
  margin: 1em 0 0 1em;
  font-size: var(--fs-sm);
}

@media screen and (max-width: 576px) {
  .c-content-table .note {
    margin: 0.75em 0 0;
  }
}

.c-content-table .note .note-item {
  padding-left: 1.15em;
  line-height: var(--lh-base);
  position: relative;
}

.c-content-table .note .note-item::before {
  content: "※";
  position: absolute;
  left: 0;
  top: 0;
}

.c-content-table .note .note-item.red {
  font-weight: 500;
  color: var(--caution-red);
}

/*
.c-form-table
---------------------------------------------------------------- */
.c-form-table {
  container-name: c-form-table;
  container-type: inline-size;
}

.c-form-table table {
  width: 100%;
  line-height: var(--lh-min);
}

@container c-form-table (max-width: 700px) {

  .c-form-table table th,
  .c-form-table table td {
    display: block;
    width: 100%;
    padding: 0;
  }

  .c-form-table table th {
    margin-top: 1.25em;
    padding-bottom: 0;
    padding-left: 0.75em;
    border-bottom: none;
    position: relative;
  }

  .c-form-table table th::before {
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    background: var(--band-category);
    position: absolute;
    left: 0;
  }

  .c-form-table table td {
    padding-block: 0.9em 1.25em;
  }
}

.c-form-table th,
.c-form-table td {
  padding: 1.5em 0.75em;
  vertical-align: middle;
}

.c-form-table th {
  width: 25%;
  border-bottom: 1px solid var(--band-category);
  font-weight: 500;
  min-width: 40%;
}

.c-form-table td {
  padding-left: 2em;
  border-bottom: 1px solid var(--table-header);
}

.c-form-table tr:has(*[required]) th::after {
  content: " *必須";
  font-size: 0.75em;
  font-weight: 500;
  color: var(--caution-red);
  vertical-align: top;
}

/*
.c-scroll-box
---------------------------------------------------------------- */
.c-scroll-box {
  padding-right: max(5.4054054054%, 20px);
  overflow-y: auto;
}

@media screen and (max-width: 576px) {
  .c-scroll-box {
    margin-right: -1.15%;
  }
}

.c-scroll-box::-webkit-scrollbar {
  width: 8px;
}

@media screen and (max-width: 576px) {
  .c-scroll-box::-webkit-scrollbar {
    width: 5px;
  }
}

.c-scroll-box::-webkit-scrollbar-track {
  background-color: var(--scrollbar-bg);
  border-radius: 100px;
}

.c-scroll-box::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb);
  border-radius: 100px;
}

/*
.c-tab-switching
---------------------------------------------------------------- */
.c-tab-switching .switching-area {
  display: none;
  opacity: 0;
}

.c-tab-switching .switching-area.is-active {
  display: block;
  -webkit-animation-name: displayAnime;
  animation-name: displayAnime;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes displayAnime {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes displayAnime {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/*
.c-logo
---------------------------------------------------------------- */
.c-logo>a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: end;
  gap: 0.15em;
  font-family: var(--ff-en-secondary);
  font-size: max(2dvw, 2rem);
}

.c-logo .img {
  height: max(2dvw, 2rem);
  aspect-ratio: 185/39;
}

.c-logo .text {
  margin-bottom: 0.05em;
  font-size: 0.6em;
  font-weight: 400;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/*
.c-banner
---------------------------------------------------------------- */
.c-banner {
  width: 100%;
  position: relative;
  container-name: c-banner;
  container-type: inline-size;
}

@media (any-hover: hover) {
  .c-banner:hover .img::before {
    opacity: 0.4;
  }
}

.c-banner .img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  aspect-ratio: var(--ar-silver-secondary);
  position: relative;
}

@container c-banner (width <=800px) {
  .c-banner .img {
    aspect-ratio: var(--ar-gold-primary);
  }
}

.c-banner .img::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.4;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  -webkit-transition: var(--animation-button);
  transition: var(--animation-button);
}

.c-banner>.text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin: auto;
  padding-top: 0.75em;
  color: var(--text-white);
  position: absolute;
  z-index: 10;
  inset: 0;
}

.c-banner>.text>.title {
  margin-top: 0.75em;
  text-decoration: underline;
}

/*
.c-page-banner
---------------------------------------------------------------- */
.c-page-banner>a {
  display: grid;
  height: 100%;
  padding: 9%;
  background: url() no-repeat center/cover;
  position: relative;
}

.c-page-banner>a[href*="tennis.html"] {
  background-image: url(../assets/images/top/banner-tennis.jpg);
}

.c-page-banner>a[href*="tennis.html"]::before,
.c-page-banner>a[href*="tennis.html"] .ja {
  background: var(--accent-tennis);
}

.c-page-banner>a[href*="futsal.html"] {
  background-image: url(../assets/images/top/banner-futsal.jpg);
}

.c-page-banner>a[href*="futsal.html"]::before,
.c-page-banner>a[href*="futsal.html"] .ja {
  background: var(--accent-futsal);
}

.c-page-banner>a[href*="pickle.html"] {
  background-image: url(../assets/images/top/banner-pickle.jpg);
}

.c-page-banner>a[href*="pickle.html"]::before,
.c-page-banner>a[href*="pickle.html"] .ja {
  background: var(--accent-pickle);
}

.c-page-banner>a[href*="drone.html"] {
  background-image: url(../assets/images/top/banner-drone.jpg);
}

.c-page-banner>a[href*="drone.html"]::before,
.c-page-banner>a[href*="drone.html"] .ja {
  background: var(--accent-drone);
}

.c-page-banner>a::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-transition: opacity var(--animation-button);
  transition: opacity var(--animation-button);
  position: absolute;
  top: 0;
  left: 0;
}

@media (any-hover: hover) {
  .c-page-banner>a:hover::before {
    opacity: 0.4;
  }
}

.c-page-banner .title {
  color: var(--text-white);
  letter-spacing: var(--ls-narrow);
  position: relative;
  z-index: 10;
  white-space: nowrap;
}

.c-page-banner .title .en {
  font-family: var(--ff-en-secondary);
  font-size: max(4.7dvw, 74px);
  font-weight: 600;
}

@media screen and (max-width: 1200px) {
  .c-page-banner .title .en {
    font-size: max(6.1666666667dvw, 54px);
  }
}

.c-page-banner .title .ja {
  margin-top: 0.5em;
  padding: 0.1em 0.75em 0.125em;
  font-size: max(1dvw, 16px);
  font-weight: 700;
}

.c-page-banner .circle-arrow {
  place-self: end;
}

.c-page-banner .circle-arrow .circle {
  border-style: dashed;
}

.c-page-banner.half .title .en {
  font-size: max(3.2dvw, 40px);
}

.c-page-banner.half .title .ja {
  font-size: max(0.9dvw, 14px);
}

/*
.c-circle-arrow
---------------------------------------------------------------- */
.c-circle-arrow .circle {
  width: 6em;
  aspect-ratio: 1/1;
  border-radius: 50%;
  border: 1px solid var(--text-white);
  position: relative;
}

.c-circle-arrow .circle::before {
  content: "";
  width: 0.8em;
  aspect-ratio: 1/1;
  -webkit-mask: url(../assets/images/common/arrow-button.svg) no-repeat center/contain;
  mask: url(../assets/images/common/arrow-button.svg) no-repeat center/contain;
  background: var(--text-white);
  position: absolute;
  margin: auto;
  inset: 0;
}

/*
.c-topics-info
---------------------------------------------------------------- */
.c-topics-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.5em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
}

.c-topics-info .date {
  margin-bottom: -0.1em;
  font-family: var(--ff-en-primary);
  letter-spacing: var(--ls-narrow);
}

.c-topics-info .category {
  font-size: 0.875em;
}

.c-topics-info.is-latest::before {
  content: "NEW";
  display: inline-block;
  margin-left: 0.5em;
  font-family: var(--ff-en-primary);
  font-size: 0.875em;
  font-style: italic;
  font-weight: 500;
  white-space: nowrap;
  position: absolute;
  left: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

/*
.c-parallax
---------------------------------------------------------------- */
.c-parallax {
  height: max(32dvw, 400px);
  margin: calc(var(--space-100) * 2) calc(50% - 50dvw) 0;
  position: relative;
}

.c-parallax>.inner {
  width: 100%;
  height: 100%;
  clip-path: inset(0);
  position: absolute;
  z-index: -10;
  top: 0;
  left: 0;
}

.c-parallax .img {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: -10;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/*
.c-faq
---------------------------------------------------------------- */
.c-faq .question>.inner,
.c-faq .answer>.inner {
  padding: 1.5em 2em 1.5em calc(max(2dvw, 32px) * 2);
  font-weight: 500;
  line-height: var(--ls-base);
  position: relative;
}

.c-faq .question>.inner::before,
.c-faq .answer>.inner::before {
  display: grid;
  place-items: center;
  width: 2em;
  height: 1em;
  font-family: var(--ff-en-primary);
  font-size: max(2dvw, 32px);
  font-weight: 900;
  position: absolute;
  top: calc(50% - max(2dvw, 32px) / 2);
  left: 0;
}

.c-faq .question>.inner::after,
.c-faq .answer>.inner::after {
  content: "";
  display: block;
  width: 1px;
  height: calc(100% - 1.5em);
  background: var(--line-button);
  position: absolute;
  top: calc(50% - (100% - 1.5em) / 2);
  left: calc(max(2dvw, 32px) * 2);
}

.c-faq .question .title,
.c-faq .question .desc,
.c-faq .answer .title,
.c-faq .answer .desc {
  width: 100%;
  padding-left: 1.5em;
}

.c-faq .question {
  background: var(--button-secondary);
}

.c-faq .question>.inner::before {
  content: "Q";
}

@media (any-hover: hover) {
  .c-faq .question:hover {
    -webkit-filter: brightness(0.95);
    filter: brightness(0.95);
  }
}

.c-faq .answer {
  background: var(--bg-middle);
}

.c-faq .answer>.inner {
  padding-right: 2em;
}

.c-faq .answer>.inner::before {
  content: "A";
}

@media screen and (max-width: 576px) {

  .c-faq .question>.inner,
  .c-faq .answer>.inner {
    padding: 1.5em 1.25em 1.5em calc(max(5.5555555556dvw, 28px) * 2);
  }

  .c-faq .question>.inner::before,
  .c-faq .answer>.inner::before {
    font-size: max(5.5555555556dvw, 28px);
    top: 21px;
  }

  .c-faq .question>.inner::after,
  .c-faq .answer>.inner::after {
    left: calc(max(5.5555555556dvw, 28px) * 2);
  }

  .c-faq .question .title,
  .c-faq .question .desc,
  .c-faq .answer .title,
  .c-faq .answer .desc {
    padding-left: 1.5em;
  }

  .c-faq .answer>.inner {
    padding-right: 2em;
  }

  .c-faq .icon {
    margin-top: 0.4em;
  }
}

/*
.c-modal
---------------------------------------------------------------- */
.c-modal .modal-thumb {
  width: 100%;
  aspect-ratio: 4/3;
  background: var(--bg-middle) var(--bg-noise);
  border-radius: 2px;
  -webkit-transition: -webkit-filter var(--animation-button);
  transition: -webkit-filter var(--animation-button);
  transition: filter var(--animation-button);
  transition: filter var(--animation-button), -webkit-filter var(--animation-button);
}

.c-modal .modal-thumb>img {
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

@media (any-hover: hover) {
  .c-modal .modal-thumb:hover {
    -webkit-filter: brightness(0.95);
    filter: brightness(0.95);
  }
}

.c-modal .modal-window {
  width: 100dvw;
  height: 100dvh;
  position: fixed;
  z-index: var(--z-modal);
  top: 0;
  left: 0;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: visibility 0s var(--animation-modal), opacity var(--animation-modal);
  transition: visibility 0s var(--animation-modal), opacity var(--animation-modal);
}

.c-modal .modal-window.is-active {
  visibility: visible;
  opacity: 1;
  -webkit-transition: visibility 0s, opacity var(--animation-modal);
  transition: visibility 0s, opacity var(--animation-modal);
}

.c-modal .bg {
  width: 100%;
  height: 100%;
  background: rgba(20, 20, 20, 0.5);
}

.c-modal .window {
  max-width: var(--container-base);
  width: 100%;
  height: 90%;
  padding-inline: var(--container-pd);
  position: absolute;
  margin: auto;
  inset: 0;
}

.c-modal .icon {
  width: var(--container-pd);
  aspect-ratio: 1/1;
  position: absolute;
  top: 0;
  right: 0;
}

.c-modal .icon::before,
.c-modal .icon::after {
  content: "";
  display: block;
  width: 2px;
  height: 100%;
  margin: auto;
  background: var(--text-white);
  position: absolute;
  inset: 0;
}

.c-modal .icon::before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.c-modal .icon::after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.c-modal .img {
  height: 100%;
}

.c-modal .img>img {
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

/*
.c-loop-img
---------------------------------------------------------------- */
.c-loop-img {
  margin: var(--space-100) calc(50% - 50dvw) 0;
}

.c-loop-img .media {
  width: max(16dvw, 320px);
  aspect-ratio: 4/3;
}

@media screen and (max-width: 1200px) {
  .c-loop-img .media {
    width: max(26.6666666667dvw, 240px);
  }
}

/*
.c-loop-text
---------------------------------------------------------------- */
.c-loop-text {
  width: 100%;
  max-width: none;
  margin-inline: calc(50% - 50dvw);
  font-family: var(--ff-en-primary);
  font-weight: 700;
  font-size: max(13.5dvw, 152px);
  color: var(--text-white);
  cursor: default;
  pointer-events: none;
  opacity: 0.6;
}

@media screen and (max-width: 576px) {
  .c-loop-text {
    opacity: 0.5;
  }
}

.c-loop-text .text {
  line-height: 0.75;
}

.c-loop-text+div[class*=inner] {
  margin-top: calc(var(--space-100) * 0.76);
}

/*
.c-facility-card
---------------------------------------------------------------- */
.c-facility-card {
  display: grid;
  gap: max(0.8dvw, 0.5em) max(1.6dvw, 1.25em);
  grid-template-columns: auto minmax(0, 1fr);
}

.c-facility-card .card-item {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: span 2;
  padding: max(1.6dvw, 1.75em);
  padding-right: max(1.8dvw, 2em);
  background: var(--text-black);
  color: var(--text-white);
}

.c-facility-card .num {
  font-family: var(--ff-en-primary);
  font-size: var(--fs-xl);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: var(--lh-min);
  color: var(--accent-brand);
  text-align: center;
}

.c-facility-card .md-title {
  font-size: var(--fs-md);
}

.c-facility-card .desc {
  font-size: var(--fs-sm);
}

/*
.c-feature-card
---------------------------------------------------------------- */
.c-feature-card {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5em max(1.2dvw, 1em);
}

.c-feature-card .card-item {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  padding: max(2.4dvw, 2.25em);
  background: var(--bg-dark);
  border-radius: 2px;
  color: var(--text-white);
  overflow: hidden;
  position: relative;
}

.c-feature-card .card-item::before {
  content: "";
  display: block;
  width: 60%;
  aspect-ratio: 178.19/103.45;
  -webkit-mask: url(../assets/images/drone/icon-drone.svg) no-repeat center/contain;
  mask: url(../assets/images/drone/icon-drone.svg) no-repeat center/contain;
  background: var(--accent-drone);
  position: absolute;
  bottom: -5%;
  right: -5%;
  opacity: 0.2;
}

.c-feature-card .card-item>.title,
.c-feature-card .card-item>.desc {
  position: relative;
  z-index: 10;
}

.c-feature-card .card-item>.title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: start;
  gap: 1em;
}

.c-feature-card .card-item>.title>.num {
  font-family: var(--ff-en-primary);
  font-size: var(--fs-xl);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: var(--lh-min);
  color: var(--accent-drone);
  white-space: nowrap;
}

.c-feature-card .card-item>.title>.text {
  font-size: var(--fs-md);
  font-weight: 500;
  line-height: va(--lh-narrow);
}

.c-feature-card .card-item>.desc {
  font-size: var(--fs-sm);
}

@media screen and (max-width: 991px) and (min-width: 576px) {
  .c-feature-card {
    grid-template-columns: -webkit-max-content minmax(0, 1fr);
    grid-template-columns: max-content minmax(0, 1fr);
    -webkit-column-gap: 2em;
    -moz-column-gap: 2em;
    column-gap: 2em;
  }

  .c-feature-card .card-item {
    grid-template-rows: auto;
    grid-template-columns: subgrid;
    grid-column: span 2;
  }

  .c-feature-card .card-item::before {
    width: 25%;
  }

  .c-feature-card .card-item>.title {
    margin-top: 0.15em;
  }
}

@media screen and (max-width: 576px) {
  .c-feature-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .c-feature-card .card-item {
    display: block;
  }
}

/*
.c-anchor
---------------------------------------------------------------- */
.c-anchor {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-column-gap: 1em;
  -moz-column-gap: 1em;
  column-gap: 1em;
  padding: 1.25em;
  border: 1px solid var(--text-black);
  background: transparent;
}

.c-anchor .text {
  font-weight: 500;
  white-space: nowrap;
}

.c-anchor .arrow {
  width: 0.65em;
  aspect-ratio: 1/1;
  margin-right: 0.25em;
  -webkit-mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  background: var(--text-black);
  -webkit-transition: -webkit-transform var(--animation-button);
  transition: -webkit-transform var(--animation-button);
  transition: transform var(--animation-button);
  transition: transform var(--animation-button), -webkit-transform var(--animation-button);
}

@media (any-hover: hover) {
  .c-anchor:hover .arrow {
    -webkit-transform: translateY(0.25em);
    transform: translateY(0.25em);
  }
}

/*
.c-event-item
---------------------------------------------------------------- */
.c-event-item:not(:first-child) {
  margin-top: 3em;
}

.c-event-item .event-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 0.75em 1em;
  padding: max(1dvw, 1em);
  background: #5e5e5e var(--bg-noise);
  color: var(--text-white);
}

.c-event-item .event-header .title {
  font-size: var(--fs-md);
  font-weight: 500;
}

.c-event-item .event-header .title .date {
  font-family: var(--ff-en-primary);
  font-size: 0.875em;
  font-weight: 500;
  letter-spacing: var(--ls-narrow);
}

.c-event-item .event-header .title .name {
  display: block;
  margin-top: 0.25em;
  line-height: var(--lh-narrow);
}

.c-event-item .event-header .title .category {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  background: var(--text-white);
  font-size: 0.85em;
  font-weight: 500;
  color: #5e5e5e;
  white-space: nowrap;
}

@media screen and (max-width: 767px) {
  .c-event-item .event-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
  }
}

.c-event-item .button-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5em;
}

.c-event-item .button-list>.button {
  width: max(6dvw, 120px);
  padding: 1em 0.75em;
  font-family: var(--ff-en-primary);
  font-size: var(--fs-sm);
  letter-spacing: var(--ls-narrow);
}

@media screen and (max-width: 767px) {
  .c-event-item .button-list {
    width: 100%;
  }

  .c-event-item .button-list>.button {
    width: 100%;
  }
}

.c-event-item .info-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75em 1em;
  margin-top: 1em;
}

@media screen and (max-width: 992px) {
  .c-event-item .info-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 576px) {
  .c-event-item .info-list {
    grid-template-columns: minmax(0, 1fr);
  }
}

.c-event-item .info-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 0.75em;
  -moz-column-gap: 0.75em;
  column-gap: 0.75em;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: var(--fs-sm);
}

.c-event-item .info-item .icon {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: max(2dvw, 2.5rem);
  aspect-ratio: 1/1;
  background: #c9c9c9;
  border-radius: 2px;
  position: relative;
}

.c-event-item .info-item .icon::before {
  content: "";
  display: block;
  width: 60%;
  aspect-ratio: 1/1;
  background: #9b9b9b;
  -webkit-mask: url() no-repeat center/contain;
  mask: url() no-repeat center/contain;
  position: absolute;
  margin: auto;
  inset: 0;
}

.c-event-item .info-item dt,
.c-event-item .info-item dd {
  font-weight: 500;
  line-height: var(--lh-single);
}

.c-event-item .info-item.date .icon::before {
  -webkit-mask-image: url(../assets/images/tennis/icon-calendar.svg);
  mask-image: url(../assets/images/tennis/icon-calendar.svg);
}

.c-event-item .info-item.date dt {
  display: none;
}

.c-event-item .info-item.time .icon::before {
  -webkit-mask-image: url(../assets/images/tennis/icon-time.svg);
  mask-image: url(../assets/images/tennis/icon-time.svg);
}

.c-event-item .info-item.time dt::after {
  content: "";
}

.c-event-item .info-item.layer .icon::before {
  -webkit-mask-image: url(../assets/images/tennis/icon-layer.svg);
  mask-image: url(../assets/images/tennis/icon-layer.svg);
}

.c-event-item .info-item.layer .category dt {
  display: none;
}

.c-event-item .info-item.price .icon::before {
  -webkit-mask-image: url(../assets/images/tennis/icon-price.svg);
  mask-image: url(../assets/images/tennis/icon-price.svg);
}

.c-event-item .info-item.price .price-price dt {
  display: none;
}

.c-event-item .info-item.status .icon::before {
  -webkit-mask-image: url(../assets/images/tennis/icon-status.svg);
  mask-image: url(../assets/images/tennis/icon-status.svg);
}

.c-event-item .info-item.status .status-status {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  row-gap: 0.25em;
}

.c-event-item .info-item.status .status-status dt {
  font-size: 0.8em;
}

.c-event-item .info-item.status .status-status dt::after {
  display: none;
}

.c-event-item .info-item.status .status-status dd.is-available::after {
  content: "募集中！";
  display: inline-block;
  margin-left: 0.25em;
  font-size: 0.85em;
  font-weight: 500;
  color: var(--caution-red);
  letter-spacing: var(--ls-narrow);
}

.c-event-item .info-item.memo {
  grid-column: 1/-1;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: start;
}

.c-event-item .info-item.memo .icon::before {
  -webkit-mask-image: url(../assets/images/tennis/icon-info.svg);
  mask-image: url(../assets/images/tennis/icon-info.svg);
}

.c-event-item .info-item.memo>.text p {
  line-height: var(--lh-narrow);
  vertical-align: middle;
}

/*
.c-flow-card
---------------------------------------------------------------- */
.c-flow-card {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.8em;
}

@media screen and (max-width: 992px) {
  .c-flow-card {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media screen and (max-width: 768px) {
  .c-flow-card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 576px) {
  .c-flow-card {
    grid-template-columns: minmax(0, 1fr);
  }
}

.c-flow-card .card-item {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  gap: max(1dvw, 1em);
  padding: max(1.6dvw, 1.75em);
  background: var(--text-black);
  color: var(--text-white);
  position: relative;
}

.c-flow-card .card-item>.title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.75em;
  line-height: var(--lh-min);
}

.c-flow-card .card-item>.title br {
  display: none;
}

@media screen and (max-width: 1200px) and (min-width: 993px) {
  .c-flow-card .card-item>.title br {
    display: block;
  }
}

.c-flow-card .card-item>.title .num {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  font-family: var(--ff-en-primary);
  font-size: var(--fs-lg);
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--accent-brand);
}

.c-flow-card .card-item>.desc {
  font-size: var(--fs-sm);
  line-height: var(--lh-min);
}

.c-flow-card .card-item:last-child {
  position: relative;
}

.c-flow-card .card-item:last-child::after {
  content: "GOAL";
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  font-family: var(--ff-en-primary);
  font-size: max(9dvw, 100px);
  font-weight: 900;
  letter-spacing: -0.02em;
  white-space: nowrap;
  color: var(--accent-brand);
  opacity: 0.08;
  line-height: 0.7;
  position: absolute;
  bottom: -0.05em;
  right: 10%;
}

@media screen and (min-width: 993px) {
  .c-flow-card .card-item:last-child {
    grid-column: 1/-1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1em;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-block: max(2dvw, 2em);
  }

  .c-flow-card .card-item:last-child>.desc {
    margin-top: -0.25em;
  }
}

@media screen and (max-width: 992px) {
  .c-flow-card .card-item {
    gap: 0.5em;
  }

  .c-flow-card .card-item:last-child::after {
    margin: auto;
    bottom: initial;
    right: initial;
    inset: 0;
  }
}

/*
.c-category-block
---------------------------------------------------------------- */
.c-category-block .category-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 0.75em 0.5em;
}

.c-category-block .category-item>a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.5em;
  white-space: nowrap;
}

@media (any-hover: hover) {
  .c-category-block .category-item>a:hover>.radio::before {
    opacity: 0.2;
  }
}

.c-category-block .category-item>a>.radio {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 1em;
  aspect-ratio: 1/1;
  border: 2px solid var(--line-item);
  border-radius: 50%;
  position: relative;
}

.c-category-block .category-item>a>.radio::before {
  content: "";
  display: block;
  width: 66%;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: var(--accent-drone);
  position: absolute;
  margin: auto;
  inset: 0;
  opacity: 0;
  -webkit-transition: opacity var(--animation-button);
  transition: opacity var(--animation-button);
}

.c-category-block .category-item>a>.text {
  margin-bottom: 0.15em;
}

.c-category-block .category-item.is-active>a>.radio::before {
  opacity: 1;
}

.page-category .category-item.is-current > a > .radio::before {
  opacity: 1;
}

/*
.c-accordion
---------------------------------------------------------------- */
.c-accordion>div:not(:first-child) {
  margin-top: 0.375em;
}

.c-accordion>div>dt>.inner,
.c-accordion>div>dd>.inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-column-gap: 2em;
  -moz-column-gap: 2em;
  column-gap: 2em;
}

.c-accordion>div>dt {
  cursor: pointer;
  -webkit-transition: -webkit-filter var(--animation-button);
  transition: -webkit-filter var(--animation-button);
  transition: filter var(--animation-button);
  transition: filter var(--animation-button), -webkit-filter var(--animation-button);
}

.c-accordion>div>dd {
  display: grid;
  grid-template-rows: minmax(0, 0fr);
  -webkit-transition: grid-template-rows var(--animation-button);
  transition: grid-template-rows var(--animation-button);
  transition: grid-template-rows var(--animation-button), -ms-grid-rows var(--animation-button);
  overflow: hidden;
}

.c-accordion>div.is-open>dd {
  grid-template-rows: minmax(0, 1fr);
}

.c-accordion>div.is-open .toggle-button {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.c-accordion .toggle-button {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 1em;
  aspect-ratio: 1/1;
  -webkit-transition: -webkit-transform var(--animation-button);
  transition: -webkit-transform var(--animation-button);
  transition: transform var(--animation-button);
  transition: transform var(--animation-button), -webkit-transform var(--animation-button);
  position: relative;
}

.c-accordion .toggle-button::before,
.c-accordion .toggle-button::after {
  content: "";
  display: block;
  background: var(--text-black);
  position: absolute;
}

.c-accordion .toggle-button::before {
  width: 2px;
  height: 100%;
  top: 0;
  left: calc(50% - 1px);
}

.c-accordion .toggle-button::after {
  width: 100%;
  height: 2px;
  top: calc(50% - 1px);
  left: 0;
}

@media screen and (max-width: 576px) {

  .c-accordion>div>dt>.inner,
  .c-accordion>div>dd>.inner {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -webkit-column-gap: 1.25em;
    -moz-column-gap: 1.25em;
    column-gap: 1.25em;
  }

  .c-accordion .toggle-button {
    margin-top: 0.35em;
  }
}

/*
.c-swiper-fade
---------------------------------------------------------------- */
.c-swiper-fade {
  /* === base-setting === */
}

.c-swiper-fade .slide {
  height: 100%;
}

.c-swiper-fade .swiper,
.c-swiper-fade .swiper-wrapper,
.c-swiper-fade .swiper-slide,
.c-swiper-fade .media {
  height: 100%;
}

.c-swiper-fade .swiper-wrapper {
  -webkit-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
}

.c-swiper-fade .media>img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.c-swiper-gallery .gallery-main {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
}

.c-swiper-gallery .gallery-main .slide,
.c-swiper-gallery .gallery-main .swiper,
.c-swiper-gallery .gallery-main .swiper-wrapper,
.c-swiper-gallery .gallery-main .swiper-slide {
  height: 100%;
}

.c-swiper-gallery .gallery-main .media {
  height: 100%;
  background: var(--bg-middle) var(--bg-noise);
  border-radius: 2px;
}

.c-swiper-gallery .gallery-main .media img {
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.c-swiper-gallery .gallery-main.swiper-slide[class*=-active] .slide__media img {
  opacity: 1;
}

.c-swiper-gallery {
  /* navigation */
}

.c-swiper-gallery .navigation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  position: absolute;
  top: calc(50% - 1.875rem);
  right: 0;
  z-index: 10;
}

.c-swiper-gallery .navigation .arrow {
  aspect-ratio: 1/1;
  border: 1px solid var(--accent-blue);
  position: relative;
}

.c-swiper-gallery .navigation .arrow-box::before,
.c-swiper-gallery .navigation .arrow-box::after {
  background-color: var(--accent-blue);
}

.c-swiper-gallery .navigation .arrow--prev .arrow-box::before,
.c-swiper-gallery .navigation .arrow--prev .arrow-box::after {
  scale: -1 1;
}

.gallery-thumb {
  margin-top: 0.5em;
  /* slide */
}

.gallery-thumb .slide,
.gallery-thumb .swiper,
.gallery-thumb .swiper-wrapper,
.gallery-thumb .swiper-slide {
  height: 100%;
}

.gallery-thumb .media {
  height: 100%;
  aspect-ratio: 16/9;
  border-radius: 2px;
  -webkit-transition: var(--animation-button);
  transition: var(--animation-button);
  -webkit-transform-origin: center;
  transform-origin: center;
}

.gallery-thumb .media img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  -webkit-transition: var(--animation-button);
  transition: var(--animation-button);
  -webkit-transform-origin: center;
  transform-origin: center;
}

.gallery-thumb .swiper-slide {
  aspect-ratio: 4/3;
  overflow: hidden;
  cursor: pointer;
  -webkit-transition: var(--animation-button);
  transition: var(--animation-button);
}

.gallery-thumb .swiper-slide .thumb-media {
  width: 100%;
  height: 100%;
}

.gallery-thumb .swiper-slide .thumb-media img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.gallery-thumb .swiper-slide[class*=-thumb-active] {
  opacity: 0.8;
  -webkit-transform: scale(0.96);
  transform: scale(0.96);
}

.gallery-thumb .swiper-slide[class*=-thumb-active] img {
  -webkit-transform: scale(1.04);
  transform: scale(1.04);
}

.gallery-thumb {
  /* scrollbar */
}

.gallery-thumb .scrollbar {
  height: 8px;
  margin-top: 10px;
  background: var(--scrollbar-bg);
  border-radius: 1000px;
}

.gallery-thumb .scrollbar .swiper-scrollbar-drag {
  height: 100%;
  background: var(--scrollbar-thumb);
  border-radius: 1000px;
}

.c-swiper-loop .slide {
  height: 100%;
}

.c-swiper-loop .swiper-wrapper {
  -webkit-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
}

.c-swiper-loop .swiper-slide {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

/*
.c-swiper-navigation
---------------------------------------------------------------- */
.c-swiper-navigation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
}

.c-swiper-navigation .arrow {
  width: max(4dvw, 48px);
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: var(--button-primary);
  -webkit-transition: scale var(--animation-button), -webkit-filter var(--animation-button);
  transition: scale var(--animation-button), -webkit-filter var(--animation-button);
  transition: filter var(--animation-button), scale var(--animation-button);
  transition: filter var(--animation-button), scale var(--animation-button), -webkit-filter var(--animation-button);
  position: relative;
}

.c-swiper-navigation .arrow::before {
  content: "";
  display: block;
  width: 15%;
  aspect-ratio: 6.7/5.02;
  -webkit-mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  background: var(--text-white);
  position: absolute;
  margin: auto;
  inset: 0;
}

.c-swiper-navigation .arrow.prev {
  rotate: 90deg;
}

.c-swiper-navigation .arrow.next {
  rotate: -90deg;
}

@media (any-hover: hover) {
  .c-swiper-navigation .arrow:hover {
    -webkit-filter: brightness(1.05);
    filter: brightness(1.05);
    scale: 0.95;
  }
}

/*
.c-swiper-pagination
---------------------------------------------------------------- */
.c-swiper-pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
}

.c-swiper-pagination .swiper-pagination-bullet {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 100px;
  background: var(--scrollbar-bg);
  overflow: hidden;
  -webkit-transition: var(--animation-button);
  transition: var(--animation-button);
  position: relative;
}

.c-swiper-pagination .swiper-pagination-bullet::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 100px;
  background: var(--accent-tennis);
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: left;
  transform-origin: left;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

.c-swiper-pagination .swiper-pagination-bullet[class*=-active] {
  width: 40px;
}

.c-swiper-pagination .swiper-pagination-bullet[class*=-active]::before {
  -webkit-animation: paginationBar 4s linear forwards;
  animation: paginationBar 4s linear forwards;
}

@-webkit-keyframes paginationBar {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
  }

  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

@keyframes paginationBar {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
  }

  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

.c-swiper-pagination {
  /* not-active-pagination */
}

@media (any-hover: hover) {
  .c-swiper-pagination .swiper-pagination-bullet:not([class*=-active]):hover {
    -webkit-filter: brightness(0.95);
    filter: brightness(0.95);
  }
}

/*
.p-all-nav
---------------------------------------------------------------- */
.p-all-nav {
  display: grid;
  place-items: center;
  height: 100dvh;
  width: 100dvw;
  padding-top: calc(max(2dvw, 1.25rem) * 2 + max(3.4dvw, 68px));
  background: var(--bg-body--translucent);
  overflow-y: auto;
  position: fixed;
  top: 0;
  left: 100%;
  -webkit-transition: var(--animation-nav);
  transition: var(--animation-nav);
}

@media screen and (max-width: 992px) {
  .p-all-nav {
    padding-top: calc(max(2dvw, 1.25rem) * 2 + max(6.8548387097dvw, 56px));
  }
}

@media screen and (max-width: 576px) {
  .p-all-nav {
    padding-top: calc(6dvw + max(6.8548387097dvw, 56px));
  }
}

.p-all-nav>.inner {
  width: 100%;
  max-width: var(--container-fluid03);
  margin-inline: auto;
  padding: 2dvw;
}

@media screen and (min-width: 2001px) {
  .p-all-nav>.inner {
    max-width: var(--container-fluid03--wide);
  }
}

@media screen and (max-width: 576px) {
  .p-all-nav>.inner {
    padding: 3dvw;
  }
}

.p-all-nav .nav-list {
  padding: max(0.6dvw, 8px);
  border: max(0.2dvw, 2px) solid var(--text-black);
}

.p-all-nav .anchor-list {
  margin-top: calc(var(--space-100) * 0.2);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5em max(0.8dvw, 8px);
  font-size: max(0.75dvw, 13px);
}

@media screen and (max-width: 576px) {
  .p-all-nav .anchor-list {
    grid-template-columns: minmax(0, 1fr);
  }
}

.p-all-nav .anchor-item {
  padding: 1.75em 0.75em;
  font-weight: 600;
  border: none;
  border-bottom: 1px solid var(--text-black);
  -webkit-transition: background var(--animation-button);
  transition: background var(--animation-button);
}

@media (any-hover: hover) {
  .p-all-nav .anchor-item:hover {
    background: var(--accent-brand);
  }
}

.p-all-nav.is-active {
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}

/*
.p-lower-nav
---------------------------------------------------------------- */
.p-lower-nav .nav-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 2.25em 1.6em;
  font-size: max(0.75dvw, 0.8125rem);
}

.p-lower-nav .nav-item>a {
  white-space: nowrap;
  font-weight: 500;
}

.p-lower-nav .nav-item>a.has-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.4em;
}

.p-lower-nav .nav-item>a.has-icon::before {
  content: "";
  display: inline-block;
  width: 1em;
  aspect-ratio: 1/1;
  margin-bottom: -0.1em;
}

.p-lower-nav .nav-item>a.has-icon[href*="#event"]::before {
  -webkit-mask: url(../assets/images/tennis/icon-info.svg) no-repeat center/contain;
  mask: url(../assets/images/tennis/icon-info.svg) no-repeat center/contain;
}

.p-lower-nav .nav-item>a.has-icon[href*=school]:before {
  -webkit-mask: url(../assets/images/tennis/icon-ball.svg) no-repeat center/contain;
  mask: url(../assets/images/tennis/icon-ball.svg) no-repeat center/contain;
}

.p-lower-nav .nav-item>a[href*="contact.html"] {
  border: 1px solid transparent;
  margin-left: 0.5333333333em;
  padding: 1.0666666667em 2.1333333333em;
}

@media screen and (max-width: 992px) {
  .p-lower-nav {
    width: max(50dvw, 360px);
    height: 100dvh;
    display: grid;
    place-content: center;
    background: var(--bg-body--translucent);
    position: fixed;
    top: 0;
    left: 100%;
    -webkit-transition: var(--animation-nav);
    transition: var(--animation-nav);
  }
}

@media screen and (max-width: 992px) and (max-width: 576px) {
  .p-lower-nav {
    width: 100dvw;
  }
}

@media screen and (max-width: 992px) {
  .p-lower-nav .nav-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    font-size: var(--fs-lg);
  }

  .p-lower-nav .nav-item>a[href*="contact.html"] {
    margin-left: 0;
  }

  .p-lower-nav.is-active {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

/*
.p-all-header
---------------------------------------------------------------- */
.p-all-header>.inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-transition: var(--animation-header);
  transition: var(--animation-header);
  width: 96dvw;
  position: absolute;
  top: max(2dvw, 1.25rem);
  left: calc(50% - 48dvw);
}

@media screen and (max-width: 576px) {
  .p-all-header>.inner {
    width: 94dvw;
    top: 3dvw;
    left: calc(50% - 47dvw);
  }
}

.p-all-header .logo {
  z-index: 10;
}

.p-all-header .logo .text {
  font-family: var(--ff-ja-primary);
  font-size: 0.375em;
  font-weight: 700;
  letter-spacing: var(--ls-min);
  margin-bottom: 0.15em;
}

.p-all-header .hamburger {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

/*
.p-lower-header
---------------------------------------------------------------- */
.p-lower-header>.inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-transition: var(--animation-header);
  transition: var(--animation-header);
  width: 86.8dvw;
  position: absolute;
  top: max(3.6dvw, 1.25rem);
  left: calc(50% - 43.4dvw);
}

.p-lower-header a {
  color: var(--text-white);
  -webkit-transition: opacity var(--animation-button);
  transition: opacity var(--animation-button);
}

@media (any-hover: hover) {
  .p-lower-header a:hover {
    opacity: 0.8;
  }
}

.p-lower-header .logo {
  z-index: 10;
}

.p-lower-header .logo .img {
  -webkit-filter: var(--filter-white);
  filter: var(--filter-white);
}

.p-lower-header .nav-item .has-icon::before {
  background: var(--text-white);
}

.p-lower-header .nav-item>a[href*="contact.html"] {
  border: 1px solid var(--text-white);
  -webkit-transition: color var(--animation-button), background var(--animation-button);
  transition: color var(--animation-button), background var(--animation-button);
}

@media (any-hover: hover) {
  .p-lower-header .nav-item>a[href*="contact.html"]:hover {
    background: var(--text-white);
    color: var(--text-black);
    opacity: 1;
  }
}

.p-lower-header .hamburger {
  display: none;
}

.p-lower-header .nav-bg {
  display: none;
}

.p-lower-header.is-spread>.inner {
  width: 96dvw;
  top: max(2dvw, 1.25rem);
  left: calc(50% - 48dvw);
}

@media screen and (max-width: 576px) {
  .p-lower-header.is-spread>.inner {
    width: 94dvw;
    top: 3dvw;
    left: calc(50% - 47dvw);
  }
}

.p-lower-header.is-spread a {
  color: var(--text-black);
}

.p-lower-header.is-spread .logo .img {
  -webkit-filter: none;
  filter: none;
}

.p-lower-header.is-spread .nav-item .has-icon::before {
  background: var(--text-black);
}

.p-lower-header.is-spread .nav-item>a[href*="contact.html"] {
  border-color: var(--text-black);
}

@media (any-hover: hover) {
  .p-lower-header.is-spread .nav-item>a[href*="contact.html"]:hover {
    background: var(--text-black);
    color: var(--text-white);
  }
}

@media screen and (max-width: 992px) {
  .p-lower-header .hamburger {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: block;
  }

  .p-lower-header .nav-item a {
    color: var(--text-black);
  }

  .p-lower-header .nav-item .has-icon::before {
    background: var(--text-black);
  }

  .p-lower-header .nav-item>a[href*="contact.html"] {
    border-color: var(--text-black);
  }
}

@media screen and (max-width: 992px) and (any-hover: hover) {
  .p-lower-header .nav-item>a[href*="contact.html"]:hover {
    background: var(--text-black);
    color: var(--text-white);
  }
}

/*
.p-all-footer
---------------------------------------------------------------- */
.p-all-footer {
  margin-top: calc(var(--space-100) * 1.48);
  padding-block: calc(var(--space-100));
  background: var(--bg-dark);
}

.p-all-footer .logo>a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}

.p-all-footer .logo .img {
  width: max(7dvw, 140px);
  -webkit-mask: url(../assets/images/common/logo-mono.svg) no-repeat center/contain;
  mask: url(../assets/images/common/logo-mono.svg) no-repeat center/contain;
  background: var(--accent-brand);
}

.p-all-footer .footer-nav {
  margin-top: 2em;
}

.p-all-footer .footer-nav .nav-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 0 1em;
}

.p-all-footer .footer-nav .nav-item>a {
  font-size: var(--fs-sm);
  font-weight: 300;
  color: var(--text-white);
  text-decoration: underline;
}

.p-all-footer .button-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5em;
  margin: 3em auto 0;
}

@media screen and (max-width: 768px) {
  .p-all-footer .button-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
}

@media screen and (max-width: 576px) {
  .p-all-footer .button-list {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}

.p-all-footer .button-list .button {
  width: auto;
  padding: 1.25em 0.75em;
}

@media screen and (max-width: 768px) {
  .p-all-footer .button-list .button {
    width: max(18dvw, 16.25rem);
  }
}

.p-all-footer .copyright {
  margin-top: 4em;
  font-size: var(--fs-xs);
  font-weight: 300;
  color: var(--text-white);
  text-align: center;
}

/*
.p-lower-footer
---------------------------------------------------------------- */
.p-lower-footer {
  margin-top: calc(var(--space-100) * 1.48);
  padding-block: var(--space-100);
  background-color: var(--bg-dark);
  font-size: var(--fs-sm);
  color: var(--text-white);
  position: relative;
}

.p-lower-footer::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../assets/images/common/lf-texture.jpg) no-repeat center/cover;
  position: absolute;
  margin: auto;
  inset: 0;
  opacity: 0.06;
}

.p-lower-footer a {
  color: var(--text-white);
}

.p-lower-footer>.inner {
  max-width: var(--container-base);
  margin-inline: auto;
  padding-inline: var(--container-pd);
  position: relative;
  z-index: 10;
}

.p-lower-footer .logo {
  -webkit-filter: var(--filter-brand);
  filter: var(--filter-brand);
}

.p-lower-footer .top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.p-lower-footer .detail {
  margin-top: 2.5714285714em;
}

.p-lower-footer .footer-nav .nav-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 2em;
  font-weight: 500;
}

.p-lower-footer .footer-nav .nav-item a {
  text-decoration: underline;
  white-space: nowrap;
}

.p-lower-footer .bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: end;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: max(var(--space-unit) * 20, 3.75rem);
}

.p-lower-footer .button-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0.75em 1em;
}

.p-lower-footer .button {
  width: 16.25rem;
  font-size: var(--fs-sm);
}

.p-lower-footer .copyright {
  font-size: var(--fs-xs);
  font-weight: 300;
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
  .p-lower-footer .top {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .p-lower-footer .logo .img {
    height: max(5.7291666667dvw, 2rem);
  }

  .p-lower-footer .detail {
    margin-top: 1.5em;
    text-align: center;
  }

  .p-lower-footer .footer-nav {
    display: none;
  }

  .p-lower-footer .bottom {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: calc(var(--space-100) * 0.8);
  }

  .p-lower-footer .button-list {
    width: 100%;
  }

  .p-lower-footer .copyright {
    margin-top: 3em;
  }
}

/*
.p-all-fv
---------------------------------------------------------------- */
.p-all-fv {
  padding-top: max(4dvw, 100px);
}

@media screen and (max-width: 576px) {
  .p-all-fv {
    padding-top: max(17.3611111111dvw, 80px);
  }
}

.p-all-fv>.inner {
  width: 100%;
}

.p-all-fv .copy {
  position: relative;
}

.p-all-fv .loop-text {
  width: 100dvw;
  font-size: max(16.5dvw, 180px);
  color: var(--text-black);
  opacity: 1;
  position: relative;
  z-index: -10;
}

.p-all-fv .loop-text>.slide {
  opacity: 0.05;
}

.p-all-fv .loop-text::before,
.p-all-fv .loop-text::after {
  content: "";
  display: block;
  width: 20%;
  height: max(0.6dvw, 8px);
  border-top: 1px solid var(--text-black);
  border-bottom: 1px solid var(--text-black);
  clip-path: polygon(0 0, 100% 0%, 90% 100%, 0% 100%);
  position: absolute;
  top: 48%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media screen and (max-width: 1200px) {

  .p-all-fv .loop-text::before,
  .p-all-fv .loop-text::after {
    width: 15%;
  }
}

@media screen and (max-width: 992px) {

  .p-all-fv .loop-text::before,
  .p-all-fv .loop-text::after {
    width: calc(100% - max(85.4838709677%, 720px));
  }
}

.p-all-fv .loop-text::before {
  left: 0;
}

.p-all-fv .loop-text::after {
  right: 0;
  scale: -1 -1;
}

.p-all-fv .copy-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: absolute;
  top: 45%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.p-all-fv .copy-text>span {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background: var(--text-white);
  font-size: max(3.2dvw, 52px);
  font-weight: 900;
  letter-spacing: var(--ls-min);
  white-space: nowrap;
}

@media screen and (max-width: 1200px) {
  .p-all-fv .copy-text>span {
    font-size: max(4.3333333333dvw, 40px);
  }
}

@media screen and (max-width: 768px) {
  .p-all-fv .copy-text>span {
    font-size: max(5.2083333333dvw, 32px);
  }
}

@media screen and (max-width: 576px) {
  .p-all-fv .copy-text>span {
    font-size: max(6.9444444444dvw, 30px);
  }
}

.p-all-fv .copy-text>span:not(:first-child) {
  margin-left: -0.8em;
  position: relative;
  z-index: -10;
}

@media screen and (max-width: 576px) {
  .p-all-fv .copy-text {
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .p-all-fv .copy-text>span:not(:first-child) {
    margin-left: 0;
    margin-top: 0.1em;
  }
}

.p-all-fv .link-area {
  margin-top: calc(var(--space-100) * 0.56 * -1);
}

@media screen and (max-width: 1200px) {
  .p-all-fv .link-area {
    margin-top: 0;
  }
}

.p-all-fv .link-area .note {
  font-weight: 700;
  font-style: italic;
}

/*
.p-lower-fv
---------------------------------------------------------------- */
.p-lower-fv {
  height: 100dvh;
  overflow-x: hidden;
}

.p-lower-fv .loop-text {
  font-size: max(13.5dvw, 180px);
  opacity: 0.15;
  position: absolute;
  z-index: 10;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
}

.p-lower-fv .scroll-down {
  position: absolute;
  bottom: max(6dvw, 80px);
  right: max(8dvw, 40px);
}

@media screen and (max-width: 768px) {
  .p-lower-fv .scroll-down {
    right: 7.8125dvw;
  }
}

@media screen and (max-width: 576px) {
  .p-lower-fv .scroll-down {
    right: 28px;
  }
}

.p-lower-fv+#container {
  position: relative;
  z-index: 10;
  background: var(--bg-base);
}

/*
.p-fixed-cta
---------------------------------------------------------------- */
.p-fixed-cta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 6px 8px;
  font-size: var(--fs-sm);
  position: fixed;
  z-index: var(--z-fixed-cta);
  bottom: max(3.6dvw, 20px);
  left: max(6.6dvw, 40px);
  -webkit-transition: var(--animation-header);
  transition: var(--animation-header);
}

.p-fixed-cta.is-spread {
  bottom: max(2dvw, 1.25rem);
  left: 2dvw;
}

@media screen and (max-width: 576px) {
  .p-fixed-cta {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    left: 6.6dvw;
    bottom: max(3.6dvw, 1.5rem);
  }

  .p-fixed-cta .button {
    width: 180px;
  }

  .p-fixed-cta.is-spread {
    bottom: 3dvw;
  }
}

/*
.p-topics-block
---------------------------------------------------------------- */
.p-topics-block {
  padding: max(4dvw, 40px) max(3dvw, 28px);
  background: var(--bg-noise) var(--bg-middle);
}

@media screen and (max-width: 576px) {
  .p-topics-block {
    padding-inline: 5%;
  }
}

.p-topics-block>.inner {
  display: grid;
  grid-template-columns: -webkit-max-content minmax(0, 1fr);
  grid-template-columns: max-content minmax(0, 1fr);
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 2em max(2.4dvw, 1.75rem);
}

.p-topics-block .section-title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 0;
}

.p-topics-block .section-title .en {
  font-size: max(3.4dvw, 48px);
}

.p-topics-block .button {
  justify-self: right;
  -ms-flex-item-align: center;
  align-self: center;
  width: max(18dvw, 200px);
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}

.p-topics-block .category-block {
  justify-self: right;
  -ms-flex-item-align: end;
  align-self: end;
  width: max(75%, 200px);
  font-size: max(0.75dvw, 0.8125rem);
}

.p-topics-block .category-block .category-list {
  place-content: end;
}

.p-topics-block .content {
  grid-column: 1/3;
  height: max(25.7dvw, 420px);
  overflow-y: auto;
}

.p-topics-block .topics-item>a {
  width: 100%;
  padding-block: 1.5em;
  position: relative;
}

.p-topics-block .topics-item>a::before,
.p-topics-block .topics-item>a::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.p-topics-block .topics-item>a::before {
  content: "";
  background: var(--line-item);
}

.p-topics-block .topics-item>a::after {
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: left;
  transform-origin: left;
}

@media (any-hover: hover) {
  .p-topics-block .topics-item>a:hover::after {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

.p-topics-block .topics-item .topics-title {
  margin-top: 0.55em;
  line-height: var(--lh-narrow);
  font-size: max(0.75dvw, 0.8125rem);
}

@media screen and (max-width: 992px) {
  .p-topics-block .category-block {
    grid-column: 1/3;
    justify-self: start;
    width: 100%;
  }

  .p-topics-block .category-block .category-list {
    place-content: start;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }
}

@container p-topics-block (max-width: 420px) {
  .p-topics-block>.inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .p-topics-block .button {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    justify-self: center;
    width: 100%;
  }
}

*:has(> .p-topics-block) {
  container-name: p-topics-block;
  container-type: inline-size;
}

/*
.p-page-list
---------------------------------------------------------------- */
.p-page-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(280px, 18dvw);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: max(0.6dvw, 8px);
}

.p-page-list .c-page-banner.tennis,
.p-page-list .c-page-banner.futsal {
  grid-row: span 2;
}

.p-page-list .c-page-banner.pickle,
.p-page-list .c-page-banner.drone {
  grid-row: span 1;
}

@media screen and (max-width: 1200px) {
  .p-page-list {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(260px, 23.3333333333dvw);
  }
}

@media screen and (max-width: 992px) {
  .p-page-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media screen and (max-width: 767px) {
  .p-page-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .p-page-list .c-page-banner>a {
    padding: 5%;
  }

  .p-page-list .c-page-banner.tennis,
  .p-page-list .c-page-banner.futsal {
    grid-column: span 2;
    grid-row: span 1;
  }

  .p-page-list .c-page-banner.pickle,
  .p-page-list .c-page-banner.drone {
    grid-column: span 1;
  }
}

/*
.p-access
---------------------------------------------------------------- */
.p-access .section-title::before {
  left: 50%;
}

.p-access .address {
  margin-top: max(2.4dvw, 1.75rem);
  font-size: var(--fs-lg);
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .p-access .address {
    font-size: var(--fs-md);
  }
}

.p-access .table {
  margin-top: max(4dvw, 3rem);
}

@media screen and (max-width: 1200px) {
  .p-access .table td:has(.br-xl) {
    line-height: var(--lh-min);
  }
}

.p-access .route {
  max-width: calc(var(--container-value--base) * 1px);
  margin: calc(var(--space-100) * 1.2) auto 0;
}

.p-access .route .md-title {
  text-align: center;
  margin-bottom: 2em;
}

@media screen and (max-width: 767px) {
  .p-access .route {
    max-width: max(46.9361147327dvw, 320px);
  }
}

/*
.p-instagram
---------------------------------------------------------------- */
.p-instagram .tagcolle-wrapper {
  margin-inline: calc(50% - 50dvw);
}

.p-instagram .tagcolle-xscroll-arrows.splide__arrows {
  top: calc(50% - max(4dvw, 48px) / 2);
}

.p-instagram .tagcolle-xscroll-arrows.splide__arrows button {
  width: max(4dvw, 48px);
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: var(--button-primary);
  -webkit-transition: scale var(--animation-button), -webkit-filter var(--animation-button);
  transition: scale var(--animation-button), -webkit-filter var(--animation-button);
  transition: filter var(--animation-button), scale var(--animation-button);
  transition: filter var(--animation-button), scale var(--animation-button), -webkit-filter var(--animation-button);
  position: absolute;
  font-size: initial;
  -webkit-filter: none;
  filter: none;
  -webkit-transition: scale var(--animation-button);
  transition: scale var(--animation-button);
}

.p-instagram .tagcolle-xscroll-arrows.splide__arrows button::before {
  content: "";
  display: block;
  width: 15%;
  aspect-ratio: 6.7/5.02;
  -webkit-mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  mask: url(../assets/images/common/arrow-anchor.svg) no-repeat center/contain;
  background: var(--text-white);
  position: absolute;
  margin: auto;
  inset: 0;
}

.p-instagram .tagcolle-xscroll-arrows.splide__arrows button.tagcolle-xscroll-prev.splide__arrow--prev {
  rotate: 90deg;
  left: max(0.6dvw, 8px);
}

.p-instagram .tagcolle-xscroll-arrows.splide__arrows button.tagcolle-xscroll-next.splide__arrow--next {
  rotate: -90deg;
  right: max(0.6dvw, 8px);
}

@media (any-hover: hover) {
  .p-instagram .tagcolle-xscroll-arrows.splide__arrows button:hover {
    scale: 0.9;
  }
}

/*
.p-facility
---------------------------------------------------------------- */
.p-facility {
  display: grid;
  grid-template-columns: minmax(360px, 46%) minmax(0, 1fr);
  gap: 0 1em;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.p-facility>.section-title {
  grid-column: 1/2;
  grid-row: 1/2;
}

.p-facility>.text {
  grid-column: 1/2;
  grid-row: 2/3;
  margin-left: 1em;
}

.p-facility>.img {
  grid-column: 2/3;
  grid-row: 1/3;
  align-self: center;
  text-align: end;
}

.p-facility>.img>img {
  width: 86.5384615385%;
}

@media screen and (max-width: 1200px) {
  .p-facility>.img>img {
    width: 92%;
  }
}

@media screen and (max-width: 992px) {
  .p-facility>.img {
    grid-row: 2/3;
    align-self: stretch;
  }

  .p-facility>.img>img {
    width: 96%;
  }
}

@media screen and (max-width: 768px) {
  .p-facility {
    display: block;
  }

  .p-facility>.text {
    margin: 0;
  }

  .p-facility>.img {
    margin-top: max(var(--space-100) * 0.6);
    text-align: center;
  }

  .p-facility>.img>img {
    width: 70%;
  }
}

@media screen and (max-width: 768px) and (max-width: 576px) {
  .p-facility>.img>img {
    width: 100%;
  }
}

/*
.p-contact
---------------------------------------------------------------- */
.p-contact .section-title {
  margin-bottom: calc(var(--space-100) * 1);
}

.p-contact .section-title::before {
  left: 46%;
}

.p-contact .contact-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0.5em max(2dvw, 1em);
}

@media screen and (max-width: 768px) {
  .p-contact .contact-list>a {
    width: calc(50% - max(2dvw, 1em));
  }
}

@media screen and (max-width: 576px) {
  .p-contact .section-title {
    margin-bottom: calc(var(--space-100) * 0.8);
  }

  .p-contact .contact-list {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .p-contact .contact-list>a {
    width: 100%;
    max-width: none;
  }
}

/*
.p-policy
---------------------------------------------------------------- */
.p-policy {
  margin-top: calc(var(--space-100) * 1);
  padding: max(3dvw, 40px) max(3dvw, 28px);
  background: var(--bg-middle) var(--bg-noise);
}

@media screen and (max-width: 576px) {
  .p-policy {
    padding-inline: 5%;
  }
}

.p-policy .section-title {
  margin-bottom: calc(var(--space-100) * 0.4);
  text-align: center;
}

.p-policy .section-title .ja {
  font-size: var(--fs-sm);
}

.p-policy .section-title .en {
  font-size: max(1.6dvw, 24px);
}

.p-policy .policy-container {
  height: 20lh;
  border-radius: 2px;
  font-size: var(--fs-sm);
}

@media screen and (max-width: 576px) {
  .p-policy .policy-container {
    padding-inline: 0 5%;
  }
}

.p-policy .detail {
  margin-top: 2em;
}

.p-policy dl,
.p-policy ol {
  margin-top: 0.5em;
}

.p-policy .clause:not(:first-of-type) {
  margin-top: 1.5em;
}

.p-policy .clause .clause-title {
  margin-bottom: 0;
  font-size: 1.1em;
}

.p-policy .clause>.desc {
  margin-top: 0.75em;
}

.p-policy .agree-box {
  margin-top: 2em;
  font-weight: 500;
}

.p-policy .agree-box>label {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.submit-container {
  margin-top: calc(var(--space-100) * 0.48);
}

.submit-container>button[type=submit] {
  margin-inline: auto;
}

.submit-container>button[type=submit]:not(:first-child) {
  margin-top: 0.5em;
}

/* ================================================================
page
================================================================ */
/*
top
---------------------------------------------------------------- */
/* === .section-instagram === */
.section-instagram .account-block:not(:first-child) {
  margin-top: calc(var(--space-100) * 1);
}

.section-instagram .account-block .account-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.section-instagram .account-block .account-title .ja {
  margin-bottom: 0.75em;
  font-size: var(--fs-md);
}

.section-instagram .account-block .account-title .ja::before {
  content: "- ";
}

.section-instagram .account-block .account-title .en {
  font-family: var(--ff-en-primary);
  font-size: max(40px, 2.8dvw);
  font-weight: 700;
  letter-spacing: var(--ls-narrow);
}

@media screen and (max-width: 768px) {
  .section-instagram .account-block .account-title .en {
    font-size: max(36px, 5.2083333333dvw);
  }
}

@media screen and (max-width: 768px) {
  .section-instagram .account-block .account-title .en {
    font-size: max(32px, 6.25dvw);
  }
}

/* === .section-company === */
.section-company .section-title::before {
  right: 50%;
}

.section-company .table th {
  width: 25%;
}

/* === .section-recruit === */
.section-recruit .section-title::before {
  right: 50%;
}

.section-recruit .business-title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin-bottom: 0.75em;
  padding: 0.35em;
  background: var(--accent-brand);
  color: var(--text-black);
  font-size: var(--fs-lg);
  font-weight: 700;
  line-height: var(--lh-narrow);
  place-self: end start;
}

.section-recruit .content {
  grid-template-columns: auto minmax(0, 1fr);
}

.section-recruit .content .title {
  font-size: max(2.4dvw, 40px);
  margin-left: -0.5em;
}

@media screen and (max-width: 1400px) {
  .section-recruit .content .title {
    font-size: max(2.8571428571dvw, 32px);
  }
}

@media screen and (max-width: 1200px) {
  .section-recruit .content .title {
    font-size: max(2.6666666667dvw, 26px);
  }
}

@media screen and (max-width: 992px) {
  .section-recruit .content .title {
    font-size: max(2.6209677419dvw, 23px);
  }
}

.section-recruit .content .title>span {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background: var(--text-black);
  color: var(--text-white);
  white-space: nowrap;
}

.section-recruit .content .title>span:not(:first-child) {
  margin-top: 0.1em;
}

@media screen and (max-width: 768px) {
  .section-recruit .content .business-title {
    margin-inline: 15%;
  }
}

@media screen and (max-width: 768px) and (max-width: 576px) {
  .section-recruit .content .business-title {
    margin-inline: 0;
  }
}

@media screen and (max-width: 768px) {
  .section-recruit .content>.text {
    width: 70%;
    margin-inline: auto;
  }
}

@media screen and (max-width: 768px) and (max-width: 576px) {
  .section-recruit .content>.text {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .section-recruit .content .title {
    font-size: max(4.1666666667dvw, 25px);
    margin-left: 0;
  }
}

@media screen and (max-width: 768px) and (max-width: 576px) {
  .section-recruit .content .title {
    font-size: max(4.8611111111dvw, 22px);
  }
}

.section-recruit .ideal_profile {
  margin-top: max(1.4dvw, 1.5em);
  padding: max(1.6dvw, 1.5em);
  border-radius: 2px;
  background: var(--bg-middle) var(--bg-noise);
}

.section-recruit .ideal-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 0.4em;
}

.section-recruit .ideal-list .ideal-item:not(:first-child) {
  margin-top: 0;
}

.section-recruit .recruit-block:not(:first-child) {
  margin-top: calc(var(--space-100) * 0.68);
}

.section-recruit .recruit-block .accordion {
  margin-top: calc(var(--space-100) * 0.2);
}

.section-recruit .recruit-block .recruit-ac-header {
  padding: max(1dvw, 1em);
  color: var(--text-white);
  background: #5e5e5e var(--bg-noise);
}

.section-recruit .recruit-block .recruit-ac-header .toggle-button::before,
.section-recruit .recruit-block .recruit-ac-header .toggle-button::after {
  background: var(--text-white);
}

.section-recruit .recruit-block .recruit-ac-desc {
  margin-top: calc(var(--space-100) * 0.12);
}

.section-recruit .recruit-block .recruit-ac-desc>.desc {
  width: 100%;
}

.section-recruit .recruit-block .business-list {
  font-size: var(--fs-lg);
  font-weight: 500;
}

.section-recruit .recruit-block .business-list+.desc {
  margin-top: 0.75em;
}

.section-recruit .recruit-block .flow-list--candidate {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.section-recruit .recruit-block .flow-list--candidate .flow-item a {
  color: var(--text-white);
  text-decoration: underline;
}

.section-recruit .recruit-block .flow-list--candidate .flow-item:last-child {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  gap: max(1dvw, 1em);
  padding: max(1.6dvw, 1.75em);
  background: var(--text-black);
  color: var(--text-white);
  position: relative;
  grid-column: auto;
}

.section-recruit .recruit-block .flow-list--candidate .flow-item:last-child::after {
  content: "";
}

@media screen and (max-width: 768px) {
  .section-recruit .recruit-block .flow-list--candidate {
    grid-template-columns: minmax(0, 1fr);
  }
}

.section-recruit .message {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 2em max(3dvw, 4em);
  padding: max(4dvw, 3em) max(2dvw, 2em);
  background: var(--bg-middle) var(--bg-noise);
}

.section-recruit .message>.md-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.75em;
  white-space: nowrap;
}

.section-recruit .message>.md-title .en {
  font-family: var(--ff-en-primary);
  font-weight: 800;
  font-size: max(3dvw, 48px);
  line-height: 0.8;
  letter-spacing: 0.01em;
}

.section-recruit .message>.md-title .ja {
  font-size: var(--fs-lg);
  font-weight: 500;
}

.section-recruit .message>.desc .bold {
  font-weight: 700;
}

.section-recruit .message>.desc .strong {
  font-size: 1.25em;
  font-weight: 700;
}

@media screen and (max-width: 768px) {
  .section-recruit .message {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .section-recruit .message>.md-title,
  .section-recruit .message>.desc p {
    text-align: center;
    -moz-text-align-last: center;
    text-align-last: center;
  }
}

/*
tennis
---------------------------------------------------------------- */
.page-tennis {
  /* === .button.role-reception === */
}

.page-tennis .role-reception {
  background: var(--accent-tennis);
}

.page-tennis {
  /* === .lower-fv === */
}

.page-tennis .lower-fv {
  background: url(../assets/images/tennis/lower-fv-img.jpg) no-repeat center/cover;
}

.page-tennis {
  /* === .section-title === */
}

.page-tennis .section-title .en {
  color: var(--accent-tennis);
}

.page-tennis {
  /* === .topics-info === */
}

.page-tennis .topics-info.is-latest::before {
  color: var(--accent-tennis);
}

.page-tennis {
  /* === .banner === */
}

.page-tennis .banner .img::before {
  background: var(--accent-tennis);
}

.page-tennis {
  /* === .parallax === */
}

.page-tennis .parallax01 .img {
  background-image: url(../assets/images/tennis/parallax01.jpg);
}

.page-tennis .parallax02 .img {
  background-image: url(../assets/images/tennis/parallax02.jpg);
}

.page-tennis {
  /* === .topics-block === */
}

.page-tennis .topics-block .topics-item>a::after {
  background: var(--accent-tennis);
}

.page-tennis {
  /* === .news-result === */
}

.page-tennis .news-result>.inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 2.5em max(1.4dvw, 1em);
}

@media screen and (max-width: 576px) {
  .page-tennis .news-result>.inner {
    grid-template-columns: minmax(0, 1fr);
  }
}

.page-tennis {
  /* === .section-faq === */
}

.page-tennis .section-faq a {
  text-decoration: underline;
}

.page-tennis .section-faq .root-item {
  line-height: 1.75;
}

.page-tennis .section-faq .root-item:not(:first-child) {
  margin-top: 0.75em;
}

.page-tennis .section-faq .registration {
  margin-top: 0.75em;
}

.page-tennis {
  /* === .p-lower-footer === */
}

@media screen and (max-width: 576px) {
  .page-tennis .p-lower-footer {
    padding-bottom: 140px;
  }
}

/* === .lead-tennis === */
.lead-tennis {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1em max(3dvw, 1em);
  margin-top: calc(var(--space-100) * 1.36);
}

.lead-tennis .band {
  margin-left: -0.5em;
  background: var(--text-white);
  font-size: max(2.7dvw, 44px);
  font-weight: 900;
  letter-spacing: var(--ls-min);
  white-space: nowrap;
}

.lead-tennis .band:nth-of-type(2) {
  margin-top: 0.1em;
}

@media screen and (max-width: 992px) {
  .lead-tennis {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
  }

  .lead-tennis .band {
    font-size: max(4.435483871dvw, 36px);
  }
}

@media screen and (max-width: 768px) {
  .lead-tennis {
    grid-template-columns: minmax(0, 1fr);
  }

  .lead-tennis .band {
    margin-left: 0;
    font-size: max(4.6875dvw, 28px);
  }

  .lead-tennis>.desc {
    padding-inline: 0.5em;
    font-size: max(4.6875dvw, 28px);
  }

  .lead-tennis>.desc>p {
    font-size: var(--fs-md);
  }
}

/* === .section-event === */
.section-event {
  margin-top: calc(var(--space-100) * 0.48);
}

.section-event .topics-block .content {
  margin-top: 1em;
  height: auto;
}

.section-event>.detail {
  margin-top: calc(var(--space-100) * 0.48);
}

/* === .section-instagram === */
.section-instagram .section-title::before {
  right: 38%;
}

/* === .section-school === */
.section-school .section-title::before {
  left: 59%;
}

.section-school .content-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: max(0.4dvw, 2px);
}

.section-school .content-item {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.section-school .content-item>a {
  width: 100%;
  padding: 1.25em;
  border: 2px solid var(--text-black);
  text-align: center;
  font-size: max(1dvw, 1rem);
  font-weight: 500;
  -webkit-transition: background var(--animation-button), color var(--animation-button);
  transition: background var(--animation-button), color var(--animation-button);
}

@media (any-hover: hover) {
  .section-school .content-item>a:hover {
    background: var(--text-black);
    color: var(--text-white);
  }
}

.section-school .content-header {
  margin-bottom: 1.3333333333em;
  padding-inline: 1em;
  font-size: var(--fs-lg);
  background: var(--text-black);
  color: var(--text-white);
}

.section-school .title .main,
.section-school .title .sub {
  font-size: max(2.7dvw, 36px);
  white-space: nowrap;
}

.section-school .title .sub {
  margin-top: 0.1em;
}

.section-school .title .band {
  margin-left: -0.5em;
  background: var(--text-white);
  font-weight: 900;
  letter-spacing: var(--ls-min);
  white-space: nowrap;
}

.section-school .title .strong {
  background: var(--text-black);
  color: var(--text-white);
}

@media screen and (max-width: 768px) {
  .section-school .title .sub {
    font-size: max(4.6875dvw, 28px);
  }
}

@media screen and (max-width: 576px) {
  .section-school .title .band {
    margin-left: 0;
  }

  .section-school .title .main {
    font-size: max(6.25dvw, 26px);
  }

  .section-school .title .main.band {
    padding-inline: 0.35em;
  }

  .section-school .title .sub {
    font-size: max(4.5138888889dvw, 14px);
  }

  .section-school .title .sub .band:nth-of-type(2),
  .section-school .title .sub .band:nth-of-type(3) {
    margin-left: -0.5em;
  }
}

.section-school .banner-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: max(1.4dvw, 1em);
  margin-top: calc(var(--space-100) * 0.48);
}

@media screen and (max-width: 992px) {
  .section-school .banner-list .md-title .small {
    display: block;
  }
}

@media screen and (max-width: 576px) {
  .section-school .banner-list {
    grid-template-columns: minmax(0, 1fr);
  }
}

.section-school .parallax01 {
  margin-top: calc(var(--space-100) * 0.6);
}

.section-school .guide .guide-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: end;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: calc(var(--space-100) * 0.6);
}

.section-school .guide .guide-header .md-title {
  font-size: var(--fs-xl);
}

.section-school .guide .guide-header .anchor-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(148px, 10dvw));
  gap: 0.5em;
  font-size: max(0.75dvw, 0.8125rem);
}

@media screen and (max-width: 767px) {
  .section-school .guide .guide-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
  }

  .section-school .guide .guide-header .section-title {
    margin-bottom: calc(var(--space-100) * 0.36);
  }

  .section-school .guide .guide-header .anchor-list {
    grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    width: 100%;
  }
}

.section-school .guide .addendum {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 2.5em;
  border: 1px solid var(--accent-gray);
  background: var(--accent-white);
  font-size: var(--fs-md);
}

.section-school .guide .addendum>.title {
  display: grid;
  place-items: center;
  padding: max(2.4dvw, 1em) max(4dvw, 1.25em);
  background: var(--accent-gray);
  font-style: italic;
  font-size: max(1dvw, 1rem);
  font-weight: 700;
  color: var(--text-white);
}

.section-school .guide .addendum>.detail {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  padding: max(2.4dvw, 1em) max(4dvw, 1.25em);
}

.section-school .guide .addendum .flow {
  margin-top: 1.25em;
}

.section-school .guide .addendum .md-title {
  margin-bottom: 0.5em;
}

.section-school .guide .addendum .flow-item {
  line-height: var(--lh-narrow);
}

@media screen and (max-width: 768px) {
  .section-school .guide .addendum {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .section-school .guide .addendum>.title {
    text-align: center;
  }
}

.section-school .guide .file-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: max(1.4dvw, 1em);
  margin-top: 4em;
}

@media screen and (max-width: 576px) {
  .section-school .guide .file-list {
    grid-template-columns: minmax(0, 1fr);
  }
}

.section-school .for-adults {
  margin-top: calc(var(--space-100) * 1);
}

.section-school .for-kids {
  margin-top: calc(var(--space-100) * 1.36);
}

@media screen and (max-width: 576px) {
  .section-school .for-kids .title .band:not(:first-child) {
    margin-left: -0.5em;
  }
}

.section-school .for-kids .kids-img {
  aspect-ratio: 3.3028/1;
  overflow: hidden;
}

.section-school .for-kids .kids-img img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media screen and (max-width: 768px) {
  .section-school .for-kids .kids-img {
    aspect-ratio: var(--ar-gold-primary);
  }
}

/* === .section-profile === */
.section-profile .section-title::before {
  left: 65%;
}

.section-profile .content {
  margin-inline: calc(50% - 50dvw);
  padding-inline: calc(50dvw - 50%);
  margin-top: var(--space-100);
}

.section-profile .profile-slider .swiper {
  overflow: visible;
}

.section-profile .profile-item {
  aspect-ratio: 4/5;
  padding: max(2dvw, 24px);
  background: var(--accent-white);
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}

@media screen and (max-width: 576px) {
  .section-profile .profile-item {
    aspect-ratio: 3/4;
  }
}

.section-profile .profile-item::before {
  content: "";
  display: block;
  width: 70.2380952381%;
  rotate: -15deg;
  aspect-ratio: 1/1;
  -webkit-mask: url(../assets/images/tennis/icon-ball.svg) no-repeat center/contain;
  mask: url(../assets/images/tennis/icon-ball.svg) no-repeat center/contain;
  background: var(--accent-tennis);
  opacity: 0.03;
  position: absolute;
  bottom: -10%;
  right: -10%;
}

.section-profile .profile-item>.img {
  aspect-ratio: var(--ar-gold-primary);
}

.section-profile .profile-item>.text {
  margin-top: 1.5em;
}

.section-profile .profile-item>.text>.name {
  font-size: var(--fs-xl);
  font-weight: 500;
}

.section-profile .profile-item>.text>.name .en {
  display: block;
  margin-top: 0.5em;
  font-family: var(--ff-en-primary);
  font-size: max(0.7em, 0.75rem);
  color: var(--accent-tennis);
}

.section-profile .profile-item>.text>.desc {
  margin-top: 0.75em;
}

.section-profile .swiper-control {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: calc(var(--space-100) * 0.4);
}

/* === .section-faq === */
.section-faq .section-title::before {
  right: 70%;
}

/* === .section-regular_use === */
.section-regular_use .section-title::before {
  text-align: end;
  left: 60%;
}

@media screen and (max-width: 576px) {
  .section-regular_use .section-title::before {
    bottom: -25% !important;
  }
}

.section-regular_use .content-table .button {
  margin: max(3dvw, 2em) auto 0;
}

/*
futsal
---------------------------------------------------------------- */
.page-futsal {
  /* === .button.role-reception === */
}

.page-futsal .role-reception {
  background: var(--accent-futsal);
}

.page-futsal {
  /* === .p-fixed-cta === */
}

@media screen and (max-width: 768px) {
  .page-futsal .p-fixed-cta {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    bottom: max(3.6dvw, 1.5rem);
  }

  .page-futsal .p-fixed-cta .button {
    width: 180px;
  }

  .page-futsal .p-fixed-cta.is-spread {
    bottom: 3dvw;
  }
}

.page-futsal {
  /* === .lower-fv === */
}

.page-futsal .lower-fv {
  background: url(../assets/images/futsal/lower-fv-img.jpg) no-repeat center/cover;
}

.page-futsal {
  /* === .section-title === */
}

.page-futsal .section-title .en {
  color: var(--accent-futsal);
}

.page-futsal {
  /* === .topics-info === */
}

.page-futsal .topics-info.is-latest::before {
  color: var(--accent-futsal);
}

.page-futsal {
  /* === .banner === */
}

.page-futsal .banner .img::before {
  background: var(--accent-futsal);
}

.page-futsal {
  /* === .parallax === */
}

.page-futsal .parallax01 .img {
  background-image: url(../assets/images/futsal/parallax01.jpg);
}

.page-futsal {
  /* === .topics-block === */
}

.page-futsal .topics-block .topics-item>a::after {
  background: var(--accent-futsal);
}

.page-futsal {
  /* === .section-reservation === */
}

.page-futsal .section-reservation {
  margin-top: calc(var(--space-100) * 1.36);
}

.page-futsal .section-reservation .section-title::before {
  left: 62%;
}

.page-futsal .section-reservation .labola_frame {
  height: 480px;
}

.page-futsal .section-reservation .labola_frame>iframe {
  width: 100%;
  height: 100%;
}

.page-futsal {
  /* === .news-result === */
}

.page-futsal .news-result>.inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 2.5em max(1.4dvw, 1em);
}

@media screen and (max-width: 576px) {
  .page-futsal .news-result>.inner {
    grid-template-columns: minmax(0, 1fr);
  }
}

.page-futsal {
  /* === .section-faq === */
}

.page-futsal .section-faq a {
  text-decoration: underline;
}

.page-futsal .section-faq .root-item {
  line-height: 1.75;
}

.page-futsal .section-faq .root-item:not(:first-child) {
  margin-top: 0.75em;
}

.page-futsal .section-faq .registration {
  margin-top: 0.75em;
}

.page-futsal {
  /* === .p-lower-footer === */
}

@media screen and (max-width: 768px) {
  .page-futsal .p-lower-footer {
    padding-bottom: 192px;
  }
}

/* === .section-event === */
.section-event {
  margin-top: calc(var(--space-100) * 0.48);
}

.section-event>.detail {
  margin-top: calc(var(--space-100) * 0.48);
}

/* === .section-league === */
.section-league .section-title::before {
  left: 66%;
}

.section-league .file {
  margin-inline: auto;
}

/* === .section-price === */
.section-price .section-title::before {
  left: 64%;
}

/*
drone
---------------------------------------------------------------- */
.page-drone {
  /* === .button.role-reception === */
}

.page-drone .role-reception {
  background: var(--accent-drone);
}

.page-drone {
  /* === .lower-fv === */
}

.page-drone .lower-fv {
  background: url(../assets/images/drone/lower-fv-img.jpg) no-repeat center/cover;
}

.page-drone {
  /* === .section-title === */
}

.page-drone .section-title .en {
  color: var(--accent-drone);
}

.page-drone {
  /* === .topics-info === */
}

.page-drone .topics-info.is-latest::before {
  color: var(--accent-drone);
}

.page-drone {
  /* === .banner === */
}

.page-drone .banner .img::before {
  background: var(--accent-drone);
}

.page-drone {
  /* === .parallax === */
}

.page-drone .parallax01 .img {
  background-image: url(../assets/images/drone/parallax01.jpg);
}

@media screen and (max-width: 576px) {
  .page-drone .parallax01 .img {
    background-image: url(../assets/images/drone/parallax01-sp.jpg);
  }
}

.page-drone {
  /* === .topics-block === */
}

.page-drone .topics-block .topics-item>a::after {
  background: var(--accent-drone);
}

.page-drone {
  /* === .section-news === */
}

.page-drone .section-news {
  margin-top: calc(var(--space-100) * 1.36);
}

.page-drone {
  /* === .section-facility === */
}

.page-drone .section-facility .content {
  grid-template-rows: auto minmax(0, 1fr);
}

.page-drone .section-facility .title {
  font-size: max(2.4dvw, 40px);
  font-weight: 700;
  line-height: var(--lh-single);
}

@media screen and (max-width: 1400px) {
  .page-drone .section-facility .title {
    font-size: max(2.8571428571dvw, 32px);
  }
}

@media screen and (max-width: 1200px) {
  .page-drone .section-facility .title {
    font-size: max(2.6666666667dvw, 26px);
  }
}

@media screen and (max-width: 992px) {
  .page-drone .section-facility .title {
    font-size: max(2.6209677419dvw, 23px);
  }
}

.page-drone .section-facility .title .band {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: -0.5em;
  background: var(--text-black);
  color: var(--text-white);
}

.page-drone .section-facility .title .band:nth-child(2) {
  margin-top: 0.1em;
}

.page-drone .section-facility .desc {
  margin-top: max(2dvw, 1em);
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .page-drone .section-facility .content>.text {
    width: 70%;
    margin-inline: auto;
  }
}

@media screen and (max-width: 768px) and (max-width: 576px) {
  .page-drone .section-facility .content>.text {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .page-drone .section-facility .title {
    font-size: max(4.1666666667dvw, 28px);
  }
}

@media screen and (max-width: 768px) and (max-width: 576px) {
  .page-drone .section-facility .title {
    font-size: max(4.8611111111dvw, 22px);
  }
}

@media screen and (max-width: 768px) {
  .page-drone .section-facility .title .band {
    margin-left: 0;
  }
}

/* === .drone-content === */
.drone-content .content-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 2em max(3.4dvw, 28px);
  margin-top: calc(var(--space-100) * 1.36);
}

.drone-content .content-header+.c-hr {
  margin-top: calc(var(--space-100) * 1);
}

.drone-content .content-title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 0;
}

.drone-content .content-title .ja {
  font-size: var(--fs-xl);
}

.drone-content .content-title .en {
  font-size: max(5.6dvw, 72px);
  font-weight: 900;
  line-height: 0.85;
  letter-spacing: var(--ls-narrow);
  color: var(--accent-drone);
}

.drone-content .recommend {
  width: 100%;
  text-align: center;
}

.drone-content .recommend>.title {
  padding: 0.4em 0.85em;
  background: var(--text-black);
  font-size: max(1.2dvw, 1.25rem);
  font-weight: 700;
  color: var(--text-white);
  position: relative;
  z-index: 10;
}

.drone-content .recommend>.desc {
  padding: max(3dvw, 3em) 2em max(2.4dvw, 2.25em);
  background: var(--button-secondary);
  border: 1px solid var(--text-black);
  border-radius: 2px;
  font-weight: 500;
  -webkit-transform: translateY(-1.5em);
  transform: translateY(-1.5em);
}

.drone-content .recommend .recommend-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  place-content: center;
  gap: 0.4em 2em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}

.drone-content .recommend .recommend-list>li {
  margin-top: 0;
}

@media screen and (max-width: 992px) {
  .drone-content .content-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: 520px;
    margin-inline: auto;
  }

  .drone-content .recommend>.desc {
    display: grid;
    place-content: center;
  }

  .drone-content .recommend .recommend-list {
    grid-template-columns: auto;
  }
}

@media screen and (max-width: 768px) {
  .drone-content .content-title .ja {
    font-size: var(--fs-md);
  }

  .drone-content .content-title .en {
    font-size: max(9.375dvw, 68px);
  }

  .drone-content .content-title .en>br {
    display: none;
  }
}

@media screen and (max-width: 576px) {
  .drone-content .content-title .en {
    font-size: max(11.8055555556dvw, 40px);
  }

  .drone-content .recommend>.title {
    font-size: var(--fs-xl);
  }
}

/* === .section-price === */
.section-price .section-title::before {
  left: 62%;
}

.section-price>.detail {
  margin-top: calc(var(--space-100) * 0.48);
}

/* === .section-feature === */
.section-feature .section-title::before {
  right: 59%;
}

/* === .section-faq === */
.section-faq>.inner {
  max-width: calc(var(--container-base) - var(--container-pd) * 2);
  margin-inline: auto;
}

.section-faq .section-title::before {
  left: 70%;
}

/*
pickle
---------------------------------------------------------------- */
.page-pickle {
  /* === .button.role-reception === */
}

.page-pickle .role-reception {
  background: var(--accent-pickle);
}

.page-pickle {
  /* === .lower-fv === */
}

.page-pickle .lower-fv {
  background: url(../assets/images/pickle/lower-fv-img.jpg) no-repeat center/cover;
}

.page-pickle {
  /* === .section-title === */
}

.page-pickle .section-title .en {
  color: var(--accent-pickle);
}

.page-pickle {
  /* === .topics-info === */
}

.page-pickle .topics-info.is-latest::before {
  color: var(--accent-pickle);
}

.page-pickle {
  /* === .banner === */
}

.page-pickle .banner .img::before {
  background: var(--accent-pickle);
}

.page-pickle {
  /* === .parallax === */
}

.page-pickle .parallax01 .img {
  background-image: url(../assets/images/pickle/parallax01.jpg);
}

.page-pickle {
  /* === .topics-block === */
}

.page-pickle .topics-block .topics-item>a::after {
  background: var(--accent-pickle);
}

.page-pickle {
  /* === .news-result === */
}

.page-pickle .news-result>.inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 2.5em max(1.4dvw, 1em);
}

@media screen and (max-width: 576px) {
  .page-pickle .news-result>.inner {
    grid-template-columns: minmax(0, 1fr);
  }
}

.page-pickle {
  /* === .p-lower-footer === */
}

@media screen and (max-width: 576px) {
  .page-pickle .p-lower-footer {
    padding-bottom: 140px;
  }
}

/* === .lead-pickle === */
.lead-pickle .band {
  font-size: max(2dvw, 40px);
}

@media screen and (max-width: 992px) {
  .lead-pickle {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .lead-pickle .band:nth-of-type(1) {
    font-size: max(22px, 5.2083333333dvw);
  }

  .lead-pickle .band:nth-of-type(2) {
    font-size: max(18px, 5.2083333333dvw);
  }
}

@media screen and (max-width: 375px) {
  .lead-pickle .band:nth-of-type(1) {
    font-size: 5.8666666667dvw;
  }

  .lead-pickle .band:nth-of-type(2) {
    font-size: 5.3333333333dvw;
  }
}

/*
news
---------------------------------------------------------------- */
.page-news {
  /* === .section-title === */
}

@media screen and (max-width: 576px) {
  .page-news .section-title .en {
    line-height: 0.875;
  }
}

.page-news {
  /* === .category-block === */
}

.page-news .category-block {
  width: 100%;
}

.page-news .category-block .category-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0.75em 2em;
}

@media screen and (max-width: 576px) {
  .page-news .category-block .category-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.page-news {
  /* === .topics-block === */
}

.page-news .topics-block {
  margin-top: calc(var(--space-100) * 0.4);
  padding-top: calc(max(4dvw, 40px) - 1.5em);
}

.page-news .topics-block>.inner {
  display: block;
}

.page-news .topics-block .content {
  height: auto;
}

/*
news-detail
---------------------------------------------------------------- */
.page-news-detail {
  /* === .section-title === */
}

@media screen and (max-width: 576px) {
  .page-news-detail .section-title .en {
    line-height: 0.875;
  }
}

.page-news-detail {
  /* === .button === */
}

.page-news-detail .button.back {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: start;
  gap: 0.5em;
  padding: 1em 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: none;
  margin-top: 3em;
}

.page-news-detail .button.back .arrow {
  background: var(--text-black);
  -webkit-transform: scale(-1, 1);
  transform: scale(-1, 1);
}

/* === .topics-header === */
.topics-header .topics-info .date {
  font-weight: 500;
}

.topics-header .topics-title {
  margin-top: 0.5em;
  font-size: var(--fs-xxl);
  line-height: var(--lh-narrow);
}

/* === .topics-content === */
.topics-content {
  margin-top: calc(var(--space-100) * 0.6);
}

.topics-content>*:not(:first-child) {
  margin-top: 2.5em;
}

.topics-content .topics-gallery {
  width: max(70%, 516px);
  margin-inline: auto;
}

@media screen and (max-width: 768px) {
  .topics-content .topics-gallery {
    width: 100%;
  }
}

.topics-content .topics-gallery .swiper-navigation {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: end;
  margin-bottom: 0.5em;
}

.topics-content .topics-gallery .swiper-navigation .arrow {
  width: max(3dvw, 48px);
}

/* 
form
---------------------------------------------------------------- */
.page-entry .section-title .en,
.page-cancel .section-title .en {
  color: var(--text-black);
}

.page-entry .page-lead,
.page-cancel .page-lead {
  font-weight: 500;
}

.page-entry .confirmation,
.page-cancel .confirmation {
  margin-top: 2.5em;
}

.page-entry .confirmation>h2,
.page-cancel .confirmation>h2 {
  font-size: var(--fs-md);
}

.page-entry .event-toggle,
.page-cancel .event-toggle {
  margin-top: 0.75em;
}

.page-entry .event-toggle .inner,
.page-entry .event-toggle .info-list,
.page-cancel .event-toggle .inner,
.page-cancel .event-toggle .info-list {
  width: 100%;
}

.page-entry .event-toggle .event-header .inner,
.page-cancel .event-toggle .event-header .inner {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.page-entry .event-toggle .event-header .title,
.page-cancel .event-toggle .event-header .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5em;
}

.page-entry .event-toggle .event-header .title .name,
.page-cancel .event-toggle .event-header .title .name {
  margin-top: 0;
}

.page-entry .event-toggle .event-header .toggle-button::before,
.page-entry .event-toggle .event-header .toggle-button::after,
.page-cancel .event-toggle .event-header .toggle-button::before,
.page-cancel .event-toggle .event-header .toggle-button::after {
  background: var(--text-white);
}

.page-entry .event-detail>.inner,
.page-cancel .event-detail>.inner {
  padding-bottom: 1em;
}

.page-entry .form-table,
.page-cancel .form-table {
  margin-top: 2em;
}

.page-entry .form-table table,
.page-cancel .form-table table {
  font-size: max(0.75dvw, 14px);
}

/* 
form
---------------------------------------------------------------- */
.page-contact input[type=radio]:checked::before {
  background: var(--text-black);
}

.page-contact input[type=checkbox]::before {
  border-left: 0.275em solid var(--text-black);
  border-bottom: 0.275em solid var(--text-black);
}

.page-contact .section-title .en {
  color: var(--text-black);
}

.page-contact .page-lead {
  font-weight: 500;
}

.page-contact .form-table {
  margin-top: 3em;
}

.page-contact .form-table table {
  font-size: max(0.75dvw, 14px);
}

/* === #tel === */
.section-tel .button {
  width: 100%;
  padding: 2.25em 1.75em;
}

@media screen and (max-width: 576px) {
  .section-tel .button {
    max-width: none;
  }
}

.section-tel .button>.icon {
  width: calc(max(1.4dvw, 1.25rem) * 0.75);
}

.section-tel .button>.text {
  font-size: max(1.4dvw, 1.25rem);
  font-weight: 700;
}

.section-tel+hr {
  margin-top: var(--space-100);
}

/* === #mail === */
.section-mail .section-title {
  margin-bottom: calc(var(--space-100) * 0.8);
}

.section-mail .section-title::before {
  left: 50%;
}

.section-mail .red {
  color: var(--caution-red);
}

/* 
print
---------------------------------------------------------------- */
/*# sourceMappingURL=style.css.map */


/* 20260930 add */

.c-event-item .info-item.price .price-price {
  white-space: normal;
  overflow-wrap: break-word;
}

.c-event-item .info-item.price .price-price dd {
  line-height: 1.5;
}

@media screen and (max-width: 576px) {
  .c-event-item .info-item.price .price-price dd {
    padding-right: 14px;
  }
}