@charset "UTF-8";

@font-face {
    font-family: 'Noto Sans JP';
    src: url('../../../fonts/NotoSansJP-SemiBold.ttf') format('ttf');
    font-display: swap;
    font-style: normal;
}


img{
	max-width:100%;
	height: auto;
	vertical-align: top;
	border: 0;
}

#wrapper {
    margin: 0 auto;
    max-width: 1920px;
    position: relative;
    overflow: hidden;
    -webkit-background-size: 8%;
    background-size: 8%;
}
.inner {
    margin: 0 auto;
    position: relative;
}
@media only screen and (max-width:800px){
	.inner {
		width: 90%;
	}
}
@media print, screen and (min-width:800px){
	body {
		min-width: 1200px;
	}
	
    #wrapper {
        min-width: 1200px;
        -webkit-background-size: 59px;
        background-size: 59px;
    }
    .inner {
        width: 1120px;
    }
}

.splash {
    position: relative;
}

.splash .splash4 {
    margin: -28% auto 0;
    padding-top: 54%;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/blood.png") no-repeat top center;
    -webkit-background-size: 160%;
    background-size: 160%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    transform: scale(0);
}
.splash.aniInview .splash4 {
    transition: all 0.1s ease 0.3s;
/*    transform: scale(1.2); */
    transform: scale(1);
}
.splash.aniInview.aniBase .splash4 {
    transition: all 0.5s ease;
    transform: scale(1);
}
.splash + .title {
    transform: scale(0);
    margin-top: 150px;
    margin-bottom: -150px;
}
.splash.aniInview + .title {
/*    transition: all 0.2s ease 0.1s; */
    transition: all 0.8s ease 0.5s;
    transform: scale(1);
}


.blockR,
.blockL {
    transform: scale(0);
}
.blockR.aniInview,
.blockL.aniInview {
    transition: all 0.2s ease 0.2s;
    transform: scale(1);
}
.blockR .main-block .detail {
    transform: translate(110%, -30%);
}
.blockL .main-block .detail {
    transform: translate(-110px, 30%);
}
.blockR.aniInview.aniBase .main-block .detail {
/*    transition: all 0.2s ease 0.2s; */
/*    transform: translate(0, 0); */
    transition: all 0.6s ease 0.2s;
    transform: translate(0, -28%);
}
.blockL.aniInview.aniBase .main-block .detail {
/*    transition: all 0.2s ease 0.2s; */
/*    transform: translate(0, 0); */
    transition: all 0.6s ease 0.2s;
    transform: translate(0, -28%);
}

.buttons {
    transform: scale(0);
}
.buttons.aniInview {
    transition: all 0.2s ease 0.2s;
    transform: scale(1);
}

.buttons.aniInview.aniBase {
    transform: translate(0, -28%);
    transform: scale(1);
}

.splash .splash4 {
    margin: -100px auto 0;
    padding-top: 500px;
    width: 600px;
    background: url("../../../images/event/2508higurashi2/blood.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
}
.blockR .main-block .detail {
    transform: translate(1600px, -240px);
}
.blockL .main-block .detail {
    transform: translate(-1600px, -240px);
}

#story {
    padding-top: 220px;
}
#story .blockR {
    margin: 0 auto;
    padding-top: 1400px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-story.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#story .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#story .detail {
    margin: 250px auto 0;
    width: 1120px;
    height: 1200px;
    background: url("../../../images/event/2508higurashi2/detail-story.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    top: 0;
    left: 0;
    right: 0;
}
#story .detail img {
    height: 0;
    opacity: 0;
}

#movie {
    padding-top: 220px;
}
#movie .blockL {
    margin: 0 auto;
    padding-top: 1000px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-movie.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#movie .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#movie .detail {
    margin: 150px auto 0;
    width: 1120px;
    height: 1000px;
    background: url("../../../images/event/2508higurashi2/detail-movie.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#movie .trailer {
  margin: 430px auto 0;
  max-width: 720px;
}
#movie .detail img {
    height: 0;
    opacity: 0;
}

#covid19 {
    padding-top: 0px;
}
#covid19 .blockR {
    margin: 0 auto;
    padding-top: 1300px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-covid19.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#covid19 .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#covid19 .detail {
    margin: 650px auto 0;
    width: 1120px;
    height: 1800px;
    background: url("../../../images/event/2508higurashi2/detail-covid19.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#covid19 .detail img {
    height: 0;
    opacity: 0;
}

#goods {
    padding-top: 220px;
    position: relative;
}
#goods .blockL {
    margin: 0 auto;
    padding-top: 1000px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-goods.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#goods .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#goods .detail {
    margin: 240px auto 0;
    width: 960px;

    height: 1100px;
    background: url("../../../images/event/2508higurashi2/detail-goods.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    top: 0;
    left: 0;
    right: 0;
}
#goods .detail img {
    height: 0;
    opacity: 0;
}

