@charset "utf-8";
/* CSS Document */
/* keyframes */
@keyframes changeMainImage {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 1;
    transform: translateY(-20px);
  }
  20% {
    opacity: 1;
    transform: translateY(-20px);
  }
  30% {
    opacity: 0;
    transform: translateY(20px);
  }
}
@keyframes topTodown {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.effect-fade {
}

.effect-fade.effect-scroll {
  animation-duration: 2s;
  animation-name: topTodown;

}
@media screen and (min-width: 768px) {
/******************************************************************************
 PC Common
******************************************************************************/
/* headline ****************************************************/

h2.tit {
 font-size: 2.3rem;
 margin-bottom: 45px;
 text-align: center;
 color: #0f0fcf;
 margin-top: 50px;
 font-family: 'Anton', 'Play', sans-serif;
}
h2.tit img{
 width: auto !important;
 height: auto !important;
}
h3.mi {
 color: #0f0fcf;
 font-size: 200%;
 line-height: 1em;
 font-family: 'Play', sans-serif;
 margin-bottom: 30px;
}


h3.gold,h2.gold{
  font-size: 3.2rem;
  text-align: center;
  text-shadow: 0 0 6px #1ec5cc, 0 0 12px #fff, 0 0 18px #1ec5cc;
  font-family: 'Play', sans-serif;
  font-weight: bold;
  padding: 35px 0;
}

h2.gold{
  padding: 60px 0;
}
p.update{
    text-align: center;
    background: #0f0fcf;
    margin: 5px 0 10px;
    color: #fff;
    padding: 10px;
    font-size: 1rem;
    font-weight: bold;
}
/********************************************************************************************************
 TOP
********************************************************************************************************/
/* mainView ****************************************************/



.mainV {
  margin: auto;
  background-color: black;
  position: relative;
}

.mainV img {
  width: 100%;
  animation-name: mainV;
  -webkit-animation-name: mainV;
  animation-duration: 10s;
  -webkit-animation-duration: 10s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  opacity: 0;
}

.mainV .img1 {
  display: block;
  margin: 0 auto;
}

.mainV .img2 {
  animation-delay:5s;
  -webkit-animation-delay:5s;
  position: absolute;
  top: 0;
  left: 0;
}

@keyframes mainV {
  0% {
    opacity: 0;
  }
  
  12.5% {
    opacity: 1;
  }

  37.5% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}

@-webkit-keyframes mainV {
  0% {
    opacity: 0;
  }
  
  12.5% {
    opacity: 1;
  }

  37.5% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}


/* mainViewここまで ****************************************************/

.main {
 /*width: 760px;*/
 width: 100%;
 margin:0 auto;

}
#home .btnWrap {
 display: -webkit-flex;
 display: flex;
 flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 align-items:center; 
 -webkit-box-align:center;
 -webkit-align-items:center;
 justify-content:space-between;
 -webkit-box-pack:justify;
 -webkit-justify-content:space-between;
 margin-bottom: 40px;
}
#home .btnWrap li {
 width: 370px;
 margin-bottom: 20px;
}
#home .btnWrap li a{
 display: block;
 position: relative;
 height: 80px;
 box-sizing: border-box;
 border: 2px solid #0f0fcf;
 background: url(../images/top/top_btn.jpg) no-repeat center center;
 background-size: 100% 100%;
 line-height:1.5em;
 font-weight:900;
 font-size: 185.7%;
 font-family: 'Play', 'Noto Sans Japanese', sans-serif;
}
#home .btnWrap li a span {
 width: 100%;
 position: absolute;
 text-align: center;
 top:50%;
 transform: translateY(-50%);
}
#home .btnWrap li:nth-child(1) a{
 background: 
  url(../images/top/tee.png) no-repeat left bottom,
  url(../images/top/top_btn_01.jpg) no-repeat center center;
 background-size: auto 100%,100% 100%;
}
#home .btnWrap li:nth-child(2) a{
 background: url(../images/top/top_btn_02.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(3) a{
 background: url(../images/top/top_btn_03.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(4) a{
 background: url(../images/top/top_btn_04.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(5) a{
 background: url(../images/top/top_btn_05.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(6) a{
 background: url(../images/top/top_btn_06.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(7) a{
 background: url(../images/top/top_btn_07.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li.vote {
 width: 100%;
 font-size: 76%;
}
#home .btnWrap li.vote a {
 height: 120px;
}
#home .btnWrap li.vote a p{
 height: 120px;
}
#home .btnWrap li.vote a p span{
 display: block;
 width: auto;
 text-align: left;
 top:15px;
 left: 150px;
 transform: translateY(0);
 line-height: 1.2em;
}
#home .btnWrap li.vote a p span em{
 font-size: 180%;
}
.side {
 width: 380px;
}
.side .movie {
 width: 100%;
 margin-bottom: 50px;
}
.side .movie > a {
 display: block;
 width: 100%;
 position: relative;
 padding-top: 56.25%;
 overflow: hidden;
}
.side .movie > a > img{
 width: 100%;
 position: absolute;
 top:-17%;
 left: 0;
}
.moreMovie {
 font-size: 114.2857%;
 text-align: right;
}
.moreMovie img{ width: 133px;}
.main h3.mi,
.twitterWrap h3.mi{
    width: 100px;
    margin: 50px auto;
}
/* postList ****************************************************/
.postList {
 display: -webkit-flex;
 display: flex;
 flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 align-items:stretch;
 -webkit-box-align:stretch;
 -webkit-align-items:stretch;
 margin-bottom: 20px;
}
.postList li {
 width: 32%;
 border-bottom: 2px solid #0f0fcf;
 padding-bottom: 23px;
 margin-bottom: 20px;
 position: relative;
 margin-right: 10px;
}
#goods .postList li {
 width: 24%;

}
#goods .sizeSelect{
    width: 100%;
    color: #000;
    font-weight: bold;
    font-size: 1.4rem;
}
#goods .goodsTitle {
	height: 80px;
	font-size: 1rem;
    font-weight: bold;
}

#goods .goodsBtn{
	  background: #fff;
    box-shadow: 0 0 6px #0f0fcf, 0 0 12px #fff, 0 0 18px #0f0fcf;
    border-radius: 5px;
    width: 100%;
    margin: 10px auto 10px;
    text-align: center;
    color: #ccc;
    font-weight: bold;
}

#goods .goodsBtn .nolink{
    color: #333;
}

.goodsBtn a,.goodsBtn a:visited,.goodsBtn a:hover {
    color: #000;
	display: block;
    width: 100%;
    padding: 10px 0;
}

#goods .tensocom{
	    width: 40%;
	    background: #e71a21;
}
#goods .nosize{
     margin: 3rem auto 10px;
 }
