@charset "UTF-8";
/* top layout */
/* 全体の設定
---------------------------------------------------------------------------*/
/* 基本設定
---------------------------------------------------------------------------*/
/* responsive */
/* サイズ */
/* flexbox */
/* フォント */
/* 色 */
/* グラデ背景色 */
/* 中央揃え */
/* objectfit */
/* ホバーアクション */
/* 角丸 */
/* ボタン */
/* ボタンの中のspan */
/* フォントサイズ */
/* padding margin */
/* 縦書き */
/* 内径 */
/* 文字 */
body {
  background-color: #111;
  color: #ffffff; }

/* pub
---------------------------------------------------------------------------*/
.pub-hd {
  position: relative;
  width: 100%;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100); }
  .pub-hd-img {
    position: absolute;
    width: 100%;
    height: 100%; }
    .pub-hd-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      font-family: "object-fit: cover; object-position: center;"; }
  .pub-hd-logo {
    position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    text-align: center; }
    .pub-hd-logo .logo {
      width: 264px;
      margin: 0 auto; }
      @media screen and (max-width: 1500px) {
        .pub-hd-logo .logo {
          width: 17.6vw; } }
      @media screen and (max-width: 480px) {
        .pub-hd-logo .logo {
          width: 60vw; } }
    .pub-hd-logo .catch {
      font-size: 41px;
      color: #ffffff; }
      @media screen and (max-width: 1500px) {
        .pub-hd-logo .catch {
          font-size: 2.7333333333vw; } }
      @media screen and (max-width: 480px) {
        .pub-hd-logo .catch {
          font-size: 9.5666666667vw; } }
  .pub-hd-scrl {
    position: absolute;
    width: 26px;
    left: calc(50% + 574px);
    bottom: 37px;
    z-index: 100; }
    @media screen and (max-width: 1500px) {
      .pub-hd-scrl {
        width: 1.7333333333vw;
        left: calc(50% + 44.15384vw);
        bottom: 2.4666666667vw; } }
    @media screen and (max-width: 480px) {
      .pub-hd-scrl {
        width: 6.9333333333vw;
        left: auto;
        right: 5.3333333333vw;
        bottom: 5.3333333333vw; } }
.pub-news {
  padding-top: 60px;
  padding-bottom: 60px; }
  @media screen and (max-width: 1500px) {
    .pub-news {
      padding-top: 4vw;
      padding-bottom: 4vw; } }
  @media screen and (max-width: 480px) {
    .pub-news {
      padding-top: 8vw;
      padding-bottom: 8vw; } }
  .pub-news-ttl {
    font-size: 36px;
    text-align: center;
    margin-bottom: 60px; }
    @media screen and (max-width: 1500px) {
      .pub-news-ttl {
        font-size: 2.4vw; } }
    @media screen and (max-width: 480px) {
      .pub-news-ttl {
        font-size: 8.4vw; } }
    @media screen and (max-width: 1500px) {
      .pub-news-ttl {
        margin-bottom: 4vw; } }
    @media screen and (max-width: 480px) {
      .pub-news-ttl {
        margin-bottom: 8vw; } }
  .pub-news-list {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    @media screen and (max-width: 1500px) {
      .pub-news-list {
        width: 80vw; } }
    @media screen and (max-width: 480px) {
      .pub-news-list {
        width: 89.3333333333vw;
        /* 余白40 */ } }
    @media screen and (max-width: 480px) {
      .pub-news-list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
    .pub-news-list li {
      width: 348px;
      margin-right: 78px;
      color: #CCCCCC; }
      @media screen and (max-width: 1500px) {
        .pub-news-list li {
          width: 23.2vw;
          margin-right: 5.2vw; } }
      @media screen and (min-width: 481px) {
        .pub-news-list li:last-of-type {
          margin-right: 0; } }
      @media screen and (max-width: 480px) {
        .pub-news-list li {
          width: 100%;
          margin-right: 0; }
          .pub-news-list li + li {
            margin-top: 8vw; } }
      .pub-news-list li a {
        display: block; }
        .pub-news-list li a .img img {
          width: 100%;
          height: 230px;
          object-fit: cover;
          object-position: center;
          font-family: "object-fit: cover; object-position: center;"; }
          @media screen and (max-width: 1500px) {
            .pub-news-list li a .img img {
              height: 15.3333333333vw; } }
          @media screen and (max-width: 480px) {
            .pub-news-list li a .img img {
              height: 50vw; } }
        .pub-news-list li a .tx {
          /* regular: 400 */
          font-family: "Noto Sans JP", sans-serif;
          font-weight: 400;
          font-style: normal;
          margin-top: 0.5em; }
          .pub-news-list li a .tx .date {
            font-size: 14px; }
            @media screen and (max-width: 1500px) {
              .pub-news-list li a .tx .date {
                font-size: 0.9333333333vw; } }
            @media screen and (max-width: 480px) {
              .pub-news-list li a .tx .date {
                font-size: 3.2666666667vw; } }
          .pub-news-list li a .tx .ttl {
            font-size: 15px; }
            @media screen and (max-width: 1500px) {
              .pub-news-list li a .tx .ttl {
                font-size: 1vw; } }
            @media screen and (max-width: 480px) {
              .pub-news-list li a .tx .ttl {
                font-size: 3.5vw; } }
.pub-intr {
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 1920px auto;
  background-image: url(../img/pub/intr-bg.jpg);
  margin-bottom: 120px; }
  @media screen and (max-width: 1500px) {
    .pub-intr {
      background-size: 128vw auto;
      margin-bottom: 8vw; } }
  @media screen and (max-width: 480px) {
    .pub-intr {
      background-size: 100vw auto;
      margin-bottom: 16vw; } }
  .pub-intr-wrap {
    width: 1200px;
    margin-left: auto;
    margin-right: auto; }
    @media screen and (max-width: 1500px) {
      .pub-intr-wrap {
        width: 80vw; } }
    @media screen and (max-width: 480px) {
      .pub-intr-wrap {
        width: 89.3333333333vw;
        /* 余白40 */ } }
  .pub-intr-hd {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative; }
    @media screen and (max-width: 480px) {
      .pub-intr-hd {
        display: block; } }
    .pub-intr-hd .catch {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      width: 50%;
      padding-top: 135px; }
      @media screen and (max-width: 1500px) {
        .pub-intr-hd .catch {
          padding-top: 9vw; } }
      @media screen and (max-width: 480px) {
        .pub-intr-hd .catch {
          width: 100%;
          padding-top: 8vw; } }
      .pub-intr-hd .catch h2 {
        -webkit-writing-mode: vertical-rl;
        -moz-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        -o-writing-mode: vertical-rl;
        writing-mode: vertical-rl; }
        @media screen and (max-width: 480px) {
          .pub-intr-hd .catch h2 {
            -webkit-writing-mode: initial;
            -moz-writing-mode: initial;
            -ms-writing-mode: initial;
            -o-writing-mode: initial;
            writing-mode: initial; } }
        .pub-intr-hd .catch h2 span {
          display: block;
          line-height: 32px;
          font-size: 32px;
          margin: 0 .6em;
          letter-spacing: .2em; }
          @media screen and (max-width: 1500px) {
            .pub-intr-hd .catch h2 span {
              font-size: 2.1333333333vw; } }
          @media screen and (max-width: 480px) {
            .pub-intr-hd .catch h2 span {
              font-size: 7.4666666667vw; } }
          @media screen and (max-width: 480px) {
            .pub-intr-hd .catch h2 span {
              line-height: 1.8;
              margin: 0;
              letter-spacing: .1em; } }
    .pub-intr-hd .img {
      position: absolute;
      top: 70px;
      right: 0;
      width: 650px; }
      @media screen and (max-width: 1500px) {
        .pub-intr-hd .img {
          top: 4.6666666667vw;
          width: 43.3333333333vw; } }
      @media screen and (max-width: 480px) {
        .pub-intr-hd .img {
          position: relative;
          top: auto;
          right: auto;
          width: 100%;
          padding-top: 8vw; } }
    .pub-intr-hd .desc {
      width: 50%;
      padding-top: 690px; }
      @media screen and (max-width: 1500px) {
        .pub-intr-hd .desc {
          padding-top: 46vw; } }
      @media screen and (max-width: 480px) {
        .pub-intr-hd .desc {
          width: 100%;
          padding-top: 8vw; } }
      .pub-intr-hd .desc p {
        line-height: 2.357;
        font-size: 14px; }
        @media screen and (max-width: 1500px) {
          .pub-intr-hd .desc p {
            font-size: 0.9333333333vw; } }
        @media screen and (max-width: 480px) {
          .pub-intr-hd .desc p {
            font-size: 3.2666666667vw; } }
  .pub-intr-ft {
    margin-top: 100px; }
    @media screen and (max-width: 1500px) {
      .pub-intr-ft {
        margin-top: 6.6666666667vw; } }
    @media screen and (max-width: 480px) {
      .pub-intr-ft {
        margin-top: 13.3333333333vw; } }
    .pub-intr-ft img {
      max-width: 1330px;
      width: 100%;
      margin: 0 auto; }
      @media screen and (max-width: 1500px) {
        .pub-intr-ft img {
          max-width: 88.6666666667vw; } }
      @media screen and (max-width: 480px) {
        .pub-intr-ft img {
          max-width: 100vw; } }
.pub-detail {
  margin-bottom: 120px; }
  @media screen and (max-width: 1500px) {
    .pub-detail {
      margin-bottom: 8vw; } }
  @media screen and (max-width: 480px) {
    .pub-detail {
      margin-bottom: 16vw; } }
  .pub-detail .lay-imgtx {
    width: 1448px;
    margin-left: auto;
    margin-right: auto; }
    @media screen and (max-width: 1500px) {
      .pub-detail .lay-imgtx {
        width: 96.5333333333vw; } }
    @media screen and (max-width: 480px) {
      .pub-detail .lay-imgtx {
        width: 89.3333333333vw;
        /* 余白40 */ } }
    .pub-detail .lay-imgtx-img {
      width: 845px; }
      @media screen and (max-width: 1500px) {
        .pub-detail .lay-imgtx-img {
          width: 56.3333333333vw; } }
      @media screen and (max-width: 480px) {
        .pub-detail .lay-imgtx-img {
          width: 100%; } }
    .pub-detail .lay-imgtx-tx-desc {
      font-size: 14px;
      line-height: 2.3;
      /* regular: 400 */
      font-family: "Noto Sans JP", sans-serif;
      font-weight: 400;
      font-style: normal;
      letter-spacing: .01em; }
      @media screen and (max-width: 1500px) {
        .pub-detail .lay-imgtx-tx-desc {
          font-size: 0.9333333333vw; } }
      @media screen and (max-width: 480px) {
        .pub-detail .lay-imgtx-tx-desc {
          font-size: 3.2666666667vw; } }
  .pub-detail-en {
    font-size: 36px;
    margin-bottom: 0; }
    @media screen and (max-width: 1500px) {
      .pub-detail-en {
        font-size: 2.4vw; } }
    @media screen and (max-width: 480px) {
      .pub-detail-en {
        font-size: 8.4vw; } }
  .pub-detail-ja {
    font-size: 18px;
    margin-bottom: 1.6em; }
    @media screen and (max-width: 1500px) {
      .pub-detail-ja {
        font-size: 1.2vw; } }
    @media screen and (max-width: 480px) {
      .pub-detail-ja {
        font-size: 4.2vw; } }
  .pub-detail-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 70px;
    margin-bottom: 90px; }
    @media screen and (max-width: 1500px) {
      .pub-detail-btn {
        margin-top: 4.6666666667vw;
        margin-bottom: 6vw; } }
    @media screen and (max-width: 480px) {
      .pub-detail-btn {
        margin-bottom: 9.3333333333vw;
        margin-bottom: 0; } }
    @media screen and (min-width: 481px) {
      .pub-detail-btn.left {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start; } }
    .pub-detail-btn a {
      width: 324px; }
      @media screen and (max-width: 1500px) {
        .pub-detail-btn a {
          width: 21.6vw; } }
      @media screen and (max-width: 480px) {
        .pub-detail-btn a {
          width: 80vw; } }
  @media screen and (max-width: 480px) {
    .pub-detail-car {
      margin-top: 8vw; } }
  .pub-detail-car .swiper-slide {
    width: 450px; }
    @media screen and (max-width: 1500px) {
      .pub-detail-car .swiper-slide {
        width: 30vw; } }
    @media screen and (max-width: 480px) {
      .pub-detail-car .swiper-slide {
        width: 60vw; } }
  .pub-detail-car .swiper-wrapper {
    transition-timing-function: linear; }
.pub-music {
  margin-bottom: 120px;
  padding-top: 60px; }
  @media screen and (max-width: 1500px) {
    .pub-music {
      padding-top: 4vw;
      margin-bottom: 8vw; } }
  @media screen and (max-width: 480px) {
    .pub-music {
      padding-top: 8vw;
      margin-bottom: 16vw; } }
  .pub-music-hd {
    height: 660px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url(../img/pub/music-bg.jpg); }
    @media screen and (max-width: 1500px) {
      .pub-music-hd {
        height: 44vw; } }
    @media screen and (max-width: 480px) {
      .pub-music-hd {
        height: 60vw; } }
    .pub-music-hd-wrap {
      position: relative;
      width: 1200px;
      margin-left: auto;
      margin-right: auto; }
      @media screen and (max-width: 1500px) {
        .pub-music-hd-wrap {
          width: 80vw; } }
      @media screen and (max-width: 480px) {
        .pub-music-hd-wrap {
          width: 89.3333333333vw;
          /* 余白40 */ } }
      @media screen and (max-width: 480px) {
        .pub-music-hd-wrap {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          height: 60vw; } }
      .pub-music-hd-wrap .tx {
        position: absolute;
        top: -60px;
        left: 0; }
        @media screen and (max-width: 1500px) {
          .pub-music-hd-wrap .tx {
            top: -4vw; } }
        @media screen and (max-width: 480px) {
          .pub-music-hd-wrap .tx {
            position: relative;
            top: auto;
            left: auto;
            width: 100%;
            text-align: center; } }
        .pub-music-hd-wrap .tx h2 {
          -webkit-writing-mode: vertical-rl;
          -moz-writing-mode: vertical-rl;
          -ms-writing-mode: tb-rl;
          -o-writing-mode: vertical-rl;
          writing-mode: vertical-rl;
          text-orientation: upright; }
          @media screen and (max-width: 480px) {
            .pub-music-hd-wrap .tx h2 {
              -webkit-writing-mode: initial;
              -moz-writing-mode: initial;
              -ms-writing-mode: initial;
              -o-writing-mode: initial;
              writing-mode: initial;
              display: inline-block; } }
          .pub-music-hd-wrap .tx h2 span {
            display: block;
            line-height: 32px;
            font-size: 32px;
            margin: 0 .4em;
            letter-spacing: .2em; }
            @media screen and (max-width: 1500px) {
              .pub-music-hd-wrap .tx h2 span {
                font-size: 2.1333333333vw; } }
            @media screen and (max-width: 480px) {
              .pub-music-hd-wrap .tx h2 span {
                font-size: 7.4666666667vw; } }
            @media screen and (max-width: 480px) {
              .pub-music-hd-wrap .tx h2 span {
                line-height: 1.8;
                margin: .4em 0;
                letter-spacing: .1em;
                text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5); } }
            .pub-music-hd-wrap .tx h2 span.ttl {
              font-size: 32px; }
              @media screen and (max-width: 1500px) {
                .pub-music-hd-wrap .tx h2 span.ttl {
                  font-size: 2.1333333333vw; } }
              @media screen and (max-width: 480px) {
                .pub-music-hd-wrap .tx h2 span.ttl {
                  font-size: 7.4666666667vw; } }
            .pub-music-hd-wrap .tx h2 span.catch {
              position: relative;
              font-size: 18px;
              padding: 2em 0;
              margin-top: 2.4em; }
              @media screen and (max-width: 1500px) {
                .pub-music-hd-wrap .tx h2 span.catch {
                  font-size: 1.2vw; } }
              @media screen and (max-width: 480px) {
                .pub-music-hd-wrap .tx h2 span.catch {
                  font-size: 4.2vw; } }
              @media screen and (max-width: 480px) {
                .pub-music-hd-wrap .tx h2 span.catch {
                  margin-top: 0;
                  padding: 0 2em;
                  top: 50%;
                  transform: translateY(-50%); } }
              .pub-music-hd-wrap .tx h2 span.catch::before, .pub-music-hd-wrap .tx h2 span.catch::after {
                position: absolute;
                content: "";
                width: 1px;
                height: 1em;
                background-color: #ffffff;
                left: 50%;
                transform: translateX(-50%); }
                @media screen and (max-width: 480px) {
                  .pub-music-hd-wrap .tx h2 span.catch::before, .pub-music-hd-wrap .tx h2 span.catch::after {
                    width: 1em;
                    height: 1px;
                    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5); } }
              .pub-music-hd-wrap .tx h2 span.catch::before {
                top: 0; }
                @media screen and (max-width: 480px) {
                  .pub-music-hd-wrap .tx h2 span.catch::before {
                    left: 0;
                    top: 50%; } }
              .pub-music-hd-wrap .tx h2 span.catch::after {
                bottom: 0; }
                @media screen and (max-width: 480px) {
                  .pub-music-hd-wrap .tx h2 span.catch::after {
                    right: 0;
                    top: 50%;
                    left: auto; } }
.pub-access {
  width: 1200px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 60px; }
  @media screen and (max-width: 1500px) {
    .pub-access {
      width: 80vw; } }
  @media screen and (max-width: 480px) {
    .pub-access {
      width: 89.3333333333vw;
      /* 余白40 */ } }
  @media screen and (max-width: 1500px) {
    .pub-access {
      margin-bottom: 4vw; } }
  @media screen and (max-width: 480px) {
    .pub-access {
      margin-bottom: 16vw; } }
  .pub-access-ttl {
    text-align: center;
    margin-bottom: 40px; }
    @media screen and (max-width: 1500px) {
      .pub-access-ttl {
        margin-bottom: 2.6666666667vw; } }
    @media screen and (max-width: 480px) {
      .pub-access-ttl {
        margin-bottom: 8vw; } }
    .pub-access-ttl .en {
      font-size: 35px;
      letter-spacing: .06em; }
      @media screen and (max-width: 1500px) {
        .pub-access-ttl .en {
          font-size: 2.3333333333vw; } }
      @media screen and (max-width: 480px) {
        .pub-access-ttl .en {
          font-size: 8.1666666667vw; } }
    .pub-access-ttl .ja {
      font-size: 18px;
      letter-spacing: .06em; }
      @media screen and (max-width: 1500px) {
        .pub-access-ttl .ja {
          font-size: 1.2vw; } }
      @media screen and (max-width: 480px) {
        .pub-access-ttl .ja {
          font-size: 4.2vw; } }
  .pub-access-map {
    margin-bottom: 60px; }
    @media screen and (max-width: 1500px) {
      .pub-access-map {
        margin-bottom: 4vw; } }
    @media screen and (max-width: 480px) {
      .pub-access-map {
        margin-bottom: 8vw; } }
    .pub-access-map iframe {
      display: block;
      width: 100%;
      height: 670px;
      border: none; }
      @media screen and (max-width: 1500px) {
        .pub-access-map iframe {
          height: 44.6666666667vw; } }
      @media screen and (max-width: 480px) {
        .pub-access-map iframe {
          height: 120vw; } }
  .pub-access-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    .pub-access-btn a {
      width: 324px; }
      @media screen and (max-width: 1500px) {
        .pub-access-btn a {
          width: 21.6vw; } }
      @media screen and (max-width: 480px) {
        .pub-access-btn a {
          width: 80vw; } }
