*{margin: 0;padding: 0; box-sizing: border-box;}
body {width: 100%;overflow:auto;color: #666;font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;overflow-x: hidden;}
a {text-decoration: none !important;color: #fff}
a:hover {color: #55a1f7;transition: all .3s ease-out}
a:link, a:hover, a:visited, a:active, a:focus {text-decoration: none;outline: none!important; transition:all .3s ease;}
ul li {list-style: none}
ol li {list-style: none}
em, i {font-style: normal; display: inline-block;}
li, ul {margin: 0;padding: 0;list-style: none}
h1, h2, h3, h4, h5, h6 {font-family: FZLTXHK, 'Microsoft Yahei', 'Hiragino Sans GB', 'Heiti SC', 'WenQuanYi Micro Hei', SimSun, sans-serif}
input::-webkit-inner-spin-button, input::-webkit-outer-spin-button { margin: 0;-webkit-appearance: none}
input[type=number] {-moz-appearance: textfield}
button, input, select {outline: 0}
img {outline: 0;border: 0}
table {border-collapse: collapse;border-spacing: 0}
.clearfix:after {clear: both;display: block;visibility: hidden;height: 0; content: "."}
.clearfix {*zoom: 1;}
html {
   height: auto;
   background: url(../img/y_logo.png)#0a58a0 repeat;
   background-attachment: fixed;
}
body{
   font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;overflow-x: hidden;
   max-width: 10.8rem; 
   margin: 0 auto;
   line-height: 1.5;
   background-color: #0a58a0;
}
.h5{
   background: url(../img/bg.png) no-repeat #e5f1ff;
   background-size: cover;
   background-size: 100%;
   position: absolute;
}
.bg_img{
   position: absolute;
   top: 0;
   width: 10.8rem;
   height: 16.44rem;
   z-index: -9;
}
.topnav{
   position: fixed;
   top: 0;
   left: 50%;
   width: 10.8rem;
   transform: translateX(-50%);
   height: 1.18rem;
   background-color: rgba(0, 0, 0, 0.45);
   transition: background-color 0.8s ease-in-out;
   backdrop-filter: blur(12px);
   display: flex;
   font-size: 0.32rem;
   color: #fff;
   justify-content: space-between;
   padding: 0 0.34rem;
   align-items: center;
   z-index: 99999;
}  
.content{
   padding: 0 0.34rem;
}
.logo_box{
   width: 3.4rem;
   height: 0.86rem;
}
.logo_box > img{
   width: 3.4rem;
   height: 0.86rem;
}
.reg_log_box a{
   width: 2.8rem;
   height: 1rem;
   border-radius: 1rem;
   padding: 0.14rem 0.64rem;
   font-size: 0.32rem;
   margin-left: 0.08rem;
}
.reg_log_box a:hover{
   color: #fff;
}
.log{
   border: solid 0.02rem rgba(255, 255, 255, 0.479);
}
.reg{
   background: linear-gradient(0deg, #1c7af9, #24d1f5);
}
.game_box{
   border-radius: 0.24rem;
   border: solid 0.06rem #fff;
   background: no-repeat right / auto 80% url(../img/lottery.png) #f5f8fb;
   padding: 0rem 0 0.4rem 0.46rem;
   box-shadow: 0 0.2rem 0.4rem 0 rgb(3 53 116 / 24%);
   margin-top: 11.52rem;
}
.game_box>h1 {
   font-size: 0.6rem;
   margin-bottom: 0.12rem;
   background: linear-gradient(to top, #1d82f9, #24d1f5);
   -webkit-background-clip: text;
   color: transparent;
   display: inline-block;
}
.game_box>ul {
   display: flex;
   color: #0c9e86;
   align-items: center;
}
.game_box>ul li {
   padding: 0.04rem;
   font-size: 0.24rem;
}
.game_box>p {
   font-size: 0.28rem;
   display: flex;
   color: #45494c
}
.betBnt {
   font-size: 0.32rem;
   margin-top: 0.22rem;
   width: 3.02rem;
   border-radius: 0.12rem;
   background: #fff;
   line-height: 0.84rem;
   display: flex;
   align-items: center;
   justify-content: center;
   background-image: linear-gradient(to top, rgba(29, 130, 249), rgba(36, 209, 245));
   cursor: pointer;
}
.betBnt>i{
   padding: 0 0.1rem;
   color: #fff;
}
.betBnt a:hover{
   color: #fff;
}
.other_game{
   display: flex;
   justify-content: space-between;
}
.o_game{
   width: 4.84rem;
   height: 2.26rem;
   border-radius: 0.24rem;
   border: solid 0.06rem #fff;
   box-shadow: 0 0.2rem 0.4rem 0 rgb(3 53 116 / 24%);
   margin-top: 0.56rem;
   display: flex;
   flex-direction: column;
   padding-left: 0.28rem;
}
.img1{
   background: no-repeat right / auto 100% url(../img/Games1.png) #f5f8fb;
}
.img2{
   background: no-repeat right / auto 100% url(../img/Games2.png) #f5f8fb;
}
.o_game h2{
   font-size: 0.4rem;
   background: linear-gradient(to top, #1d82f9, #24d1f5);
   -webkit-background-clip: text;
   color: transparent;
   display: inline-block;
   margin-top: 0.16rem;
}
.o_game p{
   width: 2.4rem;
   font-size: 0.28rem;
   color: #45494c;
}
.o_game>em{
   width: 0.84rem;
   height: 0.02rem;
   background: #20aaf7;
   margin: 0.1rem 0.38rem;
}
/****线路******/
.detect_bg {
   padding: 0.48rem;
   border: solid 0.06rem #fff;
   width: 100%;
   border-radius: 0.22rem;
   background-color: #f5f8fb;
   box-shadow: 0 0.2rem 0.4rem 0 rgb(3 53 116 / 24%);
   margin-top: 0.56rem;
}
.detect_w>h2 {
   color: #4d4f54;
   text-align: center;
   font-size: 0.64rem;
   line-height: 1.06rem;
}
.sign_l{
   background: no-repeat left / auto 88% url(../img/zs_r.png);
}
.sign_r{
   background: no-repeat right / auto 88% url(../img/zs_l.png);
}
.hint {
   display: flex;
   margin-bottom: 0.52rem;
   justify-content: center;
   align-items: center;
}
.hint>p {
   color: #7a7b7c;
   text-align: center;
   font-size: 0.36rem;
}
.hint>span{
   width: 2.56rem;
   height:0.3rem;
}
 .lineBox h3{
   padding-top: 0.4rem;
   color: #393f4f;
   text-align: center;
   font-weight: 600;
   font-size: 0.54rem;
   line-height:0.9rem;
}
.lineBox p{
   padding: 0.3rem 0.22rem 0.3rem;
   color: #fff;
   text-align: center;
   font-size: 0.3rem;
}
.lineBox ul{
   position: relative;
   margin: 0 auto;
   width: 100%;
}
.lineBox>ul>li{
   position: relative;
   margin: 0.3rem auto;
   height: 0.9rem;
   border: solid 0.02rem #cde4fe;
   border-radius: 1rem;
}
.clearfix>li{
   box-sizing: border-box;
   padding: 0 0.46rem;
}
.lineBox ul li>span{
   float: left;
    color: #1d83f9;
    font-size: 0.32rem;
    line-height: 0.9rem;
}
.lineBox ol{
   float: left;
   padding-left: 0.3rem;
   border-radius:1rem;
}
.lineBox ul li ol li{
    float: left;
    margin: 0.32rem 0.04rem;
    width: 0.24rem;
    height: 0.24rem;
    border-radius: 1rem;
    background-image: linear-gradient(to top, rgba(29, 130, 249), rgba(36, 209, 245));
}

.signal {
   background-image: linear-gradient(to top, rgba(29, 130, 249), rgba(36, 209, 245));
}

.lineBox ul li a{
   position: absolute;
   top: -0.02rem;
   right: -0.02rem;
   float: right;
   width: 2.2rem;
   border-radius: 1rem;
   background-image: linear-gradient(to top, rgba(29, 128, 249), rgba(36, 211, 249));
   color: #fff;
   text-align: center;
   font-size: 0.32rem;
   line-height: 0.9rem;
}
.lineBox a:hover{
   background-color: #058f78;
   color: #fff;
   transition: all .3s ease-out;
}
.lineBox .bnt{
    display: flex;
    margin-top: 0.52rem;
    margin-bottom: 0.12rem;
    color: #1d83f9;
    font-size: 0.36rem;
    cursor: pointer;
    justify-content: center;
    line-height: 1rem;
    border-radius: 1rem;
    width: 68%;
    border: solid 0.02rem #cde4fe;
}
.lineBox .bnt:hover{
   background: #1c7cf9;
   color: #fff;
   transition:all .3s ease;
}
.lineBox .bnt>span>img{
   width: 54%;
   text-align: center;
}
.bewrite_box_t{
   position: absolute;
   top: 0.26rem;
   left: 4.12rem;
   display: flex;
   flex-direction: column;
}
.bewrite_box_t>h3{
   display: flex;
   color: #fff;
   font-size: 0.52rem;
}
.bewrite_box_t p{
   display: flex;
   font-size: 0.0028rem;
}
.d_wei{
   display: flex;
   align-items: center;
   justify-content: center;
}
.title{
   margin-top: 0.3rem;
   color: #fff;
   font-size: 0.4rem;
   line-height: 1.08rem;
}
.bnt_c{
   display: flex;
   justify-content: space-evenly;
}
/****轮播*****/
.banner{
   display: flex;
   justify-content: center;
 }
 .carousel1{
   width: 10.1rem;
   height: 2.6rem;
   display: flex;
   justify-content: center;
   position: relative;
   overflow:hidden;
   margin-top: 0.56rem;
   box-shadow: 0 0.2rem 0.4rem 0 rgb(3 53 116 / 24%);
   border-radius: 0.22rem;
   }
.viewportA{
 width: 10.1rem;
 height: 2.6rem;
 position: relative;
 overflow: hidden;
 z-index: 1;
}
.parentA{
 width:1000%;
 position: absolute;
}
.parentA .item{
 float:left;
}
.parentA .item img{
 display: block;
 width: 10.1rem;
 height: 2.6rem;
}
.carousel1 .prevA{
position:absolute;
height:20%;
width:auto;
left:0;
top:45%;
z-index:3;
opacity:0;
cursor: pointer;
}
.carousel1 .nextA{
position:absolute;
height:20%;
width:auto;
right:0;
top:45%;
z-index:3;
opacity:0;
cursor: pointer;
}
.carousel1 .prevA:hover {
 opacity:0.9;
}
.carousel1 .nextA:hover {
 opacity:0.9;
}
.circleListA{
 position:absolute;
  z-index: 3;
  bottom:0.16rem;
  width:1.58rem;
  height:0.22rem;
  left:50%;
  margin-left:-0.78rem;
  padding-top:0.04rem;
  padding-bottom:0.04rem;
 zoom:1;
 border-radius:0.16rem;
 display: flex;
 align-items: center;
 justify-content: center;
 opacity: 0;
}
.circleListA span{
 float:left;
 height:0.12rem;
 width:0.48rem;
 border-radius:1rem;

 margin-right:0.1rem;
 background-color:rgba(255, 255, 255, 0.623);
 cursor: pointer;
}
.circleListA span:hover{
 background:#ffd700;
}
.circleListA .active{
 background:#fff!important;
}
/****EMD******/
.bottom_bg{
   width: 10.8rem;
   height: 10.46rem;
   margin-top: 0.7rem;
   margin-bottom: 1.72rem;
}
.down_box{
   max-width: 10.8rem;
   position: fixed;
   bottom: 0;
   z-index: 99;
   display: flex;
   padding: 0.28rem 0.28rem;
   width: 100%;
   background-color: rgba(255, 255, 255, 0.5);
   transition: background-color 0.8s ease-in-out;
   flex-direction: column;
   backdrop-filter: blur(0.24rem);
}

.down_box{
   display: flex;
   flex-direction: row;
   align-items: center;
}
.title_left>img{
   display: flex;
   width: 90%;
   cursor: pointer;
}
.down_btn{
   display: flex;
   flex-direction: row-reverse;
}
.down_btn>img{
   display: flex;
   width: 100%;
}
.service_box a{
   display: inline-block;
   width: 0.84rem;
   height: 1.2rem;
   background: url(../img/service.png) center no-repeat;
   background-size: cover;
   background-size: 100%;
}
.service_box:hover{
   background-color: #af3afa;
}
.service_box{
   position: fixed;
   bottom: 8%;
   right: 30%;
   width: 1.64rem;
   height: 1.64rem;
   border-radius: 1rem;
   background-image: linear-gradient(to top, rgba(8, 225, 251), rgba(175, 58, 250));
   display: flex;
   align-items: center;
   justify-content: center;
}
@media screen and (max-width:768px) {/*h5*/
   .service_box{
      position: fixed;
      bottom: 15%;
      right: 0.1rem;
      width: 1.64rem;
      height: 1.64rem;
      border-radius: 1rem;
      background-image: linear-gradient(to top, rgba(8, 225, 251), rgba(175, 58, 250));
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 99999;
   }

}
@media screen and (max-width:375px) {/*h5*/
   .game_box{
      background: no-repeat right / auto 62% url(../img/lottery.png) #f5f8fb;
   }
}
.ft_box {
   width: 3.26rem;
   height: 2.06rem;
   position: absolute;
   top: 3%;
   right: 11%; 
   background-size: contain; 
   transform: translate(-50%, -50%);
   -webkit-transform: translate(-50%, -50%);
   animation: sport_btn 3s infinite;
   -webkit-animation: sx-btn 3s infinite;
   cursor: pointer;
}

@keyframes sx-btn {
   0% {
       transform: translate(0,0);
   }
   50% {
       transform: translate(5px,30px);
   }
   100% {
       transform: translate(0,0);
   }
}