/* ============================================
   版权所有 © 2026 墨迹语CMS 
   https://www.mojiyucms.com/
   ============================================ 
*/
:root {
    --theme-color: #343639;
    --font-color: #333;
    --main-color: #EA3D4E;
}

* {
    -webkit-tap-highlight-color: transparent;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

*:before,
*:after {
    box-sizing: border-box;
}

@media (min-width:1025px) {
    ::-webkit-scrollbar {
        width: 0.06rem;
        height: 0.12rem;
        background-color: #fff;
    }

    ::-webkit-scrollbar-thumb {
        background-color: var(--main-color);
        border-radius: 0.2rem;
    }
}

html {
    -webkit-text-size-adjust: none;
    font-size: calc(100vw/19.2);
    scroll-behavior: initial;
}

@media only screen and (max-width:1900px) {

    /*1900px*/
    html {
        font-size: 100px;
    }
}

@media only screen and (max-width:1706px) {

    /*1706px*/
    html {
        font-size: calc(100vw/17.6);
    }
}

@media only screen and (max-width:1280px) {

    /*1280px*/
    html {
        font-size: calc(100vw/12.8);
    }
}

@media only screen and (max-width:1024px) {

    /*1024px*/
    html {
        font-size: calc(100vw/10.24);
    }
}

@media only screen and (max-width:750px) {

    /*750px*/
    html {
        font-size: calc(180vw/7.5);
    }
}

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

html,
body,
div,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
blockquote,
th,
td,
button,
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
main,
.nmp,
.nmp p,
.nmp dt,
.nmp dd,
.nmp li,
.nmp ul,
.mmp ol {
    margin: 0;
    padding: 0;
}

body {
    background-color: #E9EAEC;
    color: var(--font-color);
    font: 0.16rem/1.875em "Microsoft Yahei", Arial;
    overflow-x: hidden;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

/*table*/
table {
    background-color: transparent;
    border-spacing: 0;
    border-collapse: collapse;
    width: 100%;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    box-sizing: border-box;
}

table th {
    background-color: #f8f8f8;
    text-align: center;
    box-sizing: border-box;
}

table td,
table th {
    padding: 0.1rem;
    border: 1px solid #ddd;
    box-sizing: border-box;
}

/*a*/
a {
    text-decoration: none;
    outline: none;
    color: var(--font-color);
}

a:focus {
    outline: none;
    -moz-outline: none;
}

a:hover {
    color: var(--main-color);
}

a img {
    border: none;
}

/*li*/
.nmp li {
    list-style: none;
}

/*img*/
img,
video {
    vertical-align: middle;
    max-width: 100%;
}

/*form*/
select,
input,
textarea,
button {
    border-radius: 0;
    -webkit-border-radius: 0;
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    outline: none;
    font-family: inherit;
    font-size: 1em;
}

textarea {
    resize: none;
}

input:focus {
    outline: none;
}

input::-moz-placeholder {
    opacity: 1;
    color: #ccc;
}

input:-moz-placeholder {
    opacity: 1;
    color: #ccc;
}

input::-webkit-input-placeholder {
    opacity: 1;
    color: #ccc;
}

input:-ms-input-placeholder {
    opacity: 1;
    color: #ccc;
}

textarea::-moz-placeholder {
    opacity: 1;
    color: #ccc;
}

textarea:-moz-placeholder {
    opacity: 1;
    color: #ccc;
}

textarea::-webkit-input-placeholder {
    opacity: 1;
    color: #ccc;
}

textarea:-ms-input-placeholder {
    opacity: 1;
    color: #ccc;
}

/*rows*/
[class*=rows_] {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
}

.rows_1 {
    display: block;
    white-space: nowrap;
}

.rows_2 {
    line-clamp: 2;
    -webkit-line-clamp: 2;
}

.rows_3 {
    line-clamp: 3;
    -webkit-line-clamp: 3;
}

.rows_4 {
    line-clamp: 4;
    -webkit-line-clamp: 4;
}

.rows_5 {
    line-clamp: 5;
    -webkit-line-clamp: 5;
}

/*flex*/
.flex {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    --align: center;
    align-items: var(--align);
    --justify: space-between;
    justify-content: var(--justify);
    --wrap: wrap;
    flex-wrap: var(--wrap);
}

/*mza-box*/
.mza-box {
    background-color: #fff;
    overflow: hidden;
    position: relative;
    margin-bottom: 0.2rem;
}

/*mza-name*/
.mza-name {
    font-size: 0.18rem;
    line-height: 1.35em;
    border-bottom: 1px solid #eee;
    margin: 0;
    padding: 0.2rem;
    position: relative;
}

.mza-name:before {
    width: 0.112em;
    height: 1.125em;
    background-color: var(--main-color);
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

/*inner*/
.inner {
    width: 93.75%;
    max-width: 16rem;
    margin: 0 auto;
}

/*clearfix*/
.clearfix {
    clear: both;
    overflow: hidden;
    width: 100%;
}

.clearfix:after {
    display: block;
    content: '';
    width: 100%;
    clear: both;
    overflow: hidden;
}

/*delay*/
.delay {
    --property: all;
    --delay: 0.3s;
    transition: var(--property) var(--delay);
}

/*thumbnail*/
.thumbnail {
    position: relative;
    overflow: hidden;
}

.thumbnail:after {
    display: block;
    content: '';
    padding-bottom: 75%;
}

.thumbnail a,
.thumbnail img {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: all 0.3s;
}

.thumbnail img {
    object-fit: cover;
}

.thumbnail:hover img {
    transform: scale(1.05);
}

/*warning*/
.warning {
    font-size: 0.13rem;
    color: #999;
    line-height: 2em;
}

/*banner*/
.banner {
    clear: both;
    overflow: hidden;
    width: 100%;
}

.banner img {
    width: 100%;
    height: auto;
    display: block;
}

.banner a {
    display: block;
    overflow: hidden;
}

/*header*/
#header {
    background-color: var(--theme-color);
    width: 100%;
    position: sticky;
    top: 0;
    z-index: 9;
}

#header>.inner {
    display: table;
    table-layout: fixed;
    position: relative;
    z-index: 2;
}

/*logo*/
#logo {
    width: 2.2rem;
    display: table-cell;
    vertical-align: middle;
    position: relative;
    z-index: 8;
}

