@charset "utf-8";

.font-yumin {
  font-family: "游明朝", YuMincho, 'Yu Mincho', "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Noto Serif JP", "serif" !important;
}

.font-garamond {
  font-family: 'EB Garamond', serif !important;
}

.font-arno {
  font-family: arno-pro, serif !important;
}

.font-petrona {
  font-family: Petrona, serif !important;
}

.inview {
  opacity: 0;
}

.scrolled main {
  padding-top: calc(130px + var(--fsBannerHeight));
}

html {
  scroll-padding-top: 0px
}

#so {
  color: #3d3027;
}

main a:hover {
  text-decoration: none;
}

footer {
  margin-top: 0;
}

sup {
  font-size: 1.6rem;
  vertical-align: super;
}

.kv a:hover {
  opacity: 1;
}

/* =========================
            共通
========================= */
.font-capitalize {
  text-transform: capitalize;
}

.font-uppercase {
  text-transform: uppercase;
}

.common__title {
  color: #9c8743;
  font-size: 4.6rem;
  line-height: 1;
  text-align: center;
}

.common__title--en {
  font-size: 7rem;
  font-weight: 500;
}

.data {
  margin-top: 17px;
}

.name-and-price {
  font-size: 1.4rem;
  line-height: 1.4;
  text-align: center;
  margin-top: 0;
}

.cart__btn,
.bcs {
  text-align: center;
  margin-top: 20px;
}

.cart__btn a,
.bcs .bbg {
  width: 210px;
  display: inline-block;
  background-color: #b6975b;
  color: #fff;
  cursor: pointer;
  font-size: 1.4rem;
  line-height: 1.4rem;
  text-align: center;
  text-decoration: none;
  padding: 16px 0 18px;
  position: relative;
}

.bcs .bbg {
  background: #FFF;
  border: 1px solid #b6975b;
  color: #b6975b;
}

