@charset "UTF-8";
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  list-style: none;
}
*:before, *:after {
  box-sizing: border-box;
}
*:focus {
  outline: none;
}

html {
  font-size: 62.5%;
  min-height: 100%;
  -webkit-overflow-scrolling: touch;
  position: relative;
}

body {
  font-family: YakuHanJP, "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 1.1vw;
  color: #ffffff;
  background: #000;
  position: relative;
  z-index: 0;
}
body img {
  max-width: 100%;
  width: 100%;
}
@media screen and (max-width: 767px) {
  body {
    font-size: 3.8vw;
  }
  body img {
    pointer-events: none;
  }
}

.sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp {
    display: block;
  }
}

.sp_inline {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp_inline {
    display: inline-block;
  }
}

@media screen and (max-width: 767px) {
  .pc {
    display: none;
  }
}
.flex {
  display: flex;
}

.grid {
  display: grid;
}

section {
  position: relative;
  z-index: 0;
}
section .inner {
  width: 90%;
  margin: 0 auto;
}
section .inner-concept, section .inner-product, section .inner-information {
  max-width: 79.271vw;
}
@media screen and (max-width: 767px) {
  section .inner-concept, section .inner-product, section .inner-information {
    max-width: 92.757vw;
  }
}

h1 {
  width: 44.948vw;
  margin-top: 0;
  margin-left: 8vw;
}
@media screen and (max-width: 767px) {
  h1 {
    width: 96.5vw;
    margin: 0 auto;
    margin-top: -7vw;
  }
}

h2 {
  position: relative;
  padding-left: 1.563vw;
  padding-bottom: 0.521vw;
}
h2.active img {
  animation: DropShadow-Move 1.5s ease 1 forwards;
}
h2::before {
  content: "";
  width: 0.781vw;
  height: 9.01vw;
  background-color: #921c22;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
h2 img {
  width: auto;
  height: 6.927vw;
  filter: drop-shadow(0px 0px 6px #921c22);
  transition: all 0.3s;
}
h2 .sub_title {
  display: block;
  color: #921c22;
  font-size: 1.875vw;
  font-weight: 900;
  letter-spacing: 0.02em;
  margin-top: -0.521vw;
}
@media screen and (max-width: 767px) {
  h2 {
    padding-left: 3.271vw;
    padding-bottom: 1.168vw;
  }
  h2::before {
    width: 1.636vw;
    height: 17.757vw;
  }
  h2 img {
    height: 13.551vw;
    filter: none;
  }
  h2 .sub_title {
    font-size: 3.738vw;
    margin-top: -1.168vw;
  }
}

h3.concept_h3 {
  font-size: 3.021vw;
  font-weight: 900;
  line-height: 1.4;
  letter-spacing: 0.07em;
  opacity: 0;
  transform: translateY(10%);
  transition: all ease-in-out 0.4s;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  h3.concept_h3 {
    font-size: 7.477vw;
    line-height: 1.46;
    letter-spacing: 0.05em;
  }
}
h3.product_h3 {
  width: 37.031vw;
  height: 7.292vw;
  padding-top: 1.302vw;
  padding-left: 11.719vw;
  font-size: 1.563vw;
  font-weight: 900;
  line-height: 1.4;
  letter-spacing: 0.06em;
  text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.8);
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateY(10%);
  transition: all ease-in-out 0.4s;
}
h3.product_h3::before {
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  h3.product_h3 {
    width: 93.692vw;
    height: 17.991vw;
    padding-top: 2.336vw;
    padding-left: 25.234vw;
    font-size: 4.439vw;
    text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.8);
  }
}
h3.product_h3-01::before {
  background-image: url(./images/product_heading-01.webp);
}
h3.product_h3-02::before {
  background-image: url(./images/product_heading-02.webp);
}
h3.product_h3-03::before {
  background-image: url(./images/product_heading-03.webp);
}
h3.information_h3 {
  font-size: 1.667vw;
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: 0.04em;
  text-shadow: 0px 0px 3px rgb(146, 28, 34);
}
h3.information_h3 .sub_title {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32.396vw;
  height: 6.927vw;
  font-size: 2.188vw;
  line-height: 1.19;
  letter-spacing: 0.04em;
  text-shadow: 0px 0px 3px rgb(146, 28, 34), 0px 0px 3px rgb(146, 28, 34);
  text-align: center;
  margin-bottom: 0.26vw;
  position: relative;
  z-index: 0;
}
h3.information_h3 .sub_title::after {
  content: "";
  width: 100%;
  height: 100%;
  background: url(./images/info_sub_title_bg.webp) no-repeat left top/contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
@media screen and (max-width: 767px) {
  h3.information_h3 {
    font-size: 5.8vw;
    letter-spacing: 0;
  }
  h3.information_h3 .sub_title {
    display: block;
    width: 83.645vw;
    height: 18.458vw;
    font-size: 6.075vw;
    line-height: 1.1;
    margin-left: 0;
    padding-top: 1.869vw;
    margin-bottom: 1vw;
  }
}
h3.benfit_h3 {
  font-size: 2.708vw;
  font-weight: 900;
  letter-spacing: 0.04em;
}
h3.benfit_h3 span {
  position: relative;
}
h3.benfit_h3 span::after {
  content: "";
  width: 11.406vw;
  height: 1.354vw;
  background: url(./images/benefits_title_deco.webp) no-repeat left top/contain;
  position: absolute;
  bottom: 0.573vw;
  right: -12.5vw;
}
@media screen and (max-width: 767px) {
  h3.benfit_h3 {
    font-size: 5.374vw;
  }
  h3.benfit_h3 span::after {
    width: 26.168vw;
    height: 3.271vw;
    bottom: 1.168vw;
    right: -31.308vw;
  }
}

h4.detail_h4 {
  width: 5.26vw;
}
@media screen and (max-width: 767px) {
  h4.detail_h4 {
    display: none;
  }
}
h4.benfit_h4 {
  font-size: 1.875vw;
  font-weight: 900;
  line-height: 1.97;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 767px) {
  h4.benfit_h4 {
    font-size: 4.907vw;
    line-height: 1.66;
  }
}

#load {
  background: #000;
  position: fixed;
  height: 100svh;
  width: 100%;
  z-index: 999;
  transition: 0.2s;
  transition-delay: 2s;
}
#load.load_active {
  animation: view 0.5s ease-in-out 1s forwards;
}
@keyframes view {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    pointer-events: none;
  }
}

