@charset "UTF-8";
/*------------------------------
media query
------------------------------*/
/*------------------------------
変数の定義
--------------------------------*/
/*------------------------------
カラー
--------------------------------*/
/* House Collection LP（.page_content 内） */
.page_content {
  max-width: 768px;
  width: 100%;
  margin: auto;
  background-color: #fff;
  z-index: 2;
  position: relative;
  overflow: hidden;
  font-family: "Noto Sans JP", sans-serif;
  color: #333333;
  text-align: left;
  background: linear-gradient(0deg, #FAEAEE 0%, #FFD3DC 100%);
}
@media screen and (min-width: 769px) {
  .page_content {
    box-shadow: 0 0 60px 0 #D699B7;
  }
}
.page_content {
  /*----------------------------------
  hc_kv
  ----------------------------------*/
}
.page_content .hc_kv {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.page_content .hc_kv .hc_kv_roof {
  width: 100%;
  padding-top: min(18.22vw, 140px);
  background: #EC75A6;
}
@media screen and (min-width: 1200px) {
  .page_content .hc_kv .hc_kv_roof {
    padding-top: 0;
    background: transparent;
  }
}
.page_content .hc_kv .hc_kv_roof img {
  width: 100%;
  display: block;
}
.page_content .hc_kv .hc_kv_body {
  position: relative;
  width: 100%;
  padding: clamp(20px, 3.9vw, 30px) 0 clamp(30px, 8.58vw, 66px);
  background-image: url("../img/house_collection/curtain.png");
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.page_content .hc_kv .hc_kv_body .hc_kv_lettering {
  width: 90%;
  margin: 0 auto;
  padding-bottom: clamp(20px, 4.68vw, 36px);
}
.page_content .hc_kv .hc_kv_body .hc_kv_lettering img {
  width: 100%;
  display: block;
}
.page_content .hc_kv .hc_kv_main {
  position: relative;
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(15px, 3.75vw, 30px);
}
.page_content .hc_kv .swiper_hc_kv {
  position: relative;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 683/1021;
  max-height: none;
  border-radius: 50% 50% 0 0/33.4% 33.4% 0 0;
  border: clamp(10px, 2.6vw, 20px) solid #fff;
  box-sizing: border-box;
}
.page_content .hc_kv .swiper_hc_kv .swiper-wrapper {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}
.page_content .hc_kv .swiper_hc_kv .swiper-slide {
  box-sizing: border-box;
  height: 100%;
}
.page_content .hc_kv .swiper_hc_kv .swiper-slide img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
.page_content .hc_kv .hc_kv_hearts {
  position: absolute;
  top: -2%;
  right: -2%;
  width: 36%;
  max-width: 246px;
  z-index: 6;
  pointer-events: none;
}
.page_content .hc_kv .hc_kv_hearts img {
  width: 100%;
  display: block;
}
.page_content .hc_kv .swiper_hc_kv_pagination.swiper-pagination {
  position: static !important;
  bottom: auto !important;
  left: auto !important;
  width: auto !important;
  margin: 0;
  transform: none;
  line-height: 0;
  display: flex;
  gap: clamp(10px, 2.5vw, 20px);
}
.page_content .hc_kv .swiper_hc_kv_pagination .swiper-pagination-bullet {
  width: clamp(8px, 2vw, 16px);
  height: clamp(8px, 2vw, 16px);
  background: #fff;
  opacity: 1;
  margin: 0 !important;
  transition: background-color 0.45s ease, opacity 0.45s ease, transform 0.45s ease;
}
.page_content .hc_kv .swiper_hc_kv_pagination .swiper-pagination-bullet-active {
  opacity: 1;
  background: #D50057;
}
.page_content {
  /*----------------------------------
  hc_intro
  ----------------------------------*/
}
.page_content .hc_intro {
  padding: clamp(40px, 8.6vw, 66px) clamp(20px, 5vw, 40px);
  background: #FFF6E4;
}
.page_content .hc_intro .hc_intro_box {
  width: 100%;
  max-width: 688px;
  margin: 0 auto;
  background: #fff;
  box-shadow: 0 7px 0 #F4ACBC;
  border: 3px solid #E883B5;
  padding: clamp(20px, 5.2vw, 40px);
  box-sizing: border-box;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(20px, 5.2vw, 40px);
}
.page_content .hc_intro .hc_intro_box .hc_intro_ttl {
  margin: 0;
  color: #D50057;
  font-weight: 700;
  font-size: clamp(20px, 5.2vw, 40px);
  letter-spacing: 0.05em;
  line-height: 1.4;
}
.page_content .hc_intro .hc_intro_box .hc_intro_content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(15px, 4.55vw, 35px);
}
.page_content .hc_intro .hc_intro_box .hc_intro_content .hc_intro_text {
  width: 100%;
}
.page_content .hc_intro .hc_intro_box .hc_intro_content .hc_intro_text p {
  margin: 0;
  font-size: clamp(14px, 3.4vw, 26px);
  color: #333333;
  line-height: 1.6;
  letter-spacing: 0.05em;
}
.page_content .hc_intro .hc_intro_box .hc_intro_content .hc_intro_text p + p {
  margin-top: clamp(8px, 2vw, 16px);
}
.page_content .hc_intro .hc_intro_box .hc_intro_content .hc_intro_text p .pink {
  color: #D50057;
}
.page_content .hc_intro .hc_intro_box .hc_intro_content .hc_intro_logo {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.page_content .hc_intro .hc_intro_box .hc_intro_content .hc_intro_logo .hc_intro_logo_img {
  margin: 0;
  width: 100%;
}
.page_content .hc_intro .hc_intro_box .hc_intro_content .hc_intro_logo .hc_intro_logo_img img {
  width: 100%;
  display: block;
}
.page_content .hc_intro .hc_intro_box .hc_intro_content .hc_intro_logo .hc_intro_logo_ja {
  margin: 0;
  font-size: clamp(14px, 3.1vw, 24px);
  color: #D50057;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-shadow: 0 0 10px #fff;
}
.page_content .hc_intro .hc_intro_box .hc_intro_outro {
  margin: 0;
  font-size: clamp(14px, 3.4vw, 26px);
  color: #333333;
  line-height: 1.6;
  letter-spacing: 0.05em;
}
.page_content {
  /*----------------------------------
  hc_visual
  ----------------------------------*/
}
.page_content .hc_visual {
  width: 100%;
}
.page_content .hc_visual img {
  width: 100%;
  display: block;
}
.page_content {
  /*----------------------------------
  hc_shop / hc_event
  ----------------------------------*/
}
.page_content .hc_shop,
.page_content .hc_event {
  padding: 0 clamp(20px, 5vw, 40px);
}
.page_content .hc_shop {
  padding-top: clamp(40px, 8.6vw, 66px);
  padding-bottom: clamp(40px, 10.4vw, 80px);
}
.page_content .hc_event {
  padding-bottom: clamp(40px, 8.6vw, 66px);
}
.page_content .hc_event_ttl {
  margin: 0 0 clamp(20px, 5vw, 40px);
  width: 100%;
}
.page_content .hc_event_ttl svg {
  width: 62%;
  max-width: 426px;
  height: auto;
  display: block;
  margin: 0 auto;
}
.page_content .hc_event_list {
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 5vw, 40px);
}
.page_content {
  /*----------------------------------
  hc_accordion
  ----------------------------------*/
}
.page_content .hc_accordion {
  width: 100%;
  max-width: 688px;
  margin: 0 auto;
  background: #fff;
  display: grid;
  grid-template-rows: auto 0fr;
  transition: grid-template-rows 0.4s ease;
}
.page_content .hc_accordion[open] {
  grid-template-rows: auto 1fr;
}
.page_content .hc_accordion[open] .hc_accordion_icon::after {
  opacity: 0;
}
.page_content .hc_accordion .hc_accordion_head {
  background: #E883B5;
  color: #fff;
  padding: clamp(20px, 3.9vw, 30px) clamp(15px, 5.2vw, 40px);
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(10px, 2.6vw, 20px);
  font-weight: 700;
  font-size: clamp(16px, 4.7vw, 36px);
  line-height: 1.3;
  letter-spacing: 0.05em;
}
.page_content .hc_accordion .hc_accordion_head::-webkit-details-marker {
  display: none;
}
.page_content .hc_accordion .hc_accordion_ttl {
  flex: 1 1 auto;
}
.page_content .hc_accordion .hc_accordion_icon {
  flex: 0 0 auto;
  position: relative;
  width: clamp(30px, 6.5vw, 50px);
  height: clamp(30px, 6.5vw, 50px);
  border-radius: 50%;
  background: #fff;
}
.page_content .hc_accordion .hc_accordion_icon::before, .page_content .hc_accordion .hc_accordion_icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: clamp(10px, 2.34vw, 18px);
  height: 2px;
  background: #E883B5;
  transform: translate(-50%, -50%);
  transition: opacity 0.25s ease;
}
@media screen and (min-width: 769px) {
  .page_content .hc_accordion .hc_accordion_icon::before, .page_content .hc_accordion .hc_accordion_icon::after {
    height: 3px;
  }
}
.page_content .hc_accordion .hc_accordion_icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}
.page_content .hc_accordion .hc_accordion_body {
  overflow: hidden;
  min-height: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
  background: #fff;
  padding: clamp(15px, 5.2vw, 40px);
}
.page_content .hc_accordion .hc_accordion_body p {
  margin: 0;
  font-size: clamp(14px, 3.4vw, 26px);
  color: #333333;
}
.page_content .hc_accordion[open] .hc_accordion_body {
  opacity: 1;
  transition-delay: 0.05s;
}
.page_content .hc_event_meta {
  margin: 0 0 clamp(15px, 2.6vw, 20px);
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 1.3vw, 10px);
}
.page_content .hc_event_meta_row {
  display: flex;
  align-items: baseline;
  gap: clamp(10px, 1.8vw, 14px);
}
.page_content .hc_event_meta_row dt {
  flex: 0 0 auto;
}
.page_content .hc_event_meta_row dd {
  flex: 1 1 auto;
  margin: 0;
  font-size: clamp(14px, 3.4vw, 26px);
  color: #333333;
}
.page_content .hc_event_meta_label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 10px;
  border: 1px solid #E883B5;
  color: #E883B5;
  font-size: clamp(12px, 2.9vw, 22px);
  white-space: nowrap;
}
.page_content .hc_event_map {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  align-items: center;
  gap: clamp(6px, 1.3vw, 10px);
  color: #E883B5;
  font-size: clamp(12px, 2.9vw, 22px);
  letter-spacing: 0.05em;
  border-bottom: 1px solid #E883B5;
  padding: 5px clamp(5px, 1.3vw, 10px);
}
.page_content .hc_event_map svg {
  width: clamp(20px, 4.5vw, 26px);
  height: auto;
  display: block;
}
.page_content {
  /*----------------------------------
  hc_revival (NEW + 復刻マスカラ)
  ----------------------------------*/
}
.page_content .hc_revival {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #FFD3DC 0%, #FAEAEE 100%);
}
.page_content .hc_revival .hc_revival_label {
  position: relative;
  z-index: 3;
  background: #D50057;
  text-align: center;
  padding: clamp(20px, 3.9vw, 30px) clamp(40px, 13vw, 100px);
  line-height: 1;
}
.page_content .hc_revival .hc_revival_label svg {
  display: block;
  margin: 0 auto;
  width: clamp(70px, 18.4vw, 141px);
  height: auto;
}
.page_content .hc_revival .hc_revival_stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(20px, 5.2vw, 40px);
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  padding: clamp(20px, 5.2vw, 40px) 0 0;
  background-image: url(../img/house_collection/curtain.png);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.page_content .hc_revival .hc_revival_stack .hc_revival_lead {
  margin: 0;
  width: 100%;
  max-width: 608px;
  padding: 0 clamp(20px, 5vw, 40px);
}
.page_content .hc_revival .hc_revival_stack .hc_revival_lead img {
  width: 100%;
  height: auto;
  display: block;
}
.page_content .hc_revival .hc_revival_stack .hc_revival_visual {
  margin: 0;
  width: 100%;
}
.page_content .hc_revival .hc_revival_stack .hc_revival_visual img {
  width: 100%;
  height: auto;
  display: block;
}
.page_content .hc_revival .hc_revival_inner {
  background: linear-gradient(90deg, #F1D7D7 0%, #EED4D5 50%, #EFDBDA 100%);
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  padding: 0 clamp(20px, 5vw, 40px) clamp(40px, 10.4vw, 80px);
  margin-top: -5%;
  text-align: center;
}
.page_content .hc_revival .hc_revival_inner .hc_revival_detail {
  width: 100%;
}
.page_content .hc_revival .hc_revival_inner .hc_revival_detail .hc_revival_desc {
  margin: 0 0 clamp(15px, 3.9vw, 30px);
  color: #333333;
  font-size: clamp(14px, 2.9vw, 22px);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.05em;
}
.page_content .hc_revival .hc_revival_inner .hc_revival_detail .hc_revival_name {
  margin: 0 0 clamp(10px, 2.6vw, 20px);
  color: #333333;
  font-size: clamp(20px, 4.2vw, 32px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.05em;
}
.page_content .hc_revival .hc_revival_inner .hc_revival_detail .hc_revival_name span {
  display: inline-block;
  font-weight: 700;
  font-size: clamp(15px, 3.1vw, 24px);
  line-height: 1.4;
  margin-top: 0.15em;
}
.page_content .hc_revival .hc_revival_inner .hc_revival_detail .hc_revival_price {
  margin: 0;
  color: #333333;
  font-size: clamp(18px, 3.4vw, 26px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.05em;
}
.page_content .hc_revival .hc_revival_inner .hc_revival_detail .hc_revival_price small {
  font-weight: 700;
}
.page_content .hc_revival .hc_revival_inner .hc_revival_note {
  margin-top: clamp(10px, 2.6vw, 20px);
  color: #333333;
  font-size: clamp(10px, 1.6vw, 12px);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.02em;
}
.page_content .hc_revival .hc_revival_inner .hc_btn {
  margin-top: clamp(40px, 10.4vw, 80px);
}
.page_content {
  /*----------------------------------
  hc_product
  ----------------------------------*/
}
.page_content .hc_product {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(20px, 5vw, 40px);
  padding-left: clamp(20px, 5vw, 40px);
  padding-right: clamp(20px, 5vw, 40px);
}
.page_content .hc_product.hc_product--mascara {
  padding-top: clamp(40px, 8.6vw, 66px);
  padding-bottom: clamp(60px, 10.4vw, 80px);
}
.page_content .hc_product.hc_product--serum {
  padding-bottom: clamp(40px, 8.6vw, 66px);
}
.page_content .hc_product.hc_product--palette {
  padding-top: clamp(80px, 13vw, 100px);
  padding-bottom: clamp(60px, 10.4vw, 80px);
}
.page_content .hc_product.hc_product--lip {
  padding-bottom: clamp(60px, 10.4vw, 80px);
}
.page_content .hc_product.hc_product--tint {
  padding-bottom: clamp(80px, 16.38vw, 126px);
}
.page_content .hc_product .hc_product_intro {
  width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(15px, 3vw, 24px);
}
.page_content .hc_product .hc_product_lead {
  margin: 0;
  color: #333333;
  font-size: clamp(18px, 4.7vw, 36px);
  font-weight: 700;
  line-height: 1.4;
}
.page_content .hc_product .hc_product_lead .pink {
  font-size: clamp(22px, 5.98vw, 46px);
  font-weight: 700;
  color: #D50057;
}
.page_content .hc_product .hc_product_desc {
  margin: 0;
  color: #333333;
  font-size: clamp(14px, 2.86vw, 22px);
  text-align: center;
}
.page_content .hc_product .hc_product_desc .pink {
  color: #D50057;
  border-bottom: 2px dotted #E883B5;
}
.page_content .hc_product .hc_product_desc .deco_heart {
  display: inline-block;
  width: 1em;
  line-height: 0;
  vertical-align: -0.15em;
  margin: 0 0.1em;
}
.page_content .hc_product .hc_product_desc .deco_heart img {
  width: 100%;
  height: auto;
  display: block;
}
.page_content .hc_product_card {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(20px, 5vw, 40px);
  background: #fff;
  padding: clamp(20px, 5.2vw, 40px);
}
.page_content .hc_product_card .hc_product_visual {
  width: 100%;
  aspect-ratio: 608/400;
  overflow: hidden;
  background: #FAEAEE;
}
.page_content .hc_product_card .hc_product_visual .swiper_hc_product_visual {
  width: 100%;
  height: 100%;
}
.page_content .hc_product_card .hc_product_visual .swiper_hc_product_visual .swiper-wrapper {
  height: 100%;
}
.page_content .hc_product_card .hc_product_visual .swiper_hc_product_visual .swiper-slide {
  height: 100%;
}
.page_content .hc_product_card .hc_product_visual .swiper_hc_product_visual .swiper-slide img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
.page_content .hc_product_card .hc_product_visual img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
.page_content .hc_product_card .hc_product_info {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(10px, 2.6vw, 20px);
  text-align: center;
}
.page_content .hc_product_card .hc_product_info .hc_product_name {
  margin: 0;
  color: #333333;
  font-size: clamp(18px, 4.16vw, 32px);
  font-weight: 700;
  line-height: 1.4;
}
.page_content .hc_product_card .hc_product_info .hc_product_name span {
  display: block;
  font-weight: 700;
  font-size: clamp(14px, 3.1vw, 24px);
  margin-top: 5px;
  line-height: 1.4;
}
.page_content .hc_product_card .hc_product_info .hc_product_name .sales_name {
  font-size: clamp(12px, 2.86vw, 22px);
  font-weight: 500;
}
.page_content .hc_product_card .hc_product_info .hc_product_price {
  margin: 0;
  color: #333333;
  font-size: clamp(18px, 3.38vw, 26px);
  font-weight: 700;
  letter-spacing: 0.05em;
}
.page_content .hc_product_card .hc_product_info .hc_product_price small {
  font-weight: 700;
}
.page_content .hc_product_card .hc_product_info .hc_product_note {
  margin: 0;
  color: #333333;
  font-size: clamp(10px, 1.6vw, 12px);
  line-height: 1.5;
  letter-spacing: 0.02em;
}
.page_content .hc_product--mascara, .page_content .hc_product--serum {
  background: #FFF6E4;
}

.wrapper {
  max-width: 100%;
}
@media screen and (min-width: 769px) {
  .wrapper {
    min-width: 768px;
  }
}

main {
  text-align: center;
}
@media screen and (min-width: 769px) {
  main {
    background: linear-gradient(180deg, #FFD3DC 0%, #F5B0C7 50%, #EB8CB2 100%);
    background-attachment: fixed;
  }
}

.hc_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 688px;
  padding: clamp(20px, 4.29vw, 33px) 0;
  color: #D50057;
  background: #fff;
  border: 3px solid #D50057;
  text-align: center;
  position: relative;
  box-shadow: 0 7px 0 #EC75A6;
}
.hc_btn span {
  display: inline-block;
  font-size: clamp(18px, 4.7vw, 36px);
  font-weight: 700;
  line-height: 1;
}
.hc_btn::after {
  content: "";
  position: absolute;
  right: clamp(20px, 5vw, 40px);
  top: 50%;
  transform: translateY(-50%);
  width: clamp(30px, 6.5vw, 50px);
  height: clamp(30px, 6.5vw, 50px);
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 50 50' fill='none'><circle cx='25' cy='25' r='25' fill='%23D50057'/><rect width='28.3333' height='26.6667' transform='translate(11.666 11.667)' fill='%23D50057'/><rect width='1.95977' height='11.7586' rx='0.979883' transform='matrix(0.70291 -0.711278 0.70291 0.711278 20.4277 17.9072)' fill='white'/><rect width='1.95977' height='11.7586' rx='0.979883' transform='matrix(0.70291 0.711278 -0.70291 0.711278 28.6934 23.4834)' fill='white'/></svg>") center/contain no-repeat;
}
@media screen and (min-width: 769px) {
  .hc_btn {
    transition: color 0.3s ease, background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
  }
  .hc_btn:hover {
    color: #fff;
    background-color: #D50057;
    transform: translateY(7px);
    box-shadow: 0 0 0 #EC75A6;
  }
  .hc_btn:hover::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 50 50' fill='none'><circle cx='25' cy='25' r='25' fill='white'/><rect width='28.3333' height='26.6667' transform='translate(11.666 11.667)' fill='white'/><rect width='1.95977' height='11.7586' rx='0.979883' transform='matrix(0.70291 -0.711278 0.70291 0.711278 20.4277 17.9072)' fill='%23D50057'/><rect width='1.95977' height='11.7586' rx='0.979883' transform='matrix(0.70291 0.711278 -0.70291 0.711278 28.6934 23.4834)' fill='%23D50057'/></svg>");
  }
}

.strong {
  color: #D50057;
  background: linear-gradient(transparent 60%, #FCDEE5 60%);
  padding: 0 0.05em;
}