@charset "UTF-8";
body {
  font-family: "Noto Sans", sans-serif;
}

.font-sm, .ticket__text > p, .copyright > p {
  font-size: 14px;
  color: rgb(26, 25, 22);
}

.font-md, .nasu-header__text > p, .activity__text > p {
  font-size: 18px;
  color: rgb(26, 25, 22);
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .font-md, .nasu-header__text > p, .activity__text > p {
    font-size: 24px;
  }
}

.font-lr, .activity__subtitle > h3 {
  font-size: 24px;
  color: rgb(26, 25, 22);
}
@media screen and (min-width: 768px) {
  .font-lr, .activity__subtitle > h3 {
    font-size: 34px;
  }
}

.font-lg, .activity__number > p {
  font-size: 48px;
  color: rgb(26, 25, 22);
}
@media screen and (min-width: 768px) {
  .font-lg, .activity__number > p {
    font-size: 80px;
  }
}

.font-lr-bold {
  font-size: 24px;
  color: rgb(26, 25, 22);
  font-weight: 700;
}

.font-lr-white, .nasu-header__subtitle > h3 {
  font-size: 20px;
  color: rgb(255, 255, 255);
  font-weight: 700;
  line-height: 1;
  margin: 0;
}
@media screen and (min-width: 768px) {
  .font-lr-white, .nasu-header__subtitle > h3 {
    font-size: 30px;
  }
}

.font-md-white {
  font-size: 16px;
  color: rgb(255, 255, 255);
}

.font-title, .nasu-header__title > h1 {
  font-size: 38px;
  color: rgb(255, 255, 255);
  font-weight: 900;
  line-height: 1;
  margin: 0;
}
@media screen and (min-width: 768px) {
  .font-title, .nasu-header__title > h1 {
    font-size: 62px;
  }
}

.font-lr-title, .activity__title > h2 {
  font-size: 28px;
  color: #a0522d;
  font-family: "Zen Antique Soft", serif;
}
@media screen and (min-width: 768px) {
  .font-lr-title, .activity__title > h2 {
    font-size: 38px;
  }
}

#conteiner {
  margin: 0 auto;
  max-width: 375px;
}
@media screen and (min-width: 768px) {
  #conteiner {
    max-width: 1366px;
    min-width: 1080px;
  }
}

.nasu-header {
  margin-bottom: 150px;
  width: 100%;
}
.nasu-header__inner {
  position: relative;
}
.nasu-header__img {
  width: 375px;
  border: 5px solid rgb(26, 25, 22);
}
.nasu-header__img > img {
  width: 365px;
}
@media screen and (min-width: 768px) {
  .nasu-header__img {
    width: 100%;
  }
  .nasu-header__img > img {
    width: 100%;
  }
}
.nasu-header__title {
  position: absolute;
  top: 100px;
  left: 54.547px;
}
.nasu-header__title > h1 {
  text-shadow: 0 0 0.2em rgb(0, 0, 0);
}
.nasu-header__title > h1 > strong {
  font-size: 56px;
  color: red;
}
@media screen and (min-width: 768px) {
  .nasu-header__title {
    top: 13vh;
    left: 10vh;
  }
  .nasu-header__title > h1 > strong {
    font-size: 80px;
  }
}
.nasu-header__subtitle {
  position: absolute;
  top: 50px;
  left: 87.5px;
}
.nasu-header__subtitle > h3 {
  text-shadow: 0 0 0.2em rgb(0, 0, 0);
}
@media screen and (min-width: 768px) {
  .nasu-header__subtitle {
    top: 7vh;
    left: 16vh;
  }
}
@media screen and (min-width: 768px) {
  .nasu-header__box {
    position: absolute;
    top: 60%;
    left: 58%;
  }
}
.nasu-header__text {
  text-align: center;
  width: 300px;
  padding: 15px;
  margin: 3px auto;
  background: #fbc7f5; /* 紙の色 */
  box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.03);
  transform: rotate(2deg);
  word-break: break-all;
}
.nasu-header__text > p {
  line-height: 1.7;
  margin: 20px 0 0 0;
}
@media screen and (min-width: 768px) {
  .nasu-header__text {
    width: 400px;
  }
  .nasu-header__text > p {
    font-size: 26px;
  }
}
.nasu-header__tape {
  width: 50%;
  height: 35px;
  margin: -25px auto 0;
  background: rgba(251, 234, 144, 0.5); /* テープの色 */
  transform: rotate(-3deg);
  opacity: 0.9;
}