.wrap {
  overflow: hidden;
}

main .bg_video {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -5;
}
main .bg_video::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: 0.6;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
main .bg_video iframe,
main .bg_video video {
  width: 100%;
  height: 120%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 767px) {
  main .bg_video iframe,
  main .bg_video video {
    height: 100%;
  }
}
main .mv_background_layer {
  width: 100%;
  height: 52.552vw;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  main .mv_background_layer {
    height: 186.916vw;
  }
}
main .mv_background_layer-01 {
  z-index: 0;
  mix-blend-mode: difference;
}
main .mv_background_layer-02 {
  z-index: -1;
}
main .mv_background_layer-03 {
  z-index: 1;
  overflow: hidden;
}
main .mv_background_layer-04 {
  height: 100%;
  z-index: -3;
  mix-blend-mode: multiply;
}
main .mv_background_layer-05 {
  height: 100%;
  z-index: -4;
  mix-blend-mode: hard-light;
}
main .mv_background_layer-06 {
  height: 100%;
  z-index: -2;
}
@media screen and (max-width: 767px) {
  main .mv_background_layer-01 {
    z-index: 1;
  }
  main .mv_background_layer-04 {
    opacity: 0.95;
  }
}
main .mv_background_layer .absolute_img_red {
  width: 100%;
  height: 19.531vw;
  background: url(./images/bg_absolute.webp) no-repeat center top/contain;
  position: absolute;
  bottom: -4vw;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}
main .mv_background_layer .absolute_img_red.tikatika {
  animation: tikatika-move 0.1s step-end 1.2s 2 forwards;
}
@media screen and (max-width: 767px) {
  main .mv_background_layer .absolute_img_red {
    bottom: -7vw;
  }
}
main .mv_background_layer .absolute_img_black {
  width: 100%;
  height: 19.531vw;
  background: url(./images/bg_absolute_bg.webp) no-repeat center top/contain;
  position: absolute;
  bottom: -4vw;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}
