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: 1472px;}
/*MAIN END*/
/*.role_tips START*/
.role_tips{}
/*.role_tips .mc START*/
.role_tips .mc{position: absolute; width: 550px; height: 848px; top: 232px; left: 129px;}
.role_tips .mc .pic{position: absolute; width: 490px; height: 848px; top: 0px; left: 0px; background: url(../images/role_tips_mc_pic_35.png); }
.role_tips .mc .close_button2{position: absolute; width: 50px; height: 50px; top: 78px; left: 500px; background: url(../images/role_tips_mc_close_button2_88.png); }
.role_tips .mc .close_button{position: absolute; width: 190px; height: 63px; top: 739px; left: 152px; background: url(../images/role_tips_mc_close_button_89.png); }
/*.prize2_tips START*/
.prize2_tips{}
/*.prize2_tips .mc START*/
.prize2_tips .mc{position: absolute; width: 485px; height: 423px; top: 327px; left: 131px;}
.prize2_tips .mc .pic{position: absolute; width: 485px; height: 174px; top: 0px; left: 0px; background: url(../images/prize2_tips_mc_pic_14.png); }
.prize2_tips .mc .txt{position: absolute; width: 485px; top: 189px; left: 0; right: 0; margin: 0 auto; color: RGB(174,174,174); font-size: 20px; text-align: center; }
.prize2_tips .mc .close_next_button{position: absolute; width: 280px; height: 63px; top: 360px; left: 102px; background: url(../images/prize2_tips_mc_close_next_button_85.png); }
.prize2_tips .mc .share_button2{position: absolute; width: 280px; height: 63px; top: 270px; left: 102px; background: url(../images/prize2_tips_mc_share_button_72.png); }
.prize2_tips .mc .close_button{position: absolute; width: 190px; height: 63px; top: 450px; left: 145px;  background: url(../images/lock_tips_mc_close_button_70.png); }
/*.prize1_tips START*/
.prize1_tips{}
/*.prize1_tips .mc START*/
.prize1_tips .mc{position: absolute; width: 322px; height: 326px; top: 382px; left: 211px;}
.prize1_tips .mc .close_button{position: absolute; width: 190px; height: 63px; top: 263px; left: 70px; background: url(../images/prize1_tips_mc_close_button_80.png); }
.prize1_tips .mc .pic{position: absolute; width: 322px; height: 161px; top: 0px; left: 0px; background: url(../images/prize1_tips_mc_pic_47.png); }
.prize1_tips .mc .txt{position: absolute; width: 480px; top: 176px; left: -65px; color: RGB(174,174,174); font-size: 20px; text-align: center; }
/*.lock_tips START*/
.lock_tips{}
/*.lock_tips .mc START*/
.lock_tips .mc{position: absolute; width: 550px; height: 414px; top: 376px; left: 129px;}
.lock_tips .mc .pic{position: absolute; width: 490px; height: 342px; top: 72px; left: 0px; background: url(../images/lock_tips_mc_pic_1.png); }
.lock_tips .mc .pic.place1{background: url(../images/lock_tips_mc_pic_1.png); }
.lock_tips .mc .pic.place2{background: url(../images/lock_tips_mc_pic_3.png); }
.lock_tips .mc .pic.place3{background: url(../images/lock_tips_mc_pic_4.png); }
.lock_tips .mc .pic.place4{background: url(../images/lock_tips_mc_pic_2.png); }
.lock_tips .mc .logo{position: absolute; width: 230px; height: 61px; top: 0px; left: 128px; background: url(../images/lock_tips_mc_logo_39.png); }
.lock_tips .mc .place_txt{position: absolute; width: 490px; top: 87px; left: 0px; text-align: center; color: RGB(255,251,215); font-size: 30px; line-height: 30px; }
.lock_tips .mc .close_button{position: absolute; width: 190px; height: 63px; top: 329px; left: 152px; background: url(../images/lock_tips_mc_close_button_70.png); }
.lock_tips .mc .close_button2{position: absolute; width: 50px; height: 50px; top: 77px; left: 500px; background: url(../images/lock_tips_mc_close_button2_59.png); }
/*.msg_tips START*/
.msg_tips{}
/*.msg_tips .mc START*/
.msg_tips .mc{position: absolute; width: 550px; height: 381px; top: 337px; left: 129px;}
.msg_tips .mc .pic{position: absolute; width: 490px; height: 305px; top: 76px; left: 0px; background: url(../images/msg_tips_mc_pic_3.png); }
.msg_tips .mc .logo{position: absolute; width: 230px; height: 61px; top: 0px; left: 128px; background: url(../images/lock_tips_mc_logo_39.png); }
.msg_tips .mc .txt{position: absolute; width: 450px; top: 162px; left: 20px; color: RGB(255,255,255); font-size: 22px; text-align: center; }
.msg_tips .mc .close_button2{position: absolute; width: 50px; height: 50px; top: 81px; left: 500px; background: url(../images/msg_tips_mc_close_button2_47.png); }
.msg_tips .mc .game_tips_button{position: absolute; width: 190px; height: 63px; top: 265px; left: 39px; background: url(../images/msg_tips_mc_game_tips_button_64.png); }
.msg_tips .mc .close_button{position: absolute; width: 190px; height: 63px; top: 264px; left: 271px; background: url(../images/msg_tips_mc_close_button_1.png); }
/*.game_tips START*/
.game_tips{}
/*.game_tips .mc START*/
.game_tips .mc{position: absolute; width: 550px; height: 537px; top: 233px; left: 129px;}
.game_tips .mc .pic{position: absolute; width: 490px; height: 465px; top: 72px; left: 0px; background: url(../images/game_tips_mc_pic_80.png); }
.game_tips .mc .close_button{position: absolute; width: 50px; height: 50px; top: 77px; left: 500px; background: url(../images/game_tips_mc_close_button_17.png); }
.game_tips .mc .link_button{position: absolute; width: 190px; height: 63px; top: 403px; left: 152px; background: url(../images/game_tips_mc_link_button_43.png); }
.game_tips .mc .logo{position: absolute; width: 230px; height: 61px; top: 0px; left: 128px; background: url(../images/lock_tips_mc_logo_39.png); }
/*.rank_tips START*/
.rank_tips{}
/*.rank_tips .mc START*/
.rank_tips .mc{position: absolute; width: 550px; height: 875px; top: 115px; left: 129px;}
.rank_tips .mc .mc_bg{position: absolute; width: 490px; height: 805px; top: 70px; left: 0px; background: url(../images/rank_tips_mc_mc_bg_44.png); }
.rank_tips .mc .close_button2{position: absolute; width: 50px; height: 50px; top: 75px; left: 500px; background: url(../images/rank_tips_mc_close_button2_88.png); }
.rank_tips .mc .close_button{position: absolute; width: 190px; height: 63px; top: 793px; left: 152px; background: url(../images/lock_tips_mc_close_button_70.png); }
/*.rank_tips .mc .rank_list START*/
.rank_tips .mc .rank_list{position: absolute; width: 465px; height: 600px; top: 190px; left: 13px; overflow-y: scroll; overflow-x: hidden; }
/*.rank_tips .mc .rank_list .user START*/
.rank_tips .mc .rank_list .user{position: relative; width: 465px; height: 109px; top: 0px; left: 0px; margin-bottom: 15px; }
.rank_tips .mc .rank_list .user .user_bg{position: absolute; width: 335px; height: 109px; top: 0px; left: 0px; background: url(../images/rank_tips_mc_rank_list_user_user_bg_6.png) -130px 0; }
.rank_tips .mc .rank_list .user .res_txt{position: absolute; width: 135px; top: 24px; left: 290px; color: RGB(255,255,255); font-size: 20px; line-height: 30px; text-align: center; }
.rank_tips .mc .rank_list .user .name_txt{position: absolute; width: 101px; top: 44px; left: 90px; color: RGB(255,255,255); font-size: 20px; line-height: 20px; white-space: nowrap; }
.rank_tips .mc .rank_list .user .face{position: absolute; width: 95px; height: 95px; top: 3px; left: 19px; -webkit-mask: url(../images/rank_tips_mc_rank_list_user_face_44.png); }
/*.rank_tips .mc .area_rank_button START*/
.rank_tips .mc .area_rank_button{position: absolute; width: 246px; height: 50px; top: 125px; left: 0px;}
.rank_tips .mc .area_rank_button .button_bg{position: absolute; width: 246px; height: 50px; top: 0px; left: 0px; background: #000; }
.rank_tips .mc .area_rank_button .txt{position: absolute; width: 246px; top: 0; left: 0; text-align: center; color: #fff; font-size: 16px; line-height: 50px; }
.rank_tips .mc .area_rank_button.current .button_bg{background: url(../images/rank_tips_mc_area_rank_button_button_bg_33.png); }
.rank_tips .mc .area_rank_button.current .txt{color: #000; }
/*.rank_tips .mc .all_rank_button START*/
.rank_tips .mc .all_rank_button{position: absolute; width: 246px; height: 50px; top: 125px; left: 244px;}
.rank_tips .mc .all_rank_button .button_bg{position: absolute; width: 246px; height: 50px; top: 0px; left: 0px; background: #000; }
.rank_tips .mc .all_rank_button .txt{position: absolute; width: 246px; top: 0; left: 0; text-align: center; color: #fff; font-size: 18px; line-height: 50px; }
.rank_tips .mc .all_rank_button.current .button_bg{background: url(../images/rank_tips_mc_area_rank_button_button_bg_33.png); }
.rank_tips .mc .all_rank_button.current .txt{color: #000; }
.rank_tips .mc .logo{position: absolute; width: 230px; height: 61px; top: 0px; left: 128px; background: url(../images/lock_tips_mc_logo_39.png); }
/*.stage3 START*/
.stage3{}
.stage3 .bg{position: absolute; width: 750px; height: 1472px; top: 0px; left: 0px; background: url(../images/stage3_bg_100.png); }
.stage3 .cloud{position: absolute; width: 750px; height: 494px; top: 0px; left: 0px; background: url(../images/stage3_cloud_77.png); }
.stage3 .point{position: absolute; width: 41px; height: 73px; top: 765px; left: 134px; background: url(../images/stage3_point_94.png); }
/*.stage3 .line_mc START*/
.stage3 .line_mc{position: absolute; width: 84px; height: 429px; top: 408px; left: 528px;}
.stage3 .line_mc .line_bg{position: absolute; width: 84px; height: 429px; top: 0px; left: 0px; background: url(../images/stage3_line_mc_line_bg_22.png); }
.stage3 .line_mc .line{position: absolute; width: 16px; height: 397px; bottom: 0; left: 34px; background: url(../images/stage3_line_mc_line_38.png); }
.stage3 .line_mc .item{position: absolute; width: 26px; height: 23px; top: 300px; left: 28px; background: url(../images/stage3_line_mc_item_56.png); }
/*.stage3 .buildings START*/
.stage3 .buildings{position: absolute; width: 704px; height: 786px; top: 101px; left: 21px;}
.stage3 .buildings .b1{position: absolute; width: 428px; height: 561px; top: 224px; left: 94px; background: url(../images/stage3_buildings_b1_6.png); }
.stage3 .buildings .b1_title{position: absolute; width: 371px; height: 110px; top: 0px; left: 0; right: 0; margin: 0 auto; background: url(../images/stage3_buildings_b1_title_21.png); }
.stage3 .buildings .b2{position: absolute; width: 483px; height: 503px; top: 280px; left: 30px; background: url(../images/stage3_buildings_b2_11.png); }
.stage3 .buildings .b2_title{position: absolute; width: 599px; height: 113px; top: 0px; left: 0; right: 0; margin: 0 auto; background: url(../images/stage3_buildings_b2_title_83.png); }
.stage3 .buildings .b3{position: absolute; width: 497px; height: 455px; top: 305px; left: 5px; background: url(../images/stage3_buildings_b3_81.png); }
.stage3 .buildings .b3_title{position: absolute; width: 575px; height: 113px; top: 0px; left: 0; right: 0; margin: 0 auto; background: url(../images/stage3_buildings_b3_title_66.png); }
.stage3 .buildings .b4{position: absolute; width: 452px; height: 457px; top: 299px; left: 30px; background: url(../images/stage3_buildings_b4_52.png); }
.stage3 .buildings .b4_title{position: absolute; width: 562px; height: 95px; top: 19px; left: 0; right: 0; margin: 0 auto; background: url(../images/stage3_buildings_b4_title_4.png); }
/*.stage3 .my_mc START*/
.stage3 .my_mc{position: absolute; width: 638px; height: 967px; top: 220px; left: 51px;}
.stage3 .my_mc .t_bg{position: absolute; width: 547px; height: 60px; top: 0px; left: 51px; background: url(../images/stage3_my_mc_t_bg_9.png); }
.stage3 .my_mc .t1{position: absolute; width: 638px; top: 19px; left: 0; color: RGB(0,0,0); font-size: 20px; text-align: center; }
.stage3 .my_mc .t2{position: absolute; width: 638px; top: 70px; left: 0; color: RGB(38,44,48); font-size: 30px; text-align: center; }
.stage3 .my_mc .t3{position: absolute; width: 638px; top: 115px; left: 0; color: RGB(38,44,48); font-size: 24px; text-align: center; }
/*.stage3 .my_mc .log_list_mc START*/
.stage3 .my_mc .log_list_mc{position: absolute; width: 465px; height: 169px; top: 798px; left: 0px;}
/*.stage3 .my_mc .log_list_mc .list START*/
.stage3 .my_mc .log_list_mc .list{position: relative; width: 650px; height: 264px; top: 50px; left: 0px; display: -webkit-flex; flex-wrap: wrap; overflow-x: hidden; overflow-y: scroll; }
/*.stage3 .my_mc .log_list_mc .list .user START*/
.stage3 .my_mc .log_list_mc .list .user{position: relative; width: 101px; height: 101px; top: 0px; left: 0px; margin: 14px; }
.stage3 .my_mc .log_list_mc .list .user .user_bg{position: absolute; width: 101px; height: 101px; top: 0px; left: 0px; background: url(../images/stage3_my_mc_log_list_mc_list_user_user_bg_62.png); }
.stage3 .my_mc .log_list_mc .list .user .face{position: absolute; width: 95px; height: 95px; top: 3px; left: 3px; object-fit: cover; -webkit-mask: url(../images/stage3_my_mc_log_list_mc_list_user_face_9.png); background: url(../images/stage3_my_mc_log_list_mc_list_user_face_9.png); }
.stage3 .my_mc .log_list_mc .list_title{position: absolute; width: 284px; height: 48px; top: 0px; left: 181px; background: url(../images/stage3_my_mc_log_list_mc_list_title_9.png); }
.stage3 .my_mc .stage2_button{position: absolute; width: 264px; height: 75px; top: 700px; left: 374px; background: url(../images/stage3_my_mc_stage2_button_23.png); }
.stage3 .my_mc .share_button{position: absolute; width: 264px; height: 75px; top: 700px; left: 22px; background: url(../images/stage3_my_mc_share_button_42.png); }
/*.stage3 .other_mc START*/
.stage3 .other_mc{position: absolute; width: 497px; height: 951px; top: 108px; left: 133px;}
.stage3 .other_mc .help_tips_button{position: absolute; width: 284px; height: 61px; top: 747px; left: 102px; background: url(../images/stage3_other_mc_help_tips_button_66.png); }
.stage3 .other_mc .game_tips_button2{position: absolute; width: 284px; height: 61px; top: 819px; left: 102px; background: url(../images/stage3_other_mc_game_tips_button2_5.png); }
.stage3 .other_mc .game_tips_button{position: absolute; width: 284px; height: 61px; top: 890px; left: 102px; background: url(../images/stage3_other_mc_game_tips_button_72.png); }
.stage3 .other_mc .txt{position: absolute; width: 497px; top: 203px; left: 0; color: RGB(38,44,48); font-size: 22px; text-align: center; }
.stage3 .other_mc .title{position: absolute; width: 497px; height: 186px; top: 0px; left: 0px; background: url(../images/stage3_other_mc_title_54.png); }
.stage3 .logo{position: absolute; width: 230px; height: 61px; top: 23px; left: 257px; background: url(../images/lock_tips_mc_logo_39.png); }
.stage3 .role_tips_button{position: absolute; width: 143px; height: 42px; top: 20px; left: 597px; background: url(../images/stage3_role_tips_button_51.png); }
.stage3 .rank_tips_button{position: absolute; width: 40px; height: 173px; top: 505px; left: 0px; background: url(../images/stage3_rank_tips_button_68.png); }
/*.stage2 START*/
.stage2{}
.stage2 .bg{position: absolute; width: 750px; height: 1472px; top: 0px; left: 0px; background: url(../images/stage2_bg_47.png); }
.stage2 .cloud{position: absolute; width: 750px; height: 1472px; top: 0px; left: 0px; background: url(../images/stage2_cloud_81.png); -webkit-animation: cloudMove 10s 1 ease-in-out both; }
.stage2 .shadow{position: absolute; width: 307px; height: 462px; top: 975px; left: 0px; background: url(../images/stage2_shadow_44.png); }
.stage2 .help_txt{position: absolute; width: 743px; height: 118px; top: 841px; left: 7px; background: url(../images/stage2_help_txt_11.png); }
.stage2 .title{position: absolute; width: 750px; height: 468px; top: 0px; left: 0px; background: url(../images/stage2_title_31.png); }
.stage2 .logo{position: absolute; width: 230px; height: 61px; top: 23px; left: 257px; background: url(../images/lock_tips_mc_logo_39.png); }
/*.stage2 .res_mc START*/
.stage2 .res_mc{position: absolute; width: 722px; height: 311px; top: 859px; left: 28px;}
.stage2 .res_mc .line_bg{position: absolute; width: 694px; height: 311px; top: 0px; left: 28px; background: url(../images/stage2_res_mc_line_bg_95.png); }
.stage2 .res_mc .line{position: absolute; width: 505px; height: 40px; top: 152px; left: 138px; background: url(../images/stage2_res_mc_line_45.png); }
.stage2 .res_mc .res_top{position: absolute; width: 621px; height: 96px; top: 122px; left: 0px; background: url(../images/stage2_res_mc_res_top_62.png); }
.stage2 .res_mc .prize_tips_button{position: absolute; width: 506px; height: 40px; top: 152px; left: 136px; }
/*.stage2 .user_mc START*/
.stage2 .user_mc{position: absolute; width: 550px; height: 101px; top: 287px; left: 186px; background: url(../images/stage2_user_mc_user_bg_79.png); }
.stage2 .user_mc .user_bg{position: absolute; width: 550px; height: 101px; top: 0px; left: 0px; background: url(../images/stage2_user_mc_user_bg_79.png); }
.stage2 .user_mc .face{position: absolute; width: 95px; height: 95px; top: 3px; left: 3px; background: url(../images/stage3_my_mc_log_list_mc_list_user_face_9.png); }
.stage2 .user_mc .name_txt{position: absolute; width: 117px; top: 22px; left: 116px; color: RGB(38,38,38); font-size: 24px; line-height: 24px; white-space: nowrap; }
.stage2 .user_mc .res_txt{position: absolute; width: 173px; top: 57px; left: 114px; color: RGB(144,112,12); font-size: 20px; line-height: 20px; white-space: nowrap; }
/*.stage2 .line_mc START*/
.stage2 .line_mc{position: absolute; width: 169px; height: 157px; top: 708px; left: 204px;}
.stage2 .line_mc.place1{top: 660px; left: 520px; }
.stage2 .line_mc.place2{top: 720px; left: 220px; }
.stage2 .line_mc.place3{top: 460px; left: 250px; }
.stage2 .line_mc.place4{top: 460px; left: 600px; }
.stage2 .line_mc.place5{display: none; }
.stage2 .line_mc .line_bg{position: absolute; width: 18px; height: 113px; top: 44px; left: 2px; background: url(../images/stage2_line_mc_line_bg_35.png); }
.stage2 .line_mc .line{position: absolute; width: 15px; height: 110px; bottom: 2px; left: 3px; background: url(../images/stage2_line_mc_line_15.png); }
.stage2 .line_mc .txt{position: absolute; width: 137px; top: 4px; left: 32px; color: RGB(255,255,255); font-size: 20px; line-height: 20px; }
.stage2 .line_mc .point{position: absolute; width: 22px; height: 39px; top: 0px; left: 0px; background: url(../images/stage2_line_mc_point_39.png); }
.stage2 .stage3_start_button{position: absolute; width: 163px; height: 40px; top: 690px; left: 480px; background: url(../images/stage2_stage3_start_button_71.png); }
.stage2 .stage3_button{position: absolute; width: 160px; height: 69px; top: 644px; left: 70px; background: url(../images/stage2_stage3_button_85.png); }
.stage2 .stage3_button.place1{top: 545px; left: 370px; }
.stage2 .stage3_button.place2{top: 645px; left: 70px; }
.stage2 .stage3_button.place3{top: 390px; left: 115px; }
.stage2 .stage3_button.place4{top: 390px; left: 480px; }
.stage2 .stage3_button.place5{display: none; }
.stage2 .role_tips_button{position: absolute; width: 143px; height: 42px; top: 20px; left: 597px; background: url(../images/stage2_role_tips_button_62.png); }
.stage2 .stage3_button_1{position: absolute; width: 300px; height: 300px; top: 560px; left: 330px; background: transparent; }
.stage2 .stage3_button_2{position: absolute; width: 255px; height: 300px; top: 640px; left: 30px; background: transparent; }
.stage2 .stage3_button_3{position: absolute; width: 240px; height: 300px; top: 340px; left: 80px; background: transparent; }
.stage2 .stage3_button_4{position: absolute; width: 200px; height: 300px; top: 316px; left: 490px; background: transparent; }
/*.stage1 START*/
.stage1{}
.stage1 .bg{position: absolute; width: 750px; height: 1472px; top: 0px; left: 0px; background: url(../images/stage1_bg_68.png); }
.stage1 .title{position: absolute; width: 750px; height: 494px; top: 0px; left: 0px; background: url(../images/stage1_title_20.png); }
.stage1 .txt{position: absolute; width: 750px; height: 446px; top: 735px; left: 0px; background: url(../images/stage1_txt_48.png); }
.stage1 .round{position: absolute; width: 750px; height: 516px; top: 314px; left: 0px; background: url(../images/stage1_round_90.png); }
.stage1 .point{position: absolute; width: 41px; height: 73px; top: 411px; left: 337px; background: url(../images/stage3_point_94.png); }
.stage1 .stage2_button{position: absolute; width: 264px; height: 75px; top: 995px; left: 241px; background: url(../images/stage1_stage2_button_31.png); }
.stage1 .role_tips_button{position: absolute; width: 143px; height: 42px; top: 20px; left: 597px; background: url(../images/stage1_role_tips_button_1.png); }
.stage1 .logo{position: absolute; width: 230px; height: 61px; top: 23px; left: 257px; background: url(../images/lock_tips_mc_logo_39.png); }

@-webkit-keyframes cloudMove { 
	0% { -webkit-transform:translate3d(0,0,0) scale(1.1); }
	100% { -webkit-transform:translate3d(0,0,0) scale(1); }
}