/*--------------------------------------------------------------------------
   overwrite
---------------------------------------------------------------------------*/
/* use
-----------------------------------------------------------------*/
/*==========================================================================

   mixin

===========================================================================*/
/*==========================================================================

   keyframes

===========================================================================*/
/* section
-----------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
  .m-page-lead__copy {
    margin-inline: -10px;
  }
}

/*--------------------------------------------------------------------------
   common
---------------------------------------------------------------------------*/
/* use
-----------------------------------------------------------------*/
/* section
-----------------------------------------------------------------*/
.section {
  padding-block: clamp(50px, 6.9444444444vw, 100px);
}
@media only screen and (max-width: 767px) {
  .section {
    padding-block: 50px;
  }
}

/*--------------------------------------------------------------------------
  #sec-why
---------------------------------------------------------------------------*/
/* use
-----------------------------------------------------------------*/
/* section
-----------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  #sec-history
---------------------------------------------------------------------------*/
/* use
-----------------------------------------------------------------*/
/* section
-----------------------------------------------------------------*/
.sec-history {
  position: relative;
  padding-top: clamp(50px, 6.9444444444vw, 100px);
}
@media only screen and (max-width: 767px) {
  .sec-history {
    padding-top: 50px;
  }
}
.sec-history::before {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(42.5px, 5.9027777778vw, 85px);
  width: 1px;
  height: 100%;
  background: #bbb;
}
@media only screen and (max-width: 767px) {
  .sec-history::before {
    left: 35px;
  }
}
.sec-history .l-flex-grid {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.sec-history__content {
  position: relative;
}
.sec-history__main {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: clamp(70px, 9.7222222222vw, 140px);
  width: 50%;
  padding-bottom: clamp(40px, 5.5555555556vw, 80px);
}
@media only screen and (max-width: 767px) {
  .sec-history__main {
    width: auto;
    gap: 50px;
    padding-bottom: 50px;
  }
}
.sec-history__block {
  position: relative;
  padding-inline: clamp(71px, 9.8611111111vw, 142px) clamp(40px, 5.5555555556vw, 80px);
}
@media only screen and (max-width: 767px) {
  .sec-history__block {
    padding-inline: 60px 20px;
  }
}
.sec-history__hdg-en {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  color: #7B7A78;
  font-family: "Montserrat", sans-serif;
  font-size: clamp(15px, 2.0833333333vw, 30px);
  letter-spacing: 4.8px;
  line-height: 1;
  white-space: nowrap;
}
@media only screen and (max-width: 767px) {
  .sec-history__hdg-en {
    font-size: 20px;
  }
}
.sec-history__hdg-ja {
  position: relative;
  padding-left: clamp(30px, 4.1666666667vw, 60px);
  color: #fff;
  font-size: clamp(10px, 1.3888888889vw, 20px);
  letter-spacing: 3.4px;
  line-height: 1;
}
@media only screen and (max-width: 767px) {
  .sec-history__hdg-ja {
    padding-left: 30px;
    font-size: 18px;
    line-height: 1.6;
  }
}
.sec-history__hdg-ja::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: clamp(25px, 3.4722222222vw, 50px);
  height: 1px;
  background: #ddd;
}
@media only screen and (max-width: 767px) {
  .sec-history__hdg-ja::before {
    top: 0.8em;
    width: 20px;
  }
}
.sec-history__item {
  margin-top: clamp(40px, 5.5555555556vw, 80px);
}
@media only screen and (max-width: 767px) {
  .sec-history__item {
    margin-top: 30px;
  }
}
.sec-history__item-data {
  position: relative;
  color: #7B7A78;
  font-family: "Montserrat", sans-serif;
  font-size: 13px;
  letter-spacing: 2px;
  line-height: 1;
}
.sec-history__item-data::before {
  content: "";
  position: absolute;
  top: 2px;
  left: -4.37vw;
  width: 12px;
  height: 12px;
  background: #7B7A78;
  border-radius: 50%;
}
@media screen and (min-width: 1440px) {
  .sec-history__item-data::before {
    left: -63px;
  }
}
@media only screen and (max-width: 767px) {
  .sec-history__item-data::before {
    left: -30px;
  }
}
.sec-history__item-hdg {
  margin-top: clamp(7.5px, 1.0416666667vw, 15px);
  color: #fff;
  font-size: clamp(8px, 1.1111111111vw, 16px);
  font-weight: 700;
  letter-spacing: 1.6px;
}
@media only screen and (max-width: 767px) {
  .sec-history__item-hdg {
    margin-top: 10px;
    font-size: 15px;
  }
}
.sec-history__item-hdg span {
  font-size: 13px;
  font-weight: 400;
}
@media only screen and (max-width: 767px) {
  .sec-history__item-hdg span {
    font-size: 12px;
  }
}
.sec-history__item-txt {
  margin-top: clamp(6px, 0.8333333333vw, 12px);
  color: #fff;
  font-size: 13px;
  letter-spacing: 0.9px;
  line-height: 2;
}
@media only screen and (max-width: 767px) {
  .sec-history__item-txt {
    margin-top: 10px;
  }
}
.sec-history__img {
  position: sticky;
  top: 0;
  width: 50%;
}
@media only screen and (max-width: 767px) {
  .sec-history__img {
    display: none;
  }
}
/*--------------------------------------------------------------------------
  #sec-team
---------------------------------------------------------------------------*/
/* use
-----------------------------------------------------------------*/
/* section
-----------------------------------------------------------------*/
.sec-team__img {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .sec-team__img {
    width: 80%;
    margin-inline: auto;
  }
}
.sec-team__txt {
  margin-top: clamp(35px, 4.8611111111vw, 70px);
  font-size: 13px;
  line-height: 2;
  text-align: center;
}
.sec-team__txt strong {
  display: block;
  margin-block: clamp(10px, 1.3888888889vw, 20px);
  font-size: clamp(8.5px, 1.1805555556vw, 17px);
  font-weight: 600;
}
@media only screen and (max-width: 767px) {
  .sec-team__txt strong {
    font-size: 16px;
  }
}

/*--------------------------------------------------------------------------
   custom animation
---------------------------------------------------------------------------*/
/* use
-----------------------------------------------------------------*/
/* section
-----------------------------------------------------------------*/
/*# sourceMappingURL=about-story.css.map */