@charset "utf-8";
/* ==========================================================================
   鏁板瓧钀ラ攢涓庤繍钀ラ〉 data 鏉垮潡鏍峰紡锛堝ご灏惧叕鍏辨牱寮忚 header_footer.css锛?   ========================================================================== */

/* 瀛楀彿 */
.fnt_100 { font-size: 1rem; }
.fnt_150 { font-size: 1.5rem; }
@media only screen and (max-width: 1366px) { .fnt_18 { font-size: 14px; } }
@media only screen and (max-width: 1023px) { .fnt_100 { font-size: 50px; } .fnt_150 { font-size: 70px; } }
@media only screen and (max-width: 767px) { .fnt_100 { font-size: 30px; } .fnt_150 { font-size: 40px; } }

/* 鍥哄畾澶撮儴鍗犱綅 */
.zs-h-height { height: 0.96rem; }
@media only screen and (max-width: 1024px) { .zs-h-height { height: 56px; } }

/* 婊氬姩杩涘叆鍔ㄧ敾 */
.zs-fadeup { opacity: 0; transform: translateY(60px); transition: opacity 0.8s, transform 0.8s; }
.zs-fadel  { opacity: 0; transform: translateX(-80px); transition: opacity 0.8s, transform 0.8s; }
.zs-fader  { opacity: 0; transform: translateX(80px); transition: opacity 0.8s, transform 0.8s; }
.zs-fadeup.is-in, .zs-fadel.is-in, .zs-fader.is-in { opacity: 1; transform: none; }

/* 閫氱敤 */
.solutionwrap { width: 1660px; max-width: 90%; margin: 0 auto; }
@media only screen and (max-width: 1024px) { .solutionwrap { max-width: 94%; } }
.zs-data img { max-width: 100%; }
.zs-data .bold { font-weight: bold; }
.v-m-c { position: absolute; top: 50%; transform: translateY(-50%); }
.tran_scale { display: block; overflow: hidden; }
.tran_scale img { transition: transform 0.6s; }
@media only screen and (min-width: 1025px) { .tran_scale:hover img { transform: scale(1.05); } }
.ratio-img, .ratio-img img { width: 100%; }

/* ==========================================================================
   banner
   ========================================================================== */
.solution_banner img { width: 100%; display: block; }

/* ==========================================================================
   solution_01 涓夊ぇ鏈嶅姟
   ========================================================================== */
