/* mv
***********************************************************/
#mv.pc {
  position: relative;
  padding: 96px 0 0;
  display: -webkit-box !important;
  display: flex !important;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient( -135deg, #f1e7e7, #eff6f5);
  background-size: 400% 400%;
  animation: gradient 10s ease infinite;
}
@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.mvleft {
  padding: 3vw 0;
  width: 50%;
  background: linear-gradient(45deg, #fefefe, #faf8f8);
}
.mvleft img {
  margin: 0 auto;
  max-width: 760px;
  width: 70%;
}
.mvright {
  width: 50%;
  box-sizing: border-box;
  padding: 3vw 7vw;
  text-align: left;
}

.mvright h2 {
  max-width: 600px;
  font-weight: normal;
  color: #383838;
  letter-spacing: 8px;
  line-height: 2;
}
.mvright h2 img {
  width: 100%;
}
.mvright h3 {
  padding: 2vw 0 0;
  width: 100%;
  font-size: 13px;
  font-weight: normal;
  color: #383838;
  line-height: 2.4;
}
.mvright ul {
  padding: 4vw 0 0 1em;
  text-indent: -1em;
  width: 100%;
  font-size: 11px;
}
.mvright ul li::before {
  content: "※";
}
.mvright p {
  width: 100%;
}
.mvtxt {
  position: absolute;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  font-size: 12px;
  color: #000;
  bottom: -3vw;
  right: 1.8vw;
  z-index: 10;
  letter-spacing: 4px;
  font-weight: 500;
  z-index: 200:;
}


/* sec01
***********************************************************/
#sec01 {
  padding: 3vw 40px 0;
}
#sec01 .products_title {
  padding: 4vw 4vw 0;
}
#sec01 .products_title_inner {
  margin: 0 auto;
  padding: 34px 0 0;
  max-width: 283px;
  background: url(/common/images/bg_products03.png) no-repeat center left/9px auto,
  url(/common/images/bg_products04.png) no-repeat center right/9px auto,
  url(/common/images/ic_skincare.png) no-repeat top center/18px auto;
}
.#sec01 .products_title h3 {
  font-size: 18px;
}
#sec01 .products_title p {
  padding: 0px 0 0;
  font-size: 12px;
  font-family: 'Noto Sans JP', sans-serif;
  color: #5a5757;
  letter-spacing: 4px;
}
#sec01 .products_title p span {
  font-size: 24px;
}
#sec01 .products_title + h4 {
  padding: 4vw 4vw 0px;
  color: #4f4f4f;
  letter-spacing: 1px;
  line-height: 1.2;
  display: inline-block;
  font-weight: 500;
  background: url(/common/images/bg_skincare.png) no-repeat bottom center/auto 1px;
}
#sec01 .products_title + h4 .size1 {
  font-size: 30px;
}
#sec01 .products_title + h4 .size2 {
  font-size: 19px;
}
#sec01 .products_title + h4 .size3 {
  font-size: 24px;
}
#sec01 .products_title + h4 + p {
  padding: 2vw 0 0px;
  font-size: 16px;
}
#sec01 ul {
  margin: 0 auto;
  padding: 2vw 0 0;
  max-width: 600px;
  display: -webkit-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#sec01 ul li {
  width: 28%;
}



/* sec02
***********************************************************/
#step1 {
  padding: 5vw 0 0;
}
#step2 {
  padding: 7vw 0 0;
}
#step3{
  padding: 7vw 0 0;
}
#set1{
  padding: 7vw 0 0;
}

