html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    width: 100%;
    height: 100%;
    min-height:100%;
 background: #ffc801;


}



body {
    margin: 0;
    padding:0;
    font-size:100%;
    width: 100%;
    min-height:100%;
    font-feature-settings:'palt';
    color: #03385d;
font-family: 'Kosugi Maru', sans-serif;
background:url(../images/2022/bg.jpg)no-repeat top center;
background-size: cover;
background-attachment: fixed;

}

a {
    color:#663300;
    text-decoration: none;
}


a:hover, a:active{
text-decoration: underline;
}


p{margin:0;padding:0;}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block;
}
*{
box-sizing:border-box;
}
img{
    vertical-align:bottom;
}
.sp{
display: none;
margin: 0;
padding: 0;
}
.pc{
display: inline;
margin: 0;
padding: 0;
}

#wrapper{
     width:100%;
    max-width:100%;
    padding:0;
    margin:0 auto;
position: relative;
z-index: 300;

}
.bg{
width: 100%;
height: 100%;
margin: 0 auto;
padding: 0;
position: fixed;
z-index: 500;
background:url(../images/2022/bg.png)no-repeat top center;
background-size: 100%;
background-attachment: fixed;
pointer-events:none;
}

#header{
    width:100%;
    margin: 0 auto;
        padding: 0;
    position: relative;
    z-index: 500;
text-align: center;

}



h1 {
    margin:0 auto;
    padding:0;
}
h1 img{
width: 100%;
max-width: 1000px;
margin: 0 auto;
padding: 0;
}


h2 {
    margin:-1em auto 1em;
    padding:0;
text-align: center;


}


.poster{
margin: 0 auto 2em;
padding: 0;
}




#title img{
margin: 0 auto;;
display: block;
}



.contents{
    width:100%;
    margin:0 auto;
    padding: 2em 0 0;
    text-align:center;
        position: relative;
    z-index: 500;
max-width: 760px;
}

h3{
margin: 0;
padding: 0.5em 1em;
background: #036EB8;
color: #FFF100;
border-top-left-radius: 16px;
border-top-right-radius: 16px;
font-size: 1.5rem;
    letter-spacing: 1px;
    line-height: 1.3;
text-align: center;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 800;
border-bottom: 2px dashed #fff;

}

#lead,#price,#schedule,#present,#theater,#trailer{
    width:100%;
    text-align:center;
    line-height:1.5;
    margin:0 auto 2em;
    padding: 0;
    font-weight: bold;
max-width: 760px;
border-radius: 20px;
font-family: 'Kosugi Maru', sans-serif;
background: #54C3F1;
color: #03385d;

}

.inner{
margin: 0 auto;
padding: 1em;
}


p.title{
text-align: center;
font-size: 1.2rem;
color: #fff;
color: #fff;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 800;
transform:rotateZ(0.03deg);
  text-shadow    :
       1px  1px 1px #036eb8,
      -1px  1px 1px #036eb8,
       1px -1px 1px #036eb8,
      -1px -1px 1px #036eb8,
       1px  0px 1px #036eb8,
       0px  1px 1px #036eb8,
      -1px  0px 1px #036eb8,
       0px -1px 1px #036eb8;
}




p{
margin: 0 auto;
line-height: 1.6;
font-size: 100%;
}


#lead{
text-align: left;
/*background: #c1f9ff;*/
}

#lead p{
margin: 0 auto 0.5em;
line-height: 1.5;

}

/*
#price{
background: #ffc0ac;
}

#schedule{
background: #ffe79e;
}

#present{
background: #c1f9ff;
}

#theater{

}
*/

#present p:first-of-type{
margin: 0 auto 0.5em;
padding: 0 0 0.5em;
text-align: center;
font-size: 1.4rem;
font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 800;
    line-height: 1.3;
border-bottom: 2px dashed #fff;

}



ul.check{
margin: 0 auto;
padding: 0;
display: inline-block;
text-align: left;
font-size: 80%;
list-style-type: none;
color: #FFF100;


}
ul.check li{
margin: 0 auto 0.2em;
}