#logo a {
    display: block;
    background: no-repeat left center;
    background-size: contain;
    padding-bottom: 22.5%;
    overflow: hidden;
    position: relative;
}

#logo i {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-indent: -9999em;
    overflow: hidden;
}

/*button*/
#button {
    display: table-cell;
    vertical-align: middle;
    width: 1.5rem;
}

#button ul {
    border-left: 1px solid #000;
    --align: flex-start;
    --wrap: nowrap;
}

#button li {
    line-height: 0.8rem;
    color: #fff;
    border-right: 1px solid #000;
    border-left: 1px solid #444;
    position: relative;
    flex-grow: 1;
    cursor: pointer;
    width: 50%;
    text-align: center;
}

#button li:last-child {
    border-right: none;
}

#button li:nth-child(2) {
    border-right-width: 0;
}

#button .active {
    box-shadow: 0px 0px 0.07rem #000;
}

#button .navbtn {
    display: none;
}

#button .drop {
    position: absolute;
    top: 100%;
    right: -2px;
    z-index: -1;
    min-width: 100%;
    white-space: nowrap;
    background-color: #fff;
    border: 1px solid #E9E9E9;
    padding: 0.1rem 0.2rem;
    display: none;
}

#button .drop a {
    display: block;
    color: var(--font-color);
    line-height: 2em;
    font-size: 0.14rem;
    padding: 0.05rem 0;
    background: no-repeat left center;
    padding-left: 1.43em;
    background-size: 1.143em auto;
}

#button .drop a:hover {
    color: var(--main-color);
}

#button .drop .wb {
    background-image: url(images/icon_wb.png);
}

#button .drop .wx {
    background-image: url(images/icon_wx.png);
}

#button .drop .qq {
    background-image: url(images/icon_qq.png);
}

/*share*/
#share {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #333;
    z-index: 10;
    display: none;
}

#share .wrap {
    width: 100%;
    height: 100%;
    flex-direction: column;
    --justify: center;
}

#share .qrcode {
    background-color: #fff;
    padding: 0.2rem;
    margin-bottom: 0.3rem;
}

#share img {
    display: block;
    width: 100%;
    height: auto;
}

#share .text {
    text-align: center;
    font-size: 0.2rem;
    line-height: 1.5em;
    color: #fff;
}

/*searchbar*/
#searchbar {
    background-color: #F5F5F5;
    width: 100%;
    padding: 0.2rem 0;
    position: absolute;
    left: 0;
    top: 100%;
    display: none;
}

/*search*/
#search {
    width: 46%;
}

#search form {
    display: block;
    position: relative;
    padding-right: 3em;
}

#search .text {
    background-color: #fff;
    border: 1px solid #ddd;
    height: 2.5em;
    line-height: 1.5em;
    padding: 0.5em 1em;
    width: 100%;
    display: block;
    border-radius: 3px;
}

#search button {
    border: none;
    background-color: var(--theme-color);
    color: #fff;
    cursor: pointer;
    border-radius: 3px;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 2.5em;
}

/*quick*/
#quick {
    width: 50%;
    line-height: 2em;
    font-size: 0.875em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0.05rem 0;
    color: #888;
}

#quick a {
    margin-right: 0.75em;
}

#quick a:not(:hover) {
    color: #555;
}

/*nav*/
#nav {
    display: table-cell;
    vertical-align: middle;
    position: relative;
    z-index: 8;
}

#nav .menu {
    --justify: flex-end;
}

#nav .menu>li {
    line-height: 0.8rem;
    color: #fff;
    border-right: 1px solid #000;
    border-left: 1px solid #444;
    position: relative;
}

#nav .menu>li:first-child:before {
    border-left: 1px solid #000;
    display: block;
    height: 100%;
    content: '';
    position: absolute;
    right: 100%;
    top: 0;
    margin-right: 1px;
}

