@charset "utf-8";

body{width: 100%;
	min-width: 1200px;
	background: rgba(0,0,0,1.00);
	overflow-y: scroll;}

.font-kai1{font-family: ro-nikkatsu-sei-kai-std, serif;
font-weight: 400;
font-style: normal;}

.font-gothm1{font-family: a-otf-midashi-go-mb31-pr6n,sans-serif;
font-weight: 600;
font-style: normal;}

.spacer1{clear: both;
	font-size: 0.8vw;
	line-height: 100%;}

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

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

.loading_img{height: 100px;
	/*-webkit-animation:blink 2s linear infinite;
	-moz-animation:blink 2s linear infinite;
	-ms-animation:blink 2s linear infinite;
	-o-animation:blink 2s linear infinite;
	animation:blink 2s 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;}
}
@keyframes blink {
	0% {opacity:0;}
	40% {opacity:1.0;}
	60% {opacity:1.0;}
	100% {opacity:0;}
}

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

#container{display: none;
	min-width: 1200px;}

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

.bg_box2,.bg_box3{width: 100%;
	height: 100vh;
	position: fixed; top: 0; left: 0;
	overflow: hidden;}
	
.bg_box2{background: url("../img/page2_1.png");
	background-size: 200% 100%;
	background-repeat: repeat-x;
	webkit-animation:roop 10s linear infinite;
	-moz-animation:roop 10s linear infinite;
	animation:roop 10s linear infinite;}
	
.bg_box3{background: url("../img/page1_1.png");
	background-size: 200% 100%;
	background-repeat: repeat-x;
	webkit-animation:roop 20s linear infinite;
	-moz-animation:roop 20s linear infinite;
	animation:roop 20s linear infinite;}

@-webkit-keyframes roop {
	0% {background-position: 0 0;}
	100% {background-position: 200%,0}
}
@-moz-keyframes roop {
	0% {background-position: 0 0;}
	100% {background-position: 200%,0}
}
@keyframes roop {
	0% {background-position: 0 0;}
	100% {background-position: -200%,0}
}

.contents_fadein1{opacity: 0.0;}
	
.isAnimate { -webkit-animation:blink2 0.5s linear forwards;
	-moz-animation:blink2 0.5s linear forwards;
	animation:blink2 0.5s linear forwards;}

@-webkit-keyframes blink2 {
	0% {opacity:0;}
	100% {opacity:1.0;}
}
@-moz-keyframes blink2 {
	0% {opacity:0;}
	100% {opacity:1.0;}
}
@keyframes blink2 {
	0% {opacity:0;}
	100% {opacity:1.0;}
}

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

header{width: 100%;
	overflow: hidden;
	position: fixed; top: 0; left: 0;
	z-index: 3;}

	
.anim1,.anim2{opacity: 0;}


.isAnimate1 { -webkit-animation:slide1 0.2s linear forwards;
	-moz-animation:slide1 0.2s linear forwards;
	animation:slide1 0.2s linear forwards;}

@-webkit-keyframes slide1 {
	0% {opacity:0;
	transform: translateX(10%);}
	100% {opacity:1.0;
	transform: translateX(0);}
}
@-moz-keyframes slide1 {
	0% {opacity:0;
	transform: translateX(10%);}
	100% {opacity:1.0;
	transform: translateX(0);}
}
@keyframes slide1 {
	0% {opacity:0;
	transform: translateX(10%);}
	100% {opacity:1.0;
	transform: translateX(0);}
}

.isAnimate2 { -webkit-animation:slide2 0.3s linear forwards;
	-moz-animation:slide2 0.3s linear forwards;
	animation:slide2 0.3s linear forwards;}

@-webkit-keyframes slide2 {
	0% {opacity:0;
	transform: translateY(50px);}
	100% {opacity:1.0;
	transform: translateY(0);}
}
@-moz-keyframes slide2 {
	0% {opacity:0;
	transform: translateY(50px);}
	100% {opacity:1.0;
	transform: translateY(0);}
}
@keyframes slide2 {
	0% {opacity:0;
	transform: translateY(50px);}
	100% {opacity:1.0;
	transform: translateY(0);}
}

.isAnimate3 { -webkit-animation:lenge1 0.3s linear 0.3s forwards;
	-moz-animation:lenge1 0.3s linear 0.3s forwards;
	animation:lenge1 0.3s linear 0.3s forwards;}

@-webkit-keyframes lenge1 {
	0% {opacity:0;
	width: 0%;}
	100% {opacity:1.0;
	width: 100%;}
}
@-moz-keyframes lenge1 {
	0% {opacity:0;
	width: 0%;}
	100% {opacity:1.0;
	width: 100%;}
}
@keyframes lenge1 {
	0% {opacity:0;
	width: 0%;}
	100% {opacity:1.0;
	width: 100%;}
}

.ofh{overflow: hidden;}

.pc_menu{width: 18%;
	min-width: 220px;
	position: fixed; top: 70px; left: 20px;}

.pc_menu_logo{width: 100%;
	padding-bottom: 20px;}
	
.pc_menu_btn1{width: 100%;
	padding-bottom: 10px;
	transition:0.5s all;}
	
.pc_menu_btn1:hover{transform:scale(1.1,1.1);}

.main_img{width: 100%;
	height: 100vh;
	min-height: 550px;
	text-align: center;
	overflow: hidden;}
	
.main_img img{width: 50%;
	margin: 0 auto;}

.bar1{width: 100%;
	height: 20px;
	background: rgba(160,135,81,1.00);}
	
.bar2{width: 100%;
	height: 20px;
	background: rgba(149,30,35,1.00);}

.bar_spacer{width: 100%;
	height: 5px;}

.introduction_box{width: 100%;
	padding: 30px 0;
	text-align: center;
	color: rgba(255,255,255,1.00);
	background: url("../img/bg1.png");
	background-size: 100% 100%;}

.introduction_text1{display: inline-block;
	text-align: left;
	font-size: 2.2vw;
	line-height: 120%;}
	
.introduction_text2{display: inline-block;
	text-align: left;
	font-size: 1.05vw;
	line-height: 150%;}

.con_block1{width: calc(60% - 40px);
	padding: 20px;
	margin: 0 auto;
	background: url("../img/bg2.png");
	background-size: 100% 100%;}
	
.con_title1{width: 30%;}

.con_block1 a{color: rgba(0,195,255,1.00);}

.bar3{width: 100%;
	height: 10px;
	background: rgba(160,135,81,1.00);}

.bar4{width: 100%;
	height: 5px;
	background: rgba(146,30,34,1.00);}

.text1{font-size: max(1.2vw,16px);
	line-height: 150%;}

.text2{font-size: max(1.4vw,18px);
	line-height: 150%;}
	
.text3{font-size: max(1.0vw,14px);
	line-height: 150%;}

.cast_name1{font-size: max(1.8vw,22px);
	line-height: 150%;}

.schedule_table_box1{width: 80%;
	min-width: 600px;
	margin: 0 auto;}
	
.schedule_table_box1 table{width: 100%;}
	
.schedule_td1{width: 33%;
	padding: 5px 0;
	text-align: center;
	vertical-align: middle;
	background: rgba(149,30,35,1.00);}
	
.schedule_td2{padding: 5px 0;
	text-align: center;
	vertical-align: middle;
	color: rgba(0,0,0,1.00);
	background: rgba(255,255,255,1.00);}

.caution1{font-size: max(0.9vw,12px);
	line-height: 150%;}

.caution1 table{width: 100%;
	font-size: max(0.9vw,12px);
	color: rgba(255,255,255,1.00);
	line-height: 150%;}

.caution_td1{width: 15%;}


.map_box{width: 100%;
	height: 290px;}
	
.map_box iframe{width: 100%;
	height: 100%;}

.link_btn1{width: 40%;
	margin: 10px auto 0;
	font-size: max(1.2vw,16px);
	background: rgba(0,155,255,1.00);
	border-radius: 5px;
	transition:0.5s all;}
	
.link_btn2{width: 20%;
	margin: 10px auto 0;
	font-size: max(1.0vw,16px);
	line-height: 200%;
	text-align: center;
	background: rgba(0,155,255,1.00);
	border-radius: 5px;
	transition:0.5s all;}

.link_btn1 a,.link_btn2 a{display: block;
	color: rgba(255,255,255,1.00);}
	
.link_btn1:hover,.link_btn2:hover{transform:scale(1.1,1.1);}

.member_entry_btn{width: 25%;
	margin: 0 auto;
	font-size: max(1.2vw,18px);
	line-height: 200%;
	text-align: center;
	border-radius: 5px;
	background:rgba(255,150,0,1.00);
	transition:0.5s all;}

.member_entry_btn a{display: block;
	color: rgba(255,255,255,1.00);}
	
.member_entry_btn:hover{transform:scale(1.08,1.08);}

.information_block1{width: 55%;
	min-width: 600px;
	margin: 0 auto;
	color: rgba(255,255,255,1.00);}

.information_title1{line-height: 180%;}

.information_text1 a{color: rgba(0,195,255,1.00);}

.information_text1 a:hover{opacity: 0.7;}

.line1{width: 100%;
	height: 1px;
background:rgba(255,255,255,1.00);}

.app_link{width: 15vw;
	min-width: 200px;
	margin: 5px 0;
	line-height: 200%;
	border-radius: 5px;
	text-align: center;
	background: rgba(0,195,255,1.00);}

.app_link:hover{opacity: 0.7;}

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

footer{width: 100%;
	padding: 50px 0;
	text-align: center;
	background:rgba(146,30,34,1.00);}

.footer_logo{width: 15%;
	margin: 0 auto;}
	
.footer_logo img{width: 100%;}

.footer_contact{font-size: max(0.9vw,15px);
	line-height: 150%;
	color: rgba(255,255,255,1.00);}
	
.footer_contact a{color: rgba(255,255,255,1.00);}

.copyright{width: 100%;
	padding-top: 20px;
	font-size: max(0.9vw,15px);
	line-height: 150%;
	color: rgba(255,255,255,1.00);
	text-align: center;}

ul.listmarker1 {font-size: max(0.9vw,14px);
	list-style-type: none;
	margin-left:0.85vw;
	line-height: 150%;
}
	
ul.listmarker1 li:before {
	content: '※'; 
	margin-left:-0.85vw; 
}

ul.listmarker2 {
	list-style-type: none;
	margin-left:16px;
}
	
ul.listmarker2 li:before {
	content: '・'; 
	margin-left:-16px; 
}

ul.listmarker3{margin-left: 3vw;}

ul.listmarker3 li{list-style: decimal;}

ul.listmarker3 li  {
	list-style-type:none;
	counter-increment: cnt;
	padding:0;
	}
ul.listmarker3 li  {
	list-style-type:none;
	text-indent:-2.2em;
	padding:0;
	}
ul.listmarker3 li:before  {
	display: marker;
	content: "( "counter(cnt) " ) ";
	}

.align1{text-align: center;}  /*center center*/
.align2{text-align: center;}  /*center left*/
.align3{text-align: left;}  /*left center*/
.align4{text-align: left;}  /*left left*/
.inline{display: inline-block;
	text-align: left;}

	
	
	

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

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

.loading_block{width: 300px;
	height: 60px;
	text-align: center;
	position: fixed; top: 50%; left: 50%;
	margin: -50px 0 0 -150px;}

.loading_img{height: 60px;}

.bg_box{background: url("../img/bg_sp2.jpg");
	background-size: 100% 100%;}

#container{margin-top: 0;
	min-width: 0;}

