@charset "UTF-8";

/* FONT */
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500;700&display=swap');

/* @font-face {
  font-family: "siteseeing";
  src: url(./kaitai/font/siteseeing.ttf) format("truetype");
}
@font-face {
  font-family: "gothicpro";
  src: url(./kaitai/font/A-OTF-GothicMB101Pro-Bold.otf) format("opentype");
} */

/*!
Theme Name: COCORIZM THEME
Theme URI: http://example.com/
Description: child theme for the Xeory
Author: バズ部
Author URI: http://bazubu.com/
Template: xeory_extension
Version: 0.6.3
*/

/* COMMON RESET */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video, button {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
input::placeholder{
	color: #ccc;
}
input::-ms-input-placeholder{
	color: #ccc;
}
input:-ms-input-placeholder{
	color: #ccc;
}
li {
  list-style: none;
}
a {
  text-decoration: none;
}

/* SETTING */
:root {
  /* COLOR */
  --color-base: #251e1c;
  --color-theme: #fffbda;
  --color-orange: #d68013;
  --color-green: #9dc138;
  --color-yellow: #edc757;
  --color-blue: #3e6eb3;

  /* FONT FAMILY */
  --font-base: "Zen Maru Gothic", "游ゴシック", 游ゴシック体, YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Verdana, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

  /* FONT WEIGHT */
  --font-weight-extraLight: 200;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semiBold: 600;
  --font-weight-bold: 700;
  --font-weight-extraBold: 800;
  --font-weight-black: 900;

  --letter-spacing: .05em;

  --delay: .05s;
  --transition: .3s;
  --opacity: .7;

  --wrap: 1240px;
  --space: calc((100vw - var(--wrap))/2);
  
  /* PX - LAYOUT */
  --px300: 300px;
  --px250: 250px;
  --px200: 200px;
  --px150: 150px;
  --px100: 100px;
  --px80: 80px;
  --px60: 60px;
  --px50: 50px;
  --px40: 40px;
  --px30: 30px;

  /* PX - FONT */
  --px48: 48px;
  --px42: 42px;
  --px36: 36px;
  --px32: 32px;
  --px28: 28px;
  --px24: 24px;
  --px20: 20px;
  --px18: 18px;
  --px16: 16px;
  --px12: 12px;
}

/* COMMON */
h1,h2,h3,h4,h5,h6,p,span,a,div {
  letter-spacing: var(--letter-spacing);
}
html {
  scroll-behavior: smooth;
}
body {
  color: var(--color-base);
  font-family: var(--font-base);
  letter-spacing: var(--letter-spacing);
  /* word-break: auto-phrase; */
}
.wrap {
  width: 100%;
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 20px;
}
a {
  display: inline-block;
  font-family: var(--font-base);
  color: var(--color-base);
  transition: var(--transition);
  &:hover {
    opacity: var(--opacity);
  }
}
a:hover {
  text-decoration: none;
}
#header a {
  color: var(--color-base);
}
#header a:hover {
  text-decoration: none;
}
#footer a {
  color: var(--color-base);
}
#footer a:hover {
  text-decoration: none;
}
span {
  display: inline-block;
}
img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}
section {
  position: relative;
}
.flex {
  display: flex;
  flex-wrap: wrap;
}
.grid {
  display: grid;
}
.center {
  text-align: center;
}
.inline-block {
  display: inline-block;
}
.ps-re {
  position: relative;
}
.ps-ab {
  position: absolute;
}
.sr-only {
  position: absolute;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border-width: 0;
  white-space: nowrap;
}
.tab-only {
  display: none;
}
.sp-only {
  display: none;
}
.sp-small-only {
  display: none;
}
.palt {
  font-feature-settings: "palt";
}
.pagetop {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 50px;
  bottom: 50px;
  width: 60px;
  height: 60px;
  background: var(--color-theme);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition);
  &.active {
    opacity: 1;
    visibility: visible;
  }
  &:hover {
    opacity: .7;
  }
}
.pagetop::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-left: 2px solid #fff;
  border-top: 2px solid #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -25%) rotate(45deg);
}
.map {
  position: relative;
  aspect-ratio: 16 / 9;
}
.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.form {
  position: relative;
  width: 100%;
  max-width: 650px;
  height: 800px;
  margin-inline: auto;
}
.form iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* COMMON CUSTOM */
:root {
  --letter-spacing-wide: .2em;
  --letter-spacing-extraWide: .25em;
}
body {
  width: 100%;
  font-weight: var(--font-weight-medium);
  overflow: hidden;
}
.bg-color {
  background: var(--color-theme);
}
a {
  /* font-weight: var(--font-weight-medium); */
}

