@charset "utf-8";
body#top{
background-color: #90332c;
color: #fff;
}
#fullWrap {
min-width:1200px;
}
.header {
display: flex;
min-height: 640px;
min-width:1200px;
}
.header__left {
width:70%;
order:0;
}
.header__left--img {
width:100%;
padding-top:74.1626%;
background:url(../img/photo.jpg) no-repeat center center / contain;
}
.header__right {
width: 30%;
order:1;
position: relative;
}
.header__center {
height:100%;
max-height:100vh;
min-height: 640px;
width:100%;
position: sticky;
left:0;
top:0;
}
.header__center:before {
content:'';
position: absolute;
left:41%;
right:41%;
bottom:6.29%;
height:11.25%;
}
.header__title {
position: absolute;
left:7.4175%;
right:7.4175%;
top:22%;
bottom:22%;
background:url(../img/logo.png) no-repeat center center / contain;
}
.header__screen {
position: absolute;
left:3.6%;
right:3.6%;
top:13.3887%;
height:2.0947%;
background:url(../img/header_screen.png) no-repeat center center / contain;
}
.header__sns {
height:58px;
position: absolute;
left:0;
right:90px;
display: flex;
justify-content: center;
align-items: center;
top:0;
}
.header__official {
display: flex;
height:32px;
padding-right:30px;
align-items: center;
}
.header__share {
display: flex;
height:32px;
align-items: center;
}
.header__sns--title {
font-size:16px;
color:#FFF;
padding-right:9px;
}
.header__sns--link {
width:34px;
height:34px;
}
.hsl--a {
display: block;
height:34px;
transition:all 0.3s ease;
}
.hsl--a:hover {
transform:translateY(-5px);
}
.hsl--twitter {
background:url(../img/common/icon_tw.svg) no-repeat center center / 20px auto;
}
.hsl--facebook {
background:url(../img/common/icon_fb.svg) no-repeat center center / 17px auto;
}
.hsl--line {
background:url(../img/common/icon_line.svg) no-repeat center center / 18px auto;
}
@media screen and (max-width:768px) {
#fullWrap {
min-width:320px;
}
.header {
min-width:0;
display: block;
position: relative;
padding-top:138%;
}
.header__left {
position: absolute;
width:100%;
order:0;
left:0;
top:0;
padding-top:126.6666%;
background:url(../img/photo_s.jpg) no-repeat center center / contain;
}
.header__left--img {
display: none;
}
.header__right {
left:0;
top:0;
bottom:0;
width:100%;
position: absolute;
z-index:50;
}
.header__center {
max-height:100%;
position: block;
left:0;
top:0;
position: absolute;
}
.header__center:before {
display: none;
}
.header__title {
position: absolute;
left:27.6vw;
right:auto;
top:6.1333vw;
bottom:auto;
width:44.9333vw;
height:46.6666vw;
}
.header__screen {
position: absolute;
left:0;
right:0;
top:auto;
bottom:0;
height:11.3333vw;
background:#330300 url(../img/header_screen.png) no-repeat center center / 88vw auto;
}
.header__sns {
display: none;
}
}
.main__title {
height: 64px;
background: #330300 url(../img/main_title.svg) no-repeat center center / auto 65px;
margin-bottom:40px;
}
.startDate {
	background:#330300;
	padding:0px 0;
}
.startDate__text {
	color:#FFF;
	width:1200px;
	margin:0 auto;
	font-size:82px;
	line-height:58px;
	transform:translateY(-4px);
	text-align: center;
}
.startDate__text small {
	font-size:52px;
}
.startDate__text .amp {
	font-size:62px;
}
.main__textwrap {
padding: 50px 0;
width:1140px;
margin:0 auto;
}
.main__text--caption {
font-size: 24px;
margin-bottom: 36px;
}
.main__text--about {
font-size: 16px;
font-weight: 400;
}
.main__text--about p {
margin-bottom: 16px;
line-height:2.2;
}
.main__circle {
width: 600px;
height: 300px;
border-radius: 300px 300px 0 0;
background-color: #330300;
position: relative;
margin: 0 auto;
}
.main__circle--text{
font-size: 50px;
line-height:1.24;
text-align: center;
position: absolute;
width: 600px;
top: 60%;
left: 50%;
-webkit-transform : translate(-50%,-50%);
transform : translate(-50%,-50%);
}
.main__circle--text small {
font-size:30px;
}
.main__circle--text .amp {
font-size:45px;
}
@media screen and (max-width:768px) {
.main__title {
height: 25.6vw;
background: #D95347 url(../img/main_title_s.svg) no-repeat left center / auto 100%;
position: relative;
margin-bottom:0;
}
.main__title:before {
content:'';
position: absolute;
width:12.8vw;
height:12.8vw;
right:14.1333vw;
top:6.2666vw;
background:url(../img/header_logoicon.png) no-repeat center center / contain;
}
.startDate {
background:#330300;
padding:0px 0;
}
.startDate__text {
color:#FFF;
width:100%;
margin:0 auto;
font-size:4.0rem;
line-height:3rem;
transform:translateY(-2px);
text-align: right;
}
.startDate__text small {
font-size:2rem;
}
.startDate__text .amp {
font-size:3rem;
}
.main__textwrap {
padding: 6.6666vw 0;
width:89.3333vw;
}
.main__text--caption {
font-size: 1.3rem;
margin-bottom: 1.8rem;
text-align: center;
letter-spacing: 0.01em;
}
.main__text--about {
font-size: 1.1rem;
font-weight: 400;
letter-spacing: 0.07em;
}
.main__text--about p {
margin-bottom: 1rem;
}
.main__circle {
width: 80vw;
height: 40vw;
border-radius: 40vw 40vw 0 0;
}
.main__circle--text{
font-size: 2.5rem;
width: 100%;
top: 60%;
}
.main__circle--text small {
font-size:1.5rem;
}
.main__circle--text .amp {
font-size:2.2rem;
}
}
.link{
background:#FFF;
display: flex;
width: 100%;
height: 200px;
justify-content: center;
padding-top:60px;
}
.link__jp {
background-color: #f3f3f3;
width: 360px;
position:relative;
}
.link__a {
display: block;
width: 100%;
height: 100%;
text-align: center;
position: relative;
transition:all 2s ease;
}
.link__a--img{
width: 100px;
height: 100px;
position: absolute;
top: 50%;
left: 50%;
margin-left:-50px;
margin-top:-50px;
transition:all 2s ease;
}
.link__a:hover {
background:rgba(134,43,38,0.1);
}
.link__a:hover .link__a--img {
transform:scale(1.1);
}
.link__a--name{
background-color: #000;
font-family: sans-serif;
width: 110px;
height: 30px;
line-height: 30px;
position: absolute;
bottom: 0;
right:0;
margin-left: auto;
text-align: center;
pointer-events: none;
}
@media screen and (max-width: 768px) {
.link{
padding-top:10vw;
height: 28.6666vw;
}
.link__jp {
background-color: #f3f3f3;
width: 60%;
position:relative;
}
.link__a--img{
width: 11vw;
height: 11vw;
margin-left:-5.5vw;
margin-top:-5.5vw;
transition:none;
}
.link__a--name{
width: 19.7333vw;
height: 4.8vw;
line-height: 4.8vw;
font-size:0.9rem;
margin-left: -9.8666vw;
}
}
.footer{
width: 100%;
min-width: 1200px;
background-color: #fff;
color: #000;
padding: 60px 0px 0px 0px;
}
.footer__text{
text-align: center;
margin-bottom: 30px;
font-size:12px;
font-weight: 600;
line-height:2.2;
}
.button__top {
background-color: #862b26;
width: 60px;
height: 60px;
border-radius: 50%;
position: fixed;
bottom: 20px;
right: 20px;
text-align: center;
opacity:0;
pointer-events: none;
transition:all 0.3s ease;
}
.button__top.active {
opacity:1;
pointer-events: auto;
}
.button__top--a{
display: block;
width: 100%;
height: 100%;
transition:all 0.3s ease;
}
.button__top--img{
width: 30px;
position: absolute;
top: 45%;
left: 50%;
-webkit-transform : translate(-50%,-50%);
transform : translate(-50%,-50%);
}
.button__top--a:hover {
transform:scale(1.2);
}
.footer__sns {
display: none;
}
@media screen and (max-width: 768px) {
.footer{
min-width: 100%;
background-color: #fff;
color: #000;
padding: 9.0666vw 0px 0px 0px;
}
.button__top {
background-color: #330300;
width: 10.6666vw;
height: 10.6666vw;
bottom: auto;
right: auto;
position: relative;
margin:0 auto 4.5333vw;
opacity:1 !important;
pointer-events: auto !important;
}
.button__top--a{
transition:none;
}
.button__top--img{
width:4.9333vw;
position: absolute;
top: 45%;
left: 50%;
}
.footer__sns {
height:11.4666vw;
display: flex;
justify-content: center;
align-items: center;
margin-bottom:5.6vw;
}
.footer__official {
display: flex;
height:11.4666vw;
padding-right:6.6666vw;
align-items: center;
}
.footer__share {
display: flex;
height:11.4666vw;
align-items: center;
}
.footer__sns--title {
font-size:1.5rem;
color:#330300;
padding-right:0.7rem;
}
.footer__sns--link {
width:11.4666vw;
height:11.4666vw;
}
.fsl--a {
display: block;
height:11.4666vw;
}
.fsl--twitter {
background:url(../img/common/icon_tw_br.svg) no-repeat center center / auto 5.6vw;
}
.fsl--facebook {
background:url(../img/common/icon_fb_br.svg) no-repeat center center / auto 5.6vw;
}
.fsl--line {
background:url(../img/common/icon_line_br.svg) no-repeat center center / auto 5.6vw;
}
.footer__text{
text-align: center;
margin-bottom: 1.8rem;
font-size:0.8rem;
font-weight: 600;
line-height:2.2;
}
}
.loading {
background:#862b26;
position: fixed;
left:0;
top:0;
right:0;
bottom:0;
z-index:3000;
}

