@charset "UTF-8";
/*
  Josh's Custom CSS Reset
  https://www.joshwcomeau.com/css/custom-css-reset/
*/
*, *::before, *::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

html, body {
  height: 100%;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

#root, #__next {
  isolation: isolate;
}

/*
 * メディアクエリ用mixin
 */
/*
 * 関数定義用ファイル
 */
/*
 * サイト内パラメータ設定ファイル
 */
/*
 * 流体タイポ計算用 関数
 * 
 * @use parts/_fonts.scssファイルを参照
 */
.font-10-14 {
  font-size: clamp(0.625rem, 0.1785714286vw + 0.5892857143rem, 0.875rem);
}

.font-12-14 {
  font-size: clamp(0.75rem, 0.0892857143vw + 0.7321428571rem, 0.875rem);
}

.font-14-16 {
  font-size: clamp(0.875rem, 0.0892857143vw + 0.8571428571rem, 1rem);
}

.font-14-20 {
  font-size: clamp(0.875rem, 0.2678571429vw + 0.8214285714rem, 1.25rem);
}

.font-16-24 {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
}

.font-16-18 {
  font-size: clamp(1rem, 0.0892857143vw + 0.9821428571rem, 1.125rem);
}

.font-16-20 {
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
}

.font-36-65 {
  font-size: clamp(2.25rem, 1.2946428571vw + 1.9910714286rem, 4.0625rem);
}

.font-36-48 {
  font-size: clamp(2.25rem, 0.5357142857vw + 2.1428571429rem, 3rem);
}

.font-48-72 {
  font-size: clamp(3rem, 1.0714285714vw + 2.7857142857rem, 4.5rem);
}

.font-48-84 {
  font-size: clamp(3rem, 1.6071428571vw + 2.6785714286rem, 5.25rem);
}

.font-48-110 {
  font-size: clamp(3rem, 2.7678571429vw + 2.4464285714rem, 6.875rem);
}

.font-48-96 {
  font-size: clamp(3rem, 2.1428571429vw + 2.5714285714rem, 6rem);
}

:root {
  --c-text: #222222;
  --c-main: #0068B6;
  --c-accent: #F9BE00;
  --c-main-light: #BEE5F9;
  --c-black: #000000;
  --c-white: #ffffff;
  --c-gray: #EBEBEB;
  --c-lightgray: rgb(141, 141, 141);
  --c-hero-overlay:rgba(0, 104, 182, 0.3);
  --scroll-duration: 80s; /* 初期値 */
  --skew-value: 15deg;
  --catchprase-text-width: -22.38em;
  --window-height: 100vh;
  --acc-speed: .35s;
}

html {
  font-size: 100%;
  -webkit-font-smoothing: antialiased;
}

body {
  height: auto;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  color: var(--c-text);
  margin: 0;
}
body.disable-hover {
  pointer-events: none;
}

body.fixed {
  height: 100%;
  overflow: hidden;
}

a {
  text-decoration: none;
  color: var(--c-text);
  transition: opacity 0.3s ease;
}
a:hover {
  opacity: 0.8;
}

h1,
h2,
h3,
h4,
p,
ul,
li {
  padding: 0;
  margin: 0;
}

li {
  list-style: none;
}

img {
  vertical-align: bottom;
  width: 100%;
  height: auto;
}

h1,
h2,
h3 {
  color: var(--c-text);
}

input, button, textarea {
  -webkit-appearance: none;
  appearance: none;
}

main {
  overflow: hidden;
}

.font-jp, body {
  font-family: "Noto Sans JP", serif;
  font-optical-sizing: auto;
  font-feature-settings: "palt";
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.05em;
  text-align: justify;
}

.font-en, .catchphrase .catchphrase__text, .faq__ul__wrapper .mark, .faq__ul__wrapper dd.js-acccontent .faq__dd__inner::before, .faq__ul__wrapper dt.js-accbtn::before {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-feature-settings: "palt";
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.05em;
}

.content-width, body#confirm-thanks .container, .section__inner {
  width: 90%;
  margin: 0 auto;
  max-width: 160rem;
}

.content-width-narrow {
  max-width: 80rem;
  margin: 0 auto;
}

.emphasis {
  font-weight: 700;
  color: var(--c-main);
}

.tac {
  text-align: center;
}

.ta-left {
  text-align: left;
}

.ta-center {
  text-align: center;
}

.dib {
  display: inline-block;
}

.db {
  display: block;
}

.indent, .faq__ul__wrapper dd.js-acccontent .faq__dd__inner, .faq__ul__wrapper dt.js-accbtn {
  display: flex;
  align-items: baseline;
}

.numbered-list {
  counter-reset: item;
  list-style: none;
  padding-left: 0;
}

.numbered-list li {
  counter-increment: item;
  position: relative;
  padding-left: 1.5em;
}

.numbered-list li::before {
  content: counter(item) "."; /* 番号＋ドット */
  position: absolute;
  left: 0;
  font-weight: bold;
}

.link-btn a, .link-btn button {
  display: block;
  background: var(--c-white);
  text-align: center;
  border: 2px solid var(--c-main);
  border-radius: 1000px;
  font-weight: 700;
  font-size: clamp(1.25rem, 0.3571428571vw + 1.1785714286rem, 1.75rem);
  color: var(--c-main);
  width: 20em;
  max-width: min(100%, 560px);
  margin: 4em auto 6em auto;
  padding: 0.75em 0;
  line-height: 1;
  transition: all 0.3s ease;
  will-change: transform;
  perspective: 100px;
  transform: translate3d(0px, 0px, -100px);
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.link-btn a::before, .link-btn button::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 7.5%;
  width: 0.75em;
  height: 0.75em;
  opacity: 1;
  border-top: 3px solid var(--c-main);
  border-right: 3px solid var(--c-main);
  transform: rotate(45deg) skew(0deg) translate3d(0, -50%, 0);
  transition: right 0.3s ease, border 0.3s ease;
}
.link-btn a::after, .link-btn button::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--c-main);
  z-index: -1;
  transform-origin: right;
  transform: scale(0, 1);
  transition: transform 0.3s ease;
}
.link-btn a:hover, .link-btn button:hover {
  opacity: 1;
  color: var(--c-white);
}
.link-btn a:hover::before, .link-btn button:hover::before {
  right: 6%;
  opacity: 1;
  border-color: var(--c-white);
}
.link-btn a:hover::after, .link-btn button:hover::after {
  transform: scale(1, 1);
  transform-origin: left;
}

.loop-slider {
  overflow: hidden;
  font-size: clamp(1.25rem, 0.8928571429vw + 1.0714285714rem, 2.5rem);
  width: 100%;
  display: flex;
  position: relative;
  perspective: 100px;
  will-change: transform;
}
.loop-slider .loop-slider__slides {
  display: flex;
  animation: infinity-scroll-left var(--scroll-duration) infinite linear;
  animation-direction: reverse;
}
.loop-slider .loop-slider__slides .loop-slider__slide {
  width: 20em;
  aspect-ratio: 775/400;
  transform: skew(-12.5deg);
  overflow: hidden;
}
.loop-slider .loop-slider__slides .loop-slider__slide .loop-slider__slide__inner {
  transform: skew(12.5deg);
  width: 20em;
  aspect-ratio: 775/400;
}
.loop-slider .loop-slider__slides .loop-slider__slide picture, .loop-slider .loop-slider__slides .loop-slider__slide img {
  transform: scale(1.1);
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.loop-slider .loop-slider__slides.loop-slider__slides-reverse {
  animation-direction: reverse;
}
@keyframes infinity-scroll-left {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-200em, 0, 0);
  }
}

.section-left-title .title-en {
  color: var(--c-main);
  font-size: clamp(3.75rem, 2.6785714286vw + 3.2142857143rem, 7.5rem);
  font-weight: 600;
  letter-spacing: 0;
}
.section-left-title .h2-headline {
  font-size: clamp(1.5rem, 0.3571428571vw + 1.4285714286rem, 2rem);
}
@media print, screen and (min-width: 960px) {
  .section-left-title {
    display: flex;
    align-items: center;
    gap: 2em;
    justify-content: flex-start;
  }
}

