﻿@charset "UTF-8";

/*//////////////////////////////////////////////////

  CV_2026SSCollection | Celvoke Website

//////////////////////////////////////////////////*/

html {
  font-size: calc(10 * (100vw * 0.3));
}

@media (min-width: 769px) {
  html {
    font-size: calc(10 * (100vw/1400));
  }
}

@media (max-width: 768px) {
  html {
    font-size: calc(10 * (100vw/390));
  }
}

@media (min-width: 1400px) {
  html {
    font-size: 62.5%
  }
}


/* ========================================================
             * CV限定 header footer　設定 *
========================================================= */

#FooterWrap {
  position: relative;
  background-color: #ffffff;
  z-index: 0;
}

@media (min-width: 769px) {

  .header_inner {
    width: 100vw;
    max-width: 110rem;
  }

  #HeaderWrap {
    overflow-x: clip;
  }

  .nav-global,
  .header_utiliry {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.5rem 0;
    width: 71%;
  }

  #header_img_slider {
    margin: 0;
  }

  #FooterWrap {
    position: relative;
    z-index: 1;
  }

  .wrapTop,
  .wrapBottom {
    width: 100%;
  }

  #footer {
    background-color: #ffffff;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1400px) {
  header {
    width: 100%;
    min-width: 100%;
  }

  .header_inner {
    margin: 0;
    padding-left: 2rem;
    max-width: 100vw;
  }

  #header_img_slider li img {
    width: 100%;
  }

  footer {
    min-width: 100%;
  }

  .footer_inner {
    flex-wrap: wrap;
    width: 100%;
  }
}

/* ========================================================
                      * root *
========================================================= */
:root {
  --rate: calc(var(--pcMainContentWidth) / var(--spWidth));

  /* PCデザインのメインコンテンツの横幅 */
  --pcMainContentWidth: 100vw;

  /* PCデザインの横幅 */
  --pcWidth: 100vw * 0.3 / 750;

  /* SPデザインの横幅 */
  --spWidth: 390;

  --color-lp_font: #000000;
  --color-lp_bg: #fff;
  --color-lp_ttl_color: rgba(236, 112, 131, .5);
  --color-lp_white: #fff;
  --font-jp: "europa", "Noto Sans JP", sans-serif;
  --font-jp_second:"source-han-serif-jp-subset", sans-serif;
  --font-en: "europa", sans-serif;
}

#Wrap {
  width: 100%;
}

#share {
  z-index: 111 !important;
  transition: all 0.6s 0.3s;
}

@media screen and (max-width: 768px) {
  #share.move {
    translate: 0 calc(-186 * (var(--rate)));
  }
}


/* ========================================================
                      * lp_contents *
========================================================= */
.lp_contents * {
  box-sizing: border-box;
  /* font-feature-settings: "palt"; */
  line-height: 1.5;
  letter-spacing: .05em;
  font-weight: 400;
  text-align: center;
}

.lp_contents {
  width: 100%;
  /* max-width: var(--pcMainContentWidth); */
  height: 100%;
  font-family: var(--font-jp);
  font-weight: 300;
  overflow-x: clip;
  color: var(--color-lp_font);
  background: #F7F7F7;
}

@media (min-width: 769px) {
  .lp_contents {
    position: relative;
    width: 100%;
    max-width: 100vw;
    height: 100%;
  }
}

.lp_contents .pc_only {
  display: none;
}

.lp_contents img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

.lp_contents a {
  width: 100%;
  height: 100%;
  display: inline-block;
}

.lp_contents a:hover {
  opacity: 1;
}


.lp_contents a,
.lp_contents .btn_accordion {
  -webkit-tap-highlight-color: transparent;
  /* iOS Safari用 */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  /* Android Chrome用 */
}

/* ========================================================
                      * SP *
========================================================= */

@media (max-width: 768px) {
  
}


/* ========================================================
                      * 共通  *
========================================================= */

.lp_contents .accordion {
  transition: height 0.5s;
  overflow: hidden;
  height: 0;
}

.lp_contents .btn_accordion {
  cursor: pointer;
  position: relative;
  font-size: calc(32 * (var(--rate)));
  font-family: var(--font-en);
  font-weight: 300;
  margin-top: calc(2 * (var(--rate)));
  padding-bottom: calc(50 * (var(--rate)));
}

