#board {
    border-spacing: 0px;	/* マス間の線 */
    background-image: url(image/1/stage1-00.jpg);
    border: 8px #ccc ridge;
    border-radius: 4px;
}

#board td.cell {
    width: 96px;	/* マスの幅 */
    height: 96px;	/* マスの高さ */
    overflow: hidden;
    padding: 0;
    font-size: 60px;	/* ヒントの数字の大きさ。マスの大きさを超えないようにする。 */
    font-weight: bold;
    text-align: center;	/* 文字の位置 */
    vertical-align: middle;
}

#board td.close {
    /* border: 1px #ccc outset;	 outsetでマスが盛り上がったように見せる */
	box-shadow: 0 0 0 1px #ccc;
}
/* 地雷があることを示す旗 */
#board td.flag {
    background-image: url('image/flag.jpg') !important;
}

#board td.open {
    /* border: 1px #ccc solid;	開いたときにもマスの大きさが変更されないように背景と同色の枠をつくる */
	box-shadow: 0 0 0 1px #ccc;
	background-image: none !important;
}
/* 地雷の表示 */
#board td.open.bomb {
    background-color: red;
    /*	画像が用意できるとき
    background-image: url('bomb.png');
    */
    border-color: red;	/* 枠線の幅を変更する必要がないのでborder-colorで指定する */
}
/* ヒントの数字 */
#board td.open.hint0 {
    color:transparent;
}
#board td.open.hint1 {
    color: blue;
}
#board td.open.hint2 {
    color: green;
}
#board td.open.hint3 {
    color: #dc143c;
}

/* 地雷の残りを表示するテキストボックス */
#bombs {
    width: 3em;
    text-align: right;
}