.user-top{min-height:calc(430px * var(--device)); position:relative; overflow:hidden;}
.user-top-color{position:absolute; z-index:1; bottom:0; width:calc(2380px * var(--device)); left:calc(50% - 1190px * var(--device)); height:calc(2380px * var(--device)); border-radius:50%;background: linear-gradient(198deg, #e6c37f,#d3b46f);}
.user-top-card{position:absolute; z-index:3; bottom:0; border-radius:calc(20px * var(--device)) calc(20px * var(--device)) 0 0; height:calc(350px * var(--device)); left:calc(30px * var(--device)); right:calc(30px * var(--device)); overflow:hidden;}
.user-top-card-color{position:absolute; z-index:1; bottom:0; width:calc(2380px * var(--device)); left:calc(50% - 1190px * var(--device)); height:calc(2380px * var(--device)); border-radius:50%;background:#273238;}
.user-top-color-bg{position:absolute; z-index:2; width:100%; height:100%; background: url(../../images/fortest/bg.png) center center no-repeat; background-size:100% 100%;}

.user-top-card-Icon{position:absolute; z-index:2; opacity:0.03; right:2%; top:1%;}
.user-top-card-Icon2{position:absolute; z-index:2; opacity:0.03; left:20%; top:50%;}

.user-top-title{position:relative; z-index:4;}
.user-top-main{position:relative;z-index:4; height:calc(300px * var(--device)); } 
.user-name{color:#fffec9;text-shadow: 0px 0px 2px #585367;}
.user-top-list,
.user-top-list a{color:#e6c37f;}
.user-top-list .fa{color:#f6f5d8}


.xfq-title{position:relative;}
.xfq-title:before{content:""; display:inline-block; position:absolute; left:0; top:calc(50% - 15px * var(--device)); width:calc(4px * var(--device)); height:calc(30px * var(--device)); background-color:#333}
.xfq-content{position:relative; height:calc(180px * var(--device)); background: linear-gradient(to right, #72e0bd, #499cbd);}
.xfq-btn{ background: linear-gradient(to right, #7be5bb, #51a2fb);}
.xfq-top,
.xfq-bottom{text-transform:uppercase; color:#fff; position:absolute; z-index:0; opacity:0.15;white-space:nowrap;}
.xfq-top{left:0; right:0 ;text-align:center; top:calc(-14px * var(--device));}
.xfq-bottom{left:0; right:0 ;text-align:center; bottom:calc(-14px * var(--device));}

.dhq-title{position:relative;}
.dhq-title:before{content:""; display:inline-block; position:absolute; left:0; top:calc(50% - 15px * var(--device)); width:calc(4px * var(--device)); height:calc(30px * var(--device)); background-color:#333}
.dhq-content{position:relative; height:calc(180px * var(--device));background: linear-gradient(45deg, #f2711c, #e03997); }
.dhq-btn{ background: linear-gradient(25deg, var(--yellow-light), #ff6a00);}
.dhq-top,
.dhq-bottom{text-transform:uppercase; color:#fff; position:absolute; z-index:0; opacity:0.15;white-space:nowrap;}
.dhq-top{left:0; right:0 ;text-align:center; top:calc(-14px * var(--device));}
.dhq-bottom{left:0; right:0 ;text-align:center; bottom:calc(-14px * var(--device));}


.pgMember-point .content .item{width:100%; background:#fffef0; } 
.pgMember-point .content .item .time{background:var(--orange-dark);color:#fff }
.pgMember-point .content .item .ic{background:var(--green);}
 
.qrCodeLayout{opacity: 0;position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 100;background: rgba(0,0,0,0.7);display: none;}
.qrCodeLayout.AniShow{opacity: 1;}
.qrCodeLayout-content{opacity: 0;transform: scale(0.8)}
.qrCodeLayout-content{-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;-webkit-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
.AniShow .qrCodeLayout-content{opacity: 1;transform: scale(1)}