@charset "UTF-8";
/* CSS Document */

body{
	background-color: #000;
}
#theater{
	color: #FFF;
	width: 100%;
	padding: 80px 0;
}
#theater .inner{
	width: 1100px;
	padding: 100px 50px 50px 50px;
	margin: 0 auto;
	box-sizing: border-box;
}
#theater h1{
	width: 500px;
	margin: 0 auto 60px auto;
}
#theater h1 a{
	text-indent: 100%;
	white-space: nowrap;
	background-image: url(../images/logo_theater.png);
	height: 105px;
	overflow: hidden;
	display: block;
}

#theater h3{
	font-family: 'Noto Serif', serif;
	font-size: 2em;
	margin: 0 auto 20px auto;
}
#theater .banner{
	width: 640px;
	margin: 0 auto 40px auto;
}
#theater .banner img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

#theater table{
	width: 1000px;
	margin: 0 auto;
	border-top: solid 1px #ccc;
}
#theater table th{
	font-weight: bold;
	text-align: left;
	padding: 15px;
	border-bottom: solid 1px #ccc;
	box-sizing: border-box;
}
#theater table th:nth-child(1){ width: 15%; }
#theater table th:nth-child(2){ width: 25%; }
#theater table th:nth-child(3){ width: 15%; }
#theater table th:nth-child(4){ width: 15%; }

#theater table th:nth-child(odd),#theater table td:nth-child(odd){ background-color: #333; }
#theater table tr.second td:nth-child(odd){ background-color: #000; }
#theater table tr.second td:nth-child(even){ background-color: #333; }

#theater table td{
	text-align: left;
	vertical-align: middle;
	padding: 15px;
	border-bottom: solid 1px #ccc;
	box-sizing: border-box;
}

#footer{
	background-color: rgba(150, 150, 150, 0.2);
	padding: 40px 0;
}


 

/* --------------------------------------- Media Queries Smartphone --------------------------------------- */
@media only screen and (max-width: 414px) and (orientation: portrait){
	
#theater{
	padding: 40px 0;
}
#theater .inner{
	padding: 50px 25px 25px 25px;
}
#theater h1{
	width: 250px;
	margin: 0 auto 40px auto;
}
#theater h1 a{
	background-size: contain;
	height: 53px;
}

#theater h3{
	font-size: 2rem;
	margin: 0 auto 20px auto;
}
#theater .banner{
	width: 100%;
	padding: 0 10px;
	margin: 0 auto 30px auto;
	box-sizing: border-box;
}

#theater table{
	width: 100%;
	margin: 0 auto;
	border-top: solid 1px #ccc;
}
#theater table th{
	font-weight: bold;
	text-align: left;
	padding: 10px 5px;
	border-bottom: solid 1px #ccc;
	box-sizing: border-box;
}
#theater table th:nth-child(1){ width: 17.5%; }
#theater table th:nth-child(2){ width: auto; }
#theater table th:nth-child(3){ width: 20%; }
#theater table th:nth-child(4){ width: 25%; }
#theater table th:nth-child(5){ display: none; }
#theater table th:nth-child(odd),#theater table td:nth-child(odd){
	background-color: #333;
}
#theater table td{
	text-align: left;
	padding: 10px 5px;
	border-bottom: solid 1px #ccc;
	box-sizing: border-box;
}

#theater table td.hp{
display: none;
}


#footer{
	background-color: rgba(150, 150, 150, 0.2);
	padding: 20px;
}

	
}

@media only screen and (max-width: 320px) and (orientation: portrait){



}