@charset "UTF-8";

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:#5f7890;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","Meiryo",sans-serif;background:#d9edf5}
img{display:block;width:100%;height:auto}
a{color:inherit;text-decoration:none}

.campaign-bg{min-height:100vh;background:url("../img/back.jpg") center top/cover fixed no-repeat;padding:0 16px}
.lp-wrap{width:100%;max-width:510px;margin:0 auto;background:#fff;overflow:hidden;box-shadow:0 0 38px rgba(78,132,158,.18)}
.section-inner{padding:0 32px}
.kv,.lead--image{line-height:0}

.section-title{margin:0;color:#5b90ad;font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;font-size:30px;line-height:1.65;letter-spacing:.14em;text-align:center;font-weight:500}
.section-text{margin:14px auto 0;color:#5d6370;font-size:18px;line-height:2;letter-spacing:.08em;text-align:center}

.trouble{padding:42px 0 50px;background:#f8f8f7}
.trouble__content{display:grid;grid-template-columns:1fr 126px;gap:16px;align-items:center;margin-top:22px}
.trouble__list{margin:0;padding:0;list-style:none}
.trouble__list li{margin-bottom:8px;padding:9px 8px;background:#e1e3e3;color:#65666a;font-size:18px;line-height:1.6;letter-spacing:.06em;text-align:center;opacity:0;transform:translateY(16px)}
.trouble__image{border-radius:50%;overflow:hidden}

.reset{position:relative;padding:48px 0 46px;background:#fff}
.reset::before{content:"";position:absolute;top:-24px;left:0;width:50%;height:24px;background:linear-gradient(to bottom left,transparent 49%,#fff 50%)}
.reset::after{content:"";position:absolute;top:-24px;right:0;width:50%;height:24px;background:linear-gradient(to bottom right,transparent 49%,#fff 50%)}

.item{padding:42px 0 48px;background:linear-gradient(180deg,#eaf7fc 0%,#f8fcfe 100%)}
.item--peeling{background:linear-gradient(180deg,#eef8fc 0%,#fff 100%)}
.item__label{width:200px;margin:0 auto 18px;padding:7px 10px;background:#5e98b7;color:#fff;font-size:15px;letter-spacing:.12em;text-align:center}
.item__name{margin:0;color:#5b90ad;font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;font-size:34px;line-height:1.3;letter-spacing:.16em;text-align:center;font-weight:500}
.item__sub{margin:4px 0 24px;color:#5b90ad;font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;font-size:22px;line-height:1.6;letter-spacing:.14em;text-align:center}
.item__body{display:grid;grid-template-columns:128px 1fr;gap:22px;align-items:center;margin-bottom:28px}
.item__photo{width:150px;margin:0 auto}
.item__text p{margin:0;color:#5f6e78;font-size:16px;line-height:2.05;letter-spacing:.05em}
.feature-title{margin:10px 0 18px;color:#5b90ad;font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;font-size:24px;text-align:center;letter-spacing:.13em;font-weight:500}
.feature-list{width:82%;margin:0 auto;padding:0;list-style:none}
.feature-list li{position:relative;margin-bottom:12px;padding-left:26px;color:#5f6e78;font-size:18px;line-height:1.6;letter-spacing:.06em}
.feature-list li::before{content:"";position:absolute;left:0;top:.35em;width:14px;height:14px;border:1px solid #949494;border-radius:2px}
.feature-list li::after{content:"";position:absolute;left:4px;top:.36em;width:7px;height:12px;border-right:2px solid #d66b83;border-bottom:2px solid #d66b83;transform:rotate(45deg)}

.howto{padding:44px 0 42px;background:#fff}
.routine-label{display:block;width:220px;margin:22px auto 16px;padding:7px 10px;background:#5e98b7;color:#fff;font-size:15px;letter-spacing:.12em;text-align:center}
.routine-img,.step-img{margin:0 auto}.note{margin:13px auto 26px;color:#5f6e78;font-size:18px;line-height:1.8;letter-spacing:.05em;text-align:center}
.step-img{margin-top:24px}

.visual-copy{line-height:0;background:#fff}.visual-copy__inner{height:280px;background:url("../img/image_05.png") center/cover no-repeat;position:relative}.visual-copy__inner::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(78,137,170,.34),rgba(255,255,255,.08))}.visual-copy p{position:absolute;z-index:1;left:32px;top:70px;margin:0;color:#fff;font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;font-size:24px;line-height:1.8;letter-spacing:.12em;text-shadow:0 2px 8px rgba(64,104,132,.45)}

.offer{padding:42px 0 52px;background:#fff;text-align:center}.offer__label{display:inline-block;margin-bottom:16px;padding:8px 18px;background:#5e98b7;color:#fff;border-radius:3px;font-size:14px;letter-spacing:.1em}.offer__title{margin:0 0 20px;color:#5b90ad;font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;font-size:28px;line-height:1.6;letter-spacing:.12em;font-weight:500}.offer__product{width:245px;margin:0 auto 12px}.offer__regular{margin:0 0 10px;color:#5f6e78;font-size:13px;letter-spacing:.06em}.offer__regular span{position:relative;display:inline-block}.offer__regular span::after{content:"";position:absolute;left:-5%;top:54%;width:110%;height:2px;background:#ba1b37;transform:rotate(-7deg)}.offer__price-wrap{display:flex;justify-content:center;align-items:flex-end;gap:8px;margin-bottom:24px}.offer__badge{border:1px solid #7aa9bd;color:#5b90ad;font-size:16px;line-height:1.4;letter-spacing:.08em;padding:7px 9px;margin-bottom:12px}.offer__price strong{display:block;color:#c40032;font-size:44px;line-height:1;letter-spacing:.02em}.offer__price small{display:block;margin-top:4px;color:#c40032;font-size:13px}.offer__btn{display:inline-flex;align-items:center;justify-content:center;position:relative;width:280px;min-height:54px;background:linear-gradient(180deg,#93c4d8,#6da7c0);color:#fff;border-radius:3px;font-size:17px;letter-spacing:.12em;box-shadow:0 8px 20px rgba(84,146,174,.2);transition:.3s}.offer__btn::after{content:"›";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:28px}.offer__btn:hover{transform:translateY(-3px)}

.kv img{opacity:0;transform:translateY(18px);animation:fadeUp .9s ease forwards}.trouble__list li.is-show,.item.is-show,.howto.is-show,.offer.is-show{animation:fadeUp .75s ease forwards}.item,.howto,.offer{opacity:0;transform:translateY(18px)}.trouble__list li.is-show:nth-child(2){animation-delay:.1s}.trouble__list li.is-show:nth-child(3){animation-delay:.2s}.trouble__list li.is-show:nth-child(4){animation-delay:.3s}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}
.point{color: #5b90ad;}
/* ================================
  右側固定メニュー（2605CP参考 / ブルーベース）
================================ */
.side-nav{
  position:fixed;
  top:135px;
  left:calc(50% + 300px);
  z-index:20;
  display:flex;
  flex-direction:column;
  gap:34px;
}

.side-nav a{
  position:relative;
  display:inline-block;
  color:#5b90ad;
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;
  font-size:24px;
  line-height:1.2;
  letter-spacing:.18em;
  text-shadow:0 1px 8px rgba(255,255,255,.8);
  transition:opacity .3s ease,transform .3s ease;color .3s ease;
}

.side-nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-7px;
  width:0;
  height:1px;
  background:currentColor;
  transition:width .3s ease;
}

.side-nav a:hover{
  color:#3f7f9f;
  opacity:.75;
  transform:translateX(4px);
}

.side-nav a:hover::after{
  width:100%;
}

.page-layout{
  max-width:1200px;
  margin:0 auto;
  position:relative;
}

.side--left{
  position:fixed;
  left:50%;
  margin-left:-520px;
  top:120px;
  width:180px;
  z-index:100;
}

.brand-block{
  text-align:center;
}

.brand-logo{
  width:160px;
  margin:0 auto 20px;
}

.official-btn{
  display:block;
  padding:14px 20px;
  background:#6da7c0;
  color:#fff;
  border-radius:4px;
  font-size:14px;
  letter-spacing:.12em;
  transition:.3s;
}

.official-btn:hover{
  background:#5b90ad;
}

@media screen and (max-width:767px){.campaign-bg{padding:0}.section-inner{padding:0 26px}.trouble__content{grid-template-columns:1fr 112px}.section-title{font-size:27px}.item__body{grid-template-columns:112px 1fr;gap:18px}.item__photo{width:112px}.feature-list{width:90%}.offer__price strong{font-size:40px}}
