@charset "utf-8";
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 1200;
    padding: 8px 12px;
    border-radius: 0 0 6px 0;
    background: #2a6f4e;
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
}

.skip-link:focus,
.skip-link:focus-visible {
    left: 0;
    color: #fff;
}

body.user-page a:focus-visible,
body.user-page input:focus-visible,
body.user-page textarea:focus-visible,
body.user-page button:focus-visible,
body.user-page label[role="button"]:focus-visible {
    outline: 2px solid #3eaf7c;
    outline-offset: 2px;
}

body.user-page .btn_red,
body.user-page .btn_ora_white,
body.user-page input[type="button"],
body.user-page input[type="submit"],
body.user-page label[role="button"] {
    touch-action: manipulation;
}

.pwd_field {
    position: relative;
    display: block;
    width: 100%;
    vertical-align: middle;
}

.user_l .pwd_field {
    width: 348px;
    margin-bottom: 25px;
}

.mytab_list .pwd_field {
    width: 318px;
}

.pwd_field .s_input {
    width: 100% !important;
    box-sizing: border-box;
    display: block;
    margin-bottom: 0 !important;
}

.pwd_field .has-pwd-toggle {
    padding-right: 48px;
}

/* Hide browser-native password reveal controls to avoid duplicate eye icons. */
.pwd_field input[type="password"]::-ms-reveal,
.pwd_field input[type="password"]::-ms-clear {
    display: none;
}

.pwd_field input[type="password"]::-webkit-credentials-auto-fill-button {
    visibility: hidden;
    display: none !important;
    pointer-events: none;
}

.pwd_field .pwd_toggle {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    min-width: 30px;
    height: 30px;
    line-height: 1;
    border: 1px solid transparent;
    border-radius: 50%;
    background: transparent;
    color: #7b8f84;
    font-size: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;
    -webkit-appearance: none;
    appearance: none;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.pwd_field .pwd_toggle .pwd_toggle_icon {
    position: relative;
    display: block;
    width: 18px;
    height: 12px;
    border: 2px solid currentColor;
    border-radius: 12px / 8px;
    box-sizing: border-box;
}

.pwd_field .pwd_toggle .pwd_toggle_icon::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 4px;
    height: 4px;
    background: currentColor;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.pwd_field .pwd_toggle .pwd_toggle_icon::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 20px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transform: translate(-50%, -50%) rotate(-32deg);
    opacity: 1;
    transition: opacity .2s ease;
}

.pwd_field .pwd_toggle.is-visible .pwd_toggle_icon::after {
    opacity: 0;
}

.pwd_field .pwd_toggle:hover {
    border-color: #c6d5ce;
    background: #f3faf6;
    color: #2f7d57;
}

.pwd_field .pwd_toggle:active {
    background: #eaf5ef;
}

body.site-dark .pwd_field .pwd_toggle {
    color: #9db0c4;
}

body.site-dark .pwd_field .pwd_toggle:hover {
    border-color: #41586d;
    background: #1f2c38;
    color: #dde8f6;
}

body.site-dark .pwd_field .pwd_toggle:active {
    background: #263847;
}

