html,body,div,ul,ol,li,span,p,a,b,i,img,h1,h2{ margin: 0; padding: 0; border: 0 }
html,body{position: relative;width: 100%;height: 100%;background: #FFFFFF}
ul,ol,li{list-style: none;}
input,select,textarea,button{ outline: none}
a{text-decoration: none;-webkit-tap-highlight-color: transparent;}

.mask{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #000; opacity: .8; z-index: 8; display: none}
.clear:before{content: "";display: table}
.clearfloat:after{content: "";display: block;clear: both}

.loading{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #F6AC84; z-index: 10;}
.loading .gif{position: absolute;width: 220px;height: 240px;left: 50%;margin-left: -105px;top: 50%;margin-top: -160px;}
.loading .progress{position: absolute;width: 100%;text-align: center;left: 0;top: 50%;height: 40px;font-size: 28px;color: #000000;line-height: 40px;top: 50%;margin-top: 20px;}
.loading .go_1{position: absolute;width: 139px;height: 60px;left: 50%;margin-left: -70px;top: 50%; margin-top: 20px;display: none}
.loading .go_1 img{display: block;width: 100%;}

.left_bar{position: absolute;top: 0; left: 0; width: 280px;transform-origin: 0% 0%;z-index: 5;transition: .5s}
.left_bar .inner{ position: absolute; top: 0; left: 0; width: 100%;height: 100%; transition: .5s; background: #59413A;}
.left_bar .fold{position: absolute;transition: .5s;background-image: url("img/fold.png?15a78a7e");width: 50px;height: 120px;right: -50px;top: 50%;margin-top: -60px;}
.left_bar.hide .fold{background-image: url("img/unfold.png?7d66dc38")}
.left_bar .logo{display: block;margin: 35px auto;width: 150px;}
.left_bar .logo img{display: block;width: 100%}
.left_bar .user_info{font-size: 24px;color: #E1D5B1;white-space: normal;text-align: center;line-height: 30px;margin-bottom: 30px;}
.left_bar .user_info a{color: #FFCA4F;}
.language_box{width: 180px;height: 60px;box-sizing: border-box;border: 1px solid #FFD8A9;border-radius: 60px;overflow: hidden;margin: 35px auto 32px;}
.language_box a{display: block;width: 50%;height: 100%;text-align: center;line-height: 60px;float: left;font-size: 22px;color: #FFFFFF;box-sizing: border-box;}
.language_box a.cur{color: #EF8564}
.language_box a:first-child{border-right: 1px solid #FFFFFF;}
.left_bar .btn_list{width: 180px;margin: 0 auto;}
.left_bar .btn_list li{margin-bottom: 20px;}
.left_bar .btn_list a{display: block;width: 100%;height: 60px;text-align: center;line-height: 60px;color: #FFFFFF;font-size: 22px;border-radius: 60px;border: 1px solid #FFFFFF;box-sizing: border-box;}
.left_bar .btn_list a.download{background: #EF8564;color: #000000}
.left_bar .btn_list a.home{background: #FFFFFF;color: #000000;}
.left_bar .share{display: block;text-align: center;margin: 30px auto 0;font-size: 24px;color: #FFFFFF;}
.left_bar .share img{display: inline-block;width: 70px;height: 70px;vertical-align: middle;}

.back{position: absolute;width: 180px;top: 12px;left: 10px;transform-origin: 0 0;z-index: 4;display: none}
.back img{display: block;width: 100%;}

.top_btn{position: absolute;width: 320px;display: flex;justify-content: space-between;top: 12px;right: 16px;z-index: 7;transform-origin: 100% 0%}
.top_btn a{display: block;height: 87px;}
.top_btn a img{display: block;height: 100%;}
.top_btn .music{background: url("img/music.png?63668447") no-repeat top center;background-size: 100% 200%;width: 73px;height: 87px}
.top_btn .music.stop{background-position: bottom center;}

.guide{position: absolute;width: 100%;height: 100%;z-index: 3;}
.guide .curtain{position: absolute;width: 100%;height: 100%;background: url("img/curtain.png?15f94e58") no-repeat top center;background-size: auto 100%;top: 0;transition: .5s}
.guide .curtain.hide{top: -36%;}
.guide .stage{position: absolute;width: 100%;height: 100%;background: url("img/stage.png?15bcbe0c") no-repeat top center;background-size: auto 100%;}
.guide .slogan{position: absolute;width: 912px;height: 281px;left: 50%;top: 50%;margin-left: -456px;margin-top: -249px;}
.guide .icon{position: absolute;width: 220px;height: 250px;left: 50%;top: 50%;margin-left: -110px;margin-top: -129px;}
.guide .start{position: absolute;width: 300px;height: 90px;left: 50%;margin-left: -150px;bottom: 40px;transform-origin: 50% 100%;}
.guide .start img{display: block;width: 100%;}
.guide .countdown{position: absolute;height: 45px;line-height: 45px;color: #000000;font-size: 24px;padding: 0 25px;box-sizing: border-box;background: #FFFFFF;border: 1px solid #000000;border-radius: 100px;left: 50%;bottom: 10px;white-space: nowrap;transform-origin: 50% 100%;}
.guide .countdown span{color: #F88A96;font-size: 36px;font-weight: bold;}

.game{position: absolute;width: 100%;height: 100%;z-index: 2;}
.game .bg{position: absolute;width: 100%;height: 100%;z-index: 1;background: url("img/bg.jpg?3d554132") no-repeat top center;background-size: auto 100%;}
.game .bg .role{position: absolute;width: 220px;height: 310px;background-size: 100% 300%;background-position: top center;top: 50%;margin-top: -200px;display: none;}
.game .bg .role.suc{background-position: center center;}
.game .bg .role.err{background-position: bottom center;}
.game .bg .role:nth-child(1){background-image: url("img/role_1.png?5ee65e18");left: 50%;margin-left: -261px;}
.game .bg .role:nth-child(2){background-image: url("img/role_2.png?e87c9ace");right: 50%;margin-right: -253px;}
.game .bg_1{position: absolute;width: 100%;height: 100%;z-index: 2;background: url("img/stage.png?15bcbe0c") no-repeat top center;background-size: auto 100%;}
.game .bg_2{position: absolute;width: 100%;height: 100%;z-index: 3;}
.game .bg_2 li{position: absolute;width: 100%;height: 100%;background-size: auto 100%;background-position: top center;background-repeat: no-repeat;}
.game .bg_2 li:nth-child(1){background-image: url("img/prop/type_5_1.png?2355912e")}
.game .bg_2 li:nth-child(2){background-image: url("img/prop/type_5_2.png?e11f9553")}
.game .bg_2 li:nth-child(3){background-image: url("img/prop/type_5_3.png?46b25a91")}
.game .bg_2 li:nth-child(4){background-image: url("img/prop/type_5_4.png?dee6935f")}
.game .bg_2 li:nth-child(5){background-image: url("img/prop/type_5_5.png?529dd5ac")}
.game .bg_2 li:nth-child(6){background-image: url("img/prop/type_2_1.png?d7107420")}
.game .bg_2 li:nth-child(7){background-image: url("img/prop/type_2_2.png?ea143512")}
.game .bg_2 li:nth-child(8){background-image: url("img/prop/type_2_3.png?d973b0fa")}
.game .bg_2 li:nth-child(9){background-image: url("img/prop/type_2_4.png?a5f5b664")}
.game .bg_2 li:nth-child(10){background-image: url("img/prop/type_2_5.png?a47287b3")}
.game .bg_2 li:nth-child(11){background-image: url("img/prop/type_3_1.png?825e885f")}
.game .bg_2 li:nth-child(12){background-image: url("img/prop/type_3_2.png?a79a619e")}
.game .bg_2 li:nth-child(13){background-image: url("img/prop/type_3_3.png?2db72eee")}
.game .bg_2 li:nth-child(14){background-image: url("img/prop/type_3_4.png?dd17338f")}
.game .bg_2 li:nth-child(15){background-image: url("img/prop/type_3_5.png?f04af157")}
.game .bg_2 li:nth-child(16){background-image: url("img/prop/type_4_1.png?bc93a595")}
.game .bg_2 li:nth-child(17){background-image: url("img/prop/type_4_2.png?fecc7e3f")}
.game .bg_2 li:nth-child(18){background-image: url("img/prop/type_4_3.png?75e1cf71")}
.game .bg_2 li:nth-child(19){background-image: url("img/prop/type_4_4.png?cfe0eeaf")}
.game .bg_2 li:nth-child(20){background-image: url("img/prop/type_4_5.png?d2a9fd6e")}
.game .bg_2 li.cur{opacity: 0;}
.game .side_btn{position: absolute;width: 180px;right: 0;bottom: 20px;transform-origin: 100% 100%;z-index: 5}
.game .side_btn a{display: block;width: 100%;margin-bottom: 20px;}
.game .side_btn a img{display: block;width: 100%;}
.game .container{position: absolute;width: 1334px;height: 750px;top: 50%;left: 50%;z-index: 4}
.game .container .stage{display: none;}
.game .container .stage.cur{display: block;}
.game .level{background: url("img/level.png?d5cdbe31") no-repeat top center;width: 377px;height: 78px;margin: 20px auto 0;position: relative;}
.game .level .star_list{width: 515px;left: 50%;margin-left: -257.5px;display: flex;justify-content: space-between;position: absolute;top: 22px;}
.game .level .star_list li{background: url("img/star.png?f8b1946c") no-repeat top left;width: 91px;height: 94px;background-size: 300% 100%;}
.game .level .star_list li.cur{background-position: top center;}
.game .level .star_list li.get{background-position: top right;}
.game .tips{width: 460px;margin: 60px auto 0;font-size: 20px;color: #000000;line-height: 30px;text-align: center;}
.game .tips span{color: #FF7373;font-size: 28px;font-weight: bold;display: inline-block;}
.game .order_list li{position: absolute;width: 250px;height: 117px;top: 162px;font-size: 26px;color: #333333;box-sizing: border-box;padding: 0px 25px 15px;line-height: 30px;display: none;display: flex;flex-direction: column;justify-content: center;}
.game .order_list li span{color: #F5747E;}
.game .order_list li:first-child{background-image: url("img/order_1.png?22522ec4");left: 50%;margin-left: -600px;}
.game .order_list li:last-child{background-image: url("img/order_2.png?fa72ba1a");right: 50%;margin-right: -600px;}
.game .ice_box{position: absolute;width: 220px;height: 250px;left: 50%;margin-left: -110px;top: 50%;margin-top: -135px;}
.game .ice_box:before{content: "";position: absolute;width: 220px;height: 110px;left: 0;bottom: 0;background: url("img/cup_2.png?8c6945f3") no-repeat;z-index: 2}
.game .ice_box:after{content: "";position: absolute;width: 220px;height: 110px;left: 0;bottom: 0;background: url("img/cup_1.png?e7057b10") no-repeat;z-index: 0}
.game .ice_box li{position: absolute;width: 220px;height: 220px;top: 0;left: 0;z-index: 1}
.game .ice_box li img{opacity: 0;transition: .3s;display: block;width: 100%;}
.game .ice_box li.cur img{opacity: 1;}
.game .btn_box{display: flex;width: 640px;height: 90px;justify-content: space-between;left: 50%;margin-left: -320px;bottom: 40px;position: absolute;}
.game .btn_box a{display: block;width: 300px;height: 90px;}
.game .btn_box a img{display: block;width: 100%;}

.game .operation{position: absolute;width: 956px;height: 140px;bottom: 0;left: 50%;margin-left: -478px;background: #FFFFFF;box-sizing: border-box;border: 2px solid #000000;border-bottom: none;border-radius: 100px;}
.game .operation .delete{position: absolute;width: 120px;height: 120px;left: 16px;top: 50%;transform: translateY(-50%)}
.game .operation .next{position: absolute;width: 120px;height: 120px;right: 16px;top: 50%;transform: translateY(-50%)}
.game .operation .complete{position: absolute;width: 120px;height: 120px;right: 16px;top: 50%;transform: translateY(-50%);display: none;}
.game .operation .step_box{width: 660px;height: 100%;overflow: hidden;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%)}
.game .operation .step_list{height: 100%;width: 500%;position: relative;transition: .5s;left: 0%;}
.game .operation .step_list .t{font-weight: bold;color: #000000;white-space: nowrap;}
.game .operation .step_list .t p:first-child{font-size: 32px;}
.game .operation .step_list .t p:last-child{font-size: 26px;}
.game .operation .step_list>li{float: left;width: 20%;height: 100%;display: flex;align-items: center;justify-content: space-between;text-align: center;}
.game .operation .icon_list li{float: left;width: 110px;text-align: center;font-size: 18px;color: #333333;line-height: 20px;margin: 0;word-break: break-all;}
.game .operation .icon_list li .icon{width: 80px;height: 80px;margin: 0 auto 5px;box-sizing: border-box;border: 2px solid #000000;border-radius: 10px;position: relative;}
.game .operation .icon_list>li.no .icon:before{content: "";position: absolute;width: 100%;height: 100%;background: rgba(0,0,0,.2);top: 0;left: 0;}
.game .operation .icon_list>li.no .icon{overflow: hidden;}
.game .operation .icon_list>li.no{pointer-events: none;}
.game .operation .icon_list li.cur .icon{border-color: #FF9000}
.game .operation .icon_list li.cur{color: #FF9000}
.game .operation .icon_list li.cur .icon:before{content: "";position: absolute;background: url("img/ico_1.png?909609df") no-repeat top center;width: 30px;height: 30px;top: -8px;right: -8px;}
.game .operation .icon_list li .icon img{display: block;width: 100%;}

.game .set{position: absolute;width: 300px;left: 50%;margin-left: -150px;bottom: 40px;}
.game .set img{display: block;width: 100%;}

.game .give_list li{position: absolute;width: 180px;height: 60px;top: 270px;z-index: 6;}
.game .give_list li a{display: block;width: 100%;}
.game .give_list li img{display: block;width: 100%;}
.game .give_list li:first-child{left: 50%;margin-left: -565px;}
.game .give_list li:last-child{right: 50%;margin-right: -565px;}

.pop{position: absolute;left: 50%;top: 50%;box-sizing: border-box;z-index: 9;display: none}

.pop_completed{width: 432px;height: 432px;padding-top: 100px;text-align: center;}
.pop_completed .light{position: absolute;width: 432px;height: 432px;animation: Rotate 10s linear infinite;z-index: 1;top: 0;left: 0}
.pop_completed .ice_box{position: relative;display: block;width: 220px;height: 250px;margin: 0 auto;z-index: 2;}
.pop_completed .ice_box li{position: absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: 1}
.pop_completed .ice_box:before{content: "";position: absolute;width: 220px;height: 110px;left: 0;bottom: 0;background: url("img/cup_2.png?8c6945f3") no-repeat;z-index: 2}
.pop_completed .ice_box:after{content: "";position: absolute;width: 220px;height: 110px;left: 0;bottom: 0;background: url("img/cup_1.png?e7057b10") no-repeat;z-index: 0}
.pop_completed .txt{margin: 0 auto;position: relative;z-index: 3;text-shadow: 2px 2px 2px #000000}
.pop_completed .txt p:first-child{font-size: 40px;font-weight: bold;color: #FFFF00}
.pop_completed .txt p:last-child{font-size: 36px;font-weight: bold;color: #FFFFFF}
.pop_completed .shine{position: absolute;width: 202px;height: 183px;z-index: 4;animation:Roll .5s steps(3) infinite;top: 70px;left: 115px;background: url("img/shine.png?1ad33044") no-repeat;}

.pop_task{width: 847px;height: 624px;background: url("img/pop_task.png?1068eaa3") no-repeat top center;padding-top: 100px;padding-left: 70px;}
.pop_task .close{position: absolute;bottom: -80px;left: 50%;margin-left: -30px;}
.pop_task .task_list{width: 700px;margin: 0 auto;}
.pop_task .task_list li{display: flex;width: 700px;height: 80px;justify-content: space-between;align-items: center;font-size: 22px;color: #333333;margin-bottom: 20px;}
.pop_task .task_list li div{width: 80%;}
.pop_task .task_list li .h1{font-size: 26px;font-weight: bold;}
.pop_task .task_list li .go{display: block;background: url("img/go.png?182236d5") no-repeat bottom center;width: 139px;height: 60px;background-size: 100% 400%;}
.pop_task .task_list li .go.no_get{background-position: 0 -60px;}
.pop_task .task_list li .go.get{background-position: 0 -120px;}
.pop_task .task_list li .go.got{background-position: 0 0;}

.pop_award{width: 847px;height: 624px;background: url("img/pop_award.png?d33b3b6c") no-repeat top center;padding-top: 100px;}
.pop_award .close{position: absolute;bottom: -80px;left: 50%;margin-left: -30px;}
.pop_award .get_box a{position: absolute;background: url("img/get.png?5b5e2a2d") no-repeat bottom center;width: 134px;height: 47px;background-size: 100% 300%;top: 50%;margin-top: 200px;left: 50%;}
.pop_award .get_box a.get{background-position: 0 -47px;}
.pop_award .get_box a.got{background-position: 0 0;}
.pop_award .get_box a:nth-child(1){margin-left: -299px;}
.pop_award .get_box a:nth-child(2){margin-left: -129px;}
.pop_award .get_box a:nth-child(3){margin-left: 45px;}

.pop_tutorial{width: 847px;height: 624px;background: url("img/pop_tutorial.png?bbd3ddca") no-repeat top center;padding-top: 100px;padding-left: 70px;}
.pop_tutorial .close{position: absolute;bottom: -80px;left: 50%;margin-left: -30px;}
.pop_tutorial .pop_con{width: 680px;height: 500px;overflow-y: auto;margin: 0px auto;position: relative;left: -20px;}
.pop_tutorial .pop_con img{display: block;margin: 0 auto;}

.pop_rule{width: 847px;height: 624px;background: url("img/pop_rule.png?b964166d") no-repeat top center;padding-top: 100px;padding-left: 70px;}
.pop_rule .close{position: absolute;bottom: -80px;left: 50%;margin-left: -30px;}
.pop_rule .pop_con{width: 680px;height: 500px;overflow-y: auto;margin: 0px auto;font-size: 24px;line-height: 40px;color: #000000;text-align: justify;}
.pop_rule .h1{font-size: 32px;font-weight: bold;margin-bottom: 10px;}
.pop_rule .key_point{color: #E65248}
.pop_rule .rule_list{padding-right: 10px;}


.pop_recipe{width: 847px;height: 624px;background: url("img/pop_recipe.png?2534bf3e") no-repeat top center;padding-left: 30px;}
.pop_recipe .close{position: absolute;bottom: -80px;left: 50%;margin-left: -15px;}
.pop_recipe .tab{position: absolute;width: 194px;right: -194px;text-align: center;font-size: 26px;color: #333333;top: 140px;}
.pop_recipe .tab li{width: 100%;height: 60px;line-height: 60px;box-sizing: border-box;background: #FFC63C;border: 1px solid #000000;border-left: none;margin-bottom: 20px;border-top-right-radius: 50px;border-bottom-right-radius: 50px;position: relative;transition: .5s}
.pop_recipe .tab li.cur{left: -10px;background: #FFFFFF;}
.pop_recipe .pf_list{width: 85%;margin: 0 auto;}
.pop_recipe .pf_list .t{display: block;background: url("img/tab.png?16dd5bdd") no-repeat;width: 308px;height: 83px;background-size: 100% 500%;margin: 0 auto;}
.pop_recipe .pf_list>li{display: none;}
.pop_recipe .pf_list>li.cur{display: block;}
.pop_recipe .pf_list li:nth-child(1) .t{background-position: 0 -83px;}
.pop_recipe .pf_list li:nth-child(2) .t{background-position: 0 -166px;}
.pop_recipe .pf_list li:nth-child(3) .t{background-position: 0 0;}
.pop_recipe .pf_list li:nth-child(4) .t{background-position: 0 -249px;margin-bottom: 40px;}
.pop_recipe .pf_list li:nth-child(5) .t{background-position: 0 -332px;margin-bottom: 10px;}
.pop_recipe .pf_box{white-space: normal;font-size: 18px;line-height: 20px;color: #333333;position: relative;left: 20px;text-align: center;margin-top: 6px;}
.pop_recipe .pf_box>ul{float: left;}
.pop_recipe .pf_box>ul li{float: left;margin-right: 15px;width: 100px;position: relative;}
.pop_recipe .pf_box .left_list>li:before{content: "=";position: absolute;top: 30px;right: -14px;}
.pop_recipe .pf_box .right_list li:last-child{margin-right: 0}
.pop_recipe .pf_box .right_list li:not(:last-child):before{content: "+";position: absolute;top: 30px;right: -14px;}
.pop_recipe .pf_box .icon{width: 80px;height: 80px;margin: 0 auto 5px;box-sizing: border-box;border: 2px solid #000000;border-radius: 10px;position: relative;}
.pop_recipe .pf_box .icon.made:before{content: "";position: absolute;background: url("img/made.png?b9d3bb84") no-repeat top center;width: 80px;height: 80px;top: 0;left: 0;z-index: 1;}
.pop_recipe .pf_box .icon img{display: block;max-height: 100%;margin: 0 auto;}
.pop_recipe .pf_box.hide .icon img{opacity: 0}
.pop_recipe .pf_box.hide .icon:before{content: "?";width: 100%;height: 100%;font-size: 36px;font-weight: bold;position: absolute;top: 0;left: 0;line-height: 80px;}
.pop_recipe .pf_box.hide .right_list li div:last-child{opacity: 0}
.pop_recipe .pf_box:before{content: "";position: absolute;width: 100%;top: 85px;left: 0;opacity: 0}
.pop_recipe .pf_box.pf_1:before{content: "Sour and sugary like girls mood."}
.pop_recipe .pf_box.pf_2:before{content: "Special for chocolate lovers!"}
.pop_recipe .pf_box.pf_3:before{content: "Cool rainbow for hot summer."}
.pop_recipe .pf_box.pf_4:before{content: "Sweet sweet snow white."}
.pop_recipe .pf_box.hide:before{opacity: 1}
.pop_recipe .clue_box{position: absolute;font-size: 22px;color: #FFB811;bottom: -70px;}
.pop_recipe .clue_box a{display: inline-block;width: 60px;height: 60px;vertical-align: middle;margin: 0 5px;}
.pop_recipe .clue_box a img{display: block;width: 100%;}
.pop_recipe .pf_box .ice_box{width: 100%;height: 100%;}
.pop_recipe .pf_box .ice_box li{position: absolute;width: 100%;height: 100%;top: 0;left: 0;}
.pop_recipe .pf_list li:nth-child(3) .pf_box{margin: 70px auto;}
.pop_recipe .pf_list .tip{text-align: center;font-size: 28px;color: #333333;line-height: 36px;font-weight: bold;}
.pop_recipe .pf_list .link_box{width: 500px;height: 80px;line-height: 80px;margin: 20px auto 0;position: relative;box-sizing: border-box;border: 2px solid #000000;border-radius: 100px;overflow: hidden;padding-left: 20px;}
.pop_recipe .pf_list .link_box input{display: block;outline: none;border: none;font-size: 34px;font-weight: bold;height: 100%;width: 66%;}
.pop_recipe .pf_list .link_box .copy{position: absolute;background: url("img/copy.png?50058fe5") no-repeat top center;width: 145px;height: 80px;top: -1px;right: -1px;}
.pop_recipe .rule_list{height: 500px;overflow-y: auto;margin: 0px auto;font-size: 24px;line-height: 40px;color: #000000;text-align: justify;padding-right: 10px;}
.pop_recipe .rule_list .key_point{color: #E65248}

.pop_record{width: 847px;height: 624px;background: url("img/pop_record.png?3ad0792a") no-repeat top center;padding-left: 30px;}
.pop_record .close{position: absolute;bottom: -80px;left: 50%;margin-left: -15px;}
.pop_record .tab{position: absolute;width: 194px;right: -194px;text-align: center;font-size: 26px;color: #333333;top: 150px;}
.pop_record .tab li{width: 100%;height: 60px;line-height: 60px;box-sizing: border-box;background: #FFAFAF;border: 1px solid #000000;border-left: none;margin-bottom: 20px;border-top-right-radius: 50px;border-bottom-right-radius: 50px;position: relative;transition: .5s}
.pop_record .tab li.cur{left: -10px;background: #FFFFFF;}
.pop_record .record_list{width: 85%;margin: 0 auto;}
.pop_record .record_list .t{display: block;background: url("img/tab_1.png?a3e51715") no-repeat;width: 308px;height: 83px;background-size: 100% 400%;margin: 0 auto;}
.pop_record .record_list>li{display: none;}
.pop_record .record_list>li.cur{display: block;}
.pop_record .record_list li:nth-child(1) .t{background-position: 0 -166px;}
.pop_record .record_list li:nth-child(2) .t{background-position: 0 -83px;}
.pop_record .record_list li:nth-child(3) .t{background-position: bottom center;}
.pop_record .record_list li:nth-child(4) .t{background-position: top center;}
.pop_record .record_list .content{display: block;width: 680px;height: 420px;margin: 30px auto 0;box-sizing: border-box;overflow-y: auto;font-size: 22px;color: #333333;}
.pop_record .list_1 li{float: left;width: 330px;height: 125px;border-radius: 10px;box-sizing: border-box;border: 1px solid #000000;overflow: hidden;margin-bottom: 20px;vertical-align: top;}
.pop_record .list_1 li:nth-child(odd){margin-right: 20px;}
.pop_record .list_1 li div{display: flex;align-items: center;justify-content: space-between;height: 33%;padding: 0 15px;}
.pop_record .list_1 li div .d{font-weight: bold;}
.pop_record .list_1 li div:nth-child(1){border-radius: 10px;border: 1px solid #000000;}
.pop_record .list_1 li div i{display: block;width: 38px;height: 38px;}
.pop_record .list_1 li div i.yes{background-image: url("img/yes.png?50631a8e")}
.pop_record .list_1 li div i.no{background-image: url("img/no.png?17ea2c78")}
.pop_record .list_2{width: 100%;height: 100%;box-sizing: border-box;border: 1px solid #000000;overflow-y: auto;border-radius: 20px;}
.pop_record .list_2 li{height: 70px;line-height: 30px;display: flex;justify-content: space-between;align-items: center;padding: 0 20px}
.pop_record .list_2 li p:first-child{width: 72%}
.pop_record .list_2 li:nth-child(odd){background: #F8F4F4}
.pop_record .list_2 li span{color: #ED7A5C}
.pop_record .list_3{width: 100%;height: 100%;box-sizing: border-box;border: 1px solid #000000;overflow-y: auto;border-radius: 20px;}
.pop_record .list_3 li{height: 60px;line-height: 60px;padding-left: 95px;position: relative;padding-right: 30px;overflow: hidden;}
.pop_record .list_3 li:before{content: "";position: absolute;background: url("img/star_1.png?5c817c39") no-repeat top center;width: 42px;height: 40px;background-size: 100% 200%;top: 9px;left: 35px;}
.pop_record .list_3 li.cur:before{background-position: bottom center;}
.pop_record .list_3 li:nth-child(odd){background: #F8F4F4}
.pop_record .list_3 li:nth-child(4){height: calc(100% - 240px)}
.pop_record .list_3 li p{border-top: 1px solid #000000;line-height: 30px;padding-top: 10px;}
.pop_record .list_3 li p span:nth-child(1){font-weight: bold;}
.pop_record .list_3 li p span{font-size: 18px;}
.pop_record .list_4{width: 100%;height: 100%;box-sizing: border-box;border: 1px solid #000000;overflow-y: auto;border-radius: 20px;}
.pop_record .list_4 li{height: 70px;line-height: 30px;display: flex;justify-content: space-between;align-items: center;padding: 0 20px}
.pop_record .list_4 li p:first-child{width: 72%}
.pop_record .list_4 li:nth-child(odd){background: #F8F4F4}
.pop_record .list_4 li span{color: #ED7A5C}
.pop_record .record_list .tip{text-align: center;font-size: 22px;margin-top: 20px;}

.pop_result{width: 550px;height: 300px;background: #FFFFFF;border-radius: 20px;text-align: center;font-size: 28px;color: #30373A}
.pop_result .h1{font-size: 32px;color: #ED7A5C;font-weight: bold;}
.pop_result .btn_box{width: 420px;display: flex;align-items: center;justify-content: space-between;margin: 0 auto;}
.pop_result .btn_box a{display: block;width: 200px;height: 70px;font-size: 40px;font-weight: bold;color: #FFFFFF;line-height: 70px;box-sizing: border-box;border: 2px solid #4C4C4C;border-radius: 50px;text-shadow: 2px 2px 2px #000000;}
.pop_result .btn_box a:nth-child(1){background: #FFCA4F}
.pop_result .btn_box a:nth-child(2){background: #786A68}
.pop_result input{display: block;width: 500px;height: 70px;font-size: 28px;box-sizing: border-box;border: 2px solid #000000;border-radius: 20px;outline: none;padding: 0 10px;margin: 20px auto;}
.pop_result .step{display: none;}
.pop_result .step.cur{display: block;}
.pop_result .step_1 .h1{margin: 0px auto 10px;}
.pop_result .step_1 .btn_box{margin: 20px auto 0;}
.pop_result .step_2 .h1{margin-top: 40px}
.pop_result .step_3 .h1{margin: 80px auto 50px;}
.pop_result .step_3 .btn_box{justify-content: center;}

.pop_collect_result{width: 550px;height: 300px;background: #FFFFFF;border-radius: 20px;text-align: center;font-size: 28px;color: #30373A}
.pop_collect_result .h1{font-size: 40px;color: #ED7A5C;font-weight: bold;}
.pop_collect_result .prev{display: block;width: 200px;height: 70px;font-size: 40px;font-weight: bold;color: #FFFFFF;line-height: 70px;box-sizing: border-box;border: 2px solid #4C4C4C;border-radius: 50px;text-shadow: 2px 2px 2px #000000;background: #786A68;margin: 30px auto 0;}
.pop_collect_result .state{display: none;}
.pop_collect_result .state.cur{display: block;}
.pop_collect_result .err .h1{margin: 60px auto 10px;}
.pop_collect_result .suc .h1{margin: 70px auto 50px;}

.pop_tip{width: 550px;height: 300px;background: #FFFFFF;border-radius: 20px;text-align: center;font-size: 28px;color: #30373A;}
.pop_tip .h1{font-size: 32px;color: #ED7A5C;font-weight: bold;margin: 50px auto 50px;}
.pop_tip .prev{display: block;width: 200px;height: 70px;font-size: 40px;font-weight: bold;color: #FFFFFF;line-height: 70px;box-sizing: border-box;border: 2px solid #4C4C4C;border-radius: 50px;text-shadow: 2px 2px 2px #000000;background: #786A68;margin: 30px auto 0;}


.pop_sauce{width: 550px;height: 300px;background: #FFFFFF;border-radius: 20px;text-align: center;font-size: 28px;color: #30373A}
.pop_sauce .h1{font-size: 40px;color: #ED7A5C;font-weight: bold;margin: 50px auto 40px;}
.pop_sauce .btn_box{width: 420px;display: flex;align-items: center;justify-content: space-between;margin: 0 auto;}
.pop_sauce .btn_box a{display: block;width: 200px;height: 70px;font-size: 40px;font-weight: bold;color: #FFFFFF;line-height: 70px;box-sizing: border-box;border: 2px solid #4C4C4C;border-radius: 50px;text-shadow: 2px 2px 2px #000000;}
.pop_sauce .btn_box a:nth-child(1){background: #FFCA4F}
.pop_sauce .btn_box a:nth-child(2){background: #786A68}

.pop_collect{width: 550px;text-align: center;}
.pop_collect .h1{font-size: 32px;font-weight: bold;color: #000000;margin: 50px auto 45px;line-height: 50px;}
.pop_collect .h1 span{color: #ED7A5C}
.pop_collect .look{display: block;width: 200px;height: 70px;position: relative;line-height: 70px;font-size: 40px;color: #FFFFFF;border-radius: 50px;box-sizing: border-box;border: 2px solid #47241B;margin: 0 auto;text-shadow: 2px 2px 2px #000000;background: #FFCA4F;font-weight: bold;z-index: 2;}
.pop_collect .mail{position: absolute;width: 570px;height: 179px;left: 50%;bottom: -100px;margin-left: -285px;z-index: 1;}
.pop_collect .content{position: relative;width: 100%;height: 240px;background: #FFFFFF;border-radius: 20px;transition: .5s}
.pop_collect .content.cur{height: 460px;margin-top: -40px;}
.pop_collect .step_2{display: none;}
.pop_collect .icon_box{width: 532px;height: 303px;background: url("img/icon_box.png?0a0cc339") no-repeat top center;margin: 8px auto 0;position: relative;}
.pop_collect .icon_box img{position: absolute;width: 220px;height: 250px;left: 50%;top: 50%;transform: translate(-50%,-50%);z-index: 1}
.pop_collect .icon_box .name{position: absolute;font-size: 22px;font-weight: bold;color: #000000;top: 28px;left: 30px;}
.pop_collect .icon_box .author{position: absolute;font-size: 22px;font-weight: bold;color: #000000;bottom: 28px;right: 30px;}
.pop_collect .pf_box{display: flex;height: 120px;justify-content: center;font-size: 18px;color: #333333;text-align: center;margin-top: 10px;line-height: 20px;white-space: normal;}
.pop_collect .pf_box li{margin: 0 10px;position: relative;width: 100px;}
.pop_collect .pf_box li:not(:last-child):before{content: "+";position: absolute;top: 24px;right: -17px;}
.pop_collect .pf_box .icon{width: 80px;height: 80px;margin: 0 auto 5px;box-sizing: border-box;border: 2px solid #000000;border-radius: 10px;position: relative;}
.pop_collect .pf_box .icon img{display: block;max-height: 100%;margin: 0 auto;}
.pop_collect .btn_box{display: flex;width: 420px;justify-content: space-between;margin: 40px auto 0}
.pop_collect .btn_box a{display: block;width: 200px;height: 70px;font-size: 40px;font-weight: bold;color: #FFFFFF;line-height: 70px;box-sizing: border-box;border: 2px solid #4C4C4C;border-radius: 50px;text-shadow: 2px 2px 2px #000000;}
.pop_collect .btn_box a:nth-child(1){background: #FFCA4F}
.pop_collect .btn_box a:nth-child(2){background: #786A68}
.pop_collect .ice_box{position: absolute;width: 220px;height: 250px;left: 50%;margin-left: -110px;top: 50%;margin-top: -135px;}
.pop_collect .ice_box:before{content: "";position: absolute;width: 220px;height: 110px;left: 0;bottom: 0;background: url("img/cup_2.png?8c6945f3") no-repeat;z-index: 2}
.pop_collect .ice_box:after{content: "";position: absolute;width: 220px;height: 110px;left: 0;bottom: 0;background: url("img/cup_1.png?e7057b10") no-repeat;z-index: 0}


.pop_faq{width: 847px;height: 624px;background: url("img/pop_faq.png?45685b11") no-repeat top center;padding-top: 100px;padding-left: 70px;}
.pop_faq .close{position: absolute;bottom: -80px;left: 50%;margin-left: -15px;}
.pop_faq .content{padding: 20px 40px 0;display: none;}
.pop_faq .content.cur{display: block;}
.pop_faq .question{font-size: 32px;font-weight: bold;color: #000000;line-height: 50px;}
.pop_faq ul{margin: 30px 0 40px}
.pop_faq ul li{margin-bottom: 20px;font-size: 32px;line-height: 40px;}
.pop_faq ul li i{display: inline-block;width: 38px;height: 38px;margin-right: 10px;position: relative;background-image: url("img/ico.png?0c7e0c76");vertical-align: middle;margin-top: -6px;}
/* .pop_faq ul li i.cur{background-image: url("img/yes.png?50631a8e")} */
.pop_faq ul li.cur i{background-image: url("img/yes.png?50631a8e")}
.pop_faq .submit{display: block;width: 300px;margin: 0 auto;position: relative;left: -20px;}
.pop_faq .submit img{display: block;width: 100%}

.pop_faq_result{width: 550px;height: 300px;background: #FFFFFF;border-radius: 20px;text-align: center;font-size: 28px;color: #30373A}
.pop_faq_result .h1{font-size: 40px;color: #ED7A5C;font-weight: bold;margin: 60px auto 10px;}
.pop_faq_result .pop_con a{display: block;width: 200px;height: 70px;font-size: 40px;font-weight: bold;color: #FFFFFF;line-height: 70px;box-sizing: border-box;border: 2px solid #4C4C4C;border-radius: 50px;text-shadow: 2px 2px 2px #000000;background: #786A68;margin: 30px auto 0;}
.pop_faq_result .state{display: none;}
.pop_faq_result .state.cur{display: block;}

.ftui_plugin-wishgamer-login .myg_login_box{top: 50%;transform: translateY(-50%);}

.pop_bd{width: 600px;height: 350px;background: #FFFFFF;border-radius: 20px;text-align: center;font-size: 28px;color: #30373A;padding: 0 20px;}
.pop_bd .tips{font-size: 32px;font-weight: bold;color: #000000;margin: 20px auto 30px;}
.pop_bd .tip{font-size: 22px;color: #EE8266;margin: 30px auto 0;line-height: 30px;}
.pop_bd .btns{width: 420px;display: flex;align-items: center;justify-content: space-between;margin: 0 auto;}
.pop_bd .close{display: none;}
.pop_bd .btns a{display: block;width: 200px;height: 70px;font-size: 26px;font-weight: bold;color: #FFFFFF;line-height: 70px;box-sizing: border-box;border: 2px solid #4C4C4C;border-radius: 50px;text-shadow: 2px 2px 2px #000000;}
.pop_bd .btns a:nth-child(1){background: #FFCA4F}
.pop_bd .btns a:nth-child(2){background: #786A68;}

.pop_confirm_bd{width: 600px;height: 350px;background: #FFFFFF;border-radius: 20px;text-align: center;font-size: 28px;color: #30373A;padding: 0 20px;}
.pop_confirm_bd .tips{font-size: 32px;font-weight: bold;color: #000000;margin: 40px auto 30px;}
.pop_confirm_bd .tip{font-size: 22px;color: #EE8266;margin: 30px auto 0;line-height: 30px;}
.pop_confirm_bd .btns{width: 420px;display: flex;align-items: center;justify-content: space-between;margin: 0 auto;}
.pop_confirm_bd .close{display: none;}
.pop_confirm_bd .btns a{display: block;width: 200px;height: 70px;font-size: 26px;font-weight: bold;color: #FFFFFF;line-height: 70px;box-sizing: border-box;border: 2px solid #4C4C4C;border-radius: 50px;text-shadow: 2px 2px 2px #000000;}
.pop_confirm_bd .btns a:nth-child(1){background: #FFCA4F}
.pop_confirm_bd .btns a:nth-child(2){background: #786A68;}

@keyframes Rotate {
    0%{transform: rotate(0deg)}
    100%{transform: rotate(360deg)}
}
@-webkit-keyframes Rotate {
    0%{transform: rotate(0deg)}
    100%{transform: rotate(360deg)}
}

@-webkit-keyframes Roll {
    from { background-position-x:0%  }
    to { background-position-x:100% }
}
@keyframes Roll {
    from { background-position-x:0%  }
    to { background-position-x:100% }
}