.faq__ul__wrapper .faq__dl {
  margin-top: 2em;
  font-size: clamp(1.5rem, 0.3571428571vw + 1.4285714286rem, 2rem);
  border-bottom: 1px solid #A1A1A1;
  text-align: left;
}
.faq__ul__wrapper .mark, .faq__ul__wrapper dd.js-acccontent .faq__dd__inner::before, .faq__ul__wrapper dt.js-accbtn::before {
  font-weight: 600;
  display: inline-block;
  font-size: clamp(2rem, 1.4285714286vw + 1.7142857143rem, 4rem);
  position: relative;
  margin-right: 0.35em;
  top: 0.1em;
}
.faq__ul__wrapper dt.js-accbtn {
  padding-top: 0.5em;
  padding-bottom: 1em;
  border-top: 1px solid #A1A1A1;
  cursor: pointer;
}
.faq__ul__wrapper dt.js-accbtn h3 {
  font-size: clamp(1.125rem, 0.625vw + 1rem, 2rem);
  font-weight: 700;
  position: relative;
  z-index: 1;
  width: 100%;
  padding-right: 2.5em;
}
.faq__ul__wrapper dt.js-accbtn h3::before {
  content: "";
  position: absolute;
  width: 1em;
  height: 2px;
  background: var(--c-accent);
  top: 0.75em;
  right: 0.5em;
  z-index: 2;
}
.faq__ul__wrapper dt.js-accbtn h3::after {
  content: "";
  position: absolute;
  width: 1em;
  height: 2px;
  background: var(--c-accent);
  top: 0.75em;
  right: 0.5em;
  z-index: 2;
  transform-origin: center center;
  transform: rotate(-90deg);
  opacity: 1;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.faq__ul__wrapper dt.js-accbtn.open h3::after {
  transform: rotate(0deg);
  opacity: 0;
}
.faq__ul__wrapper dt.js-accbtn::before {
  content: "Q";
  color: var(--c-accent);
}
.faq__ul__wrapper dd.js-acccontent {
  overflow: hidden;
  max-height: 0;
  transition: max-height var(--acc-speed) ease;
}
.faq__ul__wrapper dd.js-acccontent[aria-hidden=false] {
  /* 600px は “十分に大きい” 値にする。auto だと transition が効かない */
  max-height: 600px;
}
.faq__ul__wrapper dd.js-acccontent .faq__dd__inner {
  align-items: flex-start;
  padding-bottom: 1.5em;
}
.faq__ul__wrapper dd.js-acccontent .faq__dd__inner::before {
  top: 0;
  content: "A";
  color: var(--c-main);
}
.faq__ul__wrapper dd.js-acccontent p {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  font-weight: 700;
  line-height: 1.7;
  padding-top: 1em;
}
.faq__ul__wrapper dd.js-acccontent .dd-strong {
  color: var(--c-main);
}
.faq__ul__wrapper dd.js-acccontent .faq__dd__box ul {
  margin-top: 0.5em;
}
.faq__ul__wrapper dd.js-acccontent .faq__dd__box ul li {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  font-weight: 700;
  margin-top: 0.25em;
}
.faq__ul__wrapper dd.js-acccontent .faq__dd__box ul li .dd-list-mark {
  margin-right: 0.5em;
}
.faq__ul__wrapper .faq-pagelink {
  color: var(--c-main);
  text-decoration: underline;
}

.to-page-top {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  width: 2em;
  position: fixed;
  right: 1em;
  bottom: 1em;
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease;
}
.to-page-top.inview {
  visibility: visible;
  opacity: 1;
}

a.tel-tap-link:hover {
  opacity: 1;
}

section.cta {
  margin-top: 10em;
  font-size: clamp(0.875rem, 0.4464285714vw + 0.7857142857rem, 1.5rem);
  padding-bottom: 4em;
  padding-top: 5em;
  position: relative;
}
section.cta .cta-title {
  font-size: clamp(3.75rem, 2.6785714286vw + 3.2142857143rem, 7.5rem);
  position: absolute;
  top: -0.8em;
  left: 0;
  width: 100%;
}
section.cta .cta-title h2.title-en {
  text-align: center;
  color: var(--c-accent);
  font-size: clamp(3.75rem, 2.6785714286vw + 3.2142857143rem, 7.5rem);
  font-weight: 600;
  letter-spacing: 0;
}
section.cta .cta-lower-title {
  color: var(--c-white);
  text-align: center;
  font-weight: 700;
  line-height: 1.75;
}
section.cta .cta__content__inner {
  background: var(--c-white);
  padding: 2em 2em 2.5em 2em;
  margin-top: 2em;
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
}
section.cta .cta__content__inner p {
  font-size: clamp(0.875rem, 0.2678571429vw + 0.8214285714rem, 1.25rem);
  line-height: 1.75;
}
section.cta .cta__content__inner p br {
  display: none;
}
@media print, screen and (min-width: 550px) {
  section.cta .cta__content__inner p {
    text-align: center;
  }
  section.cta .cta__content__inner p br {
    display: block;
  }
}
section.cta .cta__link {
  margin-top: 2em;
}
section.cta .cta__link a {
  display: block;
  background: var(--c-accent);
  font-size: clamp(1.5rem, 0.7142857143vw + 1.3571428571rem, 2.5rem);
  font-weight: 700;
  text-align: center;
  padding: 0.5em;
  width: 90%;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 48px;
  position: relative;
  transition: all 0.3s ease;
  overflow: hidden;
  z-index: 0;
  perspective: 100px;
  will-change: transform;
  transform: translate3d(0px, 0px, 0px);
}
section.cta .cta__link a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--c-main);
  z-index: -1;
  transform-origin: right;
  transform: scale(0, 1) translate3d(0px, 0px, 0px);
  transition: transform 0.3s ease;
}
section.cta .cta__link a:hover {
  opacity: 1;
  color: var(--c-white);
}
section.cta .cta__link a:hover::before {
  transform-origin: left;
  transform: scale(1, 1) translate3d(0px, 0px, 0px);
}
section.cta .cta__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
section.cta .cta__bg picture, section.cta .cta__bg img {
  object-fit: cover;
  object-position: center bottom;
  width: 100%;
  height: 100%;
}
section.cta .cta__bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--c-main);
  opacity: 0.6;
}

/** 
不要のため削除可（header.phpに移行） 
ただし、loader.scss -> loader.css にビルド（npm run build）した後のコード（dist内に生成されるloader-****.cssファイル）をコピーして、header.php内に張り付ける方がコードのメンテがしやすいため、そのようにして使っていただければと思います。
**/
/*
<div class="loader-wrapper"><div class="loader__inner">Go Next</div></div>
*/
.loader-wrapper {
  --c-pageTransitionDuration: 0.5s;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  z-index: 1000;
  pointer-events: none;
  transform-origin: right;
  transition: transform 0s linear;
}
.loader-wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--c-main);
  z-index: 1002;
  transform-origin: right;
  transform: scaleX(1);
  transition: transform 0s linear;
}
.loader-wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--c-white);
  z-index: 1001;
  transform-origin: right;
  transform: scaleX(1);
  transition: transform 0s linear;
}
.loader-wrapper .loader__inner {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1004;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 1;
  transition: opacity 0s 0s ease;
}
.loader-wrapper.inview::before {
  transform-origin: right;
  animation: scaleDown 0.35s 0s ease forwards;
}
.loader-wrapper.inview::after {
  transform-origin: right;
  animation: scaleDown 0.35s 0.2s ease forwards;
}
.loader-wrapper.inview .loader__inner {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.1s 0.2s ease;
}
.loader-wrapper.fadeOut::before {
  animation: scaleUp 0.35s 0s ease forwards;
}
.loader-wrapper.fadeOut::after {
  animation: scaleUp 0.35s 0.2s ease forwards;
}
.loader-wrapper.fadeOut .loader__inner {
  opacity: 1;
}
.loader-wrapper .hyogonext-loader {
  width: 80%;
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.loader-wrapper .hyogonext-loader .hyogonext-img {
  width: 100%;
  max-width: 100%;
  display: block;
}

@keyframes scaleDown {
  0% {
    transform-origin: right;
    transform: scaleX(1);
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}
@keyframes scaleUp {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }
  100% {
    transform-origin: left;
    transform: scaleX(1);
  }
}
@keyframes ball-scale {
  0% {
    opacity: 1;
    transform: translateX(-50%) scale(0);
  }
  100% {
    transform: translateX(-50%) scale(1);
    opacity: 0;
  }
}
body#home .hyogonext-loader::before {
  content: "";
  font-size: clamp(0.75rem, 0.5357142857vw + 0.6428571429rem, 1.5rem);
  background-color: #ffffff;
  border-radius: 50%;
  animation-fill-mode: both;
  display: inline-block;
  height: 3em;
  width: 3em;
  position: absolute;
  bottom: -5em;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
  opacity: 0;
  animation: ball-scale 1s 1s ease-in-out infinite;
}

