@charset "shift_jis";

/*######################################################################
	全体設定
######################################################################*/
* {
	margin: 0;
	padding: 0;
}
html {
	scrollbar-face-color: #990;
	scrollbar-shadow-color: #cc6;
	scrollbar-darkshadow-color: #550;
	scrollbar-highlight-color: #550;
	scrollbar-3dlight-color: #cc6;
	scrollbar-arrow-color: #330;
	scrollbar-track-color: #660;
}
body {
	background: #cfb url(../../../common/images/pandog.png);
}
#wrapper {
	margin: auto;
	padding: 0 10px 10px;
	width: 42em;
	-moz-box-shadow: 0 0 6px rgba(0,0,0,.6);
	-webkit-box-shadow: 0 0 6px rgba(0,0,0,.6);
	box-shadow: 0 0 6px rgba(0,0,0,.6);
	background: #f0f0e0;
	color: #000;
}

/*----------------------------------------------------------------------
	リンク
----------------------------------------------------------------------*/
a {
	color: #00c;
}
a:visited {
	color: #808;
}
a:hover {
	background: #ffffc0;
	color: #c00;
}

/*----------------------------------------------------------------------
	強調
----------------------------------------------------------------------*/
em {
	font-style: normal;
	font-weight: bold;
}
strong {
	color: #c00;
	font-weight: bold;
}

/*----------------------------------------------------------------------
	見出し
----------------------------------------------------------------------*/
h1 {
	text-align: left;
}
h2 {
	margin: 1em 0 .5em;
	border-style: solid;
	border-width: 1px 1px 1px 3px;
	border-color: #e0e0c0 #c0c0a0 #c0c0a0 #660;
	padding: .2em;
	line-height: 1.5;
	background: #f8f8f0 url(../../../common/images/web2-gradation.png) repeat-x left center;
	color: #660;
	font-weight: bold;
	font-size: 120%;
}
h3 {
	margin: 1em .5em .5em 1em;
	border-top: .5em solid #f8f8e8;
	border-bottom: .5em solid #f8f8e8;
	border-left: 1em double #990;
	padding: 0 .5em;
	line-height: 1.2;
	background: #f0f0e0 url(../../../common/images/ami3.png) repeat-x left bottom;
	color: #660;
	font-weight: bold;
}

/*----------------------------------------------------------------------
	リスト
----------------------------------------------------------------------*/
ul {
	margin: 1em;
}
li {

}

/*----------------------------------------------------------------------
	画像
----------------------------------------------------------------------*/
img {
	border: none;
}


/*######################################################################
	ナビゲーション
######################################################################*/


/*----------------------------------------------------------------------
	パンくずリスト
----------------------------------------------------------------------*/
#history-navi {
	list-style: none outside;
	margin-top: .5em;
	font-size: 90%;
}
#history-navi li {
	display: inline;
	padding-left: 18px;
	background: url(../../../common/images/arrow2.png) no-repeat center left;
}
li#top-page {
	background: url(../../../common/images/home.png) no-repeat center left;
}

/*----------------------------------------------------------------------
	グローバル・ナビゲーション
----------------------------------------------------------------------*/
#page-navi {
	margin: 1em 0;
	border-style: solid;
	border-width: 1px;
	border-color: #993 #662 #662 #993;
	background: #ffffe0 url(../../../common/images/yel_shadow.png) repeat-x bottom;
	width: auto;
	height: 2.3em;
}
#page-navi li {
	list-style: none outside;
	float: left;
	position: relative;
	border-right: solid 1px #993;
	border-left: solid 1px #f1f1cb;
	width: auto;
	_width: 7.5em;
	line-height: 2.3;
	letter-spacing: .1em;
	background-color: transparent;
	color: #660;
	text-align: center;
}

#page-navi li a {
	display: block;
	width: 100%;
	background: transparent;
	color: #333;
	height: 2.3em;
	line-height: 2.3;
	text-decoration: none;
	text-indent: 16px;
}
#page-navi li a:hover {
	color: #000;
	background-color: #ffc;
}

