/*
Theme Name: calm体操教室 公式WEBサイト
Author: JURI SUZUKI
*/

.post-content h2{
	font-size:clamp(1.3rem, 4.3vw, 1.6rem);
	border-bottom:1px dotted #ccc;
	margin:0.2rem 0 1.5rem;
	padding-bottom:0.5rem;
}
.post-content p{
	font-size:1rem;
	line-height:1.7;
}
.post-content p + p {
  margin-top: 0.8rem;
}

.post-content img{
  max-width:500px;
  margin:1.5rem auto;
	width:100%;
}

#post .container {
  width: 92%;
  max-width: 600px;
  margin: 0 auto;
}
.post-content a {
text-decoration:underline;
color:#3385B9;
}
/* ===========
 IBM Plex Sans JP
=========== */
@font-face{
  font-family:"IBM Plex Sans JP";
  src:url("fonts/IBMPlexSansJP-Medium-subset.woff2") format("woff2");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"IBM Plex Sans JP";
  src:url("fonts/IBMPlexSansJP-Bold-subset.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}


/* ===========
 Lexend Deca
=========== */
@font-face{
  font-family:"Lexend Deca";
  src:url("fonts/LexendDeca-Bold-subset.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

/* Base reset */
*, *::before, *::after {
  box-sizing: border-box;
}
* {
  margin: 0;
  padding: 0;
}
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  font-size: 15.5px;
  -webkit-font-smoothing: antialiased; /* フォントスムージングをオフ */
}
body {
    margin: 0;
    background: #FBF7F0;
    color:#5C4B3F;
    font-family:"IBM Plex Sans JP", sans-serif;
    position: relative;
}
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}
a img {
  transition: transform 200ms ease, filter 200ms ease, opacity 200ms ease;
}
a:hover img {
  transform: translateY(-2px);
  filter: brightness(1.03);
}
input, button, textarea, select {
  font: inherit;
  color: inherit;
}
a {
  color: inherit;
  text-decoration: none;
}
ul, ol {
  list-style: none;
}
button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
.text-center{
  text-align: center;
}
.text-justify{
  text-align: justify;
}
#top{
position: relative;
height: 1px;
}
h1{
  position:absolute;
  font-size: 0.7rem;
  bottom:1.9rem;
  width: 100%;
  text-align: center;
  font-weight:normal;
}

.d-lg-block{
display:none;
}
@media (min-width: 576px) {
.d-sm-none{
display:none;
}
h1{
  bottom:1.8rem;
}
}

@media (min-width: 768px) {
html {
  font-size: 16.5px;
  line-height: 1.7;
}
.d-md-none{
display:none;
}
}

@media (min-width: 992px) {
h1{
  width: calc(100% - 280px);
}
.d-lg-none{
display:none;
}
}

@media (min-width: 1200px) {
.d-lg-block{
display:block;
}
.d-xl-none{
display:none;
}
}

/* 背景カラー */
.bg-white{
    background-color: #ffffff;
}
.bg-green{
    background-color: #C3D831;
}
.bg-dgreen{
    background-color: #B3CA17;
}
.bg-blue{
    background-color: #AEDCF6;
}
.bg-dblue{
    background-color: #3385B9;
}
.bg-purple{
    background-color: #AE5FA8;
}

/* 文字 */
.lexend{
  font-family:"Lexend Deca", sans-serif;
}
.fw-bold{
  font-weight: 700;
}
.text-white{
    color:#ffffff;
}
.text-blue{
    color:#3385B9;
}
.text-dblue{
    color:#157ABA;
}
.text-brown{
    color:#5C4B3F;
}
.text-lbrown{
    color:#9B816C;
}
.text-green{
    color:#A4BA0D;
}
h2.content-title{
  font-size: 1.05rem;
  margin-bottom:1.3rem;
}
h2.content-title span{
  font-size: 2.3rem;
  display: block;
}
.fs-base{
  font-size:1rem;
}
.fs-s{
  font-size:0.9rem;
}
.fs-ms{
  font-size:0.95rem;
}
.fs-xm{
  font-size:1.05rem;
}
.fs-m{
  font-size:1.1rem;
}
.fs-l{
  font-size:1.2rem;
}
.sub-title{
  font-size:1.8rem;
  margin-bottom:0.5rem;
}
.page-title{
  font-size:1.8rem;
  margin-bottom:2rem;
}
@media (min-width: 768px) {
h2.content-title{
font-size: 1.1rem;
margin-bottom:2.5rem;
line-height: 1.3;
}
h2.content-title span{
font-size: 2.6rem;
}
}

/* 幅 */
.container {
  width: 92%;
  max-width: 500px;
  margin: 0 auto;
}
.content-pd{
  padding:2.2rem 0 2.9rem;
}
.content-pd-top{
  padding-top:3.2rem;
}
.content-pd-part{
  padding:3.2rem 0 2.9rem;
}
.page-pd{
padding:3.5rem 0 5rem;
}

@media (min-width: 768px) {
.container {
  max-width: 600px;
}
}
@media (min-width: 768px) {
.content-pd{
  padding:3.5rem 0 4.2rem;
}
.content-pd-top{
  padding-top:4rem;
}
.content-pd-part{
  padding:4rem 0 4.2rem;
}
}
@media (min-width: 1200px) {
.container {
  max-width: 800px;
}
}

/* grid */
.about-grid{
display: grid;
align-items: center;
gap: 1.5rem;
}
.instructor-grid{
display: grid;
gap: 1.5rem;
}

@media (min-width: 768px) {
.about-grid{
gap: 2rem;
}
.instructor-grid{
gap: 2rem;
}
}
@media (min-width: 1200px) {
.about-grid{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.instructor-grid{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.instructor-grid > :last-child{
  grid-column: 1 / -1;
}
.class-grid{
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 3.2rem 2.5rem;
display: grid;
}
.class-grid > :first-child{
  grid-column: 1 / -1; /* 1段目を全幅に */
}
}

/* 装飾 */
.part-out::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-18px;
  transform:translateX(-50%);
  width:0;
  height:0;
  border-style:solid;
  border-width:18px 28px 0 28px;
}
.dotted-right,.dotted-left{
  position:relative;
}
.dotted-right::after,.dotted-left::after{
  content:"";
  position:absolute;
  bottom:0px;
  width:240px;
  height:240px;
  background-size:7px 7px;
  opacity:0.7;
  pointer-events:none;
  z-index:0;
}
.dotted-right::after{
  right:0px;
  clip-path:polygon(100% 0, 100% 100%, 0 100%);
}
.dotted-left::after{
  left:0px;
  clip-path: polygon(0 0, 0 100%, 100% 100%);
}
.dotted-right > *{
  position:relative;
  z-index:1;
}
.dotted-left > *{
  position:relative;
  z-index:1;
}
.callout{
  position: relative;
  display: inline-block;
  align-items: center;
}
.callout::before,.callout::after{
  content: "";
  position: absolute;
  bottom: 0px;
  width: 4px;
  height:1.6em;
  /* Use a gradient dot strip for consistent round dots in Safari. */
  background: radial-gradient(circle, #fff 2px, transparent 2.1px) center/4px 8px repeat-y;
}
.callout::before{
  left: -0.8em;
  transform: rotate(-30deg);
}
.callout::after{
  right: -0.8em;
  transform: rotate(30deg);
}

@media (min-width: 768px) {
.part-out::after{
  bottom:-30px;
  border-style:solid;
  border-width:30px 55px 0 55px;
}
.dotted-right::after,.dotted-left::after{
  width:300px;
  height:300px;
}
}
/* ボタン */
.btn{
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap:0.5rem;
  padding-top:0.2em;
  transition: transform 150ms ease, box-shadow 150ms ease, filter 150ms ease;
}
.header-btn{
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap:0.5rem;
  padding-top:0.2em;
}
.header-btn:hover {
  filter: brightness(0.97);
}
.header-btn:active {
  filter: brightness(0.92);
}

.btn:hover {
  transform: translateY(2px);
  filter: brightness(1.1);
}
.btn:active {
  transform: translateY(4px);
  filter: brightness(1.08);
}
.btn-main{
  width:230px;
  height:46px;
  margin: 0 auto;
}
.btn-border span{
  border-bottom:1px dotted currentColor;
}
.btn-main.bg-purple{
  box-shadow: 0 4px 0px #8A3684;
  border-radius: 5px;
}
.btn-main.bg-purple:hover{
  box-shadow: 0 2px 0px #8A3684;
}
.btn-main.bg-purple:active{
  box-shadow: 0 0 0px #8A3684;
}
.btn-main.bg-white{
  border: 1px solid currentColor;
  border-radius: 5px;
}
.round-btn{
  border-radius:999px;
}
.round-btn--outline{
  border:1px solid currentColor;
  background:#fff;
}
.round-btn-plus{
  font-size:1.2em;
}
.tel{
  font-size: 1.6rem;
}
.tel::before{
  content: "";
  display: inline-block;
  width: 0.8em;
  height: 0.8em;
  margin-right: 0.2em;
  vertical-align: -0.1em;
  background: url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20122.88%20122.27%22%20style%3D%22enable-background%3Anew%200%200%20122.88%20122.27%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%3Cpath%20fill%3D%22%233385B9%22%20d%3D%22M33.84%2C50.25c4.13%2C7.45%2C8.89%2C14.6%2C15.07%2C21.12c6.2%2C6.56%2C13.91%2C12.53%2C23.89%2C17.63c0.74%2C0.36%2C1.44%2C0.36%2C2.07%2C0.11%20c0.95-0.36%2C1.92-1.15%2C2.87-2.1c0.74-0.74%2C1.66-1.92%2C2.62-3.21c3.84-5.05%2C8.59-11.32%2C15.3-8.18c0.15%2C0.07%2C0.26%2C0.15%2C0.41%2C0.21%20l22.38%2C12.87c0.07%2C0.04%2C0.15%2C0.11%2C0.21%2C0.15c2.95%2C2.03%2C4.17%2C5.16%2C4.2%2C8.71c0%2C3.61-1.33%2C7.67-3.28%2C11.1%20c-2.58%2C4.53-6.38%2C7.53-10.76%2C9.51c-4.17%2C1.92-8.81%2C2.95-13.27%2C3.61c-7%2C1.03-13.56%2C0.37-20.27-1.69%20c-6.56-2.03-13.17-5.38-20.39-9.84l-0.53-0.34c-3.31-2.07-6.89-4.28-10.4-6.89C31.12%2C93.32%2C18.03%2C79.31%2C9.5%2C63.89%20C2.35%2C50.95-1.55%2C36.98%2C0.58%2C23.67c1.18-7.3%2C4.31-13.94%2C9.77-18.32c4.76-3.84%2C11.17-5.94%2C19.47-5.2c0.95%2C0.07%2C1.8%2C0.62%2C2.25%2C1.44%20l14.35%2C24.26c2.1%2C2.72%2C2.36%2C5.42%2C1.21%2C8.12c-0.95%2C2.21-2.87%2C4.25-5.49%2C6.15c-0.77%2C0.66-1.69%2C1.33-2.66%2C2.03%20c-3.21%2C2.33-6.86%2C5.02-5.61%2C8.18L33.84%2C50.25L33.84%2C50.25L33.84%2C50.25z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.mail::before{
  content: "";
  display: inline-block;
  width: 1.3em;
  height: 1.3em;
  margin-right: 0.3em;
  vertical-align: -0.3em;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23728208%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M.05%203.555A2%202%200%200%201%202%202h12a2%202%200%200%201%201.95%201.555L8%208.414zM0%204.697v7.104l5.803-3.558zM6.761%208.83l-6.57%204.027A2%202%200%200%200%202%2014h12a2%202%200%200%200%201.808-1.144l-6.57-4.027L8%209.586zm3.436-.586L16%2011.801V4.697z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.mail{
  color:#728208;
}
.line{
  color:#06C755;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Header */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
}
.header-bar {
  display: grid;
  grid-template-columns: 1fr 100px 156px;
  height: 56px;
}
.menu-icon {
  width: 26px;
  height: 25px;
  display: grid;
  gap: 5px;
  margin-left:1.3rem;
}
.menu-icon span {
  display: block;
  height: 3px;
  border-radius: 999px;
  background: #fff;
}
.chervon{
  gap: 6px;
  color:#fff;
}
.chervon::before {
  content: "";
  transform: translateY(-1px);
  display: block;
  width: 1rem;
  height: 1rem;
  background: center / contain no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' fill-rule='evenodd' clip-rule='evenodd' d='M12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1ZM9.79289 8.70711C9.40237 8.31658 9.40237 7.68342 9.79289 7.29289C10.1834 6.90237 10.8166 6.90237 11.2071 7.29289L15.2071 11.2929C15.5976 11.6834 15.5976 12.3166 15.2071 12.7071L11.2071 16.7071C10.8166 17.0976 10.1834 17.0976 9.79289 16.7071C9.40237 16.3166 9.40237 15.6834 9.79289 15.2929L13.0858 12L9.79289 8.70711Z'/%3E%3C/svg%3E");
}
@media (min-width: 768px) {
  .header-bar {
  grid-template-columns: 1fr 116px 170px;
}
}
@media (min-width: 992px) {
  .site-header {
    display: none;
  }
  .header-bar {
  grid-template-columns: 1fr 110px 160px;
}
}
@media (max-width: 991.98px) {
  section[id] {
    scroll-margin-top: 56px;
  }
}

/* Menu panel */
.menu-overlay {
  position: fixed;
  inset: 0;
  background: rgba(80, 68, 56, 0.35);
  z-index: 45;
}
.schedule-modal{
  position: fixed;
  inset: 0;
  z-index: 60;
  display: grid;
  place-items: center;
}
.schedule-modal[hidden]{
  display: none;
}
.schedule-modal__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.45);
}
.schedule-modal__content{
  position: relative;
  background: #fff;
  border-radius: 5px;
  padding: 1rem 0.5rem 0.5rem;
  width: min(92vw, 600px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.2);
}
.schedule-modal__content img{
  width: 100%;
  height: auto;
  display: block;
}
.schedule-modal__close{
  position: absolute;
  top: -2.8rem;
  right: 0rem;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  border: none;
  background: #2F82B6;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  outline: none;
  padding-top:0.1rem;
}

.is-modal-open{
  overflow: hidden;
}
.menu-panel {
  position: fixed;
  top: 0;
  left: 0;
  width: 84%;
  max-width: 320px;
  height: 100%;
  max-height: 100dvh;
  background: #faf0e0;
  border-radius: 0 10px 10px 0;
  padding: 30px;
  z-index: 50;
  transform: translateX(-105%);
  transition: transform 0.28s ease;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.pc-menu{
  display: grid;
  gap: 1.5rem;
  align-content: start;
  grid-auto-rows: max-content;
}
.menu-panel.is-open {
  transform: translateX(0);
}
.menu-close {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: #fff;
  display: grid;
  place-items: center;
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index:100;
}
.menu-close::before {
  content: "";
  width: 2.1rem;
  height: 2.1rem;
  color: #9B816C;
  background: center / contain no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%239B816C' viewBox='0 0 16 16'%3E%3Cpath d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E");
}
.menu-nav {
  display: grid;
  gap: 1.2rem;
  align-content: start;
  grid-auto-rows: max-content;
  text-align: center;
  font-weight: 700;
  color: #5C4B3F;
  font-size:17px;
}
.menu-nav a {
  position: relative;
  padding-bottom: 3px;
  text-decoration: none;
  transition: color 150ms ease;
}
.menu-nav a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 2px;
  width: 46px;
  height: 3px;
  background: #6EC5FF;
  transform: translateX(-50%) scaleX(0.6);
  border-radius: 999px;
  opacity: 0;
  transition: opacity 150ms ease, transform 150ms ease;
}
.menu-nav a:hover::after {
  opacity: 1;
  transform: translateX(-50%) scaleX(1);
}
.menu-nav a.is-active::after {
  opacity: 1;
  transform: translateX(-50%) scaleX(1);
}
.menu-actions {
  display: grid;
  gap: 0.7rem;
  margin-bottom: 0.5rem;
}
.menu-actions a {
  height: 45px;
  border-radius: 5px;
  font-size:16px;
  text-decoration: none;
}

.menu-actions a.outline {
  border: 1px solid #AE5FA8;
  color: #AE5FA8;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.menu-social {
  display: grid;
  grid-auto-flow: column;
  gap: 1rem;
  justify-content: center;
}
.social-icon {
  width: 32px;
  height: 32px;
}
.pc-menu-logo{
display:none;
}
@media (min-width: 576px) {
.schedule-modal__content{
  padding: 1.5rem 1rem 1rem;
}
}
@media (min-width: 992px) {
  body{
    padding-left:280px;
  }
  .pc-menu{
    background: #fff;
    padding:120px 1rem 1.5rem;
    border-radius: 5px;
    margin-top:40px;
    gap:1.2rem;
  }
  .pc-menu-logo{
display:block;
width:110px;
margin:0 auto;
position: absolute;
top:10px;
left:50%;
transform:translateX(-50%);
  }
  .menu-overlay{
    display:none !important;
  }
  .menu-panel{
    transform:none;
    width:280px;
    max-width:280px;
    padding: 18px;
    border-radius:0;
  }
  button.menu-close{
    display:none;
  }
  .menu-nav {
  font-size:16px;
  gap: 0.7rem;
}
.menu-actions a {
  font-size:15px;
}
.schedule-modal{
  left: 280px;
}
}

/* hero */
#hero{
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding-top:25px;
  padding-bottom: calc(var(--hero-news-height, 0px) + 35px);
  background: linear-gradient(160deg, #8cd2f2 0%, #bfeaf9 45%, #f2d8f0 100%);
}
/*
#hero::before{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(205, 205, 205, 0.4);
  mix-blend-mode: multiply;
  z-index: 1;
}
#hero::after{
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255, 255, 255, 0.4) 0.4px, transparent 1px);
  background-size: 3px 3px;
  z-index: 2;
}
#hero .hero-video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
*/

.hero-copy{
  display: grid;
  place-items: center;
  position: relative;
  z-index: 3;
  gap:1rem;
}
.hero-copy img{
width:clamp(120px, 25vw, 160px);
margin: 0 auto 1rem;
}
.hero-copy h2{
  font-size: clamp(1.6rem, 4.3vw, 1.95rem);
  text-align: center;
  color:#4CA7E3;
  -webkit-text-stroke: 6px #fff;
  paint-order: stroke;
  line-height:1.5;
}
.hero-copy h2.js-repaint{
  transform: translateZ(0); /* 1フレームだけ再描画を促す */
}
.hero-age{
  background-color:#fff;
  border-radius: 100vw;
  padding:0.2rem 1rem;
  font-weight:700;
}
.hero-news{
  background: rgba(255,255,255,0.8);
  width: 100%;
  position: absolute;
  bottom:0;
  z-index:4;
  padding:1rem 0;
}
.hero-news h3{
  font-size: clamp(1.2rem, 5.3vw, 1.5rem);
  line-height:1.3;
}
.hero-news .btn{
  font-size: 0.95rem;
  font-weight:normal;
}

@media (min-width: 992px) {
  #hero{
  height: 660px;
}
.hero-copy{
  gap:1.5rem;
}
.hero-copy .btn-main{
width: 280px;
}
}

/* cp */
#cp{
padding:1rem 0 2rem;
}
#cp.dotted-right::after{
background-image:radial-gradient(#B9CB41 1.5px, rgba(255,255,255,0) 1.5px);
}
#cp .btn-border{
  font-size:1.25rem;
}
.btn-border{
  font-size:1.15rem;
}
.cp-banner{
display:block;
width: 94%;
max-width:760px;
margin:0 auto 1.5rem;
}