.cart__btn a svg {
  font-size: 1rem;
  position: absolute;
  top: 50%;
  right: 7px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

.obj {
  position: absolute;
}

.common__obj--l {
  left: 0;
}

.common__obj--r {
  right: 0;
}

.common-title__obj {
  width: 95px;
  line-height: 1;
  margin: 0 auto;
}

.section__line {
  display: inline-block;
  content: "";
  width: 100%;
  height: 18px;
  background-image: url(../../images/special_contents/ShowerOil/20260423/line_section.png);
  background-repeat: repeat;
  background-size: contain;
  position: absolute;
  z-index: 30;
}

.limited {
  width: 70px;
  height: 70px;
  box-sizing: border-box;
  background-color: #b29a58;
  border-radius: 50%;
  padding: 2px;
  position: absolute;
  right: -40px;
  top: -8px;
  z-index: 15;
}

.limited-in {
  width: 100%;
  height: 100%;
  display: block;
  border: 1px solid #FFF;
  border-radius: 50%;
  box-sizing: border-box;
}

.ltext {
  width: 100%;
  display: inline-block;
  color: #FFF;
  font-size: 1.8rem;
  line-height: 1.2;
  text-align: center;
  margin-top: 0px;
  position: absolute;
  left: 0px;
  top: 51%;
  -webkit-transform: translateY(-51%);
  transform: translateY(-51%);
}

/* =======================
            kv
======================= */
.kv {
  margin: 0px;
  padding: 0px;
  overflow: visible;
  z-index: 20;
  position: relative;
}

.kv-text__wrapper {
  width: 68.9vw;
  text-align: center;
  position: absolute;
  top: 7vw;
  left: 0;
}

.kv__title {
  color: #af9866;
  font-feature-settings: "palt";
  font-size: 4.7vw;
  font-style: italic;
  font-weight: 400;
  line-height: 1;
}

.kv__lead {
  color: #3d3027;
  font-feature-settings: "palt";
  font-size: 1.4vw;
  line-height: 1.3;
  margin-top: 1.5vw;
}

.kv__icon {
  position: absolute;
  top: -5vw;
  right: 4vw;
}

.kv__icon img {
  width: 5.2vw;
}

.campaign-banner__wrapper {
  width: 769px;
  position: absolute;
  bottom: -80px;
  left: 50%;
  transform: translateX(-50%);
}

/* =======================
          lead
======================= */
.lead {
  background-image: url(../../images/special_contents/ShowerOil/20260423/bg_lead.jpg);
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.lead__inner {
  padding: 145px 0 72px;
}

.nav-anchor__list {
  display: flex;
  justify-content: center;
  column-gap: 12px;
}

.nav-anchor__item {
  width: 193px;
  height: 75px;
  background-image: url(../../images/special_contents/ShowerOil/20260423/bg_nav.png);
  background-size: contain;
  background-repeat: no-repeat;
  text-align: center;
  position: relative;
}

.nav-anchor__link {
  width: 100%;
  height: 100%;
  display: block;
  color: #fff;
  font-feature-settings: "palt";
  font-size: 1.6rem;
  letter-spacing: -0.025em;
  padding-top: 14px;
}

.lead__label {
  width: 346px;
  margin: 56px auto 0;
}

.lead__text {
  font-feature-settings: "palt";
  font-size: 2.4rem;
  line-height: 1.5;
  text-align: center;
  margin-top: 24px;
}

/* =======================
        5つの特長
======================= */
.characteristic {
  background-image: url(../../images/special_contents/ShowerOil/20260423/bg_characteristic.jpg);
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.characteristic__inner {
  padding: 83px 0 75px;
}

.common__title--num {
  font-size: 7rem;
}

.characteristic-title__obj {
  margin-top: 25px;
}

.characteristic__img {
  width: 885px;
  margin: 32px auto 0;
}

/* =======================
      All Line Up
======================= */
.lineup__inner {
  padding: 99px 0 84px;
}

.lineup-tab-area {
  width: 930px;
  display: flex;
  column-gap: 6px;
  margin: 67px auto 0;
  cursor: pointer;
}

.lineup-tab {
  width: calc(100%/6);
  background: -webkit-gradient(linear, left top, left bottom, from(#f8efe3), to(#eadcb0));
  background: -webkit-linear-gradient(top, #f8efe3, #eadcb0);
  background: -moz-linear-gradient(top, #f8efe3, #eadcb0);
  background: -o-linear-gradient(top, #f8efe3, #eadcb0);
  background: linear-gradient(#f8efe3, #eadcb0);
  color: #9c8743;
  font-feature-settings: "palt";
  font-size: 1.6rem;
  line-height: 1.1;
  padding: 7px 0 9px;
  text-align: center;
  display: flex;
  align-items: center;
  /* 縦中央 */
  justify-content: center;
  /* 横中央（不要なら消してOK） */
  text-align: center;
}

.lineup-tab.active {
  background: none;
  color: #fff;
}

.lineup-tab.dj.active {
  background-color: #9bdbdb;
}

.lineup-tab.gr.active {
  background-color: #f7b8c8;
}

.lineup-tab.plv.active {
  background-color: #d6b9ea;
}

.lineup-tab.wt.active {
  background-color: #9bd4a5;
}

.lineup-tab.tk.active {
  background-color: #f5b1f7;
}

.lineup-tab.rt.active {
  background-color: #f7b1b1;
}

.lineup-panel-group {
  display: none;
}

.lineup-panel-group.active {
  display: block;
}

.lineup__catch {
  font-feature-settings: "palt";
  font-size: 2.6rem;
  line-height: 1;
  text-align: center;
  margin-top: 66px;
}

.lineup__catch--dj {
  color: #419394;
}

.lineup__catch--gr {
  color: #ea6fa3;
}

.lineup__catch--plv {
  color: #875ba5;
}

.lineup__catch--wt {
  color: #4cac5d;
}

.lineup__catch--tk {
  color: #d75fa9;
}

.lineup__catch--rt {
  color: #f15c5c;
}

.lineup-panel-group {
  width: 781px;
  margin: 0 auto 0;
}

.lineup__list {
  width: 100%;
  margin-top: 39px;
}

.lineup__item {
  width: 227px;
}

.lineup__img {
  width: 227px;
  margin: 0 auto;
}

/* =========================
        For Gift
========================= */
.gift {
  background-color: #f8f4ee;
}

.gift__inner {
  padding: 71px 0 93px;
}

.gift-slider {
  width: 1160px;
  margin: 0 auto;
}

.gift__list {
  margin: 68px auto 0;
}

.gift__catch,
.bundle__catch {
  color: #9c894d;
  font-size: 2rem;
  line-height: 1.3;
  text-align: center;
}

.gift__img {
  width: 243px;
  margin: 22px auto 0;
  position: relative;
}

/* =========================
        bundle
========================= */
.bundle-set__inner {
  padding: 80px 0;
}
.bundle-slider {
  width: 1000px;
  margin: 0 auto;
  position: relative;
}

.bundle__list {
  width: 100%;
  margin: 33px auto 0;
}

.bundle__item {
  width: calc(3/100%);
  margin: 0 auto;
}

.bundle__img {
  width: 227px;
  margin: 0 auto;
  position: relative;
}

.bundle__catch {
  font-feature-settings: "palt";
  font-size: 2.6rem;
}

.limited--bundle {
  background: #ef925c;
  top: 0;
  right: -10px;
}
/* =========================
            成分
========================= */
.ingredient {
  background: linear-gradient(to bottom,
      #b29b6a 0%,
      #e8d9bb 50%,
      #fcf6e8 100%);
}

.ingredient__inner {
  padding: 88px 0 100px;
}

.ingredient__inner--botanical {
  padding: 73px 0 75px;
}

.ingredient__title {
  color: #fff;
  line-height: 1.2;
}

.ingredient__title--num {
  display: inline-block;
  font-style: italic;
  margin-right: 6px;
  transform: translateY(4px);
}

.ingredient-title__obj {
  margin-top: 20px;
}

.ingredient__wrapper {
  width: 1160px;
  display: flex;
  column-gap: 55px;
  margin: 0 auto;
  padding-left: 67px;
}

.ingredient__wrapper1 {
  margin-top: 45px;
}

.ingredient-title__wrapper {
  display: flex;
}

.num1 {
  width: 50px;
}

.num2 {
  width: 78px;
}

.ingredient-detail__title {
  font-feature-settings: "palt";
  font-size: 3rem;
  line-height: 1.3;
  margin-left: 31px;
  padding-top: 20px;
}

.ingredient-detail__title--botanical {
  line-height: 1;
  padding-top: 57px;
}

.ingredient-main__img {
  width: 486px;
  margin-top: 3px;
}

.ingredient-title__wrapper1 {
  padding-left: 45px;
}

.ingredient-title__wrapper2 {
  padding-left: 25px;
}

.ingredient__text {
  font-feature-settings: "palt";
  font-size: 2rem;
  line-height: 1.7;
  padding-top: 20px;
}

.ingredient__text--botanical {
  margin-left: 130px;
}

.ingredient-detail__wrapper {
  display: flex;
  column-gap: 5px;
  margin-top: 33px;
}

.ingredient__img {
  width: 106px;
  position: relative;
}

.ingredient__img::after {
  display: inline-block;
  content: "";
  width: 26px;
  height: 26px;
  background-image: url(../../images/special_contents/ShowerOil/20260423/arrow.png);
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 90%;
  transform: translateY(-50%);
  z-index: 30;
}

.ingredient__img--none::after {
  background-image: none;
}

.ingredient-detail {
  position: relative;
}

.ingredient-detail__text {
  font-size: 1.6rem;
  line-height: 1.2;
  text-align: center;
  margin-top: 10px;
}

.ingredient-botanical__wrapper {
  width: 1014px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  margin: 52px auto 0;
}

.ingredient-botanical__img {
  width: 504px;
  position: relative;
}

.ingredient-botanical__text {
  font-feature-settings: "palt";
  font-size: 2.7rem;
  line-height: 1.2;
  text-align: center;
  position: absolute;
  top: 40px;
}

.ingredient-botanical__text1 {
  left: 39px;
}

.ingredient-botanical__text2 {
  right: 56px;
}

.ingredient-botanical__text3 {
  left: 43px;
}

.ingredient-botanical__text4 {
  right: 68px;
}

.ingredient-botanical__text sup {
  font-size: 1.4rem;
}

.ingredient__notes {
  width: 1014px;
  font-size: 1.4rem;
  line-height: 1;
  margin: 29px auto 0;
}

/* =========================
            香り
========================= */
.fragrance {
  position: relative;
}

.fragrance__inner {
  padding: 102px 0 98px;
}

.gen-text__wrapper {
  display: flex;
  column-gap: 7px;
  justify-content: center;
  margin-top: 50px;
}

.gen__icon {
  line-height: 1;
}

.gen__text {
  color: #6186a2;
  font-feature-settings: "palt";
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1;
}

.graph__img {
  width: 799px;
  margin: 28px auto 0;
  position: relative;
  z-index: 10;
}

.js-open-fragrance {
  background: none;
  border: none;
  position: absolute;
}

.fragrance__btn {
  border-radius: 50px;
  font-feature-settings: "palt";
  font-size: 1.6rem;
  line-height: 1;
  box-shadow: 6px 6px #dfdaca;
  padding: 10px 0 12px;
}

.fragrance__btn::after {
  content: "";
  width: 6px;
  height: 6px;
  border-top: 1px solid #3d3027;
  border-right: 1px solid #3d3027;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.fragrance-name__btn-text {
  color: #3d3027;
}

.fragrance-type__btn-text {
  font-feature-settings: "palt";
  font-weight: 600;
}

.fragrance-type__wrapper {
  display: flex;
  align-items: center;
  column-gap: 4px;
  justify-content: center;
  margin-top: 5px;
}

.fragrance-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, .6);
  display: none;
}

.fragrance-modal__inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 30px;
}

.fragrance-modal__close {
  width: 30px;
  height: 30px;
  background: none;
  border: none;
  position: absolute;
  top: 21px;
  right: 23px;
  z-index: 100000;
}

.fragrance-modal__close::before,
.fragrance-modal__close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  /* 棒の幅（太さ） */
  height: 28px;
  /* 棒の高さ */
  background: #3d3027;
}

.fragrance-modal__close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.fragrance-modal__close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.fragrance-slider .slick-dots {
  margin-top: 18px;
}

.fragrance-slider .slick-dots>li>button::before {
  width: 8px;
  height: 8px;
  background: #faf3e4;
  opacity: 0.4;
}

.fragrance-slider .slick-dots>li.slick-active>button::before {
  opacity: 1;
}

.slick-arrow.slick-prev::after,
.slick-arrow.slick-next::after {
  display: none;
}

.fragrance-slider .fragrance-prev,
.fragrance-slider .fragrance-next {
  background-repeat: no-repeat;
  background-position: 0px 0px;
  background-size: 100% 100%;
  transition: unset;
  border-width: 0px;
  border-style: none;
  opacity: 1;
}

.fragrance-slider .fragrance-prev {
  left: -18px;
  background-image: url(../../images/gift/20260416/prev.svg);
}

.fragrance-slider .fragrance-next {
  right: -18px;
  background-image: url(../../images/gift/20260416/next.svg);
}

/* .fragrance__list .slick-list {
  overflow: visible;
} */

/* .fragrance__list .slick-track {
  width: 473px !important;
} */

.fragrance__list {
  width: 473px;
  height: 400px;
  background-color: transparent;
}

.fragrance__item {
  width: 473px !important;
  height: 430px;
  background-color: #fff;
  border-radius: 30px;
  margin: 0 auto;
  text-align: center;
  padding: 50px 0 38px;
  position: relative;
  overflow: hidden;
}

.fragrance-name__title {
  font-feature-settings: "palt";
  font-size: 3.8rem;
  line-height: 1;
}

.recommend__text {
  width: 181px;
  background-color: #6186a2;
  border-radius: 50px;
  color: #fff;
  font-feature-settings: "palt";
  font-size: 1.8rem;
  line-height: 1;
  margin: 22px auto 0;
  padding: 12px 0;
}

.type__text {
  width: fit-content;
  font-feature-settings: "palt";
  font-size: 2.8rem;
  line-height: 1;
  margin: 29px auto 0;
  position: relative;
}

.type__text::before,
.type__text::after {
  content: "";
  width: 35px;
  height: 9px;
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

.type__text::before {
  left: -47px;
}

.type__text::after {
  right: -47px;
}

.fragrance-detail__text {
  font-feature-settings: "palt";
  font-size: 1.8rem;
  line-height: 1.4;
  margin-top: 17px;
}

.fragrance-detail__btn {
  width: 210px;
  margin: 20px auto 0;
  position: relative;
}

.fragrance-detail__btn::after {
  content: "";
  width: 6px;
  height: 6px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.fragrance-detail__btn a {
  display: inline-block;
  color: #fff;
  font-feature-settings: "palt";
  font-size: 1.6rem;
  line-height: 1;
  padding: 20px 0 20px;
}

.fragrance__obj {
  z-index: 50;
}

.fra__line {
  width: 326px;
  line-height: 1;
  margin: 29px auto 0;
}

/* ホワイトティー */
.fragrance__btn--wt {
  width: 229px;
  background-color: #dcedd9;
  top: 56px;
  left: 128px;
}

.fragrance-type__btn-text--wt {
  color: #509072;
}

.fragrance-name__title--wt,
.type__text--wt {
  color: #39927c;
}

.type__text--wt::before {
  background-image: url(../../images/gift/20260416/obj_title_wt_l.svg);
}

.type__text--wt::after {
  background-image: url(../../images/gift/20260416/obj_title_wt_r.svg);
}

.fragrance-detail__btn--wt {
  background-color: #8dc184;
}

.wt__obj--l {
  width: 132px;
  top: -37px;
  left: -22px;
}

.wt__obj--r {
  width: 76px;
  bottom: 17px;
  right: -32px;
}

/* ジャスミン */
.fragrance__btn--dj {
  width: 223px;
  background-color: #daecf2;
  top: 56px;
  right: 164px;
}

.fragrance-type__btn-text--dj {
  color: #4199b7;
}

.fragrance-name__title--dj,
.type__text--dj {
  color: #44b7b4;
}

.type__text--dj::before {
  background-image: url(../../images/gift/20260416/obj_title_dj_l.svg);
}

.type__text--dj::after {
  background-image: url(../../images/gift/20260416/obj_title_dj_r.svg);
}

.fragrance-detail__btn--dj {
  background-color: #86bdcf;
}

.dj__obj--l {
  width: 132px;
  top: -12px;
  left: -52px;
}

.dj__obj--r {
  width: 134px;
  bottom: 42px;
  right: -65px;
}

/* グリーン・ローズ */
.fragrance__btn--gr {
  width: 214px;
  background-color: #ffdce5;
  top: 137px;
  left: 137px;
}

.fragrance-type__btn-text--gr {
  color: #eb6487;
}

.fragrance-name__title--gr,
.type__text--gr {
  color: #ef4e78;
}

.type__text--gr::before {
  background-image: url(../../images/gift/20260416/obj_title_gr_l.svg);
}

.type__text--gr::after {
  background-image: url(../../images/gift/20260416/obj_title_gr_r.svg);
}

.fragrance-detail__btn--gr {
  background-color: #f4a3b8;
}

.gr__obj--l {
  width: 118px;
  top: -20px;
  left: -40px;
}

.gr__obj--r {
  width: 114px;
  right: -48px;
  bottom: 30px;
}

/* パチュリ・ラベンダー・バニラ */
.fragrance__btn--plv {
  width: 211px;
  background-color: #ede3f7;
  bottom: 108px;
  left: 140px;
}

.fragrance-type__btn-text--plv {
  color: #8958ba;
}

.fragrance-name__title--plv,
.type__text--plv {
  color: #865498;
}

.type__text--plv::before {
  background-image: url(../../images/gift/20260416/obj_title_plv_l.svg);
}

.type__text--plv::after {
  background-image: url(../../images/gift/20260416/obj_title_plv_r.svg);
}

.fragrance-detail__btn--plv {
  background-color: #bf9ecc;
}

.plv__obj--l {
  width: 225px;
  top: -20px;
  left: -110px;
}

.plv__obj--r {
  width: 133px;
  right: -53px;
  bottom: 56px;
}

/* ローズ・ティー */
.fragrance__btn--rt {
  width: 191px;
  background-color: #f7d2ca;
  bottom: 122px;
  right: 178px;
}

.fragrance-type__btn-text--rt {
  color: #e65536;
}

.fragrance-name__title--rt,
.type__text--rt {
  color: #dc5656;
}

.type__text--rt::before {
  background-image: url(../../images/gift/20260416/obj_title_rt_l.svg);
}

.type__text--rt::after {
  background-image: url(../../images/gift/20260416/obj_title_rt_r.svg);
}

.fragrance-detail__btn--rt {
  background-color: #f09898;
}

.rt__obj--l {
  width: 151px;
  top: -20px;
  left: -40px;
}

.rt__obj--r {
  width: 132px;
  right: -48px;
  bottom: 30px;
}

/* TOKYO */
.fragrance__btn--tk {
  width: 189px;
  background-color: #ffdcf4;
  top: 137px;
  right: 181px;
}

.fragrance-type__btn-text--tk {
  color: #e366dc;
}

.fragrance-name__title--tk,
.type__text--tk {
  color: #ef4292;
}

.type__text--tk::before {
  background-image: url(../../images/gift/20260416/obj_title_tk_l.svg);
}

.type__text--tk::after {
  background-image: url(../../images/gift/20260416/obj_title_tk_r.svg);
}

.fragrance-detail__btn--tk {
  background-color: #f098d2;
}

.tk__obj--l {
  width: 113px;
  top: -20px;
  left: -40px;
}

.tk__obj--r {
  width: 111px;
  right: -35px;
  bottom: 30px;
}

/* =======================
          story
======================= */
.story {
  background-image: url(../../images/special_contents/ShowerOil/20260423/bg_story.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.story__inner {
  padding: 106px 0 72px;
}

.name__label {
  width: 396px;
  margin: 34px auto 0;
}

.rb-text-list {
  width: auto;
  /* height: 100px; */
  /* height: 230px; */
  margin: 25px auto 0;
  line-height: 1.6;
  position: relative;
  overflow: hidden;
}

.story__sub-title {
  font-size: 2rem;
  line-height: 1;
  text-align: center;
  margin-top: 29px;
}

.story__text {
  width: 790px;
  font-feature-settings: "palt";
  font-size: 1.6rem;
  letter-spacing: 0.04em;
  line-height: 1.8;
  margin: 0 auto;
}

.reason-more-btn {
  display: block;

  position: absolute;
  bottom: 23px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  z-index: 20;
}

.reason-more-btn a {
  margin: 0;
  padding: 15px 0;
  text-align: center;
  color: #FFF;
  font-size: 16px;
  line-height: 1;
  text-decoration: none;
  position: relative;
  display: inline-block;
  background: #9c894d;
  width: 150px;
  cursor: pointer;
  box-sizing: border-box;
}

.reason-more-btn a:hover {
  opacity: 1;
}

.reason-more-btn a .icon {
  font-size: 26px;
  line-height: 1;
  font-style: normal;
  text-decoration: none;
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  font-weight: 400;
  display: inline-block;
}

.rb-text-list.open .reason-more-btn {
  display: none;
}

.reason-close-btn {
  display: none;
}

.rb-text-list .reason-close-btn {
  display: block;
  position: absolute;
  bottom: 25px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
}

.reason-close-btn a {
  color: #a18b4f;
  margin: 0;
  padding-left: 30px;
  text-align: center;
  font-size: 16px;
  line-height: 1;
  text-decoration: none;
  position: relative;
  display: inline-block;
  width: auto;
  cursor: pointer;
  box-sizing: border-box;
}

.reason-close-btn a .icon {
  color: #a18b4f;
  font-size: 20px;
  line-height: 1;
  font-style: normal;
  text-decoration: none;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  font-weight: 400;
  display: inline-block;
}

.reason-more-bg {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 0px;
  left: 0px;
  background-image: linear-gradient(to bottom,
      rgba(252, 246, 239, 0.2) 0%,
      rgba(252, 246, 239, 1) 100%);
}

.rb-text-list.open .reason-more-bg {
  display: none;
}

#rb1 {
  height: 124px;
  /* 初期状態 */
  overflow: hidden;
  transition: height 1.2s ease;
}

#rb1.open {
  height: 400px;
  /* PCのとき */
}

/* =======================
      How to Use
======================= */
.how-to-use {
  background: linear-gradient(to bottom,
      #b29b6a 0%,
      #e8d9bb 50%,
      #fcf6e8 100%);
}

.how-to-use__inner {
  padding: 88px 0 91px;
}

.how-to-use__title {
  color: #fff;
}

.how-to-use__sub-title {
  color: #fff;
  font-feature-settings: "palt";
  font-size: 2.6rem;
  letter-spacing: 0.04em;
  line-height: 1;
  text-align: center;
  margin-top: 16px;
}

.how-to-use-title__obj {
  margin-top: 29px;
}

.step__bg {
  position: absolute;
  z-index: 10;
}

.step__bg1 {
  top: -18px;
  left: 83px;
}

.step__bg2 {
  top: 0;
  left: -249px;
}

.step__bg3 {
  top: 0;
  left: 0;
}

.how-to-use__wrapper {
  width: 848px;
  margin: 52px auto 0;
  position: relative;
}

.step__title {
  width: 100%;
  background-color: #a88f58;
  color: #fff;
  font-feature-settings: "palt";
  font-size: 2rem;
  line-height: 1;
  padding: 8px 0 0 21px;
  position: relative;
  z-index: 50;
}

.step__title--num {
  font-size: 4rem;
}

.step__wrapper {
  display: flex;
  column-gap: 32px;
  justify-content: center;
  margin-top: 31px;
  position: relative;
  z-index: 50;
}

.step__wrapper2 {
  flex-direction: row-reverse;
}

.step__img {
  width: 237px;
  position: relative;
  z-index: 50;
}

.step-text__wrapper {
  position: relative;
  z-index: 50;
}

.step-text__wrapper2 {
  padding-top: 12px;
}

.step-text__wrapper3 {
  padding-top: 32px;
}

.step-main__title {
  font-feature-settings: "palt";
  font-size: 3.2rem;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1;
}

.step__text {
  font-feature-settings: "palt";
  font-size: 1.6rem;
  letter-spacing: 0.04em;
  line-height: 1.6;
  margin-top: 14px;
}

.step__text span {
  display: block;
  font-weight: bold;
  margin-top: 9px;
}

.line {
  width: 930px;
  line-height: 1;
  margin: 53px auto 0;
}

/* =======================
        Movie
======================= */
.movie__inner {
  padding: 44px 0 0;
}

.movie-title__obj {
  margin-top: 19px;
}

.youtube {
  display: block;
  width: 780px;
  height: 441px;
  margin: 34px auto 0;
}

/* =======================
        Campaign
======================= */
.campaign {
  background-image: url(../../images/special_contents/ShowerOil/20260423/bg_campaign.jpg);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.campaign__inner {
  padding: 79px 0 82px;
}

.campaign__detail-wrapper {
  width: 1050px;
  background-color: #fff;
  border-radius: 30px;
  filter: drop-shadow(0 0 17px rgba(178, 154, 88, 0.3));
  margin: 34px auto 0;
  padding: 38px 0 56px;
}

.campaign__label {
  width: 285px;
  margin: 0 auto;
}

.campaign__date {
  width: fit-content;
  color: #b29a58;
  font-size: 2.8rem;
  letter-spacing: 0.02em;
  line-height: 1;
  margin: 15px auto 0;
  position: relative;
}

.campaign__date::before,
.campaign__date::after {
  content: "";
  width: 22px;
  height: 40px;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

.campaign__date::before {
  background-image: url(../../images/special_contents/ShowerOil/20260423/obj_date_title_l.svg);
  left: -30px;
}

.campaign__date::after {
  background-image: url(../../images/special_contents/ShowerOil/20260423/obj_date_title_r.svg);
  right: -30px;
}

.campaign__date span {
  font-size: 2.1rem;
}

.campaign__contents {
  margin-top: 43px;
}

.campaign__detail {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 75px;
}

.campaign-text__s {
  font-size: 2rem;
  font-feature-settings: "palt";
  line-height: 1.5;
  text-align: center;
}

.campaign-text__l {
  font-size: 3.6rem;
  font-feature-settings: "palt";
  line-height: 1.1;
  margin-top: 10px;
  text-align: center;
}

.campaign-text__l span {
  font-size: 2.4rem;
}

.campaign__img {
  width: 194px;
  position: relative;
}

.comment {
  position: absolute;
  top: 6px;
  left: -110px;
}

.sc-accordion-more {
  border-bottom: none;
  padding-bottom: 0;
}

.sc-accordion__title {
  font-size: 1.6rem;
  text-align: center;
}

.sc-comment__list {
  text-align-last: left;
  padding: 25px 17px 30px 17px;
}

.sc-accordion__wrapper {
  width: 817px;
  margin: 27px auto 0;
}

.sc-accordion {
  display: block;
  border-top: 1px solid #9a8a5b;
  border-bottom: 1px solid #9a8a5b;
  letter-spacing: 0.04em;
  line-height: 1;
  text-align: center;
  padding: 11px 0;
  position: relative;
}

.sc-accordion-more {
  border-bottom: none;
  padding-bottom: 0;
}

.sc-accordion__title,
.sc-accordion-more__in {
  background-color: #fbf5e6;
}

.common-icon-minus {
  display: none;
}

.open .common-icon-plus {
  display: none;
}

.open .common-icon-minus {
  display: block;
}

.common-icon {
  font-size: 3rem;
  position: absolute;
  top: 52%;
  right: 3px;
  transform: translateY(-52%);
  -webkit-transform: translateY(-52%);
}

/* コレクションバナー */

.collection-banner {
   background-color: #f8f4ee;
}

.collection-banner__title {
  color: #9c8743;
}

/* TOPに戻るボタン */
.pagetop {
  margin: 0;
  padding: 0;
  position: fixed;
  bottom: 12px;
  left: 12px;
  z-index: 500;
  display: none;
}

.pagetop .pagetop-link {
  margin: 0;
  padding: 0;
  width: 62px;
}

.pagetop .pagetop-link a {
  margin: 0;
  padding: 35px 0px 0;
  width: 62px;
  height: 62px;
  box-sizing: border-box;
  border-radius: 50%;
  display: block;
  text-align: center;
  font-size: 1.3rem;
  line-height: 1;
  background-color: #000;
  color: #FFF;
  font-style: italic;
  font-weight: 600;
  background-image: url(../../images/sp/special_contents/FacePolisher/20230720/page_top2.svg);
  background-repeat: no-repeat;
  background-position: center top 16px;
  background-size: 19px auto;
  box-shadow: 0 0 12.1px 0.9px rgba(0, 0, 0, 0.15);
  text-decoration: none;
}