@charset "UTF-8";
@font-face {
  font-family: "Antro_Vectra";
  src: url("../font/Antro_Vectra.otf") format("opentype");
}
/*------------------------------------
≡≡≡≡≡≡≡≡≡≡≡≡≡≡ ▼ 共 通 ▼ ≡≡≡≡≡≡≡≡≡≡≡≡≡≡
 ------------------------------------*/

#Wrap {
  width: 100%;
}

.LP_page p,
.LP_page h2,
.LP_page h3,
.LP_page h4,
.LP_page dd {
  color: var(--color-text);
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
  font-style: normal;
  font-weight: 500;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: 0.01em;
}

.LP_page img {
  display: block;
  opacity: 1;
  width: 100%;
  height: auto;
}

.topic-path {
  display: none;
}

/* ===================
    COLOR
=================== */
:root {
  --color-pink: #FDF0F2;
  --color-pink_2: #D57786;
  --color-pink_item: #FCF5F9;
  --color-blue: #8C9CC1;
  --color-purple: #D8AEC5;
  --color-red: #C63A50;
  --color-text: #484848;
  --color-black: #484848;
  --color-white: #ffffff;
  --font-Antro_Vectra: "Antro_Vectra", sans-serif;
  --font-Futura: "futura-pt", sans-serif;
  --font-ja: "noto-sans-cjk-jp", sans-serif;
  --font-ja_write: "vdl-penletter", sans-serif;
}

/*--------------------------------
  Media Queries (1400px ~ 1400px)
--------------------------------*/
@media only screen and (min-width: 769px) and (max-width: 1400px) {
  html {
    font-size: 0.5208333333vw;
  }
}


/*------------------------------------
≡≡≡≡≡≡≡≡≡≡≡ ▼ motion  ▼ ≡≡≡≡≡≡≡≡≡≡≡
------------------------------------*/
.LP_page .mv,
.LP_page .anim,
.LP_page .anim2,
.LP_page .mv_refill {
  opacity: 0;
}

.LP_page .mv {
margin-top: 0;
}

