@charset "UTF-8";
/*====================================
　早見表
  $conts-width-l $conts-width-m $conts-width-s
  $color-○○○○ 
  $font-color-black
  $font-family-gothic  $font-family-mincho
  @include(font-l) @include(font-m) @include(font-s)

  @include(full-width)
  @include(flex-column)  @include(flex-center)
  auto-px(min,max,最終可変幅)
====================================*/
/*====================================

/*----------------------------------
  Structure
----------------------------------
1. トップ
  1.1	メインイメージ
  1.2 トップナビ
2. 
3. 

====================================*/
/*----------------------------------
	0. 共有
------------------------------------*/
.fs-m {
  font-size: clamp(23px, 2.995vw, 28px);
  line-height: 2;
  letter-spacing: 0.34em;
}
@media screen and (max-width: 768px) {
  .fs-m {
    font-size: clamp(19px, 3.958vw, 23px);
  }
}
body#en .fs-m {
  font-size: clamp(22px, 2.865vw, 24px);
  line-height: 2.3;
  letter-spacing: 0.2em;
}
@media screen and (max-width: 768px) {
  body#en .fs-m {
    font-size: clamp(18px, 3.75vw, 22px);
  }
}
@media screen and (max-width: 420px) {
  body#en .fs-m {
    font-size: clamp(17px, 5.313vw, 18px);
    line-height: 2;
    letter-spacing: 0.15em;
  }
}

.fs-s {
  font-size: clamp(16px, 3.333vw, 18px);
  line-height: 2;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
  .fs-s {
    font-size: clamp(14px, 4.375vw, 16px);
  }
}
body#en .fs-s {
  font-size: clamp(16px, 2.083vw, 18px);
  line-height: 2.2;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
  body#en .fs-s {
    font-size: clamp(14px, 2.917vw, 16px);
  }
}
@media screen and (max-width: 420px) {
  body#en .fs-s {
    font-size: clamp(12px, 3.75vw, 14px);
    line-height: 2;
    letter-spacing: 0.05em;
  }
}

/*----------------------------------
	0. アニメーション
------------------------------------*/
.scroll-fade {
  -webkit-transform: translate3d(0, -10px, 0);
          transform: translate3d(0, -10px, 0);
  -webkit-transition: 1s;
  transition: 1s;
  opacity: 0;
}

.scroll-fade.animated {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  opacity: 1;
}

/*----------------------------------
	1. トップ
------------------------------------*/
.main-visual {
  text-align: center;
  background: url(../images/mainimg.jpg) repeat-x center center;
}
.main-visual img {
  aspect-ratio: 2/1;
  max-width: 100%;
  vertical-align: top;
}
@media screen and (max-width: 480px) {
  .main-visual img {
    aspect-ratio: 8/13;
  }
}

.top-cont01__list {
  text-align: center;
  position: relative;
}
.top-cont01__list img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
}
@media screen and (max-width: 768px) {
  .top-cont01__list img {
    width: clamp(170px, 35.417vw, 225px);
  }
}
.top-cont01__list ul {
  background-color: #fdf199;
  padding: 60px 40px 30px;
  margin: 90px auto 0;
  border-radius: 20px;
  max-width: 480px;
}
@media screen and (max-width: 768px) {
  .top-cont01__list ul {
    margin: clamp(60px, 12.5vw, 90px) auto 0;
  }
}
.top-cont01__list ul li {
  text-align: left;
  background: url(../images/icon-list01.svg) no-repeat left center;
  background-size: 0.7em;
  padding: 0.7em 0 0.7em 1.2em;
}

.top-cont02 img {
  max-width: 100%;
}
.top-cont02__img {
  text-align: center;
}
.top-cont02__text {
  text-align: center;
}
.top-cont02__text p {
  margin-bottom: 40px;
  text-align: left;
}

