﻿body, div, p, span, a{font-family: Times New Roman, Arial, Roboto, 微軟正黑體, sans-serif;}a{color: #5b5b5b !important;} a:hover{color:#ff6600!important;}body {-webkit-overflow-scrolling: touch;}
#header {position:fixed;top:0;width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;height: auto;background-color:#fff;background-size: cover;padding: 0 !important;box-shadow: 0px 6px 16px rgba(20%,20%,40%,0.6), 0px 8px 18px rgba(20%,20%,40%,0.4), 0px 10px 12px rgba(20%,20%,40%,0.4);}
.gray{display:flex;align-items:center;justify-content:space-between;width:100%;height:38px;padding:0 20px;background-color: #e6e6e6;}
 .dropdown span,.dropdown a{color: #282828;}.btn-drop{background: transparent;border: none;padding: 0 5px;}#drop_sub{display: none;}
 .gray_right{display: flex;justify-content:space-between;align-items: center;}.gray_right div{margin: 0 5px;}.member_ID{font-weight: bold;font-size:15px;font-family: Arial, Helvetica, Verdana;}
 .member_wallet span{color:#ff6600;}.wallet_word{margin: 0;display: inline-block;}.mail{display: flex;align-items: center;}.mail_dot{background: #ff0000;width: 10px;height: 10px;position: relative;border-radius: 50%;right: 87px;top: -7px;}
 .mail a:hover{color:#ff6600;}
 .btn_gray{background-color: #606060;color: #fff !important;border-radius:5px;padding: 3px 15px;}.btn_gray:hover{background-color:#2d2d2d;color: #fff !important;}
 .btn_orange{background-color: #ff6600;color: #fff !important;border-radius:5px;padding:3px 15px;}.btn_orange:hover{background-color:#c34f01;color: #fff !important;}
 .white_bar{padding:10px 20px;display:flex;align-items:center;justify-content:space-between;width:100%;}
.showselect {display: flex;align-items: center;justify-content: space-between;}.main-menu {color: #5b5b5b;margin:0 20px;padding:8px 0;cursor: pointer;display: inline-block;}.main-menu:hover {color: #ff6600;}
.main-menu:hover>a:after{width: 100%;left: 0;}.main-menu a:after {content: "";position: absolute;right: 0;bottom:-6px;width: 0;border-bottom: 2px solid #ff6600;transition: width .3s;}
.top_title{position: relative; }.sub-menu {width:100%;left:0;top:93px;margin-top: 0px;min-height: 100px;background-color:#fff;opacity:0.9;padding: 0px;list-style-type: none;position: absolute;}
.sub-block{display:flex;align-items:center;justify-content:center;}.game{margin:30px;}
.game:hover>a:after{width: 100%;left: 0;}.game a:after {content: "";position: absolute;right: 0;bottom:-10px;width: 0;border-bottom: 2px solid;transition: width .3s;}
.ad{display: flex;justify-content: space-between;}.ad_inner{margin: 0 15px;}.ad_inner img{transform:scale(1,1);transition: all .3s ease-out;}.ad_inner img:hover{transform:scale(1.08,1.08);}
.man{position: relative;bottom: -5px;}.tool_inner{display:flex;align-items:center;justify-content:space-between;}.tool_inner img{width: 27px;filter: invert(38%) sepia(9%) saturate(0%) hue-rotate(271deg) brightness(85%) contrast(85%);margin:0 5px;}.tool_inner img:hover{filter:unset;}
.modal2 {display: none;position: fixed;z-index: 1;padding-top: 100px;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.95);}
.modal2-content {background-color: transparent;margin: auto;padding: 20px;border: 0;color: #fff;width: 80%;}
.close {color: #909090;position: absolute;right: 0;top: 0;font-size: 46px;font-weight: 100;text-shadow: none;}.close:hover {color: #909090;transition:0.5s;transform: rotatey(180deg);}
#panel > ul {display:flex;align-items:center;justify-content:center;flex-direction: column;list-style: none;}.ul_inner{display: flex;align-items: center;justify-content: space-between;}
.ul_inner li{padding:25px;margin:3px;width: 160px;height: 160px;border: 1px solid rgba(220,220,220,0.4);-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);-webkit-transition: -webkit-transform .2s ease-in-out 0s,background .2s ease-in-out 0s;transition: transform .2s ease-in-out 0s,background .2s ease-in-out 0s;}.ul_inner li:hover{background-color:#bd4d01;opacity:0.8;cursor:pointer;}
#panel > ul > li:before {content: "";display: block;padding-top: 100%;}#panel a{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 100%;}
#panel .front {width: 100%;height: 100%;-webkit-transition: -webkit-transform .55s cubic-bezier(0.190,1.000,0.220,1.000) 0s,opacity .45s ease-in-out 0s;transition: transform .55s cubic-bezier(0.190,1.000,0.220,1.000) 0s,opacity .45s ease-in-out 0s;}.ul_inner li h3{margin:25px 0 10px 0 !important;color:#bdbdbd;font-size: 16px;font-weight:300;}.ul_inner li:hover h3{color:#fff;font-size:18px;}
.content-section4{width:100%;margin:0 auto;display:flex;justify-content:center;background: #f0f0f0;padding:0px 12%;text-align: center;}.help{border-left: 2px solid #e5e5e5;border-right: 2px solid #fff;padding: 30px 40px;text-align: center;}.help img{display: block;margin: 0 auto;padding-bottom: 10px;width: 38px;height: 45px;}.help:hover{color: #ff6600;}.help:hover img{transform:scale(1.1,1.1);}
.content-section5{width:100%;margin:0 auto;background: #7f7f7f;padding:40px 12%;text-align: center;}.content-section5_info{display:flex;justify-content:center;}.foot_more, .foot_word, .foot_view{margin: 0 20px;color:#fff;width: 33%;}.foot_more_col{margin-bottom: 10px;}.foot_more_col a{color:#fff !important;margin: 0 10px;}.foot_more_col a:hover{color:#ff6600 !important;}.content-section5_copyright{color:#fff;margin-top: 10px;}.browser img{margin: 10px;width: 45px;}.foot{}
.section2_inner a:hover .banner_pic{-webkit-filter: contrast(1.3);}.special_inner{padding: 5px 3%;}
.mobile_member > span {color:#fff;font-size:13px;padding: 4px 7px;font-weight: 300;}
.mobile_member > img{position:absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 15px;}
.mobile_member{display:none;position:relative;padding:0;width: 28px;height: 28px;border-radius: 50%;}input:focus{outline:none;border:1px solid #ff6600;}.back2021{display:none;}.back2021 img{width: 27px;margin: 0 5px;}
.tip {
    display: block;
    background: #f00;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    right: 5px;
    top: -2px;
    position: absolute;
}
.tip2 {
    display: block;
    background: #f00;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    right: 5px;
    top: -2px;
    position: absolute;
}
.tip3 {
    display: block;
    background: #f00;
    border-radius: 50%;
    width: 12px;
    height: 12px;
    left: -20px;
    top: 6%;
    position: absolute;
}

.coin_drop_btn{background: #bcbcbc;padding: 3px 6px;}
.coin_inner{display: flex!important;justify-content: space-between;}
.coin_inner span{color:#111;}
.onoffswitch {
	position: relative;
	width: 48px;
	margin: 0 0 0 5px !important;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}
.onoffswitch-checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    height: 20px; padding: 0; line-height: 20px;
    border: 2px solid #E3E3E3; border-radius: 20px;
    background-color: #FFFFFF;
    transition: background-color 0.3s ease-in;margin-bottom: 0;
}
.onoffswitch-label:before {
    content: "";
    display: block; width: 20px; margin: 0px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 26px;
    border: 2px solid #E3E3E3; border-radius: 20px;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
    background-color: #FF6600;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
	border-color: #FF6600;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
    right: 0px;
}

@media only screen and (max-width:770px) {
	.back2021{display:block;}
	.gray{padding:0;}
	#unread{display:none;}
	.wallet_word{display:none;}
	.mail_dot{right:10px;}
	#welcome{display:none;}
	#member_button{display:none;}
	.showselect{display:none;}
	.white_bar{padding:3px 0px;}
	.logo_img {max-height:40px;}
	/*.modal-content {padding: 10px;width: 90%;}*/
	.close{top:-30px;}
	.front img{height:25px;max-width:30px;}
	.ul_inner li {padding:5px;width:100px;height:100px;}
	.ul_inner li h3 {margin: 12px 0 5px 0 !important;font-size:12px;}
	.ul_inner li:hover h3 {font-size:13px;}
	.game_name{font-size:13px;}
	.heart{position:unset;}
	.info_col_bottom{display:none;}
	.content-section4{padding:0px 3%;}
	.help{border-left: 1px solid #e5e5e5;border-right: 1px solid #fff;padding:8px;font-size: 12px;line-height: 18px;}
	.help img{padding-bottom: 8px;width: 22px;height: 28px;}
	.content-section5 {padding: 20px 6%;}
	.content-section5_info {flex-direction: column;}
	.foot_more, .foot_word, .foot_view {margin: 0;width: 100%;margin-bottom: 5px;}
	.browser img{width: 30px;}
	.mobile_member{display: block;}
}
.swal-overlay {z-index: 10000000000 !important;}
#installContainer {
  position: absolute;
  
  top: 0px;
  left: 0px;
  display: flex;
  justify-content: center;
  width: 20%;
  background-color:#2000E0;
}
#installContainer button {
  background-color: inherit;
  border: 1px solid white;
  color: white;
  font-size: 1em;
  padding: 0.75em;
}
.dis-n{display:none;}.dropdown-toggle::after {display:none !important;}



@media (max-width: 580px) {
    .Main_member {
        display: none !important;
    }
}
@media screen and (max-width: 578px) {
    .zalo_color {
        color: #0080cd;
        border: 3px solid #0080cd !important;
    }
}
@media screen and (max-width: 578px) {
    .img-cth {
       
       text-align:center;
    }
        .img-cth > img {
            margin: auto;
            width: 150px !important;
        }
}