@charset "utf-8";

/*-------------------------------------------------------------------------------------
LP基本設定
----------------------------------------------------------------------------------------*/
html {
  font-size: 62.5%;
}
  @media screen and (min-width:751px) and ( max-width:1080px)  {
    html {
      font-size: calc((100vw / 108));
    }
  }
  @media screen and (max-width: 750px) {
    html {
      font-size: calc((100vw / 37.5));
    }
  }

body{
  line-height: 1.8;
  font-size: 1.8rem;
  font-feature-settings: "palt";
  color: var(--black-color);
  -webkit-text-size-adjust: 100%;
  color: var(--text-color);
}
  @media screen and (max-width: 750px) {
    body{
      line-height: 1.5;
      font-size: 1.5rem;
    }
  }

/*
#header
--------------------------------------------------------*/
#header{
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom: 1px solid #F3F4F6;
  height: 8rem;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  display: none;
}
.header__inner{
  width: min(100%,1400px);
  padding: 1.2rem 4rem;
  align-items: center;
  justify-content: space-between;
}
.header__logo {
  width: 19rem;
  height: 100%;
  line-height: 1;
}
.header__right{
  align-items: center;
}
.header__nav-list{
  gap: 3.2rem;
}
.header__nav-item a{
  line-height: 1;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.header__btn-wrap{
  margin-left: 4rem;
  align-items: center;
  gap: 1.2rem;
}
.header__btn-lead{
  position: relative;
  padding: 0.2rem 0.9rem;
  text-align: center;
  line-height: 1.35;
  font-size: 1rem;
  font-weight: 700;
}
.header__btn-lead::before,
.header__btn-lead::after{
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 0.7rem;
  height: 1.3rem;
}
.header__btn-lead::before{
  background: url(../img/line-cta-left.svg) no-repeat;
  background-size: contain;
  left: 0;
}
.header__btn-lead::after{
  background: url(../img/line-cta-right.svg) no-repeat;
  background-size: contain;
  right: 0;
}
.header__btn-tel{
  background: url(../img/icon-tel.svg) no-repeat left center;
  background-size: 1.9rem 2rem;
  padding-left: 1.8rem;
  line-height: 1;
  font-size: 3rem;
  font-weight: 700;
}
.header__btn-hours{
  line-height: 1;
  text-align: center;
  font-size: 0.9rem;
  letter-spacing: 0;
}
.header__btn--document,
.header__btn--contact{
  position: relative;
  width: 22rem;
  padding: 1.6rem;
  background: var(--orange-grad);
  border-radius: 80px;
  line-height: 1.2;
  font-size: 1.8rem;
  color: var(--white-color);
  font-weight: 900;
  transition-duration: .4s;
  text-align: center;
  letter-spacing: 0.04em;
  text-shadow: 0 0 12px rgba(89, 53, 14, 0.4);
}
.header__btn--document{
  background: var(--sub-color);
}
.header__btn--contact{
  background: var(--orange-grad);
}
.header__btn--document:hover,
.header__btn--contact:hover{
  transform: scale(1.05);
}
.header__btn--contact >span{
  font-weight: 900;
}

@media screen and ( max-width:1200px){
  .header__nav{
    display: none!important;
  }
}


@media screen and ( max-width:750px){
  #header{
    height: auto;
    top: auto;
    bottom: 0;
    /* background: var(--main-color); */
  }
  .header__inner{
    padding: 0.8rem 1rem;
  }
  .header__right{
    width: 100%;
  }
  .header__btn-wrap{
    width: 100%;
    margin-left: 0;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 0.5rem;
  }
  .header__btn-tel{
    font-size: 2.4rem;
  }
  .header__btn--tel *{
    color: var(--white-color);
  }
  .header__btn--document,
  .header__btn--contact{
    flex: 1;
    padding: 1.6rem 1rem 1.6rem;
    font-size: 1.5rem;
  }
  /* .header__btn--document{
    background: var(--white-color);
    color: var(--sub-color);
  } */
  .header__btn-tel {
    background: url(../img/icon-tel-cta.svg) no-repeat left center;
    background-size: 1.9rem 2rem;
  }
}



