@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Oswald:wght@200..700&family=Zen+Kaku+Gothic+Antique&display=swap");
body {
  font-size: 16px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  color: #000; }

input,
button {
  font-size: 16px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  color: #000; }

.min {
  font-size: .8em; }

.ruby {
  font-size: .75em; }

.strong-high {
  font-size: 1.5em;
  font-weight: bold; }

.sch-head {
  font-size: 1.3em;
  font-weight: bold; }

.strong {
  font-size: 1.2em;
  font-weight: bold; }

.place-name {
  font-size: 2em;
  font-weight: bold; }
  .place-name .min {
    font-size: .5em;
    line-height: 1.2em; }

.bld {
  font-weight: bold; }

.font-os {
  font-size: 1.5em;
  font-family: "Oswald", sans-serif;
  font-weight: 700; }

.prof-next {
  font-size: 1em;
  font-family: "Oswald", sans-serif;
  font-weight: 700; }

.prof-prev {
  font-size: 1em;
  font-family: "Oswald", sans-serif;
  font-weight: 700; }

.about-text-box {
  font-size: 1.2em;
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  font-weight: bold;
  letter-spacing: 1px; }

.prof-text-box {
  font-size: 1.05em;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500; }

@media screen and (max-width: 540px) {
  body {
    font-size: 13.5px;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500; }

  .t-text {
    font-size: 1.1em; }
    .t-text .min {
      font-size: .8em; } }
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
@keyframes loadAnim {
  0% {
    transform: scale(1); }
  50% {
    opacity: 1; }
  100% {
    transform: scale(1.5);
    opacity: 0; } }
@keyframes load_out {
  0% {
    top: 0;
    opacity: 1; }
  90% {
    top: 0;
    opacity: 1; }
  100% {
    top: -100vh;
    top: -100dvh;
    pointer-events: none;
    opacity: 0; } }
@keyframes news {
  0% {
    transform: translateX(45em); }
  100% {
    transform: translateX(-45em); } }
.title-bar {
  width: calc(100% - 20px);
  background: #000;
  padding: 1em 10px;
  position: relative;
  z-index: 5; }
  .title-bar img {
    max-width: 140px; }

.news-bar {
  /*  position: fixed;
  left: 0;
  top: 0; */
  width: calc(100% - 2em);
  padding: 1em;
  color: #fff;
  background: #000;
  z-index: 10;
  color: #fff;
  position: relative;
  padding-top: 0; }
  .news-bar p {
    text-align: center; }

#loading {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  z-index: 200;
  background-color: #000;
  animation-name: load_out;
  animation-fill-mode: forwards;
  animation-duration: 4.5s; }
  #loading .loding-box {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 90%;
    max-width: 400px; }
    #loading .loding-box .logo-in {
      animation-name: loadAnim;
      animation-duration: 4s;
      animation-fill-mode: forwards; }

.fade {
  opacity: 0; }

.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

html,
body {
  width: 100%;
  overflow-x: hidden;
  background-color: #5D2E7B; }

img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto; }

section {
  display: block;
  position: relative;
  z-index: 0;
  padding: 80px 0; }

.inner-wrap {
  padding: 0 1em;
  width: calc(100% - 2em);
  max-width: 1200px;
  margin: 0 auto; }

a {
  transition-duration: .3s; }
  a:hover {
    opacity: .8; }

.menu-btn {
  position: fixed;
  right: 0;
  top: -100px;
  z-index: 10;
  max-width: 110px;
  cursor: pointer;
  transition-duration: .5s;
  filter: drop-shadow(1px 1px 2px black); }
  .menu-btn:hover {
    top: -90px;
    right: 10px; }
  .menu-btn.menu-active {
    right: -90px;
    top: -120px; }

.menu-close-btn {
  position: fixed;
  right: 1em;
  top: 1em;
  z-index: 12;
  max-width: 30px;
  cursor: pointer; }

#menu {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 20;
  left: 0;
  top: 0;
  display: none;
  background-color: #5D2E7B; }
  #menu:before {
    content: "";
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.01) 0%, rgba(0, 0, 0, 0.8) 30%, rgba(0, 0, 0, 0.8) 50%, rgba(0, 0, 0, 0.8) 70%, rgba(255, 255, 255, 0.01) 100%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0; }
  #menu:after {
    content: "";
    background-image: url(../images/bg-body.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    mix-blend-mode: screen;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    filter: blur(10px);
    z-index: 0; }
  #menu.menu-active {
    left: 0; }
  #menu .menu-in {
    width: 100%;
    height: 100%;
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 10; }
  #menu ul {
    width: 100%; }
  #menu li {
    padding-bottom: .5em;
    border-bottom: solid 1px #fff;
    width: 90%;
    margin: .5em auto 0; }
    #menu li a {
      display: flex;
      align-items: center;
      width: calc(100% - 2em);
      padding: .5em 1em;
      color: #fff;
      text-shadow: 1px 1px 2px black; }

.sns-menu {
  position: fixed;
  right: -0;
  bottom: 120px;
  max-width: 115px;
  z-index: 5;
  width: 100%;
  pointer-events: none; }
  .sns-menu a {
    display: block;
    margin-top: 5px;
    width: 115px;
    transform: translateX(60px);
    transition-duration: .3s;
    cursor: pointer;
    pointer-events: auto; }
    .sns-menu a:hover {
      transform: translateX(30px); }

.buy-link {
  max-width: 220px;
  position: fixed;
  right: -2em;
  bottom: 1em;
  z-index: 5;
  transition-duration: .3s; }
  .buy-link:hover {
    right: -1em; }

.header-logo {
  position: absolute;
  left: 1em;
  top: 1em;
  z-index: 10; }

#main-v {
  position: relative; }

.main-v-box {
  position: relative;
  z-index: 1; }
  .main-v-box .main-sp-video {
    display: none; }
  .main-v-box .main-v-pc {
    display: none; }
    .main-v-box .main-v-pc.main-v-active {
      display: block; }
  .main-v-box .main-v-sp {
    display: none; }
  .main-v-box video {
    width: 100%;
    display: block; }

.bg-body {
  background-color: #5D2E7B;
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0; }
  .bg-body:before {
    content: "";
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.01) 0%, rgba(0, 0, 0, 0.8) 30%, rgba(0, 0, 0, 0.8) 50%, rgba(0, 0, 0, 0.8) 70%, rgba(255, 255, 255, 0.01) 100%);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; }
  .bg-body:after {
    content: "";
    background-image: url(../images/bg-body.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    mix-blend-mode: screen;
    opacity: .8;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .6; }

.head-box {
  position: relative;
  max-width: 450px;
  width: 100%;
  margin: auto;
  z-index: 1; }
  .head-box .head-ima {
    filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.7)); }
  .head-box:before {
    content: "";
    background: url(../images/head-bg.svg);
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1; }
  .head-box:after {
    content: "";
    background-image: url(../images/head-texture.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 1;
    mix-blend-mode: screen; }

.h-bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1; }

.copy-head {
  width: 100%;
  padding: 120px 0;
  position: relative; }
  .copy-head .inner-wrap {
    max-width: 900px; }
  .copy-head .copy-pc {
    border-top: solid 2px #fff;
    border-bottom: solid 2px #fff;
    padding: 40px 0;
    mix-blend-mode: color-dodge;
    transform: translate3d(0, 0, 0); }
    .copy-head .copy-pc img {
      width: 90%; }
  .copy-head .copy-sp {
    display: none;
    border-top: solid 2px #fff;
    border-bottom: solid 2px #fff;
    padding: 40px 0;
    mix-blend-mode: color-dodge;
    transform: translate3d(0, 0, 0); }

#cm {
  padding-top: 0; }
  #cm .youtube {
    max-width: 900px;
    width: 100%;
    margin: 0 auto; }
    #cm .youtube iframe {
      width: 100%;
      height: 100%;
      aspect-ratio: 16/9; }

