@charset "utf-8";
body {
	margin: 0;
	padding: 0;
	color: #000;
	font-size: 13px;
	text-align: center;	/* for IE */
	letter-spacing: 0;	/* for IE */
	line-height: 1.7;
	background-color: #fff;
}
body, input {
	font-family: "Verdana","BitStream vera Sans", "Helvetica", "Baskerville", meiryo, Osaka, arial;
}

blockquote, ul, dl {margin: 0;padding: 0;font-size: 100%;font-weight: normal;}
p, pre, li, dt, dd {margin: 0;padding: 0;font-size: 93%;font-weight: normal;}
h1, h2, h3, h4, h5, h6 {margin: 0;padding: 0;font-size: 100%;font-weight: normal;}
select, input, button, textarea, button { font-size:100%;}
address, cite, em, strong {font-size: 100%; font-style: normal;}
table {margin: 0;padding: 0;font-size: inherit;}
th, td {margin: 0;padding: 0;font-size: 93%; line-height: 1.7;}
img {vertical-align: bottom; border: 0;}
br {letter-spacing: 0;}

a:link, a:visited {
	color: #0077dd;
	text-decoration: underline;
}

a:hover, a:active {
	color: #0000ff;
	text-decoration: underline;
}
em {
	padding: 2px 3px;
	border-bottom: 1px #ff0000 solid;
}
pre {
	margin: 15px;
	padding: 10px;
	background: #fdfdfd;
	border: 1px #ddd dashed;
	overflow: scroll;
}
#loading {
	display: none;
}
#wrap {
	width: 800px;
	margin: 0 auto 20px;
}

/* header */

#header {
	padding: 10px 0;
}
#header h1 {
	background: url(/img/logo.png) no-repeat;
	width: 244px;
	height: 59px;
	float: left;
	margin: 10px;
}
#header h1 a {
	width: 100%;
	height: 100%;
	display: block;
	text-indent: -9999px;
}
#header ul {
	float: right;
	list-style-type: none;
}
#header ul li {
	float: left;
	border-left: 1px #aaa dotted;
	padding: 0px 5px;
}
#header ul li a {
	padding: 3px 5px;
}
#header ul li a:hover {
	background: #0078C0;
	color: #fff;
	text-decoration: none;
}

/* subtitle */

#subtitle {
	background: #f7f7f7;
	border: #d7d7d7 1px solid;
	padding: 3px 10px;
	text-align: left;
}
#subtitle span {
	background: #008ECD;
	padding: 2px 3px;
	color: #fff;
	font-size: 10px;
	margin: 0 5px 0 0;
}

/* main */

#main {
	margin: 20px 0;
}

/* content */

#contents {
	width: 520px;
	float: left;
}
#contents ul#mode {
	margin: 0;
}
#contents ul#mode li {
	float: left;
	border: 1px #83BB0C solid;
	background: #DCE27A;
	padding: 3px 7px;
	list-style-type: none;
}
#contents ul#mode li a {
	color: #000;
	text-decoration: none;
}
#contents ul#mode li.now {
	background: #83BB0C;
	color: #fff;
}
#contents #user {
	padding: 10px;
	background: #83BB0C;
	*height: 35px;
}
#contents #user table {
	width: 100%;
}
#contents #user table .input {
	width: 237px;
	background: none;
	padding: 0;
	margin: 0;
}
#contents #user table .input input {
	padding: 6px 8px;
	width: 96%;
	*width: 410px;
	font-size: 16px;
	border: none;
}
#contents #user table .panel {
	width: 50px;
	text-align: right;
	background: none;
	padding: 0;
	margin: 0;
}
#contents #user table .panel input {
	background: #d1d94f;
	border: 1px #889215 solid;
	color: #000;
	width: 90%;
	font-size: 16px;
	padding: 3px 0;
	cursor: pointer;
}
#contents #user table .panel input:hover {
	background: #dce27a;
}

#contents #siritori #cpu {
	border: 1px #d7d7d7 solid;
	background: #f7f7f7;
	margin: 10px 0;
	width: 452px;
	text-align: left;
	float: left;
}
#contents #siritori #cpu p {
	margin: 10px;
}
#contents #siritori #cpu p.attack {
	font-size: 16px;
	margin-bottom: 0;
}
#contents #siritori #cpu p.comment {
	margin-top: 0;
	font-size: 10px;
}
#contents #siritori #game_end {
	border: 1px #d7d7d7 solid;
	background: #f7f7f7;
	width: 50px;
	float: right;
	cursor: pointer;
	margin: 10px 0;
}
#contents #siritori #game_end:hover {
	border: 1px #c7c7c7 solid;
	background: #e7e7e7;
}

#contents table#history {
	margin: 10px 0;
	width: 100%;
}
#contents table#history th,
#contents table#history td {
	padding: 3px 5px;
	text-align: center;
}