.LP_page .anim.anim_enable {
  -webkit-animation: fade 1s cubic-bezier(0.09, 0.26, 0.58, 1) forwards;
          animation: fade 1s cubic-bezier(0.09, 0.26, 0.58, 1) forwards;
}
@-webkit-keyframes fade {
  0% {
    opacity: 0;
    transform: translateY(calc(40 * (100vw/750)));
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fade {
  0% {
    opacity: 0;
    transform: translateY(calc(40 * (100vw/750)));
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.LP_page .mv.anim_enable {
  -webkit-animation: mv-fade 0.8s cubic-bezier(0.09, 0.26, 0.58, 1) forwards;
          animation: mv-fade 0.8s cubic-bezier(0.09, 0.26, 0.58, 1) forwards;
          animation-delay: 1s;
}
@-webkit-keyframes mv-fade {
  20% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes mv-fade {
  20% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.LP_page .message--textureimg {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

.LP_page .mv_refill.anim_enable {
  -webkit-animation: mv-refill 0.8s cubic-bezier(0.09, 0.26, 0.58, 1) forwards;
          animation: mv-refill 0.8s cubic-bezier(0.09, 0.26, 0.58, 1) forwards;
          animation-delay: 3.5s;
}
@-webkit-keyframes mv-refill {
  20% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes mv-refill {
  20% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* .LP_page : motion SP*/
/*# sourceMappingURL=style.css.map */


/* ===================
          SP
=================== */
.LP_page {
  color: var(--color-black);
  letter-spacing: 0.07em;
  /* font-feature-settings: "palt"; */
  background: #F2E7ED;
  text-align: center;
  padding-bottom: calc(60*(100vw / 390));
}

.LP_page .sp_only {
  display: block;
}
.LP_page .pc_only {
  display: none;
}

.LP_page .page_bg {
  position: fixed;
  background: url(../img/page_bg.png) no-repeat;
  background-size: cover;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: 0;
}

.main_content {
  overflow: hidden;
}

/* =============== MV =============== */
.LP_page .mv_blk {
  position: relative;
  width: 100%;
}

.LP_page .lead_text {
  margin-top: calc(30*(100vw / 390));
  font-family: var(--font-ja_write);
  font-size: calc(18*(100vw / 390));
  line-height: 2.27;
}

.js-loadfade {
  opacity: 0;
  transition: opacity 2.5s;
  animation: opa1 2s cubic-bezier(0.51, 0.21, 0.41, 1) 0s 1 forwards;
  -webkit-mask-image: linear-gradient(0deg, transparent, transparent 39.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, var(--color-black) 58.3333333333%, var(--color-black));
  mask-image: linear-gradient(0deg, transparent, transparent 39.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, var(--color-black) 58.3333333333%, var(--color-black));
  -webkit-mask-size: 100% max(300%, 100vh);
  mask-size: 100% max(300%, 100vh);
  -webkit-mask-position: center 100%;
  mask-position: center 100%;
  -webkit-mask-repeat: none;
  mask-repeat: none;
  transform: translateZ(0);
  transition: -webkit-mask-position 3s linear;
  transition: mask-position 3s linear;
  transition: mask-position 3s linear, -webkit-mask-position 3s linear;
}

.js-loadfade.active {
  opacity: 1;
  -webkit-mask-position: center 0;
  mask-position: center 0;
}

/* =============== nav_area =============== */
.LP_page .nav_area {
  margin: calc(30*(100vw / 390)) auto 0;
  width: calc(350*(100vw / 390));
}

.LP_page .nav_blk {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: calc(350*(100vw / 390));
  height: calc(62*(100vw / 390));
  font-family: var(--font-ja_write);
  font-size: calc(20*(100vw / 390));
  line-height: 1.5;
  letter-spacing: 0.02em;
  padding-top: calc(10*(100vw / 390));
  color: var(--color-white);
  z-index: 0;
}
.LP_page .nav_blk::after {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_btn.svg) no-repeat;
  background-size: 100%;
  width: calc(30*(100vw / 390));
  height: calc(30*(100vw / 390));
  top: calc(12*(100vw / 390));
  right: calc(30*(100vw / 390));
  z-index: 1;
}
.LP_page .nav_blk:nth-of-type(n+2) {
  margin-top: calc(25*(100vw / 390));
}
.LP_page .nav_blk:nth-of-type(3):after {
  top: calc(25*(100vw / 390));
}

.LP_page .nav_blk:nth-of-type(1) {
  background: url(../img/nav_bg_1.svg) no-repeat;
  background-size: 100%;
}
.LP_page .nav_blk:nth-of-type(1)::before {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_img_1.png) no-repeat;
  background-size: 100%;
  width: calc(88*(100vw / 390));
  height: calc(74*(100vw / 390));
  top: calc(-19*(100vw / 390));
  left: calc(17*(100vw / 390));
  z-index: 1;
}

.LP_page .nav_blk:nth-of-type(2) {
  background: url(../img/nav_bg_2.svg) no-repeat;
  background-size: 100%;
}
.LP_page .nav_blk:nth-of-type(2)::before {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_img_2.png) no-repeat;
  background-size: 100%;
  width: calc(62*(100vw / 390));
  height: calc(110*(100vw / 390));
  top: calc(-23*(100vw / 390));
  left: calc(24*(100vw / 390));
  z-index: 1;
}

.LP_page .nav_blk:nth-of-type(3) {
  background: url(../img/nav_bg_3.svg) no-repeat;
  background-size: 100%;
  height: calc(89*(100vw / 390));
}
.LP_page .nav_blk:nth-of-type(3)::before {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_img_3.png) no-repeat;
  background-size: 100%;
  width: calc(60*(100vw / 390));
  height: calc(94*(100vw / 390));
  top: calc(4*(100vw / 390));
  left: calc(13*(100vw / 390));
  z-index: 1;
}


/* =============== content =============== */
.LP_page .comics_area {
  margin-top: calc(100*(100vw / 390));
  position: relative;
  background: url(../img/content_bg.jpg);
  background-size: 100%;
  padding: calc(40*(100vw / 390)) 0;
  z-index: 0;
}
.LP_page .comics_area::before {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: calc(10*(100vw / 390));
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  border-left: unset;
  border-right: unset;
  background: var(--color-pink);
  top: 0;
  left: 0;
  z-index: 1;
}
.LP_page .comics_area::after {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: calc(10*(100vw / 390));
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  border-left: unset;
  border-right: unset;
  background: var(--color-pink);
  bottom: 0;
  left: 0;
  z-index: 1;

}

.LP_page .comics_area h2 {
  position: absolute;
  font-family: var(--font-Antro_Vectra);
  font-size: calc(110*(100vw / 390));
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--color-white);
  top: calc(-110*(100vw / 390));
  right: calc(5*(100vw / 390));
  z-index: 1;
}

.LP_page .comics_area .comics {
  position: relative;
  width: calc(350*(100vw / 390));
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  margin: auto;
  z-index: 0;
}

.LP_page .comics_area .comics:nth-of-type(n+2) {
  margin-top: calc(20*(100vw / 390));
}

.LP_page .comics_area.part1 .comics_bg {
  width: 100%;
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  border-left: unset;
  border-right: unset;
  padding: calc(30*(100vw / 390)) 0;
  margin: calc(20*(100vw / 390)) auto;
  background: url(../img/comics_part1_3_bg.jpg) no-repeat;
  background-size: 100%;
}

.LP_page .comics_area.part1 .comics:nth-of-type(4) .clip {
  position: absolute;
  display: block;
  content: "";
  transform: rotate(-5deg);
  width: calc(60*(100vw / 390));
  height: calc(110*(100vw / 390));
  bottom: calc(60*(100vw / 390));
  right: calc(120*(100vw / 390));
  animation: colorRotation 10s linear infinite;
  background: linear-gradient(326deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 10%, rgb(255, 255, 255) 32%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 0) 100%);
  background-size: 110% 750%;
  z-index: 1;
}

@keyframes colorRotation {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  10.9% {
    opacity: 1;
  }
  11% {
    background-position: bottom -20% right -20%;
  }
  19% {
    background-position: top 0% left -20%;
  }
  19.1% {
    opacity: 1;
  }
  20% {
    opacity: 0;
  }
}

/* =============== item_area =============== */
.LP_page .item_area {
  position: relative;
  margin-top: calc(35*(100vw / 390));
  z-index: 0;
}

.LP_page .item_area .item_ttl {
  width: calc(325*(100vw / 390));
  margin: auto;
}

.LP_page .item_area h3 {
  position: relative;
  text-align: center;
  margin-top: calc(70*(100vw / 390));
  font-size: calc(18*(100vw / 390));
  font-weight: bold;
  line-height: 1.7;
  color: var(--color-pink_2);
  z-index: 0;
}
.LP_page .item_area h3::before {
  position: absolute;
  display: block;
  content: "item";
  font-family: var(--font-Antro_Vectra);
  font-size: calc(120*(100vw / 390));
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--color-white);
  top: calc(-97*(100vw / 390));
  left: 50%;
  transform: translateX(-50%) rotate(-10deg);
  z-index: -1;
}

.LP_page .item_area .item_img {
  width: calc(280*(100vw / 390));
  margin: calc(30*(100vw / 390)) auto 0;
}

.LP_page .item_blk {
  position: relative;
  width: calc(280*(100vw / 390));
  margin: calc(-20*(100vw / 390)) 0 0 calc(35*(100vw / 390));
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  background: var(--color-pink_item);
  z-index: 1;
}

.LP_page .item_blk .brand {
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: var(--font-Futura);
  font-size: calc(15*(100vw / 390));
  width: 100%;
  height: calc(30*(100vw / 390));
  border-bottom: var(--color-black) calc(1*(100vw / 390)) solid;
}

.LP_page .item_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}

.LP_page .item_wrap .name {
  width: 64%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  font-family: var(--font-ja);
  font-size: calc(12*(100vw / 390));
  line-height: 1.5;
  letter-spacing: 0.02em;
  padding: calc(10*(100vw / 390)) 0 calc(10*(100vw / 390)) calc(10*(100vw / 390));
  border-right: var(--color-black) calc(1*(100vw / 390)) solid;
}

.LP_page .item_wrap .price {
  width: 31%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  font-family: var(--font-Futura);
  font-size: calc(14*(100vw / 390));
  letter-spacing: 0;
  padding-left: calc(15*(100vw / 390));
}

.LP_page .item_wrap .tax {
  font-size: calc(9*(100vw / 390));
  padding: calc(2*(100vw / 390)) 0 0 calc(2*(100vw / 390));
}

.LP_page .item_point {
  position: relative;
  text-align: left;
  width: calc(315*(100vw / 390));
  padding: calc(20*(100vw / 390)) calc(15*(100vw / 390));
  margin: calc(20*(100vw / 390)) 0 0 calc(20*(100vw / 390));
  font-family: var(--font-ja);
  font-size: calc(13*(100vw / 390));
  letter-spacing: 0.02em;
  line-height: 2;
  color: var(--color-white);
  background: var(--color-blue);
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  z-index: auto;
}
.LP_page .item_point::before {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/page_point.png) no-repeat;
  background-size: 100%;
  width: calc(85*(100vw / 390));
  height: calc(66*(100vw / 390));
  top: calc(-33*(100vw / 390));
  right: calc(-25*(100vw / 390));
  z-index: 1;
}
.LP_page .item_point::after {
  position: absolute;
  display: block;
  content: "";
  background: var(--color-white);
  width: 100%;
  height: 100%;
  top: calc(5*(100vw / 390));
  right: calc(-7*(100vw / 390));
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  z-index: -1;
}

.LP_page .page_btn {
  display: inline-block;
  margin-top: calc(30*(100vw / 390));
  padding: calc(16*(100vw / 390)) calc(110*(100vw / 390));
  background-color: var(--color-pink_2);
  box-shadow: calc(5*(100vw / 390)) calc(5*(100vw / 390)) 0 #8B5761;
  border-radius: calc(30*(100vw / 390));
  border: #8B5761 calc(1*(100vw / 390)) solid;
  font-family: var(--font-Futura);
  font-size: calc(20*(100vw / 390));
  letter-spacing: 0.1em;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
}

