.center{
  margin         : auto;                /* 中央寄せ           */
  width          : 60px;                /* ボタンの横幅       */
}

.center #send {
  display        : block;               /* ボックス要素に変更 */
  box-sizing     : border-box;          /* 枠線を含んだサイズ */
  text-align     : center;              /* 文字位置は中央     */
  border         : 2px solid #ccc;      /* 枠線(一旦四方向)   */
  background     : #00c;                /* 背景色             */
  border-radius  : 30px;                /* 角丸               */
  width          : 100%;
  height         : 60px;                /* ボタンの高さ       */
  font-size      : 18px;                /* 文字サイズ         */
  line-height    : 60px;                /* 太字               */
  font-weight    : bold;                /* 太字               */
  color          : white;
}

.mod-tbl {
    position: relative;
    border: 6px solid #000;
    border-radius: 9px;
    background-color: #e0e0e0;
    box-shadow: 4px 4px 1px 0px rgba(0,0,0,0.4) inset;
    overflow: auto;
}

.com_table {
	max-width: 800px;
    position: relative;
    border: 2px solid #000;
    border-radius: 0px;
    background-color: #f0f0f0;
    box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.4) inset;
    overflow: auto;
    padding: 8px;
    font-family: "ＭＳ ゴシック",sans-serif;
}

.com_input {
	color: #ff0000;
}
.com_coment {
	color: #00ff00;
}

img {
    border: 1px solid #000;
	max-width: 100%;
	}
	
table {
	table-layout: fixed;
	min-width: 800px;
	border-collapse: collapse;
	border-spacing: 0;
}

table th{
	text-align: center;
	color:white;
	background: linear-gradient(#829ebc,#225588);
	padding: 10px 0px;
	border: solid 1px #e0e0e0;
}

table td{
	text-align: center;
	border-bottom: solid 1px #4080a0;
	padding: 10px 0px;
}

table tr.select{
	background: #c0e0ff;
	}

/* ==== ボタンを表示するエリア ============================== */
.sample3Area {
  margin         : auto;                /* 中央寄せ           */
  width          : 60px;                /* ボタンの横幅       */
}
 
/* ==== チェックボックス ==================================== */
.sample3Area input[type="checkbox"] {
  display        : none;            /* チェックボックス非表示 */
}
 
/* ==== チェックボックスのラベル（標準） ==================== */
.sample3Area label {
  display        : block;               /* ボックス要素に変更 */
  box-sizing     : border-box;          /* 枠線を含んだサイズ */
  text-align     : center;              /* 文字位置は中央     */
  border         : 2px solid #ccc;      /* 枠線(一旦四方向)   */
  border-radius  : 3px;                 /* 角丸               */
  height         : 60px;                /* ボタンの高さ       */
  font-size      : 18px;                /* 文字サイズ         */
  line-height    : 60px;                /* 太字               */
  font-weight    : bold;                /* 太字               */
  background     : #ccc;                /* 背景色             */
  box-shadow     : 3px 3px 6px #888;    /* 影付け             */
  transition     : .3s;                 /* ゆっくり変化       */
}
 
/* ==== ON側のチェックボックスのラベル（ONのとき） ========== */
.sample3Area #sample3checkr:not(checkd) + label span:after{
  content        : "OFF";               /* 表示する文字       */
  color          : #f00;
}
.sample3Area #sample3checkr:checked + label {
  background     : #ff0000;             /* 背景色             */
  box-shadow     : none;                /* 影を消す           */
}
.sample3Area #sample3checkr:checked + label span:after {
  content        : "ON";               /* 表示する文字       */
  color          : #000;                /* 文字色             */
}
.sample3Area #sample3checky:not(checkd) + label span:after{
  content        : "OFF";               /* 表示する文字       */
  color          : #ff0;
}
.sample3Area #sample3checky:checked + label {
  background     : #ffff00;             /* 背景色             */
  box-shadow     : none;                /* 影を消す           */
}
.sample3Area #sample3checky:checked + label span:after {
  content        : "ON";               /* 表示する文字       */
  color          : #000;                /* 文字色             */
}
.sample3Area #sample3checkg:not(checkd) + label span:after{
  content        : "OFF";               /* 表示する文字       */
  color          : #0f0;
}
.sample3Area #sample3checkg:checked + label {
  background     : #00ff00;             /* 背景色             */
  box-shadow     : none;                /* 影を消す           */
}
.sample3Area #sample3checkg:checked + label span:after {
  content        : "ON";               /* 表示する文字       */
  color          : #000;                /* 文字色             */
}