body#home .loader-wrapper.fadeOut .hyogonext-loader::before {
  display: none;
}

body {
  position: relative;
}

main {
  position: relative;
}

.section__inner {
  position: relative;
  z-index: 0;
  max-width: 80rem;
  font-size: clamp(0.875rem, 0.625vw + 0.75rem, 1.75rem);
  margin-bottom: 6em;
}
.section__inner__full {
  width: 100%;
}
.section__inner__full__pc {
  width: 100%;
  max-width: 100%;
}

.content__top__bg__outer .section__inner {
  z-index: 2;
}

.section-spacer {
  font-size: clamp(1rem, 0.7142857143vw + 0.8571428571rem, 2rem);
  margin-top: 2em;
  margin-bottom: 2em;
  visibility: hidden;
}

.footer-spacer {
  font-size: clamp(0.875rem, 1.25vw + 0.625rem, 2.625rem);
  margin-top: 2em;
  margin-bottom: 2em;
  visibility: hidden;
}

.effect-clip .split-text__wrapper span.char {
  clip-path: polygon(0px 0px, 0px 0px, 0px 100%, 0px 100%);
  transition: clip-path 480ms cubic-bezier(0.23, 1, 0.32, 1);
  transition-delay: calc(var(--index, 0) * 64ms);
  will-change: transform;
}
.effect-clip .split-text__wrapper.inview {
  transform: translate(0, 0);
}
.effect-clip .split-text__wrapper.inview span.char {
  clip-path: polygon(0px 0px, 108% 0px, 100% 100%, 0px 100%);
}

.h2-headline-home.effect-clip .split-text__wrapper span.char {
  clip-path: polygon(0px 0px, 0px 0px, 0px 100%, 0px 100%);
  transform: translate(0, 0);
  transition: transform 640ms cubic-bezier(0.23, 1, 0.32, 1), clip-path 640ms cubic-bezier(0.23, 1, 0.32, 1);
  transition-delay: calc(500ms + var(--index, 0) * 24ms);
  display: inline-block;
  will-change: transform;
}

.h2-headline-home.effect-clip.inview .split-text__wrapper span.char {
  clip-path: polygon(0px 0px, 108% 0px, 100% 100%, 0px 100%);
  transform: translate(0, 0);
}

.effect-clip-title {
  --translateX: .75em;
}
.effect-clip-title .split-text__wrapper {
  position: relative;
  z-index: 0;
}
.effect-clip-title .split-text__wrapper span.char {
  display: inline-block;
  clip-path: polygon(0px 0px, 0px 0px, 0px 100%, 0px 100%);
  transform: translate(0px, 0px);
  transition: transform 0.5s 0.5s ease, clip-path 640ms 0.2s cubic-bezier(0.23, 1, 0.32, 1);
  transition-delay: calc(0.35s + var(--index, 0) * 32ms);
  will-change: transform;
}
.effect-clip-title .split-text__wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: var(--c-main);
  transform: scaleX(0);
  transform-origin: left;
}

.effect-clip-title.inview .split-text__wrapper span.char {
  clip-path: polygon(0px 0px, 108% 0px, 100% 100%, 0px 100%);
  transform: translate(0px, 0px);
}
.effect-clip-title.inview .split-text__wrapper::before {
  animation: effectTranslateX 0.5s 0s cubic-bezier(0.86, 0, 0.07, 1) forwards;
}
@keyframes effectTranslateX {
  0% {
    transform: scaleX(0);
    transform-origin: left;
  }
  50% {
    transform: scaleX(1);
    transform-origin: left;
  }
  50.1% {
    transform: scaleX(1);
    transform-origin: right;
  }
  100% {
    transform: scaleX(0);
    transform-origin: right;
  }
}

.effect-bounce span.char {
  display: inline-block;
  transform: translateY(0);
  transform-origin: bottom;
}
.effect-bounce.inview span.char {
  animation: charBounce 0.3s ease forwards;
  animation-delay: calc(0.35s + var(--index) * 45ms);
}
@keyframes charBounce {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20%);
  }
  100% {
    transform: translateY(0);
  }
}

a .effect-bounce-button span.char {
  display: inline-block;
  transform: translateY(0);
  transform-origin: bottom;
}
a:hover span.char {
  animation: charBounce 0.2s ease forwards;
  animation-delay: calc(0.2s + var(--index) * 35ms);
}
@keyframes charBounce {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-30%);
  }
  100% {
    transform: translateY(0);
  }
}

.inview-target.inview .split-text__wrapper {
  transform: translate(0, 0);
}
.inview-target.inview .split-text__wrapper span.char {
  clip-path: polygon(0px 0px, 108% 0px, 100% 100%, 0px 100%);
  transition-delay: calc(var(--index, 0) * 64ms);
  transform: translate(0px, 0px);
}

.js-chain-anim-parent {
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.75s 0.35s cubic-bezier(0.86, 0, 0.07, 1);
}
.js-chain-anim-parent .chain-anim-child {
  opacity: 0;
  transition: opacity 0.5s ease;
}
.js-chain-anim-parent.inview {
  transform: scaleX(1);
}
.js-chain-anim-parent.inview .chain-anim-child.chain-anim-start {
  opacity: 1;
}

body:not(.home) .header nav ul a {
  color: var(--c-main);
}
body:not(.home) .header nav ul a::before {
  background: var(--c-main);
}
@media (max-width: 1019px) {
  body:not(.home) .header nav ul a {
    color: var(--c-text);
  }
}

