@charset "UTF-8";
/*
 * htmlのフォントサイズ
 * @args ベースの画面幅
 */
/*
   * ルートのフォントサイズを基準にフォントサイズを可変にする
   * @args 最大値（デザイン上の数値）
   */
/*
   * get_vwの設定
   */
/*
   * breakpointの設定
   */
/** --------------------------------
* cssの値を単位を除いて数字だけにしてくれる関数
*
* @param 数字と単位を含む値 10ox, 3remなど
*/
/** --------------------------------
* 値の「単位」を取得する関数
*
* @param $value 数字と単位を含む値 10ox, 3remなど
*/
/** --------------------------------
* pxやremをvwに変換してくれる関数
*
* @param $viewport pcデザインの横幅
* @param $fontSize フォントサイズ(pxでもremでも)
*/
/** --------------------------------
* フォントサイズをレスポンシブで調整する関数
*
* @param $pc pcのフォントサイズ
* @param $sp spのフォントサイズ
*/
.pc_contents {
  display: block !important;
}
@media screen and (max-width: 767px) {
  .pc_contents {
    display: none !important;
  }
}

.pc_contentsFlex {
  display: flex !important;
}
@media screen and (max-width: 767px) {
  .pc_contentsFlex {
    display: none !important;
  }
}

.sp_contents {
  display: none !important;
}
@media screen and (max-width: 767px) {
  .sp_contents {
    display: block !important;
  }
}

.sp_contentsFlex {
  display: none !important;
}
@media screen and (max-width: 767px) {
  .sp_contentsFlex {
    display: flex !important;
  }
}

html {
  scroll-behavior: smooth;
}

ul.mt-3.mb-9.mx-auto.text-xs {
  max-width: 1060px;
  padding: 0.75rem 9px 0;
}
@media screen and (max-width: 767px) {
  ul.mt-3.mb-9.mx-auto.text-xs {
    padding: 0.75rem 9px 0;
  }
}

.max-w-content {
  width: 100vw;
  max-width: 100vw;
}
@media screen and (max-width: 767px) {
  .max-w-content {
    padding: 0;
  }
}

