@charset "UTF-8";
/* ----------------------------------------------------------------
    keyimg 
  ----------------------------------------------------------------- */
body.home {}
.wrap {
 position: relative;
 width: 100%;
}
.kv {
 align-items: center;
 background-color: #03022a;
 background-image: url("../img/bkg_kv.jpg");
 background-position: bottom left;
 background-repeat: no-repeat;
 background-size: cover;
 display: flex;
 min-height: 100vh;
 justify-content: flex-end;
 position: relative;
 width: 100%;
}
.main-logo {
 margin: 0 5% 0 0;
 max-width: 1000px;
 width: 55%;
}
@media only screen and (max-width: 1366px) {
.main-logo {
  width: 50%;
 }
}
.main-logo .copy {
 margin: 0 auto;
 width: 74%;
}
.main-logo h1 {
 color: #fff;
 width: 100%;
}
.main-logo .tokyo {
 margin-left: auto;
 margin-top: 0%;
 width: 50%;
}
.main-logo .kobe {
 margin-left: auto;
 margin-top: 2.5%;
 width: 50%;
}
.guest {
 color: #fff;
 margin-left: auto;
 margin-top: 6.6%;
 padding-bottom: 5%;
 width: 85%;
}
#contents {
 width: 100%;
}
#contents-inr {
 background-color: #fff;
 border-radius: 40px;
 margin: 0 auto;
 width: 90%;
}
/* ----------------------------------------------------------------
    ページトップ
  ----------------------------------------------------------------- */