.header {
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  position: fixed;
  top: 0;
  left: 50%;
  width: 100%;
  transform: translateX(-50%);
  z-index: 10;
  transition: all 0.5s ease;
  opacity: 1;
  visibility: visible;
}
.header.add-bg {
  background: rgb(255, 255, 255);
  transition: all 0.5s ease;
}
.header.hidden {
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease;
}
.header .logo {
  display: block;
  font-size: clamp(0.875rem, 0.4910714286vw + 0.7767857143rem, 1.5625rem);
  width: 18em;
  z-index: 3;
  transition: width 0.1s 0s ease, opacity 0.5s ease;
}
.header__inner {
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header .nav-toggle {
  display: none;
  padding-top: 0em;
  margin-top: 1em;
  font-size: clamp(0.75rem, 0.625vw + 0.625rem, 1.625rem);
  width: 3.5em;
  height: 3.5em;
  cursor: pointer;
}
.header .nav-toggle__inner {
  position: relative;
  width: 80%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
}
.header .nav-toggle span {
  position: absolute;
  display: block;
  width: 100%;
  height: 2px;
  background-color: var(--c-text);
  top: 50%;
  margin-top: -1px;
  border-radius: 4px;
  transition: background-color 0.125s ease-in 0.175s;
}
.header .nav-toggle span:first-child {
  top: 30%;
  left: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s linear 0.125s, left 0.125s ease-in 0.175s;
}
.header .nav-toggle span:nth-child(2) {
  left: 0;
}
.header .nav-toggle span:last-child {
  top: 70%;
  right: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s linear 0.125s, right 0.125s ease-in 0.175s;
}
.header .nav-toggle.is-active span {
  transition-delay: 0.35s;
  transition-timing-function: ease-out;
  background-color: transparent;
}
.header .nav-toggle.is-active span:first-child {
  top: -50%;
  left: -150%;
  transition: left 0.125s ease-out 0.35s, top 0.05s linear 0.61s, transform 0.125s cubic-bezier(0.075, 0.82, 0.165, 1) 0.66s;
  transform: translate3d(150%, 3.5em, 0) rotate(45deg);
  background-color: var(--c-text) !important;
}
.header .nav-toggle.is-active span:last-child {
  top: -50%;
  right: -100%;
  transition: right 0.125s ease-out 0.35s, top 0.05s linear 0.61s, transform 0.125s cubic-bezier(0.075, 0.82, 0.165, 1) 0.66s;
  transform: translate3d(-100%, 3.5em, 0) rotate(-45deg);
  background-color: var(--c-text) !important;
}

@media (max-width: 1199px) {
  .header .nav-toggle {
    display: block;
  }
  .nav-area {
    z-index: 2;
  }
  .header .nav-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    z-index: -1;
    background-color: var(--c-white);
    font-size: clamp(1.125rem, 0.5357142857vw + 1.0178571429rem, 1.875rem);
    padding: 5em 0 2em 0;
    transform: translateX(-100%);
    transition: transform 0.35s ease;
    overflow: auto;
    padding-bottom: 4em;
  }
  .header .nav-wrapper__inner {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  .header .nav-wrapper nav li {
    overflow: hidden;
  }
  .header .nav-wrapper nav a {
    color: var(--c-text);
    display: block;
    padding: 0.75em 0;
    transform: translateY(10%);
    opacity: 0;
    transition: transform 0.3s linear, opacity 0.5s ease;
    transition-delay: 0s;
    font-weight: 700;
    font-size: clamp(1.25rem, 0.4464285714vw + 1.1607142857rem, 1.875rem);
    text-align: center;
  }
  .header .nav-wrapper .nav-member {
    margin-top: 2em;
    opacity: 0;
    transition: opacity 0s ease;
    transition-delay: 0;
  }
  .header .nav-wrapper .nav-member__title {
    text-align: center;
    color: var(--c-accent);
    font-weight: 700;
    font-size: 1.5em;
    margin-bottom: 0.25em;
  }
  .header .nav-wrapper .nav-member__button {
    font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
    background-color: var(--c-main);
    color: var(--c-white);
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 1em 2em;
    text-align: center;
    border-radius: 1000px;
    font-weight: 700;
    max-width: 18em;
  }
  .header .nav-wrapper .nav-sns {
    margin-top: 3em;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2em;
    opacity: 0;
    transition: opacity 0s ease;
    transition-delay: 0;
  }
  .header .nav-wrapper .nav-sns__x {
    width: 1.65em;
  }
  .header .nav-wrapper .nav-sns__youtube {
    width: 2.5em;
  }
  .header .nav-wrapper.is-active {
    transform: translateX(0%);
  }
  .header .nav-wrapper.is-active a {
    transform: translateY(0%);
    opacity: 1;
  }
  .header .nav-wrapper.is-active li:nth-child(1) a {
    transition-delay: 0.25s;
  }
  .header .nav-wrapper.is-active li:nth-child(2) a {
    transition-delay: 0.35s;
  }
  .header .nav-wrapper.is-active li:nth-child(3) a {
    transition-delay: 0.45s;
  }
  .header .nav-wrapper.is-active li:nth-child(4) a {
    transition-delay: 0.55s;
  }
  .header .nav-wrapper.is-active li:nth-child(5) a {
    transition-delay: 0.65s;
  }
  .header .nav-wrapper.is-active .nav-member, .header .nav-wrapper.is-active .nav-sns {
    transition: opacity 0.5s ease;
    transition-delay: 0.75s;
    opacity: 1;
  }
}
@media (max-height: 600px) {
  .nav-wrapper nav a {
    padding: 0.5em 0;
  }
  .nav-member {
    margin-top: 2em;
  }
  .nav-member__title {
    font-size: 1.35em;
    margin-bottom: 0.25em;
  }
  .nav-wrapper .nav-sns {
    margin-top: 1.5em;
    gap: 2em;
  }
}
@media print, screen and (min-width: 1200px) {
  .nav-member, .nav-sns {
    display: none;
  }
  .header {
    padding-top: 1em;
    padding-bottom: 1em;
  }
  .header nav {
    font-size: clamp(0.875rem, 0.3571428571vw + 0.8035714286rem, 1.375rem);
    width: clamp(680px, 46vw, 930px);
    padding-top: 1.25em;
  }
  .header nav ul {
    display: flex;
    justify-content: space-between;
  }
  .header nav ul a {
    color: var(--c-white);
    font-weight: 700;
    position: relative;
    padding: 0.5em 0.5em;
    display: block;
    white-space: nowrap;
  }
  .header nav ul a::before {
    content: "";
    position: absolute;
    bottom: 0.15em;
    left: 0.5em;
    width: calc(100% - 1em);
    height: 2px;
    background: var(--c-white);
    transform-origin: right;
    transform: scaleX(0);
    transition: transform 0.15s cubic-bezier(0.37, 0.04, 0.94, 0.41);
  }
  .header nav ul a:hover {
    opacity: 1;
  }
  .header nav ul a:hover::before {
    transform: scaleX(1);
    transform-origin: left;
  }
  .header.add-bg nav ul a {
    color: var(--c-main);
  }
  .header.add-bg nav ul a::before {
    background: var(--c-main);
  }
  .header.add-bg {
    padding-top: 0.5em;
    padding-bottom: 1em;
  }
  .header.add-bg nav {
    padding-top: 0.75em;
  }
  .header.add-bg .logo {
    width: 15em;
    transition: width 0.1s 0.2s ease, opacity 0.3s ease;
  }
}
body.home header.header {
  opacity: 0;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slideWidth {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
body.home.start header.header {
  animation: fadeIn 0.5s 1s ease forwards;
}

footer.footer {
  background: var(--c-main);
  padding-top: 3em;
  padding-bottom: 6em;
}

.footer__inner {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  margin-bottom: 0;
}
.footer__inner .footer__logo {
  width: 18em;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2em;
}
.footer__inner .footer__logo a {
  transition: opacity 0.5s ease;
}
.footer__inner .footer__logo a:hover {
  opacity: 0.8;
}
.footer__inner .footer__sns {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2em;
  width: 8em;
  margin-left: auto;
  margin-right: auto;
}
.footer__inner .footer__sns__pc {
  display: none;
}
.footer__inner .footer__sns__sp {
  margin-bottom: 1.5em;
  width: 6em;
  gap: 1.5em;
}

.footer-nav {
  width: 18em;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.5em;
  margin-bottom: 3em;
}
.footer-nav ul li a {
  display: block;
  color: var(--c-white);
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  font-weight: 550;
  padding: 0.75em 0.5em;
  text-align: center;
  position: relative;
  white-space: nowrap;
}
.footer-nav ul li a::before {
  content: "";
  position: absolute;
  bottom: 0.35em;
  left: 0.5em;
  width: calc(100% - 1em);
  height: 2px;
  background: var(--c-white);
  transform-origin: right;
  transform: scaleX(0);
  transition: transform 0.15s cubic-bezier(0.37, 0.04, 0.94, 0.41);
}
@media (max-width: 1024px) {
  .footer-nav ul li a::before {
    opacity: 0;
  }
}
.footer-nav ul li a:hover {
  opacity: 1;
}
.footer-nav ul li a:hover::before {
  transform: scaleX(1);
  transform-origin: left;
}

.copyright p {
  color: var(--c-white);
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  text-align: center;
  font-weight: 550;
}

@media print, screen and (min-width: 1200px) {
  footer.footer {
    padding-bottom: 4em;
  }
  .footer__upper {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
  }
  .footer__upper .footer__logo {
    width: 18em;
    margin-left: 0;
    margin-right: auto;
    margin-bottom: 0em;
  }
  .footer__upper .footer__sns {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2em;
    width: 8em;
    margin-left: auto;
    margin-right: 0;
  }
  .footer__lower {
    display: flex;
    justify-content: space-between;
    margin-top: 2.5em;
    align-items: center;
  }
  .footer__lower .footer-nav {
    width: 75%;
    max-width: 800px;
    margin-left: 0;
    margin-right: auto;
    margin-top: 0em;
    margin-bottom: 0em;
  }
  .footer__lower .footer-nav ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .footer__lower .footer-nav ul li a {
    display: block;
    color: var(--c-white);
    font-size: clamp(0.875rem, 0.1785714286vw + 0.8392857143rem, 1.125rem);
    font-weight: 550;
    padding: 0.75em 1em;
    text-align: left;
  }
  .footer__inner .footer__sns__sp {
    display: none;
  }
}
.wrapper {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  transform: scaleX(1);
  transform-origin: left;
  background-color: blue;
  z-index: 1000;
}
.wrapper.inview {
  animation: pageTransition 0.5s cubic-bezier(0.55, 0.05, 0.93, 0.29) forwards;
}
@keyframes pageTransition {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0%);
  }
}
.wrapper.fadeOut {
  transform-origin: right;
  animation: pageTransition2 0.5s cubic-bezier(0.55, 0.05, 0.93, 0.29) forwards;
}
@keyframes pageTransition2 {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(1);
  }
}