.home .postList li:nth-child(3n){margin-right: 0;}
.postList li .ph {
 margin-bottom: 5px;
}
.postList li .text {
 padding: 0 10px;
}
.postList li .date {
 color: #fff;
    text-shadow: 0 0 6px #0f0fcf, 0 0 12px #fff, 0 0 18px #0f0fcf;
 margin-bottom: 7px;
 font-weight: 500;
}
.postList li .title {
 line-height: 1.71em;
}
.postList li a:hover .title {
 text-decoration: underline;
 color: #0f0fcf;
 -webkit-transition:.3s ease-in-out;
 transition:.3s ease-in-out;
}
.postList li:after {
 content:"";
 display: block;
 width: 0px;
 height: 2px;
 background: #fff;
 box-shadow: 0 0 6px #0f0fcf, 0 0 12px #fff, 0 0 18px #0f0fcf;
 position: absolute;
 bottom:0px;
 left: 0;
 -webkit-transition:.3s ease-in-out;
 transition:.3s ease-in-out;
}
.postList li:hover:after {
 width: 100%;
}

.ticketbtn{
    position: absolute;
    top: 670px;
    left: 20px;
    right: 0;
}


.enTicketbtn{
display: flex;

}

.enTicketbtn .linkBtn{

    width: 50%;
    margin: 20px;
}

.ticketbtn img{
    display: block;
    margin: 0 auto;
}
.orangeBtn{
    display: block;
    width: 80%;
    margin: 40px auto 10px;
    border-radius: 8px;
    color: #000;
    padding: 0 20px 0 0;
    font-size: 1.2rem;
    line-height: 48px;
    height: 48px;
    background: url(../images/common/next_on.png) no-repeat center right 8px;
    background-color: #1ec5cc;
}
.catchleft{
    position: absolute;
    top: 100px;
    left: 0;
    right: 600px;
}

.catchright{
    position: absolute;
    top: 350px;
    left: 600px;
    right: 0;
}

.catchen{
    position: absolute;
    top: 130px;
    left: 15px;
    right: 0;
}

