@charset "UTF-8";
:root {
  --font: "Hiragino Kaku Gothic ProN", "Hiragino Sans", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font_en: "roboto", sans-serif;
}

* > .main-area {
  font-weight: var(--fontweight-medium);
  font-feature-settings: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow: unset;
  min-width: auto;
}

/* ▼ -----------可変設定---------- ▼ */
.lp_variable {
  --pc-width: 1400; /*PCデザイン幅*/
  --sp-width: 375; /*SPデザイン幅*/
  --pc-artboard-width: 438; /*SP共通デザイン幅*/
  --sp-artboard-width: 375; /*PC共通デザイン幅*/
  --formula: calc(var(--variable) * var(--ratio)); /*SP→PC 可変設定*/
  --formula_pc: calc(var(--variable) * 1); /*PC 1400以上は固定*/
}

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

.spOnly {
  display: none;
}
@media screen and (max-width: 767px) {
  .spOnly {
    display: block;
  }
  .pcOnly {
    display: none;
  }
}

.main-area * {
  box-sizing: border-box;
}
.main-area img {
  height: auto;
  opacity: 1;
  width: 100%;
}
.main-area a {
  text-decoration: none;
}
.main-area picture {
  display: block;
}
.main-area p, .main-area ul, .main-area ol, .main-area dl {
  list-style: none;
}
@media only screen and (max-width: 767px) {
  .main-area .pc_only {
    display: none;
  }
  .main-area .sp_only {
    display: block;
  }
}

@media only screen and (min-width: 768px) {
  .main-area .pc_only {
    display: block;
  }
  .main-area .sp_only {
    display: none;
  }
}

#FR251006RIBBON {
  --fw-thin: 100;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;
  --color-black: #000000;
  --color-white: #ffffff;
  --color-gray: #595757;
  --color-darkgray: #3E3A39;
  --color-orange: #D8B59E;
  --color-brown: #7C4340;
  font-feature-settings: "palt";
  /* text-align: center; */
  color: var(--color-black);
  overflow: clip;
  font-family: var(--font);
}
#FR251006RIBBON .contents__bottom {
  padding-bottom: calc(200 * var(--formula));
}
#FR251006RIBBON .mv-inner {
  width: 100%;
  position: relative;
}
#FR251006RIBBON .mv_txt {
  width: calc(263 * var(--formula));
  position: absolute;
  left: calc(21 * var(--formula));
  top: calc(25 * var(--formula));
  z-index: 5;
  pointer-events: none;
}

@media only screen and (min-width: 768px) {
  .footer {
    width: 100%;
  }
  .archive {
    border-top: 1px solid #58595b;
  }
  #FR251006RIBBON {
    --header-container-height: 120px;
    display: flex;
    width: 100%;
    /* padding-bottom: calc(230 * var(--formula)); */
  }
  #FR251006RIBBON::-webkit-scrollbar {
    display: none;
  }
  #FR251006RIBBON .contents__left {
    position: sticky;
    top: 0;
    width: 50%;
    height: 100vh;
    z-index: 1;
    overflow: hidden;
    height: calc(100vh - (var(--header-container-height, 0px)));
    top: var(--header-container-height, 0);
    top: calc(var(--header-height) + 2.8rem);
  }
  #FR251006RIBBON .product__block--mv {
    width: auto;
    height: calc(100vh - (var(--header-container-height, 0px)));
    overflow: hidden;
  }
  #FR251006RIBBON .product__block--mv .mv-inner {
    width: 100%;
    height: 100%;
    position: relative;
  }
  #FR251006RIBBON .product__block--mv .mv_img {
    width: 100%;
    height: 100%;
  }
  #FR251006RIBBON .product__block--mv .mv_img a {
    display: block;
    width: 100%;
    height: 100%;
  }
  #FR251006RIBBON .product__block--mv .mv_img a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 80% top;
  }
  #FR251006RIBBON .product__block--mv .mv_img picture {
    width: 100%;
    height: 100%;
  }
  #FR251006RIBBON .product__block--mv .title_box {
      width: 100%;
      height: 100%;
      position: absolute;
      left: 0;
      top: 0;
      pointer-events: none;
      z-index: 1;
  }
  #FR251006RIBBON .mv_txt {
    width: calc(269 * (100vw / 1400));
    left: calc(42 * (100vw / 1400));
    bottom: initial;
    top: calc(58 * (100vw / 1400));
  }
  #FR251006RIBBON .contents__right {
    width: calc(700* (100vw /1400));
    margin: 0 auto;
    position: relative;
    overflow: clip;
  }
}

@media only screen and (max-width: 1200px){
  #FR251006RIBBON .contents__left {
    top: calc(var(--header-height) + 0.7rem);
    height: 100vh !important;
  }
  #FR251006RIBBON .product__block--mv {
    height: 100vh !important;
  }
}