/* instructor */
#instructor.dotted-left::after{
  background-image:radial-gradient(#f2ead9 1.5px, rgba(255,255,255,0) 1.5px);
}
#instructor img{
  border-radius: 5px;
}
#instructor h3{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:baseline;
  gap:0.6rem 1rem;
  margin-bottom:0.7rem;
}
#instructor h4{
  margin-bottom:0.5rem;
}
#instructor .instructor-name-ja{
  font-size:1.6rem;
}
#instructor .instructor-name-en{
  font-size:1.05rem;
}
#instructor .instructor-tabs{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:0.2rem;
  margin-top:1.5rem;
}
#instructor .instructor-tab{
  background:#E9E9E9;
  color:#3385B9;
  font-weight:700;
  padding:0.6rem 0.3rem;
  transition: background-color 200ms ease, color 200ms ease, transform 200ms ease;
}
#instructor .instructor-tab.is-active{
  background:#5FB6E6;
  color:#fff;
}
#instructor .instructor-tab:hover{
  background:#7EC6EE;
  color:#fff;
  transform: translateY(-1px);
}
#instructor .instructor-tab.is-active:hover{
  transform: translateY(0);
}
#instructor .instructor-list{
  color:#3385B9;
  font-weight:700;
  margin-top:0.5rem;
}
#instructor .instructor-list li{
  padding:0.65rem 0.2rem;
  border-bottom:1px dotted #d5d5d5;
}