/*	リスト個別設定
----------------------------------------------------------------------*/
/* 全般（マウスオーバー） */
#page-navi li#play-page a:hover,
#page-navi li#help a:hover,
#page-navi li#ranking a:hover,
#page-navi li#kako-ranking a:hover,
#page-navi li#best-ranking a:hover {
	background-color: #ffc;
}

/* ゲームで遊ぶ */
#page-navi li#play-page {
	_width: 10.5em;
}
#page-navi li#play-page a {
	background: transparent url(../../../common/images/finger.png) no-repeat center left;
}

/* 遊び方の説明 */
#page-navi li#help {
	_width: 5em;
}
#page-navi li#help a {
	background: transparent url(../../../common/images/help.png) no-repeat center left;
}

/* 今月のランキング */
#page-navi li#ranking a {
	background: transparent url(../../../common/images/ranking.png) no-repeat center left;
}

/* 先月のランキング */
#page-navi li#kako-ranking a {
	background: transparent url(../../../common/images/kako-ranking.png) no-repeat center left;
}

/* ベストスコア・ランキング */
#page-navi li#best-ranking a {
	background: transparent url(../../../common/images/best-ranking.png) no-repeat center left;
}

/* ベストランク（基礎編・実践編） */
#page-navi li#basic,
#page-navi li#practice {
	_width: 18em;
}
#page-navi li#basic a,
#page-navi li#practice a {
	text-indent: 0;
}

/*	カレントリスト設定
----------------------------------------------------------------------*/
/* 全般（カレント） */
#page-navi li.current {
	background-color: #eec;
	background-repeat: no-repeat;
	background-position: center left;
	text-indent: 16px;
}

/* ゲームで遊ぶ */
#page-navi li#play-page.current {
	background-image: url(../../../common/images/finger.png);
}

/* 遊び方の説明 */
#page-navi li#help.current {
	background-image: url(../../../common/images/help.png);
}

/* 今月のランキング */
#page-navi li#ranking.current {
	background-image: url(../../../common/images/ranking.png);
}

/* 先月のランキング */
#page-navi li#kako-ranking.current {
	background-image: url(../../../common/images/kako-ranking.png);
}

/* ベストスコア・ランキング */
#page-navi li#best-ranking.current {
	background-image: url(../../../common/images/best-ranking.png);
}

/*----------------------------------------------------------------------
	関連ゲームリスト
----------------------------------------------------------------------*/
.game-list {
	margin: 2em 0 1em;
	border: 3px double #660;
	padding: 0 0 .5em;
	background: #f4f4e4;
	line-height: 1.5;
	text-align: left;
}
.game-list ol a {
	padding-left: 20px;
	background: url(../../../common/images/check_off.png) no-repeat left top;
}
.game-list ol a:visited {
	background: url(../../../common/images/check_on.png) no-repeat left top;
}
.game-list a:hover {
	background-color: #ffffc0;	
}
.game-list h2 {
	margin: 0 0 .5em;
	border: 0 none;
	padding: .2em;
	background: #660;
	background: -moz-linear-gradient(top,#660,#440);
	color: #f0f0e0;
	font-size: 100%;
	text-shadow: 1px 1px 1px rgba(255,255,255,.3), -1px -1px 1px #000;
}
.game-list ol {
	margin: 1em 0;
}
.game-list li {
	margin-left: 2.5em;
}
.game-list ul li {
	list-style-image: url(../../../common/images/arrow0.png);
}
.game-list table {
	margin: 1em;
	border: 1px solid #660;
}
.game-list caption {
	padding-left: 20px;
	background: transparent url(../../../common/images/flower2.png) no-repeat left center;
	color: #660;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}
.game-list th,
.game-list td {
	border-width: 1px;
	border-style: solid;
	border-color: #a0a090 #d0d0c0 #d0d0c0 #a0a090;
	padding: .1em;
}
.game-list th {
	background: #660;
	color: #fff;
	text-align: center;
}
.game-list td {
	background: #f4f4e4;
	text-align: left;
}
.game-list thead th {
	background: #660;
	color: #fff;
	text-align: center;
}
.game-list tbody th {
	background: #fafae8;
	color: #000;
	text-align: left;
}
.game-list tr#this_game th,
.game-list tr#this_game td {
	border-color: #d0c0c0 #a09090 #a09090 #d0c0c0;
	background: #f4e4e4;
	font-weight: normal;
}
.game-list tr#this_game th:after {
	content: "←いまココ";
	margin: 0 .2em;
	border: 1px solid #c00;
	background-color: #ff9;
	color: #333;
	font-size: 70%;
}
.game-list p {
	margin: 1em .5em 1em 2.5em;
}

