/*===========================================================================
 utility
===========================================================================*/
.u-mt-6 {
  margin-top: -6px !important;
}
.u-mt4 {
  margin-top: 4px !important;
}
.u-mt6 {
  margin-top: 6px !important;
}
.u-mt8 {
  margin-top: 8px !important;
}
.u-mt12 {
  margin-top: 12px !important;
}
.u-mt14 {
  margin-top: 14px !important;
}
.u-mt16 {
  margin-top: 16px !important;
}
.u-mt24 {
  margin-top: 24px !important;
}
.u-mt28 {
  margin-top: 28px !important;
}
.u-mt32 {
  margin-top: 32px !important;
}
.u-mt34 {
  margin-top: 34px !important;
}
.u-mt36 {
  margin-top: 36px !important;
}
.u-mt40 {
  margin-top: 40px !important;
}
.u-mt56 {
  margin-top: 56px !important;
}
.u-mt64 {
  margin-top: 64px !important;
}
.u-mt104 {
  margin-top: 104px !important;
}

.u-mb4 {
  margin-bottom: 4px !important;
}
.u-mb8 {
  margin-bottom: 8px !important;
}
.u-mb14 {
  margin-bottom: 14px !important;
}
.u-mb16 {
  margin-bottom: 16px !important;
}
.u-mb24 {
  margin-bottom: 24px !important;
}
.u-mb32 {
  margin-bottom: 32px !important;
}
.u-mb36 {
  margin-bottom: 36px !important;
}
.u-mb40 {
  margin-bottom: 40px !important;
}
.u-mb64 {
  margin-bottom: 64px !important;
}
.u-mb104 {
  margin-bottom: 104px !important;
}
@media only screen and (min-width: 641px) {
  .u-pcMb64 {
    margin-bottom: 64px !important;
  }
}
@media only screen and (max-width: 640px) {
  .u-spMt64 {
    margin-top: 64px !important;
  }
  .u-spMb40 {
    margin-bottom: 40px !important;
  }
}

.u-p8 {
  padding: 8px !important;
}
.u-p20 {
  padding: 20px !important;
}

.u-pt24 {
  padding-top: 24px !important;
}

.u-pb8 {
  padding-bottom: 8px !important;
}
.u-pb40 {
  padding-bottom: 40px !important;
}

.u-pr4 {
  padding-right: 4px !important;
}

.u-pl4 {
  padding-left: 4px !important;
}

.u-borderBWidth {
  border-bottom-width: 1px !important;
}

.u-borderBOnly {
  border-top-width: 0 !important;
  border-right-width: 0 !important;
  border-left-width: 0 !important;
}

.u-fontsize34 {
  font-size: 34px !important;
}
.u-fontsize16 {
  font-size: 16px !important;
}
.u-fontsize14 {
  font-size: 14px !important;
}
.u-fontsize12 {
  font-size: 12px !important;
}
.u-fontsize10 {
  font-size: 10px !important;
}

.u-dflex {
  display: flex;
}
.u-aiC {
  align-items: center;
}
.u-jcC {
  justify-content: center;
}


.u-bg08 {
  background-color: #f9f9f9;
}
.u-bg09 {
  background-color: #231916;
}
.u-bg10 {
  background-color: #b6e0ea;
}

.u-ib {
  display: inline-block;
}


/*===========================================================================
 layout
===========================================================================*/
.l-AccordionUnit__titleBlock .l-HeadingTitle__p {
  font-family: 'NotoSansCJKjp-Regular', sans-serif;
}

.opt-fontfamily--05 .l-PageTitle__h1 {
  font-family: inherit;
}

/*===========================================================================
 module
===========================================================================*/
.md-section {
  position: relative;
  z-index: 0;
  clip-path: inset(0);
  background-image: none !important;
}
.md-section::before {
  content: "";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left calc(50% + 50px);
  background-image: url("//kao-h.assetsadobe3.com/is/image/content/dam/sites/kanebo/www-kanebo-cosmetics-jp/allie/2024/common/section_bg_txt.png?fmt=png-alpha&wid=2732");
}
.md-section::after {
  content: "";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -2;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  background-repeat: no-repeat;
  background-position: right calc(50% + 50px);
  background-image: url("//kao-h.assetsadobe3.com/is/image/content/dam/sites/kanebo/www-kanebo-cosmetics-jp/allie/2024/common/allie_bg.png?fmt=png-alpha&wid=2732");
  background-size: contain;
}
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .md-section::before {
    background-position: left calc(50% + 30px);
  }
  .md-section::after {
    background-position: right calc(50% + 30px);
  }
}
@media only screen and (min-width: 641px) {
  .md-section img {
    max-width: 100% !important;
    width: 100% !important;
  }
}
@media only screen and (max-width: 640px) {
  .md-section {
    background: initial !important;
  }
}