.btn-radius {
    display: inline;
    padding: 3px 14px;
    border: #fff solid 2px;
    border-radius: 25px;
    background-color: #000;
    text-decoration: none;
    transition: .4s;
    position: absolute;
    right: -100px;
    font-weight: bold;
    top: 28px;
    font-size: 0.7rem;
    z-index: 5;
}

.btn-radius:hover {
    border: #0f0fcf solid 2px;
}
/*news*/
div.news,div.notesWrap,div.scorearea {
    width: 800px;
    margin: 0 auto;
}
div.card{
  width: 1200px;
    margin: 0 auto;
}
div.aboutwrapper{
    width: 1200px;
    padding: 5px;
    margin: 50px auto;
    text-align: center;
    font-size: 2.5rem;
    font-weight: bold;
    line-height: 2.5rem;
}

/*about*/
div.about{
	background-image: url(../images/top/bg_about.jpg);
	background-size: cover;
	background-repeat: no-repeat;
    padding: 10px 0;
  margin: 0 0 30px 0;
}

.abouttxt01{
  font-size: 1.7rem;
}
.abouttxt02{
  font-size: 1.5rem;
}
.abouttxt03{
  font-size: 1rem;
}

.aboutlink{
    width: 400px;
    margin: 0 auto;
    font-size: 0.7rem;
    display: block;
}

/*ticket*/
div.ticket{
  background-size: cover;
  background-repeat: no-repeat;
  padding: 0;
}

div.ticketwrapper{
    width: 1200px;
    padding: 5px;
    margin: 0 auto 50px;
    text-align: center;
    font-size: 0.9rem;
    font-weight: bold;
    line-height: 1rem;
    background: url(../images/top/bg_ticket.jpg) center center no-repeat;
    min-height: 380px;
}

.ticketList,.accessList{
      width: 800px;
      margin: 0 auto;
}

ul.ticketprice,ul.ticketsale{
    width: 800px;
    margin: 0 auto;
    font-size: 1.1rem;
    line-height: 1.4rem;
}

ul.ticketprice li{
  display: flex;
    border-bottom: #fff solid 1px;
    padding: 15px 8px;
}

ul.ticketprice span,ul.ticketsale span{
  display: block;
}

.ticketatt{
  text-align: left;
    color: #a0a0a0;;
    font-size: 0.8rem;
  margin: 5px 0 0 0;
}
.ticketatt a{
  color:#dfc878;
}

.tickettype{
  width:40%;
  text-align: left;
}

.price{
  width: 20%;
  text-align: center;
}


.sales{
  width: 10%;

    font-weight: bold;
}

.endticketsaletitle{
    padding: 5px 0;
    margin: 30px 0 20px 0;
    text-decoration: line-through;
    color: #333;
    text-shadow: 0 0 6px #444, 0 0 12px #ddd, 0 0 18px #444;
    background: linear-gradient(to right, rgba(0,0,0,.5) 0%,#888 45%,#888 50%,#888 55%,rgba(0,0,0,.5) 100%);

}
.ticketsaletitle,.accesstitle,.cardday{
    padding: 5px 0;
    margin: 30px 0 20px 0;
    color: #000;
    text-shadow: 0 0 6px #cee4e5, 0 0 12px #fff, 0 0 18px #cee4e5;
    background: linear-gradient(to right, rgba(0,0,0,.5) 0%,#92acad 45%,#92acad 50%,#92acad 55%,rgba(0,0,0,.5) 100%);
            font-weight: bold;
}

.ticketlink{
    margin: 10px auto;
    width: 40%;
    font-size: 0.7rem;
}
.endticketlink{
    margin: 0 auto;
    width: 40%;
    color: #777;
}

.ticketperiod,.accesstxt{
    padding: 0 0 15px 0;
}

.ticketgift{
    font-size: 0.8rem;
    padding: 20px 0 0;
}

.endticketperiod{
    color: #aaa;
    padding: 0 0 15px 0;
    text-decoration: line-through;
}
ul.ticketprice span.ticketTxtSmall{
    line-height: 1rem;
    font-size: 0.8rem;
     display: inline;
}

/*twitter*/
.tw{
  width: 500px;margin: 0 auto;
      margin: 40px auto 50px;
}
div.notescontents{
    width: 700px;
    margin: 0 auto;
    font-size: 0.8rem;
    line-height: 1.1rem;
    border: #b44723 solid 1px;
    padding: 10px 50px 50px 50px;
}

.notestitle{
  text-align: center;
  color:#fff;
  text-shadow: 0 0 6px #b44723, 0 0 12px #fff, 0 0 18px #b44723;
  padding: 25px 0;
  font-size: 1.2rem;
  font-weight: bold;
}
.noteslist li{
  position: relative;
  padding-bottom: 6px;
}
.noteslist li:before {
  content:"■";
  position: absolute;
  left: -14px;
}
.seatlist {
  margin: 5px 0 20px 0;
}
.seatlist li{
  width: 400px;
  display: flex;
  margin: 0 auto;
border-bottom: #fff solid 1px;
    margin-bottom: 7px;
    padding-bottom: 5px;

}

.seatlist span{
 display: block;
 width: 50%; 
 font-size: 1rem;
 padding: 5px;
}

.seattype{
  text-align: right;
  font-weight: bold;
}

.studendlist li{
  position: relative;
  padding-bottom: 6px;
}

.studendlist li:before {
  content:"※";
  position: absolute;
  left: -14px;
}

/*access*/
.accessWrap{
  margin: 60px 0;
}
.accessList{
  text-align: center;
}
/*card*/


.cardlist{
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
-webkit-flex-wrap: wrap;
gap: 30px 20px;
}

.cardlist li{

} 

/********************************************************************************************************
 clm
********************************************************************************************************/
#news .postList li,
#column .postList li,
#goods .postList li,
#movie .postList li{
 width: 280px;
}
#news .postList li:nth-child(4n),
#goods .postList li:nth-child(4n),
#column .postList li:nth-child(4n),
#movie .postList li:nth-child(4n){margin-right: 0;}
 
/********************************************************************************************************
 movie
********************************************************************************************************/
#movie .postList li .ph {
 height: 148px;
 overflow: hidden;
 background-position: center;
 background-size: cover;
 width: 100%;
 margin-bottom: 10px;
}
}

