body.stop-scrolling{height:100%;overflow:hidden}.sweet-overlay{background-color:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";background-color:rgba(0,0,0,.4);position:fixed;left:0;right:0;top:0;bottom:0;display:none;z-index:10000}.sweet-alert{background-color:#fff;font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;width:478px;padding:17px;border-radius:5px;text-align:center;position:fixed;left:50%;top:50%;margin-left:-256px;margin-top:-200px;overflow:hidden;display:none;z-index:99999}@media all and (max-width:540px){.sweet-alert{width:auto;margin-left:0;margin-right:0;left:15px;right:15px}}.sweet-alert h2{color:#575757;font-size:30px;text-align:center;font-weight:600;text-transform:none;position:relative;margin:25px 0;padding:0;line-height:40px;display:block}.sweet-alert p{color:#797979;font-size:16px;font-weight:300;position:relative;text-align:inherit;float:none;margin:0;padding:0;line-height:normal}.sweet-alert fieldset{border:none;position:relative}.sweet-alert .sa-error-container{background-color:#f1f1f1;margin-left:-17px;margin-right:-17px;overflow:hidden;padding:0 10px;max-height:0;webkit-transition:padding .15s,max-height .15s;transition:padding .15s,max-height .15s}.sweet-alert .sa-error-container.show{padding:10px 0;max-height:100px;webkit-transition:padding .2s,max-height .2s;transition:padding .25s,max-height .25s}.sweet-alert .sa-error-container .icon{display:inline-block;width:24px;height:24px;border-radius:50%;background-color:#ea7d7d;color:#fff;line-height:24px;text-align:center;margin-right:3px}.sweet-alert .sa-error-container p{display:inline-block}.sweet-alert .sa-input-error{position:absolute;top:29px;right:26px;width:20px;height:20px;opacity:0;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transition:all .1s;transition:all .1s}.sweet-alert .sa-input-error::after,.sweet-alert .sa-input-error::before{content:"";width:20px;height:6px;background-color:#f06e57;border-radius:3px;position:absolute;top:50%;margin-top:-4px;left:50%;margin-left:-9px}.sweet-alert .sa-input-error::before{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .sa-input-error::after{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.sweet-alert .sa-input-error.show{opacity:1;-webkit-transform:scale(1);transform:scale(1)}.sweet-alert input{width:100%;box-sizing:border-box;border-radius:3px;border:1px solid #d7d7d7;height:43px;margin-top:10px;margin-bottom:17px;font-size:18px;box-shadow:inset 0 1px 1px rgba(0,0,0,.06);padding:0 12px;display:none;-webkit-transition:all .3s;transition:all .3s}.sweet-alert input:focus{outline:0;box-shadow:0 0 3px #c4e6f5;border:1px solid #b4dbed}.sweet-alert.show-input input{display:block}.sweet-alert button{background-color:#AEDEF4;color:#fff;border:none;box-shadow:none;font-size:17px;font-weight:500;-webkit-border-radius:4px;border-radius:5px;padding:10px 32px;margin:26px 5px 0;cursor:pointer}.sweet-alert button:focus{outline:0;box-shadow:0 0 2px rgba(128,179,235,.5),inset 0 0 0 1px rgba(0,0,0,.05)}.sweet-alert button:hover{background-color:#a1d9f2}.sweet-alert button:active{background-color:#81ccee}.sweet-alert button.cancel{background-color:#D0D0D0}.sweet-alert button.cancel:hover{background-color:#c8c8c8}.sweet-alert button.cancel:active{background-color:#b6b6b6}.sweet-alert button.cancel:focus{box-shadow:rgba(197,205,211,.8) 0 0 2px,rgba(0,0,0,.0470588) 0 0 0 1px inset!important}.sweet-alert button::-moz-focus-inner{border:0}.sweet-alert[data-has-cancel-button=false] button{box-shadow:none!important}.sweet-alert[data-has-confirm-button=false][data-has-cancel-button=false]{padding-bottom:40px}.sweet-alert .sa-icon{width:80px;height:80px;border:4px solid gray;-webkit-border-radius:40px;border-radius:50%;margin:20px auto;padding:0;position:relative;box-sizing:content-box}.sweet-alert .sa-icon.sa-error{border-color:#F27474}.sweet-alert .sa-icon.sa-error .sa-x-mark{position:relative;display:block}.sweet-alert .sa-icon.sa-error .sa-line{position:absolute;height:5px;width:47px;background-color:#F27474;display:block;top:37px;border-radius:2px}.sweet-alert .sa-icon.sa-error .sa-line.sa-left{-webkit-transform:rotate(45deg);transform:rotate(45deg);left:17px}.sweet-alert .sa-icon.sa-error .sa-line.sa-right{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);right:16px}.sweet-alert .sa-icon.sa-warning{border-color:#F8BB86}.sweet-alert .sa-icon.sa-warning .sa-body{position:absolute;width:5px;height:47px;left:50%;top:10px;-webkit-border-radius:2px;border-radius:2px;margin-left:-2px;background-color:#F8BB86}.sweet-alert .sa-icon.sa-warning .sa-dot{position:absolute;width:7px;height:7px;-webkit-border-radius:50%;border-radius:50%;margin-left:-3px;left:50%;bottom:10px;background-color:#F8BB86}.sweet-alert .sa-icon.sa-info{border-color:#C9DAE1}.sweet-alert .sa-icon.sa-info::before{content:"";position:absolute;width:5px;height:29px;left:50%;bottom:17px;border-radius:2px;margin-left:-2px;background-color:#C9DAE1}.sweet-alert .sa-icon.sa-info::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;margin-left:-3px;top:19px;background-color:#C9DAE1}.sweet-alert .sa-icon.sa-success{border-color:#A5DC86}.sweet-alert .sa-icon.sa-success::after,.sweet-alert .sa-icon.sa-success::before{content:'';position:absolute;width:60px;height:120px;background:#fff;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.sweet-alert .sa-icon.sa-success::before{-webkit-border-radius:120px 0 0 120px;border-radius:120px 0 0 120px;top:-7px;left:-33px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:60px 60px;transform-origin:60px 60px}.sweet-alert .sa-icon.sa-success::after{-webkit-border-radius:0 120px 120px 0;border-radius:0 120px 120px 0;top:-11px;left:30px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:0 60px;transform-origin:0 60px}.sweet-alert .sa-icon.sa-success .sa-placeholder{width:80px;height:80px;border:4px solid rgba(165,220,134,.2);-webkit-border-radius:40px;border-radius:50%;box-sizing:content-box;position:absolute;left:-4px;top:-4px;z-index:2}.sweet-alert .sa-icon.sa-success .sa-fix{width:5px;height:90px;background-color:#fff;position:absolute;left:28px;top:8px;z-index:1;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .sa-icon.sa-success .sa-line{height:5px;background-color:#A5DC86;display:block;border-radius:2px;position:absolute;z-index:2}.sweet-alert .sa-icon.sa-success .sa-line.sa-tip{width:25px;left:14px;top:46px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.sweet-alert .sa-icon.sa-success .sa-line.sa-long{width:47px;right:8px;top:38px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .sa-icon.sa-custom{background-size:contain;border-radius:0;border:none;background-position:center center;background-repeat:no-repeat}@-webkit-keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-transform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-transform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@-webkit-keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}@keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}@-webkit-keyframes slideFromTop{0%{top:0}100%{top:50%}}@keyframes slideFromTop{0%{top:0}100%{top:50%}}@-webkit-keyframes slideToTop{0%{top:50%}100%{top:0}}@keyframes slideToTop{0%{top:50%}100%{top:0}}@-webkit-keyframes slideFromBottom{0%{top:70%}100%{top:50%}}@keyframes slideFromBottom{0%{top:70%}100%{top:50%}}@-webkit-keyframes slideToBottom{0%{top:50%}100%{top:70%}}@keyframes slideToBottom{0%{top:50%}100%{top:70%}}.showSweetAlert[data-animation=pop]{-webkit-animation:showSweetAlert .3s;animation:showSweetAlert .3s}.showSweetAlert[data-animation=none]{-webkit-animation:none;animation:none}.showSweetAlert[data-animation=slide-from-top]{-webkit-animation:slideFromTop .3s;animation:slideFromTop .3s}.showSweetAlert[data-animation=slide-from-bottom]{-webkit-animation:slideFromBottom .3s;animation:slideFromBottom .3s}.hideSweetAlert[data-animation=pop]{-webkit-animation:hideSweetAlert .2s;animation:hideSweetAlert .2s}.hideSweetAlert[data-animation=none]{-webkit-animation:none;animation:none}.hideSweetAlert[data-animation=slide-from-top]{-webkit-animation:slideToTop .4s;animation:slideToTop .4s}.hideSweetAlert[data-animation=slide-from-bottom]{-webkit-animation:slideToBottom .3s;animation:slideToBottom .3s}@-webkit-keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@-webkit-keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@-webkit-keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}@keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}.animateSuccessTip{-webkit-animation:animateSuccessTip .75s;animation:animateSuccessTip .75s}.animateSuccessLong{-webkit-animation:animateSuccessLong .75s;animation:animateSuccessLong .75s}.sa-icon.sa-success.animate::after{-webkit-animation:rotatePlaceholder 4.25s ease-in;animation:rotatePlaceholder 4.25s ease-in}@-webkit-keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0deg);-webkit-transform:rotateX(0deg);opacity:1}}@keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0deg);-webkit-transform:rotateX(0deg);opacity:1}}.animateErrorIcon{-webkit-animation:animateErrorIcon .5s;animation:animateErrorIcon .5s}@-webkit-keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}@keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}.animateXMark{-webkit-animation:animateXMark .5s;animation:animateXMark .5s}@-webkit-keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}@keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}.pulseWarning{-webkit-animation:pulseWarning .75s infinite alternate;animation:pulseWarning .75s infinite alternate}@-webkit-keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}@keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}.pulseWarningIns{-webkit-animation:pulseWarningIns .75s infinite alternate;animation:pulseWarningIns .75s infinite alternate}
@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;
}

