@charset "UTF-8";

/* ===============================================### 
可変設定
###=============================================== */
.lp_variable {
  /*デザインの値*/
  --pc-width: 1400;/*PCデザイン幅*/
  --sp-width: 750;/*SPデザイン幅*/
  --pc-artboard-width: 375;/*SP共通デザイン幅*/
  --sp-artboard-width: 750;/*PC共通デザイン幅*/
  /*可変率の計算式*/
  --formula: calc(var(--variable) * var(--ratio));/*SP,PC共通箇所の可変割合の計算式*/
  --formula_pc: calc(var(--variable) * 1);/*PCデザインの可変割合の計算式*/
}

/* PC画面幅 1401px以上 固定 */
@media (min-width: 1401px) {
  .lp_variable {
  --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width)); /* PCとSPのデザイン幅の比 */
  --variable: 1px; /* 固定値（可変しない） */
  }
}

/* PC画面幅 768～1400px 可変 */
@media (min-width: 768px) and (max-width: 1400px) {
  .lp_variable {
  --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width)); /* PCとSPのデザイン幅の比 */
  --variable: calc(100vw / var(--pc-width)); /* 画面幅に基づく可変値 */
  }
}

/* SP画面幅 767px以下 可変 */
@media (max-width: 767px) {
  .lp_variable {
  --ratio: 1; /* 比率は1（変わらない） */
  --variable: calc(100vw / var(--sp-width)); /* 画面幅に基づく可変値 */
  }
}



/* ===============================================### 
初期設定
###=============================================== */
.SE250609limited{
  --font-ja: "zen-kaku-gothic-new", sans-serif;
  --font-en01: "futura-pt", sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-ex-bold: 800;
  font-style: normal;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-blue: #A5C5E6;
  --color-orange: #FF8247;
  color: #000000;
}

.SE250609limited * {
  box-sizing: border-box;
}

.SE250609limited img,
.SE250609limited svg{
  width: 100%;
  height: auto;
}

.SE250609limited a{
  display: block;
  width: 100%;
}

#footer{
  margin-top: 0;
}


/* ===========### PC用設定 ###=========== */
@media screen and (min-width: 768px) {
  .SE250609limited .hidden-desktop {
    display: none;
  }

  .SE250609limited .hidden-phone {
    display: block;
  }

  .SE250609limited .image-bg{
    background-color: #fff;
  }

  .SE250609limited .image-bg a:hover{
    opacity: 0.7;
  }
}


/* ===========### SP用設定 ###=========== */
@media screen and (max-width: 767px) {
  .SE250609limited{
    overflow: hidden;
  }

  .SE250609limited .hidden-desktop {
    display: block;
  }

  .SE250609limited .hidden-phone {
    display: none;
  }
}




/* ===============================================### 
left-area, right-area, center-area 設定
###=============================================== */
.SE250609limited .center-area{
  background-color: var(--color-white);
}

/* ===========### responsive ###=========== */
/*** PC ***/
@media screen and (min-width: 768px) {
  /* .SE250609limited .main-wrap{
    background-image: url('../img/lp_bg.jpg');
    background-repeat: repeat-y;
    background-size: contain;
  } */

  .SE250609limited{
    background-image: url('../img/lp_bg.jpg');
    background-repeat: repeat-y;
    background-size: contain;
  }

  .SE250609limited .main-wrap{
    width: 100%;
    max-width: 140rem;
    margin-inline: auto;
  }

  .SE250609limited .main-wrap.grid-wrapper {
    position: relative;
    display: grid;
    grid-template-columns: 1fr calc(750 * var(--formula)) 1fr;
  }

  .SE250609limited .left-area {
    position: sticky;
    grid-column: 1;
    top: 0;
    height: 100vh;
    display: grid;
    place-content: center;
  }

  .SE250609limited .center-area {
    grid-column: 2;
    overflow: hidden;
  }

  .SE250609limited .right-area {
    position: sticky;
    grid-column: 3;
    top: 0;
    height: 100vh;
    display: grid;
    place-content: center;
  }

  /************** image **************/
  .SE250609limited .left-area .fixed_content{
    grid-column: 1;
    position: relative;
    width: calc(320 * var(--formula_pc));
    height: calc(390 * var(--formula_pc));
  }

  .SE250609limited .left-area .fixed_image {
    grid-column: 1;
    position: absolute;
    width: calc(1000 * var(--formula_pc));
    top: calc(-328 * var(--formula_pc));
    left: calc(-660 * var(--formula_pc));
  }

  .SE250609limited .right-area .fixed_image {
    grid-column: 1;
    position: relative;
    right: calc(-47 * var(--formula_pc));
    width: calc(320 * var(--formula_pc));
  }
}