.message{
  background: #fff;
  padding:1.5rem 1rem 0.8rem;
  border-radius: 5px;
  border:1px solid #5FB6E6;
  margin-top:1rem
}
.message-titile{
  font-size:1.6rem;
  color:#5FB6E6;
  margin-top:-2.6rem;
  margin-bottom: 0.5rem;
  -webkit-text-stroke: 4px #fff;
  paint-order: stroke;
}
.message-name{
  text-align: right;
  font-size:0.95rem;
  margin-top: 0.5rem;
}
.message-name span{
  font-size:1.2rem;
}
.profile-pc{
  display: none;
}

.instructor-photo{
width:90%;
max-width:500px;
aspect-ratio: 4.4 / 3;
overflow: hidden;
border-radius: 5px;
margin:0 auto;
}
.instructor-photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (min-width: 992px) {
  .message-titile{
  font-size:1.8rem;
  margin-top:-3rem;
}
.message{
  padding:1.5rem 1.8rem 0.8rem;
}
}
@media (min-width: 1200px) {
.instructor-photo{
width:100%;
}
.profile-pc{
  display: block;
  margin-top:0.8rem;
}
.profile-sp{
  display: none;
}
}

/* about */
#about{
  color:#fff;
  position:relative;
}
#about.part-out::after{
  border-color:#3385B9 transparent transparent transparent;
}
#about .about-eyebrow{
  font-weight:700;
  font-size:1.1rem;
  letter-spacing:0.05em;
}
#about .about-title{
  font-weight:700;
  font-size:1.35rem;
  margin:0.3rem 0 0.6rem;
}
#about .about-lead{
  font-weight:700;
  font-size:1.4rem;
  line-height:1.35;
  margin-bottom:1.4rem;
}
#about .about-table{
  position:relative;
}
#about .about-row{
  display:flex;
  align-items:stretch;
  background:#fff;
  border-radius:5px;
  overflow:hidden;
}
#about .about-row + .about-row{
  margin-top:0.3rem;
}
#about .about-num{
  background:#AE5FA8;
  color:#fff;
  font-size:1.2rem;
  min-width:50px;
  display:flex;
  align-items:center;
  justify-content:center;
}
#about .about-text{
  color:#1E6CA5;
  font-weight:700;
  padding:0.75rem 0.9rem;
  line-height:1.4;
}
#about .about-mascot{
  position:absolute;
  right:-10px;
  bottom:-10px;
  width:70px;
  max-width:none;
}

