.body-container {
  width: 100%;
  height: auto;
  background: url("/page/cardGame/img/bg.png") no-repeat center;
  overflow: hidden;
}

.main-container {
  width: 1000px;
  height: 630px;
  margin: 30px auto;
  background: url('/page/cardGame/img/chess-cont-bg.png') no-repeat center;
  background-size: 100% 100%;
  overflow: hidden;
}

.left-menu {
  float: left;
  width: 280px;
  height: 570px;
  margin: 40px 0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  overflow: hidden;
}

.chess-tab {
  width: auto;
  height: auto;
  overflow: hidden;
}

.chess-tab li {
  width: 230px;
  height: 70px;
  margin: 0 0 20px 32px;
  text-align: center;
  background-size: 95% !important;
  cursor: pointer;
}

.chess-tab .active {
  background-position: center bottom !important;
}

#kyBtn {
  background: url("/page/cardGame/img/btnKy.png") no-repeat center top;
}
#kgqpBtn {
  background: url("/page/cardGame/img/btnKGQP.png") no-repeat center top;
}

#jbBtn {
  background: url("/page/cardGame/img/btnJb.png") no-repeat center top;
}

#qlyBtn {
  background: url("/page/cardGame/img/btnQly.png") no-repeat center top;
}

#luckyBtn {
  background: url("/page/cardGame/img/btnXy.png") no-repeat center top;
}

#nwBtn {
  background: url("/page/cardGame/img/btnNw.png") no-repeat center top;
}

#wzBtn {
  background: url("/page/cardGame/img/btnWz.png") no-repeat center top;
}

#dfwBtn {
  background: url("/page/cardGame/img/btnDfw.png") no-repeat center top;
}

#asBtn {
  background: url("/page/cardGame/img/btnAs.png") no-repeat center top;
}

#ybqpBtn {
  background: url("/page/cardGame/img/btnYbqp.png") no-repeat center top;
}
#kxBtn{
  background: url("/page/cardGame/img/btnTg.png") no-repeat center top;
}
#fgBtn{
  background: url("/page/cardGame/img/btnFG.png") no-repeat center top;
}
#gmBtn{
  background: url("/page/cardGame/img/btnGM.png") no-repeat center top;
}
#kyNewBtn{
  background: url("/page/cardGame/img/btnKyNew.png") no-repeat center top;
}
#ksBtn{
  background: url("/page/cardGame/img/btnKS.png") no-repeat center top;
}
.jbao-list-wrap {
  position: relative;
  float: right;
  width: 720px;
  height: 590px;
  margin-top: 15px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

#luckyChessTip {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  color: red;
}

/*.jbao-list-wrap::-webkit-scrollbar, .left-menu::-webkit-scrollbar {*/
/*width: 5px;*/
/*height: 20px;*/
/*}*/

/*.jbao-list-wrap::-webkit-scrollbar-thumb, .left-menu::-webkit-scrollbar-thumb {*/
/*border-radius: 10px;*/
/*-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);*/
/*background: #535353;*/
/*}*/

/*.jbao-list-wrap::-webkit-scrollbar-track, .left-menu::-webkit-scrollbar-track {*/
/*-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);*/
/*border-radius: 10px;*/
/*background: #EDEDED;*/
/*}*/

/*.jbao-list-wrap::-moz-scrollbar, .left-menu::-moz-scrollbar {*/
/*width: 5px;*/
/*height: 20px;*/
/*}*/

/*.jbao-list-wrap::-moz-scrollbar-thumb, .left-menu::-moz-scrollbar-thumb {*/
/*border-radius: 10px;*/
/*-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);*/
/*background: #535353;*/
/*}*/

/*.jbao-list-wrap::-moz-scrollbar-track, .left-menu::-moz-scrollbar-track {*/
/*-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);*/
/*border-radius: 10px;*/
/*background: #EDEDED;*/
/*}*/

/*.jbao-list-wrap::-o-scrollbar, .left-menu::-o-scrollbar {*/
/*width: 5px;*/
/*height: 20px;*/
/*}*/

/*.jbao-list-wrap::-o-scrollbar-thumb, .left-menu::-o-scrollbar-thumb {*/
/*border-radius: 10px;*/
/*-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);*/
/*background: #535353;*/
/*}*/

/*.jbao-list-wrap::-o-scrollbar-track, .left-menu::-o-scrollbar-track {*/
/*-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);*/
/*border-radius: 10px;*/
/*background: #EDEDED;*/
/*}*/

/*.jbao-list-wrap::-ms-scrollbar, .left-menu::-ms-scrollbar {*/
/*width: 5px;*/
/*height: 20px;*/
/*}*/

/*.jbao-list-wrap::-ms-scrollbar-thumb, .left-menu::-ms-scrollbar-thumb {*/
/*border-radius: 10px;*/
/*-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);*/
/*background: #535353;*/
/*}*/

/*.jbao-list-wrap::-ms-scrollbar-track, .left-menu::-ms-scrollbar-track {*/
/*-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);*/
/*border-radius: 10px;*/
/*background: #EDEDED;*/
/*}*/

.jbao-list-row {
  position: relative;
  float: left;
  width: 143px;
  height: auto;
  margin-bottom: 10px;
  cursor: pointer;
}

.jbao-list-row:hover img {
  transform: scale(1.2);
}

.jbao-list-icno {
  width: 90%;
  height: 106px;
  margin: 0 auto;
}

.jbao-list-icno img {
  display: block;
  width: 80%;
  margin: 12px auto 0;
  transition: all .2s;
}

.jbao-list-name {
  color: #fff;
  font-size: 12px;
  text-align: center;
  transition: opacity .2s;
}

.jbao-list-row:hover .jbao-list-name {
  opacity: 0;
}

.jbao-list-row:hover a {
  display: block;
}

.jbao-list-row a {
  position: absolute;
  top: 50px;
  left: 20px;
  display: none;
  width: 110px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 15px;
  background-image: linear-gradient(to top right, rgba(52, 27, 98, .8) 0%, rgba(154, 93, 255, .8) 100%);
  transition: all 0.3s;
  color: #fff;
}

.jbao-list-row a:hover {
  background-image: linear-gradient(to top right, rgba(52, 27, 98, 1) 0%, rgba(154, 93, 255, 1) 100%);
}