.lp_contents .btn_accordion.is-open {
  margin-top: calc(66 * (var(--rate)));
  padding-bottom: calc(37 * (var(--rate)));
}

.lp_contents .btn_accordion::before {
  content: "";
  position: absolute;
  background: url(../img/icon_plus.svg) no-repeat center;
  background-size: 100%;
  width: calc(30 * (var(--rate)));
  height: calc(30 * (var(--rate)));
  top: calc(66 * (var(--rate)));
  left: 50%;
  transform: translateX(-50%);
}

.lp_contents .btn_accordion.is-open::before {
  background: url(../img/icon_minus.svg) no-repeat center;
}


.lp_contents .js-fade {
  opacity: 0;
}

.lp_contents .js-fade.is-active {
  -webkit-animation: opa1 1.4s cubic-bezier(0.51, 0.21, 0.41, 1) 0.3s 1 forwards;
  animation: opa 1.4s cubic-bezier(0.51, 0.21, 0.41, 1) 0.3s 1 forwards;
}

@-webkit-keyframes opa {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}


/* ========================================================
                      * sec_mv  *
========================================================= */

.lp_contents .main_area {
  padding: calc(60 * (var(--rate))) 0;
  background: #ffffff;
}

.lp_contents .sec_mv {
  width: 100%;
  overflow: hidden;
}

.lp_contents .sec_mv.is-active img {
  transform-origin: top 2% center;
  -webkit-animation: zoomUp 2s ease-in-out 0s normal both;
  animation: zoomUp 2s ease-in-out 0s normal both;
}

.lp_contents .sec_mv img {
  overflow: hidden;
}

.lp_contents .main_ttl {
  font-size: calc(15 * (var(--rate)));
}

.lp_contents .main_ttl span {
  font-family: var(--font-jp_second);
  display: inline-block;
  font-size: calc(24 * (var(--rate)));
  background: linear-gradient(transparent 50%, #F1E1CF 50%);
  line-height: 1.5;
}


/* ========================================================
                      * artist_wrap  *
========================================================= */

.lp_contents .artist_wrap {
  margin-top: calc(30 * (var(--rate)));
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(20 * (var(--rate)));
}

.lp_contents .artist_img {
  width: calc(140 * (var(--rate)));
}

.lp_contents .artist_text p {
  text-align: left;
}

.lp_contents .artist_text p:nth-of-type(1) {
  font-size: calc(12 * (var(--rate)));
}

.lp_contents .artist_text p:nth-of-type(2) {
  display: inline-block;
  position: relative;
  margin-left: calc(-12 * (var(--rate)));
  margin-top: calc(8 * (var(--rate)));
  font-size: calc(12 * (var(--rate)));
  z-index: 0;
}

.lp_contents .artist_text p:nth-of-type(2)::before {
  position: absolute;
  content: "";
  width: 100%;
  border-bottom: #C4C4C4 solid 1px;
  bottom: calc(-5 * (var(--rate)));
  left: 0;
  z-index: 1;
}

.lp_contents .artist_text p:nth-of-type(3) {
  margin-top: calc(20 * (var(--rate)));
  font-size: calc(20 * (var(--rate)));
}

.lp_contents .artist_btn {
  margin-top: calc(20 * (var(--rate)));
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(150 * (var(--rate)));
  height: calc(30 * (var(--rate)));
  font-size: calc(12 * (var(--rate)));
  color: #ffffff;
  background: #000000;
  z-index: 0;
}

.lp_contents .artist_btn::before {
  position: absolute;
  content: "";
  background: url(../img/arrow.svg)no-repeat;
  background-size: 100%;
  width: calc(4 * (var(--rate)));
  height: calc(7 * (var(--rate)));
  top: 50%;
  right: calc(10 * (var(--rate)));
  transform: translateY(-50%);
  z-index: 1;
}

/* ========================================================
                      * list  *
========================================================= */

.lp_contents .list {
  width: calc(310 * (var(--rate)));
  margin: calc(30 * (var(--rate))) auto 0;
  padding: calc(20 * (var(--rate))) calc(20 * (var(--rate))) calc(20 * (var(--rate))) calc(35 * (var(--rate)));
  background: #F7F7F7;
}

.lp_contents .ttl {
  font-size: calc(15 * (var(--rate)));
  font-weight: 500;
}

.lp_contents .list ul {
  margin-top: calc(15 * (var(--rate)));
}

.lp_contents .list ul li a {
  display: inline-block;
  text-align: left;
  position: relative;
  font-size: calc(14 * (var(--rate)));
  letter-spacing: 0.08em;
  text-decoration: underline;
  z-index: 0;
}

.lp_contents .list ul li:nth-of-type(n+2) {
  margin-top: calc(10 * (var(--rate)));
}

.lp_contents .list ul li a::before {
  position: absolute;
  content: "";
  width: calc(5 * (var(--rate)));
  height: calc(5 * (var(--rate)));
  background: #000;
  border-radius: calc(50 * (var(--rate)));
  top: calc(5 * (var(--rate)));
  left: calc(-10 * (var(--rate)));
  z-index: 1;
}

/* ========================================================
                      * section  *
========================================================= */

.lp_contents .sec {
  padding: calc(60 * (var(--rate))) 0;
}

.lp_contents .sec h2 {
  font-family: var(--font-jp_second);
  font-size: calc(24 * (var(--rate)));
  margin-bottom: calc(30 * (var(--rate)));
}

.lp_contents .sec_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(20 * (var(--rate)));
}