#step1 .step_title {
  padding: 3vw 0 0;
  background: url(/common/images/bg_step1.png)no-repeat top center/230px auto;
}
#step2 .step_title {
  padding: 3vw 0 0;
  background: url(/common/images/bg_step2.png)no-repeat top center/328px auto;
}
#step3 .step_title {
  padding: 3vw 0 0;
  background: url(/common/images/bg_step3.png)no-repeat top center/230px auto;
}
#set1 .step_title {
  padding: 3vw 0 0;
  background: url(/common/images/bg_set1.png)no-repeat top center/220px auto;
}
.step_title p {
  font-size: 18px;
  font-weight: 500;
  color: #000;
  letter-spacing: 3px;
}
.step_title h2 {
  padding: 0.5vw 0 0;
  font-size: 25px;
  font-weight: normal;
  color: #5a5757;
}
.step_content {
  padding: 3vw 0 0;
  display: -webkit-box;
  display: flex;
  justify-content: space-between;
}
#step1 .step_img {
  position: relative;
  width: 50%;
  background: url(/common/images/obj_step101.png)no-repeat top center/cover;
}
#step2 .step_img {
  position: relative;
  width: 50%;
  background: url(/common/images/obj_step201.png)no-repeat top center/cover;
}
#step3 .step_img {
  position: relative;
  width: 50%;
  background: url(/common/images/obj_step301.png)no-repeat top center/cover;
}
#set1 .step_img {
  position: relative;
  width: 50%;
  background: url(/common/images/obj_set101.png)no-repeat top center/cover;
}
.step_bg {
  display: none;
}
#step1 .step_img .step_products {
  margin: -3vw auto 0;
  max-width: 620px;
  width: 80%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
#step2 .step_img .step_products {
  margin: -3vw auto 0;
  max-width: 620px;
  width: 80%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
#step3 .step_img .step_products {
  margin: -3vw auto 0;
  max-width: 606px;
  width: 75%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
#set1 .step_img .step_products {
  margin: -3vw auto 0;
  max-width: 606px;
  width: 75%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