#nav .menu>li:last-child {
    border-right: none;
}

#nav a {
    color: #fff;
    padding: 0 0.2rem;
    display: block;
}

#nav a:hover,
#nav .on>a {
    background-color: var(--main-color);
}

#nav li ul {
    position: absolute;
    left: 50%;
    top: 100%;
    min-width: 100%;
    transform: translateX(-50%);
    border-radius: 0 0 0.03rem 0.03rem;
    background-color: var(--theme-color);
    overflow: hidden;
    border-top: 1px solid #000;
    z-index: 9;
    display: none;
}

#nav li li {
    line-height: 1.5em;
    font-size: 0.875em;
    text-align: center;
    border-bottom: 1px solid #000;
    border-top: 1px solid #444;
}

#nav li li a {
    padding: 0.1rem 1em;
    white-space: nowrap;
}

#nav li em {
    display: none;
}

/*404*/
.error404 {
    background: #fff url(images/bg404.png) repeat left top;
    overflow: hidden;
    flex-direction: column;
    min-height: calc(100vh - 1.58rem);
    padding: 5vh 0;
    --justify: center;
}

.error404 .figure {
    margin-bottom: 0.5rem;
}

.error404 .figure img {
    width: 3rem;
    max-width: 100%;
    height: auto;
    display: block;
}

.error404 .tips {
    text-align: center;
}

.error404 .title {
    font-size: 0.28rem;
    color: var(--main-color);
    line-height: 1.5em;
    margin-bottom: 0.3rem;
}

/*container*/
#container {
    padding: 0.2rem 0;
    min-height: calc(100vh - 1.45rem);
}

#container .inner {
    --align: flex-start;
}

/*breadcrumb*/
.breadcrumb {
    font-size: 0.14rem;
    color: #666;
    padding: 0.2rem;
    border-bottom: 1px solid #eee;
    position: relative;
    line-height: 1.7357em;
}

.breadcrumb:before {
    width: 0.03rem;
    height: 0.2rem;
    background-color: var(--main-color);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    content: '';
}

/*main*/
#main {
    width: calc(73% - 0.2rem);
}

.mainbox {
    --align: flex-start;
}

/*focus*/
#slides {
    width: calc(50% - 0.1rem);
    position: relative;
}

#slides .info {
    display: block;
    overflow: hidden;
    padding-bottom: 100%;
    background: no-repeat center center;
    background-size: cover;
    position: relative;
}

#slides .title {
    position: absolute;
    width: 100%;
    padding: 0.5em 0.8rem 0.5em 0.2rem;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .5);
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .3);
    font-size: 0.15rem;
    line-height: 2em;
    font-weight: normal;
}

#slides .swiper-pagination {
    right: 0.2rem;
    bottom: 0;
    z-index: 5;
    height: 0.45rem;
    color: rgba(255, 255, 255, 0.5);
}

/*istop*/
#istop {
    width: calc(50% - 0.1rem);
}

#istop ul {
    padding: 0 0.2rem;
}

#istop li {
    border-top: 1px solid #eee;
    padding: 0.2rem 0;
}

#istop li:first-child {
    border-top: none;
}

#istop .title {
    font-size: 0.18rem;
    line-height: 1.35em;
    margin-bottom: 0.1062rem;
}

#istop p {
    font-size: 0.14rem;
    line-height: 1.75em;
    height: 3.5em;
    color: #555;
}

/*section*/
.blogItem {
    padding: 0.2rem;
    overflow: hidden;
    border-bottom: 1px solid #eee;
}

.blogItem .title {
    font-size: 0.22rem;
    line-height: 1.5em;
    margin-bottom: 0.1rem;
}

.blogItem .title strong {
    color: #f00;
}

.blogItem .thumbnail {
    width: 2.8rem;
}

.blogItem .thumbnail span {
    position: absolute;
    left: 0;
    top: 0;
    padding: 0 5px;
    font-size: 0.12rem;
    background-color: rgba(71, 150, 216, .7);
    color: #fff;
}

.blogItem .info {
    width: calc(100% - 3rem);
}

.blogItem .meta {
    border-bottom: 1px solid #eee;
    padding-bottom: 0.1rem;
    margin-bottom: 0.1rem;
    color: #999;
    --justify: flex-start;
}

.blogItem .meta span {
    font-size: 0.13rem;
    line-height: 2em;
    display: block;
    margin-right: 0.2rem;
}

.blogItem .meta span:last-child {
    margin-right: 0;
}

.blogItem .excerpt {
    color: #555;
    height: 7.5em;
}

/*post*/
.post {
    padding: 0.35rem 0.2rem;
    overflow: hidden;
}

.post .box {
    border-top: 1px solid #eee;
    padding: 0.2rem 0;
}

.post .name {
    border: none;
    font-size: 0.18rem;
    line-height: 1.35em;
    color: var(--font-color);
    padding-left: 0.3rem;
    position: relative;
    margin-bottom: 0.15rem;
}

.post .name i {
    position: absolute;
    left: 0;
    top: 0;
}

