@keyframes zoomAndFade {
  0% {
    transform: scale3d(1,1,1);
    opacity: 0.5;
  }
  100% {
    transform: scale3d(1.1,1.4,1);
    opacity: 0;
  }
}
@keyframes zoomAndFades {
  0% {
    transform: scale3d(1,1,1);
    opacity: 0.5;
  }
  100% {
    transform: scale3d(1.2,1.5,1);
    opacity: 0;
  }
}
.zfPop{position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 1000;background: rgba(118,0,0,.6);backdrop-filter: blur(5px);display: none }
.zfPops{margin: .5rem ;overflow: auto;height: calc(100% - 1rem)}
.zfPops .wrap{transition: .5s}
.zfPops .wrap.hide{opacity: 0;visibility: hidden;}
.selectInput{position:relative;  padding: 0 .25rem; cursor: pointer; }
.selectInput .defalutInput{display: flex;align-items: center;height: 100%;color: #EDCA6E}
.selectInput::after{content: "";position:absolute;top:50%;right:.25rem;transform:translateY(-50%); font-size: .14rem;transition: .3s;line-height: 1em;transform-origin: center;pointer-events: none ;background: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAHCAYAAADXhRcnAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAADlSURBVBiVjYwxTkJhEIRnd/8XKUkItVgbjVTqAaz1dTai4QJyA/93A0BLC6KFNsTKnhu8GAtbPYHUwj9rAxHRBKaZzcx8K+XDaQMVoJk/vmNNfZad6mSChgBAOTy7MAV28/vBKmj6xY66j2sH112ZFy/DVrQgl1lmoxBkpGofwXS8UbFNM6s6/EQge3T06vv9CACy+Pn1qRUt6FUIhhAUP64wU8BR1GYgAOgivJPfRScKkiAdJME0uxN/gX9gANg+HsREL5gIJgfpSFMv6oc3cXkry8Fcb8/tmJmcm0lv6+i2+9/mGwD5WRMGAFEzAAAAAElFTkSuQmCC) no-repeat center;background-size: 100% 100%;width: .15rem;height: .07rem}
/*\e600*/
.selectInput.on::after{transform:translateY(-55%) rotate(180deg);}
.selectInput .selectBox{position:absolute;right: -1px;height:auto;max-height:2.4rem;overflow:auto;background:#fff;top:105%;left:-1px;z-index:10;display:none;box-shadow:0 6px 20px rgba(189,206,240,.4);}

.selectInput .selectBox li{padding:0 .25rem;font-size: .16rem;color:#888;line-height: .48rem}
.selectInput .selectBox li:hover{background:#ffe6e6;color:#444}
.selectInput .selectBox li.on{background:#ffe6e6;color:#444}
@media (max-width: 992px){
.selectInput .selectBox li{font-size: .23rem;line-height: .54rem} 
.selectInput::after{font-size: .2rem}
.selectInput{font-size: .23rem}
}
@media (max-width: 597px){
.selectInput .selectBox li{font-size: .26rem;line-height: .62rem} 
.selectInput::after{font-size: .24rem}
.selectInput{font-size: .28rem}
.selectInput .selectBox{max-height: 3.7rem}
}
.zfPops .zfForm{margin-top: .6rem}
.zfPops .zfForm .sub{background: transparent;cursor: pointer;width: 1.9rem;margin: .3rem auto .3rem;display: block;position: relative;}
.zfPops .zfForm .sub img{width: 100%}
.zfPops .zfForm .sub img:first-child{position: relative;z-index: 3}
.zfPops .zfForm .sub img.ani{position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 0;pointer-events: none;user-select: none;display: block;opacity: .5;}
.zfPops .zfForm .sub img.ani1{animation: zoomAndFade ease-in-out 2s  infinite;}
.zfPops .zfForm .sub img.ani2{animation: zoomAndFades ease-in-out 2s  infinite;opacity: .3}


.zfPops .zfForm .zfclose{text-align: center}
.zfPops .zfForm .zfclose a{color: #fff}
.zfPops .zfForm  .items .item{color: #fff;display: flex;align-items: center}
.zfPops .zfForm  .items .item+.item{margin-left: .4rem}
.zfPops .zfForm  .items .item .selectInput{width: 2rem;padding: 0 .1rem}
.zfPops .zfForm  .items .item .selectInput::after{right: .05rem}
.zfPops .zfForm  .items .item .selectInput .defalutInput{line-height: .4rem;font-size: .18rem}
.zfPops .zfForm  .items .item label{font-size: .18rem;padding-right: .25rem}
.zfPops .zfForm  .items .item .inp{height: .46rem;border: 1px solid #bf9b52;border-left: 0;border-right: 0;position: relative;display: flex;align-items: center;flex:1;}
.zfPops .zfForm  .items .item .inp input{width: 100%;line-height: .4rem;padding: 0 .1rem;width: 2rem;color: #EDCA6E;font-size: .18rem}
.zfPops .zfForm  .items .item .inp input::-webkit-input-placeholder{color:rgba(255,255,255,.4);font-size:inherit}
.zfPops .zfForm  .items .item.zfy .inp input{width: 4rem}
.zfPops .zfForm  .items .item .inp:before{content: '';width: .1rem;position: absolute;left: -.09rem;top: -1px;bottom: -1px;background: url(../images/linel.png) no-repeat center;background-size: 100% 100%}
.zfPops .zfForm  .items .item .inp:after{content: '';width: .1rem;position: absolute;right: -.09rem;top: -1px;bottom: -1px;background: url(../images/liner.png) no-repeat center;background-size: 100% 100%}
.zfPops .tit{margin-bottom: .6rem}
.zfPops .tit img{height: 1.03rem}

.zfPops{display: flex;align-items: center;justify-content: center;flex-direction: column;}
.popZflist{max-width: 13rem;margin: 0 auto;text-align: center;max-height: 3.12rem;overflow: auto;padding-top: .1rem}
.popZflist li{color: #EDCA6E;border: 1px solid #EDCA6E;border-radius: .4rem;font-family: 'sys';display: inline-block;height: .48rem;line-height: .48rem;padding: 0 .25rem;margin:0 .2rem .3rem;font-size: .2rem;position: relative;background: linear-gradient(84deg, rgba(255, 222, 156, 0.4) 10%, rgba(255, 202, 95, 0) 107%);cursor: pointer;user-select: none}
.popZflist li:after{content: '';position: absolute;top: 0;left: 0;bottom: 0;right: 0;background: url(../images/zf14545.png);z-index: 0;pointer-events: none;opacity: 0;}
.popZflist li span{position: relative;display: block;padding-left: .35rem;z-index: 1}
.popZflist li span:before{content: '';position: absolute;width: .23rem;height: .23rem;background: url(../images/check.png) no-repeat center;background-size: 100% 100%;left: 0;top: 50%;margin-top: -.12rem;}
.popZflist li.on{background: linear-gradient(270deg, #E8C66B 0%, #DF4920 79%);color: #fff;box-shadow: 0px 0px 6px 0px rgba(237, 202, 110, 0.3),0px 0px 6px 0px rgba(237, 202, 110, 0.3),0px 0px 6px 0px rgba(237, 202, 110, 0.3);}
.popZflist li.on:after{opacity: 1;}
.popZflist li.on span:before{background: url(../images/checkon.png) no-repeat center;background-size: 100% 100%;}
.cardPop{width: 3.5rem;height: 6.2rem;position: absolute;left: 50%;margin-left: -1.75rem;top: 50%;margin-top: -3.1rem;display: none}
.cardPop .tip{writing-mode: vertical-lr;color: #fff;position: absolute;right: -.4rem;top: 2rem;letter-spacing: .1em;color: #EDCA6E}
.cardPop .closeCard{position: absolute;width: .35rem;height: .35rem;position: absolute;bottom: -.6rem;left: 50%;margin-left: -.17rem}
.cardPop .closeCard img{height: .35rem;user-select: none}
.cardPop .captureImg{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 5}
.cardPop .cptureBox .capture{width: 3.5rem;height: 6.2rem;background: url(../images/card.png) no-repeat center;background-size: cover;color: #fff;display: flex;flex-direction: column;justify-content: center;align-items: center;padding-bottom: 1.4rem}
.cardPop .cptureBox .capture .log{height: .8rem;display: block;margin: 0 auto .2rem;user-select: none}
.cardPop .cptureBox .capture .txt{text-align: center;padding: 0 .4rem ;margin-bottom: .15rem}
.cardPop .cptureBox .capture .txt #t1{ font-size: .18rem}
.cardPop .cptureBox .capture .txt #t2{font-size: .22rem;color: #EDCA6E;margin:.1rem 0;font-family: 'sys';font-weight: bold; }
.cardPop .cptureBox .capture .txt #t3{ font-size: .14rem}
.cardPop .cptureBox .capture .shareCode{display: none}
.cardPop .cptureBox .capture .shareCode p{font-size: .14rem;text-align: center;}
.cardPop .cptureBox .capture .shareCode img{height: .8rem;display: block;margin: 0 auto .1rem;user-select: none  }
@media (max-width: 992px){
.zfPops .zfForm{width: 90%;margin: .6rem auto 0}
.zfPops .zfForm .items .item{width: 46%;margin-bottom: .2rem}
.zfPops .zfForm .items .item+.item{margin-left: 0}
.zfPops .zfForm .items .item .inp input{width: 100%}
.zfPops .zfForm .items .item.zfy .inp input{width: 100%}
.zfPops .tit img{height: 1.3rem}
.popZflist{max-height: 4rem}
.popZflist li{height: .58rem;line-height: .58rem;font-size: .24rem}
.popZflist li span{padding-left: .4rem}
.popZflist li span:before{width: .3rem;height: .3rem;margin-top: -.15rem}
.zfPops .zfForm .items .item label{font-size: .24rem}
.zfPops .zfForm .items .item .selectInput{width: 100%}
.zfPops .zfForm .items .item .inp{height: .6rem}
.zfPops .zfForm .items .item .inp input{line-height: .5rem;font-size: .24rem}
.zfPops .zfForm .sub{width: 2.4rem}
.zfPops .zfForm .items .item .selectInput .defalutInput{line-height: .5rem}
.zfPops .zfForm .items .item .selectInput .defalutInput{font-size: .24rem}

.cardPop{width: 4.4rem;height: 7.79rem;margin-left: -2.2rem }
 .cardPop .cptureBox .capture{width: 4.4rem;height: 7.79rem;}
}
@media (max-width: 597px){
.popZflist{max-height: 3.7rem}
.zfPops .zfForm .items .item{width: 100%;margin-bottom: .2rem}
.zfPops .zfForm .items .item .selectInput .defalutInput{font-size: .26rem}
.popZflist li{height: .62rem;line-height: .62rem;font-size: .26rem}
.zfPops .zfForm .items .item .inp{height: .66rem}
.zfPops .zfForm .items .item .selectInput .defalutInput{line-height: .54rem}
.zfPops .zfForm .items .item .inp input{line-height: .54rem;font-size: .26rem}
.zfPops .zfForm .items .item label{font-size: .26rem}
}
 @media screen and (orientation: landscape) {
   @media (max-width: 992px){
    .zfPops{display: block;}
    .cardPop{width: 4.4rem;height: 7.79rem;position:relative;left:0;margin-left: 0;top: 0;margin-top:0;margin: 0 auto}
    .cardPop .cptureBox .capture{width: 4.4rem;height: 7.79rem;}
    .zfPops .wrap.hide{opacity: 1;visibility: visible;display: none;}
   }
 }
@media (min-width: 1025px){.pagee .zfBox ul.list{min-height: 4.7rem}}

               .zfForm #level option{color: #222}
               .zfPops .zfForm .items .item .inp select{width: 2rem}
               @media (max-width: 992px){
                .zfPops .zfForm .items .item .inp select{width: 100%}
               }
       @media (max-width: 597px){
                
                .pagee .zfBox .list li:last-child{display: none}
                .pagee .zfBox .list li:nth-last-child(2){display: none}
                .pagee .zfBox .list li:nth-last-child(3){display: none}
               }