.hero {
  position: relative;
  z-index: 0;
}
.hero__inner {
  width: 100%;
  height: var(--window-height);
  position: relative;
  overflow: hidden;
}
.hero__inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--c-hero-overlay);
  z-index: 1;
}
.hero img {
  object-fit: cover;
  width: 100%;
  height: var(--window-height);
  object-position: top center;
  position: relative;
  z-index: 0;
  transform: scale(1.2);
  transform-origin: center;
  transition: transform 8s linear;
}
.hero__inner.inview img {
  transform: scale(1);
}
.hero .catch {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  font-size: clamp(3.125rem, 9.8214285714vw + 1.1607142857rem, 16.875rem);
  width: 6.2em;
}
.hero .catch-en {
  text-align: center;
  position: relative;
}
.hero .catch-en h1 {
  font-size: clamp(3.125rem, 9.8214285714vw + 1.1607142857rem, 16.875rem);
  white-space: nowrap;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1;
}
.hero .catch-en .text-hyo {
  color: var(--c-white);
}
.hero .catch-en .text-gonext .char {
  --c-gradation-color: var(--c-main);
  display: inline-block;
  -webkit-text-fill-color: transparent; /* Safari 用（iOS でも確実） */
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
  background-image: linear-gradient(90deg, white, white 20%, var(--c-gradation-color) 50%, white 80% 100%);
  background-size: 500% 100%;
  background-position: 100% 0;
}
.hero .catch-en .text-gonext.inview .char {
  animation: bg-slide2 8s linear infinite;
  animation-delay: calc(var(--index, 0) * 64ms);
}
@keyframes bg-slide2 {
  0% {
    background-position: 100% 0;
  }
  3% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 0; /* ← 左→右に 1 周 */
  }
}
.hero .catch-en-sub {
  text-align: right;
  color: var(--c-white);
  font-size: clamp(1rem, 1.2946428571vw + 0.7410714286rem, 2.8125rem);
  font-weight: 700;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.75s 3s ease;
  overflow: hidden;
}
.hero .catch-en-sub p {
  font-weight: 700;
}
@media print, screen and (min-width: 768px) {
  .hero .catch-en-sub__br {
    display: none;
  }
}
@media (max-width: 1479px) {
  .hero .catch-en-sub {
    margin-top: 0.5em;
  }
}
.hero .catch-jp {
  margin-top: 2em;
  font-size: clamp(1.25rem, 1.3392857143vw + 0.9821428571rem, 3.125rem);
  opacity: 0;
  transform: translateY(0.25em);
  transition: opacity 0.5s 3.8s ease, transform 0.5s 3.3s ease;
}
.hero .catch-jp p {
  font-weight: 700;
  color: var(--c-white);
  line-height: 1.5;
}

