@charset "UTF-8";
.p-beauty-stepCare {
  width: 100%;
  border-collapse: separate;
  border-spacing: 3px 3px;
  overflow: hidden;
}

.p-beauty-stepCare_thead {
  background: #d3ddeb;
  overflow: hidden;
}

.p-beauty-stepCare_theadTh {
  height: 70px;
  vertical-align: middle;
  color: #072b4d;
  font-weight: 700;
  text-align: center;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1em;
  position: relative;
}

.p-beauty-stepCare_theadTh--ttl {
  width: 150px;
}

.p-beauty-stepCare_theadTh--step1 {
  width: auto;
}

.p-beauty-stepCare_theadTh--step2 {
  width: 300px;
}

.p-beauty-stepCare_theadTh--step3 {
  width: 300px;
}

.p-beauty-stepCare_theadTh--step1::after {
  content: " ";
  position: absolute;
  display: block;
  width: 1px;
  height: 1500px;
  background: #fff;
  top: 70px;
  right: 0;
  left: 0;
  margin: 0 auto;
  z-index: 2;
}

.p-beauty-stepCare_theadTxt {
  display: block;
}

.p-beauty-stepCare_nextTh {
  display: block;
  width: 50px;
  height: 70px;
  position: absolute;
  right: 0;
  top: 0;
  margin-right: -45px;
  overflow: hidden;
}

.p-beauty-stepCare_nextTh::after {
  content: " ";
  display: inline-block;
  width: 70px;
  height: 70px;
  position: absolute;
  background: #d3ddeb;
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
  top: 0;
  bottom: 0;
  left: -40px;
  margin: auto;
  -webkit-transform: scaleX(0.8) rotate(45deg);
  -ms-transform: scaleX(0.8) rotate(45deg);
  transform: scaleX(0.8) rotate(45deg);
}

.p-beauty-stepCare_ttl {
  position: relative;
  width: 150px;
  font-weight: 700;
  color: #fff;
  height: 93px;
  vertical-align: middle;
  text-align: center;
  background: #f5af71;
}

.p-beauty-stepCare_box {
  position: relative;
  vertical-align: middle;
  padding: 0;
  margin: 0;
}

