/* @media (min-width: 768px) and (max-width: 1279px) {
width: calc(650* var(--variable)* var(--ratio));
  html {
    font-size: 0.7142857143vw;
  }
} */

@media (min-width: 768px) {
  .archive {
    border-top: 1px solid #58595b;
  }
}

.splide__pagination {
  justify-content: end;
  padding: 0;
  bottom: calc(10* var(--variable)* var(--ratio));
  right: calc(10* var(--variable)* var(--ratio));
}

.splide__pagination__page {
  background: transparent;
  border: 1px solid #fff;
  opacity: 1;
  width: calc(10* var(--variable)* var(--ratio));
  height: calc(10* var(--variable)* var(--ratio));
  margin: calc(10* var(--variable)* var(--ratio));
}

.splide__pagination__page.is-active {
  transform: scale(1);
}

.landingPage {
  --color-black: #000000;
  --color-white: #ffffff;
  --color-gray: #CECECE;
  --font-montserrat: "montserrat", sans-serif;
  --font-ja: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic", "メイリオ", sans-serif;
  position: relative;
  --fw-light:300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;
  overflow: clip;
  font-feature-settings: 'palt';
}

/* ▼ -----------可変設定---------- ▼ */
#FR250604monotoneitem {
  --pc-width: 1400;/*PCデザイン幅*/
  --sp-width: 750;/*SPデザイン幅*/
  --pc-artboard-width: 440;/*SP共通デザイン幅*/
  --sp-artboard-width: 750;/*PC共通デザイン幅*/
}

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

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

.landingPage * {
  box-sizing: border-box !important;
  /* color: var(--color-black); */
  font-weight: var(--fw-light);
}

.landingPage img,
.landingPage picture {
  display: block;
}

.landingPage a {
  display: inline-block;
}
.landingPage .collection__inner {
  max-width: calc(750* var(--variable)* var(--ratio));
  margin: 0 auto;
  position: relative;
}

@media (hover: hover) {
  .landingPage .landingPage a {
    transition: 0.6 ease;
  }

  .landingPage .landingPage a:where(:any-link):hover {
    opacity: 0.6;
  }
}

.landingPage img,
.landingPage svg {
  width: 100%;
  height: auto;
  image-rendering: optimizequality;
}

.landingPage {
  --util: 100vw / 750;
}
@media (max-width: 768px) {
  .landingPage .without-sp {
    display: none;
  }
}
@media (min-width: 767px) {
  .landingPage {
    padding-bottom: calc(148* var(--variable)* var(--ratio));
  }
  .landingPage .without-pc {
    display: none;
  }
}

.landingPage .mainVisual {
  width: calc(750* var(--variable)* var(--ratio));
  margin-inline: auto;
}
.landingPage .mainVisual__inner {
  width: 100%;
  position: relative;
}
.landingPage .mainVisual__title {
  width: calc(393 * var(--variable) * var(--ratio));
  position: absolute;
  pointer-events: none;
  top: calc(78 * var(--variable) * var(--ratio));
  left: calc(32 * var(--variable) * var(--ratio));
  /* transform: translateX(-50%); */
  z-index: 5;
}
.landingPage .mainVisual__txt_box {
  margin-top: calc(106 * var(--variable) * var(--ratio));
}
.landingPage .mainVisual__lead {
  font-family: var(--font-ja);
  color: var(--color-black);
  letter-spacing: 0.14em;
  text-align: center;
  line-height: 2;
  font-size: calc(25* var(--variable)* var(--ratio));
  font-weight: var(--fw-regular);
}

.landingPage .collection__prices {
  font-family: var(--font-montserrat);
  margin-top: calc(34 * var(--variable) * var(--ratio));
  font-size: calc(20* var(--variable)* var(--ratio));
  letter-spacing: 0;
  line-height: 1.85;
  color: var(--color-black);
  font-weight: var(--fw-regular);
}
.landingPage .collection__prices .prices_left {
  margin-left: calc(5* var(--variable)* var(--ratio));
}

.landingPage .collection__image {
  line-height: 0;
  background-color: #fff;
}
.landingPage .collection--1 {
  margin-top: calc(296 * var(--variable) * var(--ratio));
}
.landingPage .collection--1 .collection__item01 {
  padding-left: calc(90* var(--variable)* var(--ratio));
  position: relative;
}
.landingPage .collection--1 .collection__item01 .collection__title {
  width: calc(169 * var(--variable) * var(--ratio));
  position: absolute;
  top: calc(-160 * var(--variable) * var(--ratio));
  left: calc(125 * var(--variable) * var(--ratio));
  pointer-events: none;
  z-index: 5;
}
.landingPage .collection--1 .collection__item02 {
  padding-right: calc(170* var(--variable)* var(--ratio));
  margin-top: calc(60 * var(--variable) * var(--ratio));
}
.landingPage .collection--1 .collection__prices {
  padding-left: calc(40 * var(--variable) * var(--ratio));
}