#about {
  padding-top: 0;
  padding-bottom: 120px; }
  #about .inner-wrap {
    max-width: none; }
  #about .story-head {
    margin: 1em auto;
    max-width: 900px; }
  #about .about-text-box {
    max-width: 1200px;
    margin: 0 auto;
    text-shadow: 1px 1px 2px black;
    color: #fff;
    text-align: center; }
    #about .about-text-box p {
      margin-bottom: 2em; }
      #about .about-text-box p:last-of-type {
        margin-bottom: 0; }
  #about .about-flex {
    display: flex;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    text-shadow: 1px 1px 2px black; }
    #about .about-flex p {
      margin-bottom: 1em; }
  #about .col-l {
    box-sizing: border-box;
    width: 48%;
    margin: auto 1%;
    padding: 1em;
    color: #fff; }
  #about .col-r {
    width: 48%;
    margin: auto 1%;
    position: relative; }
    #about .col-r:after {
      content: "";
      background-image: url(../images/about-texture.png);
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      z-index: 1;
      position: absolute;
      mix-blend-mode: screen; }

#voice {
  margin: 0 auto;
  background-image: url(../images/koe-bg.webp);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding: 80px 0 40px;
  position: relative;
  z-index: 1; }
  #voice .v-box {
    position: relative; }
  #voice .v-head {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    margin-top: -120px; }
  #voice .v-item {
    width: calc(100% - 4em);
    margin: 1em auto;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 12px;
    padding: 2em;
    max-width: 900px; }

#prof {
  background: url(../images/prof-bg.webp);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  padding-bottom: 0;
  padding-top: 0;
  overflow: hidden; }
  #prof .prof-head {
    width: 100%;
    margin: 0 auto;
    max-width: 900px; }
  #prof .prof-box {
    width: 100%;
    position: relative;
    padding-top: 100px; }
  #prof .prof-pick {
    width: 50%;
    pointer-events: none;
    position: relative;
    z-index: 1; }
  #prof .pick-item {
    display: none; }
  #prof .pick-1 {
    display: block; }
  #prof .prof-item-box {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 70%;
    height: calc(100% - 120px); }
  #prof .prof-item {
    position: absolute;
    bottom: -10%;
    max-width: 300px;
    width: 30%;
    z-index: 0;
    cursor: pointer;
    transition-duration: .3s; }
  #prof .prof-item-1 {
    left: calc(40px + 20%);
    bottom: -40%;
    width: 30%; }
  #prof .prof-item-2 {
    left: 40px;
    bottom: -80px;
    width: 25%; }
  #prof .prof-item-3 {
    left: calc(40px + 45%);
    bottom: -40%;
    width: 30%; }
  #prof .prof-item-4 {
    right: 0px;
    bottom: -13%;
    width: 25%; }
  #prof .prof-active {
    opacity: 0;
    pointer-events: none; }
  #prof .prof-text-box {
    position: absolute;
    right: 0;
    top: 40px;
    width: calc(60% - 3em);
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
    padding: 1.5em;
    z-index: 5; }
    #prof .prof-text-box .prof-name {
      margin-bottom: 20px; }
    #prof .prof-text-box .prof-text p {
      margin-bottom: 2em; }
      #prof .prof-text-box .prof-text p:last-of-type {
        margin-bottom: 0; }

.sp-prof-box {
  display: none; }

.prof-next-box {
  border-top: solid 1px #fff;
  padding-top: 1em;
  margin-top: 1em;
  display: flex;
  align-items: center; }
  .prof-next-box .prof-prev {
    margin-right: auto;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 4px;
    transition-duration: .3s;
    background: #8C38CB;
    border-radius: 50px;
    border: solid 2px #8C38CB;
    filter: drop-shadow(1px 1px 2px #000);
    padding: .5em 1em;
    width: calc(100% - 2em);
    max-width: 120px; }
    .prof-next-box .prof-prev:before {
      content: "";
      width: .75em;
      height: .75em;
      background: url(../images/tri-prev.svg);
      background-repeat: no-repeat;
      background-size: contain;
      display: block;
      position: absolute;
      left: 1em;
      top: 50%;
      transform: translateY(-50%); }
    .prof-next-box .prof-prev:hover {
      background: rgba(0, 0, 0, 0); }
  .prof-next-box .prof-next {
    margin-left: auto;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 4px;
    transition-duration: .3s;
    background: #8C38CB;
    border-radius: 50px;
    border: solid 2px #8C38CB;
    filter: drop-shadow(1px 1px 2px #000);
    padding: .5em 1em;
    width: calc(100% - 2em);
    max-width: 120px; }
    .prof-next-box .prof-next:after {
      content: "";
      width: .75em;
      height: .75em;
      background: url(../images/tri.svg);
      background-repeat: no-repeat;
      background-size: contain;
      display: block;
      position: absolute;
      right: 1em;
      top: 50%;
      transform: translateY(-50%); }
    .prof-next-box .prof-next:hover {
      background: rgba(0, 0, 0, 0); }

#flow .inner-wrap {
  max-width: 1000px; }
#flow .head-box {
  margin-bottom: 80px; }
#flow .flow-box {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  width: calc(100% - 50px - 2em);
  padding: 0 calc(25px + 1em); }
#flow .flow-swiper {
  overflow: hidden;
  padding-top: 40px;
  padding-bottom: 10px;
  width: 100%; }
#flow .swiper-slide {
  height: initial; }
#flow .flow-item {
  position: relative;
  margin: 0 1%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  color: #fff;
  z-index: 2; }
  #flow .flow-item::before {
    content: '';
    position: absolute;
    inset: -3px 3px 3px -3px;
    border: solid 2px #fff;
    z-index: 0; }
  #flow .flow-item::after {
    content: '';
    position: absolute;
    inset: 3px -3px -3px 3px;
    border: solid 2px #fff;
    z-index: 0; }
#flow .slide-img {
  box-sizing: border-box;
  width: 100%;
  padding: 1em;
  transform: translateY(-20%);
  position: relative;
  z-index: 1; }
#flow .flow-textbox {
  padding: 1em;
  position: relative;
  z-index: 1;
  margin-top: -20%; }
#flow .flow-step-flex {
  display: flex;
  align-items: center;
  margin-bottom: 1em; }
  #flow .flow-step-flex .col-r {
    margin-left: 1em; }
#flow .flow-btn {
  box-sizing: border-box;
  display: block;
  background: #8C38CB;
  border: solid 1px #8C38CB;
  color: #fff;
  text-align: center;
  margin: 1em auto;
  padding: 1em 0.5em;
  border-radius: 2em;
  width: calc(100% - 1em); }
  #flow .flow-btn:hover {
    background: rgba(0, 0, 0, 0);
    opacity: 1; }
#flow .rule {
  max-width: 820px;
  width: 100%;
  margin: 120px auto 0; }
#flow .swiper-btn {
  position: absolute;
  right: 0;
  top: 50%;
  background: url(../images/tri.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 25px;
  height: 25px;
  cursor: pointer;
  transition-duration: .3s; }
  #flow .swiper-btn.swiper-prev {
    right: initial;
    left: 0;
    transform: rotate(-180deg); }
  #flow .swiper-btn.pc-no-active {
    opacity: 0;
    pointer-events: none; }

#play .play-flex {
  display: flex;
  justify-content: center; }
  #play .play-flex .play-item {
    position: relative;
    z-index: 0; }
    #play .play-flex .play-item:after {
      content: "";
      background: url(../images/ico-play-bg.webp);
      background-position: top center;
      position: absolute;
      background-size: contain;
      background-repeat: no-repeat;
      left: 0;
      top: 0;
      z-index: -1;
      width: 100%;
      height: 100%;
      opacity: 0.2; }

#ticket .ticket-container {
  margin: 2em auto 6em; }
#ticket .ticket-nav {
  display: flex;
  justify-content: center;
  margin-bottom: 2em; }
  #ticket .ticket-nav .ticket-btn {
    max-width: 320px;
    width: 48%;
    padding: 0.5em;
    border-radius: 2em;
    margin: 0 1%;
    text-align: center;
    cursor: pointer;
    transition-duration: .3s; }
  #ticket .ticket-nav .t-btn1 {
    color: #FFE200;
    border: solid 2px #FFE200;
    background: rgba(0, 0, 0, 0.1); }
    #ticket .ticket-nav .t-btn1.active, #ticket .ticket-nav .t-btn1:hover {
      background: #FFE200;
      color: #000; }
  #ticket .ticket-nav .t-btn2 {
    color: #fff;
    border: solid 2px #8C38CB;
    background: rgba(0, 0, 0, 0.1); }
    #ticket .ticket-nav .t-btn2.active, #ticket .ticket-nav .t-btn2:hover {
      background: #8C38CB;
      color: #fff; }