.step_txt {
  padding: 0 9vw 0 3vw;
  width: 50%;
  text-align: left;
  box-sizing: border-box;
}
.products_txt_title {
  display: -webkit-box;
  display: flex;
  align-items: center;
}
.products_txt_title h3 {
  font-size: 20px;
  letter-spacing: 6px;
  font-weight: normal;
}
.products_txt_title p {
  margin: 0 0 0 18px;
  padding: 0 0 0 18px;
  border-left: 1px solid #b0b0b0;
  font-size: 11px;
  font-weight: 500;
  color: #282828;
  letter-spacing: 0;
}
.products_txt_title p span  {
  font-size: 20px;
}
.products_txt_title + p {
  padding: 2vw 0 0;
}
#step1 .step_txt .graph {
  margin: 0 auto;
  padding: 3vw 0 0;
  width: 215px;
}
#step2 .step_txt .graph {
  margin: 0 auto;
  padding: 3vw 0 0;
  width: 217px;
}
#step3 .step_txt .graph {
  margin: 0 auto;
  padding: 3vw 0 0;
  width: 223px;
}
.essence {
  margin: 3vw 0 0;
  padding: 0 0 0 30px;
  background: url(/common/images/bg_steptxt.png) no-repeat center left/auto 94%;
}
.essence h3 {
  font-size: 15px;
  letter-spacing: 2px;
}
.essence_inner {
  display: -webkit-box;
  display: flex;
  align-items: center;
}
.essence_inner p {
  padding: 10px 20px 10px 0;
  flex: 1;
  line-height: 2.0;
}
#step1 .essence_img {
  width: 152px;
}
#step2 .essence_img {
  width: 151px;
}
#step3 .essence_img {
  width: 163px;
}
.step_content2 {
  margin: 0 auto;
  padding: 3vw 0 0;
  display: -webkit-box;
  display: flex;
  justify-content: space-between;
  max-width: 992px;
}
.step_content2_item {
  width: 46%;
  text-align: left;
}
.step_content2_item h3 {
  font-size: 13px;
  letter-spacing: 1px;
}
.step_content2_item p {
  padding: 1vw 0 0;
  font-size: 12px;
  color: #5a5757;
}
.step_content2_item ul {
  padding: 1vw 0 0 1em;
  text-indent: -1em;
  font-size: 12px;
  color: #5a5757;
}
.step_content2_item ul li {
  margin: 0 0 10px;
  line-height: 1.4;
}
.step_content2_item ul li::before {
  content: "- ";
}
.youtube_wrapper {
  margin: 4vw auto 0;
  padding: 0 30px;
  max-width: 436px;
}
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.store_bt {
  margin: 4vw auto 0;
  max-width: 362px;
  background: url(/common/images/obj_arrowhead.png) no-repeat #5a5757 right 30px center/11px auto;
  color: #fff;
  transition: all .4s;
  position:relative;
  box-sizing: border-box;
  font-weight: 500;
}
.store_bt span {
  padding: 39px 60px 46px;
  width: 100%;
  height: 79px;
  line-height: 1;
  display: block;
  box-sizing: border-box;
  background: url(/common/images/ic_cart.png) no-repeat left 20px center/16px auto;
}
.store_bt:hover {
  cursor: pointer;
  background: url(/common/images/obj_arrobottom.png) no-repeat #5a5757 right 30px center/11px auto;
}
.store_bt ul.dropdown_menu {
  position: absolute;
  top: 84px;
  display: none;
  z-index: 100;
  transition: all .4s;
}
.store_bt ul.dropdown_menu li a {
  max-width: 362px;
  padding: 31px 0 35px;
  height: 79px;
  border-left: 1px solid #5a5757;
  border-right: 1px solid #5a5757;
  border-top: 1px solid #5a5757;
  box-sizing: border-box;
  font-weight: 500;
  text-decoration: none;
  background: #fff linear-gradient(currentColor, currentColor) right 20px center / 25px 1px no-repeat;
  transition: all .4s;
  display: block;
}
.store_bt ul.dropdown_menu li a {

}
.store_bt ul.dropdown_menu li a:hover {
  background: #5a5757 linear-gradient(currentColor, currentColor) right 20px center / 10px 1px no-repeat;
  opacity: 1;
  color: #fff;
}
.store_bt ul.dropdown_menu li:last-child a {
  border: 1px solid #5a5757;
}
.store_bt ul.dropdown_menu.open {
  display: block;
  width: 100%;
}
.youtube_wrapper a.store_bt_1 {
  margin: 4vw auto 0;
  padding: 39px 60px 46px;
  text-decoration: none;
  max-width: 362px;
  height: 79px;
  line-height: 1;
  display: block;
  box-sizing: border-box;
  color: #fff;
  background: url(/common/images/ic_cart.png) #5a5757 no-repeat left 20px center/16px auto;
}
button.store_bt_1 {
  margin: 4vw auto 0 !important;;
  padding: 37px 60px 46px !important;
  text-decoration: none;
  width: 362px !important;
  height: 79px;
  font-size: 14px !important;;
  line-height: 1;
  display: block;
  box-sizing: border-box;
  color: #fff;
  background: url(/common/images/ic_cart.png) #5a5757 no-repeat left 20px center/16px auto;
  border: none;
  letter-spacing: 2px;
}
a.store_bt_2 + form button.store_bt_1 {
  margin: 2vw auto 0 !important;;
}
.form-group {
  display: none !important;
}
.youtube_wrapper a.store_bt_2 {
  margin: 4vw auto 0;
  padding: 39px 60px 46px;
  text-decoration: none;
  max-width: 362px;
  height: 79px;
  line-height: 1;
  display: block;
  box-sizing: border-box;
  color: #5a5757;
  border: 1px solid #5a5757;
  background: #fff linear-gradient(currentColor, currentColor) right 20px center / 25px 1px no-repeat;
}
#sec02 ul.attention {
  margin: 6vw auto 0;
  padding: 0 40px 0 1em;
  max-width: 996px;
  text-align: right;
  text-indent: -1em;
}
#sec02 ul.attention li::before {
  content: "※";
}

/* SET1 */
#set1 .products_txt_title {
  display: flex;
  align-items: center;
}
.products_txt_title_r {
  margin: 0 0 0 18px;
  padding: 0 0 0 18px;
  border-left: 1px solid #b0b0b0;
}
#set1 .products_txt_title p {
  margin: 0;
  padding: 0;
  border: none;
}
#set1 .products_txt_title p:last-child {
  font-size: 10px;
  color: #aaa;
  text-decoration: line-through;
}
#set1 .products_txt_title p:last-child span {
  font-size: 16px;
}
#set1 .essence ul {
  padding: 0.5 0 1vw;
}
#set1 .essence ul li {
  padding: 0.5vw 0 0;
}
#set1 .essence + p  {
  margin: 2vw 0 0 1em;
  text-indent: -1em;
  text-align: left;
  font-size: 11px;
  position: relative;
}
#set1 .essence + p::before {
  content: "※";
}
#set1 .youtube_wrapper a.store_bt_1 {
  margin: 2vw auto 0;
}


