/* common.css */

@charset "UTF-8";

/* web fonts ───────────────────────── */

@font-face {
	font-family:'Bebas Neue';
	src:url('../fonts/BebasNeue-webfont.eot');
	src:url('../fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
	    url('../fonts/BebasNeue-webfont.woff') format('woff'),
	    url('../fonts/BebasNeue-webfont.ttf') format('truetype'),
	    url('../fonts/BebasNeue-webfont.svg#Bebas+Neue') format('svg');
	font-weight:normal;
	font-style:normal;
}
@font-face {
	font-family:'Gosub';
	src:url('../fonts/Gosub.eot');
	src:url('../fonts/Gosub.eot?#iefix') format('embedded-opentype'),
	    url('../fonts/Gosub.woff') format('woff'),
	    url('../fonts/Gosub.ttf') format('truetype'),
	    url('../fonts/Gosub.svg#Gosub') format('svg');
	font-weight:normal;
	font-style:normal;
}

/* common ──────────────────────────- */

html {
	font-size:62.5%;
}
html,body {
	height:100%;
}
body {
	background:url(../images/bg_body.png);
	color:#000;
	font:normal 15px/1
	     Georgia, Times, "Times New Roman",
	     "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",Osaka,
	      sans-serif;
	font-size:1.5rem;
	text-shadow:1px 1px 0 rgba(255,255,255,0.8);
}
a {
	color:#3b3a36;
	text-decoration:none;
}
a:hover {
	position:relative;
	left:1px;
	top:1px;
	color:#bf0073;
	text-decoration:none;
}
::selection {
	background:#ec008c;
	color:#000;
	text-shadow:none;
}
::-moz-selection {
	background:#ec008c;
	color:#000;
	text-shadow:none;
}

/* container ───────────────────────── */

#container {
	position:relative;
	top:-28px;
	top:-2.8rem;
	min-height:100%;
	background:url(../images/bg_center.png) no-repeat center center;
}
body > #container {
	height:auto;
}

/* header ──────────────────────────- */

header {
	padding:48px 20px 20px;
	padding:4.8rem 2rem 2rem;
}
header h1 {
	float:left;
	font:normal 20px/1 "Bebas Neue",sans-serif;
	font-size:2rem;
	letter-spacing:0.2em;
}
header h1 a {
	color:#fff;
	text-shadow:0 -1px 0 rgba(59,58,54,0.8),0 1px 0 rgba(59,58,54,0.2),0 0 1px rgba(59,58,54,1);
}
header h1 a:hover {
	color:#fff;
	text-shadow:0 -1px 0 rgba(59,58,54,0.8),0 1px 0 rgba(59,58,54,0.2),0 0 1px rgba(59,58,54,1);
}
header nav {
	font:normal 14px/1 "Gosub",sans-serif;
	font-size:1.4rem;
	text-align:right;
}

/* footer ──────────────────────────- */

footer {
	position:fixed;
	bottom:0;
	width:100%;
	background:url(../images/bg_footer.gif);
	background:rgba(16,16,0,0.2);
	box-shadow:inset 0 0 3px rgba(255,255,255,0.5),0 2px 10px rgba(0,0,0,1);
}
footer p {
	padding:20px;
	padding:2rem;
}
footer small {
	color:#32312e;
	font:normal 16px/1 "Bebas Neue",sans-serif;
	font-size:1.6rem;
	text-shadow:1px 1px 0 rgba(255,255,255,0.6);
	letter-spacing:2px;
}

/* Media Queries ─────────────────────── */

@media screen and (max-width:900px) {
	#container {
		background-size:600px 98px;
	}
}
@media screen and (max-width:720px) {
	#container {
		background-size:400px 65px;
	}
}
@media screen and (max-width:540px) {
	body {
		background:url(../images/bg_body_s.png);
	}
	#container {
		background-size:280px 46px;
	}
	header {
		padding:3.8rem 1rem 1rem;
	}
	header h1 {
		letter-spacing:1px;
	}
	footer p {
		padding:1rem;
	}
}

/* Ende */