/*
*header
*/
header{width: 100%;background-color: rgba(31,32,41,.9);}
.header{width: 100%;height: 5rem;padding: 1rem;}
.header .back{font-size: 1.8rem;color: #fff;}
.header .back i{font-size: 1.8rem;color: #fff;margin: 0 1rem 0 0;}
.header .logo{width: 18rem;height: 6rem;}
.header .logo img{width: 100%;height: auto;}

/*
*post
*/
.post{width: 100%;}
.post-meta{width: 100%;height: auto;padding: 0 0 1rem;margin: 0 auto 2rem;overflow-x: auto;overflow-y: hidden;white-space: nowrap;}
.post-meta::-webkit-scrollbar{display: none;} 
.post-meta li{position: relative;margin: 0 1.5rem 0 0;}
.post-meta li a{font-size: 1.5rem;font-weight: bold;color: #e0e0e0;}
.post-meta li.on a{font-size: 2rem;font-weight: bold;color: #fff;cursor: default;pointer-events: none;}
.post-meta li.on:after{content: '';width: 1rem;height: .5rem;border-radius: .5rem;background-color: #fff;position: absolute;left: calc(50% - .5rem);bottom: -1rem;}
.post-notice{width: 100%;padding: 1rem;margin: 0 auto 2rem;border-radius: .5rem;background-color: rgba(255,235,167,.15);}
.post-notice i{font-size: 1.8rem;color: #ffeba7;}
.post-notice marquee{width: calc(100% - 3rem);font-size: 1.6rem;color: #ffeba7;}
.post-inner{width: 100%;}
.post-inner-item{width: 100%;padding: 2rem 1rem;margin: 0 auto 1rem;background-color: #2a2b38;border-radius: .5rem;}
.post-inner-item:first-child{border-radius: 0 .5rem .5rem;}
.post-inner-item-meta{width: 100%;margin: 0 0 2rem;}
.post-inner-item-meta-avatar{width: 4.6rem;height: 4.6rem;border: .1rem solid #fff;background-color: #fff;border-radius: 100%;overflow: hidden;}
.post-inner-item-meta-avatar img{width: 100%;height: auto;}
.post-inner-item-meta-msg{max-width: calc(100% - 14rem);width: 100%;}
.post-inner-item-meta-msg h2{font-size: 1.6rem;color: #fff;line-height: 2.6rem;}
.post-inner-item-meta-msg h3{font-size: 1.4rem;color: #999;line-height: 2rem;}
.post-inner-item-meta-like{width: 6.6rem;height: 3rem;border-radius: 3rem;border: .1rem solid #ffeba7;}
.post-inner-item-meta-like.is-like{background-color: #ffeba7;}
.post-inner-item-meta-like ins{font-size: 1.2rem;color: #ffeba7;cursor: pointer;}
.post-inner-item-meta-like.is-like ins{color: #1f2029;}
.post-inner-item ul{width: 100%;position: relative;}
.post-inner-item ul ins{position: absolute;bottom: 0;right: 0;z-index: 999;font-size: 1.4rem;background-color: rgba(0,102,255,.15);color: #06f;padding: .5rem 1rem;border-radius: 1rem 0 .5rem 0;}
.post-inner-item ul li{max-width: calc(100% / 3 - 1rem / 3);margin: 0 1rem 0 0;border-radius: .5rem;overflow: hidden;}
.post-inner-item ul li:nth-child(3n){margin: 0!important;}
.post-inner-item ul li img{width: 100%;height: 100%;object-fit: cover;transition: all 0.6s;}
.post-inner-item ul li img:hover{-webkit-transform: scale(1.2);-ms-transform: scale(1.2);transform: scale(1.2);}

/*
*app
*/
#pc{min-height: 100%;padding: 2rem 1rem 1rem;}
#wap{min-height: 100%;padding: 2rem 1rem 6rem;}
#app{height: 100%;padding: 8rem 1rem 6rem;position: relative;}
#wrap{min-height: 100%;padding: 6rem 1rem;}
#xiuer{height: 100%;overflow: hidden;}
#loading{position: fixed;width: 100%;height: 100%;background-color: #1f2029;left: 0;bottom: 0;z-index: 10000;}
.loading-inner{width: 8rem;height: 8rem;border-radius: 100%;background-color: #fff;animation: ball 1s ease-in-out infinite;}

/*
*page-normal
*/
.normal-page{width: 100%;padding: 3rem 2rem 2rem;border-radius: 1rem;background-color: #2a2b38;}
.normal-page-meta h1{font-size: 1.8rem;font-weight: bold;text-align: center;line-height: 2;}
.normal-page-meta h1:after {content: '';display: block;background: -webkit-linear-gradient(left, rgba(248,215,59,0),#ffeba7, rgba(248,215,59,0));height: .1rem;margin: 1.5rem 0 0;}
.normal-page-inner{width: 100%;margin: 2rem auto 0;}
.normal-page-inner p{font-size: 1.5rem;color: #ccc;line-height: 2;margin: 0 0 1rem;}
.normal-page-inner a{font-size: 1.5rem;color: #ffeba7;text-decoration: underline;}

/*
*swiper
*/
.cards{max-width: 36rem;width: 70%;height: auto;}
.cards .swiper-slide{position: relative;background-color: #fff;border-radius: 1rem;}
.cards .swiper-slide img{object-fit: cover;width: 100%;height: 100%;filter: blur(1.5rem);-webkit-filter: blur(1.5rem);}
.cards .swiper-slide-active img{filter: none;-webkit-filter: none;}
.cards .swiper-slide-meta{bottom: 2rem;right: 2rem;}
.cards .swiper-slide-meta i{font-size: 3rem;}
/**/
.vertical{width: 100%;height: 100%;}
.vertical .swiper-slide{width: 100%;height: 100%;}
.vertical .swiper-slide img{width:100%;height:100%;object-fit: contain;}
.vertical-pagination{height: 5rem;font-size: 1.6rem;line-height: 5rem;bottom: auto!important;top: 0;}
.vertical-pagination span{font-size: 1.6rem!important;}
/**/
.try-remind{padding: 6rem 3rem 3rem;text-align: center;border-radius: 1rem;}
.try-remind ins{font-size: 1.5rem;color: #fff;}
.try-remind ul{width: 100%;margin: 5rem 0 0;}
.try-remind ul a{width: calc(50% - 1rem);height: 3.6rem;background-color: #999;color: #fff;border-radius: .5rem;}
.try-remind ul a:first-child{background-color: #ffeba7;color: #1f2029;}
/**/
.relate h1{font-size: 1.6rem;text-align: center;line-height: 2;}
.relate h1:after {content: '';display: block;background: -webkit-linear-gradient(left, rgba(248,215,59,0),#ffeba7, rgba(248,215,59,0));height: .1rem;margin: 1.5rem 0 0;}
.relate ul{width: 100%;margin: 2rem auto 0;}
.relate ul li{width: calc(25% - .75rem);margin: 0 1rem 1rem 0;border-radius: .5rem;overflow: hidden;}
.relate ul li:nth-child(4n){margin: 0 0 1rem 0;}
.relate ul li img{width: 100%;height: 100%;object-fit: cover;transition: all 0.6s;}
.relate ul li img:hover{-webkit-transform: scale(1.2);-ms-transform: scale(1.2);transform: scale(1.2);}


/**/
.apply .swiper-slide{width: 6rem;height: 6rem;border-radius: 30%;overflow: hidden;}
.apply .swiper-slide img{width: 100%;height: auto;}
/**/
.slide{margin: 0 0 2rem;}
.slide .swiper-slide{width: 100%;height: 0!important;padding-bottom: 36%!important;border-radius: .5rem;overflow: hidden;background-position: center;background-size: cover;}

/*
*navbar
*/
.navbar{width: 6rem;height: auto;bottom: 6rem;right: 1rem;}
.navbar .avatar{width: 6rem;height: 6rem;margin: 0 0 2rem;background-color: #fff;border-radius: 100%;overflow: hidden;border: .1rem solid #fff;}
.navbar .avatar img{width: 100%;height: auto;}
.navbar li{width: 100%;text-align: center;margin: 0 0 1.5rem;}
.navbar li:last-child{margin: auto;}
.navbar li i{font-size: 3.6rem;color: #fff;}
.navbar li ins{font-size: 1.5rem;line-height: 2;}
.navbar li i.fanson-like{color: #F44336;}

/*
*xiuer
*/
.xiuer-loading{width: 100%;height: 6.6rem;margin: 0 0 3rem;}
.xiuer-loading img{width: 6.6rem;height: auto;}
.xiuer-item{width: calc(100% / 3 - 2rem / 3);height: auto;position: relative;border-radius: .5rem;overflow: hidden;margin: 0 1rem 1rem 0;}
.xiuer-item:nth-child(3n){margin: 0 0 1rem 0;}
.xiuer-item img{width: 100%;height: 100%;object-fit: cover;}
.xiuer-item-meta{position: absolute;bottom: 1rem;right: 1rem;}
.xiuer-item-meta i{font-size: 2.6rem;}
.xiuer-item-meta i.fanson-like{color: #F44336;}

/*
*login
*/
#login{width: 100%;padding: 6rem 3rem 3rem;border-radius: 1rem;}
.login-inner h1,.register-inner h1{font-size: 2rem;font-weight: bold;color: #ffeba7;text-align: center;margin: 0 0 3rem;}
.login-handle,.register-handle{width: 100%;height: auto;margin: 0 0 3rem;}
.login-handle li,.register-handle li{width: 100%;margin: 0 0 2rem;padding: .5rem 1rem;background-color: #1f2029;border: .1rem solid #1f2029;border-radius: .5rem;}
.login-handle li:last-child,.register-handle li:last-child{margin: auto;}
.login-handle li i,.register-handle li i{font-size: 1.6rem;color: #fff;}
.login-handle li input,.register-handle li input{width: calc(100% - 3rem);height: 3.6rem;font-size: 1.6rem;}
.register-handle li.invite input{width: calc(100% - 12rem);}
.register-handle li.invite a{width: 8rem;font-size: 1.5rem;color: #ffeba7;}
.login-submit,.register-submit{font-size: 1.8rem;color: #fff;margin: 0 0 3rem;}
.login-meta,.register-meta{width: 100%;}
.login-meta a,.register-meta a{font-size: 1.4rem;color: #999;}
.register-inner{display: none;}

/*
*user
*/
.user-meta{width: 100%;padding: 4rem 2rem 3rem;border-radius: 1rem;position: relative;}
.user-meta-avatar{width: 8rem;height: 8rem;background-color: #fff;border: .2rem solid #fff;border-radius: 100%;overflow: hidden;}
.user-meta-avatar img{width: 100%;height: 100%;object-fit: contain;}
.user-meta-name{width: calc(100% - 10rem);height: 8rem;}
.user-meta-name h1{font-size: 2rem;font-weight: bold;line-height: 3rem;}
.user-meta-name h2{font-size: 1.4rem;line-height: 3rem;}
/*.user-meta-name a{width: 12rem;height: 3.6rem;border-radius: .5rem;color: #102770;background-color: #ffeba7;}*/
.user-meta-name ins{font-size: 1.4rem;line-height: 2rem;color: #ffeba7;}

.user-sign{position: absolute;top: 2rem;right: 2rem;z-index: 99;}
.user-sign i{font-size: 2rem;}
.user-sign .fanson-setting{color: #fff;}

.user-box{width: 100%;background-color: #2a2b38;border-radius: 1rem;padding: 2rem 1rem;margin: 2rem auto 0;}
.user-box-meta{width: 100%;padding: 0 0 1rem;border-bottom: .1rem solid #1f2029;}
.user-box-meta h1{font-size: 1.6rem;color: #ffeba7;}
.user-box-meta i{font-size: 1.6rem;color: #ffeba7;margin: 0 .5rem 0 0;}
.user-box-meta a{font-size: 1.4rem;color: #999;}
.user-box-meta a i{color: #999;}
.user-box-meta ul{max-width: calc(100% - 12rem);text-align: right;}
.user-box-meta li{font-size: 1.6rem;color: #999;margin: 0 0 0 1.5rem;}
.user-box-meta li.on{color: #ffeba7;}

/*
*invite-handle
*/
.statistics-invite{width: 100%;margin: 2rem auto 0;}
.statistics-invite-handle ul{width: calc(100% / 3);}
.statistics-invite-handle ul li{width: 100%;padding: 1rem;font-size: 1.5rem;color: #ccc;text-align: center;border: .1rem solid #2a2b38;background-color: #1f2029;}
.statistics-invite-handle ul li a{width: 100%;height: 100%;font-size: 1.5rem;color: #ffeba7;}
/**/
.add-invite{width: 100%;margin: 2rem auto 0;display: none;}
.add-invite-handle{width: 100%;height: 3.6rem;background-color: #1f2029;border-radius: 3.6rem;overflow: hidden;border: 0.1rem solid #ffeba7;}
.add-invite-handle input{width: calc(100% - 10rem);height: 3.6rem;padding: .5rem 1rem .5rem 2rem;font-size: 1.6rem;}
.add-invite-handle a{width: 8rem;height: 3.6rem;border-radius: 3.6rem;background-color: #ffeba7;font-size: 1.6rem;color: #1f2029;}

/*
*invite-result
*/
.invite-result{width: 100%;height: 7rem;margin: 2rem auto 0;overflow: hidden;position: relative;display: none;}
.invite-result a{font-size: 1.4rem;padding: .5rem 1rem;background-color: rgba(255,235,167,.3);color: #ffeba7;border-radius: 0 .5rem 0 .5rem;position: absolute;bottom: 0;left: 0;z-index: 99;}
.invite-result-inner{width: 100%;height: 7rem;padding: .5rem 1rem;border-radius: .5rem;overflow-x: hidden;overflow-y: auto;background-color: #1f2029;}
.invite-result-inner ins{width: calc(50% - .5rem);font-size: 1.5rem;line-height: 3rem;text-align: center;}




.query-invite{width: 100%;margin: 2rem auto 0;display: none;}



/*
*#footer
*/
#pc-footer{width: 6rem;height: auto;bottom: 6rem;right: 1rem;}
#wap-footer{width: 100%;height: 5rem;right: 0;bottom: 0;background-color: rgba(31,32,41,.9);}
.footer{width: 100%;height: 5rem;}
.footer-item{max-width: 20%;height: 5rem;}
.footer-item a{text-align: center;}
.footer-item i{font-size: 2rem;}
.footer-item ins{font-size: 1.2rem;}

/*
*paging
*/
#paging{width: 100%;margin: 2rem auto 1rem;}
#paging a,#paging span{font-size: 1.2rem;padding: .5rem 1rem;margin: 0 .5rem;color: #ffeba7;border: .1rem solid #ffeba7;border-radius: .5rem;}
#paging .dots{color: #ffeba7;border: none;}
#paging .current{background-color: #ffeba7;color: #1f2029;}