/* stepup */
h2.stepup-title{
  font-size:1.12rem;
  margin-bottom:1rem;
}
h2.stepup-title span{
  font-size:1.75rem;
  display:block;
}
#stepup .stepup-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:0.7rem;
  margin:1.5rem 0;
}
#stepup{
  position:relative;
}
#stepup.part-out::after{
  border-color:#FBF7F0 transparent transparent transparent;
  z-index:100
}
#stepup .stepup-card{
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:space-between;
  gap:0.7rem;
  padding-top:0.7rem;
}
#stepup .stepup-card img{
  height:90%;
  max-width:90px;
}
#stepup .stepup-card-label{
  background:#AE5FA8;
  color:#fff;
  width:100%;
  text-align:center;
  font-weight:700;
  font-size:1.15rem;
  padding:0.5rem 0 0.4rem;
}
#stepup .stepup-action{
  margin-top: 1.5rem;
}
@media (min-width: 768px) {
h2.stepup-title{
font-size:1.5rem;
margin-bottom:1.8rem;
}
h2.stepup-title span{
font-size:2.2rem;
}
#stepup .stepup-grid{
  gap:0.7rem;
  margin:2rem auto;
  max-width:500px;
}
}

/* trampoline */
#trampoline.dotted-right::after{
  background-image:radial-gradient(#C8DA4E 1.5px, rgba(255,255,255,0) 1.5px);
}
#trampoline h2{
  margin-bottom:1.5rem;
  line-height: 1.5;
  font-size:1.3rem;
}
#trampoline p{
  position: relative;
  z-index:1;
}
#trampoline img{
  margin-top:-2vw;
  position: relative;
  z-index:0;
}
@media (min-width: 768px) {
#trampoline h2{
  font-size:1.7rem;
  margin-bottom:2rem;
}
#trampoline img{
  margin-top:-2vw;
  position: relative;
  z-index:0;
  max-width:600px;
  margin-left:auto;
}
}
@media (min-width: 1200px) {
#trampoline img{
  margin-top:-7vw;
}
}

