@charset "utf-8";
/*
 *Last modified: 2022-06-27 21:29:39
 *Filename: ax-response.css
 *Description: Global CSS
 *Version: v2.0.0Beta
 *Website:www.axui.cn or ax.hobly.cn
 *Contact:3217728223@qq.com
 *Author:Michael
 */
/*x1 screen,PC devices*/
@media screen and (-webkit-max-device-pixel-ratio: 1.1), (max-device-pixel-ratio: 1.1) {
    /*scrollbar*/
    ::-webkit-scrollbar {
        width: 10px;
        height: 10px;
        background: transparent;
    }
    ::-webkit-scrollbar-track {
        background-color: rgba(0, 0, 0, 0.04);
    }
    ::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0.3);
    }
    ::-webkit-scrollbar-thumb:hover {
        background-color: rgba(0, 0, 0, 0.4);
    }
    ::-webkit-scrollbar-corner {
        background-color: rgba(0, 0, 0, 0.04);
    }
    body {
        scrollbar-arrow-color: #b3b3b3;
        scrollbar-face-color: #b3b3b3;
        scrollbar-3dlight-color: #b3b3b3;
        scrollbar-highlight-color: #f0f0f0;
        scrollbar-shadow-color: #b3b3b3;
        scrollbar-darkshadow-color: #b3b3b3;
        scrollbar-track-color: #f0f0f0;
        scrollbar-base-color: #f0f0f0;
    }
}
/*x2 & x3 screen,Mobile devices*/
@media screen and (-webkit-min-device-pixel-ratio: 1.8), (min-device-pixel-ratio: 1.8) {
    /*global*/
    html {
        font-size: calc(160px/14);
    }
    body {
        font-family: "Arial", "Helvetica Neue", "sans-serif", "pingfang SC", "Hiragino Sans GB", "微软雅黑", "microsoft yahei", "宋体", "simsun";
        color: #000;
        line-height: 2.2rem;
    }
    .ax-box-body.ax-padding.ax-xl {
        padding-top: 0;
    }
    .ax-gutter-line {
        -webkit-transform: scaleX(0.5);
        transform: scaleX(0.5);
    }
    .ax-break-line {
        -webkit-transform: scaleY(0.5);
        transform: scaleY(0.5);
    }
    /**/
    input,
    textarea,
    select,
    button {
        font-family: "Arial", "Helvetica Neue", "sans-serif", "pingfang SC", "Hiragino Sans GB", "微软雅黑", "microsoft yahei", "宋体", "simsun";
    }
    a {
        color: #000;
        text-decoration: none;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    }
    a:hover {
        color: #000;
        text-decoration: none !important;
    }
    a:active {
        text-decoration: none !important;
    }
    /*button*/
    .ax-btn.ax-primary:not(.ax-line),
    .ax-btn.ax-secondary:not(.ax-line),
    .ax-btn.ax-success:not(.ax-line),
    .ax-btn.ax-danger:not(.ax-line),
    .ax-btn.ax-warning:not(.ax-line),
    .ax-btn.ax-ad:not(.ax-line),
    .ax-btn.ax-info:not(.ax-line),
    .ax-btn.ax-black:not(.ax-line) {
        border-width: 0;
    }
    .ax-btn.ax-primary:not(.ax-line):after,
    .ax-btn.ax-secondary:not(.ax-line):after,
    .ax-btn.ax-success:not(.ax-line):after,
    .ax-btn.ax-danger:not(.ax-line):after,
    .ax-btn.ax-warning:not(.ax-line):after,
    .ax-btn.ax-ad:not(.ax-line):after,
    .ax-btn.ax-info:not(.ax-line):after,
    .ax-btn.ax-black:not(.ax-line):after {
        border-width: 0;
    }
    .ax-btn-group .ax-btn:not(.ax-line) {
        border-width: 1px;
    }
    .ax-btn-group .ax-btn:not(.ax-line):after {
        border-width: 1px;
    }
}
/*x3 screen,Mobile devices*/
@media screen and (-webkit-min-device-pixel-ratio: 2.4), (min-device-pixel-ratio: 2.4) {
    /*global*/
    .ax-gutter-line {
        -webkit-transform: scaleX(0.3333);
        transform: scaleX(0.3333);
    }
    .ax-break-line {
        -webkit-transform: scaleY(0.3333);
        transform: scaleY(0.3333);
    }
}
/*Telephone & iPad*/
@media screen and (max-width: 900px) {
    /*global*/
    .ax-hide-tel {
        display: none !important;
    }
    .ax-border-tel {
        border: 1px solid #ebebeb;
        background-color: #fff;
    }
    .ax-margin-tel {
        margin: 1.4rem;
        box-sizing: border-box;
    }
    .ax-padding-tel {
        padding: 1.4rem;
        box-sizing: border-box;
    }
    .ax-radius-tel {
        border-radius: 0.3rem;
    }
    .ax-iconfont:before {
        top: 0;
    }
    /*overflow*/
    .ax-overflow {
        position: relative;
    }
    .ax-overflow.ax-done .ax-inner {
        padding-right: 3.8rem;
    }
    .ax-overflow .ax-inner {
        width: 100%;
        box-sizing: border-box;
        overflow-y: hidden;
        overflow-x: auto;
    }
    .ax-overflow:before {
        content: '\203A';
        font-size: 2.2rem;
        color: #198cff;
        width: 4.4rem;
        height: 100%;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        box-sizing: border-box;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0), #ffffff);
        position: absolute;
        top: 0;
        right: 0;
        display: none;
    }
    .ax-overflow.ax-done:before {
        display: flex;
        animation: ax-overflow 1s linear infinite;
    }
    @keyframes ax-overflow {
        0% {
            text-indent: 2.8rem;
        }
        50% {
            text-indent: 3.6rem;
        }
        100% {
            text-indent: 2.8rem;
        }
    }
    /*header*/
    .ax-space-header {
        height: 4.4rem;
    }
    .ax-header .ax-logo {
        height: 4.4rem;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }
    .ax-header .ax-logo img {
        max-width: 11rem;
        max-height: 4.4rem;
    }
    .ax-header .ax-row {
        padding: 0 0.6rem;
    }
    .ax-header .ax-col {
        text-align: center;
    }
    .ax-header .ax-nav {
        display: none;
    }
    .ax-header span[class*="-open"],
    .ax-header a[class*="-open"] {
        display: inline-block;
        color: #475b66;
        font-size: 1.8rem;
        text-align: center;
        width: calc(4.4rem - 1rem);
        height: calc(4.4rem - 1rem);
        line-height: calc(4.4rem - 1rem + 0.3rem);
        margin: 0.5rem auto;
        position: relative;
        transition: all 100ms linear;
    }
    .ax-header .ax-image {
        display: inline-block;
        border-radius: 100%;
        height: 2.8rem;
        width: 2.8rem;
        background-repeat: no-repeat;
        background-size: cover;
        margin: calc((4.4rem - 2.8rem)/2) calc((4.4rem - 1rem - 2.8rem)/2);
        position: relative;
    }
    .ax-header *[class*="-open"].open_logo {
        border-radius: 0;
        height: 4.4rem;
        width: auto;
        position: inherit;
        top: 0;
    }
    .ax-header *[class*="-open"].open_logo img {
        height: 4.4rem;
    }
    .ax-header *[class*="-open"] .ax-badge {
        position: absolute;
        top: 0;
        right: -0.2rem;
    }
    .ax-header *[class*="-open"] .ax-dot {
        position: absolute;
        top: 0.4rem;
        right: 0.4rem;
    }
    .ax-header .ax-back {
        width: 4.4rem;
        height: 4.4rem;
        line-height: 4.4rem;
        margin-left: -0.6rem;
    }
    .ax-header .ax-back:after {
        display: none;
    }
    .ax-header .ax-back + .ax-col {
        text-align: left;
    }
    .ax-header .ax-resemble {
        width: calc(100% - 1.6rem);
        height: 2.8rem;
        line-height: 2.8rem;
        margin: calc((4.4rem - 2.8rem)/2) calc((4.4rem - 2.8rem)/2);
    }
    .ax-header .ax-resemble input {
        font-size: 1.2rem;
        border: none;
        background-color: #f5f5f5;
        border-radius: 2.8rem;
    }
    .ax-header .ax-resemble *[class*="search"] {
        height: 2.8rem;
        line-height: 2.8rem;
    }
    .ax-header .ax-resemble *[class*="search"]:after {
        display: none;
    }
    .ax-header .ax-resemble .ax-mask {
        display: block;
    }
    .ax-header .ax-title {
        height: 4.4rem;
    }
    .ax-header .ax-back + .ax-col .ax-title,
    .ax-header .ax-open + .ax-col .ax-title {
        padding: 0;
    }
    .ax-header .ax-title .ax-row02 {
        font-size: 1rem;
    }
    /*footer*/
    .ax-footer .ax-operate,
    .ax-footer .ax-copyright {
        text-align: center;
        font-size: 1.2rem;
        line-height: 1.8rem;
    }
    .ax-footer .ax-operate {
        margin: 1.4rem 0;
    }
    .ax-footer .ax-operate a {
        margin: 0 0.8rem !important;
    }
    .ax-footer .ax-operate a.ax-icon {
        margin: 0 0.8rem !important;
    }
    .ax-footer .ax-operate a[class*="font"] {
        margin: 0 0.8rem !important;
    }
    .ax-footer .ax-copyright img {
        max-height: 1.8rem;
    }
    /*btmnav btmbtn*/
    .ax-btmnav,
    .ax-space-btmnav,
    .ax-btmbtn,
    .ax-space-btmbtn {
        display: block;
    }
    /*grade*/
    .ax-grade .ax-outer {
        display: block;
        width: calc(100% - 1.4rem*2) !important;
        max-height: calc(100% - 8.8rem - 1.4rem*2);
        overflow-y: auto;
        overflow-x: hidden;
        background-color: #fff;
        border-radius: 0.3rem !important;
        transform: translate(-50%, -50%) !important;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
        position: fixed;
        left: 500% !important;
        right: auto !important;
        top: 50% !important;
        z-index: 5;
    }
    .ax-grade ul.ax-outer ul {
        display: block;
        border-radius: 0;
        border: none;
    }
    .ax-grade:hover .ax-outer,
    .ax-grade.ax-right:hover .ax-outer {
        left: 50% !important;
    }
    .ax-grade ul.ax-outer li ul {
        display: block;
        border: 0;
        border-top: 1px solid #ebebeb;
        transform: none;
        position: inherit;
        top: auto;
        right: auto;
    }
    .ax-grade ul.ax-outer li *[class*="-right"] {
        transform: rotate(90deg);
    }
    .ax-grade ul.ax-outer a {
        padding: 0 1.4rem;
    }
    .ax-grade ul.ax-outer > li > ul > li > a {
        padding-left: calc(1.4rem*3);
    }
    .ax-grade ul.ax-outer > li > ul > li > ul > li > a {
        padding-left: calc(1.4rem*5);
    }
    .ax-grade ul.ax-outer > li > ul > li > ul > li > ul > li > a {
        padding-left: calc(1.4rem*7);
    }
    .ax-grade ul.ax-outer > li > ul > li > ul > li > ul > li > ul > li > a {
        padding-left: calc(1.4rem*9);
    }
    /*step*/
    /*form*/
    .ax-form-group {
        padding: 0 1.4rem;
    }
    .ax-padding-lr .ax-form-group,
    .ax-padding .ax-form-group {
        padding-left: 0;
        padding-right: 0;
    }
    .ax-form-con {
        flex: auto;
        width: 0;
    }
    .ax-form-input {
        width: 100%;
    }
    .ax-form-label {
        width: 7rem;
        text-align: left;
        justify-content: flex-start;
        margin-right: 0;
    }
    /*fit tel*/
    .ax-fit-tel .ax-btn.ax-circle,
    .ax-fit-tel .ax-btn.ax-circle:after {
        padding: 0;
    }
    .ax-fit-tel .ax-form-group {
        padding: 0.5rem 1.4rem;
    }
    .ax-fit-tel .ax-pos-right {
        right: -1rem;
    }
    .ax-fit-tel .ax-form-label {
        width: 6rem;
    }
    .ax-fit-tel input[type="text"],
    .ax-fit-tel input[type="number"],
    .ax-fit-tel input[type="password"],
    .ax-fit-tel input[type="file"],
    .ax-fit-tel select,
    .ax-fit-tel textarea {
        border: 0rem;
    }
    .ax-fit-tel input[type="text"]:not([readonly]):not([class*='ax-check']),
    .ax-fit-tel input[type="text"][readonly].mbsc-comp,
    .ax-fit-tel input[type="number"]:not([readonly]):not([class*='ax-check']),
    .ax-fit-tel input[type="password"]:not([readonly]):not([class*='ax-check']),
    .ax-fit-tel input[type="file"]:not([readonly]):not([class*='ax-check']),
    .ax-fit-tel textarea:not([readonly]):not([class*='ax-check']) {
        padding-left: 0;
        padding-right: 0;
    }
    .ax-fit-tel input[type="text"]:focus,
    .ax-fit-tel input[type="number"]:focus,
    .ax-fit-tel input[type="password"]:focus,
    .ax-fit-tel input[type="file"]:focus,
    .ax-fit-tel select:focus,
    .ax-fit-tel textarea:focus {
        border: 0rem;
        box-shadow: none;
    }
    .ax-fit-tel .ax-file-btn {
        border-radius: 0.3rem;
    }
    .ax-fit-tel .ax-bunch-txt:last-child {
        margin-right: 0;
    }
    .ax-fit-tel .ax-form-img:before {
        display: none;
    }
    .ax-fit-tel .ax-form-img a,
    .ax-fit-tel .ax-form-img span,
    .ax-fit-tel .ax-form-img i {
        margin: 0;
    }
    .ax-fit-tel .ax-pos-left {
        padding-left: 0;
    }
    .ax-fit-tel .ax-input-group .ax-title {
        height: 3.8rem;
        line-height: 3.8rem;
        background: none;
        justify-content: flex-start;
        text-align: left;
        padding-left: 0;
    }
    .ax-fit-tel .ax-input-group .ax-title:before,
    .ax-fit-tel .ax-input-group .ax-title:after {
        display: none;
    }
    .ax-fit-tel .ax-form-btn,
    .ax-fit-tel .ax-form-btn:hover {
        color: #333333;
        background: transparent;
        border-radius: 0;
        padding: 0 1.4rem;
        margin-right: -1.4rem;
        margin-left: 1.4rem;
    }
    .ax-fit-tel .ax-form-btn [class*="font"],
    .ax-fit-tel .ax-form-btn:hover [class*="font"] {
        color: #333333;
    }
    .ax-fit-tel .ax-form-btn:before {
        content: '';
        width: 1px;
        height: 1.4rem;
        margin-top: calc(-1.4rem/2);
        background-color: #ebebeb;
        position: absolute;
        top: 50%;
        left: 0;
    }
    .ax-fit-tel .ax-form-btn:after {
        display: none;
    }
    .ax-fit-tel .ax-form-btn:hover,
    .ax-fit-tel .ax-form-btn:focus {
        background: transparent;
        box-shadow: none;
    }
    .ax-fit-tel .ax-form-btn.ax-btn-primary,
    .ax-fit-tel .ax-form-btn.ax-btn-primary [class*="font"],
    .ax-fit-tel .ax-form-btn.ax-btn-primary svg {
        color: #198cff;
        fill: #198cff;
    }
    .ax-fit-tel .ax-form-btn.ax-btn-secondary,
    .ax-fit-tel .ax-form-btn.ax-btn-secondary [class*="font"],
    .ax-fit-tel .ax-form-btn.ax-btn-secondary svg {
        color: #475b66;
        fill: #475b66;
    }
    .ax-fit-tel .ax-form-btn.ax-btn-danger,
    .ax-fit-tel .ax-form-btn.ax-btn-danger [class*="font"],
    .ax-fit-tel .ax-form-btn.ax-btn-danger svg {
        color: #dc3545;
        fill: #dc3545;
    }
    .ax-fit-tel .ax-form-btn.ax-btn-success,
    .ax-fit-tel .ax-form-btn.ax-btn-success [class*="font"],
    .ax-fit-tel .ax-form-btn.ax-btn-success svg {
        color: #41a358;
        fill: #41a358;
    }
    .ax-fit-tel .ax-form-btn.ax-btn-warning,
    .ax-fit-tel .ax-form-btn.ax-btn-warning [class*="font"],
    .ax-fit-tel .ax-form-btn.ax-btn-warning svg {
        color: #ffc107;
        fill: #ffc107;
    }
    .ax-fit-tel .ax-form-btn.ax-btn-info,
    .ax-fit-tel .ax-form-btn.ax-btn-info [class*="font"],
    .ax-fit-tel .ax-form-btn.ax-btn-info svg {
        color: #14ccc9;
        fill: #14ccc9;
    }
    .ax-fit-tel .ax-form-btn.ax-btn-ad,
    .ax-fit-tel .ax-form-btn.ax-btn-ad [class*="font"],
    .ax-fit-tel .ax-form-btn.ax-btn-ad svg {
        color: #ff8400;
        fill: #ff8400;
    }
    .ax-fit-tel .ax-form-input + .ax-strength {
        margin-top: -0.2rem;
        margin-bottom: 0;
        padding: 0;
    }
    .ax-fit-tel .ax-radio,
    .ax-fit-tel .ax-checkbox {
        font-size: 1.6rem;
    }
    .ax-fit-tel .ax-select:not(.ax-open) .ax-select-inner {
        border-color: transparent;
    }
    .ax-fit-tel .ax-amount {
        border: none;
    }
    .ax-fit-tel .ax-amount [decrease],
    .ax-fit-tel .ax-amount [increase] {
        width: 3.8rem;
        line-height: calc(3.8rem, - 0.2rem);
        border-radius: 3.8rem;
        border: 1px solid #e0e0e0;
    }
    .ax-fit-tel .ax-amount input:not([readonly]):not([disabled]):focus {
        box-shadow: none;
    }
    .ax-fit-tel .ax-input-group .ax-operate,
    .ax-fit-tel .ax-input-group .ax-operate:after {
        border-radius: 0.3rem;
    }
    .ax-fit-tel .ax-file:before {
        border: none;
        padding-left: 0;
        padding-right: 0;
    }
    .ax-fit-tel .ax-file.ax-focus:before {
        box-shadow: none;
    }
    .ax-fit-tel .ax-file:after {
        display: none;
    }
    /*tab*/
    .ax-tab,
    .ax-tab .ax-tab-nav {
        text-align: center;
    }
    .ax-tab-content {
        text-align: left;
    }
    /*plugins*/
    /*popup*/
    .ax-popup {
        max-width: calc(100vw - 1.4rem*2) !important;
    }
    .ax-popup-content {
        max-width: 100% !important;
    }
    .ax-popup .ax-popup-body {
        max-height: calc(100vh - 1.4rem*2);
    }
    /*pagination*/
    .ax-pagination {
        text-align: center !important;
    }
    .ax-pagination * {
        display: none;
    }
    .ax-pagination a.ax-next,
    .ax-pagination a.ax-prev {
        display: inline-block;
        padding: 1.1rem 1.4rem;
    }
    .ax-pagination a * {
        display: inline-block;
    }
    /*audio*/
    .ax-aplayer.aplayer-bottom .aplayer-body {
        padding: 0 0.8rem;
        width: 100%;
    }
    .ax-aplayer.aplayer-bottom .aplayer-list {
        width: 100%;
        border-left: 0;
        border-right: 0;
        bottom: 4.9rem;
        right: 0;
    }
    /*message*/
    .ax-message {
        width: 100% !important;
    }
    .ax-message[data-position*="center-"],
    .ax-message[data-position*="right-"] {
        left: 0;
        right: auto;
        transform: translateX(0);
    }
    .ax-message[data-position="center-center"] {
        transform: translate(0, -50%);
    }
    /*scrollnav*/
    .ax-scrollnav-v {
        background-color: rgba(255, 255, 255, 0.9);
        border: 1px solid #ebebeb;
        border-radius: 0.3rem;
        top: auto;
        bottom: 1.4rem;
    }
    .ax-scrollnav-v .ax-close {
        top: calc(-3.8rem - 1.4rem);
        bottom: auto;
    }
}
/* more than Telephone+pad*/
/*pc+Laptop+iPad rotate+iPadpro*/
@media screen and (min-width: 900px) {
    /*global*/
}
/*Telephone+iPad rotate+iPad*/
/*Telephone*/
@media screen and (max-width: 500px) {
    /*global*/
    /*break gutter*/
    .ax-break-lg,
    .ax-break-xl,
    .ax-break-xxl {
        height: 1.4rem;
    }
    .ax-gutter-lg,
    .ax-gutter-xl,
    .ax-gutter-xxl {
        width: 1.4rem;
    }
    /*layout grid space*/
    .ax-grid.ax-space-lg,
    .ax-grid.ax-space-xl,
    .ax-grid.ax-space-xxl {
        margin: calc(-1.4rem/2) auto;
    }
    .ax-grid.ax-space-lg .ax-grid-inner,
    .ax-grid.ax-space-xl .ax-grid-inner,
    .ax-grid.ax-space-xxl .ax-grid-inner {
        margin: auto calc(-1.4rem/2);
    }
    .ax-grid.ax-space-lg .ax-grid-block,
    .ax-grid.ax-space-xl .ax-grid-block,
    .ax-grid.ax-space-xxl .ax-grid-block {
        padding: calc(1.4rem/2) calc(1.4rem/2);
    }
    /*layout grid split*/
    .ax-row[class*="ax-split"],
    .ax-flex-row[class*="ax-split"],
    .ax-flex-col[class*="ax-split"] {
        display: block;
    }
    .ax-row[class*="ax-split"]:after,
    .ax-flex-row[class*="ax-split"]:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    .ax-row.ax-split > .ax-col,
    .ax-flex-row.ax-split > *[class*="ax-flex-block"],
    .ax-row.ax-split-1 > .ax-col,
    .ax-flex-row.ax-split-1 > *[class*="ax-flex-block"] {
        width: 100%;
    }
    .ax-row[class*="ax-split"] *[class*="ax-gutter"] {
        display: none;
    }
    .ax-row.ax-split-2 > .ax-col,
    .ax-flex-row.ax-split-2 > *[class*="ax-flex-block"] {
        width: 50%;
        float: left;
    }
    .ax-row.ax-split-3 > .ax-col,
    .ax-flex-row.ax-split-3 > *[class*="ax-flex-block"] {
        width: 33.33%;
        float: left;
    }
    .ax-row.ax-split-4 > .ax-col,
    .ax-flex-row.ax-split-4 > *[class*="ax-flex-block"] {
        width: 25%;
        float: left;
    }
    .ax-row.ax-split-5 > .ax-col,
    .ax-flex-row.ax-split-5 > *[class*="ax-flex-block"] {
        width: 20%;
        float: left;
    }
    .ax-row.ax-split-6 > .ax-col,
    .ax-flex-row.ax-split-6 > *[class*="ax-flex-block"] {
        width: 16.66%;
        float: left;
    }
    .ax-grid.ax-split .ax-grid-block,
    .ax-grid.ax-split-1 .ax-grid-block,
    .ax-grid-table.ax-split .ax-grid-block,
    .ax-grid-table.ax-split-1 .ax-grid-block {
        width: 100%;
    }
    .ax-grid.ax-split-2 .ax-grid-block,
    .ax-grid-table.ax-split-2 .ax-grid-block {
        width: 50%;
    }
    .ax-grid.ax-split-3 .ax-grid-block,
    .ax-grid-table.ax-split-3 .ax-grid-block {
        width: 33.33%;
    }
    .ax-grid.ax-split-4 .ax-grid-block,
    .ax-grid-table.ax-split-4 .ax-grid-block {
        width: 25%;
    }
    .ax-grid.ax-split-5 .ax-grid-block,
    .ax-grid-table.ax-split-5 .ax-grid-block {
        width: 20%;
    }
    .ax-grid.ax-split-6 .ax-grid-block,
    .ax-grid-table.ax-split-6 .ax-grid-block {
        width: 16.66%;
    }
    /*table*/
    .ax-table {
        font-size: 1.2rem;
    }
    .ax-table th {
        font-size: 1.2rem;
    }
    /*statistics*/
    .ax-statistics .ax-item {
        width: 100% !important;
        box-sizing: border-box;
    }
    .ax-statistics .ax-item .ax-title {
        font-size: 1.2rem;
        line-height: 1.8rem;
    }
    .ax-statistics .ax-item .ax-text {
        font-size: 2.2rem;
        line-height: 2.8rem;
    }
    .ax-statistics .ax-item .ax-image {
        width: 3.8rem;
        height: 3.8rem;
    }
    .ax-statistics .ax-item .ax-font01 {
        font-size: 3.8rem;
        line-height: 3.8rem;
    }
    .ax-statistics.ax-grid .ax-item .ax-image {
        margin-left: 1.4rem;
        margin-right: 0;
    }
    .ax-statistics .ax-item .ax-font03 {
        font-size: 1.2rem;
        line-height: calc(3.8rem/2);
    }
    .ax-statistics.ax-grid .ax-item .ax-font03 {
        margin: 0;
    }
    .ax-statistics.ax-grid .ax-item *:first-child.ax-font01 {
        margin-left: 1.4rem;
    }
    .ax-statistics .ax-item .ax-icon {
        width: 3.8rem;
        height: 3.8rem;
        line-height: 3.8rem;
    }
    .ax-statistics.ax-grid .ax-item .ax-icon {
        font-size: 1.8rem;
        margin-left: 1.4rem;
        margin-right: 0;
    }
    .ax-statistics .ax-item .ax-font02 .ax-row01 {
        font-size: calc(3.8rem - 1.8rem);
        line-height: calc(3.8rem - 1.8rem);
    }
    .ax-statistics .ax-item .ax-image .ax-badge,
    .ax-statistics .ax-item .ax-icon .ax-badge,
    .ax-statistics .ax-item .ax-font01 .ax-badge {
        right: -0.6rem;
    }
    .ax-statistics .ax-item .ax-text .ax-arrow {
        font-size: 0.8rem;
        line-height: 1.2rem;
        right: -3rem;
    }
    /*article*/
    .ax-article ul,
    .ax-article ol {
        padding-left: calc(1.4rem*2);
    }
    /*comment*/
    .ax-comment .ax-item .ax-avatar {
        width: 2.8rem;
        height: 2.8rem;
        margin-right: 0.8rem;
    }
    /*flag*/
    .ax-flag {
        font-size: 0.8rem;
        width: 3rem;
        height: 3rem;
    }
    .ax-flag i {
        height: 5rem;
        width: 5rem;
        line-height: 8.6rem;
    }
    .ax-flag.ax-left i {
        top: -2.8rem;
        left: -2.8rem;
    }
    .ax-flag.ax-right i {
        top: -2.8rem;
        right: -2.8rem;
    }
    /*badge*/
    .ax-badge {
        font-size: 0.8rem;
        line-height: 1.4rem;
        height: 1.4rem;
    }
    .ax-dot {
        width: 0.6rem;
        height: 0.6rem;
    }
    /*info block*/
    .ax-info-block .ax-img {
        height: 8.4rem;
        width: calc(8.4rem + 2.8rem);
    }
    .ax-info-block .ax-num {
        font-size: 1rem;
        min-width: 1.4rem;
        height: 1.4rem;
        line-height: 1.4rem;
        margin-top: calc((2.2rem - 1.4rem)/2);
    }
    .ax-info-block .ax-arrow {
        font-size: 1rem;
    }
    /*item block*/
    .ax-item-block .ax-gallery > span,
    .ax-item-block .ax-gallery > a {
        margin-right: 0.2rem;
        width: calc((100% - 0.4rem)/3);
        height: 7.6rem;
        line-height: 7.6rem;
    }
    .ax-item-block .ax-gallery > span,
    .ax-item-block .ax-gallery > a {
        border-radius: 0;
    }
    .ax-item-block .ax-gallery > span:nth-last-of-type(1),
    .ax-item-block .ax-gallery > a:nth-last-of-type(1) {
        border-top-right-radius: 0.3rem;
        border-bottom-right-radius: 0.3rem;
    }
    .ax-item-block .ax-gallery > span:first-child,
    .ax-item-block .ax-gallery > a:first-child {
        border-top-left-radius: 0.3rem;
        border-bottom-left-radius: 0.3rem;
    }
    .ax-item-block .ax-gallery > span:nth-child(3),
    .ax-item-block .ax-gallery > a:nth-child(3) {
        border-top-right-radius: 0.3rem;
        border-bottom-right-radius: 0.3rem;
        margin-right: 0;
    }
    .ax-item-block .ax-gallery > span:nth-child(3) ~ span,
    .ax-item-block .ax-gallery > a:nth-child(3) ~ a {
        display: none;
    }
    .ax-item-block .ax-gallery > a:nth-child(3) ~ a.ax-more {
        display: inline-block;
        border-top-right-radius: 0.3rem;
        border-bottom-right-radius: 0.3rem;
        margin-right: 0;
        position: absolute;
        right: 0;
        top: 0;
    }
    .ax-item-block .ax-gallery > .ax-num {
        left: 0.4rem;
        bottom: 0.4rem;
    }
    .ax-item-block .ax-img {
        height: calc(2.2rem*3);
        width: calc(2.2rem*3 + 2.8rem);
    }
    .ax-item-block .ax-from,
    .ax-item-block .ax-keywords,
    .ax-item-block .ax-from *[class*='-color-'],
    .ax-item-block .ax-keywords *[class*='-color-'],
    .ax-item-block .ax-from *[class*='font'],
    .ax-item-block .ax-keywords *[class*='font'] {
        color: #b3b3b3;
        font-size: 1.2rem;
    }
    .ax-item-block .ax-split .ax-img {
        width: 100%;
        height: 16rem;
        margin-left: 0;
        margin-right: 0;
    }
    .ax-item-block .ax-split .ax-img:first-child {
        margin-bottom: 0.8rem;
    }
    .ax-item-block .ax-split .ax-img:last-child {
        margin-top: 0.8rem;
    }
    .ax-item-block.ax-ad:after {
        font-size: 1rem;
    }
    /*card*/
    .ax-card-block {
        padding: 0 0 0.8rem 0;
        border-width: 0;
        box-shadow: 0 0 0 0.1rem rgba(0, 0, 0, 0.12);
    }
    .ax-card-block:hover {
        box-shadow: 0 0 0 0.1rem rgba(0, 0, 0, 0.12);
    }
    .ax-card-block .ax-img {
        height: 12rem;
        margin-bottom: 0.8rem;
        border-radius: 0.3rem 0.3rem 0 0;
    }
    .ax-card-block .ax-title {
        padding: 0 0.8rem;
    }
    .ax-card-block .ax-title:first-child,
    .ax-card-block .ax-gallery + .ax-title {
        padding-top: 0.8rem;
    }
    .ax-card-block > .ax-gallery span,
    .ax-card-block > .ax-gallery a {
        height: 7.6rem;
        line-height: 7.6rem;
    }
    .ax-card-block .ax-operate {
        margin-top: 0.8rem;
        margin-bottom: -0.8rem;
        padding: 0 0.8rem;
    }
    .ax-card-block .ax-gallery > .ax-num {
        left: 0.4rem;
        bottom: 0.4rem;
    }
    .ax-card-block .ax-des {
        margin-top: 0.8rem;
        padding: 0 0.8rem;
    }
    .ax-card-block .ax-from {
        font-size: 1.2rem;
        margin-top: 0.8rem;
        padding: 0 0.8rem;
    }
    .ax-card-block .ax-from svg {
        height: 1.2rem;
    }
    .ax-card-block .ax-from .ax-iconfont {
        font-size: 1.2rem;
    }
    .ax-card-block .ax-from > span,
    .ax-card-block .ax-from > a,
    .ax-card-block .ax-keywords > span,
    .ax-card-block .ax-keywords > a {
        margin-right: 0.8rem;
    }
    .ax-card-block .ax-keywords {
        font-size: 1.2rem;
        margin-top: 0.8rem;
        padding: 0 0.8rem;
    }
    .ax-card-block .ax-gallery {
        margin: 0.8rem;
    }
    .ax-card-block .ax-img + .ax-gallery {
        margin-top: -0.6rem;
        margin-bottom: 0;
        margin-left: 0;
        margin-right: 0;
    }
    .ax-card-block .ax-view {
        font-size: 1rem;
        margin: 0.8rem 0.8rem 0 0.8rem;
        line-height: 2.8rem;
    }
    .ax-card-block .ax-view .ax-heads span {
        width: 1.8rem;
        height: 1.8rem;
    }
    .ax-card-block .ax-view .ax-heads span:not(:first-child) {
        margin-left: -0.9rem;
    }
    /*filter*/
    .ax-filter {
        font-size: 1.2rem;
    }
    .ax-filter .ax-item {
        padding: 0 0.8rem;
    }
    .ax-filter .ax-search {
        width: 100%;
    }
    .ax-filter .ax-item:not(.ax-search-box) .ax-text a {
        padding: 0 0.8rem;
    }
    .ax-filter .ax-item .ax-head {
        padding-right: 0;
        margin-right: 0.4rem;
    }
    .ax-filter .ax-item .ax-head::before {
        display: none;
    }
    .ax-filter .ax-item:not(.ax-search-box) .ax-text {
        white-space: nowrap;
        overflow-x: auto;
    }
    /*dialog*/
    .ax-dialog .ax-dialog-wrapper,
    .ax-dialog[data-size="md"] .ax-dialog-wrapper,
    .ax-dialog[data-size="lg"] .ax-dialog-wrapper {
        width: calc(100vw - 1.4rem*2);
    }
    .ax-dialog-body {
        max-height: 500px;
    }
    /*drawer*/
    .ax-drawer[data-placement="left"] .ax-drawer-wrapper {
        left: -70%;
        right: auto;
        width: 70%;
    }
    .ax-drawer[data-placement="right"] .ax-drawer-wrapper {
        right: -70%;
        width: 70%;
    }
    .ax-drawer[data-placement="right"][data-size="sm"] .ax-drawer-wrapper,
    .ax-drawer[data-placement="right"][data-size="md"] .ax-drawer-wrapper {
        right: -70%;
    }
    .ax-drawer[data-placement="left"][data-size="sm"] .ax-drawer-wrapper,
    .ax-drawer[data-placement="left"][data-size="md"] .ax-drawer-wrapper {
        left: -70%;
    }
    .ax-drawer[data-placement="top"][data-size="sm"] .ax-drawer-wrapper {
        top: -40%;
    }
    .ax-drawer[data-placement="top"][data-size="md"] .ax-drawer-wrapper {
        top: -60%;
    }
    .ax-drawer[data-placement="top"][data-size="lg"] .ax-drawer-wrapper {
        top: -80%;
    }
    .ax-drawer[data-placement="bottom"][data-size="sm"] .ax-drawer-wrapper {
        bottom: -40%;
    }
    .ax-drawer[data-placement="bottom"][data-size="md"] .ax-drawer-wrapper {
        bottom: -60%;
    }
    .ax-drawer[data-placement="bottom"][data-size="lg"] .ax-drawer-wrapper {
        bottom: -80%;
    }
    .ax-drawer[data-placement="top"][data-size="sm"] .ax-drawer-wrapper .ax-drawer-body,
    .ax-drawer[data-placement="bottom"][data-size="sm"] .ax-drawer-wrapper .ax-drawer-body {
        max-height: 40%;
    }
    .ax-drawer[data-placement="top"][data-size="md"] .ax-drawer-wrapper .ax-drawer-body,
    .ax-drawer[data-placement="bottom"][data-size="md"] .ax-drawer-wrapper .ax-drawer-body {
        max-height: 60%;
    }
    .ax-drawer[data-placement="top"][data-size="lg"] .ax-drawer-wrapper .ax-drawer-body,
    .ax-drawer[data-placement="bottom"][data-size="lg"] .ax-drawer-wrapper .ax-drawer-body {
        max-height: 80%;
    }
    .ax-drawer video,
    .ax-drawer audio {
        width: 100% !important;
    }
    .ax-drawer.ax-drawer-show[data-placement="left"][data-size="sm"] .ax-drawer-wrapper,
    .ax-drawer.ax-drawer-show[data-placement="left"][data-size="md"] .ax-drawer-wrapper,
    .ax-drawer.ax-drawer-show[data-placement="left"][data-size="lg"] .ax-drawer-wrapper {
        left: 0;
    }
    .ax-drawer.ax-drawer-show[data-placement="right"][data-size="sm"] .ax-drawer-wrapper,
    .ax-drawer.ax-drawer-show[data-placement="right"][data-size="md"] .ax-drawer-wrapper,
    .ax-drawer.ax-drawer-show[data-placement="right"][data-size="lg"] .ax-drawer-wrapper {
        right: 0;
    }
    .ax-drawer.ax-drawer-show[data-placement="top"][data-size="sm"] .ax-drawer-wrapper,
    .ax-drawer.ax-drawer-show[data-placement="top"][data-size="md"] .ax-drawer-wrapper,
    .ax-drawer.ax-drawer-show[data-placement="top"][data-size="lg"] .ax-drawer-wrapper {
        top: 0;
    }
    .ax-drawer.ax-drawer-show[data-placement="bottom"][data-size="sm"] .ax-drawer-wrapper,
    .ax-drawer.ax-drawer-show[data-placement="bottom"][data-size="md"] .ax-drawer-wrapper,
    .ax-drawer.ax-drawer-show[data-placement="bottom"][data-size="lg"] .ax-drawer-wrapper {
        bottom: 0;
    }
    /*plugins*/
    /*menu*/
    .ax-menu {
        width: 100%;
    }
    /*progress*/
    .ax-progress .ax-progress-body {
        height: 0.3rem;
        border-radius: 0.3rem;
        margin-top: calc((2.8rem - 0.3rem)/2);
    }
    .ax-progress.ax-lg .ax-progress-body {
        font-size: 1rem;
        height: 1.4rem;
        line-height: 1.4rem;
        border-radius: 1.4rem;
    }
    .ax-progress.ax-lg .ax-progress-bar {
        border-radius: 1.4rem;
    }
    .ax-progress.ax-lg .ax-progress-bar i {
        padding: 0 0.8rem;
    }
    .ax-progress-circle {
        width: 8rem;
    }
    .ax-progress-circle.ax-half {
        width: 10rem;
    }
    .ax-progress-circle .ax-progress-text svg {
        width: 1.8rem;
        height: 1.8rem;
    }
    .ax-progress-line > svg {
        height: 0.3rem;
        border-radius: 0.3rem;
        margin-top: calc((2.8rem - 0.3rem)/2);
    }
    .ax-progress-circle .ax-progress-text .ax-row01,
    .ax-progress-line .ax-progress-text .ax-row01 {
        font-size: 1rem;
        line-height: 1.4rem;
    }
    .ax-progress-circle .ax-progress-text .ax-row02,
    .ax-progress-line .ax-progress-text .ax-row02 {
        line-height: 1.8rem;
    }
    /*video with swiper*/
    .ax-videojs[class*='ax-playlist-'] .swiper-container {
        margin: 0.8rem;
    }
    .ax-videojs.ax-playlist-bottom .swiper-container {
        height: 10rem;
    }
    .ax-videojs[class*='ax-playlist-'] .swiper-slide figcaption {
        font-size: 1.2rem;
    }
    .ax-videojs[class*='ax-playlist-'] .swiper-slide-active i {
        font-size: 1.2rem;
    }
    .ax-videojs[class*='ax-playlist-'] .swiper-slide em {
        font-size: 1rem;
    }
    .ax-videojs.ax-playlist-side .video-js {
        height: 20rem;
    }
    .ax-videojs.ax-playlist-side .swiper-container {
        width: 12rem;
        height: 18rem;
    }
    .ax-videojs.ax-playlist-bottom .video-js {
        height: 22rem;
    }
    .ax-videojs.ax-playlist-pages .video-js {
        height: 22rem;
    }
    /*audio*/
    .ax-aplayer.aplayer-fixed {
        max-width: 32rem;
    }
    .ax-aplayer.aplayer-fixed .aplayer-body {
        max-width: 32rem;
    }
    .ax-aplayer.aplayer-bottom .aplayer-info .aplayer-music .aplayer-title {
        font-size: 1.2rem;
    }
    .ax-aplayer.aplayer-bottom .aplayer-info .aplayer-music .aplayer-author {
        font-size: 1rem;
    }
    .ax-aplayer.aplayer-bottom .aplayer-time-inner {
        display: none;
    }
    /*upload*/
    .ax-dropzone .ax-image {
        height: 8rem;
    }
    .ax-dropzone .ax-grid-block {
        width: calc((100%/24)*8) !important;
    }
    /*datatime*/
    .ax-date .ax-date-wrapper,
    .ax-date .ax-date-ymd,
    .ax-date .ax-date-time {
        display: block;
    }
    .ax-date .ax-date-body {
        min-width: calc(100vw - 1.4rem*2 - 2px);
    }
    .ax-date .ax-date-body table tbody .ax-with-lunar {
        width: calc((100vw - 1.4rem*2 - 2px - 0.8rem*2)/7);
    }
    .ax-date .ax-date-body table.ax-ytable tbody span,
    .ax-date .ax-date-body table.ax-mtable tbody span {
        width: calc((100vw - 1.4rem*2 - 2px - 0.8rem*2)/3) !important;
        margin: 0;
    }
    .ax-date .ax-date-body table.ax-ytable tbody .ax-start span,
    .ax-date .ax-date-body table.ax-ytable tbody .ax-end span,
    .ax-date .ax-date-body table.ax-ytable tbody .ax-contain span,
    .ax-date .ax-date-body table.ax-mtable tbody .ax-start span,
    .ax-date .ax-date-body table.ax-ymtable tbody .ax-end span,
    .ax-date .ax-date-body table.ax-mtable tbody .ax-contain span {
        width: calc((100vw - 1.4rem*2 - 2px - 0.8rem*2)/3) !important;
    }
    .ax-date .ax-date-time .ax-time-item {
        line-height: 2.8rem;
    }
    .ax-date .ax-date-menu {
        width: 100%;
        text-align: center;
    }
    .ax-date .ax-date-menu a {
        display: inline-block;
        margin: 0 0.8rem;
    }
    /*select*/
    .ax-select .ax-select-dropdown {
        border-top-left-radius: 0.3rem;
        border-top-right-radius: 0.3rem;
        width: calc(100vw - 1.4rem*2);
        transform: translate(-50%, -50%);
        position: fixed;
        left: 50%;
        top: 50%;
    }
    .ax-select .ax-select-dropdown .ax-item-list {
        max-height: calc((3.8rem + 1px)*8 - 1px);
    }
}
/*iPad*/
/*iPad flip & iPadpro*/
@media screen and (min-width: 900px) and (max-width: 1200px) {
    .ax-hide-pad {
        display: none !important;
    }
}
/*Laptop & Desktop & iPadpro flip*/
@media screen and (min-width: 1200px) and (max-width: 3000px) {
    .ax-hide-pc {
        display: none !important;
    }
}
/*Laptop & iPadpro flip*/
@media screen and (min-width: 1200px) and (max-width: 1500px) {
    .ax-hide-pc {
        display: none !important;
    }
}
/*Telephone & Laptop & iPad*/
/*Desktop*/
@media screen and (min-width: 1500px) {
    .ax-hide-pc {
        display: none !important;
    }
}