@charset "utf-8";
/* CSS Document */
/* Reset
------------------------------------------------------------*/
html, body, main, div, span, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, small, form, fieldset, p, blockquote, th, td, header, footer, nav, aside, article, section, caption, summary, audio, video {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  min-width: 320px;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
  font-feature-settings: "palt";
}
h1, h2, h3, h4, h5, h6, small, table, input, textarea, select, option, button {
  font-size: 100%;
}
ul, ol {
  list-style-type: none;
}
a {
  outline: none;
  cursor: pointer;
  text-decoration: none;
}
img, fieldset {
  border: 0;
}
img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
@media screen and (max-width: 767px) {
  .pc__show {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .sp__show {
    display: none;
  }
}
/*h2*/
.contents__header {
  text-align: center;
}
.contents__header__image {
  width: 32.5rem;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .contents__header__image {
    width: calc(598 / 768 * 100vw);
  }
}
/* kv
------------------------------------------------------------*/
.kv--inner {
  max-width: 143.75rem;
  min-height: 42.5rem;
  background-image: url("/animaxclassic/img/kv_pc.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center top;
  margin: 0 auto;
}
.site__headline {
  max-width: 44.875rem;
  margin: 0 auto;
  padding-top: 5.9375rem;
}
@media screen and (max-width: 767px) {
  .kv--inner {
    min-height: calc(1228 / 768 * 100vw);
    background-image: url("/animaxclassic/img/kv_sp.webp");
    background-size: contain;
  }
  .site__headline {
    width: calc(644 / 768 * 100vw);
    padding-top: calc(388 / 768 * 100vw);
  }
}
/* message
------------------------------------------------------------*/
.message--inner {
  max-width: 143.75rem;
  min-height: 33.125rem;
  background-image: url("/animaxclassic/img/message_bg_pc.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin: 0 auto;
}
.message__text {
  max-width: 60rem;
  margin: 0 auto;
  padding: .5rem 1rem 0;
}
@media screen and (max-width: 767px) {
  .message--inner {
    min-height: calc(1280 / 768 * 100vw);
    background-image: url("/animaxclassic/img/message_bg_sp.webp");
    background-size: contain;
  }
  .message__text {
    width: calc(646 / 768 * 100vw);
    padding: calc(78 / 768 * 100vw) 0 0;
  }
}
/* event
------------------------------------------------------------*/
.event {
  color: #3E3A39;
  margin-top: 5rem;
}
.event--inner {
  max-width: 77rem;
  margin: 3.75rem auto 0;
  padding: 0 1rem;
}
.event--box {
  border-top: 1px solid #3E3A39;
  padding: 2.5rem 0;
}
.event--box:last-of-type {
  border-bottom: 1px solid #3E3A39;
}
.status__label {
  display: inline-block;
  color: #FFFFFF;
  font-weight: bold;
  font-size: 1.1875rem;
  padding: .75rem 1.5rem;
}
.upcoming .status__label {
  background-color: #D5453A;
}
.past .status__label {
  background-color: #0F65A0;
}
.event__place {
  font-size: 1.5rem;
  line-height: 1.3;
  margin: 1.75rem 0;
}
.event--detail__title {
  margin-bottom: .75rem;
}
.upcoming .event--detail__title {
  color: #D5453A;
}
.past .event--detail__title {
  color: #0F65A0;
}
.event--detail__text + .event--detail__title {
  margin-top: 1.75rem;
}
.performer--lists {
  margin-bottom: 1.75rem;
}
.more--details {
  display: none;
  margin-top: 1.75rem;
}
.performer--list {
  width: 8.75rem;
  display: inline-block;
}
.performer--list + .performer--list {
  margin-left: 2rem;
}
.event__link {
  font-weight: bold;
  font-size: 1.1875rem;
  margin-top: 3.375rem;
}
.event__link::after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 17px;
  background-image: url('/animaxclassic/img/link_icon.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-left: 0.4em;
  vertical-align: middle;
}
.event__link__text {
  color: #0096D4;
  text-decoration: underline;
}
.detail__button {
  cursor: pointer;
  border: none;
  background: none;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
  font-feature-settings: "palt";
}
.button__text {
  text-decoration: underline;
}
.show__button {
  margin-top: 3.125em;
}
.show__button::after {
  content: "▼";
  margin-left: .25em;
  font-size: 0.9em;
}
.close__button {
  margin-top: 5em;
}
.close__button::after {
  content: "▲";
  margin-left: .25em;
  font-size: 0.9em;
}
@media screen and (max-width: 767px) {
  .event {
    margin-top: calc(100 / 768 * 100vw);
  }
  .event--inner {
    margin: calc(75 / 768 * 100vw) auto 0;
    padding: 0 calc(40 / 768 * 100vw);
  }
  .event--box {
    padding: calc(70 / 768 * 100vw) 0;
  }
  .event--box:last-of-type {
    border-bottom: 1px solid #3E3A39;
  }
  .status__label {
    font-size: calc(34 / 768 * 100vw);
    padding: calc(24 / 768 * 100vw) calc(38 / 768 * 100vw);
  }
  .event__place {
    font-size: calc(45 / 768 * 100vw);
    line-height: 1.3;
    margin: 1.75rem 0;
  }
  .event--detail__title {
    font-size: calc(28 / 768 * 100vw);
    margin-bottom: calc(25 / 768 * 100vw);
  }
  .event--detail__text {
    font-size: calc(31 / 768 * 100vw);
    margin-bottom: calc(40 / 768 * 100vw);
  }
  .event--detail__text + .event--detail__title {
    margin-top: calc(40 / 768 * 100vw);
  }
  .performer--lists {
    margin-bottom: calc(40 / 768 * 100vw);
  }
  .more--details {
    margin-top: calc(40 / 768 * 100vw);
  }
  .performer--list {
    width: calc(224 / 768 * 100vw);
  }
  .performer--list + .performer--list {
    margin-left: calc(54 / 768 * 100vw);
  }
  .event__link {
    font-size: calc(31 / 768 * 100vw);
    margin-top: calc(80 / 768 * 100vw);
  }
  .event__link::after {
    width: calc(31 / 768 * 100vw);
    height: calc(27 / 768 * 100vw);
  }
  .detail__button--wrap {
    text-align: center;
  }
  .show__button {
    margin-top: calc(70 / 768 * 100vw);
  }
  .close__button {
    margin-top: calc(120 / 768 * 100vw);
  }
}
/* special__tieup
------------------------------------------------------------*/
.special__tieup {
  text-align: center;
  padding: 7.1875rem 0 5.9375rem;
}
.special__tieup .contents__header {
  margin-bottom: 3.625rem;
}
.special__tieup__image {
  width: 31.875rem;
}
@media screen and (max-width: 767px) {
  .special__tieup {
    text-align: center;
    padding: calc(150 / 768 * 100vw) 0 calc(136 / 768 * 100vw);
  }
  .special__tieup .contents__header {
    margin-bottom: calc(70 / 768 * 100vw);
  }
  .special__tieup__image {
    width: calc(608 / 768 * 100vw);
  }
}
/* footer
------------------------------------------------------------*/
.footer {
  text-align: center;
}
.footer--inner {
  max-width: 143.75rem;
  background-image: url("/animaxclassic/img/footer_bg_pc.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin: 0 auto;
  padding: 14rem 0 1.75rem;
}
.footer__bottom {
  color: #FFFFFF;
  font-size: calc(20 / 768 * 100vw);
  letter-spacing: .02em;
  background: #0075C2;
  padding: 2.1875rem 0 3.75rem;
}
.footer__logo {
  margin-bottom: 2rem;
}
.footer__logo__image {
  width: 11.625rem;
}
.footer__menu--group {
  display: flex;
  justify-content: center;
  font-size: 0.875rem;
  max-width: 32.5rem;
  margin: 0 auto;
}
.footer__menu + .footer__menu::before {
  content: "|";
  margin: 0 1.5em;
}
.footer__link {
  color: #3E3A39;
  transition: .3s;
}
.footer__link:hover {
  opacity: .5;
}
.footer__copyright {
  font-size: 0.875rem;
}
@media screen and (max-width: 767px) {
  .footer--inner {
    width: 100%;
    background-image: url("/animaxclassic/img/footer_bg_sp.webp");
    padding: calc(226 / 768 * 100vw) 0 calc(50 / 768 * 100vw);
  }
  .footer__logo {
    margin-bottom: calc(36 / 768 * 100vw);
  }
  .footer__logo__image {
    width: calc(180 / 768 * 100vw);
  }
  .footer__menu--group {
    max-width: 100%;
    font-size: calc(18 / 768 * 100vw);
  }
  .footer__bottom {
    padding: calc(36 / 768 * 100vw) 0 calc(50 / 768 * 100vw);
  }
  .footer__copyright {
    font-size: calc(20 / 768 * 100vw);
  }
}