@charset "UTF-8";
.Container {
  max-width: 640px;
  width: 100%;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
}
.Container img {
  width: 100%;
}
.Container a:hover {
  opacity: 1;
}
.Container picture {
  display: block;
}

.posRel {
  position: relative;
}
.posAbs {
  position: absolute;
}

.top .lp02_02 .btn_01 {
  width: 39.4%;
  inset: auto auto 13.7% 8%;
}
.top .lp02_02 .btn_02 {
  width: 41.4%;
  inset: auto auto 13.7% 52%;
}
.top .lp02_03 .btn_01 {
  width: 39.4%;
  inset: auto auto 11.6% 8%;
}
.top .lp02_03 .btn_02 {
  width: 41.4%;
  inset: auto auto 11.6% 52%;
}
.top .lp02_05 .btn_01 {
  width: 39.4%;
  inset: auto auto 11.4% 8%;
}
.top .lp02_05 .btn_02 {
  width: 41.4%;
  inset: auto auto 11.4% 52%;
}
.top .lp02_07 .btn_01 {
  width: 39.4%;
  inset: auto auto 7.1% 8%;
}
.top .lp02_07 .btn_02 {
  width: 41.4%;
  inset: auto auto 7.1% 52%;
}
.top .lp02_08 .btn_01 {
  width: 39.4%;
  inset: auto auto 13.3% 8%;
}
.top .lp02_08 .btn_02 {
  width: 41.4%;
  inset: auto auto 13.3% 52%;
}
.top .lp02_09 .btn_01 {
  width: 39.4%;
  inset: auto auto 8.5% 8%;
}
.top .lp02_09 .btn_02 {
  width: 41.4%;
  inset: auto auto 8.5% 52%;
}
.top .lp02_11 .btn_01 {
  width: 39.4%;
  inset: auto auto 9% 8%;
}
.top .lp02_11 .btn_02 {
  width: 41.4%;
  inset: auto auto 9% 52%;
}
.top .lp02_12 .btn_01 {
  width: 39.4%;
  inset: auto auto 8.2% 8%;
}
.top .lp02_12 .btn_02 {
  width: 41.4%;
  inset: auto auto 8.2% 52%;
}
.top .lp02_13 .btn_01 {
  width: 39.4%;
  inset: auto auto 8% 8%;
}
.top .lp02_13 .btn_02 {
  width: 41.4%;
  inset: auto auto 8% 52%;
}
.top .lp02_14 .btn_01 {
  width: 39.4%;
  inset: auto auto 7.5% 8%;
}
.top .lp02_14 .btn_02 {
  width: 41.4%;
  inset: auto auto 7.5% 52%;
}
.top .lp02_15 .btn_01 {
  width: 39.4%;
  inset: auto auto 8.8% 8%;
}
.top .lp02_15 .btn_02 {
  width: 41.4%;
  inset: auto auto 8.8% 52%;
}
.top .lp02_17 .btn_01 {
  width: 39.4%;
  inset: auto auto 7.2% 8%;
}
.top .lp02_17 .btn_02 {
  width: 41.4%;
  inset: auto auto 7.2% 52%;
}
.top .lp02_18 .btn_01 {
  width: 39.4%;
  inset: auto auto 8.4% 8%;
}
.top .lp02_18 .btn_02 {
  width: 41.4%;
  inset: auto auto 8.4% 52%;
}
.top .lp02_19 .btn_02 {
  width: 41.4%;
  inset: auto auto 18.9% 52%;
}

.uv .lp01_07 .btn_01 {
  width: 46.5%;
  inset: auto auto 9.2% 49.1%;
}
.uv .lp01_08 .btn_01 {
  width: 52%;
  inset: auto auto 27.9% 47.3%;
}
.uv .lp01_09 .btn_01 {
  width: 52%;
  inset: auto auto 23.1% 47.3%;
}
.uv .lp01_10 .btn_02 {
  width: 66.1%;
  inset: auto auto 14.4% 30.5%;
}

