@charset "utf-8";
/* -----------------------------------------------------------------
 fv
----------------------------------------------------------------- */
.fv {
  width: max(calc(100vw - 180px),92vw);
  margin-left: auto;
  margin-right: auto;
  padding-top: 16rem;
}
.fv_logo_single,
.fv_logo_row{
  display: none;
}
.fv_splide {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-left: auto;
  margin-right: auto;
}
.fv_title {
  margin-top: 12rem;
  font-size: 1.4rem;
}
#slider_mv {
  max-width: 1400px;
  margin-top: 1.6rem;  
}
#slider_mv .splide__slide img {
  transform: scale(1.1) translateX(-1.5%);
  transition: transform 7s linear;
}
#slider_mv .splide__slide.is-active img {
  transform: scale(1.05) translateX(1.5%);
}

@media screen and (max-width: 767px) {
  .fv {
    padding-top: 12rem;
  }
  .fv_logo_row {
    display: block;
    width: 60%;
    margin-left: auto;
    margin-right: auto;
  }
  .fv_splide {
    align-items: center;
  }
  .fv_title {
    margin-top: 1.5em;
    text-align: center;
    font-size: min(3.7vw,1.4rem);
  }
  #slider_mv {
    margin-top: 6rem;  
  }
}
@media print, screen and (min-width: 768px) {
  .fv_logo_single {
    display: block;
  }
  .fv_splide {
    width: 80%;
    margin-left: auto;
    margin-right: 0;
  }
}

/* -----------------------------------------------------------------
 fv_intro
----------------------------------------------------------------- */
.fv_intro {
  position: relative;
  display: table;
/*
  width: 90%;
  max-width: 800px;
*/
  width: 100%;
  height: min(100vh,120vw);
  margin-left: auto;
  margin-right: auto;
  padding-top: 160px;
  padding-bottom: 600px;
  overflow: hidden;
}
.fv_intro_bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.fv_intro_title {
}
.fv_intro_title .sub {
  font-size: .8rem;
}
.fv_intro_title .title {
  margin-top: .2em;
  font-size: min(4vw,2.7rem);
}
.fv_intro_body {
  display: table;
  margin-left: auto;
  margin-right: 0;
  margin-top: 1.5rem;
}
.fv_intro_body p {
  line-height: 2.2;
}


@media screen and (max-width: 767px) {
  .fv_intro {
    padding-top: 80px;
    padding-bottom: 100px;
  }
  .fv_intro_title .title {
    font-size: 1.4rem;
  }
}


/* -----------------------------------------------------------------
 matter_canvas
----------------------------------------------------------------- */
#matter_canvas {
  position: absolute;
/*
  inset: -2px;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
*/
  width: 100%;
}

.fv_intro_title,
.fv_intro_body {
  position: relative;
  z-index: 2;
}