/* main */
#main{
display: block;
padding: 0 2.5vw 20px 2.5vw;
position: relative;
text-align: center;
}

#main h2{
width: 100%;
height: calc(100vh - 2.5vw - 80px - 20px);
display: block;
background: url(../img/main.svg) no-repeat center top 35%;
background-size: 88% auto;
text-indent: -9999px;
}

#main.visual h2{
width: 100%;
height: calc(100vh - 5vw - 80px);
display: block;
background: url(../img/main_logo.svg) no-repeat center center;
background-size: auto 60%;
position: absolute;
top: 0;
left: 0;
text-indent: -99999px;
overflow: hidden;
z-index: 80000;
}

#main.visual .fukuokaDate{
width: 210px;
height: 0;
display: block;
padding-top: 172px;
background: url(../img/main_date.svg) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 62px;
right: 52px;
overflow: hidden;
z-index: 80001;
}

/* dvd */
#main.visual.wDvd .fukuokaDate{
width: 120px;
height: 0;
display: block;
padding-top: 100px;
background: url(../img/main_date.svg) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 12px;
bottom: 72px;
right: 12px;
overflow: hidden;
z-index: 80001;
}

.dvdBanner{
width: calc(100% - 5vw);
display: block;
margin: 0 2.5vw 0 2.5vw;
padding: 50px 0 30px 0;
background-color: #fafaed;
}

.dvdBanner a{
width: auto;
height: 0;
display: block;
padding-top: 30%;
background: url(../img/banner/b_dvd_sp.png) no-repeat center center;
background-size: contain;
overflow: hidden;
}

/* last */
#main.visual.last{
width: calc(100% - 5vw);
height: calc(100vh - 5vh - 120px);
margin: 20px 2.5vw 30px 2.5vw;
background: url(../img/ending02.jpg) no-repeat center center;
background-color: #ffffff;
background-size: cover;
position: relative;
}

#main.visual.last h2{
width: 100%;
height: calc((100vh - 5vh - 120px)*0.25);
display: block;
margin: 0 0 0 0;
padding: 0;
background: url(../img/txt_ending.png) no-repeat center center;
background-size: contain;
position: relative;
top: 20px;
left: auto;
}

#main.visual.last .mainBtnList{
width: 100%;
display: block;
position: absolute;
bottom: 15px;
left: 0;
text-align: center;
}
#main.visual.last .mainBtnList ul{
width: 67%;
display: block;
margin: 0 auto 0 auto;
}
#main.visual.last .mainBtnList ul li{
display: block;
margin: 10px 0 0 0;
}
#main.visual.last .mainBtnList ul li a{
display: block;
background: url(../img/arr_r_w.svg) no-repeat right 30px center;
background-size: auto 10px;
background-color: #ff4800;
line-height: 8vh;
border: 4px solid #d5d5d5;
border-radius: 2.5vh;
color: #ffffff;
font-size: 2rem;
font-weight: 700;
}


