@charset "UTF-8";
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - custom property
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo {
  --color-white: #F4F1EA;
  --color-black: #150C07;
  --color-green: #A8D5B2;
  --color-red: #891921;
  --color-yellow: #F0BC55;
  --color-gold: #B27908;
  --color-blue: #324974;
  --color_bg-white: #fff;
  --font-yu: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "Yu Gothic", "Open Sans", "メイリオ", sans-serif;
  --font-poppins: "poppins", sans-serif;
  --font-ja: var(--font-yu);
  --font-en: var(--font-poppins);
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  font-feature-settings: "palt";
  overflow: clip;
  color: var(--color-black);
}
#Contents {
  overflow: clip;
}
.MC250530montecarlo {
  --pc-width: 1440;
  --sp-width: 375;
  --pc-artboard-width: 550;
  --sp-artboard-width: 375;
}
.main-area.lp {
  margin-bottom: 0;
  padding-top: 0;
}
@media (min-width: 1400px) {
  .MC250530montecarlo {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: 1px;
  }
}
@media (min-width: 768px) and (max-width: 1400px) {
  .MC250530montecarlo {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: calc(100vw / var(--pc-width));
  }
}
@media (min-width: 768px) {
  /* .MC250530montecarlo {
    margin-top: max(-140*100vw/1440, -140px);
  } */
}
@media (max-width: 767px) {
  .MC250530montecarlo {
    --ratio: 1;
    --variable: calc(100vw / var(--sp-width));
    /* margin-top: calc(-103*var(--variable)*var(--ratio)); */
  }
}

.header .header__inner {
  position: relative;
}
.header .header__inner::before,
.header .header__inner::after {
  position: absolute;
  content: "";
  opacity: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transition: opacity .5s ease;
  z-index: -1;
}
.header .header__inner.is-odd-section::after {
  opacity: 1;
  background: linear-gradient(0deg, rgba(240, 188, 85, 0) 0%, rgba(240, 188, 85, 1) 100%);
}
.header .header__inner.is-even-section::before {
  opacity: 1;
  background: linear-gradient(0deg, rgba(168, 213, 178, 0) 0%, rgba(168, 213, 178, 1) 100%);
}