/* ===============================================### 
アニメーション設定
###=============================================== */
.SE250609limited .js-fade-in{
  opacity: 0;
  transition: opacity, 1s;
}

.SE250609limited .js-fade-in.active{
  opacity: 1;
}

.SE250609limited .slide-up-wrap .js-slide-up{
  display: block;
  transition: ease-in, opacity 1.5s, transform 0.75s;
  transform: translateY(200px);
}

.SE250609limited .slide-up-wrap.active .js-slide-up{
  opacity: 1;
  transform: translateY(0);
}

.SE250609limited .slide-up-wrap .js-slide-up.js-delay{
  transition-delay: 0.2s;
}

.SE250609limited .slide-up-wrap .js-slide-up.js-delay02{
  transition-delay: 0.4s;
}


.SE250609limited .js-clip-path{
  width: 100%;
  height: 100%;
  clip-path: inset(0 100% 0 0);
  transition: 0.75s;
}

.SE250609limited .js-clip-path-reverse{
  width: 100%;
  height: 100%;
  clip-path: inset(0 0 0 100%);
  transition: 0.75s;
}

.SE250609limited .js-clip-path.active,
.SE250609limited .js-clip-path-reverse.active{
  clip-path: inset(0);
}




/* ===============================================### 
コンテンツ共通設定
###=============================================== */
.SE250609limited .slide-up-wrap{
  overflow: hidden;
}

.SE250609limited .flex-wrap{
  display: flex;
  gap: calc(13 * var(--formula));
}

.SE250609limited .content__item01 .content__image{
  position: relative;
  width: fit-content;
}

.SE250609limited .content__item01 .content__image::before{
  content: '';
  position: absolute;
  top: calc(6 * var(--formula));
  left: calc(-1 * var(--formula));
  width: calc(710 * var(--formula));
  height: calc(663 * var(--formula));
  background-color: #fff;
  z-index: -1;
  border-top-right-radius: calc(65 * var(--formula));
  border-bottom-right-radius: calc(65 * var(--formula));
}

/************** slide **************/
.SE250609limited .fade-slide{
  position: relative;
  width: calc(410 * var(--formula));
}

.SE250609limited .fade-slide::before{
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: calc(400 * var(--formula));
  height: calc(444 * var(--formula));
  background-color: var(--color-white);
  z-index: -1;
  border-top-left-radius: calc(65 * var(--formula));
  border-bottom-left-radius: calc(65 * var(--formula));
}

.SE250609limited .slick-dots{
  position: relative;
  top: calc(-12 * var(--formula));
  left: calc(310 * var(--formula));
}

.SE250609limited .slick-dots li button{
  width: calc(16 * var(--formula));
  height: calc(16 * var(--formula));
  background-color: #CFCFCF;
}

.SE250609limited .slick-dots li.slick-active button{
  background-color: var(--color-white);
}

.SE250609limited .slick-dots li{
  margin: calc(11 * var(--formula));
}

/************** text **************/
.SE250609limited .number-wrap{
  position: absolute;
}

.SE250609limited .number{
  font-family: var(--font-ja);
  font-size: calc(170 * var(--formula));
  font-weight: var(--fw-bold);
  color: var(--color-white);
}

.SE250609limited .number span{
  font-size: calc(200 * var(--formula));
}

.SE250609limited .product__text{
  position: absolute;
}

.SE250609limited .product-name{
  font-family: var(--font-ja);
  font-size: calc(52 * var(--formula));
  font-weight: var(--fw-bold);
  line-height: 1.3076923077;
  letter-spacing: -0.08em;
  color: var(--color-white);
}

