#introduction {
  position: fixed;
  display: none;
  justify-content: center;
  align-items: center;
  top:0;
  bottom:0;
  width: 100vw;
  height: 100vh;
  background-color: #0008;
  z-index: 200;
}

.intro-window {
  display: flex;
  flex-direction: column;
  width: 70vw;
  height: 110vw;
  border-radius: 2vw;
  padding:5vw;
}

.intro-content {
  display: flex !important;
  flex-direction: column;
  height: 105vw !important;
  margin-bottom: 2vw;
}

.intro-title {
  width: 100%;
  text-align: center;
  font-size: 1.2em;
}

.intro-image {
  height: 40%;
  width: auto;
  max-width: 90%;

  margin:5vw auto 5vw auto;
  min-height: 0;
  flex-shrink: 1;

  object-fit: contain;
}

.intro-image2 {
  height: 40%;
  margin:5vw auto 5vw auto;
  min-height: 0;
}

.intro-description {
  width: 100%;
  margin-bottom:3vw;
  font-size: 0.9em;
}

.intro-button-box {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: auto;
  margin-bottom: 2vw;
}

.intro-button {
  color: #fff;
  width: 60vw;
  height: 10vw;
  font-size: 1.0em;
  border-radius: 15vw;
  border: none;
}

#orientation-introduction {
  position: fixed;
  display: none;
  justify-content: center;
  align-items: center;
  top:0;
  bottom:0;
  width: 100vw;
  height: 100vh;
  background-color: #0008;
  z-index: 200;
}

.orientation-image {
  width: 50vw;
  height: auto;
  margin:5vw auto 5vw auto;
}