main.max-w-content.mx-auto.px-4 {
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.lp-content {
  font-family: "noto-sans-cjk-jp", sans-serif;
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.09em;
  line-height: 2.3571428571;
  color: #2a2a2a;
  background: #fff;
  padding-bottom: clamp(60px, 7.5vw, 90px);
}
@media screen and (max-width: 767px) {
  .lp-content {
    font-size: 11px;
  }
}
.lp-content .kv {
  height: unset;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .lp-content .kv {
    height: auto;
  }
}
.lp-content .kv__inner {
  position: relative;
}
.lp-content .kv__title {
  width: 25.6666666667vw;
  position: absolute;
  bottom: 5.8333333333vw;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .lp-content .kv__title {
    width: 81.3333333333vw;
    bottom: 18.6666666667vw;
  }
}
.lp-content .kv__slider-wrap {
  display: grid;
  grid-template-columns: repeat(3, 33.3%);
  background: #efefed;
}
@media screen and (max-width: 767px) {
  .lp-content .kv__slider-wrap {
    display: block;
    width: 100%;
  }
}
.lp-content .kv__slider {
  width: 100%;
}
.lp-content .kv__slide {
  width: 100%;
}
.lp-content .kv__slide img {
  width: 101%;
  height: 101%;
  object-fit: cover;
}
.lp-content .about {
  padding: clamp(70px, 10vw, 120px) 0 clamp(93px, 10vw, 120px);
  text-align: center;
  background: #efefed;
}
.lp-content .about__text {
  margin-bottom: clamp(46px, 5.5vw, 66px);
}
.lp-content .about .anchors {
  display: grid;
  grid-template-columns: repeat(3, clamp(1px, 12.9166666667vw, 155px));
  justify-content: center;
  gap: clamp(13px, 1.6666666667vw, 20px);
}
@media screen and (max-width: 767px) {
  .lp-content .about .anchors {
    grid-template-columns: repeat(3, 95px);
  }
}
.lp-content .about .anchors .anchor {
  width: clamp(1px, 12.9166666667vw, 155px);
  height: clamp(1px, 17.5833333333vw, 211px);
  position: relative;
}
@media screen and (max-width: 767px) {
  .lp-content .about .anchors .anchor {
    width: 95px;
    height: 132px;
  }
}
.lp-content .about .anchors .anchor__img, .lp-content .about .anchors .anchor__img--hov {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transition: opacity 0.2s ease;
}
.lp-content .about .anchors .anchor__img {
  z-index: 1;
}
.lp-content .about .anchors .anchor__img--hov {
  z-index: 0;
}
.lp-content .about .anchors .anchor:hover .anchor__img {
  opacity: 0;
}
.lp-content .section {
  padding: clamp(35px, 5.8333333333vw, 70px) 0 clamp(70px, 5.8333333333vw, 70px);
  background: #a7c0bd;
  color: #fff;
  margin: 0;
}
.lp-content .section .header-img {
  width: clamp(1px, 66.6666666667vw, 800px);
  display: flex;
  justify-content: flex-start;
  margin: 0 auto clamp(30px, 2.5vw, 30px);
}
@media screen and (max-width: 767px) {
  .lp-content .section .header-img {
    width: 90%;
    margin-bottom: -25px;
  }
}
.lp-content .section .header-img img {
  width: clamp(90px, 7.5vw, 90px);
}
.lp-content .section .inner {
  width: clamp(1px, 66.6666666667vw, 800px);
  display: flex;
  justify-content: space-between;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .lp-content .section .inner {
    width: 100%;
    flex-direction: column;
  }
}
.lp-content .section .slider-wrap {
  width: clamp(1px, 33.3333333333vw, 400px);
  position: relative;
}
@media screen and (max-width: 767px) {
  .lp-content .section .slider-wrap {
    width: 100%;
  }
}
.lp-content .section .slider-wrap .circleAnim {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
}
.lp-content .section .slider-wrap .circleAnim__inner {
  width: 100%;
}
.lp-content .section .slider-wrap .circleAnim .sliderHead {
  position: absolute;
  top: 0;
  left: 0;
}
.lp-content .section .slider {
  width: clamp(1px, 33.3333333333vw, 400px);
}
@media screen and (max-width: 767px) {
  .lp-content .section .slider {
    width: 100%;
    margin-bottom: 40px;
  }
}
.lp-content .section .slide {
  width: 100%;
}
.lp-content .section .slide img {
  width: 101%;
  height: 101%;
  object-fit: cover;
  display: block;
}
.lp-content .section .slick-prev {
  left: 20px;
  z-index: 1;
}
.lp-content .section .slick-next {
  right: 20px;
  z-index: 1;
}
.lp-content .section .slick-prev:before,
.lp-content .section .slick-next:before {
  content: "";
  display: block;
  width: 13px;
  height: 20px;
  background: url("../img/lp/slider-arrow.png") no-repeat;
  background-size: contain;
}
.lp-content .section .slick-next:before {
  transform: rotate(180deg);
}
.lp-content .section .slick-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  bottom: -17px;
}
@media screen and (max-width: 767px) {
  .lp-content .section .slick-dots {
    bottom: -25px;
  }
}
.lp-content .section .slick-dots li {
  width: 8px;
  height: 8px;
  margin: 0;
}
.lp-content .section .slick-dots li button:before {
  content: "";
  width: 8px;
  height: 8px;
  background: #fff;
  border-radius: 50%;
  opacity: 1;
}
.lp-content .section .slick-dots li.slick-active button:before {
  background: #595757;
}
.lp-content .section .title-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: clamp(25px, 2.0833333333vw, 25px);
  margin-top: -10px;
}
.lp-content .section .styling {
  font-family: "ivyora-text", serif;
  font-size: clamp(20px, 1.6666666667vw, 20px);
  letter-spacing: 0;
  font-weight: 400;
  font-style: italic;
}
.lp-content .section .line {
  position: relative;
  width: 1px;
  height: clamp(32px, 2.6666666667vw, 32px);
  overflow: hidden;
}
.lp-content .section .line .line__inner {
  position: absolute;
  top: -100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}