.LP_page .modal-toggle {
  position: relative;
  margin: calc(40*(100vw / 390)) auto 0;
  width: calc(320*(100vw / 390));
  height: calc(65*(100vw / 390));
  border-radius: calc(35*(100vw / 390));
  background: var(--color-red);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-family: var(--font-ja);
  font-size: calc(16*(100vw / 390));
  padding: calc(5*(100vw / 390)) 0 0 calc(30*(100vw / 390));
  letter-spacing: 0.05em;
  color: var(--color-white);
  z-index: 0;
}
.LP_page .modal-toggle::before {
  position: absolute;
  content: "";
  background: url(../img/trilogy_icon.svg) no-repeat;
  background-size: 100%;
  width: calc(28*(100vw / 390));
  height: calc(28*(100vw / 390));
  top: calc(20*(100vw / 390));
  right: calc(25*(100vw / 390));
  z-index: 1;
}


/*------------------------------------
≡≡≡≡≡≡≡≡≡≡≡≡ ▼ modal SP ▼ ≡≡≡≡≡≡≡≡≡≡≡≡
------------------------------------*/
body.fixd {
  overflow: hidden;
}

.fixd .modal_area {
  position: fixed;
  top: 0;
  overflow: hidden;
  width: 100vw;
  height: 100vh;
  visibility: visible;
  z-index: 1000;
}

.modal {
  overflow: hidden;
  max-height: 0;
}

.open.modal {
  overflow: visible;
  max-height: 100%;
}

.modal {
  font-style: normal;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
}
.modal img {
  width: 100%;
  height: auto;
}
.modal .modal_bg {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(181, 126, 132, 0.6);
  background-size: cover;
  z-index: -1;
}
.modal .modal_content {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: calc(350 * 100vw/390);
  background: var(--color-white);
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  padding: calc(30*(100vw / 390)) calc(25*(100vw / 390));
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  box-sizing: border-box;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  z-index: 1;
  /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
  -ms-overflow-style: none;
  /*Firefoxへの対応*/
  scrollbar-width: none;
  /*Google Chrome、Safariへの対応*/
}
.modal .modal_content::-webkit-scrollbar {
  display: none;
}
.modal .modal_top {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: calc(-75* 100vw / 390);
  right: calc(15* 100vw / 390);
  cursor: pointer;
  line-height: 1;
  width: calc(30* 100vw / 390);
  height: calc(30* 100vw / 390);
  z-index: 2;
}

/* .modal .modal_inner {
  width: calc(350 * 100vw/390);
  background: var(--color-white);
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  padding: calc(30*(100vw / 390)) calc(25*(100vw / 390));
} */

.modal .modal_inner .ttl {
  text-align: center;
  font-family: var(--font-Futura);
  font-size: calc(24 * 100vw/390);
  letter-spacing: 0.1em;
}

.modal .modal_inner .img {
  width: 100%;
  line-height: 0;
  margin-top: calc(20* 100vw / 390);
  border: var(--color-black) calc(1*(100vw / 390)) solid;
}

.modal .modal_inner .text {
  width: calc(255* 100vw / 390);
  margin-top: calc(10* 100vw / 390);
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  background: #F5F5F5;
  padding: calc(20* 100vw / 390);
  font-family: var(--font-ja);
  font-size: calc(12* 100vw / 390);
  letter-spacing: 0.07em;
  line-height: 1.5;
}

.modal .page_btn {
  display: inline-block;
  margin-top: calc(30*(100vw / 390));
  padding: calc(15*(100vw / 390)) calc(56*(100vw / 390));
  background-color: var(--color-red);
  box-shadow: calc(5*(100vw / 390)) calc(5*(100vw / 390)) 0 #8E2A3A;
  border-radius: calc(30*(100vw / 390));
  border: #8E2A3A calc(1*(100vw / 390)) solid;
  font-family: var(--font-Futura);
  font-size: calc(16*(100vw / 390));
  letter-spacing: 0.1em;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
}


/* =============== subitem_area =============== */
.LP_page .subitem_area {
  position: relative;
  text-align: center;
  margin-top: calc(40*(100vw / 390));
  border-top: var(--color-black) calc(1*(100vw / 390)) solid;
  background: var(--color-pink);
  padding: calc(30*(100vw / 390)) 0;
  z-index: 0;
}

.LP_page .subitem_area .ttl {
  position: relative;
  display: inline-block;
  font-family: var(--font-ja);
  font-size: calc(15*(100vw / 390));
  font-weight: 700;
  line-height: 1.7;
  z-index: 0;
}
.LP_page .subitem_area .ttl::before {
  position: absolute;
  content: "";
  width: calc(1*(100vw / 390));
  height: calc(45*(100vw / 390));
  background: var(--color-black);
  top: calc(10*(100vw / 390));
  left: calc(-15*(100vw / 390));
  transform: rotate(-35deg);
  z-index: 1;
}
.LP_page .subitem_area .ttl::after {
  position: absolute;
  content: "";
  width: calc(1*(100vw / 390));
  height: calc(45*(100vw / 390));
  background: var(--color-black);
  top: calc(10*(100vw / 390));
  right: calc(-15*(100vw / 390));
  transform: rotate(35deg);
  z-index: 1;
}

.LP_page .subitem_area .ttl.__2::before {
  left: calc(-25*(100vw / 390));
}

.LP_page .subitem_area .ttl.__2::after {
  right: calc(-25*(100vw / 390));
}

.LP_page .subitem_area .visual_blk {
  width: calc(254*(100vw / 390));
  background: var(--color-white);
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  padding: calc(15*(100vw / 390)) calc(15*(100vw / 390)) calc(30*(100vw / 390));
  margin: 0 calc(10*(100vw / 390));
}

.LP_page .subitem_area .img {
  width: 100%;
  border: var(--color-black) calc(1*(100vw / 390)) solid;
}

.LP_page .subitem_area .item_inner {
  position: relative;
  margin: calc(-10*(100vw / 390)) auto 0;
  padding-bottom: calc(10*(100vw / 390));
  width: calc(200*(100vw / 390));
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  background: #FFFAFB;
  z-index: 1;
}

.LP_page .subitem_area .item_inner .brand {
  font-family: var(--font-Futura);
  font-size: calc(15*(100vw / 390));
  padding: calc(7*(100vw / 390)) 0 calc(6*(100vw / 390));
  border-bottom: var(--color-black) calc(1*(100vw / 390)) solid;
}

.LP_page .subitem_area .item_inner .name {
  font-family: var(--font-ja);
  font-size: calc(12*(100vw / 390));
  line-height: 1.5;
  margin-top: calc(10*(100vw / 390));
}

.LP_page .subitem_area .item_inner .price {
  font-family: var(--font-Futura);
  font-size: calc(14*(100vw / 390));
  margin-top: calc(10*(100vw / 390));
}

.LP_page .subitem_area .item_inner .price .tax {
  font-size: calc(9*(100vw / 390));
  padding-left: calc(5*(100vw / 390));
}

.LP_page .visual_blk .text {
  width: 87%;
  text-align: left;
  margin-top: calc(15*(100vw / 390));
  padding: calc(15*(100vw / 390));
  font-family: var(--font-ja);
  font-size: calc(12*(100vw / 390));
  line-height: 1.7;
  background: #FFFAFB;
}

.LP_page .subitem_area .page_btn {
  display: inline-block;
  margin-top: calc(20*(100vw / 390));
  padding: calc(10*(100vw / 390)) calc(54*(100vw / 390));
  background-color: var(--color-pink_2);
  box-shadow: calc(5*(100vw / 390)) calc(5*(100vw / 390)) 0 #8B5761;
  border-radius: calc(30*(100vw / 390));
  border: #8B5761 calc(1*(100vw / 390)) solid;
  font-family: var(--font-Futura);
  font-size: calc(16*(100vw / 390));
  letter-spacing: 0.1em;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
}