.p-beauty-stepCare_inBox {
  position: relative;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.p-beauty-stepCare_inBoxL,
.p-beauty-stepCare_inBoxR {
  position: relative;
  width: 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  top: 0;
}

.p-beauty-stepCare_boxinTtl {
  display: block;
  background: #d3ddeb;
  width: 100%;
  color: #072b4d;
  font-weight: 700;
  text-align: center;
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 5px;
  position: absolute;
  top: 0;
  margin: 0;
  left: 0;
}

.p-beauty-stepCare_floatBox01 {
  position: absolute;
  border: 1px solid #fff;
  height: 638px;
  width: 95%;
  top: 0;
  left: 0;
  right: 0;
  margin: 30px auto 0;
  padding: 0;
  background: rgba(255, 255, 255, 0.8);
  z-index: 1;
}

.p-beauty-stepCare_floatBox02 {
  position: absolute;
  border: 1px solid #fff;
  height: 258px;
  width: 95%;
  top: 0;
  left: 0;
  right: 0;
  margin: 30px auto 0;
  padding: 0;
  background: rgba(255, 255, 255, 0.8);
  z-index: 1;
}

.p-beauty-stepCare_itemBox {
  width: 100%;
  padding: 0;
  text-align: center;
}

.p-beauty-stepCare_itemBox--float01-01 {
  margin-top: 42.53846%;
}

.p-beauty-stepCare_itemBox--float01-02 {
  margin-top: 61.53846%;
}

.p-beauty-stepCare_itemBox a {
  display: inline-block;
}

.p-beauty-stepCare_itemBox a:hover {
  opacity: 0.7;
}

.p-beauty-stepCare_itemBoxImg {
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  min-width: 115px;
}

.p-beauty-stepCare_itemBoxImg a {
  display: inline;
}

.p-beauty-stepCare_inBox .p-beauty-stepCare_itemBoxImg {
  min-width: 60px;
}

.p-beauty-stepCare_itemBoxName {
  display: inline-block;
  vertical-align: middle;
  text-align: left;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.4;
  text-decoration: underline;
  min-width: 150px;
}

.p-beauty-stepCare_itemBoxName a {
  text-decoration: underline;
  line-height: 1.4;
}

.p-beauty-stepCare_itemBoxName a:hover {
  text-decoration: none;
}

a:hover .p-beauty-stepCare_itemBoxName {
  text-decoration: none;
}

.p-beauty-stepCare_inBox .p-beauty-stepCare_itemBoxName {
  min-width: 100px;
}

.p-beauty-stepCare_itemBoxNameLink {
  padding-top: 0.8em;
  padding-bottom: 0.8em;
}

.p-beauty-stepCare_itemBoxNameLink + .p-beauty-stepCare_itemBoxNameLink {
  padding-top: 0;
}

.p-beauty-stepCare_tr--01 {
  background: #fff0e4;
}

.p-beauty-stepCare_tr--01 .p-beauty-stepCare_ttl {
  min-height: 109px;
}

.p-beauty-stepCare_tr--01 .p-beauty-stepCare_inBox {
  vertical-align: top;
}

.p-beauty-stepCare_tr--01 .p-beauty-stepCare_inBoxL,
.p-beauty-stepCare_tr--01 .p-beauty-stepCare_inBoxR {
  vertical-align: top;
  min-height: 109px;
}

.p-beauty-stepCare_tr--02 {
  background: #e2f1fa;
}

.p-beauty-stepCare_tr--02 .p-beauty-stepCare_ttl {
  background: #77add4;
}

.p-beauty-stepCare_tr--03 {
  background: #e5e1ed;
}

.p-beauty-stepCare_tr--03 .p-beauty-stepCare_ttl {
  background: #8a81a3;
}

.p-beauty-stepCare_tr--04 {
  background: #ecf5db;
}

.p-beauty-stepCare_tr--04 .p-beauty-stepCare_ttl {
  background: #7dad91;
}

.p-beauty-stepCare_tr--05 {
  background: #f1fcf9;
}

.p-beauty-stepCare_tr--05 .p-beauty-stepCare_ttl {
  background: #75bdb9;
}

.p-beauty-stepCare_tr--06 {
  background: #feedf5;
}

.p-beauty-stepCare_tr--06 .p-beauty-stepCare_ttl {
  background: #d694ac;
}

/* 201906定期 PICK UP おすすめ商品 */
.p-pickUpDate {
  display: inline-block;
  border: 1px solid #e60000;
  color: #da012c;
  text-align: center;
  font-size: 12px;
  line-height: 1.4;
  padding-top: 3px;
  width: 64px;
  height: 24px;
  vertical-align: middle;
  margin-left: 14px;
}

.p-listPickUp {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* 202004定期 ピュアモイスト泡洗顔料 追加＆バナーサイズ、レイアウト変更 */
.flex-nowrap {
  flex-wrap: nowrap !important;
}

.p-beauty-stepCare_itemBox--float02-01,
.p-beauty-stepCare_itemBox--float02-02,
.p-beauty-stepCare_itemBox--float02-03 {
  margin-top: 35px;
}

.p-beauty-stepCare_ttl.height-adjust {
  height: 170px;
}

.p-beauty-stepCare_floatBox02 {
  height: 446px;
}

@media screen and (max-width: 1117px) {
  .p-beauty-stepCare_itemBox--float02-01,
  .p-beauty-stepCare_itemBox--float02-02,
  .p-beauty-stepCare_itemBox--float02-03,
  .p-beauty-stepCare_itemBox--float02-04 {
    margin-top: 10px;
  }
}
/* 20200806 【ビューティブーケ・8/7】DB0・BBクリームページ・化粧品トップ */
.date_red_right {
  font-size: 19px;
  color: #da0026;
}

/* 20200915_【定期】化粧品トップ */
.l-grid--PCcell3-M .m-pageItemBlock_linkBlock--list {
  display: flex;
  justify-content: space-around;
}

/* 210316_【定期】化粧品トップ */
.topContents-area {
  margin-bottom: 60px !important;
}

.topContents-area ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 -27px 0 0;
}

.topContents-area ul li {
  width: 100%;
  margin: 0 27px 0 0;
}

.topContents-area ul li img {
  width: 100%;
  border: solid 1px #e6e5e5;
}

.m-btn01--icoNext .m-btn01_item.arrow_r::after {
  right: -10px;
}

/* 2107 バナーレイアウト変更 （2カラム） */
.bnr_area {
  width: 1160px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin: 32px auto 0;
}

.bnr_area li {
  width: 550px;
}

.bnr_area li:nth-of-type(n+3) {
  margin-top: 18px;
}

.bnr_area li img {
  width: 100%;
}

.campaign-area .item_area li .icon:nth-of-type(n+2) {
  margin-left: 5px;
}

.m-pageKv_imgBox {
  margin-bottom: 60px;
  min-height: 0px;
}

/* 【ビューティブーケ】10/7：化粧品TOP */
.brandIntroduction-area .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.brandIntroduction-area .flex .flex_li {
  width: 50%;
}

.brandIntroduction-area .flex .flex_li:first-child {
  margin-right: 1.3%;
}

.brandIntroduction-area .flex .flex_li img {
  width: 100%;
}

.brandIntroduction-area .m-pageItemBlock_linkBlock--side .m-pageItemBlock_link {
  padding: 0;
}

/* 2111_化粧品トップ改修 */
.Kodawari_Box {
  max-width: 1200px;
  min-width: 970px;
}

.Kodawari_Box img {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.Kodawari_Box .Kodawari_BoxInner .m-btn01_item,
.m-ttlBlock .btn_container .btn_containerInner .m-btn01_item {
  font-size: 0.975rem;
  letter-spacing: 1.42px;
}

.Kodawari_Box .Kodawari_BoxInner .m-btn01_item span,
.m-ttlBlock .btn_container .btn_containerInner .m-btn01_item span {
  vertical-align: -2px;
}

.m-ttlBlock .btn_container {
  position: relative;
}

.m-ttlBlock .btn_container .btn_containerInner {
  position: absolute;
  right: 0px;
  bottom: 10px;
}

.Kodawari_Box .Kodawari_BoxInner .m-btn01_item:hover {
  opacity: 1;
}

.Kodawari_Box a .Kodawari_BoxInner:hover {
  opacity: 0.7;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .Kodawari_Box .Kodawari_BoxInner {
    position: relative;
  }
}
.Beauty_3collumn ul.l-grid.Selling_make ul.m-pageItemBlock_linkBlock--side li.m-pageItemBlock_link {
  padding: 0px;
}

.Beauty_3collumn ul.l-grid.Selling_make ul.m-pageItemBlock_linkBlock--side li.m-pageItemBlock_link:first-child {
  padding-right: 1em;
}

#onayami {
  margin-top: -150px;
  padding-top: 150px;
}

/* お悩みから商品を探す */
.p-beautyborder--item {
  border: 1px solid #abb0b5;
  border-radius: 10px;
}

.p-beautyitemBlock_ttl {
  background-color: #f3f4f5;
  border-radius: 10px 10px 0 0;
  padding: 0 10px;
}

.p-beautyitemBlock--border li {
  border-bottom: 1px solid #dcdee0;
  padding: 0;
}

.p-beautyitemBlock_cont {
  padding: 20px 23px;
}

.p-beautyitemBlock_cont_link {
  position: relative;
  height: 50px;
  color: #000;
  display: table;
  padding: 8px 0;
}

.p-beautyitemBlock_cont_link div.itemtxt {
  display: table-cell;
  vertical-align: middle;
  width: 235px;
  padding-right: 5px;
  line-height: 1.5;
}

.p-beautyitemBlock_cont_link div.itemImage {
  width: 50px;
}

.p-beautyitemBlock_cont_link div.itemImage img {
  width: 100%;
}

.p-beautyitemBlock_cont_link:hover {
  background-image: -webkit-linear-gradient(left, #fff 0, #fff 20%, #eaeaea 100%);
  background-image: linear-gradient(90deg, #fff 0, #fff 20%, #eaeaea 100%);
}

.p-beautyitemBlock_cont_link:after {
  position: absolute;
  content: " ";
  display: inline-block;
  margin: auto 0 auto 5px;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-right: 0 solid transparent;
  border-left: 5px solid #000;
  right: 10px;
  top: 0;
  bottom: 0;
}

.p-beautyspaceBlock--sb {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

@media screen and (max-width: 1220px) {
  .m-ttlBlock .btn_container .btn_containerInner {
    right: 10px;
  }
}
@media screen and (max-width: 1090px) {
  .Beauty_3collumn ul.l-grid.Selling_make ul.m-pageItemBlock_linkBlock--side li.m-pageItemBlock_link {
    margin: 0px;
    padding-top: 10px;
  }
  .Beauty_3collumn ul.l-grid.Selling_make ul.m-pageItemBlock_linkBlock--side li.m-pageItemBlock_link:first-child {
    padding-right: 0em;
  }
}
@media screen and (max-width: 1000px) {
  .m-ttlBlock .btn_container .btn_containerInner {
    right: 0px;
  }
}
/* 220128_【月末】化粧品トップ_ランキング追加 */
.topRanking-areaContainer {
  background: #f5f5f5;
}

@media screen and (min-width: 1001px) {
  .topRanking-areaContainer {
    margin: 0 calc((100% - 100vw) / 2);
  }
}
@media screen and (max-width: 1000px) {
  .topRanking-areaContainer {
    margin: 0 -10px;
    padding: 0 10px;
  }
}
.topRanking-area {
  padding: 45px 0;
  margin: 0 auto 60px;
}

@media screen and (min-width: 1220px) {
  .topRanking-area {
    width: 1200px;
  }
}
.topRanking-area ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: flex-start;
  width: 1200px;
  margin: auto;
}

.topRanking-area ul:first-of-type {
  margin-bottom: 44px;
}

.topRanking-area ul li {
  width: 382px;
  margin: 0 27px 0 0;
}

.topRanking-area ul li .icon img {
  width: 36px;
  margin-bottom: 8px;
}

.topRanking-area ul li #rto_rank_beauty_pc01_1,
.topRanking-area ul li #rto_rank_beauty_pc01_2,
.topRanking-area ul li #rto_rank_beauty_pc01_3,
.topRanking-area ul li #rto_rank_beauty_pc01_4,
.topRanking-area ul li #rto_rank_beauty_pc01_5,
.topRanking-area ul li #rto_rank_beauty_pc01_6 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.topRanking-area ul li .rankBox .ph img {
  width: 160px;
}

@media screen and (max-width: 768px) {
  .topRanking-area ul li .rankBox .ph img {
    min-width: 160px;
  }
}
.topRanking-area ul li .rankBox .spec {
  position: relative;
  margin-left: 10px;
  height: max-content;
  min-width: 203px;
}

.topRanking-area ul li .rankBox .spec .text {
  font-size: 14px;
}

.topRanking-area ul li .rankBox .spec .itemName {
  margin-top: 13px;
}

.topRanking-area ul li .rankBox .spec .review {
  margin-top: 17px;
  font-size: 14px;
  color: #989898;
}

.topRanking-area ul li .rankBox .spec .review img {
  display: block;
}

.topRanking-area ul li .rankBox .spec .review span {
  display: none;
}

.topRanking-area ul li .rankBox .spec .revCnt {
  position: absolute;
  bottom: -2%;
  left: 40%;
  font-size: 14px;
}

.topRanking-area .linkBox .m-btn01_item {
  font-size: 0.975rem;
  letter-spacing: 1.42px;
}

.topRanking-area .linkBox .m-btn01_item span {
  vertical-align: -2px;
}

.topRanking-area .m-caption {
  margin-top: 20px;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .topRanking-area ul li .rankBox .spec {
    min-height: calc(160px + 4ex);
  }
  .topRanking-area ul li .rankBox .spec .review {
    position: absolute;
    bottom: 0%;
  }
}
/*2206定期_肌悩みに合わせた3ステップ＋スペシャルケアから商品を選ぶ_修正*/
@media screen and (min-width: 1135px) {
  .p-beauty-stepCare_itemBox--float02-04,
  .p-beauty-stepCare_itemBox--float02-05 {
    margin-top: 10px;
  }
}
@media screen and (max-width: 1134px) {
  .p-beauty-stepCare_tr--01 th.p-beauty-stepCare_ttl.height-adjust,
  .p-beauty-stepCare_tr--02 th.p-beauty-stepCare_ttl.height-adjust,
  .p-beauty-stepCare_tr--03 th.p-beauty-stepCare_ttl.height-adjust {
    height: 220px;
  }
  .p-beauty-stepCare_floatBox01 {
    height: 762px;
  }
  .p-beauty-stepCare_floatBox02 {
    height: 570px;
  }
}
@media screen and (max-width: 1117px) {
  .p-beauty-stepCare_tr--01 th.p-beauty-stepCare_ttl.height-adjust,
  .p-beauty-stepCare_tr--02 th.p-beauty-stepCare_ttl.height-adjust,
  .p-beauty-stepCare_tr--03 th.p-beauty-stepCare_ttl.height-adjust {
    height: 190px;
  }
  .p-beauty-stepCare_floatBox01 {
    height: 714px;
  }
  .p-beauty-stepCare_floatBox02 {
    height: 495px;
  }
}
/* 220608 ベスコス受賞対応 バナー */
.bestcosme_Box {
  margin-bottom: 30px;
  width: 1200px;
}

.bestcosme_imgBox {
  min-height: 236px;
  width: 1200px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.bestcosme_Box .bestcosme_micle,
.bestcosme_Box .bestcosme_micle img {
  width: 670px;
}

.bestcosme_Box .bestcosme_signs,
.bestcosme_Box .bestcosme_signs img {
  width: 530px;
}

.h3.osusume {
  margin: 0 0 20px;
  padding: 10px 16px 9px;
  color: #072b4d;
  font-weight: bold;
  background-color: #eff0f4;
}

/* 2207定期_キャンペーン・新商品情報 2段対応 */
.campaign-area.cosme_camp ul.item_area li:nth-of-type(n+5) {
  margin-top: 10px;
}

/* 220629 バナーエリア センター寄せ対応 */
.bnr_area.center {
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.m-pageKv {
  position: relative;
  margin-bottom: 60px;
}

.m-pageKv_imgBox img {
  display: block;
  width: 100%;
}

.m-ttl04--icoPicup::before {
  width: 28px;
  height: 28px;
  background: transparent url(/common/img2/ico/ico_picup.png) no-repeat center 50%;
  background-size: contain;
}

.m-ttl04--icoHowto::before {
  width: 28px;
  height: 28px;
  background: transparent url(/common/img2/ico/ico_howto.png) no-repeat center 50%;
  background-size: contain;
}

.m-ttl04--icoNaturalSkin::before {
  width: 28px;
  height: 28px;
  background: transparent url(/common/img2/ico/ico_natural_skin.png) no-repeat center 50%;
  background-size: contain;
}

.m-ttl04--icoNaturalMake::before {
  width: 28px;
  height: 28px;
  background: transparent url(/common/img2/ico/ico_natural_make.png) no-repeat center 50%;
  background-size: contain;
}

.m-ttl04--icoHaircare::before {
  width: 28px;
  height: 28px;
  background: transparent url(/common/img2/ico/ico_haircare.png) no-repeat center 50%;
  background-size: contain;
}

.m-ttl04--icoCare3stepSP::before {
  width: 28px;
  height: 28px;
  background: transparent url(/common/img2/ico/ico_care_3step_sp.png) no-repeat center 50%;
  background-size: contain;
}

.m-ttl04--icoWorries::before {
  background: transparent url(/common/img2/ico/ico_worries.png) no-repeat center 50%;
  background-size: contain;
}

.l-grid--PCcell3-L > .l-grid_cell:nth-child(3n+1) {
  clear: both;
  margin-left: 0;
}

.l-grid--PCcell3-L > .l-grid_cell {
  width: 33.33333%;
  width: calc(33.3% - 26.7px);
  margin-left: 40px;
  margin-bottom: 40px;
}

.m-pageColumnBlock {
  zoom: 1;
  width: 100%;
  max-width: 380px;
}

.m-pageColumnBlock_imgBox {
  float: left;
  display: inline-block;
  width: 80px;
  margin-right: 10px;
}

.m-pageColumnBlock_txtBox {
  overflow: hidden;
  line-height: 1.6;
}

.m-pageColumnBlock_txt01 {
  font-size: 16px;
  font-size: 1rem;
  font-weight: 700;
  text-decoration: underline;
  color: #000;
}

.m-pageColumnBlock_txt02 {
  margin-top: 0.2em;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.2;
  color: #000;
}

.m-pageItemBlock_linkBlock--side {
  zoom: 1;
  text-align: center;
}

.m-pageItemBlock_linkBlock--side:after,
.m-pageItemBlock_linkBlock--side:before {
  display: block;
  height: 0;
  visibility: hidden;
  content: " ";
}

.m-pageItemBlock_linkBlock--side .m-pageItemBlock_link {
  margin: 10px 0;
  text-align: center;
  padding: 0 1em;
  display: inline-block;
}

.l-grid--PCcell2-M > .l-grid_cell:nth-child(2n+1),
.l-grid--PCcell2-M > .l-grid_cell:nth-child(3n) {
  clear: both;
  margin-left: 0;
  margin-right: 0;
}

.l-grid--PCcell2-M > .l-grid_cell {
  width: 50%;
  width: calc(33% - 15px);
  margin-left: 30px;
  margin-right: 30px;
  margin-bottom: 30px;
}

.m-pageItemBlock_imgBox {
  width: 100%;
}

.m-pageItemBlock_imgBox img {
  display: block;
  width: 100%;
}

a .m-pageItemBlock_imgBox:hover {
  opacity: 0.7;
}

.l-grid--PCcell4-M > .l-grid_cell:nth-child(4n+1) {
  clear: both;
  margin-left: 0;
}

.l-grid--PCcell4-M > .l-grid_cell {
  width: 25%;
  width: calc(25% - 22.5px);
  margin-left: 30px;
  margin-bottom: 30px;
}

.m-pageItemBlock_linkBlock--list .m-pageItemBlock_link {
  text-align: center;
  padding: 10px 0 0;
}

.l-grid--PCcell3-M > .l-grid_cell:nth-child(3n+1) {
  clear: both;
  margin-left: 0;
}

.l-grid--PCcell3-M > .l-grid_cell {
  width: 33.33333%;
  width: calc(33.3% - 20px);
  margin-left: 30px;
  margin-bottom: 30px;
}

.m-ttlBlock_linkBox {
  vertical-align: middle;
  margin-left: auto;
  margin-right: 0;
  right: 0;
}

.m-ttlBlock_linkBox {
  vertical-align: middle;
  margin-left: auto;
  margin-right: 0;
  right: 0;
}

.m-icoTag02 {
  display: inline-block;
  background: #f4627c;
  color: #fff;
  font-weight: 700;
  line-height: 1;
  padding: 0.5em 1em;
  border-radius: 1em;
}

.m-icoTag02--colorB {
  background: #072b4d;
}

.mb25 {
  margin-bottom: 25px !important;
}

.Kodawari_Box {
  position: relative;
  margin-bottom: 60px;
}

.Kodawari_imgBox {
  position: relative;
  min-height: 236px;
}

.Kodawari_linkBox {
  position: absolute;
  top: 0;
  left: 0;
  margin-left: 4.16667%;
  margin-top: 14.5%;
}

/* 221115 バナーエリア */
.bnr_area li:nth-of-type(n+3) {
  margin-top: 40px;
}

/*-----------------------------------
2212月末_FANCL CLIP ランキング
-----------------------------------------*/
.m-ttl04--icoClip::before {
  width: 28px;
  height: 28px;
  background: transparent url(/beauty/img/clip/icon_clip.png) no-repeat center 50%;
  background-size: contain;
}

.fanclClip-RankingArea .m-ttl04.m-ttl04--icoClip {
  padding-bottom: 28px;
}

.fanclClip-RankingArea {
  margin-bottom: 60px;
}

.fanclClip-RankingArea .place ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 -30px 40px 0;
  width: 1200px;
}

.fanclClip-RankingArea .place ul li {
  width: 100%;
  margin: 0 15px 0 0;
}

.fanclClip-RankingArea .place ul li .icon img {
  width: 36px;
  margin-bottom: 8px;
}

.fanclClip-RankingArea .place ul li:nth-of-type(3n) {
  margin: 0;
}

.fanclClip-RankingArea .place ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  background: #fff;
  width: 100%;
}

.fanclClip-RankingArea .place ul li a::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 4px;
  right: 4px;
  z-index: -1;
  -moz-box-shadow: 0px 0px 7px 6px rgba(243, 243, 243, 0.8);
  -webkit-box-shadow: 0px 0px 7px 6px rgba(243, 243, 243, 0.8);
  -ms-box-shadow: 0px 0px 7px 6px rgba(243, 243, 243, 0.8);
  box-shadow: 0px 0px 7px 6px rgba(243, 243, 243, 0.8);
}

.fanclClip-RankingArea .place ul li a .imgBox {
  width: 45%;
}

.fanclClip-RankingArea .place ul li a .imgBox img {
  width: 100%;
}

.fanclClip-RankingArea .place ul li a .txtBox {
  width: 55%;
  padding: 20px 15px 0 20px;
}

.fanclClip-RankingArea .place ul li a .txtBox h4,
.fanclClip-RankingArea .place ul li a .txtBox span.info {
  font-size: 16px;
  color: #000;
  line-height: 22px;
}

.fanclClip-RankingArea ul li:hover {
  opacity: 0.7;
}

.fanclClip-RankingArea .linkBox .m-btn01_item {
  font-size: 0.975rem;
  letter-spacing: 1.42px;
}

/* 2212月末_バナーの外枠 */
ul.bnr_area li.border img {
  border: 1px solid #a6a4a5;
}

/* 2303定期 ブライトニングRN */
.m-pageItemBlock_imgBox.renweal {
  height: 307px;
  padding: 40px 25px;
  border: 1px solid #a6a4a5;
}

.m-pageItemBlock_imgBox.renweal a {
  text-decoration: underline;
}

.m-pageItemBlock_imgBox.renweal .red_txt {
  color: #da0026;
}

.m-pageItemBlock_imgBox.renweal .ttl {
  margin: 0 0 30px;
  font-size: 20px;
  font-weight: bold;
}

.m-pageItemBlock_imgBox.renweal ul li + li {
  margin: 20px 0 0;
}

/* 2304月末 商品の選び方 バナー追加 */
.topHowto-area {
  margin-bottom: 38px !important;
}

.topHowto-area ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 -27px 0 0;
}

