/*# zfa 头像安利神器2022 2026/4/29 16:21:45 */
html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}
body,nav,dl,dt,dd,p,h1,h2,h3,h4,ul,ol,li,input,button,textarea,footer{margin:0;padding:0}
body{font:62.5%/1.5 -apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue",STHeiti,"Microsoft Yahei",Tahoma,Simsun,sans-serif;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
h1,h2,h3,h4,h5,h6{font-size:100%}
img{vertical-align:middle;border:0;-webkit-tap-highlight-color:rgba(0,0,0,0)}
em,i{font-style:normal}
img{max-width:100%;border:0}
input:focus{outline:0}
table{border-collapse:collapse;border-spacing:0}
ol,ul,li{list-style:none}
textarea{resize:none}
a{text-decoration:none;color:#333}
.cf:after{content:" ";display:block;height:0;clear:both;visibility:hidden}
.cf{min-height:1%}
.fl{float:left}
.fr{float:right}
.hide{display:none}
.show{display:block}
.ellipsis{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.break{word-break:break-all;word-wrap:break-word}
html{font-size:100px;font-size:13.33333vw}
@media screen and (max-width:320px){html{font-size:42.6666666667px;font-size:13.33333vw}}
@media screen and (min-width:321px) and (max-width:360px){html{font-size:48px;font-size:13.33333vw}}
@media screen and (min-width:361px) and (max-width:375px){html{font-size:50px;font-size:13.33333vw}}
@media screen and (min-width:376px) and (max-width:393px){html{font-size:52.4px;font-size:13.33333vw}}
@media screen and (min-width:394px) and (max-width:412px){html{font-size:54.9333333333px;font-size:13.33333vw}}
@media screen and (min-width:413px) and (max-width:414px){html{font-size:55.2px;font-size:13.33333vw}}
@media screen and (min-width:415px) and (max-width:480px){html{font-size:64px;font-size:13.33333vw}}
@media screen and (min-width:481px) and (max-width:540px){html{font-size:72px;font-size:13.33333vw}}
@media screen and (min-width:541px) and (max-width:640px){html{font-size:85.3333333333px;font-size:13.33333vw}}
@media screen and (min-width:641px) and (max-width:720px){html{font-size:96px;font-size:13.33333vw}}
@media screen and (min-width:721px) and (max-width:750px){html{font-size:100px;font-size:13.33333vw}}
@media screen and (min-width:751px){html{font-size:100px}
body{width:750px;margin:0 auto}}
.recoArea .bd,.cateList .cateList-head .btn,.cateList .cateList-head,.imgList .sp-type,.msgText,.schArea .txt,.msgArea{-webkit-box-sizing:border-box;box-sizing:border-box}
body{width:7.5rem;margin:0 auto;background:#fff}
:root{--Ba1:#000;--Ba2:#333;--Ga1:#818181;--Ga2:#8D8D8D;--Ga3:#A4A4A4;--Ga4:#F5F5F5;--Ga5:#F4F4F4;--Re1:#F45454;--Gr1:#29C67D;--Gr2:#69DE9C;--Gr3:#D2FFE6}
.pageHome{background:#CCF4DE;padding-bottom:0.3rem}
.headShow{min-height:5.08rem}
.headShow img{display:block;width:100%;pointer-events:none}
body .mainWrap{width:6.9rem;margin:-1.32rem auto 0;position:relative}
.msgArea{height:0.4rem;border:1px solid rgba(255,255,255,0.1);background:rgba(0,0,0,0.3);background-image:url(../images/ico-msg.png);background-position:0.24rem center;background-size:0.3rem 0.3rem;background-repeat:no-repeat;padding:0.02rem 0.2rem 0.02rem 0.62rem}
.msgArea .inner{height:100%;overflow:hidden}
.msgArea .inner li{height:0.34rem;line-height:0.34rem;font-size:0.22rem;color:#fff}
.schArea{height:0.7rem;background:#fff;border-radius:0.35rem;margin-top:0.24rem}
.schArea input{background:none;border:none}
.schArea .txt{float:left;width:86%;height:0.7rem;padding:0.14rem 0 0.14rem 0.32rem;font-size:0.28rem;line-height:0.44rem}
.schArea .txt::-webkit-input-placeholder{color:var(--Gr2)}
.schArea .txt::-moz-placeholder{color:var(--Gr2)}
.schArea .txt:-ms-input-placeholder{color:var(--Gr2)}
.schArea .txt::-ms-input-placeholder{color:var(--Gr2)}
.schArea .txt::placeholder{color:var(--Gr2)}
.schArea .btn{float:right;width:14%;height:0.7rem;overflow:hidden;line-height:99;background:url(../images/ico-sch.png) no-repeat center;background-size:0.36rem auto;background-color:transparent;cursor:pointer}
.loadEnd{text-align:center;font-size:0.22rem;color:var(--Gr1);line-height:0.3rem;padding:0.34rem 0}
.fixSide{position:fixed;width:1.06rem;right:0.15rem;bottom:1.5rem}
.fixSide a{display:block;width:100%;overflow:hidden;line-height:99;margin:0.2rem auto 0}
.fixSide .bt-feedback{background:url(../images/btn-fix-feedback.png) no-repeat 0 0;background-size:100% 100%;background-color:transparent;height:1.32rem}
.fixSide .bt-upload{background:url(../images/btn-fix-upload.png) no-repeat 0 0;background-size:100% 100%;background-color:transparent;height:1.06rem}
.fixSide .bt-backtop{background:url(../images/btn-fix-backtop.png) no-repeat 0 0;background-size:100% 100%;background-color:transparent;width:0.78rem;height:0.78rem}
.mianArea{background:#fff;overflow:hidden;border-radius:0.3rem;margin-top:0.3rem}
.mianArea .main-hd{height:1rem;border-bottom:1px solid var(--Ga5);overflow:hidden}
.mianArea .main-hd ul{display:-webkit-box;display:-ms-flexbox;display:flex}
.mianArea .main-hd li{-webkit-box-flex:1;-ms-flex:1;flex:1;height:1rem;text-align:center;line-height:1.02rem;font-size:0.3rem;color:var(--Ga3)}
.mianArea .main-hd li i{background:url(../images/nav-item.png) no-repeat 0 0;background-size:400% 200%;background-color:transparent;display:inline-block;width:0.28rem;height:0.28rem;overflow:hidden;vertical-align:middle;margin:-0.04rem 0.06rem 0 0}
.mianArea .main-hd li .nav-new{background-position:0 0}
.mianArea .main-hd li .nav-hot{background-position:33.34% 0}
.mianArea .main-hd li .nav-cate{background-position:66.67% 0}
.mianArea .main-hd li .nav-fav{background-position:100% 0}
.mianArea .main-hd .active{color:var(--Gr1);font-weight:bold;background:url(../images/nav-active.png) no-repeat center bottom;background-size:auto 0.06rem;background-color:transparent}
.mianArea .main-hd .active .nav-new{background-position:0 100%}
.mianArea .main-hd .active .nav-hot{background-position:33.34% 100%}
.mianArea .main-hd .active .nav-cate{background-position:66.67% 100%}
.mianArea .main-hd .active .nav-fav{background-position:100% 100%}
.mianArea .main-bd{min-height:4rem;padding:0.3rem 0}
.msgText{background:url(../images/ico-msg-grye.png) no-repeat left center;background-size:0.28rem auto;background-color:transparent;width:6.12rem;height:0.32rem;overflow:hidden;line-height:0.34rem;color:var(--Ga3);font-size:0.24rem;padding-left:0.38rem;margin:0 auto 0.28rem}
.imgList{width:6.3rem;margin:0 auto}
.imgList li{float:left;width:1.9rem;height:1.9rem;border-radius:0.2rem;overflow:hidden;margin:0.2rem 0.1rem 0;position:relative}
.imgList li:nth-child(-n+3){margin-top:0}
.imgList li img{display:block;width:100%;height:100%}
.imgList .sp-fav{position:absolute;right:0;bottom:0;background:url(../images/ico-favli.png) no-repeat 0 0;background-size:100% 100%;background-color:transparent;width:0.52rem;height:0.3rem}
.imgList .sp-type{position:absolute;left:0;bottom:0;text-align:center;width:100%;height:0.64rem;line-height:0.66rem;color:#fff;font-size:0.24rem;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:0 0.1rem;background:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),color-stop(10%,rgba(0,0,0,0)),to(rgba(0,0,0,0.9)));background:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 10%,rgba(0,0,0,0.9) 100%)}
.favNone{text-align:center;color:var(--Gr1);font-size:0.24rem;line-height:1.6;padding:0.5rem 0}
.cateList{display:none}
.cateList .cateList-head{width:6.12rem;height:0.44rem;overflow:hidden;line-height:0.46rem;font-size:0.24rem;margin:0 auto 0.28rem}
.cateList .cateList-head .txt{float:left;color:var(--Ba2)}
.cateList .cateList-head .btn{float:right;width:1rem;height:0.44rem;overflow:hidden;text-align:center;line-height:0.44rem;font-size:0.24rem;border-radius:0.22rem;border:1px solid var(--Gr1);color:var(--Gr1)}
.vFull .headBar{padding:0 0.88rem}
.headHold{padding-top:0.96rem;height:48px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%}
.headBar{width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;height:0.88rem;overflow:hidden;line-height:0.9rem;font-size:0.32rem;color:var(--Ba2);padding:0 0.3rem}
.headBar .bt-back{display:none;background:url(../images/btn-back.png) no-repeat left center;background-size:0.18rem auto;background-color:transparent;padding-left:0.34rem}
.headBar .bt-menu{background:url(../images/btn-menu.png) no-repeat center;background-size:0.3rem auto;background-color:transparent;width:0.88rem;height:0.88rem;overflow:hidden;line-height:99;margin-right:-0.3rem}
.headBar .bt-upload{float:right;width:0.96rem;height:0.48rem;overflow:hidden;text-align:center;line-height:0.5rem;font-size:0.26rem;color:#fff;border-radius:0.24rem;background:-webkit-gradient(linear,left top,right top,from(#56E973),to(#2DD48C));background:linear-gradient(to right,#56E973,#2DD48C);margin-top:0.2rem}
.m-crop-image-canvas{position:fixed;top:0;left:100%;z-index:900;width:100%;height:100%;will-change:transform;background-color:#fff;-webkit-animation:fadeInRight 0.3s linear both;animation:fadeInRight 0.3s linear both;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.m-crop-image-canvas.z-close{-webkit-animation:fadeOutRight 0.3s linear both;animation:fadeOutRight 0.3s linear both}
.m-crop-image-canvas .head{position:absolute;top:0;left:0;z-index:2;width:100%;text-align:center;font-size:0}
.m-crop-image-canvas .head a{display:inline-block;width:60px;height:40px;margin:0 20px;background:url("../images/crop_icons.png") no-repeat;background-size:228px 20px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);text-indent:-1000px;overflow:hidden}
.m-crop-image-canvas .head .zoom-in{background-position:20px 10px}
.m-crop-image-canvas .head .zoom-out{background-position:-85px 10px}
.m-crop-image-canvas .head .rotate{background-position:-189px 10px}
.m-crop-image-canvas .panel{height:100%;overflow:hidden}
.m-crop-image-canvas .panel canvas{display:block;width:100%;height:100%}
.m-crop-image-canvas .foot{position:absolute;bottom:0;left:0;z-index:2;width:100%;height:36px;padding:10px 0;text-align:center;font-size:0;opacity:0.8}
.m-crop-image-canvas .foot a{display:inline-block;width:120px;height:32px;margin:0 5px;text-align:center;line-height:32px;font-size:14px;color:#fff;border:1px solid #fff;-webkit-tap-highlight-color:rgba(0,0,0,0)}
.m-crop-image-canvas .foot .done{color:#3f3f3f;background-color:#fff}
.m-crop-image-canvas .loading{position:absolute;top:0;left:0;z-index:10;display:none;width:100%;height:100%}
.m-crop-image-canvas .loading .spinner{position:absolute;top:50%;left:0;width:100%;height:60px;margin-top:-30px;padding-left:0;text-align:center;font-size:0}
.m-crop-image-canvas .loading .spinner li{background-color:#fff;height:100%;width:6px;display:inline-block;margin:0 2px;-webkit-animation:stretchdelay 1.2s infinite ease-in-out;animation:stretchdelay 1.2s infinite ease-in-out}
.m-crop-image-canvas .loading .spinner li:nth-child(2){-webkit-animation-delay:-1.1s;animation-delay:-1.1s}
.m-crop-image-canvas .loading .spinner li:nth-child(3){-webkit-animation-delay:-1s;animation-delay:-1s}
.m-crop-image-canvas .loading .spinner li:nth-child(4){-webkit-animation-delay:-0.9s;animation-delay:-0.9s}
.m-crop-image-canvas .loading .spinner li:nth-child(5){-webkit-animation-delay:-0.8s;animation-delay:-0.8s}
@-webkit-keyframes fadeInRight{0%{opacity:0;left:100%}
100%{opacity:1;left:0}}
@keyframes fadeInRight{0%{opacity:0;left:100%}
100%{opacity:1;left:0}}
@-webkit-keyframes fadeOutRight{0%{opacity:1;left:0}
100%{opacity:0;left:100%}}
@keyframes fadeOutRight{0%{opacity:1;left:0}
100%{opacity:0;left:100%}}
@-webkit-keyframes stretchdelay{0%,40%,100%{-webkit-transform:scaleY(0.4)}
20%{-webkit-transform:scaleY(1)}}
@keyframes stretchdelay{0%,40%,100%{transform:scaleY(0.4);-webkit-transform:scaleY(0.4)}
20%{transform:scaleY(1);-webkit-transform:scaleY(1)}}
.upArea{padding:0.25rem 0.3rem}
.upArea .fileimg{width:7.22rem;overflow:hidden;margin-top:-0.2rem}
.upArea .fileimg .square{float:left;width:2.2rem;height:2.2rem;overflow:hidden;font-size:0;background:url(../images/ico-add.png) no-repeat center;background-size:0.7rem auto;background-color:#F2F2F2;line-height:2.2rem;margin-right:0.2rem;margin-top:0.2rem;border-radius:0.1rem;position:relative;-webkit-box-shadow:0 0 0.05rem 0 #F2F2F2;box-shadow:0 0 0.05rem 0 #F2F2F2}
.upArea .fileimg .square img{display:inline-block;vertical-align:middle;width:100%}
.upArea .fileimg .square .del{width:0.48rem;height:0.48rem;overflow:hidden;line-height:99;position:absolute;right:0;top:0;background:url(../images/ico-del.png) no-repeat center;background-size:0.32rem auto;background-color:transparent}
.upArea .fileimg .square input{width:100%;height:100%;position:absolute;left:0;top:0}
.upArea .upRule{border-top:1px solid var(--Ga4);margin-top:0.4rem;padding-top:0.3rem}
.upArea .upRule dt{font-size:0.3rem;color:var(--Ba2);line-height:0.44rem;margin-bottom:0.1rem}
.upArea .upRule dd{font-size:0.24rem;line-height:0.4rem;color:var(--Ga3)}
.upArea .upCate{border-top:1px solid var(--Ga4);margin-top:0.4rem;padding-top:0.3rem}
.upArea .upCate .hd{height:0.46rem;padding-left:0.46rem;line-height:0.48rem;font-size:0.32rem;color:var(--Ba2);background:url(../images/ico-cate.png) no-repeat left center;background-size:0.32rem auto;background-color:transparent}
.upArea .upCate .bd{width:7.1rem}
.upArea .upCate .bd li{float:left;width:2.16rem;height:0.6rem;text-align:center;line-height:0.62rem;font-size:0.28rem;color:var(--Ga2);background:var(--Ga4);border-radius:0.3rem;margin:0.2rem 0.2rem 0 0}
.upArea .upCate .bd .active{background:var(--Gr3);color:var(--Gr1)}
.recoArea{border-top:0.1rem solid #F7F7F7;padding:0.25rem 0.3rem}
.recoArea .hd{height:0.5rem;line-height:0.52rem;font-size:0.26rem;color:var(--Ba2)}
.recoArea .hd p{color:#5b5b5b}
.recoArea .bd{width:7.2rem;height:0.98rem;overflow:auto;line-height:0;font-size:0;white-space:nowrap;margin-top:0.2rem;padding-right:0.3rem}
.recoArea .bd::-webkit-scrollbar{display:none}
.recoArea .bd li{display:inline-block;width:0.98rem;height:0.98rem;overflow:hidden;border-radius:0.1rem;margin-right:0.2rem}
.recoArea .bd li:last-child{margin-right:0}
.recoArea .bd li img{display:block;width:100%;height:100%}
.recoArea .ft{font-size:0.22rem;color:var(--Ga3);line-height:0.34rem;margin-top:0.2rem;padding:0.1rem 0}
.showArea{padding:0.2rem 0.3rem}
.showArea .imgCon{width:6.9rem;height:6.9rem;overflow:hidden;border-radius:0.5rem;position:relative}
.showArea .imgCon .img{display:block;width:100%;height:100%}
.showArea .imgCon .tool{position:absolute;right:0.4rem;bottom:0.2rem}
.showArea .imgCon .tool span{float:left;height:0.44rem;overflow:hidden;background:rgba(0,0,0,0.4);border-radius:0.22rem;margin-left:0.14rem}
.showArea .imgCon .tool .good{line-height:0.46rem;font-size:0.24rem;color:#fff;padding:0 0.15rem 0 0.4rem;background-image:url(../images/good.png);background-position:0.1rem 45%;background-size:0.26rem auto;background-repeat:no-repeat}
.showArea .imgCon .tool .good.active{background-image:url(../images/good-active.png);color:#ff5959}
.showArea .imgCon .tool .fav{width:0.44rem;background-image:url(../images/love.png);background-position:center 60%;background-size:0.3rem auto;background-repeat:no-repeat}
.showArea .imgCon .tool .fav.active{background-image:url(../images/love-active.png);-webkit-animation:love 0.4s ease-in 1;animation:love 0.4s ease-in 1}
.showArea .imgInfo{margin-top:0.4rem;height:0.6rem}
.showArea .imgInfo .uinfo{float:left;width:4.1rem;height:0.6rem;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;line-height:0.62rem;font-size:0.28rem;color:var(--Ba2)}
.showArea .imgInfo .uinfo img{float:left;width:0.6rem;height:0.6rem;border-radius:50%;margin-right:0.18rem}
.showArea .imgInfo .text{float:right;height:0.6rem;line-height:0.62rem;font-size:0.26rem;color:var(--Ga3);background:url(../images/ico-slide.png) no-repeat left center;background-size:0.32rem auto;background-color:transparent;padding-left:0.36rem}
.showArea .imgTool{height:0.96rem;margin-top:0.3rem}
.showArea .imgTool .bt{float:left;width:0.76rem;height:0.96rem;text-align:center;line-height:1.4;font-size:0.26rem;color:var(--Ga2);margin-right:0.2rem}
.showArea .imgTool .bt i{display:block;width:0.6rem;height:0.56rem;margin:0 auto}
.showArea .imgTool .bt i.it-view{background:url(../images/ico-view.png) no-repeat 0 0;background-size:100% 100%;background-color:transparent}
.showArea .imgTool .bt i.it-save{background:url(../images/ico-down.png) no-repeat 0 0;background-size:100% 100%;background-color:transparent}
.showArea .imgTool .bt-primary{float:right;width:4.54rem;height:0.7rem;overflow:hidden;text-align:center;line-height:0.72rem;color:#fff;font-size:0.3rem;border-radius:0.35rem;background:-webkit-gradient(linear,left top,right top,from(#59E976),to(#2ED48C));background:linear-gradient(to right,#59E976,#2ED48C);margin-top:0.13rem}
@-webkit-keyframes love{0%{background-size:0 auto}
100%{background-size:0.3rem auto}}
@keyframes love{0%{background-size:0 auto}
100%{background-size:0.3rem auto}}
.imgView{display:none;width:7.5rem;height:100%;position:fixed;left:50%;top:0;margin-left:-3.75rem;background:url(../images/view.png) no-repeat 0 0;background-size:100% auto;background-color:transparent}
.imgView img{pointer-events:none}
.imgView .ava-big{width:1.62rem;height:1.62rem;border-radius:50%;border:2px solid #fff;-webkit-box-shadow:0 0 0.2rem 0 rgba(0,0,0,0.2);box-shadow:0 0 0.2rem 0 rgba(0,0,0,0.2);position:absolute;left:0.3rem;top:1.42rem}
.imgView .ava-small{width:0.72rem;height:0.72rem;border-radius:50%;-webkit-box-shadow:0 0 0.03rem 0 rgba(0,0,0,0.2);box-shadow:0 0 0.03rem 0 rgba(0,0,0,0.2);position:absolute;left:0.3rem;top:7.42rem}
.imgView .text{position:absolute;left:0;bottom:0;background:rgba(0,0,0,0.4);text-align:center;width:100%;height:0.4rem;line-height:0.42rem;color:#fff;font-size:0.24rem}
.diaMask{display:none;width:100%;height:100%;background:rgba(0,0,0,0.7);position:fixed;left:0;top:0;z-index:999}
.diaArea{display:none;width:5.4rem;border-radius:0.1rem;overflow:hidden;background:#fff;position:relative;z-index:1000}
.diaArea .dia-hd{height:0.76rem;text-align:center;line-height:0.78rem;overflow:hidden;background:#08D080;color:#fff;font-size:0.28rem}
.diaArea .dia-bd{padding:0.24rem;font-size:0.24rem;line-height:1.6}
.diaArea .dia-bd > div{margin-top:0.1rem}
.diaArea .dia-ft{height:0.84rem;border-top:1px solid #eee;overflow:hidden}
.diaArea .dia-ft a{display:block;height:0.84rem;line-height:0.86rem;font-size:0.26rem;text-align:center}
.diaArea .downApp{display:block;width:2.8rem;height:0.6rem;text-align:center;line-height:0.62rem;font-size:0.26rem;color:#fff;background:-webkit-gradient(linear,left top,right top,from(#56E973),to(#2DD48C));background:linear-gradient(to right,#56E973,#2DD48C);border-radius:0.3rem;margin:0.15rem auto 0}
.diaArea .dia-f26{font-size:0.26rem}
.diaArea .dia-f22{font-size:0.22rem}
.diaArea .dia-f20{font-size:0.2rem}
.diaArea .cRed{color:#f45454}
.diaArea .cGrey{color:#8d8d8d}
.diaArea .tac{text-align:center}
.diaArea .pd20{padding:0.2rem 0}
.menuWrap{display:none;width:100%;height:100%;background:rgba(0,0,0,0.7);position:fixed;left:0;top:0;z-index:999}
.menuWrap .menuArea{position:absolute;left:50%;bottom:0;background:#F7F7F7;border-radius:0.15rem 0.15rem 0 0;overflow:hidden;width:7.5rem;margin-left:-3.75rem;-webkit-animation:menu 0.5s linear;animation:menu 0.5s linear}
.menuWrap .menuArea .mn-list{background:#fff}
.menuWrap .menuArea .mn-list li{height:1rem;line-height:1.02rem;text-align:center;font-size:0.32rem;border-bottom:1px solid #eee}
.menuWrap .menuArea .mn-list li a{display:block}
.menuWrap .menuArea .mn-cancel{background:#fff;display:block;height:1rem;line-height:1.02rem;text-align:center;font-size:0.32rem;padding-bottom:0.15rem;margin-top:0.15rem}
@-webkit-keyframes menu{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}
100%{-webkit-transform:translateY(0);transform:translateY(0)}}
@keyframes menu{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}
100%{-webkit-transform:translateY(0);transform:translateY(0)}}