@charset "UTF-8";
@font-face {
font-family: "Times New Roman";
src: url("<%= Constants.PATH_ROOT %>Contents/font/TIMES.TTF") format("truetype"),
url("<%= Constants.PATH_ROOT %>Contents/font/Times New Roman.ttf") format("truetype");
}
/*//////////////////////////////////////////////////

Title : 2023SSCollection

//////////////////////////////////////////////////*/
/* ========================================================
                      * Layout style *
========================================================= */

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}

main {
  width: unset;
}

.contents_inner {
  width: unset;
}

.nav-top.show {
  opacity: 0;
}
p {
  text-align: unset;
}

a,
a:before,
a:after,
a img {
  transition: opacity .3s ease-in-out,
    color .3s ease-in-out,
    background-color .3s ease-in-out,
    border-color .3s ease-in-out,
    text-shadow .3s ease-in-out,
    text-weight .3s ease-in-out;
}

a:hover {
  opacity: 0.8;
} 

h1 {
  padding: 0;
}

.text-bnr {
  position: relative;
  z-index: 2;
}

.en {
  font-family: "Times New Roman", serif;
  font-weight: 500;
  font-style: normal;
}

/* ===================
  　　 more btn
=================== */
.more_box *, .more_box *:before, .more_box *:after {
  box-sizing: border-box;
}
.more_box {
  position: relative;
  max-width: calc(320* (100vw / 390));
  width: 100%;
}
.more_box label {
  position: absolute;
  z-index: 1;
  margin: auto;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  cursor: pointer;
  text-align: center;
  height: 100%;
  background: linear-gradient(to bottom, rgb(255 255 255 / 0%) -160%, rgb(255 255 255) 90%);
}
.more_box input:checked + label {
  background: inherit;
   height: auto;
}
.more_box label:after {
  position: absolute;
  z-index: 2;
  bottom: 0;
  transform: translate(-50%, 4rem);
  content: 'Read More +';
  font-family: "Times New Roman", serif;
  font-size: 2rem;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.05em;
}
.more_box .more_container {
  height: 17.5rem;
  overflow: hidden;
  transition: all 0.5s;
}
.more_box input:checked + label:after {
  content: 'Close';
  bottom: 8px;
  text-decoration: underline;
}
.more_box input:checked ~ .more_container {
  height: auto;
  padding-bottom: 40px;
  transition: all 0.5s;
}
/*  -----  //more btn -----  */

.more_box{
  max-width: 30rem;
  margin: auto;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0.1em;
}

input[type="checkbox"]#original_checkbox{
  display:none;
}
/* ===================
  　　more btn
=================== */

/* ===================
  　　 General
=================== */

.txt_center {
  text-align: center;
}

/* ===================
  LP Contents
=================== */

.lp_contents {
  position: relative;
  z-index: 0;
  margin: 0 auto;
  padding: 0;
  font-style: normal;
  letter-spacing: 0.1em;
  font-family: 游明朝体, YuMincho, "游明朝 Medium", "Yu Mincho", "Hiragino Mincho ProN", "HGS明朝E, yumin, メイリオ", serif;
  font-weight: 400;
  color: #655D60;
  background-color: #fff;
  padding: 0;
}

.lp_contents *,
.lp_contents *:before,
.lp_contents *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.lp_contents ul,
.lp_contents li {
  list-style: none;
}

.lp_contents a:hover {
}

.lp_contents img {
  max-width: 100%;
}

.lp_contents sup {
  color: #888;
}

.contents_inner {
  padding-bottom: 0;
}

.contents_inner .section {
  width: 100%;
  margin: auto;
  line-height: inherit;
}

.contents {
  margin-top: 0;
  padding-top: 0 !important;
  padding-bottom: 0;
}

/* -- List -- */

.list ul {
  letter-spacing: -0.4em;
}

.list ul li {
  display: inline-block;
  letter-spacing: 0.08em;
  vertical-align: top;
}

/* -- List Dot -- */

.list_dot,
.list.list_dot {
  margin: 1em 0;
}

.list_dot .list_dot {
  margin: 0 0 .5em;
}

.list_dot ul,
.list.list_dot ul {
  margin: 0;
  padding-left: 1.5em !important;
}

.list_dot ul li {
  margin-top: 0;
  margin-right: 0;
  margin-left: 0;
  list-style-type: none;
  line-height: 1.8;
}

.list_dot ul li ul {
  padding-top: 2px;
  padding-left: 2.5em !important;
}

.list_dot ul li:before {
  display: inline-block;
  width: 3px;
  height: 3px;
  margin-left: -1em;
  margin-right: 14px;
  background: #555;
  border-radius: 100%;
  vertical-align: middle;
  content: "";
}



/* ===================
  　Section Common
=================== */

.float_left {
  float: left;
}

.float_right {
  float: right;
}

/* ===================
     Text Setting
=================== */

.txt_cont {
  margin-bottom: 2rem;
  text-align: center;
  line-height: 1.7;
}


/* ===================
  Button Setting
=================== */

.btn_wrap {
  text-align: center;
}


/* ===================
  　　MAINVISUAL
=================== */

.mainvisual_section {
  text-align: center;
}

.mainvisual_section .img_mainvisual img {
  width: 100%;
}

.mainvisual_section .img_mainvisual {
  opacity: 0;
}

.mainvisual_section.effect .img_mainvisual {
  animation: opa1 1.4s cubic-bezier(0.51, 0.21, 0.41, 1) .1s 1 forwards;
}

.schedule_list {
  margin: 14rem auto 12rem;
  text-align: center;
}

.schedule_list dl {
  margin: 0 auto;
  text-align: left;
  width: 40rem;
}

.schedule_list dl:nth-of-type(2) {
  margin: 2rem auto 0;
}