/*
fv
--------------------------------------------------------*/
.fv{
  overflow: hidden;
  position: relative;
  background: radial-gradient(100% 100% at 50% 0%, #F0F7FF 0%, #FFFFFF 65%);
  background-repeat: no-repeat;
  width: 100%;
  padding: 13rem 0 2.5rem 0;
}
.fv::before{
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  width: 66.8rem;
  height: 48.2rem;
  background: url(../img/fv-blob02.svg) no-repeat;
  background-size: contain;
}
.fv__inner{
  width: min(100%,1280px);
  align-items: center;
  justify-content: space-between;
  padding: 0 6rem;
}
.fv__left{
  position: relative;
}
.fv__ai-list{
  margin-bottom: 3.2rem;
  gap: 0.6rem;
}
.fv__ai-item{
  background: var(--sub-color);
  padding: 0.8rem 0.8rem 0.2rem;
  border-radius: 1rem 1rem 0 1rem;
  line-height: 1;
  font-size: 2.2rem;
  font-family: "Josefin Sans", sans-serif;
  color: var(--white-color);
}
.fv__copy{
  margin-bottom: 3.2rem;
}
.fv__lead-copy{
  display: inline-block;
  margin-bottom: 4rem;
  position: relative;
  background: var(--sub-color);
  padding: 1.4rem 3.2rem 1.4rem 4.8rem;
  border-radius: 100px;
  line-height: 1;
  color: #fff;
  font-size: 2.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.fv__lead-copy::before{
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 2.4rem;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: #C8D8FA;
}
.fv__main-copy{
  margin-bottom: 3.2rem;
  line-height: 1.05;
  text-align: left;
  font-size: 8.5rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}
.fv__main-copy *{
  font-weight: 900;
}
.fv__sub-copy{
  font-size: 2.4rem;
  color: var(--gray-color);
  font-family: "Josefin Sans", "Noto Sans JP", sans-serif;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.fv__achievement{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-weight: 900;
}
.fv__achievement::before,
.fv__achievement::after{
  content: "";
  width: 6.5rem;
  height: 14.3rem;
}
.fv__achievement::before{
  background: url(../img/laurel-left.svg) no-repeat;
  background-size: contain;
}
.fv__achievement::after{
  background: url(../img/laurel-right.svg) no-repeat;
  background-size: contain;
}
.fv__achievement-label{
  display: block;
  margin-bottom: 0.8rem;
  line-height: 1;
  text-align: center;
  font-size: 2.4rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}
.fv__achievement-value .fv__achievement-num{
  line-height: 1;
  font-size: 6rem;
  font-family: "Josefin Sans", sans-serif;
  font-weight: 700;
}
.fv__achievement-value .fv__achievement-num .u-text-small{
  font-size: 50%;
  letter-spacing: -0.1em;
}
.fv__achievement-value .u-text-small{
  line-height: 1;
  font-size: 2rem;
  font-weight: 900;
}
.fv__achievement-value{
  text-align: center;
}
.fv__right{
  position: relative;
  z-index: 0;
  width: 45rem;
}
.fv__right::before{
  position: absolute;
  z-index: -1;
  bottom: -1.6rem;
  left: -16rem;
  content: "";
    width: 37rem;
    height: 33.5rem;
  background: url(../img/fv-blob01.svg)no-repeat;
  background-size: contain;
}
.fv__right:after{
  content: "";
  position: absolute;
  bottom: 0;
  left: -22rem;
  width: 20rem;
  height: 29.6rem;
  background: url(../img/fv-img.png) no-repeat;
  background-size: contain;
}
.fv-form{
  background: var(--white-color);
  border-radius: 24px;
  border: 4px solid rgba(0,0,0,0.06);
  padding: 3.6rem 4rem 3.2rem;
}
.fv-form :is(input, select, textarea) {
  padding: 0.4rem 0.8rem;
  font-size: 1.6rem;
}
.fv-form__title{
  margin-bottom: 0.8rem;
  text-align: center;
  font-size: 2.2rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}
.fv-form__sub-title{
  position: relative;
  margin-bottom: 1.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--gray-color);
  font-weight: 700;
}
.fv-form__sub-title::before,
.fv-form__sub-title::after{
  content: "";
  height: 1px;
  background: var(--gray-color);
  flex: 1;
}
.fv-form__sub-title::before{
  margin-right: 1.6rem;
}
.fv-form__sub-title::after{
  margin-left: 1.6rem;
}
.fv-form__sub-title-en{
  display: inline-block;
  line-height: 1;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0;
}
.fv-form__item + .fv-form__item{
  margin-top: 1rem;
}
.fv-form__label{
  display: block;
  margin-bottom: 0.6rem;
  line-height: 1.3;
  font-size: 1.6rem;
  font-weight: 700;
}
.fv-form__required,
.fv-form__any{
  position: relative;
  top: -1px;
  display: inline-block;
  margin-left: 4px;
  padding: 2px 4px;
  border-radius: 4px;
  line-height: 1;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--white-color);
}
.fv-form__required{
  background: var(--orange-grad);
}
.fv-form__any{
  background: #bbb;
}
.fv-form textarea{
  min-height: 8.8rem;
}
.fv-form__privacy{
  margin-bottom: 1rem;
  text-align: center;
  font-size: 1rem;
  color: var(--gray-color);
}
.fv-form__privacy a{
  text-decoration: underline;
}
.fv-form__privacy a:hover{
  text-decoration: none;
}
.fv-form__submit{
  display: block;
  width: min(100%,32rem);
  margin: auto;
  padding: 1.2rem 2.4rem;
  background: var(--orange-grad);
  border-radius: 80px;
  font-size: 1.8rem;
  color: var(--white-color);
  font-weight: 700;
  text-shadow: 0 0 12px rgba(89, 53, 14, 0.4);
  box-shadow: 0 10px 25px -5px rgba(0,0,0,0.2);
  transition: all 0.3s;
}
.fv-form__submit:hover{
  transform: scale(1.05);
}


@media screen and ( max-width:1280px){
  .fv{
    padding: 10.15625vw 0 1.953125vw 0;
  }
  .fv::before{
    width: 52.1875vw;
    height: 37.65625vw;
  }
  .fv__inner{
    padding: 0 4.6875vw;
  }
  .fv__ai-list{
    margin-bottom: 2.5vw;
    gap: 0.48vw;
  }
  .fv__ai-item{
    padding: 0.625vw 0.625vw 0.15625vw;
    border-radius: 0.78125vw 0.78125vw 0 0.78125vw;
    font-size: 1.71875vw;
  }
  .fv__copy{
    margin-bottom: 2.5vw;
  }
  .fv__main-copy{
    margin-bottom: 2.5vw;
    font-size: 6.64vw;
  }
  .fv__sub-copy{
    font-size: 1.875vw;
  }
  .fv__achievement::before,
  .fv__achievement::after{
    width: 6.5rem;
    height: 14.3rem;
  }
  .fv__achievement::before{
    background: url(../img/laurel-left.svg) no-repeat;
    background-size: contain;
  }
  .fv__achievement::after{
    background: url(../img/laurel-right.svg) no-repeat;
    background-size: contain;
  }
  .fv__achievement-label{
    margin-bottom: 0.625vw;
    font-size: 1.875vw;
  }
  .fv__achievement-value .fv__achievement-num{
    font-size: 4.6875vw;
  }
  .fv__achievement-value .u-text-small{
    font-size: 1.5625vw;
  }
  .fv__right{
    width: 35.15625vw;
  }
  .fv__right::before{
    bottom: -1.25vw;
    left: -12.5vw;
    width: 28.9vw;
    height: 26.171825vw;
    background: url(../img/fv-blob01.svg)no-repeat;
    background-size: contain;
  }
  .fv__right:after{
    bottom: 0;
    left: -17.1875vw;
    width: 15.625vw;
    height: 23.125vw;
    background: url(../img/fv-img.png) no-repeat;
    background-size: contain;
  }
  .fv-form{
    border: 4px solid rgba(0,0,0,0.06);
    padding: 2.8125vw 3.125vw 2.5vw;
  }
  .fv-form :is(input, select, textarea) {
    padding: 0.3125vw 0.625vw;
    font-size: 1.25vw;
  }
  .fv-form__title{
    margin-bottom: 0.625vw;
    font-size: 1.71875vw;
  }
  .fv-form__sub-title::before{
    margin-right: 1.25vw;
  }
  .fv-form__sub-title::after{
    margin-left: 1.25vw;
  }
  .fv-form__sub-title-en{
    font-size: 1.25vw;
  }
  .fv-form__item + .fv-form__item{
    margin-top: 0.78125vw;
  }
  .fv-form__label{
    margin-bottom: 0.46875vw;
    font-size: 1.25vw;
  }
  .fv-form__required,
  .fv-form__any{
    top: -1px;
    margin-left: 4px;
    padding: 2px 4px;
    font-size: 0.9375vw;
  }
  .fv-form textarea{
    min-height: 6.875vw;
  }
  .fv-form__privacy{
    margin-bottom: 0.78125vw;
    font-size: 0.78125vw;
  }
  .fv-form__submit{
    padding: 0.9375vw 1.875vw;
    font-size: 1.40625vw;
  }


}


@media screen and ( max-width:750px){
  .fv{
    padding: 11rem 0 4.8rem 0;
  }
  .fv::before{
    top: -2.4rem;
    right: 0;
    width: 21rem;
    height: 15.4rem;
    background: url(../img/fv-blob02.svg) no-repeat;
    background-size: contain;
  }
  .fv::after{
    position: absolute;
    top: 4rem;
    left: 2rem;
    content: "";
    width: 13rem;
    height: 2rem;
    background: url(../img/logo.svg) no-repeat center / contain;
  }
  .fv__inner{
    padding: 0 2rem;
  }
  .fv__left{
    width: 100%;
    margin-bottom: 1.6rem;
  }
   .fv__ai-list{
    margin-bottom: 2rem;
    gap: 0.5rem;
    justify-content: center;
   }
  .fv__ai-item{
    padding: 0.8rem 0.8rem 0.2rem;
    border-radius:1rem 1rem 0 1rem;
    font-size: 1.4rem;
  }
  .fv__copy{
    margin-bottom: 2.4rem;
  }
  .fv__main-copy{
    margin-bottom: 1.6rem;
    text-align: center;
    font-size: 4.5rem;
  }
  .fv__sub-copy{
    line-height: 1.25;
    text-align: center;
    font-size: 1.5rem;
  }
  .fv__achievement{
    flex-wrap: nowrap;
    justify-content: center;
  }
  .fv__achievement::before,
  .fv__achievement::after{
    width: 4rem;
    height: 6.4rem;
  }
  .fv__achievement-label{
    display: block;
    margin-bottom: 0.4rem;
    font-size: 1.5rem;
  }
  .fv__achievement-value .fv__achievement-num{
    font-size: 4rem;
  }
  .fv__achievement-value .u-text-small{
    font-size: 1.6rem;
  }

  .fv__right{
    width: 100%;
  }
  .fv__right::before{
    bottom: -3rem;
    left: -18rem;
    width: 31rem;
    height: 28rem;
  }
  .fv__right:after{
    display: none;
  }
  .fv-form{
    padding: 3.2rem 2rem;
    border-radius: 24px;
  }
  .fv-form :is(input, select, textarea) {
    padding: 0.8rem;
    font-size: 1.6rem;
  }
  .fv-form__title{
    margin-bottom: 0.8rem;
    font-size: 2.2rem;
  }
  .fv-form__sub-title{
    margin-bottom: 1.6rem;
    font-size: 1.4rem;
  }
  .fv-form__sub-title::before{
    margin-right: 1.6rem;
  }
  .fv-form__sub-title::after{
    margin-left: 1.6rem;
  }
  .fv-form__sub-title-en{
    font-size: 1.4rem;
  }
  .fv-form__item{
    margin-bottom: 1rem;
  }
  .fv-form__label{
    margin-bottom: 0.8rem;
    font-size: 1.6rem;
  }
  .fv-form__required,
  .fv-form__any{
    top: -1px;
    margin-left: 8px;
    padding: 2px 4px;
    font-size: 1.2rem;
  }
  .fv-form textarea{
    min-height: 12rem;
  }
  .fv-form__privacy{
    margin-bottom: 1.2rem;
    font-size: 0.9rem;
  }
  .fv-form__privacy a:hover{
    text-decoration: none;
  }
  .fv-form__submit{
    padding: 1.6rem 2.4rem;
    font-size: 1.6rem;
  }
}

/*
.logo-slide
--------------------------------------------------------*/
.logo-slider {
  overflow: hidden;
  padding-top: 4rem;
  padding-bottom: 8rem;
}
.logo-slider__item {
  padding: 0 1.6rem;
}
.logo-slider__item img {
  height: 4rem;
  width: auto;
  display: block;
}
.slick-slide{
  width: auto!important;
}

@media screen and ( max-width:750px){
  .logo-slider {
    overflow: hidden;
    padding-top: 1.2rem;
    padding-bottom: 4.8rem;
  }
  .logo-slider__item img {
    height: 3.2rem;
  }
}


/*
.cta
--------------------------------------------------------*/
.cta{
  background: var(--main-color);
  padding-top: 6.4rem;
  padding-bottom: 4.8rem;
  color: var(--white-color);
}
.cta__tag{
  display: inline-block;
  background: var(--orange-grad);
  width: 16rem;
  margin-bottom: 1.6rem;
  padding: 0.5rem 1rem;
  border-radius: 80px;
  text-align: center;
  line-height: 1;
  font-size: 2rem;
  font-weight: 700;
  color: var(--white-color);
}
.cta__title{
  margin-bottom: 0.8rem;
  font-size: 3.2rem;
  font-weight: 900;
  font-family: "Josefin Sans", "Noto Sans JP", sans-serif;
}
.cta__title .cta__title-em{
  font-size: 145%;
}
.cta__body{
  gap: 2.4rem;
  justify-content: center;
  margin-bottom: 2.4rem;
}
.cta__item{
  background: url(../img/icon-check.svg) no-repeat center left / 2.1rem;
  padding: 0.4rem 0.4rem 0.4rem 2.8rem;
}
.cta__right{
  width: 35%;
}
.cta__diagnosis-tag{
  display: block;
  margin-bottom: 1.6rem;
  padding: 0.4rem 0.8rem;
  border-radius: 80px;
  border: 1.5px solid var(--white-color);
  text-align: center;
  font-size: 1.4rem;
  font-weight: 700;
 white-space: nowrap;
}
.cta__diagnosis-image{
  width: 92%;
  margin: auto;
}
.cta__actions{
  margin-bottom: 1.2rem;
  gap: 2.4rem;
  justify-content: center;
  align-items: flex-start;
}
.cta__actions > *{
  width: calc((100% - 2.4rem) / 2);
}
.cta__micro-copy{
  position: relative;
  margin-bottom: 0.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.5rem;
  color: var(--white-color);
}
.cta__micro-copy::before,
.cta__micro-copy:after{
  content: "";
  background: var(--white-color);
  width: 2px;
  height: 1.8rem;
}
.cta__micro-copy::before{
  transform: rotate(-30deg);
}
.cta__micro-copy:after{
  transform: rotate(30deg);
}
.cta__micro-copy-text{
  margin: 0 1rem;
}
.cta__tel-number{
  position: relative;
  display: block;
  margin-left: 4rem;
  padding: 0.6rem 0 0 0;
  text-align: center;
  line-height: 1;
  font-size: 5rem;
  font-family: "Josefin Sans", sans-serif;
  color: var(--white-color);
}
.cta__tel-number::before{
  position: absolute;
  left: -3.2rem;
  top: 50%;
  transform: translateY(-50%);
  content: "";
  width: 3rem;
  height: 3.3rem;
  background: url(../img/icon-tel-cta.svg) no-repeat center / contain;
}
.cta__tel-note{
  display: block;
  line-height: 1;
  font-size: 1.2rem;
  color: var(--white-color);
  text-align: center;
  font-family: "Josefin Sans", "Noto Sans JP", sans-serif;
}
.cta__button{
  display: block;
  position: relative;
  padding: 2.6rem 5.6rem;
  border-radius: 80px;
  line-height: 1.2;
  font-size: 2.1rem;
  font-weight: 900;
  text-shadow: 0 0 12px rgba(89, 53, 14, 0.4);
  transition-duration: .4s;
  text-align: center;
  letter-spacing: 0.04em;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);
  transition: all 0.3s;
  color: var(--white-color);
}
.cta__button--document{
  background: var(--sub-color);
}
.cta__button--contact{
  background: var(--orange-grad);
}
.cta__button::before{
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 3rem;
  background: var(--white-color);
}
.cta__button--contact::before{
  width: 1.7rem;
  height: 1rem;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.cta__button--document::before{
  width: 1rem;
  height: 1.7rem;
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
}
.cta__button:hover{
  transform: scale(1.05);
}
.cta__limited-copy{
  text-align: center;
  font-size: 1.4rem;
  font-weight: 500;
}

@media screen and ( max-width:750px){
  .cta{
    padding-top: 4rem;
    padding-bottom: 2.4rem;
  }
  .cta__tag{
    display: block;
    width: 14rem;
    margin: 0 auto 0.8rem;
    padding: 0.6rem 1rem;
    font-size: inherit;
  }
  .cta__title{
    margin-bottom: 0.8rem;
    text-align: center;
    font-size: 1.8rem;
  }
  .cta__title .cta__title-em{
    font-size: 135%;
  }
  .cta__body{
    gap: 2.4rem;
    justify-content: center;
    margin-bottom: 2.4rem;
  }
  .cta__left{
    width: 100%;
  }
  .cta__item{
    background: url(../img/icon-check.svg) no-repeat center left / 1.7rem;
    padding: 0.2rem 0.4rem 0.2rem 2.2rem;
    font-size: 1.4rem;
  }
  .cta__right{
    width: 100%;
  }
  .cta__diagnosis-tag{
    margin-bottom: 1.2rem;
    padding: 0.4rem 0.4rem;
    font-size: 1.3rem;
  }
  .cta__diagnosis-image{
    width: 48%;
  }
  .cta__actions{
    margin-bottom: 1.2rem;
    gap: 1.2rem;
  }
  .cta__actions > *{
    width: 100%;
  }
  .cta__micro-copy{
    margin-bottom: 0.5rem;
    font-size: 1.2rem;
  }
  .cta__micro-copy::before,
  .cta__micro-copy:after{
    width: 2px;
    height: 1.8rem;
  }
  .cta__micro-copy-text{
    margin: 0 1rem;
  }
  .cta__button{
    padding: 1.8rem 4rem;
    border-radius: 80px;
    font-size: 1.8rem;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);
  }
  .cta__button::before{
    right: 2rem;
  }
  .cta__button--contact::before{
    width: 1.3rem;
    height: 0.8rem;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
  }
  .cta__button--document::before{
    width: 0.8rem;
    height: 1.3rem;
    clip-path: polygon(0 0, 0% 100%, 100% 50%);
  }
  .cta__limited-copy{
    font-size: 1rem;
  }

}