.credits{
	width: 100%;
	padding: 30px 0;
	background: #90332c;
}
.credits__img{
	width: 500px;
	margin: 0 auto;
}
.credits__img img{
	width: 500px;
}
@media screen and (max-width: 768px) {
	.credits__img{
		padding: 6.6666vw 0;
        width: 89.3333vw;
	}
	.credits__img img{
		width: 89.3333vw;
	}
}



/** TOP CONT **/
.main__section{
	padding: 50px 0 50px;
	width: 100%;
}
.mSec_h2{
	padding: 24px 0;
	font-size: 64px;
	font-weight: 600;
	text-align: center;
	font-family: 'Barlow Condensed', sans-serif;
	line-height: 1;
}
.mSec_h2.ja{
	font-family: 'Noto Sans JP',"Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
}

@media screen and (max-width: 768px){
	.main__section{
		padding: 6.6666vw 0;
	}
	.mSec_h2{
		padding: 0 3.2vw;
		font-size: 3.2rem;
	}
}

/** Top NEWS **/
#tNews{
	background-color: #fff;
	padding-top: 0;
	padding-bottom: 72px;
}
#tNews .mSec_h2{
	padding-top: 72px;
	padding-bottom: 48px;
	color: #862b26;
}
#tNews .news_ttl{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