.scroll-btn {
 animation-name: stylie-transform-keyframes;
 animation-duration: 2500ms;
 animation-delay: 0ms;
 animation-timing-function: linear;
 animation-iteration-count: infinite;
 position: absolute;
 left:50%;
 bottom: 0px;
 margin: 0 0 0 -25px;
 width: 50px;
}
@keyframes stylie-transform-keyframes {
 0% {
  transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 1.67% {
  transform: translate(0px, -0.0179px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 3.33% {
  transform: translate(0px, -0.0676px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 5% {
  transform: translate(0px, -0.1431px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 6.67% {
  transform: translate(0px, -0.2385px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 8.33% {
  transform: translate(0px, -0.3476px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 10% {
  transform: translate(0px, -0.4645px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 11.67% {
  transform: translate(0px, -0.5832px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 13.33% {
  transform: translate(0px, -0.6977px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 15% {
  transform: translate(0px, -0.802px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 16.67% {
  transform: translate(0px, -0.8901px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 18.33% {
  transform: translate(0px, -0.9559px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 20% {
  transform: translate(0px, -0.9935px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 21.67% {
  transform: translate(0px, -0.9969px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 23.33% {
  transform: translate(0px, -0.9601px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 25% {
  transform: translate(0px, -0.877px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 26.67% {
  transform: translate(0px, -0.7417px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 28.33% {
  transform: translate(0px, -0.5481px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 30% {
  transform: translate(0px, -0.2903px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 31.67% {
  transform: translate(0px, 0.0378px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 33.33% {
  transform: translate(0px, 0.4421px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 35% {
  transform: translate(0px, 0.9287px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 36.67% {
  transform: translate(0px, 1.5035px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 38.33% {
  transform: translate(0px, 2.1726px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 40% {
  transform: translate(0px, 2.942px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 41.67% {
  transform: translate(0px, 3.8176px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 43.33% {
  transform: translate(0px, 4.8055px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 45% {
  transform: translate(0px, 5.9117px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 46.67% {
  transform: translate(0px, 7.1422px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 48.33% {
  transform: translate(0px, 8.503px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
 50% {
  transform: translate(0px, 10px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
  animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
 }
 100% {
  transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0, -50%);
 }
}
@media only screen and (max-width: 1024px) {
 .kv {
  aspect-ratio: 10 / 18;
  background-image: url("../img/bkg_kv_sp.png");
  background-position: center bottom;
  background-size: 100%;
  height: 100%;
  min-height: 100%;
 }
 .main-logo {
  margin: 0 auto;
  padding-bottom: 66%;
  width: 90%;
 }
 .main-logo .copy {
  margin: 0 auto;
  width: 100%;
 }
 .main-logo h1 {
  color: #fff;
  margin-top: 2.5%;
  width: 100%;
 }
 .main-logo .date {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  width: 100%;
 }
 .main-logo .tokyo {
  border-right: 1px solid #fff;
  margin-left: 0;
  margin-top: 0;
  padding-right: 5%;
  width: 50%;
 }
 .main-logo .kobe {
  margin-left: auto;
  margin-top: 0;
  width: 45%;
 }
 .guest {
  margin-top: 6.6%;
  width: 100%;
 }
}
/* ----------------------------------------------------------------
    intro 
  ----------------------------------------------------------------- */
#sec-intro {
 aspect-ratio: 1 / 0.8589;
 background-image: url("../img/bkg_intro.jpg");
 background-position: bottom left;
 background-repeat: no-repeat;
 background-size: cover;
 position: relative;
 width: 100%;
}
#sec-intro::before {
 background-image: url("../img/bkg_intro.webp");
 background-position: bottom left;
 background-repeat: no-repeat;
 background-size: cover;
 content: "";
 height: 100%;
 left: 0;
 position: absolute;
 top: 0;
 width: 50%;
 z-index: 10;
}
#sec-intro .loop-txt {
 position: absolute;
 top: 5%;
 width: 100%;
}
#sec-intro .loop-txt2 {
 bottom: 5%;
 position: absolute;
 width: 100%;
 z-index: 11;
}
#sec-intro .sec-wrap {
 align-items: center;
 display: flex;
 height: 100%;
 justify-content: center;
 margin-left: auto;
 width: 50%;
}
#sec-intro .intro-area {
 position: relative;
 width: 100%;
 z-index: 12;
}
#sec-intro .intro-txt {
 color: #333;
 font-family: "Zen Old Mincho", serif;
 font-size: 1.8vw;
 font-weight: 700;
 letter-spacing: -0.05em;
 line-height: 2;
 margin-right: 10%;
 text-align: justify;
 width: 90%;
}
#sec-intro .comment-area {
 border: 1px solid #333;
 margin: 5% 10% 0 0;
 padding: 5%;
 width: 90%;
}
#sec-intro .comment-txt {
 color: #333;
 font-size: 1.4vw;
 font-weight: 400;
 letter-spacing: 0.em;
 line-height: 2;
}
#sec-intro .comment-txt span {
 font-size: 1.5vw;
 font-weight: 700;
}
@media only screen and (max-width: 768px) {
 #sec-intro {
  aspect-ratio: auto;
  background-color: #ebeef3;
  background-image: url("../img/bkg_intro_sp.jpg");
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 110%;
  padding: 100vw 0 10%;
 }
 #sec-intro::before {
  display: none;
 }
 #sec-intro .loop-txt {
  position: absolute;
  top: 10px;
  width: 100%;
 }
 #sec-intro .loop-txt2 {
  position: absolute;
  top: calc(100vw - 5%);
  width: 100%;
 }
 #sec-intro .sec-wrap {
  align-items: center;
  display: flex;
  height: auto;
  justify-content: center;
  margin-left: auto;
  width: 100%;
 }
 #sec-intro .intro-area {
  color: #fff;
  z-index: 2;
 }
 #sec-intro .intro-txt {
  font-size: 18px;
  line-height: 1.7;
  margin: 5% auto 0;
  width: 90%;
 }
 #sec-intro .comment-area {
  margin: 5% auto 0;
 }
 #sec-intro .comment-txt {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.em;
  text-align: justify;
 }
 #sec-intro .comment-txt span {
  font-size: 16px;
  font-weight: 700;
  line-height: 2;
 }
}
/* ----------------------------------------------------------------
    home loop-txt
  ----------------------------------------------------------------- */
body.home .loop-txt {
 opacity: 1;
 overflow: hidden;
 width: 100%;
}
body.home .loop-txt .loop-img {
 display: flex;
 height: 113px;
 overflow: hidden;
 width: auto;
}
body.home .loop-txt .loop-img img {
 animation: loop 50s -25s linear infinite;
 height: 100%;
 max-width: none;
 width: auto;
}
body.home .loop-txt .loop-right img {
 animation: loop_right 50s -25s linear infinite;
}
body.home .loop-txt .loop-right img + img {
 animation: loop_right2 50s linear infinite;
}
body.home .loop-txt .loop-left img {
 animation: loop_left 50s -25s linear infinite;
}
body.home .loop-txt .loop-left img + img {
 animation: loop_left2 50s linear infinite;
}
@keyframes loop_right {
 0% {
  transform: translateX(-100%);
 }
 to {
  transform: translateX(100%);
 }
}
@keyframes loop_right2 {
 0% {
  transform: translateX(-200%);
 }
 to {
  transform: translateX(0);
 }
}
@keyframes loop_left {
 0% {
  transform: translateX(100%);
 }
 to {
  transform: translateX(-100%);
 }
}
@keyframes loop_left2 {
 0% {
  transform: translateX(0);
 }
 to {
  transform: translateX(-200%);
 }
}
body.home .loop-txt2 {
 opacity: 1;
 overflow: hidden;
 width: 100%;
}
body.home .loop-txt2 .loop-img {
 display: flex;
 height: 113px;
 overflow: hidden;
 width: auto;
}
body.home .loop-txt2 .loop-img img {
 animation: loop 50s -25s linear infinite;
 height: 100%;
 max-width: none;
 width: auto;
}
body.home .loop-txt2 .loop-right img {
 animation: loop_right 50s -25s linear infinite;
}
body.home .loop-txt2 .loop-right img + img {
 animation: loop_right2 50s linear infinite;
}
body.home .loop-txt2 .loop-left img {
 animation: loop_left 50s -25s linear infinite;
}
body.home .loop-txt2 .loop-left img + img {
 animation: loop_left2 50s linear infinite;
}
@keyframes loop_right {
 0% {
  transform: translateX(-100%);
 }
 to {
  transform: translateX(100%);
 }
}
@keyframes loop_right2 {
 0% {
  transform: translateX(-200%);
 }
 to {
  transform: translateX(0);
 }
}
@keyframes loop_left {
 0% {
  transform: translateX(100%);
 }
 to {
  transform: translateX(-100%);
 }
}
@keyframes loop_left2 {
 0% {
  transform: translateX(0);
 }
 to {
  transform: translateX(-200%);
 }
}
@media only screen and (max-width: 768px) {
 body.home .loop-txt .loop-img {
  height: 37px;
 }
 body.home .loop-txt2 .loop-img {
  height: 37px;
 }
}
/* ----------------------------------------------------------------
    sec-artist
  ----------------------------------------------------------------- */
#sec-artist {
 background-color: rgb(244, 245, 246);
 background-color: #ebeef3;
 padding: 10% 0;
}
#sec-artist .sec-wrap {
 margin: 0 auto;
 max-width: 1280px;
 width: 100%;
}
#sec-artist .sec-tit {
 margin: 0 auto 5%;
 max-width: 297px;
 width: 33.3%;
}
#sec-artist .artist-list {
 margin: 0 auto;
 max-width: 600px;
 width: 100%;
}
#sec-artist .modal {
 position: relative;
}
#sec-artist .naoto {
 margin: 5% auto 0;
 position: relative;
 width: 100%;
 z-index: 1;
}
#sec-artist .pic-artist {
 margin: 5% auto 0;
 position: relative;
 width: 100%;
 z-index: 1;
}
#sec-artist .label {
 background: #000;
 bottom: 3px;
 box-sizing: border-box;
 color: #fff;
 display: block;
 font-size: 16px;
 font-weight: 300;
 height: 32px;
 letter-spacing: 0.125em;
 line-height: 1.0em;
 padding: 7px 10px;
 position: absolute;
 right: 0px;
 width: 105px;
 z-index: 1;
}
#sec-artist .label:after {
 background: #000;
 bottom: 0px;
 box-sizing: border-box;
 color: #fff;
 content: '+';
 display: block;
 font-size: 1.75rem;
 font-weight: 200;
 height: 32px;
 padding: 0 0 0 10px;
 position: absolute;
 left: -32px;
 line-height: 1em;
 width: 32px;
}
#sec-artist .name {
 color: #333;
 font-family: "Zen Old Mincho", serif;
 font-size: 30px;
 font-weight: 900;
 margin: 0 auto;
 text-align: center;
}
#sec-artist .guest-list {
 margin: 5% auto 0;
 width: 100%;
}
#sec-artist .guest-tit {
 color: #333;
 font-family: "Zen Kaku Gothic New", serif;
 font-size: 45px;
 font-weight: 700;
 text-align: center;
}
#sec-artist .guest-inr {
 align-items: flex-start;
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-start;
}
#sec-artist .pic-guest {
 margin: 5% auto 0;
 width: calc(50% - 20px);
 position: relative;
}
#sec-artist .pic-guest-inr {
 position: relative;
}
#sec-artist .label2 {
 bottom: 15px;
 box-sizing: border-box;
 color: #fff;
 display: block;
 font-size: 16px;
 font-weight: 300;
 letter-spacing: 0.125em;
 line-height: 1.0em;
 position: absolute;
 right: 10px;
 width: 126px;
 z-index: 1;
}
#sec-artist .label2:hover {
 opacity: 0.7;
}
#sec-artist .new::after {
 background-image: url("../img/icon_new.png");
 background-position: center;
 background-repeat: no-repeat;
 background-size: 100%;
 top: 0;
 content: "";
 height: 100px;
 position: absolute;
 width: 100px;
}
#sec-artist .venue {
 align-items: center;
 display: flex;
 justify-content: center;
 margin: 5px auto 0;
}
#sec-artist .tokyo {
 align-items: center;
 background-color: #071746;
 border-radius: 3px;
 color: #fff;
 display: flex;
 font-size: 20px;
 height: 30px;
 justify-content: center;
 margin: 0 5px;
 width: 80px;
}
#sec-artist .kobe {
 align-items: center;
 background-color: #790000;
 border-radius: 3px;
 color: #fff;
 display: flex;
 font-size: 20px;
 height: 30px;
 justify-content: center;
 margin: 0 5px;
 width: 80px;
}
#sec-artist .andmore {
 color: #333;
 font-family: "Zen Old Mincho", serif;
 font-size: 30px;
 font-weight: 700;
 margin-top: 5%;
 text-align: center;
}
.modaal-outer-wrapper {
 background-color: rgba(7, 23, 70, 0.7);
}
.modaal-content-container {
 padding: 7.5%;
}
.modaal-inner-wrapper {
 border-radius: 5%;
 padding: 5%;
}
.modaal-container {
 background: none;
 border: 1px solid #fff;
 border-radius: 10px;
}
.modaal-content-container {
 padding: 5%;
 text-align: center;
}
.profile-name {
 color: #fff;
 font-family: "Zen Old Mincho", serif;
 font-size: 2rem;
 font-weight: 900;
 letter-spacing: 0.1em;
}
.profile-tit {
 color: #fff;
 font-family: "Zen Old Mincho", serif;
 font-size: 2rem;
 font-weight: 900;
 letter-spacing: 0.1em;
 text-align: left;
}
.profile-txt {
 border-top: 1px dotted #efefef;
 color: #fff;
 font-size: 20px;
 line-height: 2em;
 margin-top: 5%;
 padding-top: 5%;
 text-align: left;
}
.profile-txt a {
 color: #fff;
 text-decoration: underline;
}
.profile-txt a:hover {
 text-decoration: none;
}
.profile-txt img {
 margin-bottom: calc(5% - 0.5em);
}
.profile-txt2 {
 border-top: 0px dotted #efefef;
 padding-top: 0;
}
@media only screen and (max-width: 768px) {
 #sec-artist {
  padding: 0 0 10%;
 }
 #sec-artist .sec-wrap {
  width: 90%;
 }
 #sec-artist .name {
  font-size: 24px;
 }
 #sec-artist .guest-tit {
  font-size: 30px;
 }
 #sec-artist .pic-guest {
  margin: 5% auto;
 }
 #sec-artist .label {
  background: #000;
  bottom: 3px;
  box-sizing: border-box;
  color: #fff;
  display: block;
  font-size: 18px;
  font-weight: 300;
  height: 32px;
  letter-spacing: 0.125em;
  line-height: 1.0em;
  padding: 7px 10px;
  position: absolute;
  right: 0px;
  width: 105px;
  z-index: 1;
 }
 #sec-artist .label:after {
  background: #000;
  bottom: 0px;
  box-sizing: border-box;
  color: #fff;
  content: '+';
  display: block;
  font-size: 27px;
  font-weight: 200;
  height: 32px;
  padding: 0 0 0 10px;
  position: absolute;
  left: -32px;
  line-height: 1em;
  width: 32px;
 }
 #sec-artist .pic-guest {
  width: 100%;
 }
 #sec-artist .new::after {
  background-image: url("../img/icon_new.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  top: 0;
  content: "";
  height: 66px;
  left: 0;
  position: absolute;
  width: 66px;
 }
 #sec-artist .label2 {
  bottom: 15px;
  box-sizing: border-box;
  color: #fff;
  display: block;
  font-size: 16px;
  font-weight: 300;
  letter-spacing: 0.125em;
  line-height: 1.0em;
  position: absolute;
  right: 10px;
  width: 25%;
  z-index: 1;
 }
 #sec-artist .tokyo {
  font-size: 16px;
  height: 25px;
  width: 75px;
 }
 #sec-artist .kobe {
  font-size: 16px;
  height: 25px;
  width: 75px;
 }
 #sec-artist .andmore {
  font-size: 24px;
  margin-top: 10%;
 }
 .profile-name {
  font-size: 22px
 }
 .profile-txt {
  font-size: 16px;
 }
}
/* ----------------------------------------------------------------
    sec-about
  ----------------------------------------------------------------- */
.sec-about {
 display: flex;
 justify-content: center;
 width: 100%;
}
.sec-about .sec-col {
 display: flex;
 flex-direction: column;
 padding: 5% 0;
 width: 50%;
}
.sec-about .col-inr {
 background-color: #fff;
 flex-grow: 1;
 margin: 0 auto;
 width: 80%;
}
.sec-about .col-tit {
 align-items: center;
 display: flex;
 justify-content: center;
 margin: 0 auto;
 padding-bottom: 5%;
 width: 100%;
}
.sec-about .area-about .sec-tit {
 margin: 0 auto 5%;
 width: 25%;
}
.sec-about .col-tokyo .col-tit {
 background-color: #071746;
}
.sec-about .col-kobe .col-tit {
 background: #790000;
}
.sec-about .col-tit img {
 margin: 0 auto;
 width: 66%;
}
.sec-about .col-tokyo {
 background-color: #071746;
 width: 50%;
}
.sec-about .col-kobe {
 background: #790000;
 width: 50%;
}
.sec-about .panel_area {
 background-color: #fff;
 padding: 5%;
 height: auto;
 width: 100%;
}
.sec-about .area-about {
 padding: 5% 0;
}
.sec-about .area-about .item {
 align-items: stretch;
 border-top: 1px solid #666;
 display: flex;
 justify-content: space-between;
 padding: 16px 0;
 width: 100%;
}
.sec-about .area-about .item:last-child {
 border-bottom: 1px solid #666;
}
.sec-about .area-about dt {
 border-right: 1px dotted #000;
 font-size: 18px;
 font-weight: 700;
 line-height: 1.5;
 padding-right: calc(15px + 0.25vw);
 text-align: center;
 width: 100px;
}
.sec-about .area-about dd {
 font-family: YakuHanJP, "游ゴシック体", sans-serif;
 font-size: 18px;
 line-height: 1.5;
 width: calc(100% - 120px);
}
@media only screen and (max-width: 1366px) {
 .sec-about .col-inr {
  width: 90%;
 }
}
@media only screen and (max-width: 768px) {
 .sec-about {
  display: block;
 }
 .sec-about .sec-col {
  padding: 10% 0 5%;
  width: 100%;
 }
 .sec-about .col-inr {
  margin: 0 auto;
  width: 90%;
 }
 .sec-about .area-about .sec-tit {
  width: 33%;
 }
 .sec-about .sec-wrap {
  width: 100%;
 }
 .sec-about .area-about dt {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  padding-right: calc(15px + 0.25vw);
  text-align: center;
  width: 75px;
 }
 .sec-about .area-about dd {
  font-family: YakuHanJP, "游ゴシック体", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  width: calc(100% - 95px);
 }
}
/* ----------------------------------------------------------------
    area-ticket
  ----------------------------------------------------------------- */
.sec-about .area-ticket {
 margin-top: 5%;
}
.sec-about .area-ticket .sec-tit {
 margin: 0 auto;
 width: 25%;
}
.sec-about .area-ticket .ticket_container {
 border-top: 1px solid #666;
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 margin: 5% auto 0;
 width: 100%;
}
.sec-about .area-ticket .ticket_cat {
 align-items: center;
 border-bottom: 1px solid #666;
 display: flex;
 flex-basis: 100%;
 justify-content: space-between;
 padding-bottom: calc(10px + 0.25vw);
 padding-top: calc(10px + 0.25vw);
}
.sec-about .area-ticket .ticket_seat {
 border-right: 1px dotted #000;
 flex-basis: 75%;
 font-family: YakuHanJP, "游ゴシック体", sans-serif;
 font-size: 24px;
 font-weight: 400;
 line-height: 150%;
 padding-right: calc(15px + 0.25vw);
 text-align: center;
}
.sec-about .area-ticket .u-25 {
 line-height: 90%;
}
.sec-about .area-ticket .ticket_seat .notice-u25 {
 font-size: 14px;
 font-weight: 400;
 line-height: 1;
}
.sec-about .area-ticket .ticket_price {
 flex-basis: 25%;
 font-family: YakuHanJP, "Zen Kaku Gothic New", serif;
 font-family: "Zen Old Mincho", serif;
 font-weight: 900;
 font-size: 27px;
 line-height: 170%;
 text-align: right;
}
.sec-about .area-ticket .ticket-info {
 margin-top: 5%;
}
.sec-about .area-ticket .notice {
 margin-top: 5%;
 width: 100%;
}
.sec-about .area-ticket .notice ul {
 list-style: none;
 padding: 0;
 margin: 0;
}
.sec-about .area-ticket .notice li {
 color: #666;
 font-size: 14px;
 margin: 10px 0;
 padding-left: 1em;
 text-indent: -.9em;
}
.sec-about .area-ticket .notice li.strong {
 color: #333;
 font-size: 18px;
 font-weight: bold;
}
.sec-about .area-ticket .notice li:before {
 color: #333;
 content: "● ";
 font-size: 14px;
}
.sec-about .area-ticket .ticket-sale {
 border: 1px solid #666;
 margin-top: 5%;
 padding: 5% 5% 10%;
}
.sec-about .area-ticket .saisoku {
 color: #000;
 font-size: 30px;
 font-family: YakuHanJP, "Zen Kaku Gothic New", serif;
 font-weight: 700;
 text-align: center;
}
.sec-about .area-ticket .saisoku-date {
 font-family: YakuHanJP, "游ゴシック体", sans-serif;
 font-size: 20px;
 margin-top: 10px;
 text-align: center;
}
.sec-about .area-ticket .saisoku-link {
 margin-top: 20px;
 text-decoration: underline;
 text-align: center;
}
.sec-about .area-ticket .saisoku-link a:hover {
 text-decoration: none;
}
.sec-about .area-ticket .caption-head {
 font-family: "Zen Kaku Gothic New", serif;
 font-size: 20px;
 font-weight: 700;
 margin-top: 5%;
 text-align: center;
}
.sec-about .area-ticket .code {
 font-family: "Zen Kaku Gothic New", serif;
 font-size: 20px;
 font-weight: 700;
 margin-top: 0;
 text-align: center;
}
.sec-about .area-ticket .caption-txt {
 font-size: 14px;
 line-height: 1.7;
 margin-top: 10px;
 text-align: center;
}
.sec-about .area-ticket .caption-link {
 font-family: "Zen Kaku Gothic New", serif;
 font-size: 18px;
 font-weight: 500;
 margin: 20px auto 30px;
 text-align: center;
}
.sec-about .area-ticket .caption-link a {
 text-decoration: underline;
}
.sec-about .area-ticket .caption-link a:hover {
 text-decoration: none;
}
.sec-about .area-ticket .indent {
 font-size: 12px;
 line-height: 1.5;
 text-align: center;
}
.btn-pia {
 background: #2778be; /*背景色*/ border: 2px solid #2778be; /* ボーダーの色と太さ */
 margin-top: 15px
}
.btn-pia:hover span {
 color: #2778be;
}
.btn-lawson {
 background: #0073bd; /*背景色*/ border: 2px solid #0073bd; /* ボーダーの色と太さ */
}
.btn-lawson:hover span {
 color: #0073bd;
}
.btn-cn {
 background: #F1141D; /*背景色*/ border: 2px solid #F1141D; /* ボーダーの色と太さ */
}
.btn-cn:hover span {
 color: #F1141D;
}
.btn-kobe {
 background: #A65720; /*背景色*/ border: 2px solid #A65720; /* ボーダーの色と太さ */
}
.btn-kobe:hover span {
 color: #A65720;
}
.sec-about .area-ticket .soldout {
 color: #ccc;
 font-size: 27px;
 position: relative;
 text-decoration: line-through;
 text-decoration-color: #333;
 text-decoration-thickness: 1px;
}
.sec-about .area-ticket .soldout::before {
 background-image: url("../img/icon_soldout.svg");
 background-repeat: no-repeat;
 background-size: cover;
 content: "";
 height: 16px;
 left: 50%;
 margin-left: -53px;
 margin-top: -5px;
 position: absolute;
 text-align: center;
 width: 106px;
}
@media only screen and (max-width: 768px) {
 .sec-about .area-ticket .sec-tit {
  width: 33%;
 }
 .sec-about .area-ticket .ticket_seat {
  flex-basis: 70%;
  font-size: 18px;
  font-weight: 400;
 }
 .sec-about .area-ticket .ticket_seat .notice-u25 {
  font-family: YakuHanJP, "游ゴシック体", sans-serif;
  font-size: 12px;
  line-height: 45%;
 }
 .sec-about .area-ticket .ticket_price {
  flex-basis: 33%;
  font-size: 21px;
 }
 .sec-about .area-ticket .ticket-info {
  margin-top: 10%;
 }
 .sec-about .area-ticket .notice li {
  font-size: 12px;
  margin: 5px 0;
 }
 .sec-about .area-ticket .ticket-sale {
  background-color: #fff;
  margin-top: 10%;
  padding: 10% 5%;
 }
 .sec-about .area-ticket .saisoku {
  font-size: 24px;
  font-weight: 700;
  text-align: center;
 }
 .sec-about .area-ticket .saisoku-date {
  font-size: 16px;
 }
 .sec-about .area-ticket .saisoku-link {
  margin-top: 20px;
  text-decoration: underline;
  text-align: center;
 }
 .sec-about .area-ticket .saisoku-link a:hover {
  text-decoration: none;
 }
 .sec-about .area-ticket .caption-head {
  font-family: "Zen Kaku Gothic New", serif;
  font-size: 18px;
  font-weight: 700;
  margin-top: 5%;
  text-align: center;
 }
 .sec-about .area-ticket .caption-txt {
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
 }
 .sec-about .area-ticket .caption-link a {
  font-size: 14px;
 }
 .sec-about .area-ticket .caption-link a {
  text-decoration: underline;
 }
 .sec-about .area-ticket .caption-link a:hover {
  text-decoration: none;
 }
 .sec-about .area-ticket .indent {
  font-size: 12px;
  line-height: 1.5;
  margin-top: 10px;
  text-align: justify;
 }
 .sec-about .area-ticket .soldout {
  font-size: 21px;
 }
 .sec-about .area-ticket .soldout::before {
  height: 11px;
  left: 50%;
  margin-left: -36px;
  margin-top: -5px;
  width: 72px;
 }
}
/* ----------------------------------------------------------------
    sec-news
  ----------------------------------------------------------------- */
#sec-news {
 background-color: rgb(244, 245, 246);
 background-color: #ebeef3;
 padding: 10% 0 0;
 width: 100%;
}
#sec-news .sec-wrap {
 margin: 0 auto;
 max-width: 960px;
}
#sec-news .sec-tit {
 margin: 0 auto 5%;
 max-width: 297px;
 width: 33.3%;
}
#sec-news .news-area {
 margin: 0 auto;
 width: 90%;
}
#sec-news .news-item {
 border-bottom: 1px solid #ccc;
 padding: 25px 0;
}
#sec-news .news-item:first-child {
 border-top: 1px solid #ccc;
}
#sec-news .news-item a:hover {
 text-decoration: underline;
}
#sec-news .date {
 font-weight: bold;
 margin-right: 20px;
}
#sec-news .tw-area {
 margin-top: 10%;
}
/* ----------------------------------------------------------------
    sec-goods
  ----------------------------------------------------------------- */