.topHowto-area ul li {
  width: 100%;
  margin: 0 27px 0 0;
}

.topHowto-area ul li img {
  width: 100%;
  border: solid 1px #e6e5e5;
}

/* 240731_【月末】化粧品トップ改修 */
.BnrSlide li.slick-slide {
  width: calc(100% - 10px);
}

ul.BnrSlide.slick-initialized.slick-slider.slick-dotted button.slick-next.slick-arrow {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  top: 50%;
  right: 1%;
  background: #8d9298;
  opacity: 0.8;
  z-index: 20;
}

ul.BnrSlide.slick-initialized.slick-slider.slick-dotted button.slick-prev.slick-arrow {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  top: 50%;
  left: 1%;
  background: #8d9298;
  opacity: 0.8;
  padding-left: 7px;
  z-index: 20;
}

.topHowto-area ul.BnrSlide li::before {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.topHowto-area ul.BnrSlide .slick-dots li {
  width: auto;
}

.topHowto-area ul.BnrSlide li {
  margin: 0 3px;
}

/* 230911_【定期】化粧品トップ改修 */
.l-main h1 {
  width: 1200px;
  margin: 15px auto 30px;
}

.mainvisual_area .slider {
  margin: 0 auto 60px;
}

.mainvisual_area .slick-dots li button:hover:before {
  color: #000;
  opacity: 0.75;
}

.mainvisual_area .slick-slide img {
  width: 938px;
  height: auto;
  margin: 0 auto 28px;
  opacity: 0.5;
}

.mainvisual_area .slick-active img {
  opacity: 1;
  box-shadow: 0px 3px 4px 0px #d6d2cf;
}

.mainvisual_area .slick-dots li button:before {
  width: 17px;
  height: 17px;
  border-radius: 50%;
}

.mainvisual_area .slick-dots li button {
  width: 17px;
  height: 17px;
}

.mainvisual_area .slick-prev,
.mainvisual_area .slick-prev:focus,
.mainvisual_area .slick-prev:hover {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  top: 250px;
  left: calc(50% - 568px);
  background: #8d9298;
  opacity: 1;
  padding-left: 7px;
}

.mainvisual_area .slick-prev:before {
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  opacity: 1;
}

.mainvisual_area .slick-next,
.mainvisual_area .slick-next:focus,
.mainvisual_area .slick-next:hover {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  top: 250px;
  right: calc(50% - 568px);
  background: #8d9298;
  opacity: 1;
}

.mainvisual_area .slick-next:before {
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  opacity: 1;
}

.mainvisual_area .slick-dots li {
  width: 17px;
  margin: 0 25px;
}

.bnr_area {
  max-width: 950px;
  margin: 0 auto;
  padding-top: 20px;
}

.bnr_area img {
  width: 100%;
}

.footer_bnr ul {
  display: flex;
  justify-content: space-between;
}

.catalog li {
  height: 190px;
  width: auto;
}

.catalog .m-pageContact_itemCont1 {
  padding: 0px;
}

.catalog .m-pageContact_itemCont1 ul {
  justify-content: flex-start;
}

.catalog .m-pageContact_itemCont1 li:nth-child(1) {
  padding: 25px 15px 0 30px;
}

.catalog .m-pageContact_itemCont1 li:nth-child(2),
.catalog .m-pageContact_itemCont1 li:nth-child(3) {
  padding: 25px 15px 0 0;
}

.catalog .m-pageContact_itemCont1 li:nth-child(4) {
  padding: 25px 30px 0 0px;
}

.catalog .m-pageContact_itemCont2_txt {
  width: 286px;
  padding: 66px 30px 0 0;
}

.catalog .m-pageContact_itemCont3_btn {
  padding-top: 70px;
}

.catalog .m-pageContact_itemTtl {
  width: 245px;
}

.catalog .m-pageContact_Cont {
  width: 100%;
}

.catalog .m-pageContact-spaceBlock--sb {
  justify-content: flex-start;
}

.phone_store {
  display: flex;
}

.phone_store .m-pageContact_itemCont2_btn img {
  width: 84%;
  padding-left: 51px;
  padding-bottom: 10px;
}

.m-pageContact_itemCont1_qr {
  width: 95px;
}

.phone_store .m-pageContact_itemCont1_tx {
  margin-top: 10px;
}

.phone_store .m-pageContact_itemCont1 {
  display: flex;
}

.phone_store .m-pageContact-spaceBlock--sb {
  padding: 0 20px 0 36px;
}

.m-pageContact_itemCont1_image img {
  width: 100px;
}

.m-pageContact {
  margin-top: 70px;
}

/*タブ切替メニュー*/
.tabs {
  margin-top: 50px;
  margin-bottom: 50px;
  background-color: #fff;
}

.tab-warp {
  width: 100%;
  border: 1px solid #abb0b5;
  border-radius: 5px;
  clear: both;
  padding: 20px;
  box-sizing: border-box;
}

/*タブ切替メニュー：タブのスタイル*/
.tab_item {
  width: calc(33.3333333333% - 40px);
  height: 50px;
  line-height: 50px;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  color: #000000;
  display: block;
  float: left;
  text-align: center;
  transition: all 0.2s ease;
  border: 1px solid #abb0b5;
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  background-color: #ffffff;
  cursor: pointer;
  margin: 0 20px 0 20px;
}

.tab_item:hover {
  opacity: 0.5;
}

/*タブ切替メニュー：ラジオボタンを全て消す*/
input[name=tab_item] {
  display: none;
}

/*タブ切替メニュー：タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 15px 15px 0 15px;
  clear: both;
  overflow: hidden;
}

.tab_content h3 {
  font-weight: bord;
  color: #000000;
  border-bottom: 1px solid #cccccc;
  margin-bottom: 10px;
  margin-top: 20px;
  padding-bottom: 10px;
  font-size: 16px;
  font-weight: 700;
}

.tab_content ul {
  border: 0;
  margin: 0 0 15px 0;
  padding: 0;
  width: 100%;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
}

.tab_content ul:last-child {
  border-bottom: none;
}

.tab_content li {
  border-bottom: 1px dotted #abb0b5;
  padding: 0;
  margin: 0 20px 0 0;
  box-sizing: border-box;
  width: calc(25% - 15px);
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  position: relative;
}

.tab_content li:nth-child(4n) {
  border-right: none !important;
  margin: 0 0 0 0;
}

.tab_content a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  min-height: 70px;
  line-height: 1.5em;
  padding: 0 30px 0 0;
  margin: 0;
  box-sizing: border-box;
  color: #000000;
  position: relative;
}

.tab_content a:hover {
  background-image: -webkit-linear-gradient(left, #fff 0, #fff 20%, #eaeaea 100%);
  background-image: linear-gradient(90deg, #fff 0, #fff 20%, #eaeaea 100%);
}

.tab_content a::after {
  content: "";
  display: block;
  width: 5px;
  height: 0;
  border-style: solid;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 6px solid #000000;
  border-right: 0;
  margin-left: 10px;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}

.tab_content a > img {
  width: 50px;
  height: 50px;
  margin: 10px 5px 10px 0;
}

/*タブ切替メニュー：選択されているタブのコンテンツのみを表示*/
#item:checked ~ .tab-warp > #item_content,
#line:checked ~ .tab-warp > #line_content,
#worries:checked ~ .tab-warp > #worries_content {
  display: block;
}

