@charset "utf-8";
h1 {
  padding: 10px 20px;
  font-size: 2rem;
  color: #ffffff;
  border-bottom: 2px solid #303030;
  background: #303030;
  border-radius: 3px;
}
h1 span.rank_title {
  margin-left: 15px;
  color: #ffe800;
}
div.ranking_box {
  padding: 22px;
  border: 1px solid #202029;
}

div.ranking_box ul.user_rank-menu {
  margin: 20px auto 0;
  width: 80%;
  overflow: hidden;
}
ul.user_rank-menu li {
  width: 20%;
  height: 50px;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  float: left;
}
ul.user_rank-menu li a {
  display: block;
  height: 50px;
}

ul.user_rank-menu li:nth-of-type(1) { background: url(/img/pc/grandprix/rank_ss-s1.jpg) center 0 no-repeat; }
ul.user_rank-menu li:nth-of-type(2) { background: url(/img/pc/grandprix/rank_s2.jpg) center 0 no-repeat; }
ul.user_rank-menu li:nth-of-type(3) { background: url(/img/pc/grandprix/rank_a1.jpg) center 0 no-repeat; }
ul.user_rank-menu li:nth-of-type(4) { background: url(/img/pc/grandprix/rank_a2.jpg) center 0 no-repeat; }
ul.user_rank-menu li:nth-of-type(5) { background: url(/img/pc/grandprix/rank_a3.jpg) center 0 no-repeat; }
ul.user_rank-menu li:nth-of-type(1):hover { background: url(/img/pc/grandprix/rank_ss-s1.jpg) center -50px no-repeat; }
ul.user_rank-menu li:nth-of-type(2):hover { background: url(/img/pc/grandprix/rank_s2.jpg) center -50px no-repeat; }
ul.user_rank-menu li:nth-of-type(3):hover { background: url(/img/pc/grandprix/rank_a1.jpg) center -50px no-repeat; }
ul.user_rank-menu li:nth-of-type(4):hover { background: url(/img/pc/grandprix/rank_a2.jpg) center -50px no-repeat; }
ul.user_rank-menu li:nth-of-type(5):hover { background: url(/img/pc/grandprix/rank_a3.jpg) center -50px no-repeat; }

ul.user_rank-menu li:not(:first-of-type) {
  margin-left: 0;
}

/********************************
 * メニューボタン           *
 ********************************/
.menu-btn_list.item_btn4 li:not(:last-child) {
  margin-right: 10px;
}
.menu-btn_list.item_btn4 .btn-border {
  width: 266px;
  height: 55px;
}

/* ランキング内のボタン */
.ranking_box .menu-btn_list {
  width: 840px;
  margin: 20px auto;
}
.ranking_box .menu-btn_list.item_btn5 li:not(:last-child) {
  margin-right: 10px;
}
.ranking_box .menu-btn_list.item_btn5 .btn-border {
  width: 160px;
  height: 55px;
}

/************************
* テーブル関連          *
************************/
div.ranking_box p.update_label {
  width: 80%;
  margin: 10px auto 5px;
}
div.ranking_box table {
  width: 80%;
  margin: 0 auto 0;
  border: none;
  table-layout: fixed;
  border-collapse: collapse;
}
div.ranking_box th {
  padding: 4px;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
  background-color: #303030;
  border: 1px solid #ffffff;
}
div.ranking_box td {
  height: 40px;
  padding: 4px 12px;
  background: #ffffff !important;
  border: 1px solid #202029;
}
div.ranking_box table tr:nth-child(2n) td {
  background-color: #ecf2f3 !important;
}

div.ranking_box td.crown_rank_1 { background: url(/img/pc/grandprix/icon/crown_gold.png) 4px 3px no-repeat !important; }
div.ranking_box td.crown_rank_2 { background: url(/img/pc/grandprix/icon/crown_silver.png) 4px 3px no-repeat !important; }
div.ranking_box td.crown_rank_3 { background: url(/img/pc/grandprix/icon/crown_bronze.png) 4px 3px no-repeat !important; }