.nana .lp02_02 .btn_01 {
  width: 72.8%;
  inset: auto auto 24.4% 15.3%;
}
.nana .lp02_04 .btn_01 {
  width: 72.8%;
  inset: auto auto 9.9% 14.7%;
}
.nana .lp02_05 .btn_01 {
  width: 72.8%;
  inset: auto auto 4.5% 14.7%;
}
.nana .lp02_18 .btn_01 {
  width: 72.8%;
  inset: auto auto 28.1% 15.2%;
}
.nana .lp02_20 .btn_01 {
  width: 72.8%;
  inset: auto auto 7% 14.7%;
}
.nana .lp02_21 .btn_01 {
  width: 72.8%;
  inset: auto auto 6% 14.7%;
}

.set .lp01_03 .btn_01 {
  width: 78.2%;
  margin: 0 auto;
  inset: auto 0 8.1% 1%;
}
.set .lp01_04 .btn_01 {
  width: 78.2%;
  margin: 0 auto;
  inset: auto 0 3.7% 1%;
}
.set .lp01_05 .btn_01 {
  width: 78.2%;
  margin: 0 auto;
  inset: auto 0 9.7% 1%;
}
.set .lp01_06 .btn_01 {
  width: 72.8%;
  margin: 0 auto;
  inset: auto 0 4.5% 2%;
}
.set .lp01_07 .btn_01 {
  width: 72.8%;
  margin: 0 auto;
  inset: auto 0 6.8% 2%;
}
.set .lp01_08 .btn_01 {
  width: 72.8%;
  margin: 0 auto;
  inset: auto 0 9.8% 2%;
}
.set .lp01_12 .btn_01 {
  width: 72.8%;
  margin: 0 auto;
  inset: auto 0 12.1% 1%;
}
.set .lp01_14 .btn_01 {
  width: 72.8%;
  margin: 0 auto;
  inset: auto 0 8.9% 1.4%;
}
.set .lp01_15 .btn_01 {
  width: 72.8%;
  margin: 0 auto;
  inset: auto 0 5.2% 1.4%;
}

.cleansing .lp01_03 .video01 {
  width: 67%;
  inset: auto 0 11.7%;
  margin: 0 auto;
}

.hair_essence_02 .accordion01.js-open {
  margin: 0 0 12%;
}
.hair_essence_02 .accordion01.js-open .btn01_01 {
  inset: auto 0 -3.7%;
}

.hair_oil_02 .accordion01 {
  margin: 0 0 9%;
}
.hair_oil_02 .accordion01.js-open .btn01_01 {
  inset: auto 0 0;
}

.hair_oil_02 .accordion02 {
  margin: 0 0 9%;
}
.hair_oil_02 .accordion02.js-open .btn01_01 {
  inset: auto 0 0;
}

.nana .accordion01 .accordion-content {
  max-height: 0;
}
.nana .accordion01 .accordion-btnStatus {
  width: 4%;
  border: none;
  inset: 0 0 9% 66%;
}
.nana .accordion01.js-open {
  margin: 0 0 12%;
}
.nana .accordion01.js-open .btn01_01 {
  inset: auto 0 -3.7%;
}

.set .accordion01 .accordion-content {
  max-height: 0;
}
.set .accordion01 .accordion-btnStatus {
  width: 4%;
  border: none;
  inset: 0 0 5% 66%;
}
.set .accordion01 .accordion-content::after {
  content: none;
}
.set .accordion01.js-open {
  margin: 0;
}
.set .accordion01.js-open .btn01_01 {
  inset: auto 0 -3.7%;
}