/* main Poster */
.mainImg{
width: 88vw;
height: calc(100vh - 5vw - 80px);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 0 auto 2.5vw auto;
}
.mainImgSp{
display: none;
}
.mainImg .mainImgLeft{
width:calc(45% - 6px);
height: calc(100% - 15px);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.mainImg .mainImgRight{
width: 55%;
height: calc(100% - 15px);
display: block;
}

.mainImg .mainImgLeftTop{
width:100%;
height:36%;
display: block;
background:url(../img/main/t_lt.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
}
.mainImg .mainImgLeftBottom{
width:100%;
height:calc(64% - 6px);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 6px;
}

.mainImg .mainImgLeftBottomL{
width:48%;
height:100%;
display: block;
position: relative;
}
.mainImg .mainImgLeftBottomL1{
width:100%;
height:25%;
display: block;
background:url(../img/main/t_lbl1.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImg .mainImgLeftBottomL2{
width:100%;
height:calc(25% - 6px);
display: block;
margin-top: 6px;
background:url(../img/main/t_lbl2.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImg .mainImgLeftBottomL3{
width:100%;
height:calc(50% - 6px);
display: block;
margin-top: 6px;
background:url(../img/main/t_lbl3.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImg .mainImgLeftBottomR{
width:calc(52% - 6px);
height: 100%;
display: block;
}
.mainImg .mainImgLeftBottomR1{
width:100%;
height:46%;
display: block;
background:url(../img/main/t_lbr1.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImg .mainImgLeftBottomR2{
width:100%;
height:calc(27% - 6px);
display: block;
margin-top: 6px;
background:url(../img/main/t_lbr2.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImg .mainImgLeftBottomR3{
width:100%;
height:calc(27% - 6px);
display: block;
margin-top: 6px;
background:url(../img/main/t_lbr3.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}

.mainImg .mainImgRightTop{
width: 100%;
height: 42%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
}
.mainImg .mainImgRightTop1{
width:54%;
height:100%;
display: block;
}
.mainImg .mainImgRightTop11{
width:100%;
height:54%;
display: block;
background:url(../img/main/t_rt11.jpg) no-repeat center top;
background-size: cover;
background-color:#72ac6f;
}
.mainImg .mainImgRightTop12{
width:100%;
height:calc(46% - 6px);
display: block;
margin-top: 6px;
background:url(../img/main/t_rt12.jpg) no-repeat center top;
background-size: cover;
background-color:#72ac6f;
}
.mainImg .mainImgRightTop2{
width:calc(46% - 6px);
height:88%;
display: block;
position: relative;
top: 12%;
}
.mainImg .mainImgRightTop21{
width:100%;
height:58%;
display: block;
background:url(../img/main/t_rt21.jpg) no-repeat center top;
background-size: cover;
background-color:#72ac6f;
}
.mainImg .mainImgRightTop22{
width:100%;
height:calc(42% - 6px);
display: block;
margin-top: 6px;
background:url(../img/main/t_rt22.jpg) no-repeat center center;
background-size: cover;
background-color:#72ac6f;
}
.mainImg .mainImgRightBottom{
width: 100%;
height: calc(58% - 21px);
display: block;
margin-top: 6px;
position: relative;
}
.mainImg .mainImgRightBottom1{
width:100%;
height:52%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.mainImg .mainImgRightBottom1L{
width: calc(51% - 6px);
height:100%;
display: block;
background:url(../img/main/t_rb1l.jpg) no-repeat center top;
background-size: cover;
background-color:#52ac2f;
}
.mainImg .mainImgRightBottom1R{
width: 49%;
height:100%;
display: block;
background:url(../img/main/t_rb1r.jpg) no-repeat center center;
background-size: cover;
background-color:#54ac6a;
}
.mainImg .mainImgRightBottom2{
width:100%;
height:calc(52% - 6px);
display: block;
margin-top: 6px;
background:url(../img/main/t_rb2.jpg) no-repeat center center;
background-size: cover;
background-color:#72ac6f;
}


/* catch */
#catch{
display: block;
margin: 54px 0 0 0;
padding: 64px 0 108px 0;
background: url(../img/bg_statement.png) no-repeat center top;
text-align: center;
}
#catch h3{
height: 0;
display: block;
padding-top: 96px;
background: url(../img/txt_laugh.svg) no-repeat center center;
background-size: contain;
overflow: hidden;
}
#catch .statementTxt{
display: block;
margin: 48px 0 0 0;
font-size: 2.4rem;
font-weight: 900;
font-style: italic;
line-height: 2;
text-align: center;
transform:rotate(-2deg);
}
#catch .statementTxt p{
display: block;
margin: 24px 0 0 0;
}
#catch .statementTxt p span{
display: block;
font-size: 4rem;
}

/* ticket */
#ticket{
display: block;
margin: 0;
padding: 54px 2.5vw 122px 2.5vw;
background-color: #ffffff;
text-align: center;
}
#ticket h2{
display: inline-block;
margin: 0 auto 0 auto;
text-align: center;
color: #57ac6f;
position: relative;
z-index: 5000;
letter-spacing: 0.5px;
}
#ticket h2 span{
background: url(../img/bar_tit2.png) no-repeat center bottom;
background-size: 100% 20px;
}

#ticket h3{
display: inline-block;
margin: 42px auto 0 auto;
font-size: 3.2rem;
text-align: center;
}

#ticket .btnBanner{
display: block;
margin: 32px 2.5vw 0 2.5vw;
}
#ticket .btnBanner a{
display: block;
}
#ticket .btnBanner a img{
width: 100%;
height: auto;
}

.ticketList{
width: 880px;
display: block;
margin: 24px auto 0 auto;
}
.ticketList li{
display: block;
margin: 12px 0 0 0;
padding: 0 15px 0 0;
background-color: #ffffff;
border: 4px solid #231815;
}
.ticketList li.now{
padding: 0 15px 0 0;
background-color: #ffffff;
border: 4px solid #57ac6f;
}
.ticketList li:first-child{
margin: 0 0 0 0;
}
.ticketList li dl{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.ticketList li dt{
width: 150px;
display: block;
padding: 24px 5px 24px 5px;
font-weight: 700;
text-align: center;
background-color: #231815;
color: #ffffff;
}
.ticketList li.now dt{
background-color: #57ac6f;
color: #ffffff;
}
.ticketList li dd{
width: calc(100% - 150px);
display: block;
padding: 24px 0 24px 15px;
font-size: 1.8rem;
font-weight: 500;
text-align: left;
}
.ticketList li dd p{
display: inline-block;
float: right;
margin-left: 20px;
font-size: 1.4rem;
font-weight: 400;
text-align: left;
}
.ticketList li dd span{
width: 42px;
height: 42px;
display: inline-block;
border-radius: 21px;
margin-right: 10px;
font-size: 1.5rem;
font-weight: 700;
line-height: 42px;
text-align: center;
background-color: #57ac6f;
color: #ffffff;
}

.ticketList li.now dd{
color: #231815;
}

.ticketList li:after{
content: "";
display: block;
clear: both;
height: 0;
visibility: hidden;
}


#ticket .btn{
width: 460px;
display: block;
margin: 42px auto 0 auto;
text-align: center;
}
#ticket .btn a{
display: block;
background: url(../img/arr_r.svg) no-repeat right 20px center;
background-size: auto 12px;
background-color: #ffffff;
color: #231815;
border: 4px solid #231815;
font-size: 2.8rem;
font-weight: 700;
font-style: italic;
line-height: 62px;
filter: drop-shadow(3px 4px 0 rgba(35,24,21,1));
}


/* cast */
#cast{
display: block;
margin: 0;
padding: 54px 2.5vw 122px 2.5vw;
background-color: #ffffff;
text-align: center;
}
#cast h2{
display: inline-block;
margin: 0 auto 0 auto;
text-align: center;
color: #57ac6f;
position: relative;
z-index: 5000;
letter-spacing: 0.5px;
}
#cast h2 span{
background: url(../img/bar_tit2.png) no-repeat center bottom;
background-size: 100% 20px;
}
#cast p.txt{
display: block;
margin: 24px 0 0 0;
}
#cast .col3.stanger{
margin: 36px 0 0 0;
}
#cast.col3.stanger li{
padding: 10px 5px 5px 5px;
background: linear-gradient( -90deg, rgb(242,157,166) 0%, rgb(250,191,27) 50%, rgb(115,198,190) 100%);
box-sizing: border-box;
padding: 0;
background: none;
}
#cast .col3.stanger li img{
width: 100%;
height: auto;
}
#cast .col3.stanger li p{
display: block;
margin: 0 0 16px 0;
font-size: 1.8rem;
font-weight: 700;
font-style: italic;
line-height: 1;
}