#sec-goods {
 background-color: rgb(244, 245, 246);
 background-color: #ebeef3;
 padding: 10% 0 0;
}
#sec-goods .sec-tit {
 margin: 0 auto 5%;
 max-width: 297px;
 width: 33.3%;
}
#sec-goods .sec-wrap {
 margin: 0 auto;
 max-width: 960px;
}
#sec-goods .btn-goods {
 aspect-ratio: 1 / 0.3125;
 border: 1px solid #071746;
 margin: 0 auto;
 max-width: 640px;
 width: 90%;
}
#sec-goods .btn-goods a {
 align-items: center;
 display: flex;
 justify-content: center;
 height: 100%;
 width: 100%;
}
#sec-goods .btn-goods a:hover {
 background-color: #fff;
}
#sec-goods .btn-goods img {
 max-width: 426px;
 margin: 0 auto;
 width: 75%;
}
/* ----------------------------------------------------------------
    sec-access
  ----------------------------------------------------------------- */
#sec-access {
 background-color: rgb(244, 245, 246);
 background-color: #ebeef3;
 padding: 10% 0;
}
#sec-access .sec-tit {
 margin: 0 auto;
 max-width: 297px;
 width: 33.3%;
}
#sec-access .sec-wrap {
 align-items: center;
 display: flex;
 justify-content: space-between;
 margin: 5% auto 0;
 max-width: 1280px;
}
#sec-access .data-area {
 text-align: left;
 width: 50%;
}
#sec-access .adress {
 color: #333;
 font-size: 24px;
 font-weight: bold;
 letter-spacing: 0.05em;
 line-height: 1.5;
 margin-bottom: 0px;
}
#sec-access .adress-sub {
 color: #333;
 font-size: 18px;
 font-weight: bold;
 letter-spacing: 0.05em;
 line-height: 1.5;
 margin-bottom: 10px;
}
#sec-access .traffic-link {
 font-weight: bold;
 margin-bottom: 20px;
}
#sec-access .traffic-link a {
 color: #0b39a3;
 text-decoration: underline;
}
#sec-access .traffic-link a:hover {
 text-decoration: none;
}
#sec-access .traffic {
 color: #333;
 display: flex;
 font-family: YakuHanJP, "游ゴシック体", sans-serif;
 font-size: 16px;
 line-height: 1.5;
 margin-top: 5px;
}
#sec-access .traffic::before {
 content: '・';
 display: block;
 margin-right: .2em;
}
#sec-access .map-area {
 position: relative;
 width: 50%;
}
#sec-access .map-area .movie-wrap {
 position: relative;
 z-index: 1;
}
@media only screen and (max-width: 768px) {
 #sec-access .sec-wrap {
  display: block;
  margin: 5% auto 0;
  width: 90%;
 }
 #sec-access .data-area {
  width: 100%;
 }
 #sec-access .adress {
  font-size: 20px;
  letter-spacing: 0em;
  margin-bottom: 10px;
  text-align: center;
 }
 #sec-access .adress-sub {
  font-size: 16px;
  letter-spacing: 0em;
  margin-bottom: 20px;
  text-align: center;
 }
 #sec-access .traffic {
  font-size: 14px;
 }
 #sec-access .traffic::before {
  content: '・';
  display: block;
  margin-right: .2em;
 }
 #sec-access .map-area {
  margin-top: 5%;
  width: 100%;
 }
}
/* ----------------------------------------------------------------
    footer
  ----------------------------------------------------------------- */