/* HEADER */
#header {
  width: fit-content;
  height: auto;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
  background: transparent;
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  background: var(--color-theme);
  opacity: 0;
  visibility: hidden;
  transition: var(--transition);
}
.header-nav.is-open {
  opacity: 1;
  visibility: visible;
}
.header-nav__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px 30px;
  transform: translateY(20px);
  transition: var(--transition);
}
.header-nav.is-open .header-nav__list {
  transform: translateY(0);
}
.header-nav__item {
  text-align: center;
}
.header-nav__item a {
  font-size: var(--px24);
  padding: .5em;
  position: relative;
}
.header-nav__item a:hover {
  opacity: 1;
}
.header-nav__item a::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 2px;
  background: transparent;
  transition: var(--transition);
}
.header-nav__item:nth-child(3n + 1) a::before {
  background: var(--color-orange);
}
.header-nav__item:nth-child(3n + 2) a::before {
  background: var(--color-green);
}
.header-nav__item:nth-child(3n + 3) a::before {
  background: var(--color-yellow);
}
.header-nav__item a:hover::before {
  width: 60px;
}
.header-nav__item a span {
  display: block;
  font-size: var(--px16);
  line-height: 1;
}
.hamburger-wrap {
  width: 110px;
  height: 110px;
  position: relative;
}
.hamburger-wrap::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(assets/img/common/bg-hamburger.webp) no-repeat center / cover;
}
/* ハンバーガー */
.hamburger {
  font-size: 10px;
  width: 5em;
  height: 3em;
  position: absolute;
  background: none;
  border: none;
  cursor: pointer;
  top: 30px;
  right: 22px;
}
.hamburger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: #fff;
  transition: var(--transition) ease;
}
.hamburger span:nth-child(1) {
  transform: translateY(calc(-50% + .5em));
}
.hamburger span:nth-child(2) {
  transform: translateY(calc(-50% - .5em));
}
.hamburger.is-open span:nth-child(1) {
  transform: translateY(0) rotate(45deg);
}
.hamburger.is-open span:nth-child(2) {
  transform: translateY(0) rotate(-45deg);
}

/* FOOTER */
#footer {
  color: var(--color-base);
  border: none;
}
.footer {
  background: var(--color-theme);
  padding: var(--px100) 20px 30px;
  display: grid;
  place-items: center;
}
.footer-inner {
  width: 100%;
  max-width: var(--wrap);
  display: grid;
  place-items: center;
  gap: var(--px60);
  margin-bottom: var(--px60);
}
.footer-logo {
  max-width: 440px;
}
.footer-info {
}
#footer ul.footer-info__list {
margin-bottom: var(--px60);
}
.footer-info__list {

}
.footer-info__item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
  font-weight: var(--font-weight-medium);
}
.footer-info__item:not(:last-child) {
  margin-bottom: 20px;
}
.footer-info__item-tag {
  min-width: 80px;
  text-align: center;
  color: #fff;
  background: var(--color-orange);
}
.footer-info__item-text {

}
.copy {
  font-size: var(--px12);
  text-align: center;
}
.footer-top {
  padding-top: var(--px50);
}
.footer-btns-wrap {

}
.footer-btns {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-top: 40px;
}
.footer-btn {
  color: #fff;
  border-radius: 20px 20px 0 0;

  &.bg-orange {
    background: var(--color-orange);
  }
  &.bg-green {
    background: var(--color-green);
  }
  &.bg-yellow {
    background: var(--color-yellow);
  }

}
.footer-btn img {
  max-width: 50px;
  max-height: 50px;
}
.footer-btn a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  font-size: 30px;
  font-weight: var(--font-weight-medium);
  color: inherit;
  padding: 40px 20px;
}
.footer-btn a span.tel {
  font-size: var(--px18);
}
.footer-btn a strong {
  font-size: 40px;
  line-height: 1;
  letter-spacing: var(--letter-spacing-wide);
}
.footer-btn a small {
  font-size: 14px;
  text-align: left;
}
.footer-top-text {
  font-size: var(--px20);
  text-align: center;
  letter-spacing: var(--letter-spacing-wide);
}
.footer-btn.visit {
  display: block;
  border-radius: 20px;
  margin-bottom: var(--px100);
  margin-inline: auto;

  & p.black {
    font-size: var(--px16);
    color: var(--color-base);
  }
}
.footer-btn.visit a {
  padding: 40px 100px;
}
.footer-btn.visit .footer-btn-flex {
  font-size: var(--px36);
}
.footer-btn.visit .footer-btn-flex .footer-btn-flex__tag {
  font-size: var(--px28);
  color: #fff;
  background: var(--color-orange);
  border-radius: 30px;
  padding: 5px 20px;
  margin-top: 5px;
}
.footer-btns-wrap__sp {
  display: none;
}
.footer-top .form {
  max-width: 660px;
}