/*
//////////////////////////////////////////////////////////////////////////////////////////////
component - others
//////////////////////////////////////////////////////////////////////////////////////////////
*/
@media screen and (min-width: 768px) {
  .MC250530montecarlo .hidden-desktop {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .MC250530montecarlo .hidden-mobile {
    display: none !important;
  }
}
.MC250530montecarlo img,
.MC250530montecarlo video {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - position
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .common-position {
  position: absolute;
}
.MC250530montecarlo .common-grid {
  display: grid;
  gap: var(--row, 0) var(--column, 0);
}
.MC250530montecarlo .common-flex_row {
  display: flex;
  flex-direction: row;
  gap: var(--row, 0) var(--column, 0);
}
.MC250530montecarlo .common-flex_row_reverse {
  display: flex;
  flex-direction: row-reverse;
  gap: var(--row, 0) var(--column, 0);
}
.MC250530montecarlo .common-flex_column {
  display: flex;
  flex-direction: column;
  gap: var(--row, 0) var(--column, 0);
}
.MC250530montecarlo .common-flex_column_reverse {
  display: flex;
  flex-direction: column-reverse;
  gap: var(--row, 0) var(--column, 0);
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - hero
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .hero {
  position: relative;
  z-index: 10;
  background-color: var(--color-green);
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - fixed
//////////////////////////////////////////////////////////////////////////////////////////////
*/
@media screen and (min-width: 768px) {
  .MC250530montecarlo .fixed_container {
    position: sticky;
    top: calc(100vh - min(320*100vw/1440, 320px));
    /* margin-top: max(-320*100vw/1440, -320px); */
  }
  .MC250530montecarlo .fixed_container {
    color: #234E2B;
  }
  .MC250530montecarlo.is-odd-section .fixed_container {
    color: #891921;
  }
  .MC250530montecarlo .fixed_inner {
    position: relative;
    justify-content: space-between;
    margin-top: min(295*100vw/1400, 295px);
  }
  .MC250530montecarlo .fixed_list {
    --row: min(16*100vw/1440, 16px);
    margin-top: auto;
    margin-bottom: min(42*100vw/1440, 42px);
    margin-left: min(40*100vw/1440, 40px);
  }
  .MC250530montecarlo .fixed_title {
    font-size: min(22*100vw/1440, 22px);
    line-height: 1;
    letter-spacing: .05em;
    font-weight: var(--font-weight-semibold);
    font-family: var(--font-en);
    opacity: .25;
    transition: opacity 0.3s;
  }
  .MC250530montecarlo .fixed_title.is-active {
    opacity: 1;
  }
  .MC250530montecarlo .fixed_title span {
    display: inline-block;
    font-size: min(26*100vw/1440, 26px);
    font-weight: var(--font-weight-semibold);
  }
  .MC250530montecarlo .fixed_btn {
    width: min(180*100vw/1440, 180px);
    margin-top: auto;
    margin-bottom: min(42*100vw/1440, 42px);
    margin-right: min(40*100vw/1440, 40px);
  }
  .MC250530montecarlo .scroll_container {
    margin-top: max(-655*100vw/1440, -655px);
    padding-top: min(20*100vw/1400, 20px);
  }
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - main_container
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .detail_inner,
.MC250530montecarlo .product_inner {
  width: calc(375*var(--variable)*var(--ratio));
  margin: 0 auto;
  overflow: clip;
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - detail
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .detail {
  background-color: var(--color-green);
  padding: calc(63*var(--variable)*var(--ratio)) 0 calc(70*var(--variable)*var(--ratio));
}
.MC250530montecarlo .detail_inner {
  position: relative;
  z-index: 2;
}
.MC250530montecarlo .detail_lead {
  font-size: calc(14*var(--variable)*var(--ratio));
  line-height: 2;
  letter-spacing: .05em;
  font-weight: var(--font-weight-medium);
  font-family: var(--font-yu);
  color: var(--color-black);
  text-align: center;
}
.MC250530montecarlo .detail_date {
  width: calc(295*var(--variable)*var(--ratio));
  margin: calc(33*var(--variable)*var(--ratio)) auto 0;
}
/* @media screen and (min-width: 768px) {
  .MC250530montecarlo .detail {
    margin-top: -100vh;
  }
} */
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - product
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .product {
  padding-top: calc(57*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_maintitle {
  margin: 0 auto;
}
.MC250530montecarlo .product_detail {
  position: relative;
  z-index: 2;
  overflow: clip;
  width: calc(335*var(--variable)*var(--ratio));
  margin: calc(8*var(--variable)*var(--ratio)) auto 0;
  padding: calc(46*var(--variable)*var(--ratio)) 0 calc(60*var(--variable)*var(--ratio));
  background-color: var(--color_bg-white);
}
.MC250530montecarlo .product_detail::before {
  position: absolute;
  content: "";
  width: calc(335*var(--variable)*var(--ratio));
  height: calc(1003*var(--variable)*var(--ratio));
  background-image: url(../img/product_detail_bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  top: 0;
  left: 0;
  z-index: -1;
  pointer-events: none;
}
.MC250530montecarlo .product_detail_content {}
.MC250530montecarlo .product_detail_title {
  font-size: calc(19*var(--variable)*var(--ratio));
  line-height: 1.5;
  letter-spacing: .07em;
  font-weight: var(--font-weight-bold);
  font-family: var(--font-yu);
  color: var(--color-gold);
  text-align: center;
}
.MC250530montecarlo .product_detail_image {
  width: calc(295*var(--variable)*var(--ratio));
  margin: calc(25*var(--variable)*var(--ratio)) auto calc(30*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_detail_lead {
  padding-bottom: calc(30*var(--variable)*var(--ratio));
  font-size: calc(12*var(--variable)*var(--ratio));
  line-height: 1.8;
  letter-spacing: .07em;
  font-weight: var(--font-weight-medium);
  font-family: var(--font-weight-medium);
  color: var(--color-black);
  text-align: center;
}
.MC250530montecarlo .product_detail_btn {
  width: calc(150*var(--variable)*var(--ratio));
  margin: 0 auto;
}
.MC250530montecarlo .product_content {
  position: relative;
}
.MC250530montecarlo .product_content01 {
  z-index: 1;
}
.MC250530montecarlo .product_content02 {
  z-index: 2;
}
.MC250530montecarlo .product_content03 {
  z-index: 3;
}
.MC250530montecarlo .product_content04 {
  z-index: 4;
}
.MC250530montecarlo .product_content::after {
  position: absolute;
  content: "";
  width: 100vw;
  height: 100%;
  background-color: var(--color-yellow);
  z-index: 2;
  pointer-events: none;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity .5s ease;
}
.MC250530montecarlo .product_content02::after {
  height: calc(402*var(--variable)*var(--ratio));
  top: calc(-50*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_content03::after {
  height: calc(423*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_content04::after {
  height: calc(396*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_content.is-show::after {
  opacity: .9;
}
.MC250530montecarlo .product_text {
  margin-top: calc(20.*var(--variable)*var(--ratio));
  font-size: calc(12*var(--variable)*var(--ratio));
  line-height: 1.5;
  letter-spacing: .07em;
  font-weight: var(--font-weight-medium);
  font-family: var(--font-yu);
  color: var(--color-black);
  text-align: center;
}
.MC250530montecarlo .product_slider {
  width: calc(375*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_lead {
  font-size: calc(13*var(--variable)*var(--ratio));
  line-height: 2;
  letter-spacing: .07em;
  font-weight: var(--font-weight-medium);
  font-family: var(--font-yu);
  color: var(--color-black);
  white-space: nowrap;
  pointer-events: none;
}
@media screen and (min-width: 768px) {}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - product_fragrance
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .product_fragrance {
  background-color: var(--color-yellow);
}
.MC250530montecarlo .product_fragrance .product_inner {
  padding-bottom: calc(135*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_maintitle {
  width: calc(220*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_content01 {
  margin-top: calc(80*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_content02 {
  margin-top: calc(120*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_content04 {
  margin-top: calc(80*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_content::before {
  position: absolute;
  content: "";
  width: calc(273*var(--variable)*var(--ratio));
  height: calc(341*var(--variable)*var(--ratio));
  z-index: -1;
  background-color: var(--color-white);
}
.MC250530montecarlo .product_fragrance .product_content01::before {
  width: calc(375*var(--variable)*var(--ratio));
  height: calc(375*var(--variable)*var(--ratio));
  top: calc(0*var(--variable)*var(--ratio));
  left: calc(0*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_content02::before {
  top: calc(0*var(--variable)*var(--ratio));
  left: calc(0*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_content03::before {
  top: calc(82*var(--variable)*var(--ratio));
  right: calc(.5*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_content04::before {
  top: calc(0*var(--variable)*var(--ratio));
  left: 50%;
  transform: translateX(-50%);
}
.MC250530montecarlo .product_fragrance .product_title01 {
  width: calc(133*var(--variable)*var(--ratio));
  top: calc(-60*var(--variable)*var(--ratio));
  left: calc(20*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_title02 {
  width: calc(45*var(--variable)*var(--ratio));
  top: calc(133*var(--variable)*var(--ratio));
  left: calc(47*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_fragrance .product_title03 {
  width: calc(226*var(--variable)*var(--ratio));
  top: calc(351*var(--variable)*var(--ratio));
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - product_artpiece
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .product_artpiece {
  background-color: var(--color-green);
  padding-bottom: calc(77*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_artpiece .product_maintitle {
  width: calc(188*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_artpiece .product_content {
  width: fit-content;
  height: fit-content;
}
.MC250530montecarlo .product_artpiece .product_content01 {
  margin: calc(8*var(--variable)*var(--ratio)) auto 0;
}
.MC250530montecarlo .product_artpiece .product_content02 {
  margin: calc(58*var(--variable)*var(--ratio)) auto 0;
}
.MC250530montecarlo .product_artpiece .product_content::before {
  background-color: #F7D659;
}
.MC250530montecarlo .product_artpiece .product_text {
  margin-top: calc(17*var(--variable)*var(--ratio));
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - closing
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .closing {
  background-color: var(--color-yellow);
  padding: calc(50*var(--variable)*var(--ratio)) 0 calc(39*var(--variable)*var(--ratio));
}
.MC250530montecarlo .closing_inner {
  --row: calc(50*var(--variable)*var(--ratio));
}
.MC250530montecarlo .closing_btn {
  width: calc(160*var(--variable)*var(--ratio));
  margin: 0 auto;
}
.MC250530montecarlo .closing_copy {
  font-size: calc(10*var(--variable)*var(--ratio));
  line-height: 1.5;
  letter-spacing: .07em;
  font-weight: var(--font-weight-regular);
  font-family: var(--font-en);
  color: var(--color-black);
  text-align: center;
}
@media screen and (min-width: 768px) {}

/*
//////////////////////////////////////////////////////////////////////////////////////////////
setting - animation
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.MC250530montecarlo .js-accordion-content {
  display: none;
}
.MC250530montecarlo .js-accordion-toggle .product_detail_btn-close {
  display: none;
}
.MC250530montecarlo .js-accordion-toggle.is-open .product_detail_btn-open {
  display: none;
}
.MC250530montecarlo .js-accordion-toggle.is-open .product_detail_btn-close {
  display: block;
}
/* @media screen and (max-width: 767px) {
  .MC250530montecarlo .product_content:hover .js-hoverContents {
    opacity: 1;
    pointer-events: initial;
  }
} */
.MC250530montecarlo .product_content.is-show .js-hoverContents {
  opacity: 1;
  pointer-events: initial;
}
/* @media screen and (min-width: 768px) {
} */
.MC250530montecarlo .js-hoverContents {
  position: absolute;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  z-index: 10;
  transition: opacity .5s ease;
}
.MC250530montecarlo .js-hoverContents:has(.product_lead) {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: calc(40*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_content01 .js-hoverContents {
  top: calc(120*var(--variable)*var(--ratio));
  left: 50%;
  transform: translate(-50%);
}
.MC250530montecarlo .product_content02 .js-hoverContents {
  top: calc(156*var(--variable)*var(--ratio));
  left: calc(24*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_content03 .js-hoverContents {
  top: calc(172*var(--variable)*var(--ratio));
  left: calc(135*var(--variable)*var(--ratio));
}
.MC250530montecarlo .product_content04 .js-hoverContents {
  top: calc(81*var(--variable)*var(--ratio));
  left: 50%;
  transform: translateX(-50%);
}
.MC250530montecarlo .js-fadeImage {
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity 1s, transform 1s ease;
}
.MC250530montecarlo .js-fadeImage.is-active {
  opacity: 1;
  transform: translateY(0);
}
.MC250530montecarlo .product_title03.js-fadeImage {
  transform: translate(-50%, 2rem);
}
.MC250530montecarlo .product_title03.js-fadeImage.is-active {
  transform: translate(-50%, 0);
}