#cast h3{
display: inline-block;
margin: 12px auto 0 auto;
padding: 0;
text-align: center;
position: relative;
font-size: 3.2rem;
z-index: 5000;
letter-spacing: 0.5px;
}
#cast h3 span{
background: url(../../img/bar_tit.png) no-repeat center bottom;
background-size: 100% 20px;
}

.castComing{
display: block;
margin: 32px 0 0 0;
font-size: 3.6rem;
font-weight: 700;
color: #57ac6f;
}

#cast .andmore{
width: 100%;
display: block;
margin: 42px 0 0 0;
font-size:5.4rem;
font-weight: 700;
font-style: italic;
transform: rotate(-7deg);
}

#cast .btn{
width: 460px;
display: block;
margin: 42px auto 0 auto;
text-align: center;
}
#cast .btn a{
display: block;
background: url(../img/arr_r.svg) no-repeat right 20px center;
background-size: auto 12px;
background-color: #ffffff;
color: #231815;
border: 4px solid #231815;
font-size: 2.8rem;
font-weight: 700;
font-style: italic;
line-height: 62px;
filter: drop-shadow(3px 4px 0 rgba(35,24,21,1));
}
#cast .btn a:hover{
background: url(../img/arr_r.svg) no-repeat right 10px center;
background-size: auto 12px;
background-color: #ffffff;
filter: drop-shadow(1px 2px 0 rgba(35,24,21,1));
transition: all 0.2s;
}


/* movie */
#movie{
display: block;
margin: 0;
padding: 0;
background: linear-gradient( 180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 51%);
position: relative;
}
#movie .movieBlock{
width: calc(100% - 5vw);
display: block;
margin: 0 0 0 5vw;
padding: 32px 0 32px 0;
background-color: #57ac6f;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
}
#movie .movieBlock .movieContent{
width: 620px;
display: block;
margin-left: calc(50% - 310px - 2.5vw);
}


/* news */
#news{
display: block;
padding: 42px 0 54px 0;
background: url(../img/bg_news.png) no-repeat right 2.5vw top 20px;
background-color: #eaeaea;
text-align: center;
}
#news h2{
display: inline-block;
margin: 0 auto 0 auto;
text-align: center;
position: relative;
z-index: 5000;
letter-spacing: 0.5px;
}
#news h2 span{
background: url(../img/bar_tit.png) no-repeat center bottom;
background-size: 100% 20px;
}
.newsList{
display: block;
margin: 32px 2.5vw 0 2.5vw;
padding: 0 0 22px 0;
border-bottom: 2px solid #231815;
}
.newsList li{
display: block;
margin: 22px 0 0 0;
padding: 22px 0 0 0;
border-top: 2px solid #231815;
}
.newsList li:first-child{
margin: 0 0 0 0;
}
.newsList li dl{
display: block;
}
.newsList li dt{
display: block;
padding: 0 5px 0 5px;
font-weight: 900;
font-style: italic;
text-align: left;
}
.newsList li dt span{
display: inline-block;
margin-left: 18px;
}
.newsList li dt span.tokyo{
color: #eb442e;
}
.newsList li dt span.osaka{
color: #0079ad;
}
.newsList li dt span.fukuoka{
color: #00ae6b;
}
.newsList li dd{
display: block;
text-align: left;
}
.newsList li dd a{
display: block;
padding-right: 40px;
background: url(../img/arr_r_fukuoka.svg) no-repeat right center;
background-size: auto 12px;
text-align: left;
}


