@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400&display=swap');

:root {
  --pc-contents-width: 1366;
  --sp-contents-width: 390;

  /* font-family */
  --font-family_yugothic: YakuHanJP_Narrow, -apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Helvetica Neue", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --font-family_jost: 'Jost', sans-serif;

  /* color */
  --color-text: #3F2A2E;
  --color-ttl: #fff;
  --color-main: #E9EEA1;
  --color-sub: #5F9C97;
  --color-argan-main: #727E23;
  --color-argan-sub: #FAE79E;
  --swiper-theme-color:#5F9C97;

  /* width */
  --width-contents-max: 1440px;
  --width-contents-l: 1120px;
  --width-contents-m: 928px;
  --width-contents-max-rem: 144rem;
  --width-contents-l-rem: 112rem;
  --width-contents-m-rem: 92.8rem;

  /* padding */
  --padding-lr-sp: 3rem;
}

.jost {
  font-family: var(--font-family_jost);
  font-weight: 400;
}

._flex {
  display: flex;
  justify-content: center;
  align-items: center;
}

html body .pageContent {
  background-color: var(--color-main);
  padding: 0 2rem;
  font-family: var(--font-family_yugothic);
  font-feature-settings: "palt";
  color: var(--color-text);
}

.sp {
  display: block !important;
}

.pc {
  display: none !important;
}

html {
  font-size: calc(100vw / var(--sp-contents-width) * 10);
}

.pageContent picture {
  display: block;
  width: 100%;
  height: auto;
}

.pageContent img {
  width: 100%;
  height: auto;
}

.pageContent a {
  display: block;
  color: var(--color-text);
}

.pageContent i {
  font-style: normal;
}

.pageContent h1,
.pageContent h2,
.pageContent h3,
.pageContent h4{
  padding: 0;
  margin: 0 auto;
}

.pageContent p {
  padding: 0;
  margin: 0;
}

.pageContent sup {
  font-size: 50%;
}

.pageContent em {
  font-style: normal;
}

.sec_title{font-size: 3.2rem; font-weight: normal; color: var(--color-sub); text-align: center; position: relative;}
.sec_title.gothic{font-size: 2.8rem; font-weight: 600; letter-spacing: 0.08em;}
.sec_title.orn::before,
.sec_title.orn::after{display: block; content: ""; width: 11.4rem; height: 6.4rem; position: absolute; z-index: 1;}
.sec_title.orn::before{background: url(../img/img_flower-orn_01.png) center/contain no-repeat; top: -1rem; left: -7.1rem;}
.sec_title.orn::after{background: url(../img/img_flower-orn_02.png) center/contain no-repeat; top: -1rem; right: -7rem;}

.sec_title + .sec_title-lead {font-size: 1.4rem; line-height: calc(24/14); color: var(--color-sub); text-align: center; font-weight: 500; margin-top: 3rem;}

