@charset "UTF-8";
/* =====================
  common setting
===================== */
:root {
  /* Safari resize fix */
  min-height: 0vw;
}

html {
  scroll-behavior: smooth;
}

h1, h2 {
  font-weight: 700;
}

a {
  cursor: pointer;
  text-decoration: none;
  transition: all 0.25s;
}

img {
  width: 100%;
  display: block;
}

html {
  background: #fff;
}

body {
  height: 100%;
  width: 100%;
  transition: all 0.3s;
}

.wrap {
  width: 100%;
  max-width: 750px;
  margin: 0 auto !important;
  overflow-x: hidden;
}

/* 共通 */
.fade {
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}

/* 下 → 上 */
.fade-up {
  transform: translateY(30px);
}

/* 左 → 右 */
.fade-left {
  transform: translateX(-30px);
}

/* 右 → 左 */
.fade-right {
  transform: translateX(30px);
}

.fade-group .fade-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-group.is-visible .fade-up {
  opacity: 1;
  transform: translateY(0);
}

/* 左から順にディレイ */
.fade-group.is-visible .fade-up:nth-child(1) {
  transition-delay: 0s;
}

.fade-group.is-visible .fade-up:nth-child(2) {
  transition-delay: 0.15s;
}

.fade-group.is-visible .fade-up:nth-child(3) {
  transition-delay: 0.3s;
}

.cta {
  background-color: #bf4a5d;
  padding: min(13.3333333333vw, 100px) min(6.6666666667vw, 50px);
}
.cta__title {
  width: min(78.6666666667vw, 590px);
  margin: 0 auto min(8.3333333333vw, 70px);
}
.cta__block {
  position: relative;
  margin-bottom: min(5.3333333333vw, 14px);
}
.cta__inner {
  position: relative;
  margin-bottom: min(8.3333333333vw, 70px);
}
.cta__block .btn {
  width: min(62.3333333333vw, 460px);
  position: absolute;
  left: 50%;
  transform: translateX(-35%);
  bottom: 8%;
}
.cta__block .btn2 {
  width: min(33.333333vw, 262px);
  position: absolute;
  left: 50%;
  transform: translateX(18%);
  bottom: 22%;
}
.fv__main {
  position: relative;
}
.fv__component {
  width: min(33.8666666667vw, 254px);
  position: absolute;
  top: min(19.666667vw, 150px);
  right: 10px;
}

.section01 {
  background-color: #f0f0f0;
  padding-bottom: min(13.3333333333vw, 100px);
}
.section01-ttl {
  width: min(96.6666666667vw, 725px);
  margin-top: max(-12vw, -90px);
}
.section01__item {
  display: flex;
  gap: min(2vw, 15px);
  padding: 0 min(6.6666666667vw, 50px);
  margin-top: min(5.3333333333vw, 40px);
}
.section01__item img {
  width: min(28vw, 210px);
}
.section01__lineup {
  margin-top: min(5.3333333333vw, 40px);
  padding: 0 min(6.6666666667vw, 50px);
}

.section02__main {
  margin-top: max(-3.33vw, -25px);
}
.section02__content {
  background-color: #676a6f;
  padding-bottom: min(13.3333333333vw, 100px);
}
.section02__text {
  width: min(92vw, 690px);
  margin-left: min(8vw, 60px);
  margin-top: max(-9.33vw, -70px);
}
.section02__cta {
  width: min(92vw, 690px);
  margin-right: min(8vw, 60px);
  margin-top: min(6.6666666667vw, 50px);
  position: relative;
}
.section02__cta .btn {
  width: min(78.6666666667vw, 590px);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: min(4vw, 30px);
}
.section02__profile {
  margin-top: min(10.6666666667vw, 80px);
  padding: 0 min(6.6666666667vw, 50px);
}

.section03__content {
  background-color: #fddee4;
  padding-bottom: min(13.3333333333vw, 100px);
}
.section03__text {
  width: min(92vw, 690px);
  margin-left: min(8vw, 60px);
  margin-top: max(-9.33vw, -70px);
}
.section03__cta {
  width: min(92vw, 690px);
  margin-right: min(8vw, 60px);
  margin-top: min(6.6666666667vw, 50px);
  position: relative;
}
.section03__cta .btn {
  width: min(78.6666666667vw, 590px);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: min(4vw, 30px);
}

.section05 {
  background-color: #f0f0f0;
  padding: min(13.3333333333vw, 100px) 0;
}
.section05__title {
  padding: 0 min(6.6666666667vw, 50px);
  margin-top: min(5.3333333333vw, 40px);
}
.section05__point1 {
  margin-right: min(4vw, 30px);
}
.section05__point2 {
  margin-top: min(12vw, 90px);
  margin-left: min(4vw, 30px);
}

.section06 {
  background-color: #e3d2d6;
  padding: min(13.3333333333vw, 100px) 0;
}
.section06__main {
  width: min(96vw, 720px);
}
.section06__howto {
  margin-top: min(9.3333333333vw, 70px);
  padding: 0 min(8vw, 60px);
}

.section07 {
  padding: min(13.3333333333vw, 100px) 0;
}
.section07__title {
  width: min(81.3333333333vw, 610px);
  margin: 0 auto min(9.3333333333vw, 70px);
}
.section07__faq li {
  margin-right: min(12.6666666667vw, 95px);
}
.section07__faq li:nth-child(2) {
  margin: min(5.3333333333vw, 40px) 0 min(5.3333333333vw, 40px) min(12.6666666667vw, 95px);
}

.section09 {
  background: url("../../lp/images/qmelip-gyutae2/sec09-bg.jpg") no-repeat 100%/cover;
  padding: min(13.3333333333vw, 100px) 0;
}
.section09__title {
  width: min(67.3333333333vw, 505px);
  margin: 0 auto min(6.6666666667vw, 50px);
}
.section09__item li {
  margin-right: min(12.6666666667vw, 95px);
}
.section09__item li:nth-child(2) {
  margin: min(5.3333333333vw, 40px) 0 min(5.3333333333vw, 40px) min(12.6666666667vw, 95px);
}
.section09__item li:nth-child(3) {
  position: relative;
}
.section09__item li:nth-child(3) .gif {
  width: min(77.3333333333vw, 580px);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: min(12.6666666667vw, 95px);
}
.section09__care {
  margin-top: min(12.6666666667vw, 95px);
}
.section09 .care__title {
  margin-top: min(5.3333333333vw, 40px);
  padding: 0 min(6.6666666667vw, 50px);
}
.section09__ba {
  margin-top: min(13.3333333333vw, 100px);
}
.ctaFixed {
  width: min(100%, 780px);
  position: fixed;
  bottom: 0;
  left: 50%;
  opacity: 0;
  transform: translate(-50%, 210px);
  background-color: rgba(255, 255, 255, 0.5);  z-index: 99;
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.ctaFixed.show {
  opacity: 1;
  transform: translate(-50%, 0);
}
.ctaFixed-inner {
  padding: 0 min(2.56vw, 20px);
}
.ctaFixed a {
  display: block;
  margin-top: min(1.92vw, 15px);
}/*# sourceMappingURL=style.css.map */