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: 1vw;
line-height:1.8em;
margin: 0px;
letter-spacing: 0.08em;
}

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

.sp{ 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;}


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

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


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

main

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

#content{
background: url("../images/bg.jpg") no-repeat center fixed;
background-size: cover;
width: 100%;
position: absolute;
overflow-x: hidden;
padding: 0;
margin: 0 auto;
}


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

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

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

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

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

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

#mainImg02{
background: url("../images/main_img02_pc.jpg") no-repeat center;
animation: scaleanm 5s 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;
background-size: contain;
width: 10%; height: 90%;
position: absolute;
top: 5%; right: 2%;
z-index: 5;
animation: fadeanm 2s ease 1.5s forwards;
opacity: 0;
}

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

#roadshow,#roadshowB{
background: url("../images/roadshow.png") no-repeat center;
background-size: contain;
width: 11%; height: 12%;
position: absolute;
bottom: 2%; left: 1.5%;
z-index: 5;
animation: fadeanm 2s ease 1.3s forwards;
opacity: 0;
}

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

#roadshowD{
background: url("../images/roadshow2_tate.png") no-repeat right;
background-size: contain;
width: 4%; height: 32%;
position: absolute;
top: 63.75%; right: 14.5%;
z-index: 5;
animation: fadeanm 2s ease 2s forwards;
opacity: 0;
}

#catch{
background: url("../images/main_catch_pc.png") no-repeat center;
background-size: contain;
width: 60%; height: 3.1%;
position: absolute;
top: 12.3%; left: 21%;
z-index: 5;
animation: fadeanm 3s ease 3.5s forwards;
opacity: 0;
}

#bnr_roadshow_dc{
width: 12%;
position: absolute;
bottom: 18%; left: 1%;
z-index: 10;
animation: fadeanm 2s ease 3.4s forwards;
opacity: 0;
}

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

bnrL

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

#bnrLallpc{
width: 11%;
position: absolute;
bottom: 12%; right: 0.5%;
z-index: 20;
animation: fadeanm 2s ease 3.4s forwards;
opacity: 0;
}

#bnrLallpcB{
width: 14%;
position: absolute;
bottom: 1%; left: 0.5%;
z-index: 20;
animation: fadeanm 2s ease 3.4s forwards;
opacity: 0;
line-height: 0;
text-align: center;
}

#bnrLallpcB img{ width: 80%; margin-top: 0.2em;}

.bnrLpc{
width: 100%;
margin-top: 0;
filter:drop-shadow(0 0 3px rgba(255, 255, 255, 1));
}

#bnrLallsp{ display: none;}

#bnrTicketPC{
width: 14.1%;
position: fixed;
top: 0; left: 0;
z-index: 51;
line-height: 0;
}

#bnrTicketSP{ display: none;}


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

movie

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

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

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

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

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


#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 5vw;
}

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


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

topics

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

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

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

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

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

.topicsTitle{
background: url("../images/sankaku.png") no-repeat top 50% right 10px;
background-size: 15px auto;
width: 100%; min-height: 25px;
display: flex;
flex-wrap: wrap;
align-items:stretch;
cursor: pointer;
}

.topicsDate{
width: 10%;
line-height: 1.5em;
font-size: 1.3vw;
color: #5d84ba;
text-align: center;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
margin-top: 0.2vw;
}

.topicsMidashi{
width: 90%;
line-height: 1.5em;
font-size: 1.4vw;
font-weight: 800;
}

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

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

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

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

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

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

.img70{
width: 70%;
margin: 5px 0;
pointer-events: none;
}

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

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

.comBox{
width: 100%;
border: 1px dotted #405c82;
padding: 1.5vw 0;
}

.comBoxTxt{
width: 95%;
margin: 0 auto;
}


/*----- 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: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
font-size: 20px;
}
.readmore.on-click .open {
display: none;
}
.readmore .close {
display: none;
font-size: 20px;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
}
.readmore.on-click .close {
display: block;
}


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

setlist

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

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

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

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

#setlistTxt{
background: url("../images/setup_txt_pc.png") no-repeat center top;
background-size: contain;
width: 80%; height: 55%;
position: absolute;
top: 27.5%; left: 10%;
z-index: 1;
text-indent:-999999px;
}

#setlistBlockAll{
width: 65%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
}

.setlistBlock{
width: 25%;
color: #fff;
line-height: 1.5em;
font-size: 1.4vw;
}

.setlistEtitle{
width: 100%;
text-align: left;
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_pc.jpg") no-repeat right top;
background-size: cover;
width: 100%;
position: relative;
overflow: hidden;
}

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

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

#commentPlateAll{
width: 55%; height: 75%;
position: absolute;
top: 18%; left: 0;
z-index: 5;
}

#commentPlateBG{
background: url("../images/comment_txt_bg.png");
width: 100%; height: 100%;
position: absolute;
top: 0; left: 0;
z-index: 1;
}

#commentTxt{
width: 90%;
margin: 0 auto;
overflow-wrap: break-word;
color: #fff;
line-height: 1.6em;
position: absolute;
top: 50%; left: 5%;
transform: translateY(-50%);
z-index: 2;
}

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


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

introduction

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

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

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

#introductionMain{
width: 100%;
margin: 0 auto;
text-align: center;
line-height: 2em;
letter-spacing: 0.07vw;
}


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

official

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

#officialAll{
width: 100%;
padding: 30px 0;
margin: 0 0 40px;
border-bottom: 1px solid #c0c0c0;
}

#officialsiteBtn{
background: url("../images/sankaku2.png") no-repeat right;
background-size: auto 100%;
width: 470px;
font-size: 28px;
line-height: 28px;
padding: 10px 0 5px;
text-align: center;
font-family: 'Mohave', sans-serif;
font-weight: 600;
font-style: normal;
color: #fff;
margin: 0 auto;
transition: all 0.3s ease;
}

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


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

#officialsiteSNS img{
width: 35px;
margin: 10px 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_pc.png") no-repeat center;
background-size: contain;
width: 80%; max-width: 875px;
margin: 40px auto;
}

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

#bnrArea{
width: 300px;
margin: 0 auto 40px;
}

#bnrArea img{ margin: 0; line-height: 0; border: 1px solid #fff;}

#sharearea{
background: url("../images/sharemark.png") no-repeat left top;
background-size: 15px auto;
width: 280px; height: 30px;
margin: 0 auto 40px;
text-align: right;
font-size: 20px;
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: 400px;
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;
}