@charset "UTF-8";
:root {
  --white: #fff;
  --black: #111;
  --light_gray: #F8F8F8;
  --gray: #D1D5DB;
  --red: #E50012;
  --base_font: "Noto Sans JP", sans-serif;
  --base_font_en: "Montserrat", sans-serif;
  --skyblue: #00A0DC;
  --green: #34B151;
  --blue: #246AC7;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

html {
  font-size: 10px;
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%; }

body {
  font-size: 16px;
  color: var(--black);
  font-family: var(--base_font);
  font-weight: 500;
  height: 100%;
  margin: 0;
  padding: 0;
  line-height: 1.8;
  width: 100%; }

a {
  color: var(--black);
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  transition: .3s; }

a:hover {
  color: var(--black);
  text-decoration: none;
  opacity: 0.65; }

a:active, a:hover {
  outline-width: 0; }

li{
  margin: 0;
  list-style: none; }

ul,ol{
  margin: 0;
  padding: 0; }

h1,h2,h3,h4,h5,h6, p, figure, dd, dt, dl { margin:0; }

figcaption, figure, main,
article, aside, footer,
header, nav, section { display: block; }

b, strong { font-weight: bolder; }

small { font-size: 80%; }

img {
  border-style: none;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  height: auto;
  max-width: 100%;
  vertical-align: middle; }

button, input, optgroup, select, textarea {
  font-family: var(--base_font);
  font-size: 100%;
  line-height: 1.15;
  margin: 0; }

button {
  outline: none;
  border: none;
}

button, input { overflow: visible; }
button, select { text-transform: none; }
button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: none; }

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

textarea { overflow: auto; }

[type="checkbox"], [type="radio"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0; }

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
  height: auto; }

[hidden] { display: none; }

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #eee;
}

::-webkit-scrollbar-thumb {
  background: var(--black);
  border-radius: 5px;
}

/******** Grid System width Flex ********/
.flexbox {
  display: flex; }

.flex-wrap {
  flex-wrap: wrap; }

.flex-wrap-reverse {
  flex-wrap: wrap-reverse; }

.flex-justify-start {
  justify-content: flex-start; }

.flex-justify-end {
  justify-content: flex-end; }

.flex-justify-center {
  justify-content: center; }

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

.flex-align-start {
  align-items: flex-start; }

.flex-align-end {
  align-items: flex-end; }

.flex-align-center {
  align-items: center; }

.flex-dir-reverse {
  flex-direction: row-reverse; }

/******** margin ********/
.m-auto {
  margin: auto; }

.mt-5 {
  margin-top: 5px; }

.mt-10 {
  margin-top: 10px; }

.mt-20 {
  margin-top: 20px; }

.mt-30 {
  margin-top: 30px; }

.mt-40 {
  margin-top: 40px; }

.mt-50 {
  margin-top: 50px; }

.mt-60 {
  margin-top: 60px; }

.mt-70 {
  margin-top: 70px; }

.mt-80 {
  margin-top: 80px; }

.mt-90 {
  margin-top: 90px; }

.mt-100 {
  margin-top: 100px; }

.mb-5 {
  margin-bottom: 5px; }

.mb-10 {
  margin-bottom: 10px; }

.mb-20 {
  margin-bottom: 20px; }

.mb-30 {
  margin-bottom: 30px; }

.mb-40 {
  margin-bottom: 40px; }

.mb-50 {
  margin-bottom: 50px; }

.mb-60 {
  margin-bottom: 60px; }

.mb-70 {
  margin-bottom: 70px; }

.mb-80 {
  margin-bottom: 80px; }

.mb-90 {
  margin-bottom: 90px; }

.mb-100 {
  margin-bottom: 100px; }

/******** form input ********/
table {
  border-collapse: collapse;
  border-spacing: 0;
  max-width: 100%;
  width: 100%; }

input[type=text],
input[type=email],
input[type=tel],
input[type=url],
input[type=number],
select {
  border-radius: 4px;
  font-size: 16px;
  font-size: 1.6rem;
  background: var(--white);
  border: 1px solid var(--gray);
  margin: 2px;
  outline: none;
  padding: 20px;
  width: 100%; }

input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=url]:focus,
input[type=number]:focus,
select:focus {
  border-color: var(--black); }

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0; }

input[type=number] {
  -moz-appearance: textfield; }

select {
  cursor: pointer;
  padding: 20px;
  width: auto;
  min-width: 230px; }

textarea {
  border-radius: 4px;
  font-size: 16px;
  font-size: 1.6rem;
  background: var(--white);
  border: 1px solid var(--gray);
  padding: 20px;
  outline: none;
  resize: vertical;
  width: 100%; }

textarea:focus {
  border-color: var(--black); }

input[type=checkbox],
input[type=radio] {
  background: var(--white);
  cursor: pointer;
  margin-right: .5em; }

