@charset "utf-8"; * { margin: 0; padding: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } :after, :before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .container { position: relative; margin-right: auto; margin-left: auto; } .row { position: relative; margin: 10px auto 20px; padding: 0; } .container:before, .container:after, .row:before, .row:after, .clearfix:before, .clearfix:after { display: table; content: " "; clear: both; } .fix { zoom: 1 } .fix:after, .fix:before { display: block; content: "clear"; height: 0; clear: both; overflow: hidden; visibility: hidden } .none { display: none; } ul, ol { list-style: none; } /* text */ h1 { font-size: 36px; } h2 { font-size: 32px; } h3 { font-size: 24px; } h4 { font-size: 18px; } h5 { font-size: 16px; } h6 { font-size: 14px; } h1, h2, h3, h4, h5, h6 { font-weight: 400; } a, button { color: #6F78A7; text-decoration: none; outline: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } button { border: 0; } button:hover, input.btn { cursor: pointer; } a:focus, a:hover, a:active { text-decoration: none; } .input-text { padding: 0 5px; } img { display: block; max-width: 100%; } body { background-color: #E9FAFF; color: #555; font-size: 12px; margin: 0 auto; } .topbar-sethome, .topbar-addfavorite, .topbar-login .btn-submit, .detail-box .imgbox .flag { background: url('../images/all.gif') no-repeat scroll 0 0 transparent; } .topbar { background-color: #E1ECED; border-bottom: 1px solid #A6D3E8; color: gray; height: 29px; min-width: 950px; width: 100%; font-size: 12px; } .topbar-con { line-height: 28px; text-indent: 16px; vertical-align: middle; width: 1024px; margin: 0 auto; } .topbar-sethome { background-position: 0 8px; float: left; margin-right: 20px; } .topbar a { color: gray; } .topbar-addfavorite { background-position: 0 -12px; float: left; } .topbar-right { float: right; font-size: 13px; } .topbar-login .input-text { border: 1px solid #A6D3E8; height: 20px; width: 90px; margin: 4px 0; vertical-align: top; outline: 0 none; margin-right: 15px; } .topbar-login .btn-submit { background-position: 0 -96px; border: medium none; color: #2A4E8A; font-size: 12px; height: 21px; line-height: 21px; text-align: center; width: 51px; vertical-align: top; margin-top: 3px; margin-right: 30px; } .header { height: 62px; width: 1024px; margin: auto; position: relative; } .header .logo a { font-family: 楷体_GB2312, STKaiti; display: block; float: left; height: 60px; width: 250px; line-height: 75px; color: #0065b5; font-size: 40px; text-shadow: #8c8989 3px 3px 6px; } .header .m-user { display: none; float: right; } .header .btn { color: #fff; padding: 6px 10px; margin-left: 10px; border-radius: 3px; background-color: #007BB1; } .search-form { float: left; width: 450px; margin: 20px auto auto 30px; } .search-form .input-key { border: 1px solid #A6D3E8; font: 14px/32px arial; height: 32px; margin-right: 5px; width: 320px; } .search-form .btn-tosearch { background: #DDD; cursor: pointer; font-size: 14px; height: 32px; width: 95px; border: 0 none; } .nav { background: #88C6E5; height: 40px; overflow: hidden; width: 1024px; margin: 10px auto auto; overflow: hidden; } .nav li { float: left; line-height: 40px; } .nav li a { color: #FFF; font-size: 15px; font-weight: 700; padding: 0 10px; } .m-nav { display: none; height: 40px; background: #4baacd; line-height: 40px; text-align: center; border-bottom: 1px #4399b8 solid; font-size: 14px; padding: 0 10px; border-top: 1px #5db3d2 solid; position: relative; } .m-nav li { flex: 1 1 auto; } .m-nav li a { color: #fff; } .m-nav .type-list { width: 100%; position: absolute; z-index: 10; background: #4caacd; top: 40px; left: 0; max-height: 0px; overflow: hidden; text-align: left; transition: max-height .3s ease; } .m-nav .type-list a { display: block; padding-left: 22px; border-bottom: 1px dashed #7db0c3; } .m-nav .type-list-active { max-height: 288px; } .container { width: 1024px; } .layout, .layout2 { background: #FEF9EF; border: 3px solid #C3DFEA; float: left; overflow: hidden; width: 100%; padding: 0 0 0px; } .layout2 { border: 3px solid #88C6E5; background: #E1ECED; } .row .layout-col1 { width: 29%; float: right; } .row .layout-col2 { width: 70%; } .row .layout-col3 { width: 100%; } .layout-col2 .item { width: 50%; padding: 5px 0 5px 10px; float: left; } .layout-col2 .item .image { width: 124px; max-height: 154px; overflow: hidden; float: left; } .layout-col2 .item .image img { background-color: #FFF; border: 1px solid #DDD; padding: 1px; width: 124px; height: 154px; } .layout-col2 .item dl { float: right; width: 200px; padding: 0 10px; } .layout-col2 .item dl dt { border-bottom: 1px dotted #A6D3E8; font-size: 14px; font-weight: 700; height: 26px; line-height: 26px; overflow: hidden; } .layout-col2 .item dl dt span { color: #B3B3B3; float: right; font-weight: 400; } .layout-col2 .item dl dd { line-height: 20px; overflow: hidden; text-indent: 2em; padding: 7px 0 0; height: 110px; } .layout-col3 .item { width: 33.33%; padding: 10px 0 10px 10px; float: left; } .layout-col3 .item:nth-child(n + 4) { padding-top: 0; } .layout-col3 .item .image { width: 114px; } .layout-tit { background-color: #E1ECED; border-bottom: 1px solid #DDD; font-size: 14px; font-weight: 700; height: 32px; line-height: 32px; overflow: hidden; margin: 0; padding: 0 10px; } .layout2 .layout-tit { margin: 0px; overflow: hidden; padding: 0px 0px 0px 10px; background-color: #A6D3E8; height: 32px; line-height: 32px; font-size: 14px; font-weight: bold; border-bottom: solid 1px #DDDDDD; } .txt-list { padding: 4px 10px; } .txt-list li { border-bottom: 1px solid #DDDDDD; height: 32px; line-height: 32px; overflow: hidden; } .txt-list li span { float: left; } .txt-list li a { color: #6F78A7; } .txt-list .s1 { width: 60px; } .txt-list .s5 { float: right; } .txt-list-row5 .s1 { width: 75px; } .txt-list-row5 .s2 { width: 165px; } .txt-list-row5 .s3 { width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .txt-list-row5 .s4 { color: #B3B3B3; width: 90px; text-align: right; } .txt-list-row5 .s5 { color: #B3B3B3; } .tp-box { width: 33.33%; float: left; border-right: dotted 1px #A6D3E8; } .tp-box:last-child { border-right: none; } .tp-box h2 { background-color: #F6F8FE; border-bottom: solid 1px #A6D3E8; font-size: 14px; font-weight: bold; padding-left: 10px; line-height: 26px; height: 26px; overflow: hidden; } .tp-box .top { overflow: hidden; } .tp-box .top .image { padding: 10px 0px 0px 10px; float: left; } .tp-box .top .image img { width: 72px; height: 86px; border: solid 1px #DDDDDD; padding: 1px; background-color: white; } .tp-box .top dl { padding: 10px 10px 0px; float: right; width: 240px; } .tp-box .top dl dt { height: 25px; line-height: 25px; overflow: hidden; font-weight: bold; } .tp-box .top dl dd { line-height: 20px; height: 60px; overflow: hidden; } .tp-box ul { padding: 10px 10px 0px; overflow: hidden; } .tp-box ul li { border-bottom: solid 1px #DDDDDD; color: #B3B3B3; height: 26px; line-height: 26px; font-size: 12px; overflow: hidden; float: left; width: 50%; } .tp-box ul li a { font-size: 13px; } .pc-footer { border-top: 2px solid #88C6E5; text-align: center; width: 1024px; margin: 0 auto; line-height: 24px; padding: 10px 0; } .m-footer { display: none; padding: 15px 10px; text-align: center; line-height: 33px; background: #68aac2; position: relative; font-size: 14px; } .m-footer a { margin: 0 5px; color: #c5d7df; text-shadow: 1px 1px #3e86a8; flex: 1 1 auto; } .xs-show { display: none; } .aznav{ display:none; } /* 小于1024适配 */ @media (max-width: 1024px) { .aznav{ display:block; } .xs-hidden { display: none; } .xs-show { display: initial; } .topbar, .nav, .pc-footer { display: none; } .m-footer { display: flex; } .m-nav { display: flex; margin-bottom: 50px; } .header { height: 54px; background: #4baacd; line-height: 54px; border-bottom: 1px #4399b8 solid; padding: 0 10px; } .header .search-form { display: flex; width: 100%; position: absolute; top: 104px; left: 0; padding: 0 10px; margin: 0; z-index: 9; } .search-form .input-key { outline: 0 none; margin: 0; width: auto; flex: 1; } .search-form .btn-tosearch { color: #4caacd; border: 1px solid #A6D3E8; border-left: 0 none; background: #fff; } .header .m-user { display: block; } .header .logo a { width: auto; background: none; text-indent: 0; color: #fff; font-size: 28px; height: auto; line-height: 54px; } .row { margin: 0 auto; } .header, .nav, .container { width: 100%; } .container { margin: 5px auto; } .layout-col2 .item { width: 100%; display: flex; padding: 0 0 10px 10px; } .layout-col2 .item .image { width: 90px; max-height: none; } .layout-col2 .item .image img { height: 118px; } .layout-col2 .item dl { flex: 1 1 auto; } .tp-box { width: 100%; float: none; border-right: 0 none; } .tp-box .top { display: flex; } .tp-box .top dl { flex: 1 1 auto; } .tp-box h2 { border-top: solid 1px #A6D3E8; margin-top: 10px; } .layout .tp-box:first-child h2 { border-top: 0 none; margin-top: 0; } .layout, .layout2 { float: none; border: 0 none !important; background: none; } .row .layout-col1, .row .layout-col2 { width: 100% !important; margin: 0 auto; } .row .layout-col1 { margin-top: 0px; } .row-rank .layout-col1 { margin-top: 0px; } .txt-list-row5 .s1 { width: 20%; } .txt-list-row5 .s2, .txt-list-row5 .s3 { width: 40%; } .txt-list li:last-child { border-bottom: 0 none; } } /* 登陆 */ .grid { width: 90%; max-width: 580px; margin: 50px auto; border: 2px solid #C3DFEA; border-collapse: collapse; padding: 3px; font-size: 14px; } .grid caption { background-color: #E1ECED; border: solid 2px #C3DFEA; border-bottom: 0px; font-size: 14px; font-weight: bold; margin: auto; padding-bottom: 5px; padding-top: 5px; text-align: center; vertical-align: middle; } .grid td { background-color: #FFFFFF !important; border: 1px solid #C3DFEA; padding: 8px 10px; position: relative; } .grid .td-width { width: 22%; } .grid input, .grid .select { border: 1px solid #A6D3E8; font: 14px/32px arial; height: 32px; margin-right: 5px; padding: 0 10px; /* -webkit-appearance: none; */ border-radius: 4px; background: #fff; } .grid .text, .grid .select { width: 80%; } .grid input:focus, .grid .select:focus { border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); } .red { color: #f00; } /* 小于980适配 */ @media (max-width: 1024px) { .grid { margin: 0 10px; max-width: 100%; width: calc(100% - (20px)); } .grid .td-width { width: 32%; } .grid .text, .grid .select { width: 100%; } .grid .must { position: absolute; top: 15px; left: 3px; } } /* 排行榜 */ .row-rank .layout-col1, .row-detail .layout-col1, .row-section .layout-col1 { width: 253px; margin-right: 4px; margin-bottom: 10px; float: left; padding-bottom: 0; border: 2px solid #88C6E5; } .row-rank .mr0 { margin-right: 0; } .row-rank .layout-tit, .row-detail .layout-tit { border-bottom: 1px solid #88C6E5; } .tab-hd { float: right; } .tab-hd li { font-weight: normal; cursor: pointer; float: left; height: 31px; line-height: 31px; overflow: hidden; color: #999; padding: 0 8px; } .tab-hd .active { color: #333; border-bottom: 2px solid #88C6E5; } .row-rank .txt-list li { border-bottom: 0 none; } .row-rank .txt-list .s1 { max-width: 26px; font-style: italic; color: #999; font-family: "Verdana"; } .row-rank .txt-list .s2 { width: 142px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .row-rank .txt-list .s5 { width: 36px; font-family: "Verdana"; color: #999; text-align: right; } /* 小于980适配 */ @media (max-width: 1024px) { .row-rank .txt-list .s1 { width: 10%; } .row-rank .txt-list .s2 { width: 75%; } .row-rank .txt-list .s5 { width: 15%; } } /* 历史记录 */ .history-table { width: 100%; margin: 20px auto; border: 3px solid #A6D3E8; background: #FEF9EF; text-align: left; border-spacing: 0; } .history-table caption { margin: 0px; text-align: left; background-color: #A6D3E8; font-size: 14px; font-weight: bold; height: 30px; line-height: 30px; overflow: hidden; padding: 0 0 0 10px; } .history-table th { font-size: 14px; } .history-table th, .history-table td { padding: 10px; border-bottom: solid 1px #DDDDDD; } @media (max-width: 1024px) { .history-box { padding: 10px; } .history-table { margin: 0 auto; border-width: 1px; } .history-table th, .history-table td { padding: 8px; } } /* 详情页 */ .row-detail { margin-bottom: 0; } .row-detail .layout-col1, .row-section .layout-col1 { width: 100%; float: none; background: none; } .row-detail .layout-tit { font-size: 12px; font-weight: normal; } .detail-box .imgbox { background-color: #E1ECED; float: left; width: 150px; margin: 12px; padding: 12px; position: relative; } .detail-box .imgbox img { height: 150px; width: 120px; margin: 3px; } .detail-box .imgbox .flag { top: 8px; right: 8px; width: 88px; height: 88px; position: absolute; z-index: 999; background-position: 0 -294px; } .detail-box .imgbox .flag-over { background-position: 0 -206px; } .detail-box .info { float: left; width: 780px; font-size: 15px; overflow: hidden; } .detail-box .info .top { padding: 0px 10px; } .detail-box h1 { font-family: '黑体'; font-size: 28px; font-weight: 700; overflow: hidden; margin: auto; margin-top: 7px; } .detail-box .info p { height: 26px; line-height: 26px; width: 350px; margin: auto; float: left; overflow: hidden; } .detail-box .desc { overflow: hidden; line-height: 150%; border-top: 1px dashed #88C6E5; padding: 10px; font-size: 13px; line-height: 20px; } .row-section .layout-tit { text-align: center; font-weight: normal; border-bottom-color: #C3DFEA; background: #C3DFEA; } .section-list h3 { display: block; padding: 10px; font-size: 16px; font-weight: bold; } .section-list ul { overflow: hidden; } .section-list li { width: 33.33%; padding-left: 10px; height: 38px; line-height: 38px; border-bottom: 1px dashed #CCC; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; float: left; } .section-list li a { color: #444; } .section-list li a:hover { text-decoration: underline; } @media (max-width: 1024px) { .row-detail .layout-col1, .row-section .layout-col1 { margin-top: 0px; margin-bottom: 0; border: 0 none; } .detail-box { padding: 10px; position: relative; } .detail-box h1 { display: none; font-size: 14px; text-align: center; } .detail-box .imgbox { width: 100px; height: auto; margin: 0px auto 0; padding: 0; border: 1px solid #b4dae8; } .detail-box .imgbox img { width: 100%; height: 130px; margin: 0; } .detail-box .opt { position: absolute; top: 155px; left: 0; padding: 0 7px; display: flex; overflow: visible !important; } .detail-box .opt a { display: inline-block; flex: 1; margin: 0 3px; text-align: center; background-size: 20px; background: #f0962a; color: #fff; text-align: center; font-size: 16px; line-height: 26px; border-radius: 5px; box-shadow: 0 2px 1px #d88726 inset; } .detail-box .opt .btn-addbs { background: #f0962a; box-shadow: 0 2px 1px #d88726 inset; } .detail-box .opt .btn-read, .detail-box .opt .btn-txt{ background: #eb2650; box-shadow: 0 2px 1px #d32248 inset; } .detail-box .opt .btn-tobtm { background: #658fbd; box-shadow: 0 2px 1px #5b80aa inset; } .detail-box .opt .btn-and { background: #97C03D; box-shadow: 0 2px 1px #97C03D inset; } .detail-box .opt .btn-ios { background:#8c8989; box-shadow:0 2px 1px #8c8989 inset; } .detail-box .opt .btn-dl { position: absolute; top: -142px; right: 10px; background: #68aac2; box-shadow: none; width: 60px; height: 60px; border-radius: 50%; line-height: 60px; font-size: 13px; } .detail-box .info { float: none; width: auto; font-size: 14px; } .detail-box .info p { width: 100%; height: 27px; line-height: 27px; } .detail-box .desc { height: auto; } .detail-box .m-desc { display: block; margin-top: 46px; font-size: 13px; letter-spacing: 1px; line-height: 20px; } .section-list li { width: 50%; } } /* 阅读 */ .reader-fun { float: right; } .reader-fun .select { width: 60px; outline: 0 none; vertical-align: middle; margin: -3px 4px 0 0; } .reader-main { position: relative; } .reader-main .title { padding: 20px 20px 10px; font: 25px/35px '黑体'; text-align: center; } .reader-main .section-opt { text-align: center; font-size: 14px; padding: 15px 0; border-bottom: 1px dashed #88C6E5; } .reader-main .m-bottom-opt { border-top: 1px dashed #88C6E5; border-bottom: 0 none; margin-top: 10px; } .reader-main .section-opt a { margin: 0 10px; color: #085308; } .reader-main .content { font-size: 24px; line-height: 200%; padding-top: 15px; width: 85%; margin: auto; text-align: justify; } .m-setting { display: none; padding: 10px; font-size: 12px; overflow: hidden; background-color: #ececec; border-bottom: 1px solid #ddd; } .m-setting .font-box span { border: 1px solid #0065B5; float: left; padding: 2px 5px; margin-left: 5px; border-radius: 3px; color: #0065B5 } .m-setting .btn-setbg { float: right; border: 1px solid #0065B5; padding: 2px 5px; margin-left: 8px; border-radius: 5px; color: #0065B5 } .m-setting .btn-setbg.active, .m-setting .font-box .active { background: #a7a7a7; } #reader-m-fix .search-form { display: none; } #reader-m-fix .m-nav { margin-bottom: 0; } .fl, .row .fl { float: left; } .fr, .row .fr { float: right; } .btn-addbs { display: block; text-align: center; font-size: 18px; line-height: 35px; margin: 20px auto; color: #f00; } .posterror { text-align: center; font-size: 16px !important; line-height: 24px; margin-bottom: 20px; } @media (max-width: 1024px) { .m-setting { display: block; } .reader-main .title { padding: 50px 10px 10px; font: bold 20px/26px '黑体'; } .reader-main .section-opt { position: absolute; top: -11px; left: 0; width: 100%; border: 0 none; padding: 0; } .reader-main .section-opt a { float: left; width: 25%; margin: 0; padding: 8px; background-color: #f4f0e9; color: green; border: 1px solid #ece6da; } .reader-main .content { width: 100%; padding: 10px; font-size: 20px; } .row-reader .layout-col1 { border: 0 none; overflow: visible; } .reader-main .m-bottom-opt { display: block; position: relative; margin-top: 30px; } } /* 夜间模式 */ .nightmode { background: #32373b; } .nightmode .reader-main { color: #999; } .nightmode .section-opt a { background-color: #3e4245; color: #ccc; border: 1px solid #313538; } /* 护眼模式 */ .huyanmode { background: #dcecd2; } .huyanmode .reader-main { color: #3b3b3b; } .huyanmode .section-opt a { background-color: #cce2bf; color: green; border: 1px solid #bbd6aa; } /* 分页 */ .pagination { width: auto; overflow: hidden; font-size: 13px; margin: 20px 0; } .pagination-mga { display: table; margin: 23px auto 10px; } .pagination li { width: auto; border: 1px solid #ddd; border-left: none; background: #fdf9ef; float: left; } .pagination li:first-child { border-left: 1px solid #ddd; border-radius: 3px 0 0 3px; cursor: default; } .pagination li:last-child { border-radius: 0 3px 3px 0; } .pagination a, .pagination .hd { display: block; padding: 6px 12px; } .pagination .active a, .pagination a:hover { color: #fff; border-color: #A6D3E8; background: #A6D3E8; } .listpage{margin:10px;height:36px;line-height:36px;overflow:hidden} .listpage span{height:36px;line-height:36px;text-align:center} .listpage .left{float:left;width:25%} .listpage .left a,.listpage .right a{display:inline-block;height:36px;width:90%} .listpage .left a{float:left} .listpage .right a{float:right} .listpage .right{float:right;width:25%} .listpage .middle{width:49%;border:1px solid #dfdfdf;height:34px;display:block;float:left;border-radius:5px} .listpage .middle em{display:inline-block;width:80%;text-align:center;color:#999;font-style:normal;float:left;line-height:36px;height:30px} .listpage .middle a{display:inline-block;float:left;width:19%;height:36px;line-height:36px;vertical-align:middle} .listpage .middle select{border:none;color:#999;display:inline-block;float:left;font-style:normal;height:34px;line-height:34px;text-align:center;width:100%} .listpage .onclick{background:#4baacd;color:#FFF} .listpage .before{background:#cecece;color:#FFF}