main .mv_background_layer .absolute_img_black.tikatika {
  animation: tikatika-move 0.1s step-end 1.2s 2 forwards;
}
@media screen and (max-width: 767px) {
  main .mv_background_layer .absolute_img_black {
    bottom: -7vw;
  }
}
main .mv_background_layer .bg_main {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}
main .mv_background_layer .bg_main::before {
  content: "";
  width: 99.948vw;
  height: 243.385vw;
  background-image: url(./images/bg_main.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 104.583vw;
  left: 0.052vw;
}
@media screen and (max-width: 767px) {
  main .mv_background_layer .bg_main::before {
    width: 100%;
    height: 1033.411vw;
    background-image: url(./images/sp/bg_main.webp);
    top: 397vw;
    left: 0.234vw;
  }
}
main .mv_background_layer .bg_blown {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  opacity: 0.7;
}
main .mv_background_layer .bg_blown::before {
  content: "";
  width: 107.135vw;
  height: 100.625vw;
  background: #380f04;
  background: linear-gradient(0deg, rgb(56, 15, 4) 0%, rgb(28, 10, 5) 67%, rgba(43, 29, 15, 0.3) 73%, rgba(59, 31, 16, 0) 100%);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 18.125vw;
  left: -3.594vw;
}
@media screen and (max-width: 767px) {
  main .mv_background_layer .bg_blown::before {
    width: 250vw;
    height: 365.888vw;
    background: #380f04;
    background: linear-gradient(0deg, rgb(56, 15, 4) 0%, rgb(15, 6, 3) 75%, rgba(43, 29, 15, 0.3) 90%, rgba(59, 31, 16, 0) 100%);
    top: 59.813vw;
    left: -75vw;
  }
}
main .mv_background_layer .bg_blown::after {
  content: none;
}
@media screen and (max-width: 767px) {
  main .mv_background_layer .bg_blown::after {
    content: "";
    width: 250vw;
    height: 365.888vw;
    background: #380f04;
    background: linear-gradient(0deg, rgb(56, 15, 4) 0%, rgb(15, 6, 3) 75%, rgba(43, 29, 15, 0.3) 90%, rgba(59, 31, 16, 0) 100%);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 59.813vw;
    left: -75vw;
  }
}
main .mv_background_layer .bg_dot {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  opacity: 0.7;
}
main .mv_background_layer .bg_dot::before {
  content: "";
  width: 107.083vw;
  height: 100.521vw;
  background-image: url(./images/bg_dot.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 18.125vw;
  left: -3.594vw;
}
@media screen and (max-width: 767px) {
  main .mv_background_layer .bg_dot::before {
    width: 176.402vw;
    height: 153.037vw;
    background-image: url(./images/sp/bg_dot.webp);
    top: 139.72vw;
    left: -38.318vw;
  }
}
main .product_background_layer {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  mix-blend-mode: screen;
  pointer-events: none;
  overflow: hidden;
}
main .product_background_layer .bg_bullet_holes {
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  opacity: 0;
}
main .product_background_layer .bg_bullet_holes.active {
  animation: vibe 0.2s 1s forwards;
}
main .product_background_layer .bg_bullet_holes-01 {
  width: 45.833vw;
  height: 43.333vw;
  background-image: url(./images/bg_deco-01.webp);
  top: 137.5vw;
  right: 0;
}
@media screen and (max-width: 767px) {
  main .product_background_layer .bg_bullet_holes-01 {
    width: 87.617vw;
    height: 88.551vw;
    background-image: url(./images/sp/bg_deco-01.webp);
    top: 398.5vw;
  }
}
main .product_background_layer .bg_bullet_holes-02 {
  width: 46.979vw;
  height: 35.573vw;
  background-image: url(./images/bg_deco-02.webp);
  top: 172.5vw;
  left: -12vw;
}
@media screen and (max-width: 767px) {
  main .product_background_layer .bg_bullet_holes-02 {
    width: 96.028vw;
    height: 72.664vw;
    top: 556.5vw;
    left: -32vw;
  }
}
main .product_background_layer .bg_bullet_holes-03 {
  width: 32.969vw;
  height: 60.625vw;
  background-image: url(./images/bg_deco-03.webp);
  top: 176.5vw;
  right: 0;
}
@media screen and (max-width: 767px) {
  main .product_background_layer .bg_bullet_holes-03 {
    width: 55.607vw;
    height: 123.598vw;
    background-image: url(./images/sp/bg_deco-03.webp);
    top: 653.5vw;
  }
}
main .info_background_layer {
  width: 100%;
  height: 100vh;
  position: absolute;
  bottom: 0;
  left: 0;
  pointer-events: none;
}
main .info_background_layer-01 {
  height: 100%;
  z-index: -1;
  mix-blend-mode: multiply;
}
main .info_background_layer-02 {
  height: 100%;
  z-index: -2;
  mix-blend-mode: hard-light;
}
main .info_background_layer-03 {
  height: 100%;
  z-index: -1;
  mix-blend-mode: overlay;
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  main .info_background_layer-03 {
    z-index: -2;
    opacity: 0.6;
    mix-blend-mode: normal;
  }
}
main .info_background_layer-04 {
  z-index: -1;
  mix-blend-mode: difference;
}
main .info_background_layer .absolute_img_red {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  overflow: hidden;
}
main .info_background_layer .absolute_img_red::before {
  content: "";
  width: 100%;
  height: 19.531vw;
  background: url(./images/bg_absolute.webp) no-repeat center top/contain;
  position: absolute;
  bottom: 6vw;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}
@media screen and (max-width: 767px) {
  main .info_background_layer .absolute_img_red::before {
    bottom: 21vw;
  }
}
main .info_background_layer .bg_blown {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  overflow: hidden;
}
main .info_background_layer .bg_blown::before {
  content: "";
  width: 100.052vw;
  height: 129.531vw;
  background-image: url(./images/bg_info_brown.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: -27vw;
  left: 0;
}
@media screen and (max-width: 767px) {
  main .info_background_layer .bg_blown::before {
    width: 324.299vw;
    height: 652.103vw;
    background-image: url(./images/sp/bg_info_brown.webp);
    bottom: -236vw;
    left: -112.15vw;
  }
}
main .info_background_layer .bg_dot {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  overflow: hidden;
}
main .info_background_layer .bg_dot::before {
  content: "";
  width: 100%;
  height: 132.448vw;
  background-image: url(./images/bg_info_dot.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: -32vw;
  left: 0;
}
@media screen and (max-width: 767px) {
  main .info_background_layer .bg_dot::before {
    content: "";
    width: 253.738vw;
    height: 440.421vw;
    background-image: url(./images/sp/bg_info_dot.webp);
    bottom: -60vw;
  }
}
main .info_background_layer .bg_mark {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 1;
}
@media screen and (max-width: 767px) {
  main .info_background_layer .bg_mark {
    overflow: hidden;
  }
}
main .info_background_layer .bg_mark::before {
  content: "";
  width: 53.177vw;
  height: 48.594vw;
  background-image: url(./images/bg_info_deco.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 36vw;
  left: 50%;
  transform: translateX(-50%);
  opacity: 1;
  will-change: opacity;
}
@media screen and (max-width: 767px) {
  main .info_background_layer .bg_mark::before {
    width: 179.907vw;
    height: 164.486vw;
    bottom: 110vw;
  }
}
main .info_background_layer .bg_mark.active::before {
  animation: flicker 1s linear 2;
}
main #mv {
  width: 100%;
  height: 52.552vw;
  z-index: 0;
}
@media screen and (max-width: 767px) {
  main #mv {
    height: 186.916vw;
  }
}
main #mv.active .mv_img {
  opacity: 1;
  transform: translateY(0%);
  transition-delay: 1.5s;
}
main #mv.tikatika::before {
  animation: tikatika-move 0.1s step-end 1.2s 2 forwards;
}
main #mv::before {
  content: "";
  width: 92.552vw;
  height: 9.115vw;
  background-image: url(./images/bg_xxx.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  main #mv::before {
    width: 93.224vw;
    height: 23.364vw;
    background-image: url(./images/sp/bg_xxx.webp);
    opacity: 0.8;
    z-index: -1;
  }
}
main #mv .nikke_logo {
  width: 22.083vw;
  margin-top: 0;
  margin-left: 0.521vw;
}
@media screen and (max-width: 767px) {
  main #mv .nikke_logo {
    width: 35.1vw;
    padding-top: 0;
    margin-top: -3.9vw;
    margin-left: -3.5vw;
  }
}
main #mv .mv_img {
  width: 100%;
  height: 110%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
  opacity: 0;
  transform: translateY(1%);
  transition: all ease-in-out 0.5s;
}
main #mv .mv_img::before {
  content: "";
  width: 52.521vw;
  height: 60.417vw;
  background-image: url(./images/mv_img.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 4.229vw;
  right: 1.5vw;
}
@media screen and (max-width: 767px) {
  main #mv .mv_img::before {
    width: 126.402vw;
    height: 137.383vw;
    background-image: url(./images/sp/mv_img.webp);
    top: 64vw;
    left: 50%;
    transform: translateX(-50%);
  }
}
main #concept {
  margin-top: 8vw;
}
@media screen and (max-width: 767px) {
  main #concept {
    margin-top: 23vw;
  }
}
main #concept p {
  width: 43%;
  line-height: 2;
  margin-top: 1.042vw;
  opacity: 0;
  transform: translateY(5%);
  transition: all ease-in-out 0.6s;
}
@media screen and (max-width: 767px) {
  main #concept p {
    width: 100%;
    margin-top: 2.336vw;
  }
}
main #concept .concept_txt {
  margin-top: 1.823vw;
}
@media screen and (max-width: 767px) {
  main #concept .concept_txt {
    width: 90%;
    margin: 0 auto;
    margin-top: 2.336vw;
  }
}
main #concept .concept_txt.active h3 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.4s;
}
main #concept .concept_txt.active p {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.8s;
}
main #concept .movie {
  width: 57.396vw;
  height: 41.667vw;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  main #concept .movie {
    width: 100vw;
    height: 61.682vw;
    position: relative;
    margin: 0 calc(50% - 50vw);
    margin-top: 3.505vw;
  }
}
@media screen and (min-width: 767px) {
  main #concept .movie a:hover .movie-btn_play img {
    filter: brightness(1) invert(0);
    opacity: 0.3;
  }
  main #concept .movie a:hover .movie-btn_play::before {
    opacity: 0;
  }
  main #concept .movie a:hover .movie-btn_play::after {
    opacity: 0.3;
  }
  main #concept .movie a:hover .movie-btn_play-hover {
    opacity: 0;
  }
  main #concept .movie a:hover .movie-btn_play-hover::before {
    animation: none;
    transition-delay: 0.3s;
  }
}
main #concept .movie-img {
  width: 64.688vw;
  height: 100%;
  background-image: url(./images/movie_img.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
@media screen and (max-width: 767px) {
  main #concept .movie-img {
    width: 100%;
    height: 100%;
    background-image: url(./images/sp/movie_img.webp);
    background-size: cover;
    left: 2.336vw;
  }
}
main #concept .movie-btn_play {
  width: 11vw;
  height: 11vw;
  position: absolute;
  bottom: 8vw;
  right: 13.5vw;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  main #concept .movie-btn_play {
    width: 22vw;
    height: 22vw;
    bottom: 5.14vw;
    right: 7.477vw;
  }
}
main #concept .movie-btn_play img {
  transition: all 0.3s;
}
main #concept .movie-btn_play::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(./images/btn_play_hover.webp) no-repeat center center/contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
  opacity: 0;
  transition: all 0.3s;
}
main #concept .movie-btn_play::after {
  content: "";
  width: 10.208vw;
  height: 10.208vw;
  background-image: url(./images/btn_play_shadow.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -2;
}
@media screen and (max-width: 767px) {
  main #concept .movie-btn_play::after {
    width: 18.458vw;
    height: 18.458vw;
    background-image: url(./images/sp/btn_play_shadow.webp);
    top: 52%;
    left: 52%;
  }
}
main #concept .movie-btn_play-hover {
  width: 11vw;
  height: 11vw;
  position: absolute;
  bottom: 8vw;
  right: 13.5vw;
  z-index: 1;
  transition: all 0.3s;
}
@media screen and (max-width: 767px) {
  main #concept .movie-btn_play-hover {
    width: 22vw;
    height: 22vw;
    bottom: 5.14vw;
    right: 7.477vw;
  }
}
main #concept .movie-btn_play-hover img {
  opacity: 0;
}
main #concept .movie-btn_play-hover::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(./images/btn_play_hover.webp) no-repeat center center/contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
  opacity: 0;
  transition: all 0.3s;
  filter: drop-shadow(0px 0px 3px #921c22) drop-shadow(0px 0px 3px #921c22) drop-shadow(0px 0px 3px #921c22) brightness(1.5);
  animation: Move-btnmovie 2s linear infinite;
}
main #concept .movie-btn_play-hover::after {
  content: "";
  width: 10.208vw;
  height: 10.208vw;
  background-image: url(./images/btn_play_shadow.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -2;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  main #concept .movie-btn_play-hover::after {
    width: 18.458vw;
    height: 18.458vw;
    background-image: url(./images/sp/btn_play_shadow.webp);
    top: 52%;
    left: 52%;
  }
}
main #product {
  margin-top: 19vw;
}
@media screen and (max-width: 767px) {
  main #product {
    margin-top: 39vw;
  }
}
main #product p {
  line-height: 1.7;
  width: 84%;
  margin-top: 1vw;
  margin-left: auto;
  text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.16);
  opacity: 0;
  transform: translateY(10%);
  transition: all ease-in-out 0.4s;
}
@media screen and (max-width: 767px) {
  main #product p {
    line-height: 1.87;
    width: 90%;
    margin: 0 auto;
    margin-top: 2.336vw;
  }
}
main #product .product_contents_box {
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 4.271vw;
  position: relative;
  z-index: 0;
}
main #product .product_contents_box.active::before {
  animation: aiming-revised 1.2s ease-out forwards;
}
main #product .product_contents_box.active .product_contents_box-description h3 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.4s;
}
main #product .product_contents_box.active .product_contents_box-description p {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.8s;
}
main #product .product_contents_box::before {
  content: "";
  width: 15.885vw;
  height: 16.354vw;
  background-image: url(./images/product_mark_target.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  z-index: -1;
  transform: translate(-80%, -50%);
  opacity: 0.5;
}
main #product .product_contents_box:last-of-type {
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  main #product .product_contents_box {
    flex-direction: column-reverse;
    margin-bottom: 12.85vw;
  }
  main #product .product_contents_box::before {
    content: none;
  }
  main #product .product_contents_box:first-of-type {
    margin-top: 7vw;
  }
}
main #product .product_contents_box-reverse {
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  main #product .product_contents_box-reverse {
    flex-direction: column-reverse;
  }
}
main #product .product_contents_box-description {
  width: 46%;
  padding-bottom: 3vw;
}
@media screen and (max-width: 767px) {
  main #product .product_contents_box-description {
    width: 100%;
    margin-top: 2.336vw;
    padding-bottom: 0;
  }
}
main #product .product_contents_box-slider {
  width: 49%;
  position: relative;
}
main #product .product_contents_box-slider video {
  width: 100%;
}
@media screen and (max-width: 767px) {
  main #product .product_contents_box-slider {
    width: 100%;
  }
}
main #product .product_contents_box-01::before {
  bottom: -5.208vw;
  left: -3.646vw;
}
main #product .product_contents_box-02::before {
  bottom: -5.208vw;
  left: 39.063vw;
}
main #product .product_contents_box-03::before {
  bottom: -5.208vw;
  left: -3.646vw;
}
main #information {
  margin-top: 23vw;
  padding-bottom: 1.719vw;
}
@media screen and (max-width: 767px) {
  main #information {
    margin-top: 39vw;
    padding-bottom: 6.5vw;
  }
}
main #information p.price_txt {
  font-size: 2.083vw;
  line-height: 1.5;
  text-shadow: 0px 0px 3px rgb(146, 28, 34);
  letter-spacing: 0.04em;
}
main #information p.price_txt small {
  font-size: 65%;
}
@media screen and (max-width: 767px) {
  main #information p.price_txt {
    font-size: 7.477vw;
  }
}
main #information p.release_date_txt {
  width: 32.865vw;
  margin-top: 1.302vw;
  position: relative;
  z-index: 0;
}
main #information p.release_date_txt::after {
  content: "";
  width: 32.708vw;
  height: 2.292vw;
  background-image: url(./images/release_date_bg.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
@media screen and (max-width: 767px) {
  main #information p.release_date_txt {
    width: 86.682vw;
    margin-top: 5.841vw;
  }
  main #information p.release_date_txt::after {
    width: 84.579vw;
    height: 7.009vw;
  }
}
main #information p.co-branding_txt {
  text-align: center;
  font-size: 0.95vw;
  line-height: 2;
  letter-spacing: 0.04em;
  margin-top: 0.5vw;
}
@media screen and (max-width: 767px) {
  main #information p.co-branding_txt {
    font-size: 3.271vw;
    text-align: left;
    width: 87%;
    margin: 0 auto;
    margin-top: 2.9vw;
  }
}
main #information p.publisher_txt {
  text-align: center;
  font-size: 1.25vw;
  letter-spacing: 0.04em;
  margin-top: 5.833vw;
}
@media screen and (max-width: 767px) {
  main #information p.publisher_txt {
    font-size: 3.271vw;
    margin-top: 19vw;
  }
}
main #information p a {
  transition: all 0.3s;
}
main #information p a span {
  border-bottom: 2px solid #ffffff;
  position: relative;
  padding-right: 1.198vw;
  transition: all 0.3s;
}
main #information p a span::after {
  content: "";
  width: 0.938vw;
  height: 0.938vw;
  background: url(./images/icon_link.svg) no-repeat left top/contain;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  filter: brightness(0) invert(1);
  transition: all 0.3s;
}
@media screen and (min-width: 767px) {
  main #information p a:hover {
    color: #921c22;
  }
  main #information p a:hover span::after {
    filter: brightness(1) invert(0);
  }
}
@media screen and (max-width: 767px) {
  main #information p a span {
    border-bottom: 1px solid #ffffff;
    padding-right: 3.738vw;
    margin: 0 1.168vw;
  }
  main #information p a span::after {
    content: "";
    width: 3.271vw;
    height: 3.271vw;
  }
}
main #information .information_contents_box {
  justify-content: space-between;
  margin-top: 2.865vw;
  margin-bottom: 4.2vw;
}
main #information .information_contents_box.active .information_contents_box-description {
  opacity: 1;
  transform: translateY(0);
}
main #information .information_contents_box-description {
  width: 43%;
  opacity: 0;
  transform: translateY(10%);
  transition: all ease-in-out 0.4s;
}
@media screen and (max-width: 767px) {
  main #information .information_contents_box-description {
    transition: all ease-in-out 0.8s;
  }
}
main #information .information_contents_box-img {
  width: 57%;
}
@media screen and (max-width: 767px) {
  main #information .information_contents_box {
    flex-direction: column-reverse;
    align-items: center;
    margin-top: 8.178vw;
    margin-bottom: 8vw;
  }
  main #information .information_contents_box-description {
    width: 93%;
    margin-top: 4.673vw;
  }
  main #information .information_contents_box-img {
    width: 100%;
  }
}
main #information .detail_box {
  justify-content: space-between;
  align-items: center;
  margin-top: 1vw;
  margin-bottom: 1.042vw;
}
@media screen and (max-width: 767px) {
  main #information .detail_box {
    display: block;
    margin-top: 3.505vw;
    margin-bottom: 5.841vw;
  }
}
main #information .detail_ul {
  width: 80%;
}
main #information .detail_ul .detail_li {
  font-size: 1.146vw;
  letter-spacing: 0.04em;
  text-shadow: 0px 0px 3px rgb(146, 28, 34);
  margin-bottom: 0.729vw;
  position: relative;
}
main #information .detail_ul .detail_li:last-of-type {
  margin-bottom: 0;
}
main #information .detail_ul .detail_li::before {
  content: "◆";
}
main #information .detail_ul .detail_li.detail_li_mark_no::before {
  content: none;
}
main #information .detail_ul .detail_li small {
  display: block;
  line-height: 1.5;
  letter-spacing: 0.02em;
  margin-top: 0.4vw;
}
@media screen and (max-width: 767px) {
  main #information .detail_ul {
    width: 100%;
  }
  main #information .detail_ul .detail_li {
    font-size: 4.673vw;
    letter-spacing: 0;
    margin-bottom: 3.271vw;
  }
  main #information .detail_ul .detail_li small {
    font-size: 70%;
    line-height: 1.8;
    margin-top: 1.636vw;
  }
}
main #information .informaton_btn_reserved {
  display: block;
  width: 25.052vw;
  height: 4.427vw;
  font-size: 2.083vw;
  text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.7);
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 0;
  transition: all 0.3s;
}
@media screen and (min-width: 767px) {
  main #information .informaton_btn_reserved:hover {
    text-shadow: 0px 0px 3px rgba(146, 28, 34, 0.8), 0px 0px 3px rgba(146, 28, 34, 0.8), 0px 0px 10px rgba(146, 28, 34, 0.8), 0px 0px 10px rgba(146, 28, 34, 0.8);
    filter: drop-shadow(0px 0px 26px rgba(146, 28, 34, 0.4)) drop-shadow(0px 0px 26px rgba(146, 28, 34, 0.4)) drop-shadow(0px 0px 26px rgba(146, 28, 34, 0.4));
  }
}
@media screen and (max-width: 767px) {
  main #information .informaton_btn_reserved {
    width: 83.178vw;
    height: 14.72vw;
    font-size: 6.776vw;
  }
}
main #information .informaton_btn_reserved::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(./images/btn_info_reserved.webp) no-repeat center top/contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
main #information .informaton_btn_reserved::after {
  content: "";
  width: 25.99vw;
  height: 5.365vw;
  background: url(./images/btn_info_reserved_shadow.webp) no-repeat center top/contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -2;
}
@media screen and (max-width: 767px) {
  main #information .informaton_btn_reserved::after {
    width: 87.383vw;
    height: 18.925vw;
  }
}
main #information .btn_ec {
  width: 42.76vw;
  height: 8.177vw;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 0;
}
@media screen and (min-width: 767px) {
  main #information .btn_ec:hover {
    animation: tikatika 0.1s linear infinite;
  }
}
main #information .btn_ec::before {
  content: "";
  width: 100%;
  height: 100%;
  background-image: url(./images/btn_ec.webp);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