#ticket .ticket-box {
  box-sizing: border-box;
  background: #fff;
  width: 100%; }
#ticket .t-panel {
  display: none; }
  #ticket .t-panel.active {
    display: block; }
#ticket .t-text {
  width: 100%; }
  #ticket .t-text tr {
    width: 100%;
    border-bottom: solid 1px #363636;
    padding: 1em 0; }
    #ticket .t-text tr:nth-last-of-type(1) {
      border: none; }
    #ticket .t-text tr:nth-child(1) {
      background: #363636;
      color: #fff; }
      #ticket .t-text tr:nth-child(1) th {
        border-right: solid 1px #fff; }
      #ticket .t-text tr:nth-child(1) td {
        border-right: solid 1px #fff;
        font-weight: bold; }
        #ticket .t-text tr:nth-child(1) td:last-child {
          border-right: 0; }
  #ticket .t-text th {
    width: 33%;
    padding: 2em 0;
    text-align: center;
    border-right: solid 1px #363636;
    font-weight: bold; }
  #ticket .t-text td {
    width: 33%;
    padding: 2em 0;
    text-align: center;
    border-right: solid 1px #363636; }
    #ticket .t-text td:last-child {
      border-right: 0; }
#ticket .ticket-read {
  border-top: solid 1px #363636;
  background: #DDDDDD;
  padding: 1em;
  cursor: pointer;
  display: flex;
  align-items: center; }
  #ticket .ticket-read::after {
    content: "";
    transition-duration: .3s;
    width: 1em;
    height: 1em;
    margin-left: 5px;
    background: url(../images/arrow-b.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    display: inline-block; }
  #ticket .ticket-read.active::after {
    transform: rotate(180deg); }
#ticket .ticket-ac {
  padding: 1em;
  border-top: solid 1px #363636;
  display: none; }
  #ticket .ticket-ac p {
    margin-bottom: 1em;
    padding-left: 1em;
    position: relative; }
    #ticket .ticket-ac p:after {
      content: "・";
      position: absolute;
      left: 0;
      top: 0; }
    #ticket .ticket-ac p.no-mark {
      padding-left: 0; }
      #ticket .ticket-ac p.no-mark::after {
        display: none; }
#ticket .text-link {
  text-decoration: underline;
  cursor: pointer; }
#ticket .u22-card {
  max-width: 800px;
  margin: auto;
  border: solid 2px #fff;
  border-radius: 15px;
  padding: 2em;
  background: rgba(0, 0, 0, 0.2); }
  #ticket .u22-card .u22-flex {
    display: flex;
    justify-content: space-between; }
    #ticket .u22-card .u22-flex .col-l {
      max-width: 320px;
      margin-right: 1em; }
    #ticket .u22-card .u22-flex .col-r {
      padding: 0 1em;
      color: #fff;
      position: relative;
      width: calc(100% - 320px);
      display: flex;
      flex-direction: column;
      justify-content: space-between; }
  #ticket .u22-card .u22-link {
    display: block;
    width: fit-content;
    margin-left: auto;
    color: #fff;
    margin-top: 1em;
    text-decoration: underline; }

#schedule {
  text-shadow: 1px 1px 2px black; }
  #schedule .sch-box {
    text-align: center;
    color: #fff; }
  #schedule .sch-head {
    margin: 1em auto;
    width: fit-content;
    padding: .5em 1em;
    border: solid 2px #fff;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    width: calc(100% - 2em);
    max-width: 500px; }
  #schedule .sch-sm-head {
    margin: 1em auto;
    padding: .5em 1em;
    width: calc(100% - 2em);
    border-bottom: solid 1px #fff;
    max-width: 500px; }
  #schedule .sch-time .sp {
    display: none; }
  #schedule .sch-bnr {
    max-width: 430px;
    margin: 2em auto 4em; }
    #schedule .sch-bnr .bnr-text {
      margin-bottom: 0.5em; }

#place {
  color: #fff; }
  #place .place-item {
    position: relative;
    padding-top: 100px;
    padding-bottom: 1em;
    margin-bottom: 1em; }
    #place .place-item:after {
      content: '';
      width: 200vw;
      position: absolute;
      border-top: solid 1px #fff;
      left: -100vw;
      z-index: -1;
      bottom: 0; }
  #place .place-time {
    width: fit-content;
    padding: .5em;
    border: solid 2px #fff;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    margin-top: .5em; }
    #place .place-time .sp {
      display: none; }
  #place .place-flex {
    display: flex;
    align-items: center;
    position: relative; }
    #place .place-flex.coming {
      filter: grayscale(1); }
    #place .place-flex .col-l {
      position: relative;
      max-width: 270px;
      z-index: 2;
      margin-top: -100px; }
      #place .place-flex .col-l::after {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: url(../images/place-bg.png);
        background-size: contain;
        background-repeat: no-repeat;
        mix-blend-mode: lighten;
        opacity: .5; }
    #place .place-flex .col-r {
      width: calc(100% - 270px);
      margin-left: 1em;
      text-shadow: 1px 1px 2px black; }
      #place .place-flex .col-r .place-head {
        position: relative;
        padding-bottom: 2em;
        /*  &:after {
            content: '';
            width: 200vw;
            position: absolute;
            border-top: solid 1px #fff;
            left: -100vw;
            z-index: -1;
            bottom: 0;
        } */ }
  #place .place-desc-head {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-shadow: initial;
    filter: drop-shadow(1px 1px 2px #000);
    cursor: pointer;
    padding: .5em 1em;
    border: solid 2px #8C38CB;
    color: #fff;
    width: fit-content;
    border-radius: 50px;
    background: #8C38CB;
    transition-duration: .3s; }
    #place .place-desc-head:after {
      content: "";
      width: 1em;
      height: 1em;
      margin-left: 5px;
      background: url(../images/arrow.svg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      display: inline-block;
      transition-duration: .3s; }
    #place .place-desc-head:hover {
      background: rgba(0, 0, 0, 0);
      filter: drop-shadow(0px 0px 0px #000); }
    #place .place-desc-head.active::after {
      transform: rotate(180deg); }
    #place .place-desc-head.place-fix {
      pointer-events: none;
      cursor: initial;
      background: #bbb;
      border-color: #bbb; }
  #place .place-desc {
    display: none;
    text-align: center;
    max-width: 900px;
    margin: 1em auto; }
    #place .place-desc iframe {
      width: 100%;
      margin: 1em auto; }
    #place .place-desc .place-desc-in {
      text-shadow: 1px 1px 2px black; }
    #place .place-desc ._scheduler_event_title a {
      color: #333; }
  #place .schedule-wrap {
    padding: 1em;
    background: rgba(0, 0, 0, 0.2);
    margin-bottom: 1em; }
  #place .text-link {
    text-decoration: underline;
    color: #fff;
    cursor: pointer; }
  #place .place-name .sp {
    display: none; }

