@charset "utf-8";

body{width: 100%;
	min-width: 1200px;
	overflow-y: scroll;}

.font-goth1{font-family: source-han-sans-japanese, sans-serif;
font-weight: 400;
font-style: normal;}

.font-goth2{font-family: source-han-sans-japanese, sans-serif;
font-weight: 700;
font-style: normal;}
	
.font-goth3{font-family: source-han-sans-japanese, sans-serif;
font-weight: 900;
font-style: normal;}
	
.font-min1{font-family: source-han-serif-japanese, serif;
font-weight: 400;
font-style: normal;}

.font-min2{font-family: kozuka-mincho-pr6n, serif;
font-weight: 700;
font-style: normal;}

.font-min3{font-family: kozuka-mincho-pr6n, serif;
font-weight: 900;
font-style: normal;}

.font-mtn{font-family: a-otf-midashi-mi-ma31-pr6n, serif;
font-weight: 600;
font-style: normal;}

.start_filter{width: 100%;
	height: 100vh;
	position: fixed; top: 0; left: 0;
	background: rgba(255,255,255,1.00);
	z-index: 9999;}

.loading_block{width: 400px;
	height: 152px;
	text-align: center;
	position: fixed; top: 50%; left: 50%;
	margin: -76px 0 0 -200px;}

.loading_img2{height: 152px;
	/*-webkit-animation:blink 1s linear infinite;
	-moz-animation:blink 1s linear infinite;
	-ms-animation:blink 1s linear infinite;
	-o-animation:blink 1s linear infinite;
	animation:blink 1s linear infinite;*/}

@-webkit-keyframes blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}
@-moz-keyframes blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}
@-ms-keyframes blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}
@-o-keyframes blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}
@keyframes blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}

.loading_img1 img,.loading_img2 img{
	height: 100%;}

#container{display: none;}

.bg_box{width: 100%;
	height: 100vh;
	background: url("../img/bg1.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	position: fixed; top: 0; left: 0;
	z-index: 0;}

.contents_fadein{opacity: 0.0;
	-webkit-transition: all 2s;
    -moz-transition: all 2s;
    transition: all 2s;}
	
.isAnimate { opacity: 1;}


#container{width: 100%;
	position: relative;}

.spacer1{font-size: 1.0vw;
	line-height: 100%;}

header{width: 100%;
	height: 50px;
	background: rgba(255,255,255,0.90);
	border-bottom: rgba(166,124,82,0.40) solid 1px;
	overflow: hidden;
	position: fixed; top: 0; left: 0;
	z-index: 9;}
	
.header_img1{height: 40px;
	float: left;
	margin: 5px 10px;}
	
.header_img1 img{height: 100%;}
	
.pc_menu{height: 50px;
	float: left;
	padding-left: 15px;
	overflow: hidden;}
	
.pc_menu_btn1{font-size: 18px;
	line-height: 50px;
	margin: 0 10px;
	float: left;}
	
.pc_menu_btn2{height: 40px;
	margin: 5px 10px;
	float: left;}
	
.pc_menu_btn2 img{height: 100%;
	webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;}
	
.pc_menu_btn1 a{display: block;
	color: rgba(0,0,0,1.00);
	webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;}
	
.pc_menu_btn1 a:hover{color: rgba(255,158,0,1.00);}
	
.pc_menu_btn2:hover{opacity: 0.7;}
	
.main_img{width: 100%;
	min-height: 100vh;
	/*display:flex;
	justify-content: center;
	align-items: center;*/}

.main_img_inner{width: 100%;
	padding: 0;
	margin: 0 auto;}

.main_img1{width: 100%;
	margin: 0 auto;}
	
.main_img1 img{width: 100%;}
	
.main_img_text1{width: 40%;
	margin: 0 auto;}


.con1{width: 100%;
	overflow: hidden;}

.con_bg1{width: 100%;
	background: url("../img/bg_op1.png");
	background-size: 100% auto;
	background-repeat: repeat-y;
	position: fixed; top: 0; left: 0;
	z-index: 1;}
	
.con_bg2{width: 100%;
	background: url("../img/bg_op2.png");
	background-size: 100% auto;
	background-repeat: repeat-y;
	position: fixed; top: 0; left: 0;
	z-index: 2;}
	