/* Class */
#class.dotted-left::after{
  background-image:radial-gradient(#f2ead9 1.5px, rgba(255,255,255,0) 1.5px);
}

.class-block--green{
  --class-color:#ABC019;
  --class-text:#95AA08;
  --class-light:#EAF0B8;
}
.class-block--blue{
  --class-color:#58B5F1;
  --class-text:#3385B9;
  --class-light:#D6EEFB;
  margin-top:2.5rem;
}
.class-block--purple{
  --class-color:#BA63B5;
  --class-text:#AE5FA8;
  --class-light:#EAD1E8;
  margin-top:2.5rem;
}
.class-heading{
  color:var(--class-color);
  font-size:1.4rem;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.8rem;
  margin:0.4rem 0 1rem;
}
.class-heading{
  color:var(--class-text);
}
.class-heading::before,
.class-heading::after{
  content:"";
  flex:1;
  border-top:2px dotted var(--class-color);
}

.class-block--green .class-table{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
}
.class-block--blue .class-table{
  grid-template-columns: repeat(2, minmax(0, 200px));
  display:grid;
  justify-content: center;
}
.class-block--purple .class-table{
  display:grid;
  grid-template-columns: repeat(1, minmax(0, 400px));
  justify-content: center;
}

.class-card{
  background:#fff;
  overflow:hidden;
  border-right:2px solid #FBF7F0;
}
.class-card:first-child{
  border-radius:5px 0 0 5px;
}
.class-card:last-child{
  border-radius:0 5px 5px 0;
  border-right:0px solid #FBF7F0;
}
#class .class-block:last-of-type .class-card:first-child{
  border-radius:5px 5px 5px 5px;
}
.class-table p{
  color:var(--class-text);
}
.class-card-title{
  background:var(--class-color);
  color:#fff;
  font-weight:700;
  text-align:center;
  padding:0.5rem;
  font-size:1.1rem;
}
.class-card-body{
  padding:0.8rem 0.8rem 0.9rem;
  display:grid;
  gap:0.6rem;
}
.class-card-row{
  display:flex;
  align-items:center;
  gap:0.6rem;
}
.class-card-label{
  background:var(--class-light);
  color:var(--class-color);
  font-weight:700;
  font-size:0.85rem;
  border-radius:4px;
  padding:0.2rem 0.5rem 0.1rem;
  text-align:center;
}
.class-card-value{
  color:var(--class-text);
  font-weight:700;
  font-size: 1.1rem;
}
.class-card-row small{
  display: none;
}
.class-actions{
  margin:1.2rem 0 1.5rem;
  display:flex;
  justify-content:center;
  gap:0.5rem;
  flex-wrap:wrap;
}
.class-actions--single{
  justify-content:center;
}
.class-actions .round-btn{
  min-width:170px;
  height:40px;
  font-size: 1rem;
}
.class-actions .round-btn--filled{
  background:var(--class-color);
  color:#fff;
}
.class-actions .round-btn--outline{
  border:1px solid var(--class-color);
  color:var(--class-color);
  background:#fff;
}
.ac-note{
margin-top:0.5rem;
}
.ac-note-toggle{
  background:none;
  border:0;
  padding:0;
  font:inherit;
  color:inherit;
  cursor:pointer;
  font-weight: 700;
  transition: color 180ms ease;
}
.ac-note-toggle span{
border-bottom: 1px dotted currentColor;
}
.ac-note-toggle:hover{
  color:#2F82B6;
}
#ac-note-list{
padding-top:0.5rem;
}
.ac-note ul li{
  font-size:0.9rem;
  list-style: disc;
  margin-left: 1.2em;
  text-align: justify;
  letter-spacing: -0.5px;
  padding:0.1rem 0;
}
.schedule-card{
  margin-top:1.8rem;
  background:#2F82B6;
  color:#fff;
  border-radius:5px;
  padding:1.4rem 1rem 1.5rem;
  text-align:center;
}
.schedule-card h4{
  font-size:1.3rem;
  margin:0 0 0.5rem;
}
.schedule-btn{
  display:grid;
  grid-template-columns:1fr;
  gap:0.8rem;
  margin-top:1rem;
  justify-items:center;
}
.schedule-btn a{
  height: 50px;
  width:280px;
  background:#fff;
  color:#2F82B6;
  border-radius:5px;
  box-shadow:0 3px 0 #74bdf1;
}
.schedule-card-icon{
  width:1.5em;
  height:1.5em;
}
.schedule-btn a:hover{
  box-shadow: 0 2px 0px #74bdf1;
}
.schedule-btn a:active{
  box-shadow: 0 0 0px #74bdf1;
}