@media (prefers-reduced-motion: reduce) {
    body.user-page *,
    body.user-page *::before,
    body.user-page *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

.userBox .updateTable .style a { color:#999 }
.userBox .updateTable .author a { color:#999; cursor:text }
.bind, .userBox .updateTable .style a:hover { color:#3eaf7c }
.userBox { /*width: 998px; border: 1px solid #eaeaea;*/ margin:0 auto 50px; background: #fff; border-radius: 6px }
.channelViewhistory .userBox { margin: 0 auto }
.user_l { width:350px; float:left; padding:100px 124px }
.user_l h3 { font-size:23px; font-weight:normal; line-height:1; text-align: center }
.user_l #LabErr { color:#ff4040; display:block; height:40px; line-height:40px; text-align: center; font-size: 14px }
.user_l .log_list { width:350px }
.user_l .s_input { margin-bottom:25px; font-size:14px }
.s_input { width:348px; height:38px; line-height:38px\9; vertical-align:middle; border:1px solid #ddd; border-radius:2px }
.icon_name, .icon_key, .icon_code { width:312px; padding-left:36px; background:url(/images/icon_user.png) no-repeat 13px 13px }
.icon_key { background-position: 13px -51px }
.icon_code { background-position: 13px -117px; width:200px; float:left }
.code_pic { height:38px; float:right }
.btn_phone  { height:40px; width:100px; float:right; cursor:pointer; padding:0; text-align:center; border-radius:2px; background:#dfdfdf }
.log_code { *padding-bottom:25px }
.user_l .btn_red { width:100%; font-size:19px; padding:12px }
.user-auth-page .user_l .btn_red,
.user-auth-page .user_r .btn_ora_white {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 44px;
    min-height: 44px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 42px;
}

.user-auth-page .user_l .btn_red {
    display: flex;
    padding-left: 0;
    padding-right: 0;
}
.autologin { color:#999; line-height:1; margin-bottom:18px }
.autologin em { vertical-align:2px; margin-left:4px }
.user_r { width:259px; margin:80px 0; padding:20px 70px; border-left:1px dotted #e3e3e3; float:right; text-align:center }
.user_r .tit { font-size:16px; line-height:1; padding: 6px 0 25px }
.user_r .btn_ora { padding:10px 34px }
/*userinfo*/
.my_l { width:198px; float:left; font-size: 13px; padding-top: 20px; }
.my_l li a { display:block; height:42px; line-height:42px; padding-left:62px; border-left:3px solid transparent; background:url(/images/icon_user.png) no-repeat; margin-bottom:5px; color: #666; border-radius: 12px; transition: background-color .2s ease, color .2s ease, border-color .2s ease }
.my_l li a:hover { background-color:#f7faf8; color:#2c3b35 }
.my_l li .on { background-color:#f2fbf6; border-left-color:#3eaf7c; color:#1f6f4d; border-radius: 12px }
.my_l .link_1 { background-position:32px -188px }
.my_l .link_2 { background-position:32px -230px }
.my_l .link_3 { background-position:32px -272px }
.my_l .link_4 { background-position:32px -314px }
.my_l .link_5 { background-position:32px -356px }
.my_l .link_6 { background-position:32px -397px }
.my_l .link_7 { background-position:32px -440px }
.my_l .link_8 { background-position:32px -481px }
body.site-dark .my_l li a {
    color: #93a4b6;
    border-left-color: transparent;
}
body.site-dark .my_l li a:hover {
    background: #16212b;
    color: #d4deea;
}
body.site-dark .my_l li .on {
    background: #1a2f2a;
    border-left-color: #58c297;
    color: #84deba;
}
.my_r { width:739px; padding:0 30px 30px; float:right; border-left:1px solid #efefef; min-height:470px }
.my_info { padding:30px 0 5px }
.user_big_head { /*width:110px; height:110px; padding:4px; border:1px solid #eaeaea;*/ margin-right:30px; float:left;     width: 80px;
    height: 80px;
    border-radius: 50%; }
.my_r .my_name { font-size:18px; line-height:1; padding:5px 0 12px 0 }
.my_r .s_input { width:318px; padding:0 10px }
.my_list li { line-height:28px }
.my_list li i, .my_list li em.red { margin-right:6px }
.my_list .binded { color:#999; margin-left:6px }
.my_list .btn_link { margin-left:12px }
.mytab_list li { line-height:30px; padding:10px 0; font-size:14px }
.mytab_list li .tit { width:70px; color: #aaa; text-align:right; display:inline-block; margin-right:18px }
.mytab_list .user_img { width:48px; height:48px; vertical-align:middle; border-radius:50% }
.my_bookshelf .title { padding:20px 0 15px; line-height:30px }
.my_bookshelf h4 { font-size:14px; color:#666 }
.my_bookshelf h2 { font-size:18px; font-weight:normal }
.userBox .updateTable { width: 739px; color: #999 }
.userBox .updateTable table { width: 100%; margin-bottom:14px }
.userBox .updateTable th, .userBox .updateTable td { height: 40px; line-height: 40px; vertical-align: middle; padding-left: 6px; font-weight:normal; text-align:left }
.userBox .updateTable th { background:#f9f9f9; color:#333; border-top:1px solid #eee }
.userBox .updateTable td { height:40px; line-height:40px }
.userBox .updateTable .style { width:80px; padding-left:10px }
.userBox .updateTable .name { width: 178px; padding-right: 10px }
.userBox .updateTable .name a, .userBox .updateTable .chapter a { max-width: 168px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.userBox .updateTable .chapter { padding-right: 5px }
.userBox .updateTable .chapter a { max-width:220px; float: left }
.userBox .updateTable .author { width: 72px; text-align: left }
.userBox .updateTable .goread { width: 80px; text-align:center }
.userBox .updateTable .time { width: 86px }
.userBox .updateTable .word { width: 64px; padding-right:10px; text-align: right }
.userBox .updateTable .rank { width: 30px; padding-right:10px; text-align: center }
.userBox .updateTable .name a, .userBox .updateTable .chapter a, .userBox .updateTable .author a { height: 40px; line-height: 40px; display: inline-block; overflow: hidden }
.userBox .updateTable tr:nth-child(2n) td { background:#fafafa }
.userBox .dataTable { width: 739px }
.userBox .dataTable table { width: 100%; margin-bottom:14px; border-collapse:collapse }
.userBox .dataTable th, .userBox .dataTable td { height: 40px; line-height: 40px; vertical-align: middle; padding:0 10px; font-weight:normal; text-align:center; border:1px solid #eaeaea }
.userBox .dataTable th { background:#f8f8f8 }
.nodate { border-top: 1px solid #eaeaea; padding:60px 0 }
.viewhistoryBox { /*padding: 0 30px 30px; */ padding: 0 20px 10px }
.viewhistoryBox .updateTable { width:100% }
/*.btn_gray, .btn_red, .btn_ora { font-size:14px; padding:8px 28px }*/
.userBox .book_tit { height: 48px; line-height:48px; margin: 0 14px; border-bottom: 1px solid #eaeaea; overflow:hidden }
.userBox .book_tit .fl { font-size:14px; color:#999 }
.userBox .book_tit .fl h3 { font-size:18px; color:#333; font-weight:normal; margin-right:5px; display:inline }
.userBox .book_tit .fr { font-size:14px }

.userBox .commentBar, .userBox .feedback_list { border-top:1px solid #eee; margin-bottom:15px }
/*.comment_list { padding: 16px 0; border-bottom: 1px solid #eee }
.comment_list .user_head { width:54px; height:54px; border-radius:50%; float: left; margin-right: 14px }
.comment_list .li_1 { overflow: hidden }
.comment_list .user_name { color: #ed4259 }
.comment_list .li_2 { padding:3px 0; color:#999 }
.comment_list .li_3, .comment_list .li_4 { margin-left:68px }
.comment_list .reply { padding-left: 12px }
.comment_list .num { color: #ed4259; margin: 0 3px }
.comment_list .li_4 { line-height:34px; padding-top:8px; margin-top:15px; border-top:1px solid #eaeaea }
.comment_list .li_4 .more { background:#f7f7f7; border-radius:2px; color:#ed4259; text-align:center }*/
.no_contet { padding:190px 0 40px; text-align:center; color:#999; border-top:1px solid #eee }
.no_comment { background:url(/images/no_comment.png) no-repeat center 80px }

.userBox .comment_list { padding: 20px 0; border-bottom: 1px solid #eee }
.userBox .comment_list:last-child { border: none }
.userBox .comment_list .user_heads { /*width: 54px; height: 54px; float: left;*/ position:relative; margin-right: 20px }
.userBox .comment_list .user_head { width: 50px; height: 50px; border-radius: 50%; background: #f6f6f6 }
.userBox .comment_list .user_heads span { display: block; margin: 0; position: absolute; left: 12px; bottom: 0 }
.userBox .comment_list ul { /*width: 640px;*/ width: 660px; }
.userBox .comment_list .li_0 { font-family: "宋体" }
.userBox .comment_list .li_0 strong { font-size: 14px; color: #f00 }
.userBox .comment_list .li_1 { overflow: hidden }
.userBox .comment_list .user_name { color: #ed4259 }
.userBox .comment_list .li_2 { padding: 6px 0 }
.userBox .comment_list .li_3 { color: #999 }
.userBox .comment_list .reply { padding-left: 12px }
.userBox .comment_list .num { color: #ed4259; margin: 0 3px }
.userBox .comment_list .li_4 { line-height: 34px; padding-top: 8px; margin-top: 15px; border-top: 1px solid #eaeaea }
.userBox .commentBar .comment_list ul,
.userBox .feedback_list .comment_list ul {
    width: auto;
    overflow: visible;
}
.userBox .comment_list .li_1 {
    line-height: 24px;
    margin-bottom: 4px;
}
.userBox .comment_list .li_1 .time {
    color: #999;
    margin-left: 10px;
    font-size: 13px;
}
.userBox .comment_list .book-name {
    color: #1f2f2a;
    font-size: 15px;
    font-weight: 600;
    max-width: 70%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.userBox .comment_list .book-name:hover {
    color: #3eaf7c;
}
.userBox .comment_list .comment-actions a {
    margin-left: 12px;
    color: #666;
}
.userBox .comment_list .comment-actions a:hover {
    color: #3eaf7c;
}
body.user-comment-page .userBox .commentBar,
body.user-feedback-page .userBox .feedback_list {
    border-top: none;
    margin: 0;
}
body.user-comment-page .userBox .commentBar .comment_list,
body.user-feedback-page .userBox .feedback_list .comment_list {
    border: 1px solid #dde8e2;
    border-radius: 10px;
    background: #fff;
    padding: 12px 14px;
    margin: 0 0 10px;
}
body.user-comment-page .userBox .commentBar .comment_list:last-child,
body.user-feedback-page .userBox .feedback_list .comment_list:last-child {
    border: 1px solid #dde8e2;
}
body.user-comment-page .userBox .comment_list.is-empty,
body.user-feedback-page .userBox .feedback_list .comment_list.is-empty {
    border-style: dashed;
    text-align: center;
    padding: 14px;
}
body.user-comment-page .userBox .comment-content-empty,
body.user-feedback-page .userBox .comment-content-empty {
    color: #8c978f;
    line-height: 1.7;
}
body.user-comment-page .userBox .comment_list .comment-main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
body.user-comment-page .userBox .comment_list .user_heads {
    margin-right: 0;
    flex: 0 0 auto;
}
body.user-comment-page .userBox .comment_list .user_head {
    width: 44px;
    height: 44px;
}
body.user-comment-page .userBox .comment_list .comment-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
body.user-comment-page .userBox .comment_list .comment-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
body.user-comment-page .userBox .comment_list .book-name {
    flex: 1;
    min-width: 0;
    max-width: none;
    font-size: 16px;
    line-height: 1.35;
}
body.user-comment-page .userBox .comment_list .comment-summary {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}
body.user-comment-page .userBox .comment_list .dec {
    flex: 1;
    min-width: 0;
    color: #24332f;
    line-height: 1.45;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}
body.user-comment-page .userBox .comment_list .dec.is-expanded {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    word-break: break-word;
}
body.user-comment-page .userBox .comment_list .comment-actions {
    margin-top: 0;
    line-height: 1.2;
    white-space: nowrap;
    flex: 0 0 auto;
}
body.user-comment-page .userBox .comment_list .comment-actions a {
    margin-left: 0;
    margin-right: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid #d4e1db;
    border-radius: 14px;
    background: #fff;
    color: #5b6b63;
    font-size: 12px;
    line-height: 1;
    box-sizing: border-box;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
body.user-comment-page .userBox .comment_list .comment-actions a:hover {
    border-color: #3eaf7c;
    color: #2b7f57;
    background: #f3faf7;
}
body.user-comment-page .userBox .comment_list .comment-actions a:last-child {
    margin-right: 0;
}
body.user-comment-page .userBox .comment_list .time,
body.user-feedback-page .userBox .comment_list .time {
    color: #93a096;
    font-size: 12px;
    line-height: 1.5;
    white-space: nowrap;
}
body.user-feedback-page .feedback-table {
    border: 1px solid #dde8e2;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}
body.user-feedback-page .feedback-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 148px 56px;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-top: 1px solid #edf3ef;
}
body.user-feedback-page .feedback-row:first-child {
    border-top: none;
}
body.user-feedback-page .feedback-head {
    background: #f5faf7;
    color: #5f7068;
    font-weight: 600;
}
body.user-feedback-page .feedback-col {
    min-width: 0;
}
body.user-feedback-page .feedback-content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #24332f;
}
body.user-feedback-page .feedback-time {
    color: #93a096;
    font-size: 12px;
}
body.user-feedback-page .feedback-action {
    text-align: right;
    white-space: nowrap;
}
body.user-feedback-page .feedback-create-btn {
    min-height: 34px;
    padding: 0 16px;
    line-height: 34px;
    border-radius: 17px;
    font-size: 14px;
    box-sizing: border-box;
}
body.user-feedback-page .feedback-action a {
    color: #61716a;
}
body.user-feedback-page .feedback-action a:hover {
    color: #3eaf7c;
}
body.user-feedback-page .feedback-action .feedback-action-btn {
    display: inline-block;
    min-height: 28px;
    padding: 0 10px;
    line-height: 26px;
    border: 1px solid #d4e1db;
    border-radius: 14px;
    background: #fff;
    color: #5b6b63;
    font-size: 12px;
    box-sizing: border-box;
}
body.user-feedback-page .feedback-action .feedback-action-btn:hover {
    border-color: #3eaf7c;
    color: #2b7f57;
    background: #f3faf7;
}
body.user-page .feedbackBox .reg_list {
    width: 100%;
}
body.user-page .feedbackBox .reg_list li {
    width: 100%;
}
body.user-page .feedbackBox .textarea {
    width: 100%;
    min-height: 180px;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid #dde8e2;
    border-radius: 10px;
    line-height: 1.7;
    font-size: 14px;
}
body.user-page .feedback-form-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}
body.user-page .feedback-form-actions .feedback-submit-btn,
body.user-page .feedback-form-actions .feedback-cancel-btn {
    min-height: 38px;
    line-height: 36px;
    border-radius: 19px;
    padding: 0 22px;
    font-size: 14px;
    box-sizing: border-box;
}
body.user-page .feedback-form-actions .feedback-submit-btn {
    border-width: 1px;
    min-width: 120px;
}
body.user-page .feedback-form-actions .feedback-cancel-btn {
    min-width: 96px;
    text-align: center;
}
body.user-feedback-page .feedback-empty {
    display: block;
    padding: 14px 12px;
}
body.user-feedback-page .feedback-empty-text {
    color: #8c978f;
    line-height: 1.7;
}
body.site-dark.user-comment-page .userBox .commentBar .comment_list,
body.site-dark.user-feedback-page .userBox .feedback_list .comment_list {
    background: #111821 !important;
    border-color: #2b3845 !important;
}
body.site-dark.user-comment-page .userBox .comment_list .book-name {
    color: #e4edf6;
}
body.site-dark.user-comment-page .userBox .comment_list .dec,
body.site-dark.user-feedback-page .userBox .comment_list .dec,
body.site-dark.user-feedback-page .feedback-content {
    color: #d5dde7;
}
body.site-dark.user-comment-page .userBox .comment_list .time,
body.site-dark.user-feedback-page .userBox .comment_list .time {
    color: #95a3b4;
}
body.site-dark.user-comment-page .userBox .comment_list .comment-actions a,
body.site-dark.user-feedback-page .userBox .comment_list .comment-actions a,
body.site-dark.user-feedback-page .feedback-action a {
    color: #a5b2c2;
}
body.site-dark.user-comment-page .userBox .comment_list .comment-actions a:hover,
body.site-dark.user-feedback-page .userBox .comment_list .comment-actions a:hover,
body.site-dark.user-feedback-page .feedback-action a:hover {
    color: #73dca8;
}
body.site-dark.user-comment-page .userBox .comment-content-empty,
body.site-dark.user-feedback-page .userBox .comment-content-empty,
body.site-dark.user-feedback-page .feedback-empty-text {
    color: #a1adbd;
}
body.site-dark.user-feedback-page .feedback-table {
    background: #111821 !important;
    border-color: #2b3845 !important;
}
body.site-dark.user-feedback-page .feedback-row {
    border-top-color: #273544;
}
body.site-dark.user-feedback-page .feedback-head {
    background: #17212b;
    color: #aebac9;
}
body.site-dark.user-feedback-page .feedback-action .feedback-action-btn {
    border-color: #324454;
    background: #17212b;
    color: #b8c7d8;
}
body.site-dark.user-comment-page .userBox .comment_list .comment-actions a {
    border-color: #324454;
    background: #17212b;
    color: #b8c7d8;
}
body.site-dark.user-comment-page .userBox .comment_list .comment-actions a:hover {
    border-color: #4a657c;
    background: #1e2c39;
    color: #e0eaf5;
}
body.site-dark.user-feedback-page .feedback-action .feedback-action-btn:hover {
    border-color: #4a657c;
    background: #1e2c39;
    color: #e0eaf5;
}
body.site-dark.user-page .feedbackBox .textarea {
    border-color: #2c3a47;
    background: #111821;
    color: #d7e1ec;
}
body.user-home-page .my_info {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px;
    margin: 12px 0 20px;
    border: 1px solid #e6f0eb;
    border-radius: 14px;
    background: linear-gradient(140deg, #f6fbf8 0%, #ffffff 68%);
}
body.user-home-page .user_big_head {
    width: 84px;
    height: 84px;
    margin-right: 0;
    float: none;
    flex: 0 0 auto;
    box-shadow: 0 3px 10px rgba(62, 175, 124, 0.14);
}
body.user-home-page .my_info_txt {
    flex: 1;
    overflow: hidden;
}
body.user-home-page .my_r .my_name {
    font-size: 24px;
    color: #1e2f29;
    padding: 0 0 8px;
}
body.user-home-page .my_list li {
    line-height: 32px;
    font-size: 14px;
}
body.user-home-page .my_bookshelf .title {
    padding: 6px 0 14px;
    margin-bottom: 8px;
    border-bottom: 1px solid #edf3f0;
}
body.user-home-page .my_bookshelf .title h4 {
    font-size: 20px;
    color: #253430;
}
body.user-home-page .my_bookshelf .title .fr {
    color: #3eaf7c;
}
body.site-dark.user-home-page .my_info {
    background: #111821 !important;
    border-color: #2b3845 !important;
    box-shadow: none;
}
body.site-dark.user-home-page .my_r .my_name {
    color: #e4edf6;
}
body.site-dark.user-home-page .my_list li,
body.site-dark.user-home-page .my_list li .black9,
body.site-dark.user-home-page .my_list li .gray9 {
    color: #b8c6d6;
}
body.site-dark.user-home-page .my_bookshelf .title {
    border-bottom-color: #2a3745;
}
body.site-dark.user-home-page .my_bookshelf .title h4 {
    color: #d8e3ef;
}
.pl_bar li { display: block }
.pl_bar .name { color: #666; padding-top: 2px; font-size: 14px }
.pl_bar .dec { font-size: 14px; line-height: 1.8; padding: 12px 0; word-break: break-word }
.pl_bar .other { line-height: 24px; color: #999; font-size: 13px }
.pl_bar .other a { display: inline-block; color: #999 }
.pl_bar .reply { padding-left: 22px; background: url(/images/icon_reply.png) no-repeat 0 2px }
/*.no_comment { padding: 70px 14px 115px; color: #CCCCCC; text-align: center; font-size: 14px; }*/
.reply_bar {
    background: #f9f9f9;
    border: 1px solid #eee; border-radius: 6px;
    padding: 10px;
    line-height: 1.8;}

@media (max-width: 768px) {
    body.user-page .btn_red,
    body.user-page .btn_ora_white,
    body.user-page input[type="button"],
    body.user-page input[type="submit"] {
        min-height: 44px;
    }

    .skip-link {
        font-size: 12px;
        padding: 7px 10px;
    }

    .user_l .pwd_field {
        width: 100%;
    }

    .mytab_list li .pwd_field {
        width: calc(100% - 84px);
        max-width: calc(100% - 84px);
        box-sizing: border-box;
    }
}

@media (max-width: 768px) {
    .userBox {
        border-radius: 0;
        margin-bottom: 20px;
    }

    .user_l,
    .user_r,
    .my_l,
    .my_r {
        width: 100%;
        float: none;
        box-sizing: border-box;
    }

    .user_l {
        padding: 20px 14px;
    }

    .user_l .log_list,
    .s_input {
        width: 100%;
    }

    .icon_name,
    .icon_key {
        width: 100%;
        box-sizing: border-box;
    }

    .icon_code {
        width: 58%;
        box-sizing: border-box;
    }

    .code_pic {
        max-width: 40%;
        height: 38px;
    }

    .user_r {
        margin: 0;
        padding: 20px 14px;
        border-left: none;
        border-top: 1px dotted #e3e3e3;
    }

    .my_l {
        padding-top: 10px;
    }

    .my_l li a {
        padding-left: 44px;
    }

    .my_r {
        padding: 0 12px 20px;
        border-left: none;
        min-height: 0;
    }

    .userBox .updateTable,
    .userBox .dataTable {
        width: 100%;
        overflow-x: auto;
    }

    .userBox .updateTable table,
    .userBox .dataTable table {
        min-width: 640px;
    }

    .userBox .comment_list ul {
        width: auto;
        overflow: hidden;
    }
}

@media (max-width: 768px) {
    .my_l li a {
        height: 38px;
        line-height: 38px;
        padding-left: 16px;
        background: none;
        border-left: 0;
        margin-bottom: 2px;
    }

    .my_l li .on {
        border-left: 2px solid #3eaf7c;
        background: #eef9f3;
        border-radius: 16px;
    }

    .my_info {
        padding: 14px 0 6px;
    }

    .user_big_head {
        float: none;
        margin: 0 auto 10px;
        display: block;
    }

    .my_r .my_name {
        font-size: 16px;
    }

    .my_info_txt {
        overflow: visible;
        text-align: left;
    }

    .mytab_list li .tit {
        width: 72px;
        margin-right: 8px;
    }

    .mytab_list li .s_input,
    .mytab_list li select.s_input {
        width: calc(100% - 84px);
        max-width: calc(100% - 84px);
        box-sizing: border-box;
    }

    .userBox .book_tit {
        padding: 0 0 10px;
    }

    .userBox .book_tit .fl,
    .userBox .book_tit .fr {
        float: none;
    }

    .userBox .book_tit .fr {
        margin-top: 4px;
    }

    .my_bookshelf .title .fl,
    .my_bookshelf .title .fr {
        float: none;
    }

    .my_bookshelf .title .fr {
        margin-top: 8px;
    }

    .viewhistoryBox {
        padding: 0 12px 12px;
    }

    .userBox .updateTable table,
    .userBox .dataTable table {
        min-width: 560px;
    }

    .userBox .commentBar,
    .userBox .feedback_list {
        margin-bottom: 10px;
    }

    .userBox .comment_list {
        padding: 14px 0;
    }

    body.user-comment-page .userBox .commentBar .comment_list,
    body.user-feedback-page .userBox .feedback_list .comment_list {
        padding: 12px 12px;
        border-radius: 10px;
    }

    body.user-comment-page .userBox .comment_list .comment-main {
        gap: 10px;
    }

    body.user-comment-page .userBox .comment_list .book-name {
        font-size: 14px;
    }

    .userBox .comment_list .user_heads {
        margin-right: 0;
    }

    body.user-comment-page .userBox .comment_list .user_head {
        width: 42px;
        height: 42px;
    }

    body.user-comment-page .userBox .comment_list .comment-head {
        align-items: flex-start;
    }

    body.user-comment-page .userBox .comment_list .time,
    body.user-feedback-page .userBox .comment_list .time {
        font-size: 11px;
    }

    body.user-comment-page .userBox .comment_list .comment-summary {
        gap: 8px;
    }

    body.user-comment-page .userBox .comment_list .comment-actions {
        margin-top: 0;
    }

    body.user-comment-page .userBox .comment_list .comment-actions a {
        margin-right: 8px;
        min-height: 30px;
        padding: 0 8px;
        font-size: 12px;
    }

    body.user-feedback-page .feedback-row {
        grid-template-columns: minmax(0, 1fr) 106px 42px;
        gap: 8px;
        padding: 9px 10px;
    }

    body.user-feedback-page .feedback-head {
        font-size: 12px;
    }

    body.user-feedback-page .feedback-time {
        font-size: 11px;
    }

    body.user-feedback-page .feedback-action {
        text-align: center;
    }
    body.user-feedback-page .feedback-create-btn {
        min-height: 36px;
        line-height: 36px;
        padding: 0 14px;
    }
    body.user-feedback-page .feedback-action .feedback-action-btn {
        min-height: 30px;
        line-height: 28px;
        padding: 0 8px;
        font-size: 12px;
    }
    body.user-page .feedback-form-actions {
        gap: 8px;
    }
    body.user-page .feedback-form-actions .feedback-submit-btn,
    body.user-page .feedback-form-actions .feedback-cancel-btn {
        min-height: 36px;
        line-height: 34px;
        padding: 0 14px;
        font-size: 13px;
    }
    body.user-page .feedback-form-actions .feedback-submit-btn {
        min-width: 96px;
    }
    body.user-page .feedback-form-actions .feedback-cancel-btn {
        min-width: 80px;
    }

    body.user-home-page .my_info {
        display: block;
        padding: 14px 12px;
        margin: 8px 0 14px;
    }

    body.user-home-page .user_big_head {
        margin: 0 auto 10px;
    }

    body.user-home-page .my_info_txt {
        text-align: center;
    }

    body.user-home-page .my_r .my_name {
        font-size: 20px;
    }

    body.user-home-page .my_list li {
        text-align: left;
        line-height: 30px;
    }

    body.user-home-page .my_bookshelf .title {
        padding: 8px 0 10px;
    }

    .reply_bar {
        padding: 8px;
    }

    .reply_bar textarea,
    .textarea,
    #contentLi textarea {
        width: 100%;
        box-sizing: border-box;
    }

    .textarea {
        min-height: 160px;
    }

    .user_l h3 {
        font-size: 20px;
    }

    .user_l #LabErr {
        height: auto;
        min-height: 24px;
        line-height: 1.6;
        text-align: left;
    }

    .user_l .btn_red {
        font-size: 16px;
    }

    .user_l .log_list b {
        display: block;
        padding: 6px 0 4px;
    }

    .my_r .userBox {
        margin: 0;
        background: transparent;
        border-radius: 0;
    }

    .my_r .user_l,
    .my_r .user_l .log_list {
        width: 100%;
        padding: 10px 0;
    }

    .my_r .s_input,
    .my_r select.s_input {
        width: 100%;
    }

    .my_r #picImage {
        max-width: 100px;
        height: auto;
    }
    body.user-page .main.box_center {
        margin: 0 12px;
    }

    .userBox {
        padding: 0;
    }

    .user_l {
        padding: 14px 10px;
    }

    .user_l h3 {
        text-align: center;
        line-height: 1.4;
    }

    .user_l .s_input {
        height: 40px;
        line-height: 40px;
        font-size: 15px;
        box-sizing: border-box;
    }

    .icon_code {
        width: calc(100% - 126px);
    }

    .code_pic {
        width: 118px;
        max-width: none;
    }

    .autologin {
        margin-bottom: 12px;
    }

    .user_r {
        padding: 14px 10px;
    }

    .user_r .tit {
        padding: 0 0 12px;
    }

    .user_r .btn_ora_white {
        display: inline-block;
        min-width: 120px;
        text-align: center;
    }

    .my_l {
        padding: 6px 0;
    }

    .my_l .log_list {
        display: flex;
        overflow-x: auto;
        gap: 6px;
        white-space: nowrap;
        padding: 0 4px 4px;
        -webkit-overflow-scrolling: touch;
    }

    .my_l .log_list li {
        flex: 0 0 auto;
    }

    .my_l li a {
        height: 32px;
        line-height: 32px;
        padding: 0 10px;
        border: 1px solid #ededed;
        border-radius: 16px;
        background: #fff;
        font-size: 13px;
    }

    .my_l li .on {
        border: 1px solid #3eaf7c;
        background: #eef9f3;
        border-radius: 16px;
    }

    .my_bookshelf .title {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px;
    }

    .my_bookshelf .title i {
        display: none;
    }

    .my_bookshelf .title .fl,
    .my_bookshelf .title .fr {
        margin: 0;
    }

    .my_bookshelf .title h2,
    .my_bookshelf .title h4 {
        font-size: 18px;
        line-height: 1.4;
    }

    .my_bookshelf .updateTable table {
        min-width: 0;
        width: 100%;
        table-layout: fixed;
    }

    .my_bookshelf .updateTable th.style,
    .my_bookshelf .updateTable td.style,
    .my_bookshelf .updateTable th.time,
    .my_bookshelf .updateTable td.time {
        display: none;
    }

    .my_bookshelf .updateTable .name {
        width: 45%;
    }

    .my_bookshelf .updateTable .chapter {
        width: 35%;
    }

    .my_bookshelf .updateTable .goread {
        width: 20%;
        text-align: center;
    }

    .my_bookshelf .updateTable .name a,
    .my_bookshelf .updateTable .chapter a {
        max-width: 100%;
    }

    .my_bookshelf .updateTable td {
        height: 36px;
        line-height: 36px;
    }

    .my_bookshelf .updateTable td.goread > div {
        line-height: 1.8 !important;
        padding-bottom: 0 !important;
    }

    .user-auth-page .userBox {
        margin-bottom: 14px;
    }

    .user-auth-page .user_l,
    .user-auth-page .user_r {
        width: 100%;
        float: none;
        box-sizing: border-box;
    }

    .user-auth-page .user_l {
        padding: 14px 10px;
    }

    .user-auth-page .user_l .log_list {
        width: 100%;
        box-sizing: border-box;
    }

    .user-auth-page .user_l .log_list li {
        overflow: hidden;
    }

    .user-auth-page .user_l .s_input,
    .user-auth-page .user_l .icon_name,
    .user-auth-page .user_l .icon_key {
        width: 100% !important;
        max-width: 100%;
        box-sizing: border-box;
    }

    .user-auth-page .user_l .icon_code {
        width: calc(100% - 126px) !important;
        float: left;
        box-sizing: border-box;
    }

    .user-auth-page .user_l .code_pic {
        width: 118px;
        height: 40px;
        float: right;
        max-width: none;
        box-sizing: border-box;
    }

    .user-auth-page .user_l .btn_red {
        width: 100% !important;
        box-sizing: border-box;
        display: flex;
        padding: 0;
        line-height: 42px;
    }

    .user-auth-page .user_r {
        margin: 0;
        padding: 14px 10px 10px;
        border-left: none;
        border-top: 1px dotted #e3e3e3;
        text-align: center;
    }

    .user-auth-page .user_r .btn_ora_white {
        min-width: 0;
        width: 140px;
        box-sizing: border-box;
    }
}