body {
background: #fff;
color: #000;
font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
font-weight: 500;
width: 100%;
height:100%;
font-size: 3.4vw;
line-height:2em;
margin: 0px;
letter-spacing: 0.3px;
}

#wrap{
width: 100%;
position: relative;
}

.pc{ display: none;}
.fontS{ font-size: 80%; letter-spacing: .02em;}
.txtSpace{ letter-spacing: -9px;}
.no-space{ letter-spacing: -0.5vw;}
.no-spaceS{ letter-spacing: -1.2px;}
.noclick{pointer-events: none;}
.txtWhite{ color: #fff;}
.txtRed{ color: #EC213A;}
.txtBlue{ color: #0d528c;}
.fontB{ font-weight: 600;}
.efBlock{ width: 100%;}
.boxMarge{ padding: 0 0 2vw;}

.topMenu{ display: block;}
.kasoMenu{ display: none;}

a:hover {opacity:1;} 

.linkLabel{
padding-top: 50px;
margin-top: -50px;
}

@keyframes  fadeanm {
0% {opacity: 0;}
100% {opacity: 1;}
}

@keyframes  scaleanm {
0% { transform: scale(1.5,1.5); opacity: 0;}
100% { transform: scale(1,1); opacity: 1;}
}

@keyframes  scaleanm2 {
0% { transform: scale(1.5,1.5) rotateZ(10deg); opacity: 0;}
100% { transform: scale(1,1) rotateZ(0); opacity: 1;}
}


/*---------------------------------------------

main

----------------------------------------------*/

#content{
width: 100%;
position: absolute;
overflow-x: hidden;
padding: 0;
margin: 0 auto;
}

#content:before{
background: url("../images/bg_sp.jpg") no-repeat center;
background-size: cover;
content:"";
display:block;
position:fixed;
top:0;
left:0;
z-index:-1;
width:100%;
height:100vh;
}


#main{
background-color: #00090c;
width: 100%;
position: relative;
overflow: hidden;
}

#main:before{
content:"";
display: block;
padding-top: 141.33%;
}

#mainAll{
width: 100%; height: 100%;
position: absolute;
top: 0; left: 0;
z-index: 1;
}

#mainImg01all{
width: 100%; height: 37%;
position: absolute;
top: 0; left: 0;
z-index: 1;
overflow: hidden;
}

#mainImg02all{
width: 100%; height: 63%;
position: absolute;
top: 37%; left: 0;
z-index: 1;
overflow: hidden;
}

#mainImg01{
background: url("../images/main_img01_sp.jpg") no-repeat center;
animation: scaleanm 6s cubic-bezier(0,.64,.41,1) 0.5s forwards;
opacity: 0;
}

#mainImg02{
background: url("../images/main_img02_sp.jpg") no-repeat center;
animation: scaleanm 6s cubic-bezier(0,.64,.41,1) 1s forwards;
opacity: 0;
}

#mainImg01,#mainImg02{
background-size: cover;
width: 100%; height: 100%;
position: absolute;
top: 1; left: 1;
z-index: 1;
}

#logo{
background: url("../images/logo.png") no-repeat center right;
background-size: contain;
width: 20%; height: 70%;
position: absolute;
top: 2%; right: 2.6%;
z-index: 5;
animation: fadeanm 2s ease 3s forwards;
opacity: 0;
}

#roadshow_dolby{
background: url("../images/roadshow_dc.png") no-repeat center;
background-size: contain;
width: 20%; height: 7.6%;
position: absolute;
bottom: 1.8%; left: 55%;
z-index: 5;
animation: fadeanm 2s ease 3.5s forwards;
opacity: 0;
}

#roadshow{
background: url("../images/roadshow.png") no-repeat center;
background-size: contain;
width: 20%; height: 7.6%;
position: absolute;
bottom: 1.8%; left: 54%;
z-index: 5;
animation: fadeanm 2s ease 3.5s forwards;
opacity: 0;
}

#roadshowB{
background: url("../images/roadshow.png") no-repeat center;
background-size: contain;
width: 20%; height: 7.6%;
position: absolute;
bottom: 1.8%; right: 2%;
z-index: 5;
animation: fadeanm 2s ease 3.5s forwards;
opacity: 0;
}

#roadshowC,#roadshowD{
background: url("../images/roadshow2.png") no-repeat center;
background-size: contain;
width: 25%; height: 12%;
position: absolute;
bottom: 2%; right: 2%;
z-index: 5;
animation: fadeanm 2s ease 3.5s forwards;
opacity: 0;
}

#catch{
background: url("../images/main_catch_sp.png") no-repeat center;
background-size: contain;
width: 4%; height: 52.1%;
position: absolute;
top: 13%; left: 5%;
z-index: 5;
animation: fadeanm 3s ease 4s forwards;
opacity: 0;
}