.landingPage .collection--2 {
  margin-top: calc(329 * var(--variable) * var(--ratio));
}
.landingPage .collection--2 .collection__item {
  width: calc(750* var(--variable)* var(--ratio));
  position: relative;
}
.landingPage .collection--2 .collection__item .collection__title {
  width: calc(192 * var(--variable) * var(--ratio));
  position: absolute;
  top: calc(-160 * var(--variable) * var(--ratio));
  right: calc(34 * var(--variable) * var(--ratio));
  pointer-events: none;
  z-index: 5;
}
.landingPage .collection--2 .collection__prices {
  margin-top: calc(33 * var(--variable) * var(--ratio));
  text-align: center;
}

.landingPage .collection--3 {
  margin-top: calc(330 * var(--variable) * var(--ratio));
}
.landingPage .collection--3 .collection__item01 {
  padding-right: calc(110* var(--variable)* var(--ratio));
  position: relative;
}
.landingPage .collection--3 .collection__item01 .collection__title {
  width: calc(198 * var(--variable) * var(--ratio));
  position: absolute;
  top: calc(-163 * var(--variable) * var(--ratio));
  left: calc(35 * var(--variable) * var(--ratio));
  pointer-events: none;
  z-index: 5;
}

.landingPage .collection--3 .collection__item02 {
  padding-left: calc(190* var(--variable)* var(--ratio));
  margin-top: calc(60 * var(--variable) * var(--ratio));
  position: relative;
}
.landingPage .collection--3 .collection__prices {
  position: absolute;
  width: calc(150 * var(--variable) * var(--ratio));
  left: calc(91 * var(--variable) * var(--ratio));
  top: calc(631 * var(--variable) * var(--ratio));
  z-index: 5;
}
.landingPage .collection--3 .collection__prices > a {
  display: block;
}

.landingPage .collection--4 {
  margin-top: calc(201* var(--variable)* var(--ratio));
}
.landingPage .collection--4 .collection__item01 {
  padding-left: calc(90* var(--variable)* var(--ratio));
  position: relative;
}
.landingPage .collection--4 .collection__item01 .collection__title {
  width: calc(201 * var(--variable) * var(--ratio));
  position: absolute;
  top: calc(34 * var(--variable) * var(--ratio));
  left: calc(125 * var(--variable) * var(--ratio));
  pointer-events: none;
  z-index: 5;
}
.landingPage .collection--4 .collection__item02 {
  padding-right: calc(50* var(--variable)* var(--ratio));
  margin-top: calc(60* var(--variable)* var(--ratio));
}
.landingPage .collection--4 .collection__prices {
  text-align: right;
  margin-top: calc(32* var(--variable)* var(--ratio));
}


.landingPage .product {
  position: relative;
  margin-top: calc(150* var(--variable)* var(--ratio));
}

.landingPage .product::before {
  position: absolute;
  left: 0;
  z-index: -1;
  display: block;
  width: 100%;
  content: '';
  background-color: var(--color-yellow);
  top: calc(200* var(--variable)* var(--ratio));
  height: calc(1250* var(--variable)* var(--ratio));
}

.landingPage .product__inner {
  display: grid;
  justify-items: center;
}
.landingPage .product__image {
  padding-inline: calc(75* var(--variable)* var(--ratio));
}

.landingPage .product__title {
  position: relative;
  font-family: var(--font-miller);
  text-align: center;
  letter-spacing: 0.07em;
  padding-bottom: calc(53* var(--variable)* var(--ratio));
  margin-top: calc(67* var(--variable)* var(--ratio));
  font-size: calc(44* var(--variable)* var(--ratio));
}

.landingPage .product__title::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  margin-inline: auto;
  content: '';
  background-color: var(--color-gray);
  width: calc(120* var(--variable)* var(--ratio));
  height: calc(2* var(--variable)* var(--ratio));
}

.landingPage .product__title > * {
  line-height: 1;
}

.landingPage .product__title span {
  display: block;
  letter-spacing: 0.06em;
  padding-bottom: calc(21* var(--variable)* var(--ratio));
  font-size: calc(38* var(--variable)* var(--ratio));
}

.landingPage .product__text {
  font-family: var(--font-yu-mincho-pr6n);
  font-feature-settings: 'palt';
  text-align: center;
  margin-top: calc(59* var(--variable)* var(--ratio));
  font-size: calc(24* var(--variable)* var(--ratio));
  line-height: 2;
  letter-spacing: 0.14em;
}

.landingPage .foot {
  font-family: var(--font-kepler);
  margin-top: calc(44* var(--variable)* var(--ratio));
}

.landingPage .foot__inner {
  display: grid;
  justify-items: center;
  padding-bottom: calc(148* var(--variable)* var(--ratio));
}
.landingPage .foot__image {
  padding-inline: calc(95* var(--variable)* var(--ratio));
}

.landingPage .foot__heading {
  text-align: center;
  margin-top: calc(78* var(--variable)* var(--ratio));
}