.SE250609limited .credit{
  margin-top: calc(5 * var(--formula));
  font-family: var(--font-ja);
  font-size: calc(22 * var(--formula));
  line-height: 1.5454545455;
  font-weight: var(--fw-bold);
  color: var(--color-white);
}

.SE250609limited .product-price{
  margin-top: calc(21 * var(--formula));
  font-family: var(--font-ja);
  font-size: calc(30 * var(--formula));
  font-weight: var(--fw-bold);
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: var(--color-white);
}

.SE250609limited .product-detail{
  margin-top: calc(28 * var(--formula));
  font-family: var(--font-ja);
  font-size: calc(22 * var(--formula));
  font-weight: var(--fw-bold);
  line-height: 1.9;
  color: var(--color-black);
  letter-spacing: -0.07em;
}

/************** image **************/
.SE250609limited .character__image{
  position: absolute;
  z-index: 1;
}

.SE250609limited .link__button{
  position: relative;
  width: calc(590 * var(--formula));
  margin-top: calc(47 * var(--formula));
  margin-inline: auto;
  z-index: 2;
  filter: drop-shadow(3px 7px 2px rgba(0, 0, 0, 0.25));
  will-change: filter;
  border-radius: calc(15 * var(--formula));
}

.SE250609limited .content__item01 .content__image{
  width: calc(725 * var(--formula));
}

/* ===========### responsive ###=========== */
@media screen and (min-width: 768px) {
  .SE250609limited .link__button{
    background-color: var(--color-white);
    border-radius: calc(18 * var(--formula));
  }
}

@media screen and (max-width: 767px) {
  .SE250609limited .link__button{
    margin-top: calc(49 * var(--formula));
  }
}



/* ===============================================### 
MV
###=============================================== */
.SE250609limited .mv{
}

.SE250609limited .mv .content-inner{
}

/************** image **************/
.SE250609limited .mv .mv__image{
  width: calc(750 * var(--formula));
  margin-inline: auto;
}


/* ===============================================### 
lead-area
###=============================================== */
.SE250609limited .lead-area{
  margin-top: calc(30 * var(--formula));
}

.SE250609limited .lead-area .content-inner{
}

.SE250609limited .title-wrap{
}

/************** text **************/
.SE250609limited .lead__text{
  margin-top: calc(121 * var(--formula));
  font-family: var(--font-ja);
  font-size: calc(21 * var(--formula));
  font-weight: var(--fw-bold);
  line-height: 2.2;
  text-align: center;
}

.SE250609limited .lead__text .text-marker{
  position: relative;
  display: inline-block;
}

.SE250609limited .lead__text .text-marker::after{
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  /* width: 100%; */
  height: calc(30 * var(--formula));
  z-index: -1;
  width: 0%;
  transition: all 0.5s ease-in-out;
  transition-delay: 1s;
}

.SE250609limited .slide-up-wrap.active .lead__text .text-marker::after{
  width: 100%;
}

.SE250609limited .lead__text .text-marker:nth-of-type(1)::after{
  background-color: #FFC1BA;
}

.SE250609limited .lead__text .text-marker:nth-of-type(2)::after{
  background-color: #C3DAF1;
}

.SE250609limited .lead__text .text-marker:nth-of-type(3)::after{
  background-color: #FFFD9C;
}

/************** image **************/
.SE250609limited .title-wrap .title01{
  width: calc(340 * var(--formula));
  margin-inline: auto;
}

.SE250609limited .title-wrap .title02{
  margin-top: calc(30 * var(--formula));
  width: calc(705 * var(--formula));
  margin-inline: auto;
}




/* ===============================================### 
コンテンツ01
###=============================================== */
.SE250609limited .content01{
  margin-top: calc(199 * var(--formula));
  background-color: var(--color-blue);
}

.SE250609limited .content01 .content-inner{
  position: relative;
  width: 100%;
  padding-top: calc(287 * var(--formula));
  padding-bottom: calc(137 * var(--formula));
}

.SE250609limited .content01 .content__item01{
}

.SE250609limited .content01 .content__item02{
  margin-top: calc(42 * var(--formula));
  margin-left: calc(40 * var(--formula));
}

/************** text **************/
.SE250609limited .content01 .number-wrap{
  top: calc(116 * var(--formula));
  left: calc(-6 * var(--formula));
}