ul.check li:before{
content: '※';

}

#present dl{
margin: 1em auto;
padding: 0;
line-height: 1.3;

border-radius: 10px;
background: #fff;
width: 80%;;
}

#present dl dt{
margin: 0 auto;
padding: 0.5em 0;

font-size: 110%;
color: #fff;
background: #036EB8;
}

#present dl dt:first-of-type{
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}

#present dl dt span{
    font-size: 80%;
    color: #ff6666;
}

#present dl dd{
margin: 0;
padding: 1em;
font-size: 100%;
}

#present img{
margin: 0 auto 1em;
padding: 0;
max-width: 670px;
}



#theater p.end{
color: #fff;
font-size: 110%;
}




#theater .inner .theater_lead{
    margin: 0 auto;
    padding: 1em;
}
#theater .inner .theater_lead ul.check{
color: #03385d;
}

/*劇場一覧部分のスタイル*/


ul.mainmenu{
    max-width: 100%;
}


.navi {
    width: 100%;

    text-align: center;
    margin:0 auto;
    padding: 0;
        border-top-left-radius: 10px;
    border-top-right-radius: 10px;


}
.navi ul.mainmenu {
    font-size: 13px;
    line-height: 2.3;
    font-weight:bold;
    text-align: center;
    width: 100%;
    height: 30px;
    margin: 0 auto;
    padding: 0px;


}
.navi ul.mainmenu li {
   width: calc(100% / 6);
    height: 30px;
    display: block;
    float: left;
    list-style:none;
    border-right: 1px solid #036EB8;
    font-size: 100%;
    background: #FFF100;
        color:#036EB8;
}



.navi ul.mainmenu li a {
    color:#036EB8;
    display: block;
    text-decoration: none;
}

.navi ul.mainmenu li:first-of-type{
border-top-left-radius: 9px;
}

.navi ul.mainmenu li:last-of-type{
    border-right: none;
border-top-right-radius: 9px;
}



.navi ul.mainmenu li:hover {
    background:#036EB8;



}

.navi ul.mainmenu li:last-child:hover{
    border-right: none;
}



.navi ul.mainmenu li a:hover {
    color:#FFF100;

}



.area {
    margin: 0 auto 1.5em;
    padding: 0;
background: #fff;
border-radius: 10px;


}

    #theater .area:nth-of-type(3){
    border-top-left-radius: 0px;
border-top-right-radius: 0px;
    }

    #theater .area:last-of-type{
        margin: 0 auto;
    }

#theater .area .city_box:last-of-type .table:last-of-type{
    border-bottom: none;
}


.area_title {
    text-align: left;
    padding: 0.5em ;
    font-weight: bold;
    color: #FFF100;
    background: #036EB8;
    margin: 0 auto;
    font-size: 120%;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
#theater .area:nth-of-type(3) .area_title{
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}

.city {
    display: block;
    width: 100%;
    background: #b3e0f2;
    color: #036EB8;
    padding: 5px 0.5em;
    text-align: left;
    font-size: 100%;
    margin: 0 auto;
font-weight: bold;
    border-bottom: 1px solid #036EB8;
}


.table {
    width: 100%;
    margin: 0 auto;
    display: table;
        border-bottom: 1px solid #036EB8;
        color: #036EB8;
}

.table a{
color: #036EB8;
}

.table a:hover{
text-decoration: underline;
}

.table.title{
font-weight: bold;
color: #e60012;

}

.tr {
    display: table-row;
    width: 100%;
    margin: 0 auto;
    max-width: 760px;

}

.city_box{
 width: 100%;
 margin: 0 auto;
 padding: 0;

}


.area:last-of-type .city_box:last-of-type{
padding: 0;
}







.td_theater {
    display: table-cell;
    width: 70%;
    text-align: left;
    padding: 5px;
    font-size: 85%;
}

.td_tel {
    display: table-cell;
    width: 30%;
        text-align: left;
    padding: 5px;
    font-size: 85%;
    vertical-align: middle;
}