.con_bg3{width: 100%;
	background: url("../img/bg_op3.png");
	background-size: 100% auto;
	background-repeat: repeat-y;
	position: fixed; top: 0; left: 0;
	z-index: 3;}

.bg_line{width: 100%;
	text-align: center;
	overflow: hidden;}

.bg_line img{width: 102%;}

.con_inner1{position: relative;
	z-index: 7;}

.con_title1{font-size: max(2.8vw,42px);
	text-align: center;
	color: rgba(0,113,188,1.00);}

.story_text1{font-size: max(1.2vw,20px);
	line-height: 180%;
	text-align: center;}

.staff1{font-size:max(1.2vw,20px);
	text-align: center;}

.cast_img1{width: 10%;
	min-width: 180px;
	margin: 0 auto;}
	
.cast_img1 img{width: 100%;}

.cast_name1{font-size: max(1.0vw,20px);
	line-height: 130%;
	text-align: center;}
	
.cast_name2{font-size: max(1.6vw,28px);
	line-height: 130%;
	text-align: center;}
	
.cast_name3{font-size: max(0.9vw,18px);
	line-height: 150%;
	text-align: center;}

.cast_name4{font-size: max(1.2vw,24px);
	line-height: 150%;
	text-align: center;}

.text1{font-size: max(1.8vw,26px);
	line-height: 150%;
	text-align: center;}
	
.text2{font-size: max(1.2vw,20px);
	text-align: center;}

.text3{font-size: max(1.0vw,16px);
	text-align: center;}

.inline{display: inline-block;
	text-align: left;}

.schedule_table1{width: 60%;
	min-width: 900px;
	margin: 0 auto;
	overflow: hidden;}
	
.schedule_table2{width: 20%;
	min-width: 233px;
	margin: 0 auto;
	overflow: hidden;}
	
.schedule_block1{width: 16%;
	margin: 0 0.33%;
	float: left;}
	
.schedule_block2{width: 49%;
	margin: 0 0.5%;
	float: left;}

.date1{width: 100%;
	font-size: max(1.0vw,18px);
	line-height: 200%;
	text-align: center;
	border-radius: 100px;}
	
.bg_wd{background: rgba(140,198,63,1.00);
	color: rgba(255,255,255,1.00);}
	
.bg_st{background: rgba(41,171,226,1.00);
	color: rgba(255,255,255,1.00);}
	
.bg_sn{background: rgba(255,123,172,1.00);
	color: rgba(255,255,255,1.00);}

.time1,.time2{width: 100%;
	margin-top: 5px;
	font-size: max(1.0vw,18px);
	line-height: 180%;
	border-radius: 100px;
	border: rgba(208,208,208,1.00) solid 1px;
	background: rgba(255,255,255,1.00);
	text-align: center;}

.map{width: 60%;
	min-width: 900px;
	height: 300px;
	margin: 0 auto;}
	
.map iframe{width: 100%;
	height: 100%;}

.ticket_box1{width: 60%;
	min-width: 900px;
	margin: 0 auto;
	overflow: hidden;}
	
.ticket_block1{width: 50%;
	float: left;}

.ticket_block1 .text1,.ticket_block1 .text2{text-align: left;}

.text2 table{width: 100%;
	margin: 5px 0;}
	
.ticket_td1{width: calc(30% - 10px);
	padding: 5px;
	font-size: max(1.0vw,17px);
	text-align: center;
	color: rgba(255,255,255,1.00);
	background: rgba(0,0,0,1.00);
	border-radius: 100px;}

.ticket_td2{width: calc(70% - 40px);
	padding: 5px 20px;
	font-size: max(1.0vw,17px);
	background:rgba(220,220,220,1.00);
	border-radius: 100px;}

.ticket_btn{width: 15%;
	margin: 5px auto;
	font-size: max(1.0vw,16px);
	line-height: 200%;
	background: rgba(0,113,188,1.00);
	border-radius: 100px;}
	
.ticket_btn:hover{opacity: 0.7;}

.ticket_btn a{display: block;
	color: rgba(255,255,255,1.00);}

