@charset "UTF-8";

html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,embed,
figure,figcaption,footer,header,hgroup,
menu,nav,output,ruby,section,summary,
time,mark,audio,video{
    margin:0;
    padding:0;
    border:0;
    vertical-align:baseline;
    box-sizing:border-box;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main{
    display:block;
}

body{
    font-family:Arial,Helvetica,sans-serif;
    line-height:1.6;
    color:#444;
    background:#f7f8fa;
    margin:0 auto;
}

ol,ul{list-style:none}
a{text-decoration:none;color:#336699}
a:hover{color:#f60}
img{max-width:100%;height:auto;display:block}
.clear{clear:both}

html{font-size:16px}
@media (min-width:375px){html{font-size:17px}}
@media (min-width:768px){html{font-size:16px}}

.header{
    width:100%;
    max-width:980px;
    margin:0 auto;
    padding:10px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
}

.header_logo{
    display:none;
}

.header_logo a{
    color:#333;
    font-weight:700;
}

.header_logo span{
    font-size:1.2rem;
}

.header_logo p{
    font-size:.75rem;
    color:#f60;
}

.header_logo_left,
.header_logo_right{
    display:flex;
    align-items:center;
    gap:10px;
}

.header_logo_middle{
    flex:1;
    text-align:center;
    font-size:1rem;
    font-weight:700;
    color:#333;
}

.header_logo_middle a{color:#333}

.book-btn,
#search-btn,
#menu-btn{
    display:inline-block;
    padding:6px 10px;
    background:#eef3f8;
    border:1px solid #dbe5ee;
    border-radius:4px;
    font-size:.75rem;
    text-indent:0;
}

.header_search{
    display:none;
    width:100%;
    margin-top:10px;
}

.header_search.show{
    display:block;
}

.header_search form{
    display:flex;
}

.header_search input{
    flex:1;
    height:38px;
    border:1px solid #d9e2ec;
    padding:0 12px;
    border-right:none;
    background:#fff;
}

.header_search button{
    width:90px;
    border:none;
    background:#4d7ea8;
    color:#fff;
    cursor:pointer;
}

.header_login{
    display:none;
}

.nav{
    display:none;
    width:100%;
    max-width:980px;
    margin:0 auto;
    background:#4d7ea8;
}

.nav.show{
    display:block;
}

.nav ul{
    display:flex;
    flex-wrap:wrap;
}

.nav li{
    width:25%;
    text-align:center;
}

.nav a{
    display:block;
    padding:10px 0;
    color:#fff;
    font-size:.9rem;
}

.nav a:hover{
    background:rgba(255,255,255,.08);
    color:#ffd27a;
}

#main, main{
    width:100%;
    max-width:980px;
    margin:0 auto;
}

.box_con{
    width:100%;
    max-width:980px;
    margin:10px auto 0;
    background:#fff;
    border:1px solid #dfe7ef;
}

.con_top{
    background:#f1f5f9;
    padding:10px 12px;
    font-size:.85rem;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.hotcontent,
.novelslist,
#newscontent{
    margin-top:10px;
}

.hotcontent .l,
.hotcontent .r,
.novelslist .content,
#newscontent .l,
#newscontent .r{
    background:#fff;
    border:1px solid #dfe7ef;
}

.hotcontent h2,
.novelslist .content h2,
#newscontent h2,
#list dt{
    background:#f1f5f9;
    padding:10px 12px;
    font-size:1rem;
    font-weight:700;
}

.hotcontent .l .item,
.hotcontent .r li,
#newscontent .l li,
#newscontent .r li,
.novelslist .content ul li{
    border-top:1px dashed #e4e8ed;
}

.hotcontent .l .item:first-child,
.hotcontent .r li:first-child,
#newscontent .l li:first-child,
#newscontent .r li:first-child,
.novelslist .content ul li:first-child{
    border-top:none;
}

.hotcontent .l .item,
.hotcontent .r li,
#newscontent .l li,
#newscontent .r li{
    padding:10px 12px;
}

.hotcontent .l .item{
    display:flex;
    gap:10px;
}