.clearfix:after, .clearfix:before, 
.container:after, .container:before, 
.row:after, .row:before {
    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;
}

.z {
    float: left;
}

.y {
    float: right;
}

/* === 基础元素样式 === */
ol, ul {
    list-style: none;
}

h1 {
    font-size: 36px;
}

h2 {
    font-size: 32px;
}

h3 {
    font-size: 24px;
}

h4 {
    font-size: 18px;
}

h5 {
    font-size: 16px;
}

h6 {
    font-size: 14px;
}

div {
    cursor: default;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
}

a, button {
    color: #4a90e2;
    text-decoration: none;
    outline: 0;
    -webkit-tap-highlight-color: transparent;
    transition: all 0.3s ease;
}

a:hover {
    color: #E91E63;
}

button {
    border: 0;
}

button:hover, input.btn {
    cursor: pointer;
}

a:active, a:focus, a:hover {
    text-decoration: none;
}

.input-text {
    padding: 0 5px;
}

img {
    display: block;
    max-width: 100%;
}

/* === Body 样式 === */
body {
    background: linear-gradient(to bottom, #e9faff 0%, #d4f1ff 100%);
    color: #555;
    font-size: 13px;
    margin: 0 auto;
    width: 1024px;
    overflow-x: hidden;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}

/* === 顶部工具栏 === */
.detail-box .imgbox .flag, 
.topbar-addfavorite, 
.topbar-login .btn-submit, 
.topbar-sethome {
    background: url("all.gif") no-repeat scroll 0 0 transparent;
}

.topbar {
    background: linear-gradient(to bottom, #eef5f7 0%, #e1eced 100%);
    border-bottom: 1px solid #a6d3e8;
    color: #666;
    height: 32px;
    min-width: 950px;
    width: 100%;
    font-size: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.topbar-con {
    line-height: 32px;
    text-indent: 16px;
    vertical-align: middle;
    width: 1024px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
}

.topbar-sethome {
    background-position: 0 10px;
    float: left;
    margin-right: 20px;
}

.topbar a {
    color: #666;
    transition: color 0.3s ease;
}

.topbar a:hover {
    color: #4a90e2;
}

.topbar-addfavorite {
    background-position: 0 -12px;
    float: left;
}

.topbar-right {
    float: right;
    font-size: 13px;
}

.topbar-right a {
    margin: 0 8px;
    padding: 2px 10px;
    border-radius: 3px;
    transition: all 0.3s ease;
}

.topbar-right a:hover {
    background: rgba(74, 144, 226, 0.1);
}

.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: 70px;
    width: 1024px;
    margin: auto;
    position: relative;
    padding: 8px 0;
}

.header .logo a {
    font-family: 楷体_GB2312, STKaiti, serif;
    display: block;
    float: left;
    height: 60px;
    width: 250px;
    line-height: 60px;
    color: #2c7db5;
    font-size: 42px;
    font-weight: bold;
    text-shadow: 2px 2px 4px rgba(140, 137, 137, 0.3);
    transition: all 0.3s ease;
}

.header .logo a:hover {
    color: #1e5f94;
    text-shadow: 3px 3px 6px rgba(140, 137, 137, 0.5);
}

.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: 540px;
    margin: 18px auto auto 30px;
}

.search-form #searchType {
    height: 36px;
    line-height: 36px;
    box-sizing: border-box;
    border: 1px solid #88c6e5;
    color: #88c6e5;
    padding: 0 3px;
}