/*
.problem
--------------------------------------------------------*/
.problem{
  position: relative;
  background: var(--bg-light-blue);
  margin-bottom: 8.8rem;
  padding-top: 8.8rem;
  padding-bottom: 0;
}
.problem::before{
  content: "";
  position: absolute;
  width: 100%;
  height: 8rem;
  bottom: -7.9rem;
  left: 0;
  right: 0;
  background: var(--bg-light-blue);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.problem__title{
  margin-bottom: 4rem;
}
.problem__inner{
  width: min(100%,96rem);
}
.problem__body{
  margin-bottom: 4rem;
  justify-content: center;
}
.problem__image{
  margin-top: 8.8rem;
  margin-left: 0.8rem;
  width: min(100%,11.3rem);
}
.problem__item{
  padding: 1.4rem 3.2rem;
  border-radius: 80px;
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
  background: #888;
  text-align: center;
  line-height: 1.45;
  color: var(--white-color);
  font-weight: 700;
}
.problem__list--left{
  margin-top: 1.6rem;
}
.problem__list--left .problem__item + .problem__item{
  margin-top: 4.8rem;
}
.problem__list--right .problem__item + .problem__item{
  margin-top: 4.4rem;
}
.problem__list--left .problem__item:nth-of-type(2){
  margin-right: 4.8rem;
}
.problem__list--left .problem__item:nth-of-type(3){
  margin-right: 4rem;
}
.problem__list--right .problem__item:nth-of-type(1){
  margin-left: -2.8rem;
}
.problem__list--right .problem__item:nth-of-type(2){
  margin-left: 4.8rem;
}
.problem__bridge {
  width: min(100%,39rem);
  margin: 0 auto;
}
.problem__message{
  margin-top: -1.6rem;
  text-align: center;
  font-size: 5.6rem;
  font-family: "Josefin Sans", "Noto Sans JP", sans-serif;
  font-weight: 900;
}

@media screen and ( max-width:750px){
  .problem{
    margin-bottom: 2.4rem;
    padding-top: 4.8rem;
    padding-bottom: 0;
  }
  .problem::before {
    height: 4rem;
    bottom: -3.9rem;
  }
  .problem__title{
    margin-bottom: 1.6rem;
  }
  .problem__body{
    margin-bottom: 2.4rem;
  }
  .problem__image{
    width: 20%;
    margin: 1.2rem auto 2rem;
  }
  .problem__item{
    display: inline-block;
    padding: 1rem 3.2rem;
  }
  .problem__list{
    text-align: center;
  }
  .problem__list--left{
    margin-top: 0;
    margin-bottom: 0.8rem;
  }
  .problem__list--left .problem__item + .problem__item{
    margin-top: 1.2rem;
  }
  .problem__list--right .problem__item + .problem__item{
    margin-top: 1.2rem;
  }
  .problem__list--left .problem__item:nth-of-type(2){
    margin-right: auto;
  }
  .problem__list--left .problem__item:nth-of-type(3){
    margin-right: auto;
  }
  .problem__list--right .problem__item:nth-of-type(1){
    margin-left: auto;
  }
  .problem__list--right .problem__item:nth-of-type(2){
    margin-left: auto;
  }
  .problem__bridge {
    width: 72%;
  }
  .problem__message{
    margin-top: -1.2rem;
    font-size: 3.2rem;
  }
}


/*
.about
--------------------------------------------------------*/
.about{
  position: relative;
  background: 
  url(../img/about-bg-blob01.svg) no-repeat top 11.8rem right / 35.3rem auto,
  url(../img/about-bg-blob02.svg) no-repeat top 88.7rem left / 31.5rem auto,
  url(../img/about-bg-blob03.svg) no-repeat top 118.8rem right / 30.7rem auto;
}
.about__intro{
  margin-bottom: 8.8rem;
  padding: 4rem 8.8rem;
  gap: 4.8rem;
  align-items: center;
}
.about__intro-image{
  width: 10.5rem;
}
.about__intro-text{
  width: calc(100% - 15.3rem);
}
.needs__title{
  position: relative;
  margin-bottom: 3.2rem;
  padding-bottom: 1.2rem;
  text-align: center;
  font-size: 4rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}
.needs__title:before{
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 6px;
  background: var(--sub-color);
}
.needs__list{
  width: min(100%,88rem);
  margin: 0 auto 4rem;
}
.needs__item{
  padding: 4rem 4.8rem;
  gap: 3.2rem;
  align-items: center;
}
.needs__item + .needs__item{
  margin-top: 3.2rem;
}
.needs__item-image{
  width: 12rem;
}
.needs__item-detail{
  width: calc(100% - 15.2rem);
}
.needs__item-title{
  margin-bottom: 0.6rem;
  font-size: 2.4rem;
  font-weight: 900;
}
.needs__item-text{
  color: var(--gray-color);
}
.needs__bridge{
  width: 21.4rem;
  margin: 0 auto 6.4rem;
}
.effect__list{
  gap: 2.4rem;
}
.effect__item{
  width: calc((100% - 4.8rem) / 3);
  padding: 4rem 2rem;
}
.effect__item-image{
  margin: 0 auto 1.2rem;
}
.effect__item:nth-of-type(1) .effect__item-image{
  width: 9.7rem;
}
.effect__item:nth-of-type(2) .effect__item-image{
  width: 6.7rem;
  margin-top: 1.1rem;
}
.effect__item:nth-of-type(3) .effect__item-image{
  width: 11.1rem;
}
.effect__item-title{
  margin-bottom: 0.6rem;
  text-align: center;
  font-size: 2rem;
  font-weight: 900;
}
.effect__item-text{
  line-height: 1.5;
  color: var(--gray-color);
}


@media screen and ( max-width:750px){
  .about{
    position: relative;
    background: 
    url(../img/about-bg-blob01.svg) no-repeat top 44rem right / 17.65rem auto,
    url(../img/about-bg-blob02.svg) no-repeat top 132rem left / 15.75rem auto,
    url(../img/about-bg-blob03.svg) no-repeat top 170rem right / 15.35rem auto;
  }
  .about__title::before{
    top: -2rem;
    font-size: 4.6rem;
  }
  .about__intro{
    margin-bottom: 6.4rem;
    padding: 4rem 2.4rem;
    gap: 1.6rem;
    align-items: center;
    justify-content: center;
  }
  .about__intro-image{
    width: 32%;
  }
  .about__intro-text{
    width: 100%;
  }
  .needs__title{
    margin-bottom: 2rem;
    padding-bottom: 0.8rem;
    font-size: 2.4rem;
  }
  .needs__title:before{
    width: 8rem;
    height: 4px;
  }
  .needs__list{
    margin: 0 auto 1.6rem;
  }
  .needs__item{
    padding: 4rem 2.4rem;
    gap: 1.6rem;
    align-items: center;
    justify-content: center;
  }
  .needs__item + .needs__item{
    margin-top: 1.6rem;
  }
  .needs__item-image{
    width: 40%;
  }
  .needs__item-detail{
    width: 100%;
  }
  .needs__item-title{
    margin-bottom: 0.6rem;
    text-align: center;
    font-size: 1.8rem;
  }
  .needs__item-text{
    color: var(--gray-color);
  }
  .needs__bridge{
    width: 16rem;
    margin: 0 auto 1.2rem;
  }
  .effect__list{
    gap: 1.6rem;
  }
  .effect__item{
    width: 100%;
    padding: 4rem 2.4rem;
  }
  .effect__item-image{
    margin: 0 auto 1.2rem;
  }
  .effect__item:nth-of-type(1) .effect__item-image{
    width: 9.7rem;
  }
  .effect__item:nth-of-type(2) .effect__item-image{
    width: 6.7rem;
    margin-top: 1.1rem;
  }
  .effect__item:nth-of-type(3) .effect__item-image{
    width: 11.1rem;
  }
  .effect__item-title{
    margin-bottom: 0.6rem;
    text-align: center;
    font-size: 2rem;
    font-weight: 900;
  }
  .effect__item-text{
    line-height: 1.5;
    color: var(--gray-color);
  }
}


/*
#point
--------------------------------------------------------*/
.point{
  background: var(--bg-light-blue);
  overflow-x: hidden;
}
.point .c-sec-heading::before {
  color: rgba(0, 102, 255, 0.04);
}
.point-card{
  background: var(--white-color);
  padding: 6.4rem 7.2rem;
  box-shadow: 0px 15px 32px -10px rgba(0, 0, 0, .1);
  border: 4px solid rgba(0, 0, 0, 0.06);
}
.point-card__inner{
  align-items: center;
  gap: 4.8rem;
  max-width: 87rem;
}
.point-card + .point-card{
  margin-top: 6.4rem;
}
.point-card:nth-of-type(1),
.point-card:nth-of-type(3){
  border-radius: 0  64px 64px 0;
  margin-left: calc(50% - 50vw);
  border-left: none;
}
.point-card:nth-of-type(2){
  border-radius: 64px 0 0 64px;
  margin-right: calc(50% - 50vw);
  border-right: none;
}
.point-card:nth-of-type(1) .point-card__inner,
.point-card:nth-of-type(3) .point-card__inner{
  margin: 0 0 0 auto;
}
.point-card:nth-of-type(2) .point-card__inner{
  margin: 0 auto 0 0;
}
.point-card__image{
  width: 22.5rem;
}
.point-card__detail{
  width: calc(100% - 27.3rem);
}
.point-card__tag{
  display: inline-block;
  margin-bottom: 4rem;
  border-radius: 80px;
  background: var(--sub-color);
  padding: 0.8rem 4rem 0.3rem;
  line-height: 1;
  color: var(--white-color);
  font-weight: 900;
  font-family: "Josefin Sans", "Noto Sans JP", sans-serif;
  letter-spacing: 0.1em;
}
.point-card__tag-em{
  font-size: 120%;
  letter-spacing: 0.15em;
}
.point-card__title{
  margin-bottom: 1.2rem;
  font-size: 3.2rem;
  font-weight: 900;
}
.point-card__text{
  color: var(--gray-color);
}


@media screen and ( max-width:750px){
  .point-card{
    padding: 4rem 2.4rem 4rem 2.4rem;
  }
  .point-card__inner{
    align-items: center;
    justify-content: center;
    gap: 1.6rem;
    max-width: none;
  }
  .point-card + .point-card{
    margin-top: 2.4rem;
  }
  .point-card:nth-of-type(1),
  .point-card:nth-of-type(3){
    border-radius: 0  48px 48px 0;
  }
  .point-card:nth-of-type(2){
    border-radius: 48px 0 0 48px;
  }
  .point-card:nth-of-type(1) .point-card__inner,
  .point-card:nth-of-type(3) .point-card__inner{
    margin: 0 0 0 auto;
  }
  .point-card:nth-of-type(2) .point-card__inner{
    margin: 0 auto 0 0;
    flex-direction: column-reverse;
  }
  .point-card__image{
    width: 44%;
    margin: 0 auto 1.2rem;
  }
  .point-card__detail{
    width: 100%;
  }
  .point-card__tag{
    margin-bottom: 2.4rem;
    padding: 0.8rem 4rem 0.3rem;
    font-size: 1.4rem;
  }
  .point-card__tag-em{
    font-size: 120%;
    letter-spacing: 0.15em;
  }
  .point-card__title{
    margin-bottom: 0.8rem;
    font-size: 2.2rem;
  }
  .point-card__text{
    color: var(--gray-color);
  }
}

/*
#comparison
--------------------------------------------------------*/
.comparison{
  padding-top: 10rem;
}
.comparison__title{
  margin-bottom: 2.4rem;
  text-align: center;
  font-size: 2.8rem;
  font-weight: 900;
}
.comparison__title-em{
  font-size: 170%;
  font-weight: 900;
}
.comparison__image{
  width: min(100%,90rem);
  margin: 0 auto 4rem;
}
.comparison__message{
  justify-content: center;
  align-items: center;
  gap: 3.2rem;
}
.comparison__message-image{
  width: 15.8rem;
}
.comparison__message-title{
  margin-bottom: 0.4rem;
  font-size: 3.4rem;
  font-weight: 900;
  letter-spacing: 0.02em;
}
.comparison__message-text{
  font-size: 2rem;
  font-weight: 700;
}


@media screen and ( max-width:750px){
  .comparison{
    padding-top: 6.4rem;
  }
  .comparison__title{
    margin-bottom: 1.6rem;
    font-size: 1.5rem;
  }
  .comparison__title-em{
    display: inline-block;
    margin-top: 0.6rem;
    line-height: 1.25;
    font-size: 190%;
  }
  .comparison__image{
    width: min(100%,90rem);
    margin: 0 auto 2.4rem;
  }
  .comparison__message{
    justify-content: center;
    align-items: center;
    gap: 1.2rem;
  }
  .comparison__message-image{
    width: 40%;
  }
  .comparison__message-title{
    text-align: center;
    font-size: 2.4rem;
  }
  .comparison__message-text{
    text-align: center;
    font-size: 1.6rem;
  }

}


/*
#step
--------------------------------------------------------*/
.step__inner{
  width: min(100%,88rem);
}
.step__list{
  position: relative;
}
.step__list::before{
  content: "";
  position: absolute;
  top: 0;
  left: 3.4rem;
  bottom: 0;
  width: 3px;
  height: 100%;
  background: var(--sub-color);
}
.step__item{
  gap: 4rem;
}
.step__item + .step__item{
  margin-top: 3.2rem;
}
.step__tag{
  width: 7rem;
  height: 7rem;
  background: var(--sub-color);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1;
  font-size: 1.4rem;
  font-family: "Josefin Sans", sans-serif;
  color: var(--white-color);
  letter-spacing: 0.1em;
}
.step__tag-inner{
  position: relative;
  top: 0.4rem;
}
.step__tag-em{
  font-size: 230%;
}
.step__detail{
  margin-top: 2.4rem;
  flex: 1;
}
.step__list-title{
  margin-bottom: 0.8rem;
  font-size: 2.4rem;
  font-weight: 900;
}
.step__list-text{
  color: var(--gray-color);
}

@media screen and ( max-width:750px){
  .step__list::before{
    left: 1.9rem;
    width: 3px;
  }
  .step__item{
    gap: 1.2rem;
  }
  .step__item + .step__item{
    margin-top: 2.4rem;
  }
  .step__tag{
    width: 4rem;
    height: 4rem;
    font-size: 0.9rem;
  }
  .step__tag-inner{
    position: relative;
    top: 0.4rem;
  }
  .step__tag-em{
    font-size: 230%;
  }
  .step__detail{
    margin-top: 1.2rem;
    flex: 1;
  }
  .step__list-title{
    margin-bottom: 0.4rem;
    font-size: 1.8rem;
  }
  .step__list-text{
    color: var(--gray-color);
    font-size: 1.4rem;
  }
}


/*
#faq
--------------------------------------------------------*/
.faq{
  background: var(--bg-light-blue);
}
.faq__inner{
  width: min(100%,88rem);
}
.faq .c-sec-heading::before {
  color: rgba(0, 102, 255, 0.04);
}
.faq__item{
  background: var(--white-color);
  border-radius: 24px;
}
.faq__item + .faq__item{
  margin-top: 2.4rem;
}
.faq__question{
  position: relative;
  padding: 3.2rem 6.4rem 3.2rem 8.4rem;
  line-height: 1.45;
  text-align: left;
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}
.faq__question::before,
.faq__answer::before{
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 4rem;
  height: 4rem;
  border-radius: 0.8rem;
  left: 3.2rem;
  font-size: 1.6rem;
  font-family: "Josefin Sans", sans-serif;
  font-style: 700;
}
.faq__question::before{
  top: 50%;
  transform: translateY(-50%);
  content: "Q";
  color: var(--white-color);
  background: var(--sub-color);
}
.faq__answer{
  position: relative;
  line-height: 1.8;
}
.faq__answer::before{
  top: 0;
  content: "A";
  color: #E65100;
  background: #FDEBE1;
}
.faq__answer{
  padding: 0.5rem 6.4rem 4rem 8.4rem;
  text-align: justify;
  color: var(--gray-color);
}
.faq__toggle {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  border: 2px solid var(--bg-light-blue);
  padding: 0.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  border-radius: 100%;
  top: 50%;
  transform: translateY(-50%);
  right: 1.6rem;
  transition: all 0.3s;
}
.faq__toggle.open{
  transform: translateY(-50%) rotate(-180deg);
}

.js-accordion__body{
  display: none;
}

@media screen and ( max-width:750px){
  .faq__item {
    border-radius: 16px;
  }
  .faq__item + .faq__item{
    margin-top: 2.4rem;
  }
  .faq__question{
    padding: 1.6rem 5.6rem 1.6rem 6.2rem;
    font-size: 1.5rem;
  }
  .faq__question::before,
  .faq__answer::before{
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 8px;
    left: 1.8rem;
    font-size: 1.6rem;
  }
  .faq__answer{
    padding: 0.5rem 2rem  2.4rem 6.2rem;
    line-height: 1.5;
  }
  .faq__toggle{
    width: 3.2rem;
    height: 3.2rem;
  }
}


/*
#form
--------------------------------------------------------*/
.form{
  background: var(--main-color);
}
.form__inner{
  width: min(100%,960px);
}
.form__title{
  font-size: 3.2rem;
  color: var(--white-color);
}
.form__title::before{
  color: rgba(255,255,255,0.08);
}
.form__title-em{
  font-size: 150%;
}
.form__body{
  background: var(--white-color);
  padding: 5.6rem 8rem;
  border-radius: 24px;
}
.form__grid{
  gap: 1.6rem 2.4rem;
}
.form__field{
  width: calc((100% - 2.4rem) / 2);
}
.form__field--full{
  width: 100%;
}
.form__label{
  display: block;
  margin-bottom: 0.4rem;
}
.form__label-text{
  display: inline-block;
  font-weight: 700;
}
.form__required,
.form__any{
  position: relative;
  top: -2px;
  display: inline-block;
  margin-left: 0.4rem;
  border-radius: 4px;
  padding: 2px 4px;
  line-height: 1;
  font-size: 1.2rem;
  color: var(--white-color);
}
.form__required{
  background: var(--orange-grad);
}
.form__any{
  background: #aaa;
}
#bottom-message{
  min-height: 20rem;
  margin-bottom: 0.4rem;
}
.form__privacy-text{
  margin-bottom: 1.2rem;
  text-align: center;
  font-size: 1.4rem;
  font-weight: 400;
}
.form__privacy-text a{
  text-decoration: underline;
  font-weight: 400;
}
.form__privacy-text a:hover{
  text-decoration: none;
}
.form__submit-btn{
  display: block;
  background: var(--orange-grad);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);
  width: min(100%,36rem);
  margin: auto;
  padding: 2.4rem 2rem;
  border-radius: 60px;
  line-height: 1;
  font-size: 2rem;
  font-weight: 900;
  /* letter-spacing: 0.04em; */
  color: var(--white-color);
  transition: all 0.3s;
}
.form__submit-btn:hover{
  transform: scale(1.05);
}

