.index__banner{ height: 15rem; position: relative; width: 100%; border-radius: .8rem; overflow: hidden}
.index__banner img{ width: 100%; height: 100%; object-fit: cover}
.index__tip{ padding-top: 1.5rem; box-sizing: border-box; height: 9.2rem; background: url("../img/tip.png") no-repeat; background-size: 100%; margin-top: .8rem; position: relative; text-align: center; color: #fff; font-weight: bold; font-size: 1.4rem}
.index__tip__href{ color: #fff; font-size: 1.2rem; display: unset}
.index__tip__logo{ width: 8rem; height: 8rem; position: absolute; left: .5rem; top: .5rem; border-radius: 50%; overflow: hidden; display: block}
.index__tip__logo img{ width: 100%; height: 100%}
.index__tip__exchange{ width: 5rem; height: 5rem; padding-bottom: .5rem; box-sizing: border-box; background: url("../img/exchange.png") no-repeat; background-size: 100%; display: flex; align-items: flex-end; justify-content: center; color: #fff; font-size: 1.2rem; position: absolute; right: 1.5rem; top: 2.2rem}
.index__title{ width: 9.2rem; height: 4.6rem; font-weight: bold; font-size: 1.6rem; color: #914B13; display: flex; align-items: center; justify-content: center; background: url("../img/bet-title.png") no-repeat; background-size: 100%; margin: 1rem auto 0 auto}


.index__game{ width: calc(100% + 1rem); height: 20.5rem; margin-top: 1.3rem; overflow-x: scroll; overflow-y: hidden}
.index__game::-webkit-scrollbar { width: 3px; height: 0}
.index__game::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(0,0,0,.1)}
.index__game::-webkit-scrollbar-track { border-radius: 10px; background: #fff}
.index__game__box{ width: 78rem; height: 20.5rem; display: flex}
.index__game__card1{ background: url("../img/card1.png") no-repeat; background-size: 100%}
.index__game__card2{ background: url("../img/card2.png") no-repeat; background-size: 100%}
.index__game__btn1{ background: url("../img/card1-btn.png") no-repeat; background-size: 100%}
.index__game__btn2{ background: url("../img/card2-btn.png") no-repeat; background-size: 100%}
.index__game__item{ width: 11.5rem; height: 20.5rem; margin-right: 1.5rem; display: flex; align-items: center; justify-content: center; flex-direction: column}
.index__game__icon{ width: 8.2rem; height: 8.2rem; border-radius: 50%; overflow: hidden; position: relative; display: block}
.index__game__icon img{ width: 100%; height: 100%}
.index__game__btn{ width: 9rem; height: 2.7rem; margin-top: -.5rem; display: flex; align-items: center; z-index: 1; justify-content: center; font-size: 1.4rem; font-weight: bold; color: #fff}
.index__game__name{ font-weight: bold; font-size: 1.6rem; color: #fff; margin-top: .5rem; display: block}
.index__game__tip{ font-size: 1.2rem; color: #fff; text-align: center; display: block}
.index__game__tip span{ font-size: 1.2rem; color: #fff}
.index__game__foot{  width: 9rem; height: 2.7rem; background: rgba(0, 0, 0, .2); border-radius: 1.3rem; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.2rem; margin-top: .5rem}
.index__game__foot span{ color: #fff; font-size: 1.2rem}

.index__btn{ height: 6.1rem; display: flex; align-items: center; justify-content: space-between; margin-top: 1.5rem}
.index__btn__href{ width: calc(50% - .3rem); height: 6.1rem; background: url("../img/index-btn.png") no-repeat; background-size: 100%; display: flex; align-items: center; justify-content: center}
.index__btn__icon{ width: 2rem; height: 2rem; display: block}
.index__btn__icon img{ width: 100%; height: 100%}
.index__btn__txt{ color: #FFCD17; font-size: 1.6rem; font-weight: bold; display: block; margin: 0 .5rem}
.index__btn__arrow{ width: 2.6rem; height: 1.5rem; background: url("../img/index-arrow.png") no-repeat; background-size: 100%; display: block}

.index__tabs{ height: 5rem; margin-top: 1.4rem; display: flex}
.index__tabs__href1{ width: 25%; height: 5rem; background: url("../img/tabs1.png") no-repeat; background-size: 100%; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; color: #0B163C; font-weight: bold; text-align: center}
.index__tabs__href1--on{ background: url("../img/tabs1-on.png") no-repeat; background-size: 100%; color: #914B13}
.index__tabs__href2{ width: 25%; height: 5rem; background: url("../img/tabs2.png") no-repeat; background-size: 100%; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; color: #0B163C; font-weight: bold; text-align: center}
.index__tabs__href2--on{ background: url("../img/tabs2-on.png") no-repeat; background-size: 100%; color: #914B13}
.index__tabs__href3{ width: 25%; height: 5rem; background: url("../img/tabs3.png") no-repeat; background-size: 100%; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; color: #0B163C; font-weight: bold; text-align: center}
.index__tabs__href3--on{ background: url("../img/tabs3-on.png") no-repeat; background-size: 100%; color: #914B13}
.index__tabs__href4{ width: 25%; height: 5rem; background: url("../img/tabs4.png") no-repeat; background-size: 100%; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; color: #0B163C; font-weight: bold; text-align: center}
.index__tabs__href4--on{ background: url("../img/tabs4-on.png") no-repeat; background-size: 100%; color: #914B13}

.index__box{ display: none}
.index__box--on{ display: block}

.index__table__tip{ padding: 1rem 0; text-align: center; display: flex; align-items: center; justify-content: center; font-weight: bold; color: #F7DFBA; font-size: 1.4rem; margin-top: .5rem; border-bottom: 1px solid #314487}
.index__table__head{ height: 4.3rem; display: flex}
.index__table__th{ width: calc(100% / 3); height: 4.3rem; display: flex; align-items: center; justify-content: center; color: #F7DFBA; font-size: 1.4rem}
.index__table__list{ height: 5rem; background: url("../img/index-list.png") no-repeat; background-size: 100%; margin-bottom: .5rem; display: flex}
.index__table__td{ width: calc(100% / 3); height: 5rem; display: flex; align-items: center; justify-content: center}
.index__table__td img{ width: 6.4rem; height: 2rem; display: block}
.index__table__txt{ color: #F7DFBA; font-size: 1.4rem}
.index__table__href{ color: #C99C60; font-size: 1.4rem}

.index__prize{ height: 35rem; border-radius: .5rem; margin-top: 1.3rem; background: linear-gradient(0deg, #1C1F48, #2C3270); display: flex; flex-direction: column; align-items: center; justify-content: center}
.index__prize__title{ font-size: 1.6rem; color: #fff; display: block}
.index__prize__img{ width: 12.2rem; height: 12.2rem; background: url("../img/index-cion.png") no-repeat; background-size: 100%; margin-top: 6.8rem; display: block}
.index__prize__tip{ font-size: 1.6rem; color: #9096D5; margin-top: 6rem; padding: 0 1rem; text-align: center; display: block}

.index__address{ height: 28rem; padding: .5rem; box-sizing: border-box; border-radius: .5rem .3rem; margin-top: 1.3rem; background: linear-gradient(0deg, #1C1F48, #2C3270)}
.index__address__tabs{ height: 4rem; overflow-x: scroll; overflow-y: hidden}
.index__address__tabs::-webkit-scrollbar { width: 3px; height: 0}
.index__address__tabs::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(0,0,0,.1)}
.index__address__tabs::-webkit-scrollbar-track { border-radius: 10px; background: #fff}
.index__address__tabs__box{ width: 50.4rem; height: 4rem; display: flex}
.index__address__href{ height: 4rem; width: 8rem; margin: 0 .2rem; display: flex; align-items: center; justify-content: center; background: #202652; border-radius: .5rem; font-size: 1.4rem; color: #8B90C2}
.index__address__href--on{ background: linear-gradient(45deg, #FFAA00, #FDED33); color: #942617; font-weight: bold}
.index__address__box{ display: none; flex-direction: column; align-items: center; justify-content: center}
.index__address__box--on{ display: flex}
.index__address__title{ color: #fff; font-size: 1.4rem; display: block; margin-top: 2.5rem}
.index__address__input{ width: 33.5rem; height: 4rem; padding: 0 2.4rem; box-sizing: border-box; border-radius: 2rem; background: rgba(0, 0, 0, .3); margin-top: 1.5rem; font-size: 1.6rem; color: #fff; display: flex; align-items: center; justify-content: center}
.index__address__input input{ width: 100%; height: 100%; background: transparent; border: 0; color: #fff; text-align: center; font-size: 1.6rem}
.index__address__btn{ width: 20rem; height: 4.9rem; background: url("../img/invitation-btn.png") no-repeat; background-size: 100%; margin-top: 5rem; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; color: #FFFFFF; font-weight: bold}