.md-footerCopy {
  font-size: 12px;
}
@media only screen and (max-width: 640px) {
  .md-footerCopy {
    font-size: 10px;
  }
}

.md-list ul {
  padding-left: 20px;
}
.md-list li {
  position: relative;
}
.md-list li::before {
  content: '○';
  position: absolute;
  top: 0;
  left: -20px;
}
.md-list li + li {
  margin-top: 8px;
}

.md-list--rhombus li::before {
  content: '◇';
}

.md-list02 ol {
  padding-left: 20px;
  counter-reset: num;
}
.md-list02 li {
  list-style: none;
  position: relative;
}
.md-list02 li::before {
  counter-increment: num;
  content: "※"counter(num);
  position: absolute;
  top: 0;
  left: -20px;
}
.md-list02 li + li {
  margin-top: 4px;
}



.md-label {
  display: inline-block;
  padding: 7px 19px !important;
  font-size: 10px;
}


.md-numTtl {
  padding-bottom: 24px;
  border-bottom-width: 1px !important;
}
.md-numTtl .g-HeadingTitle__titleBlock__imageBox {
  padding-right: 20px !important;
  width: 60px;
  vertical-align: top;
}
.md-numTtl .g-HeadingTitle__titleBlock__titleBox {
  vertical-align: top;
}
.md-numTtl .g-HeadingTitle__titleBlock__titleBox__title {
  margin-top: 15px;
  margin-bottom: 0;
}

.md-ttl {
  font-size: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #231916;
}
.md-ttl .new {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  margin-right: 8px;
  border-radius: 50%;
  font-size: 10px;
  letter-spacing: normal;
}

.md-ttl--colorT {
  border-bottom-color: #707070;
}
.md-ttl--colorT .mark {
  background: linear-gradient(transparent 60%, rgba(224, 199, 175, 0.5) 60%);
}
.md-ttl--colorOn .new {
  background-color: #fca2a9;
  color: #fff;
}

.md-ttl02 .cmn-richtext > span {
  display: inline-block;
  padding-bottom: 4px;
  border-bottom: 1px solid #000;
}


.md-mark--pink {
  background: linear-gradient(transparent 60%, #fee8ea 60%);
}



.md-dashed hr {
  height: 1px;
  border: none !important;
  background: linear-gradient(to right, #d6d6d6 4px, transparent 4px) repeat-x left bottom / 8px 1px;
}


.md-itemBody {
  margin-top: calc(64 / 295 * 100%) !important;
}


.md-imageCarousel .g-ImageCarouselP__nav__dot:before {
  content: "\e020";
  color: #fff;
}
.md-imageCarousel .slick-active .g-ImageCarouselP__nav__dot:before {
  color: #c2abcc;
}
@media only screen and (min-width: 641px) and (max-width: 938px) {
  .md-imageCarousel .g-ImageCarouselPUnit__inner {
    height: calc((100vw * 480 / 641) + (38 / 641 * 100vw));
    background-color: #fff;
    border-radius: 8px;
    object-fit: contain;
  }
}


.md-shadow {
  text-shadow: 0 0 50px rgba(137, 91, 44, 0.6);
}


.md-cpAccordion .g-AccordionUnit__titleBlock {
  background-color: #61483a;
  border-radius: 10px 10px 0 0;
}
.md-cpAccordion .g-AccordionUnit__titleBlock[aria-expanded="false"] {
  border-radius: 10px;
}
.md-cpAccordion .g-AccordionUnit__titleBlock .g-HeadingTitle__p {
  font-size: 26px !important;
}
.md-cpAccordion .g-AccordionUnit__titleBlock .g-AccordionUnit__titleBlock__icon {
  color: #fff;
}
.md-cpAccordion .g-AccordionUnit__contentBlock {
  border-radius: 0 0 10px 10px;
  padding: 20px 15px !important;
}
.md-cpAccordion .g-AccordionUnit__contentBlock .g-Text {
  font-size: 13px;
  line-height: 1.6;
  letter-spacing: 0.02em;
}