main #information .btn_ec img {
  width: 34.948vw;
}
@media screen and (max-width: 767px) {
  main #information .btn_ec {
    width: 78.037vw;
    height: 31.542vw;
  }
  main #information .btn_ec::before {
    background-image: url(./images/sp/btn_ec.webp);
  }
  main #information .btn_ec img {
    width: 54.673vw;
    margin-top: 2.103vw;
  }
}
main #information .benefit {
  width: 65.573vw;
  height: 29.844vw;
  background-image: url(./images/benefits_frame.webp);
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0 auto;
  padding: 2.083vw 2.865vw;
}
@media screen and (max-width: 767px) {
  main #information .benefit {
    width: 86.682vw;
    height: 154.673vw;
    background-image: url(./images/sp/benefits_frame.webp);
    padding: 5.14vw 7.009vw;
  }
}
main #information .benefit_contents_box {
  width: 55.365vw;
  margin: 0 auto;
  justify-content: space-between;
  align-items: flex-end;
}
main #information .benefit_contents_box-description {
  width: 48%;
}
main #information .benefit_contents_box-description p {
  font-size: 1.042vw;
  line-height: 2;
  letter-spacing: -0.04em;
}
main #information .benefit_contents_box-img {
  width: 45%;
}
@media screen and (max-width: 767px) {
  main #information .benefit_contents_box {
    width: 65.187vw;
    margin-top: 11.682vw;
    flex-direction: column-reverse;
  }
  main #information .benefit_contents_box-description {
    width: 100%;
    margin-top: 4.673vw;
  }
  main #information .benefit_contents_box-description p {
    font-size: 3.271vw;
    letter-spacing: -0.03em;
    margin-top: 1vw;
  }
  main #information .benefit_contents_box-img {
    width: 100%;
  }
}