/* 共通 スタイル */
.FR251006RIBBON img {
  width: 100%;
  height: 100%;
}

.credit > a {
  display: inline-block;
}

.js-fade {
  opacity: 0;
  transition: opacity .8s linear .2s;
}
.js-fade.is-active {
  opacity: 1;
}
.delay01 {
  transition-delay: 0.2s;
  animation-delay: 0.2s;
}
.delay02 {
  transition-delay: 0.6s;
  animation-delay: 0.6s;
}
.delay03 {
  transition-delay: 0.8s;
  animation-delay: 0.8s;
}


/* ===========### FR251006RIBBON ###=========== */
.bg_beige {
  background-color: #edeeeb;
}
.main_lead {
  font-size: calc(13* var(--formula));
  line-height: 2.0769;
  width: calc(259* var(--formula));
  padding-top: calc(53* var(--formula));
  margin-left: calc(35* var(--formula));
  margin-bottom: calc(148* var(--formula));
  font-family: "dnp-shuei-gothic-gin-std", sans-serif;
  font-weight: 500;
  letter-spacing: 0.07em;
}
.main_lead span:nth-of-type(1) {
  margin-bottom: calc(15 * var(--formula));
  display: block;
}
.main_lead span:nth-of-type(2) {
  margin-bottom: calc(17 * var(--formula));
  display: block;
}
.mv_img {
  width: calc(378* var(--formula));
}

/* item_section01 */
.item_section01 {
  margin-bottom: calc(114* var(--formula));
}
.item_section01_img01 {
  /* width: 100%; */
  width: calc(378* var(--formula));
  position: relative;
  z-index: 21;
}
.credit_wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 0 calc(7* var(--formula));
  margin-top: calc(16* var(--formula));
  margin-left: calc(33* var(--formula));
}
.credit_wrap.credit_wrap01 {
  width: calc(205* var(--formula));
  margin-bottom: calc(76* var(--formula));
}
.credit_wrap a , .credit_wrap div {
  font-family: var(--font_en);
  font-size: calc(9* var(--formula));
  line-height: 1.7777;
  text-decoration: underline;
  text-decoration-skip-ink: none;
  display: inherit;
}
.item_section01_img02 {
  width: calc(310* var(--formula));
  margin: 0 auto;
}

/* item_section02 */
.item_section02 {
  margin-bottom: calc(130* var(--formula));
}
.item_section02_img01 {
  /* width: 100%; */
  width: calc(379* var(--formula));
  position: relative;
  left: calc(-2* var(--formula));
}
.credit_wrap.credit_wrap02 {
  width: calc(130* var(--formula));
  margin-bottom: calc(88* var(--formula));
}
.item_section02_img02 {
  width: calc(289* var(--formula));
  margin: 0 auto;
  position: relative;
  z-index: 21;
  left: calc(3* var(--formula));
}

/* item_section03 */
.item_section03 {
  margin-bottom: calc(153* var(--formula));
}
.item_section03_img01 {
  width: calc(244* var(--formula));
  margin-bottom: calc(82* var(--formula));
}
.item_section03_img02 {
  /* width: 100%; */
  width: calc(377* var(--formula));
  position: relative;
  z-index: 21;
}
.credit_wrap.credit_wrap03 {
  width: calc(200* var(--formula));
}

/* item_section04 */
.item_section04 {
  margin-bottom: calc(142* var(--formula));
}
.item_section04_img01 {
  width: calc(282* var(--formula));
  margin: 0 auto calc(86* var(--formula));
  position: relative;
  z-index: 21;
  left: calc(3* var(--formula));
}
.item_section04_img02 {
  width: calc(290* var(--formula));
  margin-bottom: calc(5* var(--formula));
}
.item_section04_img03 {
  width: calc(290* var(--formula));
}
.credit_wrap.credit_wrap04 {
  width: calc(160* var(--formula));
}

/* item_section05 */
.item_section05 {
  margin-bottom: calc(125* var(--formula));
}
.item_section05_img01 {
  /* width: 100%; */
  width: calc(379* var(--formula));
  margin-bottom: calc(124* var(--formula));
  position: relative;
  z-index: 21;
  left: calc(-2* var(--formula));
}
.item_section05_img02 {
  width: calc(310* var(--formula));
  margin: 0 auto;
  position: relative;
  z-index: 21;
}
.credit_wrap.credit_wrap05 {
  width: calc(170* var(--formula));
}

/* item_section06 */
.item_section06 {
  margin-bottom: calc(131* var(--formula));
}
.item_section06_img01 {
  width: calc(320* var(--formula));
  margin-bottom: calc(113* var(--formula));
}
.item_section06_img02 {
  /* width: 100%; */
  width: calc(378* var(--formula));
  position: relative;
  left: calc(-2* var(--formula));
}
.credit_wrap.credit_wrap06 {
  width: calc(120* var(--formula));
  margin-top: calc(18* var(--formula));
}