.schedule_list dd span {
  font-size: 2rem;
}

.schedule_list dt,
.schedule_list dd {
  display: inline-block;
  vertical-align: middle;
}

.schedule_list .schedule_ttl {
  margin: 0 1.5rem 0 0;
  padding: 0.2rem 1.7rem;
  border: solid 0.1rem #988498;
  border-radius: 0.5rem;
  color: #988498;
  font-size: 2rem;
  letter-spacing: 0.1em;
  font-weight: 600;
}

.schedule_list .schedule_content {
  font-size: 2.8rem;
  letter-spacing: 0.05em;
  color: #988498;
  line-height: 1;
}

.schedule_list .schedule_content + .schedule_ttl {
  margin-left: 3rem;
}

.mainvisual_section h2 {
  font-size: 5rem;
  letter-spacing: 0.05em;
  margin: 10rem auto 6rem;
}

/* ===================
  　　Concept
=================== */

.concept_section {
  transition: background-imgage .2s ease-in-out .1s;
  padding: 10rem 0;
  background: transparent no-repeat 0 0;
  background-size: cover;
}

.concept_section.effect {
  transition: background-imgage .2s ease-in-out .1s;
  background-image: url(../../../Contents/ImagesPkg/make/2023SSCollection/Main/concept_bg_all.jpg);
}

.concept_section .inner {
  text-align: center;
  color: #fff;
  font-size: 1.4rem;
}

.concept_section h2 {
  opacity: 0;
  margin-bottom: 5rem;
  font-size: 2.4rem;
  font-weight: 200;
}

.concept_section.effect h2 {
  animation: opa2 1.3s cubic-bezier(0.51, 0.21, 0.41, 1) .6s 1 forwards;
}

.concept_section p {
  opacity: 0;
  margin-bottom: 2.6rem;
  line-height: 2.1;
}

.concept_section p:last-child {
  margin-bottom: 0;
}

.concept_section.effect p {
  animation: opa2 1.3s cubic-bezier(0.51, 0.21, 0.41, 1) 1.2s 1 forwards;
}

/* ===================
      PRODUCTS
=================== */

.products_section {
  padding-top: 6rem;
}

/* ===================
      page_menu
=================== */
.page_menu {
  display: flex;
  justify-content: center;
}

.page_menu a {
  display: block;
  width: 30rem;
  padding: 1.3rem 0;
  text-align: center;
  font-size: 2.5rem;
  letter-spacing: 0;
  font-family: "Times New Roman", serif;
}

.page_menu li {
  position: relative;
  margin: 0 0.75rem;
}

.page_menu li:nth-of-type(1) ,
.page_menu li:nth-of-type(2) ,
.page_menu li:nth-of-type(3) ,
.page_menu li:nth-of-type(4) {
  background-size: cover;
  border-radius: 0.5rem;
}

.page_menu li:nth-of-type(1) {
  background: url(../img/nav_bg_1_pc.png) no-repeat;
}
.page_menu li:nth-of-type(2) {
  background: url(../img/nav_bg_2_pc.png) no-repeat;
}
.page_menu li:nth-of-type(3) {
  background: url(../img/nav_bg_3_pc.png) no-repeat;
}
.page_menu li:nth-of-type(4) {
  background: url(../img/nav_bg_4_pc.png) no-repeat;
}

.page_menu li:nth-of-type(1) a {
  color: #A7968C;
}
.page_menu li:nth-of-type(2) a {
  color: #CE9E9E;
}
.page_menu li:nth-of-type(3) a {
  color: #9C95AA;
}
.page_menu li:nth-of-type(4) a {
  color: #A2948F;
}

.page_menu li:hover::before {
  top: 3rem;
  transition: all 0.8s;
}

.page_menu li::before {
  position: absolute;
  display: block;
  content: "";
  width: 2rem;
  height: 1rem;
  background-size: 100%;
  top: 2.2rem;
  right: 1.5rem;
}
.page_menu li:nth-of-type(1)::before {
  background: url(../img/nav_arrow_1.svg) no-repeat;
}
.page_menu li:nth-of-type(2)::before {
  background: url(../img/nav_arrow_2.svg) no-repeat;
}
.page_menu li:nth-of-type(3)::before {
  background: url(../img/nav_arrow_3.svg) no-repeat;
}
.page_menu li:nth-of-type(4)::before {
  background: url(../img/nav_arrow_4.svg) no-repeat;
}

/* ===================
      sub_items
=================== */
.sub_items {
  display: flex;
  margin: 8rem auto;
  justify-content: center;
}
.sub_items .item {
  width: 25rem;
  text-align: center;
  margin: 0 1.75rem;
}
.sub_items .items_number {
  font-size: 1.8rem;
  font-family: "Times New Roman", serif;
  margin: 1rem auto;
  letter-spacing: 0;
  line-height: 1;
}
.sub_items .items_name {
  font-size: 1.4rem;
  font-family: "Times New Roman", serif;
  margin: 0 auto 1.5rem;
  letter-spacing: 0.1em;
  line-height: 1;
}
.sub_items .items_text {
  font-size: 1.2rem;
  line-height: 1.8;
  letter-spacing: 0.1em;
  font-family: "kozuka-gothic-pro", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* ===================
      makeArea
=================== */
.makeArea {
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 80rem;
  flex-wrap: wrap;
}
.makeArea .make_item {
  width: 39.5rem;
}
.makeArea .make_item:nth-of-type(n+3) {
  margin-top: 1rem;
}

/* ===================
      showItems
=================== */
.showItems {
	overflow:		hidden;
	position:		relative;
}
.showItems .caption {
  font-size: 2rem;
  color: #fff;
  padding-top: 8rem;
  padding-left: 15rem;
  font-weight: 400;
}
.showItems .mask {
  width: 100%;
  height: 12.4rem;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0;
  background: linear-gradient(to bottom, rgb(255 255 255 / 0%), rgb(72 72 72) 200%);
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}
.showItems:hover .mask {
	opacity:		1;	/* マスクを表示する */
}

/* ===================
      make_itemArea
=================== */
.make_itemArea {
  position: relative;
}
.make_itemArea .item_img {
  position: absolute;
  width: 25rem;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
#Lip .make_itemArea .item_img {
  width: 11.5rem;
}
#Nail .make_itemArea .item_img {
  width: 15.7rem;
}
.make_itemArea .item_img.ef.effect {
  animation-delay: 0.6s;
}