/*######################################################################
	記録・問題文など
######################################################################*/

/*----------------------------------------------------------------------
	状況エリア
----------------------------------------------------------------------*/
#circumstance {
	margin: .5em 1% 0 3%;
	width: 96%;
}
#circumstance dt,
#kiroku dt {
	cursor: help;
}
.countlabel {
	float: left;
	padding: 2px 0 1px;
	font-size: 100%;
	line-height: 1.3;
}
.count {
	float: left;
	margin: 0 20px 10px 5px;
	border-width: 2px 1px 1px 2px;
	border-style: solid;
	border-color: #331 #994 #994 #331;
	width: 3em;
	background: #660;
	color: #f0f0e0;
	font-size: 130%;
	font-weight: bold;
	text-align: center;
}
.count p {
	margin: 1em 0;
}
/*----------------------------------------------------------------------
	問題文
----------------------------------------------------------------------*/
#mondai {
	margin: 1em 0;
	width: 100%;
}

#text1,
#reading {
	border: solid 1px #660;
	padding: 2px;
	min-height: 1em;
	background: #f8f8e8;
	color: #444;
	font: normal normal bold 130%/130% "ＭＳ Ｐゴシック","メイリオ",Osaka,sans-serif;
	text-align: left;
}
#text1 {
	-moz-border-radius: .5em .5em 0 0;
	-webkit-border-radius: .5em .5em 0 0;
	border-radius: .5em .5em 0 0;
}
#reading {
	margin: 5px 0 0;
	-moz-border-radius: 0 0 .5em .5em;
	-webkit-border-radius: 0 0 .5em .5em;
	border-radius: 0 0 .5em .5em;
}
#text3 {
	display: none;
	margin-top: .5em;
	border-top: 1px dashed #993;
	padding: 2px;
	font-weight: normal;
	font-family: "ＭＳ ゴシック","メイリオ","Osaka-等幅",monospace;
}

font.typemarker {
	border: 1px solid #660;
	background: #fff;
	color: #084;
}

#degree_info,
#tweet {
	font-size: 90%;
	font-weight: normal;
}
#tweet {
	padding-left: 20px;
	background: url(../../../common/images/twitter_icon.png) top left no-repeat;
}

.next_mondai {
	color: #996;
	font-size: 90%;
	font-weight: normal;
}
.imi {
	color: #c99;
	font-size: 80%;
	font-weight: normal;
}

/*----------------------------------------------------------------------
	記録・目標
----------------------------------------------------------------------*/
#kiroku {
	margin: 0 1% .5em 3%;
	width: 96%;
}
#kiroku dt, #kiroku dd {
	float: left;
}
#kiroku dt {
	padding: 1px 0;
	line-height: 1.2;
}
#max,
#maxmiss,
#maxgonp {
	margin: 0 20px 10px 5px;
	border-style: solid;
	border-width: 1px;
	border-color: #c0c0a0 #f0f0e0 #f0f0e0 #c0c0a0;
	padding: 0 2px;
	width: 2em;
	background: #e0e0d0;
	font-size: 120%;
	text-align: center;
}
#maxgonp {
	width: 2.5em;
}

#kiroku dd span {
	display: block;
}

select#target {
	float: left;
	margin-left: 5px;
	width: 13em;
	background: #e0e0d0;
	color: #000;
	font-size: 100%;
}

/*----------------------------------------------------------------------
	キーボード
----------------------------------------------------------------------*/
#key-area {
	margin: 0 auto;
	width: 35em;
}

