@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
/*basic*/
body, div, h1, h2, h3, h4, h5, h6, p, blockquote, dl, dt, dd, ul, ol, li, fieldset, form, tr, th, td, center, input, button, textarea { padding: 0; margin: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
button, input, select, textarea { font: 14px/1.8 "Roboto", sans-serif; }
li { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
body { background: #070618; color: #f0ecec; font: 14px/1.8 "Roboto", sans-serif; /*font: 14px/1.8 "Roboto", sans-serif;*/ }

.fl { float: left; }
.fr { float: right; }
.t_hide { height: 0; overflow: hidden; }
.mt10 { margin-top: 10px; }
.t_center { text-align: center; }
.t_left { text-align: left; }
.t_right { text-align: right; }
.p_relative { position: relative; }
.clearfix:after { content: ""; height: 0; visibility: hidden; display: block; clear: both; }
.clearfix { zoom: 1; }
.clear { clear: both; }
a { color: #fff; text-decoration: none; }
a, a:active { outline: none; }
.hidden { visibility: hidden; }
.pd-common1 { padding: 30px 0; }
.pd-common2 { padding: 40px 0; }
.pd-common3 { padding-bottom: 20px; }
.mt-common1 { margin-top: 30px; }

/*share*/
.sharethis { width: 100%; height: 30px; padding: 0; padding-bottom: 3px; line-height: 30px; text-align: center; background: #fefced; overflow: hidden; }
.sharethis a { color: #88878c; line-height: 30px; }
.sharethis img { vertical-align: middle; }

/*nav*/
.nav { position: relative; z-index: 2; width: 990px; height: 40px; margin: 0 auto; }
.nav li { position: relative; float: left; width: 90px; text-align: center; }
.nav li a { display: block; width: 90px; height: 40px; margin: 0 auto; line-height: 40px; color: #fcf8f3; font-weight: bold; }
.nav li a:hover, .nav li.on a { text-decoration: none; background: #e49804; }
.subnav { display: none; position: absolute; left: 0px; top: 40px; background: #cca847; background: rgba(204,168,71,.9); filter:alpha(opacity=90); white-space: nowrap; }
.subnav li { float: none; width: auto; padding: 0 5px; transition: all 0.2s ease-in-out 0s; }
.subnav li a { width: auto; height: 34px; line-height: 34px; border: none; font-weight: normal; font-family: "Roboto", sans-serif; overflow: visible; }
.subnav li a:hover, .subnav li.on a, .nav li.on li a { background: none; color: #fff;}
.nav li.on li a:hover{ color: #021027; }
.subnav li:hover { background: #e49804; background: rgba(228,152,4,.9); filter:alpha(opacity=90);}

/*main*/
.fullbg { position: relative; width: 100%; max-width: 1920px; min-width: 1002px; height: 1250px; margin: 0 auto; background: url(../images/fullbg.jpg) no-repeat center top; overflow: hidden; }
.wrapper { position: relative; width: 1002px; margin: 0 auto; }
.header { height: 300px; }
a.logo { position: absolute; top: 67px; left: 290px; display: block; width: 340px; height: 70px; }

.steps { padding-left: 300px; }
.steps a { display: block; float: left; width: 223px; height: 65px; background: url(../images/btns.png) no-repeat; }
.steps a.step1 { background-position: 0 -3px; }
.steps a.step2 { background-position: -227px -3px; }
.steps a.step3 { background-position: -454px -3px; }
.steps a.step1:hover { background-position: 0 -78px; }
.steps a.step2:hover { background-position: -227px -78px; }
.steps a.step3:hover { background-position: -454px -78px; }

.panel { height: 510px; }

.liveshow { position: relative; height: 400px; padding: 20px 0 0 0; }
.liveshow iframe { margin: 0 5px; }

.videomask { position: absolute; top: 14px; left: -2px; z-index: 4; width: 1000px; height: 400px; background: url(../images/videomask.png?v1) no-repeat center top; }
.videomask .rule { position: absolute; left: 545px; top: 110px; line-height: 24px; }
.videomask .rule strong{ color: #fae065; }

.errormask { display: none; position: absolute; top: 14px; left: -2px; z-index: 5; width: 1000px; height: 400px; background: #000; background: url(../images/errormask.png) no-repeat center top; }
.errormask p { width: 460px; padding-left: 450px; padding-top: 130px; font-size: 16px; }

.timeleft { width: 100%; height: 88px; }
.countdowntime { width: 585px; height: 42px; padding-left: 29px; padding-top: 46px; margin: 0 auto; color: #e90000; font-size: 26px; text-align: center; background: url(../images/countdownbg.png) no-repeat 0 0; }
.timeleft span, .timeleft em { display: block; float: left; }
.timeleft em { width: 28px; padding: 0 3px; font-style: normal; height: 38px; line-height: 38px; }
.timeleft span { padding-right: 66px; }
.timeleft span.s2 { padding-right: 82px; }
.timeleft span.s3 { padding-right: 65px; }

.btntxt { width: 360px; position: absolute; left: 540px; top: 280px; color: #000; }
.btntxt a { display: block; float: right; width: 109px; height: 33px; line-height: 33px; font-size: 18px; color: #f9e180; background: url(../images/btns.png) no-repeat 0 -186px; text-align: center; margin-top: 14px; }
.btntxt a:hover { background-position: -114px -186px; }
.btntxt span { display: block; float: left; width: 240px; line-height: 20px; }

.male, .female { position: absolute; top: 90px; width: 174px; height: 215px; cursor: pointer; }
.female { left: 117px; }
.male { left: 306px; }

.male span, .female span { display: none; width: 230px; height: 205px; padding: 5px 10px; background: #000; background: rgba(0,0,0,.8); filter: alpha(opacity=80); border-radius: 8px; font-size: 14px; line-height: 18px; border: 2px solid #eddb86; }
.male span { position: absolute; left: -250px; }
.female span { position: absolute; left: 174px; }
.male:hover span { display: block; }
.female:hover span { display: block; }


.rewardintro { position: relative; height: 280px; }
.rewardintro ul { position: absolute; left: 334px; top: 150px; }
.rewardintro li { position: relative; float: left; width: 105px; height: 63px; margin: 0 7px; cursor: pointer; }
.rewardintro li p { position: absolute; left: 30px; bottom: 40px; display: none; width: 190px; padding: 5px; border-radius: 5px; border: 1px solid #845712; background: #000; background: rgba(0,0,0,.6); filter: alpha(opacity=60); font-size: 12px; line-height: 16px; }
.rewardintro li p strong { color: red; }
.rewardintro li:hover p { display: block; }

a.sharebtn { display: block; position: absolute; left: 86px; top: 12px; width: 170px; }
a.sharebtn img { width: 100%; }


.switch_lang { position: absolute; top: 50px; right: 60px; width: 80px; border: 1px solid #d3ab53; border-radius: 5px; }
.switch_lang a { display: block; float: left; width: 40px; height: 26px; line-height: 26px; text-align: center; text-decoration: none; color: #d3ab53; }
.switch_lang a.on, .switch_lang a:hover { background: url(../images/btns.png) no-repeat -20px -28px; color: #000; }


/*footer*/
.footer{ width: 100%; padding: 20px 0; position: relative; }
.footer table{ width: 100%; color: #fff;  margin: 0 auto;}
.footer table a{ margin: 0 5px; color: #fff; }
.footer table a:hover{text-decoration: underline;}


.msg_form_class { display:none; /*FF IE7 该值为本身高的一半*/ margin-top:0px; position:fixed!important; position:absolute;/*IE6*/ _top: expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/ document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/}
.msg_form_class{z-index:1114; left:50%; top:42%; margin-left:-224px!important;}
.mask{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.4; filter: alpha(opacity=40); z-index: 1112;}

.commonbox { left:50%; margin-top: -60px!important; /*IE6*/ _top: expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/ document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/ }
.tipbox{position: relative; z-index: 1113; color: #fff; background: #543b85; border: 4px solid #8468bc; }
.box1{width: 440px;}
.box1pst { margin-left: -224px!important; }
.box2{width: 680px;}
.box2pst { margin-left: -344px!important; }
.box3{width: 460px;}
.box3pst { margin-left: -234px!important; }
.box4{width: 800px;}
.box4pst { margin-left: -404px!important; }

.tip_t{height: 50px; text-align: center;}
.tip_t a.close{ position: absolute; top: 5px; right: 5px; display: block; width: 30px; height: 30px; color: #fff; line-height: 24px; text-align: center; font-size: 32px; border: 3px solid #fff; border-radius: 18px; }
.tip_t a.close:hover{color: #8468bc; border-color: #8468bc; }
.tip_c{font-family: "Roboto", sans-serif;}
.tip_con{width: 88%; margin: 0 auto; padding: 20px 0 5px 0; position: relative;}
.tip_con.sp{width: 96%;}
.tip_con p{ font-size: 20px; line-height: 26px; padding: 6px 0; }
.tip_con table{width: 100%; margin: 0 auto;}
.tip_con table td, .tip_con table th{text-align: center; border: 1px solid #022643; line-height: 18px;}
.tip_con form ul{padding: 0 20px;}
.tip_con form ul li{padding: 3px;}
.tip_con form label{font-size: 16px; text-transform: capitalize; width: 90px; display: inline-block; text-align: right;}
.tip_con form input.ipt{ *border:none; border: 1px solid #3c382d; height: 26px; width: 200px; background: #e9e9e9;}
.tip_con form input.code{width: 120px;}
.tip_con form select.slt{border:none; border: 1px solid #3c382d; background: #e9e9e9; height: 26px; width: 200px;}
.tip_con input.codebox { width: 100%; height: 34px; line-height: 34px; background: #664899; border: 1px solid #ab84f4; border-radius: 5px; color: #fff; }
.tip_db{padding-bottom: 10px; text-align: center;}
.tip_db ul{margin: 0 auto; width: 346px;}
.tip_db li{float: left; width: 153px; margin: 0 10px;}
.tip_db p{padding-bottom: 5px; }
.tip_db p a{color: #0092ef; font-family: "Roboto", sans-serif;}
.tip_db p a:hover{text-decoration: underline;}
.tip_db a.btn_tip{ display: block; color: #fff; background: url(../images/btns.png) no-repeat 0 -319px; width: 163px; height: 43px; line-height: 43px; margin: 10px auto; font-size: 20px; text-transform: uppercase; }
.tip_db a.btn_tip:hover{ background-position: -176px -319px;}
.tip_t h2{color: #0092ef; height: 50px; line-height: 50px; width: 96%; margin: 0 auto; font-size: 30px; text-align: center; font-family: 'benguiat_bk_btbold', "Roboto", sans-serif;}
.tip_con textarea{font-family: "Roboto", sans-serif; font-size: 14px; width: 100%; height:160px; background: #e9e9e9; color: #000; border: none; }
.tip_t h2.sp{font-size: 20px; font-weight: normal;}
.tip_con span{color: red;}


.loading{width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    line-height: 56px;
    color: #fff;
    padding-left: 60px;
    font-size: 15px;
    background: #000 url(../images/loader.gif) no-repeat 45% 50%;
    opacity: 0.7;
    z-index: 10000;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}