body{padding:0;overflow-x:hidden;font-size:16px;  line-height: 1.6; color:#fff;background-color: #141414; }
.container{width:1170px;margin:0 auto; }
img,a,p,ul,li,div,input,h1,h2,h3,h4,h5,h6,span,textarea,table,tr,td{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;margin:0;padding: 0}
body {font-family: Arial, Helvetica, sans-serif; }
a{text-decoration:none; color:#060c1c;  }
select,textarea,input,a:hover,a:focus,button{outline:none}
.img_fit{max-width:100%; display:block;}
ul{padding-left:0;list-style-type:none;}
body,p,ul{margin:0;}
.clr{clear:both}
.scroll_fix{overflow-y:hidden} 
table{border-collapse: collapse;width: 100%}
.flex ,.btn-list .btn{ display:flex; display:-webkit-box;display:-moz-box; display:-ms-flexbox; display: -webkit-flex; flex-wrap: wrap;}
.flex-md,.btn-list .btn{ -webkit-align-items: center;align-items: center;-webkit-justify-content: center; justify-content: center;}  
.flex-center{-webkit-align-items: center;align-items: center;}
.flex-bt{  -webkit-align-items: flex-end; align-items: flex-end;}
.flex-end{-webkit-justify-content:end; justify-content:end;}
.flex-space-between{ justify-content: space-between;}
.flex-md-row-reverse { flex-direction: row-reverse ;}
.flex-container { align-content:stretch;} 
.flex-1 { flex: 1 0 0%;}
.col-auto { flex: 0 0 auto; width: auto;}
.mr-l{margin-left:auto;}
.col-6 {width: 50%;}
.col-3{width: 33.33%;}  .col-9{width: 66.66%;}  
.col-4 {width: 25%;}  .col-8 {width: 75%;}
.col-45 {width: 45%;} .col-55 {width: 55%;}
.col-1{width: 16.66%} .col-5 {width: 20%;} 
.col-40 {width: 40%;}  .col-60 {width: 60%;} 
.col-80 {width: 80%;} 
.col-12 {width: 100%;} .col-10{width:83.33%;}
.col-R{padding-left: 20px;} .col-L{padding-right: 20px;}
a,.mask,li:hover, .btn,nav li>a:after, .thumbimg img,.box,.provider-list img {transition: all 0.3s ease;-moz-transition: all 0.3s ease;-webkit-transition:all 0.3s ease;-o-transition: all 0.3s ease;}
.thumbimg:hover img.col-12  {-webkit-transform:scale(1.1);transform:scale(1.1);}
.row{margin: 0 -10px;}
.row>li{padding:10px;} 
hr{border: 0;border-top:1px solid #bfbfbf ;background: none;}
.center-img{margin: 0 auto;} 
/*---------------------------------------------------------*/  
header{ padding: 10px 0;background:url(../images/header.webp) no-repeat left top #141414; background-size: cover;}   
.logo {display: inline-block;margin-right: auto; vertical-align: middle;}  
.logo-main{line-height: 1.1;}
.topnav>li{position: relative; }
.topnav>li>a{padding: 15px; display:block; color: #fff;}   
.topnav li>a:hover{color:var(--primary-color); } 
.topnav ,.topnav li>a{height: 100%; }
nav{background: #000000; }
.topnav li.active>a,.topnav li.active>a:hover{background: linear-gradient(135deg,  #f4fe5b 1%,#8fd115 100%);  color: #000;}
#nav-icon{ background: #0f9321;  z-index:1000;position:absolute;right:0;top:0; height:50px;width:50px;
  -webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;cursor: pointer}
#nav-icon span{ background-color:#fff; height:2px;width:60%;border-radius: 9px; opacity: 1;left: 20%;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;}
#nav-icon span:nth-child(1) {top:15px;}#nav-icon span:nth-child(2) {top:25px;}#nav-icon span:nth-child(3) {top:35px;}
#nav-icon.open span:nth-child(1) {top:25px;-webkit-transform: rotate(135deg);-moz-transform: rotate(135deg);-o-transform: rotate(135deg);transform: rotate(135deg);}
#nav-icon.open span:nth-child(2) {opacity: 0;left: -60px;}
#nav-icon.open span:nth-child(3) {top:25px;-webkit-transform: rotate(-135deg);-moz-transform: rotate(-135deg);-o-transform: rotate(-135deg);transform: rotate(-135deg);}
 

.sns{margin-top: 20px;}
.sns a:hover{opacity:0.6;}
.side_nav{position: fixed;right: 0;bottom: 45%;z-index: 9;}
.side_nav .a2a_kit a{display: block;float: none;margin-bottom: 5px}
.side_nav {
  position: fixed;
  top: 50%;              /* 垂直居中 */
  right: 10px;           /* 离右边 10px */
  transform: translateY(-50%);
  display: flex;
  flex-direction: column; /* 改成竖直排列 */
  gap: 12px;              /* 图标之间的间距 */
  z-index: 9999;
}

.side_nav a {
  display: inline-block;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.side_nav a:hover {
  transform: scale(1.2); /* hover 放大 */
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  border-radius: 50%;
}
@keyframes slideUp {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

.scroll_fix .down { position: relative;left: 0;right: 0;}
 
.btn{padding:10px 20px;text-align: center;margin: 2px auto; display:inline-block;  background :var(--primary-color);color: #000; border-radius:8px;} 
.btn:hover{background-color:#FFF;} 
.btn-w{background: #fff;color: #000;}
.btn-w:hover{background-color: #333; color: #fff;}
.btn-list .btn{box-shadow: 0 5px 15px rgba(24,35,49,0.3);}
.btn-list .btn span { display: block; font-size: 2.8em; line-height: 1;}

  
.content{padding: 1.2em;}
.banner{ background-image: url(../images/banner-bg.webp);background-repeat:  no-repeat;background-position:  center ;color: #fff;text-shadow: 0 0 10px rgba(24,35,49,0.9);
  position: relative; background-size: cover; padding:30px 0  60px  0;font-size: 1.2em; text-align: center;} 
.banner-title{font-size:2.5rem; font-weight: bold;  display: inline-block;line-height: 1.2;  color: var(--primary-color);} 
 
.home-bg{background: url(../images/home-bg.webp) no-repeat center ; color: #fff; text-align: center;} 
.slot-list img{width: 100%;border-radius: 20px; border: 2px solid #86cc10;background: #131212;}
 
.main{padding-top: 40px;padding-bottom: 40px; }  
.title { line-height: 1.2; font-size: var(--h2);  font-weight: bold; color: var(--primary-color); margin: 15px 0;} 
.title span{color: var(--secondary-color);} 
.title-w{color: #fff;} 

.box{ background-color:#1b1b1b ;border-radius: 15px; border: 1px solid #86cc10;}
.box .bg-g{  border-radius: 15px 15px 0 0;  }
.box .bg-g-l{  border-radius: 15px 0 0 15px;  }
.box-title{font-weight: bold;font-size: 1.4em; line-height: 1.1;  }
.box-title-contain{padding: 15px; }
.all-height{height: 100%;}

.home-game{margin-bottom: 2em;}
.game-title{font-size: 2em; font-weight: bold;  padding: 10px;   color: var(--primary-color);line-height: 1.1; } 
.home-game-img{border-radius: 15px;}
 
.home-img{margin-top: -40px;}
.home-img2 { max-width:120%;margin-right: -20%;}
.home-img3 { max-width:120%;margin-left: -20%;}


.promo-box{background:#2a7c3d;   height: 100%;}
.promo-box .w3{font-weight: bold; color: var(--primary-color);}
.promo-box .content{padding: 15px;}


.qr{padding: 30px;border-radius: 20px;background-color: #fff;margin-bottom: 10px;}
footer{padding:20px 0;background-color: #212121;}
 


.sign-bg {background:url(../images/sign-bg.webp) no-repeat center  ;  }
.slot-bg {background:url(../images/slot-bg.webp) no-repeat center  ; }
.casino-bg{background:url(../images/casino-bg.webp) no-repeat center ; }
.sport-bg {background:url(../images/sport-bg.webp) no-repeat center;  } 
.fish-bg {background:url(../images/fish-bg.webp) no-repeat center; } 
.promo-bg {background:url(../images/promo-bg.webp) no-repeat center ; }
.esport-bg {background:url(../images/esport-bg.webp) no-repeat center ;}
.app-bg{background:url(../images/app-bg.webp) no-repeat center ; }
 
.pagetop{ background-image: url(../images/pagetop.webp) ;background-position: center center ;background-size: cover; color: #fff;} 
.page-title{font-size:3.5em;font-weight:bold;display: inline-block; line-height: 1; }
 
.spot>li, .w6 {background: url(../images/spot.png) no-repeat left 5px ; padding-left:25px;margin:5px 0;}
.spot-w li {background: url(../images/spot-w.png) no-repeat left 5px ; }
.spot {margin: 10px 0;}  

.esport-list img{border-radius: 15px; margin-bottom: -10px;}
.esport-list .box{background-color: #24632d;}
.esport-title{color: var(--primary-color);font-size: 1.2em;}
.esport-list  .bg-black{padding: 15px 15px 0 15px;}

.more{border: 1px solid #fff;color:#fff;padding:5px 30px;display:inline-block;margin-top: 10px;} 
.border{border-radius: 20px;  }
.p,.banner p {margin:15px 0;} 

.table-main{ margin: 15px 0; border-top: 1px solid #af94d5 ; border-left: 1px solid #af94d5 ; color: #fff; background:#5a0ec2;}
.table-main th,.table-main td{padding: 8px;border-right: 1px solid #af94d5;  border-bottom: 1px solid #af94d5; }
.table-main th{background: linear-gradient(135deg,  #9833ab 0%,#410d4a 100%); color: var(--primary-color);}
 


/*QA*/
.accordion-area{ list-style: none;  margin:0 auto;}
.accordion-area>li{  overflow: hidden;  margin-bottom: 10px;box-shadow: 0 5px 20px rgba(0,0,0,0.1);}
 .accordion-main{border-radius: 15px;overflow: hidden;  background-color: #2c3434;height: 100%; }
.accordion-title { position: relative; font-weight: bold;font-size: 1.2em;  background-color:#1b4a26; font-weight: normal; color: var(--primary-color); transition: all .5s ease;  padding: 15px; padding-right:40px;} 
.accordion-area>li .open{ color: var(--primary-color); }
.accordion-box{ padding: 15px;}
.accordion-box img{margin: 10px auto;} 
.qa-q{position: relative;background-color:var(--primary-color) ; display: inline-block;color:#19587b;margin-right: 25px;}
.accordion-title span{padding: 10px;} 
.more{  padding:5px 30px;display:inline-block;margin-top: 10px; background-color: var(--primary-color); color: #000;} 
 
 
/*--------------------------------------------------------*/  
:root {
  --primary-color: #95e900;
  --secondary-color:#590ebf; 
  --white:#fff;
  --h2: 2rem;
}
.h2{font-size: var(--h2);}
.bg{background: url(../images/bg.webp) no-repeat center; background-size: cover;}
.bg-main {background: linear-gradient(135deg,  #f4fe5b 1%,#8fd115 100%); } 
.bg-w {background: #fff; }   
.w-main {color: var(--primary-color);}
.w1{color: var(--secondary-color);}
.w-white{color: var(--white);}  
.w-b{color: #000;}  
.bg-grey{background-color:#121715;} 
.w-red{color: #ea2525;}
 .tt{color: var(--primary-color);font-size:1.2rem;font-weight: bold; padding-left: 20px; background: url(../images/line.png) no-repeat left top;}
.bg-b{background-color: #090d09;}
.bg-black{background-color: #000;}
.bg-g{background: linear-gradient(to bottom,  #699f0a 0%,#1b1b1b 100%); }
.bg-g-l{background: linear-gradient(to right,  #699f0a 0%,#1b1b1b 100%); }

.hidden,.thumbimg{overflow:hidden;}
footer,nav a,.center,.game-list {text-align:center;}
.inline,.pagenav a{display:inline-block;}
#nav-icon span,.thumbimg {display: block;}
#nav-icon,.down,.visible-md,.visible-lg{display:none}
nav>a, .inline{vertical-align: middle;}
 .relate, .thumbimg {position:relative;}
#nav-icon span,.topnav li>a:after , .mask,.cover  {position:absolute;}
.bg,  .bg-cover{background-position:center;background-size:cover;background-repeat: no-repeat;}
a {cursor: pointer;}
.btn, .w-bold   {font-weight: bold;} 
.w2 {font-size:1.6rem;line-height: 1.2;}
.w3   {font-size:1.2rem;}
.num{font-size: 2rem;line-height: 1 ; display: inline-block;vertical-align: middle;  font-weight: bold;margin-right: 20px;}
 
.mb-3{margin-bottom:2rem ;}  .mb-2{margin-bottom:1.2rem ;} 
.mt-3{margin-top:2rem ;}  .mt-2{margin-top:1.2rem ;}
.py-3{padding:2rem 0;}   
.l1{line-height: 1.1;}
.pb-0{padding-bottom: 0 !important;}   .pt-0{padding-top: 0;}  
.pb-3{padding-bottom: 2rem;} .pt-3{padding-top: 2rem;}
.pr-2{padding-right: 1.2rem;}
.py-2{padding: 20px 0;} .p-2{padding: 20px ;}
.pt-0{padding-top: 0;}
/*-----------------------S----------------------------------*/  
 
@media screen and (min-width:900px) and (max-width:1200px){ 
.container{width:850px;}   
 
 }
@media screen and (min-width:700px) and (max-width:899px){  
.container{width:670px;}   
.btn-list .btn img{width: 40px;}
}
@media screen and (min-width:480px) and (max-width:899px){  
 header{padding-right: 60px;}  
 }
   
/*---------------------------------------------------------*/
@media screen and (max-width:1200px){ 
  .col-xl-9{ width:66%;}
  .col-xl-3{ width:33%;}
 .col-xl-6{ width:50%;}
 .col-xl-12{ width:100%;}  
 .pagetitle, .pagetop h2, .btn-list .btn span {  font-size: 2rem;}
}
 
@media screen and (max-width:899px){
.col-lg-12 { width:100%; padding: 0}	
.col-lg-0{width: 0;}
.col-lg-6 { width:50%; padding: 0}	
.col-lg-9 { width:66.66%; padding: 0}	
.col-lg-3{width:33.33%; padding: 0} 
#nav-icon ,.visible-lg{display:block;}     
.banner-title{font-size: 2.2em;line-height: 1;}  

}
 
@media screen and (max-width:699px){
.container{width:100%;padding: 0 20px;}	
.main{padding-top:20px;padding-bottom: 20px;}
 nav a,.col-md-12  {width:100% !important} 
 .col-md-6{width: 50%;}
 .col-md-8{width: 75%;}
 .col-md-3{width: 33.33%;}  
.col-R.col-md-12,.col-L.col-md-12{padding: 0} 
.visible-md{display:block;} 
.hidden-md,.side_nav .a2a_kit{display:none;}  
.title,.banner-title{font-size: 2rem;line-height: 1.3;}
.logo img{max-width:100%;display: block;}   
.logo-main{padding-right: 50px;}
 .mask{padding: 10px;}
 .pb-md-0{padding-bottom: 0;}   
.side_nav{bottom: 0;}  
.topnav li>a{padding: 10px 0;  color: #fff;} 
.topnav, .down,.topnav li>a::after,.hidden-lg{display:none} 
.topnav{overflow: auto;}
.topnav{height: 100%;position: fixed;left:0;top:0;right:0;z-index:999; padding-top:60px ;  background: rgba(0,0,0,0.9); }
.topnav li {position: relative;}  
.topnav>li{border-top: 1px solid #666;}  
.banner-img{max-width: 100%;margin: 0;}
.scroll_fix #nav-icon span{background-color: #fff;}
.home-img2 ,.home-img3  {max-width: 100%;margin: 0;} 
.home-img{margin: 0 auto;}  
.pagetop {padding-top:50px ;text-align: center;}   
} 

@media screen and (max-width:479px){
.col-sm-12{width: 100%}	  
.col-sm-12.col-R{padding: 0;}
.col-sm-6{width: 50%;}
.col-sm-3{width:33.33%;}  
 .col-sm-9{width: 66.66%;}      
}
/* 移动端默认隐藏 */
.bottom_nav {
  display: none;
}

/* 手机端样式 */
@media (max-width: 768px) {
  .side_nav {
    display: none; /* 手机隐藏侧边栏 */
  }

  .bottom_nav {
    display: flex;
    position: fixed;
    bottom: 10px; /* 离底部一点点，看起来悬浮 */
    left: 50%;
    transform: translateX(-50%);
    width: 95%;
    height: 65px;
    background: rgba(30, 30, 30, 0.95);
    backdrop-filter: blur(6px); /* 毛玻璃效果 */
    border-radius: 15px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.15);
    justify-content: space-around;
    align-items: center;
    z-index: 9999;
  }

  .bottom_nav a {
    padding: 0 10px;      
    flex: 1;
    text-align: center;
    color: #ccc;
    transition: all 0.3s ease;
  }

  .bottom_nav a:hover i {
    color: var(--primary-color);
    transform: scale(1.2);
    filter: brightness(1.3);
  }

  .bottom_nav a div {
    font-size: 12px;
    margin-top: 3px;
    color: #fff;
  }

  body {
    padding-bottom: 80px; /* 给页面留出空间 */
  }
}