textarea::placeholder,
input::placeholder {
  font-size: 1.6rem;
  color: #AAA; }

/******** wp-pagenavi ********/
.wp-pagenavi{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-top: 80px;

  a, > span{
    border: 1px solid var(--black);
    border-radius: 5px;
    margin: 0 5px;
    width: 3em;
    height: 3em;
    line-height: 3;
    display: block;
    text-decoration: none;
    padding: 0;
  }

  a:not(.previouspostslink):not(.nextpostslink), > span {
    font-family: var(--base_font_en);
  }

  a:not(.previouspostslink):not(.nextpostslink):hover,
  span.current{
    opacity: 1;
    color: var(--white);
    background-color: var(--black);
  }
}

.pager-arrow{
  display: block;
  width: 100%;
  height: 100%;

  &.-is-prev{
    background: url('./img/news/pager_arrow_prev.svg') no-repeat center;
  }
  &.-is-next{
    background: url('./img/news/pager_arrow_next.svg') no-repeat center;
  }
}

@media screen and (max-width: 550px) {
  .wp-pagenavi{
    a:not(.previouspostslink):not(.nextpostslink),
    span {
      width: 2.4em;
      height: 2.4em;
      line-height: 2.4;
    }
  }
}

/*////////////////////////

Animations

////////////////////////*/
.fadein {
  animation: fadein 2s ease 0s 1 normal;
}

@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

[class*='js-fadein-']{
  animation-fill-mode: both;
  animation-duration: 1s;
  visibility: visible !important;
}

.js-fadein-top {
  animation-name: js-fadein-top;
}

@keyframes js-fadein-top {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.js-fadein-bottom {
  animation-name: js-fadein-bottom;
}

@keyframes js-fadein-bottom {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.js-fadein-left {
  animation-name: js-fadein-left;
}

@keyframes js-fadein-left {
  0% {
    opacity: 0;
    transform: translateX(-30px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.js-fadein-right {
  animation-name: js-fadein-right;
}

@keyframes js-fadein-right {
  0% {
     opacity: 0;
     transform: translateX(20px);
  }
  100% {
     opacity: 1;
     transform: translateX(0);
  }
}

.flexbox{
  > .animation-bottom:nth-of-type(2){
    animation-delay: .2s;
  }

  > .animation-bottom:nth-of-type(3){
    animation-delay: .4s;
  }
}

.animation-bgappearTrigger,
.animation-bgLRextendTrigger {
  opacity: 0;
}

.js-bgappear,
.js-bgLRextend::before {
  opacity: 1;
}

.animation-bgextend {
  animation-name: bgextendAnimeBase;
  animation-duration: 1.3s;
  animation-fill-mode: forwards;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.js-bgappear {
  animation-name: bgextendAnimeSecond;
  animation-duration: 1.5s;
  animation-delay: 0.7s;
  animation-fill-mode: forwards;
  visibility: visible !important;
}

.js-bgLRextend::before {
  animation-name: bgLRextendAnime;
  animation-duration: 1.3s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: var(--red);
  visibility: visible !important;
}

@keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }

  50% {
    transform-origin: left;
    transform: scaleX(1);
  }

  50.001% {
    transform-origin: right;
  }

  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}

@keyframes bgextendAnimeBase {
  from {
    opacity: 1;
  }

  to {
    opacity: 1;
  }
}

@keyframes bgextendAnimeSecond {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }

  50% {
    transform-origin: left;
    transform: scaleX(1);
  }

  50.001% {
    transform-origin: right;
  }

  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}

/*////////////////////////

fonts

////////////////////////*/
.f-en{
  font-family: var(--base_font_en);
}

/*////////////////////////

 common parts

////////////////////////*/
.main{
  margin-top: 103px;
  overflow: hidden;
}

[class*="container_"]{
  margin: 0 auto;
  padding-right: 15px;
  padding-left: 15px;
}

.container_xl.-is-fixed{
  width: min(100%, 1530px);
}

.container_l.-is-fixed{
  width: min(100%, 1330px);
}

.container_m.-is-fixed{
  width: min(100%, 1030px);
}

.container_txt{
  width: min(100%, 800px);
  padding: 0;
}

.pc,
.block {
  display: block;
}

.sp,
.sp-550 {
  display: none;
}

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

.t-right {
  text-align: right;
}

.t-underline{
  text-decoration: underline;
}

.img-radius{
  border-radius: 5px;
}

.grid{
  display: grid;
}

.grid-three-colums{
  grid-template-columns: repeat(3, 1fr);
}

.gap-10{
  gap: 10px;
}

.gap-15{
  gap: 15px;
}

.gap-20{
  gap: 20px;
}

.align-top {
  vertical-align: top;
}

.wd-100 {
  width: 100%;
}

.relative{
  position: relative;
}

.inline-block{
  display: inline-block;
}

.lh-15{
  line-height: 1.5;
}

.lh-2{
  line-height: 2;
}

.lh-25{
  line-height: 2.5;
}

.fw-light{
  font-weight: 300;
}

.fw-reg{
  font-weight: 400;
}

.fw-med{
  font-weight: 500;
}

.fw-semib{
  font-weight: 700;
}

.fw-bold{
  font-weight: 700;
}

.f-12{
  font-size: 1.2rem;
}

.f-13{
  font-size: 1.3rem;
}

.f-14{
  font-size: 1.4rem;
}

.f-15{
  font-size: 1.5rem;
}

.f-16{
  font-size: 1.6rem;
}

.f-18{
  font-size: 1.8rem;
}

.f-20{
  font-size: 2rem;
}

.f-22{
  font-size: clamp(2rem, 3vw, 2.2rem);
}

.f-24{
  font-size: clamp(2rem, 3vw, 2.4rem);
}

.f-28{
  font-size: clamp(2.4rem, 3vw, 2.8rem);
}

.f-30{
  font-size: clamp(2.6rem, 3vw, 3rem);
}

.f-40{
  font-size: clamp(2.8rem, 3vw, 4rem);
}

.f-black{
  color: var(--black);
}

.f-green{
  color: #019A3F;
}

.f-red{
  color: #E50012;
}

.f-blue{
  color: var(--skyblue);
}

.highlight{
 background-color: #FFFA6B;
}

.highlight-half{
  background: linear-gradient(transparent 60%, #FFD678 60%);
}

.bkg-white{
  position: relative;
  background-color: var(--white);

  &.-is-bottom-curve{
    &::before{
      content: '';
      display: block;
      position: absolute;
      top: 100%;
      left: 0;
      z-index: 1;
      width: 100%;
      height: 180px;
      background: url('./img/top/bkg_shape_curve_white.svg') no-repeat center bottom / cover;
    }
  }
}

.bkg-gray{
  position: relative;
  background-color: var(--light_gray);

  &.-is-bottom-curve{
    &::before{
      content: '';
      display: block;
      position: absolute;
      top: 100%;
      left: 0;
      z-index: 1;
      width: 100%;
      height: 180px;
      background: url('./img/top/bkg_shape_curve.svg') no-repeat center bottom / cover;
    }
  }
}

a.-is-request{
  background: #55386E;
  background: linear-gradient(90deg,rgba(85, 56, 110, 1) 0%, rgba(178, 87, 156, 1) 100%);

  .icn{
    display: block;
    background: url('./img/common/icn_doc.svg') no-repeat left center;
  }

  &:hover{
    color: var(--white);
  }
}

a.-is-contact{
  background: #FF790D;
  background: linear-gradient(90deg,rgba(255, 121, 13, 1) 0%, rgba(254, 182, 35, 1) 100%);

  .icn{
    display: block;
    background: url('./img/common/icn_star.svg') no-repeat left center;
  }

  &:hover{
    color: var(--white);
  }
}

.btn-round{
  font-weight: bold;
  text-align: center;
  display: block;
  background: var(--black);
  color: var(--white);
  padding: 20px 40px;
  border-radius: 50px;
  width: min(100%, 360px);
  font-size: 2rem;
}

.btn-rectangle{
  font-weight: bold;
  text-align: center;
  display: block;
  background: var(--red);
  color: var(--white);
  padding: 20px;
  border-radius: 5px;
  width: min(100%, 450px);
  font-size: 2rem;
}

.hdg-star{
  text-align: center;
  font-size: clamp(3rem, 3vw, 4rem);
  line-height: 1.3;

  &::before{
    display: block;
    content: url('./img/common/icn_star_red.svg');
  }

  .f-en{
    font-size: 1.5rem;
    display: block;
    font-weight: 600;
    margin: 15px 0 0;
    text-transform: uppercase;
  }
}

.hdg-dotted_line{
  font-size: clamp(2.6rem, 3vw, 3.2rem);
  line-height: 1.4;
}

.hdg-dotted_line_inner{
  padding-bottom: 5px;
  display: inline-block;
  border-bottom: 3px dotted #FF0000;

  &.-is-blue{
    border-color: var(--skyblue);
  }
}

.hdg-center_line{
  position: relative;
  text-align: center;
  font-size: clamp(1.8rem, 3vw, 2.2rem);

  &::after{
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 3px;
    border-bottom: 3px dotted var(--gray);
  }
}

.hdg-center_line_inner{
  display: inline-block;
  padding: 0 25px;
  background-color: var(--white);
  position: relative;
  z-index: 1;
  line-height: 1.3;
}

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

.hdg-radius_grad_inner{
  display: inline-block;
  color: var(--white);
  font-weight: bold;
  background: transparent linear-gradient(84deg, #007AC0 0%, #6EC8F2 100%) 0% 0% no-repeat padding-box;
  font-size: 1.8rem;
  border-radius: 17px;
  padding: 3px 15px;
  line-height: 1.4;
}

.hdg-grad{
  text-align: center;
  font-size: clamp(3rem, 4vw, 4.8rem);
  line-height: 1.4;
  background: linear-gradient(90deg, #007AC0 0%, #6EC8F2 85%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 900;
}

.hdg-bottom_line{
  font-size: clamp(2.2rem, 3vw, 2.6rem);
  text-align: center;
  color: var(--skyblue);
}

.hdg-bottom_line_inner{
  display: inline-block;
  border-bottom: 2px solid var(--skyblue);
}

.hdg-box_tab{
  text-align: center;
  color: #ED7426;

  .f-en{
    display: block;
    width: max-content;
    max-width: 100%;
    padding: 10px 15px 0;
    text-align: center;
    font-size: 1.5rem;
    background-color: #FFF2DB;
    border-radius: 5px 5px 0 0;
    margin: auto;
  }

  &[data-feature="2"]{
    color: #EC514F;

    .f-en, .hdg-box_tab_inner{
      background-color: #FFEFEF;
    }

    .hdg-box_tab_grad{
      background: transparent linear-gradient(258deg, #E73D3B 0%, #FF7A7A 100%) 0% 0% no-repeat padding-box;
    }
  }

  &[data-feature="3"]{
    color: var(--green);

    .f-en, .hdg-box_tab_inner{
      background-color: #E3F9E3;
    }

    .hdg-box_tab_grad{
      background: transparent linear-gradient(70deg, #85D100 0%, #14A448E6 100%) 0% 0% no-repeat padding-box;
    }
  }
}

.hdg-box_tab_inner{
  display: block;
  background-color: #FFF2DB;
  border-radius: 5px;
  padding: 30px 15px;
  font-size: clamp(2.4rem, 4vw, 3.2rem);
}

.hdg-box_tab_grad{
  color: var(--white);
  background: transparent linear-gradient(251deg, #FF7431 0%, #FFB520 100%) 0% 0% no-repeat padding-box;
  border-radius: 5px;
  padding: 0 10px;
  margin: 0 5px;
}

.youtube-wrapper {
  position: relative;
  width: 100%;
  padding-top: 56.25%;

  iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
    border: none;
  }
}

.editor-block h2,
.editor-block h3,
.hdg-filled{
  padding: 25px;
  border-radius: 5px;
  background-color: #F5F6F9;
  font-size: clamp(1.8rem, 3vw, 2rem);
  line-height: 1.4;
}

.article-item{
  a{
    display: flex;
    align-items: center;
    gap: 0 20px;

    &:hover{
      color: var(--red);
    }
  }
}

.article-list{
  .article-item{
    border-bottom: 3px dotted #D3DAE1;

    &:first-child{
      border-top: 3px dotted #D3DAE1;
    }

    a{
      padding: 25px 0;
    }
  }
}

.article-date{
  text-align: center;
  width: 150px;
  padding: 5px 10px;
  line-height: 1.3;
  border-radius: 50px;
  background-color: #55585D;
  font-family: var(--base_font_en);
  color: var(--white);
  flex-shrink: 0;
  font-weight: 600;
}

.box-border{
  border-radius: 5px;
  padding: 30px 20px;
  border: 5px solid #F5F6F9;
}

.box-border.-is-column{
  padding: 0;
}

.box-border_column_ttl{
  position: relative;
  padding: 30px 20px 20px;
  background-color: #FFFCEB;
  color: #FFB300;
  font-weight: bold;
  font-size: clamp(2.4rem, 3vw, 3rem);
}

.box-border_column_detail{
  padding: 30px 7%;
}

.box-white{
  border-radius: 10px;
  background-color: var(--white);
  padding: 100px 10%;
}

.box-gray{
  background-color: #F5F6F9;
  padding: 50px;
}

.box-column{
  border: 2px solid var(--green);
  border-radius: 8px;
  overflow: hidden;

  &.theme-blue{
    border-color: var(--blue);

    .box-column-ttl{
      background-color: var(--blue);
    }
  }
}

.box-column-ttl{
  background-color: var(--green);
  text-align: center;
  color: var(--white);
  padding: 10px 15px;
  font-weight: bold;
}

.box-column-detail{
  padding: 25px 15px;
}

.box-list-block{
  position: relative;
  width: min(100%, 700px);
  margin: auto;
}

.box-list-bkg{
  display: block;
  position: absolute;
  bottom: -7px;
  right: -7px;
  width: 100%;
  height: 100%;
  background: url('./img/top/thoughts_bkg_rainbow.svg') no-repeat center / cover;
  border-radius: 5px;
}

.box-list-inner{
  background: var(--white);
  border: 1px solid var(--black);
  border-radius: 5px;
  padding: 45px 35px 25px;
  position: relative;
  z-index: 1;
}

.hdg-fukidashi,
.box-list-fukidashi{
  text-align: center;
  color: var(--white);
  background: transparent linear-gradient(260deg, #FF5167 0%, #FF708D 0%, #E50023 100%) 0% 0% no-repeat padding-box;
  position: absolute;
  top: -30px;
  left: 0;
  right: 0;
  margin: auto;
  width: 92%;
  padding: 10px 25px;
  font-size: clamp(2.2rem, 3vw, 2.8rem);
  border-radius: 50px;
  line-height: 1.3;

  &::after{
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    background-color: #F23756;
    position: absolute;
    bottom: -6px;
    left: 0;
    right: 0;
    margin: auto;
    transform: rotate(45deg);
  }
}

.box-list-item {
  display: grid;
  grid-template-columns: max-content 1fr;
  align-items: center;
  font-size: clamp(1.6rem, 3vw, 2rem);
  font-weight: bold;
  gap: 0 10px;
  padding: 20px 0;

  &:not(:last-child){
    border-bottom: 1px dashed var(--black);
  }
}

.box-list-item-txt{
  flex: 1;
  line-height: 1.4;
}

.box-list-item-catch{
  width: min(100%, 255px);

  span{
    display: inline-block;
    padding: 5px;
    line-height: 1.2;
    background-color: #FFE5E9;
    font-size: clamp(2rem, 3vw, 2.6rem);
  }

  &::before{
    margin-right: 15px;
    display: inline-block;
    content: url('./img/top/thoughts_equal.svg');
    vertical-align: text-bottom;
  }
}

.hdg-fukidashi{
  position: relative;
  top: 0;
  width: min(100%, 640px);
}

.editor-block ul > li,
.list-dot-item{
  position: relative;
  padding-left: 20px;

  &::before{
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 100px;
    background-color: var(--red);
    position: absolute;
    top: 12px;
    left: 0;
  }
}

.list-dot-item{
  &.f-18::before{
    width: 14px;
    height: 14px;
    top: 10px;
  }
  &.f-22::before{
    width: 18px;
    height: 18px;
  }
}

.list-checklist-item{
  position: relative;
  padding-left: 37px;
  line-height: 1.5;

  &::before{
    content: url("./img/top/icn_checklist.svg");
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    height: 29px;
  }
}

.js-accordion-ttl{
  cursor: pointer;
  font-weight: bold;
  position: relative;
}

.js-accordion-detail{
  position: relative;
  display: none;
}

.js-accordion-more{
  text-align: center;
  font-weight: bold;
  display: block;
  box-shadow: 0px 2px 8px #00000026;
  border: 1px solid var(--black);
  border-radius: 34px;
  font-size: 2rem;
  padding: 18px 20px;
  transition: .2s;

  &:hover{
    box-shadow: none;
    transform: translate(0,2px);
  }

  span{
    display: inline-block;
    padding-right: 20px;
    background: url('./img/top/accordion_arrow_up.svg') no-repeat right center;
  }
}

.js-accordion-close{
  display: block;
  margin: 60px auto 0;
  font-weight: bold;
  text-align: center;
  font-size: 1.5rem;
  border-radius: 50px;
  border: 1px solid #D1D5DB;
  padding: 10px 15px;
  cursor: pointer;
  width: min(100%, 140px);
  background: url('./img/top/accordion_arrow_up.svg') no-repeat calc(100% - 20px) center;
  display: none;
}

.accordion-item.-is-open{
  .js-accordion-more span{
    background-image: url('./img/top/accordion_arrow_down.svg');
  }
  .js-accordion-close{
    display: block;
  }
}

.accordion-item.-is-column{
  border-radius: 5px;
  background-color: var(--white);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  overflow: hidden;

  &:not(:last-of-type){
    margin-bottom: 20px;
  }

  .js-accordion-ttl,
  .js-accordion-detail{
    padding: 30px 40px 30px 100px;

    &::before{
      position: absolute;
      left: 25px;
      width: 50px;
      height: 50px;
      line-height: 50px;
      background-color: var(--light_gray);
      text-align: center;
      font-family: var(--base_font_en);
      display: block;
      border-radius: 5px;
      content: 'Q';
      font-weight: bold;
      font-size: clamp(2rem, 3vw, 2.2rem);
    }
  }

  .js-accordion-ttl{
    font-size: clamp(1.8rem, 3vw, 2rem);
    line-height: 1.4;

    &::before{
      top: 0;
      bottom: 0;
      margin: auto;
      color: var(--white);
      background-color: var(--red);
      font-weight: bold;
    }
  }

  .js-accordion-detail{
    &::before{
      top: 18px;
      content: 'A';
      color: #55585D;
      top: 30px;
    }
  }

  .js-accordion-toggle{
    display: block;
    position: relative;
    padding-right: 25px;

    &::before,
    &::after{
      content: '';
      display: block;
      background-color: #55585D;
      border-radius: 17px;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 0;
      margin: auto;
      transition: .3s;
    }

    &::before{
      width: 17px;
      height: 3px;
    }

    &::after{
      height: 17px;
      width: 3px;
      right: 7px;
    }
  }
}

.accordion-item.-is-column.-is-open{
  .js-accordion-ttl{
    background:transparent linear-gradient(261deg, #FF5167 0%, #FF708D 0%, #E50023 100%) 0% 0% no-repeat padding-box;;
    color: var(--white);

    &::before{
      color: var(--red);
      background-color: var(--white);
    }
  }

  .js-accordion-toggle{
    &::before,
    &::after{
      transform: rotate(180deg);
      background-color: var(--white);
    }
    &::after{
      opacity: 0;
    }
  }
}

.table-wrapper{
  border-radius: 8px;
  border: 2px solid var(--red);
  overflow: hidden;

  &.-is-timetable{
    .common-table-th,
    .common-table-td{
      text-align: center;
      color: var(--black);
    }

    .common-table-th.-is-time,
    .common-table-td.-is-time{
      background-color: #F5F6FA;
    }

    .common-table-th.-is-day{
      background-color: #474747;
      color: var(--white);

      &.-is-sat{
        color: #3EB1FF;
      }

      &.-is-sun{
        color: var(--red);
      }
    }

    .common-table-td{
      background-color: #E6E7EC;
      background-repeat: no-repeat;
      background-position: center;

      &.-is-open{
        background-color: #E3F9E4;
        background-image: url('./img/top/icn_open.svg');
      }

      &.-is-few{
        background-color: #FFE4EB;
        background-image: url('./img/top/icn_few.svg');
      }

      &.-is-close{
        background-color: #C4C7CE;
        background-image: url('./img/top/icn_close.svg');
      }
    }
  }
}

.common-table-th:not(:first-of-type),
.common-table-td{
  border-left: 2px solid #D3DBE3;
}

.common-table-row:not(:last-of-type){
  border-bottom: 2px solid #D3DBE3;
}

.common-table-th,
.common-table-td{
  padding: 15px 20px;
}

.common-table-th{
  color: var(--white);
  background-color: var(--red);
}

.theme-green{
  &.table-wrapper{
    border-color: var(--green);
  }
  .common-table-th{
    background-color: var(--green);
  }
}

.theme-blue{
  &.table-wrapper{
    border-color: var(--blue);
  }
  .common-table-th{
    background-color: var(--blue);
  }
  .common-table-td.-is-open{
    background-color: #E4F0FE !important;
    background-image: url('./img/top/icn_open_blue.svg') !important;
  }
}

.swiper-thumbnail{
  .swiper-slide{
    opacity: 1;
  }
  .swiper-slide.swiper-slide-thumb-active {
    opacity: 0.5;
  }
}

@media screen and (min-width: 981px) {
  .table-wrapper{
    &.-is-timetable{
      .common-table-th.-is-time,
      .common-table-td.-is-time{
        width: 185px;
      }
    }
  }
}

@media screen and (max-width: 980px) {
  .js-scroll-item{
    width: min(1024px, 1024px);
    max-width: none;
  }
}

@media screen and (max-width: 768px) {
  .sp {
    display: block;
  }
  .pc {
    display: none;
  }
}

@media screen and (max-width: 680px) {
  .main{
    margin-top: 90px;
  }
}

@media screen and (min-width: 651px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}

@media screen and (max-width: 650px) {
  a[href^="tel:"] {
    text-decoration: underline;
    display: inline-block;
  }
}

@media screen and (min-width: 551px) {
  .t-center-pc{
    text-align: center;
  }
}

@media screen and (max-width: 550px) {
  .pc-550 {
    display: none;
  }
  .sp-550 {
    display: block;
  }
  .article-item{
    a{
      flex-wrap: wrap;
    }
  }
  .article-ttl{
    margin-top: 5px;
    width: 100%;
  }
  .accordion-item.-is-column{
    .js-accordion-ttl,
    .js-accordion-detail{
      padding-left: 75px;
      padding-right: 20px;

      &::before{
        left: 20px;
        width: 40px;
        height: 40px;
        line-height: 40px;
      }
    }
    .js-accordion-detail::before{
      top: 21px;
    }
  }
  .hdg-box_tab_inner{
    padding: 15px;
  }
}

@media screen and (max-width: 460px) {
  .main{
    margin-top: 22vw;
  }
}

/*////////////////////////

 Header

////////////////////////*/
.header{
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
  background: var(--white);
  box-shadow: 0 1px 8px 1px rgba(0,0,0,0.1);

  .btn-round{
    width: min(100%, 150px);
    line-height: 1.2;
    padding: 15px 5px;
    border-radius: 0;
    font-size: 1.6rem;
    font-weight: 500;

    .icn{
      background-position: center top;
      padding: 25px 0 0;
    }

    &.-is-request{
      padding-top: 20px;

      .icn{
        padding-top: 27px;
      }
    }
  }
}

.header__logo{
  padding: 27px 0;
}

.header__nav_item{
  font-weight: bold;

  &.-is-btn{
    width: min(100%, 300px);
  }
}

@media screen and (min-width: 1381px) {
  .header__nav_toggle{
    display: none;
  }
  .header__nav_block{
    flex: 1;
  }
  .header__nav_list{
    gap: 0 20px;
  }
  .header__nav_item.-is-btn.-is-pc{
    width: min(20%, 300px);
  }
  .header__nav_item{

    a {
      font-weight: bold;
    }

    &.-is-sp{
      display: none;
    }

    &:not(.-is-sns):not(.-is-btn){
      a{
        display: inline-block;
        position: relative;
        transition: .3s;

        &::after{
          position: absolute;
          bottom: -3px;
          left: 50%;
          content: '';
          width: 0;
          height: 1px;
          background-color: var(--black);
          transition: .3s;
          transform: translateX(-50%);
        }

        &:hover::after{
          width: 100%;
        }
      }
    }
  }
}

@media screen and (max-width: 1380px) {
  .header__logo{
    flex: 1;
  }
  .header__container{
    gap: 0 20px;
    padding: 0 10px;
  }
  .header__nav_toggle {
    position: relative;
    width: 50px;
    height: 30px;
    color: transparent;
    background-color: transparent;
    border: transparent;
    cursor: pointer;
    display: block;
    z-index: 999;
  }
  .header__nav_toggle_bars,
  .header__nav_toggle_bars:before,
  .header__nav_toggle_bars:after {
    width: 100%;
    height: 3px;
    background-color: var(--black);
    display: block;
    transition: .3s;
  }
  .header__nav_toggle_bars {
    margin: 0 auto;
    position: relative;
    top: 0;

    &:before,
    &:after {
      position: absolute;
      content: '';
    }

    &:before {
      margin-top: -12px;
      width: 80%;
    }

    &:after {
      width: 80%;
      margin-top: 12px;
    }
  }
  .header__nav_block {
    position: fixed;
    z-index: 1;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    overflow: auto;
    transition: .3s;
    transform: scale(0.0);
    visibility: hidden;
    opacity: 0;
  }
  .header__nav_content {
    position: relative;
    margin: auto;
    padding: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    background-color: var(--white);
  }
  .header__nav_list {
    width: 100%;
    text-align: center;
    padding: 2px 16px;
    background-color: var(--white);
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    gap: 20px 0;
    flex-wrap: wrap;
   }
  .header__nav_item{
    width: 100%;

    a {
      padding: 1em;
    }

    &.-is-sns a{
      margin: auto;
    }

    &.-is-sp.-is-btn{
      border-radius: 5px;
      overflow: hidden;

      .flexbox{
        justify-content: center;
      }
    }
  }
  .header.-is-open{
    .header__logo{
      position: relative;
      z-index: 999;
    }

    .header__nav_toggle_bars {
      transform: rotate(-45deg);

      &:before {
        width: 100%;
        transform: translateY(12px) rotate(90deg);
      }

      &:after {
        display: none;
      }
    }
    .header__nav_block{
      transform: scale(1,1);
      visibility: visible;
      opacity: 1;
    }
  }
}

@media screen and (min-width: 681px) {
  .header__nav_item{
    &.-is-pc.-is-btn{
      margin-bottom: auto;
      overflow: hidden;
      border-radius: 0 0 5px 5px;
    }
  }
}

@media screen and (max-width: 680px) {
  /*** ティザー用 ***/
  .header__nav_item{
    &.-is-pc.-is-btn{
      margin-bottom: auto;
      overflow: hidden;
      border-radius: 0 0 5px 5px;
      width: min(50%, 240px);

      .btn-round{
        padding: 9px 3px;
        font-size: clamp(1.1rem, 3vw, 1.6rem);

        &.-is-request{
          padding-top: 15px;
        }
      }
    }
  }
  /*** END ティザー用 ***/

  /*** 本番用 コメントアウト外す ***/
/*  .header__nav_item{
    &.-is-pc.-is-btn{
      display: none;
    }
  }*/
  /*** END 本番用 ***/

  .header__logo{
    padding: 20px 0;
  }
}

/*////////////////////////

Footer

////////////////////////*/
.footer{
  padding: 70px 0 50px;
}

.ft__nav_list_item{
  font-size: 1.3rem;
  line-height: 1.3;

  a{
    display: inline-block;
    padding: 0 30px;

    &:hover{
      text-decoration: underline;
    }
  }

  &:not(:last-child){
    border-right: 1px solid #CCC;
  }
}

.ft__banner_list{
  gap: 30px 50px;
  margin: 70px 0 0;
}

.ft__copyright{
  color: #C4C7CE;
  font-size: 1rem;
  margin: 80px 0 0;
  text-align: center;
}

@media screen and (max-width: 550px) {
  .ft__nav_list_item{
    a{
      padding: 0 15px;
    }
  }
}

/*////////////////////////

Toppage

////////////////////////*/
.top-mv{
  padding: 0 20px;
  background-color: var(--light_gray);
  position: relative;
  z-index: 1;
}

.top__mv_news_block{
  position: relative;
  z-index: 1;
  font-size: 1.4rem;
  width: min(100%, 325px);
}

.top__mv_sns_txt{
  background-color: #ED4793;
  border-radius: 50px;
  font-size: 1.2rem;
  line-height: 1.3;
  margin-bottom: 10px;
  display: inline-block;

  a{
    display: inline-block;
    padding: 8px 17px;
    color: var(--white);
  }
}

.top__mv_article_block{
  background-color: var(--white);
  padding: 20px 30px 15px;
  border-radius: 7px 7px 7px 0;

  .hdg-star{
    font-size: 2rem;
    text-align: left;

    &::before{
      display: inline-block;
      vertical-align: text-top;
      margin-right: 10px;
    }
  }
}

.top-thoughts{
  position: relative;

  .bkg-line{
    position: relative;
    display: inline-block;
    line-height: 1.3;

    &::after{
      content: '';
      display: block;
      background: url('./img/top/thoughts_rainbow_line.svg') no-repeat left center;
      position: absolute;
      bottom: -25px;
      left: 20px;
      width: 100%;
      height: 38px;
    }
  }
}

.top__thoughts_img.-is-pc{
  width: min(30%, 530px);
  height: 100vh;
  position: absolute;
  top: 0;

  &::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }

  &.-is-left{
    padding-top: 7%;

    &::before{
      background: url('./img/top/thoughts_shape_left.svg') no-repeat -50px center / contain;
      width: min(80vw,598px);
      height: min(80vw,1512px);
    }
  }

  &.-is-right{
    right: 0;
    padding-top: 16%;

    &::before{
      top: 30px;
      background: url('./img/top/thoughts_shape_right.svg') no-repeat right center / contain;
      width: min(80vw,409px);
      height: min(80vw,1298px);
    }
  }
}

.top__thoughts_img [data-image="3"]{
  position: relative;
  right: -50px;
}

.top__thoughts_container{
  position: relative;
  z-index: 1;
  padding: 0 15px;
}

.top__thoughts_catch{
  margin-bottom: 40px;
  line-height: 1.5;
  font-weight: 400;
  font-size: clamp(3.6rem, 4vw, 6.6rem);
  text-align: center;
  white-space: nowrap;
}

.top-feature{
  position: relative;
  padding: 250px 0;

  .container_xl{
    position: relative;
    z-index: 1;
  }
}

.top__feature_shape_right{
  position: absolute;
  top: 0;
  right: 0;
  transform-origin:center center;
  transform: translateX(500px) rotate(-90deg);
}

.top__feature_shape_left{
  position: absolute;
  bottom: 0;
  left: 0;
  transform-origin:center center;
  transform: translateX(-800px) rotate(-90deg);
}

.top__feature_img_list{
  gap: 70px 50px;
}

.top__feature_img_ttl{
  font-size: clamp(2.2rem, 3vw, 2.6rem);
  color: var(--white);
  background: transparent linear-gradient(31deg, #007AC0 0%, #6EC8F2 100%) 0% 0% no-repeat padding-box;
  border-radius: 5px 5px 0 0;
  text-align: center;
  padding: 25px 10px;
  width: 90%;
  margin: 0 auto -2px;
}

.top__feature_img_txt{
  background: transparent linear-gradient(31deg, #007AC0 0%, #6EC8F2 100%) 0% 0% no-repeat padding-box;
  padding: 9px;
  width: 90%;
  margin: -10px auto 0;
  border-radius: 0 0 5px 5px;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  position: relative;

  .f-en{
    position: absolute;
    top: -27px;
    left: 0;
    right: 0;
    z-index: 1;
    margin: auto;
    color: #1B8AC8;
    font-size: 2.2rem;
    background-color: var(--white);
    width: 76px;
    height: 76px;
    border-radius: 100px;
    padding: 8px 0 0;
  }
}

.top__feature_img_txt_inner{
  background-color: var(--white);
  display: block;
  border-radius: 3px;
  position: relative;
  z-index: 1;
  padding: 15px;
  line-height: 1.5;
}

.top__feature_img_item{
  &:nth-child(2){
    .top__feature_img_ttl,
    .top__feature_img_txt{
      background: transparent linear-gradient(211deg, #90E300 0%, #4EC132 100%) 0% 0% no-repeat padding-box;
    }
    .f-en{
      color: #66C524;
    }
  }

  &:nth-child(3){
    .top__feature_img_ttl,
    .top__feature_img_txt{
      background: transparent linear-gradient(32deg, #FF790C 0%, #FFB623 100%) 0% 0% no-repeat padding-box;
    }
    .f-en{
      color: #F38110;
    }
  }
}

.coming-soon{
  color: #DCDFE8;
  font-size: clamp(4rem, 5vw, 8rem);
  padding: 300px 0 0;
}

.top__program_block{
  background-color: #E5F6FE;
  position: relative;

  .hdg-star{
    position: relative;
    z-index: 2;
    margin-bottom: 110px;
  }
}

.top__program_num{
  position: absolute;
  top: -45px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 1;
  text-align: center;
}

.top__program_feature03_img_list{
  gap: 20px 50px;
}

[data-program="1"]{
  padding: 0 0 120px;

  .list-dot-item::before{
    background-color: var(--skyblue);
  }
}

[data-program="2"]{
  background-color: #ECFEE8;
  padding: 120px 0;

  .hdg-radius_grad_inner{
    background: transparent linear-gradient(266deg, #6CDE34 0%, #24BE13 100%) 0% 0% no-repeat padding-box;
  }

  .hdg-grad{
    background: linear-gradient(90deg, #24BE13 0%, #6CDE34 85%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .hdg-dotted_line_inner{
    border-color: #2CC140;
  }

  tbody .common-table-row:nth-of-type(even) .common-table-td{
    background-color: #F5F6F9;
  }

  .common-table-th,
  .common-table-td{
    padding: 6px 15px;
  }

  .common-table-th{
    &.-is-light,
    &.-is-dark{
      color: var(--black);
    }
    &.-is-light{
      background-color: #DCFFD2;
    }
    &.-is-dark{
      background-color: #C3F6B5;
    }
  }

  .box-border:has(.hdg-fukidashi){
    padding: 55px 20px 20px;
  }

  .hdg-fukidashi{
    width: min(90%, 450px);
    background: transparent linear-gradient(262deg, #6CDE34 0%, #24BE13 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    top: -30PX;

    &::after{
      background-color: #47CD23;
    }
  }

  .list-dot{
    width: max-content;
    max-width: 100%;
    margin: auto;

    .list-dot-item::before{
      background-color: #C4F6CB;
    }
  }
}

[data-program="3"]{
  position: relative;
  background-color: #FFF8E8;
  padding: 120px 0 0;

  &::before{
    content: '';
    display: block;
    width: 100%;
    height: min(50vw, 180px);
    background: url("./img/top/program_bkg_shape.svg") no-repeat center / cover;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1;
  }

  .hdg-radius_grad_inner{
    background: transparent linear-gradient(86deg, #FF790C 0%, #FFB623 100%) 0% 0% no-repeat padding-box;
  }

  .hdg-grad{
    background: linear-gradient(90deg, #FF790C 0%, #FFB623 85%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .grid{
    gap: 40px 30px;
    grid-template-columns: repeat(3, 1fr);
  }

  .list-dot{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 15px;
  }

  .list-dot-item::before{
    background-color: #FFD678;
  }
}

[data-program-cycle]{
  &:not(:last-of-type){
    margin-bottom: 40px;
  }
}

[data-program-cycle="2"]{
  .box-border_column_ttl{
    background-color: #FFEFF1;
    color: #FF5063;
  }
}

[data-program-cycle="3"]{
  .box-border_column_ttl{
    background-color: #F2FAFF;
    color: #168ACA;
  }
}

[data-program-cycle="4"]{
  .box-border_column_ttl{
    background-color: #F2FEF3;
    color: #00C514;
  }
}

.top__program_cycle_ttl_label{
  position: absolute;
  top: -35px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 1;
}

.top__program_cycle_voice_block{
  grid-template-columns: repeat(2, 1fr);
  gap: 10px 50px;
}

.top__program_cycle_voice_item{
  background: url('./img/top/program02_cycle_voice01.svg') no-repeat center left;
  padding: 18px 0 18px 100px;

  span{
    position: relative;
    padding: 20px;
    display: block;
    border-radius: 5px;
    background-color: #DFF4FF;
    line-height: 1.3;

    &::before{
      content: '';
      display: block;
      position: absolute;
      right: calc(100% - 5px);
      top: 0;
      bottom: 0;
      margin: auto;
      width: 10px;
      height: 10px;
      transform: rotate(-45deg);
      background-color: #DFF4FF;
    }
  }

  &:nth-of-type(2){
    background-image: url('./img/top/program02_cycle_voice02.svg');

    span, span::before{
      background-color: #FFFCCF;
    }
  }
}

.top__program_cycle_note{
  color: #FF4A59;
  position: relative;
  padding-left: 14px;
  font-size: 1.4rem;
  line-height: 1.5;

  &::before{
    content: url('./img/top/icn_checklist.svg');
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    margin: auto;
    height: 28px;
  }

  span{
    padding: 15px 15px 15px 35px;
    border: 1px solid #FF4A59;
    border-radius: 5px;
    display: block;
  }
}

.top-course{
  margin: 250px 0;
}

.top__course_box_block{
  grid-template-columns: repeat(2, 1fr);

  .flexbox{
    gap: 10px 25px;
  }
}

.top__course_price_label{
  display: inline-block;
  border-radius: 21px;
  padding: 8px 20px 10px;
  font-weight: bold;
  background-color: #E3F9E3;
  line-height: 1.3;
}

.top__course_price{
  font-size: clamp(1.8rem, 4vw, 2.2rem);
  color: var(--green);
  font-weight: 900;
  line-height: 1.3;

  .f-en{
    font-weight: 600;
    font-size: clamp(3rem, 4vw, 4.8rem);
  }
}

.theme-blue{
  .top__course_price_label{
    background-color: #E5F0FF;
  }
  .top__course_price{
    color: var(--blue);
  }
}

.top-flow{
  margin: 0 0 250px;
}

.top__flow_list{
  grid-template-columns: repeat(4, 1fr);
  gap: 40px 35px;
}

.top__flow_img{
  position: relative;
  width: 100%;
  max-width: max-content;
  margin: auto;
}

.top__flow_num{
  position: absolute;
  top: -20px;
  left: -20px;
  z-index: 1;
}

.top-faq{
  padding: 200px 0 10px;

  .hdg-center_line_inner{
    background-color: var(--light_gray);
  }
}

.top-school{
  padding: 250px 0 0;

  .common-table{
    line-height: 1.4;
  }

  .common-table-th{
    width: 125px;
  }
}

.top__school_conts_block{
  gap: 50px 80px;

  .swiper-container{
    overflow: hidden;
    width: 50%;
  }
}

.top__school_txt_block{
  width: 50%;
}

.top-contact{
  margin: 250px 0 0;
  padding: 0 15px;
}

.top__contact_bkg{
  background: url('./img/top/contact_bkg.jpg') no-repeat center / cover;
  padding: 80px 15px;
  position: relative;
  border-radius: 5px;

  &::before{
    content: '';
    display: block;
    width: 100px;
    height: 100px;
    background: url('./img/top/contact_bkg_deco.svg') no-repeat center/ contain;
    position: absolute;
    top: -50px;
    left: 0;
    right: 0;
    margin: auto;
  }
}

.top__contact_btn_list{
  gap: 10px 25px;
  margin-bottom: 40px;

  .btn-round{
    box-shadow: 2px 2px 4px #0000001A;

    &:hover{
      box-shadow: none;
      transform: translate(2px,2px);
    }
  }
}

.top__contact_phone .f-en{
  font-weight: 600;
  font-size: clamp(2.6rem, 3vw, 3.6rem);
}

@media screen and (min-width: 1281px) {
  .top__mv_news_block{
    position: absolute;
    bottom: 13.5vw;
    left: 40px;
  }
}

@media screen and (max-width: 1280px) and (min-width: 769px){
  .top__mv_news_block{
    bottom: 10vw;
    width: 100%;
  }
}

@media screen and (min-width: 1181px) {
  .top__thoughts_img.-is-sp{
    display: none;
  }
  .top__thoughts_txt{
    width: 40vw;
    margin: auto;
  }
  .top__thoughts_container {
    padding-top: 70px;
  }
}

@media screen and (max-width: 1180px) {
  .top__thoughts_img.-is-pc{
    display: none;
  }
  .top__thoughts_container{
    background: url('./img/top/thoughts_sp_shape01.svg') no-repeat center 100px, url('./img/top/thoughts_sp_shape02.svg') no-repeat left 39%;
  }
  .top__thoughts_catch .bkg-gray{
    background: none;
  }
  [data-program="3"]{
    .list-dot{
      grid-template-columns: 1fr;
    }
  }
  .top__program_cycle_voice_block{
    grid-template-columns: 1fr;
  }
  .top__school_conts_block{
    flex-wrap: wrap;
  }
  .top__school_conts_block .swiper-container,
  .top__school_txt_block{
    width: 100%;
  }
}

@media screen and (min-width: 769px) {
  .top-thoughts{
    margin-top: -50px;
  }
}

@media screen and (max-width: 768px) {
  .top-mv{
    padding: 0 5px 100px;
  }
  .top__mv_news_block{
    margin: 30px auto 0;
    width: calc(100% - 20px);
  }
  .top__thoughts_list{
    flex-wrap: wrap;
  }
  .top__program_cycle_ttl_label{
    top: -25px;
  }
  .top__course_box_block {
    grid-template-columns: 1fr;
  }
  .top__flow_list{
    grid-template-columns: repeat(2, 1fr);
  }
  [data-program="3"] {
    .grid {
      gap: 30px 10px;
      grid-template-columns: repeat(2, 1fr);
    }
  }
}

@media screen and (max-width: 680px) {
  .box-list-inner{
    padding: 50px 15px 20px;
  }
  .box-list-item-num{
    width: 45px;
  }
  .top-thoughts{
    .bkg-line{
      &::after{
        bottom: -26px;
        left: 0;
      }
    }
    .box-list-item-detail{
      flex-wrap: wrap;
    }
    .box-list-item-catch{
      width: 100%;
      margin: 10px 0 0;
      white-space: nowrap;
    }
  }
  .top__feature_shape_right{
    top: 100px;
  }
  .coming-soon{
    padding: 200px 0 0;
  }
  .top__program_block{
    .box-white{
      padding: 70px 20px;
    }
  }
  .top__program_feature01_img_list{
    grid-template-columns: 1fr;
  }
  [data-program="1"]{
    padding-bottom: 70px;
  }
  [data-program="2"]{
    padding: 70px 0;
  }
  [data-program="3"] {
    padding: 70px 0 0;
  }
  .top__course_price{
    width: 100%;
    text-align: center;
  }
  .top__flow_list{
    grid-template-columns: 1fr;
  }
}

@media screen and (min-width: 551px) {
  .top-news{
    padding: 0 0 60px;
  }
}

@media screen and (max-width: 550px) {
  [data-program="2"]{
    .hdg-fukidashi{
      top: -50px;
    }
  }
  .top__program_cycle_voice_item{
    padding: 0 0 0 60px;
    background-size: 50px auto;
  }
  .top-course{
    margin: 200px 0 100px;

    .js-scroll-item{
      width: min(680px, 680px);
    }
  }
  .top-flow{
    margin-bottom: 100px;
  }
  .top-school{
    padding-top: 200px;
  }
  .top-contact{
    margin: 100px 0 0;
  }
}

/*////////////////////////

Child common

////////////////////////*/
.main.-is-child{
  margin-bottom: 100px;
}

.child-main-hdg-block{
  height: 145px;
  background-color: var(--light_gray);
  margin-bottom: 80px;

  .container_m{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
}

.child-main-hdg{
  padding-left: 55px;
  font-size: clamp(2.4rem, 3vw, 3.2rem);
  background-image: url('./img/contact/icn_star.svg');
  background-repeat: no-repeat;
  background-position: left center;
}

.arrow-circle-left{
  background: url('./img/common/arrow_circle_left.svg') no-repeat left center;
  display: inline-block;
  padding: 5px 0 5px 40px;
}

/*////////////////////////

Form

////////////////////////*/
.main.-is-contact{
  .child-main-hdg{
    background-image: url('./img/contact/icn_star.svg');
  }
}

.main.-is-request{
  .child-main-hdg{
    background-image: url('./img/request/icn_book.svg');
  }
}

.wd-300{
  width: min(100%, 300px);
}

.postal-search{
  background-color: var(--black);
}

.wpcf7-checkbox{
  gap: 15px 40px;
  display: flex;
  flex-wrap: wrap;
}

.wpcf7-checkbox,
.wpcf7-acceptance{
  input{
    display: none;

    &:checked + .wpcf7-list-item-label::before {
      background-color: var(--black);
    }

    &:checked + .wpcf7-list-item-label::after {
      opacity: 1;
      border-color: var(--white);
    }
  }

  label{
    position: relative;
    padding-left: 40px;
    cursor: pointer;
    display: block;
  }

  .wpcf7-list-item{
    margin-left: 0;
  }

  .wpcf7-list-item-label::before,
  .wpcf7-list-item-label::after{
    position: absolute;
    content: '';
  }

  .wpcf7-list-item-label::before{
    width: 30px;
    height: 30px;
    left: 0;
    top: 0;
    background: var(--white);
    border: 1px solid var(--black);
    border-radius: 3px;
  }

  .wpcf7-list-item-label::after{
    width: 11px;
    height: 5px;
    border: 3.5px solid #666;
    transform: rotate(-45deg);
    border-top: none;
    border-right: none;
    opacity: 0.2;
    top: 10px;
    left: 9px;
    margin: auto;
  }
}

.btn-rectangle:has(.wpcf7-submit),
.btn-rectangle:has(.wpcf7-previous){
  padding: 0;
}

.btn-rectangle:has(.wpcf7-previous),
.btn-rectangle:has(.wpcf7-submit:disabled){
  background-color: #999;
}

.wpcf7-submit,
.wpcf7-previous{
  cursor: pointer;
  background: none;
  border: none;
  color: var(--white);
  font-weight: bold;
  display: block;
  text-align: center;
  width: 100%;
  height: 100%;
  padding: 30px 20px;
}

.wpcf7-spinner{
  display: none;
}

.common-phone-num{
  line-height: 1.4;

  a{
    padding-left: 55px;
    background: url('./img/common/icn_phone.svg') no-repeat left center;
    font-weight: 600;
    color: var(--red);
    font-size: clamp(2.4rem, 3vw, 4.4rem);
  }
}

.form-ttl{
  padding: 25px;
  border-radius: 5px;
  background-color: #F5F6F9;
  font-size: clamp(1.8rem, 3vw, 2rem);
  font-weight: bold;
  line-height: 1.3;
}

.form-opt,
.form-req{
  position: relative;
  padding-left: 50px;
  display: inline-block;

  &::before{
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
    transform: translateY(-50%);
    content: '必須';
    color: var(--white);
    background-color: var(--red);
    font-size: 1.1rem;
    text-align: center;
    padding: 7px;
    line-height: 1;
    border-radius: 4px;
  }
}

.form-opt::before{
  content: '任意';
  background-color: #C4C7CC;
}

.form-detail{
  padding: 30px 0 50px;

  .btn-rectangle{
    border: none;
    width: 120px;
    padding: 10px;
    font-size: 1.4rem;
    cursor: pointer;
  }
}

[data-name="start_type"] .wpcf7-list-item{
  width: 100%;
}

[data-name="start_type_other"]{
  display: block;
  margin: 10px 0 0 40px;
}

.form-privacy-block{
  width: max-content;
  max-width: 100%;
  margin: 0 auto 50px;
}

@media screen and (max-width: 768px) {
  [data-name="start_type_other"]{
    margin-left: 0;
  }
}

/*////////////////////////

News

////////////////////////*/
.main.-is-news{
  .child-main-hdg{
    background-image: url('./img/news/icn_pencil.svg');
  }
}

.detail-ttl{
  font-size: clamp(2.2rem, 3vw, 2.8rem);
}

.editor-block{
  padding: 60px 0;
  border-top: 3px dotted #D3DAE1;
  border-bottom: 3px dotted #D3DAE1;
  margin: 0 0 50px;

  .aligncenter{
    display: block;
    margin-left: auto;
    margin-right: auto;
  }

  a{
    display: inline-block;
    text-decoration: underline;
    padding: 3px 35px 3px 0;
    margin-right: 10px;
    background: url('./img/common/arrow_circle_right.svg') no-repeat right;
  }

  a[target="_blank"]{
    padding: 0 20px 0 0;
    background: url('./img/common/icn_external.svg') no-repeat right;
  }

  li{
    font-size: 1.8rem;
    font-weight: bold;
  }
}