.LP_page .slick-track {
  display: flex;
}
.LP_page .slick-slide {
  height: auto !important;
}

.LP_page .visual{
  position: relative;
  z-index: 0;
  margin-top: calc(30*(100vw / 390));
}

.LP_page .visual_2 {
  position: relative;
  z-index: 0;
  margin-top: calc(30*(100vw / 390));
}

.LP_page .subitems_wrap {
  position: relative;
  z-index: 0;
}

.LP_page .arrow_box_01 ,
.LP_page .arrow_box_02 {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(350*(100vw / 390));
  margin: calc(-50*(100vw / 390)) auto 0;
  top: calc(300*(100vw / 390));
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}

.LP_page .prev-arrow,
.LP_page .next-arrow {
  display: block;
  width: calc(40*(100vw / 390));
  height: calc(40*(100vw / 390));
  transition: all .3s ease;
  cursor: pointer;
  position:relative;
}

.LP_page .next-arrow {
  background: url(../img/page_arrow_right.png);
  background-size: 100%;
}
.LP_page .prev-arrow {
  background: url(../img/page_arrow_left.png);
  background-size: 100%;
}


/* =============== comics_area part2 =============== */
.LP_page .comics_area.part2 {
  margin-top: 0;
}

.LP_page .box--1 {
  position: absolute;
  top: calc(117*(100vw / 390));
  left: calc(70*(100vw / 390));
  width: calc(20*(100vw / 390));
  height: calc(50*(100vw / 390));
  z-index: 2;
}
.LP_page .clip {
  display: block;
  width: 100%;
  height: calc(47*(100vw / 390));
  position: relative;
  z-index: 0;
}
.LP_page .clip::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-animation: colorRotation 10s linear infinite;
  animation: colorRotation 10s linear infinite;
  background: linear-gradient(326deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 10%, rgb(255, 255, 255) 32%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 0) 100%);
  background-size: 110% 750%;
  mask-image: url(../img/clip-path_1.svg);
  mask-repeat: no-repeat;
  mask-size: 100%;
  z-index: 1;
}

.LP_page .box--2 {
  position: absolute;
  top: calc(104*(100vw / 390));
  left: calc(97*(100vw / 390));
  width: calc(26*(100vw / 390));
  height: calc(60*(100vw / 390));
  z-index: 2;
}
.LP_page .clip.clip--2 {
  height: 100%;
}
.LP_page .clip.clip--2::after {
  mask-image: url(../img/clip-path_2.svg);
}

.LP_page .item_area .item_1_ttl {
  margin-top: calc(80*(100vw / 390));
}
.LP_page .item_area .item_1_ttl::before {
  content: "item1";
  font-size: calc(110*(100vw / 390));
  top: calc(-77*(100vw / 390));
}

.LP_page .item_area .item_2_ttl {
  margin-top: calc(110*(100vw / 390));
}
.LP_page .item_area .item_2_ttl::before {
  content: "item2";
  font-size: calc(110*(100vw / 390));
  top: calc(-77*(100vw / 390));
}

/* =============== comics_area part3 =============== */
.LP_page .comics_area.part3 {
  margin-top: 0;
}

/* =============== bottom area =============== */
.LP_page .bottom_area {
  margin: calc(60*(100vw / 390)) auto 0;
  width: calc(350*(100vw / 390));
}

.LP_page .bottom_area .bottom_blk {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: calc(350*(100vw / 390));
  height: calc(62*(100vw / 390));
  font-family: var(--font-ja_write);
  font-size: calc(20*(100vw / 390));
  line-height: 1.5;
  letter-spacing: 0.02em;
  padding-top: calc(10*(100vw / 390));
  color: var(--color-white);
  z-index: 0;
}
.LP_page .bottom_area .bottom_blk::after {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_btn.svg) no-repeat;
  background-size: 100%;
  width: calc(30*(100vw / 390));
  height: calc(30*(100vw / 390));
  top: calc(12*(100vw / 390));
  right: calc(30*(100vw / 390));
  transform: rotate(180deg);
  z-index: 1;
}
.LP_page .bottom_area .bottom_blk:nth-of-type(n+2) {
  margin-top: calc(30*(100vw / 390));
}

.LP_page .bottom_area .bottom_blk:nth-of-type(1) {
  background: url(../img/nav_bg_1.svg) no-repeat;
  background-size: 100%;
}

.LP_page .bottom_area .bottom_blk:nth-of-type(2) {
  background: url(../img/bottom_bg.svg) no-repeat;
  background-size: 100%;
  justify-content: flex-start;
  padding-left: calc(25*(100vw / 390));
  width: calc(325*(100vw / 390));
}
.LP_page .bottom_area .bottom_blk:nth-of-type(2)::after {
  transform: rotate(-90deg);
}

.LP_page .organicday_banner {
  position: relative;
  width: calc(325*(100vw / 390));
  margin: calc(40*(100vw / 390)) auto 0;
  z-index: 0;
}


/* =============== follow-nav =============== */
.LP_page .follow_nav {
  position: fixed;
  display: flex;
  align-items: center;
  transition: all 0.6s 0.2s ease;
  bottom: calc(-100 * 100vw/390);
  left: calc(0 * 100vw/390);
  opacity: 0;
  visibility: hidden;
  box-sizing: border-box;
  width: 100%;
  border-top: var(--color-black) calc(1*(100vw / 390)) solid;
}

.LP_page .follow_nav a {
  position: relative;
  display: block;
  font-family: var(--font-ja_write);
  font-size: calc(15* 100vw / 390);
  letter-spacing: 0;
  padding: calc(20* 100vw / 390) 0 calc(20* 100vw / 390) calc(16* 100vw / 390);
  color: var(--color-white);
  z-index: 0;
  width: calc(130* 100vw / 390);
}

.LP_page .follow_nav a:hover {
  opacity: 1;
}

.LP_page .follow_nav a:nth-of-type(1) {
  background: var(--color-pink_2);
}
.LP_page .follow_nav a:nth-of-type(1)::before {
  position: absolute;
  content: "";
  background: url(../img/nav_img_1.png) no-repeat;
  background-size: 100%;
  width: calc(30* 100vw / 390);
  height: calc(25* 100vw / 390);
  top: calc(16* 100vw / 390);
  left: calc(3* 100vw / 390);
  z-index: 1;
}

.LP_page .follow_nav a:nth-of-type(2) {
  background: var(--color-blue);
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  border-top: unset;
  border-bottom: unset;
}
.LP_page .follow_nav a:nth-of-type(2)::before {
  position: absolute;
  content: "";
  background: url(../img/nav_img_2.png) no-repeat;
  background-size: 100%;
  width: calc(22* 100vw / 390);
  height: calc(44* 100vw / 390);
  top: calc(14* 100vw / 390);
  left: calc(8* 100vw / 390);
  z-index: 1;
}


.LP_page .follow_nav a:nth-of-type(3) {
  background: var(--color-purple);
}
.LP_page .follow_nav a:nth-of-type(3)::before {
  position: absolute;
  content: "";
  background: url(../img/nav_img_3.png) no-repeat;
  background-size: 100%;
  width: calc(24* 100vw / 390);
  height: calc(40* 100vw / 390);
  top: calc(14* 100vw / 390);
  left: calc(7* 100vw / 390);
  z-index: 1;
}