.activity {
  margin-top: 50px;
}
.activity__title {
  position: relative;
  text-align: center;
}
.activity__title::before {
  position: absolute;
  content: "";
  width: 22%;
  border-bottom: 2px solid #a0522d;
  top: 50%;
  left: 0;
}
@media screen and (min-width: 768px) {
  .activity__title::before {
    width: 35%;
  }
}
.activity__title::after {
  position: absolute;
  content: "";
  width: 22%;
  border-bottom: 2px solid #a0522d;
  top: 50%;
  right: 0;
}
@media screen and (min-width: 768px) {
  .activity__title::after {
    width: 35%;
  }
}
.activity__title > h2 {
  margin: 0;
}
.activity__first, .activity__second {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-top: 100px;
}
@media screen and (min-width: 768px) {
  .activity__first, .activity__second {
    flex-direction: row;
    margin: 200px auto 50px auto;
    width: 100%;
    gap: 40px;
    justify-content: center;
    align-items: center;
  }
}
@media screen and (min-width: 768px) {
  .activity__second {
    flex-direction: row-reverse;
  }
}
.activity__inner {
  text-align: center;
}
.activity__topitem {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 30px;
}
.activity__topitem.rv {
  flex-direction: row-reverse;
}
.activity__space {
  width: 100px;
  height: 100px;
}
@media screen and (min-width: 768px) {
  .activity__space {
    width: 150px;
    height: 150px;
  }
}
.activity__logo {
  width: 100px;
}
.activity__logo > img {
  width: 100px;
}
.activity__logo.second {
  transform: rotate(350deg);
}
.activity__logo.five {
  transform: rotate(-350deg);
}
@media screen and (min-width: 768px) {
  .activity__logo {
    width: 150px;
  }
  .activity__logo > img {
    width: 100%;
  }
}
.activity__number > p {
  font-style: italic;
  line-height: 1;
  color: #0000cd;
  margin: 0;
}
.activity__number.two > p {
  color: #006400;
}
.activity__number.three > p {
  color: #6c2463;
}
.activity__number.four > p {
  color: #72640c;
}
.activity__number.five > p {
  color: #006a6c;
}
.activity__number.six > p {
  color: #6a1917;
}
.activity__number.last > p {
  color: #4e454a;
}
.activity__subtitle {
  margin-bottom: 20px;
}
.activity__subtitle > h3 > strong {
  font-size: 32px;
}
@media screen and (min-width: 768px) {
  .activity__subtitle > h3 > strong {
    font-size: 48px;
  }
}
.activity__text {
  margin-bottom: 40px;
}
.activity__text > p {
  margin: 0;
  line-height: 1.9;
}
.activity__img {
  position: relative;
  width: 375px;
  margin-bottom: 20px;
  overflow: visible;
}
.activity__img > img {
  width: 375px;
  height: 250px;
  border: 2px solid rgb(82, 78, 77);
}
.activity__img.last {
  padding-bottom: 100px;
}
@media screen and (min-width: 768px) {
  .activity__img {
    width: 650px;
    margin-bottom: 0;
  }
  .activity__img > img {
    width: 650px;
    height: auto;
  }
  .activity__img.last {
    padding-bottom: 0;
  }
}
.activity__rotate {
  position: absolute;
  top: 146px;
  left: 270px;
}
@media screen and (min-width: 768px) {
  .activity__rotate {
    top: 300px;
    left: -10px;
  }
}
.activity__rotate.two {
  left: 0;
}
@media screen and (min-width: 768px) {
  .activity__rotate.two {
    left: 360px;
  }
}
.activity__rotate.three {
  top: 0;
  left: 0;
}
@media screen and (min-width: 768px) {
  .activity__rotate.three {
    top: -50px;
    left: -10px;
  }
}
@media screen and (min-width: 768px) {
  .activity__rotate.four {
    top: -50px;
    left: 370px;
  }
}
@media screen and (min-width: 768px) {
  .activity__rotate.five {
    top: -50px;
    left: -10px;
  }
}
.activity__rotate.six {
  top: 0;
  left: 0;
}
@media screen and (min-width: 768px) {
  .activity__rotate.six {
    top: -50px;
    left: 370px;
  }
}
.activity__subimg {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-image: url("../images/jinjyaSP.jpg");
  background-position: 4% -1%;
  background-repeat: no-repeat;
  border: 5px solid rgb(255, 255, 255);
}
@media screen and (min-width: 768px) {
  .activity__subimg {
    width: 300px;
    height: 200px;
    border-radius: 0%;
    background-image: url("../images/jinjyaPC.jpg");
    transform: rotate(353deg);
  }
}
.activity__subimg.two {
  background-image: url("../images/morumottoSP.jpg");
  background-position: 57% 73%;
}
@media screen and (min-width: 768px) {
  .activity__subimg.two {
    background-image: url("../images/morumottoPC.jpg");
    transform: rotate(-353deg);
  }
}
.activity__subimg.three {
  background-image: url("../images/onnsenn2SP.jpg");
  background-position: 74% 75%;
}
@media screen and (min-width: 768px) {
  .activity__subimg.three {
    background-image: url("../images/onnsenn2PC.jpg");
  }
}
.activity__subimg.four {
  background-image: url("../images/usi2SP.jpg");
  background-position: 17% 4%;
}
@media screen and (min-width: 768px) {
  .activity__subimg.four {
    background-image: url("../images/usi2PC.jpg");
    transform: rotate(-353deg);
  }
}
.activity__subimg.five {
  background-image: url("../images/usiSP.jpg");
  background-position: 26% 17%;
}
@media screen and (min-width: 768px) {
  .activity__subimg.five {
    background-image: url("../images/usiPC.jpg");
  }
}
.activity__subimg.six {
  background-image: url("../images/onnsennnmatiSP.jpg");
  background-position: 38% 30%;
}
@media screen and (min-width: 768px) {
  .activity__subimg.six {
    background-image: url("../images/onnsennnmatiPC.jpg");
    transform: rotate(-353deg);
  }
}
.activity__subimg.last {
  background-image: url("../images/kougeiSP.jpg");
  background-position: 49% 44%;
}
@media screen and (min-width: 768px) {
  .activity__subimg.last {
    background-image: url("../images/kougeiPC.jpg");
  }
}