/* ===================
      MODAL
=================== */
.useItems_inner {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 6rem auto 0;
}
.useItems_inner .model_img {
  width: 35rem;
}
.useItems_inner .items_cont {
  margin-left: 7rem;
}
.useItems_inner .items_cont .items_fl {
  display: flex;
  align-items: center;
}
.useItems_inner .items_cont .items_fl span {
  display: block;
}
.useItems_inner .items_cont .items_fl .item_img_small {
  width: 11.2rem;
}
.useItems_inner .items_cont .items_fl .item_img_small.__2 {
  width: 8.4rem;
  margin-left: 1.5rem;
}
.useItems_inner .items_cont .items_fl .item_name {
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  font-family: "kozuka-gothic-pro", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.useItems_inner .items_cont .items_fl .item_name_en {
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  margin: 1rem auto 3rem;
}
.useItems_inner .items_cont .items_fl .price {
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  font-family: "kozuka-gothic-pro", sans-serif;
  font-weight: 500;
  font-style: normal;
}
.useItems_inner .items_cont .items_fl .text_Area {
  margin-left: 2.8rem;
}
.useItems_inner .items_cont .items_fl.__2 {
  margin-top: 4rem;
}
.useItems_inner .items_cont .items_fl.__2 .text_Area {
  margin-left: 4rem;
}
.modaal-overlay {
  background: #fff !important;
}
.modaal-close:after, .modaal-close:before {
  display: block;
  content: " ";
  position: absolute;
  top: 10px;
  left: 19px;
  width: 1px;
  height: 20px;
  border-radius: 4px;
  background: #fff;
  -webkit-transition: background .2s ease-in-out;
  transition: background .2s ease-in-out;
}
.LookPatternModalInner .buyAll_btn a {
  font-family: "kozuka-gothic-pro", sans-serif;
  display: block;
  width: 30rem;
  margin: 6rem auto 0;
  padding: 1rem 0;
  text-align: center;
  font-size: 1.1rem;
  letter-spacing: 0.1em;
  background: linear-gradient(90deg, rgb(232 199 179) 0%, rgb(231 183 160) 100%);
  color: #fff;
  line-height: 1;
  border-radius: 1rem;
  font-weight: 500;
}
.LookPatternModalInner.lip .buyAll_btn a {
  background: linear-gradient(90deg, rgb(243 197 189) 0%, rgb(251 182 169) 100%);
}
.LookPatternModalInner .buyAll_btn .en {
  font-size: 2rem;
  letter-spacing: 0;
  margin-bottom: 0.5rem;
  font-weight: bold;
}
.LookPatternModalInner .buyAll_btn span {
  display: block;
}








/* ---- Products ---- */

.inner {
  padding: 11rem 0;
  background: url(../img/eyeShadow_bg.jpg) no-repeat;
  background-size: cover;
}

#Lip .inner {
  background: url(../img/lip_bg.jpg) no-repeat;
  background-size: cover;
}

#Nail .inner {
  background: url(../img/nail_bg.jpg) no-repeat;
  background-size: cover;
}

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

.product_section.line_top,
.section.line_top {
  margin-top: 0;
  padding-top: 7.5rem;
}

.product_section_lips .inner,
.product_section_eyeliner .inner,
.product_section_nail .inner {
  flex-direction: row-reverse;
  margin: 8rem auto 0;
}

.product_section .product__img {
  position: relative;
}
/* -- Links -- */
.product_section .product_links span {
  display: none;
}

.product_section .product_links a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
}
/* -- //Links -- */

.product_section .product__title {
  margin-bottom: 5rem;
  font-family: "Times New Roman", serif;
  font-weight: 500;
  font-style: normal;
  font-size: 4.5rem;
  color: #A7968C;
  line-height: 1;
  letter-spacing: 0.05em;
}

#Lip .product_section .product__title {
  color: #CE9E9E;
}

#Nail .product_section .product__title {
  color: #9C95AA;
}

.product_section .product__title .txt_line {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  line-height: 1.3;
}

.product_section .product__title .txt_line span {
  display: inline-block;
  transform: translateY(8rem);
  transition: all 1.5s  cubic-bezier(0.51, 0.21, 0.41, 1) 0s;
}

.product_section.effect .product__title .txt_line span {
  transform: translateY(0);
  transition: all 1.5s  cubic-bezier(0.51, 0.21, 0.41, 1) 0s;
}

.product_section.effect .product__title .txt_line:nth-child(2),
.product_section.effect .product__title .txt_line:nth-child(3) {
  margin-top: -2rem;
}

.product_section .product__title .txt_line:nth-child(2) span,
.product_section.effect .product__title .txt_line:nth-child(2) span{
  transition-delay: .2s !important;
}

.product_section .product__title .txt_line:nth-child(3) span,
.product_section.effect .product__title .txt_line:nth-child(3) span{
  transition-delay: .4s !important;
}

.product_section .product__title .txt_line + br {
  display: none;
}

