.code-and-login{
    display: flex;
    align-items: center;
    justify-content: flex-end;

    position: absolute;
    right: .63rem;
    top:.44rem;
}

.header-nav{z-index: 22;}
.header-code{width: 1.23rem;height: .3rem;background: url(../images/header-code-txt.png) no-repeat center;background-size: 100% auto;cursor: pointer; position: relative; right: 0; top: 0;}
.header-code:hover .header-code-wrap{display: block;}
.header-code-wrap{display:none;position: absolute;left: -0.3rem;top:0.3rem;width: 2.25rem;height: 2.04rem;background: url(../images/header-code-bg.png) no-repeat center;background-size: 100% auto;}
.header-code-wrap img{position: absolute;top:0.25rem;left: 0.4rem;width: 1rem;height: 1rem;border: 0.14rem solid #ffffff;border-radius: 0.1rem;}

.animation-purchase{
    position: absolute;
    right: -12.2rem;
    top:0.18rem;
    font-size: 0.18rem;
    color: #f7be6c;
    cursor: pointer;
}
.sticker-purchase{
    position: absolute;
    right: -4.8rem;
    top:0.18rem;
    color: #f7be6c;
    cursor: pointer;
    font-size: 0.18rem;
}

.header-login {
	font-size:0.22580645161290322rem;
	color:white;
	margin-left:.5rem;
	display:flex;
	align-items:center;
}
.header-login .header-btn-common {
	cursor:pointer;
	border:1px solid white;
	border-radius:0.06451612903225806rem;
	padding:0 0.12903225806451613rem;
	height:0.41935483870967744rem;
	line-height:0.41935483870967744rem;
}
.header-login .header-mail {
	margin:.06rem .2rem 0 0;
}
.header-login .header-mail,.header-login .header-logout-btn {
	display:none;
}
.header-login.logined .header-login-btn, .header-login.logined .header-signup-btn{
	display:none;
}
.header-login.logined .header-mail,.header-login.logined .header-logout-btn {
	display:block;
}
.header-signup-btn{
    margin-right: .1rem;
}

/* 登录浮层 */
#content.logining .sec1,#content.logining .sec2,#content.logining .sec3,#content.logining .sec4,#content.logining .float-box {
	display:none;
}
#content.logining .header {
	height:0;
}
#content.logining .login-pop-layer {
	display:block;
}
.login-pop-layer {
	min-height:16.129032258064516rem;
	background:white;
	display:none;
    position: relative;
}
.login-pop {
	position:absolute;
	left:50%;
	top:1.935483870967742rem;
	margin:0 0 0 -6.564516129032258rem;
	z-index:21;
	width:13.129032258064516rem;
	height:9.85483870967742rem;
	background:url(../images/login/login-pop-bg.png) no-repeat 0 0;
	background-size:100% auto;
	display:flex;
	flex-direction:column;
	align-items:center;
	box-sizing:border-box;
	padding:1.2903225806451613rem 0 0 0;
}
.login-pop.signup .pop-title.signup-title,.login-pop.signup ul.input-list li.input-item.confirm-input,.login-pop.signup .signup-btn {
	display:block;
}
.login-pop.signup .agreement-box{
	display: flex;
}
.login-pop.signup .pop-title.login-title,.login-pop.signup .login-btn,.login-pop.signup .link-to-singup {
	display:none;
}
.login-pop .pop-title {
	font-size:0.5645161290322581rem;
	margin-bottom:.2rem;
}
.login-pop .pop-title.signup-title {
	display:none;
}
.login-pop ul.input-list li.input-item {
	margin-bottom:0.1rem;
}