/* SECTION TITLE */
.sec-title {
  font-size: var(--px24);
  letter-spacing: var(--letter-spacing-wide);
  margin-bottom: var(--px40);
}
.sec-title span:nth-child(odd) {
  color: var(--color-orange);
}
.sec-title span:nth-child(even) {
  color: var(--color-green);
}
.sec-title__en {
  font-size: var(--px18);
  color: var(--color-orange);
  position: relative;
  top: -1em;
  left: 0;
}
.sec-title__belt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.sec-title__belt::before {
  content: "";
  width: 100vw;
  min-width: 1600px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background: var(--color-orange);
  z-index: 3;
}
.sec-title__belt.en::after {
  content: "EQ education program";
  position: absolute;
  top: -1.8em;
  left: .3em;
  font-size: var(--px18);
  color: var(--color-orange);
}
.sec-title__belt h3 {
  font-size: var(--px32);
  color: #fff;
  line-height: 1;
  padding: .5em 0 .6em;
  position: relative;
  z-index: 5;
}
.sec-title__belt span.sec-title__belt-en {
  font-size: 14px;
  color: #c5c5c6;
  position: relative;
  z-index: 5;
}
.sec-title__belt img {
  z-index: 5;
}
.sec-title__subtext {
  font-size: var(--px20);
  letter-spacing: var(--letter-spacing-wide);
  padding-top: 5px;
}

.sec-curriculum .sec-title__belt img {
  position: absolute;
  top: -60px;
  right: 6vw;
  z-index: 0;
}
.sec-information .sec-title__belt img {
  position: absolute;
  top: -65px;
  right: 5vw;
  z-index: 0;
}

/* MV */
.mv {
  padding-top: var(--px150);
}
.mv-inner {
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding: 0 20px;
}
.mv-text {
  width: 100%;
  writing-mode: vertical-rl;
  text-orientation: upright;
  margin-left: auto;
  font-size: var(--px20);
  letter-spacing: var(--letter-spacing-wide);
  line-height: 2.3;
  padding-right: 10%;
}
.mv-logo {
  max-width: 500px;
  margin-inline: auto;
  margin-top: var(--px30);
  opacity: 0;
  transform: scale(.8);
  transition: .8s var(--ease-out-quart);
}
.mv-logo.is-show {
  opacity: 1;
  transform: scale(1);
}
.mv-illust {
  opacity: 0;
  transition: 
  opacity 1.3s var(--ease-out-cubic),
  translate 1.3s var(--ease-out-quint);
}
.mv-illust.is-show {
  opacity: 1;
}
.mv-illust.i1 {
  position: absolute;
  top: 0;
  left: 0;
  translate: -5% -5%;
}
.mv-illust.i2 {
  position: absolute;
  top: 35%;
  right: 0;
  translate: 5% 5%;
}
.mv-illust.i3 {
  margin-top: var(--px80);
  translate: 0 5%;
}
.mv-illust.is-show.i1,
.mv-illust.is-show.i2,
.mv-illust.is-show.i3 {
  translate: 0;
}

