/***!
 *  ZCMS CSS
 *
 *  @COPYRIGHT (C) 2015-2023 WWW.ZCMS.ORG.CN ALL RIGHTS RESERVED.
 *  @LICENSE HTTP://USE.ZCMS.ORG.CN/LICENSE1
 *
 *  $Author$
 *
 *  $Id$
 ** */

@charset "utf-8";

/* LOGO */
.zcms-logo { position: absolute; top: 6px; left: 24px; z-index: 0; }
.zcms-logo span {
    position: absolute; top: 16px; right: 1.48px; bottom: auto; left: auto;
    font-size: 0.80rem; color: #ccc;
}
.zcms-logo img { float: left; width: auto; height: 72px; }

/* 主体导航 「页面顶部左侧部分」 */
.zcms-menu[zcms-name='base'] {
    float: left;
    position: relative; top: 42px; left: 264px; width: auto; height: 20px;
    font-size: 1.12rem; font-weight: var(--zcms-font-bold);
}
.zcms-menu[zcms-name='base'] li {
    display: flex;
    position: relative; float: left; padding: 0px 20px; height: inherit;
    align-items: center;
}
.zcms-menu[zcms-name='base'] li::before {
    position: absolute; top: 2px; bottom: 0px; left: -2px; content: "";
    width: 2px; height: 16px; border-right: solid 1px #e6e6e6;
            transform: rotate(16deg);
         -o-transform: rotate(16deg);
        -ms-transform: rotate(16deg);
       -moz-transform: rotate(16deg);
    -webkit-transform: rotate(16deg);
    z-index: 0;
}
.zcms-menu[zcms-name='base'] li::after {
    position: absolute; right: 20px; bottom: -16px; left: 20px; content: "";
    border-bottom: solid 2px #fff; border-radius: 2px;
            transition: border-bottom-color 0.32s ease-in-out;
         -o-transition: border-bottom-color 0.32s ease-in-out;
       -moz-transition: border-bottom-color 0.32s ease-in-out;
    -webkit-transition: border-bottom-color 0.32s ease-in-out;
    z-index: 2;
}
.zcms-menu[zcms-name='base'] li:first-child::before { display: none; }
.zcms-menu[zcms-name='base'] li:hover::after { border-bottom-color: #f0f0f0; }

.zcms-menu[zcms-name='base'] li.current { font-weight: var(--zcms-font-bold); }
.zcms-menu[zcms-name='base'] li.current::after {
    border-bottom-color: var(--zcms-main-color);
}
.zcms-menu[zcms-name='base'] li.current a,
.zcms-menu[zcms-name='base'] li.current a:hover {
    color: var(--zcms-main-color); text-decoration: none;
}
.zcms-menu[zcms-name='base'] li.applyto { left: 20px; }
.zcms-menu[zcms-name='base'] li.applyto::before {
    display: block;
    position: absolute; top: 8px; left: -12px; content: "";
    width: 4px; height: 4px; background: #fff;
    border: solid 2px var(--zcms-deep-color); border-radius: 4px;
    z-index: 0;
}
.zcms-menu[zcms-name='base'] li.applyto a { color: #000; text-decoration: none; }
.zcms-menu[zcms-name='base'] li.applyto a:hover {
    color: var(--zcms-main-color); text-decoration: none;
}
.zcms-menu[zcms-name='base'] li.applyto:hover::after {
    border-bottom-color: var(--zcms-main-color);
}
.zcms-menu[zcms-name='base'] li.applyto img {
    position: absolute; right: -24px; bottom: -16px; height: 56px;
}
.zcms-menu[zcms-name='base'] li a { color: var(--zcms-base-color); }
.zcms-menu[zcms-name='base'] li a:hover {
    color: var(--zcms-main-color); text-decoration: none;
}

/* 主体导航 「页面顶部右侧部分」 */
.zcms-menu[zcms-name='side'] {
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: auto;
    font-size: 1.12rem; font-weight: var(--zcms-font-bold);
}
.zcms-menu[zcms-name='side'] li {
    display: flex;
    position: relative; float: left; padding: 18px 20px 2px; height: 100%;
    align-items: center; justify-content: center;
}
.zcms-menu[zcms-name='side'] li::after {
    position: absolute; top: 45px; right: -2px; bottom: 0px; content: "";
    width: 2px; height: 16px; border-right: solid 1px #e6e6e6;
            transform: rotate(16deg);
         -o-transform: rotate(16deg);
        -ms-transform: rotate(16deg);
       -moz-transform: rotate(16deg);
    -webkit-transform: rotate(16deg);
    z-index: -2;
}
.zcms-menu[zcms-name='side'] li.current {
    padding: 18px 22px 2px; width: 118px; color: #fff; justify-content: right;
}
.zcms-menu[zcms-name='side'] li.current::before {
    display: none;
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
    content: "";
    width: auto; height: 16px; background: var(--zcms-deep-color); border: none;
}
.zcms-menu[zcms-name='side'] li.current::after {
    position: absolute; top: 16px; right: 0px; bottom: 0px; left: 0px;
    content: "";
    width: auto; height: auto; background: var(--zcms-main-color); border: none;
    opacity: 0.88;
    filter: alpha(opacity=88); -moz-opacity: 0.88; -webkit-opacity: 0.88;
            transition: opacity 0.32s ease-in-out;
         -o-transition: opacity 0.32s ease-in-out;
       -moz-transition: opacity 0.32s ease-in-out;
    -webkit-transition: opacity 0.32s ease-in-out;
            transform: rotate(0deg);
         -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
       -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
}
.zcms-menu[zcms-name='side'] li.current a { display: block; color: #fff; }
.zcms-menu[zcms-name='side'] li.current a:hover { color: #fff; text-decoration: none; }
.zcms-menu[zcms-name='side'] li.current:hover::after {
    opacity: 1.00;
    filter: alpha(opacity=100); -moz-opacity: 1.00; -webkit-opacity: 1.00;
}
.zcms-menu[zcms-name='side'] li a { text-decoration: none; }
.zcms-menu[zcms-name='side'] li a:hover { color: var(--zcms-main-color); }
.zcms-menu[zcms-name='side'] li i {
    display: flex;
    position: absolute; top: 0px; left: 12px; padding: 18px 0px 0px;
    height: 88px; align-items: center; box-sizing: border-box;
}

/* 触摸导航 「弹窗模式」 */
.zcms-menu[zcms-name='icon'] {
    display: none;
    position: relative; top: 30px; left: 196px; margin: 0px; padding: 0px;
    width: 20px; height: 20px; color: var(--zcms-main-color);
    cursor: pointer;
}
.zcms-menu[zcms-name='icon'] i {
    display: flex; width: 20px; height: 20px; font-size: 1.24rem;
    align-items: center; justify-content: center; box-sizing: border-box;
}
.zcms-menu[zcms-name='icon'] i.icon-close { height: 22px; font-size: 1.64rem; }

.zcms-menu[zcms-name='list'] {
    display: none;
    position: fixed; top: 64px; right: 0px; bottom: auto; left: 0px;
    padding: 8px; width: 100%; height: calc(100% - 64px);
    background: #fff; border-top: solid 1px #f0f0f0; box-sizing: border-box;
    z-index: 8;
}
.zcms-menu[zcms-name='list']::after {
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
    content: "";
    background: url(../image/background/circular.png) no-repeat right bottom;
    background-size: cover;
            box-shadow: 0px -4px 8px 0px rgba(0, 0, 0, 0.08);
         -o-box-shadow: 0px -4px 8px 0px rgba(0, 0, 0, 0.08);
       -moz-box-shadow: 0px -4px 8px 0px rgba(0, 0, 0, 0.08);
    -webkit-box-shadow: 0px -4px 8px 0px rgba(0, 0, 0, 0.08);
    opacity: 0.48;
    filter: alpha(opacity=48); -moz-opacity: 0.48; -webkit-opacity: 0.48;
    z-index: -2;
}
.zcms-menu[zcms-name='list'] ol {
    display: inline-flex;
    position: relative; margin: 8px 0px; width: 100%; height: 24px;
    font-size: 0.80rem; color: #999;
    align-items: center; justify-content: center;
}
.zcms-menu[zcms-name='list'] li {
    display: flex; float: left;
    position: relative; margin: 8px; width: calc(20% - 16px); height: 48px;
    font-size: 1.08rem; color: var(--zcms-base-color);
    align-items: center; justify-content: center;
}
.zcms-menu[zcms-name='list'] li::after {
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
    content: "";
    background: #000; border-radius: 2px;
    opacity: 0.04;
    filter: alpha(opacity=04); -moz-opacity: 0.04; -webkit-opacity: 0.04;
    z-index: -4;
}
.zcms-menu[zcms-name='list'] li a {
    display: inherit; padding: 0px; width: 100%; height: 100%;
    align-items: inherit; justify-content: inherit;
}
.zcms-menu[zcms-name='list'] li a:hover { text-decoration: none; }

.zcms-menu[zcms-name='list'] li:hover {}
.zcms-menu[zcms-name='list'] li:hover::after {
    opacity: 0.08;
    filter: alpha(opacity=08); -moz-opacity: 0.08; -webkit-opacity: 0.08;
}
.zcms-menu[zcms-name='list'] li:hover a { color: var(--zcms-main-color); }

/* 默认搜索 */
.zcms-form {
    position: relative; margin: 0px; padding: 0px; width: 724px; height: 64px;
    z-index: 996;
}
.zcms-form::after {
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
    content: "";
    background: #fff; border-radius: 4px;
            box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.16);
         -o-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.16);
       -moz-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.16);
    -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.16);
    z-index: -4;
}
.zcms-form input[type='text'] {
    display: flex; position: absolute; top: 0px; right: 0px; left: 0px;
    margin: 0px; padding: 0px 88px 0px 16px; width: calc(100% - 156px); height: inherit;
    font-size: 1.32rem; color: var(--zcms-base-color); align-items: center;
    background: none; border: solid 3px #ccc; border-right: none;
    border-radius: 3px;
    border-top-right-radius: 0px; border-bottom-right-radius: 0px;
    outline: none; -webkit-appearance: none; box-sizing: border-box;
}
.zcms-form input[type='text']:hover,
.zcms-form input[type='text'].focus { border-color: var(--zcms-main-color); }

