/* リバーシ */
div#reversi{
	width: 720px;
	margin: 0px auto;
}

/* --- Start clearfix --- */
div#reversi:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div#reversi{
	display: inline-block;
}

/* \*/
* html div#reversi{
	height: 1%;
}

div#reversi{
	display: block;
}
/* --- End clearfix --- */

	div#reversi div#board{
		width: 480px;
		height: 480px;
		margin: 0px 12px 16px 0px;
		position: relative;
		float: left;
	}

		div#reversi div#board div.line{
			clear: both;
		}

			div#reversi div#board div.line div{
				float: left;
				width: 60px;
				height: 60px;
			}

			div#reversi div#board div.line div.white{
				background-image: url(../../parts/img/square_white.png);
			}

			div#reversi div#board div.line div.black{
				background-image: url(../../parts/img/square_black.png);
			}

			div#reversi div#board div.line div.empty{
				background-image: url(../../parts/img/square_empty.png);
			}

			div#reversi div#board div.line div.able{
				background-image: url(../../parts/img/square_able.png);
			}

			div#reversi div#board div.line div.over-able{
				background-image: url(../../parts/img/over_able.png);
				cursor: pointer;
			}

			div#reversi div#board div.line div.over-disable{
				background-image: url(../../parts/img/over_disable.png);
			}

			/* 以下デバッグ用 */
			div#reversi div#board div.line div{
				font-weight: bold;
				line-height: 60px;
				text-align: center;
				color: #cccc00;
			}
			/* 以上デバッグ用 */

		div#reversi div#board form.entry-end-false,
		div#reversi div#board div.normal-end-false{
			display: none;
		}

		div#reversi div#board form.entry-end-true,
		div#reversi div#board div.normal-end-true{
			display: block;
			position: absolute;
			border: 2px solid #000000;
			width: 396px;
			top: 48px;
			left: 40px;
		}

			div#reversi div#board form.entry-end-true p#entry-title,
			div#reversi div#board div.normal-end-true p#normal-title{
				background-image: url(../../parts/img/alpha_black_80.png);
				color: #ffffff;
				padding: 2px 16px 2px 16px;
				border-bottom: 2px solid #000000;
			}

			div#reversi div#board form.entry-end-true fieldset.end-controller,
			div#reversi div#board div.normal-end-true p.end-controller{
				background-image: url(../../parts/img/alpha_white_80.png);
				color: #000000;
				padding: 12px 16px;
			}

				div#reversi div#board form.entry-end-true fieldset.end-controller input,
				div#reversi div#board div.normal-end-true p.end-controller button{
					font-size: 90%;
					font-family: 'メイリオ', 'Microsoft Sans Serif', 'Tahoma';
					overflow: hidden;
					white-space: nowrap;
				}

				div#reversi div#board form.entry-end-true fieldset.end-controller input#entry-name{
					width: 240px;
				}

				div#reversi div#board form.entry-end-true fieldset.end-controller input#entry-submit,
				div#reversi div#board div.normal-end-true p.end-controller button{
					width: 80px;
				}

	div#reversi div#information{
		overflow: hidden;
		margin: 0px 0px 16px 0px;
	}

		div#reversi div#information div{
		}

			div#reversi div#information div select#opponent-select{
				width: 100%;
				font-size: 80%;
				font-family: 'メイリオ', 'Microsoft Sans Serif', 'Tahoma';
			}

				div#reversi div#information div select#opponent-select option{
					padding: 0px 4px;
				}

			div#reversi div#information div label{
				display: block;
				padding: 2px 0px;
				width: 50%;
				float: left;
				margin: 4px 0px 0px 0px;
			}

			div#reversi div#information div label:hover{
				background-color: #000000;
				color: #ffffff;
			}

			div#reversi div#information div label.checked,
			div#reversi div#information div label.checked:hover{
				background-color: #ffffff;
				color: #000000;
			}

			div#reversi div#information div label.no-checked,
			div#reversi div#information div label.no-checked:hover{
				background-color: #ffffff;
				color: #bbbbbb;
			}

				div#reversi div#information div label input{
					margin: 0px 0.4em;
				}

				div#reversi div#information div label span{
					font-size: 90%;
				}

			div#reversi div#information div button{
				width: 100%;
				height: 2em;
				line-height: 2em;
				font-size: 90%;
				font-family: 'メイリオ', 'Microsoft Sans Serif', 'Tahoma';
				overflow: hidden;
				white-space: nowrap;
				margin: 4px 0px 0px 0px;
			}

		div#reversi div#information p{
			padding: 2px 4px;
			margin: 8px 0px 0px 0px;
			background-color: #000000;
			color: #ffffff;
			text-align: center;
		}

		div#reversi div#information dl{
			margin: 4px 0px 0px 0px;
		}

			div#reversi div#information dl dt{
				border-bottom: 1px solid #000000;
				padding: 2px 4px;
				float: left;
			}

			div#reversi div#information dl dd{
				border-bottom: 1px solid #000000;
				padding: 2px 4px;
				text-align: right;
			}

				div#reversi div#information dl dd span{
					font-size: 90%;
				}