/* CSS Document */
.button {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 5px 12px;   /* 余白       */
  background    : #ff9326;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 4px 4px 2px #666666;  /* 影の設定 */
  border        : 2px solid #797676;    /* 枠の指定 */
    margin: 4px;
}
.button:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
.button01 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 5px 12px;   /* 余白       */
  background    : #ff9326;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 4px 4px 2px #666666;  /* 影の設定 */
  border        : 2px solid #797676;    /* 枠の指定 */
  font-weight:bolder;
}
.button01:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
.button02 {
  display       : inline-block;
  border-radius : 18px;          /* 角丸       */
  font-size     : 14px;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
   margin      : 6px;
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 18px;   /* 余白       */
  background    : #6C4719;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 0.9em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 4px 4px 2px #666666;  /* 影の設定 */
  border        : 2px solid #797676;    /* 枠の指定 */
  font-weight:bolder;
    margin-top: 8px;
}
.button02:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
.buttonsiro {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 14px;   /* 余白       */
  background    : #FFF;     /* 背景色     */
  color         : #000;     /* 文字色     */
  line-height   : 0.9em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
    margin-top: 4px;
}
.buttonsiro:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}
.buttonsiro.clicked {
            background: #0000FF;
            color: #FFF;
            border: 1px solid #FFF;
}
.buttonsirodai {
  display       : inline-block;
  border-radius : 18px;          /* 角丸       */
  font-size     : 13pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 12px 16px;   /* 余白       */
  background    : #FFF;     /* 背景色     */
  color         : #000;     /* 文字色     */
  line-height   : 1.6em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
    margin-top: 15px;
}
.buttonsirodai:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}
.buttonsiro000 {
  display       : inline-block;
  border-radius : 10px;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 4px 10px;   /* 余白       */
  background    : #FF9C0E;     /* 背景色     */
  color         : #FFF;     /* 文字色     */
  line-height   : 0.8em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  font-weight:bold;
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
margin-left:10px;
}
.buttonsiro000:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}
.buttonsiro0 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 6px 8px;   /* 余白       */
  background    : #FF9C0E;     /* 背景色     */
  color         : #FFF;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  font-weight:bold;
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
    width: 210px;
    margin-top: 4px;
}
.buttonsiro0:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}
.buttonsiro00 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 6px 8px;   /* 余白       */
  background    : #FF9C0E;     /* 背景色     */
  color         : #FFF;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  font-weight:bold;
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
  widht :320px;

}
.buttonsiro00:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}
.buttonsiro2 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 6px 6px;   /* 余白       */
  background    : #FFF;     /* 背景色     */
  color         : #000;     /* 文字色     */
  line-height   : 0.9em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */

  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */ 
}
.buttonsiro2:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #0E38F8;     /* 背景色     */
  background    : #ABEEF7;     /* 文字色     */
}

.buttonsiro1 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 13px;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 14px;   /* 余白       */
  background    : #ff9326;     /* 背景色     */
  color         : #FFF;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  font-weight:100;
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
}
.buttonsiro1:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}
.buttonsiro3 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 13pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 12px;   /* 余白       */
  background    : #FFF;     /* 背景色     */
  color         : #000;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  font-weight:bold;
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
    width: 220px;
}
.buttonsiro3:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}
.buttonaka {
  display       : inline-block;
  border-radius : 8px;          /* 角丸       */
  font-size     : 13pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 14px;   /* 余白       */
  background    : #ff9326;     /* 背景色     */
  color         : #000;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 8px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  font-weight:100;
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
}
.buttonaka:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}
        .buttonaka.clicked {
            background: #0000FF;
            color: #FFF;
            border: 1px solid #FFF;
        }
.buttonstaff {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 2px 4px;   /* 余白       */
  background    : #3E8A8A;     /* 背景色     */
  margin        : 2px;
  color         : #FFFFFF;     /* 文字色     */
  line-height   : 0.9m;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 2px #666666;  /* 影の設定 */
  border        : 2px solid #cccccc;    /* 枠の指定 */

}
.buttonstaff:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #3E8A8A;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
.button1 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 13pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 2px 4px;   /* 余白       */
  background    : #9C9A9A;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 0.9em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 2px #666666;  /* 影の設定 */
  border        : 2px solid #797676;    /* 枠の指定 */
  font-weight:bolder;
}
.button1:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
.button2 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 13px;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 6px 10px;   /* 余白       */
  background    : #A69F74;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 0.9em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 2px #666666;  /* 影の設定 */
  border        : 2px solid #797676;    /* 枠の指定 */
  font-weight:bolder;
    margin-right: 4px;
}
.button2:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
.button3 {
  display       : inline-block;
  border-radius : 14px;          /* 角丸       */
  font-size     : 13px;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 6px 10px;   /* 余白       */
  background    : #6BBEFC;     /* 背景色     */
  color         : #031E40;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 2px #666666;  /* 影の設定 */
  border        : 2px solid #797676;    /* 枠の指定 */
  font-weight:bolder;

}
.button3:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
.button-on {
    color: green;
}
.button-off {
    color: #FFA500;  // オレンジ色
}
.btn_dash {
  display       : inline-block;
  border-radius : 8px;          /* 角丸       */
  font-size     : 11pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 4px 18px;   /* 余白       */
  background    : #FFF;     /* 背景色     */
  color         : #000;     /* 文字色     */
  line-height   : 0.9em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
   margin-bottom: 9px; 
  border        : 1px solid #797676;    /* 枠の指定 */
  box-shadow    : 2px 2px 1px #666666;  /* 影の設定 */  
  display: flex;  
    margin-left: 10px;
}
.btn_dash:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #FFFFFF;     /* 背景色     */
  background    : #646463;     /* 文字色     */
}