.movieWrap {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
 
.movieWrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.moviearea{
	max-width:800px;
	margin: 30px auto;
}




















/********************************************************************************************************
 SP
********************************************************************************************************/
@media screen and (max-width: 767px) {
/******************************************************************************
 SP Common
******************************************************************************/
/* headline ****************************************************/
h2.tit {
 font-size: 260%;
 margin: 10px auto 20px;
 text-align: center;
 color: #0f0fcf;
 padding-top: 120px;
 font-family: 'Anton', 'Noto Sans Japanese', sans-serif;
}
h2.tit img{
 width: 45% !important;
 height: auto !important;
}
h3.mi {
 color: #f0b93c;
 font-size: 144%;
 margin-bottom: 10px;
}

/********************************************************************************************************
 TOP
********************************************************************************************************/

/* mainView ****************************************************/



.mainV {
  margin: auto;
  background-color: black;
  position: relative;
}

.mainV img {
  width: 100%;
  animation-name: mainV;
  -webkit-animation-name: mainV;
  animation-duration: 10s;
  -webkit-animation-duration: 10s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  opacity: 0;
}

.mainV .img1 {
  display: block;
  margin: 0 auto;
}

.mainV .img2 {
  animation-delay:5s;
  -webkit-animation-delay:5s;
  position: absolute;
  top: 0;
  left: 0;
}

@keyframes mainV {
  0% {
    opacity: 0;
  }
  
  12.5% {
    opacity: 1;
  }

  37.5% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}

@-webkit-keyframes mainV {
  0% {
    opacity: 0;
  }
  
  12.5% {
    opacity: 1;
  }

  37.5% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}


/* mainViewここまで ****************************************************/


 
.homeInner {}
.main {
 margin-bottom: 30px;
     width: 100%;
 }
#home .btnWrap {
 display: -webkit-flex;
 display: flex;
 flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 align-items:center; 
 -webkit-box-align:center;
 -webkit-align-items:center;
 justify-content:space-between;
 -webkit-box-pack:justify;
 -webkit-justify-content:space-between;
 margin-bottom: 25px;
}
#home .btnWrap li {
 width: 49%;
 margin-bottom: 10px;
}
#home .btnWrap li:nth-child(1) a{
 background: 
  url(../images/top/tee.png) no-repeat left bottom,
  url(../images/top/top_btn_01.jpg) no-repeat center center;
 background-size: auto 100%,100% 100%;
}
#home .btnWrap li:nth-child(2) a{
 background: url(../images/top/top_btn_02.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(3) a{
 background: url(../images/top/top_btn_03.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(4) a{
 background: url(../images/top/top_btn_04.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(5) a{
 background: url(../images/top/top_btn_05.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(6) a{
 background: url(../images/top/top_btn_06.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li:nth-child(7) a{
 background: url(../images/top/top_btn_07.jpg) no-repeat center center;
 background-size: 100% 100%;
}
#home .btnWrap li a{
 display: block;
 position: relative;
 height: 40px;
 box-sizing: border-box;
 border: 1px solid #55aada;
 background: url(../images/top/top_btn.jpg) no-repeat center center;
 background-size: 100% 100%;
 line-height:1.5em;
 font-weight:900;
 font-size: 92%;
 font-family: 'Play', 'Noto Sans Japanese', sans-serif;
}
#home .btnWrap li a span {
 width: 100%;
 position: absolute;
 text-align: center;
 top:50%;
 transform: translateY(-50%);
}
#home .btnWrap li.vote {
 width: 100%;
 font-size: 76%;
}
#home .btnWrap li.vote a {
 height: 80px;
}
#home .btnWrap li.vote a p{
 height: 80px;
}
#home .btnWrap li.vote a p span{
 display: block;
 width: auto;
 text-align: left;
 top:10%;
 left:100px;
 transform: translateY(0);
 line-height: 1.2em;
}
#home .btnWrap li.vote a p span em{
 font-size: 190%;
}
.side {}
.side .movie {
 margin-bottom: 20px;
 }
.side .movie > a {
 display: block;
 width: 100%;
 position: relative;
 padding-top: 56.25%;
 overflow: hidden;
}
.side .movie > a > img{
 width: 100%;
 position: absolute;
 top:-17%;
 left: 0;
}
/*.side .movie .iframeWrap{
 position: relative;
 width: 100%;
 padding: 56.25% 0 0 0;
 margin-bottom: 10px;
}
.side .movie .iframeWrap iframe {
 position: absolute;
 width: 100%;
 height: 100%;
 top:0;
 left: 0;
 }*/
.moreMovie {
 text-align: right;
}
.moreMovie img{ width: 32% !important;}
.main h3.mi,
.twitterWrap h3.mi{ 
 width: 23%;
 margin-bottom: 20px;
 line-height: 1em;
}
.tw iframe { width: 740px !important; }
.side .ema {
 margin-bottom: 20px;
 }
 
 
.orangeBtn{
    display: block;
    width: 80%;
    margin: 40px auto 10px;
    border-radius: 8px;
    color: #000;
    padding: 0 20px 0 0;
    font-size: 1.2rem;
    line-height: 48px;
    height: 48px;
    background: url(../images/common/next_on.png) no-repeat center right 8px;
    background-color: #1ec5cc;
}

/* movie

.movieWrap {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
 
.movieWrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.moviearea{
	max-width:800px;
	margin: 30px auto;
}

/* postList ****************************************************/
.postList {
 margin-bottom: 30px;
}

#goods .postList {
 padding-top: 30px;
}
.postList li {
    margin: 0 5px 13px;
 }

.postList li a{
 display: -webkit-flex;
 display: flex;
 flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 justify-content:space-between;
 -webkit-box-pack:justify;
 -webkit-justify-content:space-between;
 align-items:stretch;
 -webkit-box-align:stretch;
 -webkit-align-items:stretch;
}
.postList li .ph {
 width: 37%;
}
.postList li .text {
 width: 60%;
}
.postList li .date {
 color: #1ec5cc;
 margin-bottom: 7px;
 font-weight: 500;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,0f0fcf+100 */
    text-shadow: 0 0 6px #0f0fcf, 0 0 12px #fff, 0 0 18px #0f0fcf;
}
.postList li .title {
 line-height: 1.4em;
}
#wrapper .ticketbtn{
  margin: 10px 0;
}
#wrapper .ticketbtn img{
  width: 90%;
}
/*goods*/
#goods .update{
    text-align: center;
    color: coral;
    padding: 20px 0;
    font-size: 1rem;
    font-weight: bold;
}