/* sec03
***********************************************************/
#sec03 {
  padding: 12vw 0 0;
}
#sec03 .title h3 {
  font-size: 26px;
}
#sec03 .title p {
  letter-spacing: 4px;
}
#sec03 .title + p {
  padding: 3vw 0 0;
}
#sec03 ul {
  margin: 2vw auto 0;
  max-width: 579px;
  display: -webkit-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#sec03 ul li {
  width: 30%;
}





/* footer */
footer {
  margin: 10vw 0 0;
}



/*全体（1450px以下）
***********************************************************/
@media screen and (max-width:1450px) {
.mvleft {
  padding: 6vw 0;
}
.mvright {
  padding: 3vw 5vw;
}

.mvright h3 {
  letter-spacing: 1px;
}
}



/*全体（1030px以下）
***********************************************************/
@media screen and (max-width:1030px) {
.br3::before {
  content: "\A" ;
  white-space: pre ;
}
#mv.pc {
  padding: 76px 0 0;
  display: block !important;
}
.mvleft {
  padding: 3vw 0;
  width: 100%;
}
.mvleft img {
  width: 100%;
}
.mvright {
  width: 100%;
  padding: 12vw 30px 6vw;
  text-align: center;
}
.mvright h2 {
  margin: 0 auto;
  width: 94%;
}

.mvright h3 {
  padding: 6vw 0 0;
  width: 100%;
  font-size: 13px;
  letter-spacing: 3px;
}
.mvright ul {
  padding: 10vw 0 0 1em;
  text-align: left;
}
.mvtxt {
  top: -10vw;
  right: 2.1vw;
}
.step_img {
  width: 40%;
}
.step_img .step_products {
  margin: -3vw auto 0;
  width: 100%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
#step3 .step_img .step_products {
  margin: -3vw auto 0;
  width: 95%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
#set1 .step_img .step_products {
  margin: -3vw auto 0;
  width: 90%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
.step_txt {
  padding: 0 40px 0 3vw;
  width: 60%;
}
.step_content2 {
  padding: 3vw 40px 0;
}

}




/*全体（820px以下）
***********************************************************/
@media screen and (max-width:820px) {
#sec01 {
  padding: 12vw 30px 0;
}
#sec01 .products_title + h4 {
  padding: 8vw 0 0px;
}
#sec01 .products_title + h4 + p {
  padding: 6vw 0 0px;
  font-size: 16px;
}
#sec01 ul {
  margin: 0 auto;
  padding: 6vw 0 0;
  max-width: 488px;
}
#sec01 ul li {
  width: 31%;
}
#step1 {
  padding: 15vw 0 0;
}
#step2 {
  padding: 20vw 0 0;
}
#step3 {
  padding: 20vw 0 0;
}
#set1 {
  padding: 20vw 0 0;
}
#step1 .step_title {
  padding: 14vw 0 0;
  background: url(/common/images/bg_step1.png)no-repeat top center/184px auto;
}
#step2 .step_title {
  padding: 14vw 0 0;
  background: url(/common/images/bg_step2.png)no-repeat top 30px center/262px auto;
}
#step3 .step_title {
  padding: 14vw 0 0;
  background: url(/common/images/bg_step3.png)no-repeat top 20px center/184px auto;
}
#set1 .step_title {
  padding: 14vw 0 0;
  background: url(/common/images/bg_set1.png)no-repeat top 20px center/184px auto;
}
.products_txt_title {
  padding: 3vw 0 0;
}
.products_txt_title h3 {
  font-size: 18px;
  letter-spacing: 3px;
}
.products_txt_title p {
  margin: 0 0 0 12px;
  padding: 0 0 0 12px;
  font-size: 11px;
}
.products_txt_title p span  {
  font-size: 14px;
}
.products_txt_title + p {
  padding: 6vw 0 0;
  font-size: 14px;
}
.step_content {
  padding: 6vw 0 0;
  display: block;
}
#step1 .step_img {
  position: relative;
  width: 100%;
  background: url(/common/images/obj_step101.png)no-repeat top center/cover;
}
#step2 .step_img {
  position: relative;
  width: 100%;
  background: url(/common/images/obj_step201.png)no-repeat top center/cover;
}
#step3 .step_img {
  position: relative;
  width: 100%;
  background: url(/common/images/obj_step301.png)no-repeat top center/cover;
}
#set1 .step_img {
  position: relative;
  width: 100%;
  background: url(/common/images/obj_set101.png)no-repeat top center/cover;
}
.step_bg {
  display: block;
}
.step_txt {
  padding: 6vw 30px 0;
  width: 100%;
}
.step_img .step_products {
  margin: -3vw auto 0;
  width: 80%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
#step3 .step_img .step_products {
  margin: -3vw auto 0;
  width: 75%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
.step_txt .graph {
  margin: 0 auto;
  padding: 6vw 0 0 !important;
  width: 60%;
}
.essence {
  margin: 12vw 0 0;
  padding: 0 0 0 35px;
  background: url(/common/images/bg_steptxt.png) no-repeat top 3px left/26px auto;
}
.essence h3 {
  font-size: 13px;
}
.essence_inner {
  display: block;
}
.essence p {
  margin: 2vw 0 0;
}
.essence_img {
  margin: 3vw auto 0;
  width: 50%;
}
.step_content2 {
  padding: 0vw 30px 0;
  display: block;
}
.step_content2_item {
  padding: 8vw 0 0;
  width: 100%;
  text-align: left;
}
.youtube_wrapper {
  margin: 8vw auto 0;
}
.store_bt {
  margin: 8vw auto 0;
  max-width: 100%;
}
.store_bt ul.dropdown_menu li a {
  max-width: 100%;
}
.store_bt span {
  padding: 29px 60px 36px;
  height: 59px;
}
.store_bt ul.dropdown_menu {
  top: 65px;
}
.store_bt ul.dropdown_menu li a {
  padding: 21px 0 25px;
  height: 59px;
}
#sec02 ul.attention {
  margin: 6vw 30px 0;
  padding: 0 0 0 1em;
  text-align: left;
  font-size: 11px;
}
#sec02 ul.attention li::before {
  content: "※";
}
.store_bt:hover {
  background: url(/common/images/obj_arrowhead.png) no-repeat #5a5757 right 30px center/11px auto;
}
.store_bt.open {
  background: url(/common/images/obj_arrobottom.png) no-repeat #5a5757 right 30px center/11px auto !important;
}