.zcms-form button[type='button'] {
    display: flex; position: absolute; top: 0px; right: 0px; bottom: 0px;
    margin: 0px; padding: 0px 12px; width: 156px; height: inherit; overflow: hidden;
    font-size: 1.56rem; font-weight: var(--zcms-font-bold);
    color: #fff; align-items: center; justify-content: center;
    background: var(--zcms-main-color); border: none;
    border-top-right-radius: 3px; border-bottom-right-radius: 3px;
    cursor: pointer;
    z-index: 96;
}
.zcms-form button[type='button']:hover { color: #fff; background: var(--zcms-deep-color); }
.zcms-form button[type='button'] i {
    display: inherit;
    margin: 0px 4px 0px 0px; padding: 4px 0px 0px; width: 28px; height: inherit;
    overflow: hidden;
    font-size: 1.80rem; align-items: inherit;
    opacity: 0.88;
    filter: alpha(opacity=88); -moz-opacity: 0.88; -webkit-opacity: 0.88;
    box-sizing: border-box;
}
.zcms-form a.maps {
    display: flex; position: absolute; top: 20px; right: 156px;
    margin: 0px; padding: 0px 8px 0px 16px; width: 72px; height: 24px;
    font-size: 1.16rem; color: #999; font-weight: var(--zcms-font-fine-bold);
    align-items: center; justify-content: center;
    box-sizing: border-box;
}
.zcms-form a.maps i {
    display: inherit; position: absolute; top: 0px; left: 0px;
    margin: 0px; padding: 2px 0px 0px; width: 20px; height: inherit;
    font-size: 1.24rem; align-items: inherit; box-sizing: border-box;
}
.zcms-form a.maps:hover { color: var(--zcms-main-color); text-decoration: none; }

.zcms-form p.roll {
    position: absolute; top: 16px; left: 20px; margin: 0px; padding: 0px;
    width: calc(100% - 156px - 72px - 32px); height: 32px; overflow: hidden;
    color: #999; font-size: 1.24rem;
    user-select: none; -moz-user-select: none; -webkit-user-select: none;
    box-sizing: border-box;
    z-index: -2;
}
.zcms-form p.roll span {
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
    margin: 0px; padding: 0px 0px 2px;
}
.zcms-form p.roll font {
    display: block; height: 32px; line-height: 32px;
    text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
    box-sizing: border-box;
}

.zcms-form dl,
.zcms-form ul {
    display: none; position: absolute; top: 60px; left: 0px;
    margin: 0px; padding: 10px 16px; width: calc(100% - 156px + 3px); height: auto;
    background: #fff; border: solid 3px #ccc; border-top: none;
    border-bottom-right-radius: 3px; border-bottom-left-radius: 3px;
            transition: border-color 0.32s ease-in-out;
         -o-transition: border-color 0.32s ease-in-out;
       -moz-transition: border-color 0.32s ease-in-out;
    -webkit-transition: border-color 0.32s ease-in-out;
    z-index: 94;
}
.zcms-form dl::after,
.zcms-form ul::after {
    position: absolute; top: 1px; right: 16px; left: 16px; content: "";
    height: 3px; background: #f3f3f3;
    z-index: 6;
}
.zcms-form dl.focus,
.zcms-form ul.focus { border-color: var(--zcms-main-color); }

.zcms-form dt {
    position: relative; clear: both; height: 38px;
    line-height: 38px; font-size: 1rem; color: #666; font-weight: 100;
    z-index: 996;
}
.zcms-form dt.last::before {
    position: absolute; bottom: 0px; left: 0px; content: "";
    width: 56px; border-bottom: solid 2px var(--zcms-main-color);
    z-index: 0;
}
.zcms-form dt.last::after {
    position: absolute; right: 0px; bottom: 0px; left: 0px; content: "";
    border-bottom: solid 1px #f9f9f9;
    z-index: -1;
}
.zcms-form dt span { float: right; font-size: 0.88rem; color: #ccc; }
.zcms-form dd {
    float: left; margin: 2px 8px 2px 0px; padding: 4px 0px;
    width: calc(50% - 4px); height: 34px; line-height: 26px; font-size: 1rem;
    text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
}
.zcms-form dd:nth-child(odd) { margin: 0px; }
.zcms-form dd span {
    display: inline-block; margin: 0px 8px 0px 0px; padding: 0px 4px; height: 26px;
    font-size: 0.88rem; background: #f6f6f6; border-radius: 2px;
}
.zcms-form dd a {
    display: block;
    text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
}
.zcms-form dd.focus a { color: var(--zcms-high-color); }
.zcms-form dd.focus a,
.zcms-form dd a:hover {
    text-decoration: none;
    background: url(../image/background/hot.gif) left top; border-radius: 2px;
}
.zcms-form dd:hover span,
.zcms-form dd.focus span { background: #f0f0f0; }

.zcms-form dd:nth-child(-n + 5) span { color: #fff; background: var(--zcms-main-color); }

.zcms-form dd.keys {
    margin: 0px 16px 0px 0px; width: auto; height: 38px; line-height: 30px;
}
.zcms-form dd.keys:nth-child(odd) { margin-right: 16px; }
.zcms-form dd.keys a { position: relative; font-size: 1rem; }
.zcms-form dd.keys a::after {
    position: absolute; right: 0px; bottom: 0px; left: 0px; content: "";
    border-bottom: solid 2px #f6f6f6;
            transition: all 0.32s ease-in-out;
         -o-transition: all 0.32s ease-in-out;
       -moz-transition: all 0.32s ease-in-out;
    -webkit-transition: all 0.32s ease-in-out;
}
.zcms-form dd.keys a:hover { background: none; border-radius: 0px; }
.zcms-form dd.keys a:hover::after { border-bottom-color: var(--zcms-main-color); }

.zcms-form li {
    position: relative;
    height: 38px; line-height: 38px; font-size: 1rem; color: #ccc;
    text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
    z-index: 996;
}
.zcms-form li a {
    display: inline-block;
    float: left; margin: 0px 16px 0px 0px; padding: 0px;
    max-width: calc(100% - 8px); height: inherit; line-height: inherit;
    font-size: 1.08rem; color: var(--zcms-base-color);
    text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
            transform: translateX(0px);
         -o-transform: translateX(0px);
        -ms-transform: translateX(0px);
       -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
            transition: transform 0.32s ease-in-out;
         -o-transition: transform 0.32s ease-in-out;
       -moz-transition: transform 0.32s ease-in-out;
    -webkit-transition: transform 0.32s ease-in-out;
    box-sizing: border-box;
}
.zcms-form li a font {
    margin: 0px 2px;
    color: var(--zcms-high-color); font-weight: var(--zcms-font-bold);
}
.zcms-form li:hover,
.zcms-form li.focus {
    background: url(../image/background/hot.gif) left top; z-index: 996;
}
.zcms-form li:hover::after,
.zcms-form li.focus::after {
    position: absolute; right: 0px; bottom: 0px; left: 0px; content: "";
    border-bottom: solid 1px #f0f0f0;
    z-index: 88;
}
.zcms-form li:hover a,
.zcms-form li.focus a {
    position: relative; color: var(--zcms-base-color); text-decoration: none;
            transform: translateX(8px);
         -o-transform: translateX(8px);
        -ms-transform: translateX(8px);
       -moz-transform: translateX(8px);
    -webkit-transform: translateX(8px);
}
.zcms-form li:hover a:hover,
.zcms-form li.focus a:hover { color: #000; text-decoration: none; }
.zcms-form li.focus a,
.zcms-form li.focus a:hover { color: var(--zcms-main-color); }

/* 搜索关键字 */
.zcms-keys {
    margin: 0px; padding: 0px 4px; height: 48px; line-height: 48px;
    text-align: left; color: #fff;
            text-shadow: 1px 1px 2px #333;
         -o-text-shadow: 1px 1px 2px #333;
       -moz-text-shadow: 1px 1px 2px #333;
    -webkit-text-shadow: 1px 1px 2px #333;
    box-sizing: border-box;
    z-index: 2;
}
.zcms-keys strong { color: #fff; }
.zcms-keys a { margin-right: 12px; color: #fff; }

/* 搜索关键字 */
.zcms-test {
    position: absolute; left: 284px; bottom: 148px; right: 284px;
    display: flex; flex-wrap: wrap; height: 52px; overflow: hidden;
    z-index: 96;
}
.zcms-test ul {
    margin: 4px -8px; width: calc(100% + 16px); height: 44px; overflow: hidden;
}
.zcms-test li {
    position: relative; float: left;
    margin: 0px 8px; padding: 4px; width: calc(10% - 16px); height: 44px;
    overflow: hidden;
    text-align: center;
    background: #fff; border: solid 1px #fff; border-radius: 2px;
            box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
         -o-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
       -moz-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
    opacity: 0.72;
    filter: alpha(opacity=72); -moz-opacity: 0.72; -webkit-opacity: 0.72;
    box-sizing: border-box;
}
.zcms-test li a {
    display: flex; margin: 0px auto; width: 90px; height: 32px; line-height: 1;
    align-items: center; justify-content: center;
}
.zcms-test li a:hover { color: #fff; }
.zcms-test li img {
    max-width: 90px; max-height: 32px; vertical-align: middle; border: none;
            transition: transform 0.32s ease 0s;
         -o-transition: transform 0.32s ease 0s;
       -moz-transition: transform 0.32s ease 0s;
    -webkit-transition: transform 0.32s ease 0s;
}
.zcms-test li p {
    display: flex;
    position: absolute; right: 0px; bottom: -44px; left: 0px; content: "";
    margin: 0px; padding: 0px 5px; height: 42px; font-size: 0.80rem; color: #fff;
    align-items: center; justify-content: center;
    text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
            transition: all 320ms ease 0s;
         -o-transition: all 320ms ease 0s;
       -moz-transition: all 320ms ease 0s;
    -webkit-transition: all 320ms ease 0s;
     z-index: 1;
}
.zcms-test li p::before {
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
    content: "";
    background: #333;
    opacity: 0.80;
    filter: alpha(opacity=80); -moz-opacity: 0.80; -webkit-opacity: 0.80;
    z-index: -1;
}
.zcms-test li:hover {
            box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.24);
         -o-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.24);
       -moz-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.24);
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.24);
    opacity: 0.98;
    filter: alpha(opacity=98); -moz-opacity: 0.98; -webkit-opacity: 0.98;
}
.zcms-test li:hover img {
            transform: scale(1.24);
         -o-transform: scale(1.24);
        -ms-transform: scale(1.24);
       -moz-transform: scale(1.24);
    -webkit-transform: scale(1.24);
}
.zcms-test li:hover p { bottom: 0px; }

/* 统计数据 */
.zcms-data {
    position: absolute; right: 118px; bottom: 0px; left: 118px;
    margin: 0px; padding: 0px; width: auto; height: 96px; box-sizing: border-box;
    z-index: 8;
}
.zcms-data ul {
    display: inline-block; position: relative; width: 100%; height: auto;
    text-align: center; border-radius: 2px; box-sizing: border-box;
    z-index: 8;
}
.zcms-data li {
    position: relative;
    float: left; padding-top: 20px; width: 13%; height: 96px;
    line-height: 1.56; font-size: 1.16rem; color: var(--zcms-base-color);
    border: solid 1px #f3f3f3; border-left: none; border-bottom-color: #eee;
    box-sizing: border-box;
    z-index: 2;
}
.zcms-data li::before {
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
    content: "";
    background: #fff;
            transition: box-shadow 0.32s ease;
         -o-transition: box-shadow 0.32s ease;
       -moz-transition: box-shadow 0.32s ease;
    -webkit-transition: box-shadow 0.32s ease;
    opacity: 0.48;
    filter: alpha(opacity=48); -moz-opacity: 0.48; -webkit-opacity: 0.48;
    z-index: -4;
}
.zcms-data li::after {
    position: absolute; right: 1px; bottom: 1px; left: 1px; content: "";
    width: calc(100% - 2px); height: 0px;
            transition: all 0.24s ease-in-out;
         -o-transition: all 0.24s ease-in-out;
       -moz-transition: all 0.24s ease-in-out;
    -webkit-transition: all 0.24s ease-in-out;
    z-index: -2;
}
.zcms-data li:first-child,
.zcms-data li:first-child::before,
.zcms-data li:first-child::after { border-bottom-left-radius: 2px; }
.zcms-data li:last-child {
    width: 22%; border-right: none; border-bottom-right-radius: 2px;
}
.zcms-data li:last-child::before,
.zcms-data li:last-child::after { border-bottom-right-radius: 2px; }

.zcms-data li span {
    display: block;
    padding: 2px 0px 0px 20px; font-size: 1.40rem; color: var(--zcms-main-color);
    font-weight: var(--zcms-font-full-bold);
}
.zcms-data li sup {
    position: relative; top: -10px; left: 2px; line-height: 0;
    font-size: 0.80em; font-weight: 100; vertical-align: baseline;
}
.zcms-data li sub {
    position: relative; bottom: -2px; left: -9px; line-height: 0;
    font-size: 0.80rem; color: #999; font-weight: var(--zcms-font-bold);
    vertical-align: baseline;
}
.zcms-data li strong { font-weight: var(--zcms-font-full-bold); }
.zcms-data li:last-child span {
    padding: 4px 0px 0px; font-size: 1.32rem; font-weight: var(--zcms-font-bold);
}
.zcms-data li:hover { z-index: 4; }
.zcms-data li:hover::before {
    position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
    content: "";
            box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.12);
         -o-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.12);
       -moz-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.12);
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.12);
    opacity: 0.72;
    filter: alpha(opacity=72); -moz-opacity: 0.72; -webkit-opacity: 0.72;
    z-index: -2;
}
.zcms-data li:hover::after {
    height: calc(100% - 2px); background: #e0e0e0;
    opacity: 0.12;
    filter: alpha(opacity=12); -moz-opacity: 0.12; -webkit-opacity: 0.12;
}
.zcms-data li:first-child::after { border-bottom-left-radius: 2px; }
.zcms-data li:last-child::after { border-bottom-right-radius: 2px; }