.SE250609limited .content01 .product__text{
  top: calc(118 * var(--formula));
  right: calc(54 * var(--formula));
}

.SE250609limited .content01 .product-name{
  letter-spacing: 0;
}
.SE250609limited .content01 .product-price{
  font-size: calc(26 * var(--formula));
}

/************** image **************/
.SE250609limited .content01 .character__image.image01{
  top: calc(-61 * var(--formula));
  left: 50%;
  transform: translateX(-50%);
  width: calc(647 * var(--formula));
}

.SE250609limited .content01 .character__image.image02{
  bottom: calc(48 * var(--formula));
  left: calc(-101 * var(--formula));
  width: calc(413 * var(--formula));
}



/* ===============================================### 
コンテンツ02
###=============================================== */
.SE250609limited .content02{
  margin-top: calc(200 * var(--formula));
  background-color: var(--color-orange);
}

.SE250609limited .content02 .content-inner{
  position: relative;
  width: 100%;
  padding-top: calc(287 * var(--formula));
  padding-bottom: calc(138 * var(--formula));
}

.SE250609limited .content02 .content__item01{
}

.SE250609limited .content02 .content__item02{
  margin-top: calc(44 * var(--formula));
  margin-left: calc(41 * var(--formula));
}

/************** text **************/
.SE250609limited .content02 .number-wrap{
  top: calc(117 * var(--formula));
  left: calc(-10 * var(--formula));
}

.SE250609limited .content02 .product__text{
  top: calc(152 * var(--formula));
  right: calc(46 * var(--formula));
}

.SE250609limited .content02 .product-price{
  margin-left: calc(16 * var(--formula));
}

/************** image **************/
.SE250609limited .content02 .character__image.image01{
  top: calc(-77 * var(--formula));
  right: calc(-80 * var(--formula));
  width: calc(291 * var(--formula));
}

.SE250609limited .content02 .character__image.image02{
  bottom: calc(-20 * var(--formula));
  left: calc(-86 * var(--formula));
  width: calc(328 * var(--formula));
}

/************** button **************/
.SE250609limited .content02 .link__button{
  margin-top: calc(44 * var(--formula));
}

/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .SE250609limited .content02 .link__button{
    margin-top: calc(46 * var(--formula));
  }
}



/* ===============================================### 
コンテンツ03
###=============================================== */
.SE250609limited .content03{
  margin-top: calc(200 * var(--formula));
  background-color: var(--color-blue);
}

.SE250609limited .content03 .content-inner{
  position: relative;
  width: 100%;
  padding-top: calc(288 * var(--formula));
  padding-bottom: calc(156 * var(--formula));
}

.SE250609limited .content03 .content__item01{
}

.SE250609limited .content03 .content__item02{
  margin-top: calc(45 * var(--formula));
  margin-left: calc(40 * var(--formula));
}

/************** text **************/
.SE250609limited .content03 .number-wrap{
  top: calc(114 * var(--formula));
  left: calc(-10 * var(--formula));
}

.SE250609limited .content03 .product__text{
  top: calc(153 * var(--formula));
  right: calc(36 * var(--formula));
  text-align: right;
  z-index: 1;
}

.SE250609limited .content03 .product-price{
  margin-top: 0;
  margin-right: calc(10 * var(--formula));
}

.SE250609limited .content03 .product-detail{
  margin-top: calc(14 * var(--formula));
}

/************** image **************/
.SE250609limited .content03 .character__image.image01{
  top: calc(-105 * var(--formula));
  right: calc(-22 * var(--formula));
  width: calc(254 * var(--formula));
}

.SE250609limited .content03 .character__image.image02{
  bottom: calc(-92 * var(--formula));
  left: calc(-104 * var(--formula));
  width: calc(410 * var(--formula));
}

/************** button **************/
.SE250609limited .content03 .link__button{
  margin-top: calc(55 * var(--formula));
}



/* ===============================================### 
コンテンツ04
###=============================================== */
.SE250609limited .content04{
  margin-top: calc(200 * var(--formula));
  background-color: var(--color-orange);
}

.SE250609limited .content04 .content-inner{
  position: relative;
  width: 100%;
  padding-top: calc(289 * var(--formula));
  padding-bottom: calc(137 * var(--formula));
}