#bnr_roadshow_dc{
width: 23%;
position: absolute;
bottom: 0.5%; right: 2%;
z-index: 10;
animation: fadeanm 2s ease 3.5s forwards;
opacity: 0;
}

/*---------------------------------------------

bnrL

----------------------------------------------*/

#bnrLallpc,#bnrLallpcB{ display: none;}

#bnrLallsp{
width: 100%;
line-height: 0;
padding: 12px 0;
}

.bnrLsp{
width: 85%;
margin: 0 auto;
padding: 5px 0;
line-height: 0;
}

#bnrTicketPC{ display: none;}

#bnrTicketSP{
width: 100%;
position: fixed;
bottom: 0; left: 0;
z-index: 20;
line-height: 0;
}


/*---------------------------------------------

movie

----------------------------------------------*/

#topmovarea{
background: url("../images/movie_bg.jpg") no-repeat center;
background-size: cover;
width:100%;
margin:0 auto;
padding:7vw 0;
line-height: 0;
/*border-bottom: 1px solid #d2aad6;*/
}

#topmovarea .movie {
width: 85%;
margin: 0 auto;
}

#topmovarea .movie .inner {
position: relative;
padding-bottom: 56.25%;
margin: 0 auto;
}

#topmovarea .movie .inner iframe {
position: absolute;
top: 0;
left: 0px;
width: 100%;
height: 100%;
}


#topmovarea .movie .tab_area {
width: 100%;
display: flex;
flex-wrap: wrap;
margin: 5px auto 0;
justify-content: center;
}

#topmovarea .movie .tab_area li {
text-align: center;
margin: 1px;
}

#topmovarea .movie .tab_area li a{
display: block;
text-decoration: none;
background: #344d70;
color: #fff;
float: left;
line-height: 3em;
padding: 0 7vw;
font-size: 90%;
}

#topmovarea .movie .tab_area li a.active{
background: #4e8bc8;
color: #fff;
}


/*---------------------------------------------

topics

----------------------------------------------*/

#topicsAll{
width: 100%;
position: relative;
overflow: hidden;
padding: 7vw 0;
}

.contentM{
width: 100%;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
text-align: center;
color: #344d70;
font-size: 6vw;
letter-spacing: 0.1vw;
margin: 0 0 5vw;
}

#topicsMain{
width: 90%;
margin: 0 auto;
}

.topicsBlock{
width: 100%;
border: 1px solid #405c82;
box-sizing: border-box;
padding: 2vw 1vw 2vw;
margin: 0 0 2vw;
}

.topicsTitle{
background: url("../images/sankaku.png") no-repeat top 50% right 10px;
background-size: 15px auto;
width: 100%;
cursor: pointer;
padding: 5px 0;
}

.topicsDate{
width: 95%;
line-height: 1.5em;
margin: 0 auto;
font-size: 5vw;
color: #5d84ba;
text-align: left;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
}

.topicsMidashi{
width: 95%;
margin: 0 auto;
line-height: 1.5em;
font-size: 3.7vw;
font-weight: 600;
}

.topicsTxtAll{
width: 96%;
margin: 0 auto;
display: none;
}

.topicsTxt{
width: 100%;
padding: 10px 0;
margin: 10px 0 0;
border-top: 1px dotted #405c82;
overflow-wrap: break-word;
text-align: justify;
}

.warningfontL{
padding-left: 1em;
text-indent: -1em;
line-height: 1.5em;
}

.warningfontS{
font-size: 80%;
line-height: 1.5em;
padding-left: 1em;
text-indent: -1em;
}

.img30{
width: 50%;
margin: 5px 0;
pointer-events: none;
}

.img50,.img70,.img100{
width: 100%;
margin: 5px 0;
pointer-events: none;
}

.topicsTxt a{ color: #ef5194; text-decoration: underline;}


/*----- more -----*/

.readmore {
position: relative;
margin: 1em auto;
display: block;
color: #5d84ba;
border: none;
outline: 0;
cursor: pointer;
background: none;
letter-spacing: 0.1em;
}
.readmore:before {
content: "";
width: 40px;
height: 40px;
text-align: center;
border-radius: 50%;
display: block;
margin: 0 auto .5em;
background: url("../images/more.png") no-repeat center / 20px #5d84ba;
transition: .3s;
}
.readmore.on-click:before {
transform: rotate(180deg);
}
.readmore .open {
display: block;
font-family: din-condensed, sans-serif;
font-weight: 400;
font-style: normal;
font-size: 20px;
}
.readmore.on-click .open {
display: none;
}
.readmore .close {
display: none;
font-size: 20px;
font-family: din-condensed, sans-serif;
font-weight: 400;
font-style: normal;
}
.readmore.on-click .close {
display: block;
}


/*---------------------------------------------

setlist

----------------------------------------------*/

#setlistAll{
background: url("../images/setlist_bg_sp.jpg") no-repeat center;
background-size: cover;
width: 100%;
position: relative;
overflow: hidden;
}