@media (max-width: 500px) {
.class-block--green .class-table{
  width:480px;
}
.class-table-wrap{
  position:relative;
}
.class-table-scroll{
  overflow-x:auto;
  padding-bottom:0.4rem;
  -webkit-overflow-scrolling:touch;
}

.class-scroll-fade{
  position:absolute;
  top:0;
  right:0;
  width:36px;
  height:100%;
  background:linear-gradient(to left, rgba(255,255,255,0.95), rgba(255,255,255,0));
  pointer-events:none;
}
.class-scroll-label{
  position:absolute;
  right:0.2rem;
  top:-1.5rem;
  font-size:0.7rem;
  font-weight:700;
  color:var(--class-color);
  pointer-events:none;
}
.class-table-wrap.is-scrolled .class-scroll-fade,
.class-table-wrap.is-scrolled .class-scroll-label{
  opacity:0;
}
}

@media (min-width: 500px) {
.class-block--green .class-table{
  width:100%;
  margin:0 auto;
}
.class-scroll-label{
  display: none;
}
}
@media (min-width: 576px) {
.class-card-row small{
  color:var(--class-text);
  font-size: 0.77rem;
  letter-spacing: -1px;
  display: block;
}
}
@media (min-width: 768px) {
  .class-scroll-fade,
  .class-scroll-label{
    display:none;
  }
  .schedule-card{
  margin-top:3rem;
}
.schedule-card h4{
  font-size:1.5rem;
}
.class-actions .round-btn{
  min-width:180px;
}
}
@media (min-width: 992px) {
.class-block--green{
  max-width:600px;
  margin:0 auto;
}
.schedule-card{
  padding:1.7rem 1rem 1.8rem;
}
}