/*postTitle*/
.postname {
    font-size: 0.28rem;
    line-height: 1.5em;
    margin-bottom: 0.2rem;
}

.postname.center {
    text-align: center;
}

/*postmeta*/
.postmeta {
    margin-bottom: 0.2rem;
    border-bottom: 1px solid #efefef;
    padding-bottom: 0.1rem;
    --justify: flex-start;
}

.postmeta span {
    font-size: 0.14rem;
    line-height: 2em;
    color: #666;
    margin-right: 0.2rem;
    display: block;
}

.postmeta span:last-child {
    margin-right: 0;
}

/*entry*/
.entry {
    overflow: hidden;
    margin-bottom: 0.2rem;
}

.entry * {
    line-height: 1.875em;
}

.entry h1,
.entry h2,
.entry h3,
.entry h4,
.entry h5,
.entry h6 {
    border-left: 0.03rem solid var(--main-color);
    padding-left: 0.15rem;
}

.entry blockquote {
    overflow: hidden;
    border: 1px solid #eee;
    border-left: 0.04rem solid #eee;
    background-color: #F5F5F5;
    color: #777;
    padding: 1em;
    overflow: hidden;
    margin: 1em 2em;
    border-radius: 0.04rem;
}

.entry a {
    color: var(--main-color);
}

.entry a:hover {
    text-decoration: underline;
}

.entry img,
.entry video {
    height: auto !important;
}

.entry hr {
    clear: both;
    border: none;
    border-bottom: 1px solid #eee;
}

/*posttags*/
.posttags {
    font-size: 0.14rem;
    color: #888;
    line-height: 2em;
    margin-bottom: 0.2rem;
}

.posttags a {
    color: #888;
    margin-right: 0.2rem;
}

.posttags a:last-child {
    margin-right: 0;
}

.posttags a:hover {
    color: var(--main-color);
}

/*postnavi*/
.postnavi {
    margin-bottom: 0.2rem;
    font-size: 0.15rem;
    line-height: 2em;
}

.postnavi>div {
    max-width: 47%;
}

.postnavi .next {
    text-align: right;
}

.postnavi i {
    font-style: normal;
    font-family: '宋体';
}

.postnavi a {
    color: #555;
}

.postnavi a:hover {
    color: var(--main-color);
}

/*morepost*/
.morepost li {
    line-height: 1.875em;
    font-size: 0.15rem;
    margin-bottom: 0.1rem;
}

.morepost li:last-child {
    margin-bottom: 0;
}

.morepost time {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    font-size: 0.875em;
    color: #888;
}

.morepost a {
    position: relative;
    padding-right: 6em;
}

.morepost a:hover time {
    color: var(--main-color);
}

/*related-pic*/
.related ul {
    overflow: hidden;
    width: calc(100% + 0.2rem);
}

.related li {
    width: 25%;
    padding-right: 0.2rem;
}

.related li:nth-child(n+5) {
    margin-top: 0.2rem;
}

.related .title {
    text-align: center;
    font-size: 0.15rem;
    line-height: 1.75em;
    font-weight: normal;
    margin-top: 0.1rem;
}

/*commentslist*/
.commentslist li {
    margin-bottom: 0.2rem;
    border: 1px solid #eee;
    padding: 0.15rem;
    border-radius: 0.03rem;
    background-color: #fefefe;
}

.commentslist li .wrap {
    position: relative;
}

.commentslist .gravatar {
    float: left;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 0.03rem;
    overflow: hidden;
}

.commentslist .gravatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.commentslist .info {
    margin-left: 0.65rem;
    overflow: hidden;
}

.commentslist .author {
    font-size: 0.15rem;
    line-height: 1.5em;
    font-weight: bold;
}

.commentslist .meta {
    font-size: 0.13rem;
    color: #888;
    margin-bottom: 0.05rem;
}

.commentslist li li {
    margin-top: 0.15rem;
    background-color: #fff;
}

.commentslist #divcommentpost {
    margin-top: 0.2rem;
}

/*comment-form*/
#divcommentpost .item {
    margin-bottom: 0.15rem;
    overflow: hidden;
}

#divcommentpost label {
    color: #555;
    display: block;
    float: left;
    line-height: 2.5em;
}

#divcommentpost .input {
    overflow: hidden;
    margin-left: 3em;
    position: relative;
}

#divcommentpost .text {
    padding: 0.5em 1em;
    width: 100%;
    height: 2.5em;
    line-height: 1.5em;
    display: block;
    border: 1px solid #dedede;
    border-radius: 0.03rem;
}

#divcommentpost .text:focus {
    outline: none;
}

#divcommentpost textarea.text {
    height: 7.5em;
    resize: vertical;
}

#divcommentpost .verify img {
    display: block;
    position: absolute;
    right: 0.05rem;
    top: 50%;
    transform: translateY(-50%);
    height: 0.3rem;
    width: auto;
    cursor: pointer;
}

#divcommentpost .verify .text {
    padding-right: 1rem;
}

#divcommentpost .button {
    padding: 0.2rem 0 0.2rem 0.48rem;
    --justify: flex-end;
}

