@charset "utf-8";

body{
	color:#333333;
	background:url(../img/page_bg.jpg);
	background-attachment: fixed;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
}
:visited,:link{
	color:#333333;
}

@media only screen and (min-width: 768px) {
	#main_txt{
		display:inline-block;
		width:70%;
		margin:0 12%;
		padding:5vw 1.5%;
		background:rgba(255,255,255,0.9);
	}
	#main_txt h2{
		margin:5vw 0 2vw;
		font-size:3vw;
		border-left:solid 5vw #333333;
		border-right:solid 25vw #333333;
		padding-left:2vw;
		background:url(../img/disc_h2.png);
		background-size:contain;
		background-position:left;
		background-repeat:no-repeat;
	}
	#main_txt h3{
		font-size:2.3vw;
		margin-top:2vw;
	}
	#main_txt p,ul,table{
		font-size:1.7vw;
		padding:1vw 0;
	}
	.cd_inst img{
		width:60%;
		margin:0 20%;
	}
/*reservation-button*/
	#reservation_button{
		background:-moz-linear-gradient(top,rgba(255,255,255,.7) 60%,rgba(180,180,180,.7));
		background:-webkit-linear-gradient(top,rgba(255,255,255,.7) 60%,rgba(180,180,180,.7));
		background:linear-gradient(to bottom,rgba(255,255,255,.7) 60%,rgba(180,180,180,.7));
		border-radius:5vw;
		position:fixed;
		width:10vw;
		height:10vw;
		top:70vh;
		left:87vw;
		z-index:2100;
		color:rgba(100,100,100,.8);
	}
	#reservation_button p{
		text-align:center;
		margin-top:0.8vw;
		font-size:2vw;
	}
	#reservation_button:hover{
		background:-moz-linear-gradient(top,#66ccff 60%,#ff9966);
		background:-webkit-linear-gradient(top,#66ccff 60%,#ff9966);
		background:linear-gradient(to bottom,#66ccff 60%,#ff9966);
	}
	#reservation_button:hover a{
		color:#fff;
		-webkit-transition: all 0.2s ease;
		-moz-transition: all 0.2s ease;
		-o-transition: all 0.2s ease;
		transition: all  0.2s ease;
	}
	#reservation_button a{
		margin:0;
		padding:0 100%;
		height:10vw;
		text-decoration:none;
		}
}
@media only screen and (max-width: 768px) {
	#main_txt{
		display:inline-block;
		width:80%;
		margin:0;
		padding:5vw 10%;
		background:rgba(255,255,255,0.9);
	}
	#main_txt h2{
		margin:10vh 0 0;
		text-align:center;
		font-size:5vw;
		background:url(../img/disc_h2_s.png);
		background-size:30vw;
		background-position:center;
		background-repeat:no-repeat;
		border-bottom:solid 1px #333333;
	}
	#main_txt h3{
		text-align:center;
		font-size:4vw;
		margin-top:2vw;
	}
	#main_txt p,ul,table{
		font-size:3vw;
		padding:1vw 0;
	}
	.cd_inst img{
		width:100%;
		margin:0;
	}
/*reservation-button*/
	#reservation_button{
		display:none;
	}
	#reservation_button p{
		display:none;
	}
}
/*top-image*/
#top{
	width:100%;
	height:auto;
	display:inline-block;
}
#top img{
	width:100%;
}
h1{
	font-size:5vw;
	color:#ffffff;
	background:#333399;
	text-align:center;
	padding:7vh 0;
}

/*main-text*/

.list{
	margin-left:2vw;
}
.cd_inst{
	text-align:center;
}
#listening_system{
	margin:0 auto;
}
#listening_system th{
	text-align:right;
}
#listening_system td,th{
	padding:1vw;
}
#listening_system_img{
	margin:50px 5% 0;
	width:90%;
	height:auto;
}
#event_about{
	margin:0 auto;
}
#event_about td,th{
	padding:2vw;
}
#address{
	margin:0 auto;
}
#address td,th{
	padding:1vw;
}

#footer {
	font-size: .75em;
	clear: both;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 15px;
	color: #fff;
	background: #222;
}
#footer ol,#footer ul {
	margin-top: 0;
	margin-bottom: 11px;
	font-size: .75em;
}
#footer li {
	display: inline-block;
	margin-bottom: 1em;
}
#footer li > a {
	border-radius: 0;
	color: #fff;
	border-right: 1px solid #fff;
	padding: 6px 8px;
	margin: 0;
}
#footer :link{
	color:#fff;
}