/* set1 */
#set1 .products_txt_title h3 {
  font-size: 16px;
  letter-spacing: 0px;
}
.products_txt_title p {
  margin: 0 0 0 8px;
  padding: 0 0 0 8px;
}
.products_txt_title p span  {
  font-size: 14px;
}
.products_txt_title + p {
  padding: 6vw 0 0;
  font-size: 14px;
}
#set1 .products_txt_title p:last-child {
  padding: 3px 0 0;
  font-size: 10px;
}
#set1 .products_txt_title p:last-child span {
  font-size: 13px;
}
#set1 .essence {
  margin: 8vw 0 0;
}
#set1 .essence ul {
  padding: 2vw 0 3vw;
}
#set1 .essence ul li {
  padding: 1.5vw 0 0;
}
#set1 .essence {
  background: url(/common/images/bg_steptxt_sp.png) no-repeat top 3px left/auto 96%;
}
#set1 .essence + p  {
  margin: 3vw 0 0 1em;
}
#set1 .youtube_wrapper a.store_bt_1 {
  margin: 6vw auto 0;
}
#set1 .youtube_wrapper a.store_bt_2 {
  margin: 10vw auto 0;
  max-width: 100%;
}
button.store_bt_1 {
  margin: 6vw auto 0 !important;
  width: 100% !important;
}
a.store_bt_2 + form button.store_bt_1 {
  margin: 4vw auto 0 !important;;
}

/* sec03 */
#sec03 {
  padding: 20vw 0 0;
}
#sec03 .title h3 {
  font-size: 20px;
}
#sec03 .title p {
  letter-spacing: 4px;
  font-size: 12px;
  letter-spacing: 2px;
}
#sec03 .title + p {
  padding: 6vw 30px 0;
  font-size: 15px;
}
#sec03 ul {
  padding: 4vw 30px 0;
  display: -webkit-box;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
#sec03 ul li {
  margin: 10px;
  width: 43%;
  box-sizing: border-box;
}

/* footer */
footer {
  margin: 18vw 0 0;
}

}


/*全体（640px以下）
***********************************************************/
@media screen and (max-width:330px) {
  #set1 .products_txt_title {
    display: block;
  }
  #set1 .products_txt_title_r {
    margin: 0;
    padding: 4vw 0 0;
    border: none;
  }
}