@charset "UTF-8";
/* CSS Document */

.mb5p{ margin-bottom: 5% !important;}
.mb10p{ margin-bottom: 10% !important;}
.mb15p{ margin-bottom: 15% !important;}
.mb20p{ margin-bottom: 20% !important;}

  .mb100 { margin-bottom: 100px !important;}
  .mb60 { margin-bottom: 60px !important;}
  .mb30 { margin-bottom: 30px !important;}
  .mb20 { margin-bottom: 20px !important;}
  .mb15 { margin-bottom: 15px !important;}
  .mb10 { margin-bottom: 10px !important;}
  .mb8 { margin-bottom: 8px !important;}
  .mb0 { margin-bottom: 0px !important;}
  .center { text-align: center;}
.left { text-align: left !important;}

  @media screen and (max-width: 767px) {
    .mb100 { margin-bottom: 20% !important;}
    .mb60 { margin-bottom: 25% !important;}
    .mb30 { margin-bottom: 10% !important;}
    .mb20 { margin-bottom: 8% !important;}
    .mb15 { margin-bottom: 3% !important;}
    .mb10 { margin-bottom: 2% !important;}
    .mb8 { margin-bottom: 1% !important;}
    .sp_mb10 { margin-bottom: 10px !important;}
	 .sp_mb20 { margin-bottom: 20px !important;}
    .sp_mb30 { margin-bottom: 6% !important;}
    .sp_mb60 { margin-bottom: 18% !important;}
	.sp-left { text-align: left !important;}
	  }

  /*col-set*/
  .col-set {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: calc(100% + 30px);
    -webkit-box-lines: multiple;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .col1-2 { width: calc(50% - 30px);}
  .col1-3 { width: calc(33.33333333% - 30px);}
  .col2-3 { width: calc(66.66666666% - 30px);}
  .col1-4 { width: calc(25% - 30px);}
  .col3-4 { width: calc(75% - 30px);}
  .col1-5 { width: calc(20% - 30px);}
  .col1-6 { width: calc(16.66666666% - 30px);}
  .col1000-2618 { width: calc(38.2% - 30px);}
  .col1618-2618 { width: calc(61.8% - 30px);}

  .col1-2,
  .col1-3,
  .col2-3,
  .col1-4,
  .col3-4,
  .col1-5,
  .col1-6,
  .col1000-2618,
  .col1618-2618 {
    margin-right: 30px;
  }

  @media screen and (max-width: 767px) {
    .col-set {
      width: calc(100% + 5px);
    }

    .col1-2,
    .col1-3,
    .col2-3,
    .col1-4,
    .col3-4,
    .col1-5,
    .col1-6,
    .col1000-2618,
    .col1618-2618 {
      width: calc(100% - 5px);
      margin-right: 5px;
    }

    .sp-col1-2 {
      width: calc(50% - 5px);
    }
	  
    .sp-col1-3 {
      width: calc(33.333% - 5px);
    }
  }


.col_center{ display: flex; justify-content: center;}

.fade-in {
  opacity: 0;
  transform: translateY(10px);
  visibility: hidden;
  transition: opacity 0.6s ease-out, transform 1.2s ease-out;
  will-change: opacity, visibility;
}

.fade-in.is-visible {
  opacity: 1;
  transform: none;
  visibility: visible;
}
.fade-in.--2 {
  transition-delay: 300ms;
}
.fade-in.--3 {
  transition-delay: 500ms;
}

.lp_block * {
  font-family:"Lato", 'Noto Sans JP', "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}

.lp_block {
  color: #6B605A;
}

.lp_block p{ word-break: break-all;}

@media (max-width: 767px) {
.lp_block {
    padding-top: 0px;
	min-width: 360px;
  }
}
	
.mvSec { margin-bottom: 50px;}
.mvSec p {
  font-family: "Lato", 'Noto Serif JP', "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  margin-top: 31px;
}
	
.mvSec p.h1 {
font-family: "Noto Serif JP", serif;
font-weight: normal;
font-size: 2rem;
line-height: 1.5;
text-align: center;
  margin-top: 30px;
  margin-bottom: 20px;
	  letter-spacing: 0.1rem;
}


.lp_block section h4{ font-size: 1.65rem; margin-bottom: 20px;}
.lp_block section h4 span{ font-size: 80%;}
.lp_block section h5{ font-size: 1.6rem; color: #333333; margin-bottom: 10px; font-weight: 300; letter-spacing: 1px; line-height: 1.5;
font-family: 'Noto Serif JP', "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;}

.lp_block section h6{ font-size: 1.6rem; margin-bottom: 10px; font-weight: 500; letter-spacing: 1px; line-height: 1.8;}
.lp_block section p{ line-height: 1.8;/* font-weight: 300;*/}

@media (max-width: 767px) {
.mvSec p.h1 { font-size: 1.4rem; text-align: center; margin-top: 24px; margin-bottom: 13px;}
  .mvSec { margin-bottom: 0;}
  .mvSec .container { padding: 0;}
  .mvSec p { margin-top: 21px;}
}
	
.container-min {
  max-width: 890px;
  margin: auto;
}
.container-mid {
  max-width: 900px;
  margin: auto;
}

@media (max-width: 767px) {
  .container-min {
    padding: 0 15px;
  }
  .container-mid {
    padding: 0 15px;
  }

}

.conceptSec {
  margin-bottom: 100px;
}
.conceptbox {
  display: flex;
  justify-content: space-between;
  margin-bottom: 50px;
}


/*.conceptSec p {
  font-family: 'Noto Serif JP', "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}*/
@media (max-width: 767px) {
  .conceptSec {
    margin-bottom: 50px;
  }
  .conceptSec p {
    font-size: 12px;
  }
  .conceptbox {
    margin-bottom: 33px;
  }	
}

@media (max-width: 767px) {
.lp_block {
    margin-top: 0px!important;
	min-width: 360px;
  }
div.cont_block{ padding: 0 3vw;}
}

p span.app{ font-size: 80%;}
section.set{ background: #FFFAF7; padding: 20px 0;}
p.icon_01{ color: #AE0D0D;}
p.icon_02{ border: 1px solid #585858; display: inline-block; padding: 0 5px;}
p.icon_03{ background: #CA9173; color: #ffffff; padding: 0 5px; display: inline-block;}

div.cont_block ul{ font-size: 1.4rem;}


p.bay_btn { text-align: center; font-size: 1.6rem; background: #CA9173; width: 80%;}
p.bay_btn a{ display: inline-block; text-align: center; text-decoration: none; padding: 5px; color: #ffffff; max-width: 200px;}

p.bay_btn:hover{ opacity: 0.7;}

.col1-2 div.text_b{ padding: 0 3vw;}
@media (max-width: 767px) {
.col1-2 div.text_b{ padding: 0;}
}

section.item_block{ background: #FFFAF7; padding: 8% 0;}
section.item_block div.osusume{ background: #ffffff; padding: 3%;}
section.item_block ul.spade li:before{ display:inline-block; vertical-align: middle; content:'◇'; margin-right: 5px;}
section.item_block div.osusume ul{ padding: 0 5%;}
section.item_block div.osusume ul li:before{ display:inline-block; vertical-align: middle; content:'\02611'; margin-right: 5px;} 

section.item_block div.osusume hr{ border-top: 1px solid; margin-bottom: 10px;}

div.back_serum{ background: url(https://osaji.net/special_products/2025holidaycoffret_enrich/img/photo02.jpg) no-repeat; background-size: contain; background-position-x: right; padding: 15% 10%;}
div.back_serum h4{ font-family: 'Noto Serif JP', "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;} 

h3.title_serum{ font-family: 'Crimson Text'; color: #CA9173; font-size: 2.5rem; letter-spacing: 2px;}

section.series{background: #dcdcdc4d; padding: 8% 5%;}
section.series h3{ font-family: "Lato", 'Noto Serif JP', "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; font-size: 120%; margin-bottom: 5%;}
section.series p.title{font-family: "Lato", 'Noto Serif JP', "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; font-size: 120%; line-height: 1; margin-bottom: 5px;}
section.series p.bay_btn{ border: 1px solid #CA9173; background: #ffffff;}
section.series p.bay_btn a{ color: #CA9173;}
@media (max-width: 767px) {
section.series div.cont_block{ padding: 0;}
section.series p.bay_btn a{font-size: 80%;}
}

@media (max-width: 767px) {
	div.back_serum{ background: none; padding: 0 7vw;}
	div.back_serum h4{ text-align: center;}
	h3.title_serum{ text-align: center; padding-top: 5%; margin-bottom: 10px;}
}
    
.bnrSec {
  margin-bottom: 60px;
}
.bnrSec h3 {
  font-size: 18px;
  font-weight: 300;
  line-height: 26.06px;
  text-align: left;
  margin-bottom: 20px;
}

@media (max-width: 767px) {
  .bnrSec {
    margin-bottom: 30px;
  }
  .bnrSec h3 {
    font-size: 14px;
    margin-bottom: 15px;
  }
}


@media (max-width: 767px) {
  .pcOnly{
      display: none !important;
    }
}
@media (min-width: 767px) {
  .spOnly{
    display: none !important;
  }
}





@media (max-width: 767px) {

div.days p{ font-size: 1.5rem;}
.lp_block p,
div.cont_block ul{  font-size: 1.25rem;}
p.bay_btn { font-size: 1.5rem; width: 100%;}

.set p.photo{width: 70%; margin: 10px auto 0 auto;}
.pre_block p.photo{width: 60%; margin: 10px auto 0 auto;}
}


@media (max-width: 500px) {

	
#wapper { padding-top: 0px !important; }
}