.top-blog ul li {
  border: solid 1px #b3b3b3;
  border-radius: 15px;
  overflow: hidden;
  position: relative;
  margin-bottom: 40px;
}
.top-blog ul li a {
  color: #000;
  text-decoration: none;
}
.top-blog ul li a:hover {
  opacity: 0.8;
}
@media screen and (max-width: 600px) {
  .top-blog ul li {
    width: 48%;
    margin-bottom: 20px;
  }
}
.top-blog .thumb img {
  max-width: 100%;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
.top-blog .day {
  font-size: clamp(14px, 1.823vw, 16px);
  padding: 20px 20px 10px;
}
.top-blog .ttl {
  font-size: clamp(16px, 2.083vw, 18px);
  padding: 0 20px 20px;
}
.top-blog .btn-more {
  position: absolute;
  width: clamp(60px, 7.813vw, 76px);
  aspect-ratio: 1/1;
  top: clamp(125px, 16.276vw, 170px);
  right: -10px;
}
@media screen and (max-width: 480px) {
  .top-blog .btn-more {
    width: clamp(60px, 18.75vw, 80px);
    top: clamp(160px, 50vw, 240px);
  }
}

.pg-ttl {
  background: url(../images/bg-pg-ttl.png) no-repeat center center rgba(255, 242, 31, 0.5);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: clamp(200px, 26.042vw, 240px);
  margin-bottom: clamp(40px, 5.208vw, 80px);
}
@media screen and (max-width: 768px) {
  .pg-ttl {
    background-size: 130%;
    min-height: clamp(130px, 27.083vw, 200px);
    margin-bottom: 0;
  }
}
.pg-ttl h2 {
  font-size: clamp(38px, 4.948vw, 44px);
}
@media screen and (max-width: 768px) {
  .pg-ttl h2 {
    font-size: clamp(25px, 5.208vw, 38px);
  }
}

.first-greeting p {
  line-height: 2;
  letter-spacing: 0.05;
  margin-bottom: 40px;
}
.first-greeting__name {
  text-align: right;
  font-size: clamp(18px, 2.344vw, 24px);
}

.flow-list {
  text-align: center;
}
.flow-list > img {
  max-width: clamp(110px, 14.323vw, 150px);
  margin: 50px 0 30px;
}
@media screen and (max-width: 768px) {
  .flow-list > img {
    max-width: clamp(90px, 18.75vw, 110px);
  }
}
.flow-list__box {
  text-align: left;
  border: solid 1px #000;
  background-color: #fff;
  padding: 1.5em 2em;
  border-radius: 20px;
  position: relative;
}
.flow-list__box::after {
  content: "";
  display: block;
  position: absolute;
  top: 15px;
  left: 10px;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: #fff21f;
  border: solid 1px #000;
  border-radius: 20px;
}
.flow-list__title {
  font-size: clamp(18px, 2.344vw, 24px);
  font-weight: bold;
}
.flow-list__text {
  font-size: clamp(14px, 1.823vw, 16px);
}

.curriculum-conts01 .column-box {
  margin-bottom: 30px;
}
.curriculum-conts01 .column-box__35 {
  text-align: center;
}
.curriculum-conts01 .column-box__35 img {
  max-width: 100%;
}
.curriculum-conts01 .column-box__2col {
  margin-bottom: 30px !important;
}

.time-table {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.time-table__row {
  width: 30%;
}
@media screen and (max-width: 768px) {
  .time-table__row {
    width: 48%;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 480px) {
  .time-table__row {
    width: 100%;
  }
}
.time-table__title {
  background-color: #fff21f;
  text-align: center;
  font-size: clamp(18px, 2.344vw, 20px);
  font-weight: bold;
  padding: 0.5em;
  border-radius: 40px 40px 0 0;
  border: solid 1px #b3b3b3;
}
.time-table__cell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border: solid 1px #b3b3b3;
  padding: 3% 4%;
}
.time-table__time {
  width: 46%;
}
.time-table__class {
  width: 46%;
}

.blog-single .back {
  margin-top: 40px;
}

.qa-list dd {
  margin-bottom: 40px;
}