/* ABOUT */
.sec-about {
  padding-bottom: var(--px150);
  margin-top: -80px;
}
.sec-about::before {
  content: "";
  position: absolute;
  top: 3%;
  left: 50%;
  transform: translateX(-50%);
  width: 1600px;
  aspect-ratio: 162 / 137;
  background: url(assets/img/about-bg.webp) no-repeat center / cover;
  pointer-events: none;
}
.about-content {
  width: fit-content;
  margin-inline: auto;
  padding-left: 3vw;
  position: relative;
}
.about-img {
  width: fit-content;
}
.about-img.n1 {
  margin-left: auto;
  position: relative;
  right: -55%;
}
.about-img.n2 {
  position: absolute;
  top: 35%;
  left: -50%;
}
.about-img.n3 {
  position: absolute;
  bottom: 0;
  left: -15px;
}
.about-img.n4 {
  position: absolute;
  bottom: -1px;
  right: -1px;
}
.about-content h3 {
  font-size: var(--px40);
  font-weight: bold;
  margin-left: -.1em;
  padding: var(--px80) 0;
}
.about-content__text {

}
.about-content__text p {
  font-size: var(--px18);
  letter-spacing: var(--letter-spacing-extraWide);
  line-height: 2.3;
}
.about-content__text-img {
  max-width: 460px;
}
.about-content__reason {
  max-width: 350px;
  margin: var(--px100) 3vw 0 auto;
}

/* CONCEPT */
.sec-concept {
  padding-top: var(--px250);
}
.sec-concept .sec-title {
  margin-bottom: 15px;
}
.sec-concept .sec-subtitle {
  font-size: var(--px48);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-wide);
  line-height: 1.3;
  margin-left: -.2em;
  margin-top: -.3em;
}
.concept-content {
  display: flex;
  align-items: flex-end;
}
.concept-content__text {
  margin-top: var(--px60);
}
.concept-content__text p {
  font-size: var(--px18);
  letter-spacing: var(--letter-spacing-extraWide);
  line-height: 2.3;
}
.concept-content__img {
  position: relative;
  right: -8vw;
}
.eq-content {

}
.eq-program {
  padding: var(--px150) 0;
  width: fit-content;
  margin-inline: auto;
  position: relative;
  right: -15px;
}
.eq-point {

}
.eq-point__title {
  width: fit-content;
  margin-inline: auto;
  margin-bottom: var(--px60);
}
.eq-point__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--px60) 0;
}
.eq-point__item {
  padding: 0 35px;
  position: relative;
}
.eq-point__item::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  max-height: 370px;
  border-right: 2px dashed var(--color-green);
}
.eq-point__item:nth-of-type(3n + 1)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  max-height: 370px;
  border-left: 2px dashed var(--color-green);
}
.eq-point__item-title {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 20px;
}
.eq-point__item-title__num {
  min-width: 80px;
  min-height: 80px;
  display: grid;
  place-items: center;
  background: url(assets/img/point-icon.svg) no-repeat center / contain;
}
.eq-point__item-title__num span {
  color: #fff;
  font-size: var(--px42);
  position: relative;
  top: -.05em;
  right: .02em;
}
.eq-point__item-title__text {
  width: calc(100% - 80px);
  font-size: var(--px20);
  color: var(--color-orange);
  font-weight: var(--font-weight-bold);
}
.eq-point__item-title__text small {
  font-size: var(--px16);
}
.eq-point__item-text {
  font-size: var(--px16);
  /* letter-spacing: var(--letter-spacing-wide); */
  line-height: 2;
  position: relative;
}
.eq-point__item-text .img.n3 {
  width: fit-content;
  margin-left: auto;
}
.eq-point__item-text .img.n4 {
  width: fit-content;
  position: absolute;
  bottom: -150px;
  right: -200px;
}
.eq-point__item-text .img.n6 {
  width: fit-content;
  margin-top: var(--px60);
  margin-left: 6vw;
}
.concept-illust {

}
.concept-illust.i1 {
  position: absolute;
  top: -8%;
  left: 18%;
}
.concept-illust.i2 {
  position: absolute;
  top: 6%;
  left: 0;
}
.concept-illust.i3 {
  position: absolute;
  bottom: 25%;
  left: 0;
}
.concept-illust.i4 {
  position: absolute;
  bottom: 8%;
  right: 0;
}

