@charset "utf-8";
html,body{ width:100%; height:100%;-webkit-text-size-adjust:100%;}
body{ margin:0; padding:0; font-size:14px; }
div,p,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,input,select,textarea,table,td{ margin:0; padding:0;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
area{outline:none;}
img{ border:0;}
ol,ul{list-style:none;}
a{text-decoration:none;outline:none; cursor:pointer;}
a:hover{ text-decoration:none;}
span{outline:none;}
.clearfix:after {content:"";display:block;height:0;clear:both;} 
.clearfix {zoom:1;}

.wrap{ position:relative; width:750px; height:100%; background:url(../images/body_bg.jpg) center top no-repeat #8f6447; overflow-x:hidden; overflow-y:auto;}
/* loading */
.loading_box{ position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(28,28,28,0.68); z-index:101;}
.loading_cont{ position:absolute; width:713px; height:552px; left:18px; top:50%; margin-top:-276px; background:url(../images/loading_cont_bg.png);}
.loading_line_wrap{ position:absolute; width:460px; height:28px; left:122px; top:332px;}
.loading_line_box{ position:absolute; width:390px; height:20px; left:4px; top:4px;}
.loading_w{ position:relative; width:0; height:20px; background:url(../images/loading_line.png) right top no-repeat #ffb80f;}
.loading_w span{ position:absolute; width:100px; height:20px; right:-100px; top:0; font-size:20px; font-weight:bold; line-height:20px; color:#fff;}

.cont{ display:none; position:relative; width:100%; height:100%; min-height:1250px; z-index:2;}
/* guide */
#guide_box{ background:#8f6447;}
#guide1{ display:block;}
.ani_ren{ position:relative; width:750px; height:100%; overflow:hidden;}
.ani_ren img{ display:none; position:absolute; width:100%; left:0; top:0;}
.btn_skip{ position:absolute; width:188px; height:59px; right:44px; top:23px; background:url(../images/btn_skip.png); z-index:5;}
.guide_text_box{ position:absolute; width:713px; height:394px; left:18px; top:94px; background:url(../images/guide_text_bg.png);}
.guide_text_box img{ display:none; position:absolute; left:156px; top:98px;}
.guide_text_box img.guide_text1{ top:158px;}
.guide_text_box img.guide_text2,.guide_text_box img.guide_text3{ top:130px;}
.btn_text_next{ position:absolute; width:48px; height:48px; left:552px; top:258px; background:url(../images/btn_next.png) center center no-repeat;}

#guide2{ background:url(../images/guide_bg.jpg) center top no-repeat;}
.ani_juan,.ani_xie{ position:absolute; width:750px; height:750px; left:0; top:158px;}
.ani_juan img,.ani_xie img{ display:none; position:absolute; width:100%; left:0; top:0;}
.ani_xie{display: none;}
.btn_shou_guide{ display:none;position:absolute; width:232px; height:185px; left:264px; top:892px; background:url(../images/guide_shou.png); z-index:2;}
.guide_yue{ display:none; position:absolute; width:750px; height:100%; left:0; top:0; background:rgba(28,28,28,0.18); z-index:3;}
.yue_cont{ position:absolute; width:713px; height:458px; left:18px; top:325px; background:url(../images/guide_yue.png);}
.yue_cont img{ position:absolute; width: 486px; left: 120px; top: 132px;}
.btn_yue{ position:absolute; width:207px; height:85px; left:256px; top:308px; background: url(../images/btn_yue.png);}
.juan_tip{position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(28,28,28,0.68); z-index:5;}
.juan_tip img{ position:absolute; width:523px; left:155px; top:340px;}
.guide_end{ display:none;position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(28,28,28,0.61); z-index:5;}
.tiange{ position:absolute; width:422px; height: 422px; left:162px; top:204px; background: url(../images/tiange.png);}
.tiange img{position: absolute; width: 280px; left: 80px; top: 68px;}
.get_tip{ position: absolute; width: 576px; left: 68px; top: 712px;}
.btn_start,.btn_close_hao{ position:absolute;width:569px; height:103px; left:50%; margin-left: -285px; top:956px; background: url(../images/btn_start.png);}
/* home */
#home_box{ background:url(../images/home_bg.jpg?1) center top no-repeat #8f6447;}
#btn_audio{ position:absolute; width:73px; height:73px; left:40px; top:45px; background:url(../images/btn_music_off.png); z-index:10;}
#btn_audio.on{ background:url(../images/btn_music_on.png);}
.btn_pop_rule{ position:absolute; width:188px; height:59px; right:28px; top:45px; background:url(../images/btn_pop_rule.png)}
#home_box .btn_pop_rule{ right:145px;}
.btn_logout{ position:absolute; width:109px; height:59px; right:23px; top:45px; background:url(../images/btn_logout.png)}
.note_xiezi{display:none; position:absolute; width:305px; left:423px; top:116px;}
#home_box .nav{ position:absolute; width:218px; height:197px;}
.nav_myzi{ left:149px; top:442px;}
.nav_xiezi{ left:388px; top:442px;}
.nav_prize{ left:149px; top:660px;}
.nav_lottery{ left:388px; top:660px;}
.home_tip{ position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(28,28,28,0.7); z-index:5;}
.home_tip div{ position:absolute; width:644px; height:716px; left:48px; top:403px; background:url(../images/guide_home.png);}
.btn_close_hometip{ position:absolute; width:528px; height:118px; left:60px; top:598px;}
/* xiezi */
#xiezi_box{ background:url(../images/xiezi_bg.jpg) center top no-repeat #77533b;}
.shuxie_wrap{ display: none; position:relative; width:750px; height:688px;  z-index: 2;}
.shuxie_wrap img,.shuxie_wrap #myCanvas{ position: absolute; width:370px; height:388px; left:213px; top:300px;}
.btn_home{ position:absolute; width:188px; height:92px; left:30px; top:35px; background:url(../images/btn_home.png); z-index: 5;}
.last_mo{ position:absolute; width:75px; height:52px; right:0px; top:56px; font-size:50px; line-height:52px; color:#fff;}
.cursor_bi{ display:none; position:absolute; width:152px; left:276px; top:178px; z-index:10;}
.xie_opa_wrap{ position:absolute; width:750px; height: 210px; left: 0;top:910px;}
.btn_xie{ position:absolute; width:130px; height:175px; left:205px; top:0px; background: url(../images/btn_xie.png);}
.btn_pop_share{ position:absolute; width:110px; height:175px; left:418px; top:0px;background: url(../images/btn_pop_share.png);}
.share_num_box{ position:absolute; width:84px; height:30px; left:442px; bottom:0px; font-size:24px; line-height:30px; color:#fff; text-align:center;}
/* myzi */
#myzi_box{ background-color: rgba(8,5,7,0.52);}
.shouji_num{position: absolute;width: 150px; height: 94px; left: 166px; top: 342px; font-size: 32px; line-height: 48px;font-weight: bold; color: #171717; text-align: center; z-index: 5;}
#btn_duihuan,.btn_duihuan_none{position: absolute; width: 149px; height: 56px;left: 166px; top: 483px;background: url(../images/btn_duihuan_none.png); z-index: 5;}
.btn_duihuan_none{ z-index: 6;}
#btn_duihuan.on{background: url(../images/btn_duihuan_on.png); }
#btn_duihuan.done{background: url(../images/btn_duihuan_done.png); }
.shu_box{ position: absolute; width: 750px; height: 900px; left: 0; top: 167px;}
.font_list{position: relative; width: 100%; height: 100%; overflow: hidden;}
.font_list li{ display: none; position: absolute; width: 100%;height: 100%; left: 0; top: 0;}
#font1{ background: url(../images/si/xu1/1.png);}
#font1.on{ background: url(../images/si/shi1/1.png);}
#font2{ background: url(../images/si/xu2/1.png);}
#font2.on{ background: url(../images/si/shi2/1.png);}
#font3{ background: url(../images/si/xu3/1.png);}
#font3.on{ background: url(../images/si/shi3/1.png);}
#font4{ background: url(../images/si/xu4/1.png);}
#font4.on{ background: url(../images/si/shi4/1.png);}
#font5{ background: url(../images/si/xu5/1.png);}
#font5.on{ background: url(../images/si/shi5/1.png);}
#font6{ background: url(../images/si/xu6/1.png);}
#font6.on{ background: url(../images/si/shi6/1.png);}
#font7{ background: url(../images/si/xu7/1.png);}
#font7.on{ background: url(../images/si/shi7/1.png);}
.font_list li .item_num{ position: absolute; width: 38px; height: 38px; right: 80px; top: 118px; font-size: 36px; line-height: 38px; color: #fff; text-align: center; background-color: #fd1718; border-radius: 38px;}
.btn_next_page{position: absolute; width: 149px; height: 40px;left: 513px; top: 408px;background: url(../images/btn_next_page.png);}
.ani_si,.ani_si img{ display: none;position: absolute; width: 100%;height: 100%; left: 0; top: 0;}
.ani_si{ z-index: 10;}

.btn_font_send,.btn_font_beg{position: absolute; width: 207px; height: 85px; top: 718px;}
.btn_font_send{ left: 154px;background: url(../images/btn_zs.png);}
.btn_font_beg{ right: 154px;background: url(../images/btn_ty.png);}
/* lottery */
#lottery_box{ background:url(../images/lottery_bg.jpg) center top no-repeat #8f6447;}
.lottery_black{ position: relative; width: 100%; height: 100%; background-color: rgba(8,5,7,0.52);}
.btn_baoxiang{position: absolute; width: 74px; height: 82px;right: 32px; top: 122px;background: url(../images/btn_baoxiang.png);}
.lottery_cont{position: absolute; width: 498px; height: 859px;left: 115px; top: 228px;background: url(../images/lottery_cont_bg.png);}
.lottery_tip_no,.lottery_tip_yes{ position: absolute; width:305px; left: 315px; top: 193px;}
.lottery_tip_no{ display: none;}
.btn_lottery_prev,.btn_lottery_next{position: absolute; width: 50px; height: 72px; top: 547px; z-index: 3;}
.btn_lottery_prev{ left: 0;}
.btn_lottery_next{ right: 0;}
.lingdang_list{ position: absolute; width: 368px; height: 313px; left: 76px; top: 475px;}
.lingdang_list li{ position: absolute; width: 156px; height: 313px; top: 0; background: url(../images/lingdang.png);}
.lingdang_list li.on{ background: url(../images/lingdang_on.png); z-index: 2;}
#ling1{ left: 0;}
#ling2{ left: 105px;}
#ling3{ right: 0;}
.ani_yao{animation: key_yao 1s linear; -webkit-animation: key_yao 1s linear; transform-origin: center 44px;-webkit-transform-origin: center 44px;}
@keyframes key_yao{
    0%{transform: rotate(0deg);}
    25%{transform: rotate(-3deg);}
    50%{transform: rotate(0deg);}
    75%{transform: rotate(3deg);}
    100%{transform: rotate(0deg);}
}
@-webkit-keyframes key_yao{
    0%{-webkit-transform: rotate(0deg);}
    25%{-webkit-transform: rotate(-3deg);}
    50%{-webkit-transform: rotate(0deg);}
    75%{-webkit-transform: rotate(3deg);}
    100%{-webkit-transform: rotate(0deg);}
}
/* prize */
#prize_box{ background:url(../images/prize_bg.jpg) center top no-repeat #8f6447;}
.prize_list{ position: absolute; display: flex;  width: 544px; height: 215px; left: 108px; top: 452px; justify-content: center;}
.prize_list li{ position: relative; width: 250px; height: 215px;}
.prize_list li img{ position: absolute; width: 236px; left: 50%; margin-left: -118px; bottom: 34px;}
#prize_list_change{ top: 667px;}
.prize_list li.prize_change{ width: 315px;}
.prize_list li.prize_change img{ width: 315px; margin-left: -157px; }
.prize_list li.prize_change a{position: absolute; width: 189px; height: 38px; left: 50%; margin-left: -95px; bottom: 2px; background: url(../images/btn_link_more.png)}
.btn_check_code{position: absolute; width: 137px; height: 38px; left: 50%; margin-left: -68px; bottom: 2px; background: url(../images/btn_check_code.png)}
.btn_pop_address{display: none; position: absolute; width: 290px; height: 85px; left: 50%; margin-left: -145px; top: 913px; background: url(../images/btn_pop_address.png)}
/* pop_rule */
.pop_fixed{ display:none; position:fixed; width:750px; height:100%; left:0; top:0; background-color:rgba(28,28,28,0.51); z-index:100;}
.pop_rule_cont{ position:absolute; width:713px; height:821px; left:18px; top:50%; margin-top:-410px; background:url(../images/pop_rule_bg.png);}
.icon_close{ position:absolute; width:78px; height:78px; right:85px; top:-5px; background:url(../images/icon_close.png); z-index: 5;}
.cus_scroll{ overflow-x:hidden; overflow-y:auto;}
.cus_scroll::-webkit-scrollbar{ width:8px; background:url(../images/scroll_line.png) center top repeat-y;}
.cus_scroll::-webkit-scrollbar-thumb{ width:8px; background-color:#ffffff;}
.pop_rule_t{ height: 32px; padding-top: 90px; font-size: 30px; font-weight: bold; color: #fff; text-align: center;}
.rule_scroll{ width:560px; height:590px; margin:25px 0 0 100px}
.rule_scroll div{ padding-top: 10px;}
.rule_scroll div,.rule_scroll p{ width: 513px; max-height:2000px; font-size:26px; line-height:38px; color:#fff;}
.rule_scroll div a,.rule_scroll p a{ color: #fff; text-decoration: underline;}
.color_yellow{ color:#fceeb5;}
.rule_table{ width:513px; margin-top:10px;border-collapse:collapse; border-spacing:0; border-color:#fff;}
.rule_table th,.rule_table td{ max-height:100px; padding:10px 0; line-height:24px; text-align:center;}
.rule_table th{ font-size:22px;color:#fceeb5;}
.rule_table td{ font-size:20px;color:#fff;}
/* pop_get */
.btn_close_hao{width:276px; margin-left: -138px; background: url(../images/btn_close_hao.png);}
/* pop_share */
.pop_msg_cont{position:absolute; width:713px; height:458px; left:18px; top:50%; margin-top: -229px; background:url(../images/guide_yue.png);}
.text_share{ position: absolute; width: 437px; left: 50%; margin-left: -218px; top: 148px;}
.text_succ_mo{ position: absolute; width: 432px; left: 50%; margin-left: -216px; top: 180px;}
.btn_copy,.btn_close_hao2{ position: absolute; width: 321px; height: 85px;left: 50%; margin-left: -160px; top: 306px; background: url(../images/btn_copy_share.png); cursor: pointer;}
.btn_close_hao2{ width: 207px; margin-left: -103px; background: url(../images/btn_close_hao2.png);}
/* pop_msg */
#pop_msg{ z-index: 200;}
#msg{ display: flex; width: 510px; height: 166px; margin: 128px auto 0; align-items: center;justify-content: center; text-align: center;}
#msg p{ font-size: 42px; line-height: 56px; color: #fff;}
/* pop_share_font */
.text_share_font{ display: none; position: absolute; left: 50%; top: 110px;}
#text_font_send{ width: 487px; margin-left: -243px;}
#text_font_beg{width: 449px; margin-left: -225px;}
/* pop_lottery */
.text_lottery_fail{ position: absolute; width: 461px; left: 50%; margin-left: -230px; top: 126px;}
.pop_lottery_succ_cont{position:absolute; width:713px; height:640px; left:18px; top:50%; margin-top: -320px; background:url(../images/pop_lottery_succ_bg.png);}
.text_lottery_succ{ position: absolute; width: 500px; left: 50%; margin-left: -250px; top: 76px;}
.lottery_succ_img{ position: absolute; width: 236px;left: 50%; margin-left: -118px; top: 158px;}
#pop_lottery_succ .btn_close_hao2{ top: 478px;}
/* pop_address */
.pop_address_cont{position:absolute; width:713px; height:697px; left:18px; top:50%; margin-top: -399px; background:url(../images/pop_address_bg.png);}
.form_address_box{ position: relative; width: 491px; height: 393px; margin: 58px auto 0; background: url(../images/form_address_bg.png);}
.form_address_box input{ position: absolute; width: 458px; height: 58px; right: 10px; font-size: 28px; line-height: 58px; background: none; border:0; outline: 0;}
#truename{ top: 67px;}
#phone{ top: 198px;}
#address{ top: 335px;}
.btn_sub_address{ display: block;width: 321px; height: 85px; margin: 30px auto 0; background: url(../images/btn_sub_address.png);}
.address_tip{ height: 60px; max-height: 60px; padding-top: 10px; font-size: 24px; line-height: 30px; color: #fff; text-align: center;}
/* pop_code */
.form_code_box{ position: relative; width: 478px; height: 154px; margin: 200px auto 0; background: url(../images/form_code_bg.png);}
.prize_code{position: absolute; width: 478px; height: 58px; left: 0px; bottom: 0; font-size: 36px; line-height: 56px; text-align: center;}
#btn_copy_code{display: block;width: 321px; height: 85px; margin: 120px auto 0; background: url(../images/btn_copy_code.png);}
/* pop_friend */
.friend_send_cont,.friend_beg_cont{ position: relative; width: 560px; height: 226px; margin: 77px auto 0;}
.friend_send_cont{ background: url(../images/friend_sed_bg.png) 0 0  no-repeat;}
.friend_beg_cont{ background: url(../images/friend_beg_bg.png) 0 0  no-repeat;}
.friend_name,.friend_font{ position: absolute; width: 464px; height: 40px; left: 47px; top: 61px; font-size: 32px; line-height: 40px; color: #fff; text-align: center;}
.friend_font{ width: 148px;  left: 398px; top: 116px;}
.friend_btn_wrap{ display: flex; height: 85px; justify-content: center;}
.friend_btn_wrap span{ display: block; width: 207px; height: 85px; margin: 0 8px;}
.btn_conform{ background: url(../images/btn_conform.png);}
.btn_cancel{ background: url(../images/btn_cancel.png);}
/* pop_ewm */
#pop_ewm{ z-index: 101;}
.ewm_dl{ display: block; width: 404px; margin: 120px auto 0;}
.ewm_tip{ display: block; width: 396px; margin: 10px auto 0;}

@-webkit-keyframes bounceInDown{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;transform:none}}
@keyframes bounceInDown{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);-ms-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);-ms-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);-ms-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);-ms-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}
.bounceInDown{-webkit-animation:bounceInDown 0.5s;animation:bounceInDown 0.5s}