@charset "UTF-8";
html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
}

*,
::before,
::after {
  box-sizing: inherit;
}

h1, h2, h3, h4, h5, h6, a, p, span, em, small, strong, sub, sup, mark, del, ins, strike, abbr, dfn, blockquote, q, cite, code, pre, ol, ul, li, dl, dt, dd, div, section, article, main, aside, nav, header, hgroup, footer, img, figure, figcaption, address, time, audio, video, canvas, iframe, details, summary, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

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

ul, ol {
  list-style: none;
  list-style-type: none;
}

code, kbd, pre, samp {
  font-family: monospace, sans-serif;
  font-size: inherit;
}

blockquote, q {
  quotes: none;
}

blockquote::after, blockquote::before, q::after, q::before {
  content: "";
  content: none;
}

address {
  font-style: normal;
}

button {
  border: 0;
  background-color: unset;
}

/**font size*********/
/**font weight*********/
/**カラー*********/
/**padding*********/
/***** space ****/
/**margin*********/
/**font-family*********/
html {
  scroll-behavior: smooth;
}

body {
  font-family: "Noto Sans JP", "Roboto", sans-serif;
  color: #646873;
  line-height: 1.8;
  font-size: clamp(14px, 2.0833333333vw, 16px);
  font-feature-settings: "palt";
  letter-spacing: 1px;
  text-align: justify;
}

a {
  text-decoration: none;
  display: inline-block;
  transition: ease 0.3s;
}
a:hover {
  opacity: 0.8;
}