#goods .goods-flex {
  display: flex;
  flex-flow: wrap;
  max-width: 900px;
  margin: 0 auto; }
  #goods .goods-flex .goods-item {
    width: calc(31% - 2px);
    margin: 1%;
    border: solid #fff 1px;
    color: #fff;
    background: rgba(0, 0, 0, 0.5); }
    #goods .goods-flex .goods-item p {
      margin-top: 1em; }
      #goods .goods-flex .goods-item p:first-of-type {
        margin-top: 0; }
  #goods .goods-flex .col-1 {
    margin: 1% auto;
    width: calc(100% - 2px); }
    #goods .goods-flex .col-1 .goods-thm img {
      width: 50%; }
    #goods .goods-flex .col-1 .goods-title {
      padding-top: .5em;
      margin-top: .5em;
      border-top: solid 1px #fff; }
  #goods .goods-flex .goods-desc {
    padding: 1em;
    width: calc(100% - 2em); }
  #goods .goods-flex .goods-thm {
    background: #fff;
    position: relative;
    z-index: 0; }
    #goods .goods-flex .goods-thm.goods-tar {
      cursor: pointer; }
      #goods .goods-flex .goods-thm.goods-tar:after {
        content: "";
        position: absolute;
        right: 0.5em;
        top: 0.5em;
        z-index: 1;
        width: 2.5em;
        height: 2.5em;
        background-image: url(../images/goods/scale.svg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 1.5em;
        background-color: #8C38CB;
        border-radius: 2em;
        transition-duration: .3s; }
      #goods .goods-flex .goods-thm.goods-tar:hover::after {
        transform: scale(1.2); }
  #goods .goods-flex .goods-swiper {
    overflow: hidden;
    max-width: 900px;
    position: relative; }
  #goods .goods-flex .goods-title {
    margin-bottom: .5em;
    padding-bottom: .5em;
    border-bottom: solid 1px #fff; }
#goods .goods-swiper-btn {
  position: absolute;
  right: 1em;
  top: 50%;
  background: url(../images/tri-blk.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 30px;
  height: 30px;
  cursor: pointer;
  transition-duration: .3s;
  z-index: 5; }
  #goods .goods-swiper-btn.goods-swiper-button-prev {
    right: initial;
    left: 1em;
    transform: rotate(-180deg); }
#goods .icon-flex {
  display: flex;
  width: calc(100% - 2em);
  max-width: 420px;
  margin: 1em auto 0; }
  #goods .icon-flex .ico-item {
    width: 20%;
    margin: 1% auto;
    max-width: 80px;
    cursor: pointer; }
    #goods .icon-flex .ico-item .ico-box {
      position: relative; }
      #goods .icon-flex .ico-item .ico-box:after {
        content: "";
        border: solid 2px #ccc;
        width: calc(100% - 4px);
        height: calc(100% - 4px);
        left: 0;
        top: 0;
        position: absolute;
        z-index: 2;
        border-radius: 100px; }
    #goods .icon-flex .ico-item .ico-name {
      display: block;
      text-align: center;
      margin-top: .5em; }
    #goods .icon-flex .ico-item.ico-active {
      color: #FFE200; }
      #goods .icon-flex .ico-item.ico-active .ico-box:after {
        border-color: #FFE200; }

.goods-pop {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 20;
  left: 0;
  top: 0;
  background-color: #5D2E7B;
  display: none;
    /* .goods-swiper-btn,
    .allow-btn {
        position: absolute;
        right: 5px;
        top: 50%;
        cursor: pointer;
        transition-duration: .3s;
        z-index: 50;

        img {
            width: 25px;
            height: 25px;
            object-fit: contain;
        }

        &.goods-swiper-button-prev {
            right: initial;
            left: 5px;
            transform: rotate(-180deg);
        }

        &.allow-btn-prev {
            right: initial;
            left: 5px;
            transform: rotate(-180deg);
        }

        &.no-active {
            opacity: 0.5;
            cursor: initial;
        }
    } */ }
  .goods-pop:before {
    content: "";
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.01) 0%, rgba(0, 0, 0, 0.8) 30%, rgba(0, 0, 0, 0.8) 50%, rgba(0, 0, 0, 0.8) 70%, rgba(255, 255, 255, 0.01) 100%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0; }
  .goods-pop:after {
    content: "";
    background-image: url(../images/bg-body.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    mix-blend-mode: screen;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    filter: blur(10px);
    z-index: 0; }
  .goods-pop .goods-pop-close-bt {
    position: fixed;
    right: 1em;
    top: 1em;
    z-index: 12;
    max-width: 30px;
    cursor: pointer; }
  .goods-pop .goods-pop-in {
    max-width: 900px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 1em;
    border: solid 1px #fff;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    z-index: 20;
    width: calc(100% - 4em - 2px); }
  .goods-pop .goods-next-box {
    margin-top: 1em;
    display: flex;
    align-items: center; }
    .goods-pop .goods-next-box .goods-swiper-button-prev {
      margin-right: auto;
      cursor: pointer;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      letter-spacing: 4px;
      transition-duration: .3s;
      background: #8C38CB;
      border-radius: 50px;
      border: solid 2px #8C38CB;
      filter: drop-shadow(1px 1px 2px #000);
      padding: .5em 1em;
      width: calc(100% - 2em);
      max-width: 120px; }
      .goods-pop .goods-next-box .goods-swiper-button-prev:before {
        content: "";
        width: .75em;
        height: .75em;
        background: url(../images/tri-prev.svg);
        background-repeat: no-repeat;
        background-size: contain;
        display: block;
        position: absolute;
        left: 1em;
        top: 50%;
        transform: translateY(-50%); }
      .goods-pop .goods-next-box .goods-swiper-button-prev:hover {
        background: rgba(0, 0, 0, 0); }
      .goods-pop .goods-next-box .goods-swiper-button-prev.no-active {
        opacity: .5;
        cursor: initial;
        pointer-events: none; }
    .goods-pop .goods-next-box .goods-swiper-button-next {
      margin-left: auto;
      cursor: pointer;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      letter-spacing: 4px;
      transition-duration: .3s;
      background: #8C38CB;
      border-radius: 50px;
      border: solid 2px #8C38CB;
      filter: drop-shadow(1px 1px 2px #000);
      padding: .5em 1em;
      width: calc(100% - 2em);
      max-width: 120px; }
      .goods-pop .goods-next-box .goods-swiper-button-next:after {
        content: "";
        width: .75em;
        height: .75em;
        background: url(../images/tri.svg);
        background-repeat: no-repeat;
        background-size: contain;
        display: block;
        position: absolute;
        right: 1em;
        top: 50%;
        transform: translateY(-50%); }
      .goods-pop .goods-next-box .goods-swiper-button-next:hover {
        background: rgba(0, 0, 0, 0); }
      .goods-pop .goods-next-box .goods-swiper-button-next.no-active {
        opacity: .5;
        cursor: initial;
        pointer-events: none; }
  .goods-pop .goods-pop-flex {
    display: flex;
    align-items: center;
    margin: 0 auto; }
    .goods-pop .goods-pop-flex .col-l {
      width: 48%;
      margin: 0 auto; }
    .goods-pop .goods-pop-flex .col-r {
      width: 48%;
      margin: 0 auto; }
    .goods-pop .goods-pop-flex .goods-pop-desc {
      padding: 1em;
      width: calc(100% - 2em); }
    .goods-pop .goods-pop-flex .goods-pop-thm {
      background: #fff;
      position: relative;
      z-index: 0; }
      .goods-pop .goods-pop-flex .goods-pop-thm.goods-tar {
        cursor: pointer; }
        .goods-pop .goods-pop-flex .goods-pop-thm.goods-tar:after {
          content: "";
          position: absolute;
          right: 0.5em;
          top: 0.5em;
          z-index: 1;
          width: 2.5em;
          height: 2.5em;
          background-image: url(../images/goods/scale.svg);
          background-repeat: no-repeat;
          background-position: center;
          background-size: 1.5em;
          background-color: #8C38CB;
          border-radius: 2em;
          transition-duration: .3s; }
        .goods-pop .goods-pop-flex .goods-pop-thm.goods-tar:hover::after {
          transform: scale(1.2); }
    .goods-pop .goods-pop-flex .goods-swiper {
      overflow: hidden;
      max-width: 900px;
      position: relative; }
    .goods-pop .goods-pop-flex .goods-title {
      margin-bottom: .5em;
      padding-bottom: .5em;
      border-bottom: solid 1px #fff; }
  .goods-pop .goods-data {
    margin-top: 1em; }
  .goods-pop .goods-thm {
    position: relative; }
  .goods-pop .icon-flex {
    display: flex;
    width: calc(100% - 2em);
    max-width: 420px;
    margin: 1em auto 0; }
    .goods-pop .icon-flex .ico-item {
      width: 20%;
      margin: 1% auto;
      max-width: 80px;
      cursor: pointer; }
      .goods-pop .icon-flex .ico-item .ico-box {
        position: relative; }
        .goods-pop .icon-flex .ico-item .ico-box:after {
          content: "";
          border: solid 2px #ccc;
          width: calc(100% - 4px);
          height: calc(100% - 4px);
          left: 0;
          top: 0;
          position: absolute;
          z-index: 2;
          border-radius: 100px; }
      .goods-pop .icon-flex .ico-item .ico-name {
        display: block;
        text-align: center;
        margin-top: .5em; }
      .goods-pop .icon-flex .ico-item.ico-active {
        color: #FFE200; }
        .goods-pop .icon-flex .ico-item.ico-active .ico-box:after {
          border-color: #FFE200; }

#special .special-bnr {
  display: block;
  max-width: 800px;
  margin: 2em auto 0;
  width: 90%; }

#readme {
  padding-bottom: 0;
  text-shadow: 1px 1px 2px black; }
  #readme .read-item {
    width: 100%;
    background: rgba(255, 255, 255, 0.2);
    cursor: pointer;
    margin-bottom: 0.5em;
    transition-duration: .3s;
    position: relative; }
    #readme .read-item:after {
      content: "";
      width: 1.5em;
      height: 1.5em;
      margin-left: 5px;
      background: url(../images/arrow.svg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      display: inline-block;
      transition-duration: .3s;
      position: absolute;
      right: 1em;
      top: 50%;
      transform: translateY(-50%); }
    #readme .read-item.read-active:after {
      transform: translateY(-50%) rotate(180deg); }
    #readme .read-item img {
      max-width: 400px;
      width: 100%;
      margin: 0 auto; }
  #readme .read-text {
    box-sizing: border-box;
    display: none;
    width: 100%;
    margin: 0 auto 1em;
    color: #fff;
    padding: 1em 0; }
    #readme .read-text.active {
      display: block; }
  #readme .read-box {
    margin-top: 3em; }
    #readme .read-box p {
      margin-bottom: 1em; }
    #readme .read-box .text-link {
      text-decoration: underline;
      color: #fff;
      cursor: pointer; }
  #readme .mark-box p {
    padding-left: 1em;
    position: relative; }
    #readme .mark-box p:after {
      content: "・";
      position: absolute;
      left: 0;
      top: 0; }
    #readme .mark-box p.no-mark {
      padding-left: 0; }
      #readme .mark-box p.no-mark::after {
        display: none; }
  #readme .read-head {
    padding-bottom: 1em;
    margin-bottom: 1em;
    border-bottom: solid 1px #fff; }