.LP_page .follow_nav.up-active {
  visibility: visible;
  opacity: 1;
  z-index: 10;
  bottom: calc(0 * 100vw/390);
}

.LP_page .follow_nav.down-active {
  visibility: visible;
  opacity: 0;
  z-index: 10;
}


.LP_page .follow_banner {
  position: fixed;
  align-items: center;
  transition: all 0.6s 0.2s ease;
  bottom: calc(75 * 100vw/390);
  right: calc(-100 * 100vw/390);
  opacity: 0;
  visibility: hidden;
  box-sizing: border-box;
  width: calc(200 * 100vw/390);
}
.LP_page .follow_banner.up-active {
  visibility: visible;
  opacity: 1;
  z-index: 10;
  right: calc(0 * 100vw/390);
}
.LP_page .follow_banner.down-active {
  visibility: visible;
  opacity: 0;
  z-index: 10;
}

.LP_page .follow_banner.hidden {
  display: none;
}

.LP_page .follow_banner_close {
  display: block;
  position: absolute;
  width: calc(25* 100vw / 390);
  top: calc(-5* 100vw / 390);
  right: calc(20* 100vw / 390);
  z-index: 10;
}




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

@media only screen and (min-width: 769px) {
  .LP_page .sp_only {
    display: none;
  }
  .LP_page .pc_only {
    display: block;
  }

  .LP_page {
    padding-bottom: 0;
}

  .LP_page .page_bg {
    position: fixed;
    background: url(../img/page_bg_pc.png) no-repeat;
    background-size: cover;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 0;
}

  .LP_page .page_content {
    display: flex;
    justify-items: center;
    padding-bottom: 0;
  }

  .LP_page .main_content {
    width: calc(480*(100vw / 1400));
    max-width: calc(480*(100vw / 1400));
    margin: auto;
    background: var(--color-pink);
    border: var(--color-black) calc(1*(100vw / 1400)) solid;
    border-top: unset;
    border-bottom: unset;
    padding-bottom: calc(80*(100vw / 1400));
  }

  .LP_page .tokyo_area ,
  .LP_page .nav_area_pc {
    width: calc(460*(100vw / 1400));
  }

  .LP_page .tokyo_area {
    position: sticky;
    height: 100vh;
    background: url(../img/bg_pc_1.jpg) no-repeat;
    background-size: cover;
    top: 0;
    left: 0;
    z-index: 10;
  }

  .LP_page .tokyo_area .info {
    width: calc(270*(100vw / 1400));
    margin: calc(150*(100vw / 1400)) calc(20*(100vw / 1400)) 0 auto;
    animation: yurayura 10s linear infinite;
  }

  @keyframes yurayura {
    0% , 100%{
        transform: translateY(0);
    }
    50%{
      transform: translateY(-20px);
    }
  }


  @keyframes infinity-scroll-left {
    from {
      transform: translateX(0);
    }
      to {
      transform: translateX(-100%);
    }
    }
    .scroll-infinity {
      margin-top: calc(300*(100vw / 1400));
    }
    .scroll-infinity__wrap {
      display: flex;
      overflow: hidden;
    }
    .scroll-infinity__list {
      display: flex;
      list-style: none;
      padding: 0
    }
    .scroll-infinity__list--left {
      animation: infinity-scroll-left 100s infinite linear 0.5s both;
    }
    .scroll-infinity__item {
      width: calc(450*(100vw / 1400));
    }
    .scroll-infinity__item>img {
      width: 100%;
    }


  .LP_page .nav_area_pc {
    position: sticky;
    height: 100vh;
    background: url(../img/bg_pc_2.jpg) no-repeat;
    background-size: cover;
    top: 0;
    left: 0;
    z-index: 10;
  }

  .LP_page .nav_area {
    position: relative;
    margin: auto;
    width: calc(328*(100vw / 1400));
    top: 50%;
    transform: translateY(-50%);
    z-index: 0;
  }

  .LP_page .nav_top {
    position: sticky;
    padding: 0 0 0 23%;
    height: calc(40rem / 1.5);
    top: calc(68.8rem / 1.5);
    left: 0;
  }

  .LP_page .nav_top a {
    font-family: var(--font-AlrightSans-Bold);
    font-size: calc(28*(100vw / 1400));
    color: var(--color-green);
    display: flex;
    align-items: center;

  }

  .LP_page .nav_top a span {
    display: inline-block;
    font-size: calc(15*(100vw 1400));
    color: var(--color-black);
    padding-left: calc(20*(100vw 1400));
  }

  .LP_page .nav_top li:nth-of-type(n+2) {
    margin-top: calc(45*(100vw 1400));
  }


/* =============== MV =============== */
.LP_page .mv_blk {
  position: relative;
  width: 100%;
}

.LP_page .lead_text {
  margin-top: calc(30*(100vw / 1400));
  font-family: var(--font-ja_write);
  font-size: calc(20*(100vw / 1400));
  line-height: 2.27;
}

.js-loadfade {
  opacity: 0;
  transition: opacity 2.5s;
  animation: opa1 2s cubic-bezier(0.51, 0.21, 0.41, 1) 0s 1 forwards;
  -webkit-mask-image: linear-gradient(0deg, transparent, transparent 39.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, var(--color-black) 58.3333333333%, var(--color-black));
  mask-image: linear-gradient(0deg, transparent, transparent 39.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, var(--color-black) 58.3333333333%, var(--color-black));
  -webkit-mask-size: 100% max(300%, 100vh);
  mask-size: 100% max(300%, 100vh);
  -webkit-mask-position: center 100%;
  mask-position: center 100%;
  -webkit-mask-repeat: none;
  mask-repeat: none;
  transform: translateZ(0);
  transition: -webkit-mask-position 3s linear;
  transition: mask-position 3s linear;
  transition: mask-position 3s linear, -webkit-mask-position 3s linear;
}

.js-loadfade.active {
  opacity: 1;
  -webkit-mask-position: center 0;
  mask-position: center 0;
}

/* =============== nav_area =============== */

.LP_page .nav_blk {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: calc(350*(100vw / 1400));
  height: calc(62*(100vw / 1400));
  font-family: var(--font-ja_write);
  font-size: calc(20*(100vw / 1400));
  line-height: 1.5;
  letter-spacing: 0.02em;
  padding-top: calc(10*(100vw / 1400));
  color: var(--color-white);
  z-index: 0;
}
.LP_page .nav_blk::after {
  display: none;
}
.LP_page .nav_blk:nth-of-type(n+2) {
  margin-top: calc(80*(100vw / 1400));
}
.LP_page .nav_blk:nth-of-type(3):after {
  top: calc(25*(100vw / 1400));
}

.LP_page .nav_blk:nth-of-type(1) {
  background: url(../img/nav_bg_1.svg) no-repeat;
  background-size: 100%;
}
.LP_page .nav_blk:nth-of-type(1)::before {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_img_1.png) no-repeat;
  background-size: 100%;
  width: calc(88*(100vw / 1400));
  height: calc(74*(100vw / 1400));
  top: calc(-19*(100vw / 1400));
  left: calc(17*(100vw / 1400));
  z-index: 1;
}

