/*************************** grid ******/
/* 画像下の隙間を埋める  */
/* active = マウスがhoverした時のクラス  */
/* タイトルを囲うボックス。IEボックスバグ対応 marginとpaddingは指定しない。はみ出る文字はoverflowで隠す */ 
div.grid01 {
  clear        : both;
  margin-left  : auto;
  margin-right : auto;
  text-align   : center;
}
div.grid01 div.section {
  float          : left;
  height         : 185px;
  width          : 204px;
  padding        : 5px 8px 2px 8px;
  vertical-align : bottom;
  text-align     : center;
  margin-bottom  : 10px;
}
div.grid01 div.section img {
  margin         : 0px;
  padding        : 0;
  vertical-align : bottom;
  border         : 3px solid #fff;
  border-radius  : 3px 3px 0 0;
}
div.grid01 div.active img {
  border : 1px solid #2B2E2E;
}
div.grid01 div.section div.title {
  margin           : 0;
  padding          : 0;
  width            : 202px;
  height           : 33px;
  background-color : #90713B;
  overflow         : hidden;
  white-space      : nowrap;
  border           : #90713B 2px solid;
  border-radius    : 0 0 3px 3px;
}
div.grid01 div.active div.title
div.grid01 div.section h3 a:hover{color: #ffffff}
div.grid01 div.section div.title h3 {
  margin      : 0;
  color       : #fff;
  font-size   : 1em;
  text-align  : center;
  font-weight : normal;
  line-height : 2em;
  width       : 204px;
  font-family : "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}
a {
  text-decoration : none;
}
div.grid01 div.section div.title a:hover {
  color : #ffffff;
}
div.grid01 div.section h3 a:link{color: #000000}
div.grid01 div.section h3 a:visited{color: #000000}
div.grid01 div.section h3 a:hover{color: #000000}
div.grid01 div.section h3 a:active{color: #000000}
div.grid01 div.active h3 a:link{color: #ffffff}
div.grid01 div.active h3 a:visited{color: #ffffff}
div.grid01 div.active h3 a:hover{color: #ffffff}
div.grid01 div.active h3 a:active{color: #ffffff}
.stat {
  height            : 22px;
  background-repeat : no-repeat;
  position          : absolute;
  margin-top        : -22px;
  margin-left       : -2px;
}
.junbi {
  width                : 206px;
  content              : "まもなく待機";
  color                : #fff;
  display              : inline-block;
  background           : rgba(242, 110, 146, 0.7);
  height               : 20px;
  line-height          : 20px;
}
.offline:before {
}
.party:before {
  width                : 206px;
  content              : "待機中";
  color                : #fff;
  display              : inline-block;
  background           : rgba(255, 123, 0, 0.7);
  height               : 20px;
  line-height          : 20px;
}
.twoshot:before {
  width                : 206px;
  content              : "２ショット中";
  color                : #fff;
  display              : inline-block;
  background           : rgba(155, 110, 242, 0.7);
  height               : 20px;
  line-height          : 20px;
}
.showtime:before {
  width                : 206px;
  content              : "チャット中";
  color                : #fff;
  display              : inline-block;
  background           : rgba(61, 195, 225, 0.7);
  height               : 20px;
  line-height          : 20px;
}
.inparty:before {
  width                : 206px;
  content              : "チャット中";
  color                : #fff;
  display              : inline-block;
  background           : rgba(61, 195, 225, 0.7);
  height               : 20px;
  line-height          : 20px;
}
.meeting:before {
  width                   : 206px;
  content                 : "待ち合わせ";
  color                   : #fff;
  display                 : inline-block;
  background              : rgba(255, 123, 0, 0.7);
  height                  : 20px;
  line-height             : 20px;
}
.rank_box {
  width            : 35px;
  height           : 25px;
  line-height      : 25px;
  position         : relative;
  top              : 20px;
  left             : 0;
  box-shadow       : 1px 1px 1px rgba(0,0,0,0.4);
  color            : #fff;
  background-color : #2B2E2E;
  font-weight      : bold;
  font-size        : 13px;
  text-align       : center;
  z-index          : 999;
}