@charset "UTF-8";
main {
  line-height: 1.4;
}

.breadcrumb {
  max-width: 992px;
  margin: 0 auto;
  justify-content: flex-start;
}
.main-shop {
  padding-top: 190px;
}
.main-shop h1 {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 2rem;
  line-height: 1.6;
  font-weight: bold;
  text-align: center;
  letter-spacing: 4px;
  color: #6FC8BC;
  margin: 0 0 60px;
}
.main-shop h1 .sc-title {
  display: block;
  font-size: 1.4rem;
}
.main-shop h1 .sc-name {
  border-bottom: 2px solid #6FC8BC;
  padding-bottom: .5rem
}
.main-shop h1 .sc-place {
  display: block;
  font-size: 1.4rem;
  margin-top: 1rem;
}
.bg-grad-blue {
  background: #92d2ee;
  background: linear-gradient(90deg, #92d2ee 0%, #6fc8bc 100%);
}
.mv-slider {
  position: relative;
}
.swiper-button-next, .swiper-button-prev {
  background: #fff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.swiper-button-next:after, .swiper-button-prev:after {
  font-size: 20px;
  color: #6FC8BC;
}
.shop-info {
  padding: 4rem 0;
}}
/* スライドを“固定幅”にする：slidesPerView:'auto' とセットで使う */
.mv-slider .swiper-slide {
  width: 992px;          /* ← 固定幅 */
  flex-shrink: 0;        /* Swiperの計算で潰れないように */
}

.mv-slider .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* 矢印の配置（任意） */
.arrow-button .swiper-button-prev,
.arrow-button .swiper-button-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}
.arrow-button .swiper-button-prev { left: 16px; }
.arrow-button .swiper-button-next { right: 16px; }

/* モバイルははみ出し防止で幅を調整 */
@media (max-width: 1024px) {
  .mv-slider .swiper-slide {
  width: calc(100vw - 40px); /* 余白込みで画面幅に収める */
  }
}