.LP_page .nav_blk:hover::before {
  animation: yurayura_2 2s linear infinite;
}

@keyframes yurayura_2 {
  0% , 100%{
    transform: rotate(5deg);
  }
  50%{
      transform: rotate(-5deg);
  }
}

.LP_page .nav_blk:nth-of-type(2) {
  background: url(../img/nav_bg_2.svg) no-repeat;
  background-size: 100%;
}
.LP_page .nav_blk:nth-of-type(2)::before {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_img_2.png) no-repeat;
  background-size: 100%;
  width: calc(62*(100vw / 1400));
  height: calc(110*(100vw / 1400));
  top: calc(-23*(100vw / 1400));
  left: calc(24*(100vw / 1400));
  z-index: 1;
}

.LP_page .nav_blk:nth-of-type(3) {
  background: url(../img/nav_bg_3.svg) no-repeat;
  background-size: 100%;
  height: calc(89*(100vw / 1400));
}
.LP_page .nav_blk:nth-of-type(3)::before {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_img_3.png) no-repeat;
  background-size: 100%;
  width: calc(60*(100vw / 1400));
  height: calc(94*(100vw / 1400));
  top: calc(4*(100vw / 1400));
  left: calc(13*(100vw / 1400));
  z-index: 1;
}


/* =============== content =============== */
.LP_page .comics_area {
  margin-top: calc(100*(100vw / 1400));
  position: relative;
  background: url(../img/content_bg.jpg);
  background-size: 100%;
  padding: calc(40*(100vw / 1400)) 0;
  z-index: 0;
}
.LP_page .comics_area::before {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: calc(10*(100vw / 1400));
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  border-left: unset;
  border-right: unset;
  background: var(--color-pink);
  top: 0;
  left: 0;
  z-index: 1;
}
.LP_page .comics_area::after {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: calc(10*(100vw / 1400));
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  border-left: unset;
  border-right: unset;
  background: var(--color-pink);
  bottom: 0;
  left: 0;
  z-index: 1;

}

.LP_page .comics_area h2 {
  position: absolute;
  font-family: var(--font-Antro_Vectra);
  font-size: calc(134*(100vw / 1400));
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--color-white);
  top: calc(-130*(100vw / 1400));
  right: calc(5*(100vw / 1400));
  z-index: 1;
}

.LP_page .comics_area .comics {
  position: relative;
  width: calc(440*(100vw / 1400));
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  margin: auto;
  z-index: 0;
}

.LP_page .comics_area .comics:nth-of-type(n+2) {
  margin-top: calc(20*(100vw / 1400));
}

.LP_page .comics_area.part1 .comics_bg {
  width: 100%;
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  border-left: unset;
  border-right: unset;
  padding: calc(30*(100vw / 1400)) 0;
  margin: calc(20*(100vw / 1400)) auto;
  background: url(../img/comics_part1_3_bg.jpg) no-repeat;
  background-size: cover;
}

.LP_page .comics_area.part1 .comics:nth-of-type(4) .clip {
  position: absolute;
  display: block;
  content: "";
  transform: rotate(-5deg);
  width: calc(80*(100vw / 1400));
  height: calc(140*(100vw / 1400));
  bottom: calc(80*(100vw / 1400));
  right: calc(150*(100vw / 1400));
  animation: colorRotation 10s linear infinite;
  background: linear-gradient(326deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 10%, rgb(255, 255, 255) 32%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 0) 100%);
  background-size: 110% 750%;
  z-index: 1;
}

@keyframes colorRotation {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  10.9% {
    opacity: 1;
  }
  11% {
    background-position: bottom -20% right -20%;
  }
  19% {
    background-position: top 0% left -20%;
  }
  19.1% {
    opacity: 1;
  }
  20% {
    opacity: 0;
  }
}

/* =============== item_area =============== */
.LP_page .item_area {
  position: relative;
  margin-top: calc(35*(100vw / 1400));
  z-index: 0;
}

.LP_page .item_area .item_ttl {
  width: calc(395*(100vw / 1400));
  margin: auto;
}

.LP_page .item_area h3 {
  position: relative;
  text-align: center;
  margin-top: calc(70*(100vw / 1400));
  font-size: calc(21*(100vw / 1400));
  font-weight: bold;
  line-height: 1.7;
  color: var(--color-pink_2);
  z-index: 0;
}
.LP_page .item_area h3::before {
  position: absolute;
  display: block;
  content: "item";
  font-family: var(--font-Antro_Vectra);
  font-size: calc(146*(100vw / 1400));
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--color-white);
  top: calc(-107*(100vw / 1400));
  left: 50%;
  transform: translateX(-50%) rotate(-10deg);
  z-index: -1;
}

.LP_page .item_area .item_img {
  width: calc(280*(100vw / 1400));
  margin: calc(30*(100vw / 1400)) auto 0;
}

.LP_page .item_blk {
  position: relative;
  width: calc(335*(100vw / 1400));
  margin: calc(-20*(100vw / 1400)) 0 0 calc(35*(100vw / 1400));
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  background: var(--color-pink_item);
  z-index: 1;
}

.LP_page .item_blk .brand {
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: var(--font-Futura);
  font-size: calc(18*(100vw / 1400));
  width: 100%;
  height: calc(30*(100vw / 1400));
  border-bottom: var(--color-black) calc(1*(100vw / 1400)) solid;
}

.LP_page .item_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}

.LP_page .item_wrap .name {
  width: 64%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  font-family: var(--font-ja);
  font-size: calc(14*(100vw / 1400));
  line-height: 1.5;
  letter-spacing: 0.02em;
  padding: calc(10*(100vw / 1400)) 0 calc(10*(100vw / 1400)) calc(10*(100vw / 1400));
  border-right: var(--color-black) calc(1*(100vw / 1400)) solid;
}

.LP_page .item_wrap .price {
  width: 31%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  font-family: var(--font-Futura);
  font-size: calc(17*(100vw / 1400));
  letter-spacing: 0;
  padding-left: calc(15*(100vw / 1400));
}

.LP_page .item_wrap .tax {
  font-size: calc(11*(100vw / 1400));
  padding: calc(2*(100vw / 1400)) 0 0 calc(2*(100vw / 1400));
}

.LP_page .item_point {
  position: relative;
  text-align: left;
  width: calc(390*(100vw / 1400));
  padding: calc(20*(100vw / 1400)) calc(15*(100vw / 1400));
  margin: calc(20*(100vw / 1400)) 0 0 calc(25*(100vw / 1400));
  font-family: var(--font-ja);
  font-size: calc(13*(100vw / 1400));
  letter-spacing: 0.02em;
  line-height: 2;
  color: var(--color-white);
  background: var(--color-blue);
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  z-index: auto;
}
.LP_page .item_point::before {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/page_point.png) no-repeat;
  background-size: 100%;
  width: calc(85*(100vw / 1400));
  height: calc(66*(100vw / 1400));
  top: calc(-33*(100vw / 1400));
  right: calc(-25*(100vw / 1400));
  z-index: 1;
}
.LP_page .item_point::after {
  position: absolute;
  display: block;
  content: "";
  background: var(--color-white);
  width: 100%;
  height: 100%;
  top: calc(5*(100vw / 1400));
  right: calc(-7*(100vw / 1400));
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  z-index: -1;
}