.nasu-footer {
  margin: 150px auto 0 auto;
}

.ticket {
  position: relative;
  background-image: url("../images/autumn40SP.png");
  background-position: 65% 0;
  width: 360px;
  margin: 0 auto;
  background-repeat: no-repeat;
  border: 2px solid rgb(127, 0, 25);
}
@media screen and (min-width: 768px) {
  .ticket {
    width: 1080px;
    background-image: url("../images/autumn40PC.png");
  }
}
.ticket__top {
  text-align: center;
  position: absolute;
  top: -16px;
  background-color: #946c45;
  border-radius: 100vh;
  border: 2px solid rgb(82, 78, 77);
  width: 360px;
}
.ticket__top > h3 {
  font-size: 16px;
  margin: 0;
  color: rgb(255, 255, 255);
  line-height: 2;
}
@media screen and (min-width: 768px) {
  .ticket__top {
    width: 600px;
    left: 238px;
    top: -26px;
  }
  .ticket__top > h3 {
    font-size: 26px;
  }
}
.ticket__title {
  padding-top: 54px;
  text-align: center;
  margin: 0 auto 23px auto;
  width: 300px;
}
.ticket__title > h2 {
  font-size: 24px;
  color: #192f60;
  margin: 0;
  font-family: "Yuji Boku", serif;
  line-height: 1.7;
}
.ticket__title > h2 > strong {
  color: rgb(127, 0, 25);
  font-size: 32px;
}
@media screen and (min-width: 768px) {
  .ticket__title {
    width: 800px;
    padding-top: 50px;
  }
  .ticket__title > h2 {
    font-size: 52px;
  }
  .ticket__title > h2 > strong {
    font-size: 68px;
  }
}
.ticket__price {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 30px;
}
.ticket__price > p {
  font-size: 18px;
  color: #24140e;
  margin: 0;
  line-height: 1.7;
}
.ticket__price > p > strong {
  font-size: 24px;
  color: rgb(127, 0, 25);
}
@media screen and (min-width: 768px) {
  .ticket__price > p {
    font-size: 28px;
  }
  .ticket__price > p > strong {
    font-size: 44px;
  }
}
.ticket__bottom {
  margin-top: 20px;
}
@media screen and (min-width: 768px) {
  .ticket__bottom {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 40px;
    margin-bottom: 40px;
  }
}
@media screen and (min-width: 768px) {
  .ticket__bottonitems {
    justify-content: space-between;
  }
}
.ticket__img {
  width: 100px;
  margin: 0 auto;
}
.ticket__img > img {
  width: 100px;
}
@media screen and (min-width: 768px) {
  .ticket__img {
    width: 150px;
  }
  .ticket__img > img {
    width: 150px;
  }
}
.ticket__text {
  text-align: center;
  padding: 0 30px;
}
.ticket__text > p {
  line-height: 1.7;
  color: #24140e;
  margin: 0;
}
@media screen and (min-width: 768px) {
  .ticket__text > p {
    font-size: 20px;
  }
}

