@charset "utf-8";
/* CSS Document */
@media screen and (min-width: 801px) {
/********************************************************************************************************
	PC TOP
********************************************************************************************************/
/* ticketArea ****************************************************/
.ticketArea{
 padding:0;
 background:linear-gradient(90deg,#01a6ea 0%,#01a6ea 50%,#FFF 50%,#FFF 100%);
}
.ticketArea dl.ticketAreaInner{
 display:table;
 width:100%;
}
.ticketArea dl.ticketAreaInner dt{
 display:table-cell;
 vertical-align:middle;
 width:330px;
 background:#FFF;
 position:absolute;
}
.ticketArea dl.ticketAreaInner dt .arrow {
 position: absolute;
 top:0;
 left:-330px;
}
.ticketArea dl.ticketAreaInner dt span{
 font-size:450%;
 position:absolute;
 top:50px;
 color:#b2e4f9;
}
.ticketArea dl.ticketAreaInner dt .arrow.mvMoveOn {
 left:0;
  transition-delay:1s;
}
.ticketArea dl.ticketAreaInner dd{
 display:table-cell;
 vertical-align:middle;
 padding:0;
 background:#FFF;
 color: #000;
 font-size:225%;
 line-height:1.3em;
 height:250px;
 box-sizing:border-box;
	text-align: center;
}
.ticketArea dl.ticketAreaInner dd h3{
 margin-bottom:20px;
 font-weight:200;
 text-align:center;
 position:relative;
 z-index:2;
}
.dayticket{
	display: block;
	padding-top: 11px;
	line-height: 1.2;
	font-size: 78%;
}
.ticketArea dl.ticketAreaInner dd .linkBtn{
 margin:0 auto;
}
.ticketArea dl.ticketAreaInner dd .linkBtn a{
 border-color:#000;
 font-size:50%;
 line-height:1em;
 background:none;
 color:#000;
 padding:15px 0;
}
.ticketArea dl.ticketAreaInner dd .linkBtn a:hover{
 color:#fff;
}


/* artist ****************************************************/
.home .artist .ph{
 margin-bottom:40px;
}
/* about ****************************************************/
.home .about .textBox{
 padding-left:230px;
}
	


/********************************************************************************************************
	ARTIST
********************************************************************************************************/
/* artistList ****************************************************/
.artist .artistList {
 margin-bottom:20px;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: flex;
 
 flex-wrap:wrap;
 -ms-flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 
 justify-content: flex-start;
 -webkit-box-pack:start;
 -ms-flex-pack:start;
 -webkit-justify-content:flex-start;

 align-items: flex-start; 
 -webkit-box-align:start;
 -ms-flex-align:start;
 -webkit-align-items:flex-start;
}
.artist .artistList li{
 width:20%;
 padding:0 1%;
 margin-bottom:30px;
 box-sizing:border-box;
}
.artist .artistList li a {
 cursor:pointer;
}
.artist .artistList li img {
 width:100%;
 height:auto;
}
.artist .artistList li .ph{
 margin-bottom:10px;
}
.artist .artistList li .name{
 text-align:center;
 font-size:90%;
 line-height:1.3em;
}
.more{
text-align: right;
font-size: 20px;
margin-right: 2%;
}

/* modal ****************************************************/
.remodal-close {
 left: auto !important;
 right:0 !important;
}
.remodal h2.name{
 font-size:300%;
 font-family: 'Antonio','Noto Sans Japanese', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 font-weight:300;
}
.remodal .ph {
 margin-bottom:10px;
}
.remodal .ph img{
 max-width:450px;
 height:auto;
}
.remodal p.text_01{
 font-size:120%;
 text-align:left;
 margin-bottom:1.5em;
}
.remodal ul.link li{
 text-align: left;
 margin-bottom:1em;
 font-size:120%;
}
.remodal ul.link li i{vertical-align:middle;}
.remodal ul.link li a{
 color:#000;
 text-decoration:underline;
}
/********************************************************************************************************
	ACCESS
********************************************************************************************************/
.access .gmap iframe{
 display:block;
 margin:0 auto;
}
/********************************************************************************************************
	TICKET
********************************************************************************************************/
.ticket .playguide a{
 color:rgba(255,215,6,1.00);
 text-decoration:underline;
}
.ticket dl.playguide {
 margin-bottom:40px;
}
.ticket dl.playguide dt{
 width:190px;
}
.ticket dl.playguide dd{
 padding-left:15px;
}
.ticket dl.playguide em{
 margin-top: 20px;
 margin-bottom: 5px;
 display:block;
 font-weight:bold;
 font-size:125%;
}
.ticket dl.playguide dt em{
 text-align:center;
}
}
@media screen and (max-width: 800px) {
/********************************************************************************************************
	SP TOP
********************************************************************************************************/
/* ticketArea ****************************************************/
.ticketArea{
 padding:0;
}
.ticketArea dl.ticketAreaInner{
 width:100%;
 background:#FFF;
 overflow:hidden;
}
.ticketArea dl.ticketAreaInner dt{
 display:block;
 background:#FFF;
 position:relative;
}
.ticketArea dl.ticketAreaInner dt .arrow {
 position: absolute;
 top:0;
 left:-330px;
}
.ticketArea dl.ticketAreaInner dt .arrow img{
 height:100%;
}
.ticketArea dl.ticketAreaInner dt span{
 font-size:320%;
 position:absolute;
 top:0px;
 color:#b2e4f9;
}
.ticketArea dl.ticketAreaInner dt .arrow.mvMoveOn {
 left:0;
  transition-delay:1s;
}
.ticketArea dl.ticketAreaInner dd{
 padding:20px 3%;
 text-align:center;
 color: #000;
 line-height:1.3em;
 box-sizing:border-box;
}
.ticketArea dl.ticketAreaInner dd h3{
 margin-bottom:10px;
 margin-top: 13px;
 font-weight:200;
 position:relative;
 z-index:2;
 font-size:145%;
 line-height:1.2em;
}
.dayticket{
	display: block;
	padding-top:7px;
	font-size: 70%;
}


.ticketArea dl.ticketAreaInner dd .linkBtn{
 margin:0 auto;
}
.ticketArea dl.ticketAreaInner dd .linkBtn a{
 border-color:#000;
 line-height:1em;
 background:none;
 color:#000;
 padding:15px 0;
}
/* artist ****************************************************/
.home .artist .ph{
 margin-bottom:20px;
}
/********************************************************************************************************
	ARTIST
********************************************************************************************************/
/* artistList ****************************************************/
.artist .artistList {
 margin-bottom:40px;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: flex;
 
 flex-wrap:wrap;
 -ms-flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 
 justify-content:space-between;
 -webkit-box-pack:justify;
 -ms-flex-pack:justify;
 -webkit-justify-content:space-between;

 align-items: flex-start; 
 -webkit-box-align:start;
 -ms-flex-align:start;
 -webkit-align-items:flex-start;
}
.artist .artistList li{
 width:48%;
 margin-bottom:10px;
 position: relative;
}
.artist .artistList li img {
 width:100%;
 height:auto;
}
.artist .artistList li .name{
 font-size:81%;
 line-height:1.3em;
}
.more{
text-align: center;
font-size: 20px;
}

/* modal ****************************************************/
.remodal-close {
 left: auto !important;
 right:0 !important;
}
.remodal h2.name{
 font-size:230%;
 font-family: 'Antonio','Noto Sans Japanese', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 font-weight:300;
 margin-bottom:10px;
}
.remodal .ph {
 margin-bottom:10px;
}
.remodal .ph img{
 width:100% !important;
 height:auto;
}
.remodal p.text_01{
 font-size:120%;
 text-align:left;
 margin-bottom:1.5em;
}
.remodal ul.link li{
 text-align: left;
 margin-bottom:1em;
 font-size:120%;
}
.remodal ul.link li i{vertical-align:middle;}
.remodal ul.link li a{
 color:#000;
 text-decoration:underline;
}

/********************************************************************************************************
	ACCESS
********************************************************************************************************/
.access .gmap iframe{
 width:100%;
 height:200px;
 display:block;
 margin:0 auto;
}

/********************************************************************************************************
	TICKET
********************************************************************************************************/
.ticket .playguide a{
 color:rgba(255,215,6,1.00);
 text-decoration:underline;
}
.ticket dl.playguide {
 display:block;
 margin-bottom:40px;
}
.ticket dl.playguide dt{
 display:block;
 width:30%;
 margin-bottom:5px;
}
.ticket dl.playguide dd{
 display:block;
}
.ticket dl.playguide em{
 display:block;
 font-weight:bold;
 font-size:125%;
 margin-top: 20px;
}

}
/********************************************************************************************************
	keyframes
********************************************************************************************************/
/* moveOn ****************************************************/
.scrMove { opacity:0;}
.moveOn{
 opacity:1;
 display:block;
 
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 
 -webkit-animation-name: slideMove;
 animation-name: slideMove;
 
 visibility: visible !important;
}
@-webkit-keyframes slideMove {
 0% { -webkit-transform: translateX(-100px); }
 100% { -webkit-transform: translateX(0); }
}
@keyframes slideMove {
 0% {  -webkit-transform: translateX(-100px); -ms-transform: translateX(-50px); transform: translateX(-50px); }
 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0);}
}