#information {
    padding-top: 220px;
}
#information .blockR {
    margin: 0 auto;
    padding-top: 1600px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-information.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#information .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#information .detail {
    margin: 340px auto 0;
    width: 1120px;
    height: 1450px;
    background: url("../../../images/event/2508higurashi2/detail-information.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#information .detail img {
    height: 0;
    opacity: 0;
}

#schedule {
    padding-top: 220px;
    position: relative;
}
#schedule .blockL {
    margin: 0 auto;
    padding-top: 1000px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-schedule.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#schedule .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#schedule .detail {
    margin: 150px auto 0;
    width: 1120px;
    height: 1100px;
    background: url("../../../images/event/2508higurashi2/detail-schedule.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    top: 0;
    left: 0;
    right: 0;
}
#schedule .detail img {
    height: 0;
    opacity: 0;
}
#schedule .buttons {
}
#schedule .button-ticket {
  position: absolute;
  bottom: 34%;
  left: 48%;
  z-index: 9;
}

#schedule .button-transfer {
  position: absolute;
  bottom: 17%;
  left: 65%;
  z-index: 9;
}

#map {
    padding-top: 220px;
    position: relative;
}
#map .blockR {
    margin: 0 auto;
    padding-top: 1000px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-map.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#map .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#map .detail {
    margin: 136px auto 0;
    width: 1120px;
    height: 1000px;
    background: url("../../../images/event/2508higurashi2/detail-map.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#map .detail img {
    height: 0;
    opacity: 0;
}
#map .buttons {
}
#map .button-map {
  position: absolute;
  bottom: 22%;
  left: 55%;
  z-index: 9;
}
#map .text-map {
  position: absolute;
  top: 40%;
  left: 49%;

  color: black;
  font-family: "Yu Mincho", "YuMincho","游明朝体", "Noto Sans JP", serif;

  font-size: 20px;
  font-weight: 700;

  text-align: left;
}
#map .text-map .large {
  font-size: 24px;
}

#introduction {
    padding-top: 220px;
}
#introduction .blockL {
    margin: 0 auto;
    padding-top: 1300px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-introduction.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#introduction .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#introduction .detail {
    margin: 300px auto 0;
    width: 1120px;
    height: 1200px;
    background: url("../../../images/event/2508higurashi2/detail-introduction.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    top: 0;
    left: 0;
    right: 0;
}

#introduction .detail img {
    height: 0;
    opacity: 0;
}


#faq {
    padding-top: 220px;
}
#faq .blockR {
    margin: 0 auto;
    padding-top: 1700px;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/pc/white-faq.png") no-repeat top center;
    -webkit-background-size: auto;
    background-size: auto;
}
#faq .main-block {
    margin: 0 auto;
    width: 1120px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#faq .detail {
    margin: 300px auto 0;
    width: 1120px;
    height: 1500px;
    background: url("../../../images/event/2508higurashi2/detail-faq.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    top: 0;
    left: 0;
    right: 0;
}
#faq .detail img {
    height: 0;
    opacity: 0;
}

.logo-yodaka {
    z-index: 10;
}

/* 1400px以下 */
@media screen and (max-width:1400px) {
  #schedule .button-ticket {
    width: calc(231 / 1300 * 100vw * 1.0);
  }
  #schedule .button-transfer {
    width: calc(229 / 1300 * 100vw * 0.8);
  }
  #map .button-map {
    width: calc(173 / 1300 * 100vw * 0.8);
  }
}