.copyright {
  margin-top: 50px;
  padding: 0 30px;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .img-fit {
    height: 430px !important;
  }
}

.appear.up .item {
  transform: translateY(10px);
}

.appear2.up .item {
  transform: translateY(10px);
}

.appear3.up .item {
  transform: translateY(10px);
}

.appear.down .item {
  transform: translateY(-10px);
}

.appear2.down .item {
  transform: translateY(-10px);
}

.appear3.down .item {
  transform: translateY(-10px);
}

.appear.left .item {
  transform: translateX(40px);
}

.appear2.left .item {
  transform: translateX(40px);
}

.appear3.left .item {
  transform: translateX(40px);
}

.appear.right .item {
  transform: translateX(-40px);
}

.appear2.right .item {
  transform: translateX(-40px);
}

.appear3.right .item {
  transform: translateX(-40px);
}

.appear.fadein .item {
  transform: translateX(0);
}

.appear2.fadein .item {
  transform: translateX(0);
}

.appear3.fadein .item {
  transform: translateX(0);
}

.appear .item {
  transition: all 1.5s;
  opacity: 0;
}
.appear.inview .item {
  opacity: 1;
  transform: none;
}
.appear.inview .item:nth-child(1) {
  transition-delay: 0.5s;
}
.appear.inview .item:nth-child(2) {
  transition-delay: 1s;
}
.appear.inview .item:nth-child(3) {
  transition-delay: 1.5s;
}
.appear.inview .item:nth-child(4) {
  transition-delay: 2s;
}
.appear.inview .item:nth-child(5) {
  transition-delay: 2.5s;
}
.appear.inview .item:nth-child(6) {
  transition-delay: 3s;
}
.appear.inview .item:nth-child(7) {
  transition-delay: 3.5s;
}
.appear.inview .item:nth-child(8) {
  transition-delay: 4s;
}
.appear.inview .item:nth-child(9) {
  transition-delay: 4.5s;
}
.appear.inview .item:nth-child(10) {
  transition-delay: 5s;
}

.appear2 .item {
  transition: all 3s;
  opacity: 0;
}
.appear2.inview .item {
  opacity: 1;
  transform: none;
}