footer {
  background: url(./images/footer_bg.webp) no-repeat center top/cover;
  height: 8.021vw;
  padding: 2.292vw 3.906vw;
}
footer .logo_ap {
  width: 14.635vw;
  margin: 0 auto;
}
footer .logo_ap a {
  display: block;
  transition: all 0.4s;
}
@media screen and (min-width: 767px) {
  footer .logo_ap a:hover {
    opacity: 0.6;
  }
}
footer .copy_shiftup {
  width: 20.521vw;
  line-height: 0;
}
@media screen and (max-width: 767px) {
  footer {
    height: 23.131vw;
    padding: 3.271vw 14.252vw 5.607vw;
  }
  footer .logo_ap {
    width: 35.748vw;
  }
  footer .copy_shiftup {
    width: 71.262vw;
    margin-top: 3.738vw;
  }
}

.btn_reserved {
  width: 11.25vw;
  height: 11.25vw;
  background: url(./images/btn_reserved_target.webp) no-repeat center center/contain;
  position: fixed;
  bottom: 1.042vw;
  right: 1.042vw;
  z-index: 998;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s;
}
@media screen and (min-width: 767px) {
  .btn_reserved:hover {
    background: url(./images/btn_reserved_target_hover.webp) no-repeat center center/contain;
  }
}
.btn_reserved.active {
  opacity: 1;
  pointer-events: all;
}
.btn_reserved::before {
  content: none;
  background: url(./images/btn_reserved_target_hover.webp) no-repeat center center/contain;
}
.btn_reserved::after {
  content: "";
  width: 8.229vw;
  height: 8.229vw;
  background: url(./images/btn_reserved_circle.webp) no-repeat center center/contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  pointer-events: none;
  animation: rotate 20s linear infinite;
}
@media screen and (max-width: 767px) {
  .btn_reserved {
    width: 25.935vw;
    height: 25.935vw;
    background: url(./images/sp/btn_reserved_target.webp) no-repeat center center/contain;
    bottom: 2.336vw;
    right: 3.738vw;
  }
  .btn_reserved::after {
    width: 18.925vw;
    height: 18.925vw;
  }
}
.btn_reserved a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: inherit;
  height: inherit;
}
.btn_reserved a p {
  width: 8.698vw;
  text-align: center;
  font-size: 1.302vw;
  font-weight: 900;
  letter-spacing: -0.02em;
  filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.75));
  margin-top: 1.042vw;
}
@media screen and (max-width: 767px) {
  .btn_reserved a p {
    width: 20.093vw;
    font-size: 2.804vw;
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.75));
    margin-top: 2.336vw;
  }
}