.product_section .product__catch {
  font-size: 1.8rem;
  line-height: 2;
  white-space: nowrap;
}


/* ---- リップ---- */

.product_section_lips {
  margin-bottom: 0;
}

.product_section_lips .product__img img {
  width: 42rem;
  max-width: 42rem;
}

#Lip .product_section_lips .product__img img {
  width: 21.2rem;
  max-width: 21.2rem;
}

#Nail .product_section_lips .product__img img {
  width: 15.7rem;
  max-width: 15.7rem;
}

.product_section_lips .product__cont {
  margin-right: 5rem;
}
/* -- Links -- */
.product_section_lips .product_links li a {
  width: 16rem;
  height: 35rem;
}

.product_section_lips .product_links li:nth-child(1) a {
  top: 2.2rem;
  left: 10rem;
}

.product_section_lips .product_links li:nth-child(2) a {
  top: 5.5rem;
  left: 26rem;
}

.product_section_lips .product_links li:nth-child(3) a {
  top: 5.5rem;
  left: 42rem;
  width: 20rem;
}

.product_section_lips .product_links li:nth-child(4) a {
  top: 39rem;
  left: 18rem;
}

.product_section_lips .product_links li:nth-child(5) a {
  top: 42rem;
  left: 34rem;
  width: 22rem;
}
/* -- //Links -- */



.product_section .product__info {
  font-family: "kozuka-gothic-pro", sans-serif;
  font-weight: 500;
  font-style: normal;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
  min-height: 12rem;
  font-size: 1.3rem;
  letter-spacing: 0.05em;
}

.product_section .product__info p {
  width: 100%;
}

.product_section .product__info .product_price {
  font-size: 1.3rem;
  margin-top: 1.5rem;
  display: inline-block;
  line-height: 1;
}

.product__btn {
  position: relative;
  z-index: 1;
  display: flex;
  margin-bottom: 2rem;
}

.btn_wrap {
  display: flex;
}


/* ===================
    HOW TO USE
=================== */


.howto_section .inner .ef {
  animation-duration: 1.4s;
}

/* ===================
    SPECIAL CAMPAIGN
=================== */
.specialArea {
  padding: 7rem 0;
  background-color: #FDF7F5;
  text-align: center;
  width: 80rem;
  margin: 15rem auto 0;
}
.specialArea.ReleaseDay {
  margin: 8rem auto 15rem;
  background-color: #F8F4F8;
}

.specialArea .ttl {
  font-size: 4.5rem;
  letter-spacing: 0.05em;
  line-height: 1;
  color: #A2948F;
  font-family: "Times New Roman", serif;
  font-weight: 400;
}
.specialArea.ReleaseDay .ttl {
  color: #988498;
}

.specialArea .subttl {
  font-size: 1.8rem;
  letter-spacing: 0.05em;
  line-height: 1;
  color: #A2948F;
  font-family: "kozuka-gothic-pro", sans-serif;
  margin-top: 1.5rem;
  font-weight: 500;
}
.specialArea.ReleaseDay .subttl {
  color: #988498;
}

.specialArea .dateArea {
  margin-top: 5rem auto 0;
}

.specialArea .saleText {
  font-size: 1.6rem;
  line-height: 1;
  margin-top: 5rem;
  padding: 0.8rem 1.6rem;
  border: #655D60 solid 0.1rem;
  border-radius: 0.5rem;
  display: inline-block;
  font-weight: 600;
}

.specialArea .dateText {
  font-size: 2.4rem;
  line-height: 1;
  font-family: "Times New Roman", serif;
  letter-spacing: 0.05em;
  margin-top: 1.5rem;
}

.specialArea .dateText span {
  font-size: 1.7rem;
}

.specialArea .cont_name {
  display: inline-block;
  position: relative;
  font-size: 1.6rem;
  letter-spacing: 0;
  margin-top: 5rem;
  font-weight: 600;
}
.specialArea.ReleaseDay .cont_name {
  margin-top: 3rem;
  letter-spacing: 0.1em;
}

.specialArea .cont_name::before {
  position: absolute;
  display: block;
  content: "";
  width: 3rem;
  height: 0.1rem;
  background-color: #655D60;
  top: 1.2rem;
  left: -4.5rem;
  opacity: 0.6;
}

.specialArea .cont_name::after {
  position: absolute;
  display: block;
  content: "";
  width: 3rem;
  height: 0.1rem;
  background-color: #655D60;
  top: 1.2rem;
  right: -4.5rem;
  opacity: 0.6;
}

.specialArea .cont_text {
  font-size: 1.6rem;
  letter-spacing: 0.05em;
  font-family: "kozuka-gothic-pro", sans-serif;
  margin-top: 2rem;
  line-height: 1.8;
  font-weight: 400;
}
.specialArea.ReleaseDay .cont_text {
  margin-top: 1rem;
}
.specialArea .cont_text span {
  font-size: 1.2rem;
}

.specialArea .cont_present {
  width: 25rem;
  margin: 2rem auto 0;
}
.specialArea .freeFare {
  font-size: 1.3rem !important;
  line-height: 1;
  display: inline-block;
  border-radius: 0.5rem;
  padding: 0.8rem 1rem 0.5rem;
  margin-bottom: 0.5rem;
  border: #655D60 solid 0.1rem;
  background-color: #a2948f24;
}

/* ===================
      RELEASE DAY
=================== */














/*=======================================
              Responsive
========================================*/
/* only PC */
@media screen and (min-width: 768px) {
  .sp_only {
    display: none;
  }
}


/*=======================================
                    PC
========================================*/