/* SCHOOL */
.sec-school {

}
.sec-school:before {
  content: "";
  position: absolute;
  top: -89px;
  width: 100%;
  height: 90px;
  background: url(assets/img/school-bg-top.webp) no-repeat center bottom / contain;
}
.school-wrap {
  background: var(--color-green);
  padding: var(--px40) 20px;
}
.school-content {
  max-width: 1100px;
  margin-inline: auto;
  border-radius: 10px;
  background: #fff;
  padding: var(--px30) var(--px30) var(--px60);
  position: relative;
  z-index: 3;
}
.school-content__top {
  text-align: center;
  margin-bottom: 20px;
}
.school-content__top h3 {
  font-size: var(--px40);
  font-weight: var(--font-weight-bold);
  color: #757475;
  margin-bottom: 5px;
}
.school-content__top h3 span {
  letter-spacing: var(--letter-spacing-wide);
}
.school-content__top h3 span.green {
  color: var(--color-green);
}
.school-content__top h3 span.orange {
  color: var(--color-orange);
}
.school-content__top p {
  font-size: var(--px16);
}
.school-content__flex {
  display: flex;
  align-items: flex-start;
  justify-content: space-around;
}
.school-content__flex-item {
  width: 41%;
}
.school-content__flex-item.green {
  
  & .school-content__flex-item__title-num {
    background: var(--color-green);
  }
  & .school-content__flex-item__title-text h4 {
    color: var(--color-green);
  }
  & .school-content__flex-item__title {
    border-color: var(--color-green);
  }
  & .school-content__flex-item__text ul li::before {
    background: var(--color-green);
  }
}
.school-content__flex-item.orange {

  & .school-content__flex-item__title-num {
    background: var(--color-orange);
  }
  & .school-content__flex-item__title-text h4 {
    color: var(--color-orange);
  }
  & .school-content__flex-item__title {
    border-color: var(--color-orange);
  }
  & .school-content__flex-item__text ul li::before {
    background: var(--color-orange);
  }
  & .school-content__flex-item__title-num span {
    left: 0;
  }
}
.school-content__flex-item__title {
  display: flex;
  align-items: center;
  gap: 8px;
  border-bottom: 2px dotted;
  padding-bottom: 8px;
  margin-bottom: 16px;
}
.school-content__flex-item__title-num {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border-radius: 50%;
}
.school-content__flex-item__title-num span {
  font-size: var(--px28);
  color: #fff;
  position: relative;
  top: -.06em;
  left: .02em;
}
.school-content__flex-item__title-text {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.school-content__flex-item__title-text h4 {
  font-size: var(--px36);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-wide);
  line-height: 1;
}
.school-content__flex-item__title-text small {
  font-size: var(--px16);
  margin-top: .4em;
}
.school-content__flex-item__text p {
  font-size: var(--px16);
}
.school-content__flex-item__text ul {
  margin: 1em 0;
}
.school-content__flex-item__text ul li {
  position: relative;
}
.school-content__flex-item__text ul li::before {
  content: "";
  display: inline-block;
  width: var(--px16);
  height: var(--px16);
  border-radius: 50%;
  position: relative;
  bottom: -.15em;
  margin-right: 2px;
}
.school-img {
  width: fit-content;
  position: absolute;
  bottom: 0;
  left: 0;
}
.school-img img {
  width: 15vw;
}