/* 默认标题 */
.zcms-tips {
    display: block; position: relative; margin: 56px auto 32px; padding: 0px;
    font-size: 2.32rem; color: var(--zcms-deep-color);
    text-align: center; font-weight: var(--zcms-font-full-bold);
            text-shadow: 1px 1px 1px #fff;
         -o-text-shadow: 1px 1px 1px #fff;
       -moz-text-shadow: 1px 1px 1px #fff;
    -webkit-text-shadow: 1px 1px 1px #fff;
}
.zcms-tips span {
    display: block; margin: 16px 0px 0px;
    font-size: 1rem; font-weight: var(--zcms-font-bold); color: #999;
}

/* 数据提示 */
.zcms-data-info-tips {
    position: relative; margin: 16px 0px 0px; padding: 0px;
    line-height: 164%; font-size: 0.80rem; text-align: center; color: #999;
}
.zcms-data-info-tips::before {
    position: absolute; top: 13px; right: 0px; left: 0px; content: "";
    border-bottom: solid 1px #fff; z-index: 2;
}
.zcms-data-info-tips::after {
    position: absolute; top: 12px; right: 0px; left: 0px; content: "";
    border-bottom: solid 1px #e9e9e9; z-index: 2;
}
.zcms-data-info-tips span {
    position: relative;
    display: inline-block; padding: 2px 28px; font-weight: var(--zcms-font-bold);
    background: #fff; border: solid 1px #f6f6f6; border-radius: 24px;
    z-index: 4;
}