#footer {
 background-color: #000;
 color: #fff;
 padding: 5% 0 0;
 width: 100%;
}
#footer .link-area {
 margin: 0 auto;
 max-width: 538px;
 width: 80%;
}
#footer .sec-tit {
 margin: 0 auto 5%;
 max-width: 198px;
 width: 33%;
}
#footer .link-area .btn-link {
 align-items: center;
 display: flex;
 justify-content: space-between;
 width: 100%;
}
#footer .link-area .bnr-pc {
 border: 1px solid #fff;
 padding: 10px 20px 5px;
 width: 218px;
}
#footer .link-area .link-item {
 align-items: center;
 border: 1px solid #fff;
 border-radius: 50%;
 display: flex;
 font-size: 30px;
 justify-content: center;
 height: 60px;
 width: 60px
}
#footer .link-area .link-item a {
 color: #fff;
}
#footer .inr-credit {
 margin: 2.5% auto 5%;
 width: 90%;
}
#footer .inr-credit p {
 color: #fff;
 font-family: "Zen Old Mincho", serif;
 font-size: 16px;
 line-height: 2;
 text-align: center;
}
#footer .inr-credit .sponcer {
 align-items: center;
 display: flex;
 justify-content: center;
 line-height: 1;
 margin: 0 auto 2.5%;
}
#footer .inr-credit .sponcer img {
 margin-left: 10px;
 width: 200px;
}
#footer .copyright {
 background-color: #fff;
 color: #333;
 font-size: 12px;
 line-height: 1.0;
 padding: 10px 0;
 text-align: center;
}
@media only screen and (max-width: 768px) {
 #footer {
  background-color: #000;
  color: #fff;
  padding: 10% 0 0;
  width: 100%;
 }
 #footer .link-area {
  width: 90%;
 }
 #footer .link-area .bnr-pc {
  border: 1px solid #fff;
  padding: 5px 10px 0px;
  width: calc(100% - 200px);
 }
 #footer .link-area .link-item {
  font-size: 18px;
  height: 40px;
  width: 40px
 }
 #footer .inr-credit {
  margin: 40px auto 0;
  width: 90%;
 }
 #footer .inr-credit p {
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  margin-top: 20px;
  text-align: center;
 }
 #footer .copyright {
  margin-top: 40px;
 }
}