html {
 text-align: center;
 height:100%;
}

body {
 margin: 0px;
 padding: 0px;
 height: 100%;
 text-align: center;
}

div{
 text-align: center;
}

table {
 margin-left: auto;
 margin-right: auto;
}

.active {
 ime-mode: active;
}

.disabled {
 ime-mode: disabled;
}

hr {
 margin-top: 25px;
}

/* ▼▼▼ header ▼▼▼ */
div#header {
 background: #338833;
 height: 55px;
 border-bottom: 1px solid #000000;
/*	font-size: 16px;*/
 font-size: 120%;
 font-weight: bold;
 color: #FFFFFF;
}

div#header table {
 border:none;
 width: 100%;
}

div#header table tr td.logo {
 width: 150px;
 text-align: left;
 vertical-align: middle;
}

div#header table tr td.title {
    width:auto;
    line-height: 55px;
 text-align: center;
 vertical-align: middle;
}

div#header table tr td.janso {
 width: 150px;
 text-align: right;
 vertical-align: middle;
}

div#navi {
 background: #88BB88;
 border-bottom: 1px solid #000000;
 padding: 5px;
}
/* ▲▲▲ header ▲▲▲ */

/* ▼▼▼ side navi ▼▼▼ */
div#navi2{
 width: 200px;
 background: #CCFFCC;
 border: 1px solid #669933;
 font-size: 90%;
 margin: 5px 2px;
 padding: 3px 5px 3px 2px;
 text-align: left;
 min-height: 350px;
}

div#navi2 div.navi2 {
 width: 100%;
 padding-left: 5px;
 min-height:150px;
}

div#navi2 div p{
 text-align: center;
}

div#navi2 div div.title{
 font-size: 15px;
 font-weight: bold;
 text-align: center;
}

div#navi2 table {
 margin-left: 0px;
 font-size: 13px;
}

div#navi2 p.notice{
 text-align: right;
 font-size: 11px;
 color: #660000;
}

/* ▲▲▲ side navi ▲▲▲ */

/* ▼▼▼ main ▼▼▼ */
div#main {
 font-size: 13px;
 text-align: center;
 min-width: 600px;
 padding: 10px;
}

div#main h2 {
 font-size: 16px;
 margin: 10px;
 font-weight: bold;
}

div#notice {
 padding: 5px;
}

div#errors {
 padding: 5px;
 color: #FF0000;
 font-weight: bold;
}

div#main th {
 padding: 3px 4px;
 background: #BBEEBB;
 text-align: center;
}

div#main td {
 padding: 3px 4px;
 min-width: 20px;
}

.member_id {
 ime-mode: disabled;
}

.under18 {
 color: #FF0000;
}
.under20 {
 color: #0000FF;
}
.over20 {
}

.visitor_before {
 background: #FFFFFF; /* ホワイト */
}
.visitor_finished {
 background: #AAAAFF; /* ブルー */
}
.visitor_finished_empty {
 background: #FFFFAA; /* イエロー */
}
.visitor_gaming {
 background: #FFAAAA; /* レッド */
}

.customer_not_entering {
 background: #FFFFFF; /* ホワイト */
}
.customer_entering {
 background: #AAAAFF; /* ブルー */
}
.customer_gaming {
 background: #FFAAAA; /* レッド */
}
.customer_entering_another {
 background: #AAAAAA; /* グレー */
}

.taku_empty {
 background: #FFFFFF; /* ホワイト */
}
.taku_ready {
 background: #AAAAFF; /* ブルー */
}
.taku_active_empty {
 background: #FFFFAA; /* イエロー */
}
.taku_active {
 background: #FFAAAA; /* レッド */
}
.taku_active2 {
 background: #AAFFAA; /* 緑 */
}
.taku_set {
 background: #AAAAAA; /* グレー */
}

.game_before {
 background: #FFFFFF; /* ホワイト */
}
.game_finished {
 background: #AAAAFF; /* ブルー */
}
.game_finished_empty {
 background: #FFFFAA; /* イエロー */
}
.game_active {
 background: #FFAAAA; /* レッド */
}
.game_active2 {
 background: #AAFFAA; /* 緑 */
}
.game_established {
 background: #AAAAAA; /* グレー */
}

.customer{
 min-width: 100px;

}
.op_area{
 min-width: 80px;

}

input.game_established {
 background: #777777;
}

input.modified {
 background: #ff3333;
 ime-mode: disabled; /* 半角限定*/
}

/*
.game_active {
 background: #FFFFFF;
}
.game_empty {
 background: #FFFFAA;
}
.game_finished {
 background: #CCCCCC;
}
*/

.bar_normal {
 color: #888888; /* ブラック */
/*	background: #888888;*/ /* ブラック */
 font-size:18px;
}
.bar_little_long {
 color: #FFFF88; /* イエロー */
/*	background: #FFFF88;*/ /* イエロー */
 font-size:18px;
}
.bar_too_long {
 color: #FF8888; /* レッド */
/*	background: #FF8888;*/ /* レッド */
 font-size:18px;
}

div.advice {
 font-size: 11px;
 color: #660000;
 margin-top: 18px;
}

.advice li {
 text-align: center;
}

.warning {
  color: #CC0000;
  padding: 0;
  margin: 0;
}

.separator {
  background-color: #DDDDDD;
  margin: 0;
  padding: 0;
  height: 3px;
}

/* ▼▼▼ Rails Default の変更 ▼▼▼ */
.fieldWithErrors {
  padding: 3px;
  border:2px solid red;
  display: inline;
}

/* お知らせ */
table#admininfo {
  vertical-align: top;
}

table#admininfo th {
  border-top: 1px dotted;
  border-bottom: 1px dotted;
  color: #444444;
  background-color: #eeeeee;
}

table#admininfo td {
  width: 400px;
  border-top: 1px dotted;
  border-bottom: 1px dotted;
  color: #444444;
  text-align: left;
}

table#admininfo span {
  text-decoration: underline;
  font-weight:bold;
  color: #cc8800;
}

table#admininfo p {
  margin: 0;
  padding: 3px 5px 0 5px;
}

/* 待機者一覧 */
table#visitors td {
  border-bottom: #444444 1px dotted;
}

/* フリー卓一覧 */
table#freetakus td {
  border-bottom: #444444 1px dotted;
}

/* */
td.waitbar {
  width: 64px;
  text-align: left;
}