html,body{padding:0;margin:0;}
em, i {font-style: normal;}
.clear{clear:both;}
.left{float: left;}
.right{float: right;}
.layui-main{width: 1200px;}
.layui-container{padding: 0px;}

.header {position: fixed;top: 0;left: 0;width: 100%;z-index:999;background: #212121;}
.header_con {width: 1200px;margin: 0 auto;}
.header .logo{height:45px;display:inline;float:left;margin-top:10px;padding-left: 5px;}
.header .logo img,.header .logo svg{height:100%;display:block;vertical-align:top;float:left;}
.header .channel_links{float:left;padding-left:16px;}
.header .channel_links a{float:left;line-height:64px;position:relative;margin-left:45px;display:inline;font-size:16px;color:#f9f9f9;}
.header .channel_links a:hover{color:#fff;}
.header .channel_links a.on{color:#fff;font-weight: 600;}
.header .channel_links a i{position: absolute;bottom: 10px;margin-left: -8px; height: 4px;width: 16px;border-radius: 2px;display: none;left: 50%;background: #fcc800;overflow: hidden;}
.header .channel_links a.on i{display: block;}
.header .search{width:240px;padding:15px 0 0;float:left;padding-right: 5px;margin-left: 80px;}
.header .search .input{display:block;height:32px;background:#fff;-moz-border-radius:32px;-webkit-border-radius:32px;-ms-border-radius:32px;-o-border-radius:32px;border-radius:32px;overflow:hidden;line-height:32px;position:relative;padding:1px;}
.header .search .input input{float:left;border:0;width:148px;height:20px;line-height:20px;padding:6px 16px;font-size:14px;-moz-border-bottom-left-radius:32px;-webkit-border-bottom-left-radius:32px;-ms-border-bottom-left-radius:32px;-o-border-bottom-left-radius:32px;border-bottom-left-radius:32px;-moz-border-top-left-radius:32px;-webkit-border-top-left-radius:32px;-ms-border-top-left-radius:32px;-o-border-top-left-radius:32px;border-top-left-radius:32px;position:relative;z-index:5;}
.header .search .input .search_btn{width:60px;line-height:34px;height:34px;text-align:center;font-weight:700;position:absolute;top:0;right:0;overflow:hidden;}
.header .search .input .search_btn i{font-size: 18px;color:#999;}
.header .user_box{float:right;padding-right: 5px;position:relative;}
.header .user_box .item{display: inline-block;vertical-align: middle;width: 24px;padding: 0 8px;padding-top:10px;font-size: 12px;text-align: center;cursor: pointer;}
.header .user_box .item a{color: #f9f9f9;}
.header .user_box .item:hover a{color: #fff;}
.header .user_box .item.js-user{width: 36px;}
.header .user_box .item.js-appdown{width: 50px;}
.header .user_box .item.js-user a.pic{width: 36px;height: 36px; padding: 3px;display: inline-block;background: #fff;border-radius: 50%;}
.header .user_box .item.js-user img{width: 36px;height: 36px;border-radius: 50%;}
.header .user_box .item i{display: block;font-size: 24px;line-height: 24px;}
.header .user_box .dialog {position: absolute;right: 0;top: 44px;padding-top: 20px;z-index: 999;}
.header .user_box .item:hover .dialog a{color: #28292D;}
.header .user_box .dialog .dialog-top-border {position: absolute;width: 100%;top: -10px;left: 0;height: 10px;background: url(../images/bg_top_nav_tc.png) no-repeat center center;background-size: 100% 10px;}
.header .user_box .dialog .header-user {position: relative;padding: 20px;width: 320px;background: #FFFFFF;text-align: left;box-shadow: 0 5px 5px 0 rgba(255, 184, 0, 0.18);}
.header .user_box .dialog .header-user .login-btn {position: absolute;top: 30px;right: 20px;width: 80px;height: 24px;text-align: center;line-height: 24px;font-size: 12px;color: #FFFFFF;background: #FF4343;border-radius: 12px;}
.header .user_box .dialog .header-user .user-info {height: 44px;overflow: hidden;}
.header .user_box .dialog .header-user .js-upic {float: left;margin-right: 12px;width: 44px;height: 44px;border-radius: 22px;}
.header .user_box .dialog .header-user .user-name {margin-top: 2px;font-size: 14px;line-height: 20px;color: #28292D;}
.header .user_box .dialog .header-user .user-name .cion{padding-left: 10px;font-size: 12px;color:#666;}
.header .user_box .dialog .header-user .user-name .cion b{padding: 0 2px;}
.header .user_box .dialog .header-user .user-name .js-unichen {width: 123px;overflow: hidden;white-space: normal;text-overflow: ellipsis;}
.header .user_box .dialog .header-user .user-name .logout {float: right;font-size: 14px;line-height: 20px;color: #28292D;cursor: pointer;}
.header .user_box .dialog .vip-expired {margin-top: 2px;font-size: 12px;color: #999999;line-height: 18px;}
.header .user_box .item:hover .dialog .vip-expired .hl {color: #FF4343;}
.header .user_box .dialog .header-case {position: relative;width: 310px;background: #FFF;z-index: 999;text-align: left;box-shadow: 0 5px 5px 0 rgba(255, 184, 0, 0.18);}
.header .user_box .dialog .header-case .case-item-box {padding: 15px;max-height: 265px;overflow-y: auto;}
.header .user_box .dialog .header-case .nologin {padding-top: 70px;height: 85px;font-size: 13px;color: #999999;text-align: center;line-height: 20px;}
.header .user_box .dialog .header-case .login-btn, .header .user_box .dialog .header-read .login-btn {display: block;margin: 12px auto;width: 90px;height: 30px;line-height: 30px;font-size: 13px;color: #FFFFFF;text-align: center;background: #FF4343;border-radius: 15px;}
.header .user_box .dialog .case-empty, .header .user_box .dialog .read-empty {height: 70px;padding-top: 25px;text-align: center;font-size: 13px;color: #999999;line-height: 20px;}
.header .user_box .dialog .read-dialog{position: relative;width: 310px;background: #FFF;z-index: 999;text-align: left;box-shadow: 0 5px 5px 0 rgba(255, 184, 0, 0.18);}
.header .user_box .dialog .header-read .login-notice{width: 100%;height: 36px;font-size: 12px;color: #999999;line-height: 36px;text-indent: 10px;background: #F8F8F8;}
.header .user_box .dialog .header-read .login-notice .login {margin-left: 10px;color: #28292D;}
.header .user_box .dialog .read-item-box{padding: 15px;max-height: 265px;overflow-y: auto;}
.header .user_box .dialog .read-item-box .read-empty .link {font-size: 13px;color: #FF4343;line-height: 20px;}
.header .user_box .dialog .li-item {position: relative;margin-bottom: 15px;height: 80px;overflow: hidden;}
.header .user_box .dialog .li-pic {float: left;margin-right: 10px;width: 60px;height: 80px;border-radius: 3px;}
.header .user_box .dialog .li-name {width: 150px;margin-top: 12px;font-size: 14px;line-height: 20px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.header .user_box .dialog .li-readat,.header .user_box .dialog .li-update {width: 150px;margin-top: 6px;font-size: 12px;color: #999999;line-height: 18px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.header .user_box .dialog .li-update {margin-top: 4px;}
.header .user_box .dialog .li-read {position: absolute;right: 15px;top: 28px;width: 24px;height: 34px;font-size: 12px;color: #28292D;line-height: 18px;text-align: center;}
.header .user_box .dialog .check-all {display: block;margin-top: 10px;width: 100%;height: 50px;line-height: 50px;text-align: center;font-size: 12px;color: #666666;}
.header .user_box .dialog .appdown-item-box{position: relative;width: 240px; height: 120px;background: #FFFFFF;text-align: left;box-shadow: 0 5px 5px 0 rgba(255, 184, 0, 0.18);}
.header .user_box .dialog .appdown-item-box .qrcode{position: absolute;top:10px;left:10px;width: 100px;height: 100px;}
.header .user_box .dialog .appdown-item-box .qrcode img{width: 100%;height: 100%;}
.header .user_box .dialog .appdown-item-box .text{padding-left: 120px;padding-top: 40px;}
.header .user_box .dialog .appdown-item-box .text .title {font-size: 14px;color: #28292D;line-height: 20px;}
.header .user_box .dialog .appdown-item-box .text .tip {margin-top: 2px;font-size: 12px;color: #999999;line-height: 18px;}
.header .user_box .item:hover .dialog a.login-btn{color: #fff;}
.header_h{height: 70px;width: 100%;}
.header .icon_red{position: absolute;top: 0px;right: -50px;display: block;}
.footer{width:100%;overflow:hidden;border-top: 1px solid #f0f0f0;margin-top: 20px;text-align: center;padding: 20px 0;}
.footer .box{margin-top: 16px;width: 100%;}
.footer .box a{display: inline-block;margin-right: 10px;color: #555;font-size:14px;}
.footer .box a em{display: inline-block;width: 2px;height: 12px;background: #9a9a9a;margin-left: 10px;}
.footer p{font-size: 14px;font-weight: 300;color: #555;margin-top:15px;line-height: 25px;}
.footer p a{color: #555;}
.return-top{position: fixed;left: 50%;bottom:100px;z-index: 9;display: none;margin-left: 610px;}
.return-top a{width: 48px;height: 48px;display: block;border: 1px solid #eaeaea;background: #fff;border-radius: 50px;box-shadow: 0 0 2px #eaeaea;}
.return-top a img{position: absolute;top: 50%;left: 50%;margin-top: -14.5px;margin-left: -14.5px;}
.return-top .none{display: none!important;}

.hide{display: none;}
.fl{float:left}
.fr{float:right}

.index_box{background-color: #fff;padding:0 20px;margin-top:10px;overflow:hidden;}
.banner{width:810px;height:350px;margin:20px 0}
.banner .pic{width: 100%;height: 100%;}
.banner a{width: 100%;height: 100%;display: block;background-position: center center;background-size: cover;background-repeat: no-repeat;border-radius:10px;}
.rank{width:320px}
.rank_list{width:100%;overflow:hidden}
.rank_list .first{height:115px}
.rank_list .first .first_book_icon{display:block;width:76px;height:101px;margin-top:6px}
.rank_list .first .first_info{width:235px;overflow:hidden}
.rank_list .first .first_info .first_icon{width:27px;height:30px;display:block;margin:21px 0 10px 0}
.rank_list .first .first_info .first_name{font-size:14px;color:#333;margin-bottom:5px;padding-top: 10px;padding-left: 30px;}
.rank_list .first .first_info .first_author{padding-left: 30px;font-size:14px;color:#999;padding-top: 5px;}
.rank_list .first .first_info .first_text{padding-left: 30px;padding-top: 5px;line-height: 25px;color:#999}
.rank_list a{display:block;width:320px;height:40px;border-bottom:1px solid #eee;overflow:hidden;cursor:pointer}
.rank_list a:hover{background: #F4F5F6;}
.rank_list a .number{width:18px;height:18px;background-color:#ededed;font-size:14px;color:#666;text-align:center;line-height:18px;margin-top:11px}
.rank_list a .blue{background-color:#fcc800;color:#111}
.rank_list a .name{width:284px;font-size:14px;color:#333;line-height:40px}
.rank_list a .name span{color:#999;float:right;margin-right:15px;}
.index_title{width:100%;height:50px;border-bottom:1px solid #eee}
.index_title .index_title_name{font-size:18px;color:#333;line-height:1;margin-top:19px}
.index_title .more{display:block;width:60px;height:18px;font-size:14px;line-height:18px;color:#999;margin-top:19px}
.index_title .more img{width:8px;height:8px;margin:5px 0 0 8px}
.recommend_list{width:100%;overflow:hidden;padding-top:31px}
.recommend_list .recommend_item{display:block;width:33.333%;overflow:hidden;margin-bottom:27px;float:left;}
.recommend_list .recommend_item:hover{background: #F4F5F6;}
.recommend_list .recommend_item .cover{display:block;width:120px;height:158px;-webkit-box-shadow:0 2px 3px 0 rgba(102,102,102,.5);box-shadow:0 2px 3px 0 rgba(102,102,102,.5)}
.recommend_list .recommend_item .info{width:225px;margin-left:21px;padding: 5px 0;}
.recommend_list .recommend_item .info .name{font-size:16px;color:#333;height:22px;line-height:22px;margin-bottom: 5px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;}
.recommend_list .recommend_item .info .main{font-size:14px;color:#666;line-height:22px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.recommend_list .recommend_item .info .author{font-size:14px;color:#999;margin: 8px 0;}
.recommend_list .recommend_item .info .type_line{height:22px;overflow:hidden;}
.recommend_list .recommend_item .info .type{margin-right: 5px;display:inline-block;height:20px;padding:0 9px;font-size:14px;line-height:20px;color:#999;border:1px solid #999}


.channel {float: left;padding: 24px 30px 0 24px;margin-top: 20px;margin-bottom: 32px;background: #f8f8f8;font-size: 14px;line-height: 28px;-moz-border-radius: 4px;-webkit-border-radius: 4px;-ms-border-radius: 4px;-o-border-radius: 4px;border-radius: 4px;}
.channel li {float: left;padding-bottom: 16px;}
.channel li .name {float: left;width: 70px;margin-right: 14px;text-align: right;color: #999;}
.channel li .list {float: left;width: 1022px;overflow: hidden;}
.channel li .list a {float: left;position: relative;vertical-align: top;line-height: 20px;height: 20px;color: #222;padding: 4px 12px;margin: 0 8px 8px 0;}
.channel li .list a:hover{color: #666;}
.channel li .list a.on {font-weight: 700;background: #fcc800;background-image: -webkit-gradient(90deg,from(#ffe040),to(#fcc800));background-image: -webkit-linear-gradient(90deg,#ffe040,#fcc800);background-image: -moz-linear-gradient(90deg,#ffe040,#fcc800);background-image: -o-linear-gradient(90deg,#ffe040,#fcc800);background-image: linear-gradient(90deg,#ffe040,#fcc800);-moz-border-radius: 14px;-webkit-border-radius: 14px;-ms-border-radius: 14px;-o-border-radius: 14px;border-radius: 14px;}
.channel li .list .hidden {overflow: hidden;}

.chanel_list li{float: left;width: 366.6px;height: 146px;margin-bottom: 40px;margin-left: 50px;}
.chanel_list li:hover{background: #F4F5F6;}
.chanel_list li:nth-child(1),.chanel_list li:nth-child(3n+1){margin-left:0;}
.chanel_list li .pic{width: 110px;height: 100%;margin-right: 10px;}
.chanel_list li .pic img{width: 100%;height: 100%;}
.chanel_list li .right{width: 236px;position: relative;padding: 5px;}
.chanel_list li .right .name{height: 28px;font-size: 16px;color: #343434;}
.chanel_list li .right .txt{height: 26px;font-size: 12px;color: #888888;line-height: 18px;}
.chanel_list li .right .zt{height: 13px;font-size: 12px;color: #9A9A9A;line-height: 18px;padding-top: 50px;}
.chanel_list li .right .zt span{float: right;color:#999;margin-left: 20px;width: 85px;height: 30px;border-radius: 15px;font-size:12px;text-align: center;line-height: 30px;border: 1px solid #F4F5F6;}
.chanel_list li .right .zt span.hits{color: #795800;background: #FFDA27;margin-right: 6px;border:0;}
.chanel_list li .hotpic{position: absolute;top:0;right: 0;width: 14px;height: 18px;color: #B3B3B3;font-size:16px;}
#pages{text-align: center;padding: 24px 0 40px;font-size: 0;padding-top: 0px;}
#pages .layui-laypage .layui-laypage-curr .layui-laypage-em {background-color: #FFDA27;}
#pages .layui-laypage .layui-laypage-curr em{color:#333;}
.search_name{padding: 30px 0;display: block;}


.book_head{min-width: 1200px;background: #f8f8f8;position: relative;z-index: 10;}
.book_head .layui-breadcrumb {line-height: 24px;height: 24px;overflow: hidden;color: #666;padding: 20px 0;}
.book .left{width: 100%;padding-bottom: 32px;}
.book .left .pic {width: 210px;height: 280px;float: left;position: relative;}
.book .left .pic img {width: 100%;height: 100%;vertical-align: top;display: block;position: relative;z-index: 5;border-radius: 4px;}
.book .left .data {width: 960px;float: right;position: relative;}
.book .left .data .book_data {min-height: 175px;}
.book .left .data .book_data h3 {line-height: 40px;height: 40px;overflow: hidden;font-size: 28px;font-weight: 700;color: #222;padding-right: 52px;}
.book .left .data .book_data h3 em{font-size: 16px;font-weight: 400;color: #666;line-height: 30px;padding-left: 20px;}
.book .left .data .book_data .tags {display: block;padding-top: 16px;}
.book .left .data .book_data .tags span {color: #666;font-size:14px;}
.book .left .data .book_data .tags span span, .book .left .data .book_data .tags em {color: #666;padding: 0 4px;line-height: 20px;line-height: 18px;padding: 0 4px;border: 1px solid #ddd; color: #999;margin-left: 8px;display: inline;white-space: nowrap;border-radius: 4px;}
.book .left .data .book_data .tags span span:first-child, .book .left .data .book_data .tags em:first-child {margin-left: 0;}
.book .left .data .book_data .tags em.orange{background: #fca000;border-color: #fca000;color: #fff!important;}
.book .left .data .book_data .text {line-height: 20px;padding-top: 40px;color: #666;height: 60px;overflow: hidden;}
.book .left .data .book_data .num {line-height: 17px;padding-top: 16px;color: #666;}
.book .left .data .book_data .num span {display: inline-block;}
.book .left .data .book_data .num i {color: #ddd;display: inline-block;padding: 0 24px;}
.book .left .data .book_data .num span em {font-size: 16px;vertical-align: top;padding-right: 2px;color: #222;}
.book .left .data .update {line-height: 20px;padding-top: 16px;}
.book .left .data .update em {color: #999;}
.book .left .data .update em.time {padding-left: 32px;font-size: 12px;}
.book .left .data .read {padding-top: 24px;height: 44px;}
.book .left .data .read .btn {overflow: hidden;font-weight: 700;color: #222;vertical-align: top;margin-right: 24px;float: left;display: inline;border-radius: 42px;line-height: 44px;height: 42px;font-size: 16px;padding: 1px 49px;background: #fcc800;background-image: -webkit-gradient(90deg,from(#ffe040),to(#fcc800));background-image: -webkit-linear-gradient(90deg,#ffe040,#fcc800);background-image: -moz-linear-gradient(90deg,#ffe040,#fcc800);background-image: -o-linear-gradient(90deg,#ffe040,#fcc800);background-image: linear-gradient(90deg,#ffe040,#fcc800);}
.book .left .data .read .app_pop {float: left;position: relative;}
.book .left .data .read .app_pop .app_btn {line-height: 44px;font-size: 14px;height: 44px;overflow: hidden;display: block;position: relative;z-index: 10;}
.book .left .data .read .app_pop .pops {position: absolute;top: 100%;left: 50%;width: 120px;margin-left: -50px;text-align: center;display: none;z-index: 1;box-shadow: 0 4px 16px rgba(0,0,0,.1);background: #fccc0c;padding: 10px;border-radius: 10px;}
.book .left .data .read .app_pop .pops img {display: block;vertical-align: top;clear: both;border-radius: 5px;}
.book .left .data .read .app_pop .pops p{padding-top: 6px;}
.book .left .data .read .case_btn {float: right;color: #333;line-height: 44px;font-size: 14px;margin-left: 10px;}
.book .left .data .read .case_btn.on{color:#999;}
.book .left .data .read .case_btn i{font-size:14px;}
.book .left .data .score {position: absolute; top: 3px;right: 0;text-align: center;color: #f86036;overflow: hidden;font-size: 28px;font-weight: bold;}
.book_xia .left{width: 860px;}
.book_xia .right{width: 260px;}
.book_tab{height: 55px;overflow: hidden;border-bottom: 1px solid #ebebeb;}
.book_tab li {margin-right: 32px;float: left; display: inline;line-height: 56px;cursor: pointer;}
.book_tab li span {display: inline;float: left;}
.book_tab li span.tt {font-size: 18px;color: #666;position: relative;}
.book_tab li.on span.tt {font-weight: 700;color: #222;}
.book_tab li.on span.tt i {position: absolute;bottom: 7px;left: 50%;margin-left: -8px;width: 16px;height: 4px;overflow: hidden;background: #fcc800;border-radius: 2px;}
.book_tab li span.num {font-size: 14px;color: #999;padding-left: 4px;}
.book_tab dt {line-height: 28px;height: 28px;color: #222;}
.book_tab dt .order_btn {float: right;background: #f5f5f5;border-radius: 28px;overflow: hidden;display: inline-block;margin-top: 12px;}
.book_tab dt .order_btn a {border: 0;padding: 1px 13px;float: left;padding: 0 12px;border: 1px solid #f5f5f5;line-height: 26px;height: 26px;overflow: hidden;color: #666;border-radius: 26px;}
.book_tab dt .order_btn a.on {position: relative;z-index: 5; color: #fff;background: #fff;font-weight: 700;border-color: #ddd;background: #FCB900;background-image: -webkit-gradient(90deg,from(#ffe040),to(#FCB900));background-image: -webkit-linear-gradient(90deg,#ff9ac2,#FCB900);background-image: -moz-linear-gradient(90deg,#ff9ac2,#FCB900);background-image: -o-linear-gradient(90deg,#ff9ac2,#FCB900);background-image: linear-gradient(90deg,#ff9ac2,#FCB900);}
.book_tab dt .order_btn a em {display: inline-block;}
.book_tab_list {overflow: hidden;width: 100%;}
.book_tab_list .book_text {padding: 24px 0;}
.book_tab_list .book_text dt {font-size: 20px;line-height: 28px;font-weight: 700;}
.book_tab_list .book_text dd {line-height: 30px;font-size: 16px;padding-top: 8px;}
.book_tab_list .book_text dd .article {position: relative;}
.book_tab_list .book_text dt {font-size: 20px;line-height: 28px;font-weight: 700;}
.book_tab_list .book_text dt.chapter_name{padding-top: 40px;}
.book_tab_list .book_text dd .chapter_btn {display: block;text-align: center;padding: 24px 0 0;}
.book_tab_list .book_text dd .chapter_btn a {width: 160px;margin: 0 auto;border-radius: 42px;line-height: 44px;height: 42px;font-size: 16px;color: #222;vertical-align: top;display: inline-block;overflow: hidden;padding: 0 48px;border: 1px solid #666;font-weight: 100;}
.book_tab_list .book_text dd .chapter_text .mask{position: absolute;z-index: 5;bottom: 0;left: 0;width: 100%;height: 120px;zoom: 1;background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(255,255,255,0)),to(#fff)); background-image: -webkit-linear-gradient(top,rgba(255,255,255,0),#fff);background-image: -moz-linear-gradient(top,rgba(255,255,255,0),#fff);background-image: -ms-linear-gradient(top,rgba(255,255,255,0),#fff);background-image: -o-linear-gradient(top,rgba(255,255,255,0),#fff);background-image: linear-gradient(top,rgba(255,255,255,0),#fff);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr="#00FFFFFF", EndColorStr="#FFFFFFFF");}
.book_tab_list .book_text dd .chapter_text p{padding: 8px 0;}
.book_tab_list .book_dir {padding-top: 32px;}
.book_tab_list .book_dir dt {line-height: 28px;height: 28px;color: #222;}
.book_tab_list .book_dir dt .order_btn {float: right;background: #f5f5f5;border-radius: 28px;overflow: hidden;display: inline-block;}
.book_tab_list .book_dir dt .order_btn a {border: 0;padding: 1px 13px;float: left;padding: 0 12px;border: 1px solid #f5f5f5;line-height: 26px;height: 26px;overflow: hidden;color: #666;border-radius: 26px;}
.book_tab_list .book_dir dt .order_btn a.on {position: relative;z-index: 5; color: #222;background: #fff;font-weight: 700;border-color: #ddd;background: #fcc800;background-image: -webkit-gradient(90deg,from(#ffe040),to(#fcc800));background-image: -webkit-linear-gradient(90deg,#ffe040,#fcc800);background-image: -moz-linear-gradient(90deg,#ffe040,#fcc800);background-image: -o-linear-gradient(90deg,#ffe040,#fcc800);background-image: linear-gradient(90deg,#ffe040,#fcc800);}
.book_tab_list .book_dir dt .order_btn a em {display: inline-block;}
.book_tab_list .book_dir dd {width: 100%;overflow: hidden;padding-top: 16px;}
.book_tab_list .book_dir dt h3 {float: left;font-size: 20px;font-weight: 700;}
.book_tab_list .book_dir dl {width: 100%;}
.book_tab_list .book_dir .book_dir_list span {float: left;line-height: 48px;height: 48px;overflow: hidden;margin-right: 16px;font-size: 16px;width: 390px;}
.book_tab_list .book_dir .book_dir_list span a{display: inline-block;position: relative; padding-right: 20px;}
.book_tab_list .book_dir .book_dir_list span a img{vertical-align:middle;}
.book_tab_list .book_dir .comic_dir_list span {float: left;overflow: hidden;margin-right: 20px;font-size: 16px;width: 200px;margin-bottom: 20px;}
.book_tab_list .book_dir .comic_dir_list span:nth-child(4n){margin-right: 0px;}
.book_tab_list .book_dir .comic_dir_list span a{display: block;width: 100%;height: 130px;position: relative;background-position: center center;background-size: cover;background-repeat: no-repeat;border-radius:5px;transition: all .5s;}
.book_tab_list .book_dir .comic_dir_list span a p{position:absolute;bottom:0;left:0;background: #00000099;width: 100%;height: 30px;line-height: 30px;text-align: center;color:#e5e5e5;font-size:14px;}
.book_tab_list .book_dir .comic_dir_list span a em{position:absolute;top:0;left:0;background: #00000029;width: 100%;height: 100px;line-height: 100px;text-align: center;color:#fff;}
.book_tab_list .book_dir .comic_dir_list span a em i{font-size:18px;}
.book_tab_list .book_dir .comic_dir_list span a:hover p{color:#fff;}
.book_tab_list .book_dir .comic_dir_list span a:hover{transform:scale(1.1,1.1);}

.book_xia {margin-top: 32px;}
.book_xia .love{background: #f8f8f8;border-radius: 4px;padding-bottom: 16px;}
.book_xia .love .name{padding-left: 16px;line-height: 56px;height: 56px;}
.book_xia .love .name h3{font-size: 18px;color: #222;float: left;font-weight: 700;}
.book_xia .love .love_list ul{padding-right: 16px;padding-left: 16px;}
.book_xia .love .love_list li, .book_xia .love .love_list li .pic {float: left;display: inline;}
.book_xia .love .love_list li {width: 100%;margin: 24px 0 0;}
.book_xia .love .love_list li:first-child {margin-top: 0;}
.book_xia .love .love_list li .pic {width: 90px;height: 120px;border-radius: 2px;box-shadow: 0 0 1px rgba(0,0,0,.2) inset;overflow: hidden;}
.book_xia .love .love_list li .pic a {display: block;position: relative;}
.book_xia .love .love_list li .pic img {width: 100%;height: 100%;display: block;vertical-align: top;border-radius: 2px;}
.book_xia .love .love_list li .txt {width: 122px;height: 120px;float: right;position: relative;overflow: hidden;font-size: 12px;}
.book_xia .love .love_list li .txt span {display: block;}
.book_xia .love .love_list li .txt span.tit {line-height: 22px;font-size: 16px;color: #222;padding-top: 4px;}
.book_xia .love .love_list li .txt span.des, .book_xia .love .love_list li .txt span.author {line-height: 17px;color: #999;}
.book_xia .love .love_list li .txt span.des {padding-top: 8px;height: 34px;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.book_xia .love .love_list li .txt p {position: absolute;bottom: 0;left: 0;width: 100%;padding-bottom: 3px;}
.book_xia .love .love_list .more {text-align: center;padding: 20px 0 0;}
.book_xia .love .love_list .more a {color: #cc6d29;font-size: 14px;line-height: 20px;}
.book_xia .love .love_list .more a i{font-size: 14px;}

.hots h3{font-size: 20px;font-weight: bold;color: #333333;margin-top:25px;}
.hots .hotlist{width: 360px;height: 582px;background: #F4F5F6;border-radius: 4px;margin-top: 20px;margin-left: 60px;float: left;}
.hots .hotlist.one{margin-left:0;}
.hots .hotlist .title{padding: 15px;padding-bottom: 0px;}
.hots .hotlist .title .left{font-size: 18px;color: #333333;}
.hots .hotlist .title .right a{margin-left:15px;}
.hots .hotlist .title .right a.on{color: #F86036;}
.hots .hotlist ul{height: 317px;border-radius: 4px;padding:15px;margin-top:24px;}
.hots .hotlist ul li {padding: 12px 0;float: left;width: 100%;}
.hots .hotlist ul li .num {font-style: normal;width: 20px; height: 20px;line-height: 22px;text-align: center;color: #999;overflow: hidden;margin-right: 10px;display: inline;float: left;}
.hots .hotlist ul li .num.red {color: #ff3300;}
.hots .hotlist ul li .pic {float: left;width: 74px;height: 104px;overflow: hidden;display: none;border-radius: 2px;}
.hots .hotlist ul li .pic img {width: 100%;height: 100%;display: block;vertical-align: top;}
.hots .hotlist ul li .txt {float: left;width: 220px;height: 20px;overflow: hidden;}
.hots .hotlist ul li .txt span {display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;line-height: 17px;font-size: 12px;height: 17px;}
.hots .hotlist ul li .txt span.name {font-size: 14px;line-height: 20px;height: 20px;color: #222;}
.hots .hotlist ul li .txt span.author {color: #999;padding-top: 15px;}
.hots .hotlist ul li .txt span.hits {color: #fca000;padding-top: 30px;}
.hots .hotlist ul li .txt span.hits em { font-weight: 700;font-style: normal;}
.hots .hotlist ul li.hover {padding: 6px 0 10px;}
.hots .hotlist ul li.hover .num.red{color: #F86036;}
.hots .hotlist ul li.hover .pic {display: inline;}
.hots .hotlist ul li.hover .txt {float: right;height: auto;width: 210px;}
 
.doc{padding:  30px;}
.doc h2{font-size: 24px;text-align: center;font-weight: 600;padding: 20px 0;border-bottom: 1px solid #e0e0e0;margin-bottom: 10px;}
.doc h3{font-size: 20px;font-weight: 500;line-height: 40px;}
.doc p{line-height: 25px;}

.login-box{width: 700px;min-height: 500px;margin: 0 auto;padding-top:50px;}
.login-box h3{width: 100%;font-weight: 500;padding: 20px 0;text-align: center;font-size: 18px;border-bottom: 1px solid #e5e5e5;margin-bottom: 30px;}
.login-box .layui-form{width: 500px;margin: 0 auto;margin-top:50px;}
.login-box .layui-form-item{margin-bottom: 25px;}
.login-box .layui-btn-fluid{width: 90%;margin-left: 5%;background: #ffca00;color:#222;font-size:16px;height: 45px;line-height: 45px;}
.login-box .layui-form-label{font-size: 16px;}
.login-box .layui-input{height: 42px;}
.login-box .code_btn,.user-index-box .code_btn{display: inline-block;line-height: 1;cursor: pointer;background: #fff;border: 1px solid #ececec;color: #606266;font-weight: 500;padding: 12px;border-radius: 5px;}
.login-box .layui-form-item .layui-form-checkbox[lay-skin=primary]{margin-top: 0;}
.login-box .layui-form-checked[lay-skin=primary] i{border-color: #ffca00!important;background-color: #ffca00;}
.login-box .layui-form-checkbox[lay-skin=primary]:hover i{border-color: #ffca00;}
.login-box .layui-form-checkbox[lay-skin=primary] span{padding-right: 0;}
.login-box .xieyi a{color: #20a0ff;}
.login-box .xieyi a:hover{color: #FCB900;}
.sms-code-box {padding: 15px 10px 0;font-size: 14px;line-height: normal;position: relative;}
.sms-code-box .code-img{width: 100%;margin-bottom: 16px;position: relative;overflow: hidden;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 1px;height: 116px;vertical-align: middle;text-align: center;}
.sms-code-box .code-img img{width: 100%;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;border: 1px solid #e5e5e5;height: 100%;display: block;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.sms-code-box .code-img .points-item {display: block;position: absolute;height: 14px;line-height: 14px;font-size: 12px;text-align: center;width: 14px;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;background: #83da35;color: #fff;}
.sms-code-box .code-img .refresh {height: 30px;line-height: 30px;width: 30px;position: absolute;right: 0;bottom: 0;background-color: #000;background-color: rgba(0,0,0,.5);-webkit-border-top-left-radius: 4px;-moz-border-radius-topleft: 4px;border-top-left-radius: 4px;text-align: center;}
.sms-code-box .code-img .refresh i {font-weight: 600;font-size: 18px;color:#fff;}
.sms-code-box .code-text{margin-bottom: 16px;overflow: hidden;}
.sms-code-box .code-text .sms-msg{width: 160px;float: left;}
.sms-code-box .code-text .sms-text{width: 95px;float: right;height: 45px;line-height: 45px;text-align: center;font-size: 24px;color: #c80000;background: -webkit-gradient(linear,left top,left bottom,color-stop(6%,#ff8174),color-stop(77%,#ffce70));background: -webkit-linear-gradient(top,#ff8174 6%,#ffce70 77%);background: -moz- oldlinear-gradient(top,#ff8174 6%,#ffce70 77%);background: -o-linear-gradient(top,#ff8174 6%,#ffce70 77%);background: linear-gradient(-180deg,#ff8174 6%,#ffce70 77%);border: 1px solid #e5e5e5;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.sms-code-box .smspic-btn{cursor: pointer;text-align: center;border-top: 1px solid #dcdcdc;-webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box;padding: 0;margin: 0;height: 45px;line-height: 45px;background-color: #ffffff;color: #666666;font-size: 14px;}


.user-index-box{width: 100%;margin: 20px 0;float: left;}
.user-index-box .h500 {min-height: 520px;}
.user-index-box .left{width: 250px;margin-right: 20px;border-radius: 4px;background: #f6f6f6;min-height: 500px;}
.user-index-box .right{width: 930px;border-radius: 4px;}
.user-index-box .left .ulogo{height: 70px;width: 70px;line-height: 70px;margin-top: 10px;margin: 20px auto;border-radius: 50%;padding: 2px;border: 1px solid #ccc;}
.user-index-box .left .ulogo img{height: 70px;width: 70px;border-radius: 50%;display: block;}
.user-index-box .left ul{text-align: center;padding-bottom: 30px;height: 100%;position: relative;}
.user-index-box .left ul li{margin: 20px 0;height: 42px;line-height: 42px;font-size: 14px;color: #303133;padding: 0 20px;cursor: pointer;box-sizing: border-box;}
.user-index-box .left ul li a{color:#111;font-size: 16px;display: block;}
.user-index-box .left ul li a i{margin-right: 10px;color:#111;}
.user-index-box .left ul li:hover{background: #c8c8df;}
.user-index-box .left ul li.on{background: #fcc800;}
.user-index-box .left ul li.on a,.user-index-box .left ul li.on a i{color:#222;}

.user-index-box .right .box1{padding: 20px 15px;background: #f6f6f6;width: 100%;height: 80px;position: relative;}
.user-index-box .right .box1 .user-info{width: 50%;display: inline-block;}
.user-index-box .right .box1 .user-info p{padding-top: 2px;padding-bottom: 8px;}
.user-index-box .right .box1 .user-info p span{width: 80px;display: inline-block;text-align: right;padding-right: 5px;font-weight: 600;}
.user-index-box .right .box1 .user-info p a{color:red;}
.user-index-box .right .box1 .user-info p.cion a{padding-left: 10px;}
.user-index-box .right .box1 .qiandao-num{position: absolute;right:170px;top:20px;width: 150px;}
.user-index-box .right .box1 .qiandao-num .row{width: 100%;height: 40px;line-height: 40px;font-weight: 600;}
.user-index-box .right .box1 .qiandao-num .row span{padding: 0 5px;}
.user-index-box .right .box1 .qiandao{cursor: pointer;position: absolute;right:20px;top:15px;width: 100px;text-align: center;}
.user-index-box .right .box1 .qiandao .top{width: 60px;height: 60px;background: #fcc800;line-height: 60px;text-align: center;font-size: 18px;color:#222;border-radius: 50%;margin: 0 auto;}
.user-index-box .right .box1 .qiandao .tps{padding-top: 8px;font-weight: 600;}
.user-index-box .right .box1 .qiandao:hover .top,.user-index-box .right .box1 .qiandao .top.on{background: #FCB900;}

.user-index-box .right .box2{padding: 0 15px;background: #f6f6f6;width: 100%;}
.user-index-box .right .box2 h3{width: 100%;height: 50px;line-height: 50px;font-weight: 600;}
.user-index-box .right .box2 ul.data{width: 100%;padding: 10px 0;}
.user-index-box .right .box2 ul.data li{width: 31.33333%;margin-right: 3%;margin-bottom: 20px;display: inline-block;vertical-align: middle;position: relative;height: 160px;overflow: hidden;}
.user-index-box .right .box2 ul.data li:nth-child(3n){margin-right: 0;}
.user-index-box .right .box2 ul.data li .pic{position: absolute;left:0;top:0;width: 120px;display: block;}
.user-index-box .right .box2 ul.data li .picbg{position: absolute;left:0;top:0;width: 120px;height: 160px;z-index: 99;background: #0006;cursor: pointer;display: none;}
.user-index-box .right .box2 ul.data li .picbg i{position: absolute;top:50%;left:50%;width: 50px;height: 50px;line-height: 50px;margin-left: -10px;margin-top: -25px;font-size: 26px;color:#fff;}
.user-index-box .right .box2 ul.data li:hover .picbg{display: block;}
.user-index-box .right .box2 ul.data li .pic img{width: 100%;}
.user-index-box .right .box2 ul.data li .info{padding-left: 135px;display: block;}
.user-index-box .right .box2 ul.data li .info h4{font-weight: 600;font-size: 16px;height: 24px;overflow: hidden;}
.user-index-box .right .box2 ul.data li .info p{padding-top: 8px;color:#666;line-height: 24px;}
.user-index-box .right .box2 ul.data li .info p.chapter{height: 25px;overflow: hidden;padding-top: 30px;}
.user-index-box .right .box2 ul.data li .info p:last-child{padding-top: 8px;}
.user-index-box .right .box2 .layui-tab{margin: 0;font-size: 14px;}
.user-index-box .right .box2 .layui-tab-title{height: 50px;border-color: #d2d2d2;}
.user-index-box .right .box2 .layui-tab-title li{padding: 10px 15px;}
.user-index-box .right .box2 .layui-tab-title .layui-this:after{height: 50px;}
.user-index-box .right .box2 .layui-tab-title .del-all{position: absolute;right: 10px;top:20px;font-size: 14px;cursor: pointer;}
.user-index-box .right .box2 .nodata{width: 100px;margin: 0 auto;text-align: center;padding-top: 100px;}
.user-index-box .right .box2 .nodata img{width: 100%;}
.user-index-box .right .box2 .nodata p{padding-top: 10px;color:#666;}
.user-index-box .right .box2 .cionlist{width: 100%;}
.user-index-box .right .box2 .cionlist li{width: 23.5%;display: inline-block;height: 80px;margin-right: 2%;cursor: pointer;text-align: center;}
.user-index-box .right .box2 .cionlist li:nth-child(4n){margin-right: 0;}
.user-index-box .right .box2 .cionlist li div{height: 100%;background: #fff;border-radius: 5px;border: 1px solid #e1e1e1;}
.user-index-box .right .box2 .cionlist li div p{padding-top: 20px;font-size: 16px;font-weight: 600;}
.user-index-box .right .box2 .cionlist li div p:nth-child(2){padding-top: 10px;font-weight: 500;font-size: 14px;}
.user-index-box .right .box2 .cionlist li:hover div,.user-index-box .right .box2 .cionlist li.on div{border: 1px solid #FCB900;background: #fff4f4;}
.user-index-box .right .box2 .viplist{width: 100%;}
.user-index-box .right .box2 .viplist li{width: 23.5%;display: inline-block;height: 80px;margin-right: 2%;cursor: pointer;text-align: center;}
.user-index-box .right .box2 .viplist li:nth-child(4n){margin-right: 0;}
.user-index-box .right .box2 .viplist li div{height: 100%;background: #fff;border-radius: 5px;border: 1px solid #e1e1e1;}
.user-index-box .right .box2 .viplist li div p{padding-top: 20px;font-size: 16px;font-weight: 600;}
.user-index-box .right .box2 .viplist li div p:nth-child(2){padding-top: 10px;font-weight: 500;font-size: 14px;}
.user-index-box .right .box2 .viplist li:hover div,.user-index-box .right .box2 .viplist li.on div{border: 1px solid #FCB900;background: #fff4f4;}
.user-index-box .right .box2 .paytype{width: 100%;}
.user-index-box .right .box2 .paytype li{width: 20%;background: #fff;border-radius: 5px;display: inline-block;height: 50px;line-height: 50px;margin-right: 20px;cursor: pointer;text-align: center;border: 1px solid #e1e1e1;}
.user-index-box .right .box2 .paytype li i{width: 25px;height: 25px;display: inline-block;background: url("/packs/images/icon_pay.png") no-repeat;background-size: cover;position: relative;top: 7px;margin-right: 10px;}
.user-index-box .right .box2 .paytype li i.wxpay{background-position: 0 0;}
.user-index-box .right .box2 .paytype li i.alipay{background-position: -30px 0;}
.user-index-box .right .box2 .paytype li:hover,.user-index-box .right .box2 .paytype li.on{border: 1px solid #FCB900;background: #fff4f4;}
.user-index-box .right .box2 .pay-btn{cursor: pointer;width: 50%;background: #FCB900;color:#222;border-radius: 5px;height: 50px;line-height: 50px;text-align: center;margin: 0 auto;margin-top: 50px;}
.user-index-box .pay-tips{float: right;}
.user-index-box .pay-tips p{padding-top: 5px;}
.user-index-box .w500{width: 500px;padding: 20px;}
.user-index-box input.disabled{background: #e2e2e2;}
.user-index-box .upic{margin: 0 auto;text-align: center;width: 100%;cursor: pointer;}
.user-index-box .upic img{width: 140px;height: 140px;border-radius: 50%;margin: 0 auto;}
.user-index-box .upic-txt{text-align: center;padding-top: 10px;}
.user-index-box .layui-btn{background-color: #FCB900;color:#222;}

.pay-qrcode{padding: 15px;text-align: center;}
.pay-qrcode .qrcode{width: 200px;height: 200px;margin: 0 auto;}
.pay-qrcode .qrcode img{width: 100%;height: 100%;border-radius: 10px;}
.pay-qrcode .rmb{padding-top: 10px;font-weight: 600;font-size: 16px;color:#111;}
.pay-qrcode .txt{padding-top: 15px;color:#333;font-size:16px;}

.layui-tab-brief>.layui-tab-title .layui-this {color: #f30;font-weight: 600;}
.layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after {border-bottom: 2px solid #f30;}

@media screen and (min-width: 1200px){
	.layui-container {
	    width: 1200px;
	}
}
@media screen and (min-width: 992px){
    .layui-container {
        width: 1200px;
    }
}
@media screen and (min-width: 768px){
    .layui-container {
        width: 1200px;
    }
}