.landingPage .foot__heading span {
  display: block;
}

.landingPage .foot__subTitle {
  color: var(--color-black);
  letter-spacing: 0.05em;
  font-size: calc(37* var(--variable)* var(--ratio));
}

.landingPage .foot__mainTitle {
  color: var(--color-black);
  letter-spacing: 0.02em;
  padding-top: calc(27* var(--variable)* var(--ratio));
  font-size: calc(84* var(--variable)* var(--ratio));
}

.landingPage .foot__desc {
  font-style: italic;
  color: var(--color-black);
  letter-spacing: 0.01em;
  padding-top: calc(42* var(--variable)* var(--ratio));
  font-size: calc(54* var(--variable)* var(--ratio));
}

.landingPage .foot__button {
  display: inline-block;
  position: relative;
  width: calc(228* var(--variable)* var(--ratio));
  margin: 0 auto;
  margin-top: calc(147 * var(--variable) * var(--ratio));
  padding-block-end: calc(5* var(--variable)* var(--ratio));
}

.landingPage .foot__button::before {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: calc(0.5* var(--variable)* var(--ratio));
  content: '';
  background-color: var(--color-black);
}

.landingPage .foot__button a {
  padding-block-end: calc(16* var(--variable)* var(--ratio));
  border-bottom: calc(0.5* var(--variable)* var(--ratio)) solid var(--color-black);
}

@media (min-width: 768px) {
  .landingPage .mainVisual__title {
    width: calc(307 * (100vw / 1400));
    top: calc(70 * (100vw / 1400));
    left: calc(45 * (100vw / 1400));
  }
  /* .landingPage .foot__button a {
    border-bottom: calc(10* var(--variable)* var(--ratio)) double var(--color-black);
  } */
}

.landingPage .foot__credit {
  line-height: 1.85;
  text-align: center;
  font-family: var(--font-montserrat);
  margin-top: calc(157* var(--variable) * var(--ratio));
  font-size: calc(20* var(--variable)* var(--ratio));
  letter-spacing: 0;
  color: var(--color-black);
  font-weight: var(--fw-regular);
}

@media (max-width: 767px) {
  .landingPage .mainVisual_pc {
    display: none;
  }
}

@media (min-width: 768px) {
  .landingPage .sticky-container {
    display: flex;
  }
  .landingPage .mainVisual_pc {
    height: calc(100vh - (var(--header-container-height, 0px)));
    position: sticky;
    top: var(--header-container-height, 0);
    width: 50%;
    overflow: hidden;
    /* left: 0px;
    display: flex;
    justify-content: center;
    align-items: center;*/
    background-color: var(--color-white);
  }
  .landingPage .sticky-contents {
    width: 50%;
  }
  /* .landingPage .landingPage__inner {
    width: calc(440*(100vw / 1400));
    margin-left: calc(-70* var(--variable)* var(--ratio));
  } */

  .landingPage .mainVisual_pc .mainVisual__inner {
    width: 100%;
    height: 100%;
    margin: 0 auto;
  }

  .landingPage .mainVisual_pc .mainVisual__image {
    width: 100%;
    height: 100%;
    display: flex;
    /* align-items: center;
    justify-content: center; */
  }


  .landingPage .mainVisual_pc .mainVisual__image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: 80% top;
  }

}

.js-fadeIn {
  opacity: 0;
}
.js-fadeIn.showFade {
  opacity: 1;
  transition: opacity 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.js-fadeLeft {
  opacity: 0;
  transform: translateX(5%);
}
.js-fadeLeft.showFade {
  opacity: 1;
  transform: translateX(0);
  transition: opacity 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.js-fadeRight {
  opacity: 0;
  transform: translateX(-5%);
}
.js-fadeRight.showFade {
  opacity: 1;
  transform: translateX(0);
  transition: opacity 1.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.js-moveUp {
  opacity: 0;
  clip-path: inset(94% 0 0 0);
  filter: blur(30px) brightness(1.1);
}

.js-moveUp.js-active {
  animation: js-moveUp 0.95s ease-out forwards;
}

@keyframes js-moveUp {
  0% {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-clip-path: inset(100% 0 0 0);
    clip-path: inset(100% 0 0 0);
  }
  50% {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: blur(30px) brightness(1.1);
  }
  100% {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: blur(0) brightness(1);
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0);
  }
}

.js-moveUp_pc {
  opacity: 0;
  clip-path: inset(94% 0 0 0);
  filter: blur(30px) brightness(1.1);
}

.js-moveUp_pc.js-active {
  animation: js-moveUp_pc 0.95s ease-out forwards;
}

@keyframes js-moveUp_pc {
  0% {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-clip-path: inset(100% 0 0 0);
    clip-path: inset(100% 0 0 0);
  }
  50% {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: blur(30px) brightness(1.1);
  }
  100% {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: blur(0) brightness(1);
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0);
  }
}