@media (min-width: 1200px) {
.class-block--blue{
  margin-top:0rem;
}
.class-block--purple{
  margin-top:0rem;
}
.schedule-btn{
  grid-template-columns:repeat(2, minmax(0, 280px));
  justify-content:center;
  margin-top:1.5rem;
}
}

/* price */
#price{
  position: relative;
}
#price.dotted-right::after{
  background-image:radial-gradient(#86CDF5 1.5px, rgba(255,255,255,0) 1.5px);
}
.price-card,.price-card-sub{
  background: #fff;
  border-radius: 5px;
  overflow: hidden;
}
.price-card{
  margin-top:1rem;
}
.price-card-sub{
  margin-top:1.5rem;
}

.price-card .price-header{
  background: #735A40;
}
.price-card-sub .price-header{
  background: #B69572;
}
.price-header{
  color: #fff;
  text-align: center;
  font-weight: 700;
  font-size: 1.2rem;
  padding: 0.6rem;
}
.price-body{
  padding: 1rem;
}
.price-row{
  display: flex;
  align-items: center;
  justify-content: center;
  gap:1rem;
  padding: 0.9rem 0;
  border-bottom: 1px dotted #E5C4A7;
}
.price-body .price-row:first-child{
  padding-top:0;
}
.price-row-title{
  color: #2F7FB8;
  font-weight: 700;
  font-size: 1.05rem;
}
.price{
  font-weight: 700;
  font-size: 1.4rem;
}
.price small{
  font-size: 0.95rem;
  margin-left: 0.1rem;
}
.price-note{
  margin-top: 0.8rem;
  text-align: center;
}
.price-sale{
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 1.2rem;
  font-weight: 700;
}
.line-through{
  text-decoration: line-through;
  text-decoration-color: #E8485A;
}
.price-new{
  color: #E8485A;
  font-size: 2.2rem;
  line-height: 1;
}
.price-new small{
  font-size: 0.9rem;
  margin-left: 0.1rem;
}
.price-subnote{
  margin-top: 0.6rem;
}
.price-campaign{
  margin-top: 0.2rem;
  color: #E95064;
  font-weight: 700;
}
.price-campaign a:hover{
  transform: translateY(-2px);
  filter: brightness(1.1);
}
@media (min-width: 1200px) {
.price-card-sub{
display: grid;
grid-template-columns:repeat(3, 1fr);
}
.price-card-sub .price-sub--waku{
border-right:2px solid #AEDCF6;
}
.price-card-sub .price-sub--waku:last-child{
border-right:0px solid #AEDCF6;
}
}

/* Q&A */
#qa.dotted-left::after{
  background-image:radial-gradient(#f2ead9 1.5px, rgba(255,255,255,0) 1.5px);
}
.qa-categories{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}
.qa-category{
  border: none;
  background: #61ABD4;
  color: #fff;
  border-radius: 5px;
  padding: 0.65rem 0.5rem 0.5rem;
  font-weight: 700;
  line-height: 1.2;
  font-size: 1.1rem;
  text-align: center;
  transition: transform 180ms ease, filter 180ms ease, background-color 180ms ease;
}
.qa-category small{
  display: block;
  font-weight: normal;
  font-size: 0.7em;
}
.qa-category.is-active{
  background: #4E91BB;
}
.qa-category:hover{
  transform: translateY(-2px);
  filter: brightness(1.05);
}
.qa-category.is-active:hover{
  transform: translateY(-1px);
  filter: brightness(1.02);
}
.qa-category-title{
  font-size: 1.3rem;
  margin: 2rem 0 1rem;
}
.qa-list{
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 1fr;
}

.qa-section[hidden]{
  display: none;
}
.qa-list[hidden]{
  display: none;
}
.qa-item{
  background: #E8F1F4;
  border-radius: 5px;
  padding: 0.4rem 0.4rem;
}
.qa-question{
  width: 100%;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.3rem;
  padding: 0.3rem 0.5rem;
  text-align: left;
  color: #3385B9;
  font-weight: 700;
  font-size: 1.1rem;
  transition: color 180ms ease, transform 180ms ease;
}
.qa-question:hover{
  color:#206fa7;
}
.qa-answer{
  padding: 0.5rem;
  line-height: 1.6;
  font-size:0.95rem;
}
.qa-icon{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #fff;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.qa-icon::before{
  content: "";
  width: 5px;
  height: 5px;
  border-right: 1px solid #2F7FB8;
  border-bottom: 1px solid #2F7FB8;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
.qa-item.is-open .qa-icon::before{
  transform: rotate(-135deg);
}

@media (min-width: 768px) {
.qa-category-title{
  font-size: 1.5rem;
  margin: 2.6rem 0 1rem;
}
.qa-question{
  font-size: 1.05rem;
}
.qa-answer{
  font-size:0.95rem;
}
}


@media (min-width: 1200px) {
  .qa-categories{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
}

/* news */
#news ul{
  margin-bottom: 2rem;;
}
#news ul .date{
  display:block;
  margin-bottom: 0.3rem;
}
#news ul a {
  display: inline-block;
  transition: filter 180ms ease;
