@charset "UTF-8";

/* @group 全体 */

*			{ margin: 0; padding: 0; line-height: 1.5; font-weight: normal; font-style: normal }
body		{ text-align: center; background-color: #ffffff; background-image: url(../images/kabe.gif) }

body, table, tr, td, select, input, textarea
			{ font-size: 10px; font-family: "MS UI Gothic", "Lucida Sans Unicode", "Hiragino Maru Gothic Pro", Osaka; color: #000000 }

p			{ font-size: 12px }
ul			{ list-style: none }
img			{ vertical-align: middle; border: none }

a:link, a:visited, a:hover, a:active
			{ text-decoration: none }
a:link		{ color: #0000ff }
a:visited	{ color: #000099 }	
a:active, a:hover
			{ color: #ff0000 }

strong		{ color: #ff0000; font-weight: bold }
em			{ color: #000000; font-style: normal; font-weight: bold }

.center		{ text-align: center }
.clearfix:after
			{ content: ""; display: block; clear: both }
input[type="button"], input[type="submit"], select
			{ border: 1px solid; border-color: silver black black silver; background-color: #ffffcc }
input[type="text"], input[type="password"], select[multiple], textarea
			{ border: 1px solid; border-color: black silver silver black; background-color: #ffffcc }

/* @end */

/* @group 対戦画面 */

span.message{ color: #009acd }		/* メッセージウィンドウで、会話文の文字色 */
span.system	{ color: #000000 }		/* メッセージウィンドウで、システム説明文の文字色 */
span.secret	{ color: #cd5c5c }		/* メッセージウィンドウで、自分にのみ表示される文章の文字色 */

/* 操作パネルおよびカードを置くフィールドの基本色 */
table.table, tr.table, td.table, div.message
			{ background-color: #ffffff }
span.table	{ color: #ffffff }		/* 操作パネルおよびカードを置くフィールドの基本色 */
/* 各カードの輪郭線 */
div.hikari, div.mizu, div.yami, div.hi, div.sizen, div.rainbow, div.shield, div.p_shield, table.god
			{ border: 1px solid #000000 }
div.hikari, div.mizu, div.yami, div.hi, div.sizen, div.rainbow, div.message
			{ padding: 2px; text-align: left }
span.center	{ display: block; text-align: center }
.hikari		{ background-color: #ffffcc }	/* 光文明のカードの色 */
span.hikari	{ background-color: #ffff66 }	/* レインボーカードの光の文字の背景色 */
.mizu		{ background-color: #ccffff }	/* 水文明のカードの色 */
span.mizu	{ background-color: #66ffff }	/* レインボーカードの水の文字の背景色 */
.yami		{ background-color: #cccccc }	/* 闇文明のカードの色 */
span.yami	{ background-color: #666666 }	/* レインボーカードの闇の文字の背景色 */
.hi			{ background-color: #ffcccc }	/* 火文明のカードの色 */
span.hi		{ background-color: #ff6666 }	/* レインボーカードの火の文字の背景色 */
.sizen		{ background-color: #ccffcc }	/* 自然文明のカードの色 */
span.sizen	{ background-color: #66ff66 }	/* レインボーカードの自然の文字の背景色 */
/* レインボーカードの背景画像のパス */
.rainbow	{ background-image: url(../images/rainbow.jpg) }
/* Ｇリンク中の神の背景画像のパス */
.god		{ background-image: url(../images/gold.gif) }
.god tr, .god td							/* Ｇリンク中の神のテーブル枠を隠す */
			{ border: none; text-align: center }
.tap		{ background-color: #666666 }	/* タップしたカードの色 */
.shield, .p_shield, .dialog
			{ background-color: #ccccff }	/* シールドの色 */
div.shield	{ width: 50px; padding-top: 15px; padding-bottom: 15px }
div.p_shield								/* プラスされたシールド */
			{ width: 50px; height: 10px; margin-bottom: 2px }
.drophover	{ background: #ffffcc }			/* ギア移動中のテーブルの背景色 */
.gear		{								/* 移動中のクロスギア */
	padding: 3px 3px 3px 14px !important
	/*background-image: url(../images/move.gif);
	background-repeat: no-repeat;
	background-position: left;*/
}
.dialog p
			{ margin: 10px; text-align: center; font-size: 10px }
table.dialog table
			{ margin: 5px auto !important }
table.dialog table td
			{ text-align: center; padding: 3px }

/* @end */

/* @group ヘッダ */

/* ヘッダ全体のデザイン */
#header		{ padding: 3px 10px; background-color: #003333; color: #ffffff }
/* ヘッダリンク文字色 */	
#header a:link, #header a:visited
			{ color: #ffffff }			
/* タイトル部分 */
#header h1	{ float: left; width: 50%; text-align: left; font-size: 12px; font-weight: bold }
/* ヘッダボタン */
.rightbutton
			{ width: 48%; margin-left: 50%; text-align: right; }

/* @end */

/* @group サイドバー */

#leftside	{ width: 230px; float: left }
#rightside	{ width: 230px; float: right }
#leftside div, #rightside div
			{ margin-left: 10px; margin-right: 10px }
div.side_section
			{ padding-bottom: 5px; background: url(../images/side_base.gif) repeat-y; text-align: left }
div.side_section p, div.side_section div
			{ margin: 10px 20px }
div.side_header, div.side_footer
			{ margin: 0 10px; background-repeat: no-repeat; font-size: 0px }
div.side_header
			{ height: 7px; background-image: url(../images/side_top.gif) }
div.side_footer
			{ height: 10px; background-image: url(../images/side_bottom.gif) }
div.side_section h2
			{ height: 12px; padding: 0 0 9px 10px; background: url(../images/side_title.gif) no-repeat bottom; font-size: 12px }
div.side_section h2.top_line
			{ border-top: 1px solid #dddddd; padding-top: 4px; margin-top: 20px; background-position: bottom }
#login		{ padding: 5px 20px }
#login dd	{ margin-bottom: 5px }

#profile	{ margin: 10px 20px }
#profile dt	{ color: gray; border-bottom: 1px solid #dddddd; margin-bottom: 5px; font-size: 11px }
#profile dd	{ margin: 0 5px 10px 5px; font-size: 11px }
.faceicon	{ margin: 10px; text-align: center }

#banner		{ margin-top: 15px; text-align: center }

ul.decklist	{ margin: 20px 15px 0 10px }
ul.decklist li
			{ margin-bottom: 8px; font-size: 11px; background: url(../images/bullet_star.gif) no-repeat left top; padding-left: 16px }

/* @group 対戦画面用サイドバー */

#status		{ margin: 0; padding: 5px; border-bottom: 1px solid #dddddd }
#console	{ margin: 0 }
#console fieldset, #return_match
			{ margin: 0; padding: 5px 0; border: none; border-bottom: 1px solid #dddddd; text-align: center }
#return_match input
			{ margin: 0 }
#kansen		{ text-align: center }
#console input, #console select
			{ margin: 3px }
#cardlist	{ margin: 5px 0 0 0  !important; text-align: left }
#messagefield .mess
			{ width: 95% }
div.message	{ padding: 5px 10px; width: 190px; height: 400px; overflow: auto }
.no_border	{ border: none !important }

/* @end */

/* @group デッキ構築画面用サイドバー */

dl#cardsearch
			{ padding: 5px 10px }
#cardsearch dd
			{ margin: 2px 5px 10px 10px; line-height: 1.8 }
.max_width	{ width: 100% }

/* @end */

/* @end */

/* @group メイン */

#container	{ padding: 15px 0 }
#field		{ margin: 0 240px 0 240px }	/* ３コラムの場合のメインフィールド */
#column_2_field
			{ margin: 0 0 0 240px; text-align: left; }		/* ２コラムの場合のメインフィールド */
#field table
			{ margin: 0 auto 20px auto }
.table table
			{ margin: 0 auto !important }
.table td div
			{ margin: 1px 2px }
.battle
			{ padding: 10px }

/* @group ナビバー */
div#navi	{ text-align: left }
#navibar	{ width: 1188px; height: 20px; margin: 12px 10px 2px 10px; padding-top: 2px; background: url(../images/navibar.gif); text-align: left }
#navibar li { display: inline; height: 12px; font-size: 12px; text-align: center }
#navibar li a
			{ width: 100%; height: 12px; padding: 0 20px 2px 20px; border-right: 1px solid #84ae60; color: #003300 }
#navibar li a:active, #navibar li a:hover
			{ color: #ffffcc }

/* @end */

/* @group ホーム＆ロビー画面用 */

div.section_top
			{ width: 960px; height: 7px; background: #ffffff url(../images/section_top.gif) no-repeat }
div.section	{ width: 960px; padding-bottom: 10px; background: #ffffff url(../images/section_base.gif) repeat-y; text-align: left }
div.section p
			{ margin: 10px 30px }
div.section ul
			{ margin: 20px 30px }
div.section h2
			{ margin: 20px }

/* 管理画面用フォーム */
#admin		{ margin: 20px; padding-right: 10px; text-align: right }
/* ブラックリスト、ホワイトリスト */
.people		{ float: left; width: 800px; margin: 0 20px !important }
.people li	{ float: left; width: 72px; margin: 0 10px 10px 0 }

.status, .name
			{ display: block; width: 72px; height: 16px; text-align: center }

ul.notice	{ font-size: 12px }
ul.notice li
			{ background: url(../images/bullet_star.gif) no-repeat left top; padding-left: 16px; margin-bottom: 5px }

h2.trigger	{ padding-left: 40px; margin: 0 0 5px 0; background: url(../images/panel_title.gif) no-repeat; height: 40px; line-height: 40px; width: 920px; font-size: 14px; text-align: left }
h2.trigger a
			{ color: #000000; display: block; line-height: 40px }
h2.trigger a:hover
			{ color: #ccc }
h2.active	{ background-position: left bottom }
.container
			{ width: 960px; margin-bottom: 20px; background: #ffffff url(../images/section_base.gif) repeat-y !important }
.toggle_container
			{ margin: 0 0 5px; overflow: hidden; width: 960px; background: #ffffff url(../images/section_base.gif) repeat-y }
.toggle_container .section, .container .section
			{ background: transparent url(../images/section_bottom.gif) no-repeat bottom; float: left }
.transparent
			{ background-image: none !important; background-color: transparent !important }

#rule_list	{ min-width: 50%; margin: 20px auto }
#rule_list td
			{ padding: 5px 10px; vertical-align: top; font-size: 12px }
#rule_list input, #rule_list select
			{ font-size: 12px }

table#rooms	{ margin: 20px auto }
#rooms td
			{ padding: 0 5px; text-align: center; vertical-align: top }
#rooms p	{ margin: 10px 20px }
#rooms input{ margin-bottom: 10px }
.solo		{ background-color: #ffccff }
.practice	{ background-color: #ccffff }

.formbutton	{ margin: 10px 20px; text-align: right }

#copyright	{ width: 960px; margin: 20px 0; text-align: center; clear: both }

/* @end */

/* @group 管理画面用 */

.section fieldset, .section fieldset p, .section fieldset dl
			{ margin: 20px 30px; background-color: #ffffff; }
.section fieldset
			{ border: 1px solid #dddddd }
.section fieldset dt
			{ margin-bottom: 5px; font-size: 12px }
.section fieldset dd
			{ margin: 10px 20px; font-size: 12px }
legend		{ padding: 5px; margin: 10px; font-size: 12px }

/* @end */

/* @group デッキ構築画面 */

#deck_build { background-color: #ffffff; border: 1px solid #000000; border-collapse: collapse }
#deck_build td
			{ padding: 10px }
#cardsearch_result, #decklist, #deck_data
			{ text-align: left; vertical-align: top }
#cardsearch_result, #deck_data
			{ min-width: 300px }
#deck_data p
			{ margin-bottom: 10px }
.cardlist	{ width: 100%; margin: 10px 5px }
.cardlist td
			{ padding: 2px !important }
.cardlist td.count
			{ white-space: nowrap; text-align: right; padding-left: 10px !important }
.cardlist td.cardname
			{ width: 99% }
#decklist ul
			{ margin: 10px }
#button_deckcopy, #button_decksave
			{ margin-right: 20px }

/* @end */

/* @end */


/* @group 一行掲示板 */

#bbs_form	{ width: 680px; margin: 20px 0; text-align: center; font-size: 12px }
#bbs_form label
			{ margin-right: 5px }
#bbs_form input
			{ margin-right: 10px }

.comment_icon
			{ vertical-align: top; width: 36px }
.comment	{ width: 840px; background: transparent url(../images/comment_base.gif) repeat-y; text-align: left; vertical-align: top }
.comment_top
			{ background: transparent url(../images/comment_top.gif) no-repeat; padding: 5px 10px 0 25px; font-size: 11px }
.comment_body
			{ padding: 5px 10px 0 35px; font-size: 11px; }
.comment_bottom
			{ background: url(../images/comment_bottom.gif) no-repeat 0 bottom; padding: 0 15px 5px 35px; text-align: right; }
.comment_navi
			{ width: 60px; text-align: left; vertical-align: bottom; }
.comment_navi img
			{ margin: 4px 0 0 4px; padding: 3px 4px 4px 3px; background: url(../images/button_base.gif) no-repeat; width: 16px; height: 16px; border: none !important; }

#page_navi	{ width: 960px }

/* @end */

div.section dl.form_list
			{ font-size: 12px; margin: 20px 30px }
.form_list dt
			{ float: left; clear: left; width: 100px; }
.form_list dd
			{ margin: 0 10px 10px 110px; }
.form_list input, .form_list select, .form_list textarea
			{ font-size: 12px; }

/* @group デッキ内容表示 */

table.deck	{ border-collapse: collapse; border: 1px solid #000000; margin: 10px auto; width: 500px }
.deck td, .deck th
			{ padding: 2px 5px }
.deck th	{ background-color: #ccccff }
.deck caption
			{ font-size: 12px }

/* @end */


#user_card
			{ margin: 20px; text-align: left }
#user_card div#icon
			{ width: 100px; margin: 0; float: left }
#user_card dl
			{ margin: 0 0 0 126px; font-size: 12px }
#user_card dl dt
			{ margin-bottom: 5px; border-bottom: 1px solid #dddddd }
#user_card dl dd
			{ margin: 0 0 10px 20px }