.contents_fadein{opacity: 1.0;}

.main_img{width: 100%;
	height: auto;
	min-height: 0;
	text-align: center;
	overflow: hidden;}
	
.main_img img{width: 100%;
	margin: 0 auto;}

.bar1{width: 100%;
	height: 10px;
	background: rgba(160,135,81,1.00);}
	
.bar2{width: 100%;
	height: 10px;
	background: rgba(149,30,35,1.00);}

.bar_spacer{width: 100%;
	height: 5px;}

.introduction_box{width: 100%;
	padding: 30px 0;
	text-align: center;
	color: rgba(255,255,255,1.00);
	background: url("../img/bg1.png");
	background-size: 100% 100%;}

.introduction_text1{width: 90%;
	display: block;
	margin: 0 auto;
	text-align: left;
	font-size: 2.2vw;
	line-height: 120%;}
	
.introduction_text2{width: 90%;
	display: block;
	margin: 0 auto;
	text-align: left;
	font-size: 3.6vw;
	line-height: 150%;}

.con_block1{width: calc(90% - 20px);
	padding: 20px 10px;}
	
.con_title1{width: 60%;}

.bar3{width: 100%;
	height: 5px;
	background: rgba(160,135,81,1.00);}

.bar4{width: 100%;
	height: 3px;
	background: rgba(146,30,34,1.00);}