font-size:1.07rem;
}
#news ul a:hover{
  filter: brightness(0.7);
}
#news ul li{
  padding:0.8rem 0;
  border-bottom: 1px dotted #ccc;
}

@media (min-width: 576px) {
#news ul a {
  display: inline-block;
  transition: filter 180ms ease;
font-size:1rem;
}
}
@media (min-width: 1200px) {
#news ul .date{
  display:inline-block;
  margin-bottom: 0rem;
  width:110px;
}
#instagram img {
  width: calc((100% - 12px) / 5);
}
#instagram img:last-child{
  display:none;
}
}

/* access */
#access.dotted-right::after{
  background-image:radial-gradient(#f2ead9 1.5px, rgba(255,255,255,0) 1.5px);
}
#access iframe{
  margin-bottom:1rem;
  border-radius: 5px 5px 0px 0px;
}
.access-back{
  border-radius: 0px 0px 5px 5px;
}
.access-info{
  padding:1rem 0.7rem;
  display: grid;
  justify-content: center;
  gap:1rem;
}
.access-infos{
  display: flex;
  gap:0.7rem;
  align-items: center;
}
@media (min-width: 768px) {
  .access-info{
  padding:1.5rem 0.7rem;
}
}

@media (min-width: 1200px) {
.access-infos img{
width:70px;
}

.access-infos{
  gap:1rem;
}
}

/* contact */
#contact.dotted-left::after{
  background-image:radial-gradient(#B9CB41 1.5px, rgba(255,255,255,0) 1.5px);
}
.contact-btn{
  display: grid;
  place-items: center;
  gap: 0.8rem;
  margin: 1.5rem 0 1.8rem;
}
.contact-btn a{
  height: 56px;
  width:280px;
  border-radius: 5px;
  background: #ffffff;
  box-shadow: 0 4px 0px #92A800;
}

.contact-btn a:hover{
  box-shadow: 0 2px 0px #92A800;
}
.contact-btn a:active{
  box-shadow: 0 0 0px #92A800;
}
#contact a.text-link{
  color:#728208;
}
.open-time{
  background: #B3CA17;
  border-radius: 5px;
  padding: 1rem;
  width:280px;
  margin: 2rem auto 0;
  display: grid;
  place-items: center;
}

@media (min-width: 768px) {
.contact-btn{
  grid-template-columns:repeat(2, minmax(0, 280px));
  justify-content:center;
}
.open-time{
  width:600px;
}
}

/* contact */
.contact-form{
max-width:700px;
margin: 0 auto;
display: flex;
flex-direction: column;
gap: 1.4rem;
}
.form-field{
display: flex;
flex-direction: column;
gap: 0.4rem;
}
.form-label{
font-weight: 700;
}

.required{
font-size:0.82rem;
color:#fff;
background: #e55959;
padding:0.1rem 0.2rem 0 0.2rem;
border-radius: 2px;
}

.privacy{
 border:1px solid #ccc;
 padding:1rem;
 border-radius: 5px;
 margin:0.5rem 0;
}

.form-input,
.form-textarea{
width: 100%;
border: 1px solid #ededed;
border-radius: 4px;
padding: 0.5rem 1rem;
font-size: 1rem;
background: #fff;
}

.form-textarea{
min-height: 180px;
resize: vertical;
}

.wpcf7 input[type="submit"].wpcf7-submit{
width: 360px;
max-width:90%;
height: 46px;
margin: 0 auto;
display: block;
background-color: #AE5FA8;
box-shadow: 0 4px 0 #8A3684;
border-radius: 5px;
border: none;
cursor: pointer;
color: #fff;
font-weight: 700;
transition: transform 150ms ease, box-shadow 150ms ease, filter 150ms ease;
appearance: none;
-webkit-appearance: none;
}
.wpcf7 input[type="submit"].wpcf7-submit:hover{
box-shadow: 0 2px 0 #8A3684;
}
.wpcf7 input[type="submit"].wpcf7-submit:active{
box-shadow: 0 0 0 #8A3684;
}
.wpcf7-spinner{
display: none !important;
}

@media (min-width: 768px) {
.form-input,
.form-textarea{
font-size: 1.05rem;
}
}


/* footer */
footer{
  padding: 1.5rem 0 0.5rem;
}
.footer-logo{
width:130px;
}
footer .container{
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
.copy{
  font-size:0.7rem;
  text-align: center;
  margin-top: 3.3rem;
  font-weight:700;
}
@media (min-width: 576px) {
footer .container{
  justify-content: center;
  gap:5rem
}
.copy{
  margin-top: 2.6rem;
}
}