.search-form .input-key {
    border: 1px solid #b8d9e8;
    font: 14px/36px arial, sans-serif;
    height: 36px;
    width: 360px;
    padding: 0 12px;
    border-radius: 4px 0 0 4px;
    outline: none;
    transition: all 0.3s ease;
}

.search-form .input-key:focus {
    border-color: #4a90e2;
    box-shadow: 0 0 8px rgba(74, 144, 226, 0.2);
}

.search-form .btn-tosearch {
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    height: 36px;
    width: 100px;
    border: 0 none;
    border-radius: 0 4px 4px 0;
    transition: all 0.3s ease;
    font-weight: 600;
}

.search-form .btn-tosearch:hover {
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
}

/* === 主导航 === */
.nav {
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    height: 44px;
    overflow: hidden;
    width: 1024px;
    margin: 12px auto auto;
    padding: 0 10px;
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.2);
}

.nav li {
    float: left;
    line-height: 44px;
    position: relative;
}

.nav li a {
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    padding: 0 16px;
    display: block;
    transition: all 0.3s ease;
}

.nav li a:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

.nav li:first-child a {
    border-radius: 4px 0 0 4px;
}

/* === 移动端导航（隐藏） === */
.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: 0;
    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: #ffffff;
    border: 2px solid #d6e9f2;
    float: left;
    overflow: hidden;
    width: 100%;
    padding: 0;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.layout:hover, .layout2:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
}

.layout2 {
    border: 2px solid #b8d9e8;
    background: #f8fcff;
}

.row .layout-col1 {
    width: 29%;
    float: right;
}

.row .layout-col2 {
    width: 70%;
}

.row .layout-col3 {
    width: 100%;
}

/* === 封面卡片样式 === */
.layout-col2 .item {
    width: 50%;
    padding: 12px 0 12px 12px;
    float: left;
    transition: all 0.3s ease;
}

.layout-col2 .item:hover {
    background: rgba(74, 144, 226, 0.02);
}

.layout-col2 .item .image {
    width: 124px;
    max-height: 154px;
    overflow: hidden;
    float: left;
}

