@charset "UTF-8";
html {
overflow-y: scroll;
}

body {
color: #0c1d39;
margin: 0px;
padding: 0px;
font-size: 19px;
line-height: 2; 
font-family:'Barlow', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3",  sans-serif;
height: 100%;
background:#b0c4de;
-webkit-text-size-adjust:100% !important

}
theme-color{
        color:#ed8ec4; 
}

main {
margin: 6em auto 0 auto ;
text-align: left;
max-width: 60em;
z-index: 99;
}

/*選択した時*/
::selection {
background: (12,29,57,0.5);
color: (12,29,57,0.5);
}

/*リンク*/
a{
color:#0c1d39;/*???*/
text-decoration: none;
}
a:hover {
color: #0c1d39;/*???*/
text-decoration: none;
}

/*センター*/
.center{
text-align:center;
display: block;
}

/*ヘッダー*/
header {
width: 100%;
z-index: 9999;
height:4.8em;
position: fixed;
left: 0;
top: 0;
box-shadow: 0px 0px 4px 3px rgba(72,42,0,.3);
-webkit-box-shadow: 0px 0px 4px 3px rgba(72,42,0,.3);
-moz-box-shadow: 0px 0px 4px 3px rgba(72,42,0,.3);
background:#ed8ec4
;
}

.title{
display:flex;
padding:0 0 0 0.8em;
}
.title1{
display:inline-block;
font-family:'Zen Antique', serif;
font-weight:bold;
color:#0c1d39;
line-height: 1.2; 
font-size:1.3em;
padding-top:0.5em;
}
.title2{
display:inline-block; 
font-family:'Zen Antique', serif;
font-weight:normal;
color:#0c1d39;
font-size:3.5em;
line-height: 0; 
padding-top:0.6em;
padding-left:0.4em;
}

#menusp ul{
text-align: right;
margin:0.5em 1em;
list-style: none;
width: 100%;
display: block;
position: absolute;
bottom: 0;
right: 0;
}
#menusp li{
display:inline-block;
vertical-align: middle;
margin: 0;
width:auto;
padding-bottom:0.4em;
padding-right:1.5em;
padding-left:1.5em;
line-height: 0.7; 
font-size:15px;
}
#menusp li a{
display: block; 
text-decoration: none;
font-weight: 700;
color: #0c1d39;
margin: 0;
text-align: center;
letter-spacing: 0.03em;
position: relative;
}
#menusp li :hover{
color: #6d747edd;
opacity: 1;
animation-duration: 6s;
}
#menusp .line{
border-right:1px solid #0c1d39;
}
#menusp .line.now.s{
border-right:0px;
}
.nownow{
color: #0c1d39;
}
#one,#two,#three,#four{
font-weight: 900;
}
#one::before{
font-family: Font Awesome\ 5 Free;
content: '\f024';
font-size:2em;
}
#two::before{
font-family: Font Awesome\ 5 Free;
content: '\f05a';
font-size:2em;
}
#three::before{
font-family: Font Awesome\ 5 Free;
content: '\f630';
font-size:2em;
}
#four::before{
font-family: Font Awesome\ 5 Free;
content: '\f207';
font-size:2em;
}
#five::before{
        font-family: Font Awesome\ 5 Free;
        content: '\f0f5';
        font-size:2em;
        }

/*フッター*/
footer{
margin-bottom: 0;
bottom:0;
text-align: center;
font-size:80%;
background-color: #071223;
color: #eeeeee;
padding: 2em;
z-index:1;
}
footer a{
color: #ed8ec4;/*フッターのリンク*/
}
footer a:hover{
color: #ffffff;/*フッターのリンク(押した時)*/
}
.pagetop{
width:60px;
position:fixed;
right:1em;
bottom:1em;
}

/*段落*/
.main p{
margin: 0.4em 3em 2.5em 3em;
line-height: 1.9;
}

