body, html, div, dl, dt, dd, ul, img, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, section {
  padding: 0;
  margin: 0;
  
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}


body, html {
  font-weight: normal;
  touch-action: none;
  font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;

  
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body a {
  text-decoration: none;
}

a:link {
  text-decoration: none;
}



a:visited {
  text-decoration: none;
}



a:hover {
  text-decoration: none;
}



a:active {
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

img{
  pointer-events: none;
}




input {
  outline: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


body li {
  list-style: none;
}


.hide {
  display: none;
}

.clearfix:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
  width: 0;
  visibility: hidden;
}





.container {
  margin: 0 auto;
  
  width: 100%;
  height: auto;
  min-height: 100vh;
  
  
  
}


.head{
  width: 100%;
  height: 11.2vw;
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
}
.bf_logo{
  display: none;
  float: left;
  height: 100%;
  width: 25.07vw;
  margin-left: 3.6vw;
  text-align: center;
}
.bf_logo a{
  display: block;
  width: 100%;
  height: 100%;
  background: url("../image/bf_logo.png") center no-repeat;
  background-size: contain;
}
.bf_logo a h1{
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-indent: -9999px;
}

.head .menu{
  width: 10vw;
  height: 100%;
  float: right;
  text-align: center;
  margin-right: 2.4vw;
  position: relative;
}
.head .menu button{
  width: 100%;
  height: 100%;
  display: block;
  outline: none;
  background-color: #fff;
  border: none;
}
.head .menu img{
  width: 6.13vw;
  
  vertical-align:middle;
}
.head .menu img:nth-of-type(2){
  display: none;
  position: absolute;
  width: 5vw;
  top: 3.5vw;
  left: 2.2vw;
}
.head .login{
  width: 10vw;
  height: 100%;
  float: right;
  text-align: center;
  cursor: pointer;
}
.head .login a{
  display: block;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding-top: 2vw;
}
.head .login img{
  width: 7.73vw;
  height: 7.73vw;
  vertical-align:middle;
}

.head .my_info{
  display: none;
  width: auto;
  min-width: 20vw;
  max-width: 33vw;
  height: 100%;
  float: right;
  font-size: 3.72vw;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
  background-color: #fff;
}
.head .my_info a{
  display: block;
  max-width: 33vw;
  color: #333;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
  background-color: #fff;
  font-size: 3.72vw;
}
.head .my_info span{
  line-height: 11.2vw;
  padding-right: 5vw;
}
.head .my_info img{
  width: 7.6vw;
  height: 7.6vw;
  border-radius: 50%;
  overflow: hidden;
  background-color: #e6ecef;
  vertical-align: middle;
  margin-right: 0.8vw;
}
.head .back{
  float: left;
  height: 100%;
  width: 40vw;
}
.head .back a{
  display: block;
  width: 10vw;
  height: 100%;
  text-align: center;
  float: left;
  box-sizing: border-box;
  padding-top: 1.5vw;
}
.head .back a div{
  height: 8.2vw;
  border-right: 1px solid #c7c7c7;
  box-sizing: border-box;
  padding-top: 1.3vw;
}
.head .back img{
  width: 3vw;
  height: 4vw;
  vertical-align: middle;
}
.head .back span{
  float: left;
  display: block;
  height: 100%;
  line-height: 11.2vw;
  font-size: 5vw;
  text-indent: 4vw;
}





.navBar{
  display: none;
  position: fixed;
  top: 11vw;
  right: 1px;
  z-index: 20;
  background-color: #fff;
  padding-left: 1vw;
  box-shadow: 0 0 5px 0 #a1a1a1;
}
.navBar a{
  display: block;
  width: 41vw;
  height: 11.5vw;
  color: #4b9dfb;
  font-size: 4vw;
  line-height: 11.5vw;
  border-bottom: 1px solid #ededed;
  box-sizing: border-box;
  padding-left: 4vw;
}
.navBar a:last-of-type{
  border-bottom: none;
}
.navBar a img{
  width: 7.5vw;
  vertical-align: middle;
  margin-right: 2vw;
}


.tabBar{
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 13.33vw;
  background-color: #f9f9f9;
  z-index: 10;
  box-sizing: border-box;
  
  border-top: 1px solid #bbbbbb;
  padding: 0 2vw;
}
.tabBar a{
  display: block;
  float: left;
  height: 100%;
  width: 24vw;
  text-align: center;
  font-size: 3vw;
  color: #929292;
  position: relative;
  box-sizing: border-box;
  padding-top: 1.5vw;
  overflow: hidden;
}
.tabBar a.on{
  color: #4b9dfb;
}
.tabBar a i{
  display: inline-block;
  width: 6.933vw;
  height: 6.2vw;
  background: url("../image/home01.png") center no-repeat;
  background-size: contain;
}
.tabBar a:nth-of-type(2) i{
  background: url("../image/games01.png") center no-repeat;
  background-size: contain;
}
.tabBar a:nth-of-type(3) i{
  background: url("../image/gifts01.png") center no-repeat;
  background-size: contain;
}
.tabBar a:nth-of-type(4) i{
  background: url("../image/my01.png") center no-repeat;
  background-size: contain;
}

.tabBar span{
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  line-height: 20.8vw;
}


.group-input{
  width: 100%;
  height: 12.5vw;
  border-bottom: 1px solid #f0f0f0;
  position: relative;
  font-size: 15px;
  box-sizing: border-box;
  padding: 0 6vw;
  background-color: #fff;
}
.group-input-icon{
  position: absolute;
  left: 6vw;
  top: 3.8vw;
  width: 4vw;
  height: auto;
}
.input_clear{
  position: absolute;
  cursor: pointer;
  width: 10vw;
  height: 100%;
  text-align: center;
  top: 0;
  right: 6vw;
  box-sizing: border-box;
  padding-top: 4.45vw;
}
.input_clear img{
  width: 3.6vw;
  height: 3.6vw;
  border-radius: 50%;
  display: inline-block;
  color: #fff;
}
.group-input-click{
  position: absolute;
  right: 6vw;
  width: 10vw;
  height: 100%;
  text-align: center;
  z-index: 2;
  cursor: pointer;
  box-sizing: border-box;
  padding-top: 4.45vw;
}
.group-input-click img{
  width: 6.67vw;
  height: 3.73vw;
}
.group-input-click-s{
  padding-top: 0.18rem;
}
.group-input-click-s img{
  width: 0.333rem;
}
.group-code{
  position: absolute;
  width: 28vw;
  height: 8vw;
  right: 6vw;
  bottom: 2.25vw;
  padding: 0;
}
.group-code{
  display: block;
  border: 1px solid #f5b840;
  border-radius: 8vw;
  box-sizing: border-box;
  line-height: 7.7vw;
  text-align: center;
  color: #f5b840;
  
  font-size: 14px;
  background-color: #fff;
}
.group-code:focus{outline:0;}
.group-code.gray{
  border: 1px solid #c3c3c3;
  color: #c3c3c3;
}
.group-img-code{
  position: absolute;
  right: 18vw;
  bottom: 2.25vw;
  width: 30vw;
  height: 8vw;
}
.group-img-code img{
  width: 100%;
  height: 100%;
}
.group-input input{
  outline: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  border: none;
  background:none;

  display: block;
  width: 100%;
  text-indent: 8.7vw;
  height: 12.5vw;
  font-size: 16px;
  
  -ms-line-height:12.5vw;
  color: #282828;
  overflow: hidden;
  
  caret-color: #333;
}
.group-input input::placeholder{
  font-size: 15px;
  color: #c3c3c3;
}



.submit{
  margin: 5vw auto 5vw auto;
  width: 90.53vw;
  height: 11.47vw;
  line-height: 11.47vw;
  border-radius: 11.47vw;
  text-align: center;
  background-color: #4b9dfb;
  font-size: 4.8vw;
  color: #fff;
  letter-spacing: 5px;
}


.submit_loading{
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0);
  text-align: center;
  padding-top: 50vw;
  z-index: 1000;
  box-sizing: border-box;
}
.submit_loading div{
  margin: 0 auto;
  width: 27vw;
  height: 30vw;
  border-radius: 1.3vw;
  background-color: rgba(0,0,0,.5);
  color: #fff;
  font-size: 14px;
  text-align: center;
  box-sizing: border-box;
  padding-top: 6vw;
  line-height: 8vw;
}
.submit_loading img{
  width: 10vw;
  height: 10vw;
  animation: rotation 2s infinite linear;
  -moz-animation: rotation 2s infinite linear;	
  -webkit-animation: rotation 2s infinite linear;	
  -o-animation: rotation 2s infinite linear;	
}

@keyframes rotation{
  from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}
@-webkit-keyframes rotation{
  from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}



.footer{
  text-align: center;
  font-size: 3vw;
  color: #767987;
  min-height: 31vw;
  margin-bottom: 18.8vw;
  box-sizing: border-box;
  padding: 4vw 3vw 0 3vw;
}
.footer a{
  color: #767987;
}
.footer div:nth-of-type(1){
  margin-bottom: 3vw;
}
.footer div:nth-of-type(1) a{
  padding: 0 4vw;
}
.footer div:nth-of-type(2) a{
  line-height: 5.5vw;
}
.footer div:nth-of-type(2) a:last-of-type{
  text-align: center;
  display: block;
}
.footer  p{
  line-height: 5.5vw;
}