.membership__wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--window-height);
  z-index: 1;
}
.membership__wrapper .membership {
  font-size: clamp(3.125rem, 9.8214285714vw + 1.1607142857rem, 16.875rem);
  position: absolute;
  left: 50%;
  bottom: 11%;
  z-index: 2;
  width: 90%;
  max-width: 6.3em;
  transform: translateX(-50%);
}
@media (min-height: 700px) {
  .membership__wrapper .membership {
    bottom: 15%;
  }
}
.membership__wrapper .membership__link__wrapper {
  font-size: clamp(1.25rem, 0.8035714286vw + 1.0892857143rem, 2.375rem);
  width: 7em;
  height: 7em;
  margin-left: auto;
  margin-right: 0;
  transform-origin: center;
  transform: scale(0);
}
.membership__wrapper .membership a {
  background: linear-gradient(180deg, #ffffff, #ffffff 50%, var(--c-accent));
  background-color: var(--c-accent);
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
  opacity: 1;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.5s ease;
}
.membership__wrapper .membership-en {
  font-size: clamp(1.25rem, 0.8035714286vw + 1.0892857143rem, 2.375rem);
  color: var(--c-accent);
  font-weight: 700;
  margin-bottom: 0.1em;
  transition: color 0.5s 0.1s ease;
}
.membership__wrapper .membership-jp {
  font-size: clamp(1.125rem, 0.5357142857vw + 1.0178571429rem, 1.875rem);
  color: var(--c-main);
  font-weight: 600;
}
@media (max-width: 550px) and (max-height: 750px) {
  .membership__wrapper .membership {
    transform: translateX(-35%) scale(0.7);
    bottom: 8%;
  }
}
.membership__wrapper a:hover {
  opacity: 1;
  background: var(--c-accent);
}
.membership__wrapper a:hover .membership-en {
  color: var(--c-white);
}

.catch, .membership, .intro {
  opacity: 0;
}

.hero__inner img, .hero__inner picture, .hero__inner::before {
  opacity: 0;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slideWidth {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
body.start .catch, body.start .membership, body.start .intro {
  animation: fadeIn 0.5s 1s ease forwards;
}
body.start .hero__inner img, body.start .hero__inner picture, body.start .hero__inner::before {
  animation: fadeIn 0.5s 0s ease forwards;
}
body.start .catch-en-sub {
  clip-path: inset(0 0 0 0);
}
body.start .catch-jp {
  opacity: 1;
  transform: translateY(0em);
}
body.start .membership__link__wrapper {
  animation: circleScale 0.75s 4000ms ease forwards;
}
@keyframes circleScale {
  0% {
    transform: scale(0);
  }
  60% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}

section.intro {
  position: absolute;
  top: calc(var(--window-height) * 0.87);
  left: 0;
  width: 100%;
  height: auto;
  z-index: 3;
}
@media (max-width: 960px) {
  section.intro {
    top: calc(var(--window-height) * 0.9);
  }
}
section.intro .intro__text h2, section.intro .intro__text p {
  color: var(--c-white);
  font-size: clamp(1rem, 0.4464285714vw + 0.9107142857rem, 1.625rem);
  font-weight: 500;
  line-height: 2;
}
@media (max-width: 450px) {
  section.intro .intro__text h2, section.intro .intro__text p {
    display: inline !important;
  }
}
section.intro .intro__text__first {
  margin-bottom: 3em;
  opacity: 0;
  transition: opacity 1s 0.5s ease;
}
section.intro .intro__text__second {
  opacity: 0;
  transition: opacity 1s 0.75s ease;
}
section.intro .intro__text .b-size {
  font-weight: 700;
  font-size: clamp(1.5625rem, 0.7589285714vw + 1.4107142857rem, 2.625rem);
}
@media (max-width: 440px) {
  section.intro .intro__text br.intro__br {
    display: none;
  }
}

section.intro.isInviewed .intro__text__first.inview {
  opacity: 1;
}
section.intro.isInviewed .intro__text__second.inview {
  opacity: 1;
}

.intro__mizushima__outer {
  will-change: transform;
  transform: translateZ(0);
  perspective: 600px;
  width: 100%;
  height: 100%;
}
.intro__mizushima__outer .intro__mizushima__wrapper {
  font-size: clamp(0.875rem, 0.4464285714vw + 0.7857142857rem, 1.5rem);
  background-image: linear-gradient(#7dccf3, #00469b);
  overflow: hidden;
  padding-top: 20em;
  transform: translate3d(0, 0, 0) scale(0, 1) skewY(0deg);
  transform-origin: left top;
  transition: transform 0.75s ease;
  width: 100%;
}
@media (max-width: 768px) {
  .intro__mizushima__outer .intro__mizushima__wrapper {
    transition-duration: 0.5s;
  }
}
.intro__mizushima__outer .intro__mizushima__wrapper .intro__mizushima {
  transform: skewY(var(--skew-value));
  transform-origin: top left;
  position: relative;
  opacity: 0;
  transition: opacity 1s ease;
  transition-delay: 0.8s;
  margin-bottom: 0em;
}
@media print, screen and (min-width: 960px) {
  .intro__mizushima__outer .intro__mizushima__wrapper .intro__mizushima {
    transition-delay: 1s;
  }
}
.intro__mizushima__outer .intro__mizushima__wrapper .intro__mizushima__inner {
  width: 100%;
  aspect-ratio: 800/800;
  max-width: 800px;
  min-width: 200px;
}
@media (max-width: 960px) {
  .intro__mizushima__outer .intro__mizushima__wrapper {
    padding-top: 20em;
  }
}
@media (max-width: 429px) {
  .intro__mizushima__outer .intro__mizushima__wrapper {
    padding-top: 22em;
  }
}
@media (max-width: 375px) {
  .intro__mizushima__outer .intro__mizushima__wrapper {
    padding-top: 25em;
  }
}
@media print, screen and (min-width: 960px) {
  .intro__mizushima__outer .intro__mizushima__wrapper {
    padding-top: 2em;
  }
  .intro__mizushima__outer .intro__mizushima__wrapper .intro__mizushima__inner {
    position: relative;
    width: 55%;
    margin-right: 0;
    margin-left: auto;
  }
}
@media (min-width: 960px) and (max-width: 1360px) {
  .intro__mizushima__outer .intro__mizushima__wrapper .intro__mizushima__inner {
    width: 55%;
  }
}
@media (min-width: 960px) and (min-height: 900px) {
  .intro__mizushima__outer .intro__mizushima__wrapper .intro__mizushima__inner {
    margin-top: -5%;
  }
}
.intro__mizushima__outer.inview .intro__mizushima__wrapper {
  transform: translate3d(0, 0, 0) scale(1, 1) skewY(calc(var(--skew-value) * -1));
}
.intro__mizushima__outer.inview .intro__mizushima.inview {
  opacity: 1;
}

section.purpose {
  margin-top: 1em;
}
section.purpose .h2-headline.h2-headline-home {
  color: var(--c-main);
  font-weight: 700;
  text-align: center;
  font-size: clamp(1.875rem, 1.5178571429vw + 1.5714285714rem, 4rem);
  margin-bottom: 1em;
}
section.purpose .purpose__card {
  font-size: clamp(1.875rem, 1.5178571429vw + 1.5714285714rem, 4rem);
  background: var(--c-main-light);
  padding: 1em 0.5em;
}
section.purpose .purpose__card .h3-headline.h3-headline-home {
  text-align: center;
  color: var(--c-main);
  font-size: clamp(1.125rem, 1.3392857143vw + 0.8571428571rem, 3rem);
  font-weight: 700;
  margin-bottom: 1em;
}
section.purpose .purpose__card .purpose__card__example {
  font-size: clamp(1.125rem, 0.8035714286vw + 0.9642857143rem, 2.25rem);
  text-align: center;
  font-weight: 700;
  margin-bottom: 1.75em;
}
section.purpose .purpose__card .purpose__card__example span {
  background: var(--c-white);
  padding: 0.25em 0.5em;
}
section.purpose .purpose__card .purpose__card__list {
  max-width: 18em;
  margin-left: auto;
  margin-right: auto;
}
section.purpose .purpose__card .purpose__card__list li {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  font-weight: 550;
}
section.purpose .purpose__card .purpose__card__list li:not(:last-child) {
  margin-bottom: 1em;
}
section.purpose .purpose__card .purpose__card__list li span.list-mark {
  color: var(--c-main);
  margin-right: 0.25em;
}
section.purpose .purpose__card:not(:first-of-type) {
  margin-top: 1em;
}
section.purpose .purpose__card:nth-of-type(2) .purpose__card__list {
  max-width: 19.5em;
}

.slider-wrapper {
  position: relative;
}

.top-loop-slider {
  margin-top: 4em;
  margin-bottom: 3em;
}
.top-loop-slider .loop-slider__slides {
  background: url(../img/person/person_07.webp) no-repeat;
  background-size: contain;
  background-position: -13.125em 0%;
}

.catchphrase__inner {
  perspective: 100px;
  will-change: transform;
}

.catchphrase {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.catchphrase .catchphrase__text {
  font-size: clamp(5rem, 3.5714285714vw + 4.2857142857rem, 10rem);
  font-weight: 550;
  white-space: nowrap;
  line-height: 1;
  letter-spacing: 0;
  color: var(--c-white);
  color: rgba(255, 255, 255, 0.95);
  will-change: transform;
  animation: catchphraseAnim calc(var(--scroll-duration) * 0.8) linear infinite;
}
@keyframes catchphraseAnim {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(var(--catchprase-text-width), 0, 0);
  }
}

section.faq.top-faq .faq__ul__wrapper {
  margin-top: 2em;
}

@media print, screen and (min-width: 1024px) {
  .top-sns__wrapper {
    font-size: clamp(0.75rem, 1.25vw + 0.5rem, 2.5rem);
    display: flex;
    gap: 1.5em;
  }
  .top-sns__wrapper .top-sns-card {
    width: 33%;
  }
  .top-sns__wrapper .top-sns__x__img {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .top-sns__wrapper .top-sns__x__img picture, .top-sns__wrapper .top-sns__x__img img {
    max-width: 160px;
    margin-left: auto;
    margin-right: auto;
  }
}

.top-sns-card {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 4em;
  font-size: clamp(1.25rem, 0vw + 1.25rem, 1.25rem);
}
.top-sns-card .top-sns__x__img picture, .top-sns-card .top-sns__x__img img {
  width: 100%;
  max-width: 160px;
  margin-left: auto;
  margin-right: auto;
}
.top-sns-card .top-sns__lower-title {
  text-align: center;
  font-size: clamp(1.125rem, 0.2678571429vw + 1.0714285714rem, 1.5rem);
  margin: 1em 0;
}
.top-sns-card .top-sns__description {
  font-size: clamp(1rem, 0.0892857143vw + 0.9821428571rem, 1.125rem);
}
.top-sns-card .top-sns__youtube__thumb iframe, .top-sns-card .top-sns__youtube-sub__thumb iframe {
  width: 100%;
  aspect-ratio: 16/9;
  height: auto;
  vertical-align: bottom;
}

.page-title {
  margin-bottom: 4em;
  font-size: clamp(0.875rem, 0.4464285714vw + 0.7857142857rem, 1.5rem);
}
.page-title__inner {
  margin-bottom: 0;
}

@media print, screen and (min-width: 1280px) {
  .page-title__inner {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 2em;
  }
}

.page-title {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 11em 0 2em 0;
  position: relative;
  z-index: 0;
}
@media (max-width: 768px) {
  .page-title {
    padding: 6em 0 1.5em 0;
  }
}
.page-title::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-image: linear-gradient(0deg, #bee5f9, #ffffff);
  clip-path: polygon(0 0, 0% 100%, 100% 0);
  z-index: -1;
}
.page-title .page-title-en {
  color: var(--c-main);
  font-size: clamp(3rem, 3.2142857143vw + 2.3571428571rem, 7.5rem);
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.25;
  text-align: left;
  margin-bottom: 0.15em;
}
.page-title .page-title-en.ling-text {
  font-size: clamp(2.5rem, 3.5714285714vw + 1.7857142857rem, 7.5rem);
}
.page-title .page-title-headline {
  font-size: clamp(1.5rem, 0.3571428571vw + 1.4285714286rem, 2rem);
  font-weight: 700;
  line-height: 1.25;
}

@media (max-width: 449px) {
  body#privacypolicy .page-title .page-title-en,
  body#contact .page-title .page-title-en {
    font-size: clamp(2.5rem, 3.5714285714vw + 1.7857142857rem, 7.5rem);
  }
}
.page-intro p {
  font-weight: 550;
  font-size: clamp(1.125rem, 0.2678571429vw + 1.0714285714rem, 1.5rem);
  line-height: 2;
}
@media (max-width: 1324px) {
  .page-intro p .page-intro-br {
    display: none;
  }
}

.page-intro.mb4em {
  margin-bottom: 4em;
}

.page-intro.mb6em {
  margin-bottom: 6em;
}

.page-intro.mb-large {
  font-size: clamp(0.75rem, 0.7142857143vw + 0.6071428571rem, 1.75rem);
  margin-bottom: 8em;
}

.page-title-h2 {
  color: var(--c-main);
  font-size: clamp(1.5rem, 0.7142857143vw + 1.3571428571rem, 2.5rem);
  font-weight: 700;
  margin-bottom: 1.5em;
  text-align: left;
}

.page-title-h2-absolute {
  position: absolute;
  width: 100%;
  top: -0.85em;
  left: 0;
}

.page-title-h3 {
  font-size: clamp(1.25rem, 0.5357142857vw + 1.1428571429rem, 2rem);
  text-align: left;
  font-weight: 550;
  color: var(--c-main);
  margin-bottom: 1em;
}

input, button, textarea {
  -webkit-appearance: none;
  appearance: none;
}

input::placeholder, textarea::placeholder {
  color: #8D8D8D;
}

.form-area form input:focus,
.form-area form input:focus-visible,
.form-area form input:active,
.form-area form textarea:focus,
.form-area form textarea:focus-visible,
.form-area form textarea:active {
  outline: none;
  border: 1px solid var(--c-text);
}

fieldset {
  min-width: 0;
  margin: 0;
  border: 0;
  padding: 0;
}

legend {
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: left;
}

.form-area {
  background: var(--c-gray);
  font-size: clamp(1rem, 0.7142857143vw + 0.8571428571rem, 2rem);
  padding: 4em 0 1em 0;
}
.form-area__inner {
  margin-bottom: 5em;
}
.form-area .page-title-h2 {
  text-align: center;
  margin-bottom: 1em;
}
.form-area .form-desc {
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  text-align: center;
}
.form-area .form-warpper {
  margin-top: 4em;
}
.form-area .form__item {
  margin-top: 2em;
}
.form-area legend, .form-area .label__wrapper {
  font-size: clamp(1.25rem, 0.3571428571vw + 1.1785714286rem, 1.75rem);
  font-weight: 550;
  margin-bottom: 0.5em;
}
.form-area legend .required, .form-area .label__wrapper .required {
  background: var(--c-accent);
  font-size: clamp(1.125rem, 0.2678571429vw + 1.0714285714rem, 1.5rem);
  padding: 0.25em 0.5em;
  line-height: 1;
  margin-left: 0.5em;
  display: inline-block;
}
.form-area legend .optional, .form-area .label__wrapper .optional {
  background: var(--c-white);
  font-size: clamp(1.125rem, 0.2678571429vw + 1.0714285714rem, 1.5rem);
  padding: 0.25em 0.5em;
  line-height: 1;
  margin-left: 0.5em;
  margin-right: 0.5em;
  display: inline-block;
}
.form-area input, .form-area textarea {
  width: 100%;
  font-size: clamp(1.125rem, 0.2678571429vw + 1.0714285714rem, 1.5rem);
  padding: 0.75em;
  border: 1px solid #8D8D8D;
  border-radius: 8px;
}
.form-area input[name$=username1], .form-area input[name$=username2], .form-area input[name$=furigana1],
.form-area input[name$=furigana2], .form-area input[name$=postcode], .form-area input[name$=tel] {
  width: 100%;
  max-width: 240px;
}
.form-area input[name=postcode] {
  width: 100%;
  max-width: 140px;
}
.form-area input[name$=email], .form-area input[name$=business] {
  width: 100%;
  max-width: calc(480px + 1em);
}
.form-area input[name$=amount] {
  width: 85%;
  max-width: calc(480px + 1em);
}
.form-area input[type=radio], .form-area input[type=checkbox] {
  opacity: 0;
  position: absolute;
  z-index: -10;
}
.form-area .input__item__inner.flex {
  display: flex;
  justify-content: flex-start;
  gap: 1em;
}
.form-area .deduction__wrapper {
  width: 100%;
  max-width: calc(480px + 1em);
}
.form-area .amount-yen {
  font-weight: 550;
  font-size: clamp(1.25rem, 0.3571428571vw + 1.1785714286rem, 1.75rem);
  padding-left: 0.5em;
}
.form-area .button {
  cursor: pointer;
}
.form-area .checkbox__wrapper, .form-area .radio__wrapper {
  padding: 1em 1.5em;
  background: var(--c-white);
  border-radius: 8px;
  border: 1px solid #8D8D8D;
  /*----------------------------------------------------------*/
  /*----------------------------------------------------------*/
  /*----------------------------------------------------------*/
}
.form-area .checkbox__wrapper label, .form-area .radio__wrapper label {
  cursor: pointer;
  display: block;
  padding: 0.5em 0;
}
.form-area .checkbox__wrapper .checkbox, .form-area .radio__wrapper .checkbox {
  display: inline-block;
  position: relative;
  line-height: 1;
  vertical-align: middle;
  padding-left: 1.5em;
}
.form-area .checkbox__wrapper .checkbox::before, .form-area .radio__wrapper .checkbox::before {
  content: "";
  position: absolute;
  top: 1px;
  left: 0;
  width: 1em;
  height: 1em;
  border: 1px solid #8D8D8D;
  border-radius: 4px;
}
.form-area .checkbox__wrapper .checkbox::after, .form-area .radio__wrapper .checkbox::after {
  content: "";
  position: absolute;
  top: 1px;
  left: 0.25em;
  width: 0.5em;
  height: 0.75em;
  border-right: 4px solid var(--c-main);
  border-bottom: 4px solid var(--c-main);
  transform: rotate(60deg) skew(25deg);
  opacity: 0;
  transition: opacity 0.1s ease;
}
.form-area .checkbox__wrapper input[type=checkbox]:checked + .checkbox::after, .form-area .radio__wrapper input[type=checkbox]:checked + .checkbox::after {
  opacity: 1;
}
.form-area .checkbox__wrapper .radio, .form-area .radio__wrapper .radio {
  display: inline-block;
  position: relative;
  line-height: 1;
  vertical-align: middle;
  padding-left: 1.5em;
}
.form-area .checkbox__wrapper .radio::before, .form-area .radio__wrapper .radio::before {
  content: "";
  position: absolute;
  top: 0.1em;
  left: 0;
  width: 1em;
  height: 1em;
  border: 1px solid #8D8D8D;
  border-radius: 50%;
}
.form-area .checkbox__wrapper .radio::after, .form-area .radio__wrapper .radio::after {
  content: "";
  position: absolute;
  top: 0.28em;
  left: 0.18em;
  width: 0.64em;
  height: 0.64em;
  background: var(--c-main);
  border-radius: 50%;
  opacity: 0;
  transition: opacity 0.1s ease;
}
.form-area .checkbox__wrapper input[type=radio]:checked + .radio::after, .form-area .radio__wrapper input[type=radio]:checked + .radio::after {
  opacity: 1;
}
.form-area .checkbox__wrapper ul li, .form-area .radio__wrapper ul li {
  font-size: clamp(1.125rem, 0.2678571429vw + 1.0714285714rem, 1.5rem);
  font-weight: 400;
}
@media print, screen and (min-width: 768px) {
  .form-area .checkbox__wrapper ul, .form-area .radio__wrapper ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
  }
  .form-area .checkbox__wrapper ul li, .form-area .radio__wrapper ul li {
    width: calc(50% - 0.35em);
  }
  .form-area .checkbox__wrapper ul li label, .form-area .radio__wrapper ul li label {
    padding: 0.25em 0;
  }
}
@media print, screen and (min-width: 1200px) {
  .form-area .checkbox__wrapper ul li:not(.deduction__li), .form-area .radio__wrapper ul li:not(.deduction__li) {
    width: calc(33.3% - 0.35em);
  }
  .form-area .checkbox__wrapper ul li:not(.deduction__li) label, .form-area .radio__wrapper ul li:not(.deduction__li) label {
    padding: 0.25em 0;
  }
}
.form-area .multi-select {
  color: red;
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  position: relative;
  top: -0.1em;
}
.form-area .label__caution {
  display: block;
  font-size: clamp(0.9375rem, 0.1339285714vw + 0.9107142857rem, 1.125rem);
  padding-top: 0.5em;
  color: #8D8D8D;
}
.form-area .link-btn button {
  margin-bottom: 0;
}

.form-attention {
  margin-top: 3em;
  margin-bottom: 4em;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 32em;
}
.form-attention .form-attention__title {
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  text-align: center;
  border-bottom: 1px solid var(--c-text);
  font-weight: 400;
  line-height: 2;
}
.form-attention ul.form-attention__content {
  padding: 0 0.5em;
}
.form-attention ul.form-attention__content li {
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  margin-top: 0.75em;
  text-align: left;
}
.form-attention ul.form-attention__content li a {
  color: var(--c-main);
  text-decoration: underline;
}
.form-attention ul.form-attention__content .form-attention__list-mark {
  margin-right: 0.25em;
}

body#confirm-thanks .container {
  max-width: 800px;
}
body#confirm-thanks .logo {
  margin: 2em auto;
  width: 50%;
  max-width: 240px;
}
body#confirm-thanks h1 {
  text-align: center;
  color: var(--c-main);
  font-size: clamp(1.25rem, 0.4464285714vw + 1.1607142857rem, 1.875rem);
  margin-bottom: 1em;
}
body#confirm-thanks .header-text {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  font-weight: 550;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.75;
  text-align: center;
}
@media (max-width: 600px) {
  body#confirm-thanks .header-text {
    text-align: left;
  }
}
body#confirm-thanks .caution {
  color: rgb(255, 0, 0);
}
body#confirm-thanks .error-text {
  color: rgb(255, 0, 0);
}
body#confirm-thanks .container__inner {
  margin-top: 2em;
  padding: 0 1em;
}
body#confirm-thanks .container__inner .input-item {
  border-bottom: 1px solid var(--c-text);
  padding: 1.25em 0;
}
body#confirm-thanks .container__inner label {
  font-weight: 700;
  display: block;
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  color: var(--c-main);
  margin-bottom: 0.25em;
}
body#confirm-thanks .container__inner .input-wrapp {
  font-weight: 550;
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  text-align: left;
}
body#confirm-thanks .container__inner .button__wrapper {
  margin-top: 4em;
  padding-bottom: 4em;
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2em;
}
body#confirm-thanks .container__inner .button {
  display: block;
  outline: none;
  border: none;
  cursor: pointer;
  letter-spacing: 0.2em;
  padding: 0.5em 2em;
  font-weight: 600;
  font-size: clamp(1.25rem, 0.1785714286vw + 1.2142857143rem, 1.5rem);
  opacity: 1;
  transition: opacity 0.3s ease;
}
body#confirm-thanks .container__inner .button-submit {
  background: var(--c-main);
  color: var(--c-white);
}
body#confirm-thanks .container__inner .button-return {
  background: var(--c-main-light);
}
body#confirm-thanks .container__inner .button-thanks {
  background: var(--c-main);
  color: var(--c-white);
  letter-spacing: 0.05em;
}
body#confirm-thanks .container__inner .button:hover {
  opacity: 0.9;
}