#divcommentpost .btn {
    display: block;
    border-radius: 0.03rem;
    cursor: pointer;
    font-size: 0.18rem;
    padding: 0 1.5em;
    height: 2.5em;
    line-height: 2.5em;
}

#divcommentpost .submit {
    background-color: var(--main-color);
    color: #fff;
}

#divcommentpost #cancel-reply {
    background-color: #f6f6f6;
    color: #666;
    margin-left: 0.05rem;
    display: none;
}

#divcommentpost .warning {
    color: #888;
    margin-bottom: 1.5em;
    text-align: center;
}

/*pagenavi*/
.pagenavi {
    text-align: center;
    padding: 0.2rem;
    font-size: 0.15rem;
}

.pagenavi a,
.pagenavi span.now-page {
    background-color: #fff;
    border: 1px solid #eee;
    padding: 0 0.2em;
    color: var(--font-color);
    margin: 0.02rem;
    height: 2.24em;
    line-height: 2.24em;
    min-width: 2.24em;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
}

.pagenavi a:hover {
    color: var(--main-color);
}

.pagenavi span.now-page {
    background-color: var(--main-color);
    color: #fff;
    border-color: var(--main-color);
}

/*sidebar*/
#sidebar {
    width: 27%;
}

/*textwidget*/
.textwidget {
    padding: 0.2rem;
    overflow: hidden;
}

.textwidget img {
    width: 100%;
    height: auto;
    display: block;
}

/*widget*/
.widget ul {
    padding: 0.2rem;
}

/*widget_mza_latest_posts*/
.widget_mza_rand_posts li,
.widget_mza_latest_posts li {
    margin-bottom: 0.15rem;
    border-bottom: 1px dashed #ccc;
    padding-bottom: 0.15rem;
}

.widget_mza_rand_posts li:last-child,
.widget_mza_latest_posts li:last-child {
    margin-bottom: 0;
    border-bottom: none;
    padding-bottom: 0;
}

.widget_mza_rand_posts .thumbnail,
.widget_mza_latest_posts .thumbnail {
    width: 1.1rem;
}

.widget_mza_rand_posts .text,
.widget_mza_latest_posts .text {
    width: calc(100% - 1.25rem);
}

.widget_mza_rand_posts .title,
.widget_mza_latest_posts .title {
    font-weight: normal;
    font-size: 0.16rem;
    line-height: 1.75em;
    max-height: 3.5em;
    margin-bottom: 0.09rem;
}

.widget_mza_rand_posts .meta .widget_mza_latest_posts .meta {
    font-size: 0.13rem;
    line-height: 1.5em;
    color: #888;
}

/*widget_mza_popular_posts*/
.widget_mza_popular_posts li {
    font-size: 0.15rem;
    line-height: 2em;
    margin-bottom: 0.1rem;
}

.widget_mza_popular_posts li:last-child {
    margin-bottom: 0;
}

.widget_mza_popular_posts i {
    font-style: normal;
    font-size: 0.875em;
    background-color: #eee;
    color: #888;
    border-radius: 0.03rem;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1.829em;
    height: 1.829em;
    text-align: center;
    line-height: 1.829em;
}

.widget_mza_popular_posts li:nth-child(1) i {
    background-color: var(--main-color);
    color: #fff;
}

.widget_mza_popular_posts li:nth-child(2) i {
    background-color: #FD6440;
    color: #fff;
}

.widget_mza_popular_posts li:nth-child(3) i {
    background-color: #4796D8;
    color: #fff;
}

.widget_mza_popular_posts li a {
    display: inline-block;
    max-width: 100%;
    position: relative;
    padding-left: 2.2em;
    vertical-align: middle;
}

/*widget_mza_review_posts*/
.widget_mza_review_posts li {
    margin-bottom: 0.12rem;
}

.widget_mza_review_posts li:last-child {
    margin-bottom: 0;
}

.widget_mza_review_posts .title {
    font-size: 0.15rem;
    line-height: 1.875em;
    position: relative;
    padding-left: 2.2em;
    font-weight: normal;
}

.widget_mza_review_posts i {
    font-style: normal;
    font-size: 1em;
    background-color: #eee;
    color: #888;
    border-radius: 0.03rem;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    line-height: 1.5em;
}

.widget_mza_review_posts .thumbnail {
    width: 1rem;
    display: none;
    border-radius: 0.05rem;
}

.widget_mza_review_posts a {
    --wrap: nowrap;
}

.widget_mza_review_posts .cur .thumbnail {
    display: block;
}

.widget_mza_review_posts .cur .title {
    width: calc(100% - 1.15rem);
    padding-left: 0;
    display: -webkit-box;
    max-height: 4.4em;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    white-space: normal;
    font-size: 0.16rem;
}

.widget_mza_review_posts .cur .title i {
    display: none;
}

/*widget_mza_follow*/
.widget_mza_follow .item {
    margin-bottom: 0.15rem;
}

.widget_mza_follow .qrcode {
    width: 1.5rem;
}

.widget_mza_follow .qrcode img {
    display: block;
    width: 100%;
    height: auto;
}

