@charset "UTF-8";
html, body {
  font-family: "Helvetica Neue","Microsoft YaHei", Helvetica, STHeiTi, Arial, sans-serif;
}

html * {
  outline: 0;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
  -webkit-tap-highlight-color: transparent;
}

body, th, td, p, ol, ul, li, dl, dt, dd, a, h1, h2, h3, h4, h5, h6, form, fieldset, input, legend, select, textarea {
  margin: 0;
  padding: 0;
}

input, img, fieldset {
  border: none;
}

input, select, fieldset {
  vertical-align: middle;
}

ul, ol {
  padding-left: 0;
  list-style-type: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img {
  max-width: 100%;
  vertical-align: top;
}

i, cite, em, var, address, dfn {
  font-style: normal;
}

a:link {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:active {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

input:focus::-webkit-input-placeholder {
  color: transparent;
}

input:focus:-moz-placeholder, input:focus::-moz-placeholder {
  color: transparent;
}

button, input[type=button], input[type=password], input[type=submit], input[type=text], textarea {
  -webkit-appearance: none;
}

input:-ms-clear {
  display: none;
}

/* clear IE10 X */
input {
  -webkit-user-modify: read-write-plaintext-only;
}

select {
  overflow-x: hidden;
}

.clear::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
  line-height: 0;
  visibility: hidden;
}

.tl {
  text-align: left;
}

.tc {
  text-align: center;
}

.tr {
  text-align: right;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

.vm {
  vertical-align: middle;
}

.pr {
  position: relative;
}

.pa {
  position: absolute;
}

.none {
  display: none;
}

.block {
  display: block;
}

/* ellipsis */
.elli {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

del {
  text-decoration: line-through;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

html, body {
  width: 100%;
  max-width: 1062px;
  margin: 0 auto;
}

.index-content {
  width: 16rem;
}

.index-content .top {
  background: #1a222d;
  width: 16rem;
  position: fixed;
  top: 0;
  height: 2.42561rem;
  z-index: 999;
}

.index-content .top .icon {
  margin: 0.30132rem 0 0 0.48211rem;
  width: 1.80791rem;
  height: 1.80791rem;
}

.index-content .top .content {
  margin: 0.45198rem 0 0 0.15066rem;
}

.index-content .top .content .gamename {
  color: #ee760c;
  font-size: 0.55744rem;
}

.index-content .top .content .gamedec {
  color: #97caff;
  font-size: 0.48211rem;
}

.index-content .top .btn-box {
  width: 5.72505rem;
  margin: 0.67797rem 0.16573rem 0 0;
}

.index-content .top .btn-box .btn-down {
  background: #a51c1e;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  color: #ffffff;
  font-size: 0.49718rem;
  width: 2.04896rem;
  height: 1.12994rem;
  line-height: 1.12994rem;
  text-align: center;
}

.index-content .top .btn-box .btn-more {
  background: #d99030;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  color: #ffffff;
  font-size: 0.49718rem;
  width: 2.89266rem;
  height: 1.12994rem;
  line-height: 1.12994rem;
  text-align: center;
}

.index-content .part {
  width: 16rem;
}

.index-content .gift-box {
  width: 11.99247rem;
  margin: 0 auto;
  padding-top: 4.27872rem;
  overflow: hidden;
}

.index-content .gift-box .item {
  float: left;
  width: 2.78719rem;
  margin-right: 1.77778rem;
}

.index-content .gift-box .item:nth-of-type(3n) {
  margin-right: 0;
}

.index-content .gift-box .item .gift {
  background: url(../images/gift_bg.png) center top no-repeat;
  background-size: 100%  100%;
  width: 2.78719rem;
  height: 2.29002rem;
  padding-top: 0.45198rem;
}

.index-content .gift-box .item .gift .pic {
  display: block;
  width: 2.15443rem;
  height: 1.83804rem;
  margin: 0 auto 0;
}

.index-content .gift-box .item .name {
  color: #565b82;
  font-size: 0.51224rem;
  width: 2.78719rem;
  text-align: center;
  padding-top: 0.37665rem;
}

.index-content .gift-box .item .btn {
  background: url(../images/btn-get.png) center top no-repeat;
  background-size: 100%  100%;
  display: block;
  margin: 0.37665rem auto 0;
  width: 2.38041rem;
  height: 0.96422rem;
}

.index-content .gift-box .item .btn.done {
  background: url(../images/btn-done.png) center top no-repeat;
  background-size: 100%  100%;
}

.index-content .gift-box .item .btn.disabled {
  background: url(../images/btn-not.png) center top no-repeat;
  background-size: 100%  100%;
}

.index-content .tip-box {
  color: #4a5780;
  font-size: 0.64783rem;
  width: 100%;
  text-align: center;
  padding-top: 0.65rem;
}

.index-content .tip-box .strong {
  color: #ca545b;
  margin: 0 0.15066rem;
}

.index-content .part1 {
  background: url(../images/index_01.jpg) center top no-repeat;
  background-size: 100%  100%;
  height: 5.48399rem;
  padding-top: 28.26365rem;
  position: relative;
}

.index-content .part1 .btn-getgift {
  background: url(../images/btn-getGift.png) center top no-repeat;
  background-size: 100%  100%;
  display: block;
  width: 9.08475rem;
  height: 2.6968rem;
  margin: 0 auto;
}

.index-content .part1 .btn-getgift.done {
  background: url(../images/btn-ok.png) center top no-repeat;
  background-size: 100%  100%;
  width: 9.58192rem;
  height: 3.29944rem;
  left: 2.86252rem;
  top: 27.91714rem;
}

.index-content .part1 .role-msg {
  color: #86899c;
  display: none;
  font-size: 0.43691rem;
  width: 100%;
  text-align: center;
  margin: 0 auto 0;
}

.index-content .part1 .btn-mygift {
  background: url(../images/btn-mygift.png) center top no-repeat;
  background-size: 100%  100%;
  display: block;
  width: 2.6968rem;
  height: 0.87382rem;
  margin: 0.22599rem auto 0;
}

.index-content .part1 .btn_rule {
  background: url(../images/btn_rule.png) center top no-repeat;
  background-size: 100%  100%;
  width: 2.25989rem;
  height: 0.7533rem;
  position: absolute;
  right: 0;
  top: 2.63653rem;
}

.index-content .part2 {
  background: url(../images/index_02.jpg) center top no-repeat;
  background-size: 100%  100%;
  height: 12.98682rem;
  position: relative;
}

.index-content .part2 .service-box {
  width: 13.55932rem;
  height: 5.48399rem;
  overflow: hidden;
  position: absolute;
  left: 1.5rem;
  top: 4.58004rem;
  overflow: auto;
}

.index-content .part2 .service-box .scroll {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.index-content .part2 .service-box .item {
  color: #86899c;
  font-size: 0.36158rem;
  overflow: hidden;
  margin-bottom: 0.30132rem;
}

.index-content .part2 .service-box .item .left, .index-content .part2 .service-box .item .right {
  float: left;
  width: 6.1rem;
  text-align: center;
}

.index-content .part2 .service-box .item .right {
  float: right;
  width: 5.42373rem;
  margin-right: 1.5rem;
}

.index-content .part3 {
  background: url(../images/index_03.jpg) center top no-repeat;
  background-size: 100%  100%;
  height: 12.45951rem;
  position: relative;
}

.index-content .part4 {
  background: url(../images/index_04.jpg) center top no-repeat;
  background-size: 100%  100%;
  height: 13.21281rem;
}

.index-content .part4 .tip-box {
  padding-top: 0.75rem;
}

.index-content .part5 {
  background: url(../images/index_05.jpg) center top no-repeat;
  background-size: 100%  100%;
  height: 13.19774rem;
}

.index-content .part5 .tip-box {
  padding-top: 0.85rem;
}

.index-content .part5 .kefu {
  background: url(../images/btn-contact.png) center top no-repeat;
  background-size: 100%  100%;
  display: block;
  width: 3.01318rem;
  height: 1.08475rem;
  margin: 0.63277rem auto 0;
}

.index-content .part6 {
  background: url(../images/index_06.jpg) center top no-repeat;
  background-size: 100%  100%;
  height: 16.25612rem;
  padding-top: 3.76648rem;
}

.index-content .part6 .qrcode {
  display: block;
  width: 8.78343rem;
  height: 8.34652rem;
  margin: 0 auto;
}

.index-content .part6 .tip {
  display: block;
  width: 9.2806rem;
  height: 1.59699rem;
  margin: 0.42185rem auto 0;
}

.index-content .part6 .kefu {
  background: url(../images/btn-contact.png) center top no-repeat;
  background-size: 100%  100%;
  display: block;
  width: 6.25235rem;
  height: 2.25989rem;
  margin: 0.63277rem auto 0;
}

.index-content .btn-gift {
  background: url(../images/gift.png) center top no-repeat;
  background-size: 100%  100%;
  width: 2.35028rem;
  height: 2.57627rem;
  position: fixed;
  right: 0;
  top: 50%;
  z-index: 999;
}

.mCSB_scrollTools {
  width: 0.79849rem;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #86899c !important;
  border-radius: 0;
  width: 0.79849rem;
  opacity: 1;
  -webkit-opacity: 1;
}

.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {
  opacity: 1;
}

.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical {
  margin-top: 0;
}

.alert-box {
  background: rgba(0, 0, 0, 0.7);
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
}

.alert-box .inner {
  background: #fff;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  width: 13.54426rem;
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  padding: 0.34652rem 0 0.94915rem 0;
}

.alert-box .inner .close {
  background: url(../images/close.png) center top no-repeat;
  background-size: 100%  100%;
  position: absolute;
  right: 0.30132rem;
  top: 0.30132rem;
  width: 1.06968rem;
  height: 1.06968rem;
}

.alert-box .inner .title {
  display: block;
  width: 8.33145rem;
  margin: 0 auto;
}

.active-box .inner .active {
  display: block;
  width: 8.87382rem;
  margin: 0.78343rem auto 0;
}

.enter-box .inner .title {
  margin-bottom: 0.90395rem;
}

.enter-box .inner .set-box {
  width: 11.81168rem;
  margin: 0 auto 0.60264rem;
  position: relative;
  /*处理html placeholder 字体颜色问题*/
}

.enter-box .inner .set-box:nth-last-of-type(1) {
  margin-bottom: 0;
}

.enter-box .inner .set-box .set-title {
  color: #405583;
  font-size: 0.64783rem;
  margin-top: 0.4rem;
}

.enter-box .inner .set-box input {
  color: #405583;
  font-size: 0.64783rem;
}

.enter-box .inner .set-box input::-webkit-input-placeholder {
  /* WebKit browsers */
  color: rgba(64, 85, 131, 0.61);
}

.enter-box .inner .set-box input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: rgba(64, 85, 131, 0.61);
}

.enter-box .inner .set-box input::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: rgba(64, 85, 131, 0.61);
}

.enter-box .inner .set-box input:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: rgba(64, 85, 131, 0.61);
}

.enter-box .inner .set-box .set-content {
  position: relative;
}

.enter-box .inner .set-box .set-content .service, .enter-box .inner .set-box .set-content .platform {
  border: 1px solid #405583;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  display: inline-block;
  vertical-align: middle;
  width: 6.6rem;
  height: 1.20527rem;
}

.enter-box .inner .set-box .set-content .service-name, .enter-box .inner .set-box .set-content .platform-name {
  background: transparent;
  width: 5.2rem;
  height: 1.20527rem;
  vertical-align: top;
  padding-left: 0.15066rem;
}

.enter-box .inner .set-box .set-content .yz-box {
  border: 1px solid #405583;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  display: inline-block;
  vertical-align: middle;
  width: 9.2rem;
  height: 1.20527rem;
  overflow: hidden;
}

.enter-box .inner .set-box .set-content .yz-code {
  background: transparent;
  font-size: 0.5rem;
  width: 6.5rem;
  height: 1.20527rem;
  vertical-align: top;
  padding-left: 0.15066rem;
}

.enter-box .inner .set-box .set-content .btn-getyz {
  background: #405583;
  color: #fff;
  float: right;
  font-size: 0.36158rem;
  width: 2.5rem;
  height: 1.20527rem;
  line-height: 1.20527rem;
  text-align: center;
}

.enter-box .inner .set-box .set-content .select-tag {
  display: inline-block;
  vertical-align: top;
  width: 0;
  height: 0;
  border-left: 0.30132rem solid transparent;
  border-right: 0.30132rem solid transparent;
  border-top: 0.30132rem solid #405583;
  margin-top: 0.49718rem;
}

.enter-box .inner .set-box .set-content .service-list, .enter-box .inner .set-box .set-content .platform-list {
  background: #405583;
  display: none;
  width: 6.6rem;
  max-height: 6.02637rem;
  overflow: auto;
  position: absolute;
  left: 0;
  top: 1.35593rem;
  text-align: center;
}

.enter-box .inner .set-box .set-content .service-list li, .enter-box .inner .set-box .set-content .platform-list li {
  color: #fff;
  font-size: 0.64783rem;
  width: 100%;
  padding: 0.15066rem 0;
}

.enter-box .inner .set-box .set-content .service-list li.active, .enter-box .inner .set-box .set-content .platform-list li.active {
  background: #fff;
  color: #405583;
}

.enter-box .inner .set-box .tag {
  width: 0.6177rem;
  height: 0.58757rem;
  vertical-align: middle;
  margin-left: 0.18079rem;
}

.enter-box .inner .set-box .role-name {
  border: 1px solid #405583;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  width: 6.49341rem;
  height: 1.20527rem;
  line-height: 1.20527rem;
  padding-left: 0.15066rem;
}

.enter-box .inner .tip {
  width: 6.47834rem;
  height: 0.94915rem;
  margin: 0 0 0 3.46516rem;
}

.enter-box .inner .btn-enter {
  background: #ff9f40;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  color: #fff;
  font-size: 0.63277rem;
  display: block;
  width: 5.19774rem;
  height: 1.35593rem;
  line-height: 1.35593rem;
  text-align: center;
  margin: 0.82863rem auto 0;
}

.gift-detail-box .inner .gift-detail-title {
  border-bottom: 1px solid #dddddd;
  color: #000000;
  font-size: 0.63277rem;
  text-align: center;
  padding: 0.19586rem 0 0.54237rem 0;
}

.gift-detail-box .inner .gift-list {
  width: 11.14878rem;
  overflow: hidden;
  margin: 0.7533rem auto 0;
}

.gift-detail-box .inner .gift-list li {
  float: left;
  width: 3.71626rem;
  text-align: center;
}

.gift-detail-box .inner .gift-list li .gift {
  width: 2.51601rem;
  height: 2.51601rem;
}

.gift-detail-box .inner .gift-list li .gift-title {
  color: #000000;
  font-size: 0.48211rem;
  padding-top: 0.30132rem;
}

.success-box, .success2-box {
  z-index: 9999;
}

.success-box .inner .giftcode, .success2-box .inner .giftcode {
  color: #405684;
  font-size: 0.63277rem;
  text-align: center;
  padding-top: 1.35593rem;
  line-height: 0.69303rem;
}

.success-box .inner .btn-copy, .success2-box .inner .btn-copy {
  background: #ff9f40;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  color: #fff;
  font-size: 0.48211rem;
  display: block;
  width: 6.08663rem;
  height: 1.20527rem;
  line-height: 1.20527rem;
  text-align: center;
  margin: 0.69303rem auto 0;
}

.success-box .inner .btn-ok, .success2-box .inner .btn-ok {
  background: #ff9f40;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  color: #fff;
  font-size: 0.48211rem;
  display: block;
  width: 6.02637rem;
  height: 1.20527rem;
  line-height: 1.20527rem;
  text-align: center;
  margin: 0.84369rem auto 0;
}

.fail-box .inner .tip-text, .fail2-box .inner .tip-text {
  color: #405684;
  font-size: 0.63277rem;
  font-weight: 400;
  text-align: center;
  padding-top: 1.05461rem;
}

.fail-box .inner .btn-ok, .fail-box .inner .btn-mygift, .fail2-box .inner .btn-ok, .fail2-box .inner .btn-mygift {
  background: #ff9f40;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  color: #fff;
  font-size: 0.48211rem;
  display: block;
  width: 6.02637rem;
  height: 1.20527rem;
  line-height: 1.20527rem;
  text-align: center;
  margin: 0.84369rem auto 0;
}

.fail2-box .inner .tip-text {
  padding-top: 1.50659rem;
}

.fail2-box .inner .tip-text2 {
  color: #666666;
  font-size: 0.48211rem;
  text-align: center;
  padding-top: 0.33145rem;
}

.mygift-box .inner .mygift-title {
  display: block;
  width: 8.33145rem;
  margin: 0 auto;
}

.mygift-box .inner .tip-text {
  color: #b34d50;
  font-size: 0.6629rem;
  width: 11.60075rem;
  margin: 0.72316rem auto 0;
}

.mygift-box .inner .gift-total {
  width: 11.60075rem;
  margin: 0.54237rem auto 0;
}

.mygift-box .inner .gift-total .gift-title {
  color: #405583;
  font-size: 0.54237rem;
}

.mygift-box .inner .gift-total .gift-list {
  color: #405583;
  font-size: 0.54237rem;
  width: 11.60075rem;
  margin: 0.42185rem auto 0;
}

.mygift-box .inner .gift-total .gift-list li {
  margin-bottom: 1.50659rem;
}

.mygift-box .inner .gift-total .gift-list li:nth-last-of-type(1) {
  margin-bottom: 0;
}

.mygift-box .inner .gift-total .gift-list li .btn-copy {
  background: #ff9f40;
  border-radius: 0.18079rem;
  -webkit-border-radius: 0.18079rem;
  color: #fff;
  display: inline-block;
  vertical-align: middle;
  font-size: 0.54237rem;
  width: 1.50659rem;
  height: 0.7533rem;
  line-height: 0.7533rem;
  margin-left: 0.18079rem;
  text-align: center;
}