.solution_01 { padding: 1rem 0; box-sizing: border-box; overflow: hidden; }
.solution_01-tit { font-size: 0; margin-bottom: 0.3rem; }
.solution_01-tit h1, .solution_01-tit h2 { display: inline-block; }
.solution_01-tit h1 .fnt_36, .solution_01-tit h2 .fnt_36 { display: block; font-weight: normal; margin-top: 0.15rem; }
.solution_01-tit p { display: inline-block; }
.solution_01-list ul { margin-left: -0.08rem; margin-right: -0.08rem; overflow: hidden; }
.solution_01-list li { float: left; width: 25%; padding: 0 0.08rem; box-sizing: border-box; }
.digitize_01 .solution_01-list li { width: 33.3%; }
.solution_01-list dl { position: relative; border-radius: 0.5rem; overflow: hidden; }
.solution_01-list dd { position: relative; }
.solution_01-list dd img { width: 100%; display: block; }
.solution_01-list dt { position: absolute; width: 100%; padding: 0.5rem; box-sizing: border-box; color: #fff; z-index: 2; top: 0; left: 0; transition: all 0.3s; }
.solution_01-div { transition: all 0.3s; }
.solution_01-div h2, .solution_01-div h3 { margin-bottom: 0.1rem; line-height: 1.2; }
@media only screen and (min-width: 1025px) {
    .solution_01-list dl:hover dt { transform: translate(0, calc(5.7rem - 100%)); }
}
@media only screen and (max-width: 1024px) {
    .solution_01 { padding: 40px 0; }
    .solution_01-list li, .digitize_01 .solution_01-list li { width: 50%; margin-bottom: 20px; }
    .solution_01-tit p { margin-left: 0; margin-top: 10px; }
}
@media only screen and (max-width: 767px) {
    .solution_01-tit { margin-bottom: 30px; }
    .solution_01-list ul { margin-left: 0; margin-right: 0; }
    .solution_01-list li, .digitize_01 .solution_01-list li { width: 100%; }
    .solution_01-list dt { padding: 30px; }
    .solution_01-tit p { width: 100%; }
}

/* ==========================================================================
   solution_02 鏈嶅姟璇︽儏
   ========================================================================== */
.solution_02 { overflow: hidden; padding: 0 2.15rem; box-sizing: border-box; }
.solution_02-item { margin-bottom: 1.2rem; }
.solution_02-tit { text-align: center; margin-bottom: 0.5rem; }
.solution_02-tit p { text-align: left; }
.solution_02-tit h2 { line-height: 1.2; }
.solution_02-tit h2 .fnt_20 { display: block; font-weight: normal; margin-top: 0.12rem; }
.solution_02-div { margin-bottom: 0.8rem; overflow: hidden; }
.solution_02-l { float: right; width: 40%; box-shadow: 0 0 10px rgba(0,0,0,0.2); overflow: hidden; border-radius: 0.3rem; }
.solution_02-l img { width: 100%; display: block; }
.solution_02-r { float: left; width: 50%; box-sizing: border-box; }
.solution_02-r dl { margin-bottom: 0.4rem; }
.solution_02-r dd { font-weight: bold; line-height: 1.2; margin-bottom: 0.15rem; word-break: break-all; }
.solution_02-r dt { line-height: 1.7; }
.solution_02-r dt b { font-weight: bold; }
.solution_02-item:nth-child(2n) .solution_02-l { float: left; }
.solution_02-item:nth-child(2n) .solution_02-r { float: right; }
.solution_02-link { font-size: 0; text-align: center; }
.solution_02-link a { display: inline-block; width: 272px; height: 48px; line-height: 48px; background: #000; color: #fff; border-radius: 20px; text-align: center; }
.solution_02-link a i { margin-right: 8px; transition: all 0.3s; }
@media only screen and (min-width: 1025px) {
    .solution_02-link a:hover { color: #fff !important; }
    .solution_02-link a:hover i { margin-right: 0; }
}
@media only screen and (max-width: 1024px) {
    .solution_02 { padding: 0; }
    .solution_02-item { margin-bottom: 60px; }
    .solution_02-r { width: 55%; }
    .solution_02-div { margin-bottom: 30px; }
}
@media only screen and (max-width: 767px) {
    .solution_02-item { margin-bottom: 50px; }
    .solution_02-div { margin-bottom: 20px; }
    .solution_02-l, .solution_02-r { width: 100%; }
    .solution_02-l { margin-bottom: 30px; }
    .solution_02-link a { width: 220px; }
}

/* ==========================================================================
   solution_02-1 鎶€鏈湇鍔★紙tab 灞曠ず锛?   ========================================================================== */
.solution_02-1 { overflow: hidden; margin-bottom: 1.5rem; }
.solution_02-1-top { margin-bottom: 0.3rem; }
.solution_02-1-top h2 { display: inline-block; font-weight: bold; line-height: 1.2; vertical-align: bottom; }
.solution_03-tab01 { display: inline-block; vertical-align: baseline; margin-left: 0.6rem; }
.solution_03-tab01 li { padding: 0.1rem 0.2rem; box-sizing: border-box; border: 1px solid #303030; margin: 0 3px; border-radius: 30px; cursor: pointer; float: left; }
.solution_03-tab01 li.on { background: #303030; color: #fff; }
.solution_03-tab01 li a { color: inherit; text-decoration: none; display: block; }
.solution_03-tab01 li a:hover { color: #fff !important; }
.solution_03-tab01 li:hover { background: linear-gradient(135deg, #0140bf, #01b3bf); color: #fff; border-color: transparent; }
.solution_03-tab01 li:hover a { color: #fff !important; }
.solution_02-1-item { display: none; }
.solution_02-1-item img { width: 100%; }
.solution_02-1-item.on { display: block; }
@media only screen and (max-width: 1024px) {
    .solution_02-1 { margin-bottom: 0.8rem; }
    .solution_03-tab01 { margin-left: 0; display: block; overflow: hidden; }
}
@media only screen and (max-width: 767px) {
    .solution_02-1-top { margin-bottom: 7px; }
    .solution_03-tab01 { margin-top: 20px; }
    .solution_03-tab01 li { margin-bottom: 10px; font-size: 12px; }
}

/* ==========================================================================
   solution_03 鏈嶅姟娴佺▼
   ========================================================================== */
.solution_03 { padding-bottom: 0.8rem; }
.solution_03-con { padding: 0.7rem 1.5rem; box-sizing: border-box; color: #000; border-radius: 30px; overflow: hidden; position: relative; }
.solution_03-item { display: none; overflow: hidden; }
.solution_03-item.on { display: block; }
.solution_03-item h2 { line-height: 1.2; margin-bottom: 0.2rem; }
.solution_03-txt { margin-bottom: 0.35rem; }
.solution_03-tips { overflow: hidden; }
.solution_03-tips span { float: left; padding: 10px; box-sizing: border-box; border: 4px solid #FFF; border-radius: 30px; text-transform: uppercase; margin-right: 10px; font-weight: bold; }
.solution_03-img { position: absolute; right: 1rem; width: 0.7rem; }
.solution_03-img img { width: 100%; }
@media only screen and (max-width: 1024px) { .solution_03-con { padding: 40px 50px; } .solution_03-img { right: 0; } }
@media only screen and (max-width: 767px) { .solution_03-con { padding: 30px; } .solution_03-img { display: none; } }

/* ==========================================================================
   solution_04 鏈嶅姟鏁板瓧
   ========================================================================== */
.solution_04 { padding-bottom: 0.6rem; }
.solution_04 .solution_01-tit { text-align: center; }
.solution_04-num { margin-bottom: 0.5rem; }
.solution_04-num ul { font-size: 0; text-align: center; }
.solution_04-num ul li { display: inline-block; padding: 0 0.55rem; box-sizing: border-box; }
.solution_04-num ul li dd { font-weight: bold; }
.solution_04-num ul li dd span { line-height: 1.1; }
.solution_04-num ul li dd em { display: inline-block; vertical-align: top; margin-top: -0.05rem; }
.solution_04-img img { width: 100%; }
@media only screen and (max-width: 1024px) { .solution_04-num ul li { padding: 0 0.25rem; } }
@media only screen and (max-width: 767px) { .solution_04-num { margin-bottom: 0; } .solution_04-num ul li { width: 50%; margin-bottom: 30px; } }

/* ==========================================================================
   solution_05 瀹㈡埛璇勪环锛堢粷瀵瑰畾浣嶅崱鐗囷級
   ========================================================================== */
.solution_05 { padding: 0.6rem 0; box-sizing: border-box; overflow: hidden; }
.solution_05-tit { text-align: center; margin-bottom: 0.5rem; }
.solution_05-tit-div { text-align: left; display: inline-block; }
.solution_05-tit h2 { line-height: 1.2; margin-bottom: 0.2rem; }

/* 轮播按钮 / 分页（与首页常见问题一致） */
.zs-swiper-btn { display: none; }
.zs-swiper-btn div { position: absolute; top: 50%; width: 40px; height: 40px; margin-top: -20px; z-index: 10;
    background: linear-gradient(135deg, #0140bf, #01b3bf); color: #fff; border-radius: 50%; box-shadow: 0 0 10px rgba(0,0,0,0.2); cursor: pointer; }
.zs-swiper-btn div i { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-weight: bold; }
.zs-swiper-btn .zs-prev { left: 5px; }
.zs-swiper-btn .zs-next { right: 5px; }
.zs-swiper-btn div.is-disabled { color: #000; background: #fff; }

/* 客户评价：卡片轨道（与首页常见问题一致） */
.zs-voice-box { position: relative; }
.zs-voice-track { display: flex; align-items: stretch; transition: transform 0.5s; }
.zs-voice-slide { box-sizing: border-box; display: flex; }
.zs-voice-slide dl { position: relative; background: #fff; border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,0.1);
    transition: 0.5s; height: 100%; padding: 0.45rem 0.5rem 0.25rem 0.3rem; flex: 1; display: flex; flex-direction: column; }
.zs-voice-slide dt { margin-bottom: 10px; flex: 1; }
.zs-voice-slide dt p { min-height: 96px; line-height: 24px; }
.zs-voice-slide dt .zs-faq-q { display: block; margin-bottom: 8px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zs-voice-slide dt .zs-faq-a { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; text-overflow: ellipsis; }
.zs-voice-arrow { position: absolute; left: 0.3rem; top: 0; transform: translateY(-50%); width: 0.35rem; height: 0.3rem; z-index: 3; }
.zs-voice-arrow img { width: 100%; height: 100%; }
.zs-voice-slide dd { text-align: right; }
.zs-per { overflow: hidden; }
.zs-per span { display: inline-block; width: 46px; height: 46px; margin-right: 10px; border-radius: 50%; overflow: hidden; vertical-align: middle; }
.zs-per span img { width: 100%; height: 100%; object-fit: cover; }
.zs-per__info { display: inline-block; float: right; max-width: calc(100% - 56px); text-align: left; }
.zs-per__info h4, .zs-per__info p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* hover 背景色：每张不同（灰 / 绿 / 黄 / 藏蓝），文字转白 */
.zs-voice-slide:hover dl,
.zs-voice-slide.on dl { color: #fff; background: #2c2c2c; }
.zs-voice-slide:nth-child(2):hover dl,
.zs-voice-slide:nth-child(2).on dl { background: #00bf7f; }
.zs-voice-slide:nth-child(3):hover dl,
.zs-voice-slide:nth-child(3).on dl { background: #f9cd10; }
.zs-voice-slide:nth-child(4):hover dl,
.zs-voice-slide:nth-child(4).on dl { background: #1e2153; }
.zs-voice-slide.is-current dl { color: #fff; background: #2c2c2c; }
.zs-voice-slide:nth-child(2).is-current dl { background: #00bf7f; }
.zs-voice-slide:nth-child(3).is-current dl { background: #f9cd10; }
.zs-voice-slide:nth-child(4).is-current dl { background: #1e2153; }

/* 桌面端：绝对定位堆叠（默认展开；hover 时该张向左滑出盖住前一张） */
@media only screen and (min-width: 1025px) {
    .solution_05 .zs-voice-box { overflow: visible; }
    .solution_05 .zs-voice-track { position: relative; display: block; transform: none !important; height: 2.6rem; }
    .solution_05 .zs-voice-slide { position: absolute; top: 0; bottom: 0; width: 26%; margin: 0; transition: all 0.9s; display: flex; }
    .solution_05 .zs-voice-slide dl { flex: 1; display: flex; flex-direction: column; }
    .solution_05 .zs-voice-slide:nth-child(1) { left: 0; }
    .solution_05 .zs-voice-slide:nth-child(2) { left: 28.6%; }
    .solution_05 .zs-voice-slide:nth-child(3) { left: 51.6%; }
    .solution_05 .zs-voice-slide:nth-child(4) { left: 74.6%; }
    /* 层级：后面的卡片始终盖住前面的卡片；当前激活卡片只盖住前面的 */
    .solution_05 .zs-voice-slide:nth-child(1) { z-index: 1; }
    .solution_05 .zs-voice-slide:nth-child(2) { z-index: 2; }
    .solution_05 .zs-voice-slide:nth-child(3) { z-index: 3; }
    .solution_05 .zs-voice-slide:nth-child(4) { z-index: 4; }
    .solution_05 .zs-voice-slide:nth-child(1).on { z-index: 1; }
    .solution_05 .zs-voice-slide:nth-child(2).on { z-index: 2; }
    .solution_05 .zs-voice-slide:nth-child(3).on { z-index: 3; }
    .solution_05 .zs-voice-slide:nth-child(4).on { z-index: 4; }
    .solution_05 .zs-voice-track.zs-ani-2 .zs-voice-slide:nth-child(2) { left: 23%; }
    .solution_05 .zs-voice-track.zs-ani-3 .zs-voice-slide:nth-child(2) { left: 23%; }
    .solution_05 .zs-voice-track.zs-ani-3 .zs-voice-slide:nth-child(3) { left: 46%; }
    .solution_05 .zs-voice-track.zs-ani-4 .zs-voice-slide:nth-child(2) { left: 23%; }
    .solution_05 .zs-voice-track.zs-ani-4 .zs-voice-slide:nth-child(3) { left: 46%; }
    .solution_05 .zs-voice-track.zs-ani-4 .zs-voice-slide:nth-child(4) { left: 69%; }
}
/* ≤1024 横向滑动轨道 + 左右按钮 */
@media only screen and (max-width: 1024px) {
    .solution_05 .zs-voice-box { overflow: hidden; }
    .solution_05 .zs-voice-track { gap: 3%; }
    .solution_05 .zs-voice-slide { flex: 0 0 48.5%; margin: 10px 0; }
    .solution_05 .zs-swiper-btn { display: block; }
}
@media only screen and (max-width: 767px) {
    .solution_05 { padding: 30px 0; }
    .solution_05 .zs-voice-slide { flex: 0 0 85%; scroll-snap-align: start; margin: 10px 5px; }
    .solution_05 .zs-voice-slide:first-child { margin-left: 0; }
    .solution_05 .zs-voice-track {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0;
        scrollbar-width: none;
        transform: none !important;
    }
    .solution_05 .zs-voice-track::-webkit-scrollbar { display: none; }
    .solution_05 .zs-voice-slide dl { padding: 30px 20px 20px 20px; }
    .solution_05 .zs-voice-slide dt p { min-height: auto; line-height: 1.6; }
    .solution_05 .zs-voice-slide dt .zs-faq-q { white-space: normal; overflow: visible; text-overflow: unset; }
    .solution_05 .zs-voice-box { position: relative; overflow: hidden; padding-bottom: 0; }
    .solution_05 .zs-swiper-btn { display: none; }
    /* 移动端禁用 hover 变色，只用 .is-current */
    .solution_05 .zs-voice-slide:hover dl { color: inherit; background: #fff; }
    .solution_05 .zs-voice-slide:nth-child(2):hover dl,
    .solution_05 .zs-voice-slide:nth-child(3):hover dl,
    .solution_05 .zs-voice-slide:nth-child(4):hover dl { background: #fff; }
    /* 点击（触发 hover）时，当前卡片背景保持不变，不再变白 */
    .solution_05 .zs-voice-slide.is-current:hover dl,
    .solution_05 .zs-voice-slide.is-current.on:hover dl { color: #fff; background: #2c2c2c; }
    .solution_05 .zs-voice-slide:nth-child(2).is-current:hover dl { background: #00bf7f; }
    .solution_05 .zs-voice-slide:nth-child(3).is-current:hover dl { background: #f9cd10; }
    .solution_05 .zs-voice-slide:nth-child(4).is-current:hover dl { background: #1e2153; }
    /* 兜底：移动端 .on 残留时不改变背景，避免与 .is-current 冲突 */
    .solution_05 .zs-voice-slide.on:not(.is-current) dl { color: inherit; background: #fff; }
    .solution_05 .zs-voice-slide.zs-fadeup,
    .solution_05 .zs-fadeup {
        opacity: 1;
        transform: none;
        transition: none;
    }
    .solution_05 .zs-dots {
        display: flex;
        justify-content: center;
        gap: 8px;
        margin-top: 16px;
    }
    .solution_05 .zs-dots span {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #ccc;
        transition: all 0.3s;
        cursor: pointer;
    }
    .solution_05 .zs-dots span.is-active {
        background: linear-gradient(135deg, #0140bf, #01b3bf);
        width: 20px;
        border-radius: 4px;
    }
}

/* ==========================================================================
   solution_06 鎺ㄨ崘妗堜緥
   ========================================================================== */
.solution_06 { padding: 0.6rem 0; box-sizing: border-box; overflow: hidden; }
.solution_06-list ul { margin-left: -0.1rem; margin-right: -0.1rem; }
.solution_06-list ul::after { content: ''; display: block; clear: both; }
.solution_06-list li { float: left; width: 33.3%; padding: 0 0.1rem; box-sizing: border-box; }
.solution_06-list a { display: block; }
.solution_06-list dl { border-radius: 30px; overflow: hidden; position: relative; transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.5s ease; }
.solution_06-list dd { position: relative; }
.solution_06-list dd img { width: 100%; display: block; }
/* hover mask: darken image for text legibility */
.solution_06-list dd::after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.1) 45%, rgba(0,0,0,0.55) 100%); opacity: 0; transition: opacity 0.5s ease; z-index: 1; }
.solution_06-list dt { position: absolute; left: 0; top: 0; width: 100%; height: 100%; color: #fff; padding: 0.4rem; box-sizing: border-box; z-index: 2; }
.solution_06-list dt h3 { line-height: 1.2; margin-bottom: 0.1rem; font-weight: bold; transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1); }
.solution_06-list dt p { transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.5s ease; }
.digitize_06 .solution_06-list dt { color: #fff; }
@media only screen and (min-width: 1025px) {
    .solution_06-list dt p { opacity: 0.75; }
    .solution_06-list dl:hover { transform: translateY(-10px); box-shadow: 0 0.16rem 0.36rem rgba(0,0,0,0.22); }
    .solution_06-list dl:hover dd::after { opacity: 1; }
    .solution_06-list dl:hover dt h3 { transform: translateY(-6px); }
    .solution_06-list dl:hover dt p { opacity: 1; transform: translateY(-4px); }
}
@media only screen and (max-width: 1024px) { .solution_06-list li { width: 50%; margin-bottom: 20px; } }
@media only screen and (max-width: 767px) {
    .solution_06 { padding: 20px 0 0; }
    .solution_06-list ul { margin-left: 0; margin-right: 0; }
    .solution_06-list li { width: 100%; padding: 0; }
    .solution_06-list dt { padding: 30px; }
}

/* pub_bodys 瑕嗙洊 */
.pub_bodys .solution_01-tit p { margin-left: 0.5rem; }
.pub_bodys .solution_03-tab01 { margin-left: 0.6rem; }
.pub_bodys .solution_06 { padding-bottom: 0.3rem; }
@media only screen and (max-width: 1024px) {
    .pub_bodys .solution_01-tit p { margin-left: 0; }
    .pub_bodys .solution_03-tab01 { margin-left: 0; display: block; overflow: hidden; }
}
@media only screen and (max-width: 767px) { .pub_bodys .solution_06 { padding-bottom: 20px; } }

/* ==========================================================================
   index_07 搴曢儴 CTA
   ========================================================================== */
.zs-index-07 { background: linear-gradient(135deg, #0140bf, #01b3bf); overflow: hidden; text-align: center; padding: 0.9rem 0; }
.zs-index-07 h3 { line-height: 1em; margin-bottom: 0.4rem; }
.zs-index-07 .zs-cont { display: inline-block; text-align: left; }
.zs-index-07 .zs-header-map { margin: 0 auto; float: none; display: block; text-align: center; }
.zs-index-07 .zs-header-map a { background: #1e1e1e; width: 272px; height: 46px; line-height: 46px; margin: 0 auto; }
@media only screen and (max-width: 1440px) { .zs-index-07 .zs-header-map a { width: 200px; } }
@media only screen and (max-width: 767px) {
    .zs-index-07 h3 { line-height: 1.4em; margin-bottom: 15px; }
    .zs-index-07 .zs-header-map a { height: 36px; line-height: 36px; width: 170px; }
}

/* 头部：默认白底无阴影，下滑后加阴影 */
.data_body .zs-header { background: #fff; box-shadow: none; border-bottom: none; }
.data_body .zs-header.is-scroll { box-shadow: 0 10px 10px rgba(0,0,0,0.15); }