#kb-1,#kb-2,#kb-3,#kb-4,#kb-5 {	/* キーボード全体 */
	font-weight: bold;
	font-family: "ＭＳ ゴシック", monospace;
	text-align: center;
}
#key-area ol {
	clear: left;
	list-style: none;
}
#key-area li {
	float: left;
	margin: 0 .1em .2em 0;
}
#kb-1 {	/* 最上段 */
	margin-left: 1.8em;
}
#kb-2 {	/* 上段 */
	margin-left: 2.8em;
}
#kb-3 {	/* 中段 */
	margin-left: 3.1em;
}
#kb-4 {	/* 下段 */
	margin-left: 0;
}
#kb-5 {	/* 最下段 */
	margin-left: 10.2em;
}

.key1, .key2, .key3, .key4, .key5 {
	border: 3px solid;
	-moz-border-radius: .2em;
	-webkit-border-radius: .2em;
	border-radius: .2em;
	padding: 2px;
	width: 1.3em;
	height: 1.1em;
}
.key1 {	/* 人差し指 */
	border-color: #d8d8b8 #a8a898 #a8a898 #d8d8b8;
	background: #e8e8c8;
	color: #440;
}
.key2 {	/* 中指 */
	border-color: #c0e0e0 #90b0b0 #90b0b0 #c0e0e0;
	background: #d0f0f0;
	color: #042;
}
.key3 {	/* 薬指 */
	border-color: #e0d0d8 #b0a0a8 #b0a0a8 #e0d0d8;
	background: #f0e0e8;
	color: #423;
}
.key4 {	/* 小指 */
	border-color: #c0e0c0 #90b090 #90b090 #c0e0c0;
	background: #d0f0d0;
	color: #040;
}
.key5 {	/* 親指 */
	border-color: #e0d0c0 #b0a090 #b0a090 #e0d0c0;
	width: 5em;
	background: #f0e0d0;
	color: #420;
}
.shift {	/* シフトキー */
	width: 3em;
	overflow: hidden;
}
#key51 {	/* スペース */
	width: 6em;
}
.mark {	/* ポッチ */
	border: 3px solid;
	border-color: #666 #333 #333 #666;
	color: #c00;
}
.mark span {
	border-bottom: 2px ridge #e0e0c0;
}
#key-area li.boundary {	/* 左右境界線 */
	border-style: solid;
	border-color: #d0d0e0;
	border-width: 3px 0;
	padding: 2px 0;
	width: 2px;
	height: 1.1em;
	background: #d0d0e0;
}
p#upp-low {	/* 大文字・小文字ボタン */
	margin: .2em;
}
kbd {
	margin: 0 .1em;
	border: 2px outset #eee;
	padding: 0 1px;
	background: #eee;
	color: #000;
	font-weight: bold;
	line-height: 1.5em;
}
#guide {	/* キーボードガイド */
	list-style: none outside;
	margin: 2em 1em 2em;
}
#guide li {	/* 指の色説明 */
	display: inline;
	margin: 0 .5em;
	font-weight: bold;
}

/*----------------------------------------------------------------------
	スタート・登録
----------------------------------------------------------------------*/
#restart {
	margin: 1em 0;
	text-align: center;
}
#register {
	list-style: none outside;
	display: inline;
	margin-right: 1em;
	padding-left: 18px;
	background: url(../img/register-gray.gif) left center no-repeat;
	color: #b0b0a5;
	font-size: 130%;
	font-weight:bold;
}
#start {
	list-style: none outside;
	display: inline;
	padding-left: 18px;
	background: url(../img/start.gif) left center no-repeat;
	font-size: 130%;
	font-weight:bold;
	font-family: "ＭＳ ゴシック","メイリオ","Osaka-等幅",monospace;
}
#register kbd,
#start kbd {
	margin-left: .2em;
	border: none;
	background: #e0e0d0;
	color: #330;
	font-size: 80%;
	font-weight: normal;
}
#register span kbd {
	background: transparent;
	color: #b0b0a5;
}