@media screen and (max-width: 768px){
	#tNews{
		padding-bottom: 36px;
	}
	#tNews .mSec_h2{
		padding-top: 36px;
		padding-bottom: 24px;
	}
}

/** NEWS COMMON **/
.newsLists{
	display: block;
	width: 100%;
	margin-bottom: 48px;
}
.newsList{
	width: 100%;
	border-bottom: 1px solid #862b26;
}
.newsListIn{
	width: 1060px;
	display: block;
	margin: 0 auto;
}
.newsLink{
	width: 100%;
	display: flex;
	padding: 36px 0;
	text-decoration: none;
	font-weight: 500;
	font-size: 20px;
	line-height: 2;
}
.news_date{
	width: 140px;
	flex-shrink: 0;
	letter-spacing: 0;
	color: #862b26;
}
.news_ttl{
	width: calc(100% - 140px);
}
.news_date time, .news_ttl span{
	transition: background-size .3s ease;
	background: linear-gradient(#862b26, #862b26) right bottom / 0 2px no-repeat;
}
.newsLink:hover .news_date time, .newsLink:hover .news_ttl span {
	background-position: left bottom;
	background-size: 100% 2px;
}
.btn_news{
	text-align: center;
	font-weight: 500;
}
.btn_news a{
	display: inline-block;
	font-size: 20px;
	font-weight: 500;
	line-height: 1;
	padding: 24px 64px;
	text-decoration: none;
	color: #fff;
	background: #862b26;
	border: 2px solid #862b26;
	transition: .3s ease;
	position: relative;
}
.btn_news a:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transition: background-size .3s ease;
	background: linear-gradient(#fff, #fff) right bottom / 0 100% no-repeat;
}
.btn_news a:hover{
	color: #862b26;
}
.btn_news a:hover::before{
	background-position: left bottom;
	background-size: 100% 100%;
}
.btn_news a span{
	position: relative;
	z-index: 2;
}

@media screen and (max-width: 768px){
	.newsLists{
		margin-bottom: 24px;
	}
	.newsListIn{
		width: 89.3334%;
	}
	.newsLink{
		padding: 18px 0;
		font-size: 1.2rem;
	}
	.news_date{
		width: 100px;
	}
	.news_ttl{
		width: calc(100% - 100px);
	}
	.btn_news a{
		font-size: 1.2rem;
		padding: 12px 32px;
		border-width: 1px;
	}
}


/** Top MOVIE **/
#movie{
	padding: 24px 0 72px;
}
#movie .mSec_h2{
	padding-bottom: 48px;
}
.movieWrap{
	width: 1140px;
	margin: 0 auto 0;
}
.movieInWrap{
	width: 100%;
	padding-top: 56.25%;
	position: relative;
}
.movieInWrap iframe{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

@media screen and (max-width: 768px){
	#movie{
		padding: 24px 0 36px;
	}
	#movie .mSec_h2{
		padding-bottom: 24px;
	}
	.movieWrap{
		width: 89.3334%;
	}
}