.movie{
position: relative;
  width: 100%;
  padding-top: 56.25%;
    margin:0 auto ;
}

.movie iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;

}

#footer {
    width: 100%;
    margin:0;
    padding:0;
    text-align: center;
position: relative;
z-index: 500;

}

#footer a:hover{
text-decoration: none;
}

#footer .billing{
margin: 0 auto 1em;
padding: 0 1em;
}
#footer .billing p.title{
color: #fff;
margin: 0 auto;
}
#footer .billing p{
margin: 0 auto 1em;
color: #036EB8;

}

.official{
margin: 0 auto 0.5em;
padding:0;
line-height: 1;
font-family: 'Fredoka One', cursive;


}
.official p{
display: inline-block;
margin: 0;
padding: 0.5em 3em;
background: #036EB8;
color: #FFF100;
letter-spacing: 1px;
        border-radius: 10px;
        font-size: 1.2rem;

}


#footer small{
    font-size:70%;
    display: block;
    margin: 0 auto;
    padding: 0.5em 0;
color: #03385d;

}




#page_top {
    position: fixed;
        z-index: 600;
    bottom: 0.5em;
    right: 0.5em;
    display:block;
    opacity:1;
    z-index: 800;
    margin: 0;
    padding: 0;
    line-height: 1;
    font-size: 2.5rem;
    color: #036EB8;

}
#page_top a{
color: #036EB8;
}



.new{
color: #ff6666;
font-size: 90%;
    font-weight: bold;
}
.news{
color: #fea600;
font-size: 90%;
font-weight: bold;
}




@media screen and (max-width: 1460px) {



}
@media screen and (max-width: 1024px) {



}




@media screen and (max-width: 896px) {

    img{
        max-width: 90%;
    }




h1 img{
max-width: 90vw;
}

    h2{
        margin: -1em auto 1em;
    }



.contents {
width: 95vw;

}







}

@media screen and (max-width:758px){


.sp{
display: inline;
}
.pc{
display: none;

}
.bg{
    background: url(../images/2022/sp_bg.png)no-repeat top center;
    background-size: 100%;
    background-attachment: fixed;
    pointer-events: none;
}



h2{
margin: 0 auto;
}

    h2 img{
max-width: 60vw;
    }





    #lead {
    width: 100%;
        font-size: 90%;
        padding: 0;
        text-align: left;
    }


    h3{
        font-size: 1.2rem;
    }

#present p{
text-align: left;
}


#present dl{
width: 100%;
}

    #present img{
        max-width: 100%;
    }

    #present dl dt{
    font-size: 100%;
    }
    #present dl dd{
    font-size: 90%;
    }

        #theater .inner{
        padding: 1em 0.5em;
    }






.navi{
    max-width: 300px;
    width: 100%;
    height: 60px;
    margin:0 auto 1em;
    border:none;
}

    .navi ul.mainmenu {
    width:100%;
    max-width: 300px;
    font-size: 13px;
    line-height: 30px;
    text-align: center;
    margin: 0 auto;
    padding: 0px;
    height: 60px;
}
.navi ul.mainmenu li {
    width: calc(100% / 3);
    max-width:100px;
    height: 30px;
    box-sizing: border-box;
    text-align: center;
    border-bottom: 1px solid #036EB8;
}

.navi ul.mainmenu li:nth-child(3){
    border-right: none;
border-top-right-radius: 10px;
}

.navi ul.mainmenu li:nth-child(4){

border-bottom-left-radius: 10px;
}

    .navi ul.mainmenu li:last-of-type{
border-top-right-radius:0px;
border-bottom-right-radius: 10px;
}
.navi ul.mainmenu li:nth-of-type(n+4){
    border-bottom:none;
}









.table {
        font-size: 80%;
    }







    .city {
font-size: 90%;

    }






#page_top {
right: 0.5rem;
font-size: 1.8rem;
}



}


@media screen and (max-width:320px){

    h2{
        font-size: 1.3rem;
    }
}