.kari {
  font-weight: 600;
  font-size: clamp(1.125rem, 0.2678571429vw + 1.0714285714rem, 1.5rem);
}
.kari span {
  color: var(--c-main);
  font-weight: 700;
}
.kari p:not(:first-child) {
  margin-top: 0.5em;
}
.kari + .remarks a {
  text-decoration: underline;
  color: var(--c-main);
}
.kari + .remarks a:hover {
  opacity: 0.9;
}

.privacypolicy__intro, .privacypolicy-text {
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  line-height: 1.75;
}
.privacypolicy-text {
  line-height: 1.5;
}
.privacypolicy-headline {
  margin-top: 2em;
  margin-bottom: 0.5em;
  font-size: clamp(1.125rem, 0.2678571429vw + 1.0714285714rem, 1.5rem);
  font-weight: 550;
}
.privacypolicy ul {
  margin-top: 0.5em;
}
.privacypolicy ul li {
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  margin-top: 0.25em;
}
.privacypolicy ul .list-mark::before {
  content: "・";
  display: inline-block;
  margin-right: 0.25em;
}
.privacypolicy ul .list-number {
  margin-right: 0.25em;
}
.privacypolicy .contactus {
  margin-top: 1em;
}
.privacypolicy .contactus p {
  font-size: clamp(1rem, 0.1785714286vw + 0.9642857143rem, 1.25rem);
  text-align: left;
}