/** TOP TICKET **/
#ticket{
	padding: 24px 0 36px;
	background-color: #fff;
	color: #000;
}
#theater{
	padding: 24px 0 72px;
	background-color: #fff;
	color: #000;
}
#ticket .mSec_h2,
#theater .mSec_h2{
	color: #90332c;
	font-size: 48px;
}
.ticketSelects{
	width: 100%;
	display: flex;
	justify-content: center;
	margin: 48px auto;
}
.ticketSelect{
	margin: 0 20px;
}
.ticketSelect a{
	display: inline-block;
	padding: 12px 80px;
	font-size: 20px;
	text-decoration: none;
	color: #fff;
	background-color: #862b26;
	border: 1px solid #862b26;
	transition: .3s ease;
	position: relative;
}
.ticketSelect a:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transition: background-size .3s ease;
	background: linear-gradient(#fff, #fff) right top / 100% 0 no-repeat;
}
.ticketSelect a:hover{
	color: #862b26;
}
.ticketSelect a:hover::before{
	background-position: right top;
	background-size: 100% 100%;
}
.ticketSelect a span{
	position: relative;
	z-index: 2;
}

.ticketContWrap{
	width: 1140px;
	margin: 0 auto 48px;
}
.ticketContWrap:last-child{margin-bottom: 0;}
.ticket_h3{
	color: #862b26;
	font-size: 26px;
	font-weight: 700;
	margin-bottom: 24px;
	text-align: center;
}
.ticket_h4{
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 12px;
}
.ticket_txt{
	font-size: 16px;
	line-height: 2;
	font-weight: 500;
}
.ticket_txt span{
	background-color: #862b26;
	color: #fff;
	font-weight: 700;
	padding: 10px;
}
.ticket_caution{
	margin-top: 12px;
	font-size: 14px;
}
.ticket_caution p{
	padding-left: 1em;
	text-indent: -1em;
	line-height: 1.8;
}
.ticket_m_top{
	font-size: 18px;
	text-align: center;
	line-height: 2;
	font-weight: 500;
	margin-bottom: 40px;
}
.mTicketSelects{
	display: flex;
	justify-content: center;
	margin-bottom: 24px;
}
.mTicketSelect{
	margin: 0 20px;
}
.mTicketSelect button{
	display: inline-block;
	padding: 12px 48px;
	font-size: 20px;
	text-decoration: none;
	color: #fff;
	background-color: #862b26;
	border: 1px solid #862b26;
	transition: .3s ease;
	position: relative;
}
.mTicketSelect button:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transition: background-size .3s ease;
	background: linear-gradient(#fff, #fff) right top / 100% 0 no-repeat;
}
.mTicketSelect button:hover, .mTicketSelect button.is-active{
	color: #862b26;
}
.mTicketSelect button:hover::before, .mTicketSelect button.is-active:before{
	background-position: right top;
	background-size: 100% 100%;
}
.mTicketSelect button span{
	position: relative;
	z-index: 2;
}
.mTicketCont{
	display: block;
	margin-bottom: 32px;
}
.mTicketCont.is-show{
	display: block;
}
.mTicketCont:last-child{
	margin-bottom: 0;
}
.theaterLink{
	text-align: center;
	margin-top: 48px;
}
.theaterLink a{
	display: inline-block;
	font-size: 20px;
	font-weight: 500;
	line-height: 1;
	padding: 24px 64px;
	text-decoration: none;
	color: #fff;
	background: #862b26;
	border: 1px solid #862b26;
	transition: .3s ease;
	position: relative;
	margin: 0 20px;
}
.theaterLink a:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transition: background-size .3s ease;
	background: linear-gradient(#fff, #fff) right bottom / 0 100% no-repeat;
}
.theaterLink a:hover{
	color: #862b26;
}
.theaterLink a:hover::before{
	background-position: left bottom;
	background-size: 100% 100%;
}
.theaterLink a span{
	position: relative;
	z-index: 2;
}