/*タブ切替メニュー：選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #f3f4f5;
  color: #000000;
  border-radius: 10px 10px 0 0;
}

/* //タブ切替メニュー */
/* カタログ部分 */
.catalog li {
  height: 190px;
  width: auto;
  margin-bottom: 0;
}

.catalog .m-pageContact_itemCont1 {
  align-items: center;
  padding: 20px;
}

.catalog .m-pageContact_itemCont1 ul {
  justify-content: flex-start;
}

.catalog .m-pageContact_itemCont1 li:nth-child(1) {
  padding: 25px 15px 0 30px;
}

.catalog .m-pageContact_itemCont1 li:nth-child(2),
.catalog .m-pageContact_itemCont1 li:nth-child(3),
.catalog .m-pageContact_itemCont1 li:nth-child(4) {
  padding: 25px 15px 0 0;
}

.catalog .m-pageContact_itemCont2_txt {
  width: 286px;
  padding: 66px 30px 0 0;
}

.catalog .m-pageContact_itemCont3_btn {
  padding-top: 70px;
}

.catalog .m-pageContact_itemTtl {
  width: 245px;
}

.catalog .m-pageContact_Cont {
  width: 100%;
}

.catalog .m-pageContact-spaceBlock--sb {
  justify-content: flex-start;
  height: 190px;
  border-top: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
}

