body{display:flex;flex-direction:column}
.main-container{flex:1;background:#f0f2f4}
.main-container.black{background:#191919}
.cc-container,.container{margin:0 auto;width:960px}
.offset-y{margin-top:-70px}
footer{padding:50px 0 40px;background:#f0f2f4;text-align:center}
footer.black{background:#191919}
footer .links{margin-left:-10px;margin-bottom:10px}
footer .links a{display:inline-block;padding:0 10px 10px;height:16px;line-height:16px;font-size:12px;color:#444}
footer .beian span,footer .links span{margin:0 10px;font-size:10px;color:#525252}
footer .meta{font-size:12px;font-weight:500;color:#525252}
footer .beian a{font-size:10px;color:#525252}
footer.black .beian a,footer.black .links a,footer.black .links span,footer.black .meta{color:#fff}
footer .beian{margin-top:8px}
@media (max-width:640px){
.cc-container,.container{width:100%;box-sizing:border-box}
footer{display:none;padding:30px 10px}
}
.hidden{display:none}
.mt-50{margin-top:50px}
.mt-60{margin-top:60px}
.mt-70{margin-top:70px}
.mt-120{margin-top:120px}
.page-header{display:flex;align-items:center}
.center-h-text{text-align:center}
.ico{display:inline-block;width:24px;height:24px;margin-right:8px;background-repeat:no-repeat;background-size:contain;background-position:center;background-image:url(/public/img/res/like.png)}
.ico.s{width:12px;height:12px}
.ico.m{width:24px;height:24px}
.ico.l{width:32px;height:32px}
.ico.xl{width:48px;height:48px}
.ico.xxl{width:64px;height:64px}
.ico-search{background-image:url(/public/img/icon/search.png)}
.tags-wrap{margin:10px 0;display:flex;align-items:center}
.tags-wrap.between{justify-content:space-between}
.tags-wrap h2{font-size:14px;letter-spacing:1px;margin-right:20px}
.tags-wrap ul{display:flex}
.tags-wrap ul li{margin-right:10px;background:oklch(52.77% .138 145.41);height:24px;line-height:24px;border-radius:12px;padding:0 10px;font-size:12px;letter-spacing:.5px}
.tags-wrap ul li.video{background-color:oklch(58.83% .158 145.05)}
.tags-wrap ul li.audio{background-color:oklch(64.24% .175 144.92)}
.tags-wrap ul li.music{background-color:oklch(70.03% .194 144.71)}
.tags-wrap ul li.book{background-color:oklch(75.23% .209 144.64)}
.tags-wrap ul li.user{background-color:oklch(79.33% .179 145.62)}
.tags-wrap ul li.def{background-color:oklch(83.74% .139 146.57)}
.tags-wrap ul li a{color:#fff}
.tags-wrap ul li.active,.tags-wrap ul li:hover{box-shadow:0 2px 16px rgb(0 0 0 / 28%)}
.tags-wrap ul li.active a,.tags-wrap ul li:hover a{color:#fff}
.tags-sticky{position:sticky;z-index:2}
.booklib-wrap .tags-sticky,.bookshelf-wrap .tags-sticky{padding:10px 0; top:10px}
.tags-sticky .ltype,.tags-sticky .subtype h2{display:none}
@media (max-width:640px){
.booklib-wrap .tags-wrap ul{width:100%;display:flex;flex-flow:wrap;justify-content:space-evenly;align-items:center}
.booklib-wrap .tags-wrap ul li{margin:0 0 10px 0;padding:0;width:15%;box-sizing:border-box;text-align:center;overflow:hidden}
.booklib-wrap .tags-sticky{padding-bottom:0}
.tags-wrap ul{flex-direction:row;align-items:center}
}
.bookcover{display:block;width:100%;height:100%;background:#d8d8d8;position:relative;filter:drop-shadow(2px 2px 3px rgba(0, 0, 0, .3))}
.bookcover-img{vertical-align:top;width:100%;height:100%;background-color:#d8d8d8;-o-object-fit:cover;object-fit:cover}
.bookcover-decor{position:absolute;top:0;right:0;bottom:0;left:0}
.bookcover-decor.bookcover-gredientdecor{background-image:-webkit-gradient(linear,left top,right top,from(hsla(0,0%,63.1%,.25)),color-stop(1%,rgba(21,21,20,.1)),color-stop(4%,hsla(0,0%,100%,.15)),color-stop(8%,hsla(0,0%,58%,.1)),color-stop(57%,hsla(0,0%,89%,0)),color-stop(91%,rgba(223,218,218,.03)),color-stop(98%,rgba(223,218,218,.05)),to(hsla(0,0%,100%,.1)));background-image:linear-gradient(90deg,hsla(0,0%,63.1%,.25),rgba(21,21,20,.1) 1%,hsla(0,0%,100%,.15) 4%,hsla(0,0%,58%,.1) 8%,hsla(0,0%,89%,0) 57%,rgba(223,218,218,.03) 91%,rgba(223,218,218,.05) 98%,hsla(0,0%,100%,.1))}
.booklib-wrap,.bookshelf-wrap{margin-top:50px}
.books-shelf-title{font-size:14px;margin:20px 0}
.books-shelf-wrap{margin-top:30px;display:grid;grid-template-columns:repeat(auto-fill,120px);justify-content:start;grid-column-gap:20px}
.shelf-book-wrap{width:120px;height:174px;background:rgba(0,0,0,.5);margin-bottom:60px}
.shelf-book-wrap.circle,.shelf-book-wrap.square{height:120px;background:0 0}
.shelf-book-wrap.circle .cover{border:4px solid #fff;border-radius:50%;overflow:hidden;box-sizing:border-box}
.shelf-book .title{height:30px;line-height:30px;font-size:14px;letter-spacing:.5px;color:#333;text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
@media (max-width:640px){
.books-shelf-wrap{margin-top:20px;grid-template-columns:repeat(auto-fill,110px);justify-content:space-evenly;grid-column-gap:0}
.shelf-book-wrap{width:110px;height:160px;background:rgba(0,0,0,.5);margin-bottom:50px}
.shelf-book-wrap.circle,.shelf-book-wrap.square{height:110px;background:0 0}
.booklib-wrap,.bookshelf-wrap{margin-top:20px}
.books-shelf-title,.bookshelf-wrap .tags-sticky{padding-left:20px}
}
.booksearch-wrap{margin-top:80px}
.booksearch-wrap .keyword{padding:20px;font-size:20px;letter-spacing:1px;color:#fff}
.books-list-wrap{margin-top:30px;display:flex;flex-direction:column}
.list-book-wrap{width:100%;border-bottom:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.2);padding:20px 30px 20px 20px}
.list-book-wrap a{display:flex}
.list-book-wrap .list-book{width:120px;height:174px;background:rgba(0,0,0,.5);margin-right:20px}
.list-book-wrap .bookinfo{flex:1}
.list-book-wrap .bookinfo .title{font-size:20px;letter-spacing:1px;font-weight:700;line-height:50px;color:#fff}
.list-book-wrap .bookinfo .desc{font-size:13px;letter-spacing:.5px;line-height:1.6;color:#f4f4f4}
.list-book-wrap .bookinfo .rating{padding:10px 0}
.no-result,.no-result a{font-size:13px;letter-spacing:.5px;line-height:1.6}
.no-result a{color:red}
@media (max-width:640px){
.list-book-wrap .list-book{width:80px;height:116px}
.list-book-wrap .bookinfo .title{font-size:16px;line-height:1.2;margin-bottom:10px}
.no-result{margin-left:20px}
}
.bookdetail-wrap{margin-top:120px}
.basic-info-wrap{display:flex;justify-content:space-between;align-items:center}
.basic-info-wrap .l{width:150px;margin-right:20px}
.basic-info-wrap .l .bookcover-wrap{width:150px}
.basic-info-wrap .l .bookcover-wrap.circle{width:150px;height:150px;border-radius:50%;overflow:hidden;border:4px solid #fff;box-sizing:border-box;filter:drop-shadow(2px 2px 3px rgba(0, 0, 0, .3))}
.basic-info-wrap .l .bookcover-wrap.circle .bookcover{filter:none}
.basic-info-wrap .l a{display:block;text-align:center}
.basic-info-wrap .m{flex:1}
.basic-info-wrap .m .book-title{margin:0 0 20px 0;font-size:20px;font-weight:700;letter-spacing:2px;color:#666}
.basic-info-wrap .desc,.basic-info-wrap .desc a{font-size:13px;color:#666;letter-spacing:.5px}
.basic-info-wrap .r{line-height:150px;margin-left:20px;width:150px}
.basic-info-wrap .r.audio .lfont,.basic-info-wrap .r.def .lfont,.basic-info-wrap .r.user .lfont{display:none}
.tint{font-size:13px;color:#a6a6aa}
.tint.s{font-size:12px}
.lfont{font-size:24px;font-weight:700;color:#666}
.section-wrap{margin-top:50px}
.section-wrap .subtitle{padding:10px 0;font-size:15px;letter-spacing:1px}
.section-wrap .desc{margin-top:6px;font-size:14px;text-indent:2em;letter-spacing:.5px;line-height:1.6;color:#666}
@media (max-width:640px){
.bookdetail-wrap{margin-top: 80px; padding:0 20px 50px 20px;box-sizing:border-box}
.basic-info-wrap .l{width:75px}
.basic-info-wrap .l .bookcover-wrap{width:75px}
.basic-info-wrap .l .bookcover-wrap.circle,.basic-info-wrap .l .bookcover-wrap.square{width:75px;height:75px}
.basic-info-wrap .m .book-title{margin:0 0 20px 0;font-size:16px;letter-spacing:1px}
.basic-info-wrap .r{height:120px;line-height:120px;margin-left:20px;width:40px}
}
.page-header h2{font-size:24px;letter-spacing:1px;margin-right:20px;color:#191919}
.form-horizontal label{font-size:14px;letter-spacing:.5px;color:#2c2c2c}