#bnr {
  background: #000; }
  #bnr .bnr-flex {
    display: flex;
    max-width: 1000px;
    margin: 0 auto; }
  #bnr .bnr-item {
    width: 48%;
    margin: 0 1%;
    cursor: pointer;
    transition-duration: .3s; }
    #bnr .bnr-item:hover {
      opacity: .8; }

footer {
  padding: 60px 0 120px;
  background: #fff;
  position: relative;
  z-index: 1; }
  footer .ft-logo {
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
    display: flex; }
    footer .ft-logo a {
      display: block;
      width: 48%;
      margin: 1% auto; }
  footer .ft-sns {
    margin: 3em auto; }
  footer .sns-text {
    text-align: center;
    margin-bottom: 1em; }
  footer .sns-item {
    display: block;
    margin: 0 1%; }
    footer .sns-item .sns-icon {
      border-radius: 10px; }
  footer .ft-sns-flex {
    display: flex;
    justify-content: center; }
  footer .ft-bnr {
    display: flex;
    max-width: 800px;
    margin: auto; }
  footer .ft-bnr-item {
    width: 48%;
    margin: 0 1% 3em; }
  footer .copy-right {
    color: #000;
    text-align: center; }

#rdg-pop,
#hkgk-pop {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 110;
  display: none; }
  #rdg-pop .close-bt,
  #hkgk-pop .close-bt {
    position: absolute;
    top: -50px;
    right: -50px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    background: #fff;
    border: solid 2px #5D2E7B;
    padding: 2px; }
    #rdg-pop .close-bt:before,
    #hkgk-pop .close-bt:before {
      content: "";
      width: 100%;
      height: 3px;
      background: #5D2E7B;
      position: absolute;
      right: 0;
      top: 50%;
      transform: rotate(-45deg); }
    #rdg-pop .close-bt:after,
    #hkgk-pop .close-bt:after {
      content: "";
      width: 100%;
      height: 3px;
      background: #5D2E7B;
      position: absolute;
      right: 0;
      top: 50%;
      transform: rotate(45deg); }
  #rdg-pop p,
  #hkgk-pop p {
    margin-bottom: 1em; }
  #rdg-pop .rdg-in,
  #hkgk-pop .rdg-in {
    width: calc(90% - 2em - 6px);
    padding: 1em;
    border: solid 3px #5D2E7B;
    max-width: 500px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #fff; }
  #rdg-pop .youtube iframe,
  #hkgk-pop .youtube iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    display: block; }
  #rdg-pop .img,
  #hkgk-pop .img {
    width: 100%;
    height: auto; }
  #rdg-pop .rdg-text,
  #hkgk-pop .rdg-text {
    margin: 1em auto; }
  #rdg-pop .btn,
  #hkgk-pop .btn {
    max-width: 280px;
    text-align: center;
    padding: .5em;
    display: block;
    width: calc(100% - 3em - 4px);
    background: #5D2E7B;
    color: #fff;
    margin: 0 auto;
    transition-duration: .3s;
    border: solid 2px #5D2E7B;
    padding-right: 2.5em;
    position: relative; }
    #rdg-pop .btn:after,
    #hkgk-pop .btn:after {
      content: "";
      width: 1em;
      height: 1em;
      background-image: url(../images/tri.svg);
      background-repeat: no-repeat;
      background-size: contain;
      background-position: center;
      position: absolute;
      right: 1em;
      top: 50%;
      transform: translateY(-50%);
      transition-duration: .3s; }
    #rdg-pop .btn:hover,
    #hkgk-pop .btn:hover {
      background: rgba(0, 0, 0, 0);
      color: #5D2E7B; }
      #rdg-pop .btn:hover::after,
      #hkgk-pop .btn:hover::after {
        background-image: url(../images/tri-pur.svg); }
  #rdg-pop .x-btn,
  #hkgk-pop .x-btn {
    max-width: 280px;
    text-align: center;
    padding: .5em;
    display: block;
    width: calc(100% - 3em - 4px);
    background: #000;
    color: #fff;
    margin: 0 auto;
    transition-duration: .3s;
    border: solid 2px #000;
    padding-right: 2.5em;
    position: relative;
    margin-top: 1em; }
    #rdg-pop .x-btn:after,
    #hkgk-pop .x-btn:after {
      content: "";
      width: 1.5em;
      height: 1.5em;
      background-image: url(../images/btn-x.svg);
      background-repeat: no-repeat;
      background-size: contain;
      background-position: center;
      position: absolute;
      right: 1em;
      top: 50%;
      transform: translateY(-50%);
      transition-duration: .3s; }
    #rdg-pop .x-btn:hover,
    #hkgk-pop .x-btn:hover {
      background: rgba(0, 0, 0, 0);
      color: #000; }
      #rdg-pop .x-btn:hover::after,
      #hkgk-pop .x-btn:hover::after {
        background-image: url(../images/btn-x-blk.svg); }