@media print, screen and (min-width: 1200px) {
  .header nav ul {
    display: flex;
    justify-content: space-between;
  }
  .header nav ul li {
    margin-left: auto;
    margin-right: 0;
  }
}
@media (max-width: 1199px) {
  .header .nav-wrapper__inner {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 2em;
  }
  .header .nav-wrapper__inner .nav-member {
    display: none;
  }
}
@media print, screen and (min-width: 1200px) {
  .footer__lower .footer-nav {
    width: 75%;
    max-width: 360px;
    margin-left: 0;
    margin-right: auto;
    margin-top: 0em;
    margin-bottom: 0em;
  }
}
section.restart {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  margin: 2.5em 0 6em 0;
}
section.restart h2 {
  text-align: center;
  margin-bottom: 0.5em;
  color: var(--c-main);
  font-weight: 700;
  font-size: clamp(2.25rem, 2.2321428571vw + 1.8035714286rem, 5.375rem);
}
section.restart .restart__inner {
  border: 2px solid var(--c-accent);
  padding: 2em 0.5em;
  max-width: 40em;
}
section.restart p {
  text-align: center;
  font-weight: 700;
}
section.restart p:not(:last-of-type) {
  margin-bottom: 0.75em;
}

section.announcement {
  font-size: clamp(1rem, 0.3571428571vw + 0.9285714286rem, 1.5rem);
  margin: 2.5em 0 6em 0;
}
section.announcement h2 {
  text-align: center;
  margin-bottom: 0.5em;
  color: var(--c-main);
  font-weight: 700;
  font-size: clamp(2rem, 1.4285714286vw + 1.7142857143rem, 4rem);
}
section.announcement h3 {
  text-align: center;
  font-size: clamp(1.25rem, 0.1785714286vw + 1.2142857143rem, 1.5rem);
  margin-bottom: 1em;
}
section.announcement .restart__inner {
  border: 2px solid var(--c-accent);
  padding: 2em 1em;
  max-width: 54em;
}
section.announcement p {
  text-align: left;
  font-size: clamp(1.125rem, 0.0892857143vw + 1.1071428571rem, 1.25rem);
  line-height: 1.85;
}
section.announcement p a {
  color: var(--c-main);
}
section.announcement p:not(:last-of-type) {
  margin-bottom: 0.75em;
}
section.announcement p span.strong {
  font-weight: 700;
}