body {
	margin: 0;
	padding: 0;

	background: #999;
	font-size: 14px;
	line-height: 1.3;
	color: #666;

	font-family: 'ヒラギノ角ゴ Pro W3', 'HiraKakuPro-W3', 'Verdana', sans-serif;
}

/* for IE (HTML5) */
article,aside,dialog,figure,footer,header,hgroup,menu,nav,section { display: block; zoom: 1; }

#body_wrapper {
	min-width: 1015px;

	background: url("./imgs/bg.gif");
	padding: 0 0 30px 0;
}

#wrapper {
	/* One Point Space */
	padding: 0 0 0 215px;
	background: url("./imgs/onepoint.gif") no-repeat top left;

	/* min-height for X-Browser */
	min-height: 250px;
	height: auto !important;
	height: 250px;
}


#contents {
	min-width: 800px;
	width: auto !important;
	width: 800px;
}

a {
	color: #00d;
	text-decoration: none;
}
a:hover {
	color: #66e;
}

/* Header */
header, #header { height: 150px; }
* html header, * html #header { width: 800px; } /* for IE6 */ 

h1 {
	margin: 0;
	float: left;
}
#logo {
	background: url("./imgs/logo.gif") no-repeat;
	width: 302px;
	height: 0;
	padding: 130px 0 0 0;
	overflow: hidden;
	display: block;
}

#header_description {
	background: url("./imgs/description.gif") no-repeat 50px 62px;
	width: 280px;
	height: 0;
	padding: 113px 0 0 50px;
	overflow: hidden;
}


/* Left Side */
#leftside {
	position: absolute;
	top: 265px;
	left: 0;

	width: 200px;
	overflow: hidden;
}


/* Footer */
footer, #footer {
	min-width: 975px;

	background: #999 url('./imgs/footer_bg.gif') 0 0 repeat-x;
	color: #eee;
	font-size: 10px;
	font-family: 'Helvetica', 'Arial', sans-serif;
	
	padding: 30px 20px;
}
footer a, #footer a {
	color: #eee;
	text-decoration: underline;
}
footer a:hover, #footer a:hover {
	color: #eee;
}

#copyright {
	float: right;
}

#socials {
	height: 30px !important;
	overflow: hidden;
}

#staffs {
	margin: 10px 0 0 0;
}
#staffs .splitter {
	padding: 0 10px;
}

#tweet_button, #like_button {
	float: left;
	height: 30px;
}


/* Navigations */
nav {
	clear: both;

	padding: 0 0 8px 0;
	background: url("./imgs/nav_shadow.png") no-repeat left bottom;

	min-width: 800px;
	width: auto !important;
	width: 800px;
	
	margin: 0 0 30px 0;
}

ul#navigations {
	margin: 0;
	padding: 0;

	list-style: none;
	height: 30px;
}
ul#navigations li, ul#navigations li {
	margin: 0;
	padding: 0;

	width: 180px;
	height: 30px;
	float: left;
}

ul#navigations a {
	display: block;
	width: 180px;
	height: 0;
	padding: 30px 0 0 0;
	overflow: hidden;
	
	background: url("./imgs/navigations.png") no-repeat;

	transition: opacity 0.4s linear;
	-moz-transition: opacity 0.4s linear;
	-webkit-transition: opacity 0.4s linear;
	-o-transition: opacity 0.4s linear;
	-ms-transition: opacity 0.4s linear;

	opacity: 0.6;
	zoom: 1;
}
* html ul#navigations a {
	/* for IE6 (use GIF) */
	background: url("./imgs/navigations.gif") no-repeat;
}
ul#navigations a#current_page,
ul#navigations a:hover {
	opacity: 1;
}
ul#navigations a:active {
	opacity: 1;
	outline: none;
}
ul#navigations a.toppage 							{ background-position:	0px		0px; }
ul#navigations a.toppage:hover 						{ background-position:	0px 	-30px; }
ul#navigations a.toppage:hover:active 				{ background-position:	0px 	-60px; }
ul#navigations a.toppage#current_page,
ul#navigations a.toppage#current_page:active 		{ background-position:	0px 	-90px; }

ul#navigations a.discography 						{ background-position:	-180px	0px; }
ul#navigations a.discography:hover 					{ background-position:	-180px 	-30px; }
ul#navigations a.discography:hover:active 			{ background-position:	-180px 	-60px; }
ul#navigations a.discography#current_page,
ul#navigations a.discography#current_page:active 	{ background-position:	-180px 	-90px; }

ul#navigations a.credits 							{ background-position:	-360px	0px; }
ul#navigations a.credits:hover 						{ background-position:	-360px 	-30px; }
ul#navigations a.credits:hover:active 				{ background-position:	-360px 	-60px; }
ul#navigations a.credits#current_page,
ul#navigations a.credits#current_page:active 		{ background-position:	-360px 	-90px; }

/* Contents main */

h2 {
	color: #666;
	font-size: 18px;
	height: 21px;
	line-height: 21px;
	font-family: 'ヒラギノ角ゴ Pro W6', 'HiraKakuPro-W6', 'Verdana', sans-serif;
	font-weight: normal;
	letter-spacing: -1px;

	padding: 0 0 0 36px;
	margin: 50px 0 20px 0;

	background: url('./imgs/h2_header.gif') left center no-repeat;
}
section > h2:first-child, h2.first {
	margin-top: 16px;
}