.m-pageContact_itemCont1_qr {
  width: 95px;
}

.m-pageContact_itemCont1_image img {
  width: 100px;
}

.m-pageContact {
  margin-top: 70px;
  background-color: #edeef0;
  padding: 30px 0;
}

/* 季節のオススメ */
#seasonalitems .m-ttl04_txt {
  padding-left: 20px;
}

#seasonalitems .m-ttl04::before {
  display: none;
}

#seasonalitems .seasonal-list {
  display: flex;
  width: calc(100% - 20px);
  margin: 0 auto 20px auto;
}

#seasonalitems .seasonal-item {
  width: 25%;
  padding: 20px;
  margin: 20px 20px 60px 20px;
  box-sizing: border-box;
  background-color: #fff;
  box-shadow: 0px 10px 15px -5px #cccccc;
  border-radius: 10px;
}

#seasonalitems .seasonal-item:hover {
  opacity: 0.6;
}

#seasonalitems .seasonal-item img {
  width: 100%;
  margin-bottom: 20px;
}

#seasonalitems .seasonal-item img:hover {
  opacity: 1;
}

#seasonalitems .seasonal-item p {
  font-size: 14px;
}

/* /季節のオススメ */
/* 2504月定期 化粧品トップ改修
-------------------------------------------------------------- */
/* 共通CSS上書き */
.m-pageContact.l-main {
  padding-top: 30px;
}

.m-pageTop.fixed {
  z-index: 100;
}

/* カスタムプロパティの設定 */
.page-beauty-top {
  --border-radius-sm: 0.75rem;
  --border-radius-md: 1.125rem;
  --border-radius-lg: 1.5rem;
}