@media screen and (min-width: 768px)  {

  #Wrap,
  .wrapBottom,
  .wrapTop,
  #Contents {
    width: 100%;
  }


  .lp_contents {
    overflow: hidden;
    background-color: #fff;
    padding: 0 0 0;
  }

  /* ===================
    　　Main Visual
  =================== */

  .mainvisual_slider {
    position: relative;
    padding-top: 2rem;
  }

  .mainvisual_slider .top_section__inner {
    width: 100%;
  }

  .mainvisual_slider .feature_list_common > ul {
    transition: opacity .3s ease-in-out;
    opacity: 0;
    height: 43rem;
    margin: 0;
  }

  .mainvisual_slider .feature_list_common > ul.slick-slider {
    display: block;
    opacity: 1;
    height: 35rem;
  }

  .mainvisual_slider .feature_list_common {
    padding: 0;
  }

  .mainvisual_slider .feature_list_common .slick-track {
  }

  .mainvisual_slider .feature_list_common .slick-track .slick-slide  {
    width: 32rem;
    margin: 0 .8rem 3rem;
  }

  .mainvisual_slider .feature_list_common > ul > li > a,
  .mainvisual_slider .feature_list_common .slick-slide a {
    height: 28rem;
    padding: 1.4rem 1.4rem;
  }

  .mainvisual_slider .feature_list_common .feature_cat {
    top: 1rem;
    left: 1rem;
  }

  .mainvisual_slider .feature_list_common .feature_img {
    border-radius: 1rem;
  }

  .mainvisual_slider .feature_list_common .feature_ttl {
    font-size: 1.6rem;
  }

  .mainvisual_slider .feature_list_common .feature_cont {
    font-size: 1.2rem;
  }

  .mainvisual_slider .feature_list_common .feature_data {
    bottom: -2.8rem;
  }

  .mainvisual_slider .slick-dots {
    bottom: 4rem;
  }

  .mainvisual_slider .slick-dots li {
    width: .8rem;
    height: .8rem;
    margin: 0 .45rem;
  }

  .mainvisual_slider .slick-dots li button {
    margin: 0 .7rem .7rem;
  }

}



/*====================
        tablet
=====================*/
@media only screen and (max-width: 1400px) and (min-width: 768px){
  html {
    font-size: calc(10* (100vw / 1400)) !important;
  }
}


/*=======================================
                    SP
========================================*/

/* only SP */
@media only screen and (max-width: 767px) {
  .pc_only {
    display: none;
  }

  .contents_inner .section {
    padding: 0;
  }

  .contents {
    overflow: hidden;
  }

  a {
    text-decoration: unset;
  }

  /* ===================
  　　 more btn
=================== */
.more_box *, .more_box *:before, .more_box *:after {
  box-sizing: border-box;
}
.more_box {
  position: relative;
  max-width: calc(320* (100vw / 390));
  width: 100%;
}
.more_box label {
  position: absolute;
  z-index: 1;
  margin: auto;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  cursor: pointer;
  text-align: center;
  height: 100%;
  background: linear-gradient(to bottom, rgb(255 255 255 / 0%) -160%, rgb(255 255 255) 90%);
}
.more_box input:checked + label {
  background: inherit;
  height: auto;
}
.more_box label:after {
  font-size: calc(16 *(100vw/390));
}
.more_box .more_container {
  height: 17.5rem;
  overflow: hidden;
  transition: all 0.5s;
}
.more_box input:checked + label:after {
  content: 'Close';
  bottom: 8px;
  text-decoration: underline;
}
.more_box input:checked ~ .more_container {
  height: auto;
  padding-bottom: 40px;
  transition: all 0.5s;
}
/*  -----  //more btn -----  */

.more_box{
  max-width: calc(300 *(100vw/390));
  font-size: calc(15 *(100vw/390));
}


  /* ===================
    LP Contents
  =================== */

  .lp_contents {
    font-size: calc(14 * (100vw / 390));
    padding-bottom: calc(20 * (100vw / 390));
    padding: calc(0 * (100vw / 390)) 0 0;
  }

  #EyeShadow {
    padding: calc(50 *(100vw/390)) 0 0;
  }

  /* ===================
    　BACKGROUND
  =================== */


  /* ===================
    　Section Common
  =================== */

  .contents {
    clear: both;
    padding-top: 0;
    background-color: #fff;
  }

  .text-bnr,.header_tagline {
    width: 100vw;
    background: #000;
  }

  .contents_inner .section {
    padding-right: 0;
    padding-left: 0;
  }

  .inner {
    width: auto;
    padding-right: calc(20* (100vw / 390));
    padding-left: calc(20* (100vw / 390));
  }

  .section {
    padding-top: calc(0 * (100vw / 390));
    padding-bottom: calc(0 * (100vw / 390));
  }


  /* ===================
    Button Setting
  =================== */

  .btn_wrap {
    margin-bottom: calc(10 * (100vw / 390));
    justify-content: center;
  }

  .btn_cart a {
    width: calc(180 * (100vw / 390));
    height: calc(50 * (100vw / 390));
    letter-spacing: 0;
  }

  .btn_cart a.cart_in {
    width: calc(260 * (100vw / 390));
  }

 /* ===================
  　　MAINVISUAL
=================== */

.mainvisual_section {
  text-align: center;
}

.mainvisual_section .img_mainvisual img {
  width: 100%;
}

.mainvisual_section .img_mainvisual {
  opacity: 0;
}

.mainvisual_section.effect .img_mainvisual {
  animation: opa1 1.4s cubic-bezier(0.51, 0.21, 0.41, 1) .1s 1 forwards;
}

.schedule_list {
  margin: calc(100 *(100vw/390)) auto calc(60 *(100vw/390));
}

.schedule_list dl {
  margin: 0 auto;
  text-align: left;
  width: calc(275 *(100vw/390));
}

.schedule_list dl:nth-of-type(2) {
  margin: calc(10 *(100vw/390)) auto 0;
}