.LP_page .page_btn {
  display: inline-block;
  margin-top: calc(30*(100vw / 1400));
  padding: calc(20*(100vw / 1400)) calc(140*(100vw / 1400));
  background-color: var(--color-pink_2);
  box-shadow: calc(5*(100vw / 1400)) calc(5*(100vw / 1400)) 0 #8B5761;
  border-radius: calc(50*(100vw / 1400));
  border: #8B5761 calc(1*(100vw / 1400)) solid;
  font-family: var(--font-Futura);
  font-size: calc(24*(100vw / 1400));
  letter-spacing: 0.1em;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
}

.LP_page .page_btn:hover {
  box-shadow: calc(0*(100vw / 1400)) calc(0*(100vw / 1400)) 0 #8B5761;
  transform: translate(calc(5*(100vw / 1400))), calc(5*(100vw / 1400));
  opacity: 1;
}


.LP_page .modal-toggle {
  position: relative;
  margin: calc(40*(100vw / 1400)) auto 0;
  width: calc(420*(100vw / 1400));
  height: calc(80*(100vw / 1400));
  border-radius: calc(50*(100vw / 1400));
  background: var(--color-red);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-family: var(--font-ja);
  font-size: calc(20*(100vw / 1400));
  padding: calc(5*(100vw / 1400)) 0 0 calc(30*(100vw / 1400));
  letter-spacing: 0.05em;
  color: var(--color-white);
  z-index: 0;
}
.LP_page .modal-toggle::before {
  position: absolute;
  content: "";
  background: url(../img/trilogy_icon.svg) no-repeat;
  background-size: 100%;
  width: calc(35*(100vw / 1400));
  height: calc(35*(100vw / 1400));
  top: calc(25*(100vw / 1400));
  right: calc(40*(100vw / 1400));
  z-index: 1;
}

.LP_page .modal-toggle:hover::before {
  transform: rotate(180deg);
  transition: all 1s;
}


/*------------------------------------
≡≡≡≡≡≡≡≡≡≡≡≡ ▼ modal SP ▼ ≡≡≡≡≡≡≡≡≡≡≡≡
------------------------------------*/
body.fixd {
  overflow: hidden;
}

.fixd .modal_area {
  position: fixed;
  top: 0;
  overflow: hidden;
  width: 100vw;
  height: 100vh;
  visibility: visible;
  z-index: 1000;
}

.modal {
  overflow: hidden;
  max-height: 0;
}

.open.modal {
  overflow: visible;
  max-height: 100%;
}

.modal {
  font-style: normal;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
}
.modal img {
  width: 100%;
  height: auto;
}
.modal .modal_bg {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(181, 126, 132, 0.6);
  background-size: cover;
  z-index: -1;
}
.modal .modal_content {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: calc(430 * 100vw/1400);
  background: var(--color-white);
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  padding: calc(30*(100vw / 1400)) calc(25*(100vw / 1400));
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  box-sizing: border-box;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  z-index: 1;
  /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
  -ms-overflow-style: none;
  /*Firefoxへの対応*/
  scrollbar-width: none;
  /*Google Chrome、Safariへの対応*/
}
.modal .modal_content::-webkit-scrollbar {
  display: none;
}
.modal .modal_top {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: calc(0* 100vw / 1400);
  right: calc(20* 100vw / 1400);
  cursor: pointer;
  line-height: 1;
  width: calc(40* 100vw / 1400);
  height: calc(38* 100vw / 1400);
  z-index: 2;
}

/* .modal .modal_inner {
  width: calc(350 * 100vw/390);
  background: var(--color-white);
  border: var(--color-black) calc(1*(100vw / 390)) solid;
  padding: calc(30*(100vw / 390)) calc(25*(100vw / 390));
} */

.modal .modal_inner .ttl {
  text-align: center;
  font-family: var(--font-Futura);
  font-size: calc(30 * 100vw/1400);
  letter-spacing: 0.1em;
}

.modal .modal_inner .img {
  width: 100%;
  line-height: 0;
  margin-top: calc(20* 100vw / 1400);
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
}

.modal .modal_inner .text {
  width: calc(336* 100vw / 1400);
  margin-top: calc(10* 100vw / 1400);
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  background: #F5F5F5;
  padding: calc(20* 100vw / 1400);
  font-family: var(--font-ja);
  font-size: calc(12* 100vw / 1400);
  letter-spacing: 0.07em;
  line-height: 1.5;
}

.modal .page_btn {
  display: inline-block;
  margin-top: calc(30*(100vw / 1400));
  padding: calc(20*(100vw / 1400)) calc(96*(100vw / 1400));
  background-color: var(--color-red);
  box-shadow: calc(5*(100vw / 1400)) calc(5*(100vw / 1400)) 0 #8E2A3A;
  border-radius: calc(50*(100vw / 1400));
  border: #8E2A3A calc(1*(100vw / 1400)) solid;
  font-family: var(--font-Futura);
  font-size: calc(16*(100vw / 1400));
  letter-spacing: 0.1em;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
}

.modal .page_btn:hover {
  box-shadow: calc(0*(100vw / 1400)) calc(0*(100vw / 1400)) 0 #8B5761;
  transform: translateY(calc(5*(100vw / 1400))) translateX(calc(5*(100vw / 1400)));
  opacity: 1;
}


/* =============== subitem_area =============== */
.LP_page .subitem_area {
  position: relative;
  text-align: center;
  margin-top: calc(40*(100vw / 1400));
  border-top: var(--color-black) calc(1*(100vw / 1400)) solid;
  background: var(--color-pink);
  padding: calc(30*(100vw / 1400)) 0;
  z-index: 0;
}

.LP_page .subitem_area .ttl {
  position: relative;
  display: inline-block;
  font-family: var(--font-ja);
  font-size: calc(17*(100vw / 1400));
  font-weight: 700;
  line-height: 1.7;
  z-index: 0;
}
.LP_page .subitem_area .ttl::before {
  position: absolute;
  content: "";
  width: calc(1*(100vw / 1400));
  height: calc(45*(100vw / 1400));
  background: var(--color-black);
  top: calc(10*(100vw / 1400));
  left: calc(-15*(100vw / 1400));
  transform: rotate(-35deg);
  z-index: 1;
}
.LP_page .subitem_area .ttl::after {
  position: absolute;
  content: "";
  width: calc(1*(100vw / 1400));
  height: calc(45*(100vw / 1400));
  background: var(--color-black);
  top: calc(10*(100vw / 1400));
  right: calc(-15*(100vw / 1400));
  transform: rotate(35deg);
  z-index: 1;
}

.LP_page .subitem_area .ttl.__2::before {
  left: calc(-25*(100vw / 1400));
}

.LP_page .subitem_area .ttl.__2::after {
  right: calc(-25*(100vw / 1400));
}

.LP_page .subitem_area .visual_blk {
  width: calc(336*(100vw / 1400));
  background: var(--color-white);
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  padding: calc(15*(100vw / 1400)) calc(15*(100vw / 1400)) calc(30*(100vw / 1400));
  margin: 0 calc(10*(100vw / 1400));
}

.LP_page .subitem_area .img {
  width: 100%;
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
}

.LP_page .subitem_area .item_inner {
  position: relative;
  margin: calc(-10*(100vw / 1400)) auto 0;
  padding-bottom: calc(10*(100vw / 1400));
  width: calc(200*(100vw / 1400));
  border: var(--color-black) calc(1*(100vw / 1400)) solid;
  background: #FFFAFB;
  z-index: 1;
}