/* ページタイトル */
.l-main {
  padding-top: 0.9375rem;
}
.l-main .page-title-banner {
  width: auto;
  max-width: 1260px;
  margin: 0.9375rem auto 1.875rem;
  padding: 0 1.875rem;
  text-align: center;
}
.l-main .page-title-banner img {
  width: 100%;
  height: auto;
}

/* メインビジュアル */
.mainvisual_area .slider {
  margin-bottom: 3.125rem;
  padding-bottom: 3.125rem;
}
.mainvisual_area .slick-list {
  overflow: visible;
}
.mainvisual_area .slick-slide img {
  margin-bottom: 0;
  border-radius: 1.875rem;
  box-shadow: 0px 3px 4px 0px #d6d2cf;
}
.mainvisual_area .slick-dots {
  bottom: 0;
  line-height: 1;
  font-size: 0;
}

/* MV下バナー */
.bnr_area {
  max-width: 900px;
}
.bnr_area img {
  width: 100%;
  height: auto;
}

/* レイアウト */
.l-contents {
  max-width: 1260px;
  margin-right: auto;
  margin-left: auto;
  padding-right: 1.875rem;
  padding-left: 1.875rem;
}

/* コンポーネント */
.c-btn-secondary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 20rem;
  line-height: 1.375;
  padding: 0.6875rem 0.8125rem;
  border: 2px solid #565453;
  border-radius: var(--border-radius-sm);
  color: #565453;
  background-color: #fff;
  font-weight: bold;
  font-size: 1.125rem;
  cursor: pointer;
  appearance: none;
  transition: color 0.3s ease, background-color 0.3s ease;
}
.c-btn-secondary:link, .c-btn-secondary:visited {
  color: #565453;
}

.c-btn-secondary:has(.arrow-right) {
  padding-right: 1.875rem;
  padding-left: 1.875rem;
}

.c-btn-secondary .arrow-right {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.125rem;
  width: 7.4px;
  height: 13.8px;
  margin: auto 0;
}

.c-btn-secondary .arrow-right::before,
.c-btn-secondary .arrow-right::after {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  right: 0;
  width: 10px;
  height: 2px;
  border-radius: 9999px;
  background-color: #565453;
  transform-origin: calc(100% - 1px) 50%;
  transition: background-color 0.3s ease;
}

.c-btn-secondary .arrow-right::before {
  transform: rotate(55deg);
}

.c-btn-secondary .arrow-right::after {
  transform: rotate(-55deg);
}

@media (any-hover: hover) {
  .c-btn-secondary:hover {
    color: #fff;
    background-color: #565453;
  }
  .c-btn-secondary:hover .arrow-right::before,
  .c-btn-secondary:hover .arrow-right::after {
    background-color: #fff;
  }
}
.c-btn-tertiary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.375;
  padding: 0;
  border: none;
  border-radius: 0;
  color: #565453;
  background-color: transparent;
  font-weight: bold;
  font-size: 1rem;
  cursor: pointer;
  appearance: none;
  transition: opacity 0.3s ease;
}
.c-btn-tertiary:link, .c-btn-tertiary:visited {
  color: #565453;
}

.c-btn-tertiary:has(.arrow-right) {
  padding-right: 1.625rem;
}

.c-btn-tertiary .arrow-right {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 7.4px;
  height: 13.8px;
  margin: auto 0;
}

.c-btn-tertiary .arrow-right::before,
.c-btn-tertiary .arrow-right::after {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  right: 0;
  width: 10px;
  height: 2px;
  border-radius: 9999px;
  background-color: #565453;
  transform-origin: calc(100% - 1px) 50%;
}

.c-btn-tertiary .arrow-right::before {
  transform: rotate(55deg);
}

.c-btn-tertiary .arrow-right::after {
  transform: rotate(-55deg);
}

@media (any-hover: hover) {
  .c-btn-tertiary:hover {
    opacity: 0.7;
  }
}
.c-anchor-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 100%;
  line-height: 1.2727272727;
  padding: 0.9375rem 3.125rem 0.9375rem 1.875rem;
  border: 1px solid #072b4d;
  border-radius: var(--border-radius-sm);
  color: #000;
  background-color: #fff;
  font-size: 1.375rem;
  cursor: pointer;
  appearance: none;
  transition: opacity 0.3s ease;
}
.c-anchor-link:link, .c-anchor-link:visited {
  color: #000;
}

.c-anchor-link::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.25rem;
  width: 1.5rem;
  height: 1.5rem;
  margin: auto 0;
  border-radius: 50%;
  background-color: #072b4d;
  transition: background-color 0.3s ease;
}

.c-anchor-link::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.6875rem;
  width: 0.4375rem;
  height: 0.4375rem;
  margin: auto 0;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg) translateY(-1.5px) translateX(-1.5px);
}

@media (any-hover: hover) {
  .c-anchor-link:hover {
    opacity: 0.7;
  }
}
.c-section {
  position: relative;
  margin-bottom: 5rem;
}

.c-ttl-section {
  line-height: 1.2727272727;
  margin: 0 0 2.5rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid #072b4d;
  color: #072b4d;
  font-weight: bold;
  font-size: 1.375rem;
  letter-spacing: 0.05em;
}
.c-ttl-section .c-ttl-section-catch {
  display: block;
  margin-bottom: 1rem;
  font-size: 1rem;
}
.c-ttl-section .c-ttl-section-catch .p-pickUpDate {
  margin-right: 0.625rem;
  margin-left: 0;
}
.c-ttl-section .p-pickUpDate {
  position: relative;
  top: -2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 4rem;
  height: auto;
  min-height: 1.5rem;
  padding: 0.125rem 0.125rem 0;
  letter-spacing: normal;
}

.c-ttl-sub-section {
  line-height: 1.3;
  margin: 0 0 1.375rem;
  color: #072b4d;
  font-weight: bold;
  font-size: 1.25rem;
}

.c-ttl-group {
  display: grid;
  align-items: end;
  grid-template-columns: 1fr auto;
  margin-bottom: 1.375rem;
  column-gap: 1.375rem;
}
.c-ttl-group:has(.c-ttl-sub-section) {
  padding-right: 1.375rem;
}
.c-ttl-group .c-ttl-sub-section {
  margin-bottom: 0;
}

.c-banner-list {
  display: flex;
  flex-wrap: wrap;
  row-gap: 1.875rem;
}
.c-banner-list a {
  transition: opacity 0.3s;
}
.c-banner-list img {
  width: 100%;
  height: auto;
  border-radius: var(--border-radius-lg);
}
.c-banner-list .c-banner-list-image img {
  height: 100%;
  object-fit: cover;
}
.c-banner-list .c-banner-list-name {
  line-height: 1.3333333333;
  margin-top: 1rem;
  color: #000;
  font-size: 1.125rem;
}
@media (any-hover: hover) {
  .c-banner-list a:hover {
    opacity: 0.5;
  }
}

.c-banner-list--typeA {
  column-gap: 2.5%;
}
.c-banner-list--typeA > li {
  width: 31.6666666667%;
}

.c-banner-list--typeB {
  column-gap: 5%;
}
.c-banner-list--typeB > li {
  width: 21.25%;
}
.c-banner-list--typeB img {
  border-radius: var(--border-radius-md);
}

.c-banner-list--typeC {
  column-gap: 8%;
}
.c-banner-list--typeC > li {
  width: 46%;
}