@media screen and ( max-width:750px){
  .form{
    padding-top: 6.4rem;
  }
  .form__title{
    font-size: 1.6rem;
  }
  .form__title-em{
    font-size: 140%;
  }
  .form__body{
    padding: 4rem 2rem 4rem;
  }
  .form__grid{
    gap: 1rem;
  }
  .form__field{
    width: 100%;
    font-size: 1.6rem;
  }
  .form__field--full{
    width: 100%;
  }
  .form__required, .form__any{
    top: -1px;
  }
  #bottom-message{
    min-height: 16rem;
  }
  .form__privacy-text{
    margin-bottom: 1.2rem;
    font-size: 1rem;
  }
  .form__privacy-text a{
    text-decoration: underline;
    font-weight: 400;
  }
  .form__submit-btn{
    padding: 2rem 2rem;
    font-size: 1.6rem;
  }
}


/*
#company
--------------------------------------------------------*/

.company__table{
  width: min(100%,80rem);
  margin: auto;
  border-collapse: separate;
}
.company__table-label,
.company__table-value{
  padding: 1.2rem 1.6rem;
  border-radius: 8px;
  border: 1px solid var(--white-color);
}
.company__table-label{
  width: 30%;
  background: #F2F6FE;
  text-align: center;
}
.company__table-value{
  width: 70%;
  background: #F5F5F5;
}

@media screen and ( max-width:750px){
  .company__table-label,
  .company__table-value{
    padding: 0.8rem;
    font-size: 1.4rem;
  }
  .company__table-label{
    width: 25%;
  }
  .company__table-value{
    width: 75%;
  }
}