footer{width: 100%;
	border-top: rgba(189,189,189,1.00)  solid 1px;
	background: rgba(255,255,255,0.80);}

.contact{width: 15%;
	min-width: 300px;
	margin: 0 auto;
	padding: 5px 10px;
	font-size: max(0.85vw,16px);
	text-align: center;
	background: rgba(255,184,90,1.00);
	border-radius: 100px;
	border: rgba(192,192,192,1.00) solid 1px;}
	
.contact a{display: block;
	color: rgba(255,255,255,1.00);}

.copyright{width: 100%;
	font-size: max(0.85vw,16px);
	text-align: center;
	color:rgba(0,0,0,1.00);}

ul.listmarker1 {
	list-style-type: none;
	font-size: 16px;
	margin-left:16px;
}

ul.listmarker1 li:before {
	content: '※'; 
	margin-left:-16px; 
}

ul.listmarker2 li {
	list-style-type: decimal;
	font-size: 16px;
	margin-left: 16px;
}



.information_ex2{width: 100%;
	height: 100vh;
	display: none;
	background: rgba(0,0,0,0.90);
	position: fixed; top: 0; left: 0;
	z-index: 1999;}
	
.information_ex_switch{width: 100%;
	height: 100%;
	position: fixed; top: 0; left: 0;
	z-index: 100;}

.information_ex_inner2{width: calc(90% - 40px);
	height: 70%;
	max-width: 1020px;
	margin: 15vh auto 10%;
	padding: 20px;
	background: rgba(255,255,255,1.00);
	overflow-y: scroll;
	position: relative;
	z-index: 101;
	-ms-overflow-style: none;    /* IE, Edge 対応 */
	scrollbar-width: none;       /* Firefox 対応 */}
	
.information_ex_inner2::-webkit-scrollbar {  /* Chrome, Safari 対応 */
        display:none;}
		
.information_ex_header{text-align: center;
	font-size: max(1.2vw,24px);}

.information_ex_text{text-align: left;
	font-size: max(0.85vw,16px);
	line-height: 170%;
	padding: 40px 0;}
	
.information_ex_footer{text-align: right;
	font-size: max(0.9vw,18px);}

.text1_btn{cursor: pointer;}

.btn_close{width: 40px;
	height: 40px;
	position: fixed; top: 10px; right: 10px;
	z-index: 1999;
	cursor: pointer;}
	
.btn_close2{width: 100px;
	height: 30px;
	margin: 20px auto 0;
	line-height: 30px;
	background: rgba(177,177,177,1.00);
	color: rgba(255,255,255,1.00);
	text-align: center;
	border-radius: 20px;
	cursor: pointer;}
	
.btn_close img,.btn_close2 img{width: 100%;}


.bgm_title1{font-size: max(2.8vw,42px);
	text-align: center;
	color: rgba(0,113,188,1.00);}
	
.bgm_autor{font-size: max(1.0vw,16px);
	line-height: 180%;
	text-align: center;}

.bgm_text1{font-size: max(1.2vw,20px);
	line-height: 180%;
	text-align: center;}




