body{background: #fff;}

.stage{height: 100%;-webkit-transform:translate3d(0,0,0);}
.stage.in{-webkit-animation: fadeIn 0.5s 1 ease-in-out;}
.stage.out{-webkit-animation: fadeOut 0.5s 1 ease-in-out;}

#main_container{position: relative;}

#main.fix{min-height: initial;}
#main{-webkit-transform-origin: 0 0;}
/*MAIN START*/
#main{width: 750px; min-height: 1448px;}
/*MAIN END*/
/*.start_tips START*/
.start_tips{}
.start_tips .pic{position: absolute; width: 578px; height: 882px; top: 120px; left: 75px; background: url(../images/start_tips_pic_5.png); }
.start_tips .title{position: absolute; width: 474px; top: 160px; left: 128px; color: RGB(229,210,120); font-size: 32px; line-height: 42px; text-align: center; }
.start_tips .help_txt{position: absolute; width: 578px; top: 223px; left: 0; right: 0; margin: 0 auto; text-align: center; color: RGB(255,255,255); font-size: 22px; line-height: 22px; }
/*.start_tips .page1 START*/
.start_tips .page{position: absolute; width: 509px; height: 469px; top: 310px; left: 0; right: 0; margin: 0 auto; display: -webkit-flex; -webkit-flex-direction: row; -webkit-flex-wrap: wrap; -webkit-justify-content: flex-start; }
.start_tips .page.hide{display: none; }
.start_tips .page .prize{position: relative; width: 143px; height: 143px; margin: 6px 12px; }
.start_tips .page .prize .prize_bg{position: absolute; width: 143px; height: 143px; top: 0px; left: 0px; background: url(../images/start_tips_page1_prize1_prize_bg_8.png); }
.start_tips .page .prize .name_txt{position: absolute; width: 130px; bottom: 8px; left: 0; right: 0; margin: 0 auto; text-align: center; color: RGB(255,255,255); font-size: 18px; line-height: 20px; }
.start_tips .page .prize .icon{position: absolute; }
.start_tips .page_button_1{position: absolute; width: 34px; height: 34px; top: 812px; left: 322px; background: url(../images/stage2_page_button_69.png); color: #d23f29; text-align: center; line-height: 34px; font-weight: bold; }
.start_tips .page_button_1.current{background: url(../images/stage2_page_button_current_99.png); color: #fff; text-align: center; line-height: 34px; font-weight: bold; }
.start_tips .page_button_2{position: absolute; width: 34px; height: 34px; top: 812px; left: 386px; background: url(../images/stage2_page_button_69.png); color: #d23f29; text-align: center; line-height: 34px; font-weight: bold; }
.start_tips .page_button_2.current{background: url(../images/stage2_page_button_current_99.png); color: #fff; text-align: center; line-height: 34px; font-weight: bold; }
.start_tips .close_button{position: absolute; width: 232px; height: 70px; top: 883px; left: 248px; background: url(../images/start_tips_close_button_59.png); }
/*.how_tips START*/
.how_tips{}
.how_tips .pic{position: absolute; width: 578px; height: 652px; top: 224px; left: 75px; background: url(../images/how_tips_pic_38.png); }
.how_tips .title{position: absolute; width: 254px; top: 264px; left: 238px; color: RGB(229,210,120); font-size: 32px; line-height: 40px; text-align: center; }
.how_tips .txt{position: absolute; width: 520px; top: 334px; left: 114px; color: RGB(255,255,255); font-size: 22px; line-height: 30px; }
.how_tips .txt p{margin-bottom: 10px; }
.how_tips .close_button{position: absolute; width: 40px; height: 40px; top: 224px; left: 654px; background: url(../images/how_tips_close_button_58.png); }
.how_tips .stage3_button{position: absolute; width: 232px; height: 70px; top: 768px; left: 248px; background: url(../images/how_tips_stage3_button_13.png); }
/*.prize_tips START*/
.prize_tips{}
.prize_tips .pic{position: absolute; width: 578px; height: 482px; top: 326px; left: 75px; background: url(../images/prize_tips_pic_46.png); }
.prize_tips .txt{position: absolute; width: 392px; top: 442px; left: 168px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
.prize_tips .title{position: absolute; width: 127px; top: 371px; left: 301px; color: RGB(229,210,120); font-size: 32px; line-height: 32px; }
.prize_tips .close_button{position: absolute; width: 40px; height: 40px; top: 326px; left: 654px; background: url(../images/how_tips_close_button_58.png); }
/*.role_tips START*/
.role_tips{}
.role_tips .pic{position: absolute; width: 628px; height: 872px; top: 73px; left: 45px; background: url(../images/role_tips_pic_98.png); }
.role_tips .title{position: absolute; width: 238px; top: 112px; left: 245px; color: RGB(229,210,120); font-size: 32px; line-height: 42px; text-align: center; }
.role_tips .role_txt{position: absolute; width: 557px; top: 176px; left: 86px; color: RGB(255,255,255); font-size: 24px; line-height: 32px; }
.role_tips .role_txt p{margin-bottom: 20px; }
.role_tips .close_button{position: absolute; width: 40px; height: 40px; top: 73px; left: 673px; background: url(../images/how_tips_close_button_58.png); }
/*.id_tips START*/
.id_tips{}
.id_tips .pic{position: absolute; width: 528px; height: 260px; top: 450px; left: 125px; background: url(../images/id_tips_pic_74.png); display: -webkit-flex; -webkit-flex-direction: row; -webkit-justify-content: space-around; -webkit-align-items: center; }
.id_tips .txt{position: relative; width: 470px; color: RGB(255,255,255); font-size: 24px; line-height: 32px; }
.id_tips .close_button{position: absolute; width: 40px; height: 40px; top: 450px; left: 654px; background: url(../images/how_tips_close_button_58.png); }
/*.error_tips START*/
.error_tips{}
.error_tips .pic{position: absolute; width: 528px; height: 146px; top: 430px; left: 125px; background: url(../images/id_tips_pic_74.png); display: -webkit-flex; -webkit-flex-direction: row; -webkit-justify-content: space-around; -webkit-align-items: center; padding-bottom: 114px; }
.error_tips .txt{position: relative; width: 470px; color: RGB(255,255,255); font-size: 24px; line-height: 32px; text-align: center; }
.error_tips .stage3_button{position: absolute; width: 232px; height: 70px; top: 578px; left: 273px; background: url(../images/error_tips_stage3_button_88.png); }
.error_tips .close_button{position: absolute; width: 40px; height: 40px; top: 430px; left: 654px; background: url(../images/how_tips_close_button_58.png); }
/*.help_tips START*/
.help_tips{}
.help_tips .pic{position: absolute; width: 528px; height: 260px; top: 431px; left: 125px; background: url(../images/id_tips_pic_74.png); }
.help_tips .stage2_button{position: absolute; width: 232px; height: 70px; top: 579px; left: 273px; background: url(../images/error_tips_stage3_button_88.png); }
.help_tips .close_button{position: absolute; width: 40px; height: 40px; top: 431px; left: 654px; background: url(../images/help_tips_close_button_97.png); }
.help_tips .title{position: absolute; width: 528px; top: 460px; left: 26px; right: 0; margin: 0 auto; text-align: center; color: RGB(229,210,120); font-size: 32px; }
.help_tips .txt{position: absolute; width: 470px; top: 510px; left: 26px; right: 0; margin: 0 auto; text-align: center; color: RGB(229,210,120); font-size: 24px; line-height: 32px; }
/*.detail_tips START*/
.detail_tips{}
.detail_tips .pic{position: absolute; width: 528px; height: 260px; top: 385px; left: 114px; background: url(../images/detail_tips_pic_76.png); display: -webkit-flex; -webkit-flex-direction: row; -webkit-justify-content: space-around; -webkit-align-items: center; }
.detail_tips .txt{position: relative; width: 460px; color: RGB(255,255,255); font-size: 24px; line-height: 36px; }
.detail_tips .close_button{position: absolute; width: 40px; height: 40px; top: 385px; left: 643px; background: url(../images/help_tips_close_button_97.png); }
/*.stage2 START*/
.stage2{}
.stage2 .bg{position: absolute; width: 750px; height: 1448px; top: 0px; left: 0px; background: url(../images/stage2_bg_85.png); }
.stage2 .role_txt{position: absolute; width: 650px; top: 216px; left: 0; right: 0; margin: 0 auto; color: RGB(153,53,34); font-size: 27px; line-height: 36px; text-align: center; }
/*.stage2 .title2 START*/
.stage2 .title2{position: absolute; width: 650px; height: 82px; top: 363px; left: 0; right: 0; margin: 0 auto;}
.stage2 .title2 .title_pic{position: absolute; width: 263px; height: 49px; top: 0px; left: 0; right: 0; margin: 0 auto; background: url(../images/stage2_title2_title_pic_85.png); }
.stage2 .title2 .title_txt2{position: absolute; width: 650px; top: 61px; left: 0; right: 0; margin: 0 auto; text-align: center; color: RGB(146,45,14); font-size: 20px; }
.stage2 .title1{position: absolute; width: 452px; height: 90px; top: 116px; left: 149px; background: url(../images/stage2_title1_98.png); }
/*.stage2 .page1 START*/
.stage2 .page{position: absolute; width: 509px; height: 469px; top: 462px; left: 0; right: 0; margin: 0 auto; display: -webkit-flex; -webkit-flex-direction: row; -webkit-flex-wrap: wrap; -webkit-justify-content: flex-start; }
.stage2 .page.hide{display: none; }
.stage2 .page .prize{position: relative; width: 143px; height: 143px; margin: 6px 12px; }
.stage2 .page .prize .prize_bg{position: absolute; width: 143px; height: 143px; top: 0px; left: 0px; background: url(../images/start_tips_page1_prize1_prize_bg_8.png); }
.stage2 .page .prize .name_txt{position: absolute; width: 130px; bottom: 8px; left: 0; right: 0; margin: 0 auto; text-align: center; color: RGB(255,255,255); font-size: 18px; line-height: 20px; }
.stage2 .page .prize .icon{position: absolute; }
.stage2 .right_button{position: absolute; width: 22px; height: 38px; top: 678px; left: 678px; background: url(../images/stage2_right_button_1.png); }
.stage2 .left_button{position: absolute; width: 22px; height: 38px; top: 678px; left: 63px; background: url(../images/stage2_right_button_1.png); }
.stage2 .page_button_1{position: absolute; width: 34px; height: 34px; top: 947px; left: 338px; background: url(../images/stage2_page_button_69.png); color: #d23f29; text-align: center; line-height: 34px; font-weight: bold; }
.stage2 .page_button_1.current{background: url(../images/stage2_page_button_current_99.png); color: #fff; text-align: center; line-height: 34px; font-weight: bold; }
.stage2 .page_button_2{position: absolute; width: 34px; height: 34px; top: 947px; left: 391px; background: url(../images/stage2_page_button_69.png); color: #d23f29; text-align: center; line-height: 34px; font-weight: bold; }
.stage2 .page_button_2.current{background: url(../images/stage2_page_button_current_99.png); color: #fff; text-align: center; line-height: 34px; font-weight: bold; }
.stage2 .logo{position: absolute; width: 273px; height: 104px; top: 0px; left: 16px; background: url(../images/stage2_logo_97.png); }
.stage2 .link_button{position: absolute; width: 252px; height: 80px; top: 1009px; left: 249px; background: url(../images/stage2_link_button_53.png); }
/*.stage1 START*/
.stage1{}
.stage1 .bg{position: absolute; width: 750px; height: 1448px; top: 0px; left: 0px; background: url(../images/stage1_bg_57.png); }
.stage1 .item{position: absolute; width: 145px; height: 102px; top: 279px; left: 15px; background: url(../images/stage1_item_50.png); }
/*.stage1 .user_mc START*/
.stage1 .user_mc{position: absolute; width: 396px; height: 91px; top: 367px; left: 179px;}
.stage1 .user_mc .face{position: absolute; width: 91px; height: 91px; top: 0px; left: 0px; -webkit-border-radius: 50%; }
.stage1 .user_mc .name_txt{position: absolute; width: 360px; top: 30px; left: 111px; color: RGB(153,52,32); font-size: 24px; line-height: 32px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/*.stage1 .prize_mc START*/
.stage1 .prize_mc{position: absolute; width: 617px; height: 113px; top: 769px; left: 67px;}
.stage1 .prize_mc .today_txt{position: absolute; width: 200px; top: 4px; left: 133px; color: RGB(56,25,21); font-size: 24px; white-space: nowrap; text-align: left; }
.stage1 .prize_mc .today_res{position: absolute; width: 200px; top: 44px; left: 133px; color: RGB(196,0,0); font-size: 22px; white-space: nowrap; text-align: left; }
.stage1 .prize_mc .total_txt{position: absolute; width: 109px; top: 4px; left: 360px; color: RGB(56,25,21); font-size: 24px; white-space: nowrap; text-align: left; }
.stage1 .prize_mc .total_res{position: absolute; width: 58px; top: 44px; left: 360px; color: RGB(196,0,0); font-size: 22px; white-space: nowrap; text-align: left; }
.stage1 .prize_mc .help_txt{position: absolute; width: 486px; top: 87px; left: 131px; color: RGB(56,25,21); font-size: 22px; white-space: nowrap; }
.stage1 .prize_mc .how_tips_button{position: absolute; width: 113px; height: 113px; top: 0px; left: 0px; background: url(../images/stage1_prize_mc_how_tips_button_75.png); }
.stage1 .time_txt{position: absolute; width: 400px; top: 1020px; left: 0; right: 0; margin: 0 auto; text-align: center; color: RGB(145,31,12); font-size: 18px; line-height: 18px; }
.stage1 .title{position: absolute; width: 263px; height: 49px; top: 578px; left: 244px; background: url(../images/stage1_title_57.png); }
/*.stage1 .line_mc START*/
.stage1 .line_mc{position: absolute; width: 610px; height: 86px; top: 646px; left: 70px;}
.stage1 .line_mc .line_bg{position: absolute; width: 610px; height: 6px; top: 28px; left: 0px; background: url(../images/stage1_line_mc_line_bg_40.png); }
.stage1 .line_mc .line{position: absolute; width: 610px; height: 6px; top: 28px; left: 0px; background: url(../images/stage1_line_mc_line_39.png); }
/*.stage1 .line_mc .rank5 START*/
.stage1 .line_mc .rank5{position: absolute; width: 60px; height: 86px; top: 0px; left: 528px;}
.stage1 .line_mc .rank5 .empty{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_empty_88.png); }
.stage1 .line_mc .rank5 .full{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_full_16.png); }
.stage1 .line_mc .rank5 .number_txt{position: absolute; width: 60px; top: 70px; left: 0; text-align: center; color: RGB(196,0,0); font-size: 20px; line-height: 20px; }
/*.stage1 .line_mc .rank4 START*/
.stage1 .line_mc .rank4{position: absolute; width: 60px; height: 86px; top: 0px; left: 403px;}
.stage1 .line_mc .rank4 .empty{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_empty_88.png); }
.stage1 .line_mc .rank4 .full{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_full_16.png); }
.stage1 .line_mc .rank4 .number_txt{position: absolute; width: 60px; top: 70px; left: 0; text-align: center; color: RGB(196,0,0); font-size: 20px; line-height: 20px; }
/*.stage1 .line_mc .rank3 START*/
.stage1 .line_mc .rank3{position: absolute; width: 60px; height: 86px; top: 0px; left: 278px;}
.stage1 .line_mc .rank3 .empty{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_empty_88.png); }
.stage1 .line_mc .rank3 .full{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_full_16.png); }
.stage1 .line_mc .rank3 .number_txt{position: absolute; width: 60px; top: 70px; left: 0; text-align: center; color: RGB(196,0,0); font-size: 20px; line-height: 20px; }
/*.stage1 .line_mc .rank2 START*/
.stage1 .line_mc .rank2{position: absolute; width: 60px; height: 86px; top: 0px; left: 152px;}
.stage1 .line_mc .rank2 .empty{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_empty_88.png); }
.stage1 .line_mc .rank2 .full{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_full_16.png); }
.stage1 .line_mc .rank2 .number_txt{position: absolute; width: 60px; top: 70px; left: 0; text-align: center; color: RGB(196,0,0); font-size: 20px; line-height: 20px; }
/*.stage1 .line_mc .rank1 START*/
.stage1 .line_mc .rank1{position: absolute; width: 60px; height: 86px; top: 0px; left: 27px;}
.stage1 .line_mc .rank1 .empty{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_empty_88.png); }
.stage1 .line_mc .rank1 .full{position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(../images/stage1_line_mc_rank5_full_16.png); }
.stage1 .line_mc .rank1 .number_txt{position: absolute; width: 60px; top: 70px; left: 0; text-align: center; color: RGB(196,0,0); font-size: 20px; line-height: 20px; }
/*.stage1 .arrow_mc START*/
.stage1 .arrow_mc{position: absolute; width: 221px; height: 25px; top: 1059px; left: 260px;}
.stage1 .arrow_mc .txt{position: absolute; top: 0px; right: 30px; color: RGB(145,31,12); font-size: 24px; line-height: 24px; text-align: right; white-space: nowrap; }
.stage1 .arrow_mc .arrow{position: absolute; width: 23px; height: 15px; top: 7px; left: 198px; background: url(../images/stage1_arrow_mc_arrow_58.png); }
.stage1 .logo{position: absolute; width: 273px; height: 104px; top: 0px; left: 16px; background: url(../images/stage2_logo_97.png); }
/*.stage1 .list START*/
.stage1 .list{position: absolute; width: 670px; height: 310px; top: 1110px; left: 0; right: 0; margin: 0 auto; overflow-x: hidden; overflow-y: scroll; display: -webkit-flex; -webkit-flex-direction: row; -webkit-flex-wrap: wrap; -webkit-justify-content: flex-start; }
/*.stage1 .list .user START*/
.stage1 .list .user{position: relative; width: 139px; height: 152px; top: 0px; left: 0px; margin: 0px 14px; }
.stage1 .list .user .face_bg{position: absolute; width: 121px; height: 121px; top: 0px; left: 9px; background: url(../images/stage1_list_user_face_bg_26.png); }
.stage1 .list .user .face{position: absolute; width: 115px; height: 115px; top: 3px; left: 12px; -webkit-border-radius: 50%; }
.stage1 .list .user .name_txt{position: absolute; width: 139px; top: 126px; left: 0px; color: RGB(135,53,42); font-size: 20px; line-height: 20px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/*.stage1 .invite_mc START*/
.stage1 .invite_mc{position: absolute; width: 216px; height: 52px; top: 470px; left: 155px;}
.stage1 .invite_mc .input_bg{position: absolute; width: 216px; height: 52px; top: 0px; left: 0px; background: url(../images/stage1_invite_mc_input_bg_27.png); }
.stage1 .invite_mc .invite_input{position: absolute; width: 216px; top: 0px; left: 0; color: RGB(145,31,12); font-size: 23px; padding: 13px 0px; text-align: center; -webkit-user-select: text; }
.stage1 .stage2_button{position: absolute; width: 252px; height: 80px; top: 923px; left: 385px; background: url(../images/stage1_stage2_button_91.png); }
.stage1 .help_tips_button{position: absolute; width: 252px; height: 80px; top: 923px; left: 113px; background: url(../images/stage1_help_tips_button_62.png); }
.stage1 .id_tips_button{position: absolute; width: 45px; height: 46px; top: 474px; left: 558px; background: url(../images/stage1_id_tips_button_4.png); }
.stage1 .copy_button{position: absolute; width: 152px; height: 50px; top: 471px; left: 387px; background: url(../images/stage1_copy_button_86.png); }
.stage1 .prize_tips_button{position: absolute; width: 152px; height: 50px; top: 25px; left: 417px; background: url(../images/stage1_prize_tips_button_87.png); }
.stage1 .role_tips_button{position: absolute; width: 152px; height: 50px; top: 25px; left: 579px; background: url(../images/stage1_role_tips_button_50.png); color: #fff; line-height: 50px; text-align: center; }

.icon1_1{position: absolute; width: 78px; height: 51px; top: 39px; left: 42px; background: url(../images/start_tips_page1_prize1_icon_23.png); }
.icon1_2{position: absolute; width: 56px; height: 79px; top: 21px; left: 43px; background: url(../images/start_tips_page1_prize2_icon_81.png); }
.icon1_3{position: absolute; width: 80px; height: 74px; top: 24px; left: 27px; background: url(../images/start_tips_page1_prize3_icon_11.png); }
.icon1_4{position: absolute; width: 62px; height: 80px; top: 20px; left: 41px; background: url(../images/start_tips_page1_prize4_icon_42.png); }
.icon1_5{position: absolute; width: 79px; height: 60px; top: 31px; left: 34px; background: url(../images/start_tips_page1_prize5_icon_13.png); }
.icon1_6{position: absolute; width: 49px; height: 77px; top: 24px; left: 47px; background: url(../images/start_tips_page1_prize6_icon_65.png); }
.icon1_7{position: absolute; width: 63px; height: 63px; top: 30px; left: 41px; background: url(../images/start_tips_page1_prize7_icon_6.png); }
.icon1_8{position: absolute; width: 64px; height: 77px; top: 21px; left: 33px; background: url(../images/start_tips_page1_prize8_icon_10.png); }
.icon1_9{position: absolute; width: 49px; height: 63px; top: 28px; left: 44px; background: url(../images/start_tips_page1_prize9_icon_98.png); }
.icon2_1{position: absolute; width: 60px; height: 73px; top: 22px; left: 36px; background: url(../images/start_tips_page2_prize1_icon_63.png); }
.icon2_2{position: absolute; width: 65px; height: 66px; top: 25px; left: 41px; background: url(../images/start_tips_page2_prize2_icon_22.png); }
.icon2_3{position: absolute; width: 58px; height: 70px; top: 23px; left: 41px; background: url(../images/start_tips_page2_prize3_icon_60.png); }
.icon2_4{position: absolute; width: 60px; height: 63px; top: 29px; left: 36px; background: url(../images/start_tips_page2_prize4_icon_40.png); }
.icon2_5{position: absolute; width: 75px; height: 75px; top: 23px; left: 28px; background: url(../images/start_tips_page2_prize5_icon_37.png); }
.icon2_6{position: absolute; width: 44px; height: 67px; top: 25px; left: 46px; background: url(../images/start_tips_page2_prize6_icon_79.png); }
.icon2_7{position: absolute; width: 84px; height: 87px; top: 4px; left: 35px; background: url(../images/start_tips_page2_prize7_icon_61.png); }
.icon2_8{position: absolute; width: 77px; height: 77px; top: 14px; left: 32px; background: url(../images/start_tips_page2_prize8_icon_12.png); }
.icon2_9{position: absolute; width: 77px; height: 76px; top: 20px; left: 37px; background: url(../images/start_tips_page2_prize9_icon_68.png); }