/* CURRICULUM */
.sec-curriculum {
  padding-bottom: var(--px60);
  margin-top: var(--px200);
}
.sec-curriculum .sec-title {
  margin-bottom: 20px;
}
.curriculum-content {
  padding: var(--px40) 0 var(--px80);
}
.curriculum-content__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}
.curriculum-content__item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  color: #fff;
  padding: 20px var(--px30);
  border-radius: 15px;
}
.curriculum-content__item.orange {
  background: var(--color-orange);
}
.curriculum-content__item.green {
  background: var(--color-green);
}
.curriculum-content__item-title {
  font-size: var(--px24);
  line-height: 1.3;
  padding-left: 1em;
  position: relative;
  top: 10px;
}
.curriculum-content__item-title::before {
  content: "";
  position: absolute;
  top: -30px;
  left: 0;
  width: 6px;
  height: 90px;
  background: #fff;
}
.curriculum-content__item-text {
  max-width: 315px;
  font-size: var(--px18);
  letter-spacing: var(--letter-spacing-wide);
}
.schedule-content {

}
.schedule-content__year {
  position: relative;
}
.schedule-content__year-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0 30px;
  margin-bottom: 20px;
  background: #fff;
  border-radius: 15px;
  border: 2px solid var(--color-orange);
  padding: var(--px30) var(--px40);
}
.schedule-content__year-item {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 3px 10px;
  font-size: var(--px18);
  font-weight: var(--font-weight-bold);
  padding: .8em 0;
  border-top: 2px dotted var(--color-green);
}
.schedule-content__year-item[data-order="1"] {
  order: 1;
}
.schedule-content__year-item[data-order="2"] {
  order: 4;
}
.schedule-content__year-item[data-order="3"] {
  order: 7;
}
.schedule-content__year-item[data-order="4"] {
  order: 10;
}
.schedule-content__year-item[data-order="5"] {
  order: 2;
}
.schedule-content__year-item[data-order="6"] {
  order: 5;
}
.schedule-content__year-item[data-order="7"] {
  order: 8;
}
.schedule-content__year-item[data-order="8"] {
  order: 11;
}
.schedule-content__year-item[data-order="9"] {
  order: 3;
}
.schedule-content__year-item[data-order="10"] {
  order: 6;
}
.schedule-content__year-item[data-order="11"] {
  order: 9;
}
.schedule-content__year-item[data-order="12"] {
  order: 12;
}
.schedule-content__year-item.border-bottom {
  border-bottom: 2px dotted var(--color-green);
}
.schedule-content__year-item__month {
  color: var(--color-orange);
  line-height: 1;
}
.schedule-content__year-item__month .margin {
  width: .5em;
}
.schedule-content__date {
  background: #fff;
  border-radius: 10px;
  border: 2px solid var(--color-green);
  padding: var(--px30) var(--px30) var(--px30) var(--px40);
  margin-top: var(--px80);
  position: relative;
}
.schedule-content__date-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--px60);
}
.schedule-content__date-title {

}
.schedule-content__date-title h4 {
  font-size: var(--px30);
  color: var(--color-green);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-wide);
  line-height: 1.3;
  margin-bottom: 15px;
}
.schedule-content__date-title h4 small {
  font-size: var(--px20);
  position: relative;
  top: -.2em;
}
.schedule-content__date-title p {
  font-size: var(--px20);
  letter-spacing: var(--letter-spacing-wide);
}
.schedule-content__date-list {
  display: flex;
  align-items: flex-start;
}
.schedule-content__date-item {
  min-width: 185px;
  max-width: 185px;
  padding-right: 30px;
}
.schedule-content__date-item:last-child {
  width: fit-content;
  min-width: initial;
  padding-right: 0;
}
.schedule-content__date-item__time {
  color: var(--color-green);
  font-size: var(--px18);
  line-height: 1;
  position: relative;
  left: -.7em;
}
.schedule-content__date-item__time.ja {
  font-size: var(--px16);
  left: -1.1em;
}
.schedule-content__date-item__body {
  padding-top: 20px;
  margin-top: 10px;
  position: relative;
}
.schedule-content__date-item:not(:last-child) .schedule-content__date-item__body::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  border-top: 1px solid var(--color-green);
  width: calc(100% + 30px);
}
.schedule-content__date-item__body::after {
  content: "";
  width: 1em;
  height: 1em;
  background: var(--color-orange);
  position: absolute;
  top: -.5em;
  left: 0;
  border-radius: 50%;
}
.schedule-content__date-item__body-title {
  font-size: var(--px18);
  font-weight: var(--font-weight-bold);
  margin-bottom: .3em;
}
.schedule-content__date-item__body p {
  font-size: var(--px16);
}
.curriculum-illust {

}
.curriculum-illust.i1 {
  position: absolute;
  top: -70px;
  right: -75px;
}
.curriculum-illust.i2 {
  position: absolute;
  bottom: -50px;
  left: 195px;
}