.lp_contents .sec .text {
  text-align: justify;
  margin: auto;
  font-size: calc(13 * (var(--rate)));
  margin-top: calc(30 * (var(--rate)));
  width: calc(350 * (var(--rate)));
  padding: calc(20 * (var(--rate)));
  line-height: 1.8;
  background: #fff;
}

/* ======================== * section first * ======================== */
.lp_contents .sec.first .sec_img {
  width: calc(160 * (var(--rate)));
}

.lp_contents .sec.first .sec_text {
  width: calc(140 * (var(--rate)));
}

.lp_contents .sec.first .sec_text .name {
  font-size: calc(13 * (var(--rate)));
}

.lp_contents .sec.first .color {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.lp_contents .sec.first .color p {
  margin-top: calc(6 * (var(--rate)));
  font-size: calc(11 * (var(--rate)));
  color: #fff;
  width: calc(65 * (var(--rate)));
  height: calc(15 * (var(--rate)));
  display: flex;
  justify-content: center;
  align-items: center;
}

.lp_contents .sec.first .color p:nth-of-type(1) {
  background: #EFC7AD;
}
.lp_contents .sec.first .color p:nth-of-type(2) {
  background: #EAD2A6;
}

.lp_contents .sec.first .price {
  margin-top: calc(15 * (var(--rate)));
  font-size: calc(16 * (var(--rate)));
}

.lp_contents .sec.first .price span {
  font-size: calc(14 * (var(--rate)));
}

.lp_contents .sec.first .sec_btn {
  width: 100%;
  height: calc(30 * (var(--rate)));
  background: #000;
  color: #fff;
  font-size: calc(14 * (var(--rate)));
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: calc(15 * (var(--rate)));
  padding-top: calc(2 * (var(--rate)));
}

/* ======================== * section second * ======================== */
.lp_contents .sec.second {
  background: #EDEBEB;
}

.lp_contents .sec.second .sec_img {
  position: relative;
  width: calc(340 * (var(--rate)));
  margin: auto;
  z-index: 0;
}

.lp_contents .sec.second .sec_img .color_link {
  position: absolute;
  content: "";
  width: calc(110 * (var(--rate)));
  height: calc(110 * (var(--rate)));
  top: 0;
  right: 0;
  display: block;
  z-index: 1;
}

.lp_contents .sec.second .sec_img .color_link.second {
  top: calc(180 * (var(--rate)));
  right: 0;
}

.lp_contents .sec .point {
  width: calc(350 * (var(--rate)));
  background: url(../img/point_bg_1_sp.svg) no-repeat;
  background-size: 100%;
  margin: calc(15 * (var(--rate))) auto 0;
  padding: calc(30 * (var(--rate))) calc(20 * (var(--rate))) calc(20 * (var(--rate)));
}

.lp_contents .sec .point.second {
  width: calc(350 * (var(--rate)));
  background: url(../img/point_bg_2_sp.svg) no-repeat;
  background-size: 100%;
  margin: calc(15 * (var(--rate))) auto 0;
  padding: calc(25 * (var(--rate))) calc(20 * (var(--rate))) calc(20 * (var(--rate)));
}

.lp_contents .sec .point .ttl {
  font-size: calc(15 * (var(--rate)));
  font-style: italic;
}

.lp_contents .sec .point .border {
  display: block;
  border-top: #C4C4C4 solid 1px;
  margin-top: calc(10 * (var(--rate)));
}

.lp_contents .sec .point .point_text {
  font-size: calc(13 * (var(--rate)));
  line-height: 1.8;
  text-align: justify;
  margin-top: calc(10 * (var(--rate)));
}

.lp_contents .sec .movie_btn {
  position: relative;
  width: calc(310 * (var(--rate)));
  height: calc(50 * (var(--rate)));
  background: #000;
  color: #fff;
  font-size: calc(13 * (var(--rate)));
  display: flex;
  justify-content: center;
  align-items: center;
  margin: calc(30 * (var(--rate))) auto 0;
  z-index: 0;
}

.lp_contents .sec .movie_btn::before {
  position: absolute;
  content: "";
  background: url(../img/movie_icon.svg) no-repeat;
  background-size: 100%;
  width: calc(20 * (var(--rate)));
  height: calc(15 * (var(--rate)));
  top: calc(18 * (var(--rate)));
  right: calc(45 * (var(--rate)));
}

/* ======================== * section third * ======================== */
.lp_contents .sec.third {
  background: #fff;
}

.lp_contents .sec.third .sec_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: calc(20 * (var(--rate)));
}