.widget_mza_follow .text {
    width: calc(100% - 1.8rem);
    color: #666;
}

.widget_mza_follow .name {
    font-size: 0.2rem;
    font-weight: bold;
    line-height: 1.875em;
    color: #333;
    margin-bottom: 0.1rem;
}

.widget_mza_follow .tips {
    color: #666;
    font-size: 0.15rem;
    line-height: 2em;
    width: 100%;
    text-align: center;
}

/*divComments*/
.divComments li {
    margin-bottom: 0.15rem;
    border-bottom: 1px dashed #ccc;
    padding-bottom: 0.15rem;
}

.divComments li:last-child {
    margin-bottom: 0;
    border-bottom: none;
    padding-bottom: 0;
}

.divComments img {
    width: 0.45rem;
    height: 0.45rem;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 0.05rem;
    object-fit: cover;
    display: block;
}

.divComments span {
    display: block;
    font-size: 0.15rem;
    line-height: 1.35em;
    font-weight: bold;
    color: #333;
    margin-bottom: 0.05rem;
}

.divComments a {
    color: #555;
    position: relative;
    padding-left: 0.55rem;
    font-size: 0.14rem;
    line-height: 1.35em;
}

/*divSearchPanel*/
.divSearchPanel form {
    overflow: hidden;
    position: relative;
    padding-right: 3.5em;
}

.divSearchPanel input {
    float: left;
}

.divSearchPanel input[type="text"] {
    border: 1px solid #ddd;
    width: 100%;
    height: 2.5em;
    line-height: 1.5em;
    padding: 0.5em 1em;
    display: block;
    border-right: none;
    border-radius: 0.05rem 0 0 0.05rem;
}

.divSearchPanel input[type="submit"] {
    background-color: var(--main-color);
    color: #fff;
    cursor: pointer;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 3.5em;
    font-weight: bold;
    border-radius: 0 0.05rem 0.05rem 0;
}

/*divTags*/
.divTags ul {
    display: flex;
    flex-wrap: wrap;
}

.divTags a {
    display: block;
    font-size: 0.14rem;
    background-color: #E1474D;
    padding: 0 0.75em;
    border-radius: 0.03rem;
    margin: 0.025rem 0.05rem 0.025rem 0;
    color: #fff;
    line-height: 2em;
}

.divTags .tag-count {
    font-size: 0.75em;
}

.divTags a:hover {
    opacity: 0.9;
}

.divTags li:nth-child(8n-7) a {
    background-color: #8A9B0F;
}

.divTags li:nth-child(8n-6) a {
    background-color: #EB6841;
}

.divTags li:nth-child(8n-5) a {
    background-color: #3FB8AF;
}

.divTags li:nth-child(8n-4) a {
    background-color: #FE4365;
}

.divTags li:nth-child(8n-3) a {
    background-color: #FC9D9A;
}

.divTags li:nth-child(8n-2) a {
    background-color: #EDC951;
}

.divTags li:nth-child(8n-1) a {
    background-color: #C8C8A9;
}

.divTags li:nth-child(8n) a {
    background-color: #83AF9B;
}

.divTags li:first-child a {
    background-color: #E1474D;
}

.divTags li:last-child a {
    background-color: #3299BB;
}

/*divArchives*/
.divFavorites ul,
.divArchives ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.divFavorites li,
.divArchives li {
    width: calc(50% - 0.075rem);
}

.divFavorites li:nth-child(n+3),
.divArchives li:nth-child(n+3) {
    margin-top: 0.15rem;
}

.divFavorites li a,
.divArchives li a {
    display: block;
    background-color: #f1f1f1;
    color: #555;
    border-radius: 0.05rem;
    padding: 0.25em 1em;
    line-height: 2.25em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*divCalendar*/
.divCalendar table {
    text-align: center;
}

.divCalendar caption {
    margin-bottom: 0.2rem;
    font-size: 0.2rem;
    font-weight: bold;
    line-height: 2em;
}

.divCalendar table a {
    color: var(--main-color);
    font-weight: bold;
}

/*divPrevious*/
.divPrevious li {
    border-bottom: 1px dashed #ccc;
    padding-bottom: 0.15rem;
    margin-bottom: 0.15rem;
    line-height: 1.75em;
}

.divPrevious li:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

/*divStatistics*/
.divStatistics li {
    position: relative;
    padding-left: 1em;
    margin-bottom: 0.1rem;
}

.divStatistics li:last-child {
    margin-bottom: 0;
}

.divStatistics li:before {
    width: 0.35em;
    height: 0.35em;
    border-radius: 50%;
    background-color: #ccc;
    position: absolute;
    left: 0;
    top: 0.7625em;
    display: block;
    content: '';
}

/*divAuthors*/
.divAuthors li a {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.divAuthors li span {
    font-size: 0.75em;
    color: #999;
}

/*divLinkage*/
.divLinkage li a {
    display: block;
    position: relative;
    padding-right: 1em;
}

.divLinkage li a:after {
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    content: '»';
}

/*divCatalog*/
.divCatalog li,
.divNavBar li {
    border-bottom: 1px solid #eee;
    padding-bottom: 0.1rem;
    margin-bottom: 0.1rem;
}

.divCatalog li:last-child,
.divNavBar li:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.divCatalog li ul,
.divNavBar li ul {
    padding: 0;
    margin-left: 2em;
    margin-top: 0.1rem;
    padding-top: 0.1rem;
    border-top: 1px dashed #ccc;
}

.divCatalog li li,
.divNavBar li li {
    font-size: 0.875em;
    border-bottom-style: dashed;
    border-bottom-color: #ccc;
}

/*friendlinks*/
#friendlinks {
    margin-bottom: 0.2rem;
}

#friendlinks .inner {
    background-color: #fff;
}

