.diceduel-container {
  background: #06182F;
  padding: 1.44rem 0;
  height: 100vh;
  overflow-y: scroll;
}
.van-popup-class {
  height: 90%;
}

/* Bet amount */
.betamount-container {
  padding: 0.66667rem 0.45333rem 0;
}
.betamount-container .title {
  color: white;
  opacity: 0.4;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
}
.betamount-container .bottom {
  margin-top: 0.29333rem;
  background: #021022;
  padding: 0.26667rem 0.29333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-radius: 0.10667rem;
  border-bottom: 0.02667rem solid #1C3658;
}
.betamount-container .bottom .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.betamount-container .bottom .bet {
  margin-left: 0.16rem;
  color: white;
  font-size: 0.4rem;
  font-family: Barlow;
  width: 1.6rem;
  background: transparent;
}
.betamount-container .bottom .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.betamount-container .bottom .right .btn {
  background: #12233B;
  margin-left: 0.26667rem;
  border-radius: 0.10667rem;
  color: white;
  font-size: 0.34667rem;
  font-family: Barlow;
  padding: 0.21333rem 0.32rem;
}

/* Game Model */
.gamemodel-container {
  padding: 0.66667rem 0.45333rem 0;
}
.gamemodel-container .title {
  color: white;
  opacity: 0.4;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
}
.gamemodel-container .bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.gamemodel-container .bottom .padding {
  width: 0.29333rem;
}
.gamemodel-container .bottom .model {
  margin-top: 0.29333rem;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background: #0F2036;
  border-radius: 0.10667rem;
  padding: 0.13333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.gamemodel-container .bottom .model span {
  font-size: 0.4rem;
  font-weight: bold;
  font-family: Barlow;
  line-height: 0.53333rem;
  margin-left: 0.26667rem;
}
.gamemodel-container .bottom .model .doubt {
  position: absolute;
  right: 0.10667rem;
  top: 0.10667rem;
}
.gamemodel-container .bottom .left {
  color: #FED152;
}
.gamemodel-container .bottom .selectLeft {
  border: 0.02667rem solid #FED152;
}
.gamemodel-container .bottom .normal {
  border: 0.02667rem solid #06182F;
}
.gamemodel-container .bottom .right {
  color: #FF8834;
}
.gamemodel-container .bottom .selectRight {
  border: 0.02667rem solid #FF8834;
}

/* Players */
.players-container {
  padding: 0.66667rem 0.45333rem 0;
}
.players-container .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.players-container .title span {
  color: white;
  opacity: 0.4;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
}
.players-container .bottom {
  margin-top: 0.29333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.players-container .bottom .count-box {
  border-radius: 0.10667rem;
  background: #021022;
  padding: 0.42667rem 0.29333rem;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.players-container .bottom .count-box .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.players-container .bottom .count-box .left span {
  color: white;
  margin-left: 0.16rem;
  font-size: 0.4rem;
  font-family: Barlow;
  font-weight: bold;
}
.players-container .bottom .createbtn {
  margin: 0 0.8rem 0 0.29333rem;
  background: #33C16C;
  height: 1.41333rem;
  color: white;
  border-radius: 0.10667rem;
  padding: 0.42667rem;
  font-size: 0.4rem;
  vertical-align: center;
  font-family: Barlow;
  font-weight: bold;
}
.players-container .bottom .switch {
  height: 0.66667rem;
  width: 1.41333rem;
  border-radius: 0.66667rem;
  position: relative;
}
.players-container .bottom .open {
  background: #0F2036;
}
.players-container .bottom .close {
  background: #021022;
}
.players-container .bottom .switch .slider {
  margin: 0.08rem;
  position: absolute;
  width: 0.50667rem;
  height: 0.50667rem;
  border-radius: 0.50667rem;
}
.players-container .bottom .switch .left {
  left: 0;
  background: #0F2036;
}
.players-container .bottom .switch .right {
  right: 0;
  background: #33C16C;
}

/* Buy In */
.buyin-container {
  padding: 0.66667rem 0.45333rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.buyin-container .item {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.buyin-container .item .title {
  color: white;
  opacity: 0.4;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
}
.buyin-container .padding {
  width: 0.29333rem;
}
.buyin-container .item .bottom {
  margin-top: 0.29333rem;
  background: #0F2036;
  padding: 0.24rem 0.29333rem;
  border-radius: 0.10667rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.buyin-container .item .bottom span {
  color: white;
  font-size: 0.4rem;
  font-family: Barlow;
  font-weight: bold;
  margin-left: 0.16rem;
}

/* line */
.line {
  margin: 0.66667rem 0.45333rem 0 0.45333rem;
  background: #2A3B50;
  height: 0.02667rem;
}

/* My Games */
.mygames-container {
  padding: 0.66667rem 0.45333rem 0;
}
.mygames-container .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.mygames-container .title .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.mygames-container .title span {
  color: white;
  opacity: 0.4;
  font-size: 0.4rem;
  font-family: Barlow;
  font-weight: bold;
}
.mygames-container .title .count {
  margin-left: 0.29333rem;
  border-radius: 0.10667rem;
  background: #16263B;
  padding: 0.13333rem 0.21333rem;
  color: white;
  opacity: 0.4;
  font-size: 0.29333rem;
  font-family: Barlow;
  font-weight: bold;
}
.mygames-container .list-item {
  background: #0F2036;
  margin-top: 0.45333rem;
  position: relative;
}
.mygames-container .list-item .top {
  padding: 0.29333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mygames-container .list-item .top .info {
  margin-left: 1.09333rem;
}
.mygames-container .list-item .top .info .name {
  color: white;
  font-size: 0.4rem;
  font-family: Barlow;
  font-weight: bold;
}
.mygames-container .list-item .top .info .gametype1 {
  color: #FED152;
}
.mygames-container .list-item .top .info .gametype2 {
  color: #FF8834;
}
.mygames-container .list-item .top .info .padding {
  height: 0.24rem;
}
.mygames-container .list-item .top .info .data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mygames-container .list-item .top .info .data .money-box {
  background: #06182F;
  border-radius: 0.10667rem;
  padding: 0.18667rem 0.21333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.mygames-container .list-item .top .info .data .player-box {
  background: #06182F;
  border-radius: 0.10667rem;
  padding: 0.18667rem 0.21333rem;
  margin-left: 0.16rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.mygames-container .list-item .top .info .data span {
  color: white;
  font-size: 0.24rem;
  font-family: Barlow;
  font-weight: bold;
  margin-left: 0.08rem;
}
.mygames-container .list-item .top .info .data .total {
  color: white;
  opacity: 0.4;
  font-size: 0.16rem;
  font-family: Barlow;
  font-weight: bold;
}
.mygames-container .list-item .progress {
  background: #2A3B50;
  height: 0.05333rem;
  border-radius: 0.05333rem;
  position: relative;
}
.mygames-container .list-item .progress .real {
  background: red;
  height: 0.05333rem;
  width: 40%;
}
.mygames-container .list-item .progress .gametype1 {
  background: #FED152;
}
.mygames-container .list-item .progress .gametype2 {
  background: #FF8834;
}
.mygames-container .list-item .now {
  position: absolute;
  right: 0;
  top: 0;
}
.mygames-container .recent-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0.66667rem 0;
}
.mygames-container .recent-container .recent-box {
  padding: 0.16rem 0.37333rem 0.16rem 0.16rem;
  background: #16263B;
  border-radius: 0.10667rem;
}
.mygames-container .recent-container .recent-box span {
  color: #33C16C;
  font-size: 0.29333rem;
  margin-left: 0.16rem;
  font-family: Barlow;
  font-weight: bold;
}

/* All Games */
.allgames-container {
  padding: 0.66667rem 0.45333rem 0;
}
.allgames-container .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.allgames-container .title .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.allgames-container .title .left span {
  color: white;
  opacity: 0.4;
  font-size: 0.4rem;
  font-family: Barlow;
  font-weight: bold;
}
.allgames-container .title .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.allgames-container .title .right span {
  color: white;
  opacity: 0.4;
  font-size: 0.37333rem;
  font-family: Barlow;
  font-weight: 400;
}
.allgames-container .title img {
  margin-left: 0.16rem;
}
.allgames-container .allgames-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.allgames-container .allgames-list .list-item {
  background: #12233B;
  border-radius: 0.10667rem;
  margin-top: 0.4rem;
  width: 48.5%;
  position: relative;
}
.allgames-container .list-item .model {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  border-radius: 0.10667rem;
  padding: 0.13333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.allgames-container .list-item .model span {
  font-size: 0.4rem;
  font-weight: bold;
  font-family: Barlow;
  line-height: 0.53333rem;
  margin-left: 0.26667rem;
  white-space: pre-wrap;
}
.allgames-container .list-item .model .gametype1 {
  color: #FED152;
}
.allgames-container .list-item .model .gametype2 {
  color: #FF8834;
}
.allgames-container .list-item .list-item-line {
  background: #223248;
  height: 0.02667rem;
}
.allgames-container .padding {
  width: 0.29333rem;
}
.allgames-container .list-item .data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0.16rem 0.13333rem;
}
.allgames-container .list-item .data .money-box {
  background: #06182F;
  border-radius: 0.10667rem;
  padding: 0.18667rem 0.21333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.allgames-container .list-item .data .money-box span {
}
.allgames-container .list-item .data .player-box {
  background: #06182F;
  border-radius: 0.10667rem;
  padding: 0.13333rem 0.21333rem 0.13333rem 0.16rem;
  margin-left: 0.16rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.allgames-container .list-item .data span {
  color: white;
  font-size: 0.18667rem;
  font-family: Barlow;
  font-weight: bold;
  margin-left: 0.08rem;
}
.allgames-container .list-item .data .total {
  color: white;
  opacity: 0.4;
  font-size: 0.13333rem;
  font-family: Barlow;
  font-weight: bold;
}
.allgames-container .list-item .progress {
  background: #2A3B50;
  height: 0.05333rem;
  border-radius: 0.05333rem;
  position: relative;
  bottom: 0;
}
.allgames-container .list-item .progress .real {
  background: red;
  height: 0.05333rem;
}
.allgames-container .list-item .progress .gametype1 {
  background: #FED152;
}
.allgames-container .list-item .progress .gametype2 {
  background: #FF8834;
}
.allgames-container .title .count {
  margin-left: 0.29333rem;
  border-radius: 0.10667rem;
  background: #16263B;
  padding: 0.13333rem 0.21333rem;
  color: white;
  opacity: 0.4;
  font-size: 0.29333rem;
  font-family: Barlow;
  font-weight: bold;
}
.allgames-container .allgames-list .list-item .now {
  position: absolute;
  right: 0;
  top: 0;
}
.allgames-container .recent-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0.66667rem 0;
}
.allgames-container .recent-container .recent-box {
  padding: 0.16rem 0.37333rem 0.16rem 0.16rem;
  background: #16263B;
  border-radius: 0.10667rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.allgames-container .recent-container .recent-box span {
  color: #33C16C;
  font-size: 0.29333rem;
  margin-left: 0.16rem;
  font-family: Barlow;
  font-weight: bold;
}
.allgames-container .recent-container .recent-box .remain {
  padding: 0.13333rem 0.21333rem;
  background: #06182F;
  font-size: 0.29333rem;
  border-radius: 0.10667rem;
  margin-left: 0.16rem;
  color: #33C16C;
  font-family: Barlow;
  font-weight: bold;
}

/* Previous winners */
.previous-container {
  padding-top: 0.66667rem;
}
.previous-container .title {
  color: white;
  opacity: 0.4;
  font-size: 0.4rem;
  padding: 0 0.45333rem;
  font-family: Barlow;
  font-weight: bold;
}
.previous-container .toolbar {
  background: #031327;
  margin: 0.45333rem 0.37333rem 0 0.37333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0.24rem 0.72rem 0.24rem 0.58667rem;
}
.previous-container .toolbar span {
  color: #334B69;
  font-size: 0.29333rem;
  font-family: Barlow;
  font-weight: bold;
}
.previous-container .list-item {
  margin: 0 0.37333rem;
  padding: 0.29333rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.previous-container .single {
  background: #06182F;
}
.previous-container .double {
  background: #0E1D31;
}
.previous-container .list-item .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 30%;
}
.previous-container .list-item .left .phone {
  opacity: 0.8;
}
.previous-container .list-item .center {
  padding-left: 0.53333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 30%;
}
.previous-container .list-item span {
  color: white;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
}
.previous-container .list-item .phone {
  margin-left: 0.29333rem;
}
.previous-container .list-item .amount {
  margin-left: 0.05333rem;
}
.previous-container .list-item .view {
  padding: 0.24rem 0.72rem;
  border-radius: 0.10667rem;
  background: #16263B;
  color: #33C16C;
  font-size: 0.29333rem;
  font-family: Barlow;
  font-weight: bold;
}

/* Game Detail */
.gamedetail-container {
  background: #06182F;
  overflow-y: scroll;
  height: 100%;
  position: relative;
}
.gamedetail-container .title {
  color: white;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
  opacity: 0.4;
  padding-top: 0.66667rem;
  padding-left: 0.45333rem;
}
.gamedetail-container .list-item {
  background: #0F2036;
  margin: 0.29333rem 0.45333rem 0 0.45333rem;
  position: relative;
}
.gamedetail-container .list-item .top {
  padding: 0.29333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.gamedetail-container .list-item .top .info {
  margin-left: 1.09333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.gamedetail-container .list-item .top .info .name {
  color: white;
  font-size: 0.4rem;
  font-family: Barlow;
  font-weight: bold;
}
.gamedetail-container .list-item .top .info .padding {
  height: 0.24rem;
}
.gamedetail-container .list-item .top .info .desc {
  color: white;
  opacity: 0.4;
  font-size: 0.29333rem;
  font-family: Barlow;
  font-weight: bold;
}
.gamedetail-container .infodetail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0.66667rem 0.45333rem 0 0.45333rem;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
}
.gamedetail-container .infodetail .item {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.gamedetail-container .infodetail .padding {
  width: 0.29333rem;
}
.gamedetail-container .infodetail .center {
  margin: 0 0.29333rem;
}
.gamedetail-container .infodetail .item .toptitle {
  color: white;
  opacity: 0.4;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
}
.gamedetail-container .infodetail .item .data {
  margin-top: 0.29333rem;
  background: #132439;
  border-radius: 0.10667rem;
  padding: 0.24rem 0.29333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.gamedetail-container .infodetail .item .data span {
  color: white;
  font-family: Barlow;
  font-weight: bold;
  margin-left: 0.16rem;
  white-space: pre-wrap;
}
.gamedetail-container .status {
  color: white;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
  text-align: center;
  margin-top: 0.66667rem;
  padding: 0.24rem 0;
}
.gamedetail-container .list-item .progress {
  background: #020408;
  height: 0.05333rem;
  border-radius: 0.05333rem;
  position: relative;
}
.gamedetail-container .list-item .progress .real {
  background: red;
  height: 0.05333rem;
  width: 40%;
}
.gamedetail-container .list-item .progress .gametype1 {
  background: #FED152;
}
.gamedetail-container .list-item .progress .gametype2 {
  background: #FF8834;
}
.gamedetail-container .list-item .now {
  position: absolute;
  right: 0;
  top: 0;
}

/* Partiipate */
.gamedetail-container .participate-container {
  padding-top: 0.66667rem;
  padding-bottom: 3.57333rem;
}
.gamedetail-container .close {
  position: fixed;
  right: 0;
  margin: 0.29333rem 0.42667rem;
  z-index: 999;
}
.gamedetail-container .participate-container .title {
  color: white;
  opacity: 0.4;
  font-size: 0.4rem;
  padding: 0 0.45333rem;
  font-family: Barlow;
}
.gamedetail-container .participate-container .toolbar {
  background: #031327;
  margin: 0.45333rem 0.37333rem 0 0.37333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0.24rem 0.72rem 0.24rem 0.58667rem;
}
.gamedetail-container .participate-container .toolbar span {
  color: #334B69;
  font-size: 0.29333rem;
  font-family: Barlow;
  font-weight: bold;
}
.gamedetail-container .participate-container .list-item {
  margin: 0 0.37333rem;
  padding: 0.29333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.gamedetail-container .participate-container .list-item .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 30%;
}
.gamedetail-container .participate-container .list-item .center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 20%;
}
.gamedetail-container .participate-container .list-item span {
  color: white;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: 400;
}
.gamedetail-container .participate-container .list-item .left .phone {
  font-weight: 400;
  opacity: 0.8;
}
.gamedetail-container .participate-container .list-item .rolled {
  color: white;
  font-size: 0.34667rem;
  font-family: Barlow;
  text-align: left;
  width: 25%;
  opacity: 0.8;
  font-weight: 400;
}
.gamedetail-container .participate-container .list-item .amount {
  margin-left: 0.05333rem;
}
.bottombar {
  position: fixed;
  width: 100%;
  bottom: 0;
  padding: 0.45333rem 0.24rem 1.12rem 0.45333rem;
  background: #06182F;
  -webkit-box-shadow: 0 -0.05333rem 0.08rem rgba(0, 0, 0, 0.5);
          box-shadow: 0 -0.05333rem 0.08rem rgba(0, 0, 0, 0.5);
}
.bottombar .bottombar-title {
  color: white;
  opacity: 0.4;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
}
.bottombar .bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 0.16rem;
}
.bottombar .padding {
  width: 0.29333rem;
}
.bottombar .bottom .btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #021022;
  border-bottom: 0.02667rem solid #1C3658;
  padding: 0 0.26667rem;
  height: 1.44rem;
  border-radius: 0.10667rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.bottombar .bottom .btn-box .coin {
  width: 1.22667rem;
  text-align: center;
  color: white;
  font-size: 0.4rem;
  font-family: Barlow;
  font-weight: bold;
}
.bottombar .bottom .btn-box .btn {
  color: white;
  font-size: 0.58667rem;
  background: #12233B;
  height: 0.90667rem;
  width: 0.90667rem;
  text-align: center;
  border-radius: 0.10667rem;
  font-family: Barlow;
}
.bottombar .bottom .coin-box {
  background: #0F2036;
  border-radius: 0.10667rem;
  padding: 0 0.29333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 1.44rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.bottombar .bottom .coin-box span {
  color: white;
  font-size: 0.4rem;
  font-family: Barlow;
  font-weight: bold;
  margin-left: 0.16rem;
}
.bottombar .bottom .joinbtn {
  color: white;
  font-size: 0.32rem;
  font-family: Barlow;
  font-weight: bold;
  width: 2.90667rem;
  text-align: center;
  height: 1.41333rem;
  line-height: 1.41333rem;
  background: #33C16C;
  border-radius: 0.10667rem;
}

/* history */
.history-container {
  background: #06182F;
  overflow-y: scroll;
  height: 100%;
}
.history-container .close {
  position: fixed;
  right: 0;
  margin: 0.29333rem 0.42667rem;
  z-index: 999;
}
.history-container .title {
  color: white;
  opacity: 0.4;
  font-size: 0.4rem;
  padding: 0.66667rem 0.45333rem 0 0.45333rem;
  font-family: Barlow;
  font-weight: bold;
}
.history-container .toolbar {
  background: #031327;
  margin: 0.45333rem 0.37333rem 0 0.37333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0.24rem 0.72rem 0.24rem 0.58667rem;
}
.history-container .toolbar span {
  color: #334B69;
  font-size: 0.29333rem;
  font-family: Barlow;
  font-weight: bold;
}
.history-container .list-item {
  margin: 0 0.37333rem;
  padding: 0.29333rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.history-container .single {
  background: #06182F;
}
.history-container .double {
  background: #0E1D31;
}
.history-container .list-item .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 30%;
}
.history-container .list-item .center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 20%;
}
.history-container .list-item span {
  color: white;
  font-size: 0.34667rem;
  font-family: Barlow;
  font-weight: bold;
}
.history-container .list-item .phone {
  margin-left: 0.29333rem;
}
.history-container .list-item .amount {
  margin-left: 0.05333rem;
}
.history-container .list-item .view {
  padding: 0.24rem 0.72rem;
  border-radius: 0.10667rem;
  background: #16263B;
  color: #33C16C;
  font-size: 0.29333rem;
  font-family: Barlow;
  font-weight: bold;
}
.history-container .recent-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0.66667rem 0;
}
.history-container .recent-container .recent-box {
  padding: 0.16rem 0.37333rem 0.16rem 0.16rem;
  background: #16263B;
  border-radius: 0.10667rem;
}
.history-container .recent-container .recent-box span {
  color: #33C16C;
  font-size: 0.29333rem;
  margin-left: 0.16rem;
  font-family: Barlow;
  font-weight: bold;
}
.van-dialog__message {
  text-align: left;
}
.pc {
  display: none;
}


@media only screen and (min-width: 750px) {
.pc[data-v-57dae26e] {
    display: block;
}
.diceduel-container[data-v-57dae26e] {
    padding: 0;
}
.diceduel-container-top[data-v-57dae26e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
.diceduel-container-top .diceduel-container-top-logo[data-v-57dae26e] {
    padding: 0.8rem 0 0 0.42667rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
}
.diceduel-container-top .diceduel-container-top-logo .icon[data-v-57dae26e] {
    width: 0.74667rem;
    height: 0.74667rem;
}
.diceduel-container-top .diceduel-container-top-logo .name[data-v-57dae26e] {
    margin-left: 0.26667rem;
    color: white;
    font-size: 0.42667rem;
}
.diceduel-container-top .diceduel-container-top-logo .bg[data-v-57dae26e] {
    width: 3.2rem;
    height: 3.04rem;
    position: absolute;
}
.diceduel-container-top .diceduel-container-top-right[data-v-57dae26e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.diceduel-container-top .diceduel-container-top-right .bet[data-v-57dae26e] {
    width: 2.66667rem;
}
.diceduel-container-top .diceduel-container-top-right .diceduelBottom[data-v-57dae26e] {
    margin-left: 1.6rem;
}
.diceduel-container-model[data-v-57dae26e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin: 0 0.42667rem;
}
.diceduel-container-model .diceduel-container-model-item[data-v-57dae26e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-top: 0.53333rem;
    background-color: #0C1F36;
    padding: 0.24rem 0.53333rem;
    border-radius: 0.21333rem;
    border: 0.02667rem solid #0C1F36;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-left[data-v-57dae26e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-left .icon[data-v-57dae26e] {
    width: 1.92rem;
    height: 1.92rem;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-left .title[data-v-57dae26e] {
    margin-left: 0.42667rem;
    font-size: 0.48rem;
    color: #FED152;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-left .random[data-v-57dae26e] {
    color: #F77018;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-right[data-v-57dae26e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-right .line[data-v-57dae26e] {
    background-color: rgba(255, 255, 255, 0.1);
    height: 0.53333rem;
    width: 0.02667rem;
    margin-bottom: 0.66667rem;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-right .item[data-v-57dae26e] {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    border-radius: 0.10667rem;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-right .item .title[data-v-57dae26e] {
    color: #697482;
    font-size: 0.24rem;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-right .item .bottom[data-v-57dae26e] {
    margin-left: 0.32rem;
    background-color: #09192D;
    padding: 0.26667rem;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-right .item .bottom img[data-v-57dae26e] {
    width: 0.61333rem;
    height: 0.61333rem;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-right .item .bottom span[data-v-57dae26e] {
    margin-left: 0.21333rem;
    color: white;
    font-size: 0.24rem;
}
.diceduel-container-model .diceduel-container-model-item .diceduel-container-model-item-right .doubt[data-v-57dae26e] {
    margin-left: 1.06667rem;
    width: 0.53333rem;
    height: 0.53333rem;
}
.diceduel-container-model .active0[data-v-57dae26e] {
    border: 0.02667rem solid #FED152;
}
.diceduel-container-model .active1[data-v-57dae26e] {
    border: 0.02667rem solid #F77018;
}
.mygames-container .mygames-list[data-v-57dae26e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}
.mygames-container .list-item[data-v-57dae26e] {
    width: 32%;
}
.allgames-container .allgames-list[data-v-57dae26e] {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}
.allgames-container .allgames-list .list-item[data-v-57dae26e] {
    width: 32%;
}
.allgames-list-margin[data-v-57dae26e] {
    margin-left: 0.42667rem;
}
.mobile[data-v-57dae26e] {
    display: none;
}
.van-popup--bottom[data-v-57dae26e] {
    top: 50%;
    left: 50%;
    width: 16rem;
    -webkit-transform: translate3d(-50%, -50%, 0);
            transform: translate3d(-50%, -50%, 0);
    background-color: transparent;
}
.gamedetail-container[data-v-57dae26e] {
    width: 16rem;
}
.van-popup-class[data-v-57dae26e] {
    height: 60%;
}
}
@media only screen and (min-width: 1220px) {
.diceduel[data-v-57dae26e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 0 3vm;
}
.diceduel-container[data-v-57dae26e] {
    max-width: 32.53333rem;
}
}