/* --- アコーディオン基本設定 --- */
.accordion-content {
  overflow: hidden;
  transition: max-height 0.6s ease;
}
.accordion-content::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 150px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgb(255, 255, 255));
}
@media screen and (max-width: 640px) {
  .accordion-content::after {
    bottom: 0;
    left: 0;
    width: 100%;
    height: 23.4375vw;
  }
}
.accordion-btn {
  width: 66%;
  inset: auto 0 3%;
  margin: 0 auto;
  cursor: pointer;
}
.accordion-btnStatus {
  width: 6.3%;
  aspect-ratio: 1/1;
  inset: 0 0 9% 36%;
  margin: auto;
  border: #3e3a39 1px solid;
  border-radius: 50%;
}
.accordion-btnStatus::before, .accordion-btnStatus::after {
  position: absolute;
  content: "";
  display: block;
  width: 50%;
  height: 1px;
  inset: 0;
  margin: auto;
  background: #3e3a39;
}
.accordion-btnStatus::after {
  transition: 0.2s;
  transform: rotate(90deg);
}
.js-open .accordion-btn {
  inset: auto 0 0;
}
.js-open .accordion-btnStatus::after {
  transform: rotate(0deg);
}

/* --- 開いた時の処理 --- */
.js-accordion.js-open .accordion-content::after {
  display: none;
}

/* --- ボタン画像の切り替え --- */
.js-accordion.js-open .js-acc-icon {
  display: block;
  content: url("original_img/cp/202512sale/acc/btn01_close.webp"); /* 閉じボタンのパス */
}

/* contentを使うと元のimgが残る場合があるため、js-open時は中身を隠す */
.js-accordion.js-open .js-acc-icon picture,
.js-accordion.js-open .js-acc-icon img {
  display: none;
}

.selectContainer {
  max-width: 600px;
  width: 90%;
  margin: 0 auto;
  padding: 80px 0 0 0;
  box-sizing: border-box;
}
@media screen and (max-width: 640px) {
  .selectContainer {
    max-width: none;
    margin: 0 auto 20vw;
    padding: 30vw 0 0 0;
  }
}
.selectForm {
  margin: 0 0 1%;
}
.selectTable {
  width: 100%;
  margin: 0 !important;
  font-size: 1.3rem;
  border: none !important;
}
@media screen and (max-width: 640px) {
  .selectTable {
    font-size: 4vw;
  }
}
.selectTable td {
  text-align: center;
  font-weight: bold;
}
.selectHead {
  border: #000 1px solid !important;
}
.selectBot {
  padding: 0 0 0.6% !important;
  font-size: 1.1rem;
  border: none !important;
  background: #e03751 !important;
  color: #fff;
}
@media screen and (max-width: 640px) {
  .selectBot {
    font-size: 3.5vw;
  }
}
.select__item01 {
  font-size: 1.2rem;
  border: #000 1px solid !important;
  border-right: #000 dashed 1px !important;
}
@media screen and (max-width: 640px) {
  .select__item01 {
    font-size: 3.5vw;
  }
}
.select__item02 {
  color: #e03751 !important;
  border: #000 1px solid !important;
  border-left: none !important;
}
@media screen and (max-width: 640px) {
  .select__item02 {
    line-height: 1.2;
  }
}
.select__item02 .price {
  font-size: 2rem;
  color: #e03751 !important;
}
@media screen and (max-width: 640px) {
  .select__item02 .price {
    font-size: 7vw;
  }
}
.selectEach {
  font-size: 1.2rem;
  color: #000;
}
@media screen and (max-width: 640px) {
  .selectEach {
    font-size: 4.1vw;
  }
}
.selectEach__ttl {
  font-size: 0.8rem;
  padding: 0.5% 2%;
  background: #e03751;
  color: #fff;
  white-space: nowrap;
}
@media screen and (max-width: 640px) {
  .selectEach__ttl {
    position: relative;
    top: -0.4vw;
    font-size: 2.3vw;
  }
}
.selectSecond {
  font-size: 0.8rem;
  color: #000;
}
@media screen and (max-width: 640px) {
  .selectSecond {
    font-size: 3vw;
  }
}
.selectLotion__ttl {
  margin: 0 0 5%;
  border: none !important;
  text-align: left !important;
}
.selectAnnotation {
  margin: 0 0 7%;
  text-align: right;
}
.selectAnnotation__txt {
  font-size: 0.8rem;
}
.select__btn {
  width: 16%;
  border-right: solid 1px;
  box-sizing: border-box;
  border: #000 1px solid !important;
  cursor: pointer;
  padding: 0 !important;
}
@media screen and (max-width: 640px) {
  .select__btn {
    flex: 0 1 30%;
    border-right: none;
    border-bottom: solid 1px #000;
  }
}
.select__btn--last {
  border-right: unset;
}
.select__btn input[type=radio] {
  display: none;
}
.select__btn input[type=radio] + label {
  position: relative;
  display: block;
  width: 100%;
  height: 90px;
  margin: 0 auto;
  padding: 0;
}
@media screen and (max-width: 640px) {
  .select__btn input[type=radio] + label {
    height: 20vw;
  }
}
.select__btn input[type=radio] + label::before, .select__btn input[type=radio] + label::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  border: 1px solid #2E2E2E;
  border-radius: 50%;
  box-sizing: initial;
}
.select__btn input[type=radio] + label::after {
  position: absolute;
  content: "";
  width: 22px;
  height: 22px;
  border: none;
}
.select__btn input[type=radio]:checked + label::after {
  background: #000;
}
.selectVolume {
  display: none;
}
.selectBuy {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 400px;
  width: 100%;
  height: 80px;
  margin: 0 auto;
  text-align: center;
  font-size: 1.3rem;
  background: #45bbb7;
  color: #fff;
  cursor: pointer;
}
.selectBuy img {
  width: 100%;
  height: auto;
}