.schedule_list dd span {
  font-size: calc(13 *(100vw/390));
}

.schedule_list dt,
.schedule_list dd {
  display: inline-block;
  vertical-align: middle;
}

.schedule_list .schedule_ttl {
  margin: 0 calc(10 *(100vw/390)) 0 0;
  padding: calc(7 *(100vw/390)) calc(15 *(100vw/390));
  border: solid 1px #988498;
  border-radius: calc(5 *(100vw/390));
  font-size: calc(14 *(100vw/390));
  line-height: 1;
}

.schedule_list .schedule_content {
  font-size: calc(18 *(100vw/390));
}

.schedule_list .schedule_content + .schedule_ttl {
  margin-left: 3rem;
}

.mainvisual_section h2 {
  font-size: calc(34 *(100vw/390));
  line-height: 1;
  margin: calc(60 *(100vw/390)) auto calc(40 *(100vw/390));
}

/* ===================
  　　Concept
=================== */

.concept_section {
  transition: background-imgage .2s ease-in-out .1s;
  padding: 10rem 0;
  background: transparent no-repeat 0 0;
  background-size: cover;
}

.concept_section.effect {
  transition: background-imgage .2s ease-in-out .1s;
  background-image: url(../../../Contents/ImagesPkg/make/2023SSCollection/Main/concept_bg_all.jpg);
}

.concept_section .inner {
  text-align: center;
  color: #fff;
  font-size: 1.4rem;
}

.concept_section h2 {
  opacity: 0;
  margin-bottom: 5rem;
  font-size: 2.4rem;
  font-weight: 200;
}

.concept_section.effect h2 {
  animation: opa2 1.3s cubic-bezier(0.51, 0.21, 0.41, 1) .6s 1 forwards;
}

.concept_section p {
  opacity: 0;
  margin-bottom: 2.6rem;
  line-height: 2.1;
}

.concept_section p:last-child {
  margin-bottom: 0;
}

.concept_section.effect p {
  animation: opa2 1.3s cubic-bezier(0.51, 0.21, 0.41, 1) 1.2s 1 forwards;
}

/* ===================
      PRODUCTS
=================== */

.products_section {
  padding-top: 6rem;
}

/* ===================
      page_menu
=================== */
.page_menu {
  display: flex;
  justify-content: center;
  margin: auto;
  flex-wrap: wrap;
}

.page_menu li {
  width: calc(182 *(100vw/390));
}

.page_menu li:nth-of-type(n+3) {
  margin-top: calc(5 *(100vw/390));
}


.page_menu a {
  width: 100%;
  padding: calc(10 *(100vw/390)) 0 calc(20 *(100vw/390));
  font-size: calc(18 *(100vw/390));
  font-weight: 500;
}

.page_menu li {
  position: relative;
  margin: 0 calc(3 *(100vw/390));
}



.page_menu li:nth-of-type(1) ,
.page_menu li:nth-of-type(2) ,
.page_menu li:nth-of-type(3) ,
.page_menu li:nth-of-type(4) {
  background-size: cover;
  border-radius: 0.5rem;
}

.page_menu li:nth-of-type(1) {
  background: url(../img/nav_bg_1_pc.png) no-repeat;
}
.page_menu li:nth-of-type(2) {
  background: url(../img/nav_bg_2_pc.png) no-repeat;
}
.page_menu li:nth-of-type(3) {
  background: url(../img/nav_bg_3_pc.png) no-repeat;
}
.page_menu li:nth-of-type(4) {
  background: url(../img/nav_bg_4_pc.png) no-repeat;
}

.page_menu li:nth-of-type(1) a {
  color: #A7968C;
}
.page_menu li:nth-of-type(2) a {
  color: #CE9E9E;
}
.page_menu li:nth-of-type(3) a {
  color: #9C95AA;
}
.page_menu li:nth-of-type(4) a {
  color: #A2948F;
}

.page_menu li:hover::before {
  top: 3.5rem;
  transition: all 0.8s;
}

.page_menu li::before {
  position: absolute;
  display: block;
  content: "";
  width: calc(20 *(100vw/390));
  height: calc(10 *(100vw/390));
  background-size: 100%;
  top: calc(37 *(100vw/390));
  right: calc(77 *(100vw/390));
}
.page_menu li:nth-of-type(1)::before {
  background: url(../img/nav_arrow_1.svg) no-repeat;
  background-size: 70%;
}
.page_menu li:nth-of-type(2)::before {
  background: url(../img/nav_arrow_2.svg) no-repeat;
  background-size: 70%;
}
.page_menu li:nth-of-type(3)::before {
  background: url(../img/nav_arrow_3.svg) no-repeat;
  background-size: 70%;
}
.page_menu li:nth-of-type(4)::before {
  background: url(../img/nav_arrow_4.svg) no-repeat;
  background-size: 70%;
}

/* ===================
      sub_items
=================== */
.sub_items {
  display: flex;
  margin: calc(50 *(100vw/390)) auto;
  justify-content: center;
  flex-wrap: wrap;
}
.sub_items .item {
  width: calc(184 *(100vw/390));
  text-align: center;
  margin: 0 calc(5 *(100vw/390));
}
.sub_items .item:nth-of-type(3) {
  margin: calc(30 *(100vw/390)) auto 0;
}
.sub_items .items_number {
  font-size: calc(18 *(100vw/390));
  margin: calc(6 *(100vw/390)) auto calc(10 *(100vw/390));
}
.sub_items .items_name {
  font-size: calc(14 *(100vw/390));
  margin: 0 auto calc(15 *(100vw/390));
}
.sub_items .items_text {
  font-size: calc(11 *(100vw/390));
}