.hotcontent .l .image img{
    width:72px;
    height:96px;
    object-fit:cover;
    border:1px solid #e5e7eb;
    background:#fff;
    padding:2px;
}

.hotcontent .l .item dl{
    flex:1;
}

.hotcontent .l .item dt{
    font-size:.95rem;
    font-weight:700;
    margin-bottom:6px;
}

.hotcontent .l .item dd{
    font-size:.8rem;
    color:#777;
    line-height:1.5;
    height:2.4rem;
    overflow:hidden;
}

.hotcontent .l .item .btm{
    margin-top:6px;
    font-size:.75rem;
    color:#888;
}

.hotcontent .l .item .btm em{
    float:right;
    font-size:.72rem;
    color:#f60;
    border:1px solid #f60;
    padding:0 4px;
    border-radius:2px;
}

.hotcontent .r li span,
#newscontent .l li span,
#newscontent .r li span{
    display:inline-block;
    vertical-align:top;
}

.hotcontent .r li .s1,
#newscontent .l li .s1,
#newscontent .r li .s1{
    width:42px;
    color:#888;
}

.hotcontent .r li .s2,
#newscontent .r li .s2{
    width:calc(100% - 130px);
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

#newscontent .l li .s2{
    width:calc(100% - 160px);
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.hotcontent .r li .s5,
#newscontent .r li .s5,
#newscontent .l li .s5{
    float:right;
    width:70px;
    text-align:right;
    color:#888;
    overflow:hidden;
    white-space:nowrap;
}

#newscontent .l li .s3,
#newscontent .l li .s4{
    display:none;
}

.novelslist{
    display:block;
}

.novelslist .content{
    margin-bottom:10px;
}

.novelslist .content ul{
    padding:0 12px 8px;
}

.novelslist .content ul li{
    padding:10px 0;
    font-size:.9rem;
    overflow:hidden;
}

.novelslist .content ul li a{
    float:left;
    width:calc(100% - 90px);
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.novelslist .content ul li i{
    float:right;
    width:80px;
    text-align:right;
    font-style:normal;
    color:#888;
    font-size:.8rem;
}

#maininfo{
    display:block;
    padding:12px;
}

#sidebar{
    float:left;
    width:96px;
}

#fmimg img{
    width:80px;
    height:110px;
    object-fit:cover;
    border:1px solid #e5e7eb;
    background:#fff;
    padding:3px;
}

#info{
    margin-left:96px;
    min-height:110px;
    font-size:.9rem;
}

#info h1{
    font-size:1.1rem;
    color:#336699;
    margin-bottom:8px;
}

#info p{
    line-height:1.7;
    color:#666;
}

#intro{
    clear:both;
    margin-top:12px;
    padding-top:10px;
    border-top:1px dashed #e4e8ed;
    font-size:.9rem;
    color:#555;
    line-height:1.8;
}

.readbtn{
    display:flex;
    gap:10px;
    margin-top:12px;
    flex-wrap:wrap;
}

.readbtn a{
    display:inline-block;
    padding:8px 16px;
    background:#eef3f8;
    border:1px solid #dbe5ee;
    border-radius:4px;
    font-size:.9rem;
}

.readbtn a:hover{
    background:#f60;
    color:#fff;
}

.listtj{
    padding:10px 12px;
    font-size:.9rem;
    line-height:1.8;
}

.listtj a{
    margin-right:10px;
}

#list{
    font-size:.9rem;
}

#list dl{
    overflow:hidden;
}

#list dd{
    display:block;
    padding:10px 12px;
    border-top:1px dashed #e4e8ed;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

#list li{
    padding:10px 12px;
    border-top:1px dashed #e4e8ed;
    color:#666;
}

#list p{
    padding:12px;
    line-height:1.8;
    color:#666;
}

.bookname{
    text-align:center;
    font-size:1.2rem;
    line-height:1.8;
    padding:16px 12px;
    color:#336699;
    font-weight:700;
}

#chaptercontent{
    padding:0 16px 16px;
    font-size:1.1rem;
    line-height:2;
    text-align:justify;
}

