@charset "utf-8";
@import url("icon/iconfont.css");
/* 基础字体大小设置 - 根据视口动态调整 */
html { width: 100%; font-size: clamp(12px, 0.9vw, 18px); }
/* 当用户手动缩放浏览器字体时，保持 rem 体系仍可正常工作 */
@media (max-width: 768px) {
    html { font-size: 16px; }
}


/*全局样式开始-------------------------------------------------------------------------*/
body { position: relative; margin: 0 auto; padding: 0; width: 100%; max-width: 100%; overflow-x: hidden; font-size: 1rem; color: #666; background: #fff; font-family: Cambria,'Microsoft YaHei'; line-height: 1.6; }

a { margin: 0; padding: 0; text-decoration: none; color: #fff; }
a:hover { color: #ff0000; text-decoration: none; cursor: pointer; }
a:link { outline-style: none; }
ul, li, ol, dl, dt, dd, p { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, h5, h6, h7, h8, h9 { margin: 0; padding: 0; }
div { text-align: left; }
img { border: none; max-width: 100%; height: auto; }
.clearfix { display: block; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clear { clear: both; margin: 0; padding: 0; height: 0; overflow: hidden; }
.left { float: left; }
.right { float: right; }
.h1 { font-size: 1.875rem; font-weight: bold; }
.h2 { font-size: 1.5rem; }
.h3 { font-size: 1.125rem; }
/*全局样式结束-------------------------------------------------------------------------*/

/*通用样式开始-------------------------------------------------------------------------*/
/*box*/
.box { margin: 0 auto; padding: 0; width: 90%; }


/* 思源宋体 */
@font-face { font-family: 'Source Han Serif CN'; src: url('/fonts/SourceHanSerifCN-Regular-1.otf') format('woff'); font-style: normal; font-display: swap; }
@font-face { font-family: 'Source Han Serif CN SemiBold'; src: url('/fonts/SourceHanSerifCN-SemiBold-7.otf') format('woff'); font-style: normal; font-display: swap; }

/*header*/
/*header*/
.header { position: fixed; top: 0; left: 0; z-index: 999; width: 100%; }
.header .menu { position: relative; width: 100%; height: 7.5rem; background-color: transparent; transition: all 0.3s ease; }
.header .menu:hover { background: #000; opacity: 1; }
.header .menu .box { width: 100%; }
.header .menu .box .logo { margin: 0.25rem 0 0 1.875rem; float: left; width: 21.5rem; height: 4.1875rem; }
.header .menu .box .logo img { width: 100%; height: auto; }
.header .menu .box .nav { float: right; margin: 0; padding: 0 1.875rem 0 0; background-color: transparent; }
.header .menu .box .nav .m { float: right; z-index: 9999; }
.header .menu .box .nav .m a { display: block; margin-left: 1.5625rem; font-size: 1.1rem; text-align: center; width: 6.3rem; height: 7.5rem; line-height: 7.5rem; color: #fff; overflow: hidden; transition: color 0.3s ease; }
.header .menu .box .nav .m a:hover { color: #d51813; }
.header .menu .box .nav .m a i { margin-left: 0.3125rem; color: #ccc; font-size: 0.625rem; transition: color 0.3s ease; }
.header .menu .box .nav .m a:hover i { color: #d51813; }
.header .menu .box .nav .tel a { width: 11.25rem; font-size: 1.325rem; }
.header .menu .box .nav .tel a i { margin-right: 5%; font-size: 1.125rem; color: #fff; }
.header .menu:hover .box .nav .m a { color: #fff; }
.header .menu:hover .box .nav .m a:hover { color: #d51813; }
.header .menu .box .nav .sub { display: none; position: absolute; top: 7.5rem; left: 0; z-index: 9999; width: 100%; height: 21.25rem; background: #eee; }
.header .menu .box .nav .sub_box1 { margin: 0 auto; padding: 1.25rem 0; width: 95%; max-width: 1520px; }
.header .menu .box .nav .sub_box1 .core { float: left; margin-left: 9.375rem; padding-right: 6.25rem; width: 25rem; border-right: 1px solid #aaa; }
.header .menu .box .nav .sub_box1 .core ul li img { display: block; margin-top: 1.875rem; width: 100%; height: auto; max-width: 28.125rem; }
.header .menu .box .nav .sub_box1 .hd { float: left; margin-left: 3.125rem; width: 37.5rem; }
.header .menu .box .nav .sub_box1 .hd ul { margin-top: 1.25rem; }
.header .menu .box .nav .sub_box1 .hd ul li { margin: 1.875rem 0; float: left; width: 50%; }
.header .menu .box .nav .sub_box1 .hd ul li a { display: block; margin: 0; padding: 0; width: 17.5rem; text-align: left; height: 2.5rem; line-height: 2.5rem; font-size: 1.25rem; color: #333; transition: all 0.3s ease; }
.header .menu .box .nav .sub_box1 .hd ul li a:hover { font-weight: bold; }
.header .menu .box .nav .sub_box1 .hd ul li a:hover p { font-weight: bold; }
.header .menu .box .nav .sub_box1 .hd ul li i { margin-right: 0.3125rem; font-size: 1.5rem; font-weight: bold; color: #666; transition: color 0.3s ease; }
.header .menu .box .nav .sub_box1 .hd ul li a:hover i { color: #d51813; }
.header .menu .box .nav .sub_box2 { padding: 1.25rem 1rem; }
.header .menu .box .nav .sub_box2 div { float: left; margin: 1.875rem; width: calc(25% - 3.75rem); }
.header .menu .box .nav .sub_box2 div a { display: block; margin: 0; padding: 1.25rem; width: 100%; height: 11rem; background: #fff; transition: all 0.3s ease; }
.header .menu .box .nav .sub_box2 div a:hover { color: #d51813; font-weight: bold; }
.header .menu .box .nav .sub_box2 div a:hover p { font-weight: bold; }
.header .menu .box .nav .sub_box2 div a img { display: block; width: 100%; height: 9rem; }
.header .menu .box .nav .sub_box2 div a p { line-height: 2.5rem; text-align: center; color: #333; margin-top: 0.625rem; }
.header_line { height: 8.75rem; }
/* 一行 + 居中 */
.header .menu .box .nav .sub_box2 { display: flex; flex-wrap: nowrap; justify-content: center; align-items: stretch; gap: 1rem; }
.header .menu .box .nav .sub_box2 div { flex: 0 1 16rem; max-width: 16rem; }
/* 卡片样式 */
.header .menu .box .nav .sub_box2 div a { display: block; width: 100%; padding: 1.2rem; background: #fff; }
/* 图片高度统一 */
.header .menu .box .nav .sub_box2 div a img { width: 100%; height: 9rem; object-fit: cover; }
/* ===============================
   顶部导航：初始透明，滚动后变黑
=============================== */

/* 初始状态（透明） */
.header .menu { background: transparent; transition: background .3s ease, box-shadow .3s ease, backdrop-filter .3s ease; }

/* 滚动后状态（黑色） */
.header.is-scrolled .menu { background: rgba(0,0,0,.92); box-shadow: 0 10px 30px rgba(0,0,0,.28); backdrop-filter: blur(6px); }

/* 你的 hover 规则建议改一下：避免和滚动状态打架 */
.header .menu:hover { background: rgba(0,0,0,.92); opacity: 1; }

/* 整体再稍微缩一点，方便小屏塞下 */
@media (max-width: 1600px) {
    .header .menu .box .nav .sub_box2 { padding: 1.25rem 3rem; gap: 0.8rem; }
    .header .menu .box .nav .sub_box2 div { flex: 0 1 14rem; max-width: 14rem; }
}
/* 高分辨率header优化 */
/*@media (min-width: 2560px) {
    .header .menu { height: 8rem; }
    .header .menu .box .nav .m a { height: 8rem; line-height: 8rem; font-size: 1.1rem; }
}*/

@media (min-width: 3839px) {
    .header .menu { height: 10rem; }
    .header .menu .box .nav .m a { height: 10rem; line-height: 10rem; font-size: 1.3rem; }
    .header .menu .box .nav .sub { top: 10rem; height: 25rem; }
}
/* ===============================
   右侧在线咨询（按 embed-icon 结构）
================================ */
.kefu-embed { position: fixed; z-index: 99999; width: 60px; height: 86px; }

/* 右侧按钮（你原结构的 .embed-icon-default） */
.kefu-embed .embed-icon-default { display: block; width: 44px; height: 98px; cursor: pointer; background-repeat: no-repeat; background-position: right center; background-size: cover; border-radius: 10px; overflow: hidden; box-shadow: 0 10px 26px rgba(0,0,0,.18); }

/* 如果你没有 embed-icon-pcIcon0 的背景图，就用这行自定义一张：
.kefu-embed .embed-icon-default{ background-image:url(/templates/cn/images/kefu_btn.png); }
*/

/* 气泡容器：绝对定位到按钮左侧，不撑开布局 */
.kefu-embed .embed-hot-issue { position: absolute; right: 44px; /* 在按钮左边 */ top: 0; height: 40px; pointer-events: none; }

/* 单条气泡：叠在同一位置，靠 class 控制显隐 */
.kefu-embed .embed-hot-issue-item { position: absolute; right: 0; top: 0; margin: 0; padding: 10px 14px; height: 40px; display: inline-flex; align-items: center; gap: 8px; background: #fff; border-radius: 999px; box-shadow: 0 8px 30px rgba(0,0,0,.12); white-space: nowrap; opacity: 0; transform: translateY(10px); transition: opacity .35s ease, transform .35s ease; }

/* 紫色点 */
.kefu-embed .embed-hot-issue-icon { width: 10px; height: 10px; border-radius: 50%; background-color: rgb(152, 97, 230); flex: 0 0 auto; }

.kefu-embed .embed-hot-issue-text { font-size: 14px; color: #333; }

/* 显示态（冒出来） */
.kefu-embed .fade-1 { opacity: 1; transform: translateY(0); }

/* 消失态（向上淡出） */
.kefu-embed .fade-0 { opacity: 0; transform: translateY(-10px); }
.kefu-embed .embed-icon-default { position: relative; width: 60px; height: 135px; overflow: hidden; }

.kefu-embed .kefu-btn-img { width: 100%; height: 100%; object-fit: cover; display: block; }


/*banner*/
.banner { position: relative; width: 100%; height: 43.75rem; overflow: hidden; }
.banner .swiper { position: relative; width: 100%; height: 100%; }
.banner .swiper .swiper-wrapper .swiper-slide { position: relative; width: 100%; height: 100%; }
.banner .swiper .swiper-wrapper .swiper-slide .img { position: relative; width: 100%; height: 100%; }
.banner .swiper .swiper-wrapper .swiper-slide .txt { position: absolute; z-index: 99; top: 40%; left: 10%; color: #fff; }
.banner .swiper .swiper-wrapper .swiper-slide .txt h2 { font-size: 3.125rem; }
.banner .swiper .swiper-wrapper .swiper-slide .txt h2 b { color: #fff; }
.banner .swiper .swiper-wrapper .swiper-slide .txt p { margin: 1.875rem 0; font-size: 2.25rem; }
.banner .swiper .swiper-wrapper .swiper-button-next,
.banner .swiper .swiper-wrapper .swiper-button-prev { color: #fff; }
.banner .swiper .swiper-wrapper .swiper-pagination.on { color: #fff; }
.banner img.mymove { width: 100%; height: auto; position: relative; animation: mymove 10s infinite; -webkit-animation: mymove 10s infinite; }

/* 高分辨率banner优化 */
@media (min-width: 2560px) {
    .banner { height: 50rem; }
    .banner .swiper .swiper-wrapper .swiper-slide .txt h2 { font-size: 4rem; }
    .banner .swiper .swiper-wrapper .swiper-slide .txt p { font-size: 2.8rem; }
}

@media (min-width: 3840px) {
    .banner { height: 60rem; }
    .banner .swiper .swiper-wrapper .swiper-slide .txt h2 { font-size: 5rem; }
    .banner .swiper .swiper-wrapper .swiper-slide .txt p { font-size: 3.5rem; }
}

/*footer*/
.footer { width: 100%; border-top: 10px solid #ff0000; }
.footer .top { padding: 4%; height: auto; }
.footer dt, .footer dt a { margin-bottom: 1.25rem; color: #fff; }
.footer dt a:hover { color: #ff0000; }
.footer dd, .footer dd a { margin: 0.625rem 0; color: #ddd; font-weight: 100; }
.footer dd a:hover { color: #ff0000; }
.footer .menu { float: left; width: 35%; }
.footer .menu dl { float: left; margin-right: 1.875rem; }
.footer .contact { margin-right: 1.875rem; float: left; width: 20%; }
.footer .ewm { float: left; width: 20%; }
.footer .ewm dl { margin-right: 1.875rem; float: left; }
.footer .join { float: right; width: 18.75rem; }
.footer .bottom { padding: 0 4%; }
.footer .copyright { float: left; }
.footer .copyright img { width: 10.9375rem; height: 3.625rem; }
.footer .copyright a { color: #fff; }
.footer .flag { float: right; width: 19.0625rem; }
.footer .flag img { width: 100%; height: auto; }
.footer-qrs { display: flex; flex-direction: column; /* 竖着排 */ align-items: center; justify-content: center; gap: 18px; padding: 0 30px; }
.footer .footer-qrs .qr-item { text-align: center; }
.footer .footer-qrs img { width: 120px; height: 120px; border-radius: 10px; background: #fff; padding: 6px; }
.footer .footer-qrs p { margin-top: 6px; font-size: 16px; color: #fff; opacity: .9; }
.k-footer-bottom-copy { justify-content: center; }
.k-footer-bottom-copy .copy { width: 100%; text-align: center; }

/* ========== 底部同款：联系我们模块 ========== */

.contact-area { width: 100%; background: #fff; padding: 30px 0 10px; }
.contact-grid { width: 96%; margin: 0 auto; display: grid; grid-template-columns: 1.2fr .8fr 1.2fr; gap: 18px; align-items: stretch; }
.contact-left, .contact-right { background: #f3f3f3; overflow: hidden; }
.contact-left img,
.contact-right img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 左右轮播按钮样式（圆形） */
.contact-area .swiper-button-prev,
.contact-area .swiper-button-next { width: 44px; height: 44px; border-radius: 50%; background: rgba(0,0,0,.35); }
.contact-area .swiper-button-prev:after,
.contact-area .swiper-button-next:after { font-size: 16px; color: #fff; font-weight: 700; }

/* 中间：标题+电话+视频 */
.contact-mid { text-align: center; padding: 14px 10px; background: #fff; }
.contact-mid h2 { font-size: 26px; font-weight: 900; margin-top: 6px; color: #111; }
.contact-mid .sub { font-size: 16px; color: #888; margin-top: 6px; }
.contact-mid .tel { font-size: 44px; font-weight: 900; color: #d51813; margin: 10px 0 14px; }
.video-box { width: 92%; margin: 0 auto; background: #333; padding: 12px; }
.video-box video { width: 100%; height: 210px; display: block; background: #333; }

/* 右侧2x2 */
.mini-2x2 { height: 100%; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 10px; padding: 10px; background: #fff; }
.mini-2x2 > div { overflow: hidden; background: #f3f3f3; }
.mini-2x2 img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ========== 城市热线条 ========== */
.city-strip { width: 100%; background: #f3f3f3; padding: 26px 0; }
.city-wrap { width: 92%; margin: 0 auto; display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; text-align: center; }
.city-item { text-align: center; }
.city-item .ico { display: flex; align-items: center; justify-content: center; overflow: hidden; /* 圆形裁切 */ }

.city-item .ico img { object-fit: contain; display: block; }

.city-item h3 { font-size: 18px; font-weight: 900; color: #222; margin-bottom: 6px; }
.city-item p { font-size: 16px; color: #777; }

/* ========== 黑色大页脚 ========== */
.k-footer { width: 100%; background: #0c0c0c; color: #aaa; }
.k-footer-inner { width: 92%; margin: 0 auto; padding: 34px 0 18px; }
.k-footer-cols { display: grid; grid-template-columns: repeat(4, 1fr) 1.2fr 1.6fr; gap: 18px; align-items: start; }
.k-footer .col h4 { color: #ddd; font-size: 18px; font-weight: 900; margin-bottom: 10px; text-align: center; }
.k-footer .col a { display: block; color: #888; font-size: 16px; line-height: 2.2; text-align: center; }
.k-footer .col a:hover { color: #d51813; }

.k-footer .qrs { display: flex; gap: 16px; align-items: flex-start; justify-content: center; }
.k-footer .qr { text-align: center; }
.k-footer .qr img { width: 120px; height: 120px; background: #fff; display: block; }
.k-footer .qr p { font-size: 16px; color: #aaa; margin-top: 8px; }

.k-footer .right { text-align: left; padding-left: 12%; }
.k-footer .big-tel { font-size: 50px; font-weight: 900; color: #d51813; letter-spacing: 2px; margin-top: 6px; }
.k-footer .info p { font-size: 16px; color: #888; line-height: 2.0; margin: 0; }

.k-footer-bottom { border-top: 1px solid rgba(255,255,255,.08); margin-top: 9px; padding-top: 14px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.k-footer-bottom .links { font-size: 16px; color: #777; }
.k-footer-bottom .links a { color: #777; margin-right: 14px; }
.k-footer-bottom .links a:hover { color: #d51813; }
.k-footer-bottom .copy { font-size: 16px; color: #666; text-align: right; }
.k-footer-bottom .copy a { color: #666; }
.k-footer-bottom .copy a:hover { color: red; }

/* ========== 视频和文字居中 ========== */
.contact-mid { text-align: center; padding: 14px 10px; background: #fff; }

.contact-mid h2 { font-size: 26px; font-weight: 900; margin-top: 6px; color: #111; }

.contact-mid .sub { font-size: 16px; color: #888; margin-top: 6px; }

.contact-mid .tel { font-size: 44px; font-weight: 900; color: #d51813; margin: 10px 0 14px; text-align: center; }

/* 视频盒子调整居中 */
.video-box { width: 92%; margin: 0 auto; background: #333; padding: 12px; }

.video-box video { width: 100%; height: 210px; display: block; background: #333; }

/* ========== 二维码一行显示 ========== */
.k-footer .qrs { display: flex; gap: 16px; align-items: center; justify-content: center; }

.k-footer .qr { text-align: center; }

.k-footer .qr img { width: 120px; height: 120px; background: #fff; display: block; }

.k-footer .qr p { font-size: 16px; color: #aaa; margin-top: 8px; }

/* ========== 黑色大页脚 调整 ========== */
.k-footer { width: 100%; background: #0c0c0c; color: #aaa; }

.k-footer-inner { width: 92%; margin: 0 auto; padding: 100px 0 38px; }

.k-footer-bottom .copy { font-size: 16px; color: #666; text-align: center; }

.k-footer .big-tel { font-size: 44px; font-weight: 900; color: #d51813; letter-spacing: 2px; margin-top: 6px; text-align: center; }
/* ===============================
   contact-wall（按 Nuxt 结构）
=============================== */
.contact-wall { position: relative; width: 100%; height: 415px; margin-top: 3rem; overflow: hidden; background: #eee; }
/* 合照 */
.index_team { position: relative; width: 100%; height: 583px; background: #ff000c; }

.footer_box { width: 100%; height: 583px; background: url(/templates/cn/images/Groupphoto.jpg) no-repeat; background-attachment: fixed; background-position: bottom; }
/* 背景长图轮播容器 */
.contact-wall .footer-banner { position: absolute; inset: 0; overflow: hidden; }

/* 轨道：横向排，永远居中高度 */
.contact-wall .track { position: absolute; left: 0; top: 50%; transform: translate3d(0,-50%,0); display: flex; width: 9999px; /* 足够大，靠 JS 改 translateX */ will-change: transform; transition: transform 0.6s ease; }

/* 每一帧占满一屏 */
.contact-wall .slide { width: 100vw; height: 430px; flex: 0 0 100vw; position: relative; }

.contact-wall .bgimg { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 遮罩，让白盒子更清晰 */
.contact-wall .banner-mask { position: absolute; inset: 0; }

/* 左右按钮：固定在屏幕两侧 */
.contact-wall .banner-arrow { z-index: 50 !important; pointer-events: auto; position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 999px; border: 2px solid rgba(255, 255, 255, .65); background: rgba(0,0,0,0.35); color: #fff; font-size: 28px; line-height: 42px; text-align: center; cursor: pointer; z-index: 10; user-select: none; }
.contact-wall .banner-arrow-left { left: 18px; }
.contact-wall .banner-arrow-right { right: 18px; }
/* =========================
   箭头 Hover 动画效果
========================= */
.contact-wall .banner-arrow { transition: transform .25s ease, opacity .25s ease, box-shadow .25s ease, background .25s ease; cursor: pointer; user-select: none; }

/* 鼠标移入：放大 + 轻微发光 */
.contact-wall .banner-arrow:hover { transform: translateY(-50%) scale(1.12); opacity: 1; box-shadow: 0 10px 25px rgba(0,0,0,.35); background: rgba(0,0,0,.55); }

/* 左右箭头额外加一点“方向位移感” */
.contact-wall .banner-arrow-left:hover { transform: translateY(-50%) translateX(-6px) scale(1.12); }
.contact-wall .banner-arrow-right:hover { transform: translateY(-50%) translateX(6px) scale(1.12); }

/* 点击按下：回弹一点 */
.contact-wall .banner-arrow:active { transform: translateY(-50%) scale(0.96); box-shadow: 0 6px 14px rgba(0,0,0,.25); }

/* 白色盒子居中 */
.contact-wall .wrap { position: relative; z-index: 20; height: 100%; display: flex; align-items: center; justify-content: center; }

.contact-wall .contact-center { width: 420px; max-width: calc(100% - 40px); background: #fff; box-shadow: 0 18px 40px rgba(0,0,0,0.14); padding: 26px 28px 18px; text-align: center; }
.contact-wall .center-title { text-align: center; }
.contact-wall .center-title h2 { font-size: 26px; font-weight: 800; color: #111; margin: 0 0 4px; }
.contact-wall .center-title p { font-size: 16px; color: #888; margin: 0; }

.contact-wall .hotline { margin: 10px 0 14px; font-size: 44px; font-weight: 900; color: #d51813; line-height: 1.05; white-space: nowrap; text-align: center; }

/* ===============================
   底部 contact-wall：中间白盒 video-card
   图片 + 播放图标 + 黑色蒙版 + 呼吸动画（独立样式）
=============================== */

.contact-wall .video-card { position: relative; width: 100%; height: 240px; overflow: hidden; border-radius: 10px; background: #2f2f2f; }

/* 整块可点击 */
.contact-wall .video-card .footer-videoLink { position: absolute; inset: 0; display: block; cursor: pointer; text-decoration: none; }

/* 封面图铺满 */
.contact-wall .video-card .footer-videoPoster { width: 100%; height: 100%; object-fit: cover; display: block; transform: translateZ(0); transition: transform .35s ease; }

/* hover：封面轻微放大一点点（不影响布局） */
.contact-wall .video-card .footer-videoLink:hover .footer-videoPoster { transform: scale(1.03); }

/* 黑色蒙版（默认淡，hover 更黑） */
.contact-wall .video-card .footer-videoLink::before { content: ""; position: absolute; inset: 0; z-index: 2; background: rgba(0,0,0,.60); opacity: .18; transition: opacity .25s ease; pointer-events: none; }

.contact-wall .video-card .footer-videoLink:hover::before { opacity: .45; }

/* 播放按钮（圆 + 三角） */
.contact-wall .video-card .footer-playBtn { position: absolute; left: 50%; top: 50%; width: 68px; z-index: 3; height: 68px; transform: translate(-50%, -50%); border-radius: 999px; background: rgba(0,0,0,.42); border: 2px solid rgba(255,255,255,.85); box-shadow: 0 14px 30px rgba(0,0,0,.25); transition: transform .25s ease, background .25s ease, box-shadow .25s ease, border-color .25s ease; pointer-events: none; /* 点击落在链接上 */ }

/* 三角形 */
.contact-wall .video-card .footer-playBtn::after { content: ""; position: absolute; left: 54%; top: 50%; transform: translate(-50%, -50%); width: 0; height: 0; border-left: 18px solid rgba(255,255,255,.95); border-top: 12px solid transparent; border-bottom: 12px solid transparent; filter: drop-shadow(0 6px 12px rgba(0,0,0,.35)); }

/* 呼吸动画 */
@keyframes footerPlayPulse {
    0% { transform: translate(-50%, -50%) scale(1.02); }
    50% { transform: translate(-50%, -50%) scale(1.12); }
    100% { transform: translate(-50%, -50%) scale(1.02); }
}

/* hover：按钮呼吸 + 更亮 */
.contact-wall .video-card .footer-videoLink:hover .footer-playBtn { animation: footerPlayPulse 1.15s ease-in-out infinite; background: rgba(0,0,0,.58); border-color: rgba(255,255,255,.92); box-shadow: 0 22px 44px rgba(0,0,0,.35); }

/* ===============================
   二维码强制一行（修复你现在竖排）
   你当前是 flex-direction:column :contentReference[oaicite:2]{index=2}
=============================== */
.footer-qrs { flex-direction: row !important; gap: 26px !important; }

/* 响应式 */
@media (max-width: 1200px) {
    .contact-grid { grid-template-columns: 1fr; }
    .video-box video { height: 240px; }
    .city-wrap { grid-template-columns: repeat(2, 1fr); }
    .k-footer-cols { grid-template-columns: 1fr 1fr; }
    .k-footer-bottom { flex-direction: column; align-items: flex-start; }
    .k-footer .big-tel { font-size: 34px; }
}

/* ===============================
   首页底部备案信息条
=============================== */
.footer-record { width: 100%; background: #03397F; color: rgba(255,255,255,0.65); text-align: center; font-size: 16px; line-height: 1.6; padding: 14px 20px; border-top: 1px solid rgba(255,255,255,0.15); }

.footer-record a { color: rgba(255,255,255,0.75); margin-left: 6px; }

.footer-record a:hover { color: #ff2b2b; }

/* ===============================
   页脚：小屏更舒展（覆盖原来的 footer-body / footer-nav-cols）
   =============================== */

/* 让整体间距、字号等比例缩放（不再死 10rem / 18px） */
.footer-body { gap: clamp(28px, 4vw, 10rem); /* 覆盖 gap:10rem，屏幕窄时自动变小 */ }

.footer-nav-cols { /* 覆盖 font-size:18px；小屏自动变小一点 */ font-size: clamp(14px, 1.05vw, 18px); /* 增加列间距，避免文字挤在一起 */ column-gap: clamp(18px, 3.2vw, 70px); /* 行间距也拉开一点 */ row-gap: 10px; /* 默认右对齐没问题，但小屏会显得更挤，下面媒体查询里会改成左对齐 */ }

/* 列内部不要强制最小宽，允许真正压缩 */
.footer-nav-cols dl { min-width: 0; }

/* 标题/列表的间距做一点等比例缩放 */
.footer-nav-cols dt { margin-bottom: clamp(10px, 1.2vw, 16px); }
.footer-nav-cols dd { margin-bottom: clamp(6px, 0.9vw, 10px); }
.footer-nav-cols a { line-height: 1.8; word-break: keep-all; /* 中文尽量不拆得很怪（必要时浏览器会自己换行） */ }

/* ====== 关键：可视宽度变小时，把 4 列改成 2 列，并改为左对齐更舒服 ====== */
@media (max-width: 1500px) {
    .footer-body { gap: clamp(18px, 2.8vw, 56px); /* 小屏进一步收紧两块间距 */ }
    .footer-nav-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); /* 4 -> 2 */ text-align: left; column-gap: clamp(18px, 5vw, 90px); }
}

/* 再窄一点：2 列也挤，就改成 1 列（不会再“挤成一团”） */
@media (max-width: 1100px) {
    .footer-nav-cols { grid-template-columns: 1fr; }
}

/*seach*/
.seach { position: relative; float: right; margin-top: 1.875rem; }
.seach .wenzi { border: none; float: left; width: 11.875rem; padding-left: 0.625rem; height: 1.8125rem; line-height: 1.8125rem; color: #fff; font-size: 0.875rem; background: url('../images/wenzi.jpg') no-repeat; background-size: cover; }
.seach .dianji { border: none; position: relative; left: -1.875rem; float: left; width: 1.8125rem; height: 1.8125rem; background: url('../images/dianji.jpg') no-repeat; background-size: cover; cursor: pointer; }

/*图片放大镜样式*/
.right-extra { float: left; width: 21.875rem; }
.jqzoom { float: left; border: none; position: relative; padding: 0; cursor: pointer; margin: 0; display: block; }
.zoomdiv { z-index: 100; position: absolute; top: 0; left: 0; width: 21.875rem; height: 21.875rem; background: #ffffff; border: 1px solid #ccc; display: none; text-align: center; overflow: hidden; }
.jqZoomPup { z-index: 10; visibility: hidden; position: absolute; top: 0; left: 0; width: 1.25rem; height: 1.25rem; border: 1px solid #aaa; background: #ffffff; opacity: 0.5; -moz-opacity: 0.5; -khtml-opacity: 0.5; filter: alpha(Opacity=50); }

/*图片小图预览列表*/
.spec-preview { width: 21.875rem; height: 21.875rem; border: 1px solid #DFDFDF; }
.spec-scroll { clear: both; margin-top: 0.3125rem; width: 22rem; }
.spec-scroll .prev { float: left; margin-right: 0.25rem; }
.spec-scroll .next { float: right; }
.spec-scroll .prev, .spec-scroll .next { display: block; font-family: "宋体"; text-align: center; width: 0.625rem; height: 3.375rem; line-height: 3.375rem; border: 1px solid #ccc; background: #ebebeb; cursor: pointer; text-decoration: none; }
.spec-scroll .items { float: left; position: relative; width: 20.125rem; height: 3.5rem; overflow: hidden; }
.spec-scroll .items ul { position: absolute; width: 999999px; height: 3.5rem; }
.spec-scroll .items ul li { float: left; width: 4rem; text-align: center; }
.spec-scroll .items ul li img { border: 1px solid #CCC; padding: 0.125rem; width: 3.125rem; height: 3.125rem; transition: all 0.3s ease; }
.spec-scroll .items ul li img:hover { border: 0.125rem solid #FF6600; padding: 0.0625rem; }

/*列表页码样式*/
/* 列表页码样式：纯文字风格 */
div.pagelist { margin: 30px 0 10px; text-align: center; font-size: 16px; color: #666; font-family: "Microsoft YaHei", Arial, sans-serif; }
/* 共30记录 / ... 等普通文字 */
div.pagelist span { display: inline-block; margin: 0 4px; color: #666; }
/* “...” */
div.pagelist span.dot { color: #999; }
/* 链接数字 & 上页/下页 */
div.pagelist a { display: inline-block; margin: 0 4px; padding: 0; border: none; background: none; color: #666; text-decoration: none; transition: color .2s ease; }
/* 当前页：红色 */
div.pagelist a.current { color: #d51813; font-weight: 400; }
/* hover 时变红即可 */
div.pagelist a:hover { color: #d51813; }
/*fullpage全屏样式*/
#fp-nav ul li a span, .fp-slidesNav ul li a span { width: 0.25rem; height: 0.25rem; background-color: #ddd; }
#fp-nav li .active span, .fp-slidesNav.active span { background-color: #ccc; }

.fp-controlArrow.fp-prev { left: 6%; width: 0; height: 0; border-top: 1.25rem solid transparent; border-right: 1.25rem solid rgba(255, 255, 255, 0.5); border-bottom: 1.25rem solid transparent; border-left: 0; transition: all 0.3s ease; }
.fp-controlArrow.fp-prev:hover { border-right: 1.25rem solid rgba(255, 255, 255, 1); }
.fp-controlArrow.fp-next { right: 6%; width: 0; height: 0; border-top: 1.25rem solid transparent; border-right: 0; border-bottom: 1.25rem solid transparent; border-left: 1.25rem solid rgba(255, 255, 255, 0.5); transition: all 0.3s ease; }
.fp-controlArrow.fp-next:hover { border-left: 1.25rem solid rgba(255, 255, 255, 1); }

/* fullpage 其他屏保持裁切，但第八屏不要裁切 */
#fullpage .section { position: relative; }
#fullpage .section:not(.index_footer8) { overflow: hidden; }

/* 第八屏：允许内部滚动（你要“跳出全屏滚动”时至少不该被裁掉） */
#fullpage .section.index_footer8 { overflow-y: auto; overflow-x: hidden; }
.index_footer8 { overflow-y: auto; overflow-x: hidden; }
/* 覆盖你原来 overflow:hidden */

#fullpage .section .slide { background-size: cover !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; background-repeat: no-repeat; background-position: center center; }
#fullpage .section video { position: absolute; right: 0; min-width: 100%; min-height: 100%; width: auto; height: auto; background-size: cover; top: 50%; transform: translateY(-50%); }
video.hosted-video { background-position: center; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }

/*overlay透明图层样式*/
.overlay { background: #000; filter: alpha(opacity=40); -moz-opacity: 0.4; -khtml-opacity: 0.4; opacity: 0.4; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; }

/*mySwiper样式*/
@keyframes mymove {
    from { top: 0; }
    to { top: -5rem; }
}

@-webkit-keyframes mymove {
    from { top: 0; }
    to { top: -5rem; }
}

@keyframes flyIn {
    0% { opacity: 0; transform: translateX(100%); }
    100% { opacity: 1; transform: translateX(0); }
}

.fly-in-right-to-left { position: absolute; animation: flyIn 2s forwards; }

.content_swiper { position: relative; }
.content_swiper .swiper-button-next { position: absolute; top: 17.3125rem; right: -0.125rem; color: #000; }
.content_swiper .swiper-button-prev { position: absolute; top: 17.3125rem; left: -0.125rem; color: #000; }
.content_swiper .swiper-wrapper .swiper-slide { transition: transform 0.5s ease; }
.content_swiper .swiper-wrapper .swiper-slide:hover img { transform: scale(1.05); box-shadow: 0 0.625rem 1.25rem rgba(0, 0, 0, 0.5); }
.content_swiper .swiper-button-next:hover,
.content_swiper .swiper-button-prev:hover { font-weight: bold; }

.mySwiper { position: relative; }
.mySwiper .swiper-button-next { position: absolute; top: 17.3125rem; right: -0.125rem; color: #000; }
.mySwiper .swiper-button-prev { position: absolute; top: 17.3125rem; left: -0.125rem; color: #000; }
.mySwiper .swiper-button-next:hover,
.mySwiper .swiper-button-prev:hover { font-weight: bold; }

/*通用样式结束-------------------------------------------------------------------------*/

/*首页样式开始-------------------------------------------------------------------------*/
/* ================= 首页样式 ================= */

/* 统一 section 高度 */
#fullpage .section { height: 100vh; }
#fullpage .section { position: relative; overflow: hidden; }

/* ========== 第一屏 ========== */

.index_banner { position: relative; background: url("/upload/202512/31/202512311134471044.jpg") center/cover no-repeat; color: #fff; }
/* 首页用 fullpage，不需要 header_line 的占位高度 */
.home-page .header_line { height: 0; overflow: hidden; }
.index_banner .fullSlide { width: 100%; height: 100vh; position: relative; overflow: hidden; }
.index_banner .fullSlide .bd ul li { width: 100%; height: 100vh; background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; }
.index_banner .slide-mask { position: absolute; inset: 0; }
/* 文案区域 */
.index_banner .slide-info { position: relative; width: 100%; text-align: center; z-index: 10; padding-top: 20%; }
.index_banner .s-t1 { font-size: 3rem; line-height: 1.4; margin-bottom: 1rem; font-weight: 300; letter-spacing: 1px; }
.index_banner .s-t2 { font-size: 2.5rem; line-height: 1.4; font-weight: 400; letter-spacing: 1px; }
/* 文字字符样式 */
.index_banner .char { display: inline-block; padding: 0 2px; transform-origin: center center; transform-style: preserve-3d; perspective: 1000px; }
/* 多米诺效果 */
.index_banner .char.flip { animation: dominoFlip180 0.5s ease-in-out forwards; }
/* 波浪感更明显 */
.index_banner .char.fade { opacity: 0.7; transform: scale(0.96); }
/* 标点符号不参与动画 */
.index_banner .char.punctuation { animation: none !important; }
/* 空格占位 */
.index_banner .char.space { width: 0.6em; margin: 0 2px; }
/* 180° 丝滑翻转再翻回来 */
@keyframes dominoFlip180 {
    0% { transform: rotateY(0deg); }
    50% { transform: rotateY(180deg); }
    100% { transform: rotateY(0deg); }
}

/* 底部条：左箭头+点，右 01/03 */
.index_banner .banner-bottom { position: absolute; left: 0; right: 0; bottom: 40px; display: flex; align-items: center; justify-content: space-between; z-index: 100; }
.index_banner .banner-left { display: flex; align-items: center; gap: 14px; }
/* 小圆点 */
.index_banner .hd ul { display: flex; gap: 8px; }
.index_banner .hd ul li { width: 20px; height: 20px; border-radius: 999px; background: rgba(255,255,255,.5); cursor: pointer; transition: all .3s; font-size: 0 !important; color: transparent !important; }
.index_banner .hd ul li.on { background: #fff; box-shadow: 0 0 10px rgba(255, 43, 43, 0.8); }
/* 01 / 03 放右侧，当前页红色 */
.index_banner .banner-index { font-size: 40px; letter-spacing: 2px; font-weight: 300; }
.index_banner .banner-index .cur { color: #ff2b2b; font-weight: 600; font-size: 40px; }
.index_banner .banner-index .split,
.index_banner .banner-index .total { color: #ffffff; opacity: 0.8; }
/* 左右箭头 */
.index_banner .arrow { width: 40px; height: 40px; border-radius: 50%; border: 2px solid rgba(255,255,255,.7); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .3s; background: rgba(0,0,0,.3); }
.index_banner .arrow::before { content: ""; font-size: 20px; color: #fff; font-weight: bold; }
.index_banner .prev::before { content: "‹"; }
.index_banner .next::before { content: "›"; }
.index_banner .arrow:hover { background: rgba(255, 43, 43, 0.8); border-color: #ff2b2b; transform: scale(1.1); }
/* ===============================
   第一屏轮播：背景图一直向下移动
=============================== */
@keyframes bannerDownMove {
    0% { background-position: 50% 0%; }
    100% { background-position: 50% 100%; }
}

/* 第一屏每张轮播背景持续下移 */
.index_banner .fullSlide .bd ul li { animation: bannerDownMove 12s linear infinite; will-change: background-position; }

/* 用户系统设置“减少动画”时，自动禁用 */
@media (prefers-reduced-motion: reduce) {
    .index_banner .fullSlide .bd ul li { animation: none !important; }
}


/* ===========================
   第二屏 ABOUT US
=========================== */
.index_about2 { width: 100%; background: #fff; padding: 80px 0; }

.index_about2 .wrap { width: 90%; margin: 0 auto; display: flex; gap: 70px; align-items: flex-start; }

/* 第二屏顶部黑色条 */
.index_about2 { position: relative; }

.index_about2 .about2-topbar { z-index: 2; }
.index_about2 .wrap { z-index: 3; padding-top: 8%; }

/* 左侧大图 */
.index_about2 .about2-left { width: 60%; }

.index_about2 .about2-img { width: 100%; border-radius: 14px; overflow: hidden; box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15); background: #f7f7f7; }

.index_about2 .about2-img img { width: 100%; height: 565px; object-fit: cover; display: block; }

/* 右侧内容 */
.index_about2 .about2-right { width: 40%; padding-top: 10px; }

.index_about2 .about2-title .en { font-size: 64px; line-height: 1; letter-spacing: 2px; color: #e60012; font-weight: 800; margin: 0 0 18px 0; }

.index_about2 .about2-title .cn { font-size: 30px; color: #333; font-weight: 700; margin: 0; }

.index_about2 .about2-title .line { display: block; width: 70px; height: 3px; background: #e60012; margin-top: 14px; }

/* 文案 */
.index_about2 .about2-desc { margin-top: 18px; font-size: 16px; line-height: 1.9; color: #666; }

/* 2x2 卡片布局 */
.index_about2 .about2-cards { margin-top: 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }

.index_about2 .about2-cards .card { background: #fff; border: 1px solid #ededed; border-radius: 10px; padding: 22px 18px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04); text-align: center; transition: 0.25s; }

.index_about2 .about2-cards .card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08); }

.index_about2 .about2-cards .num { font-size: 42px; color: #e60012; font-weight: 800; line-height: 1.1; }

.index_about2 .about2-cards .unit { font-size: 18px; margin-left: 3px; font-weight: 700; }

.index_about2 .about2-cards .txt { font-size: 16px; color: #777; margin-top: 8px; }

/* ===========================
   响应式（缩小屏幕自动变竖排）
=========================== */
@media screen and (max-width: 1280px) {
    .index_about2 .wrap { width: 92%; gap: 40px; }

    .index_about2 .about2-title .en { font-size: 48px; }
}

@media screen and (max-width: 980px) {
    .index_about2 { padding: 55px 0; }

    .index_about2 .wrap { width: 92%; flex-direction: column; gap: 26px; }

    .index_about2 .about2-left,
    .index_about2 .about2-right { width: 100%; }

    .index_about2 .about2-img img { height: 320px; }

    .index_about2 .about2-title .en { font-size: 44px; }
}

@media screen and (max-width: 520px) {
    .index_about2 .about2-img img { height: 220px; }

    .index_about2 .about2-title .en { font-size: 38px; }

    .index_about2 .about2-cards { grid-template-columns: 1fr; }
}

/* ===============================
   第三屏：TEAMLEADER（稳定版）
=============================== */
.index_teamleader { position: relative; width: 100%; height: 100vh; overflow: hidden; color: #fff; background: #0b0b0d; }

/* 背景图（由 data-bg 注入） */
.index_teamleader .tl-bg { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; transform: scale(1.02); }
/* 第三屏 tags：鼠标移入变黑底白字 */
.index_teamleader .tl-tags .tag { cursor: pointer; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }

.index_teamleader .tl-tags .tag:hover { background: rgb(0 0 0 / 95%); color: #fff; border-color: rgb(0 0 0 / 95%); }

/* 背景暗层（提高文字可读性） */
.index_teamleader .tl-bg-mask { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.25) 55%, rgba(0,0,0,.55)); }

/* 主体布局 */
.index_teamleader .tl-wrap { position: relative; z-index: 2; height: 100%; width: 92%; margin: 0 auto; display: flex; align-items: center; gap: 90px; padding-top: 3%; }

/* ===============================
   左侧竖排标题：自适应 + 各分辨率一致
=============================== */
.index_teamleader .tl-side { position: relative; width: clamp(72px, 6vw, 130px); height: 78%; min-height: 520px; display: flex; align-items: center; justify-content: center; }
/* 英文竖排：用 clamp 自适应字号 */
.index_teamleader .tl-side-en { position: absolute; left: 0; top: 38%; transform: translateY(-50%); writing-mode: vertical-rl; text-orientation: mixed; font-size: clamp(28px, 3.2vw, 58px); letter-spacing: clamp(2px, .45vw, 8px); font-weight: 900; line-height: 1; opacity: .95; }
/* 中文竖排：同样自适应，永远垂直居中 */
.index_teamleader .tl-side-cn { position: absolute; left: clamp(38px, 3.8vw, 76px); top: 65%; transform: translateY(-50%); display: flex; flex-direction: column; gap: clamp(6px, 1vh, 12px); font-size: clamp(26px, 3vw, 54px); font-weight: 900; line-height: 1; }
/* 红色块：跟着中文位置走，自适应大小 */
.index_teamleader .tl-side-block { position: absolute; left: clamp(28px, 3.1vw, 58px); top: 50%; transform: translateY(-50%); width: clamp(40px, 3.8vw, 60px); height: clamp(120px, 18vh, 170px); background: rgba(255,0,40,.55); border-radius: 10px; z-index: -1; box-shadow: 0 18px 50px rgba(255,0,40,.25); }

/* 右侧主体（强制有高度） */
.index_teamleader .tl-main { position: relative; flex: 1; height: 70%; /*min-height: 520px;*/ display: flex; align-items: center; }

.index_teamleader .tl-viewport { width: 100%; height: 100%; overflow: hidden; padding: 0; }

/* track 不要撑出可视区 */
.index_teamleader .tl-track { height: 100%; display: flex; gap: 28px; transition: transform .55s cubic-bezier(.22,.8,.22,1); will-change: transform; }

/* 卡片：严格 3 张宽度 */
.index_teamleader .tl-card { position: relative; height: 100%; border-radius: 18px; overflow: hidden; border: 1px solid rgba(255,255,255,.18); box-shadow: 0 18px 60px rgba(0,0,0,.55); background: rgba(255,255,255,.10); flex: 0 0 calc((100% - 64px) / 3); width: calc((100% - 64px) / 3); }
/* 图片层 */
.index_teamleader .tl-photo { position: absolute; inset: 0; }
.index_teamleader .tl-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center top; /* 关键：优先保留头部 */ display: block; transform: scale(1); transition: transform .55s cubic-bezier(.22,.8,.22,1); will-change: transform; }
/* hover 时：只放大图片，卡片本身不动 */
.index_teamleader .tl-card:hover .tl-photo img { transform: scale(1.06); }

/* is-active（由 hover JS 触发）时：同样放大图片 */
.index_teamleader .tl-card.is-active .tl-photo img { transform: scale(1.06); }

/* 图片加载失败：用渐变占位 */
.index_teamleader .tl-card.img-fail .tl-photo { background: linear-gradient(135deg, rgba(255,0,40,.35), rgba(0,0,0,.15)); }
.index_teamleader .tl-card.img-fail .tl-photo img { display: none; }

.index_teamleader .tl-dim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.35) 55%, rgba(0,0,0,.78)); opacity: .85; transition: opacity .35s ease; }

/* 信息面板：默认藏在底部 */
.index_teamleader .tl-info { position: absolute; left: 22px; right: 22px; bottom: 18px; z-index: 3; transform: translateY(52%); opacity: 0; transition: transform .38s cubic-bezier(.22,.8,.22,1), opacity .28s ease; }

.index_teamleader .tl-name { font-size: 30px; font-weight: 900; }
.index_teamleader .tl-role { margin-top: 6px; font-size: 18px; color: rgb(255 255 255 / 95%); }
.index_teamleader .tl-desc { margin-top: 14px; font-size: 16px; line-height: 1.85; color: rgba(255,255,255,.90); }

.index_teamleader .tl-tags { margin-top: 14px; display: flex; gap: 10px; flex-wrap: wrap; }
.index_teamleader .tl-tags .tag { font-size: 15px; padding: 6px 12px; border-radius: 999px; background: rgb(203 0 0 / 95%); border: 1px solid rgb(203 0 0 / 35%); color: rgb(255 255 255); }

/* hover */
/*.index_teamleader .tl-card:hover { transform: translateY(-8px); }*/
.index_teamleader .tl-card:hover .tl-dim { opacity: .55; }
.index_teamleader .tl-card:hover .tl-info { transform: translateY(0); opacity: 1; }

/* 默认激活 */
.index_teamleader .tl-card.is-active .tl-dim { opacity: .55; }
.index_teamleader .tl-card.is-active .tl-info { transform: translateY(0); opacity: 1; }
.index_teamleader .tl-track.has-active .tl-card:not(.is-active) { opacity: .82; filter: brightness(.78); }

/* 箭头 */
.index_teamleader .tl-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 999px; border: 2px solid rgba(120,200,255,.45); background: rgba(0,0,0,.35); color: #cfeaff; cursor: pointer; z-index: 6; display: flex; align-items: center; justify-content: center; transition: transform .2s ease, background .2s ease, border-color .2s ease, opacity .2s ease; }
.index_teamleader .tl-arrow span { font-size: 22px; font-weight: 900; line-height: 1; }
.index_teamleader .tl-prev { left: -60px; }
.index_teamleader .tl-next { right: -60px; }
.index_teamleader .tl-arrow:hover { transform: translateY(-50%) scale(1.08); background: rgba(255,0,40,.60); border-color: rgba(255,0,40,.95); color: #fff; }
.index_teamleader .tl-arrow.is-disabled { opacity: .35; pointer-events: none; }
.index_teamleader .tl-role { display: inline-flex; align-items: center; justify-content: center; padding: 10px 18px; margin-top: 10px; font-size: 16px; font-weight: 700; letter-spacing: 1px; color: #fff; background: rgb(203 0 0 / 95%); border: 1px solid rgb(203 0 0 / 35%); border-radius: 999px; cursor: pointer; user-select: none; transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease, border-color .25s ease; }

/* 只在鼠标指向按钮本身才生效 */
.index_teamleader .tl-role:hover { background: #000; color: #fff; border-color: #000; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0,0,0,.35); }

.index_teamleader .tl-role:active { transform: translateY(0px) scale(0.98); box-shadow: 0 6px 14px rgba(0,0,0,.22); }

/* 响应式 */
@media (max-width: 1200px) {
    .index_teamleader .tl-card { flex: 0 0 calc((100% - 32px) / 2); width: calc((100% - 32px) / 2); }
    .index_teamleader .tl-side-en { font-size: 48px; }
    .index_teamleader .tl-side-cn { font-size: 46px; }
}

@media (max-width: 720px) {
    .index_teamleader .tl-wrap { width: 94%; gap: 18px; }
    .index_teamleader .tl-side { width: 78px; }
    .index_teamleader .tl-side-en { font-size: 38px; }
    .index_teamleader .tl-side-cn { left: 48px; font-size: 36px; }
    .index_teamleader .tl-card { flex: 0 0 100%; width: 100%; }
    .index_teamleader .tl-viewport { padding: 0 50px; }
}

/* ================= 第四屏：新闻动态 ================= */
.index_news { position: relative; background: #fff; overflow: hidden; }

/* 顶部黑色底条：用来显示导航区域 */
.index_news .news-topbar { position: absolute; left: 0; top: 0; width: 100%; height: 7.5rem; background: #000; z-index: 1; pointer-events: none; }

/* 内容容器 */
.index_news .news-inner-der { position: relative; z-index: 2; padding-top: 9.5rem; padding-bottom: 6rem; }

/* 顶部标题区：左标题 + 右横线 */
.index_news .news-head { display: flex; align-items: center; justify-content: space-between; gap: 3rem; margin-bottom: 6.2rem; }

.index_news .news-title { font-size: 4.2rem; font-weight: 800; letter-spacing: 1px; line-height: 1.1; white-space: nowrap; }

.index_news .news-title .red { color: #d7362d; }

.index_news .news-title .black { color: #333; }

.index_news .news-line { flex: 1; height: 2px; background: #3c3c3c; opacity: .75; transform: translateY(6px); }

/* 四列模块 */
.index_news .news-services { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6.5rem; align-items: start; }

/* 单个模块 */
.index_news .service-item { text-align: left; }

.index_news .service-icon { height: 92px; margin-bottom: 2.5rem; color: #6d6d6d; }

.index_news .service-icon svg { display: block; }

.index_news .service-name { font-size: 2.6rem; font-weight: 800; line-height: 1.2; color: #333; margin: 0 0 2.5rem; }

/* 列表 */
.index_news .service-list { padding: 0; margin: 0 0 2.2rem; list-style: none; font-size: 1.25rem; color: #666; line-height: 2.25; }

.index_news .service-list li { white-space: nowrap; }

/* MORE */
.index_news .service-more { font-size: 1.25rem; color: #666; letter-spacing: 1px; margin-top: 2rem; }
/* ========== 第四屏卡片 ========== */

/* 让每个卡片有“卡片感” */
.index_news .service-item { background: transparent; border-radius: 10px; padding: 3.2rem 3.2rem 2.6rem; transition: background .25s ease, box-shadow .25s ease, transform .25s ease; }

/* 默认态：灰色图标/文字 */
.index_news .service-item .service-icon { color: #8a8a8a; transition: color .25s ease; }
.index_news .service-item .service-name { color: #3a3a3a; transition: color .25s ease; }
.index_news .service-item .service-list { color: #777; transition: color .25s ease; }
.index_news .service-item .service-more { color: #777; display: inline-block; border-bottom: 2px solid transparent; padding-bottom: .3rem; transition: color .25s ease, border-color .25s ease; }

/* hover 态：红底、白字、阴影、轻微上浮 */
.index_news .service-item:hover { background: #d7362d; box-shadow: 0 18px 42px rgba(0,0,0,.18); transform: translateY(-2px); }

/* hover 时图标和文本全部变白 */
.index_news .service-item:hover .service-icon { color: #fff; }
.index_news .service-item:hover .service-name { color: #fff; }
.index_news .service-item:hover .service-list { color: rgba(255,255,255,.92); }



/*（可选）让每个卡片的图标对齐截图：靠左上，下面留更大空 */
.index_news .service-icon { margin-bottom: 3rem; }

/* 4列布局保持不变，但整体更稳 */
.index_news .news-services { gap: 4.5rem; }

/* 卡片：固定高度 + 更像正方形 */
.index_news .service-item { border-radius: 12px; padding: 2.4rem 2.4rem 2rem; height: 32rem; box-sizing: border-box; display: flex; flex-direction: column; justify-content: flex-start; overflow: hidden; }

/* 图标区更紧凑 */
.index_news .service-icon { height: 74px; margin-bottom: 1.8rem; }

/* 标题收一点 */
.index_news .service-name { font-size: 2.2rem; margin: 0 0 1.6rem; line-height: 1.18; }

/* 列表不要撑高卡片：控制行高 + 限制显示行数 */
.index_news .service-list { font-size: 1.3rem; line-height: 2; margin: 0; flex: 1; overflow: hidden; }

/* MORE 固定贴底部 */
.index_news .service-more { margin-top: 1.4rem; }

/* hover 保持你截图的红底白字效果 */
.index_news .service-item:hover { background: #d7362d; box-shadow: 0 18px 42px rgba(0,0,0,.18); transform: translateY(-2px); }
.index_news .service-item:hover .service-icon,
.index_news .service-item:hover .service-name,
.index_news .service-item:hover .service-more { color: #fff; }
.index_news .service-item:hover .service-list { color: rgba(255,255,255,.92); }
/* 第4屏：图片上叠加“播放”按钮（不改变图片原尺寸/结构） */
.index_about2 .about2-img { position: relative; /* 让 overlay 能绝对定位 */ }

/* 覆盖整张图：负责点击+hover */
.index_about2 .about2-playOverlay { position: absolute; inset: 0; z-index: 5; display: block; text-decoration: none; cursor: pointer; }

/* 轻微遮罩（hover 时更明显） */
.index_about2 .about2-playOverlay::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at center, rgba(0,0,0,.10) 0%, rgba(0,0,0,.28) 55%, rgba(0,0,0,.38) 100%); opacity: .18; transition: opacity .25s ease; pointer-events: none; }

/* 中间播放按钮 */
.index_about2 .about2-playBtn { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 92px; height: 92px; border-radius: 999px; background: rgba(0,0,0,.28); border: 2px solid rgba(255,255,255,.65); box-shadow: 0 18px 40px rgba(0,0,0,.25); transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease; pointer-events: none; /* 点击落在 overlay 上 */ }

/* 三角形 */
.index_about2 .about2-playBtn::after { content: ""; position: absolute; left: 54%; top: 50%; transform: translate(-50%, -50%); width: 0; height: 0; border-left: 22px solid rgba(255,255,255,.95); border-top: 14px solid transparent; border-bottom: 14px solid transparent; filter: drop-shadow(0 6px 12px rgba(0,0,0,.35)); }

/* hover：按钮轻微放大 + 遮罩加深 + 呼吸 */
.index_about2 .about2-playOverlay:hover::before { opacity: .35; }

.index_about2 .about2-playOverlay:hover .about2-playBtn { transform: translate(-50%, -50%) scale(1.08); background: rgba(0,0,0,.42); border-color: rgba(255,255,255,.85); box-shadow: 0 26px 60px rgba(0,0,0,.35); animation: about2PlayPulse 1.15s ease-in-out infinite; }

@keyframes about2PlayPulse {
    0% { transform: translate(-50%, -50%) scale(1.02); }
    50% { transform: translate(-50%, -50%) scale(1.10); }
    100% { transform: translate(-50%, -50%) scale(1.02); }
}

/* ================= 自适应 ================= */
@media (max-width: 1400px) {
    .index_news .news-services { gap: 4rem; }
    .index_news .news-title { font-size: 3.6rem; }
}

@media (max-width: 1200px) {
    .index_news .news-services { grid-template-columns: repeat(2, 1fr); gap: 4rem; }
    .index_news .service-list li { white-space: normal; }
}

@media (max-width: 768px) {
    .index_news .news-inner { padding-top: 8.5rem; padding-bottom: 4rem; }
    .index_news .news-services { grid-template-columns: 1fr; gap: 3rem; }
    .index_news .news-title { font-size: 2.6rem; }
    .index_news .news-line { display: none; }
}
/* ================= 第五屏：首页底部 ================= */
.cases5 { position: relative; height: 100vh; background: #08080c; overflow: hidden; }

/* radio 隐藏 */
.cases5-radio { position: absolute; left: -9999px; top: -9999px; }

/* slides 容器 */
.cases5-slides { position: absolute; inset: 0; }

/* 每张 slide：默认隐藏 */
.cases5-slide { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity .7s ease; }

/* 背景 */
.cases5-bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.02); transition: transform 1.2s ease; }

/* 暗层：让文字清晰 */
.cases5-overlay { position: absolute; inset: 0; background: radial-gradient(1100px 600px at 50% 45%, rgba(0,0,0,.12), rgba(0,0,0,.62)), linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,.62)); }

/* 文案居中 */
.cases5-content { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: #fff; padding: 0 22px; }

/* 英文：拆成两段，更像你图里的间距 */
.cases5-en { font-family: "Times New Roman", Georgia, serif; font-size: clamp(48px, 6vw, 96px); letter-spacing: .28em; opacity: .95; display: flex; gap: 1.4em; line-height: 1.1; }

/* 中文标题 */
.cases5-cn { margin-top: 12px; font-size: clamp(22px, 3vw, 48px); font-weight: 800; line-height: 1.15; }

/* 小描述 */
.cases5-sub { margin-top: 8px; font-size: clamp(14px, 1.4vw, 18px); opacity: .9; }

/* 按钮 */
.cases5-btn { margin-top: 16px; display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 26px; border-radius: 999px; border: 2px solid rgba(255,255,255,.55); color: #fff; text-decoration: none; font-weight: 600; background: rgba(0,0,0,.20); transition: .25s ease; }
.cases5-btn:hover { background: rgb(255 14 0 / 85%); border-color: rgb(255 255 255); transform: translateY(-1px); color: #fff; }

/* 箭头 */
.cases5-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; border-radius: 999px; border: 2px solid rgba(255,255,255,.35); background: rgba(0,0,0,.35); color: #fff; font-size: 34px; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 3; transition: .2s ease; user-select: none; }
.cases5-arrow.left { left: 44px; }
.cases5-arrow.right { right: 44px; }

.cases5-arrow:hover { background: rgba(215,54,45,.75); border-color: rgba(215,54,45,1); transform: translateY(-50%) scale(1.06); }

/* 圆点 */
.cases5-dots { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); display: flex; gap: 10px; z-index: 3; }
.cases5-dots label { width: 10px; height: 10px; border-radius: 999px; background: rgba(255,255,255,.28); cursor: pointer; transition: .2s ease; }

/* ========== 关键：radio 控制显示哪一张 ========== */
#c5-1:checked ~ .cases5-slides .s1,
#c5-2:checked ~ .cases5-slides .s2,
#c5-3:checked ~ .cases5-slides .s3,
#c5-4:checked ~ .cases5-slides .s4 { opacity: 1; pointer-events: auto; }
#c5-1:checked ~ .cases5-slides .s1 .cases5-bg,
#c5-2:checked ~ .cases5-slides .s2 .cases5-bg,
#c5-3:checked ~ .cases5-slides .s3 .cases5-bg,
#c5-4:checked ~ .cases5-slides .s4 .cases5-bg { transform: scale(1); }

/* ========== 文字翻动效果：当前 slide 激活时触发 ========== */
/* flip：像“翻牌”一样从下翻上来 */
@keyframes c5FlipIn {
    0% { opacity: 0; transform: translateY(10px) rotateX(-90deg); }
    55% { opacity: 1; transform: translateY(0) rotateX(0deg); }
    100% { opacity: 1; transform: translateY(0) rotateX(0deg); }
}

/* 给三行文字一个顺序延迟 */
#c5-1:checked ~ .cases5-slides .s1 .cases5-en,
#c5-2:checked ~ .cases5-slides .s2 .cases5-en,
#c5-3:checked ~ .cases5-slides .s3 .cases5-en,
#c5-4:checked ~ .cases5-slides .s4 .cases5-en { transform-origin: 50% 100%; animation: c5FlipIn .65s ease both; }

#c5-1:checked ~ .cases5-slides .s1 .cases5-cn,
#c5-2:checked ~ .cases5-slides .s2 .cases5-cn,
#c5-3:checked ~ .cases5-slides .s3 .cases5-cn,
#c5-4:checked ~ .cases5-slides .s4 .cases5-cn { transform-origin: 50% 100%; animation: c5FlipIn .75s ease .08s both; }

#c5-1:checked ~ .cases5-slides .s1 .cases5-sub,
#c5-2:checked ~ .cases5-slides .s2 .cases5-sub,
#c5-3:checked ~ .cases5-slides .s3 .cases5-sub,
#c5-4:checked ~ .cases5-slides .s4 .cases5-sub { transform-origin: 50% 100%; animation: c5FlipIn .80s ease .16s both; }

/* 圆点高亮：通过 checked 控制第 N 个 label */
#c5-1:checked ~ .cases5-slides .s1 .cases5-dots label:nth-child(1),
#c5-2:checked ~ .cases5-slides .s2 .cases5-dots label:nth-child(2),
#c5-3:checked ~ .cases5-slides .s3 .cases5-dots label:nth-child(3),
#c5-4:checked ~ .cases5-slides .s4 .cases5-dots label:nth-child(4) { background: rgba(255,255,255,.95); box-shadow: 0 0 12px rgba(215,54,45,.45); }

/* 小屏隐藏箭头（可选） */
@media (max-width: 900px) {
    .cases5-arrow { display: none; }
    .cases5-en { letter-spacing: .18em; gap: 1.0em; }
}

/* ===== 第五屏：复用第一屏翻动样式（作用域改到 .cases5） ===== */
.cases5 .char { display: inline-block; padding: 0 2px; transform-origin: center center; transform-style: preserve-3d; perspective: 1000px; }

.cases5 .char.flip { animation: dominoFlip180 .5s ease-in-out forwards; }

.cases5 .char.fade { opacity: .7; transform: scale(.96); }

.cases5 .char.punctuation { animation: none !important; }
.cases5 .char.space { width: .6em; margin: 0 2px; }

/* 你第一屏用的同一个 keyframes（如果你全局已经有，就不用再写第二遍） */
@keyframes dominoFlip180 {
    0% { transform: rotateY(0deg); }
    50% { transform: rotateY(180deg); }
    100% { transform: rotateY(0deg); }
}
/* =========================================================
   第五屏 cases5 + 第六屏 cases6
========================================================= */

/* 基础容器 */
.cases5, .cases6 { position: relative; height: 100vh; background: #08080c; overflow: hidden; }

/* radio 隐藏 */
.cases5-radio, .cases6-radio { position: absolute; left: -9999px; top: -9999px; }

/* slides 容器 */
.cases5-slides, .cases6-slides { position: absolute; inset: 0; }

/* 每张 slide：默认隐藏 */
.cases5-slide, .cases6-slide { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity .7s ease; }

/* 背景 */
.cases5-bg, .cases6-bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.02); transition: transform 1.2s ease; }

/* 暗层：让文字清晰（你截图那种“中心亮一点，四周暗一点”） */
.cases5-overlay, .cases6-overlay { position: absolute; inset: 0; background: radial-gradient(1100px 600px at 50% 45%, rgba(0,0,0,.10), rgba(0,0,0,.62)), linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.62)); }

/* 文案居中 */
.cases5-content, .cases6-content { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: #fff; padding: 0 22px; }

/* 英文：两段词（WEB / DESIGN 或 HONORS / QUALIFICATIONS） */
.cases5-en, .cases6-en { font-family: "Times New Roman", Georgia, serif; font-size: clamp(48px, 3vw, 96px); letter-spacing: .16em; opacity: .95; display: flex; gap: .7em; line-height: 1.1; }

/* 中文标题 */
.cases5-cn, .cases6-cn { margin-top: 12px; font-size: clamp(22px, 3vw, 48px); font-weight: 800; line-height: 1.15; }

/* 小描述 */
.cases5-sub, .cases6-sub { margin-top: 8px; font-size: clamp(14px, 1.4vw, 18px); opacity: .9; }

/* 按钮 */
.cases5-btn, .cases6-btn { margin-top: 16px; display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 26px; border-radius: 999px; border: 2px solid rgba(255,255,255,.55); color: #fff; text-decoration: none; font-weight: 600; background: rgba(0,0,0,.20); transition: .25s ease; }
.cases5-btn:hover, .cases6-btn:hover { background: rgb(255 14 0 / 85%); border-color: rgb(255 255 255); transform: translateY(-1px); color: #fff; }

/* 左右箭头 */
.cases5-arrow, .cases6-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; border-radius: 999px; border: 2px solid rgba(255,255,255,.35); background: rgba(0,0,0,.35); color: #fff; font-size: 34px; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 3; transition: .2s ease; user-select: none; }
.cases5-arrow.left, .cases6-arrow.left { left: 44px; }
.cases5-arrow.right, .cases6-arrow.right { right: 44px; }

.cases5-arrow:hover, .cases6-arrow:hover { background: rgba(215,54,45,.75); border-color: rgba(215,54,45,1); transform: translateY(-50%) scale(1.06); }

/* 圆点 */
.cases5-dots, .cases6-dots { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); display: flex; gap: 10px; z-index: 3; }
.cases5-dots label, .cases6-dots label { width: 10px; height: 10px; border-radius: 999px; background: rgba(255,255,255,.28); cursor: pointer; transition: .2s ease; }

#c5-1:checked ~ .cases5-slides .s1,
#c5-2:checked ~ .cases5-slides .s2,
#c5-3:checked ~ .cases5-slides .s3,
#c5-4:checked ~ .cases5-slides .s4 { opacity: 1; pointer-events: auto; }
#c5-1:checked ~ .cases5-slides .s1 .cases5-bg,
#c5-2:checked ~ .cases5-slides .s2 .cases5-bg,
#c5-3:checked ~ .cases5-slides .s3 .cases5-bg,
#c5-4:checked ~ .cases5-slides .s4 .cases5-bg { transform: scale(1); }

#c6-1:checked ~ .cases6-slides .s1,
#c6-2:checked ~ .cases6-slides .s2,
#c6-3:checked ~ .cases6-slides .s3,
#c6-4:checked ~ .cases6-slides .s4 { opacity: 1; pointer-events: auto; }
#c6-1:checked ~ .cases6-slides .s1 .cases6-bg,
#c6-2:checked ~ .cases6-slides .s2 .cases6-bg,
#c6-3:checked ~ .cases6-slides .s3 .cases6-bg,
#c6-4:checked ~ .cases6-slides .s4 .cases6-bg { transform: scale(1); }

@keyframes cFlipIn {
    0% { opacity: 0; transform: translateY(10px) rotateX(-90deg); }
    55% { opacity: 1; transform: translateY(0) rotateX(0deg); }
    100% { opacity: 1; transform: translateY(0) rotateX(0deg); }
}

/* cases5 入场 */
#c5-1:checked ~ .cases5-slides .s1 .cases5-en,
#c5-2:checked ~ .cases5-slides .s2 .cases5-en,
#c5-3:checked ~ .cases5-slides .s3 .cases5-en,
#c5-4:checked ~ .cases5-slides .s4 .cases5-en { transform-origin: 50% 100%; animation: cFlipIn .65s ease both; }
#c5-1:checked ~ .cases5-slides .s1 .cases5-cn,
#c5-2:checked ~ .cases5-slides .s2 .cases5-cn,
#c5-3:checked ~ .cases5-slides .s3 .cases5-cn,
#c5-4:checked ~ .cases5-slides .s4 .cases5-cn { transform-origin: 50% 100%; animation: cFlipIn .75s ease .08s both; }
#c5-1:checked ~ .cases5-slides .s1 .cases5-sub,
#c5-2:checked ~ .cases5-slides .s2 .cases5-sub,
#c5-3:checked ~ .cases5-slides .s3 .cases5-sub,
#c5-4:checked ~ .cases5-slides .s4 .cases5-sub { transform-origin: 50% 100%; animation: cFlipIn .80s ease .16s both; }

/* cases6 入场 */
#c6-1:checked ~ .cases6-slides .s1 .cases6-en,
#c6-2:checked ~ .cases6-slides .s2 .cases6-en,
#c6-3:checked ~ .cases6-slides .s3 .cases6-en,
#c6-4:checked ~ .cases6-slides .s4 .cases6-en { transform-origin: 50% 100%; animation: cFlipIn .65s ease both; }
#c6-1:checked ~ .cases6-slides .s1 .cases6-cn,
#c6-2:checked ~ .cases6-slides .s2 .cases6-cn,
#c6-3:checked ~ .cases6-slides .s3 .cases6-cn,
#c6-4:checked ~ .cases6-slides .s4 .cases6-cn { transform-origin: 50% 100%; animation: cFlipIn .75s ease .08s both; }
#c6-1:checked ~ .cases6-slides .s1 .cases6-sub,
#c6-2:checked ~ .cases6-slides .s2 .cases6-sub,
#c6-3:checked ~ .cases6-slides .s3 .cases6-sub,
#c6-4:checked ~ .cases6-slides .s4 .cases6-sub { transform-origin: 50% 100%; animation: cFlipIn .80s ease .16s both; }

/* 圆点高亮 */
#c5-1:checked ~ .cases5-slides .s1 .cases5-dots label:nth-child(1),
#c5-2:checked ~ .cases5-slides .s2 .cases5-dots label:nth-child(2),
#c5-3:checked ~ .cases5-slides .s3 .cases5-dots label:nth-child(3),
#c5-4:checked ~ .cases5-slides .s4 .cases5-dots label:nth-child(4),
#c6-1:checked ~ .cases6-slides .s1 .cases6-dots label:nth-child(1),
#c6-2:checked ~ .cases6-slides .s2 .cases6-dots label:nth-child(2),
#c6-3:checked ~ .cases6-slides .s3 .cases6-dots label:nth-child(3),
#c6-4:checked ~ .cases6-slides .s4 .cases6-dots label:nth-child(4) { background: rgba(255,255,255,.95); box-shadow: 0 0 12px rgba(215,54,45,.45); }

.cases5 .char, .cases6 .char { display: inline-block; padding: 0 2px; transform-origin: center center; transform-style: preserve-3d; perspective: 1000px; }
.cases5 .char.flip, .cases6 .char.flip { animation: dominoFlip180 .5s ease-in-out forwards; }
.cases5 .char.fade, .cases6 .char.fade { opacity: .7; transform: scale(.96); }
.cases5 .char.punctuation, .cases6 .char.punctuation { animation: none !important; }
.cases5 .char.space, .cases6 .char.space { width: .6em; margin: 0 2px; }

/* 字母翻动 keyframes */
@keyframes dominoFlip180 {
    0% { transform: rotateY(0deg); }
    50% { transform: rotateY(180deg); }
    100% { transform: rotateY(0deg); }
}
/* ===== cases5 / cases6：保持原有叠层结构，只把切换从“闪现”改成“左右滑动” ===== */

/* 1) 给 slide 增加位移过渡（不动你原来的 absolute/inset/背景等） */
.cases5-slide, .cases6-slide { /* 保持你原来的 position:absolute; inset:0; 不改 */ transform: translate3d(100%, 0, 0); /* 默认放到右侧屏外 */ transition: transform .75s ease, opacity .35s ease; opacity: 0; pointer-events: none; }

/* 2) cases5：按当前选中项，把当前放中间，前面的放左侧，后面的放右侧 */
#c5-1:checked ~ .cases5-slides .s1 { transform: translate3d(0,0,0); opacity: 1; pointer-events: auto; }
#c5-1:checked ~ .cases5-slides .s2,
#c5-1:checked ~ .cases5-slides .s3,
#c5-1:checked ~ .cases5-slides .s4 { transform: translate3d(100%,0,0); }

#c5-2:checked ~ .cases5-slides .s1 { transform: translate3d(-100%,0,0); }
#c5-2:checked ~ .cases5-slides .s2 { transform: translate3d(0,0,0); opacity: 1; pointer-events: auto; }
#c5-2:checked ~ .cases5-slides .s3,
#c5-2:checked ~ .cases5-slides .s4 { transform: translate3d(100%,0,0); }

#c5-3:checked ~ .cases5-slides .s1,
#c5-3:checked ~ .cases5-slides .s2 { transform: translate3d(-100%,0,0); }
#c5-3:checked ~ .cases5-slides .s3 { transform: translate3d(0,0,0); opacity: 1; pointer-events: auto; }
#c5-3:checked ~ .cases5-slides .s4 { transform: translate3d(100%,0,0); }

#c5-4:checked ~ .cases5-slides .s1,
#c5-4:checked ~ .cases5-slides .s2,
#c5-4:checked ~ .cases5-slides .s3 { transform: translate3d(-100%,0,0); }
#c5-4:checked ~ .cases5-slides .s4 { transform: translate3d(0,0,0); opacity: 1; pointer-events: auto; }

/* 3) cases6：同理 */
#c6-1:checked ~ .cases6-slides .s1 { transform: translate3d(0,0,0); opacity: 1; pointer-events: auto; }
#c6-1:checked ~ .cases6-slides .s2,
#c6-1:checked ~ .cases6-slides .s3,
#c6-1:checked ~ .cases6-slides .s4 { transform: translate3d(100%,0,0); }

#c6-2:checked ~ .cases6-slides .s1 { transform: translate3d(-100%,0,0); }
#c6-2:checked ~ .cases6-slides .s2 { transform: translate3d(0,0,0); opacity: 1; pointer-events: auto; }
#c6-2:checked ~ .cases6-slides .s3,
#c6-2:checked ~ .cases6-slides .s4 { transform: translate3d(100%,0,0); }

#c6-3:checked ~ .cases6-slides .s1,
#c6-3:checked ~ .cases6-slides .s2 { transform: translate3d(-100%,0,0); }
#c6-3:checked ~ .cases6-slides .s3 { transform: translate3d(0,0,0); opacity: 1; pointer-events: auto; }
#c6-3:checked ~ .cases6-slides .s4 { transform: translate3d(100%,0,0); }

#c6-4:checked ~ .cases6-slides .s1,
#c6-4:checked ~ .cases6-slides .s2,
#c6-4:checked ~ .cases6-slides .s3 { transform: translate3d(-100%,0,0); }
#c6-4:checked ~ .cases6-slides .s4 { transform: translate3d(0,0,0); opacity: 1; pointer-events: auto; }

/* =========================================================
   第七屏：最新动态
========================================================= */
.index_latest7 { position: relative; height: 100vh; overflow: hidden; color: #fff; }

/* 背景图层 */
.index_latest7 .latest7-bg { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; transform: scale(1.03); filter: saturate(1.15) contrast(1.05); }

/* 蓝色氛围遮罩 */
.index_latest7 .latest7-mask { position: absolute; inset: 0; }

/* 主容器：整体下移，避免顶到顶部导航*/
.index_latest7 .latest7-wrap { position: relative; z-index: 2; width: 92%; height: 100%; margin: 0 auto; padding-top: clamp(120px, 12vh, 170px); }

/* 标题 */
.index_latest7 .latest7-title { font-size: clamp(34px, 3.2vw, 56px); font-weight: 900; letter-spacing: .5px; margin: 0 0 22px 0; text-shadow: 0 12px 28px rgba(0,0,0,.38); }

/* 右上“更多资讯”按钮（位置跟随整体下移） */
.index_latest7 .latest7-more { position: absolute; right: 0; top: 28%; display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 18px; border-radius: 999px; text-decoration: none; color: #fff; border: 1px solid rgba(255,255,255,.26); background: rgba(12,20,45,.22); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 14px 40px rgba(0,0,0,.26); transition: transform .25s ease, background .25s ease, border-color .25s ease; }
.index_latest7 .latest7-more:hover { transform: translateY(-1px); background: rgb(255 0 0 / 69%); border-color: rgb(0 121 255 / 38%); }
.index_latest7 .latest7-more::after { content: "›"; font-size: 18px; line-height: 1; opacity: .9; }

/* 主体两列 */
.index_latest7 .latest7-main { display: grid; grid-template-columns: 1.15fr .85fr; gap: 15%; align-items: start; }

/* 左侧列表容器（玻璃面板） */
.index_latest7 .latest7-left { border-radius: 22px; padding: 14px; border: 1px solid rgba(255,255,255,.14); background: rgba(10,18,42,.16); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 18px 60px rgba(0,0,0,.28); }

/* 左侧每条 */
.index_latest7 .latest7-item { position: relative; display: flex; gap: 18px; align-items: center; text-decoration: none; color: #fff; padding: 18px; border-radius: 18px; border: 1px solid rgba(255,255,255,.10); background: linear-gradient(90deg, rgba(255,255,255,.06), rgba(255,255,255,.03)); transition: transform .22s ease, background .22s ease, border-color .22s ease; }
.index_latest7 .latest7-item + .latest7-item { margin-top: 14px; }

.index_latest7 .latest7-item:hover { transform: translateY(-2px); background: linear-gradient(90deg, rgba(0,140,255,.14), rgba(255,255,255,.04)); border-color: rgba(255,255,255,.20); }

/* 第一条红色“新闻资讯”块 */
.index_latest7 .latest7-badge { width: 84px; height: 84px; border-radius: 16px; flex: 0 0 auto; background: #ff0000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; box-shadow: 0 16px 40px rgba(0,0,0,.28); }
.index_latest7 .latest7-badge span { font-weight: 900; letter-spacing: 2px; }

/* 其它条缩略图 */
.index_latest7 .latest7-thumb { width: 110px; height: 84px; border-radius: 14px; overflow: hidden; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.08); }
.index_latest7 .latest7-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.06); filter: saturate(1.05); transition: transform .25s ease; }
.index_latest7 .latest7-item:hover .latest7-thumb img { transform: scale(1.12); }

/* 文案 */
.index_latest7 .latest7-info { min-width: 0; flex: 1; }
.index_latest7 .latest7-meta { font-size: 16px; opacity: .78; margin-bottom: 8px; letter-spacing: .3px; }
.index_latest7 .latest7-name { font-size: 18px; line-height: 1.55; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 右侧两张大卡片 */
.index_latest7 .latest7-right { display: grid; gap: 24px; }

/* 大卡片更“大气”，更接近你图二那种质感 */
.index_latest7 .latest7-card { position: relative; height: 190px; border-radius: 22px; overflow: hidden; text-decoration: none; border: 1px solid rgba(255,255,255,.14); background: rgba(0,0,0,.18); box-shadow: 0 18px 70px rgba(0,0,0,.32); transform: translateZ(0); transition: transform .25s ease, border-color .25s ease; }
.index_latest7 .latest7-card:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.24); }

.index_latest7 .latest7-card-bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.10); filter: blur(2.2px) saturate(1.1); transition: transform .35s ease, filter .35s ease; }

/* 叠一层柔光 + 底部暗角 */
.index_latest7 .latest7-card-mask { position: absolute; inset: 0; background: radial-gradient(520px 260px at 30% 35%, rgba(0,140,255,.22), rgba(0,0,0,0)), linear-gradient(90deg, rgba(0,0,0,.46), rgba(0,0,0,.10)), linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.55)); }

.index_latest7 .latest7-card-text { position: absolute; left: 22px; bottom: 18px; font-size: 25px; font-weight: 900; color: #fff; letter-spacing: 1px; text-shadow: 0 12px 28px rgba(0,0,0,.45); }

.index_latest7 .latest7-card:hover .latest7-card-bg { transform: scale(1.18); filter: blur(0px) saturate(1.18); }

/* 适配：小屏变一列 */
@media (max-width: 1100px) {
    .index_latest7 .latest7-wrap { width: 92%; padding-top: clamp(110px, 10vh, 150px); }
    .index_latest7 .latest7-more { top: clamp(110px, 10vh, 150px); }
    .index_latest7 .latest7-main { grid-template-columns: 1fr; gap: 22px; }
    .index_latest7 .latest7-card { height: 170px; }
}
/* 第七屏：自适应下移 */
.index_latest7 .latest7-wrap { padding-top: 10%; }
/* ===============================
   第八屏：联系页脚区（先还原截图）
   =============================== */

.index_footer8 { background: #fff; height: 100vh; display: flex; flex-direction: column; overflow: hidden; }

/* 上半部分：长图背景 + 内容 */
.index_footer8 .footer8-top { position: relative; flex: 1 1 auto; min-height: 420px; background: #f2f2f2; overflow: hidden; }

/* 后面是一张长图：整张铺满 */
.index_footer8 .footer8-bg { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; transform: scale(1.02); }

.index_footer8 .footer8-bg-mask { position: absolute; inset: 0; background: rgba(255,255,255,0.35); }

/* 左右圆形箭头（先摆样式） */
.index_footer8 .footer8-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 999px; border: 2px solid rgba(0,0,0,0.35); background: rgba(0,0,0,0.35); color: #fff; font-size: 28px; line-height: 1; cursor: pointer; z-index: 5; display: flex; align-items: center; justify-content: center; user-select: none; }
.index_footer8 .footer8-arrow-left { left: 18px; }
.index_footer8 .footer8-arrow-right { right: 18px; }

/* 内容容器 */
.index_footer8 .footer8-inner { position: relative; z-index: 3; height: 100%; display: flex; align-items: center; }

/* 三列布局：左大图 / 中白盒子 / 右四宫格 */
.index_footer8 .footer8-grid { width: 100%; display: grid; grid-template-columns: 1fr 520px 1fr; gap: 26px; align-items: center; }

/* 左：大图 */
.index_footer8 .footer8-left-img { width: 100%; height: clamp(260px, 28vh, 360px); border-radius: 2px; background-size: cover; background-position: center; box-shadow: 0 18px 40px rgba(0,0,0,0.12); }

/* 中：白色盒子 */
.index_footer8 .footer8-card { background: #fff; border-radius: 0; box-shadow: 0 18px 40px rgba(0,0,0,0.14); padding: 26px 28px 18px; text-align: center; }

.index_footer8 .footer8-card-title { font-size: 26px; font-weight: 700; color: #111; margin-bottom: 4px; }

.index_footer8 .footer8-card-sub { font-size: 16px; color: #666; margin-bottom: 10px; }

.index_footer8 .footer8-card-tel { font-size: 44px; font-weight: 800; color: #d51813; letter-spacing: 1px; margin-bottom: 14px; }

.index_footer8 .footer8-video { width: 100%; height: 220px; background: #3a3a3a; overflow: hidden; }

.index_footer8 .footer8-video-el { width: 100%; height: 100%; display: block; object-fit: cover; }

/* 右：四宫格 */
.index_footer8 .footer8-mosaic { width: 100%; height: clamp(260px, 28vh, 360px); display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 14px; }

.index_footer8 .footer8-mosaic .m { background-size: cover; background-position: center; box-shadow: 0 18px 40px rgba(0,0,0,0.12); }

/* 让四宫格更像截图：上左大、上右小、下两张 */
.index_footer8 .footer8-mosaic .m-big { grid-column: 1/2; grid-row: 1/2; }
.index_footer8 .footer8-mosaic .m-small { grid-column: 2/3; grid-row: 1/2; }
.index_footer8 .footer8-mosaic .m-group { grid-column: 1/2; grid-row: 2/3; }
.index_footer8 .footer8-mosaic .m-talk { grid-column: 2/3; grid-row: 2/3; }

/* 城市一排 */
.index_footer8 .footer8-cities { background: #f4f4f4; padding: 18px 0 16px; }

.index_footer8 .footer8-cities-inner { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; }

.index_footer8 .footer8-cities .city { flex: 1 1 0; text-align: center; color: #333; }

.index_footer8 .footer8-cities .icon { width: 66px; height: 66px; margin: 0 auto 10px; position: relative; overflow: hidden; }

.index_footer8 .footer8-cities .name { font-size: 20px; text-align: center; font-weight: 700; margin-bottom: 4px; }
.index_footer8 .footer8-cities .hot { font-size: 16px; text-align: center; color: #777; }

/* 黑色底部 */
.index_footer8 .footer8-bottom { background: #0b0b0b; color: #ddd; flex: 0 0 auto; }

.index_footer8 .footer8-bottom-inner { display: flex; align-items: flex-start; justify-content: space-between; gap: 100px; padding: 100px 0 38px; }

.index_footer8 .footer8-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 46px; flex: 1 1 auto; }

.index_footer8 .footer8-cols dt { font-size: 16px; font-weight: 700; color: #fff; margin-bottom: 12px; text-align: center; }
.index_footer8 .footer8-cols dd { margin: 0 0 8px 0; text-align: center; }
.index_footer8 .footer8-cols a { color: #bbb; text-decoration: none; font-size: 16px; }
.index_footer8 .footer8-cols a:hover { color: #ff2b2b; }

.index_footer8 .footer8-qrs { display: flex; gap: 22px; align-items: center; flex: 0 0 auto; }
.index_footer8 .footer8-qrs img { width: 120px; height: 120px; background: #fff; padding: 6px; border-radius: 6px; display: block; }
.index_footer8 .footer8-qrs p { margin: 8px 0 0; text-align: center; font-size: 16px; color: #bbb; }

.index_footer8 .footer8-rightinfo { flex: 0 0 320px; }
.index_footer8 .footer8-rightinfo .big-tel { font-size: 50px; font-weight: 900; color: #d51813; letter-spacing: 1px; margin-bottom: 10px; }
.index_footer8 .footer8-rightinfo .info p { margin: 0 0 6px 0; font-size: 16px; color: #bbb; line-height: 1.6; }

.index_footer8 .footer8-bar { border-top: 1px solid rgba(255,255,255,0.08); padding: 12px 0; font-size: 16px; color: #777; }
.index_footer8 .footer8-bar a { color: #777; text-decoration: none; }
.index_footer8 .footer8-bar a:hover { color: #ff2b2b; }
/*  第八屏：取消 fullPage 垂直居中造成的上下留白 */
#footer8 .fp-tableCell { vertical-align: top !important; padding: 0 !important; height: 100% !important; }

/* 有些 fullpage 版本会把 table-cell 高度算错，补一条 */
#footer8.fp-section,
#footer8 { height: 100vh !important; }

/* 响应式：窄屏三列变一列（先保证PC像截图） */
@media (max-width: 1280px) {
    .index_footer8 .footer8-grid { grid-template-columns: 1fr; gap: 18px; }
    .index_footer8 .footer8-rightinfo { flex: 1 1 auto; }
    .index_footer8 .footer8-cities-inner { flex-wrap: wrap; }
    .index_footer8 .footer8-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* ===== 修复：视频控件条铺满整块（强制限制在灰盒子里） ===== */
.index_footer8 .footer8-center { position: relative; z-index: 6; }

.index_footer8 .footer8-video { width: 100%; height: 240px; /* 你截图里中间视频更大一点，这里加高 */ background: #3a3a3a; overflow: hidden; position: relative; }

.index_footer8 .footer8-video-el { width: 100% !important; height: 100% !important; display: block; object-fit: cover; position: relative; z-index: 1; }

/* 如果你项目里有全局 video 样式导致它脱离容器，这个能兜底 */
.index_footer8 video { max-width: 100%; max-height: 100%; }

/* 右侧大电话：不要乱断行 */
.index_footer8 .footer8-rightinfo .big-tel { white-space: nowrap; word-break: keep-all; }

/* ===== 友情链接行 ===== */
.index_footer8 .footer8-links { border-top: 1px solid rgba(255,255,255,0.08); padding: 12px 0; font-size: 15px; color: #777; background: #0b0b0b; }

.index_footer8 .footer8-links .label { margin-right: 8px; color: #777; }

.index_footer8 .footer8-links a { color: #777; text-decoration: none; margin-right: 10px; }

.index_footer8 .footer8-links a:hover { color: #ff2b2b; }
/* ===============================
   第八屏上半部分：一张长图（不是拼图）
   =============================== */

.index_footer8 .footer8-top { position: relative; height: 430px; /* 你截图里红框高度差不多就是这个级别 */ margin-top: 8%; overflow: hidden; background: #eee; }

/* “长图轮播图”当前帧：整张铺满 */
.index_footer8 .footer8-slide { position: absolute; inset: 0; background-image: var(--slide); background-repeat: no-repeat; background-size: cover; background-position: center; transform: scale(1.02); z-index: 1; }

/* 内容层 */
.index_footer8 .footer8-inner { position: relative; z-index: 3; height: 100%; display: flex; align-items: center; }

/* 三列比例：左 / 中(白盒) / 右 */
.index_footer8 .footer8-grid { width: 100%; display: grid; grid-template-columns: 1fr 520px 1fr; gap: 26px; align-items: center; }

/* 左侧：同一张长图裁切区域 */
.index_footer8 .footer8-slice { width: 100%; height: 320px; border-radius: 2px; box-shadow: 0 18px 40px rgba(0,0,0,0.12); background-image: var(--slide); background-repeat: no-repeat; background-size: 300% 100%; /* 关键：把同一张图“放大”，再用不同位置裁切 */ }

/* 左侧显示长图的“左边” */
.index_footer8 .slice-left { background-position: 0% 50%; }

/* 中间白盒 */
.index_footer8 .footer8-card { background: #fff; box-shadow: 0 18px 40px rgba(0,0,0,0.14); padding: 26px 28px 18px; text-align: center; }

.index_footer8 .footer8-card-title { font-size: 30px; font-weight: 700; color: #111; margin-bottom: 4px; text-align: center; }
.index_footer8 .footer8-card-sub { font-size: 16px; color: #666; margin-bottom: 10px; text-align: center; }
.index_footer8 .footer8-card-tel { font-size: 44px; font-weight: 800; color: #d51813; letter-spacing: 1px; margin-bottom: 14px; text-align: center; }

/* 中间灰色才是视频 */
.index_footer8 .footer8-video { width: 100%; height: 240px; background: #3a3a3a; overflow: hidden; }
.index_footer8 .footer8-video-el { width: 100% !important; height: 100% !important; display: block; object-fit: cover; }
.index_footer8 .footer8-video{ position: relative; }
/* 第八屏 footer8-video：同款播放按钮，但缩小一份 */
.index_footer8 .footer8-video-play { position: relative; }
.index_footer8 .footer8-video-play img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 覆盖整张图：负责点击+hover（不改变原尺寸） */
.index_footer8 .footer8-video-play .about2-playOverlay { position: absolute; inset: 0; z-index: 5; display: block; text-decoration: none; cursor: pointer; }

/* 轻微遮罩（hover 时更明显） */
.index_footer8 .footer8-video-play .about2-playOverlay::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at center, rgba(0,0,0,10) 0%, rgba(0,0,0,28) 55%, rgba(0,0,0,38) 100%); opacity: .16; transition: opacity .25s ease; pointer-events: none; }

/* hover */
.index_footer8 .footer8-video-play .about2-playOverlay:hover::before { opacity: .33; }
.index_footer8 .footer8-video-play .about2-playOverlay:hover .about2-playBtn { transform: translate(-50%, -50%) scale(1.08); background: rgba(0,0,0,42); border-color: rgba(255,255,255,85); box-shadow: 0 26px 60px rgba(0,0,0,35); animation: about2PlayPulse 1.15s ease-in-out infinite; }

/* 缩小按钮尺寸 */
.index_footer8 .footer8-video-play .about2-playBtn { width: 64px; height: 64px; }

/* 缩小三角形 */
.index_footer8 .footer8-video-play .about2-playBtn::after { border-left-width: 16px; border-top-width: 10px; border-bottom-width: 10px; }
/* 第八屏：补齐播放按钮“本体”样式（因为第四屏样式被 .index_about2 限定了） */
.index_footer8 .footer8-video-play .about2-playBtn { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 64px; height: 64px; border-radius: 999px; background: rgba(0,0,0,.45); border: 2px solid rgba(255,255,255,.85); box-shadow: 0 14px 30px rgba(0,0,0,.25); display: block; pointer-events: none; /* 点击落在 a 上 */ }

.index_footer8 .footer8-video-play .about2-playBtn::after { content: ""; position: absolute; left: 54%; top: 50%; transform: translate(-50%, -50%); width: 0; height: 0; border-left: 16px solid rgba(255,255,255,.95); border-top: 10px solid transparent; border-bottom: 10px solid transparent; filter: drop-shadow(0 6px 12px rgba(0,0,0,.35)); }

/* 右侧四宫格：同一张长图裁切 */
.index_footer8 .footer8-mosaic { width: 100%; height: 320px; display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 14px; }

.index_footer8 .footer8-mosaic .m { box-shadow: 0 18px 40px rgba(0,0,0,0.12); background-image: var(--slide); background-repeat: no-repeat; background-size: 300% 100%; }

/* 右侧四块裁切位置：你可以微调这些百分比来“对齐原图内容” */
.index_footer8 .footer8-mosaic .m1 { background-position: 70% 20%; }
.index_footer8 .footer8-mosaic .m2 { background-position: 98% 20%; }
.index_footer8 .footer8-mosaic .m3 { background-position: 70% 85%; }
.index_footer8 .footer8-mosaic .m4 { background-position: 98% 85%; }

/* 箭头 */
.index_footer8 .footer8-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 999px; border: 2px solid rgba(255, 255, 255, .65); background: rgba(0,0,0,0.35); color: #fff; font-size: 28px; line-height: 1; cursor: pointer; z-index: 6; display: flex; align-items: center; justify-content: center; user-select: none; }
.index_footer8 .footer8-arrow-left { left: 18px; }
.index_footer8 .footer8-arrow-right { right: 18px; }

/* 小屏先不管“完全一样”，保持不崩 */
@media (max-width: 1280px) {
    .index_footer8 .footer8-top { height: auto; padding: 22px 0; }
    .index_footer8 .footer8-inner { height: auto; }
    .index_footer8 .footer8-grid { grid-template-columns: 1fr; }
    .index_footer8 .footer8-slice,
    .index_footer8 .footer8-mosaic { height: 260px; }
}
/* ==========================
   新增一屏：about_culture 企业文化
========================== */
.about_culture { width: 100%; padding: 60px 0 80px; background: #fff; padding-top: 8%;  }

.about_culture .culture-wrap { width: 92%; max-width: calc(100% - 40px); margin: 0 auto; }

/* 顶部文字区 */
.about_culture .culture-top { text-align: center; margin-bottom: 30px; }

.about_culture .culture-mission-line { font-size: 20px; color: #111; line-height: 1.8; font-weight: 600; text-align: center; }

.about_culture .culture-mission-line b { font-weight: 700; }

.about_culture .culture-split { margin: 0 12px; color: #999; font-weight: 400; }

.about_culture .culture-en { margin-top: 6px; font-size: 16px; color: #888; letter-spacing: 0.2px; line-height: 1.6; text-align: center; }

.about_culture .culture-desc { margin: 18px auto 0; max-width: 980px; font-size: 16px; color: #555; line-height: 1.9; }

.about_culture .culture-desc p { margin: 0 0 8px; text-align: center; }

.about_culture .culture-strong { margin-top: 6px; font-size: 16px; font-weight: 700; color: #c60000; text-align: center; }

/* 公式行 */
.about_culture .culture-formula { margin-top: 22px; font-size: 16px; color: #111; line-height: 1.8; font-weight: 600; text-align: center; }

.about_culture .culture-formula .f-item { display: inline-block; padding: 2px 0; }

.about_culture .culture-formula em { font-style: normal; color: #c60000; font-weight: 800; }

.about_culture .culture-formula .f-plus,
.about_culture .culture-formula .f-eq { margin: 0 8px; color: #999; font-weight: 400; }

.about_culture .culture-formula .f-result { color: #c60000; font-weight: 800; }

/* LOGO区 */
.about_culture .culture-logo-box { text-align: center; margin: 30px 0 14px; }

.about_culture .culture-logo-img {  max-width: 60%; height: auto; display: inline-block; }

.about_culture .culture-logo-tip { margin-top: 10px; font-size: 16px; color: #c60000; font-weight: 700; text-align: center; }

/* ①②③三段说明条 */
.about_culture .culture-meaning { display: flex; width: 100%; margin-top: 18px; overflow: hidden; }

.about_culture .meaning-item { flex: 1; padding: 18px 18px; min-height: 86px; box-sizing: border-box; }

.about_culture .meaning-title { font-size: 16px; font-weight: 800; margin-bottom: 8px; }

.about_culture .meaning-text { font-size: 16px; line-height: 1.8; opacity: 0.92; }

.about_culture .meaning-black { background: #111; color: #fff; }

.about_culture .meaning-red { background: #c60000; color: #fff; }

/* 企业文化标题 */
.about_culture .culture-title { text-align: center; margin: 26px 0 18px; }

.about_culture .culture-title .t-red { color: #c60000; font-size: 16px; font-weight: 900; }

.about_culture .culture-title .t-black { color: #111; font-size: 16px; font-weight: 900; margin-left: 6px; }

.about_culture .culture-subtitle { margin-top: 6px; font-size: 12px; color: #888; line-height: 1.7; text-align: center; }

/* 3x3 九宫格 */
.about_culture .culture-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 110px; gap: 0; margin-top: 20px; border: 1px solid rgba(0,0,0,0.06); }

.about_culture .grid-item { display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 14px 16px; box-sizing: border-box; text-align: center; }

.about_culture .grid-red { background: #c60000; color: #fff; }

.about_culture .grid-black { background: #111; color: #fff; }

.about_culture .grid-h { font-size: 16px; font-weight: 900; margin-bottom: 6px; }

.about_culture .grid-p { font-size: 16px; line-height: 1.6; opacity: 0.92; }

/* 移动端适配 */
@media (max-width: 768px) {
    .about_culture { padding: 40px 0 60px; }

    .about_culture .culture-meaning { display: block; }

    .about_culture .meaning-item { margin-bottom: 10px; }

    .about_culture .culture-grid { grid-template-columns: 1fr; grid-auto-rows: auto; }

    .about_culture .grid-item { padding: 16px 14px; }
}

/* ===============================
   第八屏：背景长图轮播（同 about 底部长图轮播）
   =============================== */
.index_footer8 .footer8-top { position: relative; overflow: hidden; }

/* 背景轮播容器铺满 */
.index_footer8 .footer8-banner.footer-banner { position: absolute; inset: 0; overflow: hidden; z-index: 0; }

/* 轨道：横向排列，Y 轴居中 */
.index_footer8 .footer8-banner .track { position: absolute; left: 0; top: 50%; height: 100%; display: flex; transform: translate3d(0vw,-50%,0); transition: transform .6s ease; will-change: transform; }

/* 每一屏就是 100vw */
/* 每一帧占满一屏（修复：banner-slide） */
.index_footer8 .footer8-banner .banner-slide { width: 100vw; height: 100%; flex: 0 0 100vw; }

.index_footer8 .footer8-banner .bgimg { width: 100%; height: 100%; display: block; object-fit: cover; }

/* 遮罩（你可按需要调深浅） */
.index_footer8 .footer8-banner .banner-mask { position: absolute; inset: 0; }

/* 保证内容在背景之上 */
.index_footer8 .footer8-inner { position: relative; z-index: 3; }
.index_footer8 .footer8-arrow { z-index: 6; }
.index_box { margin: 0 auto; padding: 0; width: 90%; text-align: center; }
/*首页样式结束-------------------------------------------------------------------------*/
/*品牌样式开始-------------------------------------------------------------------------------*/
/* ==========================
   品牌理念页面
========================== */
.brand-page { width: 100%; background: #fff; padding: 40px 0 80px; }

.brand-wrap { width: 74%; margin: 0 auto; text-align: center; }

.brand-top-title h1 { font-size: 44px; font-weight: 700; color: #d9d9d9; letter-spacing: 2px; margin-bottom: 10px; text-align: center; }

.brand-crumb { font-size: 16px; color: #666; text-align: center; margin-bottom: 14px; }
.brand-crumb a { color: #666; }
.brand-crumb em { color: #d51813; font-style: normal; font-weight: 600; }

.brand-tabs { display: flex; justify-content: center; gap: 14px; margin-bottom: 18px; }
.brand-tabs .tab { display: inline-flex; align-items: center; justify-content: center; width: 110px; height: 34px; border-radius: 3px; background: #111; color: #fff; font-size: 16px; transition: all .25s ease; }
.brand-tabs .tab:hover { background: #d51813; }
.brand-tabs .tab.active { background: #111; box-shadow: 0 10px 20px rgba(0,0,0,0.12); }

.brand-line { width: 100%; height: 1px; background: #eee; margin: 16px 0 36px; }

/* 使命愿景 */
.brand-mission h2 { font-size: 22px; font-weight: 800; color: #222; text-align: center; margin-bottom: 8px; }
.brand-mission .red { color: #d51813; }

.brand-mission .en { font-size: 16px; color: #999; text-align: center; margin-bottom: 20px; letter-spacing: .3px; }

.brand-mission .desc { font-size: 16px; line-height: 2.0; color: #666; text-align: center; margin: 6px 0; }
.brand-mission .desc.strong { margin-top: 10px; font-weight: 700; }

.brand-formula { margin-top: 28px; font-size: 18px; font-weight: 800; color: #333; text-align: center; }
.brand-formula .result { color: #d51813; font-weight: 900; }

/* logo说明区 */
.brand-logo-area { margin-top: 42px; text-align: center; }

.brand-logo { width: 260px; margin: 0 auto 12px; }
.brand-logo img { width: 100%; height: auto; display: block; }

.brand-logo-note { font-size: 16px; text-align: center; color: #ff0700; font-weight: 700; margin-bottom: 18px; }

/* 三栏黑红黑 */
.brand-logo-3col { display: flex; width: 100%; height: 120px; border-radius: 2px; overflow: hidden; }

.brand-logo-3col .col { flex: 1; padding: 16px 18px; color: #fff; text-align: left; }

.brand-logo-3col .col h3 { font-size: 16px; font-weight: 800; margin-bottom: 6px; text-align: center; }

.brand-logo-3col .col p { font-size: 16px; line-height: 1.7; opacity: .9; }

.brand-logo-3col .black { background: #111; }
.brand-logo-3col .redbg { background: #d51813; }

/* 企业文化标题 */
.brand-culture-title { margin-top: 34px; text-align: center; font-size: 20px; font-weight: 900; color: #222; }
.brand-culture-title .red { color: #d51813; }

.brand-culture-title p { margin-top: 6px; font-size: 16px; color: #999; font-weight: 400; }

/* 3x3色块（与你图一样视觉） */
.brand-culture-grid { margin-top: 20px; width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }

.brand-culture-grid .cell { min-height: 95px; padding: 22px 22px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; }

.brand-culture-grid .cell h4 { font-size: 16px; font-weight: 900; margin-bottom: 6px; }

.brand-culture-grid .cell p { font-size: 16px; line-height: 1.7; opacity: .95; max-width: 92%; }

.brand-culture-grid .red { background: #d51813; color: #fff; }
.brand-culture-grid .black { background: #111; color: #fff; }

/* 响应式（小屏不崩） */
@media (max-width: 1200px) {
    .brand-wrap { width: 90%; }
    .brand-logo-3col { height: auto; flex-direction: column; }
    .brand-logo-3col .col { text-align: center; }
}

@media (max-width: 768px) {
    .brand-top-title h1 { font-size: 32px; }
    .brand-formula { font-size: 15px; }
    .brand-culture-grid { grid-template-columns: 1fr; }
}
/* ===== 企业荣誉 ===== */



/* ==========================
   品牌历程
========================== */
.brand-course { padding: 10px 0 10px; }

.course-grid { width: 100%; margin: 0 auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 34px; position: relative; }

/* 中间竖线 */
.course-grid::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); width: 2px; border-radius: 2px; background: linear-gradient(to bottom, rgba(122,104,255,.0), rgba(122,104,255,.7), rgba(122,104,255,.0)); pointer-events: none; }

.course-card { position: relative; background: #fff; border-radius: 16px; padding: 26px 26px 22px 26px; box-shadow: 0 12px 30px rgba(0,0,0,0.08); text-align: left; overflow: hidden; }

/* 左侧紫色竖条 */
.course-card::before { content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 4px; border-radius: 999px; background: linear-gradient(to bottom, #7a68ff, #8a7cff); }

.course-ico { width: 44px; height: 44px; border-radius: 12px; background: #6f63ff; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 20px; margin-bottom: 14px; }

.course-year { font-size: 28px; font-weight: 800; color: #6f63ff; margin-bottom: 6px; }

.course-title { font-size: 18px; font-weight: 800; color: #222; margin-bottom: 10px; }

.course-desc { font-size: 16px; color: #777; line-height: 1.8; margin-bottom: 14px; }

.course-tags { display: flex; flex-wrap: wrap; gap: 10px; }

.course-tags span { display: inline-flex; align-items: center; justify-content: center; padding: 6px 12px; border-radius: 999px; font-size: 16px; color: #2f7bd6; background: #eaf4ff; }

/* 小屏：变成1列，并去掉中间竖线 */
@media (max-width: 900px) {
    .course-grid { grid-template-columns: 1fr; }
    .course-grid::before { display: none; }
}

/* ===== 荣誉资质（红色主题 + 年份轴 + 卡片轮播） ===== */
:root { --honor-red: #c40000; --honor-red2: #8b0000; --honor-shadow: 0 16px 40px rgba(0,0,0,.08); }

.honor-wrap { width: 75%; margin: 0 auto; padding: 40px 0 70px; position: relative; }

/* 年份轴 */
.honor-years { position: relative; height: 110px; margin: 10px 0 10px; }
.honor-years-line { position: absolute; left: 0; right: 0; top: 72px; height: 2px; background: rgba(196,0,0,.35); }
.honor-years-row { position: absolute; left: 0; right: 0; top: 28px; display: flex; justify-content: space-around; align-items: center; }
.honor-years-row .y { width: 84px; height: 84px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 800; color: #fff; background: rgba(196,0,0,.55); box-shadow: 0 10px 25px rgba(196,0,0,.18); cursor: pointer; user-select: none; transition: transform .2s ease, background .2s ease; }
.honor-years-row .y.active { background: var(--honor-red); transform: translateY(-2px) scale(1.04); }

/* Swiper */
.honor-swiper { overflow: visible; padding: 28px 0 60px; }

/* 卡片 */
.honor-card { background: #fff; border-radius: 16px; padding: 26px 26px 22px; box-shadow: var(--honor-shadow); min-height: 320px; }
.honor-card h3 { font-size: 22px; font-weight: 900; color: var(--honor-red); margin: 0 0 14px; }
.honor-card p { font-size: 16px; line-height: 1.9; color: #777; margin: 0 0 16px; }
.honor-card .thumb { width: 120px; height: 76px; border-radius: 10px; overflow: hidden; background: #f5f5f5; }
.honor-card .thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 底部控制按钮（居中） */
.honor-controls { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); display: flex; align-items: center; gap: 14px; background: #fff; border-radius: 14px; padding: 18px 26px; box-shadow: 0 16px 35px rgba(0,0,0,.12); }
.hc-btn { width: 48px; height: 48px; border-radius: 50%; border: 0; cursor: pointer; font-size: 22px; line-height: 48px; text-align: center; color: #fff; background: var(--honor-red); }
.hc-btn.hc-toggle { width: 54px; height: 54px; font-size: 18px; background: #18a566; /* 中间播放键你图里是绿色，我保留这种感觉；你要全红我也能改 */ }

/* 响应式：小屏变少列 */
@media (max-width: 1300px) {
    .honor-wrap { width: 92%; }
}


/* =========================
   荣誉证书列表
========================= */

/* =========================
   管理团队 - 团队成员
========================= */

/* ===============================
   人员介绍
================================ */

/*品牌样式结束------------------------------------------------------------------------------*/

/*内页通用样式开始-------------------------------------------------------------------------*/
.content { position: relative; z-index: 1; width: 100%; background: #FFFFFF; }
/*content_banner*/
.content_banner { position: relative; width: 100%; height: 43.75rem; overflow: hidden; }
.content_banner .swiper { position: relative; width: 100%; height: 100%; }
.content_banner .swiper .swiper-wrapper .swiper-slide { position: relative; width: 100%; height: 100%; }
.content_banner .swiper .swiper-wrapper .swiper-slide .img { position: relative; width: 100%; height: 100%; }
.content_banner .swiper .swiper-wrapper .swiper-slide .txt { position: absolute; z-index: 99; top: 40%; left: 10%; color: #fff; }
.content_banner .swiper .swiper-wrapper .swiper-slide .txt h2 { font-size: 3.125rem; }
.content_banner .swiper .swiper-wrapper .swiper-slide .txt h2 b { color: #fff; }
.content_banner .swiper .swiper-wrapper .swiper-slide .txt p { margin: 1.875rem 0; font-size: 2.25rem; }
.content_banner .swiper .swiper-wrapper .swiper-button-next,
.content_banner .swiper .swiper-wrapper .swiper-button-prev { color: #fff; }
.content_banner .swiper .swiper-wrapper .swiper-pagination.on { color: #fff; }

/*content_category内页类别*/
.content_category dl dt { padding: 1.25rem; height: 2.5rem; line-height: 2.5rem; background: #000; text-align: center; color: #fff; font-size: 1.25rem; font-weight: bold; }
.content_category dl dt a { color: #fff; }
.content_category dl dt a:hover { color: #ff0000; }
.content_category dl dd { margin: 0.25rem 0; }
.content_category dl dd a { display: block; padding: 0 1.25rem; width: 15rem; text-align: center; height: 3.75rem; line-height: 3.75rem; background: #f7f7f7; transition: all 0.3s ease; }
.content_category dl dd a:hover { background: #faebd7; }
.content_category dl dd a span { float: left; }

/*content_category内页详情*/
.content_detail .hd { padding: 0 1.25rem; height: 3.125rem; line-height: 3.125rem; background: #000; color: #fff; font-size: 1rem; }
.content_detail .hd b { font-weight: bold; color: #fff; }
.content_detail .hd a { color: #fff; }
.content_detail .hd a:hover { color: #ff0000; }
.content_detail .hd span { float: right; }
.content_detail .bd { margin-top: 1.25rem; width: 100%; overflow: hidden; }
/*内页样式结束-------------------------------------------------------------------------*/

/*内页栏目样式开始-------------------------------------------------------------------------*/
/*product_list产品列表*/


/* ==== 产品详情 ==== */

/*case_list案例列表*/
/* ================= 业务领域列表 ================= */

/* ===============================
   产品列表
=============================== */

/* ===============================
   品牌策划页：第二屏丰满文案
=============================== */


/* ===============================
   产品详情页
=============================== */
.case-detail-wrap { width: 100%; background: #f3f3f3; padding: 0 0 64px; }

/* 白色内容卡：上移形成“凸起”效果（和列表一致的思路） */
.case-detail { width: min(1660px,92%); margin: -96px auto 0; /* 控制覆盖 banner 的高度 */ background: #fff; border-radius: 12px; box-shadow: 0 18px 55px rgba(0,0,0,.14); padding: 48px 64px 58px; position: relative; z-index: 5; }

/* 顶部：左标题+面包屑 / 右分类按钮 */
.cd-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; }
.cd-top-left .cd-en { font-size: 54px; font-weight: 900; letter-spacing: 2px; color: #cfcfcf; line-height: 1; }
.cd-crumb { margin-top: 10px; color: #8c8c8c; font-size: 16px; }
.cd-crumb a { color: #8c8c8c; }
.cd-crumb a:hover { color: #d51813; }
.cd-crumb .cur { color: #d51813; font-weight: 700; }

/* 右侧 pill（浅灰阴影，和你截图类似） */
.cd-top-right { display: flex; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }
.cd-tab { height: 44px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; background: #f6f6f6; color: #333; border-radius: 10px; box-shadow: 0 10px 20px rgba(0,0,0,.10); border: 1px solid #eee; font-size: 16px; transition: transform .2s ease, box-shadow .2s ease; }
.cd-tab:hover { transform: translateY(-2px); box-shadow: 0 14px 26px rgba(0,0,0,.14); }

/* 标题区 */
.cd-head { text-align: center; padding: 52px 0 16px; }
.cd-title { font-size: 44px; font-weight: 900; color: #111; letter-spacing: 2px; }
.cd-meta { margin-top: 14px; color: #9a9a9a; font-size: 16px; text-align: center; }
.cd-meta b { color: #333; font-weight: 800; }
.cd-meta .dot { margin: 0 14px; color: #cfcfcf; }
.cd-line { margin: 18px auto 0; height: 1px; background: #efefef; width: 100%; }

.cd-body { padding-top: 10px; }

/* 章节 */
.cd-sec { padding: 26px 0 6px; }
.cd-h2 { font-size: 18px; font-weight: 900; color: #111; margin-bottom: 12px; }
.cd-h3 { font-size: 16px; font-weight: 900; color: #111; margin: 0 0 10px; }
.cd-p { font-size: 16px; color: #555; line-height: 2.0; }
.cd-ul, .cd-ol { margin-top: 10px; padding-left: 18px; color: #555; }
.cd-ul li, .cd-ol li { margin: 8px 0; line-height: 1.9; }
.cd-ul b, .cd-ol b { color: #111; }

.cd-figure { margin: 18px 0 0; }
.cd-figure img { width: 100%; height: auto; display: block; border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.10); }
.cd-figure figcaption { text-align: center; font-size: 16px; color: #9a9a9a; margin-top: 10px; }

/* 图文混排：两列 */
.cd-mix { display: grid; grid-template-columns: 1fr 520px; gap: 38px; align-items: start; margin-top: 22px; }
.cd-mix-lt { grid-template-columns: 1fr 520px; }
.cd-mix-rt { grid-template-columns: 1fr 520px; }

.cd-mix-media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.10); }
.cd-cap { margin-top: 10px; font-size: 16px; color: #8f8f8f; background: #fafafa; border: 1px solid #f0f0f0; border-radius: 8px; padding: 10px 12px; }

/* 提示框（红色左边框） */
.cd-callout { margin: 14px 0 10px; background: #fff3f3; border-left: 4px solid #d51813; border-radius: 10px; padding: 14px 16px; color: #444; font-size: 16px; }

/* 上一篇 / 下一篇 */
.cd-nav { margin-top: 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.cd-nav-item { border: 1px solid #eee; border-radius: 12px; background: #fff; padding: 18px 20px; box-shadow: 0 10px 26px rgba(0,0,0,.05); transition: transform .2s ease, box-shadow .2s ease; color: #333; }
.cd-nav-item:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(0,0,0,.10); }
.cd-nav-item .t { font-size: 16px; color: #9a9a9a; }
.cd-nav-item .n { margin-top: 6px; font-size: 16px; font-weight: 800; color: #111; }

/* 响应式 */
@media (max-width: 1200px) {
    .case-detail { padding: 40px 34px 46px; }
    .cd-top { flex-direction: column; align-items: flex-start; }
    .cd-top-right { justify-content: flex-start; }
    .cd-head { padding: 34px 0 10px; }
    .cd-title { font-size: 36px; }
    .cd-mix { grid-template-columns: 1fr; }
    .cd-nav { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .case-detail { margin: -56px auto 0; padding: 26px 18px 34px; }
    .cd-top-left .cd-en { font-size: 38px; }
    .cd-title { font-size: 30px; }
}


/* ===============================
   案例列表
=============================== */
.case-list-wrap { width: 100%; background: #f3f3f3; padding: 0 0 70px; }

.case-list { width: min(1660px,92%); margin: -96px auto 0;  background: #fff; border-radius: 12px; box-shadow: 0 18px 55px rgba(0,0,0,.14); padding: 46px 64px 52px; position: relative; z-index: 5; }
 
/* 顶部区域 */
.cl-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; }

.cl-en { font-size: 54px; font-weight: 900; letter-spacing: 2px; color: #cfcfcf; line-height: 1; }

.cl-crumb { margin-top: 10px; color: #8c8c8c; font-size: 16px; }
.cl-crumb a { color: #8c8c8c; }
.cl-crumb a:hover { color: #d51813; }
.cl-crumb .cur { color: #d51813; font-weight: 800; }

/* 右侧分类按钮 */
.cl-top-right { display: flex; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }

.cl-tab { height: 44px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; background: #f6f6f6; color: #333; border-radius: 10px; border: 1px solid #eee; box-shadow: 0 10px 20px rgba(0,0,0,.10); font-size: 16px; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease; }
.cl-tab:hover { transform: translateY(-2px); box-shadow: 0 14px 26px rgba(0,0,0,.14); background-color: #d51813; color: #fff; }
.cl-tab.is-active { background: #111; color: #fff; border-color: #111; box-shadow: 0 14px 26px rgba(0,0,0,.18); }

/* 4列卡片 */
.cl-grid { margin-top: 22px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 60px; }

.cl-item { display: block; background: #fff; border-radius: 10px; overflow: hidden; border: 1px solid #ededed; box-shadow: 0 10px 28px rgba(0,0,0,.06); transition: transform .22s ease, box-shadow .22s ease; color: #333; }
.cl-item:hover { transform: translateY(-4px); box-shadow: 0 18px 42px rgba(0,0,0,.10); }

.cl-cover { width: 100%; aspect-ratio: 16 / 12; background: #f2f2f2; overflow: hidden; }
.cl-cover img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1); transition: transform .35s ease; }
.cl-item:hover .cl-cover img { transform: scale(1.05); }

/* 底部标题条（和你图里类似的深灰条） */
.cl-name { height: 56px; display: flex; align-items: center; justify-content: center; background: #6a6a6a; color: #fff; font-size: 16px; font-weight: 800; letter-spacing: 1px; }

/* 分页（简洁） */
.cl-page { margin-top: 28px; display: flex; justify-content: center; align-items: center; gap: 10px; font-size: 16px; color: #777; }
.cl-page a { color: #666; padding: 6px 10px; border-radius: 8px; border: 1px solid transparent; transition: all .2s ease; }
.cl-page a:hover { color: #d51813; border-color: #f1d0d0; background: #fff5f5; }
.cl-page .is-current { color: #d51813; font-weight: 800; border-color: #f1d0d0; background: #fff5f5; }
.cl-page .is-disabled { opacity: .4; pointer-events: none; }
.cl-page .dots { color: #aaa; padding: 0 6px; }

.cl-tab.is-active { background: #111 !important; color: #fff !important; border-color: #111 !important; box-shadow: 0 14px 26px rgba(0,0,0,.18) !important; }
/* ===============================
   案例卡片 hover
=============================== */
.cl-item { position: relative; overflow: hidden; border-radius: 12px; transform: translateZ(0); /* 防抖 */ }

/* 图片：轻柔放大 */
.cl-cover img { transform: scale(1); transition: transform .75s cubic-bezier(.22,1,.36,1); will-change: transform; }
.cl-item:hover .cl-cover img { transform: scale(1.06); }

/* 默认底部条：hover 时淡出 */
.cl-name { position: absolute; left: 0; right: 0; bottom: 0; height: 56px; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.55); color: #fff; font-size: 16px; font-weight: 800; letter-spacing: 1px; transition: opacity .35s ease, transform .55s cubic-bezier(.22,1,.36,1); will-change: opacity, transform; }
.cl-item:hover .cl-name { opacity: 0; transform: translateY(14px); }

/* hover 层：整层淡入 */
.cl-hover { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity .35s ease; }

/* 遮罩：先淡入 */
.cl-hover::before { content: ""; position: absolute; inset: 0; background: rgb(143 143 143 / 55%); transition: background .45s ease; }

/* 中间圆：从小到大，带轻微位移，节奏更自然 */
.cl-hover-circle { width: 280px; height: 280px; border-radius: 50%; background: rgba(255,255,255,.14); backdrop-filter: blur(2px); position: relative; z-index: 1; transform: scale(.55) translateY(40px); opacity: 0; transition: transform .85s cubic-bezier(.22,1,.36,1), opacity .55s ease; will-change: transform, opacity; }

/* 圆内标题：稍后出现 */
.cl-hover-title { position: absolute; z-index: 2; color: #fff; font-size: 22px; font-weight: 900; letter-spacing: 2px; text-align: center; padding: 0 18px; opacity: 0; transform: translateY(10px); transition: opacity .55s ease .12s, transform .75s cubic-bezier(.22,1,.36,1) .12s; will-change: opacity, transform; }

/* hover 触发节奏：层 -> 遮罩 -> 圆 -> 字 */
.cl-item:hover .cl-hover { opacity: 1; }
.cl-item:hover .cl-hover::before { background: rgb(105 105 105 / 55%); }
.cl-item:hover .cl-hover-circle { opacity: 1; transform: scale(1) translateY(0); }
.cl-item:hover .cl-hover-title { opacity: 1; transform: translateY(0); }

/* 可选：降低“突兀感”——鼠标离开也更柔和 */
.cl-item .cl-hover,
.cl-item .cl-hover::before,
.cl-item .cl-hover-circle,
.cl-item .cl-hover-title { backface-visibility: hidden; }

/* 响应式 */
@media (max-width: 1400px) {
    .cl-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
    .case-list { padding: 36px 28px 44px; }
    .cl-top { flex-direction: column; align-items: flex-start; }
    .cl-top-right { justify-content: flex-start; }
    .cl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
    .case-list { margin: -56px auto 0; padding: 26px 16px 34px; }
    .cl-en { font-size: 38px; }
    .cl-grid { grid-template-columns: 1fr; }
}

/*case_show案例详情*/
/* ===============================
   案例详情
=============================== */
.case-detail { position: relative; width: 100%; margin-top: -96px; /* 凸起压住 banner，想多压/少压改这里 */ padding: 0 0 80px; z-index: 5; }
.case-detail__inner { width: 92%; margin: 0 auto; background: #fff; border-radius: 10px; box-shadow: 0 18px 50px rgba(0,0,0,.12); padding: 34px 40px 44px; }

/* 顶部 */
.cd-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 2rem; }
.cd-en { font-size: 46px; font-weight: 900; letter-spacing: 2px; color: #d9d9d9; line-height: 1; }
.cd-crumb { margin-top: 10px; color: #888; font-size: 16px; }
.cd-crumb a { color: #666; }
.cd-crumb a:hover { color: #d51813; }
.cd-crumb .cur { color: #d51813; font-weight: 700; }

.cd-tabs { display: flex; gap: 12px; margin-top: 18px; }
.cd-tab { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 22px; border-radius: 8px; background: #f4f4f4; border: 1px solid #ededed; color: #666; font-size: 16px; box-shadow: 0 10px 18px rgba(0,0,0,.06); }
.cd-tab:hover { color: #111; border-color: #e2e2e2; background: #f2f2f2; }

.cd-line { margin: 18px 0 0; height: 1px; background: rgba(0,0,0,.06); }

/* 正文排版 */
.cd-body { padding-top: 22px; color: #666; }
.cd-section { margin-top: 22px; }
.cd-h3 { font-size: 18px; font-weight: 900; color: #111; margin: 0 0 10px; }
.cd-h4 { font-size: 16px; font-weight: 900; color: #111; margin: 10px 0 6px; }
.cd-p { font-size: 16px; line-height: 1.9; margin: 0 0 10px; color: #666; }
.cd-note { color: #888; }

.cd-ul, .cd-ol { margin: 8px 0 0 18px; color: #666; }
.cd-ul li, .cd-ol li { margin: 8px 0; line-height: 1.9; }
.cd-ul b { color: #111; }

.cd-figure { margin: 18px 0 0; overflow: hidden; border-radius: 10px; background: #f6f6f6; }
.cd-figure img { width: 100%; display: block; }
.cd-figure figcaption { font-size: 16px; color: #888; padding: 10px 14px; border-top: 1px solid rgba(0,0,0,.06); background: #fafafa; }
.cd-figure--full { border-radius: 10px; }
.cd-figure--side { border-radius: 10px; }

.cd-mix { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; align-items: start; }
.cd-mix--reverse { grid-template-columns: .8fr 1.2fr; }
.cd-mix__text { padding-right: 4px; }

.cd-tip { margin-top: 14px; background: #fff3f3; border-left: 4px solid #d51813; color: #666; padding: 12px 14px; border-radius: 8px; font-size: 16px; }

.cd-prevnext { margin-top: 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cd-prev, .cd-next { border: 1px solid rgba(0,0,0,.08); border-radius: 10px; padding: 14px 16px; background: #fff; color: #666; }
.cd-prev:hover, .cd-next:hover { border-color: rgba(213,24,19,.35); }
.cd-prev span, .cd-next span { display: block; font-size: 16px; color: #888; }
.cd-prev b, .cd-next b { display: block; margin-top: 4px; font-size: 16px; color: #111; }
/* ===== 案例详情：白盒凸起（最稳：用 transform 提升） ===== */
.case-detail { width: 92%; background: #f3f3f3; padding: 2rem; position: relative; z-index: 20; }

/* 用 transform 往上提，避免 margin 被吞 */
.case-detail__inner { width: 92%; margin: 0 auto; background: #fff; border-radius: 10px; box-shadow: 0 18px 50px rgba(0,0,0,.12); padding: 34px 40px 44px; transform: translateY(-96px); /* ✅ 这里控制凸起高度：-70 / -96 / -120 */ position: relative; z-index: 21; }

/* 小屏少提一点 */
@media (max-width:1100px) {
    .case-detail__inner { transform: translateY(-70px); }
}

@media (max-width:600px) {
    .case-detail__inner { transform: translateY(-56px); }
}

/* 响应式 */
@media (max-width: 1100px) {
    .case-detail { margin-top: -70px; }
    .case-detail__inner { padding: 26px 18px 34px; }
    .cd-top { flex-direction: column; }
    .cd-tabs { flex-wrap: wrap; }
    .cd-mix, .cd-mix--reverse { grid-template-columns: 1fr; }
    .cd-en { font-size: 36px; }
}


/* ===============================
   NEWS LIST  新闻列表页
=============================== */

.news-center { width: 100%; background: #f3f3f3; padding: 0 0 90px; position: relative; z-index: 20; }
.news-inner { width: 92%; margin: 0 auto; background: #fff; border-radius: 10px; box-shadow: 0 18px 50px rgba(0,0,0,.12); padding: 34px 40px 36px; transform: translateY(-96px); position: relative; z-index: 21; }

@media (max-width:1100px) {
    .news-inner { padding: 26px 22px 28px; transform: translateY(-70px); }
}

@media (max-width:600px) {
    .news-inner { transform: translateY(-56px); }
}

.news-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.news-en { font-size: 52px; font-weight: 900; letter-spacing: 2px; color: #d7d7d7; line-height: 1; }
.news-crumb { margin-top: 10px; font-size: 16px; color: #888; }
.news-crumb a { color: #666; }
.news-crumb a:hover { color: #d51813; }
.news-crumb span { margin: 0 6px; color: #c9c9c9; }
.news-crumb b { color: #d51813; font-weight: 900; }

.news-tabs { display: flex; align-items: center; gap: 12px; margin-top: 43px; }
.news-tab { display: inline-flex; align-items: center; justify-content: center; height: 36px; min-width: 92px; padding: 0 18px; border-radius: 8px; background: #f6f6f6; border: 1px solid #ededed; color: #777; font-size: 16px; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease; }
.news-tab:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(0,0,0,.08); background-color: #d51813; color: #fff; }
.news-tab.is-active { background: #111; border-color: #111; color: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.18); }

.news-line { height: 1px; background: #ededed; margin: 18px 0 18px; }

.news-title-row h2 { font-size: 28px; font-weight: 900; color: #111; margin: 0 0 18px; }

/* 列表 */
.news-list { display: flex; flex-direction: column; gap: 18px; }

.news-item { display: flex; gap: 22px; background: #fff; border-radius: 14px; border: 1px solid #f1f1f1; box-shadow: 0 12px 36px rgba(0,0,0,.06); padding: 18px; color: #333; transition: transform .25s ease, box-shadow .25s ease; }
.news-item:hover { transform: translateY(-2px); box-shadow: 0 18px 52px rgba(0,0,0,.10); }

.news-thumb { flex: 0 0 260px; width: 260px; height: 150px; border-radius: 12px; overflow: hidden; background: #f2f2f2; }
.news-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1); transition: transform .6s ease; }
.news-item:hover .news-thumb img { transform: scale(1.06); }

.news-body { flex: 1; position: relative; padding-right: 140px; /* 右下角日期/按钮空间 */ min-height: 150px; }

.news-badge { display: inline-flex; align-items: center; height: 22px; padding: 0 10px; border-radius: 999px; background: #f4f4f4; color: #777; font-size: 16px; border: 1px solid #eee; margin-bottom: 8px; }
.news-title { font-size: 18px; font-weight: 900; color: #111; line-height: 1.35; }
.news-desc { margin-top: 8px; font-size: 16px; color: #888; line-height: 1.8; max-width: 900px; }

.news-meta { margin-top: 10px; display: flex; gap: 18px; color: #aaa; font-size: 16px; }
.news-meta .m { display: inline-flex; align-items: center; gap: 6px; }
.news-meta i { font-size: 16px; color: #bbb; }

/* 右下角：日期 + 按钮 */
.news-right-bottom { position: absolute; right: 0; bottom: 0; text-align: right; }
.news-date { font-size: 16px; color: #aaa; margin-bottom: 6px; }
.news-btn { display: inline-flex; align-items: center; justify-content: center; height: 34px; padding: 0 14px; border-radius: 999px; border: 1px solid rgba(213,24,19,.55); color: #d51813; font-size: 16px; background: #fff; transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease; }
.news-btn i { margin-left: 6px; font-style: normal; font-size: 16px; line-height: 1; }
.news-item:hover .news-btn { background: #d51813; color: #fff; transform: translateY(-1px); box-shadow: 0 12px 26px rgba(213,24,19,.22); }

/* 响应式 */
@media (max-width: 1100px) {
    .news-item { flex-direction: column; }
    .news-thumb { width: 100%; flex: 0 0 auto; height: 200px; }
    .news-body { padding-right: 0; min-height: auto; }
    .news-right-bottom { position: static; margin-top: 10px; text-align: left; display: flex; align-items: center; gap: 14px; }
}

/*news_show新闻详情*/
/* ===============================
   NEWS DETAIL
=============================== */
.news-detail { width: 100%; background: #f3f3f3; padding: 0 0 90px; position: relative; z-index: 20; }
.news-detail__inner { width: 92%; margin: 0 auto; background: #fff; border-radius: 10px; box-shadow: 0 18px 50px rgba(0,0,0,.12); padding: 34px 40px 40px; transform: translateY(-96px); position: relative; z-index: 21; }

@media (max-width:1100px) {
    .news-detail__inner { padding: 26px 22px 28px; transform: translateY(-70px); }
}

@media (max-width:600px) {
    .news-detail__inner { transform: translateY(-56px); }
}

/* 顶部信息栏 */
.nd-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.nd-en { font-size: 52px; font-weight: 900; letter-spacing: 2px; color: #d7d7d7; line-height: 1; }
.nd-crumb { margin-top: 10px; font-size: 16px; color: #888; }
.nd-crumb a { color: #666; }
.nd-crumb a:hover { color: #d51813; }
.nd-crumb b { color: #d51813; font-weight: 900; }

.nd-tabs { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.nd-tab { display: inline-flex; align-items: center; justify-content: center; height: 36px; min-width: 92px; padding: 0 18px; border-radius: 8px; background: #f6f6f6; border: 1px solid #ededed; color: #777; font-size: 16px; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease; }
.nd-tab:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(0,0,0,.08); }
.nd-tab.is-active { background: #111; border-color: #111; color: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.18); }

.nd-line { height: 1px; background: #ededed; margin: 18px 0 10px; }

/* 标题区 */
.nd-titlebox { text-align: center; padding: 40px 0 18px; }
.nd-title { margin: 0; font-size: 46px; font-weight: 900; letter-spacing: 2px; color: #111; }
.nd-meta { margin-top: 14px; font-size: 16px; color: #999; display: flex; align-items: center; justify-content: center; gap: 16px; }
.nd-meta b { color: #111; font-weight: 800; }
.nd-meta .dot { width: 6px; height: 6px; border-radius: 50%; background: #ddd; display: inline-block; }

/* 正文排版 */
.nd-content { padding-top: 10px; color: #333; line-height: 1.9; font-size: 16px; }
.nd-content h2 { font-size: 18px; font-weight: 900; color: #111; margin: 26px 0 10px; }
.nd-content p { margin: 0 0 12px; color: #666; }
.nd-content ul, .nd-content ol { margin: 10px 0 12px 18px; color: #666; }
.nd-content li { margin: 6px 0; }
.nd-content blockquote { margin: 16px 0; padding: 14px 16px; background: #fff5f5; border-left: 4px solid #d51813; border-radius: 10px; color: #666; }

/* 图片块 */
.nd-figure { margin: 18px 0 12px; border-radius: 12px; overflow: hidden; background: #f2f2f2; box-shadow: 0 12px 36px rgba(0,0,0,.08); }
.nd-figure img { width: 100%; display: block; height: auto; }
.nd-figure .cap { padding: 10px 14px; font-size: 16px; color: #8a8a8a; background: #fff; border-top: 1px solid #f0f0f0; }
.nd-figure.small { box-shadow: 0 12px 30px rgba(0,0,0,.06); }

/* 两栏图文混排 */
.nd-grid2 { display: grid; grid-template-columns: 1.05fr .95fr; gap: 26px; align-items: start; }
.nd-grid2.reverse { grid-template-columns: .95fr 1.05fr; }
.nd-text { color: #666; }
.nd-text ol { margin-left: 18px; }
.nd-text p { margin-top: 10px; }

@media (max-width:1100px) {
    .nd-grid2, .nd-grid2.reverse { grid-template-columns: 1fr; gap: 16px; }
}

/* 上一篇/下一篇 */
.nd-pager { margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.nd-page { border: 1px solid #eee; border-radius: 12px; padding: 14px 16px; background: #fff; box-shadow: 0 10px 26px rgba(0,0,0,.05); transition: transform .2s ease, box-shadow .2s ease; color: #333; }
.nd-page:hover { transform: translateY(-2px); box-shadow: 0 16px 38px rgba(0,0,0,.08); }
.nd-page .t { font-size: 16px; color: #999; margin-bottom: 6px; }
.nd-page .n { font-size: 16px; color: #111; font-weight: 800; line-height: 1.5; }

@media (max-width:900px) {
    .nd-pager { grid-template-columns: 1fr; }
}

/*contact联系我们*/

/* 联系页面动画 */

/*栏目样式结束-------------------------------------------------------------------------*/

/* 响应式图片容器 */

/* 弹性网格布局 */