#news .btn{
width: 460px;
display: block;
margin: 42px auto 0 auto;
text-align: center;
}
#news .btn a{
display: block;
background: url(../img/arr_r.svg) no-repeat right 20px center;
background-size: auto 12px;
background-color: #ffffff;
color: #231815;
border: 2px solid #231815;
font-size: 2.8rem;
font-weight: 700;
font-style: italic;
line-height: 62px;
filter: drop-shadow(3px 4px 0 rgba(35,24,21,1));
}


/* about */
#about{
display: block;
padding: 0 0 122px 0;
text-align: center;
}
#about h2{
display: inline-block;
margin: 0 auto 0 auto;
text-align: center;
position: relative;
z-index: 5000;
letter-spacing: 0.5px;
}
#about h2 span{
background: url(../img/bar_tit.png) no-repeat center bottom;
background-size: 100% 20px;
}

.aboutList{
width: 880px;
display: block;
margin: 42px auto 0 auto;
padding: 0 0 22px 0;
border-bottom: 2px solid #231815;
}
.aboutList li{
display: block;
margin: 22px 0 0 0;
padding: 22px 5px 0 5px;
border-top: 2px solid #231815;
}
.aboutList li:first-child{
margin: 0 0 0 0;
}
.aboutList li dl{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.aboutList li dt{
width: 120px;
display: block;
font-weight: 900;
text-align: left;
}
.aboutList li dd{
width: calc(100% - 120px);
display: block;
font-weight: 700;
text-align: left;
}
.aboutList li dd span{
display: inline-block;
margin-left: 20px;
font-size: 1.5rem;
font-weight: 400;
text-align: left;
}
.aboutList li dd span a.accessBtn{
display: inline-block;
margin-left: 8px;
padding: 4px 15px 4px 15px;
font-size: 1.2rem;
font-weight: 400;
line-height: 1;
border: 1px solid #231815;
border-radius: 8px;
}

/* timetable */
#timetable{
display: block;
padding: 54px 0 72px 0;
background-color: #57ac6f;
text-align: center;
color: #ffffff;
}
#timetable h2 span{
background: url(../img/bar_tit2.png) no-repeat center bottom;
background-size: 100% 20px;
}
#timetable .txt{
display: block;
margin: 32px 0 0 0;
}
#timetable .timetableBtn li a{
background: url(../img/arr_r.svg) no-repeat right 10px center;
background-size: auto 8px;
background-color: #ffffff;
color: #231815;
}
#timetable .timetableBtn li a:hover{
background: url(../img/arr_r_w.svg) no-repeat right 10px center;
background-size: auto 8px;
background-color: #ff4800;
color: #ffffff;
}


.acfBlock{
display: inline-block;
margin: 54px auto 0 auto;
padding: 20px 0 20px 110px;
background: url(../img/acf.png) no-repeat left center;
background-size: auto 80px;
text-align: left;
}

/* banner */
#banner{
display: block;
padding: 0 0 54px 0;
background-color: #ffffff;
text-align: center;
}
#banner .col1 li{
margin-top: 32px !important;
}
#banner img{
width: 100%;
height: auto;
}

/* cooperate */
#cooperate{
display: block;
padding: 0 0 122px 0;
background-color: #ffffff;
text-align: center;
}

.patron{
display: block;
padding: 72px 0 0 0;
font-size: 1.8rem;
}
.patron dt{
display: block;
font-size: 2rem;
font-weight: 700;
}
.patron dd{
display: block;
margin: 16px 0 0 0;
}

h4.sponcerTit{
display: block;
padding: 72px 0 32px 0;
font-size: 2rem;
font-weight: 700;
}
.sponcerBlock{
width:920px;
display: block;
margin: 0 auto 0 auto;
}
.sponcer{
width: 100%;
display: block;
}
.sponcer li{
width: auto;
display: inline-block;
}
.sponcer li a{
display: block;
}
.sponcer.scol1 li{
margin: 0 0 36px 0;
}
.sponcer.scol2 li{
margin: 0 18px 38px 18px;
}
.sponcer.scol3 li{
margin: 0 20px 38px 20px;
}
.sponcer.scol4 li{
margin: 0 21px 0 21px;
}

.sponcer.scol1 li:nth-child(1){
width: 17.1%;
}
.sponcer.scol1 li:nth-child(2){
width: 8.4%;
}
.sponcer.scol1 li:nth-child(3){
width: 8%;
}

.sponcer.scol2 li:nth-child(1){
width: 6.1%;
}
.sponcer.scol2 li:nth-child(2){
width: 7.4%;
}
.sponcer.scol2 li:nth-child(3){
width: 14.6%;
}
.sponcer.scol2 li:nth-child(4){
width: 6.3%;
}
.sponcer.scol2 li:nth-child(5){
width: 8.4%;
}
.sponcer.scol2 li:nth-child(6){
width: 9.6%;
}
.sponcer.scol2 li:nth-child(7){
width: 11.5%;
}
.sponcer.scol2 li:nth-child(8){
width: 5.8%;
}

