@charset "utf-8";
/* CSS Document */
.wrap{background:url(../images/innerBg.jpg) center 0 no-repeat #000; padding-bottom:50px;padding-top: 480px;}
.guess-content{width: 1200px;margin: 0 auto;padding-bottom: 58px;padding-top: 10px;background: #1a0b5d;border-radius: 10px;position: relative;}
.guess-content h1{text-align: center;width: 100%;height: 56px;line-height: 56px;background: #8be902;margin-top: -10px;border-radius: 10px;font-size: 24px;color: #2f440e;}
.guess-rule{margin-left: 127px;padding-top: 30px;}
.guess-rule p{line-height: 45px;font-size: 28px;color: #ff00ff;font-weight: bold;}
.guess-rule ol li{line-height: 30px;font-size: 16px;color: #fff;}

.pk-wrap{width: 1000px;margin: 30px auto 0;position: relative;z-index: 3;background: #fff;border: 6px solid #8b68d9;padding-bottom: 35px;padding-top: 45px;box-sizing: border-box;border-bottom: 0;}
.pk-list{margin-left: 70px;width: 880px;height: 840px;position: relative;}
.pk-list span{display: block;position: relative;width: 84px;height: 33px;}
.pk-list span.sel-R::after{content: "";display: block;position: absolute;width: 84px;height: 33px;background: url(../images/icon_R.png) center no-repeat;left: 0;top: 0;}
.R1{position: absolute;left: 0;top: 0;}
.R1 div{width: 157px;height: 84px;background:url(../images/pk_line1.png) right center no-repeat;margin-bottom: 18px;}
.R2_2 div{width: 157px;height: 84px;background:url(../images/pk_line1.png) right center no-repeat;margin-bottom: 18px;}
.pk-list select{width: 84px;height: 33px;border: 1px solid #4669ea;}
.R1 div img:first-child{margin-bottom: 18px;}
.pk-list img,.pk-list select{display: block;}
.R2_1 div span:first-child,.R2_1 div select:first-child{margin-bottom: 70px;}
.R3_2 div span:first-child,.R3_2 div select:first-child{margin-bottom: 70px;}
.R2_2 div span:first-child,.R2_2 div select:first-child{margin-bottom: 18px;}
.R3_1 div span:first-child,.R3_1 div select:first-child{margin-bottom: 170px;}
.R3_3 div span:first-child,.R3_3 div select:first-child{margin-bottom: 170px;}
.R3_4 div span:first-child,.R3_4 div select:first-child{margin-bottom: 170px;}
.R4 div span:first-child,.R4 div select:first-child{margin-bottom: 345px;}
.R2_1{position: absolute;left: 158px;top: 26px;}
.R2_2{position: absolute;left: 0px;top: 573px;}
.R3_1{position: absolute;left: 315px;top: 75px;}
.R3_2{position: absolute;left: 158px;top: 496px;}
.R3_3{position: absolute;left: 315px;top: 550px;}
.R3_4{position: absolute;left: 475px;top: 450px;}
.R4{position: absolute;left: 635px;top: 175px;}
.R_final{position: absolute;left: 795px;top: 362px;}
.R2_1 div{width: 157px;height: 136px;background:url(../images/pk_line2.png) right center no-repeat;margin-bottom: 70px;}
.R3_2 div{width: 157px;height: 136px;background:url(../images/pk_line2.png) right center no-repeat;margin-bottom: 70px;}
.R3_1 div{width: 318px;height: 232px;background:url(../images/pk_line3.png) right center no-repeat;}
.R3_3 div{width: 157px;height: 232px;background:url(../images/pk_line5.png) right center no-repeat;}
.R3_4 div{width: 157px;height: 232px;background:url(../images/pk_line5.png) right center no-repeat;}
.R4 div{width: 157px;height: 411px;background:url(../images/pk_line4.png) right center no-repeat;}

.R1 div.R1_w_up{background-image: url(../images/pk_line1_01.png);}
.R1 div.R1_w_down{background-image: url(../images/pk_line1_02.png);}

.R2 div.R2_w_up{background-image: url(../images/pk_line2_01.png);}
.R2 div.R2_w_down{background-image: url(../images/pk_line2_02.png);}

.R2_2 div.R1_w_up{background-image: url(../images/pk_line1_01.png);}
.R2_2 div.R1_w_down{background-image: url(../images/pk_line1_02.png);}

.R3_1 div.R3_w_up{background-image: url(../images/pk_line3_01.png);}
.R3_1 div.R3_w_down{background-image: url(../images/pk_line3_02.png);}

.R3_4 div.R5_w_up{background-image: url(../images/pk_line5_01.png);}
.R3_4 div.R5_w_down{background-image: url(../images/pk_line5_02.png);}

.R3_2 div.R2_w_up{background-image: url(../images/pk_line2_01.png);}
.R3_2 div.R2_w_down{background-image: url(../images/pk_line2_02.png);}

.R3_3 div.R5_w_up{background-image: url(../images/pk_line5_01.png);}
.R3_3 div.R5_w_down{background-image: url(../images/pk_line5_02.png);}

.R4 div.R4_w_up{background-image: url(../images/pk_line4_01.png);}
.R4 div.R4_w_down{background-image: url(../images/pk_line4_02.png);}



.pk-btn{display: flex;width: 500px;margin: 50px auto 0;justify-content: space-between;}
.pk-btn a,.pk-btn input{display: block;background:#4d3de1;width: 206px;height: 58px;border: 5px solid #2b1bbd;font-size: 22px;font-weight: bold;color: #fff;border-radius: 10px;line-height: 58px;text-align: center;box-sizing: content-box;}
.pk-btn a.submit-end{color: #808080;background: #4d4d4d;border: 5px solid #1a1a1a;}


.box-wrap{width: 1000px;margin: 0 auto;position: relative;background:#8b68d9;padding-bottom: 10px;}
.bar{width: 884px;height: 20px;position: relative;margin: 0 auto 20px;background: #2b1bbd;border-radius: 100px;}
.bar span{display: block;position: absolute;left: 0;top: 0;height: 20px;background: #d9b57a;border-radius: 100px;}
.box{width: 884px;margin: 0 auto;padding-top: 7px;display: flex;justify-content: space-between;}
.box div{width: 12.5%;position: relative;}
.box div p{text-align: center;line-height: 22px;height: 44px;color: white;font-size: 12px;font-weight: bold;}
.box div.box-active a::after{background: url(../images/award_circle.png) no-repeat;width: 41px;height: 21px;position: absolute;left: 50%;margin-left: -20.5px; top: 65px;content: "";display: block;}
.box div.box-fn a::after{background: url(../images/award_circle2.png) no-repeat;width: 41px;height: 21px;position: absolute;left: 50%;margin-left: -20.5px; top: 65px;content: "";display: block;}
.box div a{display: block;width: 80px;height: 80px;margin: 0 auto 10px;position: relative;border: 1px solid #fff;border-radius: 100px;}
.box div.box-active a{border: 1px solid #00ffff;}
.box div a img{display: block;width: 80px;height: 80px;}

.box div:last-child{margin-right: 0;}
.bar span{display: block;position: absolute;background:#00ffff;left: 0;top: 0;height: 20px;}

.box-num{width: 884px;margin: 0 auto;display: flex;justify-content: space-between;height: 88px;margin-bottom: 20px;}
.box-num div{width: 12.5%;text-align: center;line-height: 88px;position: relative;font-size: 12px;color: #2a1bbd;font-weight: bold;}
.box-num div::after{display: block;content: "";background: url(../images/award_dot.png) no-repeat;position: absolute;width: 19px;height: 27px;left: 50%;margin-left: -9.5px;bottom: 0;}
.box-num div.active::after{background-position: 0 -27px;}

.award-wrap h2{width: 400px;height: 40px;margin: 0 auto 35px;background: #4669ea;text-align: center;color: white;font-size: 28px;position: relative;line-height: 40px;}
#sliver_box{margin-bottom: 50px;}
#sliver_box h2::after{display: block;content: "";position: absolute;background: url(../images/sliver_box.png) no-repeat;width: 85px;height: 73px;position: absolute;left: 40px;top: -21px;}
#gold_box h2::after{display: block;content: "";position: absolute;background: url(../images/gold_box.png) no-repeat;width: 85px;height: 73px;position: absolute;left: 40px;top: -21px;}
.pk-tips{text-align: center;font-size: 16px;line-height: 60px; color: #ff00ff;font-weight: bold;}

.award-wrap{width: 988px;margin: 0 auto;border: 6px solid #8b68d9;background: #2b1bbd;padding: 50px 0;position: relative;}
.award-wrap::before{display: block;content: "";background: url(../images/girl_left.png) no-repeat;top: 400px;left: -100px;position: absolute;width: 206px;height: 390px;}
.award-wrap::after{display: block;content: "";background: url(../images/boy_right.png) no-repeat;top: 400px;right: -100px;position: absolute;width: 207px;height: 385px;}
.award-img{display: block;margin: 0 auto 30px;}
.award-wrap ul{width: 732px;margin: 0 auto;display: flex;justify-content: space-between;flex-wrap: wrap;}
.award-wrap ul li{width: 25%;height: 170px;display: flex;justify-content: center;align-items:start;}
.award-btn a{display: block;width: 240px;height: 79px;}
.award-wrap p{text-align: center;line-height: 30px;font-size: 16px;color: #ffff00;font-weight: bold;margin-bottom: 20px;}
.award-btn{display: flex;width: 520px;margin: 0 auto;justify-content: space-between;}
.award-btn a{display: block;width: 206px;height: 58px;text-align: center;line-height: 58px;font-size: 22px;font-weight: bold;border: 5px solid #4669ea;border-radius: 8px;}
.lottery-btn{background: #ff00ff;color: white;}
.record-btn{background:#00ffff;color: #2a1bbd;}
.pop-wrap{display: none;min-width: 600px;border: 8px solid #2b1bbd;background: white;padding: 50px;}
.pop-wrap h2{font-size: 30px;color: #ff00ff;text-align: center;line-height: 45px;}
#pop_award p{text-align: center;font-size: 16px;color: #0d0d0d;line-height: 45px;padding: 30px 0;font-weight: bold;}
#pop_award p b{font-size: 30px;color: #ff00ff;}
#pop_award img{display: block;margin: 0 auto;}
#pop_record p{text-align: center;line-height: 50px;font-size: 20px;color: #656565;}
#pop_record ul{margin: 0 auto;width: 420px;padding-top: 10px;}
#pop_record ul li{display: flex;height: 60px;justify-content: space-between;}
#pop_record ul li p{font-size: 18px;color: #0d0d0d;line-height: 60px;}

.club-content,.rule-content,.events-content{width: 1200px;margin: 0 auto;padding-bottom: 58px;background: #1a0b5d;position: relative;}
.wrap h1{text-align: center;width: 100%;height: 60px;line-height: 60px;background: url(../images/inner_title.png) no-repeat;font-size: 24px;color: #fff;margin-bottom: 60px;border-radius: 0;}
.club-nav{width: 1056px;margin: 0 auto;}
.club-nav a{display: block;width: 200px;height: 180px;border: 5px solid #4d3de1;margin: 0 25px 20px;font-size: 18px;background-color: #fff;background-position: center;background-repeat: no-repeat;position: relative;}
.club-nav a p{position: absolute;width: 100%;height: 50px;line-height: 50px;font-size: 16px;color: black;font-weight: bold;left: 0;bottom: 0;text-align: center;}

.club-nav a:hover,.club-nav a.cur{border: 5px solid #00ffff;text-decoration: none;}
.club-nav a.club-1{background-image: url(../images/club_logo1.png);}
.club-nav a.club-2{background-image: url(../images/club_logo2.png);}
.club-nav a.club-3{background-image: url(../images/club_logo3.png);}
.club-nav a.club-4,.club-nav a.club-8{background-image: url(../images/club_logo4.png);}
.club-nav a.club-5{background-image: url(../images/club_logo5.png);}
.club-nav a.club-7{background-image: url(../images/club_logo7.png);}
.club-nav a.club-6{background-image: url(../images/club_logo6.png);}

.player-wrap{clear: both;width: 1000px;margin: 0 auto;}
.team_img{width:324px; height:433px;position: relative;overflow: hidden;}
.club1 .team_img{background: url(../images/club_logo1.jpg) center no-repeat;}
.club2 .team_img{background: url(../images/club_logo2.jpg) center no-repeat;}
.club3 .team_img{background: url(../images/club_logo3.jpg) center no-repeat;}
.club4 .team_img{background: url(../images/club_logo4.jpg) center no-repeat;}
.club5 .team_img{background: url(../images/club_logo5.jpg) center no-repeat;}
.club6 .team_img{background: url(../images/club_logo6.jpg) center no-repeat;}
.club7 .team_img{background: url(../images/club_logo7.jpg) center no-repeat;}
.club8 .team_img{background: url(../images/club_logo8.jpg) center no-repeat;}
.team_img::after{display: block;content: "";position: absolute;left: 0;top: 0;background:url(../images/player_level_3.png) no-repeat;width:324px; height:433px;background-size: 100%;}

.five-wrap img{display: block;margin: 0 auto 30px;}

.rule-content p{width: 960px;margin: 0 auto;font-size: 16px;color: #fff;font-weight: bold;line-height: 32px;}
.rule-content p b{color: #ff00ff;}
.rule-content img{display: block;margin: 50px auto;}
.event{padding-bottom: 40px;width: 1090px;margin: 0 auto;position: relative;}
.event h2{margin-left: 412px;padding-left: 108px;background: url(../images/event_icon.png) left top no-repeat;font-size: 24px;color: #a483fb;line-height: 40px;height: 110px;}
.event h2 span{font-size: 32px;}

.event h3{width: 90px;height: 30px;text-align: center;line-height: 30px;margin: 0 auto;background: #ffe400;font-size: 16px;color: #6d6d6d;}
.event p{font-size: 16px;color: #1a1a1a;line-height: 45px;width: 1000px;font-weight: bold;background: #4669ea;}
.event p b{color: #841714;}
#pop_info h2{margin-bottom: 20px;color: #ff00ff;}
.pop-info{margin: 0 auto 40px;display: flex;height: 55px;justify-content: center;width: 90%;}
.pop-info p{width: 352px;font-size: 22px;color: white;font-weight: bold;line-height: 50px;margin: 0 auto;background: #4669ea;text-align: center;}
.pop-info p#sel-region{background: none;color: #313131;}
.pop-info select{display: block;width: 352px;height: 47px;border: 2px solid white;background:#4669ea;color: white;font-size: 22px;text-align: center;}
.info-btn{display: block;width: 206px;height: 58px;color: white;font-size: 22px;font-weight: bold;background: #4d3de1;border: none; border: 5px solid #2b1bbd;margin: 0 auto;border-radius: 10px;}