/* キャンペーン・新商品 */
.page-beauty-top .campaign-area .item_area {
  justify-content: flex-start;
  gap: 1.875rem 5%;
  width: auto;
  padding-top: 0;
}
.page-beauty-top .campaign-area .item_area li {
  width: 21.25%;
}
.page-beauty-top .campaign-area .item_area li a {
  transition: opacity 0.3s;
}
.page-beauty-top .campaign-area .item_area li .item_img {
  border-radius: var(--border-radius-md);
}
.page-beauty-top .campaign-area .item_area li .icon {
  line-height: 1.4;
}

.campaign-area {
  margin-top: 3.125rem;
}
.campaign-area .campaign-area-more {
  margin: 2.8125rem 0 0;
  text-align: center;
}

/* 商品を探す */
.search-products-area {
  margin-bottom: 3.75rem;
}

.search-products {
  position: relative;
}
.search-products .search-products-tab-bg {
  position: absolute;
  border-radius: 1.5625rem;
  background-color: #072b4d;
  transition: 0.3s;
}
.search-products .search-products-tab-list {
  display: flex;
  margin: 0 0 1.5rem;
  border-radius: 1.5625rem;
  background-color: #f0f0f0;
}
.search-products .search-products-tab-list .search-products-tab {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 33.3333333333%;
  height: 3.125rem;
  border-radius: 1.5625rem;
  color: #727272;
  background: transparent;
  font-weight: bold;
  font-size: 1.25rem;
  appearance: none;
}
.search-products .search-products-tab-list .search-products-tab.is-current {
  color: #fff;
  pointer-events: none;
}
@media (any-hover: hover) {
  .search-products .search-products-tab-list .search-products-tab {
    transition: opacity 0.3s;
  }
  .search-products .search-products-tab-list .search-products-tab:hover {
    opacity: 0.7;
  }
}
.search-products .search-products-contents {
  display: none;
}
.search-products .search-products-contents.is-current {
  display: block;
}
.search-products .category-name {
  position: relative;
  line-height: 1.3;
  margin: 0;
  padding: 0.75rem 0;
  border-bottom: 1px solid #ccc;
  color: #072b4d;
  font-weight: bold;
  font-size: 1.25rem;
  letter-spacing: 0.05em;
}
.search-products .category-name.js-category-toggle {
  cursor: pointer;
}
.search-products .category-name.js-category-toggle::after, .search-products .category-name.js-category-toggle::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 2.6666666667%;
  margin: auto 0;
  width: 1.5rem;
  height: 0.25rem;
  border-radius: 0.1875rem;
  background-color: #9d9d9d;
  transition: 0.3s;
}
.search-products .category-name.js-category-toggle::before {
  transform: rotate(-90deg);
}
.search-products .category-name.js-category-toggle.is-open::before {
  opacity: 0;
  transform: rotate(0deg);
}
@media (any-hover: hover) {
  .search-products .category-name.js-category-toggle {
    transition: opacity 0.3s;
  }
  .search-products .category-name.js-category-toggle:hover {
    opacity: 0.7;
  }
}
.search-products .js-category-toggle-target {
  display: none;
}
.search-products .category-list {
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem 4.5%;
  padding-top: 1.125rem;
}
.search-products .category-list + .category-list {
  margin-top: 1.375rem;
}
.search-products .category-list:last-child {
  padding-bottom: 3.75rem;
}
.search-products .category-list > li {
  width: 12.9166666667%;
}
.search-products .category-list > li.br-sp {
  display: none;
}
@media (any-hover: hover) {
  .search-products .category-list a {
    transition: opacity 0.3s;
  }
  .search-products .category-list a:hover {
    opacity: 0.5;
  }
}
.search-products .category-list .category-list-image {
  aspect-ratio: 1/1;
  text-align: center;
}
.search-products .category-list .category-list-image img {
  width: 100%;
  height: 100%;
  border-radius: 0.4375rem;
  object-fit: cover;
}
.search-products .category-list .category-list-name {
  line-height: 1.1111111111;
  margin-top: 0.625rem;
  color: #737373;
  font-weight: bold;
  font-size: 1rem;
  text-align: center;
}

/* ランキング */
.ranking-area .ranking-area-more {
  position: absolute;
  top: 0.9375rem;
  right: 1.8333333333%;
}

.popular-ranking-list {
  margin-left: -0.75rem;
}
.popular-ranking-list.slick-dotted {
  margin-bottom: 0;
  padding-bottom: 3.75rem;
}
.popular-ranking-list .slick-list {
  overflow: hidden;
}
.popular-ranking-list .slick-track {
  display: flex;
}
.popular-ranking-list .slick-track::before, .popular-ranking-list .slick-track::after {
  content: none;
}
.popular-ranking-list .slick-slide {
  height: auto;
  padding: 0 0.75rem;
}
.popular-ranking-list .slick-slide > div {
  height: 100%;
}
.popular-ranking-list .slick-slide {
  opacity: 0.5;
  transition: opacity 0.3s;
  margin: 0 0 10px;
}
.popular-ranking-list .slick-slide.slick-active {
  opacity: 1;
}
.popular-ranking-list .slick-prev,
.popular-ranking-list .slick-prev:focus,
.popular-ranking-list .slick-prev:hover {
  width: 3.375rem;
  height: 3.375rem;
  border-radius: 50%;
  top: 40%;
  left: -1.524752%;
  background: #8d9298;
  opacity: 1;
  padding-left: 7px;
}
.popular-ranking-list .slick-prev:before {
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  opacity: 1;
}
.popular-ranking-list .slick-next,
.popular-ranking-list .slick-next:focus,
.popular-ranking-list .slick-next:hover {
  width: 3.375rem;
  height: 3.375rem;
  border-radius: 50%;
  top: 40%;
  right: -1.524752%;
  background: #8d9298;
  opacity: 1;
}
.popular-ranking-list .slick-next:before {
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  opacity: 1;
}
.popular-ranking-list .slick-arrow {
  transition: opacity 0.3s;
}
.popular-ranking-list .slick-arrow.slick-disabled {
  opacity: 0;
  visibility: hidden;
}
.popular-ranking-list .slick-dots {
  bottom: 0;
  line-height: 1;
  padding-left: 0.75rem;
  font-size: 0;
}
.popular-ranking-list .slick-dots li {
  width: 17px;
  height: 17px;
  margin: 0 25px;
}
.popular-ranking-list .slick-dots li button {
  width: 100%;
  height: 100%;
  padding: 0;
}
.popular-ranking-list .slick-dots li button:before {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.popular-ranking-list .rankBox {
  position: relative;
  height: 100%;
  padding: 1.875rem 0.875rem 1.5rem;
  border: 1px solid #eaeaea;
  border-radius: var(--border-radius-md);
  background-color: #fff;
  box-shadow: 3px 6px 5px 1px rgba(115, 115, 115, 0.1);
}
.popular-ranking-list .rankBox a {
  color: #000;
  transition: opacity 0.3s;
}
@media (any-hover: hover) {
  .popular-ranking-list .rankBox a:hover {
    opacity: 0.5;
  }
}
.popular-ranking-list .rankBox .icon {
  position: absolute;
  top: 0.875rem;
  left: 0.875rem;
  z-index: 1;
  width: 21.5909090909%;
}
.popular-ranking-list .rankBox .icon img {
  max-width: 100%;
  height: auto;
}
.popular-ranking-list .rankBox .ph {
  aspect-ratio: 1/1;
}
.popular-ranking-list .rankBox .ph img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.popular-ranking-list .rankBox .spec {
  display: grid;
  grid-template-columns: auto 1fr;
  margin-top: 0.875rem;
}
.popular-ranking-list .rankBox .spec .text {
  grid-column: 1/3;
  display: none;
}
.popular-ranking-list .rankBox .spec .itemName {
  grid-column: 1/3;
  min-height: 2.5454545455em;
  line-height: 1.2727272727;
  font-size: 1rem;
  /* 3行で折り返し */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.popular-ranking-list .rankBox .spec .review {
  margin-top: 0.875rem;
  line-height: 1.7;
  font-size: 0.875rem;
}
.popular-ranking-list .rankBox .spec .review span {
  display: none;
}
.popular-ranking-list .rankBox .spec .revCnt {
  align-self: end;
  margin-bottom: -0.25rem;
}

/* ピックアップ商品 */
.pickup-product-area {
  margin-bottom: 6.25rem;
}

/* 目次 */
.contents-index-area {
  width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding-top: 2rem;
  padding-bottom: 4.375rem;
  background-color: #f5f8ff;
}
.contents-index-area .contents-index-area-inner {
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
}

.contents-index-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1.875rem 2.5%;
  padding: 0 2.5%;
}
.contents-index-list > li {
  width: 48.6842105263%;
}

/* CLIP記事を読む */
.clip-ranking-area .clip-ranking-area-more {
  position: absolute;
  top: 0.9375rem;
  right: 1.8333333333%;
}
.clip-ranking-area .clip-ranking-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1.875rem 1.6666666667%;
}
.clip-ranking-area .clip-ranking-list > li {
  width: 23.75%;
}
.clip-ranking-area .clip-ranking-list .clip_box_item {
  position: relative;
  border: 1px solid #eaeaea;
  border-radius: var(--border-radius-md);
  background-color: #fff;
  box-shadow: 3px 6px 5px 1px rgba(115, 115, 115, 0.1);
}
.clip-ranking-area .clip-ranking-list .clip_box_item a {
  display: block;
  height: 100%;
  color: #000;
  transition: opacity 0.3s;
}
@media (any-hover: hover) {
  .clip-ranking-area .clip-ranking-list .clip_box_item a:hover {
    opacity: 0.5;
  }
}
.clip-ranking-area .clip-ranking-list .clip_box_item .figure {
  padding: 0.875rem 0.875rem 0;
  aspect-ratio: 1/1;
}
.clip-ranking-area .clip-ranking-list .clip_box_item .figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.clip-ranking-area .clip-ranking-list .clip_box_item .box {
  margin-top: 0.875rem;
  padding: 0 0.875rem 0.875rem;
}
.clip-ranking-area .clip-ranking-list .clip_box_item .box .txt {
  line-height: 1.3125;
  font-size: 1rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}