@media screen and ( max-width:736px )
{
body{width: 100%;
	min-width: 320px;}

.loading_block{width: 200px;
	height: 76px;
	text-align: center;
	position: fixed; top: 50%; left: 50%;
	margin: -38px 0 0 -100px;}

.loading_img2{height: 76px;
	/*-webkit-animation:blink 1s linear infinite;
	-moz-animation:blink 1s linear infinite;
	-ms-animation:blink 1s linear infinite;
	-o-animation:blink 1s linear infinite;
	animation:blink 1s linear infinite;*/}

.bg_box{width: 100%;
	height: 100vh;
	background:url("../img/bg_sp1.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	position: fixed; top: 0; left: 0;
	z-index: 0;}

#conttainer{margin-top: 0;}

.spacer1{font-size: 4.0vw;
	line-height: 100%;}

.header_img1{height: 30px;
	float: left;
	margin: 10px;}

.main_img{min-height: 100vh;
	margin-top: 50px;
	/*display:flex;
	justify-content: center;
	align-items: center;*/}

.main_img_inner{width: 100%;
	margin: 0 auto ;}

.main_img1{width: 100%;
	margin: 0 auto;}
	
.main_img_text1{width: 70%;
	margin: 0 auto;}

.con_title1{font-size: 6.0vw;
	text-align: center;
	color: rgba(0,113,188,1.00);}

.story_text1{font-size: 3.2vw;
	line-height: 180%;
	text-align: center;}

.staff1{font-size:3.2vw;
	text-align: center;}

.cast_img1{width: 40%;
	min-width: 100px;
	margin: 0 auto 5px;}

.cast_name1{font-size: 4.0vw;
	line-height: 130%;
	text-align: center;}
	
.cast_name2{font-size: 5.4vw;
	line-height: 130%;
	text-align: center;}
	
.cast_name3{font-size: 3.8vw;
	line-height: 150%;
	text-align: center;}

.cast_name4{font-size:4.4vw;
	line-height: 150%;
	text-align: center;}

.text1{font-size: 5.4vw;
	line-height: 150%;
	text-align: center;}
	
.text2{font-size: 4.4vw;
	text-align: center;}

.text3{font-size: 4.0vw;
	text-align: center;}

.schedule_table1{width: 90%;
	min-width: 0;
	margin: 0 auto;
	overflow: hidden;}
	
.schedule_table2{width: 60%;
	min-width: 0;
	margin: 0 auto;
	overflow: hidden;}
	
.schedule_block1{width: 32%;
	margin: 0 0.5% 15px;
	float: left;}
	
.schedule_block2{width: 48%;
	margin: 0 1%;
	float: left;}

.date1{width: 100%;
	font-size: 4.4vw;}

.time1,.time2{width: 100%;
	margin-top: 5px;
	font-size: 4.4vw;}

.map{width: 90%;
	min-width: 0;
	height: 300px;
	margin: 0 auto;}
	
.map iframe{width: 100%;
	height: 100%;}

.ticket_box1{width: 90%;
	min-width: 0;
	margin: 0 auto;
	overflow: hidden;}
	
.ticket_block1{width: 100%;
	margin-bottom: 20px;
	float: none;}

.ticket_block1 .text1,.ticket_block1 .text2{text-align: left;}

.text2 table{width: 100%;
	margin: 5px 0;}
	
.ticket_td1{width: auto;
	display: block;
	margin-bottom: 2px;
	padding: 5px;
	font-size: 4.0vw;
	text-align: center;
	color: rgba(255,255,255,1.00);
	background: rgba(0,0,0,1.00);
	border-radius: 5px;}

.ticket_td2{width: auto;
	display: block;
	margin-bottom: 5px;
	padding: 5px 20px;
	font-size: 4.0vw;
	text-align: center;
	background:rgba(220,220,220,1.00);
	border-radius: 5px;}

.ticket_btn{width: 60%;
	margin: 5px auto;
	font-size: 3.8vw;
	line-height: 250%;
	background: rgba(0,113,188,1.00);
	border-radius: 100px;}
	
.ticket_btn:hover{opacity: 1.0;}

footer{}

.contact{width: 80%;
	min-width: 250px;
	margin: 0 auto;
	padding: 5px 10px;
	font-size: 4.0vw;
	text-align: center;
	border-radius: 100px;
	border: rgba(192,192,192,1.00) solid 1px;}
	

.copyright{font-size: 3.4vw;}
	
ul.listmarker1 {margin-left:3.6vw;
	font-size: 3.6vw;}
	
ul.listmarker1 li:before {margin-left:-3.6vw;}

ul.listmarker2 li {margin-left:3.6vw;
	font-size: 3.6vw;}

.information_ex_header{text-align: center;
	font-size: 4.2vw;
	line-height: 150%;}

.information_ex_text{text-align: left;
	font-size: 3.6vw;
	line-height: 150%;
	padding: 40px 0;}
	
.information_ex_footer{text-align: right;
	font-size: 3.6vw;}

.bgm_title1{font-size: max(10.0vw,32px);}
	
.bgm_autor{font-size: max(4.6vw,14px);}

.bgm_text1{font-size: max(5.0vw,18px);
	line-height: 180%;
	text-align: center;}
	
}