.headline-outline {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 36px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-align: center;
  margin: 0;
  padding: 0.3em 0;
  margin-bottom: 40px;

  /* 文字グラデーション */
  background: linear-gradient(90deg, #bfefff 0%, #79d9e9 45%, #41c3c5 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.section-group {
  padding: 7rem 0;
}

.bg-yellow {
  background-color: #FFFFF2;
}

/* ===== 配色・余白（必要なら調整） ===== */
:root{
  --c-text: #222;
  --c-muted:#667085;
  --c-bg: #fff;
  --c-head:#dff3ef;      /* ヘッダー/時間列のミント */
  --c-border:#d7dee2;    /* 罫線 */
  --fs: 16px;
  --py: .9rem;
  --px: 1rem;
}

/* ラッパー（横スクロール保険） */
.table{
  margin: 1.25rem 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* 本体テーブル */
.table > table{
  width: 100%;
  border-collapse: collapse;    /* 1本線の罫線 */
  background: #fff;
  font-size: var(--fs);
}

/* セル共通 */
.table > table th,
.table > table td{
  padding: 10px;
  border: 1px solid #ccc;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

.table > table td {
  background: #fff;
}

/* ===== 1行目（見出し） ===== */
.table > table > tbody > tr:first-child th{
  font-size: 20px;
  background: #DAF5F1;
  font-weight: 700;
  color: #0f172a;
  text-align: center;
}

/* ===== 左・中央の「開始時間」列（1列目／7列目） ===== */
.table > table tr > th {
  background: #DAF5F1;
  font-weight: 700;
  color:#0f172a;
  width: 8ch;
}


/* ===== バッジ（タグ） ===== */
.tag{
  display:inline-block;
  padding:.28em .7em;
  border-radius: 4px;
  font-weight: 700;
  font-size:.9em;
  line-height:1.2;
  letter-spacing:.02em;
  box-shadow: 0 1px 0 rgba(0,0,0,.05);
}
.tag-orange{ background:#f8b94b; color:#fff; }  /* サニー */
.tag-red   { background:#ef6b73; color:#fff; }  /* シャイン */
.tag-yellow{ background:#ffe64d; color:#111; }  /* スター */
.tag-blue{ background:#61AEE1; color:#fff; }
.tag-purple{ background:#9463A4; color:#fff; }

/* ダークモード（任意） */
@media (prefers-color-scheme: dark){
  :root{
  --c-text:#e5e7eb;
  --c-muted:#9aa4b2;
  --c-bg:#0b0f14;
  --c-head:#12333b;
  --c-border:#263645;
  }
  .tag-yellow{ color:#0b0f14; }
}

/* 印刷 */
@media print{
  .table{ overflow:visible; }
  .table > table{ min-width:auto; }
  .table > table *{ background: transparent !important; }
  .tag{ box-shadow: none; }
}

.feature .bg-red {
  background-color: #FF7782;
}
.feature .bg-blue {
  background-color: #46C4DB;
}
.feature .bg-yellow {
  background-color: #FFD441;
}
.feature .bg-green {
  background-color: #7EDE19;
}

.p-top__faq {
  padding: 0;
}
.shop-info-box {
  background-color: #fff;
  padding: 3rem;
  border-radius: 20px;
  margin-top: 3rem;
}
.shop-info-box dl {
  letter-spacing: 1.6px;
}

.shop-info-box dl dt {
  font-weight: bold;
  color: #6FC8BC;
  font-size: 18px;
  margin-bottom: .8rem;
}

.shop-info-box dl dd {
  margin-bottom: 2rem;
}

.shop-info-box dl dd .class-detail {
  margin-bottom: .5rem;
  display: flex;
  gap: 14px;
}

.shop-info-box .flex .img,
.shop-info-box .flex .links
 {
  width: 48%;
}

.btns-title {
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
  
  /* 文字グラデーション */
  background: linear-gradient(90deg, #60B9E0 0%, #44C3B2 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.btns .btn {
  display: flex;
  align-items: center;
  text-align: center;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  justify-content: center;
  padding: 1rem;
  border-radius: 10px;
  position: relative;
  box-shadow: 0px 5px 15px 0px rgba(0,0,0, 0.2);
  margin-bottom: 20px;
  gap: 15px;
}

.btns .btn .arrow {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}

.btn-hp {
  border: 2px solid #FA4B5A;
  background-color: #FA4B5A;
}

.btn-line {
  border: 2px solid #06C755;
  background-color: #06C755;
}

.btns .btn-phone {
  color: #2B94FD;
  border: 2px solid #2B94FD;
  background-color: #fff;
}

.btns .btn .number {
  font-size: 26px;
}
.btns .btn .number span {
  font-size: 14px;
  display: block;
  margin-top: 5px;
}

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

.tag-class {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight:800;
  letter-spacing:4px;
  font-size: 18px;
  display: inline-block;
  color: #6fc8bc;
  border: 1px solid #6fc8bc;
  padding: .5rem 1rem;
  border-radius: 4px;
  margin-top: 15px;
  margin-bottom: 25px;
}

.p-class__contents {
  margin-left: 0;
  display: flex;
  justify-content: center;
}

.schedule h3 {
  font-size: 22px;
  text-align: center;
  margin: 30px 0 30px;
  position: relative;
  color: #6FC8BC;
}

.schedule h3 span {
  position: relative;
  padding: 0 3rem;
  background-color: #FFFFF2;
  z-index: 1;
}

.schedule h3::after {
  content: "";
  border-bottom: 3px dotted #6fc8bc;
  display: block;
  width: 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.tags {
  margin-top: 30px;
}

.tags ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px;
}


.pdf-btn a,
.pdf-btn button
  {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #FF4555;
  background-color: #fff;
  border: 1px solid #FF4555;
  max-width: 250px;
  text-align: center;
  margin: 40px auto 0;
  padding: 16px 0;
  gap: 6px;
  padding: 12px 3rem;
  cursor: pointer;
}

.table.table-grad > table > tbody > tr:first-child th {
  color: #fff;
    background: linear-gradient(to right, #92D2EE, #6FC8BC);
}

.table.table-grad > table td {
  font-size: 18px;
  font-weight: 700;
}

.table.table-grad > table td .tax,
.table.table-grad > table td .note
 {
  font-size: 14px;
  font-weight: normal;
}

.table p {
  margin-top: 20px;
}

.table.table-grad > table .text-left {
  text-align: left;
}

.box-camp {
  border: 8px solid #F78DA7;
  border-radius: 20px;
}
.box-camp h4 {
  font-family: "M PLUS Rounded 1c", sans-serif;
  color: #fff;
  background-color: #F78DA7;
  text-align: center;
  padding: 5px 0 15px;
  font-size: 28px;
  font-weight: bold;
  position: relative;
}
.keypoint {
  max-width: 680px;
  margin: 0 auto;
  padding: 30px 0;
}
.keypoint p {
  font-size: 20px;
  text-align: center;
  font-weight: 700;
  line-height: 1.6;
}
.box-red {
  color: #ff7782;
  border: 3px solid #ff7782;
  padding: 10px 1rem;
  display: block
}
.small {
  font-size: 16px;
  font-weight: normal;
  display: block;
}
.box-camp {
  margin: 60px 0;
}
.keypoint .wrap {
  border: 2px solid #ef737d;
  padding: 15px;
  line-height: 1.4;
}
.keypoint .wrap ul {
  list-style-type: disc;
  padding-left: 20px;
}
.keypoint p {
  margin-bottom: 20px;
}
.access-content {
  background-color: #fff;
  padding: 40px;
}

.access-content .btns {
  display: flex;
  justify-content: center;
}

.access-content .btns a {
  width: 340px;
}

.address {
  display: flex;
  justify-content: center;
  font-size: 20px;
  line-height: 1.6;
  font-weight: 700;
  margin-bottom: 30px;
}
.access-info {
  margin-top: 50px;
  border-top: 3px dotted #6fc8bc;
  padding-top: 35px;
}

.access-info p {
  position: relative;
  padding-left: 30px;
  line-height: 1.6;
}

.access-info p::before {
  position: absolute;
  top: -3px;
  left: 0;
}

.icon-train::before {
  content: "";
  background-image: url(/wp-content/themes/jdac/assets/img/shop/icon-train.svg);
  display: inline-block;
  width: 18px;
  height: 22px;
}

.icon-car::before {
  content: "";
  background-image: url(/wp-content/themes/jdac/assets/img/shop/icon-car.svg);
  display: inline-block;
  width: 23px;
  height: 23px;
}

.icon-bike::before {
  content: "";
  background-image: url(/wp-content/themes/jdac/assets/img/shop/icon-bike.svg);
  display: inline-block;
  width: 24px;
  height: 17px;
}

.access-info p {
  margin-bottom: 18px;
}

.map iframe {
  width: 100%;
}

.access-movie {
  padding: 40px 50px 0;
}

.access-movie h3 {
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  color: #6fc8bc;
  margin-bottom: 25px;
}

.bg-grad {
  background: linear-gradient(to right, #60B9E0, #44C3B2);
}

.flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.col-02 {
  width: 48%;
}

.bg-grad .flex {
  background: #fff;
  padding: 30px;
  border-radius: 20px;
}

.bg-grad .col-02 .btns {
  max-width: 100%;
  width: 100%;
}

.bg-grad .col-02 h2 {
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 20px;
  line-height: 1.6;
}

.bg-grad .btns .btn-phone {
  margin-bottom: 0;
}

.movie{
  --ratio: 16 / 9;
  position: relative;
  width: 100%;
  aspect-ratio: var(--ratio);
  max-width: 600px;
  margin: 40px auto 0;
}
.movie > iframe{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.feature .col-02 {
  padding: 20px;
  color: #fff;
  line-height: 1.4;
  border-radius: 20px;
  margin-bottom: 20px;
}

.feature .col-02 p {
  padding-top: 12px;
}

.feature .col-02 .number {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 22px;
  text-align: center;
  margin-bottom: 14px;
}

.feature .col-02 .number span {
  border-bottom: 2px solid #fff;
}

.feature h3 {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight:800;
  font-size: 24px;
  text-align: center;
  line-height: 1.4;
  padding-top: 5px;
  padding-bottom: 12px;
}

.teacher .col-03 {
  width: 31.5%;
  line-height: 1.4;
  margin-bottom: 30px;
}

.teacher .col-03 h4 {
  font-size: 22px;
  text-align: center;
  margin: 20px 0 5px;
}

.teacher .img {
  font-weight: 700;
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 3px dotted #6fc8bc;
}

.teacher .img img {
  object-fit: cover;
  height: 270px;
}

.teacher .img p {
  text-align: center;
}
.teacher .img span {
  display: block;
}

.teacher .content {
  padding: 0 7px 0;
}

.teacher p.headline-outline {
  margin-bottom: 0px;
}

.voice .flex {
  background-color: #fff;
  align-items: center;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, .1);
  margin-bottom: 40px;
}

.voice .flex .img {
  width: 25%
}

.voice .flex .content {
  width: 75%;
  padding: 25px;
  line-height: 1.4;
}

.voice .flex .content h3,
.voice .flex .content h4
 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}
.voice .flex .content h4 {
  margin-bottom: 20px;
}

.faq .p-top__faq .p-faq__body {
  margin: 0;
}

#cta {
  padding: 70px 0;
}

#cta .col-02 img {
  border-radius: 20px;
}

.cta-box {
  border: 7px solid #F78DA7;
  padding: 25px;
  line-height: 1.4;
}

.cta-box h2 {
  font-size: 32px;
  text-align: center;
  color: #F78DA7;
  font-weight: 700;
  margin-bottom: 40px;
}

.cta-box h2 span {
  border-bottom: 3px dotted #F78DA7;
  padding-bottom: 5px;
  margin-bottom: 25px;
}
.contact-btn a {
  display: flex;
  align-items: center;
  gap: 18px;
  color: #fff;
  background-color: #F78DA7;
  border: 1px solid #F78DA7;
  width: 70%;
  font-size: 21px;
  padding: 0.7rem 0;
  justify-content: center;
  margin-top: 30px;
  border-radius: 10px;
}

.c-copy {
  color: #6FC8BC;
  margin: 0;
}

.c-copy span {
  color: #ff7782;
}

.p-class__note {
  font-size: 16px;
}

.p-class__box2 {
  font-size: 16px;
}

.headline-outline span {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 500;
  display: block;
  font-size: 21px;
  -webkit-text-stroke: 0;
  color: #17c9b6;
}

.scroll-img {
  display: flex;
  justify-content: flex-end;
  padding: 10px 0;
}

.scroll-img img {
  width: 60%;
}

.c-title span {
  font-size: 38px;
}

.p-class__list.flex .class-img {
  width: 26%;
}

.p-class__list.flex .class-img img {
  height: 100%;
  object-fit: cover;
}

.p-class__list.flex .class-text {
  width: 74%;
  padding-left: 2rem;
  text-align: left;
}

.p-class__list.flex {
  font-family: "M PLUS Rounded 1c", sans-serif;
  padding: 20px;
  margin-bottom: 30px;
  width: 100%;
  flex-direction: row;
  gap: 0
}

.p-class__list.flex:last-child {
  margin-bottom: 0;
}

.p-class__list {
  border: 0;
}

.p-class__contents {
  display: block;
}

.p-class__list h3 {
  font-size: 32px;
  margin-top: 0;
  color: #fff;
}

.p-class__list p {
  margin: 10px 0;
}

.class-btn {
  display: flex;
  justify-content: flex-end;
}

.class-btn a,
.class-btn p
 {
  display: inline-block;
  background-color: #fff;
  padding: 0.7rem 2rem;
  color: #222222;
  border-radius: 30px;
  margin-top: 1rem;
  transition: all .4s;
}

.class-btn a span,
.class-btn p span
 {
  margin-left:.5rem;
}

.p-class__list:nth-child(2) h3 {
  color: #fff;
}

#class-sunny {
  color: #fff;
  background-color: #F4B718;
}

#class-sunny .class-btn a,
#class-sunny .class-btn p
 {
  color: #F4B718;
}

#class-sunny .class-btn a:hover,
#class-sunny .class-btn p:hover
 {
  color: #fff;
  background-color: #F4B718;
}

#class-shine {
  color: #fff;
  background-color: #EF737D;
}

#class-sparkle {
  color: #fff;
  background-color: #61AEE1;
}

#class-sparkle .class-btn a,
#class-sparkle .class-btn p
 {
  color: #61AEE1;
}

#class-sparkle .class-btn a:hover,
#class-sparkle .class-btn p:hover
 {
  color: #fff;
  background-color: #61AEE1;
}

#class-nova{
  color: #fff;
  background-color: #9463A4;
}

#class-nova .class-btn a,
#class-nova .class-btn p
 {
  color: #9463A4;
}

#class-nova .class-btn a:hover,
#class-nova .class-btn p:hover
 {
  color: #fff;
  background-color: #9463A4;
}



#class-shine .class-btn a,
#class-shine .class-btn p
 {
  color: #EF737D;
}

#class-shine .class-btn a:hover,
#class-shine .class-btn p:hover
 {
  color: #fff;
  background-color: #EF737D;
}

#class-star h3 {
  color: #222;
}

#class-star {
  color: #222;
  background-color: #FAEC00;
}

#class-star .class-btn a,
#class-star .class-btn p
 {
  color: #222;
}

#class-star .class-btn a:hover,
#class-star .class-btn p:hover
 {
  color: #fff;
  background-color: #222;
}

.cta-group {
  padding: 3rem 0;
}

.cta-group .explain {
 color: #fff;
 margin-bottom: 40px;
}

.cta-group .explain h3 {
  font-size: 32px;
  text-align: center;
  font-weight: bold;
  letter-spacing: -.1rem;
  margin-bottom: 10px;
}

.cta-group .explain p {
  font-size: 18px;
  line-height: 1.8;
}

.cta-group .explain span {
  font-size: 13px;
}

.c-title span:nth-child(9),
.c-title span:nth-child(15)
 {
  color: #FFE17A
}

.c-title span:nth-child(10),
.c-title span:nth-child(16)
 {
  color: #96E049;
}

.c-title span:nth-child(11),
.c-title span:nth-child(17)
 {
    color: #D9BDFF;
}

.c-title span:nth-child(12) {
    color: #FFA9A9;
}

.c-title span:nth-child(13) {
    color: #FF7782;
}

.c-title span:nth-child(14) {
    color: #A0DCE7;
}


/* カード1枚分 */
.voice-card {
  max-width: 960px;
  margin: 100px auto 40px;
}

/* 枠のボックス */
.voice-card__box {
  position: relative;
  display: flex;
  justify-content: flex-end;
}

/* Voice01/02 ラベル */
.voice-card__label {
  position: absolute;
  top: -22px;
  right: 24px;
  font-size: 20px;
  font-weight: 700;
  color: #6fd5df;
}

/* 左の写真部分 */
.voice-card__img {
  position: absolute;
  left: -20px;          /* 枠からはみ出させる */
  top: 20%;
  transform: translateY(-50%);
  width: 30%;         /* 画像の幅 */
  border-radius: 18px;
  overflow: hidden;
}

.voice-card__img img {
  display: block;
  width: 100%;
  height: auto;
}

/* 右側テキスト */
.voice-card__content {
  border: 2px solid #6fd5df;
  border-radius: 18px;
  padding: 32px 32px 32px 12%; /* 左を大きく空けて画像ぶんのスペース */
  box-sizing: border-box;
  width: 81%;
  background: linear-gradient(to right, #F0FAFF, #F2FFFD);
}

.voice-card__title {
  color: #6FC8BC;
  font-size: 28px;
  font-weight: 700;
  margin: 0 0 8px;
  line-height: 1.5;
}

.voice-card__name {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 12px;
  color: #222;
}

.voice-card__text {
  font-size: 14px;
  line-height: 1.9;
  margin: 0;
}

.voice-card-reverse .voice-card__box {
  justify-content: flex-start;
}

.voice-card-reverse .voice-card__img {
  right: -20px;
  left: auto;
}

.voice-card-reverse .voice-card__content  {
  padding: 32px 12% 32px 32px;
}

.voice-card-reverse .voice-card__label {
  left:24px;
  right: 0;
}

.box-camp-feature {
  background-color: #F78DA7;
}

ul.keypoint {
  max-width: 680px;
  margin: 0 auto;
}

ul.keypoint li {
    background: #fff;
    border-radius: 20px;
    display: flex;
    padding: 0.9rem 1.5rem;
    margin-bottom: 30px;
}

ul.keypoint li:last-child {
  margin-bottom: 0;
}

ul.keypoint li .icon {
  width: 12%;
  position: relative;
}

ul.keypoint li .icon svg {
  position: absolute;
  top: -26px;
}

ul.keypoint li .text {
  width: 88%;
}

ul.keypoint li .text h5 {
  font-family: "M PLUS Rounded 1c", sans-serif;
  color: #F78DA7;
  font-size: 25px;
  font-weight: bold;
}

.box-camp-feature ul.keypoint p {
  font-size: 14px;
  text-align: left;
  color: #F78DA7;
  margin-bottom: 0;
}

.w700 {
  max-width: 620px;
  margin: 0 auto;
}

.note {
  color: #fff;
}

.catch-text {
  font-family: "M PLUS Rounded 1c", sans-serif;
  color: #F78DA7;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
}

.box-camp .keypoint p span {
  font-size: 16px;
  display: block;
  font-weight: bold;
  margin-top: 10px;
}

@media screen and (max-width: 991px) {
  .p-class__list {
    display: flex;
  }
}

@media screen and (min-width: 768px) {
  .br-sp {
    display: none;
  }
  .scroll-img {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .main-shop {
    padding-top: 110px;
  }
  .breadcrumb {
    top: 80px;
  }
  .main-shop h1 .sc-title {
    font-size: 18px;
  }
  .main-shop h1 {
    font-size: 24px;
    margin: 0 0 30px;
  }
  .mv-slider .swiper-slide img {
    width: 100% !important;
  }
  .mv-slider .swiper-slide {
    width: 100%;
  }
  .mv-slider {
    width: 95%;
    margin: 0 auto;
  }
  .shop-info-box {
    padding: 30px 20px;
  }
  .btns-title {
    display: flex;
    font-size: 23px;
  }
  .btns-title span {
    display: none;
  }
  .btns-title:before {
    content: "";
    background-image: url(../img/school/naname01.svg);
    width: 24px;
    display: block;
    height: 60px;
    width: 12%;
  }
  .btns-title:after {
    content: "";
    background-image: url(../img/school/naname02.svg);
    width: 24px;
    display: block;
    height: 60px;
    width: 12%;
  }
  .btns-title p {
    width: 86%;
  }
  .btns .btn {
    font-size: 15px;
    justify-content: flex-start;
    gap: 10px;
  }
  .btns .btn .arrow {
    right: 10px;
  }
  .section-group {
    padding: 3rem 0;
  }
  .class-info .l-wrapper {
    max-width: 100%;
  }
  .tags ul {
    gap: 15px;
  }
  .schedule {
    max-width: 100%;
  }
  .schedule h3 span {
    padding: 0 1rem;
  }
  .table {
    margin: 2rem 0;
    padding: 1rem 0;
    max-width: 95%;
    margin-left: auto;
  }
  .class-info {
    padding: 4rem 15px;
  }
  .box-camp {
    margin: 20px auto 20px;
    max-width: 90%;
  }
  .box-camp h4 {
    font-size: 24px;
  }
  .box-camp h4 svg {
   position: absolute;
   top: -23px;
   left: 0;
   width: 50px;
  }
  .box-camp h4 svg:last-of-type {
   right: 0;
   left: auto;
  }
  .keypoint p {
    font-size: 16px;
  }
  .keypoint {
    padding: 30px 0 10px;
  }
  .keypoint .wrap {
    
  }
  .box-camp .keypoint {
    padding: 30px 15px;
  }
  
  .access-content {
    padding: 40px 20px;
  }
  .access-movie {
    padding: 40px 0 0;
  }
  .flex .col-02 {
    width: 100%;
  }
  .bg-grad .flex {
    padding: 20px 0px;
  }
  .flex .col-02:first-child {
    margin-bottom: 30px;
  }
  .btns .btn {
    padding: 10px;
  }
  .voice .flex .img {
    width: 100%;
  }
  .voice .flex .content {
    width: 100%;
  }
  .teacher .col-03 {
    width: 100%;
    margin-bottom: 30px;
  }
  .feature h3 {
    font-size: 20px;
  }
  .contact-btn a {
    font-size: 16px;
    width: 100%;
  }
  .p-class__list.flex .class-img {
    width: 100%;
    margin-bottom: 15px;
  }
  .p-class__list.flex .class-text {
    width: 100%;
    padding-left: 0;
  }
  .p-class__list h3 {
    font-size: 22px;
  }
  .table.table-grad > table td {
    font-size: 14px;
  }
  .table.table-grad > table td .note {
    color: #222;
    font-size: 12px;
  }
  .w700 .note {
    font-size: 14px;
  }
  .box-camp .keypoint p span {
    font-size: 12px;
  }
  .keypoint .wrap {
    font-size: 14px;
  }
  .headline-outline {
    margin-bottom: 20px;
  }
  .voice-card__content {
    width: 100%;
  }
  .voice-card__img {
    left: 10px;
    top: 0px;
    width: 50%;
  }
  .voice-card__content {
    padding: 75px 15px 30px;
  }
  .voice-card__title {
    font-size: 24px;
  }
  .voice-card-reverse .voice-card__content {
    padding: 75px 15px 30px;
  }
  .voice-card-reverse .voice-card__img{
    right: 10px;
  }
  .voice-card__label {
    top: 10px;
  }
}

.arrow-button .swiper-button-prev, .arrow-button .swiper-button-next {
  transform: translateY(0);
}

.swiper-button-next, .swiper-button-prev {
  width: 30px;
  height: 30px;
}

.swiper-button-next:after, .swiper-button-prev:after {
  font-size: 15px;
}

/* 親を基準にする */
.mv-slider, .th-slider {
  position: relative;
}

/* 900pxのバーを中央に据える */
.mv-slider .arrow-button,
.th-slider .arrow-button
 {
  position: absolute;
  top: 50%;
  left: 50%;
  /* 横幅900pxを要求どおり固定（画面が狭い時のはみ出し防止も一応） */
  width: 992px;
  max-width: calc(100% - 32px); /* 余白を少し確保。不要なら削除可 */
  transform: translate(-50%, -50%);
  display: flex;
  justify-content: space-between; /* 左右端に矢印 */
  align-items: center;
  z-index: 5;           /* スライドより前面へ */
}

.th-slider .arrow-button {
  top: 30%;
  max-width: calc(100% - -13px);
}

/* Swiperのデフォルトabsoluteを無効化して、バー内に自然配置 */
.mv-slider .swiper-button-prev,
.mv-slider .swiper-button-next {
  position: static !important;
  margin: 0;
  pointer-events: auto; /* クリックできるように戻す */
}

/* お好みでホバーのヒットエリアを少し大きく */
.mv-slider .swiper-button-prev::after,
.mv-slider .swiper-button-next::after {
  font-size: 14px; /* アイコンサイズ調整 */
}

.icon-vehicle {
  position: relative;
}

.icon-vehicle svg {
  position: absolute;
}

#recruit {
  padding: 3rem 0;
}

.box-pink {
  border: 8px solid #F78DA7;
  border-radius: 20px;
  padding: 30px;
}

.box-pink h4 {
  font-size: 30px;
  color: #F78DA7;
  font-weight: bold;
  text-align: center;
  margin-bottom: 30px;
}

.box-pink h4 span {
  display: inline-block;
  border-bottom: 3px dotted #ff7782;
  padding-bottom: 5px;
}

.box-pink .flex .text {
  font-weight: bold;
}

.box-pink .flex .text,
.box-pink .flex .img
 {
  width: 48%;
}

.box-pink .flex .text .btn {
  margin-top: 2rem;
}

.box-pink .flex .text .btn a {
  color: #fff;
  background-color: #ff7782;
  padding: 0.7rem 2rem;
  display: inline-flex;
  align-items: center;
  gap: 18px;
  border-radius: 5px;
}

.box-pink .flex .text {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.flex-th:after {
  content: "";
  width: 31.5%;
  display: block;
}

/* デフォルト：PC */
.p-class__contents .p-class__list .btn-sp { display: none; }

.info-school {
  margin-top: 3rem;
  line-height: 2;
}

/* スマホ */
@media (max-width: 767px) {
  .p-class__contents .p-class__list .btn-pc { display: none; }
  .p-class__contents .p-class__list .btn-sp { display: block; }
}

@media screen and (min-width: 768px) {
  .box-pink .flex .text img {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  
.sp-teacher .img {
  text-align: center;
}
.sp-teacher .img img {
  width: 100% !important;
}

.sp-teacher p span {
  font-size: 14px;
}
.sp-teacher h4 {
  margin-top: 20px;
}

.swiper-slide img {
  border: 0;
  border-radius: 0;
}

.th-slider .arrow-button {
  max-width: calc(100% - -45px) !important;
}

.arrow-button .swiper-button-prev, .arrow-button .swiper-button-next {
  border: 1px solid #6FC8BC;
}
  
.sp-none {
  display: none !important;
}

.shop-info-box .flex .img, .shop-info-box .flex .links {
  width: 100%;
}
.shop-info-box .flex .img {
  margin-bottom: 30px;
}
.c-title {
  padding: 0 20px;
}
.c-title span {
  font-size: 24px;
}
.headline-outline {
  font-size: 28px;
}
.cta-group .explain h3 {
  font-size: 22px;
}
ul.keypoint li {
  padding: 2.5rem 1rem 1rem 1rem;
}
ul.keypoint li .icon svg {
  left: 0;
  top: -56px;
}
ul.keypoint li .icon {
  width: 0;
}
ul.keypoint li .text {
  width: 100%;
}
ul.keypoint li .text h5 {
  font-size: 18px;
}
.class-btn{
  justify-content: center;
}
.shop-info {
  padding: 2rem 0;
}
.shop-info-box {
  margin-top: 2rem;
  font-size: 14px;
}
.mv-slider .arrow-button,
.th-slider .arrow-button {
  max-width: 100%;
}

.box-pink .flex {
  flex-direction: column;
}

.box-pink .flex .text, .box-pink .flex .img {
  width: 100%;
}

.box-pink .flex .text p {
  margin-bottom: 20px;
}

.box-pink {
  padding: 30px 15px;
}

.box-pink .flex .img {
  display: none;
}

.box-pink h4 {
  font-size: 26px;
}

}