/*文字*/
h1{
text-align:center;
border-bottom: 4px solid #0c1d39;  
color: #0c1d39;
width:100%;
font-size:35px;
line-height: 1.8; 
margin-bottom:0em;
}
h2{
border-left: 5px solid #0c1d39;
padding-left:10px;
margin-bottom:0px;
font-size:22px;
}
h3 {
font-family: 'Fjalla One', sans-serif;
display: inline-block;
position: relative;
padding: 0 0em;
left: 50%;
transform: translateX(-50%);
text-align:center;
width: 1000px;
font-size:50px;
margin-bottom:0;
line-height: 1; 
}
h3::before,
h3::after {
content: '';
display: inline-block;
position: absolute;
top: 50%;
height: 3px;
background-color: #0c1d39;/*トップページの見出しの横の線*/
}
h3::before {
left: 0;
}
h3::after {
right: 0;
}
h3#comment::before,h3#comment::after{
width: 35%;
}
h3#sns::before,h3#sns::after{
width:40%;
}
h3#stage::before,h3#stage::after{
        width: 30%;
        }
h4{
text-align:left;
color: #0c1d39;
font-size:20px;
}

/*カミングスーン*/
#cs{
font-family:'Zen Antique', serif;
font-weight:normal;
font-size:30px;
text-align: center;
margin-bottom:0;
}

/*トップページ*/
#topb1{
font-family:'Zen Antique', serif;
font-weight:normal;
font-size:30px;
text-align: center;
line-height:1.6;
}
.h3s{
text-align: center;
margin-top:0.3em;
line-height: 1.7; 
}

/*トップページ（上）*/
.indextop{
font-family:'Zen Antique', serif;
font-size:25px;
}
.poster{
width:450px;
display:inline-block;
margin-left:2em;
margin-top:1em;
-webkit-filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3)); 
}
.about{
display:inline-block;
position:absolute;
padding-left:1.5em;
margin-top:3em;
line-height:1.1;
}
.about1{
display:block;
margin-bottom:0.2em;
}
.about2{
display:block;
padding-left:1em;
line-height: 1.3;
margin-bottom:1.3em;
}
.about3{
font-size:38px;
}
.about4{
display:block;
margin-top:0.3em;
font-size:32px;
line-height:1.2;
}
.about5{
display:block;
margin-top:0.15em;
font-size:100px;
line-height:1.2;
}
.about5 rt{
font-size:18px;
text-align: center;
}

/*トップページ（インフォメーション）*/
.info{
display:flex;
}

.info img{
width:120px;
height:120px;
float: left;
}

.info ul{
display: inline-block;
margin-top:0.2em;
padding-left:2.5em;
margin-bottom:0;
}

.info li{
line-height: 2.1;
}

.infoinfo{
flex-direction: column;
}

.infop{
float: left;
margin:0em 0 0 1.5em;
width:90%;
}

.infom{
font-size:22px;
font-weight: bold;
}

/*トップページ(事前申し込みgoogle form)*/

.form{
width:300px;
height: auto;
margin: 0.5em 0 0 0;
}

/*トップページ（挨拶ボタン）*/

.modal-wrapper_a {
z-index: 9000;
position: fixed;
top: 4em;
right: 0;
bottom: 0;
left: 0;
padding: 40px 10px;
text-align: center;
}

.modal-wrapper_a:not(:target) {
opacity: 0;
visibility: hidden;
transition: opacity .3s, visibility .3s;
}

.modal-wrapper_a:target {
opacity: 1;
visibility: visible;
transition: opacity .4s, visibility .4s;
}

.modal-wrapper_a::after {
display: inline-block;
height: 100%;
margin-left: -.05em;
vertical-align: middle;
content: "";
}

.modal-wrapper_a .modal-window_a {
box-sizing: border-box;
display: inline-block;
z-index: 20;
position: relative;
width: 200%;
max-width: 80vw;
padding: 1em 2em;
background: #FFF5F2;/*挨拶の背景*/
box-shadow: 0 0 30px rgba(0, 0, 0, .6);
vertical-align: middle;
}

.modal-wrapper_a .modal-window_a .modal-content_a {
max-height: 65vh;
overflow-y: auto;
text-align: left;
}
.modal-overlay_a {
z-index: 10;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, .8);
}

