@charset "utf-8";


/* Common */

*{
	margin: 0;
	padding: 0;
}

body {
	margin-bottom: 30px;
	background: #000;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, sans-serif;
	font-size: 12px;
	color: #fff;
	text-align: center;						/* 念のため、IE5対応用（バグを利用） */
}

body div {
	text-align: left;
}

img {
	vertical-align: top;					/* IE6, 7のバグ対策（画像のずれ）（効果あるのかなぁ？） */
	border: 0px;
}


/* 文字まわり */

.date {										/* topicsページの日付 */
	font-family: Arial, Helvetica, sans-serif;
	text-align: right;
	font-size: 90%;
	vertical-align:baseline;
}

.topic_title {								/* topicsページのタイトル */
	float: left;
}

.center {									/* 画像などを中央に寄せる時に */
	text-align: center;
	clear: both;
}

h1 {
	color: #ff0;
	font-weight: bold;
	font-size: 120%;
}

h2 {
	color: #ff0;
	font-weight: normal;
	font-size: 120%;
}

h3 {
	color: #0ff;
	font-weight: bold;
	font-size: 100%;
}

p, table, tr, td {
	font-size: 100%;
	line-height: 150%;
	vertical-align: top;
}


/* リンクまわり */

a:link, a:visited {							/* リンクの記述は、link、visited、hover、activeの順 */
	color: #fff;
}

a.footer_link:link, a.footer_link:visited {	/* フッターにリンクを貼る場合のクラス */
	color: #ff0;
}

a:hover {									/* カーソルが上にある時のリンク */
	color: #e85298;
}

a.footer_link:hover {						/* フッターにリンクを貼る場合のクラス（マウスオーバー時） */
	color: #e85298;
}

a:active, a:focus{							/* リンクのフォーカス時の枠を消す */
	outline:none;
}

a img {
	border-style:none;
}


/* header */

#top_film {
	width: 100%;
	height: 52px;
	background-image: url("img/film_top.gif");
	background-color: #000;	
}

/* contents */

#contents_box {
	background-color: #e85298;
	text-align: center;
}

#main {
	width: 900px;
	height: 420px;
	margin: auto;
	background-color: #000;
	overflow: hidden;
}

#curtain_left {
	width: 121px;
	height: 420px;
	background-image: url("img/curtain_left.gif");
	float: left;
}

#center_box {
	width: 658px;
	height: 420px;
	text-align: center;
	background-image: url("img/curtain_top.gif");
	background-repeat: no-repeat;
	float: left;
}

#title_box{
	width: 658px;
	height: 52px;
	padding-top: 47px;
}

#main_contents {
	width: 658px;
	height: 321px;
	overflow: auto;							/* ブロック要素をスクロール */
}

.topic_top {
	padding: 20px 45px 0px;
}

.topic_bottom {
	padding: 0px 45px 10px;
}

#curtain_right {
	width: 121px;
	height: 420px;
	background-image: url("img/curtain_right.gif");
	float: left;
}


/* bottom */

#bottom_film {
	width: 100%;
	height: 100px;
	background-image: url("img/film_bottom.gif");
	background-color: #000;
	text-align: center;
	clear: both;
}

#bottom_box {
	width: 900px;
	margin: 0 auto;
}

#bottom_box_img {
	width: 287px;
	height: 100px;
	float: left;
}

#bottom_box_text {
	width: 603px;
	padding-left: 10px;
	padding-top: 72px;
	float: left;
}


/* menu */

#menu_box{
	width: 900px;
	height: 25px;
	margin: 11px auto 0 auto;
	background-color: #000;
	clear: both;
}

ul#menu{
	list-style: none;
	width: 100%;
}
ul#menu li{
	list-style: none;
	float: left;
}

ul#menu a span{
	display: none;
} 

a.top {
	display: block;
	height: 25px;
	width: 54px;
	background-image: url("img/menu_top.gif");
}
a.top:hover {
	background-image: url("img/menu_top_on.gif");
}

a.topics {
	display: block;
	height: 25px;
	width: 75px;
	background-image: url("img/menu_topics.gif");
}
a.topics:hover {
	background-image: url("img/menu_topics_on.gif");
}

a.intro {
	display: block;
	height: 25px;
	width: 128px;
	background-image: url("img/menu_intro.gif");
}
a.intro:hover {
	background-image: url("img/menu_intro_on.gif");
}

a.story {
	display: block;
	height: 25px;
	width: 68px;
	background-image: url("img/menu_story.gif");
}
a.story:hover {
	background-image: url("img/menu_story_on.gif");
}

a.chara {
	display: block;
	height: 25px;
	width: 103px;
	background-image: url("img/menu_chara.gif");
}
a.chara:hover {
	background-image: url("img/menu_chara_on.gif");
}

a.cast {
	display: block;
	height: 25px;
	width: 59px;
	background-image: url("img/menu_cast.gif");
}
a.cast:hover {
	background-image: url("img/menu_cast_on.gif");
}

a.blog {
	display: block;
	height: 25px;
	width: 58px;
	background-image: url("img/menu_blog.gif");
}
a.blog:hover {
	background-image: url("img/menu_blog_on.gif");
}

a.dl {
	display: block;
	height: 25px;
	width: 106px;
	background-image: url("img/menu_dl.gif");
}
a.dl:hover {
	background-image: url("img/menu_dl_on.gif");
}

a.goods {
	display: block;
	height: 25px;
	width: 61px;
	background-image: url("img/menu_goods.gif");
}
a.goods:hover {
	background-image: url("img/menu_goods_on.gif");
}

a.link {
	display: block;
	height: 25px;
	width: 77px;
	background-image: url("img/menu_link.gif");
}
a.link:hover {
	background-image: url("img/menu_link_on.gif");
}

a.banner {
	display: block;
	height: 25px;
	width: 97px;
	background-image: url("img/banner_audition.gif");
}
a.banner:hover {
	background-image: url("img/banner_audition_on.gif");
}


/* menu_new_icon */

#icon_box {
	position: relative;
	width: 900px;
	height: 12px;
	margin: 0 auto;
	background-color: #000;
	clear: both;
}

#icon_new_01 {								/* メニュー下のNEW!アイコン・blog（固定） */
	position: absolute;
	top: 0px; left: 510px;
	width: 20px;
	height: 7px;
	background-image: url("img/ico_new.gif");
	background-repeat: no-repeat;
}

#icon_new_02 {								/* メニュー下のNEW!アイコン・自由に位置を変えてよいもの,1 */
	position: absolute;
	top: 0px; left: 285px;					/* leftの指定位置（参考）story：285px, shop：675px, */
	width: 20px;
	height: 7px;
	background-image: none;
	background-repeat: no-repeat;
}

#icon_new_03 {								/* メニュー下のNEW!アイコン・自由に位置を変えてよいもの,2 */
	position: absolute;
	top: 0px; left: 675px;
	width: 20px;
	height: 7px;
	background-image: url("img/ico_new.gif");
	background-repeat: no-repeat;
}

#icon_new_topics {							/* メニュー下のNEW!アイコン・topics（固定） */
	position: absolute;
	top: 0px; left: 85px;
	width: 20px;
	height: 7px;
	background-image: url("img/ico_new.gif");
	background-repeat: no-repeat;
}


/* footer */

#copyright {
	width: 100%;
	margin: 0 auto;
	text-align: center;
	clear: both;
}

address{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 80%;
	font-style: normal;
	border-top: thin solid #bbb;
	color: #ccc;
	padding-top: 10px;
}