@charset "UTF-8";
@media screen and (max-width: 1023px) {
  #node-552461 {
    background-image: url(/media/export/cms2.0/lp/ms_line_up/251029/img/step_bg.sp.png);
    background-size: 100% 100%;
  }
  #node-552461 .slick-list {
    width: 100%;
    box-sizing: border-box;
    padding: 0 10%;
  }
  #node-552461 .slick-slide {
    display: flex;
    justify-content: center;
  }
  #node-552461 .editorial-grid-formatter-carousel-arrow.previous {
    left: 6%;
  }
  #node-552461 .editorial-grid-formatter-carousel-arrow.next {
    right: 6%;
  }
}

@media screen and (min-width: 1024px) {
  .lp-step {
    margin: 0 auto;
    width: calc(clamp(0px, 91.6666666667vw, 1760px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step {
    margin: 0 auto;
  }
}
@media screen and (min-width: 1024px) {
  .lp-step hr {
    margin-top: calc(clamp(0px, 6.25vw, 120px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step hr {
    margin-top: calc(clamp(0px, 12.6666666667vw, 129.58px) * 1);
    margin-left: auto;
    margin-right: auto;
    width: calc(clamp(0px, 89.3333333333vw, 913.88px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .intro {
    padding-bottom: calc(clamp(0px, 3.6vw, 36.828px) * 1);
  }
}
@media screen and (min-width: 1024px) {
  .lp-step .title-cont {
    font-size: calc(clamp(0px, 2.5vw, 48px) * 1);
    margin-top: calc(clamp(0px, 6.25vw, 120px) * 1);
    margin-bottom: calc(clamp(0px, 1.5625vw, 30px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .title-cont {
    font-size: calc(clamp(0px, 5.3333333333vw, 54.56px) * 1);
    margin-top: calc(clamp(0px, 13.3333333333vw, 136.4px) * 1);
  }
}
.lp-step .title-cont .min {
  display: block;
  line-height: 1;
}
@media screen and (min-width: 1024px) {
  .lp-step .title-cont .min {
    font-size: calc(clamp(0px, 1.875vw, 36px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .title-cont .min {
    font-size: calc(clamp(0px, 3.7333333333vw, 38.192px) * 1);
    margin-bottom: calc(clamp(0px, 1.3333333333vw, 13.64px) * 1);
  }
}
.lp-step .step-list {
  text-align: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list {
    background-image: url(/media/export/cms2.0/lp/ms_line_up/251029/img/step_bg.png);
    position: relative;
    display: flex;
    justify-content: space-between;
    width: calc(clamp(0px, 91.6666666667vw, 1760px) * 1);
    margin: 0 auto;
    padding-top: calc(clamp(0px, 3.3854166667vw, 65px) * 1);
    padding-left: calc(clamp(0px, 1.9791666667vw, 38px) * 1);
    padding-right: calc(clamp(0px, 1.9791666667vw, 38px) * 1);
    padding-bottom: calc(clamp(0px, 3.125vw, 60px) * 1);
    border-radius: calc(clamp(0px, 1.8229166667vw, 35px) * 1);
  }
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list .item {
    width: calc(clamp(0px, 15.625vw, 300px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .step-list .item {
    width: calc(clamp(0px, 73.3333333333vw, 750.2px) * 1);
    padding-top: calc(clamp(0px, 10.6666666667vw, 109.12px) * 1);
    padding-bottom: calc(clamp(0px, 9.7333333333vw, 99.572px) * 1);
  }
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list .item + .item .image {
    position: relative;
  }
  .lp-step .step-list .item + .item .image::before {
    content: "";
    position: absolute;
    top: 50%;
    left: calc(clamp(0px, 1.8229166667vw, 35px) * -1);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: calc(clamp(0px, 0.6510416667vw, 12.5px) * 1) solid transparent;
    border-bottom: calc(clamp(0px, 0.6510416667vw, 12.5px) * 1) solid transparent;
    border-left: calc(clamp(0px, 1.09375vw, 21px) * 1) solid #f09ab5; /* 三角の色 */
    display: block;
  }
}
.lp-step .step-list .tag {
  background: #fff;
  border: 1px solid #e84478;
  border-radius: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  line-height: 1;
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list .tag {
    width: calc(clamp(0px, 7.8125vw, 150px) * 1);
    height: calc(clamp(0px, 2.1354166667vw, 41px) * 1);
    font-size: calc(clamp(0px, 1.5625vw, 30px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .step-list .tag {
    width: calc(clamp(0px, 21.3333333333vw, 218.24px) * 1);
    height: calc(clamp(0px, 5.8666666667vw, 60.016px) * 1);
    font-size: calc(clamp(0px, 4.5333333333vw, 46.376px) * 1);
  }
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list .title {
    font-size: calc(clamp(0px, 1.4583333333vw, 28px) * 1);
    margin-bottom: calc(clamp(0px, 1.09375vw, 21px) * 1);
    margin-top: calc(clamp(0px, 0.2604166667vw, 5px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .step-list .title {
    font-size: calc(clamp(0px, 4.8vw, 49.104px) * 1);
    margin-bottom: calc(clamp(0px, 1.3333333333vw, 13.64px) * 1);
  }
}
.lp-step .step-list .image {
  position: relative;
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list .image {
    margin-bottom: calc(clamp(0px, 1.0416666667vw, 20px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .step-list .image {
    margin-bottom: calc(clamp(0px, 6.6666666667vw, 68.2px) * 1);
  }
}
.lp-step .step-list .title-product {
  letter-spacing: -0.05em;
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list .title-product {
    width: 110%;
    margin-left: -5%;
    font-size: calc(clamp(0px, 1.25vw, 24px) * 1);
    line-height: 1.5;
    margin-top: calc(clamp(0px, 0.5208333333vw, 10px) * 1);
    margin-bottom: calc(clamp(0px, 1.0416666667vw, 20px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .step-list .title-product {
    font-size: calc(clamp(0px, 4.5333333333vw, 46.376px) * 1);
    line-height: 1.5;
    margin-top: calc(clamp(0px, 5.7333333333vw, 58.652px) * 1);
    margin-bottom: calc(clamp(0px, 2.6666666667vw, 27.28px) * 1);
  }
}
.lp-step .step-list .title-product .min {
  font-size: 80%;
  display: block;
}
.lp-step .step-list .link {
  display: block;
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list .link {
    font-size: calc(clamp(0px, 0.8333333333vw, 16px) * 1);
  }
}
@media screen and (max-width: 1023px) {
  .lp-step .step-list .link {
    font-size: calc(clamp(0px, 4vw, 40.92px) * 1);
  }
}
.lp-step .step-list .link.link-none {
  pointer-events: none;
}
@media screen and (min-width: 1024px) {
  .lp-step .step-list .link + .title-product {
    margin-top: calc(clamp(0px, 1.3020833333vw, 25px) * 1);
  }
}