.bg-gray{background-color: #f7f7f7;}
.toast-win{position: fixed;padding: 20px;font-size: 12px;color: #fff;background-color: rgba(0,0,0,0.7);width: 200px;top: 40%;left: 50%;margin-left: -120px;text-align: center;border-radius: 10px;z-index: 999;}
input[type=search]::-webkit-search-cancel-button{-webkit-appearance: none;}
.hide{display: none;}

.top-bar{height: 45px;border-bottom: 1px solid #EBEBEB;line-height: 45px;position: relative;background-color: #fff;}
.top-bar-back{height: 20px;padding: 12.5px 15px;}
.top-bar-right{font-size: 15px;color: #121212;letter-spacing: 0;float: right;padding: 0 15px;}
.top-bar-left{font-size: 15px;color: #121212;letter-spacing: 0;padding: 0 15px;display: inline-block;}
.top-bar-title{position: absolute;width: 60%;text-align: center;font-size: 16px;color: #252525;letter-spacing: 0;height: 45px;line-height: 45px;top: 0;left: 20%;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;font-weight: bold;}
.block-title{font-size: 20px;color: #121212;letter-spacing: 0;margin: 0px 15px;margin-top: 20px;padding-bottom: 10px;}
.input-line{border-bottom: 1px solid #D7D7D7;margin: 0px 15px;padding-bottom: 10px;margin-top: 30px;position: relative;}
.input-line-code{position: absolute;top: 2px;right: 10px;font-size: 14px;color: #7499FF;letter-spacing: 0;}
.input-line-codeimg{position: absolute;top: 0px;right: 10px;height: 28px;}
.input-line input{width: 100%;font-size: 17px;border: none;outline: none;}
.tip-line{margin: 10px 17px;}
.tip-line-left{font-size: 12px;color: #393939;letter-spacing: 0;}
.block-btn{background: #FF4838;border-radius: 4px;display: block;margin: 30px 23px;height: 45px;line-height: 45px;text-align: center;color: #fff;font-size: 14px;}
.footer-logo{width: 100px;display: block;margin: 0 auto;margin-top: 120px;}
.top-bar-edit{height: 20px;padding: 12.5px 15px;float: right;}

.search-bar{height: 55px;position: relative;width: 100%;left: 0;top: 0;background-color: #fff;box-sizing: border-box;padding-right: 70px;padding-left: 10px;z-index: 9;padding-top: 7.5px;}
.search-bar a{position: absolute;width: 70px;height: 55px;position: absolute;top: 0;right: 0;font-size: 15px;color: #252525;letter-spacing: 0;line-height: 55px;text-align: center;}
.search-bar input{display: block;box-sizing: border-box;width: 100%;height: 40px;padding-left: 36px;padding-right: 20px;background-image: url(../../images/mobile/top-bar-logo.png);background-repeat: no-repeat;background-size: 19px 19px;background-position: 10px 10px;background-color: #F7F7F7;border-radius: 3px;font-size: 15px;color: #252525;border: none;outline: none;}

.manga-list{padding: 5px 15px;}
.manga-item{padding: 15px;border-top: 1px solid #EBEBEB;padding-left: 105px;display: block;position: relative;min-height: 120px;}
.manga-item:first-child{border-top: none;}
.manga-item-cover{width: 90px;height: 120px;position: absolute;top: 15px;left: 0;border-radius: 6px;}
.manga-item-title{font-size: 16px;color: #121212;letter-spacing: 0;line-height: 24px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;font-weight: bold;}
.manga-item-subtitle{font-size: 12px;color: #909090;letter-spacing: 0;line-height: 14px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;margin-top: 10px;}
.manga-item-subtitle span{margin-right: 12px;}
.manga-item-content{font-size: 12px;color: #909090;letter-spacing: 0;line-height: 20px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;margin-top: 9px;}
.rank-1{position: absolute;font-size: 14px;color: #FFFFFF;letter-spacing: 0;height: 18px;width: 18px;line-height: 18px;text-align: center;border-radius: 4px 0 4px 0;top: 15px;left: 72px;background-color: #FA684B;}
.rank-2{position: absolute;font-size: 14px;color: #FFFFFF;letter-spacing: 0;height: 18px;width: 18px;line-height: 18px;text-align: center;border-radius: 4px 0 4px 0;top: 15px;left: 72px;background-color: #F7C325;}
.rank-3{position: absolute;font-size: 14px;color: #FFFFFF;letter-spacing: 0;height: 18px;width: 18px;line-height: 18px;text-align: center;border-radius: 4px 0 4px 0;top: 15px;left: 72px;background-color: #36D9B0;}
.rank-0{position: absolute;font-size: 14px;color: #FFFFFF;letter-spacing: 0;height: 18px;width: 18px;line-height: 18px;text-align: center;border-radius: 4px 0 4px 0;top: 15px;left: 72px;background-color: #BBBBBB;}

.class-list{font-size: 0;padding: 7px 0;border-bottom: 1px solid #f7f7f7;background-color: #fff;}
.class-list a{font-size: 13px;color: #121212;letter-spacing: 0;padding: 6px 12px;display: inline-block;}
.class-list a.active{color: #FF4838;}

.manga-i-list{padding: 12px 6px;font-size: 0;}
.manga-i-list-item{display: inline-block;width: 33.3%;box-sizing: border-box;padding: 8px;vertical-align: top;}
.manga-i-list-item a{position: relative;display: block;border-radius: 6px;overflow: hidden;}
.manga-i-cover{width: 100%;}
.manga-i-list.edit .manga-i-cover-bg{display: block;}
.manga-i-cover-bg{display: none;position: absolute;width: 100%;height: 100%;background-color: rgba(0,0,0,0.6);top: 0;left: 0;background-image: url(../../images/mobile/edit-1.png);background-repeat: no-repeat;background-position: 10px 10px;background-size: 20px 20px;}
.manga-i-cover-bg.active{background-image: url(../../images/mobile/edit-2.png);}
.manga-i-list-title{margin-top: 5px;font-size: 16px;color: #121212;letter-spacing: 0;line-height: 24px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.manga-i-list-subtitle{margin-top: 3px;font-size: 12px;color: #909090;letter-spacing: 0;line-height: 14px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;min-height: 14px;}

.selector-top{height: 40px;line-height: 40px;border-bottom: 1px solid #F4F4F4;text-align: center;background-color: #fff;position: relative;}
.selector-top-item{font-size: 15px;color: #999999;letter-spacing: 0;margin: 0 15px;position: relative;height: 40px;display: inline-block;padding: 0 10px;}
.selector-top-item.active{color: #252525;}
.selector-top-item.active:after{content:"";background-color: #FD113A;border-radius: 2.5px;width: 25px;height: 5px;display: block;position: absolute;bottom: 0;left: 50%;margin-left: -12.5px;}

.center-main{width: 92%;margin: 0 auto;margin-top: 15px;position: relative;}
.center-main-bg{width: 100%;}
.center-main-btn-con{position: absolute;top: 30%;width: 100%;left: 0;text-align: center;}
.center-main-btn{width: 35%;margin: 0 3%;height: 40px;line-height: 40px;font-size: 15px;color: #FF4838;letter-spacing: 0;text-align: center;border-radius: 2px;background-color: #fff;display: inline-block;}

.center-list{margin-top: 15px;padding: 0 15px;}
.center-list a{display: block;height: 50px;line-height: 50px;border-bottom: 1px solid #F6F6F6;font-size: 15px;color: #252525;letter-spacing: 0;font-weight: bold;background-image: url(../../images/mobile/arrow-right.png);background-repeat: no-repeat;background-size: 8px 15px;background-position: right 17.5px;}

.center-main-avatar-con{position: absolute;top: 15%;width: 100%;left: 0;text-align: center;}
.center-main-avatar{border: 4px solid #fff;height: 50px;width: 50px;border-radius: 27px;background-color: #fff;}
.center-main-avatar-con p{font-size: 15px;color: #FFFFFF;letter-spacing: 0;margin-top: 5px;}

.bottom-fixed-btn{width: 88%;height: 45px;line-height: 45px;text-align: center;font-size: 14px;color: #FFFFFF;letter-spacing: 0;display: block;position: fixed;left: 6%;bottom: 50px;background-color: #FF4838;}

.detail-bar{height: 160px;position: relative;overflow: hidden;}
.detail-bar-bg{-webkit-filter: blur(15px);-moz-filter: blur(15px);-o-filter: blur(15px);-ms-filter: blur(15px);filter: blur(15px);width: 100%;}
.detail-bar-back{position: absolute;top: 0;left: 0;height: 20px;padding: 15px 10px;}
.detail-bar-img{width: 100px;margin-left: -50px;position: absolute;left: 50%;bottom: 0;border: 3px solid #fff;border-bottom: 0;}

.detail-main{padding: 15px;}
.detail-main-title{font-size: 16px;color: #121212;letter-spacing: 0;line-height: 24px;}
.detail-main-subtitle{font-size: 12px;color: #909090;letter-spacing: 0;line-height: 14px;/* margin-top: 10px; */}
.detail-main-subtitle .block{display: inline-block;margin-right: 15px;margin-top: 10px;}
.detail-main-subtitle .block span{margin-right: 10px;}
.detail-main-content{font-size: 14px;color: #909090;letter-spacing: 0;margin-top: 10px;}
.detail-main-content a{color: #F59A23;display: inline-block;}

.detail-border{background: #F8F8F9;border-top: 1px solid #F4F4F4;border-bottom: 1px solid #F4F4F4;height: 10px;}

.detail-list-con{padding-bottom: 65px;}
.detail-list-title{height: 44px;line-height: 44px;padding: 0 15px;}
.detail-list-left{font-size: 12px;color: #121212;letter-spacing: 0;}
.detail-list-right{font-size: 12px;color: #909090;letter-spacing: 0;display: block;float: right;padding-right: 15px;background-repeat: no-repeat;background-size: 9px 12px;background-position: right 16px;}
.detail-list-right.sort-1{background-image: url(../../images/mobile/sort-1.png);}
.detail-list-right.sort-2{background-image: url(../../images/mobile/sort-2.png);}
.detail-list{padding: 0 5px;font-size: 0;}
.detail-list-item{width: 33.33%;box-sizing: border-box;padding: 5px;display: inline-block;}
.detail-list-item a{display: block;height: 36px;line-height: 36px;background: #F6F6F6;font-size: 14px;color: #121212;letter-spacing: 0;text-align: center;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;position: relative;}
.detail-list-item a.active{background: #FFEDED;}
.deatil-list-more{padding: 5px;}
.deatil-list-more a{display: block;height: 36px;line-height: 36px;background: #F6F6F6;font-size: 14px;color: #121212;letter-spacing: 0;text-align: center;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.new-logo{position: absolute;top: 0;right: 0;width: 25px;}
.lock-logo{position: absolute;bottom: 0;right: 0;width: 9px;}

.detail-bottom-con{position: fixed;width: 100%;left: 0;bottom: 0;font-size: 0;border-top: 1px solid #F4F4F4;background-color: #fff;}
.detail-bottom-btn-1{display: inline-block;width: 35%;font-size: 16px;color: #121212;height: 60px;line-height: 60px;background-image: url(../../images/mobile/collect-1.png);background-repeat: no-repeat;background-size: 22px 20px;background-position: 25px 20px;padding-left: 45px;padding-right: 20px;text-align: center;box-sizing: border-box;}
.detail-bottom-btn-1.active{background-image: url(../../images/mobile/collect-2.png);color: #D0D0D0;}
.detail-bottom-btn-2{display: inline-block;width: 65%;font-size: 16px;color: #fff;height: 60px;line-height: 60px;background-image: url(../../images/mobile/read-logo.png);background-repeat: no-repeat;background-size: 20px 13px;background-position: 24px 24px;padding-left: 50px;padding-right: 20px;text-align: center;box-sizing: border-box;background-color: #FF4838;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;vertical-align: top;}

.edit-btn{position: fixed;width: 100%;left: 0;bottom: 0;height: 50px;line-height: 50px;text-align: center;font-size: 14px;color: #FFFFFF;letter-spacing: 0;background: #FF4838;}

.index-padding{padding-top: 45px;}
.index-bar{height: 45px;position: relative;padding-left: 150px;padding-right: 95px;position: fixed;width: 100%;top: 0;left: 0;background-color: #fff;box-sizing: border-box;z-index: 9;}
.index-main-logo{height: 35px;position: absolute;left: 15px;top: 5px;}
.index-search{display: block;background-image: url(../../images/mobile/top-bar-logo.png);background-size: 16px 16px;background-repeat: no-repeat;height: 30px;line-height: 30px;background-position: 9px 7px;padding-left: 34px;font-size: 13px;color: #8D8D8D;letter-spacing: 0;background-color: #f6f6f6;border-radius: 15px;position: relative;top: 7.5px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;padding-right: 5px;}
.index-logo-1{height: 23px;width: 19px;position: absolute;right: 58px;top: 11px;}
.index-logo-2{height: 25px;width: 25px;position: absolute;right: 15px;top: 10px;}

.banner-con{font-size: 0;}
.banner-con img{width: 100%;}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{text-align: right;left: -10px;}
.swiper-pagination-bullet-active{background-color: #FF435C;}
.index-select-con{padding: 15px 7.5px;font-size: 0;}
.index-select{box-sizing: border-box;width: 50%;padding: 0 7.5px;display: inline-block;}
.index-select img{width: 100%;}

.index-border{background: #F8F8F9;border-top: 1px solid #F4F4F4;border-bottom: 1px solid #F4F4F4;height: 10px;}

.index-title-bar{padding: 0 15px;padding-top: 15px;margin-bottom: -5px;}
.index-title{font-size: 20px;color: #121212;letter-spacing: 0;font-weight: bold;}
.index-more{font-size: 12px;color: #8D8D8D;letter-spacing: 0;float: right;padding: 4px 0;padding-right: 20px;background-image: url(../../images/mobile/arrow-right.png);background-repeat: no-repeat;background-size: 8px 15px;background-position: right 5px;}