.modal-wrapper_a .modal-close_a {
z-index: 20;
position: absolute;
top: .5em;
right:.5em;
width: 35px;
color: #95979c !important;
font-size: 40px;
font-weight: 700;
line-height: 35px;
text-align: center;
text-decoration: none;
text-indent: 0;
}
.btn_o_a{
position: relative;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
align-content: space-around;
flex-direction: column;
text-align: center;
width:140px;
height:140px;
line-height: 0.7;
margin: 1.2em .5em .3em .5em;
z-index: 1!important;
-webkit-filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
        filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));   
}
.btn_o_a:hover{
-webkit-filter: drop-shadow(0px 12px 4px rgba(0,0,0,.3));
        filter: drop-shadow(0px 12px 4px rgba(0,0,0,.3));
transform: translateY(-.3em);
transition: all 0.3s ease 0s;
}
.btn_o_a img{
max-width:100%;
}
.btn_i_a img{
margin:0;
cursor: pointer;
}



/*トップページ（公演予定）*/
table{
        border-collapse: collapse;   
         
    }
th,td{
        border: solid 1px
}
table th, table td{
        border: solid 1px black;
        width: 300px;
        height: 80px;
        text-align: center;
}

/*トップページ(飲食)*/
.stagewar2{
        width:50%;
        margin: 0 auto;
        margin-top:1.5em;
        margin-bottom:1em;
        border:3px solid #0c1d39;
        padding:0.7em 1.3em;
        }
.stagewar2 ul{
        margin-top:0.4em;
        padding-left:20px;
        margin-bottom:1em;
}
#stagewar2ul{
        margin-bottom:1em;
}
.stagewar2t{
        font-weight:bold;
        font-size:23px;
}


.stagewar1{
        width:85%;
        margin: 0 auto;
        margin-top:1.5em;
        margin-bottom:1em;
        border:3px solid #0c1d39;
        padding:0.7em 1.3em;
        }
        .stagewar1 ul{
        margin-top:0.4em;
        padding-left:20px;
        margin-bottom:1.5em;
        }
        #stagewar1ul{
        margin-bottom:1em;
        }
        .stagewar1t{
        font-weight:bold;
        font-size:23px;
        }
        


/*トップページ（SNS）*/
.sns{
        display:flex;
        align-items: center;
        margin-top:2em;
        padding: 0em 0.5em .5em;
        margin: 0 auto
        }

.instagram{
display: inline-block;
vertical-align:top;
text-align: center;
border: solid 1.5px;
padding: 0em 2.5em .5em;
margin: 0 auto; 
}
#tx,#ig{
display: inline-block;
position: relative;
font-weight: 900;
font-size:2em;
border: solid 1.5px;
margin-top:-1em;
top:0;
margin-bottom:.5em;
background:#eddfd5;
}
#tx{
border-radius: 70%;
padding: 1px 20px;
}
#ig{
border-radius: 70%;
padding: 1px 22px;
}
.instagram-media{
margin-right: auto !important;
margin-left: auto !important;
height:435px;
}

/*シェア*/
.sharemenu{
text-align: center;
margin-top:1em;
}
.sharelink{
display: inline-block;
position: relative;
font-weight: 900;
font-size:1.7em;
border: solid 1.5px;
top:0;
color:#0c1d39;
}
.sharelink:hover{
color:#eddfd5;
background-color:#0c1d39;
transition:0.3s;
}
.sharetw{
border-radius: 60%;
padding: 1px 18px;
margin-right:0.5em;
}
.sharefb{
border-radius: 60%;
padding: 1px 24px;
margin-right:0.4em;
}
.shareli{
border-radius: 60%;
padding: 1px 18px;
}

/*企画一覧（選択画面）*/
.kikaku{
z-index: 0!important;
}
.kikaku ul{
margin: 1em 3em;
width:100%;
}
.kikaku li {
list-style: none;
float: left;
width: 15%;
text-align: center;
margin: 0.5em;
letter-spacing: 0.05em;
}
.kikaku li a{
display: block;
color: #0c1d39;
font-weight: 700;
border:1px solid #0c1d39;
padding:0.2em 0.4em;
}
.kikaku li a:hover{
background-color: #ed8ec4;
color: #ffffff;
transition: 0.5s;
}
#now a{
background-color: #ed8ec4;
color: #0c1d39;
}
.tab:not(:first-child) {
border-left: none;
}
.tab.is-active a{
background-color: #ed8ec4;
color: #0c1d39;
}