.lp_contents .sec.third .sec_img {
  margin: auto;
  width: calc(250 * (var(--rate)));
}

.lp_contents .sec.third .text {
  margin: auto;
  text-align: justify;
  width: calc(350 * (var(--rate)));
  font-size: calc(13 * (var(--rate)));
  line-height: 1.8;
  padding: 0;
}

.lp_contents .sec.third .point_text span {
  text-decoration: underline;
}

.lp_contents .sec.archive .swiper-slide .text {
  width: 100%;
  margin-top: calc(13 * (var(--rate)));
  font-size: calc(12 * (var(--rate)));
  letter-spacing: 0;
  line-height: 1.5;
  background: none;
  padding: 0;
}

.lp_contents .sec.archive .simple-bar_wrap ul li {
  width: calc(200 * (var(--rate)));
  background: none;
}

.lp_contents .sec.archive .product-card {
  padding: 0;
}

.lp_contents .sec.archive .product-card {
  background: none;
}

.lp_contents .sec.archive .simple-bar_wrap .review_list.first {
  justify-content: center;
  width: auto;
}

.lp_contents .sec.archive .simple-bar_wrap .review_list.second {
  justify-content: center;
  width: fit-content;
}


/* ======================== * LINE UP * ======================== */
.lp_contents .sec.lineup {
  background: #EDEBEB;
}

.lp_contents .sec.lineup h3 ,
.lp_contents .sec.archive h3 {
  font-size: calc(25 * (var(--rate)));
}

.lp_contents .sec.lineup h3 span ,
.lp_contents .sec.archive h3 span {
  display: block;
  margin-top: calc(6 * (var(--rate)));
  font-size: calc(13 * (var(--rate)));
}

/* スライダー幅 */
.lp_contents .product-swiper {
  overflow-x: auto;
  padding: 0 80px;
}

.lp_contents .swiper-wrapper {
  display: flex;
}

/* 商品カード */
.lp_contents .product-card {
  background: #fff;
  padding: calc(20 * (var(--rate)));
  text-align: center;
}

.lp_contents .product-card img {
  width: 100%;
}

.lp_contents .product-card h4 {
  font-size: calc(14 * (var(--rate)));
  margin: calc(12 * (var(--rate))) auto 0;
}

.lp_contents .price {
  font-size: calc(14 * (var(--rate)));
}

.lp_contents .price span {
  font-size: calc(12 * (var(--rate)));
}

.lp_contents .btn {
  margin-top: calc(12 * (var(--rate)));
  display: inline-block;
  background: #000;
  color: #fff;
  padding: calc(8 * (var(--rate))) calc(40 * (var(--rate)));
  text-decoration: none;
  font-size: calc(14 * (var(--rate)));
  transition: .3s;
}

.lp_contents .btn:hover {
  opacity: .7;
}