.LP_page .subitem_area .item_inner .brand {
  font-family: var(--font-Futura);
  font-size: calc(15*(100vw / 1400));
  padding: calc(7*(100vw / 1400)) 0 calc(6*(100vw / 1400));
  border-bottom: var(--color-black) calc(1*(100vw / 1400)) solid;
}

.LP_page .subitem_area .item_inner .name {
  font-family: var(--font-ja);
  font-size: calc(12*(100vw / 1400));
  line-height: 1.5;
  margin-top: calc(10*(100vw / 1400));
}

.LP_page .subitem_area .item_inner .price {
  font-family: var(--font-Futura);
  font-size: calc(14*(100vw / 1400));
  margin-top: calc(10*(100vw / 1400));
}

.LP_page .subitem_area .item_inner .price .tax {
  font-size: calc(9*(100vw / 1400));
  padding-left: calc(5*(100vw / 1400));
}

.LP_page .visual_blk .text {
  width: 87%;
  text-align: left;
  margin-top: calc(15*(100vw / 1400));
  padding: calc(15*(100vw / 1400));
  font-family: var(--font-ja);
  font-size: calc(12*(100vw / 1400));
  line-height: 1.7;
  background: #FFFAFB;
}

.LP_page .subitem_area .page_btn {
  display: inline-block;
  margin-top: calc(20*(100vw / 1400));
  padding: calc(10*(100vw / 1400)) calc(54*(100vw / 1400));
  background-color: var(--color-pink_2);
  box-shadow: calc(5*(100vw / 1400)) calc(5*(100vw / 1400)) 0 #8B5761;
  border-radius: calc(30*(100vw / 1400));
  border: #8B5761 calc(1*(100vw / 1400)) solid;
  font-family: var(--font-Futura);
  font-size: calc(16*(100vw / 1400));
  letter-spacing: 0.1em;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
}

.LP_page .subitem_area .page_btn:hover {
  box-shadow: calc(0*(100vw / 1400)) calc(0*(100vw / 1400)) 0 #8B5761;
  transform: translateY(calc(5*(100vw / 1400))) translateX(calc(5*(100vw / 1400)));
  opacity: 1;
}


.LP_page .slick-track {
  display: flex;
}
.LP_page .slick-slide {
  height: auto !important;
}

.LP_page .visual{
  position: relative;
  z-index: 0;
  margin-top: calc(30*(100vw / 1400));
}

.LP_page .visual_2 {
  position: relative;
  z-index: 0;
  margin-top: calc(30*(100vw / 1400));
}

.LP_page .subitems_wrap {
  position: relative;
  z-index: 0;
}

.LP_page .arrow_box_01 ,
.LP_page .arrow_box_02 {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(350*(100vw / 1400));
  margin: calc(-50*(100vw / 1400)) auto 0;
  top: calc(300*(100vw / 1400));
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}

.LP_page .prev-arrow,
.LP_page .next-arrow {
  display: block;
  width: calc(40*(100vw / 1400));
  height: calc(40*(100vw / 1400));
  transition: all .3s ease;
  cursor: pointer;
  position:relative;
}

.LP_page .next-arrow {
  background: url(../img/page_arrow_right.png);
  background-size: 100%;
}
.LP_page .prev-arrow {
  background: url(../img/page_arrow_left.png);
  background-size: 100%;
}


/* =============== comics_area part2 =============== */
.LP_page .comics_area.part2 {
  margin-top: 0;
}

.LP_page .box--1 {
  position: absolute;
  top: calc(153*(100vw / 1400));
  left: calc(89*(100vw / 1400));
  width: calc(23*(100vw / 1400));
  height: calc(69*(100vw / 1400));
  z-index: 2;
}
.LP_page .clip {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 0;
}
.LP_page .clip::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-animation: colorRotation 10s linear infinite;
  animation: colorRotation 10s linear infinite;
  background: linear-gradient(326deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 10%, rgb(255, 255, 255) 32%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 0) 100%);
  background-size: 110% 750%;
  mask-image: url(../img/clip-path_1.svg);
  mask-repeat: no-repeat;
  mask-size: 100%;
  z-index: 1;
}

.LP_page .box--2 {
  position: absolute;
  top: calc(133*(100vw / 1400));
  left: calc(124*(100vw / 1400));
  width: calc(29*(100vw / 1400));
  height: calc(73*(100vw / 1400));
  z-index: 2;
}
.LP_page .clip.clip--2 {
  height: 100%;
}
.LP_page .clip.clip--2::after {
  mask-image: url(../img/clip-path_2.svg);
}

.LP_page .item_area .item_1_ttl {
  margin-top: calc(80*(100vw / 1400));
}
.LP_page .item_area .item_1_ttl::before {
  content: "item1";
  font-size: calc(110*(100vw / 1400));
  top: calc(-77*(100vw / 1400));
}

.LP_page .item_area .item_2_ttl {
  margin-top: calc(110*(100vw / 1400));
}
.LP_page .item_area .item_2_ttl::before {
  content: "item2";
  font-size: calc(110*(100vw / 1400));
  top: calc(-77*(100vw / 1400));
}


/* =============== comics_area part3 =============== */
.LP_page .comics_area.part3 {
  margin-top: 0;
}


/* =============== bottom area =============== */
.LP_page .bottom_area {
  margin: calc(80*(100vw / 1400)) auto 0;
  width: calc(420*(100vw / 1400));
}

.LP_page .bottom_area .bottom_blk {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: calc(430*(100vw / 1400));
  height: calc(75*(100vw / 1400));
  font-family: var(--font-ja_write);
  font-size: calc(24*(100vw / 1400));
  line-height: 1.5;
  letter-spacing: 0.02em;
  padding-top: calc(15*(100vw / 1400));
  color: var(--color-white);
  z-index: 0;
}
.LP_page .bottom_area .bottom_blk::after {
  position: absolute;
  display: block;
  content: "";
  background: url(../img/nav_btn.svg) no-repeat;
  background-size: 100%;
  width: calc(35*(100vw / 1400));
  height: calc(35*(100vw / 1400));
  top: calc(16*(100vw / 1400));
  right: calc(35*(100vw / 1400));
  transform: rotate(180deg);
  z-index: 1;
}
.LP_page .bottom_area .bottom_blk:nth-of-type(n+2) {
  margin-top: calc(40*(100vw / 1400));
}

.LP_page .bottom_area .bottom_blk:nth-of-type(1) {
  background: url(../img/nav_bg_1.svg) no-repeat;
  background-size: 100%;
}

.LP_page .bottom_area .bottom_blk:nth-of-type(2) {
  background: url(../img/bottom_bg.svg) no-repeat;
  background-size: 100%;
  justify-content: flex-start;
  padding-left: calc(25*(100vw / 1400));
  width: calc(405*(100vw / 1400));
}
.LP_page .bottom_area .bottom_blk:nth-of-type(2)::after {
  transform: rotate(-90deg);
}

.LP_page .organicday_banner {
  position: relative;
  width: calc(427*(100vw / 1400));
  margin: calc(50*(100vw / 1400)) auto 0;
  z-index: 0;
}

.LP_page .follow_banner.up-active {
  display: none;
}

#FooterWrap {
  position: relative;
}

}