#goods .postList li {
	margin: 0 5px 40px 5px;
	padding:20px 0 0 0;
	border: #0f0fcf solid;
    border-width: 4px 0 0 0;
}
#goods .postList li .ph,#goods .postList li .text {
 width: 90%;
 margin: 0 auto;
}

#goods .postList li .text p{
	padding: 7px 0;
    font-size: 1rem;
}

#goods .postList li .text p.goodsTitle{
    color: #fff;
    font-weight: bold;
    line-height: 1.4rem;
}

#goods .postList li .text p.goodsPrice{
    font-size: 1.2rem;
	text-align: right;
}

#goods .sizeSelect{
    width: 100%;
    height: 50px;
    color: #000;
    font-weight: bold;
    font-size: 1.3rem
}
#goods .goodsBtn{
    background: #fff;
    box-shadow: 0 0 6px #0f0fcf, 0 0 12px #fff, 0 0 18px #0f0fcf;
    border-radius: 5px;
    width: 100%;
    margin: 10px auto 10px;
    text-align: center;
    color: #ccc;
    font-weight: bold;
}
#goods .goodsBtn a.nolink,#goods .goodsBtn a.nolink:visited,#goods .goodsBtn a.nolink:hover {

    color: #666;
}

#goods .goodsBtn a,#goods .goodsBtn a:visited,#goods .goodsBtn a:hover {
    color: #000;
    display: block;
    padding: 10px 10px;
	text-align: center;
}