@media screen and (max-width: 768px){
	#ticket,#theater{
		padding: 24px 0 36px;
	}
	#ticket .mSec_h2,
	#theater .mSec_h2{
		font-size: 2.4rem;
	}
	.ticketSelects{
		margin: 24px auto;
	}
	.ticketSelect{
		margin: 0 10px;
	}
	.ticketSelect a{
		padding: 12px 40px;
		font-size: 1.2rem;
	}
	.ticketContWrap{
		width: 89.3334%;
	}
	.ticket_h3{
		font-size: 1.8rem;
		margin-bottom: 12px;
	}
	.ticket_h4{
		font-size: 1.5rem;
		margin-bottom: 12px;
	}
	.ticket_txt{
		font-size: 1.2rem;
	}
	.ticket_caution{
		margin-top: 6px;
		font-size: 1.1rem;
	}
	.ticket_m_top{
		font-size: 1.4rem;
		margin-bottom: 20px;
	}
	.mTicketSelects{
		margin-bottom: 24px;
	}
	.mTicketSelect{
		width: calc(50% - 20px);
		margin: 0 10px;
	}
	.mTicketSelect button{
		width: 100%;
		text-align: center;
		padding: 12px 24px;
		font-size: 1.2rem;
	}
	.theaterLink{
		margin-top: 24px;
	}
	.theaterLink a{
		font-size: 1.2rem;
		padding: 12px 32px;
		margin-bottom: 24px;
	}
	.theaterLink a:last-child{
		margin-bottom: 0;
	}
}
.ticketimg img{
	width: 100%;
	margin-top: 20px;
}
.ticketimg_s{
	margin-bottom: 20px;
}
.ticketimg_s img{
	border: 1px solid #000;
}
@media screen and (max-width: 768px){
	.ticketimg_s img{
		width: 100%;
	}
}

.ticket_pWrap{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 40px;
}
.ticket_pWrap .ticket_m_top{
	padding-left: 48px;
	margin-bottom: 0;
}
.ticket_pWrap .ticketimg_s{
	height: 320px;
}
.ticket_pWrap .ticketimg_s img{
	height: 100%;
}
@media screen and (max-width: 768px){
.ticket_pWrap{
	margin-bottom: 20px;
}
.ticket_pWrap .ticketimg_s{
	width: 35%;
	height: auto;
	max-width: 230px;
}
.ticket_pWrap .ticket_m_top{
	width: 65%;
	padding-left: 3.5821%;
}
.ticket_pWrap .ticketimg_s img{
	height: auto;
	width: 100%;
}
}


#pTicket{
	padding: 48px 0 72px;
	margin-bottom: 72px;
	border-top: 1px dashed #862b26;
	border-bottom: 1px dashed #862b26;
}
#mTicket{
	padding-bottom: 72px;
	border-bottom: 1px dashed #862b26;
}
.mvtk_flex{
	display: flex;
	width: 50%;
	justify-content: center;
	margin: 0 auto;
}
.mvtk_flex_l{
	flex-shrink: 0;
}
.mvtk_img{
	pointer-events: none;
	pointer-events: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-touch-callout: none;
	-moz-user-select: none;
	touch-callout: none;
	user-select: none;
	padding-left: 24px;
	width: 240px;
}
.mvtk_img img{
	width: 100%;
}
#mTicket_cvs .mvtk_flex{
	display: block;
}
.mvtk_widgetWrap{
	margin: 48px auto 0;
	padding-bottom: 30px;
}
#mvtk-widgets-container{
	margin: 0 auto;
}

@media screen and (max-width: 768px){
#pTicket{
	padding: 24px 0 36px;
	margin-bottom: 36px;
}
#mTicket{
	padding-bottom: 36px;
}
.mvtk_flex{
	width: 100%;
	flex-direction: column;
}
.mvtk_img{
	width: 100%;
	text-align: center;
	margin-top: 24px;
	padding-left: 0;
}
.mvtk_img img{
	width: 70%;
}
.mvtk_widgetWrap{
	margin-top: 24px;
}
}