section {
	clear: both;
	padding-top: 50px;
	background: url('./imgs/separator.gif') 0 25px repeat-x;
}
section.first {
	padding-top: 0;
	background-image: none;
}

p {
	margin: 20px 40px 20px 0;
	
	/* p は760pxに収める */
	width: 760px;
}

p a:hover:active {
	background: #66e;
	color: #fff;
}

a.totop {
	/* go to top */
	display: block;
	width: 44px;
	height: 0;
	padding-top: 11px;
	overflow: hidden;
	
	background: url('./imgs/totop.gif') 0 0 no-repeat;
	float: right;

	margin-right: 20px;
}
a.totop:hover { background-position: 0 -11px; }

/* H2 Custom Title */

.custom_title {
	display: block;
	padding: 21px 0 0 0;
	height: 0px;
	overflow: hidden;

	background-position: 0 2px;
	background-repeat: no-repeat;
}
.custom_title.whats_tm { background-image: url('./imgs/h2/whats_tm.gif'); }
.custom_title.sp_links { background-image: url('./imgs/h2/sp_links.gif'); }



/* Top -- Banner */

.banners {
	box-shadow: 0 0 4px 0 #666;
}


/* Top -- Banner List */

dl.banner_list {
	width: 760px;
}
dl.banner_list dt {
	clear: left;
	float: left;
	width: 490px;
}
dl.banner_list dd {
	margin: 0 0 20px 490px;
	padding: 12px 0 0 0;

	height: 48px;
	
	font-size: 11px;
	color: #777;
}
dl.banner_list .banner_info {
	height: 20px;
}
dl.banner_list .banner_url {
	letter-spacing: -0.8px;
	height: 20px;
	font-size: 13px;
	font-weight: bold;
}
dl.banner_list dd a {
	color: #333;
}
dl.banner_list dd a:hover {
	color: #33a;
}

/* Top -- Series */

ul#series {
	list-style: none;
	margin: 20px 0;
	padding: 0;
}

ul#series li {
	position: relative;
	margin: 25px 0 0 0;
	padding: 0 0 0 180px;
}
ul#series li.tm1 { background: url('./imgs/series_tm1.gif') 40px center no-repeat; }
ul#series li.tm2 { background: url('./imgs/series_tm2.gif') 40px center no-repeat; }
ul#series li.tm3 { background: url('./imgs/series_tm3.gif') 40px center no-repeat; }

ul#series li[data-date]:after {
	content: attr(data-date);
	display: block;
	position: absolute;
	left: 600px;
	top: 0;
	
	width: 150px;
	line-height: 100px;
	overflow: hidden;
	height: 100px;
	text-align: center;
	font-weight: bold;
	padding: 25px 0;
	
	font-family: 'Century Gothic';
	font-size: 16px;
	color: #999;
	
	background: rgba(255, 255, 255, 0.5);
}

ul#series li .series_banner {
	position: relative;
	display: block;
	overflow: hidden;

	width: 400px;
	height: 100px;

	box-shadow: inset 0 0 10px 3px #f5f1e5;
}

ul#series li.tm3 .series_banner { background: url('./imgs/bigbanner_tm3.png') 0 0 no-repeat; }
ul#series li.tm2 .series_banner { background: url('./imgs/bigbanner_tm2.png') 0 0 no-repeat; }
ul#series li.tm1 .series_banner { background: url('./imgs/bigbanner_tm1.png') 0 0 no-repeat; }

ul#series li .series_banner a {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	
	width: 150px;
	height: 100px;
	padding-left: 400px;

	-moz-transition: all 0.2s ease-out;
	-webkit-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
ul#series li .series_banner a:hover {
	-moz-transform: translate(-150px, 0);
	-webkit-transform: translate(-150px, 0);
	-o-transform: translate(-150px, 0);
	-ms-transform: translate(-150px, 0);
	transform: translate(-150px, 0);
}

ul#series li .series_banner a .series_title {
	display: block;
	float: right;

	width: 150px;
	padding-top: 100px;
	height: 0;
	overflow: hidden;

	background: rgba(0,0,0,0.5) url('./imgs/gotoweb.gif') center center no-repeat;
}

ul#series li.tm1 .series_banner a .series_title { background-color: rgba(128,0,0,0.5); }
ul#series li.tm2 .series_banner a .series_title { background-color: rgba(0,64,128,0.5); }
ul#series li.tm3 .series_banner a .series_title { background-color: rgba(0,128,0,0.5); }


.series_info {
	margin: 10px 0 0 0;
	height: 40px;
}
.series_info .description {
	display: block;
	color: #666;
	font-family: 'ヒラギノ角ゴ Pro W6', 'HiraKakuPro-W6', 'メイリオ', Meiryo, sans-serif;
	font-weight: bold;
	font-size: 16px;
	line-height: 25px;
}
.series_info .catch {
	display: block;
	color: #888;
	font-family: 'Century Gothic', Meiryo, sans-serif;
	font-style: italic;
	font-size: 12px;
	line-height: 15px;
}