@charset "utf-8";

a:hover {
  cursor: pointer;
  filter: alpha(opacity=70);
  opacity:0.8;
}

body {
  background-color: black;
}

.contents {
}

.container {
  position: relative;
}

.background {
}

.frame-movie {
  position: absolute;
  margin: 0 auto;
  right: 0;
  left: 0;

  bottom: 76.0%;
}
.trailer {
  width: 95%;
  max-width: 900px;
  margin-top: 30px;
  margin-bottom: 30px;
}

.buttons {
  position: absolute;
}

.button-skype {
  right: 71%;
  bottom: 55.3%;
}

.button-form-small {
  left: 55%;
  bottom: 55.3%;
}
.button-faq {
  margin: 0 auto;
  right: 0;
  left: 0;
  bottom: 51.5%;
}

.button-ticket {
  margin: 0 auto;
  right: 0;
  left: 0;

  bottom: 28.0%;
}
.embed-map {
  --width-embed-map: 400;
  --height-embed-map: 400;

  position: absolute;

  bottom: 13.6%;
  right: 47%;
  width: calc(var(--width-embed-map) * 1px);
  height: calc(var(--height-embed-map) * 1px);
}
.iframe-map {
  width: 100%;
  height: 100%;
}
.text-map {
  --width-text-map: 330;

  position: absolute;
  bottom: 15.2%;
  left: 54%;
  width: calc(var(--width-text-map) * 1px);

  text-align: left;
  color: white;
  font-size: 16px;
  z-index: 2;

}
.text-map .large {
  font-weight: bold;
  font-size: 22px;
}
.text-map .medium {
  font-size: 18px;
}
.logo {
  position: absolute;
  margin: 0 auto;
  right: 0;
  left: 0;
  bottom: 1%;
}

/* 1001px未満 */
@media screen and (max-width: 1001px) {
  .button-faq  {
    width: calc(794 / 1001 * 100vw);
  }
  .button-ticket  {
    width: calc(202 / 1001 * 100vw);
  }
  .embed-map {
    width: calc(var(--width-embed-map) / 1001 * 100vw * 0.9);
    height: calc(var(--height-embed-map) / 1001 * 100vw * 0.9);
  }
  .text-map {
    width: calc(var(--width-text-map) / 1001 * 100vw * 0.95);
    font-size: 1.6vw;
    bottom: 14.8%;
  }
  .text-map .large {
    font-size: 2vw;
  }
  .text-map .medium {
    font-size: 1.8vw;
  }
  .logo {
    width: calc(199 / 1001 * 100vw);
  }
}