.bookpage {display:block;padding:20px 10px;}
.booknav {font-size:.9rem;line-height:30px;padding:0 10px 5px 10px;}
.booknav a {}
.booknav a:hover {}
.booknav span {margin:0 10px;position:relative;}
.booknav span:after {content:"";display:block;width:6px;height:6px;position:absolute;top:50%;right:-15px;border-top:2px solid #ccc;border-right:2px solid #ccc;transform:rotate(45deg);margin-top:-5px;}
.booknav span:last-child:after {display:none;}
.booknav span:last-child {font-weight:bold;}
.booknav b {font-weight:normal;color:#666;}
.bookbox {font-size:0;padding:0 0 20px 0;}
.bookbox:after {content:"";display:block;clear:both;height:0;}
.bookbox .cover {float:left;width:auto;width:190px;max-width:30%;position:relative;margin-right:10px;background-color:#eee;}
.bookbox .cover img {position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;box-shadow:var(--imgshadow)}
.bookbox .cover amp-img {box-shadow:var(--imgshadow);display:block;width:100%;height:100%;}
.bookbox .cover img.imgmask {position:relative;width:100%;height:auto;}
.bookbox .bookboxcont {width:auto;overflow:hidden;padding-left:20px;font-size:1rem;}
.bookbox .title { font-size: 0px; padding-left: 15px; display: block; overflow: hidden; line-height: 30px; padding: 5px 0 0px 15px; }
.bookbox .title b { font-weight: bold; font-size: 28px; display: inline-block; vertical-align: top; height: auto; line-height: 30px; color:#333; margin-right: 10px; }
.bookbox .title span { font-size: 12px; display: inline-block; vertical-align: middle; margin-left: 5px; padding: 0px; border-radius: 3px; color: #fff; line-height: 12px; background-color: #f95 }
.bookbox .title span a { display: block; padding: 5px 6px; color: #fff; cursor: pointer; }
.bookbox .title span.c1 { background-color: #ffaab8 }
.bookbox .title span.c2 { background-color: #fe9cff }
.bookbox .title span.c3 { background-color: #b2c1ff }
.bookbox .title span.c4 { background-color: #98e6ff }
.bookbox .title span.c5 { background-color: #9dfff3 }
.bookbox .title span.c6 { background-color: #c9fc88 }
.bookbox .title span.c7 { background-color: #fbffa5 }
.bookbox .title span.c8 { background-color: #ffe9ae }
.bookbox .author {font-size:1.2rem;padding:5px 0 0 15px;overflow:hidden;}
.bookbox .author span {color:#666;font-size:.9rem;}
.bookbox .shortinfo, .bookbox .data, .bookbox .funbtn, .bookbox .desc { display: block; overflow: hidden; font-size: .9rem; padding-left: 15px; color: #666; font-weight: normal; }
.bookbox .desc { opacity: 1;font-size:1.1rem;padding-top:5px;margin-bottom:5px;}
.bookbox .desc .overdesc {line-height: 24px;overflow:hidden;height:auto;}
.bookbox .desc .overdesc.show {overflow:visible;height:auto;}
.bookbox .desc .mshow {display:none;}
.bookbox .desc .descbtn {float:right;display:none;width:40px;height:40px;position:relative;margin-right:-5px;}
.bookbox .desc .overdesc.show .descbtn {transform:rotate(180deg)}
.bookbox .desc .descbtn:after {content:"";display:block;position:absolute;width:10px;height:10px;border-top:2px solid #ccc;border-right:2px solid #ccc;top:50%;left:50%;margin:-5px auto auto -5px;transform:rotate(135deg)}
@media screen and (max-width:767px){
    .bookbox .desc .mshow, .bookbox .desc .descbtn {display:block;}
    .bookbox .desc .overdesc {height:48px;margin-top:10px;}
}
.bookbox .data { padding:10px 0 10px 15px; opacity: 1; }
.bookbox .data span { display: inline-block; height: 20px; line-height: 20px; margin-right: 20px; }
.bookbox .data span svg { display: block; width: 14px; height: 100%; float: left; margin-right: 2px; fill: #ccc; }
.bookbox .data span i {display:inline-block;vertical-align:top;width:15px;height:18px;opacity:0.4;margin-right:3px;}
.bookbox .data span.readCount i {background:url(../images/eye.svg) center no-repeat;background-size:contain;}
.bookbox .data span.favorCount i {background:url(../images/star.svg) center no-repeat;background-size:contain;}
.bookbox .shortinfo { padding-bottom: 5px; }
.bookbox .shortinfo .txt { display: inline-block; margin-right: 15px; opacity: 0.6; }
.bookbox .shortinfo .txt a { color: #666; font-weight: bold; }
.bookbox .shortinfo.aboutzt .txt { opacity: 1; }
.bookbox .shortinfo.aboutzt .txt font { opacity: 0.6; }
.bookbox a.bookztinfo { font-size: 16px; color: #fff; opacity: 1; }
.bookbox a.bookztinfo:hover { color: #fc0; }

.ratingbox {padding:10px 0 0 10px;overflow:hidden;}
.rating-stars { width: auto; text-align: center; position: relative; font-size: 0; height: 36px; overflow: hidden; display: inline-block;vertical-align:top;}
.rating-stars input { font-size: 22px; width: 60px; height: 36px; line-height: 36px; display: block; border: 0; text-align: center; color: #f90; vertical-align: top; padding: 0; margin-left: 0px; border-radius: 0%; overflow: hidden; position: absolute; top: 0px; right: 0; cursor: pointer; background-color: transparent; }
.rating-stars .rating-stars-container { font-size: 0px; display: inline-block; vertical-align: top; }
.rating-stars .rating-stars-container .rating-star { display: inline-block; font-size: 0px; color: #fff; cursor: pointer; padding: 0px; height: 36px; width: 30px; text-align: center; border-radius: 8px; margin: 0 2px; transition: all 0.2s; opacity: 1; border: 0px solid transparent; box-sizing: border-box; }
.rating-stars .rating-stars-container .rating-star svg { display: block; width: 100%; height: 100%; }
.rating-stars .rating-stars-container .rating-star i { font-style: normal; }
.rating-stars .rating-stars-container .rating-star.is--active { color: #fff; background-size: 100%;}
.rating-stars .rating-stars-container .rating-star.is--hover { border-color: var(--color-border); background-size: 100%;border:0px;background-color:#eee;border-radius:50%;}
.ratingnum {display:inline-block;height:36px;line-height:38px;font-size:2rem;color:#f90;vertical-align:top;padding:0 20px;}

.funbtn { position: relative; border-radius: 0px; height: auto; opacity: 1;box-sizing: border-box;padding:10px 0 0 0; }
.funbtn a, .funbtn button { display: inline-block; margin-right: 10px; padding: 8px 10px; background-color: var(--color-main); color: #fff; font-size: 16px; border-radius: 5px; min-width: 100px; text-align: center; box-sizing: border-box; height: auto; line-height: 20px;border:0;cursor:pointer;}
.funbtn a:hover, .funbtn button:hover {opacity:0.9;}
.funbtn a.rssed {background-color:#f60;}
.funbtn a.rssed:before {display:inline-block;width:5px;height:11px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg);content:"";margin-right:10px;}
.funbtn a svg { display: inline-block; vertical-align: top; width: 20px; height: 20px; margin-right: 4px; transform: scale(1.2); transform-origin: right; }
.funbtn a.apple { background-color: #000; }
.funbtn a.apple svg { fill: #fff; }
.funbtn a.androids { background-color: #000; }
.funbtn a.androids svg { fill: #fff; }
.funbtn a font { color: #fff; margin: 0 3px; }
.funbtn span.goloading { display: none; margin-right: 10px; padding: 8px 10px; background-color: #d12c47; color: #fff; font-size: 16px; border-radius: 5px; min-width: 100px; text-align: center; box-sizing: border-box; height: auto; line-height: 20px; }
.funbtn span.goloading svg { display: inline-block; vertical-align: top; display: inline-block; vertical-align: top; width: auto; height: 20px; box-sizing: border-box; padding: 0px 0; fill: #fff; margin-right: 5px; animation: zuan linear 2s infinite; }

.curchap { margin: 0 auto 15px auto; max-width: 1400px; padding: 0px; }
.curchap a { display: block; border: 5px solid #eee; padding: 12px; border-radius: 0px; background-color: #f3f3f3; font-size: 1.2rem; line-height: 120%; position: relative; font-weight: bold; transition: all 0.2s; line-height: 30px; }
.curchap a svg { display: inline-block; width: 22px; height: 30px; fill: var(--color-main2); vertical-align: top; }
.curchap a:hover { background-color:#fff0ff; }
.curchap a:after { content: ""; display: block; width: auto; clear: both; height: 0; overflow: hidden; }

.curchap a .lastchap span { margin-right: 15px; color: var(--color-main2) }
.curchap a em { font-style: normal; margin: 0 5px; font-size: 1rem; color:  var(--color-main2); }
.curchap a em:after { content: ":"; font-size: 10px; }
.curchap a:before { content: ""; display: block; width: 7px; height: 7px; border-top: 2px solid #999; border-right: 2px solid #999; transform: rotate(45deg); position: absolute; right: 10px; top: 50%; margin-top:-5px; }

.chaptitle { font-size:0; padding:5px; height: auto; line-height: 30px; border-bottom: 1px solid #ddd; text-align: left;background-color:#fff;position: relative;max-height:150px;overflow-y:auto;}
.chaptitle h4 { text-align: center;display:inline-block;width:auto;height:46px;line-height:40px;color:#666;min-width:10%;border:3px solid #fff;box-sizing:border-box;font-size:1rem;}
.chaplist { margin: 0 auto 10px auto; max-width: 1400px; padding: 0px; border: 1px solid #ddd; background-color: #fff; box-sizing: border-box; }
.chaplist .chapterlist { font-size: 0; padding: 0px; width: auto; margin: 0px; background-color: #fff; border-top: 0px solid #ddd; }
.chapterlist li { display: inline-block; width: 25%; box-sizing: border-box; border:1px solid #eee;border-top:0;border-left:0;}
.chapterlist li a { border:0px solid #ddd; color: #333; padding: 7px 50px 7px 40px; border-radius: 0px; background-color: #fff; font-size: 1rem; display: block; position: relative;transition:all 0.1s;}
.chapterlist li a:before { content: ""; display: block; width: 5px; height: 5px; border-top: 1px solid #999; border-right: 1px solid #999; transform: rotate(45deg); position: absolute; right: 10px; top: 50%; margin-top: 8px;display:none;}
.curchap em { display: inline-block; }
.chapterlist li a:hover { color: #fff; background-color: var(--color-main) }
.chapterlist li a h3 { font-weight: normal;display:block;height:2.2rem;line-height:2.2rem;}
.chapterlist li a h3 i {position:absolute;top:50%;height:1rem;line-height:1rem;width:40px;text-align:center;margin-top:-0.5rem;left:0;font-style:normal;font-size:.8rem;}
.chapterlist li a em { font-style: normal; display:inline-block; font-size: 1rem; height: auto; line-height: 1.1rem; overflow: hidden; text-overflow: ellipsis;max-height:2.2rem;overflow:hidden;vertical-align:middle;}
.chapterlist li a > span { position: absolute; display: block; top:50%; right: 8px;height:18px;margin-top:-9px;}
.chapterlist li a > span span { display: block; border-radius: 3px; font-size: .8rem; padding: 0px 4px; overflow: hidden; color: #fff; line-height: 20px;height:18px;}
.chapterlist li a > span span.free { background-color: #58b605; }
.chapterlist li a > span span.freeintime { background-color: var(--color-main); }
.chapterlist li a > span span.login { background-color: #0092ff; }
.chapterlist li a > span span.vfree { background-color: #12c637; }
.chapterlist li a > span span.pfree { background-color: #a0c444; }
.chapterlist li a > span span.coin { background-color: #f69700; }
.chapterPage { display: inline; font-size: 0; padding: 0px 0 0 30px; vertical-align: top;background-color:#fff;border: 1px solid #ddd; border-width: 0; border-radius: 0px;  padding: 0px; margin-top: 0px; max-height: 160px; overflow-y: auto; text-indent: 0; }
.chapterPage li { display: inline-block; font-size: 20px; padding: 0px; vertical-align: top; margin-right: 30px; cursor: pointer; font-weight: 800; color: #666;min-width: 10%; margin: 0; text-align: center; background-color: #eee; border: 3px solid #fff; border-radius: 7px; line-height: 40px; height: 46px; box-sizing: border-box; font-size: 14px; }
.chapterPage li a { color: #666; }
.chapterPage li.cur { border-bottom: 2px solid var(--color-main); color: var(--color-main); }
.chapterPage ul { font-size: 0; text-indent: 0; display: block; }
.chapterPage li a { display: block; }
.chapterPage li.cur { background-color: var(--color-main); color: #fff; border-bottom: 3px solid #fff; }
.chapterPage li.cur a { color: #fff; }

.commentbox { margin: 0 auto; max-width: var(--maxscreenwidth); padding: 15px 0; }
.commentboxtitle { font-size: 20px; font-weight: bold; padding: 0 0 10px 10px; border-bottom: 1px solid #ddd;}
.commentbox ul { display: block; width: auto; font-size: 0; margin: 0px -5px; }
.commentbox ul li { display: inline-block; width: 100%; padding: 5px; box-sizing: border-box; }
.commentitem { position: relative; background-color: #fff; border-radius: 0px; box-sizing: border-box; padding: 10px; min-height: 70px; border-bottom: 1px solid #eee; }
.commentitem .commentface { float: left; width: 50px; height: 50px; margin-right: 10px; overflow: hidden; border-radius: 50%; border: 1px solid #ccc; box-sizing: border-box; }
.commentitem .commentface img { display: block; width: 100%; height: 100%; }
.commentitem .commentinfo { width: auto; display: block; overflow: hidden;padding-top:5px;}
.sendcomment .commentitem .commentinfo {padding-top:0;}
.commentitem .commentinfo h3 { font-size:1.2rem; line-height: 120%; padding: 0 0 5px 0; margin: 0; }
.commentitem .commenttxt { font-size: 14px; line-height: 120%; padding: 0 0 5px 0; margin: 0; color: #666; }
.commentitem .commentspan { display: block; font-size: 12px; line-height: 20px; color: #999;position:absolute;top:15px;right:0;}
.commentitem .rating-stars {position:absolute;top:15px;right:90px;height:18px;width:auto;}
.commentitem .rating-stars .rating-stars-container .rating-star {height:18px;width:15px;cursor:default;margin:0;}
.commentitem .rating-stars .rating-stars-container .rating-star.is--active span svg {fill:#ccc;}
.commentitem .commentspan span { display: inline-block; vertical-align: top; }
.commentitem .commentspan span.colortxt { color: var(--color-main); }
.commentrating { padding: 10px 0 0 0; text-align: center; font-size: 0; }
.commentrating .rating-stars { border: 1px solid #ddd; background-color: #fff; border-radius: 6px 0 0 6px; border-right: 0; padding: 5px 60px 5px 15px; }
.commentrating .ratingbtn button { border-radius: 0 6px 6px 0; padding: 5px 15px; height: 48px; }
.commentrating .rating-stars input { height: 46px; line-height: 46px; }
.commentbox .textartebox textarea {display:block;width:100%;height:90px;border:1px solid #ddd;background-color:#f3f3f3;box-sizing:border-box;padding:10px;}
.commentbox .sendbtn {display:block;padding:10px 0 0 0; text-align:right;z-index:0;}
.commentbox .sendbtn button {display:inline-block;border:0;background-color:var(--color-main);color:#fff;padding:0px 15px ;border-radius:5px;height:40px;line-height:40px;vertical-align:top;}
.commentbox .morecomment {padding:20px 0;border-bottom:1px solid #ddd;text-align:center;}
.commentbox .morecomment button {display:inline-block;border:0;background-color:#ddd;color:#666;padding:8px 15px ;border-radius:5px;}
.chaplistpopbg{display:None;}
amp-list-load-more {display:block;text-align:center;padding:10px ;}
amp-list-load-more button {display:inline-block;text-align:center; padding:10px 15px;font-size:1rem;color:#fff;border:0;border-radius:6px;background-color:var(--color-main)}
.sendcomment .commentitem {padding:10px 0 15px 0;}
.commentbox ul li.sendcomment {border-top:1px solid #eee;}
.sendcomment .ratingbox {padding:10px 15px 0 0;display:inline-block;position:relative;z-index:1;overflow:unset;}
.sendcomment .ratingbox .startxt {font-size:0;display:inline-block;vertical-align:top;line-height:30px;padding-left:10px;position:relative;}
.sendcomment .ratingbox .startxt>div {font-size:1.1rem;display:none;color:#333;padding:0 15px;border-radius:40px;background-color:#f3f3f3;opacity:0;position:absolute;top:5px;left:10px;transition:all 0.2s;white-space:nowrap}
.sendcomment .ratingbox .startxt>div.show {display:block;opacity:1;}
.sendcomment .ratingbox .ratingnum {display:none;}
.sendcomment .commentinfo amp-script {float:right;}
.sendcomment .commentitem .rating-stars {position:relative;top:auto;right:auto;height:40px;vertical-align:top;display:inline-block;}
.sendcomment .commentitem .rating-stars .rating-stars-container div {height:40px;width:30px;display:inline-block;vertical-align:top;margin:0;}
.sendcomment .commentitem .rating-stars .rating-stars-container div button {display:block;height:40px;width:30px;border:0;background-color:transparent;padding:0;}
.sendcomment .commentitem .rating-stars .rating-stars-container div svg { display: block; width: 30px; height: 40px;fill:#ccc;}
.sendcomment .commentitem .rating-stars .rating-stars-container div.is--active svg { fill:#f60;}
@media screen and (max-width:767px){
.sendcomment .commentitem {padding-top:5px;}
.commentitem .commentspan {right:10px;top:3px;}
.commentitem .commentinfo h3 {padding:8px 0 5px 0 ;font-size:.85rem;font-weight:normal;color:#666;}
.commentitem .rating-stars {top:3px;left:70px;right:auto;}
.commentitem .commenttxt {padding-bottom:0;font-size:1rem;color:#000;}
.commentbox ul li.sendcomment {padding:5px 15px;}
.sendcomment .ratingbox {display:block;text-align:left; padding-right:0;padding-bottom:5px;}
.sendcomment .commentitem .rating-stars {display:block;left:auto;}
.sendcomment .ratingbox .startxt>div {left:0;}
.sendcomment .commentitem .commentface {float:none;width:40px;height:40px;position:absolute;top:15px;left:10px;}
.sendcomment .commentitem .textartebox {padding-top:0px;border:1px solid #ddd;background-color:#f3f3f3;padding:10px 15px 10px 60px;}
.sendcomment .commentitem .textartebox textarea {padding:0px 10px;border:0px;border-left:1px solid #ddd;}
.sendcomment .commentitem .rating-stars .rating-stars-container div {width:10%;}
.commentbox .sendbtn {padding-top:0;text-align:center;}
.commentbox .sendbtn button {height:32px;line-height:32px;}
}