@media (min-width: 768px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

*, ::before, ::after {
  box-sizing: border-box;
}

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

.c-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.c-logo {
  max-width: 100px;
  width: fit-content;
}
.c-logo a {
  display: block;
}

.c-fuwa {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
  transition: 1.5s ease-in-out;
}
@keyframes fuwafuwa {
  0% {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(0, -7px);
  }
  100% {
    transform: translate(0, 0);
  }
}

.c-mark {
  background-color: unset;
  background-image: linear-gradient(to bottom, rgba(33, 165, 221, 0.45), rgba(33, 165, 221, 0.45));
  background-position: center bottom;
  background-size: 100% 36%;
  background-repeat: no-repeat;
  color: #646873;
}

.c-scroll {
  overflow: scroll;
  padding: 10px 4px;
}

.c-title {
  width: fit-content;
  margin: 0 auto clamp(1.875rem, 8vw, 2.5rem);
  font-size: clamp(1.5rem, 0.375rem + 4.8vw, 1.875rem);
  font-weight: 700;
  text-align: center;
  position: relative;
}
.c-title img {
  display: inline-block;
  margin-bottom: 8px;
}
.c-title::after {
  content: "";
  display: block;
  width: 100%;
  height: 5px;
  background-image: url(../images/object-dotsline.svg);
  background-size: cover;
  background-repeat: repeat-x;
  background-position: center;
}

.c-title2 {
  width: 100%;
  text-align: justify;
  font-size: clamp(1.125rem, 0.375rem + 3.2vw, 1.375rem);
  font-weight: 700;
}

/*** home CTAボタン***/
.c-cta {
  max-width: 340px;
  width: 100%;
  background-image: linear-gradient(90deg, rgb(56, 185, 185), rgb(154, 226, 219));
  text-align: center;
  color: #fff;
  font-weight: 700;
  border-radius: 70px;
  box-shadow: 0px 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.c-cta a {
  position: relative;
  color: #fff;
  padding: 18px;
}
.c-cta img {
  display: inline-block;
  vertical-align: text-bottom;
  margin-bottom: 2px;
  margin-right: 10px;
}
.c-cta__time {
  display: block;
  font-size: 12px;
}

/*** home CTAボタン ここまで***/
#topBtn {
  position: fixed;
  bottom: 30px;
  right: 10px;
  z-index: 9999;
  border-radius: 100%;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  width: clamp(3.125rem, 1.25rem + 8vw, 3.75rem);
}

.qa .q {
  position: relative;
  cursor: pointer;
}
.qa .q:before {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 2px;
  background-color: #fff;
  right: 15px;
  top: 50%;
  transform: translate(0, -50%);
}
.qa .q:after {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 2px;
  background-color: #fff;
  right: 15px;
  top: 50%;
  transform: translate(0, -50%) rotate(90deg);
}
.qa .q.active:after {
  display: none;
}
.qa .a {
  display: none;
}

.swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.home .p-fv {
  padding: 20px;
  position: relative;
  height: 780px;
}
@media screen and (max-width: 480px) {
  .home .p-fv {
    height: 85vh;
  }
}
.home .p-fv video {
  width: 100%;
  height: 100%;
  object-fit: cover; /* この一行を追加するだけ！ */
  border-radius: 30px;
}
.home .p-fv__cover {
  position: absolute;
  padding: 20px;
  top: 0px;
  left: 0px;
  z-index: 100;
  width: 100%;
  height: 100%;
}
.home .p-fv__wrap {
  width: 100%;
  padding: 0 20px;
  position: absolute;
  bottom: 30px;
  left: 0;
  z-index: 1000;
}
.home .p-fv__wrap__sub {
  padding: 0 2%;
  font-size: clamp(1.313rem, 0.375rem + 4vw, 1.625rem);
  font-weight: 700;
  color: #38B9B9;
  text-shadow: rgb(255, 255, 255) 4px 0px 0px, rgb(255, 255, 255) 3.87565px 0.989616px 0px, rgb(255, 255, 255) 3.51033px 1.9177px 0px, rgb(255, 255, 255) 2.92676px 2.72656px 0px, rgb(255, 255, 255) 2.16121px 3.36588px 0px, rgb(255, 255, 255) 1.26129px 3.79594px 0px, rgb(255, 255, 255) 0.282949px 3.98998px 0px, rgb(255, 255, 255) -0.712984px 3.93594px 0px, rgb(255, 255, 255) -1.66459px 3.63719px 0px, rgb(255, 255, 255) -2.51269px 3.11229px 0px, rgb(255, 255, 255) -3.20457px 2.39389px 0px, rgb(255, 255, 255) -3.69721px 1.52664px 0px, rgb(255, 255, 255) -3.95997px 0.56448px 0px, rgb(255, 255, 255) -3.97652px -0.432781px 0px, rgb(255, 255, 255) -3.74583px -1.40313px 0px, rgb(255, 255, 255) -3.28224px -2.28625px 0px, rgb(255, 255, 255) -2.61457px -3.02721px 0px, rgb(255, 255, 255) -1.78435px -3.57996px 0px, rgb(255, 255, 255) -0.843183px -3.91012px 0px, rgb(255, 255, 255) 0.150409px -3.99717px 0px, rgb(255, 255, 255) 1.13465px -3.8357px 0px, rgb(255, 255, 255) 2.04834px -3.43574px 0px, rgb(255, 255, 255) 2.83468px -2.82216px 0px, rgb(255, 255, 255) 3.44477px -2.03312px 0px, rgb(255, 255, 255) 3.84068px -1.11766px 0px, rgb(255, 255, 255) 3.9978px -0.132717px 0px;
}
.home .p-fv__wrap__title {
  width: 100%;
  padding: 24px 2%;
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-style: italic;
  font-variation-settings: "wdth" 100;
  font-size: clamp(1.25rem, -1.875rem + 13.33vw, 2.125rem);
  font-weight: 700;
  text-align: center;
  color: #fff;
  background-image: url(../images/img-fv_maintitle.webp);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.home .p-fv__wrap__close {
  font-size: clamp(1.125rem, 4.8vw, 1.5rem);
  font-weight: 700;
  color: #ED87B4;
  letter-spacing: 5px;
  padding: 0 2%;
  text-shadow: rgb(255, 255, 255) 4px 0px 0px, rgb(255, 255, 255) 3.87565px 0.989616px 0px, rgb(255, 255, 255) 3.51033px 1.9177px 0px, rgb(255, 255, 255) 2.92676px 2.72656px 0px, rgb(255, 255, 255) 2.16121px 3.36588px 0px, rgb(255, 255, 255) 1.26129px 3.79594px 0px, rgb(255, 255, 255) 0.282949px 3.98998px 0px, rgb(255, 255, 255) -0.712984px 3.93594px 0px, rgb(255, 255, 255) -1.66459px 3.63719px 0px, rgb(255, 255, 255) -2.51269px 3.11229px 0px, rgb(255, 255, 255) -3.20457px 2.39389px 0px, rgb(255, 255, 255) -3.69721px 1.52664px 0px, rgb(255, 255, 255) -3.95997px 0.56448px 0px, rgb(255, 255, 255) -3.97652px -0.432781px 0px, rgb(255, 255, 255) -3.74583px -1.40313px 0px, rgb(255, 255, 255) -3.28224px -2.28625px 0px, rgb(255, 255, 255) -2.61457px -3.02721px 0px, rgb(255, 255, 255) -1.78435px -3.57996px 0px, rgb(255, 255, 255) -0.843183px -3.91012px 0px, rgb(255, 255, 255) 0.150409px -3.99717px 0px, rgb(255, 255, 255) 1.13465px -3.8357px 0px, rgb(255, 255, 255) 2.04834px -3.43574px 0px, rgb(255, 255, 255) 2.83468px -2.82216px 0px, rgb(255, 255, 255) 3.44477px -2.03312px 0px, rgb(255, 255, 255) 3.84068px -1.11766px 0px, rgb(255, 255, 255) 3.9978px -0.132717px 0px;
}
.home .p-fv__wrap__time {
  padding: 0 2%;
}
.home .p-fv__wrap__day {
  padding: 0 2%;
  margin-top: -10px;
}
.home .p-visual {
  max-width: clamp(26.875rem, 13.867rem + 23.13vw, 50rem);
  width: 100%;
  height: 100%;
  margin: auto;
  margin-right: clamp(25rem, 10.938rem + 25vw, 50rem);
  padding-left: 7%;
  padding-top: 10vh;
}
.home .p-visual__image {
  width: 100%;
}
.home .p-visual__text {
  position: relative;
  height: 360px;
  width: 360px;
  background-color: rgba(195, 215, 84, 0.13);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  z-index: 10;
}
.home .p-visual__text::after {
  content: "";
  width: 210px;
  height: 210px;
  border-radius: 100%;
  background-image: linear-gradient(90deg, rgb(49, 215, 234), rgb(33, 165, 221));
  opacity: 0.15;
  position: absolute;
  top: -50px;
  right: -50px;
  z-index: 2;
}
.home .p-visual__text__title {
  font-size: 28px;
  color: #ED87B4;
  font-weight: 700;
  position: relative;
  z-index: 100;
  text-shadow: rgb(255, 255, 255) 4px 0px 0px, rgb(255, 255, 255) 3.87565px 0.989616px 0px, rgb(255, 255, 255) 3.51033px 1.9177px 0px, rgb(255, 255, 255) 2.92676px 2.72656px 0px, rgb(255, 255, 255) 2.16121px 3.36588px 0px, rgb(255, 255, 255) 1.26129px 3.79594px 0px, rgb(255, 255, 255) 0.282949px 3.98998px 0px, rgb(255, 255, 255) -0.712984px 3.93594px 0px, rgb(255, 255, 255) -1.66459px 3.63719px 0px, rgb(255, 255, 255) -2.51269px 3.11229px 0px, rgb(255, 255, 255) -3.20457px 2.39389px 0px, rgb(255, 255, 255) -3.69721px 1.52664px 0px, rgb(255, 255, 255) -3.95997px 0.56448px 0px, rgb(255, 255, 255) -3.97652px -0.432781px 0px, rgb(255, 255, 255) -3.74583px -1.40313px 0px, rgb(255, 255, 255) -3.28224px -2.28625px 0px, rgb(255, 255, 255) -2.61457px -3.02721px 0px, rgb(255, 255, 255) -1.78435px -3.57996px 0px, rgb(255, 255, 255) -0.843183px -3.91012px 0px, rgb(255, 255, 255) 0.150409px -3.99717px 0px, rgb(255, 255, 255) 1.13465px -3.8357px 0px, rgb(255, 255, 255) 2.04834px -3.43574px 0px, rgb(255, 255, 255) 2.83468px -2.82216px 0px, rgb(255, 255, 255) 3.44477px -2.03312px 0px, rgb(255, 255, 255) 3.84068px -1.11766px 0px, rgb(255, 255, 255) 3.9978px -0.132717px 0px;
}
.home .p-visual__text__required {
  font-size: 12px;
  margin-top: 8px;
  font-weight: 700;
}

.p-info__title {
  position: relative;
}
.p-info__bubble {
  position: absolute;
  top: 24px;
  left: -25%;
}
.p-info__text {
  font-weight: 700;
}
.p-info .c-mark {
  background-image: linear-gradient(0deg, #FFE928 0.5em, transparent 0.5em);
  font-weight: normal;
}
.p-info__required {
  width: 100%;
  margin-top: 12px;
  padding-left: 16px;
  list-style: url(../images/icon-kome.svg);
  font-size: 14px;
  font-weight: 700;
  color: #21A5DD;
}
.p-info__button {
  max-width: 340px;
  width: 100%;
  margin: 0 auto;
}
.p-info__button a {
  padding: 8px 18px;
}
.p-info__button__catch {
  position: relative;
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  margin-bottom: 10px;
}
.p-info__button__catch::before {
  content: "";
  height: 12px;
  width: 12px;
  margin-right: 8px;
  display: inline-block;
  background-image: url(../images/icon-quotation.svg);
}
.p-info__button__catch::after {
  content: "";
  height: 12px;
  width: 12px;
  margin-left: 8px;
  display: inline-block;
  background-image: url(../images/icon-quotation.svg);
  transform: scale(-1, 1);
}

.home .p-curriculum {
  padding-top: 30px;
}
@media screen and (max-width: 480px) {
  .home .p-curriculum {
    padding-top: 10px;
  }
}
.home .p-curriculum__text {
  font-size: clamp(1rem, 0.625rem + 1.6vw, 1.125rem);
  text-align: center;
  font-weight: 700;
}
.home .p-curriculum__image {
  width: 100%;
  margin: 40px auto;
}
.home .p-curriculum__summary {
  width: 100%;
  position: relative;
  z-index: 100;
  align-items: flex-end;
  margin-bottom: 40px;
}
.home .p-curriculum__summary:nth-child(even) {
  flex-direction: row-reverse;
}
.home .p-curriculum__summary::after {
  content: "";
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: calc(100% + 60px);
  height: 60px;
  display: block;
  position: absolute;
  bottom: -20px;
  left: -30px;
  z-index: -1;
}
.home .p-curriculum__summary:nth-child(1)::after {
  background-image: url(../images/object-wave_pink.svg);
}
.home .p-curriculum__summary:nth-child(2)::after {
  background-image: url(../images/object-wave_blue.svg);
}
.home .p-curriculum__summary:nth-child(3)::after {
  background-image: url(../images/object-wave_green.svg);
}
.home .p-curriculum__summary:nth-child(4)::after {
  background-image: url(../images/object-wave_pink.svg);
}
.home .p-curriculum__summary:nth-child(5) {
  margin-bottom: 8px;
}
.home .p-curriculum__summary:nth-child(5)::after {
  display: none;
}
.home .p-curriculum__summary__click {
  color: #38B9B9;
  font-weight: 700;
  font-size: 12px;
}
.home .p-curriculum__summary__click::before {
  content: "";
  background-image: url(../images/icon-grass_g.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: text-bottom;
}
.home .p-curriculum__wrap {
  width: 54%;
}
.home .p-curriculum__wrap__title {
  font-size: clamp(1rem, -0.125rem + 4.8vw, 1.375rem);
  font-weight: 700;
  padding-bottom: 6px;
  position: relative;
}
.home .p-curriculum__wrap__title::after {
  content: "";
  background-image: url(../images/object-dotsline.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 5px;
  display: block;
}
.home .p-curriculum__wrap__image {
  width: 44%;
  position: relative;
  z-index: 100;
}
.home .p-curriculum__wrap__text {
  margin-top: 8px;
  font-weight: 500;
}
.home .p-curriculum__wrap__pamph {
  width: 49%;
  margin-top: 40px;
  border: 1px solid #646873;
}
.home .p-curriculum__human {
  padding-bottom: 0;
  position: relative;
  z-index: 100;
  /* @media screen and (min-width: 900px) {
      padding: clamp(3.125rem, 1.25rem + 8vw, 3.75rem) 0;
  } */
}
.home .p-curriculum__human .c-title {
  width: 100%;
}
.home .p-curriculum__human .c-title::before {
  content: "";
  display: block;
  background-image: url(../images/object-skillUp.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 60px;
  height: 60px;
  margin-bottom: -10px;
}
.home .p-curriculum__human .c-title::after {
  content: "";
  position: absolute;
  left: -40px;
  bottom: -40px;
  background-image: url(../images/object-wave_pink.svg);
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: cover;
  width: calc(100% + 80px);
  height: 120px;
  z-index: -1;
}
.home .p-curriculum__cta {
  margin: clamp(3.75rem, -5.179rem + 38.1vw, 6.25rem) auto clamp(2.5rem, -1.964rem + 19.05vw, 3.75rem);
}

.home .p-reason {
  background-color: #21A5DD;
  color: #fff;
  border-radius: 30px;
}
.home .p-reason .c-title::after {
  background-image: url(../images/object-dotsline_w.svg);
}
.home .p-reason__inner {
  flex-direction: column;
  gap: 30px;
}
.home .p-reason__inner__list {
  background-color: #fff;
  border-radius: 20px;
  overflow: hidden;
}
.home .p-reason__inner__list figcaption {
  padding: 24px;
  color: #646873;
  font-weight: 500;
}
.home .p-reason__bottom {
  text-align: center;
  font-size: clamp(1.125rem, -0.75rem + 8vw, 1.75rem);
  margin-top: 40px;
  font-weight: 700;
}
.home .p-reason__bottom span {
  font-size: clamp(0.875rem, -0.25rem + 4.8vw, 1.25rem);
}

.home .p-voice {
  padding-bottom: 0;
}
.home .p-voice__inner__list {
  background-color: #fff;
  border-radius: 20px;
  overflow: hidden;
  width: 313.3333333333px;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}
.home .p-voice__inner__list figcaption {
  padding: 24px;
  color: #646873;
  font-weight: 500;
}

.home .p-faq {
  padding-bottom: 0;
}
.home .p-faq__list {
  color: #fff;
  padding: 16px;
  border-radius: 10px;
  margin-bottom: 20px;
}
.home .p-faq__list:nth-child(even) {
  background-color: #ED87B4;
}
.home .p-faq__list:nth-child(odd) {
  background-color: #38B9B9;
}
.home .p-faq__list:last-child {
  margin-bottom: 0;
}
.home .p-faq__list__question {
  font-weight: 700;
  padding-right: 34px;
}
.home .p-faq__list__answer {
  margin-top: 12px;
  font-size: 14px;
}

.home .p-contact.l-wrap {
  padding-left: 0;
  padding-right: 0;
}
.home .p-contact__image {
  background-image: url(../images/img-contact.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 6px 0;
  border-radius: 8px;
}
.home .p-contact__text {
  padding-top: 30px;
  font-weight: 500;
}
.home .p-contact__text .c-mark {
  background-image: linear-gradient(0deg, rgba(237, 135, 180, 0.5019607843) 0.5em, transparent 0.5em);
  font-weight: 700;
}
.home .p-contact__button {
  max-width: 340px;
  margin: 0 auto;
}
.home .p-contact__button .c-cta a {
  padding: 8px 18px;
}

.home .p-class {
  background-color: #FFFDF0;
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
}
.home .p-class__inner {
  width: 100%;
  margin-top: 40px;
}
.home .p-class__sub {
  width: 100%;
  color: #fff;
  padding: 6px;
  text-align: center;
  border-radius: 4px;
  font-weight: 700;
}
.home .p-class__sub:nth-of-type(1) {
  background-color: #21A5DD;
}
.home .p-class__sub:nth-of-type(2) {
  background-color: #38B9B9;
  margin-top: 40px;
}
.home .p-class__inner dl {
  margin-top: 12px;
}
.home .p-class__inner__term {
  font-weight: 700;
}
.home .p-class__inner__desc {
  margin: 8px auto;
  font-size: 14px;
}
.home .p-class__inner__map {
  font-size: 12px;
  font-weight: 500;
}
.home .p-class__inner__map span {
  margin-right: 4px;
}
.home .p-class__inner__map img {
  vertical-align: text-bottom;
}
.home .p-class__inner__ywca {
  color: #21A5DD;
  border-bottom: 1px solid #21A5DD;
}
.home .p-class__inner__granb {
  color: #38B9B9;
  border-bottom: 1px solid #38B9B9;
}

.u-unknown {
  width: 50%;
}

.l-footer {
  position: relative;
  width: 100%;
  background-color: #21A5DD;
}
.l-footer a {
  text-decoration: underline;
}
.l-footer__logo {
  width: 180px;
  margin: 0 auto;
  border-radius: 8px;
  background-color: #fff;
}
.l-footer__logo a {
  padding: 16px 32px;
}
.l-footer__inner {
  max-width: 390px;
  width: 100%;
  margin: 30px auto;
  color: #fff;
}
.l-footer__inner__desc {
  font-weight: 500;
}
.l-footer__inner__term {
  margin-bottom: 6px;
}
.l-footer__inner__term a {
  color: #fff;
}
.l-footer iframe {
  border-radius: 8px;
}
.l-footer small {
  display: inline-block;
  width: 100%;
  margin-top: 40px;
  text-align: center;
  color: #fff;
}

.l-header {
  max-width: 500px;
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 9999;
  padding: 40px;
}
@media screen and (max-width: 899px) {
  .l-header {
    left: 50%;
    transform: translateX(-50%);
  }
}

.l-main {
  overflow-x: hidden;
  position: relative;
}

.l-container {
  width: 100%;
  margin: 0;
  overflow: hidden;
}
@media screen and (max-width: 899px) and (min-width: 481px) {
  .l-container {
    background-image: url(../images/img-left_back_tab.webp);
    background-size: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
  }
}
.l-container__left {
  width: calc(100% - 500px);
  max-width: 100%;
  margin: 0;
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  background-image: url(../images/img-left_back.webp);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}
@media screen and (max-width: 899px) {
  .l-container__left {
    display: none;
  }
}
.l-container__right {
  max-width: 500px;
  width: 100%;
  margin: 0;
  margin-left: calc(100% - 500px);
  box-shadow: 0px 4px 7px rgba(0, 0, 0, 0.4);
  background-color: #fff;
}
@media screen and (max-width: 899px) {
  .l-container__right {
    margin: 0 auto;
  }
}

.l-wrap {
  padding: clamp(3.125rem, 1.25rem + 8vw, 3.75rem) 30px;
  width: 100%;
  margin: 0 auto;
}