#friendlinks .top {
    border-bottom: 1px solid #eee;
    padding: 0.15rem 0.2rem;
}

#friendlinks .name {
    font-weight: normal;
    font-size: 0.18rem;
    line-height: 1.35em;
    padding: 0.05rem 0;
    position: relative;
}

#friendlinks .name:before {
    width: 0.112em;
    height: 1.125em;
    background-color: var(--main-color);
    content: '';
    display: block;
    position: absolute;
    left: -0.2rem;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 0.2rem;
}

#friendlinks span {
    font-size: 0.14rem;
    line-height: 1.5em;
    color: #666;
    display: block;
    padding: 0.05rem 0;
}

#friendlinks ul {
    --justify: flex-start;
    padding: 0.1rem 0.15rem;
}

#friendlinks li {
    padding: 0.05rem;
    font-size: 0.15rem;
    line-height: 2em;
}

#friendlinks li a {
    color: #555;
}

#friendlinks li a:hover {
    color: var(--main-color);
}

/*back*/
#back {
    position: fixed;
    right: 0.2rem;
    top: 70%;
    z-index: 8;
    transform: translateY(-50%);
    background-color: var(--theme-color);
    color: #fff;
    font-size: 2em;
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    cursor: pointer;
    --justify: center;
    padding-bottom: 0.15em;
    border-radius: 0.05rem;
}

#back i {
    display: block;
    line-height: 1em;
}

#back:hover {
    opacity: 0.8;
}

/*footer*/
#footer {
    background-color: var(--theme-color);
    color: #888;
    padding: 0.2rem 0;
    font-size: 0.14rem;
    line-height: 2em;
}

#footer a {
    color: #888;
    display: inline-block;
}

#footer a:hover {
    color: #fff;
}

#footer img {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    height: 1.2857em;
    margin-top: -0.21428em;
}

/*recommend*/
.recommend ul {
    padding: 0.1rem;
}

.recommend li {
    width: 50%;
    padding: 0.1rem;
}

.recommend .thumbnail {
    width: 1.35rem;
}

.recommend .info {
    width: calc(100% - 1.5rem);
}

.recommend .title {
    font-size: 0.16rem;
    line-height: 1.45em;
    margin-bottom: 0.05rem;
}

.recommend p {
    font-size: 0.14rem;
    line-height: 1.75em;
    height: 5.25em;
    overflow: hidden;
    color: #666;
    text-align: justify;
}

/*screen width*/
@media only screen and (max-width:1280px) {

    /*1280*/
    #logo {
        width: 1.9rem;
    }

    /*1280*/
    #button {
        width: 1.3rem;
    }

    #button li {
        line-height: 0.7rem;
    }

    /*1280*/
    #nav .menu>li {
        line-height: 0.7rem;
    }

    /*1280*/
    .blogItem .thumbnail {
        width: 2.2rem;
    }

    .blogItem .info {
        width: calc(100% - 2.4rem);
    }

    .blogItem .title {
        margin-bottom: 0.05rem;
    }

    .blogItem .meta {
        padding-bottom: 0.05rem;
        margin-bottom: 0.05rem;
    }

    .blogItem .excerpt {
        -webkit-line-clamp: 3;
        line-clamp: 3;
        height: 5.625em;
    }

    /*1280*/
    #istop li {
        padding: 0.1764rem 0;
    }

    #istop li:nth-child(4) {
        display: none;
    }

    #istop .title {
        margin-bottom: 0.08rem;
    }

    /*1280*/
    .error404 {
        min-height: calc(100vh - 1.48rem);
    }
}