/*企画一覧（一覧）*/
.panel {
display: none;
}
.panel.is-show {
display: inline-block;
}
.section{
position: relative;
z-index: 0 !important;
}
.inner{
width: 100%;
margin:0;
padding: 0;
z-index: 0 !important;
}
.menu_btn{
display: flex;
justify-content: space-around;
flex-wrap: wrap;
align-content: space-around;
z-index: 0 !important;
}
.btn_o{
position: relative;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
align-content: space-around;
flex-direction: column;
text-align: center;
width:230px;
height:230px;
line-height: 0.7;
margin: 3.5em 1em 1em;
z-index: 1!important;
-webkit-filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
        filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));   
}
.btn_o:hover{
-webkit-filter: drop-shadow(0px 12px 4px rgba(0,0,0,.3));
        filter: drop-shadow(0px 12px 4px rgba(0,0,0,.3));
transform: translateY(-.3em);
transition: all 0.3s ease 0s;
}
.btn_o img{
max-width:100%;
}
.btn_i img{
margin:0;
cursor: pointer;
}
.bradius{
z-index: 0!important;
}
#undersamune{
color:#0c1d39;
}

/*企画一覧（内容）*/
.modal-wrapper {
z-index: 1000;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
text-align: center;
}

.modal-wrapper:not(:target) {
opacity: 0;
visibility: hidden;
transition: opacity .3s, visibility .3s;
}

.modal-wrapper:target {
opacity: 1;
visibility: visible;
transition: opacity .4s, visibility .4s;
}

.modal-wrapper::after {
display: inline-block;
height: 100%;
margin-left: -.05em;
vertical-align: middle;
content: "";
}

.modal-wrapper .modal-window {
box-sizing: border-box;
display: inline-block;
z-index: 20;
position: relative;
width: 100%;
max-width: 80vw;
margin-top:4em;
background: #fff;
box-shadow: 0 0 30px rgba(0, 0, 0, .6);
vertical-align: middle;
}

.modal-wrapper .modal-window .modal-content {
max-height: 80vh;
overflow-y: auto;
text-align: left;
}
.modal-overlay {
z-index: 10;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, .8);
}
.modal-content{
font-size:19px;
margin: 1.5em;
text-align: center;
}
.nw{
width: 70vw;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-justify-content: center; /*Safari*/
justify-content: center;
text-decoration: none;
align-items: center;
padding:1em 1em;
margin-left:1.5em;
}
.nwitem{
text-decoration:none;
color: #0c1d39;
display: inline;
}
.nwitem img{
width:20vw;
border:1px solid #0c1d39;
margin-right:2em;
}
.width20{
width:50vw;
}
.classname{
position: relative;
padding: 0.3em;
background: #b0c4de;
}
.kikakuname.top{
font-size:30px;
border-bottom: 1px solid #666666;
margin-bottom:6px;
margin-top:6px;
}
.setsumei{
margin-top:0.8em;
font-size:15px;
line-height: 1.8;
}
.gaiyo{
padding: 0.1em 0.6em 0.1em;
margin: 1em 0.5em;
border: solid 1px #0c1d39;
display:inline-block;
font-size: 15px;
border-radius: 10px;
background-color:#b0c4de;
}
#modal-close{
position: absolute;
top:0;
right: 20px;
text-decoration: none;
transition: 0.5s ease-in-out;
font-size:2em;
color:#666;
}

/*カウントダウン*/
.count {
position: relative;
margin: 3em auto 19px auto;
padding: .1em 0em .1em .1em;
background-color: #ed8ec4;
width:250px;
font-size:20px;
z-index:0!important;
text-align:center;
}
.count::before {
position: absolute;
top: 0;
left: -9px;
width: 7px;
height: 135%;
border-radius: 3px;
background-color: #0c1d39;
content: '';
}
.count span::before,
.count span::after {
position: absolute;
left: -9px;
width: 20px;
height: 3px;
border-radius: 3px;
background-color: #60490E;
content: '';
}
.count span::before {
top: 44%;
transform: rotate(-25deg);
}
.count span::after {
top: 54%;
transform: rotate(25deg);
}
#date{
font-size:30px;
}