/* 800px以下 */
@media screen and (max-width:800px) {
  .splash .splash4 {
      margin: 20% auto 0;
      padding-top: 60%;
      width: 80vw;
      background: url("../../../images/event/2508higurashi2/blood.png") no-repeat top center;
      -webkit-background-size: 80%;
      background-size: 80%;
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      transform: scale(0);
  }
  .splash + .title {
      transform: scale(0);
      position: absolute;
      margin: 0 auto;
      left: 0;
      right: 0;
      top: 35%;
  }
  .blockR .main-block .detail {
      transform: translate(110%, -30%);
  }
  .blockL .main-block .detail {
      transform: translate(-110px, -30%);
  }

  /* --- story --- */
  #story {
    padding-top: 10%;
    margin: 0 auto;
    position: relative;
  }

  #story .blockR {
    margin: 220px auto 0;
    padding-top: 100%;
    width: 100vw;
    background: url("../../../images/event/2508higurashi2/mobile/white-story.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }

  #story .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #story .detail {
    margin: 120px 0 0;
    width: 95vw;
    height: 600px;
    background: url("../../../images/event/2508higurashi2/detail-story.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

  /* --- movie --- */
  #movie {
    margin: 0 auto;
    padding-top: 10%;
    position: relative;
  }

  #movie .blockL {
    margin: 230px auto 0;
    padding-top: 100%;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/mobile/white-movie.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }

  #movie .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #movie .detail {
    margin: 140px 0 0;
    width: 95vw;
    height: 600px;
    background: url("../../../images/event/2508higurashi2/detail-movie.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

  #movie .trailer {
    positon: absolute;
    margin: 37% 0 0 20%;
    ;
    left: 0;
    right: 0;
    max-width: 75vw;
  }

  /* --- covid19 --- */
  #covid19 {
    padding-top: 10%;
    margin: 0 auto;
    position: relative;
  }

  #covid19 .blockR {
    margin: 0px auto 0;
    padding-top: 100%;
    width: 100vw;
    background: url("../../../images/event/2508higurashi2/mobile/white-covid19.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }
  #covid19 .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #covid19 .detail {
    margin: 200px 0 0;
    width: 95vw;
    height: 600px;
    background: url("../../../images/event/2508higurashi2/detail-covid19.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

  /* --- goods --- */
  #goods {
    margin: 0 auto;
    padding-top: 10%;
    position: relative;
  }

  #goods .blockL {
    margin: 220px auto 0;
    padding-top: 100%;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/mobile/white-goods.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }

  #goods .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #goods .detail {
    margin: 110px 0 0;
    width: 95vw;
    height: 600px;
    background: url("../../../images/event/2508higurashi2/detail-goods.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

 /* --- information --- */
  #information {
    margin: 0 auto;
    padding-top: 10%;
    position: relative;
  }
  #information .blockR {
    margin: 220px auto 0;
    padding-top: 100%;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/mobile/white-information.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }

  #information .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #information .detail {
    margin: 180px 0 0;
    width: 95vw;
    height: 800px;
    background: url("../../../images/event/2508higurashi2/detail-information.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

  /* --- schedule --- */
  #schedule {
    margin: 0 auto;
    padding-top: 10%;
    position: relative;
  }

  #schedule .blockL {
    margin: 220px auto 0;
    padding-top: 100%;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/mobile/white-schedule.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }

  #schedule .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #schedule .detail {
    margin: 120px 0 0;
    width: 95vw;
    height: 600px;
    background: url("../../../images/event/2508higurashi2/detail-schedule.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

  #schedule .buttons {
  }
  #schedule .button-ticket {
    position: absolute;
    bottom: 29%;
    left: 45%;
    z-index: 9;
    width: calc(229 / 800 * 100vw * 0.8);
  }
  #schedule .button-transfer {
    position: absolute;
    top: 78.5%;
    left: 70%;
    z-index: 9;
    width: calc(229 / 800 * 100vw * 0.8);
  }

  /* --- map --- */
  #map {
    margin: 0 auto;
    padding-top: 10%;
    position: relative;
  }

  #map .blockR {
    margin: 220px auto 0;
    padding-top: 100%;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/mobile/white-map.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }

  #map .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #map .detail {
    margin: 130px 0 0;
    width: 95vw;
    height: 600px;
    background: url("../../../images/event/2508higurashi2/detail-map.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

  #map .buttons {}

  #map .button-map {
    position: absolute;
    bottom: 22%;
    left: 52%;
    z-index: 9;
    width: calc(191 / 800 * 100vw * 0.8);
  }

  #map .text-map {
    position: absolute;
    top: 55%;
    left: 48%;

    font-size: 1.5vw;
    z-index: 9;
  }
  #map .text-map .large {
    font-size: 2vw;
  }

 /* --- introduction --- */
  #introduction {
    margin: 0 auto;
    padding-top: 10%;
    position: relative;
  }

  #introduction .blockL {
    margin: 240px auto 0;
    padding-top: 100%;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/mobile/white-introduction.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }

  #introduction .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #introduction .detail {
    margin: 120px 0 0;
    width: 95vw;
    height: 600px;
    background: url("../../../images/event/2508higurashi2/detail-introduction.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

  /* --- faq --- */
  #faq {
    margin: 0 auto;
    padding-top: 25%;
    position: relative;
  }

  #faq .blockR {
    margin: 220px auto 0;
    padding-top: 130%;
    width: 100%;
    background: url("../../../images/event/2508higurashi2/mobile/white-faq.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: relative;
    z-index: 1;
  }

  #faq .main-block {
    margin: 0 auto;
    width: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  #faq .detail {
    margin: 120px 0 0;
    width: 95vw;
    height: 600px;
    background: url("../../../images/event/2508higurashi2/detail-faq.png") no-repeat top center;
    -webkit-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
  }

}