.sponcer.scol3 li:nth-child(1){
width: 13%;
}
.sponcer.scol3 li:nth-child(2){
width: 12.5%;
}
.sponcer.scol3 li:nth-child(3){
width: 6.5%;
}
.sponcer.scol3 li:nth-child(4){
width: 6.5%;
}
.sponcer.scol3 li:nth-child(5){
width: 18.6%;
}
.sponcer.scol3 li:nth-child(6){
width: 18.5%;
}

.sponcer.scol4 li:nth-child(1){
width: 6.3%;
}
.sponcer.scol4 li:nth-child(2){
width: 9.7%;
}
.sponcer.scol4 li:nth-child(3){
width: 6.5%;
}
.sponcer.scol4 li:nth-child(4){
width: 7.8%;
}
.sponcer.scol4 li:nth-child(5){
width: 3.5%;
}
.sponcer.scol4 li:nth-child(6){
width: 8%;
}

.sponcer.scol1 li:nth-child(2){
margin-left:75px;
margin-right:119px;
}
.sponcer.scol2 li:first-child,
.sponcer.scol3 li:first-child,
.sponcer.scol4 li:first-child{
margin-left:0;
}
.sponcer.scol2 li:last-child,
.sponcer.scol3 li:last-child,
.sponcer.scol4 li:last-child{
margin-right:0;
}

.sponcer li img{
width: 100%;
height: auto;
}


/* -- */
/* -- */
/* SP */
/* -- */
/* -- */
@media screen and (max-width: 768px) {
/* */
/* */



/* main */
#main{
display: block;
padding: 0 2.5vw 0 2.5vw;
position: relative;
text-align: center;
}

#main h2{
width: 100%;
height: calc(100vh - 2.5vw - 116px);
display: block;
background: url(../img/main_sp.svg) no-repeat center top 43%;
background-size: 95% auto;
text-indent: -9999px;
}

/* dvd */
#main.visual.wDvd h2{
height: calc(100vh - 2.5vw - 116px - 102px);
}
#main.visual.wDvd .fukuokaDate{
width: 120px;
height: 0;
display: block;
padding-top: 100px;
background: url(../img/main_date.svg) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 12px;
bottom: 72px;
right: 12px;
overflow: hidden;
z-index: 80001;
}

.dvdBanner{
width: calc(100% - 5vw);
display: block;
margin: 0 2.5vw 0 2.5vw;
padding: 50px 0 30px 0;
background-color: #fafaed;
}

.dvdBanner a{
width: auto;
height: 0;
display: block;
padding-top: 30%;
background: url(../img/banner/b_dvd_sp.png) no-repeat center center;
background-size: contain;
overflow: hidden;
}

/* last */
#main.visual.last h2{
width: 100%;
height: calc((100vh - 5vh - 120px)*0.25);
display: block;
margin: 0 0 0 0;
padding: 0;
background: url(../img/txt_ending_sp.png) no-repeat center center;
background-size: contain;
position: relative;
top: 10px;
left: auto;
}

#main.visual.last .mainBtnList{
width: 100%;
bottom: 15px;
left: 0;
}
#main.visual.last .mainBtnList ul{
width: 95%;
margin: 0 auto 0 auto;
}
#main.visual.last .mainBtnList ul li{
margin: 10px 0 0 0;
}
#main.visual.last .mainBtnList ul li a{
padding: 3px 20px 3px 20px;
background: url(../img/arr_r_w.svg) no-repeat right 10px center;
background-size: auto 7px;
background-color: #ff4800;
line-height: 1.2;
border: 3px solid #d5d5d5;
border-radius: 15px;
font-size: 1.4rem;
}

.comingTxt{
width: 100%;
display: block;
position: absolute;
bottom: 8vh;
left: 0;
font-size:3rem;
font-weight: 700;
font-style: italic;
color: #999999;
transform: rotate(-7deg);
}

#main.visual h2{
width: 100%;
height: calc(100vh - 5vh - 116px);
display: block;
background: url(../img/main_logo.svg) no-repeat center center;
background-size: 80% auto;
position: absolute;
top: 0;
left: 0;
}

#main.visual .fukuokaDate{
width: 120px;
height: 0;
display: block;
padding-top: 100px;
background: url(../img/main_date.svg) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 12px;
right: 12px;
overflow: hidden;
z-index: 80001;
}


/* main Poster */
.mainImg{
display: none;
}
.mainImgSp{
width: 88vw;
height: calc(100vh - 3vh - 116px);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 0 auto 3vh auto;
}
.mainImgTop{
width: 100%;
height: 32%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
}
#main.visual.wDvd .mainImgSp{
width: 88vw;
height: calc(100vh - 60px - 164px);
height: calc(100vh - 60px - 116px - 40px);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 0 auto 2vh auto;
}

