body {background: #f8f8f8;}
.container { position: relative; overflow: hidden;}
.blur-bg { position: absolute; width: 100%; height: 400px; overflow: hidden; background: #5f5550;}
.blur-bg .img { filter: blur(10px); opacity: .63; }

.detail-wrap { position: relative; width: 1104px; padding: 0 40px 30px; margin-top: 72px; border-radius: 3px; background: #fff;}
.info-box .coverbox { width: 264px; height: 348px; border: 10px solid #fff; border-radius: 2px; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15); margin: -40px 0 0 0; float: left; background: #fff; overflow: hidden;}
.info-box .cover { border-radius: 2px; }

.info-box .detail { width: 790px; padding: 40px 0 0 30px; float: left;}
.info-box .detail .name { font-size: 32px; font-weight: normal; line-height: 32px;}
.info-box .detail .author { height: 30px; font-size: 12px; line-height: 30px; color: #666; overflow: hidden; margin: 8px 0;}
.info-box .detail .quote { color: #f52950; font-size: 40px; line-height: 48px; vertical-align: top;}


.info-box .score-box { margin-bottom: 46px; line-height: 22px; font-size: 14px;}
.info-box .score { display: inline-block; width: 80px; height: 16px; margin-right: 20px; position: relative; vertical-align: top; zoom: 1.2;}
.info-box .score .i { display: inline-block; vertical-align: top; width: 16px; height: 16px; background: url('../image/star.png') no-repeat; background-size: 16px; }
.info-box .score .bottom .i { background-image: url('../image/star_on.png'); }
.info-box .score .top,
.info-box .score .bottom { overflow: hidden; width: 80px; height: 16px; text-align: left; position: absolute; top: 0; left: 0; white-space: nowrap; }
.info-box .score .bottom { z-index: 2; width: 0%; transition: width 1s ease; }

.info-list { line-height: 22px; font-size: 13px; margin: 16px 0;}
.info-list dt { color: #999;}
.info-list dd, .info-list dd a { color: #151515; }
.info-list dt, .info-list dd { display: inline; }
.info-list dd + dt { margin-left: 24px; }
.info-desc-list { min-height:44px; height: 44px; overflow: hidden; position: relative; cursor: pointer;}
.info-desc-detail { height: auto;}
.info-desc-list .btn-detail { position: absolute; right: 0; bottom: 0; color: #ff620e; background:#f8f8f8;}

.info-box .opt { position: relative;}
.info-box .btn-read { display: inline-block; width: 200px; font-size: 15px; margin-right: 10px; background: #ff620e; color: #fff; height: 44px; line-height: 44px; border-radius: 22px; text-align: center;}
.info-box .btn-read:hover { opacity: .9;}
.info-box .btn-read:last-child { width: 140px; background: #ffdb6f; color: #874e12;}

.qrbox { position: absolute; top: 33px; right: 40px; width: 144px; color: #666; line-height: 18px; text-align: center;}

.section-box { margin-top: 50px;}
.section-hd, .guess-hd { height: 40px; margin-bottom: 20px; font-size: 20px; line-height: 40px;}
.section-hd .section-item { padding-right: 18px; border-right: 1px solid #252525; margin-right: 18px; cursor: pointer;}
.section-hd .section-item.active { color: #ff620e;}
.section-hd .update-time { font-size: 13px; color: #666; }
.section-hd .btn-sort { float: right; font-size: 14px; padding-left: 26px; background-image: url('../image/detail-order.png'); background-repeat: no-repeat; background-position: 0 8px;}
.section-hd .btn-sort-inverted {background-image: url('../image/detail-order-inverted.png');}
.section-list { max-height: 500px; overflow: hidden;}
.section-list-all .section-list { height: auto;max-height: 999999999px;}
.section-list .item { margin: 0 16px 16px 0; float: left;}
.section-list .item:nth-child(5n) { margin-right: 0;}
.section-list .item a { display: block; width: 184px; padding: 0 12px; height: 36px; line-height: 36px; font-size: 14px; border-radius: 2px; background: #f7f6f6; transition: all .1s ease;}
.section-list .item a:hover { color: #fff; background: #ff620e;}

.btn-loadmore { display: block; height: 46px; margin-top: 10px; border-radius: 100px; background: #f6f6f6; text-align: center; font-size: 16px; line-height: 46px; cursor: pointer; color: #ff620e;}
.btn-loadmore:hover { background: #efebeb;}

.layout-list-col6 .item { margin: 0 46px 20px 0; }
.layout-list-col6 .item:nth-child(5n) { margin-right: 0; }

.section-box-update .section-hd .section-item { border-right:0 none;}
.section-box-update .section-list { height:auto;}

.mobile .blur-bg { height: 205px;}
.mobile .detail-wrap { background: none; margin-top: 16px;}
.mobile .info-box .coverbox { width: 100px; border-width: 2px; height: auto; margin: 0;margin-top: 20px;}
.mobile .info-box .detail { width: auto; margin-left: 120px; float: none; padding: 0;}
.mobile .info-box .detail .name { font-size: 20px; text-shadow: 0px 3px 5px #595959;color:#fff;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: block;}
.mobile .info-box .detail .author { height: auto; line-height: 1.5; text-shadow: 0px 3px 5px #595959;color:#fff;}
.mobile .info-box .score-box { margin-bottom: 0; margin-top: 12px;}
.mobile .qrbox { display: none;}
.mobile .info-list { text-shadow: 0px 1px 1px #d6d6d6; margin: 8px 0;}
.mobile .info-list dt, .mobile .info-list dd, .mobile .info-list dd a{ text-shadow: 0px 3px 5px #595959;color:#fff;}
.mobile .info-list.dlcolor,.mobile .info-list.dlcolor dt, .mobile .info-list.dlcolor dd, .mobile .info-list.dlcolor dd a{ text-shadow: none;color:#666;}
.mobile .info-desc-list { margin: 15px 0 10px -120px;}

.mobile .info-box .opt { margin-left: -120px;}
.mobile .info-box .btn-read { width: 60%; margin: 0; height: 36px; line-height: 36px;}
.mobile .info-box .btn-read:last-child { width: 35%; float: right;}

.mobile .section-box { margin-top: 0px;}
.mobile .section-hd .update-time { position: absolute; top: 0px; left: 0; padding-left: 10px;display:none;}
.mobile .section-hd .btn-sort { position: absolute; top: -1px; right: 10px; background-color: #f7f6f6;}
.mobile .section-hd, .mobile .guess-hd { font-size: 16px; display: flex; margin-bottom: 0; border-bottom: 1px solid #ccc; text-align: left; position: relative;}
.mobile .section-hd { margin-bottom: 0px;}
.mobile .section-hd .section-item { padding: 0; margin: 0; flex: 1; border-right: 0 none;max-width: 20%;overflow: hidden;}
.mobile .section-list .item { margin: 0; float: none;}
.mobile .section-list .item a { width: 100%; padding: 0 10px;}
.mobile .btn-loadmore { background: #f98d53; color: #fff;}
.mobile .layout-list-col6 .item:nth-child(n+4) { display: none;}

.mobile .section-box-update .section-hd { display:block; text-align:left;margin-bottom:0px;}