#setlistAll:before{
content:"";
display: block;
padding-top: 144%;
}


#setlistM{
width: 100%;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
text-align: center;
color: #fff;
font-size: 6vw;
letter-spacing: 0.1vw;
position: absolute;
top: 8%; left: 0;
z-index: 1;
}

#setlistTxt{
background: url("../images/setup_txt_sp.png") no-repeat center top;
background-size: contain;
width: 85%; height: 72%;
position: absolute;
top: 18%; left: 7.5%;
z-index: 1;
text-indent:-999999px;
}

#setlistBlockAll{
width: 100%;
margin: 0 auto;
}

.setlistBlock{
width: 50%;
color: #fff;
line-height: 1.5em;
font-size: 4.4vw;
margin: 0 auto;
}

.setlistEtitle{
width: 100%;
text-align: center;
line-height: 2em;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
}

.setlistE{
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
}


/*---------------------------------------------

comment

----------------------------------------------*/

#commentAll{
background: url("../images/comment_bg_sp.jpg") no-repeat right top;
background-size: cover;
width: 100%;
position: relative;
overflow: hidden;
}

#commentAll:before{
content:"";
display: block;
padding-top: 380%;
}

#commentM{
width: 100%;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
text-align: center;
color: #fff;
font-size: 6vw;
letter-spacing: 0.1vw;
position: absolute;
top: 2.5%; left: 0;
z-index: 1;
}

#commentPlateAll{
background: url("../images/comment_txt_bg.png");
width: 94%;
padding: 1.5em 0;
position: absolute;
bottom: 3%; left: 3%;
z-index: 5;
}

#commentPlateBG{ display: none;}

#commentTxt{
width: 90%;
margin: 0 auto;
overflow-wrap: break-word;
color: #fff;
}

#commentNM{
width: 100%;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
font-size: 5vw;
font-weight: 500;
text-align: right;
}


/*---------------------------------------------

introduction

----------------------------------------------*/

#introductionAll{
width: 100%;
position: relative;
overflow: hidden;
padding: 7vw 0;
}

#introductionM{
width: 100%;
padding: 0 0 3vw;
text-align: center;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
font-size: 1.4em;
font-weight: 600;
line-height: 1.5em;
}

#introductionMain{
width: 85%;
margin: 0 auto;
text-align: justify;
line-height: 2em;
letter-spacing: 0.15vw;
overflow-wrap: break-word;
}


/*---------------------------------------------

official

----------------------------------------------*/

#officialAll{
width: 100%;
padding: 2vw 0 2vw 0;
margin: 0 0 3vw;
border-bottom: 1px solid #c0c0c0;
}

#officialsiteBtn{
background: url("../images/sankaku2.png") no-repeat right;
background-size: 5% auto;
width: 80%;
font-size: 5vw;
line-height: 20px;
padding: 2vw 0 1.6vw;
text-align: center;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
color: #fff;
margin: 2vw auto 1vw;
}

#officialsiteBtn a{ color: #fff; display: block; width: 100%; height: 100%; opacity: 1;}

#officialsiteSNS{
width: 100%;
text-align: center;
}

#officialsiteSNS img{
width: 30px;
margin: 0 3px 5px;
text-align: center;
}


/*---------------------------------------------

footer

----------------------------------------------*/

footer{
background: url("../images/footer_bg_pc.jpg") no-repeat center top;
background-size: cover;
width: 100%;
padding: 0 0 100px;
margin: 0 auto;
}

#billing{
background: url("../images/billing_sp.png") no-repeat center;
background-size: contain;
width: 100%;
margin: 2vw auto 4vw;
}

#billing:before{
content:"";
display: block;
padding-top: 77.33%;
}


#sharearea{
background: url("../images/sharemark.png") no-repeat left top;
background-size: 6% auto;
width: 62%; height: 30px;
margin: 0 auto 3vw;
text-align: right;
font-size: 4.5vw;
line-height: 1em;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
letter-spacing: 0;
}

#sharearea a{
text-decoration: none;
color: #fff;
}

#sharearea a:hover{ color: #fff;}


#copyright{
width: 100%;
font-size: 11px;
text-align: center;
margin: 0 auto;
line-height: 1em;
color: #fff;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
letter-spacing: 0.5px;
}