.mainImgCenter{
width: 100%;
height: 50%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 4px;
position: relative;
}
.mainImgUnder{
width: 100%;
height: calc(18% - 8px);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 4px;
position: relative;
}

.mainImgTopLeft{
width: 43%;
display: block;
position: relative;
}
.mainImgTopLeftT{
width: 100%;
height: 47%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
}
.mainImgTopLeftTL{
width: 49%;
height: 100%;
display: block;
background:url(../img/main/t_lbr3.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgTopLeftTR{
width: calc(51% - 4px);
height: 100%;
display: block;
background:url(../img/main/t_rt21_sp.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgTopLeftB{
width: 100%;
height: calc(53% - 4px);
display: block;
margin-top: 4px;
background:url(../img/main/t_rt11.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgTopRight{
width: calc(57% - 4px);
display: block;
background:url(../img/main/t_lt.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
}

.mainImgCenterLeft{
width: 49%;
display: block;
position: relative;
}
.mainImgCenterRight{
width: calc(51% - 4px);
display: block;
position: relative;
}

.mainImgCenterLeft1{
width: 100%;
height: 26%;
display: block;
background:url(../img/main/t_lbr2.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgCenterLeft2{
width: 100%;
height: 42%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 4px;
position: relative;
}
.mainImgCenterLeft2L{
width: 50%;
height: 100%;
display: block;
background:url(../img/main/t_lbr1.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgCenterLeft2R{
width: calc(50% - 4px);
height: 100%;
display: block;
background:url(../img/main/t_rt12.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgCenterLeft3{
width: 100%;
height: calc(32% - 8px);
display: block;
margin-top: 4px;
background:url(../img/main/t_lbl3.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}

.mainImgCenterRight1{
width: 100%;
height: 22%;
display: block;
background:url(../img/main/t_rt22_sp.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgCenterRight2{
width: 100%;
height: 25%;
display: block;
margin-top: 4px;
background:url(../img/main/t_rb1l.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgCenterRight3{
width: 100%;
height: calc(53% - 8px);
display: block;
margin-top: 4px;
background:url(../img/main/t_rb1r.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}

.mainImgUnderLeft{
width: 40%;
height: 100%;
display: block;
position: relative;
}
.mainImgUnderLeft1{
width: 100%;
height: 50%;
display: block;
background:url(../img/main/t_lbl2.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgUnderLeft2{
width: 100%;
height: calc(50% - 4px);
display: block;
margin-top: 4px;
background:url(../img/main/t_lbl1_sp.jpg) no-repeat center top;
background-size: cover;
background-color:#57ac6f;
position: relative;
}
.mainImgUnderRight{
width: calc(60% - 4px);
height: 100%;
display: block;
background:url(../img/main/t_rb2.jpg) no-repeat center center;
background-size: cover;
background-color:#57ac6f;
position: relative;
}


/* catch */
#catch{
margin: 42px 0 0 0;
padding: 36px 2.5vw 72px 2.5vw;
background: url(../img/bg_statement.png) no-repeat center top;
text-align: left;
}
#catch h3{
padding-top: 96px;
background: url(../img/txt_laugh.svg) no-repeat center center;
background-size: contain;
}
#catch .statementTxt{
margin: 24px 0 0 0;
font-size: 2rem;
line-height: 1.8;
text-align: left;
}
#catch .statementTxt p{
margin: 20px 0 0 0;
}
#catch .statementTxt p span{
font-size: 3rem;
}


/* ticket */
#ticket{
padding: 54px 2.5vw 72px 2.5vw;
}
#ticket h2{
}
#ticket h2 span{
background: url(../img/bar_tit2.png) no-repeat center bottom;
background-size: 100% 15px;
}
#ticket h3{
margin: 42px auto 0 auto;
font-size: 2.2rem;
}

#ticket .btnBanner{
margin: 32px 0 0 0;
}
#ticket .btnBanner a{
}

.ticketList{
width: auto;
margin: 24px auto 0 auto;
}
.ticketList li{
margin: 12px 0 0 0;
padding: 0 0 0 0;
background-color: #ffffff;
border: 3px solid #231815;
}
.ticketList li.now{
padding: 0 0 0 0;
border: 3px solid #57ac6f;
}
.ticketList li:first-child{
}
.ticketList li dl{
display: block;
}
.ticketList li dt{
width: auto;
display: block;
padding: 10px 5px 10px 5px;
}
.ticketList li.now dt{
}
.ticketList li dd{
width: auto;
display: block;
padding: 12px 5px 12px 5px;
font-size: 1.6rem;
}
.ticketList li dd p{
display: block;
float: none;
margin-left: 0;
margin-top: 10px;
font-size: 1.4rem;
font-weight: 400;
text-align: left;
}
.ticketList li dd span{
width: 30px;
height: 30px;
display: inline-block;
border-radius: 15px;
margin-right: 8px;
font-size: 1.1rem;
line-height: 30px;
}
.ticketList li.now dd{
}


#ticket .btn{
width: 95%;
margin: 42px auto 0 auto;
}
#ticket .btn a{
background: url(../img/arr_r.svg) no-repeat right 16px center;
background-size: auto 10px;
background-color: #ffffff;
font-size: 2.5rem;
line-height: 54px;
filter: drop-shadow(3px 4px 0 rgba(35,24,21,1));
}



/* cast */
#cast{
margin: 0;
padding: 54px 2.5vw 72px 2.5vw;
background-color: #ffffff;
}
#cast h2{
}
#cast h2 span{
background: url(../img/bar_tit2.png) no-repeat center bottom;
background-size: 100% 15px;
}
#cast p.txt{
margin: 24px 0 0 0;
text-align: left;
}
#cast .col3.stanger{
margin: 36px 0 0 0;
}
#cast.col3.stanger li{
}
#cast .col3.stanger li p{
margin: 0 0 16px 0;
font-size: 1.5rem;
}

#cast h3{
display: inline-block;
margin: 12px auto 0 auto;
padding: 0;
text-align: center;
position: relative;
font-size: 2.4rem;
z-index: 5000;
letter-spacing: 0.5px;
}
#cast h3 span{
background: url(../../img/bar_tit.png) no-repeat center bottom;
background-size: 100% 15px;
}