/*公演予定*/
.timeline1{
width:50%;
margin-top:1em;
margin-bottom:1em;
-webkit-filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
        filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
}
.timeline2{
width:50%;
margin-top:1em;
margin-bottom:1em;
-webkit-filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
         filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
}
.stagewar1{
width:85%;
margin: 0 auto;
margin-top:1.5em;
margin-bottom:1em;
border:3px solid #0c1d39;
padding:0.7em 1.3em;
}
.stagewar1 ul{
margin-top:0.4em;
padding-left:20px;
margin-bottom:1.5em;
}
#stagewar1ul{
margin-bottom:1em;
}
.stagewar1t{
font-weight:bold;
font-size:23px;
}

/*アクセス*/
.access{
width:80%;
margin-top:.5em;
margin-bottom:1em;
-webkit-filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
        filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
border-radius: 1.5em;
}
.access2{
width:80%;
margin-top:1em;
margin-bottom:0em;
-webkit-filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
        filter: drop-shadow(0px 3px 4px rgba(0,0,0,.3));
border-radius: 1.5em;
}

/*見せない*/
.pc_unshown{
display: none;
}
.nav-unshown {
display:none;
}



/*tablets=----------tablets=----------tablets=----------tablets=----------*/
@media screen and (max-width: 1300px)and  (min-width:600px) {
body {	
max-width: 100%;
overflow-x: hidden;
}
/*ヘッダー*/
.title{
display:inline-block;;
position:absolute;
padding-top:0em;
padding-left:1.5em;
}
.humberger {
color: #ffffff;
}
#nav-drawer {
display: block;

position: relative;
}
#nav-open {
padding:25px 10px 20px 25px;
display: inline-block;
width: 25px;
height: 20px;
vertical-align: middle;
}	
.nav-closed{
display: none;
position: fixed;
z-index: 99;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: black;
opacity: 0;
transition: .3s ease-in-out;   
}  
#nav-content {
overflow: auto;
position: fixed;
top: 0;
left: 0;
z-index: 997;
width: 65%;
height: 100%;
background: #fff;
transition: .3s ease-in-out;
-webkit-transform: translateX(-105%);
transform: translateX(-105%);
}
#nav-input:checked ~ #nav-close {
display: block;
opacity: 0.3;
}
#nav-input:checked ~ #nav-content {
-webkit-transform: translateX(0%);
transform: translateX(0%);
box-shadow: 6px 0 25px rgba(0,0,0,0.15);
}
#menusp ul{
top: 0;
bottom: auto;
margin: 0; 
padding:0; 
width:100%;
}
#menusp li{ 
padding:0.1em;
margin: 0;
width:100%;
clear: left;
display:inline-block;
vertical-align: middle;
}
#menusp li :hover{
color: #ffffff;
opacity: 1;
animation-duration: 6s;
}
#menusp li a{
letter-spacing: 0;
display: block; 
padding: 0.2em 0.8em 0.1em;
text-decoration: none;
color: #0c1d39;
margin: 0px;
text-align: left;
font-size:20px;
}
#menusp li a:hover{
color: #0c1d39;
}
.menusp_close{
font-weight: 700;
padding: 0.8em 0;
position: fixed;
bottom: 0;
text-align: center;
color: #ffffff;
background-color: #0c1d39;
width: 100%;
letter-spacing: 0.3em;
}
.menusp_moji{
font-size:1.5em;
color: #0c1d39;
font-weight: 700;
padding: 1em 0 0.5em 0.8em;
text-align: left;
margin-bottom:0.5em;
}
.nownow{
color:#142f5a;
}
.line.now{
background-color:#ed8ec4;
}
#one,#two,#three,#four{
font-weight: 900;
font-size:15px;
display: inline-block;
vertical-align: middle;
}
#one::before{
padding-right:18px;
padding-left:4px;
}
#two::before{
padding-right:19px;
padding-left:1px;
}
#three::before{
padding-right:12px;
padding-left:0px;
}
#four::before{
padding-right:16px;
padding-left:0px;
}
	
