@charset "UTF-8";
body,
#wrapper{
	background:url("../../images/bg.jpg");
	min-height:600px;
}
h1{
	margin:0px auto 30px auto;
	max-width:301px;
}
h5{
	
	text-align:center;
	font-size:14px;
	font-weight:500;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	margin:0px auto 30px auto;
	background:rgba(0,0,0,0.1);
	width:320px;
	padding:5px;
}	
h4{
	margin-bottom:15px;
	font-weight:600;
	font-size:110%;
	color:rgba(0,0,0,0.8);
	letter-spacing:0.2px;
}
.sml{ font-size:85%; font-weight:600;}
#theaters{
	width:95%;
	max-width:800px;
	margin:60px auto 100px auto;
	}
@media screen and (max-width: 640px)  {
	#wrapper{
		min-height:500px;
	}
	h1{
	margin:0px auto 10% auto;
	width:65%;
	}
	h1 img{
	width:100%;
	}
	#theaters{
	margin:13% auto 5% auto;
	width:92%;
	}
	h5{
	
	text-align:center;
	font-size:12px;
	font-weight:500;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	margin:0px auto 10% auto;
	background:rgba(0,0,0,0.1);
	width:280px;
	padding:5px;
}
}

#arealink{
	width:90%;
	text-align:center;
	margin:10% auto 0% auto;
}
#arealink a{
	border-right: 1px solid rgba(0,0,0,0.4);
	padding:0 19px 0 15px;
	color:#000;
	font-size:120%;
	font-weight:600;
	line-height: 1.5em !important
}
#arealink a:hover{
	color:#792c19;
}
#arealink a:active{
	opacity:0.5;
}
#arealink a:last-child{ border-right: 0px solid #ccc;}

@media screen and (max-width: 640px)  {
	
	#arealink a:nth-child(3){ border-right: 0px solid #ccc;}
}

#theater h2{
		padding:10% 3% 0% 3%;
		text-align:center;
		font-size:22px !important;
		font-weight:600 !important;
		background:none !important;
		border-bottom:none !important;
		color:#1c0d00 !important;
		}
.city{width:13%;}
.tname{width:50%;}
.tel{ width:24%;}
.date{width:13%;}

#theater table{
	width:100%;
	}
#theater table td{
	border-bottom:0px dotted rgba(0,0,0,0.3);
	padding:1.5% 3%;
	background:rgba(255,255,255,0.8);
	color:#000;
	text-align:left;
	}
#theater table tr{
	}
#theater table td.tel{
	font-size:90%;
	}
#theater table td.detail{
	text-align:center;
	}
	@media screen and (max-width: 640px)  {
		#theater table td{
		font-size:10px;
		font-weight:500;
		letter-spacing:0;
		padding:1.5% 1.5%;
		}
		#theater table td.tel{
		font-size:9px;
		}
	}
#theater table tr:nth-child(even) td{
		background:rgba(255,255,255,0.9);
	}
	#theater table a{ color:#000;  text-decoration:none; }
	#theater table a:hover{ color:#da3444;  text-decoration:underline; }
	#theater table th{
		color:#000;
		border-bottom:2px solid #3c442a;
		padding:1.5% 3%;
		text-align:left ;
		font-size:13px;
		background:none;
		font-weight:600;
		}
	@media screen and (max-width: 640px)  {
	#theater table th{
	font-size:10px;
	padding:1.5% 1.5%;
	font-weight:700;
	}
	.telNum{ display:none;}
	}	
#theater table th.area{
	padding:12px 5px;
	text-align:center;
	font-size:13px;
	color:#fff;
	border-bottom:0px;
	border-top:0px solid #c53a38;
	}

.update{
	font-size:9px;
	color:#000;
	text-align:right;
	margin-bottom:0px;
	}
#maeuri{
	width:340px;
	display:block;
	margin:20px auto;
}
#maeuri img{
	width:100%;
}
@media screen and (max-width: 640px)  {
	#maeuri{
	width:70%;
	margin:10% auto;
}
	
}
.close{
	font-size:12px;
	font-weight:500;
	width: 40px;
	height: 30px;
	top:20px;
	right:10px;
	position:fixed;
	color:#3c442a;
}
.close span {
	display: block;
	position:absolute;
	width: 40px;
	height:40px;
	background:transparent;
	top:0;
	left:0;
	}
.close p{
	font-size:11px;
	letter-spacing:1.5px;
	color:#3c442a;
	font-weight:600 !important;
	position:absolute;
	top:32px;
	left:2px;
}

	
	.close span:before,
	.close span:after {
	content: " ";
	position: absolute;
	width: 40px;
	height: 2px;
	background: #3c442a;
	}
	
	.close span:before { top:10px; }
	.close span:after { top:10px; }
	
	
	.close span:before {
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	transform: rotate(135deg);
	}
	.close span:after {
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	transform: rotate(-135deg);
	}
@media screen and (max-width: 640px)  {
	.close{
	width: 30px;
	height: 30px;
	top:10px;
	right:10px;
	position:fixed;
}
.close span {
	display: block;
	position:absolute;
	width: 30px;
	height:30px;
	background:transparent;
	top:0;
	left:0;
	}
.close p{
	display:none;
}

	
	.close span:before,
	.close span:after {
	content: " ";
	position: absolute;
	width: 30px;
	height: 2px;
	background: #3c442a;
	}
	
	
}