/* ===================
      makeArea
=================== */
.makeArea {
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
}
.makeArea .make_item {
  width: calc(195 *(100vw/390));
}
.makeArea .make_item:nth-of-type(n+3) {
  margin-top: -1px;
}

/* ===================
      showItems
=================== */
.showItems {
	overflow:		hidden;
	position:		relative;
}
.showItems .caption {
  font-size: 2rem;
  color: #fff;
  padding-top: 8rem;
  padding-left: 15rem;
  font-weight: 400;
}
.showItems .mask {
  display: none;
  width: 100%;
  height: 12.4rem;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0;
  background: linear-gradient(to bottom, rgb(255 255 255 / 0%), rgb(72 72 72) 200%);
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}
.showItems:hover .mask {
	opacity:		1;	/* マスクを表示する */
}

/* ===================
      make_itemArea
=================== */
.make_itemArea {
  position: relative;
}
.make_itemArea .item_img {
  width: calc(140 *(100vw/390));
}
#Lip .make_itemArea .item_img {
  width: calc(70 *(100vw/390));
}
#Nail .make_itemArea .item_img {
  width: calc(85 *(100vw/390));
}
.make_itemArea .item_img.ef.effect {
  animation-delay: 0.6s;
}

/* ===================
      MODAL
=================== */
.useItems_inner {
  flex-wrap: wrap;
  margin: calc(50 *(100vw/390)) auto 0;
}
.useItems_inner .model_img {
  width: calc(310 *(100vw/390));
}
.useItems_inner .items_cont {
  margin-top: calc(50 *(100vw/390));
  margin-left: 0;
}
.useItems_inner .items_cont .items_fl {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: column;
  text-align: center;
}
.useItems_inner .items_cont .items_fl span {
  display: block;
}
.useItems_inner .items_cont .items_fl .item_img_small {
  width: calc(100 *(100vw/390));
}
.useItems_inner .items_cont .items_fl .item_img_small.__2 {
  width: calc(80 *(100vw/390));
  margin-left: 0;
}
.useItems_inner .items_cont .items_fl .item_name {
  font-size: calc(13 *(100vw/390));
}
.useItems_inner .items_cont .items_fl .item_name_en {
  font-size: calc(13 *(100vw/390));
  margin: calc(10 *(100vw/390)) auto calc(25 *(100vw/390));
}
.useItems_inner .items_cont .items_fl .price {
  font-size: calc(13 *(100vw/390));
}
.useItems_inner .items_cont .items_fl .text_Area {
  margin-left: 0;
  margin-top: calc(20 *(100vw/390));
}
.useItems_inner .items_cont .items_fl.__2 {
  margin-top: 4rem;
}
.useItems_inner .items_cont .items_fl.__2 .text_Area {
  margin-left: 0;
}
.modaal-overlay {
  background: #fff !important;
}
.modaal-close:after, .modaal-close:before {
  display: block;
  content: " ";
  position: absolute;
  top: 6.5px;
  left: 14.5px;
  width: 1px;
  height: 18px;
  border-radius: 4px;
  background: #fff;
  -webkit-transition: background .2s ease-in-out;
  transition: background .2s ease-in-out;
}
.LookPatternModalInner .buyAll_btn a {
  font-family: "kozuka-gothic-pro", sans-serif;
  display: block;
  width: calc(310 *(100vw/390));
  margin: calc(40 *(100vw/390)) auto 0;
  padding: calc(10 *(100vw/390)) 0;
  text-align: center;
  font-size: calc(12 *(100vw/390));
  letter-spacing: 0.1em;
  background: linear-gradient(90deg, rgb(232 199 179) 0%, rgb(231 183 160) 100%);
  color: #fff;
  line-height: 1;
  border-radius: calc(10 *(100vw/390));
  font-weight: 500;
}
.LookPatternModalInner.lip .buyAll_btn a {
  background: linear-gradient(90deg, rgb(243 197 189) 0%, rgb(251 182 169) 100%);
}
.LookPatternModalInner .buyAll_btn .en {
  font-size: calc(25 *(100vw/390));
}
.LookPatternModalInner .buyAll_btn span {
  display: block;
}








/* ---- Products ---- */

.inner {
  padding: calc(80 *(100vw/390)) 0;
  background: url(../img/eyeShadow_bg_sp.jpg) no-repeat;
  background-size: cover;
}

#Lip .inner {
  background: url(../img/lip_bg_sp.jpg) no-repeat;
  background-size: cover;
}

#Nail .inner {
  background: url(../img/nail_bg_sp.jpg) no-repeat;
  background-size: cover;
}

.product_section .inner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.product_section.line_top,
.section.line_top {
  margin-top: calc(100 *(100vw/390));
  padding-top: calc(0 *(100vw/390));
}

.product_section_lips .inner,
.product_section_eyeliner .inner,
.product_section_nail .inner {
  flex-direction: column;
}

.product_section .product__img {
  position: relative;
}
/* -- Links -- */
.product_section .product_links span {
  display: none;
}

.product_section .product_links a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
}
/* -- //Links -- */

.product_section .product__title {
  margin-top: calc(40 *(100vw/390));
  margin-bottom: calc(45 *(100vw/390));
  font-size: calc(35 *(100vw/390));
  text-align: center;
}

#Lip .product_section .product__title {
  color: #CE9E9E;
}

#Nail .product_section .product__title {
  color: #9C95AA;
}

.product_section .product__title .txt_line {
  display: block;
  white-space: nowrap;
  line-height: 1.3;
}

.product_section .product__title .txt_line span {
  display: inline-block;
  transform: translateY(8rem);
  transition: all 1.5s  cubic-bezier(0.51, 0.21, 0.41, 1) 0s;
}

