@charset "UTF-8";
/* CSS Document */


#content {
	padding-top:2%;
}

#content section#main{
	width:95%;
	margin:0 auto;
}


section#main h2{
	margin:0;
	padding:0;
}
section#main h2 img{
	width:70%;
	max-width:658px;
}

h3.new:after{
	content:"NEW";
	background-color:#F00;
	color:#FFF;
	padding:0.1% 1%;
	font-size:75%;
	display:inline-block;
	margin-left:1%;
	vertical-align:2px;
}

h3.update:after{
	content:"UPDATE";
	background-color:#ff9900;
	color:#FFF;
	padding:0.1% 1%;
	font-size:70%;
	display:inline-block;
	margin-left:1%;
	vertical-align:2px;
}

h4{
	display:inline-block;
	margin:7px 0;
	padding:2px 15px 2px 0;
	border:1px #888 dotted;
	border-width:0 0 0 0;
	font-size:120%;
}

.event .button,
.event .button2,
.tieup .button,
.tieup .button2{
	width:40%;
	display:block;
	border:1px #666 solid;
	border-radius:5px;
	background:linear-gradient(to bottom,#FFF,#AAA);
	padding:0.5% 4%;
	text-align:center;
	text-decoration:none;
	font-weight:bold;
	text-shadow:1px 1px 3px #FFF;
	color:#111;
	margin-top:2%;
}


#btn_back a{
	display:inline-block;
	padding:3px 20px;
	background:linear-gradient(to bottom,#FFF,#DDD);
	border:1px #AAA solid;
	border-radius: 5px 5px 0 0;
	font-size:120%;
	color:#222;
	text-decoration:none;
	text-shadow:1px 1px 0 rgba(0,0,0,0.2);
	float:right;
	margin-right:20px;
}


@media screen and (max-width:800px) {
	#keyart img#header_logo{
		max-width:238px;
		width:30%;
	}

	#keyart{
		height:auto;
		background-size:120% auto;
	}
}

@media screen and (max-width:768px){
	.event .button,
	.tieup .button{
		width:80%;
		margin:3% auto;
	}

}


@media screen and (max-width:600px) {
	#content{
		padding-top:130px;
	}
}