#goods .tensocom{
	    width: 90%;
      margin: 0 auto;
	    background: #e71a21;
}

/*card*/


/* movie ****************************************************/
#movie .postList {
 display: -webkit-flex;
 display: flex;
 flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 justify-content:space-between;
 -webkit-box-pack:justify;
 -webkit-justify-content:space-between;
 align-items:stretch;
 -webkit-box-align:stretch;
 -webkit-align-items:stretch;
 margin-bottom: 20px;
}
#movie .postList li {
 width: 48%;
 border-bottom: 2px solid #55aada;
 padding-bottom: 23px;
 margin-bottom: 20px;
 position: relative;
}
#movie .postList li a{
 display:block;
}
#movie .postList li .ph {
 width: 100%;
}
#movie .postList li .text {
 width: 100%;
}
#movie .postList li .ph {
 position: relative;
 width: 100%;
 padding: 56.25% 0 0 0;
 margin-bottom: 10px;
 overflow: hidden;
 background-position: center;
 background-size: cover;
}
 
 
 
}




#wrapper{
  position: relative;
}
@media screen and (min-width: 768px) {
  .pc_none_ex { display:none !important;}
  #gdpr{
    position: fixed;
    display: flex;
    background-color: rgba(0, 0, 0, 0.9);
    border: 1px solid #fff;
    padding: 10px;
    right: 15px;
    bottom:  15px;
    z-index: 20;
    font-size: 16px;
  }
  
  #gdpr-text{
    color: #fff;
    width: 400px;
    line-height: 1.3em;
    margin-right: 10px;
  }
  
  #gdpr-text a{
    text-decoration: underline;
  }
  
  #gdpr-btn{
    background-color: #fff;
    color: #000;
    display: flex;
    align-items: center;
    padding: 0 10px;
    cursor: pointer;
  }
  #gdpr-btn:hover{
     background-color: #e71a21;
     transition: all linear 0.1s;
     color: #fff;
  }
  #gdpr-btn-text{
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
  }
}



@media screen and (max-width: 767px) {
  .sp_none_ex { display:none}
  .spBlock{display: block;}
  #gdpr{
    position: fixed;
    background-color: rgba(0, 0, 0, 0.7);
    border: 1px solid #fff;
    padding: 10px;
    left: 10px;
    bottom: 20px;
    z-index: 20;
    font-size: 16px;
    width: calc(100% - 40px);
    
  }
  
  #gdpr-text{
    color: #fff;
    width: 100%;
    line-height: 1.3em;
    margin-right: 10px;
  }
  
  #gdpr-text a{
    text-decoration: underline;
  }
  
  #gdpr-btn{
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    cursor: pointer;
    margin: 20px 0 0 0;
    color: #000;
  }
  #gdpr-btn:hover{
     background-color: #e71a21;
     transition: all linear 0.1s;
     color: #fff;
  }
  #gdpr-btn-text{
    
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 700;
    text-align: center;
  }

/*add*/

.ticketbtnsp{
    width: 90%;
    margin: 0 auto;
}

h3.gold{
  font-size: 2.2rem;
  text-align: center;
  text-shadow: 0 0 6px #1ec5cc, 0 0 12px #fff, 0 0 18px #1ec5cc;
  font-family: 'Play', sans-serif;
  font-weight: bold;
  padding: 35px 0;
  color: #222;
}

#news h3.gold,#goods h3.gold,#card h3.gold{
  padding: 100px 0 35px;
}