@media only screen and (max-width:1024px) {

    /*1024*/
    #header>.inner {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    /*1024*/
    #logo {
        display: block;
    }

    /*1024*/
    #button {
        width: 2rem;
        display: block;
    }

    #button li {
        width: 33.333%;
    }

    #button li:nth-child(2) {
        border-right-width: 1px;
    }

    #button .navbtn {
        display: block;
    }

    /*1024*/
    #search {
        width: 100%;
    }

    /*1024*/
    #quick {
        display: none;
    }

    /*1024*/
    #nav {
        position: fixed;
        left: 0;
        top: 0.7rem;
        background-color: var(--theme-color);
        width: 100%;
        height: calc(100% - 0.7rem);
        z-index: 9;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        border-top: 1px solid #222;
        transform: translateX(110%);
        transition: transform .3s;
        padding: 0 3.125%;
        box-shadow: 0 0 0.05rem var(--theme-color);
    }

    #nav.active {
        transform: translateX(0);
    }

    #nav .menu {
        display: block;
    }

    #nav .menu>li {
        border-left: none;
        border-right: none;
        border-bottom: 1px solid rgba(0, 0, 0, .2);
        line-height: 0.6rem;
    }

    #nav .menu>li:first-child:before {
        display: none;
    }

    #nav li ul {
        position: static;
        min-width: 0;
        transform: none;
        border-top: none;
        background-color: transparent;
    }

    #nav li li {
        text-align: left;
        line-height: 0.5rem;
        border-bottom: none;
        border-top: 1px solid rgba(0, 0, 0, .2);
    }

    #nav li li a {
        padding: 0 0 0 3em;
    }

    #nav li em {
        width: 0.6rem;
        height: 0.6rem;
        position: absolute;
        right: 0;
        top: 0;
        z-index: 2;
        cursor: pointer;
        display: block;
    }

    #nav li em:after {
        content: '';
        display: block;
        width: 0.07rem;
        height: 0.07rem;
        border-right: 1px solid #eee;
        border-bottom: 1px solid #eee;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: rotate(45deg);
        margin: -0.06rem 0 0 -0.04rem;
        transition: all .3s;
    }

    #nav a {
        padding: 0 1em;
    }

    #nav a:hover,
    #nav .on>a {
        background-color: transparent;
    }

    /*1024*/
    #main,
    #sidebar {
        width: 100%;
    }

    /*1024*/
    #istop {
        width: calc(43% - 0.1rem);
    }

    #istop li {
        padding: 0.17808rem 0;
    }

    #istop li:nth-child(4) {
        display: block;
    }

    /*1024*/
    #slides {
        width: calc(57% - 0.1rem);
    }

    /*1024*/
    .divFavorites li,
    .divArchives li {
        width: calc(25% - 0.075rem);
    }

    .divFavorites li:nth-child(n+3),
    .divArchives li:nth-child(n+3) {
        margin-top: 0;
    }

    .divFavorites li:nth-child(n+5),
    .divArchives li:nth-child(n+5) {
        margin-top: 0.15rem;
    }
}

@media only screen and (max-width:750px) {

    /*750*/
    #logo {
        width: 1.7rem;
    }

    /*750*/
    #button {
        width: 1.6rem;
    }

    #button li {
        line-height: 0.6rem;
    }

    /*750*/
    #nav {
        top: 0.6rem;
        height: calc(100% - 0.6rem);
    }

    /*750*/
    #footer .inner {
        flex-direction: column;
        --align: center;
        text-align: center;
    }

    /*750*/
    .recommend .thumbnail {
        width: 100%;
        margin-bottom: 0.1rem;
    }

    .recommend .info {
        width: 100%;
    }

    .recommend .title {
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        margin-bottom: 0;
        line-height: 1.5em;
        max-height: 3em;
    }

    .recommend p {
        display: none;
    }

    /*750*/
    .postname {
        font-size: 0.22rem;
    }

    /*750*/
    .postmeta span {
        margin-right: 0.15rem;
    }

    /*750*/
    .blogItem .thumbnail {
        width: 1.2rem;
    }

    .blogItem .info {
        width: calc(100% - 1.4rem);
    }

    .blogItem .title {
        white-space: normal;
        display: -webkit-box;
        font-size: 0.18rem;
        max-height: 3em;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        margin-bottom: 0.09rem;
    }

    .blogItem .meta {
        margin-bottom: 0;
        padding-bottom: 0;
        border-bottom: none;
    }

    .blogItem .meta span,
    .blogItem .excerpt {
        display: none;
    }

    .blogItem .meta .date {
        display: block;
    }

    /*750*/
    #istop {
        width: 100%;
    }

    #istop li {
        padding: 0.2rem 0;
    }

    /*750*/
    #slides {
        width: 100%;
    }

    /*750*/
    .postnavi>div {
        max-width: none;
        width: 100%;
    }

    /*750*/
    #divcommentpost label {
        float: none;
        line-height: 1.5em;
        margin-bottom: 0.25em;
    }

    #divcommentpost .input {
        margin-left: 0;
    }

    /*750*/
    .commentslist .gravatar {
        width: 0.3rem;
        height: 0.3rem;
    }

    .commentslist .info {
        margin-left: 0.42rem;
    }

    .commentslist .meta {
        margin-bottom: 0;
    }

    /*750*/
    .related li {
        width: 50%;
    }

    .related li:nth-child(n+3) {
        margin-top: 0.2rem;
    }

    .related .title {
        display: -webkit-box;
        white-space: normal;
        height: 3.5em;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    /*750*/
    .error404 {
        min-height: calc(100vh - 1.84rem);
    }

    /*750*/
    #back {
        display: none;
    }

    /*750*/
    .divFavorites li,
    .divArchives li {
        width: calc(50% - 0.075rem);
    }

    .divFavorites li:nth-child(n+3),
    .divArchives li:nth-child(n+3) {
        margin-top: 0.15rem;
    }
}