.swiper {
  padding-bottom: 3vw;
}
@media screen and (max-width: 767px) {
  .swiper {
    width: 90%;
    padding-bottom: 2vw;
  }
}

@media screen and (max-width: 767px) {
  .product_contents_box-02 .swiper {
    padding-bottom: 7vw;
  }
}

@media screen and (max-width: 767px) {
  .swiper-horizontal > .swiper-pagination-bullets,
  .swiper-pagination-bullets.swiper-pagination-horizontal,
  .swiper-pagination-custom,
  .swiper-pagination-fraction {
    bottom: 2px;
  }
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 0.26vw;
}
@media screen and (max-width: 767px) {
  .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
  .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 0.467vw;
  }
}

.swiper-pagination-bullet {
  border-radius: 0;
  opacity: 1;
  background-color: #c0736e;
  height: 0.833vw;
  width: 0.833vw;
}
@media screen and (max-width: 767px) {
  .swiper-pagination-bullet {
    height: 1.636vw;
    width: 1.636vw;
  }
}

.swiper-pagination-bullet-active {
  background-color: #9e2820;
}

.swiper-button-next,
.swiper-button-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 5.208vw;
  height: 3.125vw;
  z-index: 11;
  display: flex;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .swiper-button-next,
  .swiper-button-prev {
    width: 11.682vw;
    height: 7.009vw;
  }
}