#contents table#history th.num {
	width: 15px;
	white-space: nowrap;
}
#contents table#history th.who {
	width: 50px;
	white-space: nowrap;
}
#contents table#history tr th {
	background: #555555;
	font-weight: normal;
	font-size: 11px;
	color: #fff;
}
#contents table#history tr td {
	background: #f7f7f7;
	text-align: left;
	padding: 5px 20px;
	width: 410px;
}
#contents table#history tr th.num {
	background: #555555;
	padding: 5px 0 5px 10px;
	color: #fff;
	text-align: right;
}
#contents table#history tr th.who {
	background: #555555;
	padding: 5px 0 5px 3px;
	color: #fff;
	text-align: left;
}
#contents table#history tr.even th {
	background: #333333;
}
#contents table#history tr.even td {
	background: #eeeeee;
}
#contents table#history tr.even th.num {
	background: #333333;
}
#contents table#history tr td#endoword {
	font-size: 20px;
}
#contents table#history tr td a {
	color: #000;
	text-decoration: underline;
}
#contents table#history tr td a:hover {
	color: #000;
	text-decoration: none;
}


#contents #content {
	border: 1px #d5d5d5 solid;
	padding: 1px;
	text-align: left;
}
#contents #content h2 {
	background: #F7F7F7;
	border-bottom: 1px #d5d5d5 solid;
	padding: 5px 10px;
	text-align: left;
}
#contents #content h3 {
	background: #f7f7f7;
	margin: 15px 10px;
	padding: 3px 10px;
}
#contents #content h4 {
	margin: 10px 15px;
	font-weight: bold;
}
#contents #content p {
	margin: 10px 15px;
}
#contents #content ul {
	margin: 10px;
	list-style-type: none;
}
#contents #content ul li {
	float: left;
	margin: 1px 3px;
}

#contents #content ul.news li {
	margin: 5px 3px;
	float: none;
}
#contents #content ul.news li span {
	font-size: 10px;
	margin-right: 5px;
}

#contents #content ul.news_date {
	text-align: right;
}
#contents #content ul.news_date li {
	text-align: right;
	float: right;
}


#contents table#history tr td.new {
	background: url(/img/new.gif) 407px 10px no-repeat;
}
#contents #infomation {
	margin: 20px 0;
}


#apikey {
	margin: 20px 15px;
	padding: 20px;
	border: 1px #ddd solid;
	background: #fefefe;
}
table.siritori-api {
	margin: 15px;
}
#apikey table,
table.siritori-api {
	border-collapse:collapse;
}
#apikey table th,
#apikey table td {
	padding: 7px 7px;
	border: 1px #ddd solid;
}
table.siritori-api th,
table.siritori-api td {
	padding: 5px 10px;
	border: 1px #ddd solid;
}
#apikey table th {
	padding: 7px 10px;
	background: #FCFCFC;
	font-weight: normal;
	text-align: left;
}
table.siritori-api th {
	background: #FCFCFC;
	font-weight: normal;
	text-align: left;
}
#apikey table td,
table.siritori-api td {
	background: #ffffff;
	font-weight: normal;
	text-align: left;
}
#apikey table td input {
	padding: 5px 7px;
	border: 1px #ddd solid;
	width: 353px;
}
ul.rule {
	background: #FCFCFC;
	padding: 10px;
	border: 1px #dddddd solid;
}
ul.rule li {
	padding: 5px 0 5px 23px;
	background: url(../img/list.gif) left 8px no-repeat;
}

.code {
	background:#FFF5F5 none repeat scroll 0 0;
	font-size:22px;
	padding:10px;
	margin: 20px 15px!important;
	text-align:center;
}

/* sidebar */

#sidebar {
	width: 260px;
	float: right;
}
#sidebar .state {
	background: #CF002F;
	padding: 1px;
	padding: 10px;
	color: #fff;
}
#sidebar .state span {
	font-size: 16px;
	margin: 0 5px;
}
#sidebar .box {
	margin: 20px 0;
	background: #fff;
	border: 1px #ddd solid;
	padding: 1px;
	text-align: left;
}
#sidebar .box h2 {
	padding: 5px 10px;
	background: #f0f0f0;
	border-bottom: 1px #E7E7E7 solid;
}
#sidebar .box p,
#sidebar .box ul {
	margin: 10px;
}
#sidebar .box ul li {
	list-style-type: none;
}
#sidebar .box ul.new_word li {
	float: left;
	margin: 0 3px;
	white-space: nowrap;
} 
#sidebar .box p a {
	white-space: nowrap;
}


#sidebar .box ul.news li {
	margin: 5px 3px;
}
#sidebar .box ul.news li span {
	font-size:10px;
	margin-right:5px;
}


/* border-radius */

#contents #mode .safe {
	border-right: none;
	-moz-border-radius-topleft: 8px;
	-webkit-border-top-left-radius: 8px;
}
#contents #mode .none {
	border-left: none;
	-moz-border-radius-topright: 8px;
	-webkit-border-top-right-radius: 8px;
}
#contents #user {
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius-topleft: 0;
	-webkit-border-top-left-radius: 0;
}
#sidebar .box h2 {
	-moz-border-radius-topleft: 8px;
	-webkit-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
	-webkit-border-radius-topright: 8px;
}
input,
#cpu,
#sidebar div,
#contents #content,
#contents #content h3 {
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
}

/* clearfix */

#header:after,
#main:after,
#siritori:after,
#contents ul#mode:after,
#sidebar .box ul.new_word:after,
#contents #content ul:after,
#sidebar .box ul.news:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

#header,
#main,
#siritori,
#contents ul#mode,
#sidebar .box ul.new_word,
#contents #content ul,
#sidebar .box ul.news {
	min-height: 1px;
}

* html #header,
* html #main,
* html #siritori,
* html #contents ul#mode,
* html #sidebar .box ul.new_word,
* html #contents #content ul,
* html #sidebar .box ul.news {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}