/* simplebar
==================================*/
.lp_contents .simple-bar_wrap *{
  /*スクロールバー非表示（IE・Edge）*/
  -ms-overflow-style: none;
  /*スクロールバー非表示（Firefox）*/
  scrollbar-width: none;
}

.lp_contents .simple-bar_wrap{
  overflow-x: scroll;
  padding-bottom: calc(23 * (var(--rate)));
  /*スクロールバー非表示（IE・Edge）*/
  -ms-overflow-style: none;
  /*スクロールバー非表示（Firefox）*/
  scrollbar-width: none;
}

.lp_contents .simple-bar_wrap *::-webkit-scrollbar,
.lp_contents .simple-bar_wrap::-webkit-scrollbar{
  display:none;
}

.lp_contents .simple-bar_wrap ul{
  margin-top: calc(30 * (var(--rate)));
  display: flex;
  width: fit-content;
  align-items: stretch;
  gap: calc(10 * (var(--rate)));
  padding: 0 calc(20 * (var(--rate)))
}

.lp_contents .simple-bar_wrap ul li {
  width: calc(220 * (var(--rate)));
  background: #fff;
  margin-top: 0;
}

.lp_contents .simplebar-track.simplebar-horizontal {
  height: calc(3 * (var(--rate)));
  width: calc(200 * (var(--rate)));
  background: #fff;
  margin: auto;
}

.lp_contents .simplebar-track.simplebar-horizontal .simplebar-scrollbar{
  top: 0;
  height: calc(3 * (var(--rate)));
  background-color: #C4C4C4;
}

.lp_contents .simplebar-scrollbar:before{
  background: #C4C4C4;
}


/* modal
==================================*/
.modal{
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
}
.modal__bg{
  position: absolute;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.6);
}
.modal__content{
  width: calc(310 * (var(--rate)));
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1001;
  background-color: var(--color-lp_white);
}
.modal_inner{
  max-height: 90svh;
  overflow-y: scroll;
}
.close-btn {
  position: fixed;
  height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(40 * (var(--rate)));
  height: calc(40 * (var(--rate)));
  top: calc(-50 * (var(--rate)));
  right: 0;
  z-index: 5;
}
.close-btn span {
  position: absolute;
  display: block;
  width: calc(40 * (var(--rate)));
  aspect-ratio: 1 / 1;
  top: 0;
  right: 0;
}
.close-btn span:before,
.close-btn span:after{
  content: '';
  width: calc(40 * (var(--rate)));
  height: 1px;
  background-color: #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: calc(-2 * (var(--rate)));
  bottom: 0;
  margin: auto;
}
.close-btn span:after{
  transform: rotate(-45deg);
}

.lp_contents .sec_products .slide_wrap .slick-slide.slick-active img {
  transform-origin: top 2% center;
  animation: zoomUp 2s ease-in-out 0s normal both;
}