/* 数据标题 */
.zcms-data-info-titt {
    position: relative; margin: 16px 0px 0px; height: 36px; line-height: 36px;
    border-bottom: solid 2px #eee;
}
.zcms-data-info-titt > h4 {
    position: absolute; top: 0px; bottom: -2px; left: 0px;
    font-size: 1.08rem;
    color: var(--zcms-base-color); font-weight: var(--zcms-font-full-bold);
    border-bottom: solid 2px var(--zcms-main-color);
}
.zcms-data-info-titt > h4 p {
    position: relative; margin: 10px 0px; padding: 0px 0px 0px 14px; height: 16px;
    line-height: 16px; letter-spacing: 0.64px;
}
.zcms-data-info-titt > h4 p::before {
    position: absolute; top: 2px; bottom: 0px; left: 0px; content: "";
    width: 4px; background: var(--zcms-base-color); border-radius: 2px;
    opacity: 0.72;
    filter: alpha(opacity=72); -moz-opacity: 0.72; -webkit-opacity: 0.72;
    z-index: 2;
}
.zcms-data-info-titt a {
    float: right; color: var(--zcms-base-color); text-decoration:none;
}
.zcms-data-info-titt a:hover {
    color: var(--zcms-main-color); text-decoration: underline;
}
.zcms-data-info-titt a img { margin: 8px 0px; max-height: 20px; }