.text1{font-size: max(4vw,12px);
	line-height: 150%;}

.text2{font-size: max(4.4vw,13px);
	line-height: 150%;}

.text3{font-size: max(3.6vw,10px);
	line-height: 150%;}

.cast_name1{font-size: max(5.0vw,18px);
	line-height: 150%;}

.schedule_table_box1{width: 100%;
	min-width: 0;
	margin: 0 auto;}
	
.schedule_table_box1 table{width: 100%;}
	
.schedule_td1{width: 33%;
	padding: 5px 0;
	text-align: center;
	vertical-align: middle;
	background: rgba(149,30,35,1.00);}
	
.schedule_td2{padding: 5px 0;
	text-align: center;
	vertical-align: middle;
	color: rgba(0,0,0,1.00);
	background: rgba(255,255,255,1.00);}

.caution1{font-size: max(3.4vw,10px);
	line-height: 150%;}

.caution1 table{font-size: max(3.4vw,10px);}

.caution_td1{width: 32%;
	min-width: 65px;}

.map_box{width: 100%;
	height: 290px;}
	
.map_box iframe{width: 100%;
	height: 100%;}

.link_btn1{width: 95%;
	margin: 10px auto 0;
	font-size: max(3.6vw,14px);
	background: rgba(0,155,255,1.00);
	border-radius: 5px;
	transition:0.5s all;}
	
.link_btn1 a,.link_btn2 a{display: block;
	color: rgba(255,255,255,1.00);}
	
.link_btn1:hover,.link_btn2:hover{transform:scale(1.0,1.0);}

.member_entry_btn{width: 60%;
	margin: 0 auto;
	font-size: max(3.6vw,14px);}

.member_entry_btn a{display: block;
	color: rgba(255,255,255,1.00);}
	
.member_entry_btn:hover{transform:scale(1.00,1.00);}

.information_block1{width: 90%;
min-width: 0;}

.information_text1 a:hover{opacity: 1.0;}
	
.app_link{width: 100%;}
	
.app_link:hover{opacity: 1.0;}
	
footer{}

.footer_logo{width: 40%;}



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

ul.listmarker3{margin-left: 10vw;}
	
.align1{text-align: center;}  /*center center*/
.align2{text-align: left;}  /*center left*/
.align3{text-align: center;}  /*left center*/
.align4{text-align: left;}  /*left left*/
	
}
