.nazo-header {
  padding: 120px 0;
  position: relative;
  z-index: 1;
  text-align: center;
  color: #fff; }

#webnazo {
  padding-top: 0; }
  #webnazo .nazo-box {
    margin: 0 auto 80px;
    padding-bottom: 80px;
    border-bottom: solid 1px #fff; }
    #webnazo .nazo-box .nazo-in {
      max-width: 800px;
      margin: 0 auto;
      padding: 0 1em;
      width: calc(100% - 2em); }
    #webnazo .nazo-box:last-of-type {
      border-bottom: 0;
      padding-bottom: 0; }
    #webnazo .nazo-box .nazo-head {
      margin: 1em auto 2em; }
      #webnazo .nazo-box .nazo-head img {
        max-width: 180px;
        margin: 0 auto; }
    #webnazo .nazo-box .inp-box {
      display: flex;
      flex-direction: column;
      justify-content: center;
      margin: 40px auto; }
      #webnazo .nazo-box .inp-box input {
        padding: 1em;
        width: calc(100% - 2em);
        background: #fff;
        display: block;
        margin: 0 auto;
        text-align: center; }
      #webnazo .nazo-box .inp-box .submit {
        padding: 1em;
        width: 200px;
        background: #8C38CB;
        border: #8C38CB solid 1px;
        border-radius: 50px;
        margin: 1em auto;
        display: block;
        cursor: pointer;
        transition-duration: .3s; }
        #webnazo .nazo-box .inp-box .submit:hover {
          background: rgba(0, 0, 0, 0); }
        #webnazo .nazo-box .inp-box .submit img {
          max-width: 40px;
          margin: 0 auto; }
  #webnazo .hint-box .hint-head {
    width: calc(100% - 2px);
    cursor: pointer;
    margin-bottom: 0.5em;
    background: rgba(0, 0, 0, 0.2);
    border: solid 1px #fff;
    transition-duration: .3s;
    position: relative;
    padding: 1em 0;
    margin-top: 20px; }
    #webnazo .hint-box .hint-head.hint-deactive {
      display: none; }
    #webnazo .hint-box .hint-head:after {
      content: "";
      width: 1.5em;
      height: 1.5em;
      margin-left: 5px;
      background: url(../images/arrow.svg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      display: inline-block;
      transition-duration: .3s;
      position: absolute;
      right: 1em;
      top: 50%;
      transform: translateY(-50%); }
    #webnazo .hint-box .hint-head.hint-active:after {
      transform: translateY(-50%) rotate(180deg); }
    #webnazo .hint-box .hint-head img {
      max-width: 80px;
      margin: 0 auto; }
  #webnazo .hint-box .hint-desc {
    border: solid 1px #fff;
    padding: 1em;
    background: rgba(0, 0, 0, 0.2);
    color: #fff;
    margin: 0 auto;
    display: none; }

#webnazo-pop {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 20;
  left: 0;
  top: 0;
  display: none;
  background-color: #5D2E7B; }
  #webnazo-pop:before {
    content: "";
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.01) 0%, rgba(0, 0, 0, 0.8) 30%, rgba(0, 0, 0, 0.8) 50%, rgba(0, 0, 0, 0.8) 70%, rgba(255, 255, 255, 0.01) 100%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0; }
  #webnazo-pop:after {
    content: "";
    background-image: url(../images/bg-body.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    mix-blend-mode: screen;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    filter: blur(10px);
    z-index: 0; }
  #webnazo-pop .pop-close-bt {
    position: fixed;
    right: 1em;
    top: 1em;
    z-index: 12;
    max-width: 30px;
    cursor: pointer; }
  #webnazo-pop .nazo-pop {
    position: absolute;
    left: 50%;
    top: 50%;
    max-width: 768px;
    transform: translate(-50%, -50%);
    width: calc(90% - 2em);
    z-index: 21; }
  #webnazo-pop .x-share {
    display: block;
    background: #000;
    width: calc(100% - 2em);
    margin: 1em auto 0;
    padding: 1em; }
    #webnazo-pop .x-share img {
      max-width: 140px;
      margin: 0 auto; }
  #webnazo-pop .false-box {
    max-width: 300px;
    margin: 0 auto; }
  #webnazo-pop .false {
    display: none;
    padding: 1em;
    background: #fff;
    z-index: 10;
    border-radius: 16px;
    position: relative;
    z-index: 0;
    width: fit-content;
    margin: 0 auto; }
    #webnazo-pop .false .clear-ima {
      max-width: 300px; }
  #webnazo-pop .true {
    display: none;
    max-height: 90vh;
    overflow-y: auto; }
    #webnazo-pop .true .clear-head {
      position: relative;
      max-width: 450px;
      width: 100%;
      margin: auto;
      z-index: 1; }
      #webnazo-pop .true .clear-head .head-ima {
        filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.7)); }
      #webnazo-pop .true .clear-head:before {
        content: "";
        background: url(../images/head-bg.svg);
        background-position: center;
        background-repeat: no-repeat;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: -1; }
      #webnazo-pop .true .clear-head:after {
        content: "";
        background-image: url(../images/head-texture.webp);
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        opacity: 1;
        mix-blend-mode: screen; }
    #webnazo-pop .true .true-in {
      padding: 1em;
      background: #fff;
      z-index: 10;
      border-radius: 16px;
      position: relative;
      z-index: 0; }
      #webnazo-pop .true .true-in .clear-ima {
        max-width: 300px; }

#hikagaku {
  padding-top: 0; }
  #hikagaku .special-bnr {
    max-width: 800px;
    margin: 0 auto;
    display: block; }
  #hikagaku .hikagaku-head {
    max-width: 1000px;
    margin: 20px auto; }
  #hikagaku .sp {
    display: none; }
  #hikagaku .ticket-link {
    box-sizing: border-box;
    display: block;
    background: rgba(0, 0, 0, 0.2);
    border: solid 2px #fff;
    color: #fff;
    text-align: center;
    margin: 40px auto 0;
    padding: 1em 0.5em;
    border-radius: 50px;
    width: calc(100% - 1em);
    max-width: 480px; }
    #hikagaku .ticket-link:hover {
      background: #FFE200;
      color: #000;
      opacity: 1; }

@media screen and (max-width: 900px) {
  section {
    padding: 60px 0; }

  .main-v-box .main-pc-video {
    display: none; }
  .main-v-box .main-sp-video {
    display: block; }
  .main-v-box .main-v-pc {
    display: none; }
    .main-v-box .main-v-pc.main-v-active {
      display: none; }
  .main-v-box .main-v-sp {
    display: none; }
    .main-v-box .main-v-sp.main-v-active {
      display: block; }

  .header-logo {
    width: 33%; }

  #about .about-head {
    margin-bottom: 80px; }
  #about .about-flex {
    flex-direction: column-reverse; }
    #about .about-flex .col-l {
      width: 100%;
      margin: 20px auto;
      padding: 0;
      padding-top: 1em; }
    #about .about-flex .col-r {
      width: 100%;
      margin: -80px auto;
      padding-top: 40px; }

  #prof .prof-box {
    padding-top: 20px; }
  #prof .prof-text-box {
    display: none; }
  #prof .prof-item-box {
    height: calc(100% - 40px); }

  .sp-prof-box {
    display: block;
    background: #000;
    position: relative;
    z-index: 0;
    color: #fff;
    padding: 1em 0;
    width: calc(100% - 2em);
    margin: 1em auto; }

  #place .place-item {
    padding-top: 40px; }
  #place .place-name .sp {
    display: block; }
  #place .place-flex .col-l {
    max-width: 150px;
    margin-top: 0px; }
  #place .place-flex .col-r {
    width: calc(100% - 150px); }

  footer {
    padding-bottom: 120px; }

  #flow .swiper-btn.pc-no-active {
    opacity: 1;
    pointer-events: initial; }
  #flow .swiper-btn.sp-no-active {
    opacity: 0;
    pointer-events: none; }

  .goods-pop .goods-pop-in {
    max-width: 500px;
    max-height: 75vh;
    max-height: 75dvh;
    overflow: auto; }
  .goods-pop .goods-pop-flex {
    flex-direction: column; }
    .goods-pop .goods-pop-flex .col-l {
      width: 100%; }
    .goods-pop .goods-pop-flex .col-r {
      width: 100%; } }