@media screen and (max-width: 767px) {
  .swiper-button-next,
  .swiper-button-prev {
    top: 55%;
  }
}
.swiper-button-next::after,
.swiper-button-prev::after {
  content: none;
}
.swiper-button-next.stop .arrow::before,
.swiper-button-prev.stop .arrow::before {
  animation: none;
}
.swiper-button-next .arrow::before,
.swiper-button-prev .arrow::before {
  content: "";
  display: block;
  width: 2.135vw;
  height: 3.125vw;
  background: url(./images/icon_arrow-01.svg) no-repeat;
  background-size: contain;
  animation: load 1.04s ease infinite;
}
@media screen and (max-width: 767px) {
  .swiper-button-next .arrow::before,
  .swiper-button-prev .arrow::before {
    width: 4.673vw;
    height: 7.009vw;
  }
}
.swiper-button-next .arrow:nth-of-type(1)::before,
.swiper-button-prev .arrow:nth-of-type(1)::before {
  animation-delay: 0.52s;
}
.swiper-button-next .arrow:nth-of-type(2),
.swiper-button-prev .arrow:nth-of-type(2) {
  margin-left: -0.677vw;
}
@media screen and (max-width: 767px) {
  .swiper-button-next .arrow:nth-of-type(2),
  .swiper-button-prev .arrow:nth-of-type(2) {
    margin-left: -1.402vw;
  }
}
.swiper-button-next .arrow:nth-of-type(2)::before,
.swiper-button-prev .arrow:nth-of-type(2)::before {
  background: url(./images/icon_arrow-02.svg) no-repeat;
  background-size: contain;
  animation-delay: 0.26s;
}
.swiper-button-next .arrow:nth-of-type(3),
.swiper-button-prev .arrow:nth-of-type(3) {
  margin-left: -0.677vw;
}
@media screen and (max-width: 767px) {
  .swiper-button-next .arrow:nth-of-type(3),
  .swiper-button-prev .arrow:nth-of-type(3) {
    margin-left: -1.402vw;
  }
}
.swiper-button-next .arrow:nth-of-type(3)::before,
.swiper-button-prev .arrow:nth-of-type(3)::before {
  background: url(./images/icon_arrow-03.svg) no-repeat;
  background-size: contain;
}