/*news*/



div.aboutwrapper{
    width: 100%;
/*   padding: 5px;*/
    margin: 50px auto;
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 2.5rem;
}

/*about*/
div.about{
  background-image: url(../images/top/bg_about.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  padding: 0 0 30px 0;
  margin: 0 0 30px 0;
}

.abouttxt01{
  font-size: 1.5rem;
}
.abouttxt02{
  font-size: 1.2rem;
}
.abouttxt03{
  font-size: 1rem;
}
/*ticket*/
div.ticket{
  background-size: cover;
  background-repeat: no-repeat;
  padding: 0;
}

div.ticketwrapper{
    width: 100%;
/*    padding: 5px;*/
    margin: 0 auto 50px;
    text-align: center;
    font-size: 0.9rem;
    font-weight: bold;
    line-height: 1rem;
    background: url(../images/top/bg_ticket.jpg) center center no-repeat;
    min-height: 400px;
}

.ticketList,.accessList{
      width: 90%;
    margin: 0 auto;
    padding: 0 0 30px 0;
}

ul.ticketprice,ul.ticketsale{
    width: 95%;
    margin: 0 auto 50px;
    font-size: 1.1rem;
    line-height: 1rem;
}

ul.ticketprice li{
  display: flex;
    border-bottom: #fff solid 1px;
    padding: 10px 3px;
}

ul.ticketprice span,ul.ticketsale span{
  display: block;
    font-size: 0.7rem;
}

.ticketatt{
  font-size: 0.8rem;
  text-align: left;
  color: #a0a0a0;
    margin: 5px 5px;
    line-height: initial;
}
.ticketatt a{
  color:#dfc878;
}
.tickettype{
  width:50%;
  text-align: left;
}

ul.ticketprice span.ticketTxtSmall{
     font-size: 0.7rem;
     display: block;
    line-height: 0.9rem;
    /*padding: 0 0 10px 0;*/
}
.ticketlabel span{
  text-align: center;
}
.price{
  width: 20%;
  text-align: right;
}
.sales{
  width: 8%;
  padding-left: 2%;
  text-align: center;

}

.endticketsaletitle{
    padding: 5px 0;
    margin: 30px 0 20px 0;
    text-decoration: line-through;
    color: #333;
    text-shadow: 0 0 6px #444, 0 0 12px #ddd, 0 0 18px #444;
    background: linear-gradient(to right, rgba(0,0,0,.5) 0%,#888 45%,#888 50%,#888 55%,rgba(0,0,0,.5) 100%);

}
.endticketlink{
    margin: 0 auto;
    width: 40%;
    color: #777;
}
.endticketperiod{
    color: #aaa;
    padding: 0 0 15px 0;
    text-decoration: line-through;
}


ul.ticketsale span.ticketsaletitle,ul.ticketsale span.accesstitle,.cardday{
    padding: 5px 0;
    margin: 30px 0 20px 0;
    color: #000;
    text-shadow: 0 0 6px #cee4e5, 0 0 12px #fff, 0 0 18px #cee4e5;
    background: linear-gradient(to right, rgba(0,0,0,.5) 0%,#92acad 45%,#92acad 50%,#92acad 55%,rgba(0,0,0,.5) 100%);
    font-size: 1.2rem;
        padding: 13px;
        font-weight: bold;
    line-height: 1.8rem;
}
ul.ticketsale span.ticketlisttitle{
    font-size: 1rem;
    padding: 13px;
}

.ticketlink{
    margin: 10px auto;
    font-size: 0.7rem;
}
.aboutlink{
    margin: 0 auto;
    font-size: 0.7rem;
    display: block;
    width: 80%;
}



.ticketperiod,.accesstxt{
    padding: 0 0 15px 0;
}

.ticketgift{
    font-size: 0.8rem;
    padding: 20px 0 0;
}
/*card*/
#cardWrap{
    text-align: center;
    margin-top:50px; 
}
#cardWrap h4.cardday{
    font-size: 1.4rem;
    padding: 15px;
    color: darkslategrey;
}

#cardWrap ul li{
  width: 90%;
  margin: 0 auto;
  }

#cardWrap ul li p{
  margin: 15px 0 50px;
  font-size:1rem;
  font-weight: bold;
}

#cardWrap ul li p span{
    display: block;
    color: gold;
    font-size: 0.8rem;
  }


/**/