.item_list{margin-top: 3.5rem; position: relative; z-index: 2;}
.item_block{background-color: #fff; border-radius: 1.2rem; overflow: hidden; text-align: center; margin-top: 2rem;}
.item_block:first-child{margin-top: 0;}
.item_block .item_block-head {background-color: var(--color-sub);}
.item_block h3{background-color: var(--color-sub); color: #fff; font-size: 1.6rem; font-weight: bold; line-height: 5rem; text-align: center; line-height: calc(23/16); padding: 1.1rem 0;}
.item_block .swiper-container{margin-bottom: 1.5rem;}
.item_block .text{display: block; padding: 1.5rem 2rem 2rem;}
.item_block .scent{display: inline-block; border: 1px var(--color-text) solid; padding: 0 1.2em; font-size: 1.2rem; line-height: 2.5rem;}
.item_block h2{font-size: 1.4rem; font-weight: bold; line-height: 1.2857; margin-top: 1rem;}
.item_block em{display: block; font-size: 1.4rem; font-weight: normal; margin-top: .5rem;}
.item_block em small{display: inline-block; font-size: 1rem; margin-left: .5rem;}
.item_block aside{display: flex; justify-content: space-between; margin-top: 1rem;}
.item_block aside picture{width: 7rem;}
.item_block aside p{font-size: 1.2rem; text-align: left; line-height: 1.5;}
.item_block .set-desc {text-align: left; line-height: calc(16/10); padding-top: 0.3rem; margin-top: 0.2rem;}
.item_block aside + .set-desc {border-top: 1px solid #707070; margin-top: 0.7rem;}
.item_block .set-desc em {font-size: 1rem; font-weight: 600;}
.item_block .set-desc p {font-size: 1rem;}
.item_block .buy{display: block; background-color: var(--color-sub); border-radius: .6rem; font-size: 1.6rem; font-weight: bold; line-height: 4.3rem; color: #fff; margin-top: 0.8rem; transition-duration: .3s;}

.add_copyright{position: relative;}
.add_copyright::after{display: block; content: ""; width: 8rem; height: 6rem; background: url(../img/copyright_g.png) center/contain no-repeat; position: absolute;}

.swiper-container{position: relative;}
.swiper-pagination{bottom: -2rem !important;}
.swiper-pagination-bullet{width: 1rem !important; height: 1rem !important;}
.swiper-button-prev{left: 0 !important;}
.swiper-button-next{right: 0 !important;}
.swiper-button-prev::before,
.swiper-button-next::before{display: none;}
.swiper-button-prev::after,
.swiper-button-next::after{display: block; content: ""; width: 1rem; height: 1.6rem; background: url(/on/demandware.static/-/Sites-MEL_JP-Library/ja_JP/data/melvita/Holiday1/img/arrow_swiper.png) center/contain no-repeat; transform: scale(-1);}

.split_link{width: 44%; height:0; padding-top: 58%; overflow: hidden; position: absolute; top: 10%;}
.split_link.link01{left: 3%;}
.split_link.link02{right: 3%;}

.btn_backtotop{opacity: 0; position: fixed; bottom: 1rem; right: .2rem; z-index: 100; transition-duration: .3s;}
.btn_backtotop.show{opacity: 1;}
.btn_backtotop a{display: block; width: 8rem; height: 0; padding-top: 8rem; overflow: hidden; background: url(/on/demandware.static/-/Sites-MEL_JP-Library/ja_JP/data/melvita/Holiday1/img/btn_backtotop.png) center/contain no-repeat;}

@media screen and (min-width: 767px) {
  html {font-size: min(calc(100vw / var(--pc-contents-width) * 10), 10px);}
  .sp {display: none !important;}
  .pc { display: block !important;}

  .wrap01{display: flex; justify-content: flex-start; align-items: flex-start;}

  .sec_title{font-size: 4.2rem;}
  .sec_title.gothic{font-size: 3.8rem; font-weight: 600; letter-spacing: 0.1em;}
  .sec_title.orn::before,
  .sec_title.orn::after{width: 28.2rem; height: 16rem;}
  .sec_title.orn::before{top: -4.8rem; left: 0;}
  .sec_title.orn::after{top: -4.8rem; right: 0;}

  .sec_title + .sec_title-lead {font-size: 1.8rem; line-height: calc(28/18); color: var(--color-sub); text-align: center; font-weight: 500; margin-top: 1rem;}
  
  .item_list{display: flex;flex-wrap: wrap;justify-content: space-between;margin: 3rem auto 0;width: 73.5rem;gap: 4.2rem 0;}
  .item_block{width: 35rem; margin-top: 0;}
  .item_block .item_block-head {display: flex; justify-content: center; align-items: center;}
  .item_block h3{line-height: calc(22/16); margin: 0; width: 100%;}
  .item_block a:hover .buy{background-color: var(--color-main); color: var(--color-sub);}
  .item_block .text{display: block; padding: 1.5rem 2.5rem 2.5rem;}

  .add_copyright::after{width: 12rem;}

  .btn_backtotop{bottom: 6rem; right: 6rem;}
  .btn_backtotop a{width: 9rem; padding-top: 9rem;}
}


/*----mv*/
.sec_mv{padding: 1.8rem 0 10.8rem; position: relative;}
.sec_mv::after{display: block; content: ""; width: 36rem; height: 9.003rem; background: url(../img/sp/img_mv-orn.png) center/contain no-repeat; position: absolute; bottom: 0; left: 50%; transform: translateX(-50.05%);}
.sec_mv h1{font-size: 0;}
.sec_mv picture{margin-top: .55rem;}
.sec_mv picture.add_copyright::after{bottom: -4rem; right: 0;}

@media screen and (min-width: 767px) {
  .sec_mv{display: flex; flex-direction: row-reverse; justify-content: center; align-items: center; width: 1366px; padding: 5rem 0 0; margin: 0 auto;}
  .sec_mv::after{width: 56.795rem; height: 16.409rem; left: 72rem; bottom: 1.1rem; transform: translateX(0); background: url(../img/img_mv-orn.png) center/contain no-repeat;}
  .sec_mv h1{width: 54.5rem; margin-left: 4.6rem; margin-bottom: 9rem;}
  .sec_mv picture{width: 67.8rem; margin: 0 0 0 2.2rem}
}

/*----intro*/
.sec_intro{margin-top: 2.2rem;}
.sec_intro h1{width: 32.1rem; font-size: 0; margin: 0 auto;}
.sec_intro h2{padding-bottom: 0; font-size: 1.4rem; font-weight: 500; color: var(--color-sub); text-align: center; line-height: 2; margin: 0 auto; position: relative;}
.sec_intro .note{border: 1px var(--color-sub) solid; padding: 0.8em 1em; font-size: 1.2rem; font-weight: 500; color: var(--color-sub); line-height: 1.4; margin-top: 2.8rem;}
.sec_intro .gwp_nav{margin-top: 1.5rem;}
.sec_intro .gwp_nav ul{}
.sec_intro .gwp_nav ul li + li{margin-top: .5rem;}
.sec_intro .gwp_nav ul li a{display: flex; justify-content: space-between; align-items: center; border-radius: .5rem; padding: 0.7em 1em 0.7em 1.15em; font-family: var(--font-family_jost); position: relative; transition-duration: .3s;}
.sec_intro .gwp_nav ul li i{display: block; width: 5rem; font-size: 1.6rem; font-weight: bold;}
.sec_intro .gwp_nav ul li i em{font-size: 1.8rem;}
.sec_intro .gwp_nav ul li p{width: calc(100% - 7rem);}
.sec_intro .gwp_nav ul li p > *{display: block; font-weight: normal;}
.sec_intro .gwp_nav ul li p .b{font-size: 1.6rem;}
.sec_intro .gwp_nav ul li p .s{font-size: 1.3rem;}
.sec_intro .gwp_nav ul li p small{font-size: 70%;}
.sec_intro .gwp_nav ul li p strong{font-weight: bold;}

.sec_intro .gwp_nav ul li:nth-child(1) a{color: #EFE9EC; background-color: #DD766F; pointer-events: none;}
.sec_intro .gwp_nav ul li:nth-child(1) a::after{display: block; content: ""; width: 2.6rem; height: 2.6rem; background: url(../img/icon_arrow-wr-right.svg) center/contain no-repeat; position: absolute; top: 50%; right: 1.7rem; transform: translateY(-50%);}
.sec_intro .gwp_nav ul li:nth-child(2) a{color: #E9EEA1; background-color: #5F9C97; pointer-events: none;}
.sec_intro .gwp_nav ul li:nth-child(3) a{background-color: #B6A0CC; color: #fff; pointer-events: none;}
.sec_intro .gwp_nav ul li:nth-child(3) a::after{display: block; content: ""; width: 2.6rem; height: 2.6rem; background: url(../img/icon_arrow-wp-right.svg) center/contain no-repeat; position: absolute; top: 50%; right: 1.7rem; transform: translateY(-50%);}

.sec_intro .gwp_nav ul li.bnr {margin-top: 1.5rem;}
.sec_intro .gwp_nav ul li.bnr a{padding: 0;}

@media screen and (min-width: 767px) {
  .sec_intro{width: 97rem; margin: 9rem auto 0;}
  .sec_intro h1{width: 50rem;}
  .sec_intro h2{padding-bottom: 4.8rem; font-size: 1.8rem; line-height: 2.2222;}
  .sec_intro h2::before,
  .sec_intro h2::after{display: block; content: ""; position: absolute; bottom: 10rem;}
  .sec_intro h2::before{width: 28.2rem; height: 16rem; background: url(../img/img_flower-orn_01.png) center/contain no-repeat; left: -9rem;}
  .sec_intro h2::after{width: 28.2rem; height: 16rem; background: url(../img/img_flower-orn_02.png) center/contain no-repeat; right: -9rem;}
  .sec_intro .note{padding: 1.6em 3em; font-size: 1.2rem; color: var(--color-sub); line-height: 1.4; text-align: center; margin-top: 0;}
  .sec_intro .gwp_nav{margin-top: 2rem;}
  .sec_intro .gwp_nav ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
  .sec_intro .gwp_nav ul li{width: 32rem; margin-top: 0;}
  .sec_intro .gwp_nav ul li + li{margin-top: 0;}
  
  .sec_intro .gwp_nav ul li:nth-child(1) a:hover{background-color: #de5b54;}
  .sec_intro .gwp_nav ul li:nth-child(3) a:hover{background-color: #a97cd5;}
  .sec_intro .gwp_nav ul li.bnr {width: 100%; margin-top: 2rem;}
}

/*----lineup*/
.sec_lineup{margin-top: 2.6rem;}

.sec_lineup nav{margin-top: 1.4rem;}
.sec_lineup nav ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.sec_lineup nav ul li {width: calc(50% - .1rem); background-color: #fff; margin-top: .2rem;}
.sec_lineup nav ul li a{display: flex; align-items: center; height: 6rem; position: relative;}
.sec_lineup nav ul li a::after{display: block; content: ""; width: 1.5rem; height: 1.5rem; background: url(../img/icon_arrow-g-down.svg) center/contain no-repeat; position: absolute; top: 50%; right: 1rem; transform: translateY(-50%);}
.sec_lineup nav ul li picture{width: 5.6rem; text-align: center; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.sec_lineup nav ul li h3{width: calc(100% - 8rem); font-size: .9rem; line-height: 1.3333; text-align: center; white-space: nowrap; margin-left: 5rem;}

.sec_lineup nav ul li:nth-child(2) h3{margin-left: 6rem; text-align: left;}
.sec_lineup nav ul li.sec_lineup-nav--argan{background: var(--color-argan-main); width: 100%; margin-top: 1.5rem;}
.sec_lineup nav ul li.sec_lineup-nav--argan a{height: 6.9rem;}
.sec_lineup nav ul li.sec_lineup-nav--argan a::after{background: url(../img/icon_arrow-y-down.svg) center/contain no-repeat; right: 1.4rem;}
.sec_lineup nav ul li.sec_lineup-nav--argan picture{width: 10.8rem;}
.sec_lineup nav ul li.sec_lineup-nav--argan h3{font-size: 1.4rem; color: var(--color-argan-sub); margin-left: 7.7rem; line-height: 1;}


@media screen and (min-width: 767px) {
  .sec_lineup{width: 116.4rem; margin: 3rem auto 0;}

  .sec_lineup nav{width: 97rem; margin: 2rem auto 0;}
  .sec_lineup nav ul{display: flex; flex-wrap: wrap; justify-content: space-between; width: 35rem; margin: 0 auto;}
  .sec_lineup nav ul li {width: calc(50% - .1rem); margin-top: 0;}
  .sec_lineup nav ul li a{display: flex; align-items: center; height: 6rem; position: relative; transition-duration: .3s;}
  .sec_lineup nav ul li a::after{display: block; content: ""; width: 1.5rem; height: 1.5rem; background: url(../img/icon_arrow-g-down.svg) center/contain no-repeat; position: absolute; top: 50%; right: 1.2rem; transform: translateY(-50%);}
  .sec_lineup nav ul li picture{left: 0;}
  .sec_lineup nav ul li h3{width: calc(100% - 8rem); margin-left: 4.7rem;}
  .sec_lineup nav ul li:nth-child(2) h3{margin-left: 6rem; text-align: left;}

  .sec_lineup nav ul li a:hover{opacity: 0.5;}

  .sec_lineup nav ul li.sec_lineup-nav--argan{margin-top: 2.7rem;}
}


/*----arganoil*/
.sec_arganoil{margin-top: 9.2rem;}

.sec_arganoil .item_block.unscented h3{background-color: #D4C7B6;}
.sec_arganoil .item_block.rose h3{background-color: #F8D0DD;}
.sec_arganoil .item_block.suzuran h3{background-color: #C2E2D9;}

.sec_arganoil .eco-reuse{display: flex; justify-content: space-between; align-items: center; padding: 1.2rem;}
.sec_arganoil .eco-reuse picture{width: 11.8rem;}
.sec_arganoil .eco-reuse p{width: calc(100% - 13rem); font-size: 1.2rem; text-align: left; line-height: 1.5;}
.sec_arganoil .eco-reuse p strong{display: block; font-size: 2rem; font-family: var(--font-family_jost); font-weight: normal; color: var(--color-main);}

@media screen and (min-width: 767px) {
  .sec_arganoil{width: 116.4rem; margin: 12rem auto 0;}
  
  .sec_arganoil .eco-reuse{width: 57.6rem; padding: 1.83rem; margin: 5rem auto 0;}
  .sec_arganoil .eco-reuse picture{width: 15.45rem;}
  .sec_arganoil .eco-reuse p{width: calc(100% - 19rem);}
}


/*----aow*/
.sec_aow{margin-top: 6.5rem;}
.sec_aow .item_block.item01 h3{background-color: #FBD76F;}

@media screen and (min-width: 767px) {
  .sec_aow{width: 35rem;}
  .sec_aow .sec_title.orn::before,
  .sec_aow .sec_title.orn::after{display: none;}
}

/*----wash*/
.sec_wash{ margin: 6.5rem 0 0 0;}
.sec_wash .item_block.item01 h3{background-color: #CFC0D6;}
.sec_wash .item_block.item02 h3{background-color: #C1D4EB;}

@media screen and (min-width: 767px) {
  .sec_wash{width: 75.7rem; margin: 6.5rem 0 0 5.7rem;}
  .sec_wash .sec_title.orn::before,
  .sec_wash .sec_title.orn::after{display: none;}
}

/*----3step*/
.sec_3step{margin-top: 4rem;}
.sec_3step header{font-size: 1rem !important; text-align: center;}
.sec_3step header i{display: inline-block; background-color: #fff; padding: 0 1.5rem; font-size: 1.4rem; font-weight: bold; line-height: 2; color: var(--color-main);}
.sec_3step header em{display: block; font-size: 1.4rem; font-weight: 500; color: #fff; margin-top: 1rem;}
.sec_3step header h1{font-size: 2.2rem; font-weight: bold; color: #fff; line-height: 1.2727; margin-top: 1.3rem;}

.sec_3step .chart{min-height: 40.5rem; margin-top: 1.8rem; position: relative;}
.sec_3step .chartbox{width: 100%; background-color: #fff; border-radius: 1.2rem; padding: 2rem 2.5rem; text-align: center; opacity: 0; pointer-events: none; position: absolute; top: 0; left: 0; transition : all .6s ease-out;}
.sec_3step .chartbox.act{opacity: 1; pointer-events: all; position: relative;}

.sec_3step .chartbox.question{padding: 3.7rem 0;}
.sec_3step .chartbox.question .flow{}
.sec_3step .chartbox.question .flow ul{display: flex; justify-content: center; align-items: center;}
.sec_3step .chartbox.question .flow ul li{width: 8rem;}
.sec_3step .chartbox.question .flow i{display: inline-flex; justify-content: center; align-items: center; width: 3.2rem; height: 3.2rem; background-color: #C1C1C1; border-radius: 2em; font-size: 1.8rem; font-family: var(--font-family_jost); color: #fff; position: relative;}
.sec_3step .chartbox.question .flow i::after{display: block; content: ""; width: 1.7rem; height: 1px; background-color: var(--color-text); position: absolute; top: 50%; left: -3rem; transform: translateY(-50%);}
.sec_3step .chartbox.question .flow ul li:first-child i::after{display: none;}
.sec_3step .chartbox.question .flow ul li.act i{background-color: var(--color-main);}
.sec_3step .chartbox.question .flow span{display: block; font-size: 1rem; font-weight: bold; color: #C1C1C1; margin-top: 1rem;}
.sec_3step .chartbox.question .flow ul li.act span{color: var(--color-text);}
.sec_3step .chartbox.question strong{display: block; font-size: 1.4rem; font-weight: bold; margin-top: 3.7rem;}
.sec_3step .chartbox.question .select{margin-top: 2.3rem;}
.sec_3step .chartbox.question .select ul{display: flex; justify-content: center;}
.sec_3step .chartbox.question .select ul li{display: flex; flex-direction: column; justify-content: center; width: 10.7rem; height: 19.2rem; border: 1px #D1D1D1 solid; border-radius: 1.2rem; margin: 0 .4rem; transition-duration: .3s;}
.sec_3step .chartbox.question.q2 .select ul li{width: 14.1rem; margin: 0 1rem;}
.sec_3step .chartbox.question .select picture{}
.sec_3step .chartbox.question.q2 .select picture img{width: auto; height: 11.5rem;}
.sec_3step .chartbox.question .select p{font-size: 1.2rem; font-weight: bold; line-height: 1.583; margin-top: .8rem;}

.sec_3step .chartbox.answer{}
.sec_3step .chartbox.answer a{display: block;}
.sec_3step .chartbox.answer strong{display: block; font-size: 2.2rem; font-weight: bold; line-height: 1.45;}
.sec_3step .chartbox.answer picture{width: calc(100% + 5rem); max-width: unset; margin: 0 -2.5rem;}
.sec_3step .chartbox.answer h2{font-size: 1.4rem; font-weight: bold; line-height: 1.2857; margin-top: 2rem;}
.sec_3step .chartbox.answer em{display: block; font-size: 1.4rem; font-weight: normal; margin-top: 1rem;}
.sec_3step .chartbox.answer em small{font-size: 1rem;}
.sec_3step .chartbox.answer p{font-size: 1.2rem; line-height: 1.5; text-align: left; margin-top: 1rem;}
.sec_3step .chartbox.answer .note{display: block; border-top: 2px #707070 solid; padding-top: 1rem; font-size: 1rem; line-height: 1.6; text-align: left; margin-top: 1rem;}
.sec_3step .chartbox.answer .note b{font-weight: bold;}
.sec_3step .chartbox.answer .note ul{list-style-type: disc; padding-left: 2em;}
.sec_3step .chartbox.answer .buy{display: block; background-color: var(--color-main); border-radius: .6rem; font-size: 1.6rem; font-weight: bold; line-height: 4.3rem; color: #fff; margin-top: 1.1rem; transition-duration: .3s;}
.sec_3step .chartbox.answer .back{display: flex; justify-content: center; align-items: center; border-radius: .6rem; border: 1px #707070 solid; font-size: 1.6rem; font-weight: bold; line-height: 4.3rem; margin-top: 1.3rem; position: relative;}
.sec_3step .chartbox.answer .back::before{display: inline-block; content: ""; width: 1.45rem; height: 1.45rem; background: url(../img/icon_back.png) center/contain no-repeat; margin-right: 1.25rem;}

@media screen and (min-width: 767px) {
  .sec_3step{margin-top: 12.3rem;}
  .sec_3step .chart{width: 38rem; min-height: 40.5rem; margin: 4.6rem auto 0;}

  .sec_3step .chartbox.question .select ul li:hover{cursor: pointer; background-color: #FBE1DE;}
  .sec_3step .chartbox.answer a:hover .buy{background-color: #FBE1DE; color: var(--color-main);}
  .sec_3step .chartbox.answer .back:hover{cursor: pointer; background-color: #CFC1C4;}
}

/*----present*/
.sec_present{--swiper-theme-color:#AED9CD; padding-top: 18.8rem;}
.sec_present > h1{text-align: center; position: relative;}
.sec_present > h1::before{display: block; content: ""; width: calc(100% + 4rem); height: 8.237rem; background: url(../img/sp/present_orn_01.png) center/contain no-repeat; position: absolute; top: -11.5rem; left: 50%; transform: translateX(-50%);}
.sec_present > h1 img{width: 32.2rem; position: relative;}
.sec_present > h2{font-size: 2.2rem; color: var(--color-sub); text-align: center; margin-top: 0.8rem;}

.sec_present .item_list{margin-top: 2.6rem;}
.sec_present .item_block {margin-top: 3rem;}
.sec_present .item_block h3{background-color: #AED9CD; font-size: 1.2rem; color: var(--color-text);}
.sec_present .item_block h3 strong{font-size: 1.6rem;}
.sec_present .item_block .term{display: inline-block; border: 1px var(--color-text) solid; padding: 0.5rem 1.5rem; font-size: 1.2rem; font-weight: bold; margin-top: 2rem;}
.sec_present .item_block h2{font-size: 1.6rem; margin-top: 2rem;}
.sec_present .item_block .swiper-container{margin-top: 1rem;}
.sec_present .item_block .spec{font-size: 1rem;}
.sec_present .item_block .note{display: block; font-size: 1rem; text-align: left; margin-top: .5rem;}

.sec_present .shopper{overflow: visible; margin-top: 10.5rem; position: relative;}
.sec_present .shopper::before{display: block; content: ""; width: 6.8rem; height: 6.8rem; background: url(/on/demandware.static/-/Sites-MEL_JP-Library/ja_JP/data/melvita/Holiday1/img/plus_present.png) center/contain no-repeat; position: absolute; top: -8.6rem; left: 50%; transform: translateX(-50%);}
.sec_present .shopper .text{display: flex; justify-content: space-between; align-items: flex-start;}
.sec_present .shopper .text picture{width: 13.9rem;}
.sec_present .shopper .text p{width: calc(100% - 13.9rem); text-align: left;}
.sec_present .shopper .text p b{font-size: 1.2rem; font-weight: normal;}
.sec_present .shopper .text p span{font-weight: 600; text-decoration: underline; text-underline-offset: -0.25em; text-decoration-thickness: .5rem; text-decoration-color: #AED9CD;}
.sec_present .shopper .text p small{display: block; font-size: 1rem; margin-top: 1rem;}

.bnr_nwxt{padding: 1.4rem; margin: 0 -2rem;}
.bnr_nwxt a{display: block; background-color: rgba(255,255,255,.96); padding: 0 .8rem; height: 10rem; display: flex; align-items: center; justify-content: center; flex-flow: column; font-family: var(--font-family_jost); text-align: center; position: relative; transition-duration: .3s;}
.bnr_nwxt a::after{display: block; content: ""; width: 2.6rem; height: 2.6rem; position: absolute; top: 50%; right: 1.7rem; transform: translateY(-50%);}
.bnr_nwxt a > *{display: block;}
.bnr_nwxt i{font-size: 1.9rem; font-weight: bold;}
.bnr_nwxt i em{font-size: 2.1rem;}
.bnr_nwxt .b{font-size: 1.9rem;}
.bnr_nwxt .s{font-size: 1.5rem;}
.bnr_nwxt strong{font-size: 1.4rem;}
.bnr_nwxt small{font-size: 70%;}

.bnr_nwxt--01 {background: url(../img/bnr_holiday1_bg.jpg) center/cover no-repeat;}
.bnr_nwxt--01 a{color: #F29286;}
.bnr_nwxt--01 a::after{background: url(../img/icon_arrow-r-right.svg) center/contain no-repeat;}
.bnr_nwxt--03 {background: url(../img/bnr_holiday3_bg.jpg) center/cover no-repeat;}
.bnr_nwxt--03 a{color: #B6A0CC;}
.bnr_nwxt--03 a::after{background: url(../img/icon_arrow-p-right.svg) center/contain no-repeat;}

.present_note{background-color: #fff; padding: 2.2rem 2rem; margin: 0 -2rem; position: relative;}
.present_note p{font-size: 1rem; line-height: calc(16/10);}
.present_note p + p{margin-top: 1.4rem;}
.copyright{display: block; font-size: 1rem; text-align: left; margin-top: 1rem;}

@media screen and (min-width: 767px) {
  .sec_present{width: 116.8rem; padding-top: 7.5rem; margin: 14.2rem auto 0;}
  .sec_present > h1::before{width: 136.6rem; height: 11.6rem; background: url(../img/present_orn_01.png) center/contain no-repeat; position: absolute; top: -15.5rem; left: 50%; transform: translateX(-50%);}

  .sec_present .item_list{margin-top: 0;/* width: 100%; */}
  .sec_present .item_block {margin-top: 2rem;}
  .sec_present .item_block h3{line-height: calc(22/16); padding: 1.1rem 0; display: block; height: auto;}

  .sec_present .shopper{width: 57.6rem; margin: 7.6rem auto 0;}
  .sec_present .shopper::before{top: -9rem;}
  .sec_present .shopper header{width: 32.6rem; position: absolute; top: 1.5rem; right: 2rem;}
  .sec_present .shopper .text picture{width: 21rem;;}
  .sec_present .shopper .text picture img{margin-left: -2rem;}
  .sec_present .shopper .text p{width: calc(100% - 21rem); margin-top: 10.5rem}

  .sec_ps-links {
    display: flex;
    width: 81rem;
    margin: 0 auto;
  }
  .bnr_nwxt{width: 39rem; margin: 3rem auto 0;}
  .bnr_nwxt.bnr_nwxt--01 a:hover{background-color: #fcf2ee;}
  .bnr_nwxt.bnr_nwxt--03 a{pointer-events: none;}
  .bnr_nwxt.bnr_nwxt--03 a:hover{background-color: #fbedff;}

  .present_note{width: 107.6rem; padding: 2.3rem 0 4rem; margin: 2.8rem auto 0; z-index: 1;}
  .present_note::before{display: block; content: ""; width: 100vw; height: 100%; background-color: #fff; position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: -1;}
}

/*--20231115--*/
/* .sec_intro .note{display: none;} */

.sec_intro .gwp_nav ul li:nth-child(1) a{pointer-events: all;}
.sec_intro .gwp_nav ul li:nth-child(3) a{pointer-events: all;}

.bnr_nwxt.bnr_nwxt--03 a{pointer-events: all;}



/* holiday2 */
/* sec_bodycare */
.sec_bodycare {margin-top: 8.8rem;}
@media screen and (min-width: 767px) {
  .sec_bodycare {margin-top: 11.2rem;}
}

/* sec_skincare */
.sec_skincare {margin-top: 11rem;}
.sec_skincare .item_list{margin-top: 1.6rem;}
@media screen and (min-width: 767px) {
  .sec_skincare {margin-top: 11rem;}
  .sec_skincare .sec_title.orn::before,
  .sec_skincare .sec_title.orn::after {
    top: -1.8rem;
  }
  .sec_skincare .item_list{margin-top: 5.5rem;}
}

/* sec_argan */
.sec_argan {
  width: calc(100% + 4rem);
  margin: 2.6rem -2rem 0;
  background: var(--color-argan-main);
  padding-bottom: 3rem;
}
.sec_argan .sec_argan__head {
  gap: 2.6rem;
  display: flex;
  flex-flow: column;
}
.sec_argan .sec_argan__head-txt {
  color: var(--color-argan-sub);
  text-align: center;
  position: relative;
}
.sec_argan .sec_argan__head-txt::before {
  content: "";
  background: no-repeat center/contain url(/on/demandware.static/-/Sites-MEL_JP-Library/ja_JP/data/melvita/Holiday2/img/sp/img_argan-orn_01.png);
  width: 39rem;
  height: 42.3rem;
  top: -1.1rem;
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
}
.sec_argan .sec_argan__head-txt h2 i {
  font-size: 1.6rem;
  display: inline-block;
  border: 1px solid var(--color-argan-sub);
  padding: 1rem;
  padding: 0.2rem 1.3rem;
  font-weight: 500;
}
.sec_argan .sec_argan__head-txt h2 em {
  font-size: 2.8rem;
  display: block;
  margin: 0.7rem auto 0.7rem;
}
.sec_argan .sec_argan__head-txt p {
  font-size: 1.4rem;
  line-height: 2;
}
.sec_argan .sec_argan__body {
  padding: 0 2rem;
  z-index: 10;
  position: relative;
  margin-top: 3rem;
}
.sec_argan .item_block {
  margin-top: 3rem;
}
.sec_argan .item_block h3 {
  background: var(--color-argan-sub);
  color: var(--color-text);
}
.sec_argan .item_block .swiper-container {
  margin-bottom: 0;
}
.sec_argan .item_block .text {
  padding-top: 0;
}
.sec_argan .item_block h2 {
  margin-top: 0.5rem;
}
.sec_argan .item_block .buy {
  background: var(--color-argan-main);
  margin-top: 1.2rem;
}

@media screen and (min-width: 767px) {
  .sec_argan {
    width: calc(100% + 4rem);
    margin: 5rem -2rem 0;
    background: var(--color-argan-main);
    padding-bottom: 5.4rem;
  }
  .sec_argan .sec_argan__head {
    gap: 0;
    flex-flow: row;
    max-width: 133.6rem;
    margin: 0 auto;
  }
  .sec_argan .sec_argan__head-img {
    width: 81.7rem;
  }
  .sec_argan .sec_argan__head-txt {
    flex: 1;
    padding-top: 12.5rem;
  }
  .sec_argan .sec_argan__head-txt::before {
    content: "";
    background: no-repeat center/contain url(/on/demandware.static/-/Sites-MEL_JP-Library/ja_JP/data/melvita/Holiday2/img/img_argan-orn.png);
    width: 100%;
    height: 52.746rem;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
  }
  .sec_argan .sec_argan__head-txt h2 i {
    font-size: 1.6rem;
    display: inline-block;
    border: 1px solid var(--color-argan-sub);
    padding: 1rem;
    padding: 0.2rem 1.3rem;
    font-weight: 500;
  }
  .sec_argan .sec_argan__head-txt h2 em {
    font-size: 2.8rem;
    display: block;
    margin: 1rem auto 1.1rem;
    letter-spacing: 0.1em;
  }
  .sec_argan .sec_argan__head-txt p {
    font-size: 1.4rem;
    line-height: 2;
  }
  .sec_argan .sec_argan__body {
    padding: 0;
    z-index: 10;
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 116.8rem;
    margin: 6.5rem auto 0;

  }
  .sec_argan .item_block {
    margin-top: 0;
  }
  .sec_argan .item_block h3 {
    background: var(--color-argan-sub);
    color: var(--color-text);
    line-height: calc(22/16);
    padding: 1.1rem 0;
    height: auto;
  }
  .sec_argan .item_block .swiper-container {
    margin-bottom: 0;
  }
  .sec_argan .item_block .text {
    padding-top: 0;
  }
  .sec_argan .item_block h2 {
    margin-top: 0.5rem;
  }
  .sec_argan .item_block .buy {
    background: var(--color-argan-main);
    margin-top: 1.2rem;
  }
  .sec_argan .item_block a:hover .buy {
    background-color: var(--color-argan-sub);
    color: var(--color-argan-main);
  }
}