.Choice {
  max-width: 600px;
  width: 90%;
  margin: 0 auto;
  padding: 200px 0 0 0;
  box-sizing: border-box;
}
@media screen and (max-width: 640px) {
  .Choice {
    padding: 20% 0;
  }
}
.Choice__text {
  font-size: 1rem;
  text-indent: -1rem;
  padding-left: 1rem;
  margin-bottom: 10px;
}
.ChoiceList {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border: solid 1px #000;
  margin-bottom: 30px;
}
.ChoiceList__item {
  text-align: center;
  box-sizing: border-box;
}
.ChoiceList__itemText {
  border-bottom: solid 1px #000;
  border-right: solid 1px #000;
  padding: 10px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.ChoiceList__itemText--number {
  font-size: 1rem;
  line-height: 1;
}
.ChoiceList__itemText--skin {
  font-size: 1rem;
  line-height: 1.5;
}
.ChoiceList__itemText--skin span {
  font-size: 1rem;
}
.ChoiceList__itemText--last {
  border-right: unset;
}
.ChoiceList__itemBtn {
  border-right: solid 1px;
  box-sizing: border-box;
}
.ChoiceList__itemBtn--last {
  border-right: unset;
}
.ChoiceList__itemBtn input[type=radio] {
  display: none;
}
.ChoiceList__itemBtn input[type=radio] + label {
  padding: 0;
  position: relative;
  display: block;
  width: 100%;
  height: 40px;
}
.ChoiceList__itemBtn input[type=radio] + label::before, .ChoiceList__itemBtn input[type=radio] + label::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  border: 1px solid #2E2E2E;
  border-radius: 50%;
  box-sizing: initial;
}
.ChoiceList__itemBtn input[type=radio] + label::after {
  position: absolute;
  content: "";
  width: 22px;
  height: 22px;
  border: none;
}
.ChoiceList__itemBtn input[type=radio]:checked + label::after {
  background: #000;
}
.ChoiceVolume {
  display: flex;
  display: none;
  justify-content: space-between;
  width: s-keisan(180);
  background-color: #9e9e9f;
  padding: s-keisan(15) s-keisan(18);
  box-sizing: border-box;
  margin-bottom: s-keisan(20);
}
.ChoiceVolume__text {
  color: #fff !important;
  font-size: s-keisan(29);
}
.ChoiceVolume__select {
  width: s-keisan(63);
  height: s-keisan(31);
  align-self: center;
}
.ChoiceVolume__select select {
  width: 100%;
  height: 100%;
  padding: 2% 2% 2% 26%;
  display: block;
  font-size: s-keisan(16);
}
.ChoiceBuy {
  max-width: 400px;
  width: 100%;
  display: block;
  margin: 0 auto;
}
.ChoiceBuy img {
  width: 100%;
  height: auto;
}/*# sourceMappingURL=202606sale.css.map */