.product_section.effect .product__title .txt_line span {
  transform: translateY(0);
  transition: all 1.5s  cubic-bezier(0.51, 0.21, 0.41, 1) 0s;
}

.product_section.effect .product__title .txt_line:nth-child(2),
.product_section.effect .product__title .txt_line:nth-child(3) {
  margin-top: -2rem;
}

.product_section .product__title .txt_line:nth-child(2) span,
.product_section.effect .product__title .txt_line:nth-child(2) span{
  transition-delay: .2s !important;
}

.product_section .product__title .txt_line:nth-child(3) span,
.product_section.effect .product__title .txt_line:nth-child(3) span{
  transition-delay: .4s !important;
}

.product_section .product__title .txt_line + br {
  display: none;
}

.product_section .product__catch {
  font-size: calc(15 *(100vw/390));
  text-align: center;
}


/* ---- リップ---- */

.product_section_lips {
  margin-bottom: 0;
}

.product_section_lips .product__img img {
  width: calc(250 *(100vw/390));
  max-width: calc(250 *(100vw/390));
}

#Lip .product_section_lips .product__img img {
  width: calc(158 *(100vw/390));
  max-width: calc(158 *(100vw/390));
}

#Nail .product_section_lips .product__img img {
  width: calc(110 *(100vw/390));
  max-width: calc(110 *(100vw/390));
}

.product_section_lips .product__cont {
  margin-right: 0;
}
/* -- Links -- */
.product_section_lips .product_links li a {
  width: 16rem;
  height: 35rem;
}

.product_section_lips .product_links li:nth-child(1) a {
  top: 2.2rem;
  left: 10rem;
}

.product_section_lips .product_links li:nth-child(2) a {
  top: 5.5rem;
  left: 26rem;
}

.product_section_lips .product_links li:nth-child(3) a {
  top: 5.5rem;
  left: 42rem;
  width: 20rem;
}

.product_section_lips .product_links li:nth-child(4) a {
  top: 39rem;
  left: 18rem;
}

.product_section_lips .product_links li:nth-child(5) a {
  top: 42rem;
  left: 34rem;
  width: 22rem;
}
/* -- //Links -- */



.product_section .product__info {
  min-height: calc(125 *(100vw/390));
  font-size: calc(12 *(100vw/390));
  text-align: center;
}

.product_section .product__info p {
  width: 100%;
}

.product_section .product__info .product_price {
  font-size: 1.3rem;
  margin-top: 1.5rem;
  display: inline-block;
  line-height: 1;
}

.product__btn {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  margin-bottom: 0;
}

.btn_wrap {
  display: flex;
}


/* ===================
    HOW TO USE
=================== */


.howto_section .inner .ef {
  animation-duration: 1.4s;
}

/* ===================
    SPECIAL CAMPAIGN
=================== */
.specialArea {
  padding: calc(60 *(100vw/390)) 0;
  width: calc(350 *(100vw/390));
  margin: calc(100 *(100vw/390)) auto 0;
}
.specialArea.ReleaseDay {
  margin: calc(40 *(100vw/390)) auto calc(80 *(100vw/390));
}

.specialArea .ttl {
  font-size: calc(38 *(100vw/390));
}
.specialArea.ReleaseDay .ttl {
  color: #988498;
}

.specialArea .subttl {
  font-size: calc(15 *(100vw/390));
  margin-top: calc(15 *(100vw/390));
}
.specialArea.ReleaseDay .subttl {
  color: #988498;
}

.specialArea .dateArea {
  margin-top: calc(40 *(100vw/390));
}

.specialArea .saleText {
  font-size: calc(14 *(100vw/390));
  margin-top: 0;
  padding: calc(8 *(100vw/390)) calc(16 *(100vw/390));
  border-radius: calc(5 *(100vw/390));
}

.specialArea .dateText {
  font-size: calc(20 *(100vw/390));
  margin-top: calc(10 *(100vw/390));
  text-align: left;
  line-height: 1.5;
  width: calc(180 *(100vw/390));
  margin: calc(10 *(100vw/390)) auto 0;
}

.specialArea .dateText span {
  font-size: calc(14 *(100vw/390));
}

.specialArea .cont_name {
  font-size: calc(16 *(100vw/390));
  margin-top: calc(40 *(100vw/390));
}
.specialArea.ReleaseDay .cont_name {
  margin-top: calc(25 *(100vw/390));
}

.specialArea .cont_name::before {
  width: calc(30 *(100vw/390));
  height: 1px;
  top: calc(11 *(100vw/390));
  left: calc(-40 *(100vw/390));
}

.specialArea .cont_name::after {
  width: calc(30 *(100vw/390));
  height: 1px;
  top: calc(11 *(100vw/390));
  right: calc(-40 *(100vw/390));
}

.specialArea .cont_text {
  font-size: calc(13 *(100vw/390));
  margin-top: calc(20 *(100vw/390));
}
.specialArea.ReleaseDay .cont_text {
  margin-top: calc(10 *(100vw/390));
}
.specialArea .cont_text span {
  font-size: calc(11 *(100vw/390));
}
.specialArea .cont_present {
  width: calc(250 *(100vw/390));
  margin: calc(20 *(100vw/390)) auto 0;
}
.specialArea .freeFare {
  font-size: calc(11 *(100vw/390)) !important;
  border-radius: calc(5 *(100vw/390));
  padding: calc(6 *(100vw/390)) calc(6 *(100vw/390)) calc(4 *(100vw/390));
  margin-bottom: calc(5 *(100vw/390));
  border: #655D60 solid 1px;
}

.product_section_lips .inner,
.product_section_eyeliner .inner,
.product_section_nail .inner {
  margin: calc(80 *(100vw/390)) auto 0;
}

/* ===================
      RELEASE DAY
=================== */




}