div.footerbnr {
    position: fixed;
    left:0;
    bottom:0;
    width: 100%;
    height:70px;/*高さ*/
    margin:0;
    padding:0;
    border-top:2px solid #808080;/*バーの上の線*/
    border-bottom:2px solid #808080;/*バーの下の線*/
    z-index:30;
    background: url(../images/top/votebnr.jpg) center center no-repeat;
    text-align: center;
}

div.footerbnr a{
    font-size: 1.2rem;
    text-align: center;
    line-height: 1.3rem;
    padding-top: 15px;
    font-weight: bold;
    display: block;
}
/*twitter*/
.tw{
  width: 85%;margin: 0 auto;
      margin: 0 auto 50px;
}

.notesWrap{
      width: 95%;
    margin: 0 auto;
}
div.notescontents{
    margin: 0 auto;
    font-size: 0.8rem;
    line-height: 1.1rem;
    border: #b44723 solid 1px;
    padding: 10px 25px 25px 25px;
    /*line-height: 2rem;*/
}

.notestitle{
  text-align: center;
  color:#fff;
    text-shadow: 0 0 6px #b44723, 0 0 12px #fff, 0 0 18px #b44723;
  padding: 25px 0;
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 2rem;
}
.noteslist li{
  position: relative;
  padding-bottom: 6px;
}
.noteslist li:before {
  content:"■";
  position: absolute;
  left: -14px;
}
.seatlist {
  margin: 5px 0 20px 0;
}
.seatlist li{
  width: 100%;
  display: flex;
  margin: 0 auto;
border-bottom: #fff solid 1px;
    margin-bottom: 7px;
    padding-bottom: 5px;

}

.seatlist span{
 display: block;
 width: 50%; 
 font-size: 0.9rem;
 padding: 5px;
}

.seattype{
  text-align: right;
  font-weight: bold;
}

.studendlist li{
  position: relative;
  padding-bottom: 6px;
}

.studendlist li:before {
  content:"※";
  position: absolute;
  left: -14px;
}



}

@media screen and (min-width:480px) and ( max-width:767px) {

	.ticketbtn {
	    display: block;
	    width: 200px;
	    margin: 0 auto;
	}
	.ticketbtnsp{
	    display: none;
	}


}



/* subjectList ****************************************************/
.grayBg {
 padding: 40px 20px;
 background: rgba(0,0,0,0.8);
}
.subjectList li p.btn span{
    display: block;
    width: 80%;
    border-radius: 8px;
    color: #000;
    padding: 0 20px 0 0;
    font-size: 14px;
    line-height: 48px;
    height: 48px;
    background: url(../images/common/next_on.png) no-repeat center right 8px ;
    background-color: #1ec5cc;
}
.subjectList li p.btn span a{
    color: #000;
  }
.subjectList li p.nobtn span{
    background-color: #666;
    color: #999;
}
@media screen and (max-width: 767px) {
 .grayBg {
  padding: 20px 3%;
 }
 .subjectList li a{
    line-height: 35px;
    height: 35px;
 }
}
.subjectList {
 border-top: 1px dotted #f0b93c;
}
.subjectList li{
 font-size: 1.2rem;
 border-bottom: 1px dotted #f0b93c;
}
@media screen and (max-width: 767px) {
 .subjectList li{
  font-size: 100%;
 }
}
.subjectList li div{
 display: block;
 display: -webkit-flex;
 display: flex;
 flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 position: relative;
 padding: 20px 20px;
 background-size: 40px auto;
}
.subjectList li div .date{
  width: 20%;
    padding: 15px 0 0 0;
}
.subjectList li div .title{
  width: 50%;
    padding: 15px 0 0 0;
}
.subjectList li div .btn{
  width: 14%;
}

@media screen and (max-width: 767px) {
 .subjectList li div{
 display: flex;
  padding: 10px 10px;
  background-size: 30px auto;
 }
.subjectList li div .date{
  width: 100%;
    padding: 15px 0 0 0;
}
.subjectList li div .title{
  width: 100%;
  padding: 0 0 15px 0;
}
.subjectList li div .btn{
  width: 50%;
}
}
.subjectList li .date{
 width: 310px;
}
@media screen and (max-width: 767px) {
 .subjectList li .date{
  display: block;
  margin-bottom: 5px;
 }
}

@media screen and (max-width: 767px) {
 .subjectList li a:hover {
  background: url(../images/common/next_on.png) no-repeat center right;
  background-size: 30px auto;
 }
}