@media screen and (max-width: 540px) {
  .title-bar img {
    max-width: 120px; }

  .news-bar {
    overflow: hidden; }
    .news-bar .news-in {
      white-space: nowrap; }
      .news-bar .news-in.is-anim {
        animation: 20s news linear infinite; }

  section {
    padding: 40px 0; }

  .menu-btn {
    max-width: 80px;
    top: -70px; }
    .menu-btn:hover {
      top: -70px; }
    .menu-btn.menu-active {
      right: -70px;
      top: -100px; }

  .sns-menu {
    bottom: 90px; }
    .sns-menu a {
      width: 75px;
      transform: translateX(80px); }
      .sns-menu a:hover {
        transform: translateX(70px); }

  .copy-head {
    padding: 60px 0; }
    .copy-head .copy-sp {
      display: block; }
    .copy-head .copy-pc {
      display: none; }

  .buy-link {
    max-width: 140px;
    right: -1em; }

  .head-box {
    max-width: 280px; }

  #voice .v-head {
    max-width: 240px;
    margin-top: -105px; }

  #play .play-flex {
    flex-flow: wrap; }
    #play .play-flex .play-item {
      width: 33%;
      margin: 0; }
      #play .play-flex .play-item img {
        transform: scale(1.3); }

  #ticket .t-text th {
    padding: 1em 5px; }
  #ticket .t-text td {
    padding: 1em 5px; }
  #ticket .ticket-box {
    width: calc(100% + 2em);
    margin-left: -1em; }
  #ticket .u22-card {
    padding: 0;
    width: 80%; }
    #ticket .u22-card .u22-flex {
      flex-direction: column; }
      #ticket .u22-card .u22-flex .col-l {
        margin: 2em auto;
        max-width: 240px; }
      #ticket .u22-card .u22-flex .col-r {
        width: calc(100% - 2em);
        text-align: center; }
    #ticket .u22-card .u22-link {
      margin: 1em auto 2em; }

  #readme .read-item img {
    max-width: 240px; }

  #schedule .sch-time .sp {
    display: block; }

  .prof-next-box .prof-next,
  .prof-next-box .prof-prev {
    width: calc(40% - 2em);
    padding: .25em 1em; }

  #place .place-flex {
    flex-direction: column; }
    #place .place-flex .col-l {
      margin: 0 auto;
      max-width: 150px; }
    #place .place-flex .col-r {
      width: 100%;
      margin: 1em auto;
      text-align: center; }
      #place .place-flex .col-r .place-name {
        margin-bottom: 1em; }
        #place .place-flex .col-r .place-name .min {
          display: block; }
  #place .place-desc-head {
    margin: 0 auto; }
  #place .place-time {
    margin: 0 auto; }
    #place .place-time .sp {
      display: block; }
  #place .place-item.coming {
    padding-top: 0; }
    #place .place-item.coming .place-head {
      padding-bottom: 0; }
      #place .place-item.coming .place-head .place-name {
        margin-bottom: 0; }

  #prof .prof-item-1 {
    left: calc(40px + 15%); }
  #prof .prof-item-2 {
    left: 20px;
    bottom: -30%;
    width: 30%; }
  #prof .prof-item-3 {
    left: calc(40px + 40%); }
  #prof .prof-item-4 {
    bottom: -25%;
    right: -1em;
    width: 28%; }

  #goods .goods-flex .goods-item {
    width: 48%;
    margin: 1em auto; }
    #goods .goods-flex .goods-item .goods-thm img {
      width: calc(100% - 40px); }
  #goods .goods-flex .col-1 .goods-thm img {
    width: calc(100% - 40px); }
  #goods .goods-swiper-btn {
    width: 20px;
    height: 20px; }
  #goods .goods-swiper-btn {
    right: 5px; }
    #goods .goods-swiper-btn.goods-swiper-button-prev {
      left: 5px; }

  #bnr .bnr-flex {
    flex-direction: column; }
    #bnr .bnr-flex .bnr-item {
      width: 100%;
      margin: 1em auto; }

  footer {
    padding-bottom: 220px; }
    footer .ft-bnr {
      flex-direction: column; }
      footer .ft-bnr .ft-bnr-item {
        width: 100%;
        margin: 1em auto; }

  #rdg-pop .close-bt,
  #hkgk-pop .close-bt {
    right: -5px; }
  #rdg-pop .rdg-box,
  #hkgk-pop .rdg-box {
    max-height: 70dvh;
    overflow-x: auto; }

  #flow .head-box {
    margin-bottom: 40px; }
  #flow .rule {
    margin-top: 80px; }

  .nazo-header {
    padding: 80px 0; }

  #webnazo .nazo-box .nazo-head {
    margin-bottom: 1em; }
    #webnazo .nazo-box .nazo-head img {
      max-width: 120px; }
  #webnazo .hint-box .hint-head img {
    max-width: 65px; }

  .true .head-box {
    max-width: 280px; }

  .false {
    width: 65%; }

  #hikagaku .hikagaku-head {
    max-width: 800px;
    margin: 20px auto; }
    #hikagaku .hikagaku-head .pc {
      display: none; }
    #hikagaku .hikagaku-head .sp {
      display: block; }
  #hikagaku .ticket-link {
    margin: 20px auto 0; } }
/*=========ticketapi===========*/
.ticketWrap {
  margin: 0 auto;
  padding: 20px 6%;
  position: relative;
  width: 88%;
  transition: height 0.7s;
  background: rgba(0, 0, 0, 0.5); }

.ticketWrap .naviBox {
  height: 80px;
  margin: 0;
  padding: 0 0 0 0;
  overflow: hidden; }

.ticketWrap .naviBox .prevBtn {
  width: 50px;
  height: 80px;
  background: #300e5b;
  z-index: 5;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  cursor: pointer;
  position: absolute;
  top: 20px;
  left: 0%; }

.ticketWrap .naviBox .prevBtn:after {
  content: "";
  width: 12px;
  height: 12px;
  border: 0;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  margin: -8px 0 0 -3px;
  position: absolute; }

.ticketWrap .naviBox .nextBtn {
  width: 50px;
  height: 80px;
  background: #300e5b;
  z-index: 5;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  cursor: pointer;
  position: absolute;
  top: 20px;
  right: 0%; }

.ticketWrap .naviBox .nextBtn:after {
  content: "";
  width: 12px;
  height: 12px;
  border: 0;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  margin: -8px 0 0 -10px;
  position: absolute; }

.ticketWrap .naviBox .prevBtn:hover,
.ticketWrap .naviBox .nextBtn:hover {
  opacity: 0.7; }

.ticketWrap .naviBox .prevBtn span,
.ticketWrap .naviBox .nextBtn span {
  display: none; }

.ticketWrap .naviBox .comm {
  width: 100%;
  top: 25px;
  font-size: 14px;
  color: #ffffff;
  text-align: center;
  font-weight: bold;
  position: relative;
  display: none; }

.ticketWrap .naviBox ul {
  background: rgba(0, 0, 0, 0.2);
  height: 80px;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* overflow-x: scroll; */
  width: 100%;
  margin: 0;
  padding: 0;
  z-index: 3;
  position: relative; }

.ticketWrap .naviBox ul::-webkit-scrollbar {
  height: 0; }

.ticketWrap .naviBox ul li {
  margin: 0 2px 0 0;
  position: relative;
  cursor: pointer;
  opacity: 0.85;
  width: 80px;
  height: 80px; }

.ticketWrap .naviBox ul li .scheduleBox {
  background: #ffffff;
  display: block;
  width: 80px;
  height: 80px;
  text-align: center;
  cursor: pointer;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  position: relative;
  color: #676767;
  text-align: center;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center; }

.ticketWrap .naviBox ul li.cr {
  opacity: 1; }

