/*CSS動畫*/

/*錯誤svg start動畫*/

.returnMsgSvg{  padding-left: 30px; margin-top:30px; margin-bottom:15px; 
border-bottom:2px #fff ridge; width:150px; height:150px; margin:30px auto 15px}
.successSvg, .failSvg, .warningSvg{

    display: none;
    fill: none;    
    stroke-width: 3;
    stroke-dasharray: 160;
    stroke-dashoffset: 180;
    opacity: 0; /* 初始設定為隱藏 */
    animation: fadeIn 1.5s forwards; /* 使用淡入的動畫，持續時間為1.5秒，並保持在最終狀態 */
    -webkit-filter: drop-shadow(1px 4px 3px rgba(0, 0, 0, 0.6));
    filter: drop-shadow(1px 4px 3px rgba(0, 0, 0, 0.6));
	

	
}
.failSvg{stroke: #C00;}
.successSvg {    stroke: #060;}
.warningSvg {    stroke: #F30;}
.svgEllipse {    opacity: 1; /* 圓圈初始設定為不透明 */}

@keyframes fadeIn {
  to {
    opacity: 1;
    stroke-dashoffset: 0;
  }
}
/*錯誤svg end動畫*/

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}
@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}
.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}

@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}
@-webkit-keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

/*捲軸底色*/
::-webkit-scrollbar-track {
  -webkit-box-shadow:  0 -1px 2px rgba(0, 0, 0, 0.8);
  background-color: #b8a0db;
  border:1px solid #ccc; padding:2px
}
/*捲軸寬度*/
::-webkit-scrollbar {  width: 10px;  background-color: black;}
/*捲軸本體顏色*/
::-webkit-scrollbar-thumb {  background-color: #824990;}

body, html {    width: 100%;	height: 100%;}

body{
	background:#3b1bc2 url(../images/bg.jpg) center center no-repeat fixed;
	-moz-background-size:cover;
	background-size: cover;
	/*min-height: 1080px;*/
	color: #fff;
	font-family: tahoma, arial, "微軟正黑體", "Microsoft Yahei", Helvetica, sans-serif;
	font-size: 16px;
	line-height: 25px;
	/*overflow-x: hidden;*/
	overflow: visible;
	padding-right:0 !important;/*修改modl多出padding-right*/
	height:100%
}
.modal-open {/*修改modl多出padding-right*/
  overflow:auto;
  padding-right:0 !important;
}
input,button,a{outline:none!important;}


a {	color: #f1f1f8;	text-decoration: underline; cursor: pointer;}
a:hover {	color: #f1f1f8;	text-decoration: underline;}
a.turquoise {	color: #00c9db;}
a.white {	color: #fff;}
.modal{ color:#333}
.modal-dialog{/*垂直置中設定*/height: 100%;    display: flex;    align-items: center; margin:auto;     flex-wrap: wrap;}
@media (min-width: 576px){
#topUp_rule .modal-lg {   width:95%;  max-width: none;}
}
@media (min-width: 992px){
#topUp_rule .modal-lg{    max-width: none; width:85%}
}
.modal-title{line-height: 1.3;    color: #8c3985; font-size: 1.05rem;}
.modal-header{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fcfcfc+8,fff298+100 */
background: #fcfcfc; /* Old browsers */
background: -moz-linear-gradient(top,  #fcfcfc 8%, #fff298 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fcfcfc 8%,#fff298 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fcfcfc 8%,#fff298 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#fff298',GradientType=0 ); /* IE6-9 */
box-shadow: 0px 1px 5px #9a7737;
}
/***/
.box{ display:flex;     overflow: hidden; flex-direction: column;}
.box-info{display: -ms-flexbox;    display: flex;    -ms-flex-wrap: wrap;    flex-wrap: wrap;      flex-direction: column;
    align-items: center;}
.box-L{-ms-flex: 0 0 22%;    flex: 0 0 22%;    max-width: 22%;     transition: all ease 1s; order:1; z-index:10 }
.box-C{/*-ms-flex: 0 0 56%;    flex: 0 0 56%; */   max-width: 56%; width: 56%;    transition: all ease 1s;  order:3}
.box-R{ -ms-flex: 0 0 22%;    flex: 0 0 22%;    max-width: 22%;    transition: all ease 1s;  order:4; z-index:8}


/*主區-左邊*/
.media-box, .load-box{ position: fixed; bottom:20px;  background-color:rgba(0,0,0,0.5); width:14%;  border:1px solid #bd87ee;margin: auto;    display: flex; border-radius: 5px; flex-direction: column;}
.media-box{ left:3.5%}
.media-box img, .load-box img{ max-width:100%; border-radius: 10px; border:1px solid #999}
.media-box ul, .load-box ul{	
margin: 0px;	padding: 0px;	list-style-type: none; display:flex;  transition: all ease 1s; justify-content: center;}
.media-box ul li{ -ms-flex: 0 0 32%;    flex: 0 0 32%;    max-width: 32%;     padding: 10px; cursor: pointer; }
.media-box img:hover, .load-box img:hover{ border:1px solid #FC3; box-shadow: rgb(255 226 122) 0px 1px 5px 0px;}
.media-box-line{display: flex;    width: 85%;     margin: 0 auto 10px;cursor: pointer; }
/*會員登入btn及資訊*/
.btn-blue, .btn-orange{color:#FFF; padding:5px; margin:2px; display:block;letter-spacing: 2px; text-align: center;  text-decoration: none;
transition: background-image .5s,transform .5s;/*避免漸層色滑過閃逤*/}
.btn-blue{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4ed3fc+0,0bb5e0+40,0074aa+100 */
background-color: rgb(78,211,252);
background: rgb(78,211,252); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(78,211,252,1) 0%, rgba(0,120,206,1) 40%, rgba(0,116,170,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(78,211,252,1) 0%,rgba(0,120,206,1) 40%,rgba(0,116,170,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(78,211,252,1) 0%,rgba(0,120,206,1) 40%,rgba(0,116,170,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ed3fc', endColorstr='#0074aa',GradientType=0 ); /* IE6-9 */
-moz-box-shadow: 0px 1px 3px 1px rgb(0 22 170 / 70%) inset, 0px 0px 3px 2px rgb(120 219 255);
  -webkit-box-shadow: 0px 1px 3px 1px rgb(0 22 170 / 70%) inset, 0px 0px 3px 2px rgb(120 219 255);
  box-shadow: 0px 1px 3px 1px rgb(0 22 170 / 70%) inset, 0px 0px 3px 2px rgb(120 219 255);
  text-shadow: 0px 2px 3px rgba(0, 20, 165, .8);

 border: 1px solid #c2ffe9; border-radius: 6px;
	}
.btn-orange{
background: rgb(255,94,2);
    background: -moz-linear-gradient(top, #ff9900 0%,#ff5e00 40%,#e14200 100%);
    background: -webkit-linear-gradient(top, #ff9900 0%,#ff5e00 40%,#e14200 100%);
    background:linear-gradient(to bottom,  #ff9900 0%,#ff5e00 40%,#e14200 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff5e00', endColorstr='#e14200',GradientType=0 );
   -moz-box-shadow: 0px 1px 3px 1px rgb(183 0 0 / 70%) inset, 0px 0px 5px 5px rgb(255 228 121);
   -webkit-box-shadow: 0px 1px 3px 1px rgb(183 0 0 / 70%) inset, 0px 0px 5px 5px rgb(255 228 121);
   box-shadow: 0px 1px 3px 1px rgb(183 0 0 / 70%) inset, 0px 0px 5px 5px rgb(255 228 121);
   text-shadow: 0px 2px 3px rgb(107 0 0 / 80%);
	border: 1px solid #ffe53a; 

	}
.btn-blue:hover, .btn-orange:hover{transform:translateY(-10%); text-decoration: none;}
.btn-blue:hover{ background:#039; }
.btn-orange:hover{	background: #F30;}


.player_infoBox{  
position: fixed;    bottom: 26%;width: 14%; left:3.5%;margin: auto;    display: flex;flex-direction: column;       z-index: 10;  }
.player_info_btnLogin{ width:90%; border-radius: 10px; display: flex;font-size:13pt;
    margin: 0 auto 10px;justify-content: center; font-weight:bold; line-height:35px }

.player_info_btnIn{width:90%; margin: auto}
.register_homeBtn{   
    filter: drop-shadow(0px 2px 10px rgba(255,255,110,1));width:100%;
      display: grid  ;   grid-template-columns: 25px 1fr 25px;    gap: 0;  height:42px; font-size: 12pt;   text-align: center; cursor:pointer }
.register_homeBtn:before{filter: drop-shadow(0px 2px 5px rgba(255,255,110,1));}

.register_homeBtn_L, .register_homeBtn_R{background:url(../images/register_homeBtn.png) center center no-repeat; height: 42px;}
.register_homeBtn_L{ width: 25px; background-position: left center;}
.register_homeBtn_M{  place-content: center;text-decoration: none; background:url(../images/register_homeBtn2.png) center center repeat-x; height: 42px;}
.register_homeBtn_R{width: 25px; background-position: right center;}
@media (max-width: 768px){
  .register_homeBtn{     margin-left: 10px; flex: 1 1 0;}
  .player_info_btnIn{     flex: 1 1 0;}
  .player_infoBox{ flex-direction: row; }
}


.player_info_btnOut{ 
-webkit-box-shadow: none ; -moz-box-shadow: none  ;box-shadow: none; 
width:100%; display: flex; border-radius: 0;justify-content: center; font-weight:bold; line-height:25px}	
.player_info_show{
-moz-box-shadow: 0px 0px 8px 2px rgb(122 0 255) inset, 0px 0px 5px 5px rgb(120 219 255);
  -webkit-box-shadow: 0px 0px 8px 2px rgb(122 0 255) inset, 0px 0px 5px 5px rgb(120 219 255);
  box-shadow: 0px 0px 8px 2px rgb(122 0 255) inset, 0px 0px 5px 5px rgb(120 219 255);
  text-shadow: 0px 5px 3px rgb(0 16 131), 0px 0px 3px rgb(0 0 0); 
background-color:rgb(0 48 87 / 80%);     display: flex;    flex-direction: column;    
align-items: center; border-radius: 10px; width: 100%;
  margin-bottom:12px; border:5px double #c0e4ff; font-size:15px}
.player_info_show div{  display:flex; line-height:30px}

/*主區-右邊*/
.load-box{ right:3.5%}
.load-box ul{flex-direction: column; padding:8px 15px}
.load-box ul li{   padding:3px 10px; cursor: pointer;}
@media (min-width: 1700px) {.load-box ul{ padding:12px 20px}}
@media (max-width: 1100px) {
.load-box ul{ padding:12px 20px}
.media-box, .player_infoBox{ left:0.5%}
.load-box{ right:0.5%}
.load-box ul{ padding:8px 10px}
.media-box ul li, .load-box ul li{   padding:3px 5px; }
	}
/*背景圖獎盃星光閃*/
.blingbling-box{ display: none;   top: 25%; left:-35px;	position: fixed; z-index: 6; width:150px;     transition:all ease 1s;}


.blingbling img, .blingbling2 img{ max-width:100%	}
.blingbling, .blingbling2{position: absolute; width:100%}
.blingbling{
-webkit-animation: blingStart 2s infinite ease-in-out;
	animation: blingStart 2s infinite ease-in-out;

  }
 .blingbling2 {
	animation: blingStart 1.7s ease-in-out infinite;
	-webkit-animation: blingStart 1.7s ease-in-out infinite;
	-moz-animation: blingStart 1.7s ease-in-out infinite;
	-o-animation: blingStart 1.7s ease-in-out infinite;
	}

@keyframes blingStart {
    from {
        opacity: 1.0;
    }
    50% {
        opacity: 0.1;
    }
    to {
        opacity: 1.0;
    }
}

@-webkit-keyframes blingStart{
    from {
        opacity: 1.0;
    }
    50% {
        opacity: 0.1;
    }
    to {
        opacity: 1.0;
    }
} 
/*關注區*/
.focusBar{ display:flex; position:relative; z-index:111; justify-content: space-between;     align-items: center; }
.focusBar .btn{    padding: 0.25rem 0.75rem;  text-decoration: none; font-weight: 600;
font-size:0.95rem; text-shadow: 0px 2px 3px rgb(107 0 0 / 80%); color: #fffa00;}
.focusBar a, .focus-people{ display:flex;     align-items: center;}
.focus-people{text-shadow: 0px 2px 3px rgb(107 0 0 / 80%);     background-color: rgba(0,0,0,0.5); padding:0 10px; border-radius:4px}
.focus-people i{ margin:0 4px 0 8px}
.focus-people span{  color: #fffa00;}


/*輪播圖自動裁切圖高度*/
.imgAd-box-mob{ display: none;}
.imgAd-box-pc{/*-ms-flex: 0 0 56%;    flex: 0 0 56%; */ width: 56%;   max-width: 56%;    transition: all ease 1s;    order: 2;}
.imgAd-box-pc, .imgAd-box-mob{   }
.imgAd-box-pc .img-thumbnail, .imgAd-box-mob .img-thumbnail{border: 0px solid #dee2e6; padding: 0rem;}
.imgAd-box-pc .carousel, .imgAd-box-mob .carousel{     margin-bottom: -40%;    position: relative;    z-index: 100;}
.imgAd-box-pc .carousel-item, .imgAd-box-mob .carousel-item{height: 0;    padding-bottom: 100%;    overflow: hidden;    background-position: center center;
    background-size: cover;}
.imgAd-box-pc .carousel-inner, .imgAd-box-mob .carousel-inner{ width:98%; margin:0 auto; }
.imgAd-box-pc .carousel-indicators, .imgAd-box-mob .carousel-indicators{ bottom:auto; top:52%;}
.imgAd-box-pc .imgArea, .imgAd-box-mob .imgArea{ position: relative; z-index: -1;}

.ad-frame{ width:106%;      left: 50%;    top:-5%; position:absolute; 
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
	-webkit-animation:ad-frame 1s infinite alternate;
  animation: ad-frame 1s infinite alternate;}
	
.ad-frame img{ max-width:100%}
/*廣告框閃動*/

@-webkit-keyframes ad-frame{
 0% {

	-webkit-filter:hue-rotate(100deg);
	filter:hue-rotate(160deg);
  }
  50% {

 -webkit-filter:hue-rotate(280deg);
 filter:hue-rotate(280deg);
  }

  100% {

   -webkit-filter:hue-rotate(0deg);
   filter:hue-rotate(0deg);
  }
}

@keyframes ad-frame {
  0% {

	-webkit-filter:hue-rotate(160deg);
	filter:hue-rotate(160deg);
  }
  50% {

 -webkit-filter:hue-rotate(280deg);
 filter:hue-rotate(280deg);
  }

  100% {

   -webkit-filter:hue-rotate(0deg);
   filter:hue-rotate(0deg);
  }
}

.main-box{ margin:15px 0 35px; border:1px solid #FF9; box-shadow: 0px 0px 12px #ffcf1f; background-color:rgba(0,0,0,0.7);
min-height:500px;    border-radius: 5px; position:relative; z-index:110}
.main-tab-info{ padding:18px;    }

.tabSet .nav-link{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffec99+0,bc7a00+16,6a3d00+52,9a640f+84,e8b733+99 */
background: #ffec99; /* Old browsers */
background: -moz-linear-gradient(top,  #ffec99 0%, #bc7a00 16%, #6a3d00 52%, #9a640f 84%, #e8b733 99%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffec99 0%,#bc7a00 16%,#6a3d00 52%,#9a640f 84%,#e8b733 99%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffec99 0%,#bc7a00 16%,#6a3d00 52%,#9a640f 84%,#e8b733 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffec99', endColorstr='#e8b733',GradientType=0 ); /* IE6-9 */

border-top-left-radius:0;     border-top-right-radius: 0;	text-decoration: none ; border:0px; height: 100%;}

.tabSet li:nth-child(2) .nav-link {
background: #d21840;
    background: -moz-linear-gradient(to bottom, #ffec99 0%,#840000 16%,#a80000 52%,#d21840 84%,#e8b733 99%);
    background: -webkit-linear-gradient(to bottom, #ffec99 0%,#840000 16%,#a80000 52%,#d21840 84%,#e8b733 99%);
    background: linear-gradient(to bottom, #ffec99 0%,#ff4088 16%,#840000 52%,#d21840 84%,#e8b733 99%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a80000', endColorstr='#d21840',GradientType=0 );	
	}
.tabSet .nav-item.show .nav-link, .tabSet .nav-link.active, .tabSet li:nth-child(2) .nav-link.active{    color: #8c3c16;    background: #fff7be; font-weight:bold}

/*排行榜類別*/

.main-box .charts-kind-info{ padding:18px 0!important}
.nav-charts .btn-outline-warning{ margin:0 5px 5px;		text-decoration: none; padding: 0.2rem 1rem;}
.charts-kind-info .tab-pane{transition: all ease 1s;}
#show-news{ /*height:380px*/}
.newsInfo{     background-color: #534427;    color: #FFF;    border: 1px solid #fcee92;
    border-bottom-right-radius: 0.3rem;    border-bottom-left-radius: 0.3rem;}
.newsInfo span{ font-size: 11pt!important}
/***分頁***/
.page-link{ 
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fefcea+0,f1bb43+100 */
background: #fffad0; /* Old browsers */
background: -moz-linear-gradient(top,  #fefcea 0%, #f1bb43 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fefcea 0%,#f1bb43 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fefcea 0%,#f1bb43 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#f1bb43',GradientType=0 ); /* IE6-9 */
border: 1px solid #f2bf4f;  color:#6b29c3; text-decoration:none }
.page-link:hover{ background:#f2bf4f; border:1px solid #f2bf4f; color:#6b29c3}
.page-item.active .page-link{background: #955d00;    border-color: #f2bf4f;}

/****排行榜*******/
.charts-tb{ text-align:center}
.charts-tb td, .charts-tb th{padding: 0.3rem;}
.charts-tb{    background-color:#38186a;}
.charts-tb th{    background-color: #7139b2;}
.charts-tb td, .charts-tb th, .charts-tb thead th {    border-color: #4822a2;}

.txt_green{  color:#28FF28;}


/*語系選單*/
 .navbar-lan{ color: #ffe791;padding: 0rem 0.75rem ;    cursor: pointer;  background-color:transparent;     transition: all ease 1s;
 margin: 0 5px;    font-size: 25px; position: absolute; z-index:25;    right: -95px;    top: 45px;    text-align: center; width:110px}
.navbar-plane:hover, .navbar-lan:hover{ color:#FFF}
#lanBox{ width:90px;      margin: auto;  }
ul.lanShow{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fcfbf2+0,ffe9aa+100 */
background: #fcfbf2; /* Old browsers */
background: -moz-linear-gradient(top,  #fcfbf2 0%, #ffe9aa 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fcfbf2 0%,#ffe9aa 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fcfbf2 0%,#ffe9aa 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfbf2', endColorstr='#ffe9aa',GradientType=0 ); /* IE6-9 */


	text-align:center;	padding:10px;	font-size:14px;	margin:5px 0 0;	
	list-style-type: none;border-radius: 10px; box-shadow: 0 0 3px 2px rgb(0 0 0 / 25%); }
.lanShow li{   display: block;    padding: 3px;    border-bottom: 1px solid #be9d86; cursor: pointer; color:#333}
.lanShow li:hover, .lanShow li:focus, .lanShow li.active{	background-color:#4fb093; color:#fff}
/* Dropdown Menu */
.navbar-custom .dropdown:hover > .dropdown-menu {
	display: block; /* this makes the dropdown menu stay open while hovering it */
	min-width: auto;
	animation: fadeDropdown 0.2s; /* required for the fade animation */
}

@keyframes fadeDropdown {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}


/*********************/
/*    04. Header     */
/*********************/

.header{
	background-color: #06659b;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#48a0eb), to(#06659b));
	background-image: -webkit-linear-gradient(top, #48a0eb, #06659b);
	background-image: -moz-linear-gradient(top, #48a0eb, #06659b);
	background-image: -o-linear-gradient(top, #48a0eb, #06659b);
	background-image: -ms-linear-gradient(top, #48a0eb, #06659b);
	background-image: linear-gradient(top, #48a0eb, #06659b);	
	}

.header .header-content {
	background: url(../images/bg.jpg) center center no-repeat;
    background-size: cover;	padding-top: 9rem;	padding-bottom: 9rem;	text-align: center;
	position:relative}

.image-container{ position:relative; z-index:10}

/*遊戲說明*/
.icon-hot{ position:absolute; left:0px; top:-25px;    width: 45px;
-webkit-animation:icon-hot 0.6s infinite alternate;  animation: icon-hot 0.6s infinite alternate;}
.icon-hot img{ max-width:100%}
/*廣告框閃動*/

@-webkit-keyframes icon-hot{
 0% {

	-webkit-filter:hue-rotate(100deg);
	filter:hue-rotate(160deg);
  }
  50% {

 -webkit-filter:hue-rotate(280deg);
 filter:hue-rotate(280deg);
  }

  100% {

   -webkit-filter:hue-rotate(0deg);
   filter:hue-rotate(0deg);
  }
}

@keyframes icon-hot{
  0% {

	-webkit-filter:hue-rotate(160deg);
	filter:hue-rotate(160deg);
  }
  50% {

 -webkit-filter:hue-rotate(280deg);
 filter:hue-rotate(280deg);
  }

  100% {

   -webkit-filter:hue-rotate(0deg);
   filter:hue-rotate(0deg);
  }
}
.game-box{ text-align:center; margin-bottom:40px;   }
ul.gameImg{	margin: 0px auto;	padding: 0px;	list-style-type: none;    display: flex;    flex-direction: row;     flex-wrap: wrap; width: 98%;justify-content: center; }

.gameImg li{position: relative;    min-height: 1px; -ms-flex: 0 0 32%;    flex: 0 0 32%;    overflow:hidden;    -webkit-transition: all 300ms ease-in-out;    -o-transition: all 300ms ease-in-out;    transition: all 300ms ease-in-out;   cursor: pointer;  padding:5px}
.gameNam{	padding:5px 10px 0px;	font-weight: bold;	color: #FF0; position:relative; font-size: 16px}
/*單行省略
.gameTxt{overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap; font-size:14px; padding:10px}*/
.gameTxt{font-size:15px; overflow: hidden;  display: -webkit-box; padding:0 10px; line-height:19px; margin-bottom:15px;
text-align:left;    font-weight: 300;
  -webkit-line-clamp: 4;   /*省略第n行後的文字*/
  -webkit-box-orient: vertical;  /*設定元素是垂直布局*/}
 .gameImg li img{  transition: all 300ms ease-in-out;-webkit-transition: all 300ms ease-in-out;    -o-transition: all 300ms ease-in-out;} 

.gameImg li:hover{ color:#FDED7B;position:relative; z-index:5}

.pro-video{ margin:auto; position:relative; text-align:center ; max-width:620px; padding-bottom:15px;}

.proInfo .txt-title-li{	margin-left:-18px;	padding:0;	color:#F60;	list-style-type: none;}
.proInfo .txt-title{	color:#F60;}

.titleTxt{ color:#06C; position:relative; margin-bottom:15px; padding-bottom:15px; }
.titleTxt:after{
	content:"";
    position: absolute;
    left: 0; right:0; 
    bottom: 0; margin:auto;
    width: 80px;
    border-top: 3px solid #64c3fd;

	}
.title-boxSet{  margin-bottom:15px; text-align:center; letter-spacing: 1px; font-size: 1rem; line-height: 1.4}
.bg-blue .titleTxt{ color:#7df9ff}


/**************************/
/*     滿意度數值     */
/**************************/
.counter {	padding-top: 1.3rem;	padding-bottom: 1.3rem;	text-align: center;}
.counter #counter .cell {	
display: inline-block;	margin-right: 1rem;	margin-left: 1rem;	margin-bottom: 2rem;	font-size:20px;}

.counter #counter .counter-value {	color: #fff4a9;	font-size: 36px;	font-weight: 700;}
.counter #counter p.counter-info {
	margin-bottom: 0;	font-size:17px;	margin-top:15px;	color: #FFF;		letter-spacing: 1px;}
.counter #counter .cell .color1, .counter #counter .cell .color2,.counter #counter .cell .color3, .counter #counter .cell .color0{
color:#FFF; width:170px; height:170px; display: flex;  font-size:55px; justify-content: center;  align-items: center; border-radius: 50%; flex-wrap:wrap	; flex-direction: column; margin-bottom:20px; border:2px solid #c4c4c4;box-shadow:0px 0px 12px #3c3c3c;}
.counter #counter .cell .color1{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#02b0e0+1,2949bf+78 */
background: #02b0e0; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #02b0e0 1%, #2949bf 78%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  #02b0e0 1%,#2949bf 78%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #02b0e0 1%,#2949bf 78%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#02b0e0', endColorstr='#2949bf',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	}
.counter #counter .cell .color2{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a967cf+1,6c165f+78 */
background: #c73300; /* Old browsers */
background: -moz-radial-gradient(ellipse at center,  #e78a18  1%,#c73300 78%); /* FF3.6-15 */
background: -webkit-radial-gradient(ellipse at center,  #e78a18  1%,#c73300 78%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #e78a18  1%,#c73300 78%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c73300', endColorstr='#e78a18 ',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	}
.counter #counter .cell .color3{

background: #c08bdb; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #c08bdb 1%, #451872 78%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  #c08bdb 1%,#451872 78%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #c08bdb 1%,#451872 78%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c08bdb', endColorstr='#451872',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

	}
.counter #counter .cell .color0{
background: #aecc4f; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #aecc4f 1%, #257926 78%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  #aecc4f 1%,#257926 78%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #aecc4f 1%,#257926 78%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aecc4f', endColorstr='#257926',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	}
	
.news-box{	background: url(../images/bg-news.jpg) center center no-repeat;
    background-size: cover;
	text-align: center;
	position:relative}	
.news-box .col-lg-2{ margin-bottom:30px; justify-content:center}	
/*合作火伴*/
.cooperate-box{	background: url(../images/bg-cooperate.jpg) center center no-repeat;
    background-size: cover;
	text-align: center;
	position:relative}


/*      Copyright     */
/*************************/
.copyright {	padding-top: 2rem;	padding-bottom: 2rem;	background-color: rgba(0,0,0,0.8);	text-align: center; position: relative; z-index: 7}
.copyright .p-small {	 font-size:14px; margin:15px 0 10px}
.foot-name{ margin-right:25px}
.foot-link{ 
    background: #02b0e0;
    background: -moz-radial-gradient(center, ellipse cover, #02b0e0 1%, #2949bf 78%);
    background: -webkit-radial-gradient(center, ellipse cover, #02b0e0 1%,#2949bf 78%);
    background: radial-gradient(ellipse at center, #02b0e0 1%,#2949bf 78%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#02b0e0', endColorstr='#2949bf',GradientType=1 );
	
display: inline-block;     margin: auto; text-align:center;    line-height: 32px;cursor: pointer; padding:0 15px; font-size:15px;
    margin-bottom: 5px;    border-radius: 100px;    color: #fff; letter-spacing: 1px;}
.foot-link:hover{ background:#09C}
.foot-link i{	margin-right:8px;	}
#current_date{ color: #6B6B6B}
.level-box{ width:60%; display:flex; margin: auto}
.level-img{ flex: 0 0 55px; padding:0 10px 0 0}
.level-txt{ font-size:14px; color:#CCC; line-height:22px; text-align:left;    }

.topLogo{ width:300px; margin: 30px auto; position:relative; z-index:999}
.logo-pc{ display:block}
.logo-m{ display:none}
.logo-figure{ display:none}
/*頁尾-宣告*/
.foot-declare-nav a{ display: inline-block; margin: 0 8px; font-size: 14px; color: #ad8ac9 }
.foot-declare-nav{ margin: 10px auto 0; width: 60%; padding: 6px; background-color: rgba(0,0,0,0.5); border-radius: 50px;}
/*宣告內容*/
.declare-box, .sendCoin-box{
background: #896013; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #896013 0%, #f7e672 8%, #896013 16%, #fff999 27%, #8e6300 35%, #8e6300 35%, #f7e672 42%, #7f6011 55%, #f7e672 63%, #f7e672 63%, #845806 69%, #fff999 76%, #7c5911 88%, #fff999 99%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #896013 0%,#f7e672 8%,#896013 16%,#fff999 27%,#8e6300 35%,#8e6300 35%,#f7e672 42%,#7f6011 55%,#f7e672 63%,#f7e672 63%,#845806 69%,#fff999 76%,#7c5911 88%,#fff999 99%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #896013 0%,#f7e672 8%,#896013 16%,#fff999 27%,#8e6300 35%,#8e6300 35%,#f7e672 42%,#7f6011 55%,#f7e672 63%,#f7e672 63%,#845806 69%,#fff999 76%,#7c5911 88%,#fff999 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#896013', endColorstr='#fff999',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

 position: relative;    padding-bottom: 1px;    margin-bottom: 45px;  padding-top: 2px;}
.declare-box h1{background: url(../images/declare-title-bg.png) bottom center no-repeat ;-moz-background-size: cover;    background-size: cover;}
.declare-box h1, .sendCoin-box h1{ font-size: 32px;   height: 150px; position: relative; z-index: 2;     margin-bottom: -20px;    line-height: 35px;    display: flex;    justify-content: center;    align-items: center;    padding-bottom: 30px;
text-shadow: 0 0 5px #591fa1, 0 0 5px #591fa1, 0 5px 5px #591fa1, 0 5px 5px #591fa1, 0 5px 5px #591fa1;    color: #fff5a6;}
.declare-box h2{ font-size: 20px;     color: #fff366; margin-bottom: 5px; }
.declare-box h3{ color: #85f0ff; font-size: 17px; margin-bottom: 5px}
.declare-info, .sendCoin-info, .pro-info-page
{ position: relative; padding: 35px 20px 35px; background-color: #512c71; margin: 5px; z-index: 1;
	box-shadow: 0px 0px 7px rgb(0 0 0 / 70%) inset;     border: 1px solid #ecb322;}
.pro-page-info{background-color: #000;}
.pro-page-info h5{ color: #ffc107;}
.declare-box p{    margin-bottom: 2rem;}
.declare-box ol, .declare-box ul{margin-bottom:0}
/*送金幣活動*/
.sendCoin-box h1{background: url(../images/sendCoin-title-bg.png?02) bottom center no-repeat ;-moz-background-size: cover;    background-size: cover; padding-bottom: 0px}
ul.sendCoin-info{background-color: #161485;     display: flex;    flex-wrap: wrap;    justify-content: space-evenly;}
.sendCoin-info li{list-style-type: none; flex:0 0 47%;  }
.sendCoin-info li img{border-radius:5px }
.sendCoin-info li a{ display:block; border: 2px solid #161485; margin: 5px 2px;}
.sendCoin-info li a:hover{border-radius:5px;	border: 2px solid #ffd200;
    -moz-box-shadow: 0px 0px 3px 3px rgb(255 100 0);
    -webkit-box-shadow: 0px 0px 3px 3px rgb(255 100 0);
    box-shadow: 0px 0px 8px 3px rgb(255 100 0);}

/*手機公仔動畫*/
.run-In{
  -webkit-animation-name: run-In;
  animation-name: run-In;
}
@-webkit-keyframes run-In {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50%) ;
    transform: translateX(-50%) ;
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px);
    transform: translateX(0px) ;
  }
}

@keyframes run-In {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50%) ;
    -ms-transform: translateX(-50%) ;
    transform: translateX(-50%) ;
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px) ;
    -ms-transform: translateX(0px);
    transform: translateX(0px) ;
  }
}
@media (max-width: 915px) {
/*logo及公仔*/


.logo-figure{ display:none; }
 .logo-figure img{ display: none;}

/*星光閃*/
.blingbling-box{  left:30%;     transform: rotate(90deg); width:100px; position: absolute;}
}

@media (max-width: 660px) {


.blingbling-box{ top:15%}
}

.btnBar{ margin-top:10px; text-align:center}
.btnBar img{ display:inline-block; background-size:100%; height:35px;     margin-bottom: 5px;}
.btnBar .btn-group-lg>.btn, .btn-lg{
	padding: 5px;	font-size: 20px;	width:45%;
	margin:7px 7px;	height:47px}
.btnBar .btn-info{
background: #fffae5; /* Old browsers */
background: -moz-linear-gradient(top,  #fffae5 0%, #ffe679 50%, #ffd256 51%, #fff8d6 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fffae5 0%,#ffe679 50%,#ffd256 51%,#fff8d6 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fffae5 0%,#ffe679 50%,#ffd256 51%,#fff8d6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffae5', endColorstr='#fff8d6',GradientType=0 ); /* IE6-9 */

color:#222;border-color: #e1a92d}

/*.btn-info.disabled,.btn-info:disabled{color:#fff;background-color:#117a8b;border-color:#17a2b8}
.btn-info:not(:disabled):not(.disabled).active,.btn-info:not(:disabled):not(.disabled):active,.show>.btn-info.dropdown-toggle{color:#fff;background-color:#117a8b;border-color:#10707f}
.btn-info:not(:disabled):not(.disabled).active:focus,.btn-info:not(:disabled):not(.disabled):active:focus,.show>*/

.btnBar .btn-info:hover, .btnBar .btn-info:focus{     background:#fff8c3!important;    color: #222!important;    border-color: #e1a92d!important;}
.btnBar label{ margin-bottom:0}
.btnBar .btn-step{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ddf6ff+1,9ef0ff+49,9ef0ff+49,83e0fc+51,e2f9ff+100 */
background: #ddf6ff; /* Old browsers */
background: -moz-linear-gradient(top,  #ddf6ff 1%, #9ef0ff 49%, #9ef0ff 49%, #83e0fc 51%, #e2f9ff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ddf6ff 1%,#9ef0ff 49%,#9ef0ff 49%,#83e0fc 51%,#e2f9ff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ddf6ff 1%,#9ef0ff 49%,#9ef0ff 49%,#83e0fc 51%,#e2f9ff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ddf6ff', endColorstr='#e2f9ff',GradientType=0 ); /* IE6-9 */

color:#222;border-color: #6b9db5;     line-height: 38px;}
.btnBar .btn-step:hover, .btnBar .btn-step:focus{ background: #d2f5fb!important;    color: #333!important;   }
.btn{ cursor: pointer; }

ul.news-list{	margin: 0px;	padding: 0px;	list-style-type: none; width:100%; height:100%}
.news-list li{ display:flex;     background-color: #4e327a;    cursor: pointer;   /* box-shadow:0px 0px 3px #fffcaa;*/
    margin-bottom: 10px;     flex-wrap: wrap;    align-items: center;     border-radius: 3px; font-size:15px}
.news-list li:hover{	background-color:#9A742C}
.news-list b{ background-color: #004f88; width:15%; text-align:center}
.news-date{ color:#ccc; font-size:14px; padding:0 10px }
.news-topic{flex-grow:1; width:60%; text-align:left; overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;}
.news-topic h5{ font-size:1rem; margin-bottom:0}
.news-list b, .news-date, .news-topic{    padding: 0.3rem 0.7rem;}
#show-cooperate .form-control::placeholder, #show-service .form-control::placeholder, .VIP-area .form-control::placeholder  
{ /* CSS 3 標準 */  color: #b994f1;}
#show-cooperate .form-control::-webkit-input-placeholder, #show-service .form-control::-webkit-input-placeholder, .VIP-area .form-control::-webkit-input-placeholder{ /* Chrome, Safari */  color: #b994f1;}
#show-cooperate .form-control:-ms-input-placeholder, #show-service .form-control:-ms-input-placeholder, .VIP-area .form-control::-ms-input-placeholder
{ /* IE 10+ */  color: #b994f1;}
#show-cooperate .form-control::-moz-placeholder, #show-service .form-control::-moz-placeholder, .VIP-area .form-control::-moz-placeholder
{ /* Firefox 19+ */  color: #b994f1;  opacity: 1;}

#show-cooperate .form-control, #show-service .form-control, #show-service .form-control, 
.VIP-area .form-control{    border: 1px solid #7660b9;background-color: #613f9c; color:#FFF}
#show-cooperate h1, #show-service h1{ font-size: 1rem; }
#show-cooperate{/* padding-top:15px*/}
.code-refresh{ position: absolute; right: 8px; font-size: 25px; top: 3px; z-index: 10}
.code-refresh img{ width: 80px}
.changeCaptcha{ vertical-align: middle; display: inline-block; cursor: pointer; }
.changeCaptcha:hover{ color: #FFF852}
#show-cooperate textarea{ height:254px;     }
#show-cooperate .btn-warning, .write-box .btn-warning, .VIP-area .btn-warning{
background: #fefcea; /* Old browsers */
background: -moz-linear-gradient(top,  #fefcea 0%, #ffc107 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fefcea 0%,#ffc107 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fefcea 0%,#ffc107 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#ffc107',GradientType=0 ); /* IE6-9 */
	
width:180px; margin:20px auto 0; text-shadow: rgb(255, 255, 255) 1px 1px 2px, rgb(255, 255, 255) 1px 1px 3px; font-size: 1.1rem;     font-weight: bold;}
#show-cooperate .btn-warning:hover, #show-cooperate .btn-warning:active, #show-cooperate .btn-warning:focus, 
.write-box .btn-warning:hover, .write-box .btn-warning:active, .write-box .btn-warning:focus, 
.VIP-area .btn-warning:hover, .VIP-area .btn-warning:active, .VIP-area .btn-warning:focus{	background: #FCEAA3;}

#show-cooperate hr{ width:100%; border-top: 1px solid rgba(255,255,255,.3);}
/*問題列表*/
.QA_box{    background-color: #000;    padding: 20px;    border-radius: 0.25rem; margin: 0 10px;}
.QA_group i{ margin-right:8px;  font-size:17px; color:#ffa700}
.QA_group a{	display: block;	width: 100%;	border-bottom: 1px solid #50380b;     font-weight: bold;	text-decoration: none;color:#ffd83b; padding:8px}
.QA_group a:hover, .QA_list a:hover i{	color: #FFf;	background-color:#5C1053}
.QA_info{ padding:8px; border:3px double #515151;     }
.QA_img2, .QA_img1{display: flex;    flex-wrap: wrap;    align-items: center;    justify-content: space-between;}
.QA_img2 img, .QA_img1 img{    background-size:100%; display:block; margin:3px auto; 
border: 2px solid #c0941e;}	
.QA_img2 img{ width:49%; }
.QA_img1 img{  width:94%;}
.QA_line{  width: 100%;    position: relative;    display: flex;  justify-content: center;    align-items: center;    color: #fffc00; margin: 16px 0 3px;    font-size: 14px; text-align: center;    line-height: 18px;}
.QA_line:before, .QA_line:after {
    content: "";    position: absolute;    margin: auto;    height: 1px;
    width: 30%;    background-color: #b2a419;}
.QA_line:before{ left:0}
.QA_line:after{ right:0}
.QA_line span{ margin:0 4px}


/*問題反應*/
.write-box{ padding:20px 30px}
.write-box .form-control{ margin-bottom:10px}
.write-box textarea{ height:250px;     }

/*app安裝說明*/
.app-Setp-info{  margin:0 auto 25px}
.panel-gold{    border-color:#a19686;     margin-bottom: 10px;}
.panel-gold .panel-body{    
padding: 10px 5px;   background-color: #26236b;    color: #ffbc00;
    font-size: 15px;    line-height: 25px;}
.txt-step{
	-moz-box-shadow: 0px 0px 2px rgba(0,0,0, 0.6), inset 0px 0px 5px 2px rgba(255,255,255, 1);
    -webkit-box-shadow: 0px 0px 2px rgba(0,0,0, 0.6), inset 0px 0px 5px 2px rgba(255,255,255, 1);
    box-shadow: 0px 0px 2px rgba(0,0,0, 0.6), inset 0px 0px 5px 2px rgba(255,255,255, 1);
	
	    font-size: 20px;
    color: #fff;
    background-color: #6826a9;
	padding: 5px 15px 3px;  border-radius: 50px;}
.panel-gold .col-md-3, .panel-gold .col-xs-12{padding-right: 5px;    padding-left: 5px;}
.app-Setp-info .panel-heading{
background: #ebd3ff; /* Old browsers */
background: -moz-linear-gradient(top,  #ebd3ff 0%, #cea8ea 50%, #a885e2 51%, #e5d8ff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ebd3ff 0%,#cea8ea 50%,#a885e2 51%,#e5d8ff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ebd3ff 0%,#cea8ea 50%,#a885e2 51%,#e5d8ff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebd3ff', endColorstr='#e5d8ff',GradientType=0 ); /* IE6-9 */

color:#000; box-shadow: 0px 3px 3px rgb(0 0 0 / 60%);   padding:10px 15px 5px;}

.app-Setp-info .panel-heading img{ 
background-size:100%; height:32px;	
-webkit-filter: drop-shadow( 1px 1px 2px #fff);
    filter: drop-shadow( 1px 1px 2px #fff);
 margin-right:2px;   margin-top: -5px;	}
.app-Setp-info .panel-title{ font-size:19px; font-weight: bold;     color: #00266d; margin-bottom:0}
.help-img{
-moz-box-shadow: 0px 1px 5px rgba(0,0,0, 0.6);
    -webkit-box-shadow: 0px 1px 5px rgba(0,0,0, 0.6);
    box-shadow: 0px 1px 5px rgba(0,0,0, 0.6);
	border:2px solid #fff; margin: 5px 0 26px;
}
.panel-gold a{	display:block;  	text-decoration: none;  text-shadow: 1px 1px 2px #fff;    }


.txt-step{
	-moz-box-shadow: 0px 0px 2px rgba(0,0,0, 0.6), inset 0px 0px 5px 2px rgba(255,255,255, 1);
    -webkit-box-shadow: 0px 0px 2px rgba(0,0,0, 0.6), inset 0px 0px 5px 2px rgba(255,255,255, 1);
    box-shadow: 0px 0px 2px rgba(0,0,0, 0.6), inset 0px 0px 5px 2px rgba(255,255,255, 1);
	
	    font-size: 20px;    color: #fff;    background-color: #5e1f7e;	padding: 5px 15px 3px;  border-radius: 50px;}

.help-img{
-moz-box-shadow: 0px 1px 5px rgba(0,0,0, 0.6);
    -webkit-box-shadow: 0px 1px 5px rgba(0,0,0, 0.6);
    box-shadow: 0px 1px 5px rgba(0,0,0, 0.6);
	border:2px solid #fff; margin: 5px 0 26px;
}
/****彈跳小視窗********/
.alert-mode{position: fixed;    height: 100%;    width: 100%;   /* z-index:150;  */z-index:1055;   background-color: rgba(0,0,0,0.5);    display: flex; 
padding:0 10%; align-content: center;    justify-content: center;    align-items: center;
-webkit-transition: 300ms all ease-in;
    -o-transition: 300ms all ease-in;
    transition: 300ms all ease-in;
}
.alert-mode .alert{  width:100%;  font-size: 17px; color:#202020;    line-height: 33px; position: relative;     text-align: center; }
.alert-mode .close{opacity: 1; font-size: 30px; position: absolute; border-radius:50%;
	border: 3px solid #727272; text-align: center; width: 35px; height: 35px; line-height: 25px;
	text-decoration: none; top: -8px;    right: -8px;    background-color: #fff5a1; color:#545454}
.alert-mode  .close:hover{border: 3px solid #FD6F01; color: #FD6F01; opacity:1}
.alert-mode .alert strong{	font-size:18px;	color: #F30;	letter-spacing: 1px; margin-bottom:10px}
.alert-mode .btn{ margin-top:20px; text-decoration: none; 
text-shadow: 0px 2px 3px rgb(0 68 3 / 100%), 0px 2px 3px rgb(0 0 0);letter-spacing:1px;
-moz-box-shadow: 0px 1px 3px 1px rgb(4 65 0 / 70%) inset, 0px 5px 5px 0px rgb(23 82 0);
-webkit-box-shadow: 0px 1px 3px 1px rgb(4 65 0 / 70%) inset, 0px 5px 5px 0px rgb(23 82 0);
 box-shadow: 0px 1px 3px 1px rgb(4 65 0 / 70%) inset, 0px 5px 5px 0px rgb(23 82 0);}
.returnMsgTitle, .returnMsgContent{ display:block; text-align:center; width:100%}/*框內文字*/
.backIndex{  cursor: pointer;}


@-webkit-keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100px);
    -ms-transform: translateY(-100px);
    transform: translateY(-100px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    -ms-transform: translateY(100px);
    transform: translateY(100px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}
/***** VIP專區 ****/
.VIP-area{background-color: rgb(0 0 0 / 60%);padding-bottom: 0.5rem;   }
.VIP-area .row{justify-content: center;}
.VIP-area .mb-3, .VIP-area.my-3 {    margin-bottom: 0.5rem!important;}
.VIP-area .btn{width: 100%; margin: 0 auto; padding: 0.17rem 0.75rem; font-size: 1rem}
.VIP-area .form-control{padding: 0.2rem 0.75rem;    font-size: 15px;    letter-spacing: 1px;}
.VIP-title{ 	max-width: 100%; flex: 100%;	font-size: 18px;   color: #ffe92a; 
	padding: .2rem; text-align: center;     /*font-weight: 600;*/}
.vip-payIcon{ display:flex;justify-content: center;    flex-wrap: wrap;   margin-top: 7px;width: 90%;}
.vip-payIcon img{   -ms-flex: 0 0 25%;    flex: 0 0 25%;    max-width: 25%;  border: 0px;    border-radius: 0; padding:3px}
.vip-payIcon img:hover{    -moz-box-shadow:none ;    -webkit-box-shadow: none;    box-shadow: none; border:0}
.vip-payIcon-group1, .vip-payIcon-group2{ display: flex; justify-content: space-around;}


/*儲值分類設定*/
.proKindNav{ margin-bottom:8px; justify-content: center;}
.proKindNav .btn-orange.active, .proKindNav .show>.btn-orange{ background:#860424}
.proKindNav .btn-orange {
    -moz-box-shadow: 0px 1px 3px 1px rgb(183 0 0 / 70%) inset, 0px 0px 5px 1px rgb(255 228 121);
    -webkit-box-shadow: 0px 1px 3px 1px rgb(183 0 0 / 70%) inset, 0px 0px 5px 1px rgb(255 228 121);
    box-shadow: 0px 1px 3px 1px rgb(183 0 0 / 70%) inset, 0px 0px 5px 1px rgb(255 228 121);border-radius: 5rem;	padding: 0.2rem 1rem;	text-decoration: none; margin:0 6px 8px; 
    letter-spacing: 0px; font-weight:bold }
.topUp_ruleSet{ position:absolute; right:0; font-size:14px}
.topUp_ruleSet a{ color:#FF0}
.topUp_ruleSet a:hover{ color:#51f9ff}
#topUp_rule .modal-header{    padding: 0.5rem 1rem;}
#topUp_rule .modal-title{ line-height:1.5}

/*儲值*/
.topUp-box{position: relative;    width: 100%;   /*height: 0; padding-bottom: 100%;min-height:100vh*/
}

/*儲值*/
.topUp-info{    display: flex;     justify-content: space-evenly; /*  justify-content: space-between;  */  flex-wrap: wrap;    overflow-y: scroll; overflow-x:hidden;    max-height: 800px;}
.topUp-group{    width: 48.5%;    display: flex;    text-align: center;
    margin-bottom: 35px;    min-width: 48%;    flex-direction: column;}
.topUp-title{
	width:100%;
	background-image: url(../images/topUp-infoTitle.png?03);
	-moz-background-size: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center top;
	color:#FF0;	font-size:13pt;	line-height:27pt;     margin-bottom: -10px;
	text-shadow: rgb(102 0 183) 1px 1px 5px, rgb(102 0 183) 3px 2px 5px;
}

.topUp-area{
	-moz-background-size: 100%;
	background-size: 100%;
	background-attachment: scroll;	
	background-repeat: no-repeat;
	background-position: 0px 0px;   /* height: 210px;*/ 
	height: 0;    padding-bottom: 60%/*讓高度自適應*/;    width: 100%;
	
}
.topUp-area-bg-0{background-image: url(../images/product/topUp-infoBg-0.png);}/*預設背景*/
.topUp-area-bg-1{background-image: url(../images/product/topUp-infoBg-1.png);}/*萬聖節背景*/
.topUp-area-bg-2{background-image: url(../images/product/topUp-infoBg-2.png);}/*儲值卡背景*/
.topUp-area-bg-3{background-image: url(../images/product/topUp-infoBg-3.png?02);}/*驚喜包背景*/
.topUp-area-bg-4{background-image: url(../images/product/topUp-infoBg-4.png?04);}/*龍易發福袋背景*/
.topUp-point{width:100%; padding-top:14%; padding-bottom:5%; font-size:13pt;  color: #fff; text-align:center;  position:relative;     padding-right: 47%;}

.topUp-point span{ margin-left:3px; font-weight:bold; color:#FFF; }
.topUp-getPoint{/* position:absolute; width:38%; min-height:80px; right:10%; top:0; padding-top:10%; text-align:center*/
position: absolute;    width: 50%;    min-height: 80px;    right: 5%;    top: 0;    padding-top: 5%;    text-align: center;}
.topUp-getPoint img{ max-width:100%;background-size:100%; position:relative}
.topUp-getPoint-txt{    position: absolute;    top: 20%;    width: 100%;    height: 80%;}
/*.topUp-getPoint h3, .topUp-getPoint h4{position:absolute; width:100% }*/
.topUp-getPoint h3{	/*font-family: Impact;*/ font-size:140%;    color: #FF0; margin-bottom:0.2rem; }
.topUp-getPoint h3 span{color: #FF0; font-size:135%; margin-left:0}
.topUp-getPoint h4{ font-size:15pt; }
.topUp-card{     color: #00fdff;
    font-size: 230%;
    position: absolute;
    width: 46%;
  /*  min-height: 80px;*/
    right: 5%;
    top: 64%;
    padding-top: 5%;
    text-align: center;
    font-weight: bold;}

.topUp-coinImg{ width:38%; display:inline-block; padding: 2% 0% 2% 3%;     vertical-align: top;}
.coin-img{ max-width: 100%}
.topUp-price-btn{ width:48%; display:inline-block;    /* margin-right: 1.2%;*/ margin-top:15%}
.topUp-price-btn .btn-warning, .buypoint .btn-warning{
	background: #fefcea;
	background: -moz-linear-gradient(top, #fefcea 0%, #ffc107 100%);
	background: -webkit-linear-gradient(top, #fefcea 0%,#ffc107 100%);
	background: linear-gradient(to bottom, #fefcea 0%,#ffc107 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#ffc107',GradientType=0 );
	width: 95%;	margin:auto;
	text-shadow: rgb(255 255 255) 1px 1px 2px, rgb(255 255 255) 1px 1px 3px;
	font-size: 14pt;	color:#C00;	font-weight: bold;    border-radius: 25px;
	box-shadow: 0px 4px 0px #a25800;
	transition: background-image .5s,transform .5s;/*避免漸層色滑過閃逤*/
}
.topUp-price-btn .btn-warning:hover, .topUp-price-btn .btn-warning:focus, 
.buypoint .btn-warning:hover, .buypoint .btn-warning:focus
{ color:#C00;background:#fffa78;  }

.topUp-price-btn .btn-warning span{ color:#353535; margin-right:3px}
.topUp-price-btn .btn{ padding:1% 1%}
.topUp-note{	color: #fff;	font-size: 11pt;	width: 90%;	margin:5px auto 0;	letter-spacing: 1px;}
.topUp-area-bg-3 .topUp-point span, .topUp-area-bg-4 .topUp-point span{    color: #faff3b;}
.buypoint .modal-content{    background: #f0f0f0 url(../images/topUp-bg.jpg) center center no-repeat fixed;    -moz-background-size: cover;    background-size: cover;}
.buypoint .modal-header {
    background: #fcfcfc;
    background: -moz-linear-gradient(top, #fcfcfc 8%, #ceafff 100%);
    background: -webkit-linear-gradient(top, #fcfcfc 8%,#ceafff 100%);
    background: linear-gradient(to bottom, #fcfcfc 8%,#ceafff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ceafff',GradientType=0 );
    box-shadow: 0px 1px 5px #424242;
	border-bottom: 1px solid #e9ecef;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
.buypoint .modal-title{display: inline-block; font-size: 12pt;width: 83%;     vertical-align: middle;}

.modal-coinImg{width: 28%;    margin-right: 10px;    display: inline-block;}
.modal-coinImg img{ max-width:100%}
.modal-buyInfo{display: inline-block;    vertical-align: middle; width:66%}
.modal-buyMail-note{ width:100%; font-size:14px; color:#df3800; background-color:rgba(255,255,0,0.4); text-align:center;     line-height: 16px;    padding: 5px 10px;}
.buypoint .modal-footer{ text-align:center; border-top: 1px solid #7e7e7e; flex-direction: column;}
.buypoint .btn-warning{    width: 45%;  padding: 6px 20px; font-size:12pt}
.buypoint button.close{     position: relative;
    background-color: #f13700;border: 1px #ff6a23 solid;
    color: #fff;    opacity: 1;filter: alpha(opacity=100);
    width: 35px;    border-radius: 80px;    height: 35px;
        box-shadow: 0px -5px 15px #4c0073 inset;     display: flex;
    justify-content: center;    align-items: center;    padding: 0 0 5px; margin-bottom:-5px; margin-top:-5px; margin-right:-5px}
.buypoint button.close:hover{ background-color: #4925ff;}
.buypoint .modal-header{padding: 10px 15px;}

.modal-buyInfo .form-control{ width:auto; display: inline-block;}
.modal-buyInfo label{display: inline-block;}
.modal-buyInfo div{ margin-bottom:8px}
.modal-buyInfo span{ margin-left:5px; color:#C00}

.btnPay_kind{    display: flex;    flex-wrap: wrap;    justify-content: center;}
.buypoint h6{ width:100%; text-align:center;     color: #9f0ad5;    font-weight: bold;
    font-size: 1.1rem;}
.btnPay_jko img, .btnPay_neweb img, .btnPay_sonet img{ max-width:100%;   border-radius: 10px;  border: 1px solid #999;transition: background-image .5s,transform .5s; cursor: pointer;}
.btnPay_jko, .btnPay_neweb, .btnPay_sonet{ display:flex; margin:5px; width:100%;     justify-content: center;     }
.btnPay_jko img:hover, .btnPay_neweb img:hover, .btnPay_sonet img:hover{border:1px solid #FC3; box-shadow: rgb(255 226 122) 0px 1px 5px 5px; transform:translateY(-5%); border:1px solid #fff}
.btnPay_sonet{flex-direction: column;}
#sonet-show{ border:1px solid #666; border-radius: 10px;     padding: 10px 0;}
#sonet-show label{ display:inline-block; margin:5px }
#sonet-show .btn-orange{ width:250px; color:#fff; margin:8px auto 0;     border-radius: 80px;}

/*儲值說明圖*/
.topUp_rule_set .panel-body ul{	margin: 0px;	padding: 0px;	list-style-type: none; position:relative; display:flex;     flex-wrap: wrap;}
.topUp_rule_set .panel-body ul li{ display:flex; width:50%; padding:6px}

/*首頁彈跳廣告*/
.modalDiv{ position:relative}
.modalDiv .close, .modal_activityImg .close{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#aa006f+0,350cb2+100 */
background: #aa006f; /* Old browsers */
background: -moz-linear-gradient(top,  #aa006f 0%, #350cb2 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #aa006f 0%,#350cb2 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #aa006f 0%,#350cb2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aa006f', endColorstr='#350cb2',GradientType=0 ); /* IE6-9 */
	
	position: absolute; width:35px; height:35px; right:-10px; top:-10px; text-align:center;
	opacity: 1; padding-bottom: 3px;    color: #ffe400;    text-shadow: 0 1px 0 #000;    border-radius: 50px;    border: 1px solid #a940ff;
	-webkit-filter: drop-shadow(1px 3px 3px rgba(0, 0, 0, 0.7));
    filter: drop-shadow(1px 3px 3px rgba(0, 0, 0, 0.7))}
.modalDiv .close:hover{ opacity: 1; background: #d82f2f;}

.modalDiv .modal-dialog{ margin-top: 1.2rem}
/*.float_buyIcon{ display:none}*/

/*18歲分級頁面*/
.gradind_bg{position: fixed;    top: 0;    left: 0;    bottom: 0;    right: 0;    z-index: 10000;    display: flex;    align-items: center; 
    justify-content: center;       background: rgba(0,0,0,.7);
    backdrop-filter: blur(8px);color: #fff;}
.gradind_info{ border-radius: 20px; display:flex;  background-color: #40297a;font-size:22px;
    padding: 35px 25px;    width: 90%;    flex-direction: column;    align-items: center;     border: 1px solid #ad7339; width:700px; margin:auto}
.gradind_info img{ width:90px; margin-bottom:10px}
.gradind_info p{ margin-bottom:10px}
.gradind_info .btn{border-radius: 60px; width:45%; display:inline-block}
.gradind_btn .btn-blue, .gradind_btn .btn-orange{box-shadow: none; font-size: 24px;
    font-weight: bold; margin:0 10px}
.gradind_btn{    width: 100%;    text-align: center;      margin:10px 0 30px}

.gradind_info label {  padding: 0;  cursor: pointer;}
.gradind_info input[type="checkbox"] {  display: none;}
.gradind_info input[type="checkbox"]+span{  display: inline-block;
  padding-left: 26px;  line-height: 20px;
  background: url(/includes/images/checkbox_1.png) no-repeat left top;
            user-select: none;}
.gradind_info input[type="checkbox"]:checked+span {
  background: url(/includes/images/checkbox_2.png) no-repeat left top;
}
/*代理合作*/
.acting-box{ position:relative;     margin-top: -15px;    margin-left: -12px;    margin-right: -12px;}
.acting-top{
background: url(/includes/images/acting/top_img_bg.jpg) center bottom no-repeat scroll;
	-moz-background-size:cover; 	background-size: cover; width:100%;	    display: flex;
    justify-content: center; position:relative;    }
.acting-top-img{max-width:100%; position:relative; z-index:5; text-align:center}

.acting-info{ margin-top:-110px;     padding-top: 140px; position:relative	}

ul.actingGame-img{ display:flex; width:1000px; position:relative; flex-direction: row;    align-items: center; margin:0 auto 8%; padding:0 20px; flex-wrap: wrap; transition: all ease 1s;}

.actingGame-img li{	list-style-type: none;	position: relative; display:flex; width:33%; 
padding:5px; flex-direction: column;    align-items: center; }
.actingGame-img li img{border-radius: 0.3rem!important;}
.actingGame-img li h5{ margin-top:6px; font-size:1.15rem}

.acting-foot{ position:relative; display:flex;   justify-content: center; font-size:16px;     border-bottom: 1px solid #3b2bbf; flex-wrap: wrap;     justify-content: space-around; margin-bottom:30px}
.acting-foot-L, .acting-foot-R{  display: flex;  flex-wrap: wrap;     align-content: center;     align-items: center;}
.acting-foot-L{     width: 50%;    padding-right: 3%;}
.acting-foot-L h6{ width:100%; text-align:center}
.acting-foot-L ul{ padding:0; margin:0; display:flex}
.acting-foot-L li{	padding:6px ;	list-style-type: none;}
.acting-foot-L img{ max-width:100%;     border-radius: 0.6rem}
.acting-foot-R{ position:relative; }
.acting-foot-R-info{    padding: 8px;  width:230px}
.acting-foot-R-info span{margin-right: 10px;
    color: #ffca1b;}.acting-foot-R-info a{    display: block;    width: 50%;}
.acting-foot-R-qr{ width:80px}
.foot-copyright{   display: flex;   margin:20px auto 0; justify-content: center;    padding: 8px;    color: #b8b8b8;    background-color: rgba(0,0,0,.6);    font-size: 16px;    align-items: center; width:100%}
.foot-copyright	span{    display: inline-block;    width: 50px;    margin-right: 10px;}
.acting-top-img {
    -webkit-animation: baloon_1 2s ease-in-out infinite alternate;
    -moz-animation: baloon_1 2s ease-in-out infinite alternate;
    -ms-animation: baloon_1 2s ease-in-out infinite alternate;
    -o-animation: baloon_1 2s ease-in-out infinite alternate;
    animation: baloon_1 2s ease-in-out infinite alternate;

}

/*儲值頁面20250809修改*/
.Check-TopUp-way{ text-align: center; margin-bottom: 15px;}
.Check-TopUp-way .topUp-price-btn{ margin: 35px 0 10px;}
.btn-setPrice-input{  text-align: center; color: #ffc107; background: transparent !important; margin: auto;   border: 0;   
  border-bottom: 1px solid #ffc107;    border-radius: 0;    width: 93%; background-color: rgb(232 240 254 / 0%) !important; }
.btn-setPrice-input:focus{ color: #fff; background: transparent;  border: 0;    border-bottom: 1px solid #ffc107;box-shadow:0 0 0 0 rgba(0,0,0,0)   }
.btn-setPrice-input:-webkit-autofill,
.btn-setPrice-input:-webkit-autofill:hover,
.btn-setPrice-input:-webkit-autofill:focus,
.btn-setPrice-input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0px 1000px #000 inset !important;
    -webkit-text-fill-color: #fff !important;
    caret-color: #fff !important;
}
.Check-TopUp-way .btn-outline-warning:focus{ background: transparent; box-shadow:0 0 0 0 rgba(0,0,0,0); color: #ffc107 }

/*.Check-TopUp-way .btn-outline-warning:hover{ background: transparent;}*/
.Check-TopUp-way .btn-check{    position: absolute;    clip: rect(0, 0, 0, 0);    pointer-events: none;}
.Check-TopUp-way .form-check-inline{ width: 30%;margin: 0;}
.Check-TopUp-way .form-check-inline .btn{ display: block; width: 100%;}
.Check-TopUp-way select.form-control {color: #ffc107;    background-color: #000;    background-image: none;    border-color: #ffc107;  }
.Check-TopUp-way select.form-control select{  background-position: right 1rem center;}


@-webkit-keyframes baloon_1{
0% { transform:translateY(0px);}
50% {transform:translateY(40px);}
100% {transform:translateY(0px);}
}

@-moz-keyframes baloon_1{
0% { transform:translateY(0px);}
50% {transform:translateY(40px);}
100% {transform:translateY(0px);}
}

@-ms-keyframes baloon_1{
0% { transform:translateY(0px);}
50% {transform:translateY(40px);}
100% {transform:translateY(0px);}
}

@-o-keyframes baloon_1{
0% { transform:translateY(0px);}
50% {transform:translateY(40px);}
100% {transform:translateY(0px);}
}

@keyframes baloon_1{
0% { transform:translateY(0px);}
50% {transform:translateY(40px);}
100% {transform:translateY(0px);}
}

/*左右邊活動_浮動icon*/
.float_icon_box{position:fixed;  z-index:120;  left: 3.5%; top:2%; display: flex;     justify-content: space-evenly;    width: 14%; }
.float_buyIcon, .float_sendIcon{ display:block;  width: 49%;cursor: pointer; margin: 0 2px;    position: relative; }
.float_sendIcon{ }
.float_buyIcon_txt, .float_sendIcon_txt{ color:#fff5cb; font-size:15px; font-weight:bold;    
  text-shadow: rgb(80 2 2) 2px 2px 2px, rgb(46 31 31) 2px 2px 3px;position: absolute;   bottom: 11%;margin: auto;    left: 0;    right: 0; text-align: center}
.float_sendIcon_txt h5{ display:  flex; width: 40px; height: 40px; text-align: center; background-color: rgba(232,0,3,0.85); color: #FFFD01; font-size: 18px; margin:0 auto; justify-content: center;
    align-items: center;  border-radius:50%;border: 2px solid #fff200; font-weight: bold; 
  box-shadow: 0px 0px 5px 3px; 
  animation: red_move 1.5s 0s infinite;
	-webkit-animation: red_move 1.5s 0s infinite;
	transform-origin: bottom;
	-webkit-transform-origin: bottom;}
.float_sendIcon_txt p{ margin-bottom: 0 }

/*送金幣字左右搖晃*/
@keyframes red_move {

	0%,
	65% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	70% {
		-webkit-transform: rotate(6deg);
		transform: rotate(6deg);
	}

	75% {
		-webkit-transform: rotate(-6deg);
		transform: rotate(-6deg);
	}

	80% {
		-webkit-transform: rotate(6deg);
		transform: rotate(6deg);
	}

	85% {
		-webkit-transform: rotate(-6deg);
		transform: rotate(-6deg);
	}

	90% {
		-webkit-transform: rotate(6deg);
		transform: rotate(6deg);
	}

	95% {
		-webkit-transform: rotate(-6deg);
		transform: rotate(-6deg);
	}

	100% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
}


@media (min-width: 760px){
.modal-buyInfo .modal-dialog {    max-width: 700px;    margin: 1.75rem auto;}
}
/*尚未開放*/
.notOpen{ display: flex; justify-content: center;}
.notOpen img{ max-width:100%}
/**/
.showGameInfoModalIframe img { max-width:100%}


@media (max-width: 1152px) {
.box-L, .box-R{-ms-flex: 0 0 15%;    flex: 0 0 15%;    max-width: 15%; /*z-index:1 */ }
.box-C, .imgAd-box-pc{/*-ms-flex: 0 0 70%;    flex: 0 0 70%;*/ width: 68%;    max-width: 68%;   ; }
.float_icon_box{ left: 0.5%; flex-direction: column;}
.float_buyIcon, .float_sendIcon{    width: 110px;; margin: 0 auto}
	}
@media (max-width: 915px) {
.box-C{-ms-flex: 0 0 96%;    flex: 0 0 96%;    max-width: 96%;    }
.box-info{align-items: center;  flex-direction: row;    justify-content: space-evenly;}
.box-L{ order:1; -ms-flex: 0 0 22%; flex: 0 0 22%; max-width: 22%; position:relative}
.box-C{ order:4}
.box-R{ order:2; -ms-flex: 1 1 73%; flex: 1 1 73%; max-width: 73%; position:relative}
.imgAd-box-pc{ order: 3;        -ms-flex: 0 0 96%;        flex: 0 0 96%;        max-width: 96%;}
.media-box, .load-box, .player_infoBox{ position:relative;     width: 100%;     right: 0;    left: 0; }
.media-box{        background-color: transparent; border: 0px;}

.player_infoBox{    bottom: 0;    top: -12px;}

.media-box ul, .load-box ul{    justify-content: center;    flex-direction: row; flex-wrap: wrap;   align-content: center;}
.load-box ul{    padding: 8px 55px;  height: auto;}
.load-box ul li{width: 30%; padding:3px}
/*.load-box ul li:nth-last-child(5) { display:none}*/
.tabSet .nav-link{    font-size: 14px; height:100%; display: flex;    flex-direction: column;    justify-content: center; line-height: 20px;}
.tabSet .nav-item{align-self: stretch;}
.VIP-area .mb-3{    width: 34%;    display: inline-flex;}
.VIP-area .btn-warning{margin:0; display: inline-flex; width: 27%;justify-content: center;}
.VIP-area .row{ text-align: center}
.player_info_btnLogin{ line-height:25px}
.vip-payIcon{    flex-wrap: nowrap; }
.vip-payIcon img{padding: 0px 3% 3px;}
.float_icon_box{ right: 0;     left: auto; bottom: 1%; width: 110px;    top: auto;}
.float_sendIcon{ margin-bottom: 10px}
	
}

@media (max-width: 960px) {
.gameNam i{ display:none}
.counter .container{    max-width: 780px;}
.counter #counter .cell .color1, .counter #counter .cell .color2,.counter #counter .cell .color3, .counter #counter .cell .color0{
	    width: 120px; height:120px; font-size: 30px;     margin-bottom: 10px;}
.counter #counter p.counter-info{    font-size: 15px;    margin-top: 5px;}
.counter #counter .cell{    margin-right: 0.5rem;    margin-left: 0.5rem;}
.counter #counter .counter-value{ font-size: 30px}
.gradind_info{ width:90%; font-size:18px; padding:25px 15px}
.gradind_btn .btn-blue, .gradind_btn .btn-orange{ font-size:18px; letter-spacing:0px}
	}	

@media (max-width: 767px) {
.header .header-content{   padding-bottom: 2rem;    padding-top: 5rem;}
.titleTxt{ font-size:1.35rem;     padding-bottom: 10px;}
.betInfo .col-md-4{ text-align:center}
.betInfo img{ width:80%; margin:auto; margin-bottom:10px}
.counter #counter .cell .color1, .counter #counter .cell .color2,.counter #counter .cell .color3, .counter #counter .cell .color0{  width: 105px; height:106px; font-size: 25px; }
.counter #counter .cell {    margin-right: 0.5rem;    margin-left: 0.5rem;   }
.counter #counter .counter-value{ font-size:30px}
.title-boxSet{letter-spacing: 0;}
.title-boxSet h6{ font-size:14px;     line-height: 1.4;}
.gameImg p{ line-height:20px; margin-bottom:0;}
.game-box .container{    max-width: 100%;} 

.gameNam{ font-size:15px; flex-direction: column;    align-items: center;}
ul.gameImg{ width:100%}
.gameImg li{-ms-flex: 0 0 49%;    flex: 0 0 49%;    max-width: 49%;}
/*.gameImg li{-ms-flex: 0 0 32.5%;    flex: 0 0 32.5%;    max-width: 32.5%;}一排3個*/
.gameImg li:last-child{ display:none}
.topLogo{width: 20%;     margin: 5px 0;         position: absolute; left: 10px;}
.player_infoBox{ top: 0; padding-left: 23%;}
/*左右2區(下載及社群)*/
.box-R{-ms-flex: 0 0 96%;    flex: 0 0 96%;    max-width: 96%; order: 3;}
.box-L{ display: flex;-ms-flex: 0 0 96%;    flex: 0 0 96%;    max-width: 96%;  padding: 20px 0;}
.media-box{    background-color: transparent;     border: 0px solid #bd87ee; justify-content: center; width: 10%;   z-index: 5;  flex-direction:
   row;align-items: center;  bottom: 0;}
.media-box ul{ height: auto; }
.media-box ul li{    flex: 0 0 90%;    max-width: 90%;         padding: 3px 0 3px 5px;}
.media-box-line{margin:auto; width: 140px}
.load-box ul{  height: auto;/*height: 185px;*/  align-content: flex-end; padding: 8px 10px;  }
.level-box, .foot-declare-nav{ width:75%}
.table-dark td, .table-dark th, .table-dark thead th{ font-size:14px}
.declare-box h1{ font-size: 25px}
.alert-mode{padding: 0 5%;}
.alert{padding: 0.75rem 0.75rem;}

.player_info_show{flex-direction: row; justify-content: space-between;
    -moz-box-shadow: none;    -webkit-box-shadow: none;    box-shadow: none;        background-color: transparent;
            margin-bottom: 0;     border: 0px #c0e4ff solid; flex-wrap: wrap;/*text-shadow:none*/}
.player_info_btnOut{ /*width:18%*/line-height: 16px;   font-size: 10pt;   letter-spacing: 0px;     width: 92%; /*border-radius: 0.25rem;*/
    margin: 2px auto; }
.player_info_show div{    width: 50%;    justify-content: center; font-size: 10pt; line-height: 22px;}

.QA_box{padding: 10px 10px 20px;}
.QA_group a{ font-size:14px}
.QA_group i{font-size: inherit;}
.QA_line{    flex-direction: column;     line-height: 22px;}
.QA_line span{ width:100%;}
.QA_line:before, .QA_line:after{ background-color: #625a0f;}
.acting-foot{}
.acting-foot-R-qr{ display:none}
.acting-foot-L{ width:85%; padding-right:0}
.acting-foot-R-info{ text-align:center; width:auto;     padding-top: 15px;}
.acting-foot-R-info a{ width:180px;     margin: auto;}
.p-large span{width: 80px;    height: 80px; line-height: 80px;     font-size: 1.2rem;}
.topUp-price-btn .btn{     font-size: 12pt; height:32px}
.topUp-point{font-size:11pt; padding-top: 12%;     padding-bottom: 1.5%;  }
.topUp-note{ font-size: 9pt;   letter-spacing: 0px;    line-height: 18px;}
.topUp-getPoint h3{ font-size:120%}
.topUp-getPoint h4 {    font-size: 13pt;}
.topUp-price-btn{ margin-top:18%; width: 75%;}
.proKindNav .btn-orange{    padding: 0.1rem 0.6rem;     letter-spacing: 0px;     font-size: 15px;}
.sendCoin-info li{flex: 0 0 90%;}
.sendCoin-info{padding: 15px 20px;}
.sendCoin-box h1{    font-size: 22px;    height: 100px; padding-bottom: 5px;     -moz-background-size: 120% 100%;    background-size: 120% 100%;}
.topUp_rule_set .panel-body ul{    justify-content: center;}
.topUp_rule_set .panel-body ul li{ width:95%}
.app-Setp-info .panel-title{ font-size:16px}
.app-Setp-info .panel-heading{    padding: 10px 8px 5px;}
.app-Setp-info .panel-heading img{ height:28px}
.load-box{ bottom: 0;}

.box-C{         -ms-flex: 0 0 100%;    flex: 0 0 100%;      max-width: 100%;   margin-top: 15px;}

.imgAd-box-pc, .imgAd-box-mob{-ms-flex: 0 0 100%;    flex: 0 0 100%;     max-width: 100%;   order: 2; display: block;}
.imgAd-box-pc .carousel-inner, .imgAd-box-mob .carousel-inner{width: 100%;}
.imgAd-box-pc .img-thumbnail, .imgAd-box-mob .img-thumbnail{border-radius:0px}
.ad-frame{height: 0; width: 0; display: none;}
.imgAd-box-pc .carousel, .imgAd-box-mob .carousel{margin-bottom: -45%;}
.navbar-lan{right: -70px;        top: 60px;}
.VIP-title{ font-size: 11pt;}
.VIP-area .form-control{letter-spacing: 0; font-size: 14px;}
.focus-people{ font-size: 14px;         margin-right: 2%;}

}
@media(min-width: 641px) and (max-width: 767px){
.topUp-point{  /* padding-top: 12.5%; padding-bottom: 1%;*/ }


	}
@media (max-width: 568px) {
.btnBar .btn-group-lg>.btn, .btn-lg{ font-size:17px; margin: 5px; width:85%}

.level-box, .foot-declare-nav{    width: 88%;}
.level-txt{ font-size:13px; line-height:19px}
.counter{ padding-bottom:0}
.navbar-lan{          right: -65px;        top: 55%;        font-size: 15pt; }
.main-tab-info{ padding:18px 0}
.gameTxt{ font-size:13px}
.gameNam{ font-size:14px}
.icon-hot{ width:35px; top:-20px}
.news-date{ font-size:13px}

.load-box ul{  /*height: 155px; */  }
.load-box ul li{width: 33%;}
.VIP-area .form-control {  padding: 0.2rem 0.4rem;}
.gradind_info{ font-size:16px;}
.gradind_btn .btn-blue, .gradind_btn .btn-orange{ font-size:16px}
.gradind_info .btn{ width:80%; margin-bottom:10px}
.topUp-group{ width:49.5%}
.topUp-price-btn{    margin-top: 16%;}
.topUp-price-btn .btn{font-size: 10pt;}
.topUp-point{   font-size:9pt; text-align: left;    padding-left: 18px; padding-top: 9%; padding-bottom: 0; padding-right: 0;}
.topUp-getPoint{   min-height: 60px;    scale: 100% 90%;    padding-top: 3%;}

.topUp-getPoint h3{    font-size: 100%;}
.topUp-getPoint h4 {    font-size: 9pt;}
.acting-box{   margin-top: -15px;    margin-left: 0px;    margin-right: 0px;}
.topUp_ruleSet{    position: relative;     width: 100%;    text-align: center;    margin-top: 5px;}


}
@media (max-width: 640px) { 

.news-topic h5{ font-size:0.95rem}
}
@media (max-width: 460px) { 
.box-L{  padding: 2% 0;}
.modal-coinImg {    width: 160px;    margin: auto;    display: block;}
.modal-buyInfo{display: block;    width: 95%;    margin: auto;}
.acting-foot-L{ width:95%}
.topUp-card{ font-size:200%;      padding-top: 0;}
.float_icon_box, .float_buyIcon, .float_sendIcon{  width: 95px; }

/*頁籤模組*/
.tabSet .nav-link{line-height: 19px;   padding: 0.3rem 0.6rem;   min-height: 48px; }

.QA_group a{padding: 5px 8px;}
.vip-payIcon{    flex-direction: column;}
.vip-payIcon img{    padding: 0px 5% 10px;}
.player_info_btnIn{        padding: 1px;        font-size: 10pt; letter-spacing:0}
.register_homeBtn{     font-size: 10pt;  margin-left: 10px;     flex: 1 1 0;        height: 38px;      grid-template-columns: 18px 1fr 18px; }
.register_homeBtn_L, .register_homeBtn_R{    background-size: 115px;    height: 38px;    width: 20px;}
.register_homeBtn_M{    background-size: 25px;    height: 38px;}
.player_info_show{margin-top: -5px;}
	}
@media (max-width: 374px) {
/*.box-C .carousel{ margin-bottom:30px}*/
/*左右2區(下載及社群)*/
.load-box ul{  /*  height: 160px;*/}
.media-box{ width:40px}
.topUp-getPoint-txt{scale: 80%;}

.topUp-price-btn .btn{ height:28px}
.topUp-price-btn {    margin-top: 13%;}
.topUp-point{ font-size:8pt}



	}
@media (min-width: 700px) {
.navbar-lan{     top: 65px; }
.btnBar{ margin-top:20px; }

	}

/****首頁彈跳廣告********/
@media (min-width: 992px) {
.modalDiv .modal .modal-lg{    max-width: 1024px;}
}
/* Min-width width 1200px */
@media (min-width: 1200px) {	

.counter {		padding-top: 3rem;		padding-bottom: 1rem;	}
.counter #counter .cell {		margin-right: 2.5rem;		margin-left: 2.5rem;	}	
.counter #counter .counter-value {		font: 700 4.25rem/4.5rem ;		}

.alert-mode .alert{      width: 75%;    font-size: 16px;  margin: auto;    line-height: 22px;     min-width: 200px;}
.alert-mode .alert strong{ font-size:18px}
}
@media (min-width: 1600px) {
body{ font-size:16px}
.box-C{ width:1060px; margin:0 auto 65px}
.navbar-lan{    font-size: 36px; top:100px}
.container{    max-width: 1400px;}
.betInfo p {    line-height: 23px;}
.bet-box h6{    line-height: 28px;    font-size: 1.15rem;}
.counter #counter .cell{margin-right: 3rem;    margin-left: 3rem;}
.level-box{ width:50%}
.topLogo{ width:360px}
.topUp-getPoint{    width: 45%;     right: 8%;   }

.topUp-price-btn{margin-top: 14.5%;}
.acting-foot{ padding-bottom:15px}
.acting-foot-R-info{width: 250px; padding-left:15px}
.acting-foot-R-qr{ width:100px}
.acting-foot-L{ padding: 5px 2%;}
.acting-foot-R {    width: 45%;    margin-left: 5%;}
.acting-foot-R-info a{ width:60%}
 .modal_activityImg .modal-lg{ max-width: 1100px}
}

@media (min-width: 1768px) {
.topUp-group{width: 33%; min-width:33%}
.topUp-point{font-size: 13pt;}
.topUp-getPoint-txt{    scale: 85%;     top: 22%;}
.float_buyIcon, .float_sendIcon{    width: 47%;}
.float_buyIcon_txt, .float_sendIcon_txt{ font-size: 20px}
.float_sendIcon_txt h5{ margin-bottom: 5px;width: 46px;    height: 46px; font-size: 22px}
	}