/*トップページ*/	
.indextop{
font-family:'Zen Antique', serif;
font-size:25px;
display: flex;
flex-direction: column;
}
.poster{
width:500px;
margin:  0 auto;
}
.about{
display:flex;
flex-direction: column;
position:relative;
margin-top:1.8em;
margin-left:1em;
}
.about br{
display: block;
content: "";
padding: 1px 0;
}
.about4{
line-height:1.2;
}
.about2.s{
padding-bottom:.8em;
}
	
/*段落*/	
main p{
margin: 0.4em 3em 2.5em 3em;
line-height: 1.9;
}

/*文字*/	
h2{
margin-left:0.5em;
line-height:1.6;
}
	
/*トップページ（インフォメーション）*/
.info img{
width:90px;
height:90px;
padding-left:1em;
}
.info ul{
display: inline-block;
margin-top:0.2em;
padding-left:2.5em;
padding-right:1.5em;
margin-bottom:0;
}
.infop{
float: left;
margin:0em 1.5em 0 2em;
width:90%;
}
	
/*トップページ（SNS）*/
.sns{
display:flex;
align-items: center;
margin-top:2em;
padding: 0em 0.5em .5em;
margin: 0 auto
}

.instagram{
display: inline-block;
width:40%;
height: 530px;
text-align: center;
border: solid 1.5px;
padding: 0em 0.5em .5em;
margin: 0 auto}

	
/*企画一覧（選択画面）*/
.kikaku ul{
margin:0 auto;
}
.kikaku li {
width: 20%;
}
	
/*企画一覧（内容）*/
.nw{
width: 65vw;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
flex-direction: column;
-webkit-justify-content: center; /*Safari*/
justify-content: center;
text-decoration: none;
align-items: center;
padding:1em 1em;
margin-left:.5em;
}
.nwitem{
text-decoration:none;
color: #0c1d39;/*企画一覧の中の文字(画面小さくした時)*/
display: inline;
}
.nwitem img{
width:25vw;
border:1px solid #0c1d39;/*企画一覧の中の写真の枠(画面小さくした時)*/
margin-right:0em;
}
.width20{
width:60vw;
}
.classname{
position: relative;
padding: 0.3em;
background: #b0c4de;
font-size:13px;
}
.kikakuname.top{
font-size:20px;
border-bottom: 1px solid #666;
margin-bottom:6px;
margin-top:6px;
}
.setsumei{
margin-top:0.8em;
font-size:12px;
line-height: 1.8;
}
.gaiyo{
padding: 0.1em 0.6em 0.1em;
margin: 1em 0.5em;
border: solid 1px #b0c4de;
display:inline-block;
font-size: 12px;
border-radius: 10px;
background-color:#b0c4de;
}
#modal-close{
right: 10px;
}
	
/*見せない*/
.pc_unshown{
display: block;
}
}