.SE250609limited .content04 .content__item01{
}

.SE250609limited .content04 .content__item02{
  margin-top: calc(43 * var(--formula));
  margin-left: calc(40 * var(--formula));
}

.SE250609limited .content04 .flex-wrap{
  gap: calc(16 * var(--formula));
}

.SE250609limited .content04 .fade-slide{
  position: relative;
  left: calc(3 * var(--formula));
}

/************** text **************/
.SE250609limited .content04 .number-wrap{
  top: calc(120 * var(--formula));
  left: calc(-11 * var(--formula));
}

.SE250609limited .content04 .product__text{
  top: calc(152 * var(--formula));
  right: calc(34 * var(--formula));
  text-align: right;
  z-index: 1;
}

.SE250609limited .content04 .product-price{
  margin-top: 0;
  margin-right: calc(10 * var(--formula));
}

.SE250609limited .content04 .product-detail{
  margin-top: calc(33 * var(--formula));
  letter-spacing: -0.08em;
}

/************** image **************/
.SE250609limited .content04 .character__image.image01{
  top: calc(-40 * var(--formula));
  right: calc(-20 * var(--formula));
  width: calc(240 * var(--formula));
}

.SE250609limited .content04 .character__image.image02{
  bottom: calc(-10 * var(--formula));
  left: calc(-33 * var(--formula));
  width: calc(215 * var(--formula));
}

/************** button **************/
.SE250609limited .content04 .link__button{
  margin-top: calc(47 * var(--formula));
}



/* ===============================================### 
コンテンツ05
###=============================================== */
.SE250609limited .content05{
  margin-top: calc(200 * var(--formula));
  background-color: var(--color-blue);
}

.SE250609limited .content05 .content-inner{
  position: relative;
  width: 100%;
  padding-top: calc(285 * var(--formula));
  padding-bottom: calc(136 * var(--formula));
}

.SE250609limited .content05 .content__item01{
}

.SE250609limited .content05 .content__item01 .content__image::before{
  top: calc(7 * var(--formula));
}

.SE250609limited .content05 .content__item02{
  margin-top: calc(44 * var(--formula));
  margin-left: calc(43 * var(--formula));
}

.SE250609limited .content05 .flex-wrap{
  gap: calc(46 * var(--formula));
}

.SE250609limited .content05 .fade-slide{
  position: relative;
  left: calc(2 * var(--formula));
}

/************** text **************/
.SE250609limited .content05 .number-wrap{
  top: calc(113 * var(--formula));
  left: calc(-7 * var(--formula));
}

.SE250609limited .content05 .product__text{
  top: calc(140 * var(--formula));
  right: calc(30 * var(--formula));
  z-index: 1;
}

.SE250609limited .content05 .product-name{
  line-height: 1.16;
  letter-spacing: 0;
}

.SE250609limited .content05 .product-detail{
  margin-top: calc(34 * var(--formula));
}


/************** image **************/
.SE250609limited .content05 .character__image.image01{
  top: calc(37 * var(--formula));
  right: calc(-26 * var(--formula));
  width: calc(291 * var(--formula));
  z-index: 0;
}

.SE250609limited .content05 .character__image.image02{
  bottom: calc(250 * var(--formula));
  left: calc(10 * var(--formula));
  width: calc(233 * var(--formula));
}



/* ===============================================### 
link-area
###=============================================== */
.SE250609limited .link-area{
  margin-top: calc(520 * var(--formula));
  padding-bottom: calc(230 * var(--formula));
}

.SE250609limited .link-area .content-inner{
  position: relative;
  width: fit-content;
  margin-inline: auto;
}

/************** image **************/
.SE250609limited .link-area .character__image{
  position: absolute;
  top: calc(-368 * var(--formula));
  left: 50%;
  transform: translateX(-50%);
  width: calc(446 * var(--formula));
  z-index: 3;
}

.SE250609limited .link-area .link__button{
  width: calc(660 * var(--formula));
}

/* ===========### responsive ###=========== */
@media screen and (max-width: 767px) {
  .SE250609limited .link-area .character__image{
    top: calc(-366 * var(--formula));
  }

  .SE250609limited .link-area{
    margin-top: calc(516 * var(--formula));
  }
}