@charset "UTF-8";

.celford_251022 .celford_btn a {
  margin: 10.3rem auto 12rem;
  width: 99.9rem;
  height: 6rem;
}
/* --- デフォルトCSS設定 --- */

/* SP/PC共通のページ設定用デフォルトCSS */
.planCE251022product {
  /*デザインの値*/
  --pc-width: 1400; /*PCデザイン幅*/
  --sp-width: 750; /*SPデザイン幅*/
  --pc-artboard-width: 480; /*SP共通デザイン幅*/
  --sp-artboard-width: 750; /*PC共通デザイン幅*/
  /*可変率の計算式*/
  --formula: calc(
    var(--variable) * var(--ratio)
  ); /*SP,PC共通箇所の可変割合の計算式*/
  --formula_pc: calc(var(--variable) * 1); /*PCデザインの可変割合の計算式*/
}

/* PC画面幅 1400px以上 固定 */
@media (min-width: 1401px) {
  .planCE251022product {
    --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) {
  .planCE251022product {
    --ratio: calc(
      var(--pc-artboard-width) / var(--sp-artboard-width)
    ); /* PCとSPのデザイン幅の比率 */
    --variable: calc(100vw / var(--pc-width)); /* 画面幅に基づく可変値 */
  }
}

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

.planCE251022product img {
  display: block;
  width: 100%;
  height: auto;
}

.planCE251022product h2,
.planCE251022product h3,
.planCE251022product p,
.planCE251022product li {
  margin-block: calc((1em - 1lh) / 2);
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: unset;
}

.planCE251022product .invisible-heading {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* --- 抽出されたセレクタ --- */

/* レイアウト用セレクタ */
.planCE251022product {
  font-feature-settings: "palt";
  --crimson: "Crimson Text", serif;
  --yu-gochic: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium",
    "Yu Gothic", "Open Sans", "メイリオ", sans-serif;
  --gramond: garamond-premier-pro-display, serif;
  --novantique: novantique-script, sans-serif;
  --noto: "Noto Serif JP", serif;
  --gramond-pro: garamond-premier-pro, serif;
  position: relative;
  width: 100%;
  height: 100%;
  overflow-x: clip;
  display: flex;
  --mint: #f3f8f8;
  --dark-green: #568b8b;
  ---green: #5e8383;
  --pale-green: #a2c8c6;
  --light-gray: #efeeec;
  --gray: #cfccc6;
  --deep-gray: #9c9c9c;
  --light-blue: #ebf0f5;
  --blue: #7188a0;
  --light-pink: #fcf4f6;
  --pale-pink: #dabac1;
  --black: #000000;
}

.planCE251022product .jpntxt {
  font-family: var(--yu-gochic);
  color: var(--black);
  font-size: calc(24 * var(--formula));
  line-height: 2.2;
  letter-spacing: 0.05em;
  text-align: justify;
}

.planCE251022product .color-txt {
  font-family: var(--novantique);
  font-size: calc(150 * var(--formula));
  line-height: 1.16;
  letter-spacing: 0;
  z-index: 5;
  font-weight: 300;
}

.planCE251022product .lp-left-area {
  position: sticky;
  top: 0;
  height: 100vh;
  flex: 1;
}

.planCE251022product .left-area__cont {
  display: grid;
  place-items: center;
  height: 100%;
}

.planCE251022product .lp-main-area {
  width: calc(480 * var(--formula_pc));
  flex-shrink: 0;
}

.planCE251022product .section01 {
}

.planCE251022product .section01__img-01 {
}

.planCE251022product .section01__txt {
  margin-top: calc(106 * var(--formula));
  margin-bottom: calc(111 * var(--formula));
  text-align: center;
}

.planCE251022product .section02 {
  background-color: var(--mint);
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  padding-bottom: calc(100 * var(--formula));
  padding-top: calc(88 * var(--formula));
}

.planCE251022product .section02__cont1 {
  display: flex;
  flex-direction: column;
}

.planCE251022product [class^="section02__h3"] {
  font-family: var(--gramond);
  font-weight: 300;
  color: var(--dark-green);
  font-size: calc(120 * var(--formula));
  line-height: 1.1666;
  letter-spacing: 0.025em;
  text-align: left;
  position: relative;
  padding-left: calc(10 * var(--formula));
}

.planCE251022product [class^="section02__h3"]::after {
  content: "";
  position: absolute;
  height: calc(2 * var(--formula));
  background-color: var(--dark-green);
}

.planCE251022product .section02__h3--1 {
  width: calc(700 * var(--formula));
  padding-left: calc(60 * var(--formula));
}

.planCE251022product .section02__h3--1::after {
  width: calc(700 * var(--formula));
  left: 0;
  bottom: calc(-13 * var(--formula));
}

.planCE251022product .section02__cont1__txt1 {
  margin-top: calc(56 * var(--formula));
  margin-bottom: calc(33 * var(--formula));
  font-family: var(--noto);
  color: var(--dark-green);
  font-size: calc(28 * var(--formula));
  line-height: 2.2;
  letter-spacing: 0.09em;
  text-align: justify;
  width: calc(530 * var(--formula));
  margin-left: calc(60 * var(--formula));
  font-weight: 500;
}

.planCE251022product .section02__cont1__img-02 {
  margin: 0 auto;
  align-self: center;
}

.planCE251022product .section02__cont1__txt2 {
  text-align: justify;
  width: calc(580 * var(--formula));
  margin-top: calc(37 * var(--formula));
  margin-bottom: calc(113 * var(--formula));
  align-self: center;
}

.planCE251022product .section02__cont2 {
  width: calc(600 * var(--formula));
  align-self: flex-end;
}

.planCE251022product .section02__h3--2 {
}

.planCE251022product .section02__h3--2::after {
  width: calc(600 * var(--formula));
  right: 0;
  bottom: calc(-13 * var(--formula));
}

.planCE251022product .section02__cont2__txt1 {
  margin-top: calc(57 * var(--formula));
  margin-bottom: calc(31 * var(--formula));
  font-family: var(--noto);
  color: var(--dark-green);
  font-size: calc(28 * var(--formula));
  line-height: 2.2;
  letter-spacing: 0.06em;
  text-align: justify;
  width: calc(510 * var(--formula));
  margin-left: calc(11 * var(--formula));
  font-weight: 500;
}

.planCE251022product .section02__cont2__txt2 {
  text-align: justify;
  margin-top: calc(36 * var(--formula));
  margin-bottom: calc(116 * var(--formula));
  width: calc(540 * var(--formula));
}

p.section02__cont2__txt2.jpntxt {
}

.planCE251022product .section02__cont3 {
  display: flex;
  flex-direction: column;
}

.planCE251022product .section02__h3--3 {
  padding-left: calc(50 * var(--formula));
}

.planCE251022product .section02__h3--3::after {
  width: calc(702 * var(--formula));
  left: 0;
  bottom: calc(-13 * var(--formula));
}

.planCE251022product .section02__cont3__txt1 {
  margin-top: calc(56 * var(--formula));
  margin-bottom: calc(33 * var(--formula));
  font-family: var(--noto);
  color: var(--dark-green);
  font-size: calc(28 * var(--formula));
  line-height: 2.2;
  letter-spacing: 0.067em;
  text-align: justify;
  width: calc(670 * var(--formula));
  margin-left: calc(50 * var(--formula));
  font-weight: 500;
}

.planCE251022product .video-cont {
  align-self: center;
  display: inline-block;
  position: relative;
}

/* .planCE251022product .video-play {
  width: calc(70 * var(--formula));
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  transition: opacity 0.3s ease;
} */
/* .planCE251022product .section02__cont3__img-04 {
  cursor: pointer;
} */

.planCE251022product .color-variarion {
  position: relative;
}

.planCE251022product .color-sticky {
  position: sticky;
  z-index: 5;
  top: 50%;
  /* width: fit-content; */
  height: fit-content;
  right: 0; /* 右端からの距離を0にする */
  left: auto; /* leftの自動設定を解除（もしあれば） */
  margin-left: auto; /* 左マージンを自動で最大にする（＝要素を右に押しやる）*/
  margin-right: 0; /* 右マージンを0にする */
}

.planCE251022product .transform-wrapper {
  transform: rotate(90deg);
  transform-origin: right;
}

.planCE251022product .color-sticky__list {
  display: flex;
  font-family: var(--gramond);
  font-weight: 300;
  color: var(--deep-gray);
  font-size: calc(32 * var(--formula));
  letter-spacing: 0.025em;
  transform: translate(calc(530 * var(--formula)), calc(32 * var(--formula)));
}
.planCE251022product .color-sticky__list li:not(:last-child)::after {
  content: "/";
  color: var(--black);
}

.planCE251022product .color-sticky__list li:nth-child(1)::after {
  margin-left: calc(17 * var(--formula));
  margin-right: calc(16 * var(--formula));
}
.planCE251022product .color-sticky__list li:nth-child(2)::after {
  margin-left: calc(20 * var(--formula));
  margin-right: calc(16 * var(--formula));
}
.planCE251022product .color-sticky__list li:nth-child(3)::after {
  margin-left: calc(20 * var(--formula));
  margin-right: calc(18 * var(--formula));
}

.planCE251022product .section03 {
  padding-top: calc(106 * var(--formula));
  padding-bottom: calc(240 * var(--formula));
  display: flex;
  flex-direction: column;
}

.planCE251022product .section03__h3 {
  color: var(--gray);
  padding-left: calc(65 * var(--formula));
  overflow: visible;
}

.planCE251022product .section03__img-05 {
  align-self: flex-start;
  margin-top: calc(71 * var(--formula));
  margin-left: calc(34 * var(--formula));
}
.planCE251022product .section03__txt {
  margin-top: calc(66 * var(--formula));
  margin-bottom: calc(73 * var(--formula));
  width: calc(580 * var(--formula));
  align-self: center;
}

.planCE251022product .section03__img-06 {
  margin-bottom: calc(30 * var(--formula));
}

.planCE251022product .section03__img-07 {
  align-self: self-end;
}

.planCE251022product .section04 {
  display: flex;
  flex-direction: column;
  margin-bottom: calc(208 * var(--formula));
  position: relative;
}

.planCE251022product .section04__h3 {
  color: var(--blue);
  align-self: center;
  margin-left: calc(124 * var(--formula));
  margin-top: calc(36 * var(--formula));
  margin-bottom: calc(60 * var(--formula));
}

.planCE251022product .section04::after {
  content: "";
  position: absolute;
  width: calc(640 * var(--formula));
  height: calc(900 * var(--formula));
  right: 0;
  top: 0;
  z-index: -1;
  background-color: var(--light-blue);
}

.planCE251022product .section04__txt {
  margin-top: calc(66 * var(--formula));
  margin-bottom: calc(73 * var(--formula));
  width: calc(580 * var(--formula));
  align-self: center;
}

.planCE251022product .section04__img-09 {
  align-self: end;
}

.planCE251022product .section05 {
  display: flex;
  flex-direction: column;
  padding-bottom: calc(479 * var(--formula));
}

.planCE251022product .section05__h3 {
  color: var(--pale-green);
  margin-left: calc(60 * var(--formula));
}

.planCE251022product .section05__img-10 {
  margin-top: calc(72 * var(--formula));
}

.planCE251022product .section05__txt {
  margin-top: calc(67 * var(--formula));
  margin-bottom: calc(70 * var(--formula));
  width: calc(580 * var(--formula));
  align-self: center;
}

.planCE251022product .section05__img-11 {
  align-self: center;
}

.planCE251022product .section06 {
  position: relative;
  padding-bottom: calc(100 * var(--formula));
  display: flex;
  flex-direction: column;
  background-color: var(--light-pink);
  margin-top: calc(100 * var(--formula));
}

.planCE251022product .section06__h3 {
  color: var(--pale-pink);
  margin-bottom: calc(60 * var(--formula));
  align-self: center;
  position: absolute;
  top: calc(-372 * var(--formula));
}

.planCE251022product .section06__img-12 {
  align-self: flex-end;
  margin-top: calc(-150 * var(--formula));
}

.planCE251022product .section06__txt {
  margin-bottom: calc(73 * var(--formula));
  margin-top: calc(66 * var(--formula));
  width: calc(580 * var(--formula));
  align-self: center;
}

.planCE251022product .section06__img-13 {
  margin-bottom: calc(30 * var(--formula));
}

.planCE251022product .section06__img-14 {
  align-self: center;
}

.planCE251022product .section07 {
  margin-top: calc(184 * var(--formula));
  margin-bottom: calc(30 * var(--formula));
  display: flex;
  flex-direction: column;
  align-items: center;
}

.planCE251022product .section07__h3 {
  font-family: var(--gramond-pro);
  font-weight: 500;
  color: var(--black);
  font-size: calc(50 * var(--formula));
  line-height: 1.25;
  letter-spacing: 0.06em;
  text-align: center;
  margin-left: calc(3 * var(--formula));
  margin-bottom: calc(10 * var(--formula));
}

.planCE251022product .section07__h4 {
  font-family: var(--yu-gochic);
  color: var(--black);
  font-size: calc(24 * var(--formula));
  line-height: 2.5;
  letter-spacing: 0.05em;
  text-align: center;
}

.planCE251022product .section07__item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(50 * var(--formula));
  margin-top: calc(43 * var(--formula));
  margin-bottom: calc(30 * var(--formula));
}

.planCE251022product .section07__txt {
  font-family: var(--crimson);
  color: var(--black);
  font-size: calc(24 * var(--formula));
  line-height: 2.2;
  letter-spacing: 0.05em;
  text-align: center;
  position: relative;
}

.planCE251022product .section07__txt::after {
  content: "";
  height: calc(2 * var(--formula));
  width: calc(101 * var(--formula));
  position: absolute;
  bottom: calc(12 * var(--formula));
  background-color: #b2b2b2;
  left: 50%;
  transform: translateX(-50%);
}

.planCE251022product .lp-right-area {
  position: sticky;
  top: 0;
  height: 100vh;
  flex: 1;
}

.planCE251022product .right-area__cont {
  margin-top: calc(20 * var(--formula));
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  gap: calc(28 * var(--formula));
}

/* 画像サイズ指定用クラス(__frame) */
.planCE251022product .left-area__logo__frame {
  width: calc(340 * var(--formula_pc));
}

.planCE251022product .section01__img-01__frame {
  width: calc(750 * var(--formula));
}

.planCE251022product .section02__cont1__img-02__frame {
  width: calc(650 * var(--formula));
}

.planCE251022product .section02__cont2__img-03__frame {
  width: calc(600 * var(--formula));
}

.planCE251022product .section02__cont3__img-04__frame {
  width: calc(630 * var(--formula));
}

.planCE251022product .section03__img-05__frame {
  width: calc(651 * var(--formula));
}

.planCE251022product .section03__img-06__frame {
  width: calc(520 * var(--formula));
}

.planCE251022product .section03__img-07__frame {
  width: calc(580 * var(--formula));
}

.planCE251022product .section04__img-08__frame {
  width: calc(680 * var(--formula));
}

.planCE251022product .section04__img-09__frame {
  width: calc(580 * var(--formula));
}

.planCE251022product .section05__img-10__frame {
  width: calc(720 * var(--formula));
}

.planCE251022product .section05__img-11__frame {
  width: calc(642 * var(--formula));
}

.planCE251022product .section06__img-12__frame {
  width: calc(690 * var(--formula));
}

.planCE251022product .section06__img-13__frame {
  width: calc(600 * var(--formula));
}

.planCE251022product .section06__img-14__frame {
  width: calc(600 * var(--formula));
}

.planCE251022product .section07__item-01__frame {
  width: calc(250 * var(--formula));
}

.planCE251022product .section07__item-02__frame {
  width: calc(250 * var(--formula));
}

.planCE251022product .section07__item-03__frame {
  width: calc(250 * var(--formula));
}

.planCE251022product .section07__item-04__frame {
  width: calc(250 * var(--formula));
}

.planCE251022product .link-01__frame {
  width: calc(191 * var(--formula_pc));
}
.planCE251022product .link-02__frame {
  width: calc(190 * var(--formula_pc));
}

/* SP settings */
@media (max-width: 767px) {
  .planCE251022product .lp-left-area,
  .planCE251022product .lp-right-area {
    display: none;
  }
  .planCE251022product .lp-main-area {
    position: relative;
    width: 100%;
  }
  .celford_251022 .celford_btn a {
    margin: calc(122 * (100vw / 750)) auto calc(150 * (100vw / 750));
    width: calc(630 * (100vw / 750));
    height: calc(124 * (100vw / 750));
  }
}