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*/
/*.help_tips START*/
.help_tips{}
.help_tips .pic{position: absolute; width: 596px; height: 436px; top: 337px; left: 77px; background: url(../images/help_tips_pic_88.png); }
.help_tips .game_tips_button{position: absolute; width: 305px; height: 82px; top: 604px; left: 214px; background: url(../images/help_tips_game_tips_button_64.png); }
.help_tips .close_button{position: absolute; width: 44px; height: 47px; top: 278px; left: 629px; background: url(../images/help_tips_close_button_35.png); }
/*.help_full_tips START*/
.help_full_tips{}
.help_full_tips .pic{position: absolute; width: 596px; height: 436px; top: 337px; left: 77px; background: url(../images/help_full_tips_pic_14.png); }
.help_full_tips .close_button{position: absolute; width: 44px; height: 47px; top: 278px; left: 623px; background: url(../images/help_tips_close_button_35.png); }
/*.role_tips START*/
.role_tips{}
.role_tips .pic{position: absolute; width: 596px; height: 938px; top: 167px; left: 77px; background: url(../images/role_tips_pic_12.png); }
.role_tips .close_button{position: absolute; width: 44px; height: 47px; top: 108px; left: 628px; background: url(../images/help_tips_close_button_35.png); }
/*.game_tips START*/
.game_tips{}
.game_tips .pic{position: absolute; width: 596px; height: 572px; top: 277px; left: 77px; background: url(../images/game_tips_pic_90.png); }
.game_tips .link_button{position: absolute; width: 285px; height: 82px; top: 660px; left: 234px; background: url(../images/game_tips_link_button_4.png); }
.game_tips .close_button{position: absolute; width: 44px; height: 47px; top: 218px; left: 627px; background: url(../images/help_tips_close_button_35.png); }
/*.more_tips START*/
.more_tips{}
.more_tips .pic_bg{position: absolute; width: 596px; height: 964px; top: 187px; left: 77px; background: url(../images/more_tips_pic_bg_89.png); }
.more_tips .pic{position: absolute; width: 507px; height: 319px; top: 358px; left: 120px; background: url(../images/more_tips_pic_5.png); }
.more_tips .skills_bg{position: absolute; width: 508px; height: 396px; top: 696px; left: 122px; background: url(../images/more_tips_skills_bg_39.png); }
/*.more_tips .skills_mc START*/
.more_tips .skills_mc{position: absolute; width: 432px; height: 256px; top: 736px; left: 159px;}
.more_tips .skills_mc .skills1{position: absolute; width: 423px; height: 155px; top: 0px; left: 0px; background: url(../images/more_tips_skills_mc_skills1_84.png); }
.more_tips .skills_mc .skills2{position: absolute; width: 425px; height: 255px; top: 1px; left: 0px; background: url(../images/more_tips_skills_mc_skills2_95.png); }
.more_tips .skills_mc .skills3{position: absolute; width: 432px; height: 187px; top: 1px; left: 0px; background: url(../images/more_tips_skills_mc_skills3_58.png); }
.more_tips .skills_mc .skills4{position: absolute; width: 424px; height: 154px; top: 0px; left: 0px; background: url(../images/more_tips_skills_mc_skills4_8.png); }
.more_tips .skills_mc .skills5{position: absolute; width: 423px; height: 189px; top: 0px; left: 0px; background: url(../images/more_tips_skills_mc_skills5_84.png); }
/*.more_tips .buttons_mc START*/
.more_tips .buttons_mc{position: absolute; width: 522px; height: 86px; top: 236px; left: 114px;}
.more_tips .buttons_mc .button{opacity: 0.7; }
.more_tips .buttons_mc .button.choose{opacity: 1; }
.more_tips .buttons_mc .button1{position: absolute; width: 94px; height: 86px; top: 0px; left: 0px; background: url(../images/more_tips_buttons_mc_button1_14.png); }
.more_tips .buttons_mc .button2{position: absolute; width: 94px; height: 86px; top: 0px; left: 107px; background: url(../images/more_tips_buttons_mc_button2_92.png); }
.more_tips .buttons_mc .button3{position: absolute; width: 94px; height: 86px; top: 0px; left: 214px; background: url(../images/more_tips_buttons_mc_button3_44.png); }
.more_tips .buttons_mc .button4{position: absolute; width: 94px; height: 86px; top: 0px; left: 321px; background: url(../images/more_tips_buttons_mc_button4_91.png); }
.more_tips .buttons_mc .button5{position: absolute; width: 94px; height: 86px; top: 0px; left: 428px; background: url(../images/more_tips_buttons_mc_button5_88.png); }
.more_tips .close_button{position: absolute; width: 44px; height: 47px; top: 123px; left: 629px; background: url(../images/help_tips_close_button_35.png); }
/*.stage2 START*/
.stage2{}
.stage2 .bg{position: absolute; width: 750px; height: 1448px; top: 0px; left: 0px; background: url(../images/stage2_bg_25.png); }
/*.stage2 .pingtu_mc START*/
.stage2 .pingtu_mc{position: absolute; width: 567px; height: 567px; top: 338px; left: 93px;}
.stage2 .pingtu_mc .bottom{position: absolute; width: 560px; height: 560px; top: 3px; left: 3px; background: url(../images/stage2_pingtu_mc_bottom_82.png); }
/*.stage2 .pingtu_mc .card_list START*/
.stage2 .pingtu_mc .card_list{position: absolute; width: 560px; height: 560px; top: 3px; left: 3px;}
/*.stage2 .pingtu_mc .card_list .card1 START*/
.stage2 .pingtu_mc .card_list .card1{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px;}
.stage2 .pingtu_mc .card_list .card1 .card_dark{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card1_card_dark_82.png); }
.stage2 .pingtu_mc .card_list .card1 .card{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card1_card_90.png); }
.stage2 .pingtu_mc .card_list .card1 .count_txt{position: absolute; width: 26px; top: 147px; left: 85px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
/*.stage2 .pingtu_mc .card_list .card2 START*/
.stage2 .pingtu_mc .card_list .card2{position: absolute; width: 194px; height: 192px; top: 0px; left: 183px;}
.stage2 .pingtu_mc .card_list .card2 .card_dark{position: absolute; width: 194px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card2_card_dark_68.png); }
.stage2 .pingtu_mc .card_list .card2 .card{position: absolute; width: 194px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card2_card_4.png); }
.stage2 .pingtu_mc .card_list .card2 .count_txt{position: absolute; width: 26px; top: 147px; left: 86px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
/*.stage2 .pingtu_mc .card_list .card3 START*/
.stage2 .pingtu_mc .card_list .card3{position: absolute; width: 192px; height: 192px; top: 0px; left: 368px;}
.stage2 .pingtu_mc .card_list .card3 .card_dark{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card3_card_dark_56.png); }
.stage2 .pingtu_mc .card_list .card3 .card{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card3_card_57.png); }
.stage2 .pingtu_mc .card_list .card3 .count_txt{position: absolute; width: 26px; top: 147px; left: 82px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
/*.stage2 .pingtu_mc .card_list .card4 START*/
.stage2 .pingtu_mc .card_list .card4{position: absolute; width: 192px; height: 194px; top: 183px; left: 0px;}
.stage2 .pingtu_mc .card_list .card4 .card_dark{position: absolute; width: 192px; height: 194px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card4_card_dark_93.png); }
.stage2 .pingtu_mc .card_list .card4 .card{position: absolute; width: 192px; height: 194px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card4_card_51.png); }
.stage2 .pingtu_mc .card_list .card4 .count_txt{position: absolute; width: 26px; top: 148px; left: 86px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
/*.stage2 .pingtu_mc .card_list .card5 START*/
.stage2 .pingtu_mc .card_list .card5{position: absolute; width: 194px; height: 194px; top: 183px; left: 183px;}
.stage2 .pingtu_mc .card_list .card5 .card_dark{position: absolute; width: 194px; height: 194px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card5_card_dark_68.png); }
.stage2 .pingtu_mc .card_list .card5 .card{position: absolute; width: 194px; height: 194px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card5_card_99.png); }
.stage2 .pingtu_mc .card_list .card5 .count_txt{position: absolute; width: 26px; top: 148px; left: 85px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
/*.stage2 .pingtu_mc .card_list .card6 START*/
.stage2 .pingtu_mc .card_list .card6{position: absolute; width: 192px; height: 194px; top: 183px; left: 368px;}
.stage2 .pingtu_mc .card_list .card6 .card_dark{position: absolute; width: 192px; height: 194px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card6_card_dark_47.png); }
.stage2 .pingtu_mc .card_list .card6 .card{position: absolute; width: 192px; height: 194px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card6_card_12.png); }
.stage2 .pingtu_mc .card_list .card6 .count_txt{position: absolute; width: 26px; top: 148px; left: 82px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
/*.stage2 .pingtu_mc .card_list .card7 START*/
.stage2 .pingtu_mc .card_list .card7{position: absolute; width: 192px; height: 192px; top: 368px; left: 0px;}
.stage2 .pingtu_mc .card_list .card7 .card_dark{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card7_card_dark_57.png); }
.stage2 .pingtu_mc .card_list .card7 .card{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card7_card_98.png); }
.stage2 .pingtu_mc .card_list .card7 .count_txt{position: absolute; width: 26px; top: 147px; left: 84px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
/*.stage2 .pingtu_mc .card_list .card8 START*/
.stage2 .pingtu_mc .card_list .card8{position: absolute; width: 194px; height: 192px; top: 368px; left: 183px;}
.stage2 .pingtu_mc .card_list .card8 .card_dark{position: absolute; width: 194px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card8_card_dark_67.png); }
.stage2 .pingtu_mc .card_list .card8 .card{position: absolute; width: 194px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card8_card_5.png); }
.stage2 .pingtu_mc .card_list .card8 .count_txt{position: absolute; width: 26px; top: 147px; left: 85px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
/*.stage2 .pingtu_mc .card_list .card9 START*/
.stage2 .pingtu_mc .card_list .card9{position: absolute; width: 192px; height: 192px; top: 368px; left: 368px;}
.stage2 .pingtu_mc .card_list .card9 .card_dark{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card9_card_dark_88.png); }
.stage2 .pingtu_mc .card_list .card9 .card{position: absolute; width: 192px; height: 192px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_card_list_card9_card_92.png); }
.stage2 .pingtu_mc .card_list .card9 .count_txt{position: absolute; width: 26px; top: 147px; left: 82px; color: RGB(255,255,255); font-size: 24px; line-height: 24px; }
.stage2 .pingtu_mc .top{position: absolute; width: 567px; height: 567px; top: 0px; left: 0px; background: url(../images/stage2_pingtu_mc_top_39.png); }
/*.stage2 .user START*/
.stage2 .user{position: absolute; width: 607px; height: 90px; top: 220px; left: 70px;}
.stage2 .user .res_txt{position: absolute; width: 157px; top: 33px; left: 433px; color: RGB(130,93,71); font-size: 28px; line-height: 28px; white-space: nowrap; }
.stage2 .user .icon{position: absolute; width: 35px; height: 35px; top: 28px; left: 389px; background: url(../images/stage2_user_icon_43.png); }
.stage2 .user .line{position: absolute; width: 607px; height: 90px; top: 0px; left: 0px; background: url(../images/stage2_user_line_25.png); }
.stage2 .user .name_txt{position: absolute; width: 250px; top: 33px; left: 121px; color: RGB(130,93,71); font-size: 28px; line-height: 28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stage2 .user .face_bg{position: absolute; width: 80px; height: 80px; top: 5px; left: 23px; background: url(../images/stage2_user_face_bg_82.png); }
.stage2 .user .face{position: absolute; width: 72px; height: 72px; top: 9px; left: 27px; -webkit-border-radius: 50%; }
/*.stage2 .titles START*/
.stage2 .titles{position: absolute; width: 477px; height: 95px; top: 106px; left: 137px;}
.stage2 .titles .full{position: absolute; width: 434px; height: 94px; top: 0px; left: 20px; background: url(../images/stage2_titles_full_62.png); }
.stage2 .titles .need_help{position: absolute; width: 398px; height: 95px; top: 0px; left: 40px; background: url(../images/stage2_titles_need_help_90.png); }
.stage2 .titles .helped{position: absolute; width: 477px; height: 43px; top: 26px; left: 0px; background: url(../images/stage2_titles_helped_44.png); }
.stage2 .role_tips_button{position: absolute; width: 97px; height: 23px; top: 1165px; left: 564px; background: url(../images/stage2_role_tips_button_11.png); }
.stage2 .more_tips_button{position: absolute; width: 134px; height: 54px; top: 951px; left: 526px; background: url(../images/stage2_more_tips_button_1.png); }
.stage2 .game_tips_button{position: absolute; width: 384px; height: 90px; top: 1067px; left: 182px; background: url(../images/stage2_game_tips_button_12.png); }
.stage2 .help_tips_button{position: absolute; width: 384px; height: 90px; top: 1067px; left: 182px; background: url(../images/stage2_help_tips_button_26.png); }
/*.stage1 START*/
.stage1{}
.stage1 .bg{position: absolute; width: 750px; height: 1448px; top: 0px; left: 0px; background: url(../images/stage1_bg_97.png); }
.stage1 .arrow{position: absolute; width: 56px; height: 56px; top: 1220px; left: 354px; background: url(../images/stage1_arrow_50.png); }