/* 数据列表 */
.zcms-data-info-body {
    margin: 24px 0px 0px; padding: 0px 24px;
    background: #fff; border: solid 1px #f6f6f6; border-top-color: #f3f3f3;
    box-sizing: border-box;
}
.zcms-data-info-body ul { padding: 16px 0px 12px; }
.zcms-data-info-body li {
    display: flex; height: 42px; font-size: 0.96rem; align-items: center;
}
.zcms-data-info-body li a {
    float: left; width: calc(100% - 56px);
    text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
}
.zcms-data-info-body li span { float: right; color: #9999; }
.zcms-data-info-body li:nth-child(4) {
    margin-bottom: 12px; height: 54px; border-bottom: dotted 1px #ddd;
}

.zcms-data-info-side {
    position: relative;
    margin-top: -24px; padding-top: 2px; border-color: #f0f0f0; border-top: none;
}
.zcms-data-info-side::before {
    position: absolute; top: -3px; left: 0px; content: "";
    height: 3px; border-left: solid 1px #f3f3f3;
}
.zcms-data-info-side::after {
    position: absolute; top: -3px; right: 0px; content: "";
    height: 3px; border-right: solid 1px #f3f3f3;
}
.zcms-data-info-side ul { padding-top: 0px; }
.zcms-data-info-side li {
    position: relative; height: 36px; border: none; overflow: hidden;
}
.zcms-data-info-side li:nth-child(4),
.zcms-data-info-side li:nth-child(8) {
    margin-bottom: 0px; height: inherit; border-bottom: none;
}
.zcms-data-info-side li a {
    display: block; margin-right: 5px; color: #666;
            transform: translateX(0px);
         -o-transform: translateX(0px);
        -ms-transform: translateX(0px);
       -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
            transition: transform 0.32s ease-in-out;
         -o-transition: transform 0.32s ease-in-out;
       -moz-transition: transform 0.32s ease-in-out;
    -webkit-transition: transform 0.32s ease-in-out;
}
.zcms-data-info-side li a:hover {
    color: var(--zcms-main-color); text-decoration: none;
}
.zcms-data-info-side li span {
    position: absolute; top: 8px; right: 0px;
    display: flex; padding: 0px 5px 0.88px; height: 20px;
    font-size: 0.88rem; color: var(--zcms-main-color); font-style: normal;
    align-items: center; background: #f9f9f9; border-radius: 2px;
}
.zcms-data-info-side li span:hover {
    background: var(--zcms-main-color); color: #fff; cursor: pointer;
}
.zcms-data-info-side li::before {
    position: absolute; top: 11.24px; left: 0px; content: "";
    width: 4px; height: 14px; background: #e0e0e0;
            transform: translateX(-4px);
         -o-transform: translateX(-4px);
        -ms-transform: translateX(-4px);
       -moz-transform: translateX(-4px);
    -webkit-transform: translateX(-4px);
            transition: transform 0.32s ease-in-out;
         -o-transition: transform 0.32s ease-in-out;
       -moz-transition: transform 0.32s ease-in-out;
    -webkit-transition: transform 0.32s ease-in-out;
}
.zcms-data-info-side li:hover::before {
            transform: translateX(0px);
         -o-transform: translateX(0px);
        -ms-transform: translateX(0px);
       -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
}
.zcms-data-info-side li:hover a {
            transform: translateX(10px);
         -o-transform: translateX(10px);
        -ms-transform: translateX(10px);
       -moz-transform: translateX(10px);
    -webkit-transform: translateX(10px);
}

.zcms-data-info-imgr { height: auto; }
.zcms-data-info-imgr li {
    position: relative; width: 100%; height: 96px; overflow: hidden;
    border-bottom: solid 1px #f6f6f6;
}
.zcms-data-info-imgr li::before {
    position: absolute; top: 0px; bottom: 0px; left: 0px; content: "";
    width: 4px; height: 96px; background: #e0e0e0;
            transform: translateX(-4px);
         -o-transform: translateX(-4px);
        -ms-transform: translateX(-4px);
       -moz-transform: translateX(-4px);
    -webkit-transform: translateX(-4px);
            transition: transform 0.32s ease-in-out;
         -o-transition: transform 0.32s ease-in-out;
       -moz-transition: transform 0.32s ease-in-out;
    -webkit-transition: transform 0.32s ease-in-out;
}
.zcms-data-info-imgr li img {
    position: absolute; top: 16px; right: 0px; overflow: hidden;
    padding: 0px; width: 64px; height: 64px;
    border: solid 1px #f3f3f3; border-radius: 4px;
    opacity: 0.88;
    filter: alpha(opacity=88); -moz-opacity: 0.88; -webkit-opacity: 0.88;
            transition: opacity 0.32s ease-in-out;
         -o-transition: opacity 0.32s ease-in-out;
       -moz-transition: opacity 0.32s ease-in-out;
    -webkit-transition: opacity 0.32s ease-in-out;
    box-sizing: border-box;
}
.zcms-data-info-imgr li > a { width: auto; }
.zcms-data-info-imgr li > a.logo {
    display: inline-flex;
    position: absolute; top: 16px; right: 0px; overflow: hidden;
    position: 0px; width: 64px; height: 64px; align-items: center;
    border: solid 1px #f3f3f3; border-radius: 4px;
}
.zcms-data-info-imgr li > a.logo img {
    top: auto; right: auto; left: calc(0px - (116px - 100%) / 2);
    max-width: 116px; width: auto; height: auto; border: none;
}
.zcms-data-info-imgr li h5 {
    position: relative;
    margin: 0px; padding: 4px 0px; width: 100%; height: auto; line-height: 1.32;
    font-size: 1.08rem; color: #666; font-weight: var(--zcms-font-bold);
    text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
}
.zcms-data-info-imgr li h5 a { width: 100%; }
.zcms-data-info-imgr li h5 a:hover { text-decoration: none; }

.zcms-data-info-imgr li p {
    margin: 0px; width: 100%; line-height: 172%; overflow: hidden;
    font-size: 0.80rem; color: #999;
}
.zcms-data-info-imgr li div {
    margin: 0px; padding: 0px; width: calc(100% - 80px);
            transform: translateX(0px);
         -o-transform: translateX(0px);
        -ms-transform: translateX(0px);
       -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
            transition: transform 0.32s ease-in-out;
         -o-transition: transform 0.32s ease-in-out;
       -moz-transition: transform 0.32s ease-in-out;
    -webkit-transition: transform 0.32s ease-in-out;
}
.zcms-data-info-imgr li:hover { background: url(../image/background/hot.gif) left top; }
.zcms-data-info-imgr li:hover::before {
            transform: translateX(0px);
         -o-transform: translateX(0px);
        -ms-transform: translateX(0px);
       -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
}
.zcms-data-info-imgr li:hover img {
    opacity: 0.96;
    filter: alpha(opacity=96); -moz-opacity: 0.96; -webkit-opacity: 0.96;
}
.zcms-data-info-imgr li:hover div {
            transform: translateX(14px);
         -o-transform: translateX(14px);
        -ms-transform: translateX(14px);
       -moz-transform: translateX(14px);
    -webkit-transform: translateX(14px);
}
.zcms-data-info-imgr li:first-child:hover { position: relative; }
.zcms-data-info-imgr li:first-child:hover::after {
    position: absolute; top: 0px; right: 0px; left: 0px; content: "";
    border-top: solid 1px #f6f6f6;
}
.zcms-data-info-imgr li:nth-child(4),
.zcms-data-info-imgr li:nth-child(8),
.zcms-data-info-imgr li:last-child {
    margin-bottom: 0px; height: 90px; border-bottom-color: #fff;
}
.zcms-data-info-imgr li:last-child:hover { border-bottom-color: #f6f6f6; }

.zcms-data-info-imgr li.no-logo h5,
.zcms-data-info-imgr li.no-logo p,
.zcms-data-info-imgr li.no-logo div { width: calc(100% - 8px); }

/* 弹窗样式 */
.zcms-view-show {
    display: none; position: fixed; top: 0px; left: 0px; content: "";
    width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.64); border-radius: 4px;
    z-index: 999;
}
.zcms-view-show > div {
    position: absolute; background: #fff; border-radius: 4px;
}
.zcms-view-show > div img {
    border: 8px solid #fcfcfc; border-radius: 4px;
            box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.80);
         -o-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.80);
       -moz-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.80);
    -webkit-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.80);
}