/*----------------------------------------------------------------------
	説明文・応答文
----------------------------------------------------------------------*/
.comment,
.reply {
	padding: .2em;
	font-size: 100%;
	letter-spacing: 2px;
	text-align: left;
}
.comment {
	margin: .5em 0;
	border: 1px solid #d0d0c0;
	background: #f4f4e4;
	line-height: 1.2;
}
.reply {
	margin: 1.5em 0;
	border: 3px solid #c00;
	background: #fff;
	line-height: 2;
}
.reply + #tweet {
	font-size: 100%;
}

/*----------------------------------------------------------------------
	オプション設定
----------------------------------------------------------------------*/
div#optionClose {
	margin: 1em 0 0;
	padding: .5em;
	background: #660 url(../img/option.png) left bottom repeat-x;
	color: #fff;
	text-align: center;
}
div#optionArea {
	display: block;
	border: 1px solid #660;
	padding: .5em;
	background-color: #f8f8e8;
}
div#optionArea table {
	margin: 0 auto 1em;
	border: 1px solid #660;
}
div#optionArea caption {
	padding-left: 20px;
	background: transparent url(../img/check.png) no-repeat left center;
	color: #660;
	font-size: 120%;
	font-weight: bold;
	line-height: 1.5em;
	text-align: left;
}
div#optionArea th {
	background: #e8e8b8;
	text-align: right;
}
div#optionArea td {
	background: #f4f4e4;
	text-align: left;
}
div#optionArea th,
div#optionArea td {
	border-width: 1px;
	border-style: solid;
	border-color: #a0a090 #d0d0c0 #d0d0c0 #a0a090;
	padding: .1em;
}
label,
button {
	cursor: pointer;
}
button span {
	color: #660;
	font-size: 80%;
}
button.set-open:before,
button.set-close:before {
	content: "　　";
	overflow: hidden;
	margin-right: .2em;
	width: 16px;
	height: 16px;

}
button.set-open:before {
	background: url(../img/open_and_close.png) 0 0 no-repeat;
}
button.set-close:before {
	background: url(../img/open_and_close.png) 0 -16px no-repeat;
}
input[type="button"] {	/* 対応ブラウザ向け */
	cursor: pointer;
}

/*----------------------------------------------------------------------
	カウンタ・解析
----------------------------------------------------------------------*/
#shinobi {
	margin: 1em auto;
	text-align: right;
}
#shinobi li {
	display: inline;
	padding: 0 .3em;
}
#NINCT1SPAN1001681 {
	font-size: 75%;
}

/*----------------------------------------------------------------------
	配布元
----------------------------------------------------------------------*/
#muras {
	margin: 2em 0 0;
	border-top: 1px solid #ddddc4;
	border-bottom: 1px solid #ddddc4;
	padding: .5em 0;
	background: url(../../../common/images/mesh.png);
	font-size: 90%;
	text-align: center;
}
#muras dt,
#muras dd {
	display: inline;
	line-height: 2;
}
#muras dt {
	margin-left: 1em;
	padding-left: 20px;
	background: url(../../../common/images/neji.png) no-repeat center left;
	font-weight: bold;
}
#muras dd {
	margin: 0;
	padding: 0;
}

/*----------------------------------------------------------------------
	ベストスコアランキング
----------------------------------------------------------------------*/
/* 各ゲームへのリンク */
#mokuji {
	border: 1px solid #660;
	padding-bottom: 1em;
	background: #f8f8f0 url(../../../common/images/ami2.png) left bottom repeat-x;
}
#mokuji h2 {
	margin: 0;
	border: 0 none;
	padding: .2em;
	background: #660 url(../img/option.png) left bottom repeat-x;
	color: #f4f4e4;
}
#mokuji p {
	margin: .5em;
}
#mokuji ol {
	margin: .5em .5em .5em 2em;
}
#mokuji li {
	margin-left: 1em;
	line-height: 1.3em;
}

/*----------------------------------------------------------------------
	回り込み解除
----------------------------------------------------------------------*/
#circumstance,
#kiroku,
#key-area {
	zoom: 1;
}
#circumstance:after,
#kiroku:after,
#key-area:after {
	content: "";
	clear: both;
	display: block;
}