/*smartphones-------smartphones-------smartphones-------smartphones-------*/
@media screen and (max-width: 500px) {
body {
max-width: 100%;
font-size: 15px;
line-height: 1.8; 
margin-bottom: 0.5em;
overflow-x: hidden;
}
main{
z-index:0!important;
margin: 6em 0.8em 0.5em 0.8em;
}
	
/*ヘッダー*/
header {
height: 4.5em;
z-index:1000!important;
position: fixed;
}
.title{
display:inline-block;;
position:absolute;
padding-top:0.6em;
margin-left:0.5em;
}
.title1{
font-size:0.95em;
padding-top:0.6em;
}
.title2{
display: none;
}
.humberger {
color: #ffffff;
}
#nav-drawer {
display: block;
position: relative;
}
#nav-open {
padding:20px 0px 20px 20px;
display: inline-block;
width: 25px;
height: 20px;
vertical-align: middle;
}	
.nav-closed{
display: none;
position: fixed;
z-index: 99;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: black;
opacity: 0;
transition: .3s ease-in-out;   
}  
#nav-content {
overflow: auto;
position: fixed;
top: 0;
left: 0;
z-index: 997;
width: 65%;
height: 100%;
background: #fff;
transition: .3s ease-in-out;
-webkit-transform: translateX(-105%);
transform: translateX(-105%);
}
#nav-input:checked ~ #nav-close {
display: block;
opacity: 0.3;
}
#nav-input:checked ~ #nav-content {
-webkit-transform: translateX(0%);
transform: translateX(0%);
box-shadow: 6px 0 25px rgba(0,0,0,0.15);
}
#menusp ul{
top: 0;
bottom: auto;
margin: 0; 
padding:0; 
width:100%;
}
#menusp li{ 
padding:0.1em;
margin: 0;
width:100%;
clear: left;
display:inline-block;
vertical-align: middle;
}
#menusp li :hover{
color: #ffffff;
opacity: 1;
animation-duration: 6s;
}
#menusp li a{
letter-spacing: 0;
display: block; 
padding: 0.2em 0.8em 0.1em;
text-decoration: none;
color: #333;
margin: 0px;
text-align: left;
font-size:20px;
}
#menusp li a:hover{
color: #333;
}
.menusp_close{
font-weight: 700;
padding: 0.8em 0;
position: fixed;
bottom: 0;
text-align: center;
color: #ffffff;
background-color: #0c1d39;
width: 100%;
letter-spacing: 0.3em;
}
.menusp_moji{
font-size:1.5em;
color: #0c1d39;
font-weight: 700;
padding: 1em 0 0.5em 0.8em;
text-align: left;
margin-bottom:0.5em;
}
.nownow{
color:#0c1d39;
}
.line.now.is{
background-color:#ed8ec4;
}
#one,#two,#three,#four{
font-weight: 900;
font-size:15px;
display: inline-block;
vertical-align: middle;
}
#one::before{
padding-right:18px;
padding-left:4px;
}
#two::before{
padding-right:19px;
padding-left:1px;
}
#three::before{
padding-right:12px;
padding-left:0px;
}
#four::before{
padding-right:16px;
padding-left:0px;
}
	
/*フッター*/
.pagetop{
width:50px;
}
	
/*段落*/
main p{
margin: 0.4em 0.5em 2.5em 0.5em;
line-height: 1.9;
}
	
/*文字*/
h1{
text-align:center;
border-bottom: 4px solid #0c1d39;
color: #0c1d39;
width:100%;
font-size:30px;
line-height: 1.8; 
margin-bottom:0em;
}
h2{
border-left: 4px solid #0c1d39 ;
padding-left:10px;
margin-bottom:0px;
font-size:15px;
line-height:1.6;
}
h3 {
font-family: 'Fjalla One', sans-serif;
display: inline-block;
position: relative;
padding: 0 0em;
transform: translateX(-50%);
text-align:center;
width: 1000px;
font-size:40px;
margin-bottom:0;
line-height: 1; 
}
h3::before,
h3::after {
content: '';
display: inline-block;
position: absolute;
top: 80%;
height: 3px;
background-color: #0c1d39;
}
h3#comment::before,h3#comment::after{
width: 35%;
}
h3#sns::before,h3#sns::after{
width: 40%;
}

h3#stage::before,h3#stage::after{
        width: 30%;
        }
h4{
text-align:left;
color: #0c1d39;
font-size:20px;
margin-bottom:0em;
}

/*トップページ*/
#topb1{
font-size:17px;
}
	
/*トップページ（上）*/
.indextop{
font-family:'Zen Antique', serif;
font-size:25px;
display: flex;
flex-direction: column;
}
.poster{
width:300px;
margin:  0 auto;
}
.about{
display:flex;
flex-direction: column;
position:relative;
padding-left:.5em;
margin-top:1.8em;
line-height:1.4;
font-size:22px;
}
.about2{
padding-left:0.7em;
}
.about3{
font-size:28px;
}
.about4{
font-size:23px;
margin-top:0.1em;
}
.about5{
font-size:70px;
margin-top:0.1em;
}
.about5 rt{
font-size:15px;
text-align: center;
}

/*トップページ(事前申し込みgoogle form)*/

.form{
width:300px;
height: auto;
margin: 0.5em 0 0 0;
}