.castComing{
margin: 32px 0 0 0;
font-size: 1.9rem;
}

#cast .andmore{
margin: 24px 0 0 0;
font-size:4rem;
line-height: 1.3;
}

#cast .btn{
width: 95%;
margin: 42px auto 0 auto;
}
#cast .btn a{
background: url(../img/arr_r.svg) no-repeat right 16px center;
background-size: auto 10px;
background-color: #ffffff;
font-size: 2.3rem;
line-height: 54px;
filter: drop-shadow(3px 4px 0 rgba(35,24,21,1));
}


/* movie */
#movie{
background: linear-gradient( 180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 51%);
}
#movie .movieBlock{
padding: 24px 0 24px 0;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
}
#movie .movieBlock .movieContent{
width: 84%;
margin-left: calc(8% - 2.5vw);
}


/* news */
#news{
margin: 42px 0 0 0;
padding: 42px 0 54px 0;
background: url(../img/bg_news.png) no-repeat right 2.5vw top 10px;
background-size: 90vw auto;
background-color: #eaeaea;
text-align: center;
}
#news h2{
}
#news h2 span{
background: url(../img/bar_tit.png) no-repeat center bottom;
background-size: 100% 15px;
}
.newsList{
margin: 32px 2.5vw 0 2.5vw;
padding: 0 0 18px 0;
border-bottom: 2px solid #231815;
}
.newsList li{
margin: 18px 0 0 0;
padding: 18px 0 0 0;
border-top: 2px solid #231815;
}
.newsList li:first-child{
}
.newsList li dl{
}
.newsList li dt{
padding: 0 2px 0 2px;
}
.newsList li dt span{
display: inline-block;
margin-left: 15px;
}
.newsList li dd{
}
.newsList li dd a{
padding-right: 36px;
background: url(../img/arr_r_fukuoka.svg) no-repeat right center;
background-size: auto 10px;
}

#news .btn{
width: 95%;
margin: 42px auto 0 auto;
}
#news .btn a{
background: url(../img/arr_r.svg) no-repeat right 16px center;
background-size: auto 10px;
background-color: #ffffff;z
font-size: 2.5rem;
line-height: 54px;
filter: drop-shadow(3px 4px 0 rgba(35,24,21,1));
}


/* about */
#about{
padding: 0 0 92px 0;
}
#about h2{
line-height: 1.4;
}
#about h2 span{
background: url(../img/bar_tit.png) no-repeat center bottom;
background-size: 100% 15px;
}

.aboutList{
width: auto;
margin: 42px 2.5vw 0 2.5vw;
padding: 0 0 18px 0;
border-bottom: 2px solid #231815;
}
.aboutList li{
margin: 18px 0 0 0;
padding: 18px 2px 0 2px;
border-top: 2px solid #231815;
}
.aboutList li:first-child{
}
.aboutList li dl{
display: block;
}
.aboutList li dt{
width: auto;
}
.aboutList li dd{
width: auto;
margin-top: 4px;
}
.aboutList li dd span{
display: block;
margin-left: 0;
font-size: 1.2rem;
font-weight: 400;
}
.aboutList li dd span a.accessBtn{
margin-left: 8px;
padding: 2px 10px 2px 10px;
font-size: 1.1rem;
border: 1px solid #231815;
border-radius: 8px;
}

/* timetable */
#timetable{
padding: 54px 0 72px 0;
}
#timetable h2 span{
background: url(../img/bar_tit2.png) no-repeat center bottom;
background-size: 100% 15px;
}
#timetable .txt{
margin: 32px 0 0 0;
text-align: left;
}
#timetable .timetableBtn li a{
background: url(../img/arr_r.svg) no-repeat right 10px center;
background-size: auto 8px;
background-color: #ffffff;
color: #231815;
font-size: 1.7rem;
}
#timetable .timetableBtn li a:hover{
background: url(../img/arr_r_w.svg) no-repeat right 10px center;
background-size: auto 8px;
background-color: #1877a9;
color: #ffffff;
}