.login-pop ul.input-list li.input-item input {
	width:9.838709677419354rem;
	font-size:0.4838709677419355rem;
	border:0;
	border-bottom:0.016129032258064516rem solid black;
	background:none;
	outline:none;
	box-sizing:border-box;
	padding-bottom:0.11290322580645161rem;
}
.login-pop ul.input-list li.input-item input::input-placeholder {
	color:black;
}
.login-pop ul.input-list li.input-item input::-webkit-input-placeholder {
	color:black;
}
.login-pop ul.input-list li.input-item input::-moz-placeholder {
	color:black;
}
.login-pop ul.input-list li.input-item input::-moz-placeholder {
	color:black;
}
.login-pop ul.input-list li.input-item input::-ms-input-placeholder {
	color:black;
}
.login-pop ul.input-list li.input-item .input-tip {
	font-size:0.25806451612903225rem;
	color:red;
	text-align:right;
	height:0.4032258064516129rem;
	visibility:hidden;
}
.login-pop ul.input-list li.input-item.error .input-tip {
	visibility:visible;
}
.login-pop .color-btn {
	font-size:0.3709677419354839rem;
	color:white;
	width:9.870967741935484rem;
	height:1.096774193548387rem;
	line-height:1.096774193548387rem;
	text-align:center;
	background:url(../images/login/login-btn.png) no-repeat 0 0;
	background-size:100% auto;
	cursor:pointer;
}
.login-pop .login-btn {
	margin-bottom:0.27419354838709675rem;
}
.login-pop .signup-btn {
	display:none;
}
.login-pop .agreement-box{
    display: none;
	font-size: .3rem;
	margin: 0 0 50px 0;
	color: #000;
	align-items: center;
	cursor: pointer;
}
.login-pop .agreement-box input{
	width: 22px;
	height: 22px;
	margin-right: 10px;
}
.login-pop .agreement-box a{
	color: #000;
	text-decoration: underline;
}
.login-pop .link-to-singup {
	font-size:0.3709677419354839rem;
	color:#595757;
	cursor:pointer;
}
/* 实名认证 */

.pop-title,.input-item,.login-btn,.agreement-box,.link-to-singup,.realname-tip,.signup-btn{display: none;}

.login-pop.realname .signup-title,
.login-pop.realname .mail-input,
.login-pop.realname .password-input,
.login-pop.realname .confirm-input,
.login-pop.realname .realname-input,
.login-pop.realname .id-input,
.login-pop.realname .agreement-box,
.login-pop.realname .realname-tip,
.login-pop.realname .signup-btn{
	display: block;
}
.login-pop.loginname .login-title, 
.login-pop.loginname .mail-input, 
.login-pop.loginname .password-input, 
.login-pop.loginname .login-btn, 
.login-pop.loginname .link-to-singup{
	display: block;
}
.login-pop .realname-tip{
	font-size: .3rem;
	line-height: .5rem;
	width: 9.8rem;
	margin: 0 auto 30px;
}

/* 支付弹窗 */
.pay-pop{
    width: 474px;
    height: 507px;
    background: url(../images/login/purchase-pop-bg.png) no-repeat 0 0;
    background-size: 100% auto;
    position: fixed;
    left: 50%;
    top: 50%;
    margin: -253px 0 0 -237px;
    z-index: 26;
    box-sizing: border-box;
    padding: 350px 0 0 0;
    display: none;
}
.pay-pop-close{
    width: 39px;
    height: 41px;
    background: url(../images/login/pop-close.png) no-repeat 0 0;
    background-size: 100% auto;
    position: absolute;
    right: 30px;
    top: 20px;
    cursor: pointer;
}
.pay-pop img{
    position: absolute;
    left: 50%;
    margin-left: -115px;
    top: 80px;
    width: 230px;
    height: 230px;
}
.pay-pop p{
    font-size: 19px;
    text-align: center;
}
.pay-pop p:first-of-type{
    margin-bottom: 20px;
}

/*充值中心*/
.header-nav-list{
	width: 8.8rem;
	overflow: visible;
}
.pay-link{
	position: relative;
}
.pay-link .refund{
	display: none;
	background: black;
	color: white;
	width: 50px;
	height: 20px;
	padding: 4px 0;
	opacity: 1;
	border-radius: 3px;
	
	position: absolute;
	left: 50%;
	top: 50%;
	margin: 20px 0 0 -25px;
	/* left: 5px;
	top: 50px; */
	cursor: pointer;
}
.pay-link.show-refund .refund{
	display: block;
}