.appear3 .item {
  transition: all 1s;
  opacity: 0;
}
.appear3.inview .item {
  opacity: 1;
  transform: none;
}

.activity__button {
  margin-bottom: 70px;
}
.activity__button > a {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  transition: all 0.3s;
  text-align: center;
  text-decoration: none;
  overflow: hidden;
  padding: 1.5rem 6rem;
  color: rgb(26, 25, 22);
  border: 1px solid rgb(26, 25, 22);
  border-radius: 100vh;
}
@media screen and (min-width: 768px) {
  .activity__button > a {
    font-size: 26px;
  }
}
.activity__button > a > span {
  position: relative;
}
.activity__button > a::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 150%;
  height: 500%;
  content: "";
  transition: all 0.5s ease-in-out;
  transform: translateX(-89%) translateY(-25%) rotate(45deg);
  background: #0000cd;
}
.activity__button > a:hover {
  color: rgb(255, 255, 255);
}
.activity__button > a:hover::before {
  transform: translateX(-9%) translateY(-25%) rotate(45deg);
}
.activity__button.rv > a::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 150%;
  height: 500%;
  content: "";
  transition: all 0.5s ease-in-out;
  transform: translateX(66%) translateY(-18%) rotate(45deg);
  background: #0000cd;
}
.activity__button.rv > a:hover {
  color: rgb(255, 255, 255);
}
.activity__button.rv > a:hover::before {
  transform: translateX(5%) translateY(-25%) rotate(45deg);
}
.activity__button.two > a::before {
  background: #006400;
}
.activity__button.three > a::before {
  background: #6c2463;
}
.activity__button.four > a::before {
  background: #72640c;
}
.activity__button.five > a::before {
  background: #006a6c;
}
.activity__button.six > a::before {
  background: #6a1917;
}
.activity__button.last > a::before {
  background: #4e454a;
}

.ticket__button {
  display: flex;
  align-items: center;
  background-color: rgb(127, 0, 25);
  height: 45px;
  width: 300px;
  margin: 0 auto 30px;
  box-shadow: 8px 5px 5px rgba(26, 25, 22, 0.5);
  transition: 0.3s;
}
@media screen and (min-width: 768px) {
  .ticket__button {
    margin: 0 auto;
  }
}
.ticket__button > a {
  font-size: 20px;
  font-weight: 700;
  position: relative;
  width: 280px;
  height: 45px;
  margin: 0 auto;
  color: rgb(255, 255, 255);
  text-align: center;
  padding-top: 10px;
}
.ticket__button:hover {
  background-color: transparent;
  border: 1px solid rgb(26, 25, 22);
  box-shadow: none;
  transition: 0.3s;
  transform: translateX(2px) translateY(2px);
}
.ticket__button:hover > a {
  color: rgb(26, 25, 22);
  text-decoration: none;
}
.ticket__button:hover > a::before {
  border-top: 3px solid rgb(26, 25, 22);
  border-right: 3px solid rgb(26, 25, 22);
}

.textanime > span {
  opacity: 0;
}
.textanime.appeartext > span {
  -webkit-animation-name: text_anime_on;
          animation-name: text_anime_on;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-direction: normal;
          animation-direction: normal;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes text_anime_on {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes text_anime_on {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.textanime2 > span {
  opacity: 0;
}
.textanime2.appeartext2 > span {
  -webkit-animation-name: text_random_on;
          animation-name: text_random_on;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-direction: normal;
          animation-direction: normal;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.textanime2.appeartext2 > span:nth-child(2n) {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
.textanime2.appeartext2 > span:nth-child(3n+1) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

@-webkit-keyframes text_random_on {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes text_random_on {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.textanime3::after {
  content: " |";
  -webkit-animation-name: text_typing_on;
          animation-name: text_typing_on;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-direction: normal;
          animation-direction: normal;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.textanime3 > span {
  display: none;
}

@-webkit-keyframes text_typing_on {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes text_typing_on {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}/*# sourceMappingURL=styles.css.map */