.clip-ranking-area .clip-ranking-list .clip_box_item .box .date {
  display: none;
}
.clip-ranking-area .clip-ranking-list .inner {
  position: relative;
  height: 100%;
  padding: 0.875rem 0.875rem 0.875rem;
  border: 1px solid #eaeaea;
  border-radius: var(--border-radius-md);
  background-color: #fff;
  box-shadow: 3px 6px 5px 1px rgba(115, 115, 115, 0.1);
}
.clip-ranking-area .clip-ranking-list .inner a {
  color: #000;
  transition: opacity 0.3s;
}
@media (any-hover: hover) {
  .clip-ranking-area .clip-ranking-list .inner a:hover {
    opacity: 0.5;
  }
}
.clip-ranking-area .clip-ranking-list .inner .imgBox {
  display: block;
  aspect-ratio: 1/1;
}
.clip-ranking-area .clip-ranking-list .inner .imgBox img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.clip-ranking-area .clip-ranking-list .inner .txtBox {
  display: block;
  margin-top: 0.875rem;
  line-height: 1.3125;
  font-size: 1rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}
.clip-ranking-area .clip-ranking-list .inner .txtBox .info {
  display: none;
}

/* コンテンツ */
.top-contents-area .c-ttl-group,
.top-contents-area .c-ttl-sub-section {
  margin-top: 5.625rem;
}
.top-contents-area .c-ttl-group:first-of-type,
.top-contents-area .c-ttl-sub-section:first-of-type {
  margin-top: 0;
}

/* インナーケア */
.inner-care-area .inner-care-area-more {
  position: absolute;
  top: 0.9375rem;
  right: 1.8333333333%;
}

/* ブランド一覧 */
.brand-index-area .c-ttl-group,
.brand-index-area .c-ttl-sub-section {
  margin-top: 5.625rem;
}
.brand-index-area .c-ttl-group:first-of-type,
.brand-index-area .c-ttl-sub-section:first-of-type {
  margin-top: 0;
}

.brand-index-list {
  margin-left: -1.375rem;
}
.brand-index-list li > a {
  transition: opacity 0.3s;
}
@media (any-hover: hover) {
  .brand-index-list li > a:hover {
    opacity: 0.5;
  }
}
.brand-index-list.slick-dotted {
  margin-bottom: 0;
}
.brand-index-list.slick-dotted:has(.slick-dots li + li) {
  padding-bottom: 3.75rem;
}
.brand-index-list .slick-list {
  overflow: hidden;
}
.brand-index-list .slick-track {
  margin-left: 0;
}
.brand-index-list .slick-slide {
  padding: 0 1.375rem;
  opacity: 0.5;
  transition: opacity 0.3s;
}
.brand-index-list .slick-slide.slick-active {
  opacity: 1;
}
.brand-index-list .slick-prev,
.brand-index-list .slick-prev:focus,
.brand-index-list .slick-prev:hover {
  width: 3.375rem;
  height: 3.375rem;
  border-radius: 50%;
  top: 0;
  left: 2.4549918167%;
  background: #8d9298;
  opacity: 1;
  padding-left: 7px;
}
.brand-index-list .slick-prev:before {
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  opacity: 1;
}
.brand-index-list .slick-next,
.brand-index-list .slick-next:focus,
.brand-index-list .slick-next:hover {
  width: 3.375rem;
  height: 3.375rem;
  border-radius: 50%;
  top: 0;
  right: 2.4549918167%;
  background: #8d9298;
  opacity: 1;
}
.brand-index-list .slick-next:before {
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  opacity: 1;
}
.brand-index-list .slick-arrow {
  margin-top: 8.1833060556%;
  transform: translateY(0);
  transition: opacity 0.3s;
}
.brand-index-list .slick-arrow.slick-disabled {
  opacity: 0;
  visibility: hidden;
}
.brand-index-list .slick-dots {
  bottom: 0;
  line-height: 1;
  padding-left: 1.375rem;
  font-size: 0;
}
.brand-index-list .slick-dots > li:first-child:last-child {
  display: none;
}
.brand-index-list .slick-dots li {
  width: 17px;
  height: 17px;
  margin: 0 25px;
}
.brand-index-list .slick-dots li button {
  width: 100%;
  height: 100%;
  padding: 0;
}
.brand-index-list .slick-dots li button:before {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.brand-index-list .brand-index-list-image {
  aspect-ratio: 1/1;
}
.brand-index-list .brand-index-list-image img {
  width: 100%;
  height: 100%;
  border-radius: var(--border-radius-md);
  object-fit: cover;
}
.brand-index-list .brand-index-list-name {
  line-height: 1.3333333333;
  margin-top: 1rem;
  color: #000;
  font-size: 1.125rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}

.popular-ranking-list .slick-track {
  transition-timing-function: ease-in-out !important;
}