@charset "utf-8";
body{ margin:0; padding:0; font-size:14px; font-family:"Microsoft Yahei",Arial, Helvetica, sans-serif; overflow-x:hidden; -webkit-text-size-adjust:none; }
div,p,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,input,select,textarea,table,td{ margin:0; padding:0;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
area,span{outline:none;}
img{ border:0;}
ol,ul{list-style:none;}
a{ font-family:"Microsoft Yahei",Arial, Helvetica, sans-serif;text-decoration:none;outline:none; cursor:pointer;}

.wrap{ position: relative; width: 25.6rem; background-color: #7a221a; overflow: hidden;}
/* section-head */
.section-head{ position: relative; width: 25.6rem; height: 14.43rem; overflow: hidden; background: url(../images/section-head-bg.jpg) no-repeat; background-size: 100% auto;}
.logo{ position: absolute; top: 0; left: 0; width: 6.22rem;}
.log-box{position: absolute; right: 3.16rem; top: 0.48rem; width: 11.4rem; height: 0.51rem; font-size: 0.26rem; line-height: 0.48rem; color: #ffe7a9; text-align: right;}
.btn-login,.btn-logout{cursor: pointer;}
.logout{ display: none; }
.website{ position: absolute; top: 0.48rem; right: 0.6rem; width: 2.32rem; height: .51rem; background: url(../images/website.png) no-repeat; background-size: 100% auto;}
.website:hover{ background-position: 0 -.51rem; }
.time{ position: absolute; right: 0.4rem; bottom: 1.5rem; width: 5.96rem;}
.slogan{ position: absolute; right: 0.4rem; bottom: 1.5rem; width: 8.39rem;}
.head-arrow{ position: absolute; bottom: 2rem; left: 50%; margin-left: -0.3rem; width: 0.6rem; animation: drop 1.3s ease-in-out infinite alternate; }
@keyframes drop {
	from{opacity: 0.3;transform:translate(0,0);}
	to{opacity: 1;transform:translate(0,0.3rem);}
}
/* nav */
#bot-nav{ display: flex; position: absolute; left: 0; bottom: 0; width: 25.6rem; height: 1.51rem; justify-content: center; align-items: center; background: url(../images/bot-nav.png) no-repeat; background-size: 100% auto;}
#bot-nav a{ position: relative; width: 3.4rem; height: 1.51rem; }
#bot-nav a:after{ content: ""; position: absolute; top: 0; right: 0; width: 0.02rem; height: 1.51rem; background: url(../images/bot-line.png) no-repeat; background-size: 100% auto;}
#bot-nav a:last-child:after{ display: none; }
#bot-nav a span{ position: absolute; top: -.18rem; left: 0; width: 100%; height: 100%; }
#bot-nav .n1 span{ background: url(../images/nav1.png) no-repeat 0 0; background-size: 100% auto;}
#bot-nav .n2 span{ background: url(../images/nav2.png) no-repeat 0 0; background-size: 100% auto;}
#bot-nav .n3 span{ background: url(../images/nav3.png) no-repeat 0 0; background-size: 100% auto;}
#bot-nav .n4 span{ background: url(../images/nav4.png) no-repeat 0 0; background-size: 100% auto;}
#bot-nav .n5 span{ background: url(../images/nav5.png) no-repeat 0 0; background-size: 100% auto;}
#bot-nav .n6 span{ background: url(../images/nav6.png) no-repeat 0 0; background-size: 100% auto;}
#bot-nav a:hover:before, #bot-nav a.on:before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/nav-on.png) no-repeat 0 0; background-size: 100% auto;}
#bot-nav a:hover span, #bot-nav a.on span{ background-position: 0 -1.51rem; }

.body-wrap{ position: relative; width: 25.6rem; height: 81.28rem; background: url(../images/body-bg.jpg) no-repeat; background-size: 100% auto; overflow: hidden;}
.section-box{ position: relative; width: 25.6rem; overflow: hidden;}
/* section-createrole */
#section-createrole{ height: 13.8rem;}
.btn-rule, .btn-rule2{ position: absolute; top: 3.5rem; left: 16.8rem; z-index: 5; font-size: .24rem; line-height: 0.26rem; color: #fff; text-decoration: underline; cursor: pointer;}

.section-t{ display: block; height: 2.66rem; margin: 0 auto;}
#section-createrole .section-t{ margin-top: 0.52rem;}
.kafu-time{ position: relative; width: 4.55rem; height: .67rem; margin: 0 auto; margin-top: 0.1rem; background: url(../images/kaifu-time.png); background-size: 100% auto;}
.kafu-time span{ position: absolute; top: .15rem; left: 1.9rem; width: 2.36rem; height: .37rem; line-height: 0.37rem; font-size: 0.3rem; color: #3b50a1; }
.prize-createrole{ position: relative; width: 9.44rem; height: 9.43rem; margin: 0.3rem auto 0; background: url(../images/prize-createrole.png?v1) no-repeat; background-size: 100% auto;}
.btn-createrole{ position: absolute; left: 50%; top: 6.85rem; transform: translate3d(-50%,0,0); width: 3.75rem; height: 1.10rem; background: url(../images/btn-createrole.png) no-repeat; background-size: 100% auto; cursor: pointer; }
/* section-tequan */
#section-tequan{ height: 5.8rem;}
.prize-tequan{ display: block; width: 9.62rem; margin: 0.42rem auto 0;}
/* section-xinfu */
#section-xinfu{ height: 6.8rem;}
.prize-xinfu{ display: block; width: 10.11rem; margin: 0.42rem auto 0;}
/* section-yy */
#section-yy{ height: 11.5rem;}
#section-yy .btn-rule{ left: 15.1rem; top: 2.1rem;}
#section-yy .section-t{ height: 1.52rem;}
.btn-yy{ display: block; width: 3.75rem; height: 1.05rem; margin: 0.32rem auto 0; background: url(../images/btn-yy.png) no-repeat 0 0; background-size: 100% auto; cursor: pointer;}
.yy-line-wrap{ position: relative; width: 14.28rem; height: .16rem; margin: 0.9rem auto 0; background-color: #c1c1c1;}
.num-w{ position: absolute; width: 0; height: .16rem; left: 0; top: 0; background-color: #5f83d1;}
.yy-point{ position: absolute;width: 14.28rem; height: .16rem; left: 0; top: 0;}
.yy-point li{ position: relative; float: left; width: 2.38rem; height: 100%;}
.yy-point li div{ position: absolute; width: .68rem; height: .68rem; right: 0; margin-right: -.34rem; top: -.26rem;}
.yy-point li:nth-child(1) div{background: url(../images/icon-tou1.png); background-size: 100% auto;}
.yy-point li:nth-child(2) div{background: url(../images/icon-tou2.png); background-size: 100% auto;}
.yy-point li:nth-child(3) div{background: url(../images/icon-tou3.png); background-size: 100% auto;}
.yy-point li:nth-child(4) div{background: url(../images/icon-tou4.png); background-size: 100% auto;}
.yy-point li:nth-child(5) div{background: url(../images/icon-tou5.png); background-size: 100% auto;}
.yy-point li span{ position: absolute; width: 1.10rem; height: .26rem; left: 50%; margin-left: -.55rem; top: -.34rem; font-size: .24rem; line-height: .32rem; color: #000; text-align: center;}
.yy-point li.on div{ background-position: 0 -.68rem;}
.yy-point li.on span{ color:#3b50a1;}
.prize-yy{ display: block; width: 14.49rem; margin: 0.76rem auto 0;}
/* section-team */
#section-team{ height: 10rem;}
#section-team .btn-rule2{ top: 1.7rem; left: 50%; transform: translate(-50%,0); }
#section-team .section-t{ height: 1.52rem;}
.btn-wrap{ display: flex; width: 100%; height: .63rem; margin-top: 0.38rem; justify-content: center;}
.btn-wrap div{ width: 2.29rem; height: .63rem; margin: 0 .4rem; cursor: pointer;}
.btn-team-create{ background: url(../images/btn-team-create.png); background-size: 100% auto;}
.btn-team-join{ background: url(../images/btn-team-join.png); background-size: 100% auto;}
.btn-team-invite{ display: none; background: url(../images/btn-team-invite.png); background-size: 100% auto;}
.prize-team{ display: block; width: 14.71rem; margin: 0.8rem auto 0;}

.team-wrap{ width: 8.3rem; height: 0.99rem; margin: 0.44rem auto 0;}
.share_hd_btn{
	float: left;
	width: 3.58rem;
	height: 0.99rem;
	background: url(../images/share_hd_btn.png) no-repeat;
	background-size: 100% auto;
}
.download_btn{
	float: right;
	width: 3.58rem;
	height: 0.99rem;
	background: url(../images/download_btn.png) no-repeat;
	background-size: 100% auto;
}
.prize-share-copy{
	display: none;
}
.team-box{ position: relative; height: 2.16rem;}
#myteam{ float: left; width: 6.96rem; background: url(../images/team-bg1.png) no-repeat; background-size: 100% auto;}
.team-code{ display: none; position: absolute; width: 3.36rem; height: .31rem; padding-right: .2rem; box-sizing: border-box; right: -0.06rem; top: .14rem; font-size: .16rem; line-height: .28rem; color: #942804; text-align: right; background: url(../images/team-id-bg.png); background-size: 100% auto;}
.team-member-list{ display: none; position: absolute; width: 5.96rem; height: 1.22rem; left: .91rem; top: .72rem;}
.team-member-list li{ float: left; position: relative; width: .89rem; height: 1.22rem; margin-right: .20rem;}
.team-member-list li div{ position: relative; width: .89rem; height: .92rem; background: url(../images/tx-none.png); background-size: 100% auto;}
.team-member-list li div img{ display: none; position: absolute; width: .78rem; height: .78rem; left: .05rem; top: .05rem; border-radius: .78rem; z-index: 2;}
.team-member-list li .nickname{ position: absolute; width: 100%; height: .30rem; left: 0; bottom: 0; font-size: .18rem; line-height: .30rem; color: #c14336; text-align: center; overflow: hidden;}
.team-member-list li.leader{ width: 1.32rem; height: 1.66rem; margin: -.44rem .20rem 0 0;}
.team-member-list li.leader div{ width: 1.32rem; height: 1.36rem; background: url(../images/tx-leader.png); background-size: 100% auto;}
.team-member-list li.leader div img{ width: 1.22rem; height: 1.22rem; border-radius: 1.22rem;}
#otherteam{ float: right; width: 6.9rem; background: url(../images/team-bg2.png) no-repeat; background-size: 100% auto;}
.btn-tx-add-bg{ display: block; width: .89rem; height: .92rem; background: url(../images/tx-add.png); background-size: 100% auto;}
.btn-tx-add-bg span{ position: absolute; width: .76rem; height: .76rem; left: .06rem; top: .06rem; border-radius: .76rem; overflow: hidden;}
.btn-prev-other,.btn-next-other{ display: none; position: absolute; top: .54rem; z-index: 5; width: .82rem; height: 1.08rem; cursor: pointer;}
.btn-prev-other{ left: .26rem; background: url(../images/btn-prev.png); background-size: 100% auto;}
.btn-next-other{ right: -.25rem; background: url(../images/btn-next.png); background-size: 100% auto;}
/* section-full */
#section-full{ height: 16.5rem;}
#section-full .section-t{ height: 1.52rem;}
.full-intro{ display: block; width: 6.77rem; margin: 0.26rem auto 0;}
.btn-full-link{ display: block; width: 3.58rem; height: 0.99rem; margin: 0.26rem auto 0; background: url(../images/btn-full-link.png) no-repeat 0 0; background-size: 100% auto;}

.full-info-box{ display: none; width: 100%; height: .96rem; margin-top: 0.25rem;}
.full-nick-info{ height: .54rem; font-size: .22rem; line-height: .54rem; color: #3b50a1; text-align: center;}
.full-num-line{ display: flex; width: 100%; height: .43rem; background: url(../images/full-num-line.png) center top no-repeat; background-size: auto 100%; justify-content: center;}
.full-num-line p{ margin: 0 .30rem; font-size: .22rem; line-height: .43rem; color: #65130d;}
.full-btn-wrap{ display: flex; width: 100%; height: .61rem; margin-top: 0.22rem; justify-content: center;}
.full-btn-wrap div{ width: 2.19rem; height: .61rem; margin:0 .30rem; cursor: pointer;}
.btn-full-rule{ background: url(../images/btn-full-rule.png); background-size: 100% auto;}
.btn-full-share{ display: none; background: url(../images/btn-full-share.png); background-size: 100% auto;}
.prize-full{ display: block; width: 9.93rem; margin: 0.6rem auto 0;}
.section-t-paybx{ display: block; width: 6.21rem; margin: 0.5rem auto 0;}
.paybx-prize{ display: block; width: 6.8rem; margin: 0.01rem auto 0;}
.full-tip{width: 13rem; margin: 0 auto; margin-top: 0.6rem; font-size: 0.18rem; line-height: 0.3rem; color: #fff;}
.full-tip span{color: #f6b544;}
/* section-lottery */
#section-lottery{ height: 19rem;}
#section-lottery .section-t{ height: 1.52rem;}
.lottery-btn-wrap1{ display: flex; width: 100%; height: 0.61rem; margin-top: 0.48rem; justify-content: center; }
.lottery-btn-wrap1 span{ display: block; width: 2.19rem; height: .61rem; margin: 0 .30rem; cursor: pointer;}
.btn-myprize{ background: url(../images/btn-myprize.png) no-repeat 0 0; background-size: 100% auto;}
.btn-lottery-rule{ background: url(../images/btn-full-rule.png) no-repeat 0 0; background-size: 100% auto;}
.lottery-num{ width: 100%; height: 0.3rem; margin-top: 0.36rem; font-size: .26rem; line-height: .3rem; color: #ffd896; text-align: center;}
.lottery-progress{ width: 100%; height: 0.36rem; margin-top: 0.36rem; font-size: .21rem; color: #ffd896; text-align: center;}
.lottery-progress span{ margin: 0 .1rem; font-size: .35rem; }
.help-progress{ position: relative; width: 6.37rem; height: .25rem; margin: 0.36rem auto 0; background: #3b548c; border: 0.01rem solid #9c938f; border-radius: .13rem; }
.help-bar{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 6.26rem; height: .2rem; }
.help-bar-curr{ position: absolute; top: 0; left: 0; height: 100%; background: #ffc472; border-radius: .1rem; }
.help-bar-curr:after{ content: ""; position: absolute; top: 50%; right: 0; width: .62rem; height: .60rem; transform: translate(50%,-50%); background: url(../images/help-progress-point.png) no-repeat 0 0; background-size: 100% auto;}
.lottery-tip{ width: 100%; height: .3rem; margin-top: 0.18rem; font-size: .21rem; color: #ffd896; text-align: center;}
.lottery-btn-wrap2{ display: flex; height: 1.05rem; margin-top: 0.5rem; justify-content: center;}
.lottery-btn-wrap2 span{ display: block; width: 3.74rem; height: 1.05rem; margin: 0 0.41rem; cursor: pointer;}
.btn-lottery-invite{ background: url(../images/btn-lottery-invite.png) no-repeat 0 0; background-size: 100% auto;}
.btn-lottery{ background: url(../images/btn-lottery.png) no-repeat 0 0; background-size: 100% auto;}
.prize-lottery{ display: block; width: 11.18rem; margin: 0.44rem auto 0;}
.prize-lottery-tip{ font-size: 0.22rem; line-height: 0.3rem; color: #fff; text-align: center;}
.my_invitecode{
	width: 5rem;
	height: 0.75rem;
	line-height: 0.75rem;
	padding-left: 2.8rem;
	background: url(../images/my_invitecode_bg.png) no-repeat;
	background-size: 100% auto;
	margin: 0.35rem auto 0;
	position: relative;
}
.my_invitecode span{
	font-size: 20px;
	color: #d8b96e;
}
.my_invitecode_info{
	width: 0.6rem;
	height: 0.6rem;
	position: absolute;
	top: 0.08rem;
	right: 0.13rem;
	cursor: pointer;
}
.invitecode_share_copy{
	display: none;
}
.my_invitecode-wrap{ width: 8.3rem; height: 0.99rem; margin: 0.63rem auto 0;}

.bot-ewm{ position: relative; width: 3.46rem; height: 4rem; margin: 1rem auto 0; background: url(../images/bot-ewm.png); background-size: 100% auto;}
.bot-ewm img{ position: absolute; left: 0.15rem; top: 0.15rem; width: 2.76rem;}
/* pop */
.pop-fixed{ display:none; position:fixed; left:0; top:0; z-index:991; width:100%; height:100%; background:rgba(0,0,0,0.8);}
.pop-cont-bg1{ position: absolute; left: 55%; top: 50%; width: 7.24rem; height: 9.36rem; margin-left: -4.03rem; margin-top: -5.38rem; background:url(../images/pop-bg1.png); background-size: 100% auto;}
.icon-close{ position:absolute; right: .6rem; top: .6rem; z-index: 5; width:.54rem; height: .47rem; background: url(../images/icon-close.png); background-size: 100% auto; cursor: pointer;}
.pop-cont-bg1 .pop-cont{position:absolute; left: 0.55rem; top: 1.24rem; width: 6.36rem; height: 6.12rem;}
/* pop-rule */
.pop-t{ display: block; height: 0.35rem; margin: 0 auto;}
.cus-scroll{ overflow-y: auto; overflow-x: hidden;}
.cus-scroll::-webkit-scrollbar{ width: 0.08rem; background-color: #793a1b;}
.cus-scroll::-webkit-scrollbar-thumb{ width: 0.08rem; background-color: #b07438;}
.pop-rule-scroll{ width: 5.8rem; height: 6.36rem; margin: 0.4rem 0 0 0.37rem;}
.rule-list{ width: 5.56rem;}
.rule-list li{ padding-bottom: .25rem; font-size: .20rem; line-height: .34rem; color: #79381a;}
.rule-list li a{ color: #fcf5df; text-decoration: underline;}
.rule-list li .bold{ font-weight: bold;}
/* pop-createrole */
.pop-cont-bg2{ position: absolute; left: 50%; top:50%; width: 7.07rem; height: 12.51rem; transform: translate(-50%,-50%); background: url(../images/pop-bg2.png) no-repeat; background-size: 100% auto;}
.pop-cont-bg2 .icon-close{ top: .4rem;}
.pop-cont-bg2 .pop-cont{ position: absolute;left: 50%; top: 0.65rem; transform: translate3d(-50%,0,0); width:6.36rem; height: 11.78rem;}
.role-tx-box{ position: relative; width: 3.92rem; height: 3.92rem; margin: .09rem auto 0; background: url(../images/cr-tx-bg.png); background-size: 100% auto;}
#chose-tx{ position: absolute; left: .51rem; top: .51rem; width: 2.90rem; height: 2.90rem;}
#role-info{ position: absolute; left: 1.4rem; top: 1.02rem; width: 3.62rem;}
.btn-role-prev, .btn-role-next{ position: absolute; top: 2.58rem; width: .56rem; height: .52rem; }
.btn-role-prev{ left: .26rem; background: url(../images/btn_role_prev.png) no-repeat 0 0; background-size: 100% auto;}
.btn-role-next{ right: .26rem; background: url(../images/btn_role_next.png) no-repeat 0 0; background-size: 100% auto;}
.role-tab-wrap{ width: 6.34rem; height: 2rem; margin: .18rem auto 0; background: url(../images/tab-line.png) center bottom no-repeat; background-size: 100% auto;}
.role-tab-box{ display: flex; flex-wrap: wrap; width: 3.8rem; height: 1.48rem; margin: 0 auto; justify-content: center;}
.role-tab-box li{ width: .51rem; height: .51rem; margin: 0 .05rem 0.08rem; cursor: pointer;}
.tx-101{ background: url(../images/role/tab-qingyun.png) no-repeat; background-size: 100% auto;}
.tx-101.on{ background: url(../images/role/tab-qingyun-on.png) no-repeat; background-size: 100% auto;}
.tx-103{ background: url(../images/role/tab-fenxianggu.png) no-repeat; background-size: 100% auto;}
.tx-103.on{ background: url(../images/role/tab-fenxianggu-on.png) no-repeat; background-size: 100% auto;}
.tx-105{ background: url(../images/role/tab-guiwangzong.png) no-repeat; background-size: 100% auto;}
.tx-105.on{ background: url(../images/role/tab-guiwangzong-on.png) no-repeat; background-size: 100% auto;}
.tx-107{ background: url(../images/role/tab-wandumen.png) no-repeat; background-size: 100% auto;}
.tx-107.on{ background: url(../images/role/tab-wandumen-on.png) no-repeat; background-size: 100% auto;}
.tx-102{ background: url(../images/role/tab-tianyinsi.png) no-repeat; background-size: 100% auto;}
.tx-102.on{ background: url(../images/role/tab-tianyinsi-on.png) no-repeat; background-size: 100% auto;}
.tx-104{ background: url(../images/role/tab-nanjiangguwu.png) no-repeat; background-size: 100% auto;}
.tx-104.on{ background: url(../images/role/tab-nanjiangguwu-on.png) no-repeat; background-size: 100% auto;}
.tx-108{ background: url(../images/role/tab-changshengtang.png) no-repeat; background-size: 100% auto;}
.tx-108.on{ background: url(../images/role/tab-changshengtang-on.png) no-repeat; background-size: 100% auto;}
.tx-106{ background: url(../images/role/tab-hehuanpai.png) no-repeat; background-size: 100% auto;}
.tx-106.on{ background: url(../images/role/tab-hehuanpai-on.png) no-repeat; background-size: 100% auto;}
.tx-109{ background: url(../images/role/tab-guidao.png) no-repeat; background-size: 100% auto;}
.tx-109.on{ background: url(../images/role/tab-guidao-on.png) no-repeat; background-size: 100% auto;}
.tx-110{ background: url(../images/role/tab-tiandaofu.png) no-repeat; background-size: 100% auto;}
.tx-110.on{ background: url(../images/role/tab-tiandaofu-on.png) no-repeat; background-size: 100% auto;}
.tx-111{ background: url(../images/role/tab-hanfenglongzu.png) no-repeat; background-size: 100% auto;}
.tx-111.on{ background: url(../images/role/tab-hanfenglongzu-on.png) no-repeat; background-size: 100% auto;}
.tx-112{ background: url(../images/role/tab-wanlinggong.png) no-repeat; background-size: 100% auto;}
.tx-112.on{ background: url(../images/role/tab-wanlinggong-on.png) no-repeat; background-size: 100% auto;}

.genre{ display: flex; justify-content: center; align-items: center; font-size: .24rem; color: #8e5027;}
.genre a{ position: relative; margin-right: .22rem; width: 1.52rem; height: .37rem; line-height: .37rem; text-align: center; background: url(../images/genreBtn.png) no-repeat 0 0; background-size: 100% auto; font-size: .2rem; color: #eed4a2;}
.genre a.on{ background-position: 0 100%; color: #8c6329;}
.genre a.new::after{ content: ""; position: absolute; top: -0.12rem; right: -0.24rem; width: .93rem; height: .25rem; background: url(../images/newGenre.png) no-repeat 0 0; background-size: 100% auto;}

.role-skill-box{ position: relative; width: 5.71rem; height: .87rem; margin: .15rem auto 0;}
.skill-text{ position: absolute; left: 50%; margin-left: -2.84rem; bottom: 0; width: 5.62rem;}
#role-skill-list{position: absolute; left: 0; top: 0; z-index: 5; width: 100%; height: 100%;}
#role-skill-list.skill-101{ background: url(../images/role/skill-101.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-102{ background: url(../images/role/skill-102.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-103{ background: url(../images/role/skill-103.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-104{ background: url(../images/role/skill-104.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-105{ background: url(../images/role/skill-105.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-106{ background: url(../images/role/skill-106.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-107{ background: url(../images/role/skill-107.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-108{ background: url(../images/role/skill-108.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-109{ background: url(../images/role/skill-109.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-110{ background: url(../images/role/skill-110.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-111{ background: url(../images/role/skill-111.png) center top no-repeat; background-size: 100% auto;}
#role-skill-list.skill-112 {
    background: url(../images/role/skill-112.png) center top no-repeat;
    background-size: 100% auto;
}
#role-skill-list.skill-151{ background: url(../images/role/skill-151.png) center top no-repeat;background-size: 100% auto;}
#role-skill-list.skill-160{ background: url(../images/role/skill-160.png) center top no-repeat;background-size: 100% auto;}
.genre a[lp='160']::before{
	content: "";
	width: 0.93rem;
	height: 0.25rem;
	background: url(../images/new_liupai_icon.png) no-repeat;
	background-size: 100% auto;
	position: absolute;
	top: -0.1rem;
	right: -0.4rem;
}
#role-skill-list li{ position: relative; float: left; width: .61rem; height: .91rem; margin: -.04rem .24rem 0 0;}
#role-skill-list li:last-child{margin-right: 0;}
.pop-skill{ display: none; position: absolute; top: .90rem; left: 0; width: 3.10rem; height: 1.40rem; background: url(../images/pop-skill-bg.png); background-size: 100% auto;}
#role-skill-list li:nth-child(5) .pop-skill,#role-skill-list li:nth-child(6) .pop-skill,#role-skill-list li:nth-child(7) .pop-skill{ left: -2.40rem;}
#role-skill-list li:hover .pop-skill{ display: block;}
.skill-name{ display: block; height: .40rem; font-size: .28rem; line-height: .40rem; color: #fff; text-align: center;}
.skill-intro{ width: 2.90rem; height: .84rem; max-height: .84rem; overflow: hidden; margin: .06rem auto 0; font-size: .17rem; line-height: .20rem; color: #908162;}

.role-type-box{display: flex; width: 100%; height: .36rem; margin: .24rem auto 0; justify-content: center;}
.role-type-box li{ width: 1.38rem;height: .36rem; margin: 0 .13rem; cursor: pointer;}
.role-type-11{ background: url(../images/role-type-snan.png);background-size: 100% auto;}
.role-type-11.on{ background: url(../images/role-type-snan-on.png);background-size: 100% auto;}
.role-type-21{ background: url(../images/role-type-snv.png);background-size: 100% auto;}
.role-type-21.on{ background: url(../images/role-type-snv-on.png);background-size: 100% auto;}
.role-type-10{ background: url(../images/role-type-nan.png);background-size: 100% auto;}
.role-type-10.on{ background: url(../images/role-type-nan-on.png);background-size: 100% auto;}
.role-type-20{ background: url(../images/role-type-nv.png);background-size: 100% auto;}
.role-type-20.on{ background: url(../images/role-type-nv-on.png);background-size: 100% auto;}
.sub-form{ width: 3.90rem; height: 1.8rem; margin: .26rem auto 0;}
.sub-form select{ width: 3.90rem; height: .63rem; padding: 0 .20rem; font-size: .22rem; color: #c14336; background-color: #fff; border: .01rem solid #ffe9b2; outline: 0;}
.sub-form input{ display: block; width: 3.48rem; height: .61rem; padding: 0 .20rem; margin-top: .2rem; font-size: .22rem; line-height: .61rem; color: #c14336; background-color: #fff; border: .01rem solid #ffe9b2; outline: 0;}
.btn-sub{ display: block; width: 3.55rem; height: .99rem; margin: 0 auto; background: url(../images/btn-sub.png);background-size: 100% auto; cursor: pointer;}
/* pop-bind */
.bind-tip{ display: block; width: 3.98rem; margin: 0.8rem auto 0;}
#pop-bind .sub-form{ margin: 0.6rem auto 0;}
.btn-sub-bind{ display: block; width: 3.73rem; height: .9rem; margin: 0 auto; background: url(../images/btn-sub-bind.png); background-size: 100% auto; cursor: pointer;}
/* pop-createrole-succ */
#pop-createrole-succ .pop-t{ height: 0.43rem; margin-top: 0.8rem;}
.prize-cr-succ{ display: block; width: 6.56rem; margin: 0.7rem auto;}
.btn-cr-succ-go,.btn-yy-succ-go,.btn-cr-first-go,.btn-team-succ-invite,.btn-team-succ-go{display: block;  width: 3.55rem; height: .99rem; margin: 0.4rem auto 0; background: url(../images/btn-cr-succ-go.png); background-size: 100% auto; cursor: pointer;}
.succ-tip{ margin-top: .3rem; font-size: .22rem; line-height: .35rem; color: #78391b; text-align: center;}
/* pop-yy-succ */
#pop-yy-succ .pop-t{ height: 0.48rem; margin-top: 1.1rem;}
#pop-yy-succ .succ-tip{ margin-top: .6rem;}
.color-white{ color: #78391b;}
.btn-yy-succ-go,.btn-cr-first-go{width: 3.55rem; height: 0.99rem; margin: 0.9rem auto 0; background: url(../images/btn-yy-succ-go.png); background-size: 100% auto;}
.btn-cr-first-go{ background: url(../images/btn-cr-first-go.png);background-size: 100% auto;}
#pop-createrole-first .pop-t{ height: 1.09rem; margin-top: 1.68rem;}
/* pop-createteam-succ */
#pop-createteam-succ .pop-t{ height: 0.48rem; margin-top: 1.1rem;}
.btn-team-succ-invite{ margin-top: .6rem; background: url(../images/btn-team-succ-invite.png); background-size: 100% auto;}
.btn-team-succ-go{ margin-top: .54rem; background: url(../images/btn-team-succ-go.png);background-size: 100% auto;}
/* pop-team-invite */
#pop-team-invite .pop-t,#pop-lottery-invite .pop-t{ height: .44rem; margin-top: .35rem;}
.invite-tag1{ display: block; height: 0.24rem; margin: 0.5rem 0 0 .2rem;}
.share-link-box{ width: 6.03rem; height: .55rem; margin: .12rem 0 0 .2rem;}
.copy-link-cont{ float: left; width: 4.06rem; height: .53rem; overflow: hidden; font-size: .18rem; line-height: .53rem; color: #810e02; background-color: #fff; border: .01rem solid #ffe9b2; white-space: nowrap; text-overflow: ellipsis;}
#btn-copy-team, #btn-copy-lottery{ float: right; width: 1.77rem; height: .55rem; background: url(../images/btn-copy-link.png); background-size: 100% auto; cursor: pointer;}
.invite-tag2{ display: block; height: 0.24rem; margin: 0.28rem 0 0 .2rem;}
.poster-box{ position: relative; width: 5.93rem; height: 3.65rem; padding-top: .09rem; box-sizing: border-box; margin: .12rem 0 0 .2rem; border: .01rem solid #ffd7ab; overflow: hidden;}
.create-box{ position: relative; width: 5.76rem; height: 3.44rem; margin: 0 auto; background-color: #2d2d2d;}
.poster-img{ display: block; width: 100%; height: 100%;}
.result-ewm{ position: absolute; width: 1.2rem; height: 1.2rem; padding: .05rem; left: .1rem; bottom: .1rem; background-color: #fff;}
.share-info{ position: absolute; width: 1.84rem; height: .32rem; left: 1.5rem; padding-left: .18rem; box-sizing: border-box; font-size: .18rem; line-height: .3rem; color: #ffe7ca; background: url(../images/share-info-line.png); background-size: 100% auto;}
.share-info1{ top: 2.6rem;}
.share-info2{ top: 3.02rem;}
.result-poster{ position: absolute; width: 5.76rem; height: 3.46rem; left: .09rem; top: .09rem; z-index: 10; opacity: 0;}
/* pop-team-list */
#pop-team-list .pop-t{ height: 0.44rem; margin-top: .46rem;}
.search-box{ width: 6rem; height: .55rem; margin: .26rem auto 0; overflow: hidden;}
#inp-search{ float: left; width: 4.1rem; height: .55rem; padding-left: .34rem; box-sizing: border-box; font-size: .22rem; line-height: .55rem; color: #c14336; background-color: #fcf5df; border: 0; outline: 0;}
.btn-search{ float: right; width: 1.77rem; height: .55rem; background: url(../images/btn-search.png); background-size: 100% auto; cursor: pointer;}
.team-th{ display: block; width: 5.38rem; margin: .28rem 0 0 0.45rem;}
.team-list{ width: 100%; height: 3.66rem; margin: .18rem auto 0; overflow: hidden;}
.team-list li{ width: 100%; height: 1.12rem; margin-top: .10rem; overflow: hidden;}
.team-list li:nth-child(odd){ background: url(../images/team-line-bg.png) center top no-repeat; background-size: 100% auto;}
.item-line{ width: 100%; height: .56rem; overflow: hidden;}
.col1,.col2,.col3{ float: left; height: .56rem; overflow: hidden; font-size: .22rem; line-height: .56rem; color: #fcf5df; text-align: center;}
.team-list li div.col1{ width: 2.04rem;}
.team-list li div.col2{ width: 2.84rem;}
.team-list li div.col3{ width: 1.44rem;}
.item-opa{ display: flex; width: 6.04rem; height: .37rem; margin: .04rem auto 0; justify-content: center;}
.btn-check-team,.btn-sub-join{ display: block; width: 1.11rem; height: .37rem; margin:0 .10rem; background: url(../images/btn-check-team.png); background-size: 100% auto; cursor: pointer;}
.btn-sub-join{background: url(../images/btn-sub-join.png);background-size: 100% auto;}
.page-box{ display: flex; width: 100%; height: .42rem; margin-top: .4rem; justify-content: center;}
.page-box div{ width: 1.66rem; height: .42rem; margin: 0 .15rem; cursor: pointer;}
.btn-prev-page{background: url(../images/btn-prev-page.png);background-size: 100% auto;}
.btn-next-page{background: url(../images/btn-next-page.png);background-size: 100% auto;}
/* pop-team-detail */
#popteame-code{ display: block; right: 0; top: 0.72rem;}
.detail-tag{ position: absolute; left: .4rem; top: 1.6rem; width: 1.91rem;}
.pop-team-leader{ position: absolute; left: 50%; transform: translate3d(-50%,0,0); top: 1.46rem; width: 1.32rem; height: 1.36rem; background: url(../images/tx-leader.png) center top no-repeat; background-size: 100% auto;}
.pop-team-leader img{ position: absolute; left: .05rem; top: .05rem; width: 1.22rem; height: 1.22rem; border-radius: 1.22rem;}
.pop-team-leader span{ position: absolute; left: 0; bottom: -.30rem; width: 100%; height: .30rem; overflow: hidden; font-size: .18rem; line-height: .30rem; color: #fef8de; text-align: center;}
#checkteam-member{ display: block; left: 1.1rem; top: 3.4rem; width: 5.32rem;}
#checkteam-member li{ margin-right: .28rem;}
#checkteam-member li .nickname{ color: #fef8de;}
/* pop-join-succ */
.join-succ-leader{ position: relative; width: 3.79rem; height: .37rem; margin: 2.04rem auto 0; background: url(../images/join-succ-leader.png); background-size: 100% auto;}
.succ-leader{ position: absolute; left: 1.45rem; top: 0; width: 1.24rem; height: .36rem; overflow: hidden; font-size: .24rem; line-height: .32rem; color: #fff; text-align: center; text-overflow: ellipsis; white-space: nowrap;}
#pop-join-succ .btn-team-succ-go{ margin-top: 1rem;}
/* pop-letter */
#pop-letter-role-none .pop-t,#pop-letter-role-have .pop-t{ height: 0.44rem; }
.letter-from{ position: relative; width: 3.39rem; height: .38rem; margin: .96rem 0 0 1.1rem; background: url(../images/letter-from.png) center bottom no-repeat; background-size: 100% auto;}
.from-code{ position: absolute; width: 1.68rem; height: .36rem; left: .69rem; top: 0; font-size: .25rem; line-height: .36rem; color: #fff; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.from-info{ margin-top: .26rem; font-size: .24rem; line-height: .30rem; color: #78391b; text-align: center;}
.letter-leader{ position: relative; width: 2.72rem; height: .24rem; margin: .18rem auto 0; background: url(../images/letter-leader.png); background-size: 100% auto;}
.form-leader{ position: absolute; position: absolute; width: 1.14rem; height: .26rem; left: 0; top: 0; font-size: .20rem; line-height: .22rem; color: #fff; text-align: center;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.letter-tip1{ display: block; width: 4.3rem; margin: .18rem auto 0;}
.btn-letter-createrole,.btn-letter-join{ display: block; width: 3.73rem; height: .9rem; margin: .84rem auto 0; background: url(../images/btn-cr-first-go.png); background-size: 100% auto; cursor: pointer;}
.btn-letter-join{ margin: .96rem auto 0; background: url(../images/btn-letter-join.png); background-size: 100% auto;}
.letter-zhu{ margin-top: 0.24rem;font-size: .22rem; color: #78391b; text-align: center;}

.share-ewm-box{ display: none; width: 1.2rem; height: 1.2rem;}
/* pop-myprize */
#pop-myprize .pop-t{ height: 0.44rem; margin-top: 0.52rem;}
.myprize-box{ width: 5.60rem; margin: 0.8rem auto 0; }
.myprize-box table{ width: 100%; }
.myprize-box td{ padding: 0 .05rem; }
.myprize-box td:nth-child(1){ width: 1.60rem; }
.myprize-tag{ height: 0.3rem;}
.myprize-box tbody td{ height: .65rem; border-bottom: .01rem solid #fff; font-size: .18rem; color: #fff; }
.myprize-list{ height: 4.30rem; overflow-x: hidden; overflow-y: auto; }
.myprize-list::-webkit-scrollbar{ width: .06rem; border-radius: .06rem; background: #c1c1c1; }
.myprize-list::-webkit-scrollbar-thumb{ background-color: #f1f1f1; border-radius: .06rem; }
.btn-myprize-copy, .btn-myprize-address{ display: block; width: 1.61rem; height: .52rem;}
.btn-myprize-copy{ background: url(../images/btn-myprize-copy.png) no-repeat 0 0; background-size: 100% auto;}
.btn-myprize-address{ background: url(../images/btn-myprize-address.png) no-repeat 0 0; background-size: 100% auto;}
/* pop-lottery-succ */
#pop-lottery-succ .pop-t{ height: 0.44rem; margin-top: 0.34rem;}
.lottery-succ-cont{ display: flex; width: 5.13rem; height: 3.13rem; border: .02rem solid #c68767; margin: .54rem auto 0; justify-content: center; align-items: center; background: url(../images/lottery-succ-cont.png) no-repeat center center; background-size: 100% auto;}
.lottery-succ-cont img{ width: 1.78rem; height: 1.59rem; animation: awardSuccess 1s; }
@keyframes awardSuccess{
	from{ opacity: 0; transform: scale(0); }
	to{ opacity: 1; transform: scale(1); }
}
.btn-conform{ display: block; width: 3.73rem; height: .9rem; margin: .53rem auto 0; background: url(../images/btn_conform.png) no-repeat 0 0; background-size: 100% auto;}
/* pop-address */
#pop-address .pop-t{ height: 0.44rem; margin-top: 0.45rem;}
.pop-mailCont{ padding-top: .53rem; }
.address-tip{ display: block; width: 5.51rem; margin: 0 auto .38rem; }
.pop-mailCont input{ display: block; margin: 0 auto .27rem; width: 5.15rem; height: .87rem; line-height: .87rem; text-align: center; font-size: .27rem; color: #707070; border: 0.01rem solid #de9469;}
.btn-sub-address{ display: block; width: 3.69rem; height: .97rem; margin: .30rem auto 0; background: url(../images/btn-sub.png) no-repeat 0 0; background-size: 100% auto;}
/*pop-my-invitecode-info*/
#pop-invitecode-info .pop-cont-bg1{ position: absolute; left: 55%; top: 50%; width: 7.04rem; height: 11.06rem; margin-left: -3.52rem; margin-top: -5.38rem; background:url(../images/popInvitecode_info.png); background-size: 100% auto;}
#pop-invitecode-info .icon-close{
	width: 0.65rem;
	height: 0.66rem;
	background: url(../images/closeBtn.png) no-repeat;
	background-size: 100% auto;
}
/* pop-msg */
#pop-msg{ z-index:991;}
.msg{ display: flex; width: 5rem; height: 100%; margin: 0 auto; font-size: .32rem; font-weight: bold; line-height: 0.46rem; color: #7e5323;  align-items: center; justify-content: center; text-align: center;}