/* 共通 */
body {
  background-color: #eefffd;
}

.container {
  width: 40%;  
  height: 100%;
}

/* 表示枠 */
.wrapper {
  margin: 0 auto;
  width: 400px;
}

/* ボタン情報 */
#button_wrap {
  margin: 0 auto;
  margin-top: 30px; 
  width: 100%;
  text-align: center;
}

/* ヘッダータイトル */
#header_title {
  color: #666;
}

/* ヘッダーアイコン */
#header_icon {
  float: right;
  font-size: 20pt;
  color: #666;
  margin-top: -36px;
}

/* 共通ボタン */
.btn_common {
  position: relative;
  display: inline-block;
  padding: 1em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #fd9535;/*色*/
  border-radius: 4px;/*角の丸み*/
  font-weight: bold;
  border: solid 2px #696969;
  width: 200px;
  color: #000;
  text-align: center;
  font-size: 16pt;
}
.btn_common:active {
  /*押したとき*/
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

/* 省略記号対応「文字列...」 */
div.overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width : 100%; /* IE対策 */
}

/* トップボタン */
.btn_top {
  position: relative;
  display: inline-block;
  padding: 0.3em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #fd9535;/*色*/
  border-radius: 4px;/*角の丸み*/
  font-weight: bold;
  border: solid 2px #696969;
  width: 100px;
  color: #000;
  text-align: center;
  font-size: 16pt;
}
.btn_top:active {
  /*押したとき*/
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

/* マージン */
.margin_10 {
  margin: 10px 0px; 
}
.margin_20 {
  margin: 20px 0px; 
}

/* 緑 */
.color_green {
  background-color: #3cb371;
}

/* 黄色 */
.color_yellow {
  background-color: lemonchiffon;
}

/* グレー */
.color_gray {
  background-color: lightgray;
}

/* 青 */
.color_blue {
  background-color: lightsteelblue;
}

/* 赤 */
.color_red {
  background-color: #ff6347;
}

/* マウスオーバー時の行の背景色 */
.select_wrap table tbody tr:hover,
.user_list_wrap table tbody tr:hover {
  background-color: lightgray;
}

/* テーブル */
.hidden_td {
  display: none;
}

/* スマホ対応 */
@media screen and (max-width: 500px) {

/* ボタン情報 */
#top_button_wrap {
  top: 20px;
  font-size: 13pt;
  width: 80px;
}

/* トップボタン */
.btn_top {
  padding: 0.1em 0.2em;
  width: 65px;
  font-size: 10pt;
}

}


/* スマホ対応 */
@media screen and (max-width: 500px) {

.container {
  width: 100%;
}

.wrapper {
  width: 100%;
}

}