.swiper-button-next {
  right: -2.344vw;
  transform: translateY(-50%) scale(-1, 1);
}
@media screen and (max-width: 767px) {
  .swiper-button-next {
    right: -0.4vw;
  }
}

.swiper-button-prev {
  left: -2.344vw;
}
@media screen and (max-width: 767px) {
  .swiper-button-prev {
    left: -0.4vw;
  }
}

/* 画像サイズ調整 */
.swiper-slide img {
  height: auto;
  width: 100%;
}

/*モーダル設定*/
@media screen and (max-width: 767px) {
  .mfp-container {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.movie-mfp.mfp-wrap.mfp-ready .mfp-content {
  max-width: 70%;
}
@media screen and (max-width: 767px) {
  .movie-mfp.mfp-wrap.mfp-ready .mfp-content {
    max-width: 100%;
    min-height: auto;
  }
}

.mfp-close {
  width: 30px !important;
  height: 30px !important;
  position: absolute !important;
  top: -35px !important;
  right: -35px !important;
  opacity: 1 !important;
}
@media screen and (max-width: 767px) {
  .mfp-close {
    width: 20px !important;
    height: 20px !important;
    top: -30px !important;
    right: 0 !important;
  }
}

.mfp-close_in {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .mfp-close_in {
    width: 20px;
    height: 20px;
    top: 40%;
    left: 50%;
  }
}

.mfp-close_in span {
  display: block;
  height: 3px;
  width: 30px;
  background-color: #fff;
}
@media screen and (max-width: 767px) {
  .mfp-close_in span {
    display: block;
    height: 2px;
    width: 20px;
    background-color: #fff;
  }
}

.mfp-close_in span:nth-of-type(1) {
  transform: rotate(45deg);
  margin-top: 13px;
}
@media screen and (max-width: 767px) {
  .mfp-close_in span:nth-of-type(1) {
    margin-top: 13px;
  }
}

.mfp-close_in span:nth-of-type(2) {
  transform: rotate(-45deg);
  margin-top: -2px;
}
@media screen and (max-width: 767px) {
  .mfp-close_in span:nth-of-type(2) {
    margin-top: -2px;
  }
}

/*フェードインアウト*/
.mfp-fade.mfp-bg {
  opacity: 0;
  transition: all 0.3s ease-out;
}

.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.9;
}

.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  transition: all 0.3s ease-out;
}

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}/*# sourceMappingURL=style.css.map */