/*トップページ（インフォメーション）*/
.info img{
width:70px;
height:70px;
float: left;
padding-left:.5em;
}
.info ul{
display: inline-block;
margin-top:0.2em;
padding-left:2.5em;
padding-right:1em;
margin-bottom:0;
}
.info li{
line-height: 2.1;
}
.infoinfo{
flex-direction: column;
}
.infop{
float: left;
margin:0em 1em 0 1.5em;
width:90%;
}
.infom{
font-size:20px;
font-weight: bold;
}
	
/*企画一覧（選択画面）*/
.kikaku ul{
margin: 1em -1em;
width:100%;
}
.kikaku li {
list-style: none;
float: left;
width: 40%;
text-align: center;
margin: 0.5em;
letter-spacing: 0.05em;
}
	
/*企画一覧（内容）*/

.modal-wrapper .modal-window {
box-sizing: border-box;
display: inline-block;
z-index: 20;
position: relative;
width: 100%;
max-width: 80vw;
margin-top:4em;
background: #fff;
box-shadow: 0 0 30px rgba(0, 0, 0, .6);
vertical-align: middle;
}

.modal-wrapper .modal-window .modal-content {
max-height: 80vh;
overflow-y: auto;
text-align: left;
}
.modal-overlay {
z-index: 10;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, .8);
}
.modal-content{
font-size:19px;
margin: 1.5em;
text-align: center;
}
.nw{
width: 50vw;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
flex-direction: column;
-webkit-justify-content: center; /*Safari*/
justify-content: center;
text-decoration: none;
align-items: center;
padding:1em 1em;
margin-left:.5em;
}
.nwitem{
text-decoration:none;
color: #000;
display: inline;
}
.nwitem img{
width:50vw;
border:1px solid #0c1d39
align-items: center;
margin-right:0em;
}
.width20{
width:60vw;
}
.classname{
position: relative;
padding: 0.3em;
background: #b0c4de;
font-size:13px;
}
.kikakuname.top{
font-size:20px;
border-bottom: 1px solid #666;
margin-bottom:6px;
margin-top:6px;
}
.setsumei{
margin-top:0.8em;
font-size:12px;
line-height: 1.8;
}
.gaiyo{
padding: 0.1em 0.6em 0.1em;
margin: 1em 0.5em;
border: solid 1px #000000;
display:inline-block;
font-size: 12px;
border-radius: 10px;
background-color: #b0c4de;
}
#modal-close{
right: 10px;
}


/*カウントダウン*/
.count {
position: relative;
margin: 3em auto 19px auto;
padding: .1em 0em .1em .1em;
background-color: #ed8ec4;
width:180px;
font-size:15px;
z-index:0!important;
text-align:center;
}
#date{
font-size:20px;
}
	
/*公演予定*/
.timeline{
width:95%;
}
.stagewart{
font-weight:bold;
font-size:20px;
}
	
/*アクセス*/
.access{
width:95%;
}
.access2{
width:95%;
}
.accessul{
margin-left:-1em;
}
	
/*トップページ（SNS）*/
.sns{
        display:flex;
        align-items: center;
        margin-top:2em;
        padding: 0em 0.5em .5em;
        margin: 0 auto
        }

.instagram{
        display: flex;
        width:90%;
        align-items: center;
        border: solid 1.5px;
        padding: 0em 0em .5em;
        margin:0 auto;
        }
#tx,#ig{
display: inline-block;
position: relative;
font-weight: 900;
font-size:2em;
border: solid 1.5px;
margin-top:-1em;
top:0;
margin-bottom:.5em;
background:#f3eed5;
}
#tx{
border-radius: 70%;
padding: 1px 14px;
}
#ig{
border-radius: 70%;
padding: 1px 16px;
}
.instagram-media{
margin-right: auto !important;
margin-left: auto !important;
}
	
/*シェア*/
.sharetw{
border-radius: 60%;
padding: 1px 12px;
margin-right:0.5em;
}
.sharefb{
border-radius: 60%;
padding: 1px 17px;
margin-right:0.4em;
}
.shareli{
border-radius: 60%;
padding: 1px 13px;
}

/*見せない*/
.pc_unshown{
display: block;
}
}

.fade-in {
opacity: 0;
transform: translateY(20px); 
 animation: fadeInUp 1.5s ease forwards;
}
@keyframes fadeInUp {
to {
 opacity: 1;
transform: translateY(0);
}
}