.layout-col2 .item .image img {
    background-color: #fff;
    border: 1px solid #e1e8ed;
    padding: 2px;
    width: 124px;
    height: 154px;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.layout-col2 .item .image img:hover {
    transform: scale(1.03);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.layout-col2 .item dl {
    float: right;
    width: 200px;
    padding: 0 12px;
}

.layout-col2 .item dl dt {
    border-bottom: 1px dotted #d6e9f2;
    font-size: 14px;
    font-weight: 700;
    height: 28px;
    line-height: 28px;
    overflow: hidden;
}

.layout-col2 .item dl dt a {
    transition: color 0.3s ease;
}

.layout-col2 .item dl dt span {
    color: #999;
    float: right;
    font-weight: 400;
    font-size: 12px;
}

.layout-col2 .item dl dd {
    line-height: 22px;
    overflow: hidden;
    text-indent: 2em;
    padding: 8px 0 0;
    color: #666;
}

/* === 三列封面卡片 === */
.layout-col3 .item {
    width: 33.33%;
    padding: 12px 0 12px 12px;
    float: left;
}

.layout-col3 .item:nth-child(n+4) {
    padding-top: 0;
}

.layout-col3 .item .image {
    width: 124px;
    max-height: 154px;
    overflow: hidden;
    float: left;
}

.layout-col3 .item .image img {
    background-color: #fff;
    border: 1px solid #e1e8ed;
    padding: 2px;
    width: 124px;
    height: 154px;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.layout-col3 .item .image img:hover {
    transform: scale(1.03);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.layout-col3 .item dl {
    float: right;
    width: 200px;
    padding: 0 12px;
}

.layout-col3 .item dl dt {
    border-bottom: 1px dotted #d6e9f2;
    font-size: 14px;
    font-weight: 700;
    height: 28px;
    line-height: 28px;
    overflow: hidden;
}

.layout-col3 .item dl dt span {
    color: #999;
    float: right;
    font-weight: 400;
    font-size: 12px;
}

.layout-col3 .item dl dd {
    line-height: 22px;
    overflow: hidden;
    text-indent: 2em;
    padding: 8px 0 0;
    color: #666;
}

/* === 标题栏样式 === */
.layout-tit {
    background: linear-gradient(to bottom, #f5f9fc 0%, #e8f2f7 100%);
    border-bottom: 1px solid #d6e9f2;
    font-size: 15px;
    font-weight: 700;
    height: 36px;
    line-height: 36px;
    overflow: hidden;
    margin: 0;
    padding: 0 12px;
    color: #2c7db5;
}

.layout2 .layout-tit {
    margin: 0;
    overflow: hidden;
    padding: 0 0 0 12px;
    background: linear-gradient(to bottom, #d6e9f2 0%, #c5dce8 100%);
    height: 36px;
    line-height: 36px;
    font-size: 15px;
    font-weight: 700;
    border-bottom: solid 1px #b8d9e8;
    color: #1e5f94;
}

/* === 列表样式 === */
.txt-list {
    padding: 6px 12px;
}

.txt-list li {
    border-bottom: 1px solid #f0f0f0;
    height: 34px;
    line-height: 34px;
    overflow: hidden;
    transition: all 0.2s ease;
}

.txt-list li:hover {
    background: rgba(74, 144, 226, 0.03);
    padding-left: 4px;
}

.txt-list li span {
    float: left;
}

.txt-list li a {
    color: #4a90e2;
    transition: color 0.3s ease;
}

.txt-list li a:hover {
    color: #E91E63;
}

.txt-list .s1 {
    width: 60px;
    color: #999;
    font-size: 12px;
}

.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: #999;
    width: 90px;
    text-align: right;
    font-size: 12px;
}

.txt-list-row5 .s5 {
    color: #999;
    font-size: 12px;
}

/* === 三栏排行榜 === */
.tp-box {
    width: 33.33%;
    float: left;
    border-right: solid 1px #e8f2f7;
}

.tp-box:last-child {
    border-right: none;
}

.tp-box h2 {
    background: linear-gradient(to bottom, #f8fafb 0%, #f0f5f8 100%);
    border-bottom: solid 1px #d6e9f2;
    font-size: 15px;
    font-weight: 700;
    padding-left: 12px;
    line-height: 32px;
    height: 32px;
    overflow: hidden;
    color: #2c7db5;
}

.tp-box .top {
    overflow: hidden;
    padding: 10px;
}

.tp-box .top .image {
    padding: 0;
    float: left;
}

.tp-box .top .image img {
    width: 72px;
    height: 86px;
    border: solid 1px #e1e8ed;
    padding: 2px;
    background-color: #fff;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.tp-box .top .image img:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.tp-box .top dl {
    padding: 0 0 0 10px;
    float: right;
    width: 240px;
}

.tp-box .top dl dt {
    height: 26px;
    line-height: 26px;
    overflow: hidden;
    font-weight: 700;
}

.tp-box .top dl dt a {
    color: #2c7db5;
}

.tp-box .top dl dd {
    line-height: 20px;
    height: 60px;
    overflow: hidden;
    color: #666;
}

.tp-box ul {
    padding: 10px 10px 0;
    overflow: hidden;
}

.tp-box ul li {
    border-bottom: solid 1px #f0f0f0;
    color: #999;
    height: 28px;
    line-height: 28px;
    font-size: 13px;
    overflow: hidden;
    float: left;
    width: 50%;
    transition: all 0.2s ease;
}

.tp-box ul li:hover {
    background: rgba(74, 144, 226, 0.03);
    padding-left: 2px;
}

.tp-box ul li a {
    font-size: 13px;
}

/* === 页脚样式 === */
.pc-footer {
    border-top: 2px solid #b8d9e8;
    text-align: center;
    width: 1024px;
    margin: 0 auto;
    line-height: 26px;
    padding: 20px 0;
    color: #666;
}

.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;
}

/* === 表格样式 === */
.grid {
    width: 90%;
    max-width: 580px;
    margin: 50px auto;
    border: 2px solid #d6e9f2;
    border-collapse: collapse;
    padding: 3px;
    font-size: 14px;
    border-radius: 6px;
}

.grid caption {
    background: linear-gradient(to bottom, #e8f2f7 0%, #d6e9f2 100%);
    border: solid 2px #d6e9f2;
    border-bottom: 0;
    font-size: 15px;
    font-weight: 700;
    margin: auto;
    padding-bottom: 8px;
    padding-top: 8px;
    text-align: center;
    vertical-align: middle;
    color: #2c7db5;
}

.grid td {
    background-color: #fff !important;
    border: 1px solid #e8f2f7;
    padding: 10px 12px;
    position: relative;
}

.grid .td-width {
    width: 22%;
}

.grid .select, .grid input {
    border: 1px solid #b8d9e8;
    font: 14px/32px arial;
    height: 36px;
    margin-right: 5px;
    padding: 0 12px;
    border-radius: 4px;
    background: #fff;
    transition: all 0.3s ease;
}

.grid .select, .grid .text {
    width: 80%;
}

.grid .select:focus, .grid input:focus {
    border-color: #4a90e2;
    outline: 0;
    box-shadow: 0 0 8px rgba(74, 144, 226, 0.2);
}

.red {
    color: #e74c3c;
}

/* === 详情页 / 排行榜 === */
.row-detail .layout-col1, 
.row-rank .layout-col1, 
.row-section .layout-col1 {
    width: 253px;
    margin-right: 4px;
    margin-bottom: 10px;
    float: left;
    padding-bottom: 0;
    border: 2px solid #b8d9e8;
}

.row-rank .mr0 {
    margin-right: 0;
}

.row-detail .layout-tit, 
.row-rank .layout-tit {
    border-bottom: 1px solid #b8d9e8;
}

.tab-hd {
    float: right;
}

.tab-hd li {
    font-weight: 400;
    cursor: pointer;
    float: left;
    height: 31px;
    line-height: 31px;
    overflow: hidden;
    color: #999;
    padding: 0 10px;
    transition: all 0.3s ease;
}

.tab-hd li:hover {
    color: #4a90e2;
}

.tab-hd .active {
    color: #2c7db5;
    border-bottom: 3px solid #4a90e2;
}

.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;
}

/* === 历史记录表格 === */
.history-table {
    width: 100%;
    margin: 20px auto;
    border: 3px solid #b8d9e8;
    background: #ffffff;
    text-align: left;
    border-spacing: 0;
    border-radius: 6px;
}

.history-table caption {
    margin: 0;
    text-align: left;
    background: linear-gradient(to bottom, #d6e9f2 0%, #b8d9e8 100%);
    font-size: 15px;
    font-weight: 700;
    height: 36px;
    line-height: 36px;
    overflow: hidden;
    padding: 0 0 0 12px;
    color: #1e5f94;
}

.history-table th {
    font-size: 14px;
}

.history-table td, 
.history-table th {
    padding: 12px;
    border-bottom: solid 1px #f0f0f0;
}

/* === 详情页样式 === */
.row-detail {
    margin-bottom: 0;
}

.row-detail .layout-col1, 
.row-section .layout-col1 {
    width: 100%;
    float: none;
    background: 0 0;
}

.row-detail .layout-tit {
    font-size: 13px;
    font-weight: 400;
}

.detail-box .imgbox {
    background-color: #f5f9fc;
    float: left;
    width: 150px;
    margin: 15px;
    padding: 12px;
    position: relative;
    border-radius: 6px;
}

.detail-box .imgbox img {
    height: 150px;
    width: 120px;
    margin: 3px;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.detail-box .imgbox img:hover {
    transform: scale(1.02);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.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: 0 12px;
}

.detail-box h1 {
    font-family: '黑体', 'Microsoft YaHei', sans-serif;
    font-size: 30px;
    font-weight: 700;
    overflow: hidden;
    margin: auto;
    margin-top: 10px;
    color: #2c7db5;
}

.detail-box .info p {
    height: 28px;
    line-height: 28px;
    width: 350px;
    margin: auto;
    float: left;
    overflow: hidden;
}

.detail-box .info .opt {
    width: auto;
}

.detail-box .info .opt a {
    display: inline-block;
    padding: 5px 15px;
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    color: #fff;
    border-radius: 4px;
    margin: 5px 3px;
    transition: all 0.3s ease;
    font-weight: 600;
}

.detail-box .info .opt a:hover {
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
    transform: translateY(-1px);
}

.detail-box .desc {
    overflow: hidden;
    line-height: 24px;
    border-top: 1px dashed #d6e9f2;
    padding: 12px;
    font-size: 14px;
    min-height: 90px;
    color: #666;
    background: #f8fcff;
}

/* === 章节列表 === */
.row-section .layout-tit {
    text-align: center;
    font-weight: 400;
    border-bottom-color: #d6e9f2;
    background: linear-gradient(to bottom, #e8f2f7 0%, #d6e9f2 100%);
}

.section-list h3 {
    display: block;
    padding: 12px;
    font-size: 16px;
    font-weight: 700;
    color: #2c7db5;
}

.section-list ul {
    overflow: hidden;
}

.section-list li {
    width: 25%;
    padding-left: 12px;
    height: 38px;
    line-height: 38px;
    border-bottom: 1px dashed #e8f2f7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    float: left;
    box-sizing: border-box;
    transition: all 0.2s ease;
}

.section-list li:hover {
    background: rgba(74, 144, 226, 0.03);
    padding-left: 16px;
}

.section-list li a {
    color: #4a90e2;
    transition: color 0.3s ease;
}

.section-list li a:visited {
    color: #b0b0b0;
}

.section-list li a:hover {
    color: #E91E63;
}

/* === 阅读器功能栏 === */
.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: 25px 20px 12px;
    font: 26px/38px '黑体', 'Microsoft YaHei', sans-serif;
    text-align: center;
    color: #2c7db5;
    font-weight: 600;
}

.reader-main .section-opt {
    text-align: center;
    font-size: 14px;
    padding: 18px 0;
    border-bottom: 1px dashed #d6e9f2;
}

.reader-main .m-bottom-opt {
    border-top: 1px dashed #d6e9f2;
    border-bottom: 0 none;
    margin-top: 15px;
}

.reader-main .section-opt a {
    margin: 0 12px;
    padding: 6px 16px;
    color: #fff;
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    border-radius: 4px;
    display: inline-block;
    transition: all 0.3s ease;
    font-weight: 600;
}

.reader-main .section-opt a:hover {
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
    transform: translateY(-1px);
}

.reader-main .content {
    font-size: 18px;
    line-height: 200%;
    padding-top: 20px;
    width: 85%;
    margin: auto;
    text-align: justify;
    color: #333;
}

.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: red;
}

.posterror {
    text-align: center;
    font-size: 16px !important;
    line-height: 24px;
    margin-bottom: 20px;
}

/* === 夜间模式 === */
.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: 14px;
    margin: 25px 0;
}

.pagination-mga {
    display: table;
    margin: 4px auto 10px;
}

.pagination li {
    width: auto;
    border: 1px solid #d6e9f2;
    border-left: none;
    background: #ffffff;
    float: left;
    transition: all 0.3s ease;
}

.pagination li:first-child {
    border-left: 1px solid #d6e9f2;
    border-radius: 4px 0 0 4px;
    cursor: default;
}

.pagination li:last-child {
    border-radius: 0 4px 4px 0;
}

.pagination .hd, .pagination a {
    display: inline;
    padding: 8px 14px;
}

.pagination .active a, .pagination a:hover {
    color: #fff;
    border-color: #4a90e2;
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
}

.listpage {
    margin: 12px;
    height: 40px;
    line-height: 40px;
    overflow: hidden;
}

.listpage span {
    height: 40px;
    line-height: 40px;
    text-align: center;
}

.listpage .left {
    float: left;
    width: 25%;
}

.listpage .left a, .listpage .right a {
    display: inline-block;
    height: 40px;
    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 #d6e9f2;
    height: 38px;
    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: 40px;
    height: 38px;
}

.listpage .middle a {
    display: inline-block;
    float: left;
    width: 19%;
    height: 40px;
    line-height: 40px;
    vertical-align: middle;
}

.listpage .middle select {
    border: none;
    color: #999;
    display: inline-block;
    float: left;
    font-style: normal;
    height: 38px;
    line-height: 38px;
    text-align: center;
    width: 100%;
}

.listpage .onclick {
    background: #4a90e2;
    color: #fff;
}

.listpage .before {
    background: #cecece;
    color: #fff;
}

.index-container {
    display: flex;
    justify-content: space-between;
    padding: 12px;
}

#indexselect {
    width: 49%;
    margin: 0 1rem;
    text-indent: 5px;
    border: none;
    border-bottom: 1px solid #4a90e2;
    background: #fff;
    outline: 0;
}

.index-container-btn {
    background: #4a90e2;
    color: #fff;
    border-radius: 4px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    display: block;
    width: 25%;
    transition: all 0.3s ease;
}

.index-container-btn:hover {
    background: #3a7bc8;
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
}

.MjYwMQ {
    position: relative;
    box-sizing: border-box;
    height: 3.76rem;
    padding: .76rem 6rem 0 4rem;
    margin: 0 0;
    border-top: #ddd 1px solid;
    border-bottom: #ddd 1px solid;
    background-color: #fff;
}

.MjYwMQ .icon-app-logo {
    position: absolute;
    top: .6rem;
    left: 1rem;
    font-size: 1.5rem;
    color: #fff;
    border-radius: .38rem;
    background-color: #68aac2;
    padding: 3px;
}

.MjYwMQ .btn-primary-small {
    position: absolute;
    top: 0;
    right: 1rem;
    bottom: 0;
    height: 1.6rem;
    margin: auto;
    font-size: .88rem;
    line-height: 1.6rem;
    padding-right: 2ch;
    padding-left: 2ch;
    text-align: center;
    color: #fff;
    border-radius: 1.6rem;
    background-color: #68aac2;
}

.icon-app-logo > svg {
    width: 32px;
    height: 32px;
    vertical-align: -.25ex;
    fill: currentColor;
}

.lnr {
    width: 24px;
    height: 24px;
    fill: currentColor;
}

.footer-app-h {
    font-size: .88rem;
}

.footer-app-p {
    font-size: .76rem;
    color: #969ba3;
}

.hotcmd-wp {
    padding: 20px 0;
    background: #fff;
    max-width: 1024px;
    margin: 0 auto;
}

.hotcmd-wp .cmd-hd {
    display: flex;
    color: #989898;
    justify-content: center;
    align-items: center;
}

.hotcmd-wp .cmd-hd i {
    width: 40px;
    height: 1px;
    background: #dadada;
}

.hotcmd-wp .cmd-hd span {
    font-size: 16px;
    margin: 0 15px;
}

.hotcmd-wp .cmd-bd {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 20px 10px 0;
}

.hotcmd-wp .cmd-bd .item {
    flex: 0 0 48%;
    padding: 8px 10px;
    border-radius: 5px;
    font-size: 14px;
    background-color: #f5f5f5;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 10px;
    color: #444;
    text-align: center;
}

.hotcmd-box {
    padding: 10px 10px 0 10px;
    font-size: 14px;
    line-height: 1.8;
}

.hotcmd-box a {
    display: inline-block;
}

/* === 章节预览 === */
.first_txt {
    font-size: 14px;
    box-sizing: border-box;
    padding: 20px;
}

.first_txt > p {
    text-indent: 2em;
    line-height: 26px;
    margin-bottom: 1em;
    color: #666;
}

.btn-mulu {
    padding: 10px;
    display: block;
    width: 160px;
    text-align: center;
    margin: 15px auto;
    border-radius: 5px;
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    color: #fff;
    font-size: 16px;
    transition: all 0.3s ease;
    font-weight: 600;
}

.btn-mulu:hover {
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
    transform: translateY(-1px);
}

.page_num {
    text-align: center;
    font-size: 14px;
    box-sizing: border-box;
    padding: 12px;
    width: 350px;
    margin: 0 auto;
}

.page_num select {
    padding: 0 12px;
    height: 36px;
    line-height: 36px;
    box-sizing: border-box;
    border: 1px solid #4a90e2;
    background: #fff;
    border-radius: 4px;
    margin: 0 10px;
    width: 140px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.page_num select:hover {
    border-color: #3a7bc8;
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.2);
}

.page_num a {
    height: 36px;
    line-height: 36px;
    padding: 0 18px;
    display: block;
    margin: 0;
    box-sizing: border-box;
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    color: #fff;
    border-radius: 4px;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page_num a:hover {
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
    transform: translateY(-1px);
}

.sort_page_num {
    text-align: center;
}

.sort_page_num > a {
    padding: 8px 14px;
    background: #f5f5f5;
    margin: 6px;
    color: #666;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.sort_page_num > a.prev_off {
    background: #eee;
    color: #ccc;
    cursor: not-allowed;
}

.sort_page_num > a:hover, 
.sort_page_num > a.page_on {
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    color: #fff;
}

/* === 阅读区域 === */
.word_read {
    box-sizing: border-box;
    padding: 25px;
    font-size: 16px;
    background: #ffffff;
}

.word_read > p {
    text-indent: 2em;
    padding-bottom: 1.8em;
    font-size: 18px;
    line-height: 1.8em;
    color: #333;
}

.word_read > h3 {
    text-align: center;
    color: #2c7db5;
    letter-spacing: 0.1em;
    margin-bottom: 20px;
}

.read_btn {
    box-sizing: border-box;
    padding: 15px;
    text-align: center;
}

.read_btn > a {
    padding: 8px 20px;
    cursor: pointer;
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    color: #fff;
    border-radius: 4px;
    margin: 0 6px;
    display: inline-block;
    transition: all 0.3s ease;
    font-weight: 600;
}

.read_btn > a:hover {
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
    transform: translateY(-1px);
}

/* === 弹窗样式 === */
.dvfd {
    background: #fff;
    width: 200px;
    height: 140px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -70px;
    margin-left: -100px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    text-align: center;
    border-radius: 8px;
    z-index: 99999;
    position: fixed;
}

.dvfd .red {
    display: block;
    margin: 35px 0 15px;
    font-size: 18px;
}

.dvfd .qdbtn {
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
    display: inline-block;
    padding: 8px 30px;
    color: #fff;
    border-radius: 4px;
    font-size: 16px;
    border: solid 1px #4a90e2;
    transition: all 0.3s ease;
}

.dvfd .qdbtn:hover {
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
    border: solid 1px #3a7bc8;
}

#qs_login a {
    padding: 0 5px;
    margin: 0 5px;
}

/* === 登录页样式 === */
.novel_login .login {
    line-height: 50px;
    background: #fff;
    overflow: hidden;
    padding: 15px;
    box-sizing: border-box;
    border: 1px solid #e8f2f7;
    margin: 50px auto;
    width: 380px;
    position: relative;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.novel_login .login h2 {
    font-size: 20px;
    text-align: center;
    height: 40px;
    line-height: 28px;
    border-bottom: 1px solid #e8f2f7;
    color: #2c7db5;
    letter-spacing: 0.5em;
    margin-bottom: 15px;
}

.novel_login .login a {
    height: 30px;
    line-height: 30px;
    color: #4a90e2;
    transition: color 0.3s ease;
}

.novel_login .login a:hover {
    color: #E91E63;
}

.novel_login .login i {
    position: absolute;
    left: 29%;
}

.novel_login .login input[type="text"], 
.login input[type="password"] {
    width: 240px;
    padding: 0;
    border: 1px solid #e8f2f7;
    outline: medium;
    height: 36px;
    line-height: 36px;
    padding-left: 12px;
    background: #f8fcff;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.novel_login .login input[type="text"]:focus, 
.login input[type="password"]:focus {
    border-color: #4a90e2;
    box-shadow: 0 0 8px rgba(74, 144, 226, 0.2);
}

.novel_login .login_name, 
.login_pass, 
.login_email, 
.login_code {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.novel_login .login .l1, 
.login .l2 {
    float: left;
}

.login_xs #logintips {
    text-align: center;
    color: #e74c3c;
}

.novel_login .login .l1 {
    width: 80px;
    text-align: right;
}

.novel_login .login .l2 {
    width: 100%;
    text-align: left;
    position: absolute;
    box-sizing: border-box;
    padding-left: 110px;
    right: 10px;
    overflow: hidden;
}

.novel_login .login_name input {
    -webkit-appearance: none;
}

.novel_login .login_pass input {
    -webkit-appearance: none;
}

.novel_login .login_code input {
    -webkit-appearance: none;
}

.novel_login .login_code2 {
    margin: 0;
    padding: 0 0 10px;
    text-align: center;
    border-bottom: 1px solid #e8f2f7;
}

.novel_login .login_code2 > img {
    display: block;
    margin: 20px auto 0;
    cursor: pointer;
    width: 150px;
    border-radius: 4px;
}

.novel_login .login_btn {
    text-align: center;
    margin: 0;
    overflow: hidden;
}

.novel_login .login_btn a {
    display: block;
    color: #4a90e2;
    border-radius: 4px;
    text-align: center;
    margin: 20px 60px;
    box-sizing: border-box;
    border: 1px solid #4a90e2;
    height: 40px;
    line-height: 40px;
    transition: all 0.3s ease;
}

.novel_login .login_btn a.ok {
    color: #fff;
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
}

.novel_login .login_btn a.ok:hover {
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
    border: 1px solid #3a7bc8;
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
}

.novel_login .login .login_save {
    width: 20px;
    height: 20px;
    padding: 5px;
}

.novel_login .login_code {
    margin-bottom: 0;
}

/* === 会员书架 === */
.novel_mybook .txt-list-row5 .s1 {
    width: 115px;
}

.novel_mybook .txt-list-row5 .s2 {
    width: 115px;
}

.novel_mybook .txt-list-row5 .s4 {
    width: 280px;
    text-align: left;
}

.novel_mybook .txt-list-row5 .s5 > a {
    display: inline-block;
    padding: 0 12px;
    margin: 0 6px;
    background: #4a90e2;
    height: 28px;
    line-height: 28px;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s ease;
}

.novel_mybook .txt-list-row5 .s5 > a.xsdel {
    background: #e74c3c;
}

.novel_mybook .txt-list-row5 .s5 > a:hover {
    background: #3a7bc8;
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
}

/* === 阅读记录 === */
.novel_tmpbook .txt-list-row5 .s1 {
    width: 258px;
}

.novel_tmpbook .txt-list-row5 .s2 {
    width: 150px;
}

.novel_tmpbook .txt-list-row5 .s3 {
    width: 280px;
    text-align: left;
}

.novel_tmpbook .txt-list-row5 .s5 {
    text-align: center;
    width: 280px;
}

.novel_tmpbook .txt-list-row5 .s5 > a {
    display: inline-block;
    padding: 0 12px;
    margin: 0 6px;
    background: #4a90e2;
    height: 28px;
    line-height: 28px;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s ease;
}

.novel_tmpbook .txt-list-row5 .s5 > a.xsdel {
    background: #e74c3c;
}

.novel_tmpbook .txt-list-row5 .s5 > a.a3 {
    background: #27ae60;
}

.novel_tmpbook .txt-list-row5 .s5 > a:hover {
    background: #3a7bc8;
    box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
}

.tag_news {
    height: 70px;
}

.tag_news > a {
    padding: 0 5px;
}

/* === 分类导航 === */
.sort_nav {
    padding: 15px;
    background: #f8fcff;
    border: 2px solid #d6e9f2;
    border-radius: 6px;
    margin-bottom: 15px;
}

.sort_nav > p {
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    border-bottom: 1px dashed #e8f2f7;
    padding: 0 5px;
    color: #2c7db5;
}

.sort_nav > p > a {
    padding: 6px 14px;
    color: #666;
    border-radius: 4px;
    margin: 0 4px;
    display: inline-block;
    transition: all 0.3s ease;
}

.sort_nav > p > a.on {
    color: #fff;
    background: linear-gradient(to bottom, #5ba3d0 0%, #4a90e2 100%);
}

.sort_nav > p > a:hover {
    background: rgba(74, 144, 226, 0.1);
    color: #4a90e2;
}

.sort_nav > p > a.on:hover {
    color: #fff;
    background: linear-gradient(to bottom, #4a90e2 0%, #3a7bc8 100%);
}