#chaptercontent p{
    text-indent:2em;
    margin:.8rem 0;
}

.bottem1,
.bottem2{
    display:flex;
    margin:10px 12px;
    border:1px solid #dfe7ef;
    background:#fafcff;
}

.bottem1 a,
.bottem2 a{
    flex:1;
    text-align:center;
    padding:10px 0;
    border-right:1px solid #dfe7ef;
}

.bottem1 a:last-child,
.bottem2 a:last-child{
    border-right:none;
}

.pages{
    text-align:center;
    padding:15px 0;
}

.pagination{
    display:inline-flex;
    flex-wrap:wrap;
    gap:4px;
}

.pagination li,
.pagination a,
.pagination span{
    display:inline-block;
}

.pagination a,
.pagination span{
    padding:6px 12px;
    background:#fff;
    border:1px solid #dfe7ef;
}

#firendlink{
    max-width:980px;
    margin:10px auto 0;
    padding:10px 12px;
    background:#fff;
    border:1px solid #dfe7ef;
    font-size:.85rem;
    line-height:1.8;
}

#firendlink a{
    margin-right:8px;
    display:inline-block;
}

.footer{
    max-width:980px;
    margin:10px auto 0;
    padding:14px 12px;
    text-align:center;
    font-size:.8rem;
    color:#999;
}

.footer_map{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:20px;
    margin-bottom:8px;
    font-size:.9rem;
}

.footer_map a{
    color:#336699;
}

.footer_map a:hover{
    color:#f60;
}

.gotop{
    position:fixed;
    right:16px;
    bottom:60px;
    display:inline-block;
    width:42px;
    height:42px;
    line-height:42px;
    text-align:center;
    background:#4d7ea8;
    color:#fff;
    border-radius:4px;
    font-size:.7rem;
    opacity:.9;
}

.hidden-xs{display:none}
.visible-xs{display:inline}

.wppc{display:block}

@media (min-width:768px){
    .header{
        padding:15px 0;
    }

    .header_logo{
        display:block;
    }

    .header_logo_left,
    .header_logo_middle .header_logo_right{
        display:none;
    }

    .header_logo_middle{
        display:none;
    }

    .header_login{
        display:inline-block;
        padding:8px 12px;
        background:#4d7ea8;
        color:#fff;
        border-radius:4px;
        font-size:.85rem;
        margin-left:10px;
    }

    .header_search{
        display:block;
        width:320px;
        margin-top:0;
    }

    .nav{
        display:block;
    }

    .nav ul{
        flex-wrap:nowrap;
    }

    .nav li{
        width:auto;
        flex:1 1 0;
    }

    .nav a{
        padding:11px 4px;
        font-size:.85rem;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .hotcontent{
        display:flex;
        gap:10px;
    }

    .hotcontent .l{
        flex:1;
    }

    .hotcontent .r{
        width:280px;
    }

    .novelslist{
        display:flex;
        gap:10px;
    }

    .novelslist .content{
        flex:1;
    }

    #newscontent{
        display:flex;
        gap:10px;
    }

    #newscontent .l{
        flex:1;
    }

    #newscontent .r{
        width:280px;
    }

    #newscontent .l li .s3{
        display:inline-block;
        width:180px;
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
    }

    #newscontent .l li .s4{
        display:inline-block;
        width:80px;
        color:#888;
    }

    #sidebar{
        width:140px;
    }

    #fmimg img{
        width:110px;
        height:150px;
    }

    #info{
        margin-left:140px;
        min-height:150px;
    }

    #info p{
        width:50%;
        float:left;
    }

    #intro{
        clear:both;
    }

    #list dd{
        float:left;
        width:25%;
        border-top:1px dashed #e4e8ed;
    }

    .hidden-xs{display:inline}
    .visible-xs{display:none}
    .wppc{display:none}
}


.rank-list ul,
.library-list ul{
    min-height: 0;
}

.hotcontent .r li,
#newscontent .r li{
    min-height: 46px;
}

@media (min-width:768px){
    .hotcontent .r li .s2,
    #newscontent .r li .s2{
        width:calc(100% - 126px);
    }
}
