/*
 * CMS template compatibility layer.
 * Keep the original template colors and desktop UI. This file only fixes
 * mobile layout problems caused by fixed-width static pages.
 */

.cms-package-title,
.cms-package-price {
    display: none;
}

/* Uploaded logos can have a very different aspect ratio from the legacy asset. */
.page-header .logo,
.page-header .logo2 {
    height: 80px !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
}

.page-header .logo > a,
.page-header .logo2 > a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

.page-header .logo img,
.page-header .logo2 img,
.page-header .logo_img {
    display: block;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 72px !important;
    object-fit: contain;
}

@media screen and (min-width: 1024px) and (max-width: 1370px) {
    .page-header .navs ul li {
        margin-left: 3px !important;
        margin-right: 3px !important;
        white-space: nowrap;
    }
}

@media screen and (max-width: 767px) {
    html,
    body {
        width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
        -webkit-text-size-adjust: 100%;
    }

    body {
        font-size: 14px;
    }

    img,
    video,
    canvas,
    iframe {
        max-width: 100% !important;
        height: auto;
    }

    table {
        max-width: 100%;
    }

    .w1200,
    .w1440,
    .center-card,
    .toolkit-card,
    .layui-container,
    .infos,
    .infosA,
    .info,
    .toolboxList_top .top_content,
    .toolboxList_box,
    .toolboxList_content,
    .manual-list .lists,
    .news-article .center-card {
        width: calc(100% - 24px) !important;
        min-width: 0 !important;
        max-width: calc(100% - 24px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .page-header {
        width: 100% !important;
        min-width: 0 !important;
        height: 60px !important;
        position: sticky;
        top: 0;
        z-index: 9999;
    }

    .page-header .layui-row,
    .page-header .header_box {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        height: 60px !important;
        padding: 0 12px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        box-sizing: border-box;
    }

    .page-header .left,
    .page-header .right {
        width: auto !important;
        height: 60px !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        float: none !important;
    }

    .page-header .logo,
    .page-header .logo2 {
        width: 156px !important;
        height: 46px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        float: none !important;
    }

    .page-header .logo img,
    .page-header .logo2 img,
    .page-header .logo_img {
        width: auto !important;
        max-width: 156px !important;
        max-height: 42px !important;
        object-fit: contain;
    }

    .page-header .navs,
    .page-header .login,
    .page-header .headerTel {
        display: none !important;
    }

    .page-header .navdownLine {
        width: 42px !important;
        height: 42px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        float: none !important;
    }

    .page-header .navdown {
        width: 24px !important;
        height: 18px !important;
        margin: 0 !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
    }

    .page-header .menu-list {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        top: 60px !important;
        width: 100% !important;
        min-width: 0 !important;
        max-height: calc(100vh - 60px) !important;
        overflow-y: auto !important;
    }

    .page-header .menu-list ul {
        width: 100% !important;
    }

    .page-header .menu-list a {
        display: block !important;
    }

    .page-header .menu-list li {
        width: 100% !important;
        height: auto !important;
        min-height: 44px !important;
        line-height: 44px !important;
        padding: 0 20px !important;
        text-align: left !important;
    }

    .home-page,
    .about-page,
    .news-page,
    .media-page,
    .cooperation-page,
    .zhibian-page,
    .packages,
    .package-page,
    .toolkit-page {
        width: 100% !important;
        min-width: 0 !important;
    }

    .home-page .banner,
    .home-page .banners,
    .home-page .banner .img,
    .about-page .banner,
    .news-page .banner,
    .media-page .banner,
    .cooperation-page .banner,
    .packages .banner,
    .package-page .banner,
    .toolboxList_top {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
        background-size: cover !important;
        background-position: center !important;
    }

    .home-page .banner {
        height: auto !important;
        min-height: 0 !important;
        padding-bottom: 0 !important;
    }

    .home-page .banners,
    .home-page .banner .img {
        height: 240px !important;
        min-height: 240px !important;
    }

    .home-page .banner .img {
        background-size: cover !important;
        background-position: center top !important;
    }

    .about-page .banner,
    .news-page .banner,
    .media-page .banner,
    .cooperation-page .banner,
    .packages .banner,
    .package-page .banner {
        height: auto !important;
        min-height: 160px !important;
    }

    .about-page .banner img,
    .news-page .banner img,
    .media-page .banner img,
    .cooperation-page .banner img,
    .packages .banner img,
    .package-page .banner img,
    .banner img {
        width: 100% !important;
        height: auto !important;
        min-height: 160px;
        object-fit: cover;
        margin-left: 0 !important;
        transform: none !important;
    }

    .contactInformation {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: calc(100% - 20px) !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 12px auto 22px !important;
        transform: none !important;
        padding: 0 !important;
    }

    .contactInformation .contact {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        display: block !important;
        padding: 12px !important;
        overflow: hidden;
    }

    .contactInformation .contact .contact_left,
    .contactInformation .contact .contact_center,
    .contactInformation .contact .contact_right {
        width: 100% !important;
        height: auto !important;
        float: none !important;
        margin: 0 0 10px !important;
    }

    .contactInformation .contact .contact_left .left_img {
        width: 180px !important;
        height: auto !important;
    }

    .contactInformation .contact .contact_left .contact_left_text {
        left: 42px !important;
        top: 2px !important;
        font-size: 14px !important;
        line-height: 28px !important;
    }

    .contactInformation .contact .contact_center .center_top {
        display: block !important;
        width: 100% !important;
    }

    .contactInformation .contact .contact_center .center_top .FormItem,
    .contactInformation .contact .contact_center .center_top .FormItem2,
    .contactInformation .contact .contact_center .center_top input {
        width: 100% !important;
        margin: 0 0 10px !important;
    }

    .contactInformation .contact .contact_center .center_bottom {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px 12px;
        width: 100% !important;
    }

    .contactInformation .contact .contact_center .center_bottom .item_box {
        width: calc(50% - 6px) !important;
        margin: 0 !important;
    }

    .contactInformation .contact .contact_right {
        display: block !important;
        padding: 12px !important;
    }

    .contactInformation .contact .contact_right .right_top,
    .contactInformation .contact .contact_right .right_bottom {
        flex-wrap: wrap;
        justify-content: center;
    }

    .contactInformation .release {
        width: 100% !important;
        height: auto !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin: 10px 0 0 !important;
    }

    .contactInformation .release .release-drop {
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 98px;
        margin: 0 !important;
        padding: 12px 8px !important;
    }

    .home-page .commitTitle {
        width: calc(100% - 24px) !important;
        margin: 28px auto 18px !important;
        padding: 0 !important;
    }

    .home-page .commitTitle h2,
    .about-page h2,
    .cooperation-page .title h2,
    .news-page .article .title,
    .packages .indulgence .title,
    .packages .preferential .title {
        font-size: 22px !important;
        line-height: 1.35 !important;
        word-break: break-word;
    }

    .home-page .commitTitle p,
    .about-page .c1 p,
    .news-page .article .adesc,
    .news-page .article .content {
        font-size: 14px !important;
        line-height: 1.75 !important;
    }

    .home-page .c1,
    .home-page .c2,
    .home-page .c3,
    .home-page .c4,
    .home-page .c5,
    .home-page .c6,
    .home-page .c7,
    .home-page .c8,
    .home-page .c9,
    .home-page .c10,
    .home-page .c11,
    .about-page .c1,
    .about-page .c2,
    .news-page .c1,
    .media-page .filter,
    .media-page .table,
    .preferential,
    .packages .indulgence,
    .packages .release,
    .indulgence,
    .release,
    .indulgence .tabs2,
    .package-detail,
    .toolkit-page .infos {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .home-page .c2,
    .home-page .c6,
    .home-page .c8,
    .home-page .c9,
    .home-page .c11,
    .news-page .c1 {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }

    .home-page .c2 .tabs,
    .home-page .c2 .center-card,
    .home-page .c6 .center-card,
    .home-page .c8 .center-card,
    .home-page .c9 .center-card,
    .home-page .c11 .center-card,
    .packages .indulgence .tabs,
    .indulgence .tabs,
    .preferential .center-card,
    .about-page .c2 .center-card,
    .news-page .c1 .lists ul,
    .manual-list .lists ul,
    .toolboxList_box .toolboxList_content .list_box {
        display: block !important;
        height: auto !important;
    }

    .home-page .c1 .tabs .tab,
    .home-page .c2 .tabs .tab,
    .home-page .c2 .center-card .layui-col-lg4,
    .home-page .c6 .center-card .layui-col-lg4,
    .about-page .c2 .ser,
    .news-page .c1 li,
    .manual-list .lists li,
    .toolboxList_box .toolboxList_content .list_box .toolboxList_item,
    .indulgence .tabs .tab-box,
    .preferential .center-card .layui-col-lg4 {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 0 14px !important;
        float: none !important;
        transform: none !important;
    }

    .home-page .c2 .center-card .wow,
    .home-page .c6 .combo,
    .home-page .c8 .c8Box1,
    .home-page .c8 .c8Box2,
    .home-page .c9 .member,
    .home-page .c9 .member .box,
    .home-page .c11 .center-card .newBox,
    .news-page .c1 .lists,
    .news-page .c1 li,
    .about-page .c2 .ser .content,
    .crad,
    .toolkit-card {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .home-page .c8 .number,
    .home-page .c9 .member .box,
    .home-page .c11 .newBox {
        display: block !important;
    }

    .home-page .c8 .number .box,
    .home-page .c9 .member .left,
    .home-page .c9 .member .box .right,
    .home-page .c11 .newBox .newImg,
    .home-page .c11 .newBox .newList {
        width: 100% !important;
        float: none !important;
        margin: 0 0 12px !important;
    }

    .cms-package-title,
    .cms-package-price {
        display: none;
    }

    .home-page .c4 {
        display: block !important;
        padding: 26px 0 !important;
        background-size: cover !important;
    }

    .home-page .c4 .center-card,
    .home-page .c4 .tabs1,
    .home-page .c4 .tabs1.box,
    .home-page .c4 .mySwiper,
    .home-page .c4 .swiper,
    .home-page .c4 .swiper-wrapper {
        width: calc(100% - 24px) !important;
        min-width: 0 !important;
        max-width: calc(100% - 24px) !important;
        height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        transform: none !important;
        display: block !important;
    }

    .home-page .c4 .swiper-wrapper {
        width: 100% !important;
        max-width: 100% !important;
    }

    .home-page .c4 .swiper-slide {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 0 14px !important;
        padding: 16px 14px 18px !important;
        float: none !important;
        opacity: 1 !important;
        transform: none !important;
        background: #fff !important;
        border-radius: 8px !important;
        box-shadow: 0 2px 14px rgba(0, 0, 0, .08) !important;
        overflow: hidden !important;
    }

    .home-page .c4 .swiper-slide > img,
    .home-page .c4 .swiper-slide .teh,
    .home-page .c4 .swiper-slide .teh2 {
        display: none !important;
    }

    .home-page .c4 .swiper-slide .cms-package-title {
        display: block !important;
        margin: 0 0 12px !important;
        color: #222 !important;
        font-size: 18px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
        text-align: center !important;
    }

    .home-page .c4 .swiper-slide .cms-package-price {
        display: block !important;
        margin: 0 0 12px !important;
        color: #FF3C00 !important;
        font-size: 14px !important;
        line-height: 1.2 !important;
        text-align: center !important;
    }

    .home-page .c4 .swiper-slide .cms-package-price span {
        font-size: 26px !important;
        font-weight: 700 !important;
    }

    .home-page .c4 .swiper-slide .package-content {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
    }

    .home-page .c4 .swiper-slide .package-content li {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        min-height: 32px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 7px 0 !important;
        border-bottom: 1px solid #f0f0f0 !important;
        clear: none !important;
    }

    .home-page .c4 .swiper-slide .package-content li.ht {
        display: none !important;
    }

    .home-page .c4 .swiper-slide .package-content .content-left,
    .home-page .c4 .swiper-slide .package-content .content-right {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: auto !important;
        height: auto !important;
        line-height: 1.5 !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        font-size: 13px !important;
        text-align: left !important;
    }

    .home-page .c4 .swiper-slide .package-content .content-left {
        max-width: 70%;
        color: #333 !important;
    }

    .home-page .c4 .swiper-slide .package-content .content-right {
        color: #f71c4b !important;
        font-weight: 600 !important;
        text-align: right !important;
    }

    .home-page .c4 .swiper-slide .package-content .content-right img {
        display: inline-block !important;
        width: 16px !important;
        height: 16px !important;
        margin: 0 !important;
    }

    .home-page .c4 .swiper-slide .jump-qq {
        position: static !important;
        display: block !important;
        width: 100% !important;
        height: 40px !important;
        line-height: 40px !important;
        margin: 14px 0 0 !important;
        border-radius: 20px !important;
        text-align: center !important;
        color: #fff !important;
    }

    .home-page .c4 .swiper-button-next,
    .home-page .c4 .swiper-button-prev,
    .home-page .c4 .swiper-pagination,
    .home-page .c4 .swiper-pagination-bullet,
    .home-page .c4 .swiper-notification {
        display: none !important;
    }

    .home-page .c4 .more {
        position: static !important;
        display: block !important;
        width: calc(100% - 24px) !important;
        height: 42px !important;
        line-height: 42px !important;
        margin: 18px auto 0 !important;
        border-radius: 21px !important;
        text-align: center !important;
    }

    .news-page .c1 li {
        padding: 16px !important;
        display: flex !important;
        gap: 12px;
        align-items: flex-start;
    }

    .news-page .c1 li .time {
        width: 66px !important;
        height: 66px !important;
        min-width: 66px;
        margin-right: 0 !important;
    }

    .news-page .c1 li .time .day {
        font-size: 28px !important;
        line-height: 42px !important;
    }

    .news-page .c1 li .time .year {
        line-height: 24px !important;
        font-size: 12px !important;
    }

    .news-page .c1 li .info {
        width: auto !important;
        flex: 1;
        min-width: 0;
        float: none !important;
    }

    .news-page .c1 li .info .name {
        height: auto !important;
        line-height: 1.45 !important;
        white-space: normal !important;
        margin-bottom: 8px !important;
        font-size: 16px !important;
    }

    .news-page .c1 li .info .desc {
        height: auto !important;
        line-height: 1.65 !important;
    }

    .about-page .btns,
    .news-page .btns {
        width: 100% !important;
        overflow-x: auto;
        white-space: nowrap;
        padding: 10px 0 !important;
    }

    .about-page .btns a,
    .news-page .btns a {
        float: none !important;
        display: inline-block !important;
        min-width: 96px;
        height: 38px !important;
        line-height: 38px !important;
        margin: 0 8px 0 0 !important;
        text-align: center;
    }

    .about-page .c1 img {
        width: 100% !important;
        margin: 0 0 16px !important;
    }

    .about-page .c1 .introduction,
    .about-page .c1 p {
        width: 100% !important;
        text-align: left !important;
    }

    .media-page .filter .content {
        padding: 14px !important;
    }

    .media-page .filter .content .list,
    .screen .list ul,
    .sort .list ul {
        display: flex !important;
        flex-wrap: wrap;
        gap: 8px;
    }

    .media-page .filter .content .list li,
    .screen .list ul li,
    .sort .list ul li {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 6px 12px !important;
        line-height: 24px !important;
        white-space: nowrap;
    }

    .media-page .table,
    .layui-table-view,
    .layui-table-box,
    .layui-table-body,
    .layui-table-main {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
    }

    .packages .indulgence .title,
    .packages .preferential .title {
        margin: 28px 0 18px !important;
    }

    .indulgence,
    .release {
        padding-top: 34px !important;
        padding-bottom: 34px !important;
        background-position: center !important;
    }

    .indulgence .tabs .tab-box {
        padding: 14px !important;
    }

    .indulgence .tab-box .package-content li {
        width: 100% !important;
    }

    .indulgence .tab-box .package-content .content-left,
    .indulgence .tab-box .package-content .content-right {
        float: none !important;
        display: block !important;
        width: 100% !important;
        line-height: 1.6 !important;
        text-align: left !important;
        font-size: 15px !important;
    }

    .indulgence .tabs2,
    .indulgence .swiper-pagination,
    .indulgence .video-swiper-pagination {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 14px 0 !important;
        padding: 10px !important;
        flex-wrap: wrap;
        gap: 8px;
        background-size: cover !important;
    }

    .indulgence .swiper-pagination .swiper-pagination-bullet {
        width: calc(50% - 4px) !important;
        height: 42px !important;
        line-height: 42px !important;
        font-size: 14px !important;
    }

    .toolboxList_top {
        height: auto !important;
        min-height: 150px !important;
        padding: 22px 0 !important;
    }

    .toolboxList_top .top_content {
        position: relative !important;
        min-height: 110px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .toolboxList_top .top_content .breadcrumbs {
        position: static !important;
        width: 100% !important;
        margin-bottom: 12px;
        font-size: 13px !important;
        text-align: left;
    }

    .toolboxList_top .top_content .max_title {
        font-size: 26px !important;
        line-height: 1.3 !important;
    }

    .toolkit-page .infos {
        padding: 18px 0 !important;
    }

    .crad {
        padding: 16px !important;
        overflow: hidden;
    }

    .layui-input-block {
        margin-left: 0 !important;
    }

    .layui-textarea {
        min-height: 180px !important;
    }

    .info1Btn,
    .demandNum,
    #orderForm {
        display: block !important;
        width: 100% !important;
    }

    .info1Btn .layui-btn,
    #orderForm .layui-btn {
        width: 100% !important;
        margin: 8px 0 0 !important;
    }

    .demandNum p {
        padding: 8px 0 !important;
        text-align: left !important;
    }

    .page-footer,
    .m-page-footer {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
    }

    .page-footer .top,
    .page-footer .bot,
    .m-page-footer .top_box,
    .m-page-footer .bot_box,
    .m-page-footer .wow_box_bottom {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .page-footer .top .logo,
    .page-footer .bot .logo {
        width: 160px !important;
        margin: 0 auto 18px !important;
        float: none !important;
        text-align: center;
    }

    .page-footer .bot .navs,
    .page-footer .bot .tel,
    .page-footer .bot .address,
    .page-footer .bot .code,
    .page-footer .bot-center {
        width: 100% !important;
        margin: 0 0 18px !important;
        float: none !important;
        text-align: left !important;
    }

    .page-footer .bot .code .wow,
    .m-page-footer .code_box {
        display: flex !important;
        flex-wrap: wrap;
        gap: 14px;
        justify-content: flex-start !important;
    }

    .page-footer .bot .code .qrcode,
    .m-page-footer .qrcode_box {
        width: calc(50% - 7px) !important;
        margin: 0 !important;
        text-align: center !important;
    }

    .page-footer .bot .code img,
    .m-page-footer .qrcode_box img {
        width: 112px !important;
        height: 112px !important;
        object-fit: cover;
    }

    .page-copyright,
    .page-copyright .center-card {
        width: calc(100% - 24px) !important;
        min-width: 0 !important;
        max-width: calc(100% - 24px) !important;
        margin: 0 auto !important;
    }

    .page-copyright p {
        font-size: 12px !important;
        line-height: 1.7 !important;
        white-space: normal !important;
        word-break: break-word;
        text-align: center !important;
    }

    .kf,
    .right-fixed,
    .fixed-right,
    .sidebar,
    .rightBar,
    .floatBar {
        display: none !important;
    }
}

@media screen and (max-width: 480px) {
    .page-header .logo,
    .page-header .logo2,
    .page-header .logo img,
    .page-header .logo2 img,
    .page-header .logo_img {
        max-width: 140px !important;
    }

    .home-page .banners,
    .home-page .banner .img {
        height: 220px !important;
        min-height: 220px !important;
    }

    .contactInformation .contact .contact_center .center_bottom .item_box {
        width: 100% !important;
    }

    .contactInformation .release {
        grid-template-columns: 1fr;
    }

    .news-page .c1 li {
        display: block !important;
    }

    .news-page .c1 li .time {
        float: none !important;
        margin: 0 0 10px !important;
    }
}
/* Make the complete home news row interactive, not only the title text. */
.home-page .c11 .newList .tmw-home-news-item {
    padding-left: 0;
}

.home-page .c11 .newList .tmw-home-news-link {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
    padding: 0 40px;
    color: inherit;
    cursor: pointer;
}

.home-page .c11 .newList .tmw-home-news-link .title {
    min-width: 0;
}

.home-page .c11 .newList .tmw-home-news-link .title span {
    display: -webkit-box;
    overflow: hidden;
    color: #333;
    word-break: break-all;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.home-page .c11 .newList .tmw-home-news-link:hover .title span {
    color: #f62b4a;
}