@charset "UTF-8";
/* ベースのスタイル */

body {
  line-height: 1.75;
  color: #000;
}

a {
  color: #000;
  text-decoration: none;
}

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

ul {
  list-style: none;
}

li {
  list-style: none;
}

/* 部品*/

/* flexbox */
.flex {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 右矢印アイコン*/

i.bi.bi-arrow-right-short {
  color: #fff;
  font-size: 25px;
}

/* ヘッダー*/
.header {
  position: fixed;
  top: 8px;
  left: 7px;
  right: 7px;
  z-index: 1;
  display: flex;
  height: 66px;
  background-color: #0079f2;
  border-radius: 33px;
  justify-content: space-between;
}

@media (min-width: 768px) {
  .header {
    height: 80px;
    margin-top: 7px;
    border-radius: 40px;

  }
}

/* ロゴ */
.header-logo {
  display: flex;
  align-items: center;
  padding-left: 31px;
}

@media (min-width: 768px) {
  .header-logo {
    display: flex;
    justify-content: space-between;
  }
}

a.header-logo-link {
  padding-bottom: 25.5px;
}

@media (min-width: 768px) {
  a.header-logo-link {
    padding-left: 8px;
    padding-bottom: 16px;
  }
}

img[src$="images/header/header_logo.svg"] {
  width: 82.5%;
}

@media (min-width: 768px) {
  img[src$="images/header/header_logo.svg"] {
    width: 100%;
  }
}

/* ハンバーガーボタン */
.hamburger-button {
  font-size: 28px;
  display: flex;
  align-items: center;
  width: 58px;
  height: 61px;
}


i.bi.bi-list {
  color: #ffffff;
}

@media (min-width: 768px) {
  i.bi.bi-list {
    display: none;
  }
}

.hamburger-button i {
  line-height: 0;
}

@media (min-width: 768px) {
  .hamburger-button {
    display: none;
  }
}

@media (min-width: 768px) {
  nav.hamburger-menu.header-nav {
    white-space: nowrap;
  }
}

@media (min-width: 768px) {
  .header-nav-list-group {
    display: flex;
    font-size: 15px;
    font-weight: 700;
    margin-top: 25px;
    margin-right: 40px;
    column-gap: 37px;
  }
}


/* ハンバーガーメニュー、ヘッダーナビ */
@media (max-width: 767px) {
  .hamburger-menu {
    width: 96%;
    height: 523px;
    padding: 24px 47px;
    position: fixed;
    top: 86px;
    border-radius: 32px;
    background-color: #0079f2;
    transition: opacity .3s linear;
    opacity: 0;
    visibility: hidden;
  }
}


/* スライドイン後の位置の指定 */
.hamburger-menu-active {
  opacity: 1;
  visibility: visible;
}


/* ナビゲーション */
@media (max-width: 767px) {
  .hamburger-menu-list-group {
    display: grid;
    font-size: 18px;
    font-weight: 700;
    position: relative;
  }
}

@media (max-width: 767px) {
  .hamburger-menu-list-group a {
    display: flex;
    justify-content: space-around;
    padding-top: 31px;
    padding-bottom: 18px;
    line-height: 0px;
    color: #fff;
    margin-bottom: 9px;
  }
}

a {
  color: #fff;
  text-decoration: none;
}

a.button.button-pink-zero {
  display: block;
  font-size: 20px;
  font-weight: bold;
  background-color: #f11f8d;
  border-radius: 30px;
  width: 280px;
  height: 60px;
  line-height: 60px;
  letter-spacing: -0.04em;
  margin: 21px auto;
  padding-left: 73px;
  position: relative;
}

@media (min-width: 768px) {
  a.button.button-pink-zero {
    display: none;
  }
}

a.button.button-pink-zero:hover {
  background-color: #ffffff;
  color: #f11f8d;
  border: solid;
  border-color: #f11f8d;
  ;
  border-width: 2px;
}

i.zero-arrow.bi.bi-arrow-right-short {
  position: absolute;
  font-size: 27px;
  top: 1px;
  right: 15px;
}

a.button.button-pink-zero:hover i.zero-arrow.bi.bi-arrow-right-short {
  color: #f11f8d;
}

@media (min-width: 768px) {
  i.zero-arrow.bi.bi-arrow-right-short {
    display: none;
  }
}

ul.header-sns-list-group {
  display: flex;
  font-size: 33px;
  justify-content: center;
  column-gap: 39px;
  padding-top: 13px;
}

@media (min-width: 768px) {
  ul.header-sns-list-group {
    display: none;
  }
}

i.bi.bi-instagram {
  color: #fff;
}

i.bi.bi-youtube {
  color: #fff;
}

i.bi.bi-facebook {
  color: #fff;
}

i.bi.bi-twitter {
  color: #fff;
}


/* カバー */

.cover-slick-item img {
  width: 93%;
  margin-left: auto;
}

@media (min-width: 768px) {
  .cover-slick-item img {
    width: 100%;
    padding-left: 268px;
  }
}

/* カバーキャッチ１ */

.cover-catch-first {
  position: absolute;
  left: 7%;
  bottom: 2%;
}

@media (min-width: 768px) {
  .cover-catch-first {
    left: 9.3%;
    bottom: 16.3%;
  }
}

p.cover-catch-first-top {
  width: 208px;
  height: 54px;
  line-height: 50px;
  font-size: 24px;
  font-weight: 700;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  text-align: center;
  padding-right: 6px;
}

@media (min-width: 768px) {
  p.cover-catch-first-top {
    width: 360px;
    height: 87px;
    font-size: 44px;
    line-height: 83px;
    padding-left: 9px;
  }
}

span.carousel1-first {
  color: #f2a118;
}

span.carousel1-second {
  font-size: 20px;
}

@media (min-width: 768px) {
  span.carousel1-second {
    font-size: 38px;
  }
}

span.carousel1-third {
  color: #46c017;
}

span.carousel1-fourth {
  font-size: 20px;
  color: #46c017;
}

@media (min-width: 768px) {
  span.carousel1-fourth {
    font-size: 38px;
  }
}

p.cover-catch-first-bottom {
  width: 210px;
  height: 54px;
  line-height: 52px;
  font-family: 'Poppins';
  font-weight: 800;
  font-size: 20px;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  margin-top: 8px;
  text-align: center;
}

@media (min-width: 768px) {
  p.cover-catch-first-bottom {
    width: 367px;
    height: 88px;
    font-size: 36px;
    margin-top: 15px;
    line-height: 84px;
    letter-spacing: -0.4px;
    padding-left: 1px;
  }
}

span.carousel1-fifth {
  color: #f26618;
}

/* カバーキャッチ２ */

.cover-catch-second {
  position: absolute;
  left: 7%;
  bottom: 2%;
}

@media (min-width: 768px) {
  .cover-catch-second {
    left: 9.2%;
    bottom: 15.9%;
  }
}

p.cover-catch-second-top {
  width: 159px;
  height: 54px;
  font-size: 20px;
  line-height: 51px;
  padding-left: 16px;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
}

@media (min-width: 768px) {
  p.cover-catch-second-top {
    width: 274.9px;
    height: 87px;
    line-height: 82px;
    font-size: 36px;
    padding-left: 23px;
  }
}

span.carousel2-second {
  font-size: 24px;
  color: #f2a118;
}

@media (min-width: 768px) {
  span.carousel2-second {
    font-size: 44px;
  }
}

p.cover-catch-second-bottom {
  width: 231px;
  height: 54px;
  line-height: 51px;
  font-size: 24px;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  padding-left: 15px;
  margin-top: 8px;
}

@media (min-width: 768px) {
  p.cover-catch-second-bottom {
    width: 408px;
    height: 87px;
    margin-top: 16px;
    line-height: 82px;
    font-size: 44px;
    padding-left: 24px;
  }
}

span.carousel2-third {
  color: #46c017;
}

span.carousel2-fourth {
  color: black;
  font-size: 20px;
}

@media (min-width: 768px) {
  span.carousel2-fourth {
    font-size: 36px;
  }
}

/* カバーキャッチ３ */

.cover-catch-third {
  position: absolute;
  left: 7%;
  bottom: 2%;
}

@media (min-width: 768px) {
  .cover-catch-third {
    left: 9.2%;
    bottom: 15.9%;
  }
}

p.cover-catch-third-top {
  width: 180px;
  height: 54px;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  line-height: 50px;
  font-size: 24px;
  color: #f26618;
  padding-left: 14px;
}

@media (min-width: 768px) {
  p.cover-catch-third-top {
    width: 319.9px;
    height: 87px;
    line-height: 80px;
    font-size: 44px;
    padding-left: 24px;
  }
}

span.carousel3-second {
  font-size: 20px;
  color: #000000;
}

@media (min-width: 768px) {
  span.carousel3-second {
    font-size: 36px;
  }
}

p.cover-catch-third-bottom {
  width: 224px;
  height: 54px;
  color: #46c017;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  margin-top: 8px;
  line-height: 49px;
  font-size: 24px;
  padding-left: 14px;
}

@media (min-width: 768px) {
  p.cover-catch-third-bottom {
    width: 340px;
    height: 87px;
    line-height: 74px;
    margin-top: 16px;
    font-size: 36px;
    padding-left: 24px;
  }
}

span.carousel3-fourth {
  color: #f2a118;
}

/* カバーキャッチ４ */

.cover-catch-fourth {
  position: absolute;
  left: 7%;
  bottom: 2%;
}

@media (min-width: 768px) {
  .cover-catch-fourth {
    left: 9.2%;
    bottom: 15.9%;
  }
}

p.cover-catch-fourth-top {
  width: 165px;
  height: 54px;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  line-height: 50px;
  font-size: 24px;
  color: #f26618;
  padding-left: 15px;
}

@media (min-width: 768px) {
  p.cover-catch-fourth-top {
    width: 287.9px;
    height: 87px;
    font-size: 44px;
    line-height: 81px;
    padding-left: 24px;
  }
}

span.carousel4-second {
  color: #000000;
  font-size: 20px;
}

@media (min-width: 768px) {
  span.carousel4-second {
    font-size: 36px;
  }
}

p.cover-catch-fourth-bottom {
  width: 230px;
  height: 54px;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  line-height: 50px;
  margin-top: 8px;
  color: #46c017;
  font-size: 24px;
  padding-left: 15px;
}

@media (min-width: 768px) {
  p.cover-catch-fourth-bottom {
    width: 408px;
    height: 87px;
    margin-top: 16px;
    line-height: 80px;
    font-size: 44px;
    padding-left: 24px;
  }
}

span.carousel4-fourth {
  font-size: 20px;
  color: #000000;
}

@media (min-width: 768px) {
  span.carousel4-fourth {
    font-size: 36px;
  }
}

/* カバーキャッチ５ */

.cover-catch-fifth {
  position: absolute;
  left: 7%;
  bottom: 2%;
}

@media (min-width: 768px) {
  .cover-catch-fifth {
    left: 9.2%;
    bottom: 15.9%;
  }
}

p.cover-catch-fifth-top {
  width: 183px;
  height: 54px;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  line-height: 50.9px;
  font-size: 24px;
  color: #46c017;
  padding-left: 14.1px;
}

@media (min-width: 768px) {
  p.cover-catch-fifth-top {
    width: 321.9px;
    height: 88px;
    line-height: 81px;
    font-size: 44px;
    padding-left: 21px;
  }
}

span.carousel5-second {
  color: #000;
  font-size: 20px;
}

@media (min-width: 768px) {
  span.carousel5-second {
    font-size: 36px;
  }
}

p.cover-catch-fifth-bottom {
  width: 238px;
  height: 54px;
  background-color: #f2f8fe;
  opacity: 0.8;
  border-radius: 0 8px 8px 0;
  margin-top: 8px;
  color: #f26618;
  line-height: 50px;
  font-size: 24px;
  padding-left: 15px;
}

@media (min-width: 768px) {
  p.cover-catch-fifth-bottom {
    width: 424px;
    height: 88px;
    margin-top: 16px;
    font-size: 44px;
    line-height: 84px;
    padding-left: 24px;
  }
}

span.carousel5-fourth {
  font-size: 20px;
  color: #000000;
}

@media (min-width: 768px) {
  span.carousel5-fourth {
    font-size: 36px;
  }
}

/* カバータイトル */
.cover-title {
  display: table;
  margin-bottom: 1.25rem;
  font-size: 2.5625rem;
  color: #fff;
  line-height: 1;
  background-color: #ec6a00;
}

/* カバー説明 */
.cover-description {
  display: block;
  margin-top: 0.85rem;
  font-size: 1rem;
  line-height: 2;
}

/* Slick矢印 */
.slick-arrow {
  position: absolute;
  top: calc((100% - 60px) / 2);
  z-index: 1;
  cursor: pointer;
}

@media (min-width: 768px) {
  .slick-arrow {
    top: calc((100% - 24px) / 2);
  }
}

.prev-arrow {
  left: 1.25rem;
}

.next-arrow {
  right: 1.25rem;
}

/* Slickドット */
.slick-dotted.slick-slider {
  margin-bottom: 0;
  position: relative;
}

.slick-dots {
  position: absolute;
  display: flex;
  justify-content: center;
  column-gap: 20px;
}

@media (min-width: 768px) {
  .slick-dots {
    justify-content: right;
    right: 2.2%;
    top: 103%;
  }
}

.slick-dots li {
  width: 0.625rem;
  height: 0.625rem;
  margin: 0;
}

.slick-dots li button {
  width: 0.625rem;
  height: 0.625rem;
  padding: 0;
  border: 0.0625rem solid #fff;
  border-radius: 50%;
}

.slick-dots li button::before {
  width: 0.625rem;
  height: 0.625rem;
  line-height: 12px;
  border-radius: 50%;
  font-size: 8px;
}

.slick-dots li button:hover::before,
.slick-dots li.slick-active button::before {
  color: #000;
  background-color: #bfbfbf;
  opacity: 1;
}


/* アンダーカバー */

.under-cover {
  padding-top: 54px;
  text-align: center;
  line-height: 32px;
}

@media (min-width: 768px) {
  .under-cover {
    font-size: 30px;
    padding-top: 58px;
    color: #333333;
  }
}

.under-cover-text {
  font-size: 18px;
  font-weight: 400;
  padding-bottom: 18px;
}

@media (min-width: 768px) {
  .under-cover-text {
    font-size: 30px;
    line-height: 51px;
    padding-bottom: 27px;
  }
}

a.button.button-pink-first {
  display: block;
  font-size: 20px;
  font-weight: 700;
  background-color: #f11f8d;
  border-radius: 30px;
  width: 280px;
  height: 60px;
  line-height: 55px;
  margin: auto;
  position: relative;
}

a.button.button-pink-first:hover {
  background-color: #ffffff;
  color: #f11f8d;
  border: solid;
  border-color: #f11f8d;;
  border-width: 2px;
}

@media (min-width: 768px) {
  a.button.button-pink-first {
    display: block;
    font-size: 20px;
    background-color: #f11f8d;
    border-radius: 30px;
    width: 318px;
    height: 60px;
    position: relative;
  }
}

i.first-arrow.bi.bi-arrow-right-short {
  position: absolute;
  right: 17px;
  top: 1px;
}

a.button.button-pink-first:hover i.first-arrow.bi.bi-arrow-right-short {
  color: #f11f8d;
}

/* キャンペーン*/

.campaign {
  width: auto;
  height: 322px;
  margin-top: 40px;
  padding-top: 32px;
  padding-left: 18px;
  padding-right: 18px;
  padding-bottom: 2rem;
  background-color: #f2f8fe;
}

@media (min-width: 980px) {
  .campaign {
    height: 316px;
    margin-top: 70px;
    padding-top: 4px;
    padding-left: 1.1rem;
    padding-bottom: 3.4rem;
  }
}

@media (min-width: 980px) {
  .campaign-all {
    display: flex;
    justify-content: center;
    column-gap: 58px;
  }
}

.over-campaign {
  display: flex;
  justify-content: center;
  white-space: nowrap;
  line-height: 20px;
  column-gap: 13px;
  padding-left: 6px;
}

@media (min-width: 980px) {
  .over-campaign {
    display: flex;
    white-space: nowrap;
    padding-top: 4rem;
    padding-left: 43px;
    column-gap: 0px;
  }
}

.campaign-first {
  display: flex;
  text-align: center;
  height: 100px;
  padding-right: 3px;
}

@media (min-width: 980px) {
  .campaign-first {
    height: auto;
    padding-right: 7px;
  }
}


img[src$="images/campaign/frame_left.png"] {
  height: 113%;
  ;
}

@media (min-width: 980px) {
  img[src$="images/campaign/frame_left.png"] {
    height: 93%;
    ;
  }
}

p.frame_left {
  height: 100px;
  font-weight: 700;
}

span.century {
  display: block;
  font-size: 13px;
  color: #555555;
  letter-spacing: -0.1em;
  line-height: 22px;
}

@media (min-width: 980px) {
  span.century {
    font-size: 16px;
  }
}

span.online {
  display: block;
  font-size: 13px;
  color: #333333;
}

@media (min-width: 980px) {
  span.online {
    font-size: 20px;
    line-height: 42.9px;
  }
}

span.ranking {
  display: block;
  font-size: 13px;
  color: #333333;
  line-height: 25px;
}

@media (min-width: 980px) {
  span.ranking {
    font-size: 20px;
    line-height: 23px;
  }
}

span.number-first {
  font-size: 32px;
  font-family: 'Poppins';
  font-weight: 800;
  color: #f26618;
  font-style: italic;
  line-height: 44px;
}

@media (min-width: 980px) {
  span.number-first {
    font-size: 40px;
    line-height: 86px;
  }
}

span.one-first {
  font-size: 40px;
  font-family: 'Poppins';
  font-weight: 800;
  color: #f26618;
  font-style: italic;
}

@media (min-width: 980px) {
  span.one-first {
    font-size: 60px;
  }
}

span.coution {
  font-size: 10px;
  color: #666666;
}

@media (min-width: 980px) {
  span.coution {
    font-size: 12px;
  }
}

.campaign-second {
  display: flex;
  text-align: center;
  height: 100px;
  padding-right: 6px;
}

@media (min-width: 980px) {
  .campaign-second {
    height: auto;
    padding-left: 7px;
    padding-right: 0px;
  }
}

img[src$="images/campaign/frame_right.png"] {
  height: 113%;
  ;
}

@media (min-width: 980px) {
  img[src$="images/campaign/frame_right.png"] {
    height: 93%;
    ;
  }
}

p.frame_right {
  font-weight: 700;
}

span.number-second {
  font-size: 32px;
  font-family: 'Poppins';
  font-weight: 800;
  color: #f2a118;
  font-style: italic;
  line-height: 44px;
}

@media (min-width: 980px) {
  span.number-second {
    font-size: 40px;
    line-height: 86px;
    padding-left: 4px;
  }
}

span.one-second {
  font-size: 40px;
  font-family: 'Poppins';
  font-weight: 800;
  color: #f2a118;
  font-style: italic;
}

@media (min-width: 980px) {
  span.one-second {
    font-size: 60px;
  }
}

.supplement {
  font-size: 12px;
  color: #666666;
  text-align: start;
  white-space: nowrap;
  padding-top: 20px;
  padding-left: 25px;
}

@media (min-width: 980px) {
  .supplement {
    text-align: start;
    padding-top: 0px;
    padding-left: 42px;
  }
}

/* アンダーキャンペーン */

.under-campaign {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  color: #f11f8d;
  padding-top: 12px;
  padding-right: 2px;
}

@media (min-width: 980px) {
  .under-campaign {
    padding-right: 43px;
    font-size: 24px;
  }
}

.under-title {
  height: 45px;
  padding-left: 3px;
}

@media (min-width: 980px) {
  .under-title {
    margin-top: 48px;
    padding-left: 5px;
    margin-bottom: 8px;
  }
}


.under-title:before {
  top: 50%;
  left: 0;
  transform: translateY(-50%) rotate(-30deg);
}

.under-title:after {
  top: 50%;
  right: 0;
  transform: translateY(-50%) rotate(30deg);
}


.under-title:before,
.under-title:after {
  position: relative;
  display: inline-block;
  content: "";
  background: #f11f8d;
  width: 2px;
  height: 30px;
  margin-left: 1rem;
  margin-right: 1rem;
}

@media (min-width: 980px) {

  .under-title:before,
  .under-title:after {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    margin-bottom: 3px;
  }
}


a.button.button-pink-second {
  position: relative;
  display: block;
  line-height: 49px;
  margin: auto;
  padding-left: 1px;
  width: 318px;
  height: 60px;
  font-size: 20px;
  border-radius: 30px;
  color: #f11f8d;
  border: solid;
  border-width: 2px;
}

a.button.button-pink-second:hover {
  background-color: #f11f8d;
  color: #ffffff;
  border: solid;
  border-color: #f11f8d;
  ;
  border-width: 2px;
}


@media (min-width: 980px) {
  a.button.button-pink-second {
    width: 349px;
    height: 76px;
    font-size: 23px;
    border-radius: 38px;
    line-height: 70px;
    margin-left: 5px;
    padding-left: 0px;
    padding-right: 5px;
  }
}

i.second-arrow.bi.bi-arrow-right-short {
  color: #f11f8d;
  font-size: 31px;
  position: absolute;
  top: 1px;
  right: 8px;
}

a.button.button-pink-second:hover i.second-arrow.bi.bi-arrow-right-short {
  color: #ffffff;
}

@media (min-width: 980px) {
  i.second-arrow.bi.bi-arrow-right-short {
    top: 0px;
    right: 15px;
  }
}

/* コース */

section.course {
  margin-top: 70px;
  padding-left: 16px;
  padding-right: 16px;
}

@media (min-width: 768px) {
  section.course {
    margin-top: 69px;
  }
}

.course-container {
  text-align: center;
  max-width: 1080px;
  margin: auto;
  padding-bottom: 79px;
}

@media (min-width: 768px) {
  .course-container {
    padding-bottom: 0;
  }
}

h2.section-title-course {
  font-weight: 700;
  padding-bottom: 2.5rem;
  display: inline-block;
  position: relative;
}

@media (min-width: 768px) {
  h2.section-title-course {
    font-size: 36px;
    padding-top: 25px;
    padding-bottom: 53px;
  }
}

h2.section-title-course::after {
  content: '';
  position: absolute;
  top: 48px;
  right: 47px;
  width: 24px;
  height: 2px;
  background-color: #0079f2
}

@media (min-width: 768px) {
  h2.section-title-course::after {
    width: 36px;
    top: 102px;
    right: 71px
  }
}


/* タブ */

.st-theme-basic {
  border: none;
}

/* タブナビゲーション */

.tab.st>.nav {
  font-size: 18px;
  font-weight: 700;
  column-gap: 10px;
  flex-direction: row !important;
  width: auto;
  height: 65px;
}

@media (min-width: 768px) {
  .tab.st>.nav {
    font-size: 26px;
    height: 80px;
    column-gap: 24px;
    margin-left: 1px;
  }
}

.tab.st-theme-basic>.nav {
  box-shadow: none;
}

.tab.st-theme-basic>.nav .nav-link {
  padding-top: 1.8rem;
  background-color: #f0f0f0;
  color: #333333;
  border-radius: 8px 8px 0 0;
  line-height: 6px;
  width: auto;
}

@media (min-width: 768px) {
  .tab.st-theme-basic>.nav .nav-link {
    line-height: 16px;
    height: 80px;
  }
}


/* アクティブ状態 */
.tab.st-theme-basic>.nav .nav-link.active {
  color: #fff !important;
  background-color: #f2a118;
  border-radius: 8px 8px 0 0;
  width: auto;
}

@media (min-width: 768px) {
  .tab.st-theme-basic>.nav .nav-link.active {
    line-height: 16px;
    height: 80px;
  }
}

.tab.st-theme-basic>.nav .nav-link.active::after {
  background-color: unset !important;
}

/* タブコンテンツ */
.tab-content {
  text-align: center;
  background-color: #ffedcc;
  border: solid;
  border-radius: 0 0 8px 8px;
  border-width: 16px;
  color: transparent;
  width: auto;
  min-height: 931px;
  box-sizing: border-box;
  height: auto !important;
}

@media (min-width: 768px) {
  .tab-content {
    border-width: 24px;
    min-height: 388px;
  }
}

.tab.st-theme-basic>.tab-content>.tab-pane {
  flex-direction: column;
  row-gap: 30px;
  padding-top: 25px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 19px;
  height: auto;
  border-radius: 8px;
  background-color: #ffffff;
}

@media (min-width: 768px) {
  .tab.st-theme-basic>.tab-content>.tab-pane {
    flex-direction: row;
    padding-top: 27px;
    padding-left: 24px;
    column-gap: 25px;
    height: 340px;
  }
}

.course-tab-content-item {
  box-sizing: border-box;
}

.course-tab-content-title {
  font-size: 20px;
  font-weight: 400;
  color: #333333;
  padding-top: 1px;
  line-height: 28px;
}

@media (min-width: 768px) {
  .course-tab-content-title {
    font-size: 24px;
    font-weight: 700;
    padding-top: 9px;
  }
}

span.course-age {
  display: block;
  font-size: 16px;
}

@media (min-width: 768px) {
  span.course-age {
    font-size: 18px;
  }
}

/* アンダーコース */
.under-course {
  width: auto;
  height: 191px;
  padding-top: 79px;
  padding-top: 1.6rem;
  padding-bottom: 1.9rem;
  background-color: #f2f8fe;
}

@media (min-width: 768px) {
  .under-course {
    font-size: 20px;
    margin-top: 96px;
    padding-top: 31px;
    height: 221px;
  }
}

.under-course-text {
  width: 310px;
  margin: 0 auto;
  color: #333333;
  padding-bottom: 1.2rem;
}

@media (min-width: 768px) {
  .under-course-text {
    width: 380px;
    padding-bottom: 21px;
  }
}

a.button.button-pink-third {
  display: block;
  font-size: 20px;
  font-weight: 700;
  background-color: #f11f8d;
  border-radius: 30px;
  width: 280px;
  height: 60px;
  text-align: center;
  line-height: 56px;
  margin: auto;
  position: relative;
}

a.button.button-pink-third:hover {
  background-color: #ffffff;
  color: #f11f8d;
  border: solid;
  border-color: #f11f8d;
  ;
  border-width: 2px;
}

@media (min-width: 768px) {
  a.button.button-pink-third {
    width: 318px;
    line-height: 54px;
  }
}

i.third-arrow.bi.bi-arrow-right-short {
  color: #fff;
  position: absolute;
  top: 2px;
  right: 19px;
}

a.button.button-pink-third:hover i.third-arrow.bi.bi-arrow-right-short {
  color: #f11f8d;
}

@media (min-width: 768px) {
  i.third-arrow.bi.bi-arrow-right-short {
    top: 1px;
    right: 18px;
  }
}

/* ポイント*/

section.point {
  margin-top: 69px;
  padding-left: 16px;
  padding-right: 16px;
}

@media (min-width: 768px) {
  section.point {
    margin-top: 68px;
    text-align: center;
  }
}

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

@media (min-width: 980px) {
  .point-top {
    width: 68.7%;
    margin: 0 auto;
  }
}

h2.section-title-feature {
  display: block;
  padding-bottom: 41px;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
  letter-spacing: -0.05em;
  display: inline-block;
  position: relative;
}

@media (min-width: 768px) {
  h2.section-title-feature {
    font-size: 36px;
    padding-top: 2rem;
  }
}

span.section-subtitle-feature {
  display: block;
}

h2.section-title-feature::after {
  content: '';
  position: absolute;
  top: 5.7rem;
  right: 4.6rem;
  width: 24px;
  height: 2px;
  background-color: #0079f2;
}

@media (min-width: 768px) {
  h2.section-title-feature::after {
    top: 170px;
    left: 113px;
    width: 36px;
  }
}

.point-main {
  text-align: start;
}

@media (min-width: 768px) {
  .point-tab-first {
    display: flex;
    flex-direction: row-reverse;
    padding-top: 11px;
  }
}

img.fade-image.animate__animated.animate__fadeInLeft {
  width: 100%;
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  img.fade-image.animate__animated.animate__fadeInLeft {
    width: 48%;
    height: 100%;
    padding-right: 0px;
  }
}


img[src$="images/point/point_1.png"] {

  opacity: 0;
}

.point-subtitle-first {
  font-style: italic;
  font-size: 60px;
  font-family: 'Poppins';
  font-weight: bold;
  color: #46c017;
  line-height: 59px;
}

@media (min-width: 768px) {
  .point-subtitle-first {
    font-size: 80px;
    padding-top: 112px;
    padding-left: 0px;
  }
}

.point-content-first {
  margin-bottom: 2.1rem;
  font-size: 18px;
  letter-spacing: -0.02em;
  color: #333333;
  font-weight: 700;
}

@media (min-width: 768px) {
  .point-content-first {
    font-size: 24px;
    letter-spacing: -0.03em;
    padding-left: 2px;
    padding-right: 32px;
    margin-top: 12px;
  }
}

@media (min-width: 768px) {
  .point-tab-second {
    display: flex;
    margin-top: 31px;
  }
}

img.fade-image.animate__animated.animate__fadeInRight {
  width: 100%;
  padding-bottom: 10px;
}

@media (min-width: 768px) {
  img.fade-image.animate__animated.animate__fadeInRight {
    width: 48%;
    height: 100%;
    margin-left: 0px;
  }
}

img[src$="images/point/point_2.png"] {

  opacity: 0;
}

.point-subtitle-second {
  font-style: italic;
  font-size: 60px;
  font-family: 'Poppins';
  font-weight: bold;
  color: #46c017;
  line-height: 61px;
}

@media (min-width: 768px) {
  .point-subtitle-second {
    font-size: 80px;
    padding-top: 111px;
    padding-left: 49px;
  }
}

.point-content-second {
  margin-bottom: 35px;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: #333333;
  font-weight: 700;
}

@media (min-width: 768px) {
  .point-content-second {
    font-size: 24px;
    letter-spacing: -0.03em;
    padding-left: 50px;
    padding-right: 3px;
    margin-top: 14px;
  }
}

@media (min-width: 768px) {
  .point-tab-third {
    display: flex;
    flex-direction: row-reverse;
    margin-top: 35px;
  }
}

img[src$="images/point/point_3.png"] {

  opacity: 0;
}

.point-subtitle-third {
  font-style: italic;
  font-size: 60px;
  font-family: 'Poppins';
  font-weight: bold;
  color: #46c017;
  line-height: 58px;
}

@media (min-width: 768px) {
  .point-subtitle-third {
    font-size: 80px;
    padding-top: 111px;
    padding-left: 0px;
  }
}

.point-content-third {
  margin-bottom: 2.5rem;
  font-size: 18px;
  letter-spacing: -0.03em;
  color: #333333;
  font-weight: 700;
}

@media (min-width: 768px) {
  .point-content-third {
    font-size: 24px;
    padding-right: 32px;
    margin-top: 17px;

  }
}

.under-point {
  width: auto;
  height: 191px;
  background-color: #f2f8fe;
  text-align: center;
  margin-top: 74px;
  padding-top: 1.4rem;
  padding-bottom: 2rem;
}

@media (min-width: 768px) {
  .under-point {
    height: 221px;
    margin-top: 81px;
    padding-top: 19px;
  }
}

.under-point-text {
  width: 305px;
  margin: 0 auto;
  color: #333333;
  padding-bottom: 19px;
}

@media (min-width: 768px) {
  .under-point-text {
    width: 380px;
    font-size: 20px;
    padding-top: 12px;
    padding-bottom: 21px;
  }
}


a.button.button-pink-fourth {
  display: block;
  font-size: 20px;
  font-weight: 700;
  background-color: #f11f8d;
  border-radius: 30px;
  width: 280px;
  height: 60px;
  text-align: center;
  line-height: 55px;
  margin: auto;
  position: relative;
}

a.button.button-pink-fourth:hover {
  background-color: #ffffff;
  color: #f11f8d;
  border: solid;
  border-color: #f11f8d;
  ;
  border-width: 2px;
}

@media (min-width: 768px) {
  a.button.button-pink-fourth {
    width: 318px;
    line-height: 58px;
  }
}

i.fourth-arrow.bi.bi-arrow-right-short {
  color: #fff;
  position: absolute;
  top: 2px;
  right: 18px
}

a.button.button-pink-fourth:hover i.fourth-arrow.bi.bi-arrow-right-short {
  color: #f11f8d;
}

/* イントロダクション */

section.introduction {
  margin-top: 72px;
  text-align: center;
  padding-left: 20px;
  padding-right: 20px;
}

@media (min-width: 768px) {
  section.introduction {
    margin-top: 63px;
  }
}

h2.introduction-title {
  display: inline-block;
  position: relative;
  font-weight: 700;
}

@media (min-width: 768px) {
  h2.introduction-title {
    font-size: 36px;
    padding-top: 34px;
    padding-bottom: 4px;
  }
}

h2.introduction-title::after {
  content: '';
  position: absolute;
  top: 3.1rem;
  right: 2.3rem;
  width: 24px;
  height: 2px;
  background-color: #0079f2;
}

@media (min-width: 768px) {
  h2.introduction-title::after {
    width: 36px;
    top: 110px;
    right: 55px;
  }
}

.introduction-all {
  width: 310px;
  margin: auto;
}

@media (min-width: 768px) {
  .introduction-all {
    display: flex;
    justify-content: center;
    padding-top: 12px;
    column-gap: 30px;
  }
}

.introduction-top {
  background-color: #ffeee5;
  width: 310px;
  height: 372px;
  border-radius: 8px;
  text-align: start;
  margin-top: 2.5rem;
  padding-top: 1rem;
}

@media (min-width: 768px) {
  .introduction-top {
    width: 360px;
    height: 394px;
    width: 360px;
    height: 394px;
    margin-left: 0;
    margin-right: 0;
    padding-top: 24px;
  }
}

.introduction-top-img {
  text-align: center;
  padding-bottom: 0.5rem;
}

@media (min-width: 768px) {
  .introduction-top-img {
    padding-bottom: 13px;
  }
}

img[src$="images/introduction/introduction_1.png"] {
  border-radius: 100%;
  width: 42%;
}

@media (min-width: 768px) {
  img[src$="images/introduction/introduction_1.png"] {
    width: 35%;
  }
}

.introduction-profile-top {
  margin-bottom: 0.5rem;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: #333333;
  line-height: 30px;
  padding-right: 4px;
  letter-spacing: -0.03em;
}

@media (min-width: 768px) {
  .introduction-profile-top {
    line-height: 29px;
    margin-bottom: 14px;
  }
}

span.career {
  display: block;
  font-size: 14px;
  padding-top: 2px;
  padding-left: 4px;
}

@media (min-width: 768px) {
  span.career {
    padding-left: 4px;
  }
}

.introduction-top-text {
  width: 278px;
  height: 131px;
  font-size: 16px;
  color: #333333;
  line-height: 28px;
  background-color: white;
  border-radius: 8px;
  margin-top: 9.6px;
  padding-top: 9px;
  margin-left: 1rem;
  padding-left: 1rem;
  margin-right: 1rem;
  padding-right: 1rem;
  padding-bottom: 123px;
}

@media (min-width: 768px) {
  .introduction-top-text {
    width: 312px;
    height: 131px;
    margin-top: 13px;
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    padding-bottom: 0.6rem;
  }
}

.introduction-bottom {
  background-color: #fff6e5;
  width: 310px;
  height: 373px;
  border-radius: 8px;
  margin-top: 25px;
  padding-top: 13px;
}

@media (min-width: 768px) {
  .introduction-bottom {
    width: 360px;
    height: 394px;
    margin-top: 39px;
    margin-left: 0rem;
    padding-top: 10px;
  }
}

.introduction-bottom-img {
  margin-bottom: 0.5rem;
}

@media (min-width: 768px) {
  .introduction-bottom-img {
    padding-top: 0.9rem;
    padding-bottom: 5px;
  }
}

img[src$="images/introduction/introduction_2.png"] {
  border-radius: 100%;
  width: 43%;
}

@media (min-width: 768px) {
  img[src$="images/introduction/introduction_2.png"] {
    width: 35%;
  }
}

.introduction-profile-bottom {
  margin-bottom: 0.5rem;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: #333333;
  line-height: 30px;
  padding-right: 4px;
  letter-spacing: -0.02em;
}

@media (min-width: 768px) {
  .introduction-profile-bottom {
    line-height: 28px;
    padding-right: 0;
  }
}

.introduction-bottom-text {
  width: 278px;
  height: 131px;
  text-align: start;
  color: #333333;
  background-color: white;
  border-radius: 8px;
  margin-top: 12px;
  padding-top: 0.5rem;
  margin-left: 1rem;
  padding-left: 1rem;
  margin-right: 1rem;
  padding-right: 1rem;
  padding-bottom: 0.5rem;
}

@media (min-width: 768px) {
  .introduction-bottom-text {
    width: 312px;
    height: 103px;
    margin-top: 17px;
    margin-left: 26.5px;
    margin-right: 1.4rem;
    padding-bottom: 0.6rem;
  }
}

/* アンダーイントロダクション */

.under-introduction {
  width: auto;
  height: 191px;
  background-color: #f2f8fe;
  margin-top: 81px;
  padding-top: 23px;
  padding-bottom: 31px;
}

@media (min-width: 768px) {
  .under-introduction {
    width: auto;
    height: 221px;
    margin-top: 5.7rem;
    padding-bottom: 2.5rem;
  }
}

.under-introduction-text {
  color: #333333;
  text-align: center;
  width: 308px;
  margin: 0 auto;
  padding-bottom: 20px;
}

@media (min-width: 768px) {
  .under-introduction-text {
    width: 380px;
    font-size: 20px;
    padding-top: 8px;
  }
}

a.button.button-pink-fifth {
  display: block;
  font-size: 20px;
  font-weight: 700;
  background-color: #f11f8d;
  border-radius: 30px;
  width: 280px;
  height: 60px;
  text-align: center;
  line-height: 56px;
  margin: auto;
  position: relative;
}

a.button.button-pink-fifth:hover {
  background-color: #ffffff;
  color: #f11f8d;
  border: solid;
  border-color: #f11f8d;
  ;
  border-width: 2px;
}

@media (min-width: 768px) {
  a.button.button-pink-fifth {
    width: 318px;
  }
}

i.fifth-arrow.bi.bi-arrow-right-short {
  position: absolute;
  right: 18px;
  bottom: 3px;
}

a.button.button-pink-fifth:hover i.fifth-arrow.bi.bi-arrow-right-short {
  color: #f11f8d;
}

/* プラン */

section.plan {
  margin-top: 67px;
  padding-left: 10px;
  padding-right: 10px;
  text-align: center;
}

@media (min-width: 768px) {
  section.plan {
    margin-top: 6rem;
  }
}

h2.plan-title {
  font-weight: 700;
  padding-bottom: 31px;
  display: inline-block;
  position: relative;
}

@media (min-width: 768px) {
  h2.plan-title {
    font-size: 36px;
    padding-bottom: 34px;
  }
}

h2.plan-title::after {
  content: '';
  position: absolute;
  top: 3.2rem;
  right: 3rem;
  width: 24px;
  height: 2px;
  background-color: #0079f2;
}

@media (min-width: 768px) {
  h2.plan-title::after {
    right: 4.5rem;
    top: 4.7rem;
    width: 36px;
  }
}

.plan-container {
  max-width: 358px;
  margin: auto;
}

@media (min-width: 768px) {
  .plan-container {
    max-width: 752px;
  }
}

h3.plan-top-subtitle {
  text-align: start;
  font-size: 20px;
  font-weight: 100;
  padding-bottom: 11px;
}

@media (min-width: 768px) {
  h3.plan-top-subtitle {
    font-size: 25px;
    padding-top: 0.6rem;
    padding-bottom: 9px;
  }
}

table.top {
  border: 1px solid #dddddd;
  width: 358px;
  height: 314px;
  background-color: #dddddd;
  margin: 0 auto;
}

@media (min-width: 768px) {
  table.top {
    width: 752px;
    height: 342px;
  }
}

tr {
  background-color: #ffffff;
}

th {
  background-color: #f5f5f5;
}


th.plan-heading-first {
  width: 113px;
  height: 46px;
}

@media (min-width: 768px) {
  th.plan-heading-first {
    font-size: 18px;
    width: 237px;
    height: 43px;
  }
}

th.plan-heading-second {
  padding-bottom: 4px;
}

@media (min-width: 768px) {
  th.plan-heading-second {
    font-size: 18px;
    width: 510px;
    padding-bottom: 2px;
  }
}

td.course-first-top {
  color: #0079f2;
  padding-bottom: 3px;
}

@media (min-width: 768px) {
  td.course-first-top {
    font-size: 18px;
    padding-bottom: 0;
  }
}

td.first-text-top {
  font-size: 14px;
  line-height: 1;
  padding-bottom: 11px;
  height: 86px;
}

@media (min-width: 768px) {
  td.first-text-top {
    font-size: 16px;
    padding-bottom: 0px;
  }
}


p.first-text-top {
  line-height: 45px;
}

@media (min-width: 768px) {
  p.first-text-top {
    padding-bottom: 13px;
    line-height: 16px;
  }
}

span.plan-prace {
  font-size: 32px;
  font-family: 'Poppins';
  font-weight: bold;
  color: #46c017;
}

@media (min-width: 768px) {
  span.plan-prace {
    font-size: 36px;
  }
}

span.plan-en {
  font-size: 14px;
  font-weight: 100;
  color: #b8e3ae;
}

@media (min-width: 768px) {
  span.plan-en {
    font-size: 16px;
  }
}

td.course-first-center {
  color: #0079f2;
  padding-bottom: 4px;
}

@media (min-width: 768px) {
  td.course-first-center {
    font-size: 18px;
    padding-bottom: 0;
  }
}

td.first-text-center {
  font-size: 14px;
  line-height: 1;
  height: 86px;
  padding-bottom: 12px;
}

@media (min-width: 768px) {
  td.first-text-center {
    font-size: 16px;
    padding-bottom: 1px;
  }
}

p.first-text-center {
  line-height: 40px;
}

@media (min-width: 768px) {
  p.first-text-center {
    padding-bottom: 14px;
    line-height: 16px;
  }
}

td.course-first-bottom {
  color: #0079f2;
  padding-bottom: 2px;
}

@media (min-width: 768px) {
  td.course-first-bottom {
    font-size: 18px;
    padding-bottom: 0;
  }
}

td.first-text-bottom {
  font-size: 14px;
  line-height: 1;
  height: 84px;
  padding-bottom: 9px;
}

@media (min-width: 768px) {
  td.first-text-bottom {
    font-size: 16px;
    padding-bottom: 0px;
  }
}

p.first-text-bottom {
  line-height: 39px;
}

@media (min-width: 768px) {
  p.first-text-bottom {
    padding-bottom: 12px;
    line-height: 19px;
  }
}

.plan-top-supplement {
  font-size: 12px;
  padding-top: 3px;
  text-align: center;
}

@media (min-width: 768px) {
  .plan-top-supplement {
    padding-top: 4px;
    text-align: justify;
  }
}

h3.plan-bottom-subtitle {
  font-size: 20px;
  font-weight: 100;
  text-align: start;
  padding-top: 49px;
  padding-bottom: 10px;
}

@media (min-width: 768px) {
  h3.plan-bottom-subtitle {
    font-size: 25px;
    padding-top: 30px;
    padding-bottom: 6px;
  }
}

table.bottom {
  border: 1px solid #dddddd;
  width: 358px;
  height: 369px;
  background-color: #dddddd;
  margin: 0 auto;
}

@media (min-width: 768px) {
  table.bottom {
    width: 752px;
    height: 342px;
  }
}

th.plan-heading-third {
  width: 131px;
  height: 47px;
}

@media (min-width: 768px) {
  th.plan-heading-third {
    padding-left: 4px;
    padding-bottom: 1px;
    width: 235px;
    font-size: 18px;
  }
}

th.heading-fourth {
  width: 224px;
  height: 44px;
  padding-left: 1px;
}

@media (min-width: 768px) {
  th.heading-fourth {
    width: 510px;
    font-size: 18px;
    padding-top: 0px;
    padding-bottom: 2px;
  }
}

td.course-second-top {
  color: #0079f2;
  padding-bottom: 3px;
}

@media (min-width: 768px) {
  td.course-second-top {
    font-size: 18px;
  }
}

td.second-text-top {
  font-size: 14px;
  height: 112px;
  line-height: 1;
  padding-left: 5px;
  padding-right: 4px;
  padding-bottom: 18px;
  padding-top: 4px;
}

@media (min-width: 768px) {
  td.second-text-top {
    font-size: 16px;
    height: 95px;
    padding-top: 0;
  }
}

p.second-text-top {
  line-height: 26px;
  margin-bottom: 18px;
}

@media (min-width: 768px) {
  p.second-text-top {
    line-height: 30px;
    margin-bottom: 21px;
  }
}

p.bottom-prace-top {
  line-height: 7px;
}

td.course-second-center {
  color: #0079f2;
  padding-bottom: 4px;
}

@media (min-width: 768px) {
  td.course-second-center {
    font-size: 18px;
    padding-top: 3px;
  }
}

td.second-text-center {
  font-size: 14px;
  height: 89px;
  line-height: 1;
}

@media (min-width: 768px) {
  td.second-text-center {
    font-size: 16px;
    height: 94px;
    padding-top: 3px;
  }
}

p.second-text-center {
  padding-bottom: 16px;
  line-height: 11px;
}

td.course-second-bottom {
  color: #0079f2;
  padding-bottom: 3px;
}

@media (min-width: 768px) {
  td.course-second-bottom {
    font-size: 18px;
    padding-top: 4px;
  }
}

td.second-text-bottom {
  height: 109px;
  font-size: 14px;
  padding-left: 9px;
  padding-right: 10px;
  padding-bottom: 11px;
  line-height: 1;
}

@media (min-width: 768px) {
  td.second-text-bottom {
    font-size: 16px;
    height: 93px;
    padding-right: 5px;
  }
}

p.second-text-bottom {
  line-height: 23px;
  margin-bottom: 26px;
}

@media (min-width: 768px) {
  p.second-text-bottom {
    margin-right: 4px;
    margin-bottom: 29px;
  }
}

p.bottom-prace-bottom {
  line-height: 0;
}

.plan-bottom-supplement {
  font-size: 12px;
  padding-top: 3px;
}

@media (min-width: 768px) {
  .plan-bottom-supplement {
    padding-top: 2px;
    text-align: justify;
  }
}

/* アンダープラン */

.under-plan {
  background-color: #f2f8fe;
  width: auto;
  margin-top: 4.8rem;
  padding-top: 1.5rem;
  padding-bottom: 2rem;
}

@media (min-width: 768px) {
  .under-plan {
    height: 221px;
    margin-top: 6.9rem;
    padding-top: 21px;
  }
}

.under-plan-text {
  text-align: center;
  width: 320px;
  margin: auto;
  color: #333333;
  padding-bottom: 19px;
}

@media (min-width: 768px) {
  .under-plan-text {
    width: 400px;
    font-size: 20px;
    padding-top: 0.5rem;
    padding-bottom: 1.3rem;
  }
}

a.button.button-pink-sixth {
  display: block;
  font-size: 20px;
  font-weight: 700;
  background-color: #f11f8d;
  border-radius: 30px;
  width: 280px;
  height: 60px;
  text-align: center;
  line-height: 55px;
  margin: auto;
  position: relative;
}

a.button.button-pink-sixth:hover {
  background-color: #ffffff;
  color: #f11f8d;
  border: solid;
  border-color: #f11f8d;
  ;
  border-width: 2px;
}

@media (min-width: 768px) {
  a.button.button-pink-sixth {
    width: 318px;
  }
}

i.sixth-arrow.bi.bi-arrow-right-short {
  position: absolute;
  right: 20px;
}

a.button.button-pink-sixth:hover i.sixth-arrow.bi.bi-arrow-right-short {
  color: #f11f8d;
}

@media (min-width: 768px) {
  i.sixth-arrow.bi.bi-arrow-right-short {
    top: 2px;
    right: 18px;
  }
}

/* Q&A */

section.q\&a {
  text-align: center;
  margin-top: 70px;
  padding-left: 10px;
  padding-right: 10px;
}

@media (min-width: 768px) {
  section.q\&a {
    margin-top: 6rem;
  }
}

h2.question-title {
  font-weight: 700;
  display: inline-block;
  position: relative;
}

@media (min-width: 768px) {
  h2.question-title {
    font-size: 36px;
    margin-bottom: 11px;
  }
}

h2.question-title::after {
  content: '';
  position: absolute;
  top: 50px;
  right: 72px;
  width: 24px;
  height: 2px;
  background-color: #0079f2;
}

@media (min-width: 768px) {
  h2.question-title::after {
    width: 36px;
    top: 4.6rem;
    right: 108px;
  }
}

.q\&a-container {
  text-align: start;
  padding-top: 2.4rem;
  max-width: 358px;
  margin: 0 auto;
  color: #333333;
}

@media (min-width: 768px) {
  .q\&a-container {
    max-width: 900px;
    padding-top: 40px;
  }
}

.q\&a-first {
  border: solid 1px;
  border-radius: 8px;
  border-color: #f26618;
  background-color: #ffffff;
  margin-bottom: 20px;
  position: relative;
  width: auto;
}

@media (min-width: 768px) {
.q\&a-first {
  margin-bottom: 18px;
}
}

.q-mark-first {
  color: #f26618;
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 31px;
  border-radius: 50%;
  border-color: #ffeee5;
  background-color: #ffeee5;
  position: absolute;
  top: 16px;
  left: 15px;
}

@media (min-width: 768px) {
  .q-mark-first {
    font-size: 24px;
    width: 48px;
    height: 48px;
    line-height: 45px;
    top: 19px;
    left: 24px;
  }
}

.question-first {
  position: relative;
  border-radius: 8px;
  letter-spacing: 0.01em;
  padding-top: 16px;
  padding-left: 58px;
  padding-right: 2rem;
  padding-bottom: 21px;
  background-color: white;
  cursor: pointer;
}

.question-first.open i.bi.bi-caret-down-fill.toggle-icon {
  transform: scale(1, -1);
}


@media (min-width: 768px) {
  .question-first {
    padding-top: 27px;
    padding-left: 87px;
    padding-bottom: 32px;
    letter-spacing: 0.003em;
  }
}

i.bi.bi-caret-down-fill.toggle-icon {
  color: #f2a118;
  position: absolute;
  top: 13px;
  right: 13px;
}

@media (min-width: 768px) {
  i.bi.toggle-icon.bi-caret-down-fill {
    font-size: 1.6rem;
    top: 19px;
    right: 18px;
  }
}

.answer-first {
  background-color: #ffeee5;
  border-radius: 0 0 8px 8px;
  letter-spacing: 0.01em;
  padding-top: 15px;
  padding-right: 25px;
  padding-bottom: 18px;
  display: none;
}

@media (min-width: 768px) {
  .answer-first {
    height: 172px;
    padding-top: 20px;
    padding-right: 4.3rem;
    letter-spacing: 0.003em;
  }
}

.inner-answer-first {
  display: flex;
  column-gap: 11px;
}

@media (min-width: 768px) {
  .inner-answer-first {
    column-gap: 17px;
  }
}

.a-mark-first {
  color: #ffffff;
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 33px;
  border-radius: 50%;
  border-color: #f26618;
  background-color: #f26618;
  margin-left: 15px;
  padding-left: 10px;
  padding-right: 11px;
}

@media (min-width: 768px) {
  .a-mark-first {
    font-size: 24px;
    width: 48px;
    height: 48px;
    line-height: 47px;
    margin-left: 22px;
    padding-left: 16px;
    padding-right: 20px;
  }
}

@media (min-width: 768px) {
  .answer-first-text {
    padding-top: 8px;
  }
}

.q\&a-second {
  border: solid 1px;
  border-radius: 8px;
  border-color: #f26618;
  background-color: #ffffff;
  position: relative;
  width: auto;
}

.q-mark-second {
  color: #f26618;
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 30px;
  border-radius: 50%;
  border-color: #ffeee5;
  background-color: #ffeee5;
  position: absolute;
  top: 17px;
  left: 15px;
}

@media (min-width: 768px) {
  .q-mark-second {
    font-size: 24px;
    width: 48px;
    height: 48px;
    line-height: 45px;
    top: 19px;
    left: 23px;
  }
}

.question-second {
  letter-spacing: 0.01em;
  padding-top: 16px;
  padding-left: 57px;
  padding-right: 2rem;
  padding-bottom: 18px;
  cursor: pointer;
}

.question-second.open i.bi.bi-caret-down-fill.toggle-icon {
  transform: scale(1, -1);
}

@media (min-width: 768px) {
  .question-second {
    height: 89px;
    padding-top: 1.7rem;
    padding-left: 5.5rem;
    letter-spacing: 0;
  }
}

.answer-second {
  background-color: #ffeee5;
  border-radius: 0 0 8px 8px;
  padding-top: 16px;
  padding-right: 2rem;
  padding-bottom: 18px;
  display: none;
}

@media (min-width: 768px) {
  .answer-second {
    height: 113px;
    padding-right: 4.2rem;
  }
}

.inner-answer-second {
  display: flex;
  column-gap: 11px;
}

@media (min-width: 768px) {
  .inner-answer-second {
    column-gap: 17px;
  }
}

.a-mark-second {
  color: #ffffff;
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 33px;
  border-radius: 50%;
  border-color: #f26618;
  background-color: #f26618;
  margin-left: 15px;
  padding-left: 10px;
  padding-right: 11px;
}

@media (min-width: 768px) {
  .a-mark-second {
    font-size: 24px;
    width: 48px;
    height: 48px;
    line-height: 48px;
    margin-left: 22px;
    padding-left: 16px;
    padding-right: 20px;
  }
}

@media (min-width: 768px) {
  .answer-second-text {
    padding-top: 9px;
  }
}

.q\&a-third {
  border: solid 1px;
  border-radius: 8px;
  margin-top: 21px;
  border-color: #f26618;
  background-color: #ffffff;
  position: relative;
  width: auto;
}

@media (min-width: 768px) {
  .q\&a-third {
    margin-bottom: 17px;
  }
}

.q-mark-third {
  color: #f26618;
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 31px;
  border-radius: 50%;
  border-color: #ffeee5;
  background-color: #ffeee5;
  position: absolute;
  top: 14px;
  left: 15px;
}

@media (min-width: 768px) {
  .q-mark-third {
    font-size: 24px;
    width: 48px;
    height: 48px;
    line-height: 43px;
    top: 19px;
    left: 24px;
  }
}

.question-third {
  letter-spacing: 0.04em;
  padding-top: 14px;
  padding-left: 3.6rem;
  padding-right: 2rem;
  padding-bottom: 18px;
  cursor: pointer;
}

.question-third.open i.bi.bi-caret-down-fill.toggle-icon {
  transform: scale(1, -1);
}

@media (min-width: 768px) {
  .question-third {
    height: 86px;
    padding-top: 26px;
    padding-left: 88px;
    letter-spacing: 0;
  }
}

.answer-third {
  background-color: #ffeee5;
  border-radius: 0 0 8px 8px;
  letter-spacing: 0.01em;
  padding-top: 16px;
  padding-right: 2rem;
  padding-bottom: 1.2rem;
  display: none;
}

@media (min-width: 768px) {
  .answer-third {
    height: 141px;
    padding-top: 20px;
    padding-right: 4.2rem;
    padding-bottom: 115px;
    letter-spacing: 0;
  }
}

.inner-answer-third {
  display: flex;
  column-gap: 11px;
}

@media (min-width: 768px) {
  .inner-answer-third {
    column-gap: 18px;
  }
}

.a-mark-third {
  color: #ffffff;
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 33px;
  border-radius: 50%;
  border-color: #f26618;
  background-color: #f26618;
  margin-left: 15px;
  padding-left: 10px;
  padding-right: 11px;
}

@media (min-width: 768px) {
  .a-mark-third {
    font-size: 24px;
    width: 48px;
    height: 48px;
    line-height: 47px;
    margin-left: 22px;
    padding-left: 16px;
    padding-right: 20px;
  }
}

@media (min-width: 768px) {
  .answer-third-text {
    padding-top: 8px;
  }
}

.q\&a-fourth {
  border: solid 1px;
  border-radius: 8px;
  margin-top: 20px;
  border-color: #f26618;
  background-color: #ffffff;
  position: relative;
  width: auto;
}

@media (min-width: 768px) {
  .q\&a-fourth {
    margin-top: 22px;
  }
}

.q-mark-fourth {
  color: #f26618;
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 30px;
  border-radius: 50%;
  border-color: #ffeee5;
  background-color: #ffeee5;
  position: absolute;
  top: 16px;
  left: 15px;
}

@media (min-width: 768px) {
  .q-mark-fourth {
    font-size: 24px;
    width: 48px;
    height: 48px;
    line-height: 47px;
    top: 18px;
    left: 23px;
  }
}

.question-fourth {
  padding-top: 15px;
  padding-left: 59px;
  padding-right: 2rem;
  padding-bottom: 19px;
  cursor: pointer;
}

.question-fourth.open i.bi.bi-caret-down-fill.toggle-icon {
  transform: scale(1, -1);
}

@media (min-width: 768px) {
  .question-fourth {
    height: 87px;
    padding-top: 27px;
    padding-left: 5.5rem;
  }
}

.answer-fourth {
  background-color: #ffeee5;
  border-radius: 0 0 8px 8px;
  padding-top: 1rem;
  padding-right: 2rem;
  padding-bottom: 19px;
  display: none;
}

@media (min-width: 768px) {
  .answer-fourth {
    height: 115px;
    padding-top: 20px;
    padding-right: 4.2rem;
    padding-bottom: 87px;
  }
}

.inner-answer-fourth {
  display: flex;
  column-gap: 12px;
}

@media (min-width: 768px) {
  .inner-answer-fourth {
    column-gap: 17px;
  }
}

.a-mark-fourth {
  color: #ffffff;
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: bold;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 34px;
  border-radius: 50%;
  border-color: #f26618;
  background-color: #f26618;
  margin-left: 15px;
  padding-left: 10px;
  padding-right: 11px;
}

@media (min-width: 768px) {
  .a-mark-fourth {
    font-size: 24px;
    width: 48px;
    height: 48px;
    line-height: 47px;
    margin-left: 22px;
    padding-left: 16px;
    padding-right: 20px;
  }
}

@media (min-width: 768px) {
  .answer-fourth-text {
    padding-top: 8px;
  }
}

/* アンダークエスチョン */

.under-question {
  width: auto;
  margin-top: 5rem;
  padding-top: 1.4rem;
  padding-bottom: 2rem;
  background-color: #f2f8fe;
}

@media (min-width: 768px) {
  .under-question {
    height: 221px;
    margin-top: 6.1rem;
  }
}

.under-question-text {
  width: 318px;
  margin: 0 auto;
  padding-bottom: 19px;
  color: #333333;
}

@media (min-width: 768px) {
  .under-question-text {
    width: 380px;
    font-size: 20px;
    padding-top: 6px;
    padding-bottom: 17px;
  }
}

a.button.button-pink-seventh {
  display: block;
  font-size: 20px;
  font-weight: 700;
  background-color: #f11f8d;
  border-radius: 30px;
  width: 280px;
  height: 60px;
  text-align: center;
  line-height: 55px;
  margin: auto;
  position: relative;
}

a.button.button-pink-seventh:hover {
  background-color: #ffffff;
  color: #f11f8d;
  border: solid;
  border-color: #f11f8d;
  ;
  border-width: 2px;
}

@media (min-width: 768px) {
  a.button.button-pink-seventh {
    width: 318px;
    line-height: 55px;
    margin-top: 4px;

  }
}

i.seventh-arrow.bi.bi-arrow-right-short {
  position: absolute;
  right: 19px;
}

@media (min-width: 768px) {
  i.seventh-arrow.bi.bi-arrow-right-short {
    top: 2px;
  }
}

a.button.button-pink-seventh:hover i.seventh-arrow.bi.bi-arrow-right-short {
  color: #f11f8d;
}

/* フッター */

.footer-top {
  background-color: #222222;
  padding-bottom: 6px;
}

@media (min-width: 768px) {
  .footer-top {
    height: 130px;
    width: auto;
  }
}

ul.footer-sns-list-group {
  display: flex;
  justify-content: center;
  column-gap: 41px;
  font-size: 32px;
  padding-top: 33px;
  padding-bottom: 32px;
}

@media (min-width: 768px) {
  ul.footer-sns-list-group {
    column-gap: 37px;
    padding-top: 33px;
    padding-right: 3px;
  }
}

i.bi.bi-instagram:hover {
  opacity: 0.5;
}

i.bi.bi-youtube:hover {
  opacity: 0.5;
}

i.bi.bi-facebook:hover {
  opacity: 0.5;
}

i.bi.bi-twitter:hover {
  opacity: 0.5;
}

.footer-bottom {
  text-align: center;
  padding-top: 28px;
}

@media (min-width: 768px) {
  .footer-bottom {
    padding-top: 32px;
    display: flex;
    flex-direction: column;
  }
}

small {
  font-family: 'Poppins';
  font-size: 10px;
  font-weight: 800;
  color: #999999;
  white-space: nowrap;
  line-height: 4.1rem;
}

@media (min-width: 768px) {
  small.footer-copyright {
    padding-top: 4px;
  }
}