@charset "UTF-8";
html {
  scroll-behavior: smooth;
  scroll-padding-top: 169px;
}
@media screen and (max-width: 767px) {
  html {
    scroll-padding-top: 112px;
  }
}

.eye-serum-LS {
  /* http://meyerweb.com/eric/tools/css/reset/
     v2.0 | 20110126
     License: none (public domain)
  */
  /* HTML5 display-role reset for older browsers */
  position: relative;
  display: block;
  color: #040a2b;
  max-width: 1366px;
  margin: 0 auto;
}
.eye-serum-LS html, .eye-serum-LS body, .eye-serum-LS div, .eye-serum-LS span, .eye-serum-LS applet, .eye-serum-LS object, .eye-serum-LS iframe,
.eye-serum-LS h1, .eye-serum-LS h2, .eye-serum-LS h3, .eye-serum-LS h4, .eye-serum-LS h5, .eye-serum-LS h6, .eye-serum-LS p, .eye-serum-LS blockquote, .eye-serum-LS pre,
.eye-serum-LS a, .eye-serum-LS abbr, .eye-serum-LS acronym, .eye-serum-LS address, .eye-serum-LS big, .eye-serum-LS cite, .eye-serum-LS code,
.eye-serum-LS del, .eye-serum-LS dfn, .eye-serum-LS em, .eye-serum-LS img, .eye-serum-LS ins, .eye-serum-LS kbd, .eye-serum-LS q, .eye-serum-LS s, .eye-serum-LS samp,
.eye-serum-LS small, .eye-serum-LS strike, .eye-serum-LS strong, .eye-serum-LS sub, .eye-serum-LS sup, .eye-serum-LS tt, .eye-serum-LS var,
.eye-serum-LS b, .eye-serum-LS u, .eye-serum-LS i, .eye-serum-LS center,
.eye-serum-LS dl, .eye-serum-LS dt, .eye-serum-LS dd, .eye-serum-LS ol, .eye-serum-LS ul, .eye-serum-LS li,
.eye-serum-LS fieldset, .eye-serum-LS form, .eye-serum-LS label, .eye-serum-LS legend,
.eye-serum-LS table, .eye-serum-LS caption, .eye-serum-LS tbody, .eye-serum-LS tfoot, .eye-serum-LS thead, .eye-serum-LS tr, .eye-serum-LS th, .eye-serum-LS td,
.eye-serum-LS article, .eye-serum-LS aside, .eye-serum-LS canvas, .eye-serum-LS details, .eye-serum-LS embed,
.eye-serum-LS figure, .eye-serum-LS figcaption, .eye-serum-LS footer, .eye-serum-LS header, .eye-serum-LS hgroup,
.eye-serum-LS menu, .eye-serum-LS nav, .eye-serum-LS output, .eye-serum-LS ruby, .eye-serum-LS section, .eye-serum-LS summary,
.eye-serum-LS time, .eye-serum-LS mark, .eye-serum-LS audio, .eye-serum-LS video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
.eye-serum-LS article, .eye-serum-LS aside, .eye-serum-LS details, .eye-serum-LS figcaption, .eye-serum-LS figure,
.eye-serum-LS footer, .eye-serum-LS header, .eye-serum-LS hgroup, .eye-serum-LS menu, .eye-serum-LS nav, .eye-serum-LS section {
  display: block;
}
.eye-serum-LS body {
  line-height: 1;
}
.eye-serum-LS ol, .eye-serum-LS ul {
  list-style: none;
}
.eye-serum-LS blockquote, .eye-serum-LS q {
  quotes: none;
}
.eye-serum-LS blockquote:before, .eye-serum-LS blockquote:after,
.eye-serum-LS q:before, .eye-serum-LS q:after {
  content: "";
  content: none;
}
.eye-serum-LS table {
  border-collapse: collapse;
  border-spacing: 0;
}
.eye-serum-LS input, .eye-serum-LS button, .eye-serum-LS textarea, .eye-serum-LS select, .eye-serum-LS option {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font: inherit;
}
.eye-serum-LS input::-ms-clear {
  display: none;
}
.eye-serum-LS input::-ms-reveal {
  display: none;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS {
    padding-block: calc(clamp(0px, 7.3206442167vw, 100px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS {
    padding-block: calc(clamp(0px, 13.3333333333vw, 13.3333333333vw) * 1);
  }
}
.eye-serum-LS img {
  display: block;
  width: 100%;
}
.eye-serum-LS ul {
  margin: 0;
}
.eye-serum-LS ul li {
  list-style-type: none;
}
.eye-serum-LS sup {
  font-size: 0.8em !important;
  top: -0.1em;
}
.eye-serum-LS .optima {
  font-family: OptimaDisplayLight, "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", HiraMinProN-W3, "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
.eye-serum-LS .fs110p {
  font-size: 110%;
}
.eye-serum-LS .bold {
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .lp-pc {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .lp-sp {
    display: none !important;
  }
}
.eye-serum-LS strong {
  font-weight: bold;
}
.eye-serum-LS .gold {
  color: #a7834f;
}
.eye-serum-LS .video {
  text-align: center;
}
.eye-serum-LS .video .video-title {
  font-family: "游明朝", "arial important", YuMincho, "ヒラギノ明朝 ProN W3", HiraMinProN-W3, "ＭＳ Ｐ明朝", "MS PMincho", serif, sans-serif, Tahoma;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .video .video-title {
    font-size: calc(clamp(0px, 3.074670571vw, 42px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .video .video-title {
    font-size: calc(clamp(0px, 6.4vw, 6.4vw) * 1);
  }
}
.eye-serum-LS .video .video-lead {
  line-height: 1.6;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .video .video-lead {
    font-size: calc(clamp(0px, 1.317715959vw, 18px) * 1);
    margin-top: calc(clamp(0px, 1.8301610542vw, 25px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .video .video-lead {
    font-size: calc(clamp(0px, 4vw, 4vw) * 1);
    margin-top: calc(clamp(0px, 5.3333333333vw, 5.3333333333vw) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .video .video-lead .sp-br {
    display: block;
    height: 0.8em;
  }
}
.eye-serum-LS .video .video {
  display: block;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .video .video {
    width: calc(clamp(0px, 65.8857979502vw, 900px) * 1);
    margin-top: calc(clamp(0px, 2.5622254758vw, 35px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .video .video {
    width: calc(clamp(0px, 89.3333333333vw, 89.3333333333vw) * 1);
    margin-top: calc(clamp(0px, 5.3333333333vw, 5.3333333333vw) * 1);
  }
}
.eye-serum-LS .approach {
  background-color: #f5f4f3;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .approach {
    margin-top: calc(clamp(0px, 7.3206442167vw, 100px) * 1);
    padding-block: calc(clamp(0px, 6.588579795vw, 90px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .approach {
    margin-top: calc(clamp(0px, 13.3333333333vw, 13.3333333333vw) * 1);
    padding-block: calc(clamp(0px, 13.3333333333vw, 13.3333333333vw) * 1);
  }
}
.eye-serum-LS .approach .approach-title {
  font-family: "游明朝", "arial important", YuMincho, "ヒラギノ明朝 ProN W3", HiraMinProN-W3, "ＭＳ Ｐ明朝", "MS PMincho", serif, sans-serif, Tahoma;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .approach .approach-title {
    font-size: calc(clamp(0px, 3.2210834553vw, 44px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .approach .approach-title {
    font-size: calc(clamp(0px, 7.2vw, 7.2vw) * 1);
  }
}
.eye-serum-LS .approach .approach-lead {
  font-family: "游明朝", "arial important", YuMincho, "ヒラギノ明朝 ProN W3", HiraMinProN-W3, "ＭＳ Ｐ明朝", "MS PMincho", serif, sans-serif, Tahoma;
  line-height: 1.6;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .approach .approach-lead {
    font-size: calc(clamp(0px, 1.6105417277vw, 22px) * 1);
    margin-top: calc(clamp(0px, 2.196193265vw, 30px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .approach .approach-lead {
    font-size: calc(clamp(0px, 4.5333333333vw, 4.5333333333vw) * 1);
    margin-top: calc(clamp(0px, 5.3333333333vw, 5.3333333333vw) * 1);
  }
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .approach .approach-image {
    display: flex;
    justify-content: center;
    margin-top: calc(clamp(0px, 3.2942898975vw, 45px) * 1);
    gap: calc(clamp(0px, 2.196193265vw, 30px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .approach .approach-image {
    margin-top: calc(clamp(0px, 8vw, 8vw) * 1);
    padding-inline: calc(clamp(0px, 5.3333333333vw, 5.3333333333vw) * 1);
  }
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .approach .approach-image li {
    width: calc(clamp(0px, 23.4260614934vw, 320px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .approach .approach-image li:not(:first-child) {
    margin-top: calc(clamp(0px, 5.3333333333vw, 5.3333333333vw) * 1);
  }
}
.eye-serum-LS .approach .approach-text {
  line-height: 1.6;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .approach .approach-text {
    margin-top: calc(clamp(0px, 2.5622254758vw, 35px) * 1);
    font-size: calc(clamp(0px, 1.317715959vw, 18px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .approach .approach-text {
    margin-top: calc(clamp(0px, 8vw, 8vw) * 1);
    padding-inline: calc(clamp(0px, 4vw, 4vw) * 1);
    font-size: calc(clamp(0px, 4vw, 4vw) * 1);
    text-align: left;
  }
}
.eye-serum-LS .approach .approach-text .marker {
  background: linear-gradient(transparent 60%, #e6dbb6 60%);
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .approach .approach-note {
    margin-top: calc(clamp(0px, 1.8301610542vw, 25px) * 1);
    font-size: calc(clamp(0px, 0.8052708638vw, 11px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .approach .approach-note {
    margin-top: calc(clamp(0px, 6.6666666667vw, 6.6666666667vw) * 1);
    font-size: calc(clamp(0px, 2.6666666667vw, 2.6666666667vw) * 1);
  }
}
.eye-serum-LS .banner {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .banner {
    justify-content: center;
    height: calc(clamp(0px, 43.9238653001vw, 600px) * 1);
    padding-inline: calc(clamp(0px, 9.5168374817vw, 130px) * 1);
    background: url(/media/export/cms_2.0/LP/eye-serum-LS/20250912/banner-bg.jpg) no-repeat center/cover;
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .banner {
    justify-content: flex-end;
    height: calc(clamp(0px, 177.8666666667vw, 177.8666666667vw) * 1);
    padding-block: calc(clamp(0px, 13.3333333333vw, 13.3333333333vw) * 1);
    background: url(/media/export/cms_2.0/LP/eye-serum-LS/20250912/banner-bg.sp.jpg) no-repeat center/cover;
  }
}
.eye-serum-LS .banner .banner-inner {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .banner .banner-inner {
    margin-left: auto;
    margin-top: calc(clamp(0px, 2.196193265vw, 30px) * 1);
  }
}
.eye-serum-LS .banner .banner-title {
  color: #fff;
  font-family: "游明朝", "arial important", YuMincho, "ヒラギノ明朝 ProN W3", HiraMinProN-W3, "ＭＳ Ｐ明朝", "MS PMincho", serif, sans-serif, Tahoma;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .banner .banner-title {
    font-size: calc(clamp(0px, 3.074670571vw, 42px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .banner .banner-title {
    font-size: calc(clamp(0px, 6.4vw, 6.4vw) * 1);
  }
}
.eye-serum-LS .banner .banner-link {
  background-color: #a7834f;
  background: linear-gradient(90deg, rgb(170, 134, 85) 0%, rgb(211, 173, 114) 50%, rgb(170, 134, 86) 100%);
  display: grid;
  place-content: center;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .eye-serum-LS .banner .banner-link {
    width: calc(clamp(0px, 23.7920937042vw, 325px) * 1);
    height: calc(clamp(0px, 4.39238653vw, 60px) * 1);
    margin-top: calc(clamp(0px, 2.9282576867vw, 40px) * 1);
    font-size: calc(clamp(0px, 1.317715959vw, 18px) * 1);
  }
}
@media screen and (max-width: 767px) {
  .eye-serum-LS .banner .banner-link {
    width: calc(clamp(0px, 80vw, 80vw) * 1);
    height: calc(clamp(0px, 9.6vw, 9.6vw) * 1);
    margin-top: calc(clamp(0px, 6.6666666667vw, 6.6666666667vw) * 1);
    font-size: calc(clamp(0px, 3.2vw, 3.2vw) * 1);
  }
}