/* INFORMATION */
.sec-information {
  padding: var(--px200) 0 var(--px100);
}
.information-content {

}
.information-content__flex {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 40px;
}
.information-content__service-wrap {
  width: 540px;
}
.information-content__price {
  width: calc(100% - 540px);
  padding-right: 15px;
}
.information-content__price p {
  line-height: 1.8;
}
.information-content__price-title {
  font-size: var(--px28);
}
.information-content__price-list {
  display: flex;
  flex-direction: column;
  gap: 25px;
  margin: 20px 0 30px;
}
.information-content__price-item {
  display: flex;
  align-items: center;
  gap: 10px;
}
.information-content__price-item .information-content__price-item__tag {
  width: 60px;
  height: 60px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--color-orange);
  color: #fff;
  font-size: var(--px16);
}
.information-content__price-item .information-content__price-item__text {
  color: var(--color-green);
  font-size: var(--px80);
  line-height: 1;
  margin-top: -.2em;
}
.information-content__price-item .information-content__price-item__text span {
  font-size: var(--px50);
}
.information-content__price-item .information-content__price-item__text small {
  color: initial;
  font-size: var(--px18);
}
.information-content__option {

}
.information-content__option-title {
  font-size: var(--px24);
  margin-bottom: .3em;
}
.information-content__option-list {
  background: #fff;
  border: 2px solid var(--color-green);
  border-radius: 10px;
  padding: var(--px30) var(--px40);
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.information-content__option-item {
  font-size: var(--px28);
  line-height: 1.3;
}
.information-content__option-item__flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.information-content__option-item__flex-left {
  width: 295px;
}
.information-content__option-item__flex-right {
  width: calc(100% - 295px);
  color: var(--color-orange);
}
.information-content__option-item small {
  display: block;
  font-size: var(--px16);
}
.information-content__vacation {
  margin-top: 30px;
}
.information-content__vacation-wrap {
  background: var(--color-green);
  color: #fff;
  border-radius: 10px;
  padding: var(--px30) var(--px40);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  position: relative;
}
.information-content__vacation-wrap h5 {
  font-size: var(--px20);
  margin-left: -1em;
}
.information-content__vacation-wrap strong {
  font-size: var(--px28);
}
.information-content__vacation-wrap strong .empty {
  width: .5em;
}
.information-content__vacation-wrap span.black {
  color: var(--color-base);
  position: absolute;
  bottom: calc(var(--px30) - 5px);
  right: calc(var(--px40) - 20px);
}
.information-content__vacation-wrap__left {

}
.information-content__vacation-wrap__right {

}
.information-content__detail {
  background: #fff;
  border: 2px solid var(--color-green);
  border-radius: 10px;
  padding: var(--px30) var(--px40);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.information-content__detail-left {
  font-size: var(--px24);
}
.information-content__detail-left span {
  width: var(--px24);
  height: var(--px24);
  border-radius: 50%;
  background: var(--color-orange);
  position: relative;
  bottom: -.12em;
  margin-right: .2em;
}
.information-content__detail-right {

}
.information-content__detail-right__item {
  display: flex;
  align-items: flex-start;
  gap: 5px;
}
.information-content__detail-right__item:not(:last-child) {
  margin-bottom: 10px;
}
.information-content__detail-right__item-tag {
  color: #fff;
  font-size: var(--px20);
  background: var(--color-orange);
  width: 105px;
  text-align: center;
}
.information-content__detail-right__item-text {
  font-size: var(--px18);
}
.information-content__detail-right__item-text .margin {
  width: .5em;
}

/* STAFF */
.sec-staff {
  padding: var(--px150) 0 var(--px50);
}
.staff-content__list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 80px 150px;
  position: relative;
  z-index: 10;
}
.staff-content__item {
  width: 31%;
  max-width: 300px;
}
.staff-content__item-name {
  text-align: center;
  font-size: var(--px24);
  font-weight: var(--font-weight-regular);
}
.staff-content__item.staff .img {
  position: relative;
}
.staff-content__item.staff .img::before {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 50%;
  transform: translateX(-50%);
  width: 580px;
  aspect-ratio: 585 / 217;
  background: url(assets/img/staff06.webp) no-repeat center / cover;
}
.staff-content__item.staff .img img {
  width: 100%;
  aspect-ratio: 1 / 1;
}
.staff-illust {

}
.staff-illust.i1 {
  position: absolute;
  top: -20px;
  left: -400px;
}
.staff-illust.i2 {
  position: absolute;
  top: -10vw;
  right: 0;
  z-index: 4;
}
.staff-content__detail {
  background: #fff;
  border: 2px solid var(--color-green);
  border-radius: 10px;
  padding: var(--px30) var(--px40);
  gap: var(--px40);
  width: fit-content;
  margin-inline: auto;
  margin-top: var(--px80);
  position: relative;
}
.staff-content__detail-left {
  color: var(--color-green);
  font-size: var(--px28);
  text-align: center;
  margin-bottom: 10px;
}
.staff-content__detail-right {

}
.staff-content__detail-right__list {

}
.staff-content__detail-right__item {
  font-size: var(--px18);
}
.staff-content__detail-right__item::before {
  content: "";
  display: inline-block;
  width: var(--px18);
  height: var(--px18);
  background: var(--color-orange);
  border-radius: 50%;
  position: relative;
  bottom: -.15em;
  margin-right: 2px;
}
.staff-content__detail-right p {
  padding: 1em 0;
}

/* FAQ */
.sec-faq {
  padding-bottom: var(--px100);
  margin-top: var(--px100);
}
.faq-content {
  padding-top: 30px;
}
.faq-content__block {

}
.faq-content__block:not(:last-child) {
  margin-bottom: 20px;
}
.faq-content__block h5 {
  font-size: var(--px24);
  margin-bottom: .2em;
}
.faq-content__block .faq-item__details:not(:last-child) {
  margin-bottom: 10px;
}
.faq-item__details {
  background: #fff;
  border: 2px solid var(--color-green);
  border-radius: 20px;
  padding: 5px 30px;
}
.faq-item__summary {
  font-size: var(--px20);
  padding: .5em 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.faq-item__summary-text {
  width: calc(100% - var(--faq-icon-width));
}
.faq-item__summary-text strong {
  font-size: var(--px24);
  font-weight: var(--font-weight-medium);
  line-height: 1;
  margin-right: .2em;
}
:root {
  --faq-icon-width: 45px;
}
.faq-item__summary .icon {
  width: var(--faq-icon-width);
  height: var(--faq-icon-width);
  color: var(--color-green);
  border: 1px solid var(--color-green);
  border-radius: 50%;
  position: relative;
  transition: var(--transition);
}
.faq-item__summary .icon::before,
.faq-item__summary .icon::after{
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 18px;
  height: 2px;
  background: var(--color-green);
  border-radius: 2px;
  transform: translate(-50%, -50%);
  transition: var(--transition);
}
.faq-item__summary .icon::after{
  transform: translate(-50%, -50%) rotate(90deg);
}
.faq-item__details[open] .faq-item__summary .icon{
  background: var(--color-green);
}
.faq-item__details[open] .faq-item__summary .icon::before{
  transform: translate(-50%, -50%) rotate(45deg);
}
.faq-item__details[open] .faq-item__summary .icon::after{
  transform: translate(-50%, -50%) rotate(-45deg);
}
.faq-item__details[open] .faq-item__summary .icon::before,
.faq-item__details[open] .faq-item__summary .icon::after{
  background: #fff;
}
/* アニメーションを滑らかにするため高さはJSで制御する */
.faq-item__answer {
  overflow: hidden;
  height: 0;
  transition: .3s ease;
}
.faq-item__answer-inner {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  padding: .5em 0 1em;
}
.faq-item__answer-inner strong {
  font-size: var(--px40);
  color: var(--color-orange);
  font-weight: var(--font-weight-medium);
  line-height: 1;
  width: calc(var(--faq-icon-width) + 15px);
}
.faq-item__answer-inner p {
  font-size: var(--px20);
  width: calc(100% - calc(var(--faq-icon-width) + 15px));
  padding-right: var(--faq-icon-width);
}

/* GALLERY */
.sec-gallery {
  padding: var(--px100) 0;
}
.gallery-wrap {
  width: 100%;
  height: 600px;
  background: #ccc;
  display: grid;
  place-items: center;
}

/* ACCESS */
.sec-access {
  padding: var(--px100) 0;
}
.sec-access .map {
  width: 100%;
  max-height: 600px;
}
