@charset "UTF-8";


/* --- 公演タイトル --- */
.frame-title {
}
.title {
  --width-title: 348;
  --left-title: 30;

  position: fixed;
  top: 100px;
  left: calc(var(--left-title) * 1px);
  z-index: 3;
}
/* --- 2週間限定で開催 --- */
.frame-right {
}
.right {
  --top-right: 120;
  --width-right: 505;
  --right-right: 30;

  position: fixed;
  top: calc(var(--top-right) * 1px);
  right: calc(var(--right-right) * 1px);
  z-index: 3;
}

/* --- メニュー --- */
#frame-menu {
  --top-frame-menu: 500;
  --left-frame-menu: 30;
  --width-frame-menu: 200;

  position: fixed;
  top: calc(var(--top-frame-menu) * 1px);
  left: calc(var(--left-frame-menu) * 1px);

  width: calc(var(--width-frame-menu) * 1px);;
  height: 400px;
  z-index: 3;
}
.menu {
  --width-menu: 337;

  margin-bottom: 5px;
}
.menu:hover {
  cursor: pointer;
}

/* 2500px未満 */
@media screen and (max-width: 2500px) {
  .frame-title {
  }
  .title {
    width: calc(var(--width-title) / 2500 * 100vw * 0.8);
  }
  .frame-right {
  }
  .right {
    width: calc(var(--width-right) / 2500 * 100vw * 0.8);
    right: calc(var(--right-right) / 2500 * 100vw);
  }
  #frame-menu {
    top: calc(var(--top-frame-menu) / 2500 * 100vw);
  }
  .menu {
  }
  .menu:hover {
  }
}

/* 2210px未満 */
@media screen and (max-width: 2210px) {
  .frame-title {
  }
  .title {
    width: calc(var(--width-title) / 2210 * 100vw * 0.75);
  }
  .frame-right {
  }
  .right {
    width: calc(var(--width-right) / 2210 * 100vw * 0.7);
    right: calc(var(--right-right) / 2210 * 100vw * 0.1);
  }
  #frame-menu {
    top: calc(var(--top-frame-menu) / 2210  * 100vw * 0.9);
    left: calc(var(--left-frame-menu) / 2210  * 100vw * 1);
  }
  .menu {
  }
  .menu:hover {
  }
}

/* 1930px未満 */
@media screen and (max-width: 1930px) {
  .frame-title {
  }
  .title {
    width: calc(var(--width-title) / 1930 * 100vw * 0.5);
    left: calc(var(--left-title) / 1930 * 100vw * 0.75);
  }
  .frame-right {
  }
  .right {
    width: calc(var(--width-right) / 1930 * 100vw * 0.6);
    right: calc(var(--right-right) / 1930 * 100vw * 0.75);
  }
  #frame-menu {
    top: calc(var(--top-frame-menu) / 1930 * 100vw * 0.65);
    left: calc(var(--left-frame-menu) / 1930 * 100vw * 0.75);
    width: calc(var(--width-frame-menu) / 1930 * 100vw * 0.75);
  }
  .menu {
    width: calc(var(--width-menu) / 1930 * 100vw * 0.75);
  }
  .menu:hover {
  }
}

/* 1780px未満 */
@media screen and (max-width: 1780px) {
  .frame-title {
    display: none;
  }
  .title {
  }
  .frame-right {
    display: none;
  }
  .right {
  }
  #frame-menu {
    display: none;
  }
  .menu {
  }
  .menu:hover {
  }
}