/* bottom_section */
.bottom_section {
  padding-bottom: calc(105* var(--formula));
}
.bottom_section_ttl {
  font-size: calc(18* var(--formula));
  text-align: center;
  margin-bottom: calc(15* var(--formula));
  font-family: "dnp-shuei-gothic-gin-std", sans-serif;
  font-weight: 400;
}
.bottom_section_lead {
  font-size: calc(12* var(--formula));
  line-height: 2.0833;
  width: calc(250* var(--formula));
  margin: 0 auto calc(102* var(--formula));
  text-align: justify;
  font-family: "dnp-shuei-gothic-gin-std", sans-serif;
  font-weight: 400;
  word-break: break-all;
}
.all_collection {
  width: calc(320* var(--formula));
  margin: 0 auto calc(27* var(--formula));
  display: block;
}
.all_collection_attention {
  font-size: calc(8* var(--formula));
  text-align: center;
  line-height: 1.75;
  font-family: "dnp-shuei-gothic-gin-std", sans-serif;
  font-weight: 500;
}

/* bg_pink */
.bg_pink {
  background-color: #e6d0e3;
  padding-top: calc(54* var(--formula));
  padding-bottom: calc(72* var(--formula));
}
.pink_area_ttl {
  width: calc(243* var(--formula));
  margin: 0 auto calc(23* var(--formula));
}
.pink_area_flex {
  margin: 0 auto calc(26* var(--formula));
  display: flex;
  /* justify-content: center; */
  /* width: 150%; */
}
.pink_area_flex_img {
  width: calc(189* var(--formula));
  margin-right: calc(7* var(--formula));
  position: relative;
  left: calc(3* var(--formula));
  top: calc(2* var(--formula));
}
.pink_area_flex_text_jp {
  margin-top: calc(26* var(--formula));
  font-size: calc(14* var(--formula));
  line-height: 1.5;
  font-weight: var(--fw-bold);
  font-family: "dnp-shuei-gothic-gin-std", sans-serif;
  font-weight: 600;
  letter-spacing: 0.03em;
}
.pink_area_flex_text_jp span:first-of-type {
  margin-top: calc(10* var(--formula));
  display: block;
  font-weight: 600;
}
.pink_area_flex_text_jp span:last-of-type {
  margin-top: calc(10* var(--formula));
  display: block;
  font-weight: 600;
}
.pink_area_flex_text_en {
  font-family: "work-sans", sans-serif;
  font-weight: 500;
  font-size: calc(11* var(--formula));
  letter-spacing: 0.05em;
  margin-top: calc(13* var(--formula));
  text-transform: uppercase;
}
.detail_button {
  width: calc(320* var(--formula));
  margin: 0 auto;
  display: block;
}

/* end_section_ttl */
.end_section_ttl {
  width: calc(111* var(--formula));
  margin: calc(42* var(--formula)) auto calc(64* var(--formula));
  position: relative;
  left: calc(-3* var(--formula));
}
.end_credit {
  font-family: "work-sans", sans-serif;
  font-weight: 500;
  font-size: calc(9* var(--formula));
  line-height: 2.2222;
  margin-bottom: calc(100* var(--formula));
  text-align: center;
  text-transform: uppercase;
}
.end_credit span {
  font-size: calc(13* var(--formula));
  line-height: 1;
  display: block;
  margin-bottom: calc(-27* var(--formula));
}

@media only screen and (min-width: 768px) {
  .sp_inner {
    width: calc(438* (100vw /1400));
    margin: 0 auto;
  }
}

/*** 固定部分 ***/
.js-show-text {
  opacity: 0;
  transition: opacity 1s ease;
}
.js-show-text.is-active {
  opacity: 1;
  transition: opacity 1s ease;
}

.js-show-text02 {
  opacity: 0;
  transition: opacity 1s ease;
}
.js-show-text02.is-active {
  opacity: 1;
  transition: opacity 1s ease;
}

.top_fixed_text {
  display: none;
}

.bottom_fixed_button {
  width: calc(122* var(--formula));
  position: fixed;
  bottom: calc(25* var(--formula));
  right: calc(10* var(--formula));
  z-index: 20;
}

@media only screen and (max-width: 767px) {
  .top_fixed_text {
    display: block;
    position: sticky;
    /* top: var(--header-height); */
    top: 0;
    width: calc(378* var(--formula));
    z-index: 25;
    margin-top: calc(-14* var(
    --formula));
  }

  #FR251006RIBBON .contents__left {
    height: 100% !important;
  }

  #FR251006RIBBON .product__block--mv {
    height: 100% !important;
  }
}