.ticketWrap .naviBox ul li.cr .scheduleBox {
  background: #fbe663; }

.ticketWrap .naviBox ul li .scheduleBox:hover {
  opacity: 0.7; }

.ticketWrap .naviBox ul li .scheduleBox .date {
  width: 100%;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  top: 28px; }

.ticketWrap .naviBox ul li .scheduleBox .state {
  bottom: 10px;
  width: 100%;
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
  color: #676767;
  margin-top: 10px; }

.ticketWrap .naviBox ul li .scheduleBox .state span {
  font-size: 10px;
  font-weight: 500; }

.ticketWrap .naviBox ul li .scheduleBox.present .state span {
  color: #32b16c; }

.ticketWrap .naviBox ul li .scheduleBox.present .state span:before {
  content: "○"; }

.ticketWrap .naviBox ul li .scheduleBox.sold .state {
  color: #9d9d9d; }

.ticketWrap .naviBox ul li .scheduleBox.sold .state span:before {
  content: "✕"; }

.ticketWrap .naviBox ul li .scheduleBox.few .state {
  color: #960b0b; }

.ticketWrap .naviBox ul li .scheduleBox.few .state span:before {
  content: "△"; }

.ticketWrap .detailsWrap {
  overflow: hidden;
  opacity: 1;
  transition: opacity 0.7s 0.2s; }

.ticketWrap .detailsWrap.loading {
  opacity: 0;
  transition-duration: 0s;
  transition-delay: 0s; }

.ticketWrap .detailsBox .tit {
  margin: 0;
  padding: 20px 0 20px 0;
  font-size: 20px;
  letter-spacing: 0.1em;
  line-height: 1;
  color: #FFE200;
  font-weight: 500;
  text-align: center;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: flex-end;
  align-items: flex-end;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline; }
  .ticketWrap .detailsBox .tit p {
    margin-bottom: 0; }

.ticketWrap .detailsBox .tit .tit01 {
  font-size: 25px;
  margin-right: 5px;
  padding-bottom: 2px; }

.ticketWrap .detailsBox .details {
  background: #300e5b;
  padding: 2%;
  color: #fff; }
  .ticketWrap .detailsBox .details h4:after {
    display: none; }

.ticketWrap .detailsBox .details h4 {
  margin: 0 0 0 0;
  padding: 0 0 5px 0;
  font-size: 15px;
  letter-spacing: 0;
  line-height: 1;
  border-bottom: 2px solid #bfbfbf;
  position: relative; }

.ticketWrap .detailsBox .details a.scrap {
  position: absolute;
  top: 0;
  right: 0;
  padding-right: 15px;
  color: #0e70bb;
  font-size: 15px; }

.ticketWrap .detailsBox .details .no_events {
  text-align: center;
  margin: 50px auto;
  opacity: 0.5; }

/*===================sp=*/
@media screen and (max-width: 860px) {
  .ticketWrap .naviBox ul li .scheduleBox:hover {
    opacity: 1; }

  .ticketWrap .detailsBox .details h4 {
    margin: 0 0 0 0;
    padding: 0 0 5px 0;
    font-size: 15px;
    letter-spacing: 0;
    line-height: 1;
    border-bottom: 2px solid #bfbfbf;
    position: relative;
    line-height: 2; }

  .ticketWrap .detailsBox .details a.scrap {
    position: relative;
    right: 0;
    text-align: right; }

  .ticketWrap .naviBox .prevBtn:hover,
  .ticketWrap .naviBox .nextBtn:hover {
    opacity: 1; } }
/*====================*/
.ticketWrap .detailsBox .details a.scrap:after {
  content: "";
  width: 8px;
  height: 8px;
  border: 0;
  border-top: solid 2px #0e70bb;
  border-right: solid 2px #0e70bb;
  top: 50%;
  right: 0;
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  margin: -5px 0 0 0px;
  position: absolute; }

.ticketWrap .detailsBox .details a.scrap:hover {
  text-decoration: none;
  opacity: 0.7; }

.ticketWrap .detailsBox .details ul {
  /*
                        margin-left: -15px;
                        margin-right: -15px;
                        list-style: none;
                        display: block;
                        margin: 0 -5px;
                        padding: 0;
                        margin-bottom: 50px;
*/
  width: 102%;
  list-style: none;
  display: block;
  margin-bottom: 50px;
  margin-top: 2%; }

.ticketWrap .detailsBox .details ul:before,
.ticketWrap .detailsBox .details ul:after {
  content: " ";
  display: table; }

.ticketWrap .detailsBox .details ul:after {
  clear: both; }

.ticketWrap .detailsBox .details ul li {
  /*
                        position: relative;
                        float: left;
                        width: 23%;
                        min-height: 1px;
                        padding-left: 15px;
                        padding-right: 15px;
                        padding: 0 0 0 5px;
                        margin: 15px 10px 0 0;
*/
  position: relative;
  float: left;
  width: 23%;
  min-height: 1px;
  margin-right: 2%;
  margin-top: 2%; }

/*===================sp=*/
@media screen and (max-width: 860px) {
  .ticketWrap .detailsBox .details ul li {
    position: relative;
    float: left;
    width: 94%;
    min-height: 1px;
    padding-left: 3%;
    padding-right: 3%;
    margin: 15px auto 0 auto; }

  .ticketWrap .detailsBox .details a.scrap:hover {
    text-decoration: none;
    opacity: 1; } }
/*====================*/
.ticketWrap .detailsBox .details ul li .scheduleBox {
  position: relative;
  padding: 1em 8%;
  background: #fff;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  z-index: 1;
  color: #ffffff;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center; }

.ticketWrap .detailsBox .details ul li .scheduleBox a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  color: #ffffff; }

.ticketWrap .detailsBox .details ul li .scheduleBox .time {
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  margin-right: 10px; }

.ticketWrap .detailsBox .details ul li .scheduleBox .state {
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  /* 							margin-left: 10px; */ }

.ticketWrap .detailsBox .details ul li .scheduleBox:hover {
  opacity: 0.7; }

.ticketWrap .detailsBox .details ul li .scheduleBox.present {
  background: #32b16c; }

.ticketWrap .detailsBox .details ul li .scheduleBox.present .state span:before {
  content: "○"; }

.ticketWrap .detailsBox .details ul li .scheduleBox.sold {
  background: #969696; }

.ticketWrap .detailsBox .details ul li .scheduleBox.sold .state span:before {
  content: "✕"; }

.ticketWrap .detailsBox .details ul li .scheduleBox.few {
  background: #960b0b; }

.ticketWrap .detailsBox .details ul li .scheduleBox.few .state span:before {
  content: "△"; }

.ticketWrap .detailsBox .details ul li .scheduleBox.remaining {
  color: #f84141; }

.ticketWrap .detailsBox .details .buyWrap {
  width: 100%;
  margin: 20px auto 0 auto;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between; }

.ticketWrap .detailsBox .details .buyWrap .ticketBox {
  width: 48%; }

/*===================sp=*/
@media screen and (max-width: 860px) {
  .ticketWrap .detailsBox .details .buyWrap {
    width: 100%;
    margin: 20px auto 0 auto;
    display: block; }

  .ticketWrap .detailsBox .details .buyWrap .ticketBox {
    width: 100%;
    margin: 0 0 0 0; }

  .ticketWrap .detailsBox .details ul li .scheduleBox:hover {
    opacity: 1; } }
/*====================*/
.ticketWrap .detailsBox .details .ticketBox {
  margin-left: -15px;
  margin-right: -15px;
  margin: 0 -7px 0 -7px; }

.ticketWrap .detailsBox .details .ticketBox:before,
.ticketWrap .detailsBox .details .ticketBox:after {
  content: " ";
  display: table; }

.ticketWrap .detailsBox .details .ticketBox:after {
  clear: both; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
  margin: 0 0 15px;
  padding: 0 7px 0 7px; }

.ticketWrap .detailsBox .details .ticketBox .ticket-item:last-child {
  margin-bottom: 0; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem:nth-of-type(2n) + div.ticketItem {
  clear: left; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem p {
  font-size: 10px;
  margin: 0; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket {
  display: block;
  margin: 0 0 15px 0;
  padding: 10px 2% 10px 2%;
  width: 96%;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  border: none;
  background: #ffffff; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket:hover {
  opacity: 0.7; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.scrap {
  background: #f34f49; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.scrap:hover {
  opacity: 0.7; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.eplus {
  background: #e85298; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.eplus:hover {
  opacity: 0.7; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.pia {
  background: #36c; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.pia:hover {
  opacity: 0.7; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.lawson {
  background: #1a9fdd; }

.ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.lawson:hover {
  opacity: 0.7; }

._scheduler_container ._description_container ._description_item {
  padding: 0 0.7em; }

._scheduler_container ._scheduler_event_wrapper ._scheduler_event_timeBox_text ._timeBox_symbol {
  margin: initial !important; }

/*===================sp=*/
@media screen and (max-width: 860px) {
  .ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket:hover,
  .ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.scrap:hover,
  .ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.eplus:hover,
  .ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.pia:hover,
  .ticketWrap .detailsBox .details .ticketBox .ticketItem a.ticket.lawson:hover {
    opacity: 1; } }
/*====================*/

/*# sourceMappingURL=style.css.map */