.lp-content .section .nr {
  font-family: "futura-pt", sans-serif;
  font-size: clamp(25px, 2.0833333333vw, 25px);
  letter-spacing: 0.03em;
  line-height: 1;
  font-weight: 500;
  margin-top: clamp(15px, 1.25vw, 15px);
  position: relative;
}
.lp-content .section .nr::after {
  content: ".";
  font-family: "futura-pt", sans-serif;
  position: absolute;
  bottom: 0;
  right: -7px;
  font-size: clamp(25px, 2.0833333333vw, 25px);
  letter-spacing: 0.03em;
  line-height: 1;
  font-weight: 500;
}
.lp-content .section .title {
  margin-top: clamp(1px, 1.6666666667vw, 20px);
}
.lp-content .section .title span {
  font-family: "ivyora-text", serif;
  font-size: clamp(96px, 8vw, 96px);
  opacity: 0;
  line-height: 1;
}
.lp-content .section .title .italic {
  font-style: italic;
}
.lp-content .section .subtitle {
  font-size: clamp(10px, 0.8333333333vw, 10px);
  margin-top: calc(-1 * clamp(1px, 0.4166666667vw, 5px));
}
.lp-content .section .text {
  font-size: clamp(13px, 1.0833333333vw, 13px);
  line-height: 1.9;
  letter-spacing: 0;
  text-align: center;
  margin-bottom: clamp(1px, 6.25vw, 75px);
}
@media screen and (max-width: 767px) {
  .lp-content .section .text {
    margin-bottom: 40px;
  }
}
.lp-content .section .credits {
  width: clamp(1px, 21.6666666667vw, 260px);
  display: flex;
  flex-direction: column;
  gap: clamp(14px, 1.1666666667vw, 14px);
  margin: 0 auto clamp(1px, 4vw, 48px);
}
@media screen and (max-width: 767px) {
  .lp-content .section .credits {
    width: 240px;
    margin: 0 auto 40px;
  }
}
.lp-content .section .credits .credit {
  width: 100%;
  display: flex;
  align-items: center;
  line-height: 1;
}
.lp-content .section .credits .credit .name,
.lp-content .section .credits .credit .price,
.lp-content .section .credits .credit .btn {
  font-family: "ivyora-text", serif;
  font-weight: 500;
  transform: scale(0.7, 1);
  display: inline-block;
}
.lp-content .section .credits .credit .name {
  font-size: clamp(15px, 1.25vw, 15px);
}
.lp-content .section .credits .credit .divider {
  position: relative;
  flex: 1;
}
.lp-content .section .credits .credit .divider__inner {
  position: absolute;
  width: 100%;
  height: 1px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background: #fff;
}
.lp-content .section .credits .credit .price {
  font-size: clamp(15px, 1.25vw, 15px);
}
.lp-content .section .credits .credit .price .tax {
  font-size: clamp(11px, 0.9166666667vw, 11px);
}
.lp-content .section .credits .credit .btn {
  width: clamp(33px, 2.75vw, 33px);
  height: clamp(14px, 1.1666666667vw, 14px);
  font-size: clamp(12px, 1vw, 12px);
  color: #a7c0bd;
  background: #fff;
  border-radius: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  letter-spacing: -0.1em;
}
.lp-content .section .recommend {
  width: clamp(205px, 17.0833333333vw, 205px);
  display: flex;
  justify-content: center;
  align-items: center;
  background: #3e3a39;
  color: #fff;
  border-radius: 50px;
  font-family: "futura-pt", sans-serif;
  font-size: clamp(17px, 1.4166666667vw, 17px);
  letter-spacing: 0;
  margin-inline: auto;
}
.lp-content .section--02 {
  background: #6cb5d5;
}
.lp-content .section--02 .header-img {
  justify-content: flex-end;
}
.lp-content .section--02 .title-wrap {
  margin-top: -17px;
  margin-bottom: clamp(1px, 1.0833333333vw, 13px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--02 .title-wrap {
    margin-bottom: 25px;
  }
}
.lp-content .section--02 .inner {
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .lp-content .section--02 .inner {
    flex-direction: column;
  }
}
.lp-content .section--02 .inner .text {
  margin-bottom: clamp(1px, 1.6666666667vw, 20px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--02 .inner .text {
    margin-bottom: 40px;
  }
}
.lp-content .section--02 .inner .credits {
  width: clamp(1px, 20vw, 240px);
  margin: 0 auto clamp(1px, 2.8333333333vw, 34px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--02 .inner .credits {
    width: 240px;
    margin: 0 auto 40px;
  }
  .lp-content .section--02 .inner .credits .credit .btn {
    color: #6cb5d5;
  }
}
.lp-content .section--03 {
  background: #b7b8a2;
}
.lp-content .section--03 .inner .credits {
  margin: 0 auto clamp(1px, 3.1666666667vw, 38px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--03 .inner .credits {
    margin-bottom: 40px;
  }
}
.lp-content .section--03 .inner .credits .credit .btn {
  color: #b7b8a2;
}
.lp-content .section--04 {
  background: #c9bfc1;
}
.lp-content .section--04 .header-img {
  justify-content: flex-end;
}
.lp-content .section--04 .inner {
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .lp-content .section--04 .inner {
    flex-direction: column;
  }
}
.lp-content .section--04 .inner .text {
  margin-bottom: clamp(1px, 3vw, 36px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--04 .inner .text {
    margin-bottom: 40px;
  }
}
.lp-content .section--04 .inner .credits {
  margin: 0 auto clamp(1px, 3.6666666667vw, 44px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--04 .inner .credits {
    margin: 0 auto 40px;
  }
}
.lp-content .section--04 .inner .credits .credit .btn {
  color: #c9bfc1;
}
.lp-content .section--05 {
  background: #c3aca0;
}
.lp-content .section--05 .inner .text {
  margin-bottom: clamp(1px, 8.5vw, 102px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--05 .inner .text {
    margin-bottom: 40px;
  }
}
.lp-content .section--05 .inner .credits {
  margin: 0 auto clamp(1px, 3.5833333333vw, 43px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--05 .inner .credits {
    margin: 0 auto 40px;
  }
}
.lp-content .section--05 .inner .credits .credit .btn {
  color: #c3aca0;
}
.lp-content .section--06 {
  background: #d55a4e;
}
.lp-content .section--06 .header-img {
  justify-content: flex-end;
}
.lp-content .section--06 .inner {
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .lp-content .section--06 .inner {
    flex-direction: column;
  }
}
.lp-content .section--06 .inner .text {
  margin-bottom: clamp(1px, 11vw, 132px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--06 .inner .text {
    margin-bottom: 40px;
  }
}
.lp-content .section--06 .inner .credits {
  margin: 0 auto clamp(1px, 3.6666666667vw, 44px);
}
@media screen and (max-width: 767px) {
  .lp-content .section--06 .inner .credits {
    margin: 0 auto 40px;
  }
}
.lp-content .section--06 .inner .credit .btn {
  color: #d55a4e;
}
.lp-content .staff {
  padding: clamp(80px, 12.9166666667vw, 155px) 0 clamp(85px, 13.75vw, 165px);
}
.lp-content .staff__title {
  width: fit-content;
  font-family: "ivyora-text", serif;
  font-weight: 500;
  font-size: clamp(20px, 3.0833333333vw, 37px);
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  margin: 0 auto clamp(15px, 1.25vw, 15px);
  transform: scale(0.7, 1);
  display: inline-block;
  display: block;
}
.lp-content .staff__text {
  font-family: "ivyora-text", serif;
  font-weight: 400;
  font-size: clamp(14px, 1.4166666667vw, 17px);
  letter-spacing: 0;
  line-height: 1.88;
  text-align: center;
}
.lp-content .lp-contents {
  position: relative;
}
.lp-content .lp-contents .page-top {
  position: absolute;
  top: -14%;
  right: clamp(26px, 4.6666666667vw, 56px);
  width: clamp(13px, 2.0833333333vw, 25px);
  height: clamp(65px, 9.8333333333vw, 118px);
}
.lp-content .lp-contents__title-wrap {
  width: clamp(1px, 75vw, 900px);
  border-bottom: 1px solid #000;
  padding-bottom: clamp(1px, 100vw, 10px);
  margin: 0 auto clamp(30px, 5vw, 60px);
}
@media screen and (max-width: 767px) {
  .lp-content .lp-contents__title-wrap {
    width: 85.3%;
  }
}
.lp-content .lp-contents__title {
  width: fit-content;
  font-family: "ivyora-text", serif;
  font-weight: 500;
  font-size: clamp(20px, 3.0833333333vw, 37px);
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  margin: 0 auto clamp(5px, 1.25vw, 15px);
  transform: scale(0.7, 1);
  display: inline-block;
  display: block;
}
.lp-content .lp-contents__inner {
  width: clamp(1px, 75vw, 900px);
  display: flex;
  gap: clamp(1px, 1.6666666667vw, 20px);
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .lp-content .lp-contents__inner {
    width: 85.3%;
    flex-wrap: wrap;
    gap: 30px 15px;
    margin-bottom: 40px;
  }
}
.lp-content .lp-contents .content {
  width: clamp(1px, 17.5vw, 210px);
  margin-bottom: clamp(1px, 6.6666666667vw, 80px);
}
@media screen and (max-width: 767px) {
  .lp-content .lp-contents .content {
    width: 40vw;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .lp-content .lp-contents .content__img {
    margin-bottom: 5px;
  }
}
.lp-content .lp-contents .content__date {
  font-size: clamp(11px, 1.25vw, 15px);
  color: grey;
}
.lp-content .lp-contents .content__text {
  font-size: clamp(11px, 1.1666666667vw, 14px);
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .lp-content .lp-contents .content__text {
    line-height: 1.4;
  }
}
.lp-content .lp-contents__btn {
  width: clamp(175px, 21.8333333333vw, 262px);
  height: clamp(43px, 5.3333333333vw, 64px);
  background: #3e3a39;
  border-radius: 200px;
  font-size: clamp(13px, 1.25vw, 15px);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
}