@-webkit-keyframes zoomUp {
  0% {
    transform: scale(1.08);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes zoomUp {
  0% {
    transform: scale(1.08);
  }

  100% {
    transform: scale(1);
  }
}

/* ========================================================
                      * PC *
========================================================= */

@media (min-width: 769px) {
  /* ========================================================
                      * sec_mv  *
========================================================= */

.lp_contents .main_area {
  padding: 10rem 0;
}

.lp_contents .sec_mv {
  width: 100%;
  overflow: hidden;
}

.lp_contents .main_ttl {
  font-size: 2.2rem;
}

.lp_contents .main_ttl span {
  font-size: 4rem;
}


/* ========================================================
                      * artist_wrap  *
========================================================= */

.lp_contents .artist_wrap {
  margin-top: 5rem;
  gap: 4rem;
}

.lp_contents .artist_img {
  width: 22rem;
}

.lp_contents .artist_text p:nth-of-type(1) {
  font-size: 1.8rem;
}

.lp_contents .artist_text p:nth-of-type(2) {
  margin-left: -2.5rem;
  margin-top: 1.5rem;
  font-size: 1.8rem;
}

.lp_contents .artist_text p:nth-of-type(2)::before {
  border-bottom: #C4C4C4 solid 1px;
  bottom: -0.5rem;
}

.lp_contents .artist_text p:nth-of-type(3) {
  margin-top: 2.5rem;
  font-size: 3rem;
}

.lp_contents .artist_btn {
  margin-top: 3rem;
  width: 22rem;
  height: 4.5rem;
  font-size: 1.6rem;
}

.lp_contents .artist_btn::before {
  width: 0.5rem;
  height: 0.8rem;
  top: 50%;
  right: 2rem;
  transform: translateY(-50%);
  z-index: 1;
  transition: ease-in-out .6s;
}

.lp_contents .artist_btn:hover::before {
  right: 1.5rem;
}

/* ========================================================
                      * list  *
========================================================= */

.lp_contents .list {
  width: 80rem;
  margin: 5rem auto 0;
  padding: 3rem 3rem 4rem 7rem;
}

.lp_contents .ttl {
  font-size: 2rem;
}

.lp_contents .list ul {
  margin-top: 2.5rem;
}

.lp_contents .list ul li a {
  font-size: 1.8rem;
}

.lp_contents .list ul li:nth-of-type(n+2) {
  margin-top: 1.5rem;
}

.lp_contents .list ul li a::before {
  position: absolute;
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 5rem;
  top: 1rem;
  left: -1.5rem;
  z-index: 1;
}

/* ========================================================
                      * section  *
========================================================= */

.lp_contents .sec {
  padding: 10rem 0;
}

.lp_contents .sec h2 {
  font-size: 4rem;
  margin-bottom: 6rem;
}

.lp_contents .sec_wrap {
  gap: 4rem;
}

.lp_contents .sec .text {
  font-size: 1.6rem;
  margin-top: 4rem;
  width: 65rem;
  padding: 3.5rem;
}

/* ======================== * section first * ======================== */
.lp_contents .sec.first .sec_img {
  width: 25rem;
}

.lp_contents .sec.first .sec_text {
  width: 20rem;
}

.lp_contents .sec.first .sec_text .name {
  font-size: 1.8rem;
}

.lp_contents .sec.first .color p {
  margin-top: 1.5rem;
  font-size: 1.8rem;
  color: #fff;
  width: 9.5rem;
  height: 2.5rem;
}

.lp_contents .sec.first .price {
  margin-top: 2rem;
  font-size: 2.2rem;
}

.lp_contents .sec.first .price span {
  font-size: 1.8rem;
}

.lp_contents .sec.first .sec_btn {
  height: 4rem;
  font-size: 1.8rem;
  margin-top: 2rem;
}

/* ======================== * section second * ======================== */

.lp_contents .sec.second .sec_img {
  position: relative;
  width: 55rem;
  z-index: 0;
}

.lp_contents .sec.second .sec_img .color_link {
  position: absolute;
  content: "";
  width: 18rem;
  height: 18rem;
  top: 0;
  right: 0;
  display: block;
  z-index: 1;
}

.lp_contents .sec.second .sec_img .color_link.second {
  top: 28rem;
  right: 0;
}

.lp_contents .sec .point {
  width: 65rem;
  background: url(../img/point_bg_1_pc.svg) no-repeat;
  background-size: 100%;
  margin: 2rem auto 0;
  padding: 5rem 3.5rem 3.5rem 3.5rem;
}

.lp_contents .sec .point.second {
  width: 65rem;
  background: url(../img/point_bg_2_pc.svg) no-repeat;
  background-size: 100%;
  margin: 2rem auto 0;
  padding: 5rem 3.5rem 4.2rem 3.5rem;
}

.lp_contents .sec .point .ttl {
  font-size: 2.2rem;
}

.lp_contents .sec .point .border {
  display: block;
  border-top: #C4C4C4 solid 1px;
  margin-top: 1.5rem;
}

.lp_contents .sec .point .point_text {
  font-size: 1.6rem;
  line-height: 1.8;
  text-align: justify;
  margin-top: 1.5rem;
}

.lp_contents .sec .movie_btn {
  width: 50rem;
  height: 7rem;
  font-size: 1.8rem;
  margin: 4rem auto 0;
}

.lp_contents .sec .movie_btn::before {
  position: absolute;
  content: "";
  background: url(../img/movie_icon.svg) no-repeat;
  background-size: 100%;
  width: 3rem;
  height: 3rem;
  top: 2.4rem;
  right: 9rem;
}

/* ======================== * section third * ======================== */

.lp_contents .sec.third .sec_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  gap: 4rem;
}

.lp_contents .sec.third .sec_img {
  width: 35rem;
  margin: unset;
}

.lp_contents .sec.third .text {
  width: 61rem;
  font-size: 1.6rem;
  margin: unset;
}

.lp_contents .sec.archive .swiper-slide .text {
  width: 100%;
  margin-top: 1.5rem;
  font-size: 1.4rem;
  line-height: 1.5;
  background: none;
  padding: 0;
}

.lp_contents .sec.archive .simple-bar_wrap ul li {
  width: 25rem;
  background: none;
}

.lp_contents .sec.archive .product-card {
  padding: 0;
}

.lp_contents .sec.archive .product-card {
  background: none;
}

.lp_contents .sec.archive .simple-bar_wrap .review_list.first {
  justify-content: center;
  width: auto;
}

.lp_contents .sec.archive .simple-bar_wrap .review_list.second {
  justify-content: center;
  width: auto;
}


/* ======================== * LINE UP * ======================== */
.lp_contents .sec.lineup {
  background: #EDEBEB;
}

.lp_contents .sec.lineup h3 ,
.lp_contents .sec.archive h3 {
  font-size: 3.5rem;
}

.lp_contents .sec.lineup h3 span ,
.lp_contents .sec.archive h3 span {
  display: block;
  margin-top: 1rem;
  font-size: 1.6rem;
}

/* スライダー幅 */
.lp_contents .product-swiper {
  overflow-x: auto;
  padding: 0 80px;
}

/* 商品カード */
.lp_contents .product-card {
  padding: 2.5rem;
}

.lp_contents .product-card h4 {
  font-size: 1.5rem;
  margin: 2rem auto 0;
}

.lp_contents .price {
  font-size: 1.8rem;
}

.lp_contents .price span {
  font-size: 1.6rem;
}

.lp_contents .btn {
  margin-top: 2rem;
  padding: 1rem 4rem;
  text-decoration: none;
  font-size: 1.6rem;
  transition: .3s;
}

.lp_contents .btn:hover {
  opacity: .7;
}

/* simplebar
==================================*/
.lp_contents .simple-bar_wrap *{
  /*スクロールバー非表示（IE・Edge）*/
  -ms-overflow-style: none;
  /*スクロールバー非表示（Firefox）*/
  scrollbar-width: none;
}

.lp_contents .simple-bar_wrap{
  overflow-x: unset;
  padding-bottom: unset;
  /*スクロールバー非表示（IE・Edge）*/
  -ms-overflow-style: none;
  /*スクロールバー非表示（Firefox）*/
  scrollbar-width: none;
}

.lp_contents .simple-bar_wrap *::-webkit-scrollbar,
.lp_contents .simple-bar_wrap::-webkit-scrollbar{
  display:none;
}

.lp_contents .simple-bar_wrap ul{
  margin-top: 4rem;
  display: flex;
  width: auto;
  justify-content: center;
  align-items: stretch;
  gap: 1.5rem;
  padding: 0 calc(20 * (var(--rate)))
}

.lp_contents .simple-bar_wrap ul li {
  width: 25rem;
}

.lp_contents .simplebar-track.simplebar-horizontal {
  height: calc(3 * (var(--rate)));
  width: calc(200 * (var(--rate)));
  background: #fff;
  margin: auto;
}

.lp_contents .simplebar-track.simplebar-horizontal .simplebar-scrollbar{
  top: 0;
  height: calc(3 * (var(--rate)));
  background-color: #C4C4C4;
}

.lp_contents .simplebar-scrollbar:before{
  background: #C4C4C4;
}


/* modal
==================================*/

.modal__content{
  width: 40rem;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1001;
  background-color: var(--color-lp_white);
}

.close-btn {
  position: fixed;
  height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  top: -5rem;
  right: 0;
  z-index: 5;
}
.close-btn span {
  position: absolute;
  display: block;
  width: 4rem;
  aspect-ratio: 1 / 1;
  top: 0;
  right: 0;
}
.close-btn span:before,
.close-btn span:after{
  content: '';
  width: 4rem;
  height: 1px;
  background-color: #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: calc(-2 * (var(--rate)));
  bottom: 0;
  margin: auto;
}
.close-btn span:after{
  transform: rotate(-45deg);
}
}