.acfBlock{
display: inline-block;
margin: 54px auto 0 auto;
padding: 20px 0 20px 88px;
background: url(../img/acf.png) no-repeat left center;
background-size: auto 62px;
text-align: left;
font-size: 1.1rem;
}

#banner .col1 li{
margin-top: 16px !important;
}


/* cooperate */
#cooperate{
padding: 0 0 92px 0;
}

.patron{
padding: 54px 0 0 0;
font-size: 1.6rem;
}
.patron dt{
font-size: 2rem;
}
.patron dd{
margin: 12px 0 0 0;
}

h4.sponcerTit{
padding: 54px 0 16px 0;
font-size: 2rem;
}
.sponcerBlock{
width:auto;
margin: 42px 20px 0 20px;
}
.sponcer{
}
.sponcer li{
width: auto;
display: inline-block;
}
.sponcer li a{
display: block;
}
.sponcer.scol1 li{
margin: 0 0 8vw 0;
}
.sponcer.scol2{
margin: 0 0 0 0;
}
.sponcer.scol2 li{
margin: 0 0 7.8vw 0;
}
.sponcer.scol3 li{
margin: 0 5.5% 7vw 5.5%;
}
.sponcer.scol4 li{
margin: 0 4% 9vw 4%;
}
.sponcer.scol5 li{
margin: 0 5.3% 8vw 5.3%;
}
.sponcer.scol6 li{
margin: 0 4% 8vw 4%;
}
.sponcer.scol7 li{
margin: 0 5% 0 5%;
}

.sponcer.scol1 li:nth-child(1){
width: 28.6%;
height: auto;
}
.sponcer.scol1 li:nth-child(2){
width: 13.9%;
height: auto;
}
.sponcer.scol1 li:nth-child(3){
width: 13.3%;
height: auto;
}

.sponcer.scol2 li:nth-child(1){
width: 12.4%;
height: auto;
}
.sponcer.scol2 li:nth-child(2){
width: 15%;
height: auto;
}
.sponcer.scol2 li:nth-child(3){
width: 29.9%;
height: auto;
}

.sponcer.scol3 li:nth-child(1){
width: 11%;
}
.sponcer.scol3 li:nth-child(2){
width: 14.8%;
}
.sponcer.scol3 li:nth-child(3){
width: 16.7%;
}
.sponcer.scol3 li:nth-child(4){
width: 20.8%;
}

.sponcer.scol4 li:nth-child(1){
width: 9.2%;
}
.sponcer.scol4 li:nth-child(2){
width: 25%;
}
.sponcer.scol4 li:nth-child(3){
width: 24%;
}
.sponcer.scol4 li:nth-child(4){
width: 12.2%;
}

.sponcer.scol5 li:nth-child(1){
width: 11.4%;
}
.sponcer.scol5 li:nth-child(2){
width: 32.7%;
}
.sponcer.scol5 li:nth-child(3){
width: 32.5%;
}

.sponcer.scol6 li:nth-child(1){
width: 12.2%;
}
.sponcer.scol6 li:nth-child(2){
width: 18.5%;
}
.sponcer.scol6 li:nth-child(3){
width: 12.5%;
}
.sponcer.scol6 li:nth-child(4){
width: 15.1%;
}

.sponcer.scol7 li:nth-child(1){
width: 6.8%;
}
.sponcer.scol7 li:nth-child(2){
width: 15.6%;
}

.sponcer img{
width: 100%;
height: auto;
}

.sponcer.scol1 li:nth-child(1){
margin-left: calc( 2.3% );
margin-right: 0;
}
.sponcer.scol1 li:nth-child(2){
margin-left: calc( 11% );
margin-right: calc( 19% );
}
.sponcer.scol1 li:nth-child(3){
margin-left: 0;
margin-right: calc( 9.6% );
}

.sponcer.scol2 li:nth-child(1){
margin-left: calc( 10% );
margin-right: 0;
}
.sponcer.scol2 li:nth-child(2){
margin-left: calc( 18.8% );
margin-right: calc( 10.8% );
}
.sponcer.scol2 li:nth-child(3){
margin-left: 0;
margin-right: calc( 1% ):
}
.sponcer.scol3 li:nth-child(1){
margin-left: 0;
}
.sponcer.scol3 li:nth-child(4){
margin-left: 6%;
margin-right: 0:
}
.sponcer.scol4 li:nth-child(1){
margin-left: 0;
margin-right: 5%;
}
.sponcer.scol4 li:nth-child(4){
margin-left: 5.5%;
margin-right: 0;
}
.sponcer.scol5 li:nth-child(1){
margin-left: 0;
}
.sponcer.scol5 li:nth-child(3){
margin-right: 0;
}

/* */
/* */
}
/* -- */
/* -- */
/* SP */
/* -- */
/* -- */