@charset "utf-8";
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;line-height:1.15;-webkit-tap-highlight-color: rgba(0,0,0,0);overflow-x:hidden;}
body{margin:0;font-family: "Microsoft Yahei",PingFangSC-Regular,"Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;line-height: 1.42857143;font-size: 14px;min-width: 320px;background: #fff;color: #333;}
h1{font-size:2em;margin:.67em 0;}
figure{margin:1em 40px;}
hr{box-sizing:content-box;height:0;overflow:visible;}
a{-webkit-text-decoration-skip:objects;background-color:transparent;}
abbr[title]{border-bottom:none;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}
b,strong{font-weight:bolder;}
dfn{font-style:italic;}
mark{background-color:#ff0;color:#000;}
small{font-size:80%;}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
sub{bottom:-.25em;}
sup{top:-.5em;}
audio:not([controls]){display:none;height:0;}
img{border-style:none;max-width:100%;}
svg:not(:root){overflow:hidden;}
button,input,optgroup,select,textarea{line-height:1.42857143;margin:0;outline: none;}
body, button, input, select, textarea {text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-moz-font-feature-settings: "liga","kern";}
button,input{overflow:visible;}
button,select{text-transform:none;}
button,html [type=button],/* 1 */
[type=reset],[type=submit]{-webkit-appearance:button;}
button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0;}
button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText;}
fieldset{padding:.35em .75em .625em;}
legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}
progress{display:inline-block;vertical-align:baseline;}
textarea{overflow:auto;}
[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto;}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}
[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none;}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}
summary{display:list-item;}
article,aside,footer,header,nav,section,figcaption,figure,main,details,/* 1 */
menu{display:block;}
pre,code,kbd,samp{font-family:monospace, monospace;font-size:1em;}
audio,video,canvas{display:inline-block;}
template,[hidden]{display:none;}
.clearfix{zoom:1;}
.clearfix:before,.clearfix:after{display:table;line-height:0;content:"";}
.clearfix:after{clear:both;}
a {color: #333;text-decoration: none;}
a:hover {color: #e62022;}
ul {margin: 0;list-style: none;padding: 0;}

/* 图片列表页导航样式 */
.main {
    width: 100%;
}
.center {
    width: 1600px;
    margin: 0 auto;
}

/* K654 模板列表页：列表框与深色页脚之间的白底留白 (2026-08-28) */
.case_wrap {
    padding-bottom: 40px;
}
.box_tit {
    margin: 50px 0;
}
.box_tit span {
    font-size: 30px;
    text-align: center;
    color: #000;
    display: block;
}
.box_tit p {
    font-size: 18px;
    color: #666;
    display: block;
    text-align: center;
    margin-top: 12px;
    line-height: 170%;
}
.pro_screen {
    padding: 40px 60px;
    border: 1px solid #eaeaea;
    border-radius: 8px;
    background-color: #f9f9f9;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 30px; margin-top:20px
}
.pro_screen ul {
    margin-top: 10px;
    padding-left: 10px;
}
.pro_screen ul li {
    margin: 0 8px;
    float: left;
}
.pro_screen ul li span {
    display: block;
    color: #aaa;
    padding: 7.5px 19px;
}
.pro_screen ul li a.active {
    color: #fff;
    background-color: #e62022;
}
.pro_screen ul li a {
    color: #aaa;
    padding: 6px 16px;
    display: block;
}
.flex_between {
    width: 100%;
    padding: 30px 0;
}
.flex_between .text {
    color: #333;
    float: left;
    margin-top: 4px;
}
.flex_between .text a.active {
    color: #fff;
    background-color: #e62022;
}
.flex_between .text a {
    display: inline-block;
    vertical-align: middle;
    height: 30px;
    line-height: 30px;
    text-align: center;
    padding: 0 10px;
}
.flex_between .search {
    position: relative;
    padding-right: 78px;
    float: right;
}
.flex_between .search input[type="text"] {
    width: 182px;
    height: 36px;
    line-height: 36px;
    border: 1px solid #ddd;
    border-right: 0;
    float: left;
    padding: 0 10px;
    outline: 0;
}
.flex_between .search input[type="submit"] {
    position: absolute;
    right: 0;
    top: 0;
    width: 78px;
    float: right;
    height: 36px;
    line-height: 36px;
    text-align: center;
    color: #fff;
    outline: 0;
    border: none;
    background-color: #e62022;
    -webkit-transition: background-color .2s;
    transition: background-color .2s;
}
.case_list ul li {
    width: 31%;
    margin-right: 1.2%;
    border: 1px solid #eee;
    padding: 8px;
    margin-bottom: 15px;
    float: left;
}
.case_list ul li .scroll_pic {
    position: relative;
    width: 100%;

    margin: 0;
    overflow: hidden;
}
.case_list ul li .scroll_pic img {
    width: 100%;
    position: relative;
    display: block;
}
.case_list ul li .text h3 {
    line-height: 48px;
    border-bottom: 1px solid #f6f6f6;
    color: #555;
    padding: 0 5px;
    font-size: 16px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.case_list ul li .text2 {
    width: 100%;
    -webkit-box-pack: justify;
            justify-content: space-between;

}
.case_list ul li .text2 span {
    font-size: 12px;
    color: #f60;
    float: left;
}
.case_list ul li .text2 span i {
    font-size: 22px;
    font-style: normal;
}
.case_list ul li .text2 span em {
    color: #999;
    font-style: normal;
    padding-left: 5px;
}
.case_list ul li .text2 a {
    display: block;
    width: 92px;
    height: 34px;
    border: 1px solid #e5e5e5;
    color: #555;
    text-align: center;
    line-height: 32px;
    border-radius: 3px;
    float: right;
}

.case_list ul li .text2 a:hover {
  background: #3399ff;
  color: #fff;
  border-color: #3399ff;
}

.case_list ul li .text3 {

  width: 100%;
  -webkit-box-pack: justify;
          justify-content: space-between;
  padding: 10px 0;

}
.case_list ul li .text3 p {
  font-size: 12px;
  color: #ccc;
  float: left;

}

.case_list ul li .text3 p em {
  font-style: normal;
  color: #999;
}


.case_list ul li .text3 span {
  float: right;
  margin-top: 3px;

}
.case_list ul li .text3 span i {
  font-style: normal;
  display: inline-block;
  color: #66c7f2;
  border: 1px solid #66c7f2;
  padding: 3px 2px;
  line-height: 1;
  font-size: 12px;
  line-height: 100%;
  margin-left: 5px;
}
.case_list ul li:nth-child(3n) {

  margin-right: 0;

}
a:active, a:hover {
    outline: 0;
}
.pages {

  margin-top: 40px;

  margin-bottom: 20px;

  text-align: center;

}



.pages a {

  display: inline-block;

  height: 32px;

  line-height: 30px;

  background: #fff;

  border: 1px solid #e6e6e6;

  text-align: center;

  color: #333;

  padding: 0 14px;

  border-radius: 5px;

  margin: 0 3px;

}



.pages a:hover {

  background: #e62022;

  color: #fff;

  text-decoration: none;

  border: 1px solid #e62022;

}



.pages a.current {

  background: #e62022;

  color: #fff;

  text-decoration: none;

  border: 1px solid #e62022;

}



.img-center {text-align: center;font-size: 0;}
.img-center img {display: inline-block;width: auto;max-width: 100%;max-height: 100%;vertical-align: middle;-webkit-transition: all 0.5s;transition: all 0.5s;}

.img-cover {overflow: hidden;position: relative;}
.img-cover span {display: block;width: 100%;background: no-repeat center / cover;-webkit-transition: all 0.5s;transition: all 0.5s;height: 100%;position: absolute;left: 0;top: 0;}

/* [2026-10-04] 自适应修复：容器由固定 1600px 改为流式（含内边距），笔记本/平板不再横向溢出 */
.container {padding: 0 15px;width: 100%;max-width: 1600px;margin: 0 auto;box-sizing: border-box;}

/* 右侧在线客服 [2026-10-04] 参照 k771 重做：竖排图标条，默认右缩只露 53px 图标，悬停滑出并展开二维码（原 .kf 白面板+侧边把手弃用）；命名沿用本站 kf-*，配色换本站红 */
/* [2026-10-13] 客服条整体缩小 30%：框 126×37，精灵图 background-size 等比 70%（38×158），露边 38px */
/* [2026-10-16] 重构：拆 3 个独立 PNG (kf_top/phone/ercode.png) 替代精灵图，消除透明切片白线 */



.kf-bar ul li{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:139px;height:52px;margin-bottom:4px;border-radius:8px;overflow:hidden;-webkit-transition:all .5s ease;transition:all .5s ease;}
.kf-bar ul li>a,.kf-bar ul li>span{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;height:100%;padding:0 7px 0 7px;box-sizing:border-box;gap:10px;color:#fff;text-decoration:none;font-size:12px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* 改用 <img> 标签直接引用 kf_top/phone/ercode.png，背景图规则已移除 */
.kf-bar 
.kf-bar 
.kf-bar 
.kf-bar .kf-ercode 
.kf-bar 
.kf-bar .kf-ercode-pop img{display:block;width:100px;height:100px;object-fit:contain;}.kf-bar .kf-ercode-pop .kf-pop-text{margin-top:6px;font-size:11px;line-height:1;color:#666;text-align:center;white-space:nowrap;}
.kf-bar .kf-phone p{margin:0;font-weight:bold;}

.header {position: fixed;z-index: 100;left: 0;top: 0;width: 100%;padding: 15px 0;background-color: transparent;border-bottom: 1px solid rgba(255,255,255,.15);-webkit-transition: all .5s ease;transition: all .5s ease;}
.header.xg {background-color: #fff;border-bottom-color: rgba(0,0,0,.08);}
.header.xg .nav li a {color: #212121;}
.header.xg .nav li.active a,.header.xg .nav li.open a,.header.xg .nav li a:hover {color: #e62022;}
/* [2026-10-10] 导航下划线滚动后头部是白底，白条会隐形 → .xg 态回落主题红 */
.header.xg .nav li > a::after {background-color: #e62022;}
.header.xg .nav li .arr:after {border-color: #212121;}
/* logo 滚动切换 */
.header .logo img { display: block; height: 80px; width: auto; }
.header .logo .logo-scroll { display: none; }
.header.xg .logo .logo-default { display: none; }
.header.xg .logo .logo-scroll { display: block; }
.header .logo {float: left;height: 66px;line-height: 66px;text-align: left;}
.header .nav {font-size: 0;float: right;}
.header .nav li {display: inline-block;vertical-align: middle;margin-left: 50px;}
.header .nav li a {display: block;font-size: 18px;color: #fff;line-height: 66px;position: relative;}
/* [2026-10-10] 下划线：红→白，位置 bottom -20px→-16px（原在白线下方，现贴到 header 底部白线上） */
.header .nav li > a::after {content: "";width: 0;height: 4px;background-color: #fff;position: absolute;left: 50%;bottom: -16px;transform: translateX(-50%);transition: all .5s ease;}
.header .nav li.active > a::after,.header .nav li:hover > a::after {width: 100%;}
.header .nav li a span {display: block;text-transform: uppercase;font-size: 12px;opacity: 0;-webkit-transition: all 0.5s;transition: all 0.5s;}
.header .nav li .arr {float: right;height: 40px;width: 40px;position: relative;display: none;}
.header .nav li .arr:after {content: '';border-top: 2px solid #fff;border-left: 2px solid #fff;box-sizing: content-box;display: block;width: 8px;height: 8px;margin: auto;position: absolute;top: 0;bottom: 0;-webkit-transform: rotate(135deg);transform: rotate(135deg);right: 15px;}
.header .nav li.dropdown {position: relative;}
.header .nav .dropdown-box {position: absolute;left: 50%;min-width: 100%;width: auto;white-space: nowrap;top: calc(100% + 20px);background-color: #fff;border-radius: 10px;overflow: hidden;opacity: 0;visibility: hidden;z-index: 10;transform: translateX(-50%);text-align: center;-webkit-transition: all .5s ease;transition: all .5s ease;}
.header .nav .dropdown-box p {margin: 0;}
.header .nav .dropdown-box a {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: #212121 !important;line-height: 50px;font-size: 16px;padding: 0 30px;border-bottom: 1px solid rgba(0,0,0,.1);background-image: none;-webkit-transition: all .5s ease;transition: all .5s ease;}
.header .nav .dropdown-box a:hover {background-color: #e62022 !important;color: #fff !important;}
.header .nav li.active a,.header .nav li.open a,.header .nav li a:hover {background-position: center 110%;color: #e5e3e3;}
.header .nav li.active a span,.header .nav li.open a span,.header .nav li a:hover span {opacity: 1;color: #e62022;}
.header .nav li.open .dropdown-box,.header .nav li:hover .dropdown-box {opacity: 1;visibility: visible;}

/* --- [2026-10-11] 导航右侧电话胶囊按钮（参照多维官网 dowv）：红底白字 + 听筒图标 ---
   float:right 且 DOM 置于 container 首位 → 贴容器最右端；三横线全屏菜单按钮(.sp_nav)落在其左侧。
   margin-left 即电话与三横线的间距；初始透明顶栏与滚动白底两种状态下红色都醒目 */
.hd-tel {float: right;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;align-items: center;gap: 10px;margin: 11px 0 0 44px;padding: 0 22px 0 7px;height: 42px;border-radius: 999px;background: #e62022;color: #fff !important;font-size: 16px;font-weight: 700;letter-spacing: .5px;box-shadow: 0 8px 18px rgba(230,32,34,.32);-webkit-transition: background-color .35s ease,box-shadow .35s ease,-webkit-transform .35s ease;transition: background-color .35s ease,box-shadow .35s ease,transform .35s ease;}
.hd-tel i {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;align-items: center;justify-content: center;width: 30px;height: 30px;border-radius: 50%;background: rgba(255,255,255,.18);}
.hd-tel svg {display: block;width: 16px;height: 16px;}
.hd-tel:hover {background: #cf1113;box-shadow: 0 12px 24px rgba(230,32,34,.4);-webkit-transform: translateY(-2px);transform: translateY(-2px);color: #fff !important;}
@media (max-width:1440px){
  .hd-tel {margin-top: 6px;}
}
@media (max-width:1024px){
  .hd-tel {height: 36px;margin: 4px 0 0 24px;padding: 0 16px 0 5px;font-size: 14px;gap: 7px;}
  .hd-tel i {width: 26px;height: 26px;}
  .hd-tel svg {width: 14px;height: 14px;}
}
/* [2026-10-04] 自适应：平板/笔记本导航收窄（间距字号随屏宽递减），避免 8 个栏目换行溢出 */
@media (max-width:1440px){
  .header .logo {height: 56px;line-height: 56px;}
  .header .logo img {height: 56px;}
  .header .nav li {margin-left: 30px;}
  .header .nav li a {font-size: 16px;line-height: 56px;}
}
@media (max-width:1024px){
  .header .logo {height: 44px;line-height: 44px;}
  .header .logo img {height: 44px;}
  .header .nav li {margin-left: 18px;}
  .header .nav li a {font-size: 14px;line-height: 44px;}
}

/* [2026-10-04] 手机端顶部导航参照 namisoft：三线汉堡，展开时变 X（纯 CSS 绘制，无外部图标） */
.menu-btn {display: none;float: right;width: 23px;height: 23px;padding: 0;margin-left: 15px;position: relative;cursor: pointer;}
.menu-btn span {display: block;width: 20px;height: 2px;background-color: #fff;position: relative;-webkit-transition-duration: .3s, .3s;transition-duration: .3s, .3s;-webkit-transition-delay: .3s, 0s;transition-delay: .3s, 0s;}
.menu-btn span:before,.menu-btn span:after {content: '';position: absolute;display: block;width: 20px;height: 2px;left: 0;background-color: #fff;-webkit-transition-duration: .3s, .3s;transition-duration: .3s, .3s;-webkit-transition-delay: .3s, 0s;transition-delay: .3s, 0s;}
.menu-btn span:before {top: -6px;-webkit-transition-property: top, transform;transition-property: top, transform;}
.menu-btn span:after {bottom: -6px;-webkit-transition-property: bottom, transform;transition-property: bottom, transform;}
.menu-btn.active span {background-color: transparent;-webkit-transition-delay: 0s, 0s;transition-delay: 0s, 0s;}
.menu-btn.active span:before {top: 0;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.menu-btn.active span:after {bottom: 0;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
/* 抽屉导航本体由 ≤767 段的 .mob-* 规则控制 */
.mob-nav,.mob-mask {display: none;}

.sp_nav_body {overflow: hidden;}

.sp_nav{width:18px;float:right;position:relative;cursor:pointer;z-index:10;height: 14px;margin: 25px 0 0 25px;}
.sp_nav span{display:block;background:#ffffff;width:18px;height:2px;position:absolute;left:0;-webkit-transition:all ease 0.35s;transition:all ease 0.35s;}
.sp_nav .sp_nav1{top:0;}
.sp_nav .sp_nav2{top:6px;width:14px;}
.sp_nav .sp_nav3{top:12px;}
.sp_nav_se .sp_nav1,.sp_nav_se .sp_nav2,.sp_nav_se .sp_nav3 {background-color:#222222;}
.sp_nav_se .sp_nav1{top:5px;-webkit-transform:rotate(45deg);transform:rotate(45deg);}
.sp_nav_se .sp_nav2{width:0!important;}
.sp_nav_se .sp_nav3{top:5px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.sp_nav_se .logo{display: none;}
.sp_nav_se .nav{display: none;}
.sp_nav:hover .sp_nav2{width:18px;}

.sp_nav-box {position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: #fff;z-index: 99;display: none;}
.sp_nav-box .container {display: table;height: 100%;}
.sp_nav-box .inner {display: table-cell;vertical-align: middle;}
.sp_nav-box ul {overflow: hidden;margin: 100px 0;}
.sp_nav-box li {float: left;width: 20%;font-size: 0;text-align: center;}
.sp_nav-box li a {display: inline-block;padding: 12px 0;font-size: 24px;vertical-align: middle;position: relative;}
.sp_nav-box li a:after {position: absolute;content: '';height: 3px;background-color: #e62022;left: 0;bottom: 0;-webkit-transition: all 0.5s;transition: all 0.5s;width: 0;}
.sp_nav-box li a:hover:after {width: 30px;}

/* [模板列表页样式] */
.banner {height: 100vh;min-height: 600px;position: relative;background: url(../images/aboutvideo.jpg) no-repeat center / cover;overflow: hidden;}
/* [banner 视频样式] */
/* [2026-10-02] 首屏视频铺满：object-fit 裁切适配任意屏宽比例（原为固定1920x1080负边距居中且display:none） */
.banner video {display: block;position: absolute;left: 0;top: 0;width: 100%;height: 100%;object-fit: cover;z-index: 0;background: #000;}
.banner .text {display: table;width: 100%;height: 100%;color: #fff;background: rgba(8,8,9,0.4);position: relative;z-index: 2;}
.banner .text .inner {display: table-cell;vertical-align: middle;text-align: center;}
.banner .text h4 {font-size: 54px;text-shadow: 0 2px 2px #333333;margin: 0 0 30px;-webkit-transform: translateX(-200px);transform: translateX(-200px);-webkit-transition: all 1s;transition: all 1s;opacity: 0;}
.banner .text p {font-size: 22px;margin: 0;text-shadow: 0 2px 2px #333333;-webkit-transform: translateX(200px);transform: translateX(200px);-webkit-transition: all 1s;transition: all 1s;opacity: 0;}
.banner .text a {display: block;margin: 40px auto 0;border: 1px solid #fff;border-radius: 50px;line-height: 42px;font-size: 18px;width: 180px;color: #fff;-webkit-transition: all 0.5s;transition: all 0.5s;}
.banner .text a:hover {background-color: #e62022;border-color: #e62022;}
/* [banner 轮播样式] */
.banner .img-cover {display: block;position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 1;}
.banner .img-cover span {display: block;width: 100%;height: 100%;background-size: cover;background-position: center;}
/*.banner .swiper-pagination {display: block;}*/
.banner .ani-slide h4,.banner .ani-slide p {-webkit-transform: translateX(0);transform: translateX(0);opacity: 1;}

/* [banner 轮播样式] */
.banner .slide-text-right {position: absolute;right: 8%;top: 50%;transform: translateY(-50%) translateX(60px);z-index: 10;color: #fff;text-align: left;max-width: 480px;opacity: 0;transition: opacity 1s ease-in 0.6s, transform 1s ease-in 0.6s;}
.banner .ani-slide .slide-text-right {opacity: 1;transform: translateY(-50%) translateX(20px);}
.banner .slide-text-right h4 {font-size: 46px;font-weight: 700;line-height: 1.2;margin: 0 0 20px;text-shadow: 0 4px 12px rgba(0,0,0,0.5);}
.banner .slide-text-right h4 small {display: block;font-size: 26px;font-weight: 400;margin-top: 10px;color: #ffd700;letter-spacing: 2px;}
.banner .slide-text-right p {font-size: 20px;line-height: 1.8;margin: 0 0 30px;text-shadow: 0 2px 8px rgba(0,0,0,0.6);color: rgba(255,255,255,0.95);}
.banner .slide-text-right .btn-group {display: flex;gap: 16px;flex-wrap: wrap;}
.banner .slide-text-right .btn-primary {display: inline-block;padding: 10px 30px;background: #e62022;color: #fff;border-radius: 30px;font-size: 18px;font-weight: 500;transition: all 0.3s;border: 2px solid #e62022;}
.banner .slide-text-right .btn-primary:hover {background: #fff;color: #e62022;}
.banner .slide-text-right .btn-secondary {display: inline-block;padding: 14px 36px;background: transparent;color: #fff;border-radius: 30px;font-size: 18px;font-weight: 500;transition: all 0.3s;border: 2px solid #fff;}
.banner .slide-text-right .btn-secondary:hover {background: #fff;color: #333;}

/* ===== 首屏视频文字特效（2026-10-02）=====
   结构：第一张幻灯片加 hero-slide 类（桌面端隐藏其背景图，透出底层视频），
   内含 .hero-text 文字层。动画由轮播已有的 ani-slide 类驱动：
   切到首屏时逐字上浮 → 渐变线展开 → 副标题字距聚拢；移出再回来会重播。
   文字内容/逐字延迟在 index.html 的 .hero-text 里改。 */
.banner .hero-slide .img-cover {display: none;}
.banner .hero-slide .wk_wrap,
.banner .hero-slide .slide-text-right {display: none;}
/* [2026-10-02] 视频播完后的状态（脚本给 .banner 加 video-done 类）：
   视频层淡出并隐藏，第一张幻灯片恢复显示后台配置的背景图，banner 转为纯图片自动轮播 */
.banner.video-done video {opacity: 0;visibility: hidden;-webkit-transition: opacity .8s, visibility .8s;transition: opacity .8s, visibility .8s;}
.banner.video-done .hero-slide .img-cover {display: block;}
/* 拼贴小图 .wk_wrap 与右侧文字块 .slide-text-right：视频播放期间由上面规则隐藏，
   视频播完后一并显示；同时把视频期的居中文字 .hero-text 撤下，换回第一张图原来的右侧文字效果。
   仅限桌面端——≤768px 有单独规则把这两块整体隐藏，这里用 min-width 避免覆盖它 */
@media (min-width: 769px) {
  .banner.video-done .hero-slide .wk_wrap {display: block;}
  .banner.video-done .hero-slide .slide-text-right {display: block;}
  /* 复现右侧文字块的原始入场：淡入 + 从右 60px 滑入。
     挂在 .ani-slide 上，轮播每转回第一张都会重播（与 hero-text 同一套机制） */
  .banner.video-done .hero-slide.ani-slide .slide-text-right {
    -webkit-animation: heroRightIn 1s ease-out .5s both;
    animation: heroRightIn 1s ease-out .5s both;
  }
  .banner.video-done .hero-slide .hero-text {display: none;}
}
@-webkit-keyframes heroRightIn {from {opacity: 0;-webkit-transform: translateY(-50%) translateX(60px);}to {opacity: 1;-webkit-transform: translateY(-50%) translateX(0);}}
@keyframes heroRightIn {from {opacity: 0;transform: translateY(-50%) translateX(60px);}to {opacity: 1;transform: translateY(-50%) translateX(0);}}
.banner .hero-text {position: absolute;inset: 0;z-index: 3;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;text-align: center;color: #fff;padding: 0 20px;pointer-events: none;}
/* 半透明压暗层：保证任意视频画面下文字可读 */
.banner .hero-text:before {content: '';position: absolute;inset: 0;background: rgba(0,0,0,0.32);z-index: -1;}
.banner .hero-text h2 {margin: 0;font-size: clamp(30px, 4vw, 58px);font-weight: 700;letter-spacing: 2px;text-shadow: 0 4px 18px rgba(0,0,0,0.45);}
.banner .hero-text h2 .ch {display: inline-block;opacity: 0;}
.banner .ani-slide .hero-text h2 .ch {-webkit-animation: heroCh .7s cubic-bezier(.2,.7,.3,1) both;animation: heroCh .7s cubic-bezier(.2,.7,.3,1) both;-webkit-animation-delay: calc(var(--i) * 70ms);animation-delay: calc(var(--i) * 70ms);}
@-webkit-keyframes heroCh {from {opacity: 0;-webkit-transform: translateY(40px) scale(.9);-webkit-filter: blur(6px);}to {opacity: 1;-webkit-transform: none;-webkit-filter: blur(0);}}
@keyframes heroCh {from {opacity: 0;transform: translateY(40px) scale(.9);filter: blur(6px);}to {opacity: 1;transform: none;filter: blur(0);}}
.banner .hero-text .hero-line {width: 0;height: 3px;margin: 26px auto;background: -webkit-linear-gradient(left, #e62022, #d7a449);background: linear-gradient(90deg, #e62022, #d7a449);border-radius: 2px;}
.banner .ani-slide .hero-text .hero-line {-webkit-animation: heroLine 1s ease-out .9s both;animation: heroLine 1s ease-out .9s both;}
@-webkit-keyframes heroLine {from {width: 0;}to {width: 220px;}}
@keyframes heroLine {from {width: 0;}to {width: 220px;}}
.banner .hero-text p {margin: 0;font-size: clamp(14px, 1.6vw, 22px);letter-spacing: 6px;opacity: 0;text-shadow: 0 2px 10px rgba(0,0,0,0.5);}
.banner .ani-slide .hero-text p {-webkit-animation: heroSub 1.2s ease-out 1.1s both;animation: heroSub 1.2s ease-out 1.1s both;}
@-webkit-keyframes heroSub {from {opacity: 0;letter-spacing: 14px;}to {opacity: 1;letter-spacing: 6px;}}
@keyframes heroSub {from {opacity: 0;letter-spacing: 14px;}to {opacity: 1;letter-spacing: 6px;}}
/* [2026-10-05] 手机端与 PC 一致：首屏视频直接播放（此前手机端隐藏视频、只显示背景图）。
   hero-slide 的背景图在视频播放期间保持隐藏（z-index 高于视频会盖住画面），
   视频播完/加载失败/被拦截时脚本给 .banner 加 video-done → 显示图片，与 PC 行为完全一致；
   文字特效保留并压暗视频背景 */
@media screen and (max-width: 767px) {
  .banner .hero-slide .img-cover {display: none;}
  .banner .hero-text:before {background: rgba(0,0,0,0.45);}
}

/* 内页通用样式 */
/* [banner 轮播样式] */
.banner .wk_wrap {position: absolute;inset: 0;z-index: 2;pointer-events: none;overflow: hidden;}
.banner .wk_wrap .photlist {position: absolute;left: calc(-8% + 90px);top: 26px;width: 1700px;height: 1400px;transform: rotate(-30deg);}
.banner .wk_wrap .photlist .img {position: relative;float: left;margin-right: 30px;margin-bottom: 30px;opacity: 0;box-shadow: 2px 2px 12px rgba(70,70,70,.5);transform: rotate(-30deg);}
.banner .wk_wrap .photlist .img img {display: block;width: 400px;height: 300px;object-fit: cover;border-radius: 16px;}
.banner .wk_wrap.active .photlist .img {animation: pulws linear 2.4s;animation-fill-mode: forwards;}
.banner .wk_wrap .photlist+.imgr {position: absolute;right: 0;top: 20%;z-index: 5;opacity: 0;width: 160px;}
.banner .wk_wrap.active .photlist+.imgr {right: 10%;opacity: 1;transition: all 2s linear 1s;}
@keyframes pulws {
  0% {opacity: 0;}
  20% {opacity: 1;}
  35% {transform: rotate(0);}
  70%, to {transform: none;margin-right: 30px;margin-bottom: 30px;opacity: 1;}
}
/* 产品列表页筛选样式 */
.banner .swiper-pagination-bullet {
  background: #7d7d7d;
  opacity: 1;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
.banner .swiper-pagination-bullet-active {
  background: #e10000;
  width: 35px;
  border-radius: 10px;
}
.banner .swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 15px;
}}


/
/* col4 涓 col1/2/3 鍚屾鎾, 涓嶇敤娓愭樉 */
/* .banner .text {display: none !important;} 2026-08-21 鑰佸ぇ瑕佹眰锛氱2寮犲強浠ュ悗鏄剧ず鍚庡彴鏍囬+鍓爣棰 */
@media (max-width: 768px) {
  .banner .wk_wrap,.banner .slide-text-right {display: none;}
}

/* [2026-10-01] 条框配色改为参考站 k48 同款：白底 + 黑字（原为红色 gundongbg 背景） */
.in-total {color: #000;margin-top: -125px;border-radius:15px 15px 0 0;position: relative;z-index: 3;text-align: center;background: #fff}
/* [2026-10-01] 三条数据整体居中，左右各留 220px 给切换箭头 / 鼠标提示（参考站 k48 的 IndexList 居中做法） */
/* [2026-10-01] 首页条框的宽度/高度/间距由文件末尾「.in-total-box .in-total」段控制（--bar-h 和 gap），改下面这两行对首页无效 */
.in-total {padding: 0 220px;}
.in-total li {float: left;width: 25%;padding: 25px 0;}
.in-total li span {display: block;line-height: 1;font-size: 18px;}
.in-total li strong {font-size: 35px;position: relative;display: inline-block;font-weight: bold;margin-right: 5px;}
.in-total li strong:before {position: absolute;right: -16px;top: 0;font-size: 24px;}
.in-total li p {margin: 10px 0 0;font-size: 16px;}

.section {padding: 60px 60px;overflow: hidden;}
/* ===== 首页「成功案例」版块专属内边距（2026-10-02）=====
   该版块模板为 template/dafeult/index.html 中 id="caseSec" 的 .section。
   原来内边距为 0（上下空白全靠邻居版块撑着），要调这个版块的留白改这里：
   padding: 上 右 下 左 —— 例如只加大底部留白就改成 80px 0 120px */
#caseSec {padding: 80px 0;}
@media screen and (max-width: 767px) {
    /* 移动端跟随 .section 原有的 30px 内边距（id 选择器会覆盖媒体查询里的类规则，需单独声明） */
    #caseSec {padding: 30px 0;}
}
.section-title {text-align: center;margin-bottom: 40px;font-size: 33px;}
.section-title span {color: #e62022;text-transform: uppercase;}
.section-title p {font-size: 18px;margin: 5px 0 0;color: #666;}
.section-title-1 {background: url(../images/title_bg.png) repeat-x center -5px;}
.section-title-1 strong {background-color: #fff;padding: 0 30px;display: inline-block;}
.section-title-2:after {content: '';display: block;margin: 15px auto 0;width: 60px;height: 5px;background-color: #e62022;}
.section-sub {padding: 40px 0;}

.in-server {margin: -20px 0 0 -20px;}
.in-server li {float: left;width: 20%;}
.in-server li a {display: block;border: 1px solid #f4f4f4;margin: 20px 0 0 20px;text-align: center;-webkit-transition: all 0.5s;transition: all 0.5s;}
.in-server li .img-center {height: 105px;line-height: 105px;padding-top: 20px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.in-server li h4 {margin: 30px 0 10px;font-size: 22px;font-weight: normal;}
.in-server li p {margin: 0 20px 20px;color: #868686;text-align: justify;}
.in-server li span {display: block;line-height: 54px;background-color: #f9f9f9;color: #868686;border-top: 1px solid #f4f4f4;font-size: 16px;}
.in-server li a:hover {box-shadow: 0 0 26px #cacaca;-webkit-transform: translateY(10px);transform: translateY(10px);border-color: #d6d6d6;}
.in-server li a:hover span {background-color: #e62022;color: #fff;}
.in-server li a:hover .img-center {-webkit-transform: rotateY(360deg);transform: rotateY(360deg);}

.in-seo li {float: left;width: 33.333333%;}
.in-seo li a {display: block;color: #fff;background: url(../images/product-bg-red.jpg) no-repeat center / cover;text-align: center;padding: 30px;}
.in-seo li .img-center {height: 74px;line-height: 74px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.in-seo li p {margin: 15px 0 0;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.in-seo li:nth-child(even) a {background-image: url(../images/product-bg-gray.jpg);color: #333;}
.in-seo li a:hover .img-center {-webkit-transform: scale(0.9);transform: scale(0.9);}

.in-menu {margin: -20px 0 0 -20px;}
.in-menu {text-align: center;font-size: 0;margin-bottom: 30px;}
.in-menu li {display: inline-block;vertical-align: middle;}
.in-menu li a {display: block;border-radius:25px;font-size: 18px;line-height: 50px;padding: 0 20px;border: 1px solid #dfdfdf;margin: 20px 0 0 20px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.in-menu li a:hover,.in-menu li.active a {color: #fff;border-radius:25px; background-color: #e62022;border-color: #e62022;}

.list-1 {margin: -20px 20px 0 0;}
.list-1 li {float: left;width: 25%;}
.list-1 li a {display: block;margin: 20px 0 0 20px;position: relative;}
.list-1 li .img-cover {padding-top: 80%;}
.list-1 li .text {position: absolute;left: 0;top: 0;width: 100%;height: 100%;color: #fff;-webkit-transition: all 0.5s;transition: all 0.5s;display: table;background-color: rgba(0,0,0,0.7);-webkit-transform: scale(0);transform: scale(0);overflow: hidden;}
.list-1 li .inner {display: table-cell;vertical-align: middle;text-align: center;padding:50px 20px; box-sizing: border-box;}
.list-1 li .text h4 {margin: 0;font-size: 28px;font-weight: normal;}
.list-1 li .text p {margin: 10px 0 0;font-size: 18px; line-height: 28px;}
.list-1 li a:hover .text {-webkit-transform: scale(1);transform: scale(1);}

.list-2 {margin: -30px 0 0 -30px;overflow: hidden;}
.list-2 li {float: left;width: 50%;}
.list-2 li a {display: block;margin: 30px 0 0 30px;overflow: hidden;border: 1px solid #e4e4e4;padding: 12px;}
.list-2 li .date {float: left;width: 65px;background-color: #969393;color: #fff;text-align: center;padding: 7px 0;}
.list-2 li .date strong {display: block;font-weight: bold;font-size: 30px;line-height: 1;margin-bottom: 1px;}
.list-2 li .text {margin-left: 77px;}
.list-2 li .text h4 {margin: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.list-2 li .text p {margin: 5px 0 0;color: #888;height: 40px;overflow: hidden;}
.list-2 li a:hover {border-color: #e62022;}
.list-2 li a:hover .date {background-color: #e62022;}

.index-news-con .img-center {float: left;width: 320px;}
.index-news-con .list-2 {margin-left: 320px;}

/* ===== [2026-10-02] 新闻资讯版块改造（布局参照参考站 k688，配色换成本站红色主题） =====
   .news-top 一行三块：左 .news-feat 最新图文(36%) + 中 .news-mid 分类页签列表(自适应) + 右 .news-hot 热门文章(22%)
   标题用 .s_tt（与成功案例一致）；页签切换沿用 tabsSwiper，.index-news-menu/.index-news-con 类名不要改 */
#newsSec {padding: 0 0;background: #F5F5F5;overflow: hidden;}
/* [2026-10-03] 滚动入场动画：标题上移、左栏左滑、右栏右滑、中间栏延迟上浮
   用站点自带的 wow + animate.css 实现（class 挂在元素上，见 index.html 对应注释） */
/* 三栏等高：行高由中间列表（8 行）决定，左/右两栏拉伸填满，底部自然对齐 */
#newsSec .news-top {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;gap: 40px;}
/* 左：最新图文一篇（样式参照星邑空间新闻列表，命名沿用本站）
   图区比例 64.44% + 左上大圆角 60px；日期胶囊浮在图左上；白色面板右下大圆角 60px */
#newsSec .news-feat {-webkit-box-flex: 0;-ms-flex: 0 0 30%;flex: 0 0 30%;min-width: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
#newsSec .news-feat .feat-item {-webkit-box-flex: 1;-ms-flex: 1 1 0%;flex: 1 1 0%;min-height: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;overflow: hidden;}
#newsSec .news-feat .imWrap {display: block;position: relative;padding-top: 64.444%;overflow: hidden;border-radius: 60px 10px 0 0;}
#newsSec .news-feat .imWrap img {position: absolute;left: 0;top: 0;width: 100%;height: 100%;-o-object-fit: cover;object-fit: cover;-webkit-transition: -webkit-transform .5s;transition: transform .5s;}
#newsSec .news-feat .feat-item:hover .imWrap img {-webkit-transform: scale(1.06);transform: scale(1.06);}
/* 日期胶囊：白色半透明圆角条，浮在图片左上角 */
#newsSec .news-feat .date {position: absolute;top: 30px;left: 30px;z-index: 2;width: 130px;height: 36px;line-height: 36px;text-align: center;border-radius: 18px;background: rgba(255,255,255,.9);color: #2f343d;font-size: 14px;font-family: inherit;}
/* 日期胶囊前的日历图标：纯 CSS 绘制（圆角框 + 顶部表头色带），零外部依赖；原内联 SVG 已移除 */
#newsSec .news-feat .date::before {content: "";display: inline-block;vertical-align: middle;width: 14px;height: 13px;margin: 0 6px 2px 0;-webkit-box-sizing: border-box;box-sizing: border-box;border: 1.5px solid #9ba7b9;border-radius: 2px;background-image: linear-gradient(#9ba7b9,#9ba7b9);background-repeat: no-repeat;background-size: 100% 3px;background-position: 0 0;}
/* 白色内容面板：右下大圆角，标题两行 + 摘要两行 + 底部下划线按钮 */
#newsSec .news-feat .cont {-webkit-box-flex: 1;-ms-flex: 1 1 auto;flex: 1 1 auto;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;background: #fff;padding: 46px;border-radius: 0 0 60px 10px;}
#newsSec .news-feat .tit {margin: 0;font-size: 22px;color: #333;line-height: 30px;height: 60px;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;-webkit-transition: color .3s;transition: color .3s;}
#newsSec .news-feat .feat-item:hover .tit {color: #e62022;}
/* 摘要：由 2 行改为 4 行（配合模板 lencn=100），不足 4 行时不留白 */
#newsSec .news-feat .con {font-size: 15px;color: #999;line-height: 26px;overflow: hidden;margin: 2px 0 40px;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;}
/* 查看详情按钮：形态参照 zy2008.cn 列表的「查看详细」，class 沿用本站 .btn（未照搬参考站命名）
   默认：半透明深灰文字 + 右侧纯 CSS 箭头；悬停：底色胶囊展开、文字变白、箭头收缩淡出 */
#newsSec .news-feat .btn {display: inline-block;-webkit-align-self: flex-start;align-self: flex-start;margin-top: auto;font-size: 15px;line-height: 35px;color: rgba(44,46,48,.5);border-radius: 17.5px;-webkit-transition: .5s;transition: .5s;}
#newsSec .news-feat .btn::after {content: "";display: inline-block;width: 6px;height: 6px;border-top: 1.5px solid currentColor;border-right: 1.5px solid currentColor;-webkit-transform: rotate(45deg);transform: rotate(45deg);margin: 0 0 0 6px;vertical-align: 1px;-webkit-transition: .5s;transition: .5s;}
#newsSec .news-feat a:hover {text-decoration: none;}
#newsSec .news-feat .feat-item:hover .btn {background: #e62022;padding: 0 18px;color: #fff;}
#newsSec .news-feat .feat-item:hover .btn::after {width: 0;opacity: 0;visibility: hidden;margin-left: 0;}
/* 中：分类页签 + 新闻列表 */
#newsSec .news-mid {-webkit-box-flex: 1;-ms-flex: 1 1 0%;flex: 1 1 0%;min-width: 0;}
#newsSec .news-tab-menu {display: -webkit-box;display: -ms-flexbox;display: flex;margin: 0;padding: 0;list-style: none;font-size: 0;border-radius: 15px;}
#newsSec .news-tab-menu li {-webkit-box-flex: 1;-ms-flex: 1 1 0%;flex: 1 1 0%;position: relative;text-align: center;background-color: #22252b;cursor: pointer;-webkit-transition: background-color .3s;transition: background-color .3s;}
#newsSec .news-tab-menu li:first-child {border-radius: 25px 0 0 25px;}
#newsSec .news-tab-menu li:last-child {border-radius: 0 25px 25px 0;}
#newsSec .news-tab-menu li a {display: block;color: #fff;font-size: 15px;line-height: 50px;}
#newsSec .news-tab-menu li.active,#newsSec .news-tab-menu li:hover {background-color: #e62022;}
#newsSec .news-tab-menu li.active:after {content: '';position: absolute;left: 50%;bottom: -13px;margin-left: -8px;border-top: 14px solid #e62022;border-left: 8px solid transparent;border-right: 8px solid transparent;z-index: 5;}
#newsSec .news-list {padding-top: 15px;list-style: none;margin: 0;}
/* 行距按左栏（1列2条图文 + 20px 间距）高度反推：8 行刚好填满左栏高度，底部与左栏对齐 */
#newsSec .news-list li {border-bottom: 1px solid #ddd;padding: 20px 0;overflow: hidden;}
#newsSec .news-list li .date {float: left;width: 96px;text-align: center;font-family: Arial;}
#newsSec .news-list li .date p {margin: 0;color: #999;font-size: 13px;line-height: 33px;}
#newsSec .news-list li .date strong {display: none;position: relative;font-size: 28px;color: #333;line-height: 1.4;margin-top: 2px;font-weight: bold;}
#newsSec .news-list li .date strong:before {content: '';display: block;width: 16px;height: 1px;background-color: #bbb;margin: 0 auto;}
#newsSec .news-list li .wrap {margin-left: 96px;}
#newsSec .news-list li h4 {margin: 0;font-size: 15px;font-weight: 400;color: #333;line-height: 33px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;-webkit-transition: color .3s;transition: color .3s;}
#newsSec .news-list li .cont {display: none;font-size: 14px;color: #999;height: 3.5em;line-height: 1.75;overflow: hidden;margin-top: 8px;}
#newsSec .news-list li a:hover {text-decoration: none;}
#newsSec .news-list li:hover h4 {color: #e62022;}
#newsSec .news-list li:hover .cont, #newsSec .news-list li:hover .date strong {display: block;}
#newsSec .news-list li:hover .date p {display: none;}
/* 右：常见问题（灰色栏底 + 白色新闻卡片，参照 k460）；用弹性布局填满行高，底部与左栏对齐 */
#newsSec .news-hot {-webkit-box-flex: 0;-ms-flex: 0 0 28%;flex: 0 0 28%;min-width: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;background: transparent;border: none;padding: 0 0;}
#newsSec .news-hot .tit {margin: 0;padding: 0 0 14px 4px;font-size: 19px;color: #333;font-weight: bold;}
#newsSec .news-hot .tit small {font-size: 14px;font-family: Arial;color: #999;padding-left: 5px;font-weight: 400;}
#newsSec .news-hot ul {margin: 0;padding: 0;list-style: none;}
#newsSec .news-hot li a {display: block;font-size: 14px;color: #666;line-height: 2.4;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;-webkit-transition: color .3s;transition: color .3s;}
#newsSec .news-hot li a:hover {color: #e62022;}
/* 右：公司动态时间轴（参照 k460 新闻资讯：五色日期圆 + 灰色栏底 + 白色卡片）
   竖线逐条绘制：上端离序号圆 10px，下端离下一个圆 10px，首尾自然留白
   序号圆默认灰色，鼠标悬停该条新闻时才点亮对应的主题色 */
#newsSec .news-tl {position: relative;padding: 4px 0 0;-webkit-box-flex: 1;-ms-flex: 1 1 auto;flex: 1 1 auto;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
#newsSec .nt-item {position: relative;-webkit-box-flex: 1;-ms-flex: 1 1 0%;flex: 1 1 0%;min-height: 0;padding: 0 0 12px 76px;margin: 0;}
#newsSec .nt-item:before {content: '';position: absolute;left: 22px;top: 56px;bottom: 10px;width: 2px;background: #dcdcdc;}
#newsSec .nt-item:last-child {padding-bottom: 0;}
#newsSec .nt-item:last-child:before {display: none;}
#newsSec .nt-date {position: absolute;left: 0;top: 9px;width: 46px;text-align: center;z-index: 1;}
/* 序号圆：默认灰色 46px，悬停时按下方的 5 色规则点亮 */
#newsSec .nt-date i {display: block;width: 46px;height: 46px;line-height: 38px;border-radius: 50%;border: 4px solid #eaeaea;box-sizing: border-box;background: #d9d9d9;color: #fff;font-size: 18px;font-style: normal;font-family: Arial;font-weight: bold;-webkit-transition: background-color .3s;transition: background-color .3s;}
#newsSec .nt-item:nth-child(5n+1):hover .nt-date i {background: #00a651;}
#newsSec .nt-item:nth-child(5n+2):hover .nt-date i {background: #ee4749;}
#newsSec .nt-item:nth-child(5n+3):hover .nt-date i {background: #21a9e1;}
#newsSec .nt-item:nth-child(5n+4):hover .nt-date i {background: #fad839;}
#newsSec .nt-item:nth-child(5n+5):hover .nt-date i {background: #2c2c4b;}
#newsSec .nt-card {background: #fff;border-radius: 5px;padding: 16px 20px;position: relative;-webkit-transition: box-shadow .3s;transition: box-shadow .3s;}
#newsSec .nt-card:before {content: '';position: absolute;right: 100%;top: 22px;border-right: 10px solid #fff;border-top: 10px solid transparent;border-bottom: 10px solid transparent;}
#newsSec .nt-card:hover {box-shadow: 0 6px 18px rgba(0,0,0,.10);}
#newsSec .nt-card h4 {margin: 0;font-size: 17px;font-weight: normal;line-height: 1.5;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
#newsSec .nt-card h4 a {color: #333;-webkit-transition: color .3s;transition: color .3s;}
#newsSec .nt-card h4 a:hover {color: #e62022;text-decoration: none;}
#newsSec .nt-text {margin-top: 8px;font-size: 13px;color: #757575;line-height: 1.75;max-height: 3.5em;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
#newsSec .nt-empty {padding: 40px 6px;color: #999;font-size: 14px;text-align: center;}
/* 响应式：平板收起热门文章，手机端单列 */
@media (max-width: 991px) {
  #newsSec {padding: 40px 0;}
  #newsSec .news-top {display: block;}
  #newsSec .news-feat {width: 100%;}
  #newsSec .news-hot {display: none;}
  #newsSec .news-mid {margin-top: 30px;}
}
@media (max-width: 640px) {
  #newsSec .news-tab-menu li a {font-size: 13px;line-height: 42px;}
  #newsSec .news-feat .imWrap {border-radius: 24px 8px 0 0;padding-top: 56%;}
  #newsSec .news-feat .cont {padding: 20px;border-radius: 0 0 24px 8px;}
  #newsSec .news-feat .date {top: 12px;left: 12px;width: 112px;height: 32px;line-height: 32px;font-size: 12px;}
  #newsSec .news-feat .tit {font-size: 17px;line-height: 24px;height: 48px;}
  #newsSec .news-feat .con {display: none;}
  #newsSec .news-feat .btn {margin-top: 10px;}
  #newsSec .news-list li .date {width: 76px;}
  #newsSec .news-list li .wrap {margin-left: 76px;}
}

@-webkit-keyframes scale{
    0%{
        -webkit-transform: scale(0.9);
                transform: scale(0.9);
    }
    50%{
        -webkit-transform: scale(1);
                transform: scale(1);
    }
    100%{
        -webkit-transform: scale(0.9);
                transform: scale(0.9);
    }
}

@keyframes scale{
    0%{
        -webkit-transform: scale(0.9);
                transform: scale(0.9);
    }
    50%{
        -webkit-transform: scale(1);
                transform: scale(1);
    }
    100%{
        -webkit-transform: scale(0.9);
                transform: scale(0.9);
    }
}

.in-desc {overflow: hidden;background: url(../images/indexlogobg.jpg) no-repeat center / cover;color: #fff;}
.in-desc .logo {float: left;width: 500px;text-align: left;}
.in-desc .logo img {-webkit-animation: 2s scale linear infinite;animation: 2s scale linear infinite;}
.in-desc .text {margin-left: 500px;}
.in-desc .text h4 {margin: 50px;font-size: 30px;}
.in-desc .text h5 {font-size: 18px;margin: 20px 0 10px;}
.in-desc .text p {margin: 0;font-size: 16px;line-height: 1.8;text-align: justify;}
.in-desc .text a {display: inline-block;background: url(../images/mbtxindex.png) no-repeat 0 0;width: 236px;line-height: 42px;padding-right: 40px;text-align: center;font-size: 18px;margin: 30px 30px 0 0;}

.in-partners {text-align: center;font-size: 0;margin: -15px 0 0 -15px;}
.in-partners li {display: inline-block;vertical-align: middle;}
.in-partners li a {display: block;margin: 15px 0 0 15px;}
.in-partners li .img-center {height: 65px;line-height: 65px;}

.in-process {}
.in-process li {float: left;width: 16.666666%;}
.in-process li a {display: block;text-align: center;}
.in-process li .img-center {height: 60px;line-height: 60px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.in-process li h4 {margin: 15px 0 0;font-size: 18px;font-weight: normal;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.in-process li p {margin: 10px 0 0;font-size: 12px;font-weight: normal;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;color: #888;}
.in-process li a:hover .img-center {-webkit-transform: rotateY(360deg);transform: rotateY(360deg);}

.in-dynamic {margin: -30px 0 0 -30px;}
.in-dynamic li {float: left;width: 33.333333%;}
.in-dynamic li a {display: block;background-color: #fff;-webkit-transition: all 0.5s;transition: all 0.5s;padding: 30px;margin: 30px 0 0 30px;}
.in-dynamic li h4 {margin: 0;font-weight: normal;font-size: 18px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.in-dynamic li p {margin: 15px 0 0;color: #888;height: 40px;overflow: hidden;}
.in-dynamic li a:hover {box-shadow: 0px 5px 20px rgba(0,0,0,0.2);}

.more-big {margin: 40px auto 0;display: block;text-align: center;border: 1px solid #dbdbdb;line-height: 48px;width: 150px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.more-big:hover {color: #fff;background-color: #e62022;border-color: #e62022;}

.in-partone {margin-left: -30px;}
.in-partone li {float: left;width: 50%;}
.in-partone li .wrap {margin-left: 30px;text-align: center;background: url(../images/part_05.png) no-repeat center / cover;padding: 70px 0;color: #fff;}
.in-partone li h4 {margin: 0;font-weight: normal;font-size: 32px;}
.in-partone li a {display: block;margin: 30px auto 0;border: 1px #fff solid;border-radius: 6px;font-size: 18px;line-height: 35px;width: 140px;color: #fff;-webkit-transition: all 0.5s;transition: all 0.5s;}
.in-partone li a:hover {background-color: #fff;color: #333;}
.in-partone li:last-child .wrap {background-image: url(../images/part_07.png);}

.in-ready {text-align: center;}
.in-ready h4 {margin: 0;font-weight: normal;font-size: 24px;}
.in-ready .btn {margin: 15px auto;background: url(../images/djwz.jpg) center repeat-x;width: 900px;}
.in-ready .btn a {display: inline-block;vertical-align: middle;border-left: 25px solid #fff;border-right: 25px solid #fff;line-height: 55px;background-color: #e62022;color: #fff;width: 350px;font-size: 22px;}
.in-ready p {margin: 0;font-size: 16px;letter-spacing: 5px;text-indent: 5px;}

/* ===== 友情链接 [2026-10-03] 参照 k755：左深色 LINKS 块 + 右主题色链接条；配色换本站红；箭头纯 CSS 画；链接项垂直居中；
   版块背景 #F5F5F5（同资讯中心）；链接框 15px 圆角；translateY(50%) 下移一半压进 foot ===== */
.flink-sec {overflow: visible;background: #F5F5F5;padding-top: 0;}
.yunu-link {position: relative;z-index: 2;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: stretch;-ms-align-items: stretch;-ms-flex-align: stretch;align-items: stretch;border-radius: 15px;overflow: hidden;-webkit-transform: translateY(calc(50% + 60px));-ms-transform: translateY(calc(50% + 60px));transform: translateY(calc(50% + 60px));}
.yunu-link h4 {-webkit-box-flex: 0;-ms-flex: 0 0 9%;flex: 0 0 9%;margin: 0;background-color: #333;color: #fff;font-size: 22px;font-weight: bold;letter-spacing: 1px;line-height: 1.2;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;-ms-align-items: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
.yunu-link ul {-webkit-box-flex: 1;-ms-flex: 1 1 0%;flex: 1 1 0%;min-height: 60px;margin: 0;padding: 8px 22px;background-color: #fff;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-align: center;-ms-flex-align: center;-ms-align-items: center;align-items: center;-ms-flex-line-pack: center;align-content: center;list-style: none;}
.yunu-link li {margin: 5px 40px 5px 0;}
.yunu-link li a {display: inline-block;position: relative;padding-left: 15px;font-size: 15px;line-height: 25px;color: #666;-webkit-transition: opacity .3s;transition: opacity .3s;}
.yunu-link li a::before {content: "";position: absolute;left: 0;top: 50%;margin-top: -4px;border-left: 6px solid #fff;border-top: 4px solid transparent;border-bottom: 4px solid transparent;}
.yunu-link li a:hover {opacity: .7;}

/* ===== 底部 [2026-10-03] 参照 k693 布局重做：栏目列+联系方式+二维码 / 主题色版权条；
   [2026-10-03 晚] 背景换 footer_bg.jpg（深色线框图），文字配色同步调浅 ===== */
.footer {background: #1e1d1d url(../images/footer_bg.jpg) no-repeat center / cover;border-top: 0 solid #e62022;}
.footer a {-webkit-transition: all 0.5s;transition: all 0.5s;}
.f-main {padding: 90px 0 40px;}
.f-nav {float: left;width: 64%;}
.f-nav ul {margin: 0;padding: 0;list-style: none;}
/* [2026-10-04] 栏目列由 4 列增至 7 列（网站建设/模板中心/AI营销/小程序/成功案例/资讯中心/了解我们） */
.f-nav ul li {float: left;width: 14.2857%;padding: 0 6px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.f-nav ul li p {height: 30px;line-height: 30px;color: #fff;font-size: 18px;font-weight: bold;margin: 0 0 30px;padding-left: 14px;position: relative;}
.f-nav ul li p:before,.f-contact dl dd p:before {content: '';position: absolute;left: 0;top: 8px;width: 4px;height: 14px;background: #e62022;}
.f-nav ul li a {display: block;line-height: 30px;color: #9aa3ad;font-size: 14px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;margin: 0 auto 5px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.f-nav ul li a:hover {color: #fff;}
.f-contact {float: left;width: 19%;padding-left: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.f-contact dl {margin: 0;}
.f-contact dl dd {margin: 0 auto 20px;}
.f-contact dl dd:last-child {margin-bottom: 0;}
.f-contact dl dd p {height: 30px;line-height: 30px;color: #fff;font-size: 18px;font-weight: bold;margin: 0 auto 5px;padding-left: 14px;position: relative;}
.f-contact .tel {line-height: 50px;color: #e62022;font-family: Impact,'Arial Black',sans-serif;font-size: 38px;}
.f-contact dl dd span {display: block;color: #9aa3ad;font-size: 15px;line-height: 25px;max-height: 50px;overflow: hidden;}
/* [2026-10-04] 二维码整体下移 50px（与左侧栏目列错位对齐） */
.f-ewm {float: right;width: 17%;margin-top: 50px;}
.f-ewm p {line-height: 30px;color: #fff;font-size: 16px;text-align: center;margin: 15px auto 0;}
.f-ewm .ewm-img {position: relative;width: 150px;height: 150px;margin: 0 auto;padding: 9px;border: 1px solid #e5e5e5;border-radius: 6px;background: #fff;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;overflow: hidden;}
.f-ewm .ewm-img img {display: block;width: 100%;height: 100%;border-radius: 4px;object-fit: cover;}
/* 二维码扫描光带 [2026-10-03 晚] 参照 k770：金色渐变光带图（ewm_light.png，原站 qrcde_light.png）从下往上扫过、往复循环 */
.f-ewm .ewm-img::after {content: '';display: block;position: absolute;left: 0;top: 0;width: 100%;height: 36px;background: url(../images/ewm_light.png) no-repeat;-webkit-background-size: 100% 100%;background-size: 100% 100%;-webkit-transform: translateY(400%);-ms-transform: translateY(400%);transform: translateY(400%);-webkit-animation: ewmScan 2s ease-out alternate infinite;animation: ewmScan 2s ease-out alternate infinite;}
/* [2026-10-04] 自适应：平板底部 7 列收为 4 列两行，联系方式/二维码并排其下 */
@media (max-width:1280px){
  .f-nav {width: 100%;}
  .f-nav ul li {width: 25%;}
  .f-nav ul li a {white-space: normal;}
  .f-contact {width: 58%;margin-top: 25px;}
  .f-ewm {width: 42%;margin-top: 25px;}
}
@media (max-width:991px){
  .f-contact {width: 100%;padding-left: 0;}
  .f-ewm {width: 100%;}
  .f-ewm .ewm-img {margin: 0 auto;}
}
@-webkit-keyframes ewmScan {100% {-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes ewmScan {100% {transform: translateY(0);}}
.footer-copy {background-color: #000;padding: 10px 0;}
.footer-copy p {line-height: 40px;color: #999;font-size: 15px;margin: 0;}
.footer-copy a {color: #999;}
.footer-copy a:hover {color: #fff;text-decoration: underline;}

.footer-fix {box-shadow: 0 0 10px rgba(0,0,0,0.2);position: fixed;bottom: 0;left: 0;width: 100%;background-color: #fff;z-index: 10;display: none;}
.footer-fix li {float: left;width: 25%;}
/* [2026-10-05] 上下内边距 7px→10px，浮动导航条整体加高（约 50px→56px） */
.footer-fix li a {display: block;text-align: center;padding: 10px 0;font-size: 12px;line-height: 1;}
.footer-fix li i {display: block;height: 20px;background: no-repeat center;background-size: contain;margin-bottom: 4px;}
.footer-fix li i.i1 {background-image: url(../images/f_01.png);}
.footer-fix li i.i2 {background-image: url(../images/f_02.png);}
.footer-fix li i.i3 {background-image: url(../images/f_03.png);}
.footer-fix li i.i4 {background-image: url(../images/f_04.png);}

/* [2026-10-05] 手机端「微信咨询」点击弹出的个人微信二维码层（.wx-pop，foot.html）：
     遮罩 + 居中白盒（二维码 200px + 长按识别提示），点遮罩/×关闭；z-index 999 高于悬浮条 z10 */
.wx-pop {display: none;position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 999;}
.wx-pop.show {display: block;}
.wx-pop-mask {position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.6);}
.wx-pop-box {position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);width: 244px;padding: 30px 22px 24px;background: #fff;border-radius: 10px;text-align: center;box-sizing: border-box;}
.wx-pop-box .wx-pop-close {position: absolute;right: 12px;top: 4px;font-size: 26px;color: #999;line-height: 1;cursor: pointer;}
.wx-pop-box .wx-pop-ewm {width: 200px;height: 200px;margin: 0 auto;}
.wx-pop-box .wx-pop-ewm img {display: block;width: 100%;height: 100%;object-fit: contain;}
.wx-pop-box .wx-pop-tip {margin-top: 14px;font-size: 14px;color: #333;line-height: 22px;}

.banner-sub {height: 500px;background: no-repeat center / cover;color: #fff;text-align: center;font-size: 44px;text-shadow: 0 2px 2px #333333;}
.banner-sub .container {display: table;height: 100%;}
.banner-sub .inner {display: table-cell;vertical-align: middle;}

/* [2026-10-07] 模板中心列表页 banner 动效化（mobanlist.html）：原静态栏目图移除，
   改为纯 CSS 动效横幅——渐变流动底 + 网格平移 + 双光晕呼吸 + 扫描光带 + 上升粒子 + 文字依次入场。
   命名前缀 mba-，只作用于 .banner-mbanim，不影响其他页面的 .banner-sub */
.banner-mbanim {position: relative;overflow: hidden;text-shadow: none;background: #0a0d1a;}
.banner-mbanim .container {position: relative;z-index: 5;}
/* [2026-10-07 三次] 文字块改表格单元格垂直居中 + 水平居中，并整体下移避开透明导航（logo 高度约 75px） */
.banner-mbanim .banner-sub-txt {display: table-cell;vertical-align: middle;text-align: center;padding-top: 44px;}
/* 底层渐变缓慢流动 */
.banner-mbanim .mba-bg {position: absolute;left: -20%;top: -20%;width: 140%;height: 140%;z-index: 1;background: linear-gradient(120deg,#0a0d1a 0%,#131a33 30%,#251031 55%,#3a0f1c 80%,#0a0d1a 100%);background-size: 300% 300%;-webkit-animation: mbaFlow 16s ease-in-out infinite;animation: mbaFlow 16s ease-in-out infinite;}
/* 网格缓慢平移 */
.banner-mbanim .mba-grid {position: absolute;left: 0;top: -46px;width: 100%;height: calc(100% + 92px);z-index: 2;background-image: linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size: 46px 46px;-webkit-animation: mbaGrid 14s linear infinite;animation: mbaGrid 14s linear infinite;}
/* 双光晕呼吸漂移（红 + 蓝） */
.banner-mbanim .mba-glow {position: absolute;width: 560px;height: 560px;border-radius: 50%;-webkit-filter: blur(70px);filter: blur(70px);opacity: .5;z-index: 2;}
.banner-mbanim .mba-glow1 {left: -140px;top: -180px;background: radial-gradient(circle,rgba(230,32,34,.55),transparent 65%);-webkit-animation: mbaGlow1 9s ease-in-out infinite;animation: mbaGlow1 9s ease-in-out infinite;}
.banner-mbanim .mba-glow2 {right: -160px;bottom: -220px;background: radial-gradient(circle,rgba(64,120,255,.45),transparent 65%);-webkit-animation: mbaGlow2 11s ease-in-out infinite;animation: mbaGlow2 11s ease-in-out infinite;}
/* 扫描光带已去掉（2026-10-07 三次，用户要求） */
/* 上升粒子（10 颗错峰） */
.banner-mbanim .mba-dots {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 3;pointer-events: none;}
.banner-mbanim .mba-dots i {position: absolute;bottom: -14px;display: block;width: 5px;height: 5px;border-radius: 50%;background: rgba(255,255,255,.65);opacity: 0;-webkit-animation: mbaRise 9s linear infinite;animation: mbaRise 9s linear infinite;}
.banner-mbanim .mba-dots i:nth-child(1) {left: 6%;background: rgba(230,32,34,.85);-webkit-animation-duration: 8s;animation-duration: 8s;}
.banner-mbanim .mba-dots i:nth-child(2) {left: 16%;width: 4px;height: 4px;-webkit-animation-delay: 1.2s;animation-delay: 1.2s;-webkit-animation-duration: 10s;animation-duration: 10s;}
.banner-mbanim .mba-dots i:nth-child(3) {left: 26%;-webkit-animation-delay: 2.6s;animation-delay: 2.6s;}
.banner-mbanim .mba-dots i:nth-child(4) {left: 35%;width: 7px;height: 7px;background: rgba(230,32,34,.7);-webkit-animation-delay: .8s;animation-delay: .8s;-webkit-animation-duration: 11s;animation-duration: 11s;}
.banner-mbanim .mba-dots i:nth-child(5) {left: 47%;width: 3px;height: 3px;-webkit-animation-delay: 3.4s;animation-delay: 3.4s;-webkit-animation-duration: 8.5s;animation-duration: 8.5s;}
.banner-mbanim .mba-dots i:nth-child(6) {left: 58%;background: rgba(255,215,0,.75);-webkit-animation-delay: 2s;animation-delay: 2s;-webkit-animation-duration: 9.5s;animation-duration: 9.5s;}
.banner-mbanim .mba-dots i:nth-child(7) {left: 68%;width: 6px;height: 6px;-webkit-animation-delay: 4.2s;animation-delay: 4.2s;}
.banner-mbanim .mba-dots i:nth-child(8) {left: 78%;width: 4px;height: 4px;background: rgba(230,32,34,.8);-webkit-animation-delay: 1.8s;animation-delay: 1.8s;-webkit-animation-duration: 10.5s;animation-duration: 10.5s;}
.banner-mbanim .mba-dots i:nth-child(9) {left: 88%;-webkit-animation-delay: 3s;animation-delay: 3s;-webkit-animation-duration: 8.8s;animation-duration: 8.8s;}
.banner-mbanim .mba-dots i:nth-child(10) {left: 95%;width: 3px;height: 3px;background: rgba(255,215,0,.7);-webkit-animation-delay: 5s;animation-delay: 5s;}
/* 文字内容：标签 → 标题 → 渐变线条 → 副标题 依次入场 */
.banner-mbanim .banner-sub-txt h2 {margin: 22px 0 0;font-size: 50px;line-height: 1.25;font-weight: 700;color: #fff;letter-spacing: 4px;text-shadow: 0 4px 18px rgba(0,0,0,.5);opacity: 0;-webkit-animation: mbaFadeUp .9s cubic-bezier(.2,.7,.3,1) .35s forwards;animation: mbaFadeUp .9s cubic-bezier(.2,.7,.3,1) .35s forwards;}
.banner-mbanim .mba-line {display: block;width: 0;height: 3px;margin: 20px auto 0;border-radius: 2px;background: linear-gradient(90deg,#e62022,#ff7a45);-webkit-animation: mbaLine .9s cubic-bezier(.2,.7,.3,1) .75s forwards;animation: mbaLine .9s cubic-bezier(.2,.7,.3,1) .75s forwards;}
.banner-mbanim .banner-sub-txt p {margin: 18px 0 0;font-size: 18px;color: rgba(255,255,255,.78);letter-spacing: 2px;opacity: 0;-webkit-animation: mbaFadeUp .9s ease-out .55s forwards;animation: mbaFadeUp .9s ease-out .55s forwards;}
@-webkit-keyframes mbaFlow {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@keyframes mbaFlow {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@-webkit-keyframes mbaGrid {from {-webkit-transform: translate(0,0);transform: translate(0,0);}to {-webkit-transform: translate(46px,46px);transform: translate(46px,46px);}}
@keyframes mbaGrid {from {-webkit-transform: translate(0,0);transform: translate(0,0);}to {-webkit-transform: translate(46px,46px);transform: translate(46px,46px);}}
@-webkit-keyframes mbaGlow1 {0%,100% {-webkit-transform: translate(0,0) scale(1);transform: translate(0,0) scale(1);}50% {-webkit-transform: translate(70px,40px) scale(1.15);transform: translate(70px,40px) scale(1.15);}}
@keyframes mbaGlow1 {0%,100% {-webkit-transform: translate(0,0) scale(1);transform: translate(0,0) scale(1);}50% {-webkit-transform: translate(70px,40px) scale(1.15);transform: translate(70px,40px) scale(1.15);}}
@-webkit-keyframes mbaGlow2 {0%,100% {-webkit-transform: translate(0,0) scale(1);transform: translate(0,0) scale(1);}50% {-webkit-transform: translate(-80px,-50px) scale(1.2);transform: translate(-80px,-50px) scale(1.2);}}
@keyframes mbaGlow2 {0%,100% {-webkit-transform: translate(0,0) scale(1);transform: translate(0,0) scale(1);}50% {-webkit-transform: translate(-80px,-50px) scale(1.2);transform: translate(-80px,-50px) scale(1.2);}}
@-webkit-keyframes mbaRise {0% {-webkit-transform: translateY(0);transform: translateY(0);opacity: 0;}12% {opacity: .9;}85% {opacity: .2;}100% {-webkit-transform: translateY(-560px);transform: translateY(-560px);opacity: 0;}}
@keyframes mbaRise {0% {-webkit-transform: translateY(0);transform: translateY(0);opacity: 0;}12% {opacity: .9;}85% {opacity: .2;}100% {-webkit-transform: translateY(-560px);transform: translateY(-560px);opacity: 0;}}
@-webkit-keyframes mbaFadeUp {from {opacity: 0;-webkit-transform: translateY(34px);transform: translateY(34px);}to {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes mbaFadeUp {from {opacity: 0;-webkit-transform: translateY(34px);transform: translateY(34px);}to {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}
@-webkit-keyframes mbaLine {to {width: 96px;}}
@keyframes mbaLine {to {width: 96px;}}
@-webkit-keyframes mbaBlink {0%,100% {opacity: 1;}50% {opacity: .25;}}
@keyframes mbaBlink {0%,100% {opacity: 1;}50% {opacity: .25;}}
/* 减弱动效偏好：全部停帧但保持内容完整可见 */
@media (prefers-reduced-motion: reduce) {
  .banner-mbanim .mba-bg,.banner-mbanim .mba-grid,.banner-mbanim .mba-glow,.banner-mbanim .mba-dots i,.banner-mbanim .banner-sub-txt h2,.banner-mbanim .mba-line,.banner-mbanim .banner-sub-txt p {-webkit-animation: none;animation: none;}
  .banner-mbanim .banner-sub-txt h2,.banner-mbanim .banner-sub-txt p {opacity: 1;}
  .banner-mbanim .mba-line {width: 96px;}
}

/* [2026-10-07] 成功案例列表页 banner 动效化（productlist.html，成功案例及 c1/c2/c3 子栏目共用）：
   风格与模板中心（暗黑科技粒子风）刻意区分——明亮彩色渐变（紫→品红→橙）+ 斜向流光色带
   + 漂浮几何图形 + 底部双层波浪 + CASES 大水印 + 文字模糊浮现。
   命名前缀 csa-，只作用于 .banner-csanim，不影响其他页面的 .banner-sub */
.banner-csanim {position: relative;overflow: hidden;text-shadow: none;background: #8f2bd8;}
.banner-csanim .container {position: relative;z-index: 5;}
/* 文字块：表格单元格垂直居中，下移避开透明导航 */
.banner-csanim .banner-sub-txt {display: table-cell;vertical-align: middle;text-align: center;padding-top: 44px;}
/* 底层鲜艳渐变缓慢流动 */
.banner-csanim .csa-bg {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 1;background: linear-gradient(115deg,#5b2be0 0%,#8f2bd8 25%,#d4145a 55%,#fbb03b 100%);background-size: 220% 220%;-webkit-animation: csaBg 14s ease-in-out infinite;animation: csaBg 14s ease-in-out infinite;}
/* 斜向流光色带 csa-band1/2/3：2026-10-11 应用户要求删除（案例页 DOM 已不再输出，规则同步清除） */
/* 漂浮几何图形：圆环 / 光点 / 旋转方块 / 三角 */
.banner-csanim .csa-shapes {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 3;pointer-events: none;}
.banner-csanim .csa-shapes i {position: absolute;display: block;}
.banner-csanim .csa-ring {left: 6%;top: 18%;width: 130px;height: 130px;border: 12px solid rgba(255,255,255,.15);border-radius: 50%;-webkit-animation: csaFloat 7s ease-in-out infinite;animation: csaFloat 7s ease-in-out infinite;}
.banner-csanim .csa-ring2 {left: 83%;top: 60%;width: 70px;height: 70px;border-width: 8px;border-color: rgba(255,215,130,.35);-webkit-animation: csaFloat 9s ease-in-out 1s infinite reverse;animation: csaFloat 9s ease-in-out 1s infinite reverse;}
.banner-csanim .csa-dot {left: 20%;top: 68%;width: 16px;height: 16px;border-radius: 50%;background: rgba(255,255,255,.5);box-shadow: 0 0 18px rgba(255,255,255,.6);-webkit-animation: csaFloat 6s ease-in-out .5s infinite;animation: csaFloat 6s ease-in-out .5s infinite;}
.banner-csanim .csa-dot2 {left: 90%;top: 16%;width: 10px;height: 10px;background: rgba(255,220,120,.8);-webkit-animation: csaFloat 8s ease-in-out 2s infinite;animation: csaFloat 8s ease-in-out 2s infinite;}
.banner-csanim .csa-sq {left: 76%;top: 14%;width: 60px;height: 60px;border: 3px solid rgba(255,255,255,.3);border-radius: 10px;-webkit-animation: csaSpin 18s linear infinite;animation: csaSpin 18s linear infinite;}
.banner-csanim .csa-tri {left: 33%;top: 20%;width: 0;height: 0;border-left: 22px solid transparent;border-right: 22px solid transparent;border-bottom: 38px solid rgba(255,255,255,.22);-webkit-animation: csaFloat 10s ease-in-out infinite reverse;animation: csaFloat 10s ease-in-out infinite reverse;}
/* 右下角大号水印 */
.banner-csanim .csa-watermark {position: absolute;right: 2%;bottom: 6%;z-index: 2;font-size: 150px;font-weight: 800;line-height: 1;letter-spacing: 14px;color: rgba(255,255,255,.08);pointer-events: none;-webkit-animation: csaFloat 11s ease-in-out infinite;animation: csaFloat 11s ease-in-out infinite;}
/* 底部双层波浪（内联 SVG 平铺，反向横移） */
.banner-csanim .csa-wave {position: absolute;left: 0;bottom: -2px;width: 200%;height: 90px;z-index: 4;background-repeat: repeat-x;background-size: 50% 100%;}
/* [2026-10-08 晚] 波浪路径重画为周期性贝塞尔（接缝两侧切线向量完全一致），消除平铺拼接处的硬拐角锯齿 */
.banner-csanim .csa-wave1 {opacity: .5;background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'><path d='M0,60 C180,112 420,8 600,60 C780,112 1020,8 1200,60 L1200,120 L0,120 Z' fill='rgba(255,255,255,0.35)'/></svg>");-webkit-animation: csaWave 12s linear infinite;animation: csaWave 12s linear infinite;}
.banner-csanim .csa-wave2 {height: 60px;opacity: .65;background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'><path d='M0,55 C200,10 400,100 600,55 C800,10 1000,100 1200,55 L1200,120 L0,120 Z' fill='rgba(255,255,255,0.5)'/></svg>");-webkit-animation: csaWave 8s linear infinite reverse;animation: csaWave 8s linear infinite reverse;}
/* 文字内容：模糊浮现 + 菱形分隔线展开 */
.banner-csanim .banner-sub-txt h2 {margin: 24px 0 0;font-size: 52px;font-weight: 800;color: #fff;letter-spacing: 6px;text-shadow: 0 6px 24px rgba(80,10,80,.45);opacity: 0;-webkit-transform: translateY(30px);transform: translateY(30px);-webkit-animation: csaIn 1s cubic-bezier(.2,.7,.3,1) .35s forwards;animation: csaIn 1s cubic-bezier(.2,.7,.3,1) .35s forwards;}
.banner-csanim .csa-div {display: block;position: relative;width: 0;height: 2px;margin: 22px auto 0;background: rgba(255,255,255,.6);-webkit-animation: csaDiv .9s ease-out .75s forwards;animation: csaDiv .9s ease-out .75s forwards;}
.banner-csanim .csa-div i {position: absolute;left: 50%;top: 50%;width: 8px;height: 8px;background: #fff;opacity: 0;-webkit-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);-webkit-animation: csaDivDot .4s ease-out 1.4s forwards;animation: csaDivDot .4s ease-out 1.4s forwards;}
.banner-csanim .banner-sub-txt p {margin: 20px 0 0;font-size: 18px;color: rgba(255,255,255,.9);letter-spacing: 3px;opacity: 0;-webkit-animation: csaIn 1s ease-out .6s forwards;animation: csaIn 1s ease-out .6s forwards;}
@-webkit-keyframes csaBg {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@keyframes csaBg {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@-webkit-keyframes csaFloat {0%,100% {-webkit-transform: translateY(0);transform: translateY(0);}50% {-webkit-transform: translateY(-26px);transform: translateY(-26px);}}
@keyframes csaFloat {0%,100% {-webkit-transform: translateY(0);transform: translateY(0);}50% {-webkit-transform: translateY(-26px);transform: translateY(-26px);}}
@-webkit-keyframes csaSpin {from {-webkit-transform: rotate(0);transform: rotate(0);}to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
@keyframes csaSpin {from {-webkit-transform: rotate(0);transform: rotate(0);}to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
@-webkit-keyframes csaWave {from {-webkit-transform: translateX(0);transform: translateX(0);}to {-webkit-transform: translateX(-50%);transform: translateX(-50%);}}
@keyframes csaWave {from {-webkit-transform: translateX(0);transform: translateX(0);}to {-webkit-transform: translateX(-50%);transform: translateX(-50%);}}
@-webkit-keyframes csaIn {to {opacity: 1;-webkit-filter: blur(0);filter: blur(0);-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes csaIn {to {opacity: 1;-webkit-filter: blur(0);filter: blur(0);-webkit-transform: translateY(0);transform: translateY(0);}}
@-webkit-keyframes csaDiv {to {width: 150px;}}
@keyframes csaDiv {to {width: 150px;}}
@-webkit-keyframes csaDivDot {to {opacity: 1;}}
@keyframes csaDivDot {to {opacity: 1;}}
/* --- [2026-10-12] 定制建站页（web.html / ?wb1/）banner：复用 csa- 动效背景；
     白线下方用 Swiper 纵向轮播本栏目套餐标题（wba- = web banner anim） --- */
.banner-csanim.csa-web {height: 460px;}
.banner-csanim.csa-web .csa-watermark {letter-spacing: 10px;}
.banner-csanim.csa-web .wba-roll {position: relative;height: 58px;margin-top: 16px;overflow: hidden;}
.banner-csanim.csa-web .wba-roll .swiper-slide {height: 58px;line-height: 58px;font-size: 30px;font-weight: 700;color: #fff;letter-spacing: 5px;text-shadow: 0 4px 18px rgba(80,10,80,.45);}
@media (max-width: 991px) {
  .banner-csanim.csa-web {height: 400px;}
  .banner-csanim.csa-web .wba-roll {height: 48px;}
  .banner-csanim.csa-web .wba-roll .swiper-slide {height: 48px;line-height: 48px;font-size: 24px;letter-spacing: 4px;}
}
@media (max-width: 767px) {
  .banner-csanim.csa-web {height: 300px;}
  .banner-csanim.csa-web .banner-sub-txt h2 {margin-top: 16px;font-size: 30px;letter-spacing: 3px;}
  .banner-csanim.csa-web .csa-div {-webkit-animation-name: none;animation-name: none;width: 110px;}
  .banner-csanim.csa-web .wba-roll {height: 40px;margin-top: 12px;}
  .banner-csanim.csa-web .wba-roll .swiper-slide {height: 40px;line-height: 40px;font-size: 18px;letter-spacing: 2px;}
}
/* --- [2026-10-08] 关于我们页 banner 荣誉照（csa-photos，挂在案例页同款 csa- 动效背景上）：
   外层 .csa-ph 管错峰上浮入场，内层 img 管常态错相漂浮，两层分离避免动画 transform 冲突；
   [2026-10-08 二次] 去掉圆圈/三角/方框/点；荣誉照增至四张，PC 单行宽度 264→234；
   [2026-10-08 晚] 用户要求恢复底部波浪（案例页同款，路径已重画去锯齿）；
   [2026-10-10] 几何图形（csa-shapes）已从 about/productlist 两个模板的 DOM 中移除，此处规则一并删除 --- */
/* [2026-10-08 晚2] 关于页 banner 单独加高 100px（站点默认 .banner-sub 为 500px），
   并加大文字与荣誉照之间的行间距（.csa-photos margin-top 34→56） */
.banner-csanim.csa-about {height: 600px;}
.banner-csanim.csa-about .csa-photos {position: relative;z-index: 6;display: -webkit-flex;display: flex;justify-content: center;align-items: flex-end;gap: 26px;margin-top: 56px;padding: 0 15px;}
.banner-csanim.csa-about .csa-ph {display: block;opacity: 0;-webkit-transform: translateY(48px);transform: translateY(48px);-webkit-animation: csaPhotoIn .9s cubic-bezier(.2,.7,.3,1) forwards;animation: csaPhotoIn .9s cubic-bezier(.2,.7,.3,1) forwards;}
.banner-csanim.csa-about .csa-ph:nth-child(1) {-webkit-animation-delay: .75s;animation-delay: .75s;}
.banner-csanim.csa-about .csa-ph:nth-child(2) {-webkit-animation-delay: .97s;animation-delay: .97s;}
.banner-csanim.csa-about .csa-ph:nth-child(3) {-webkit-animation-delay: 1.19s;animation-delay: 1.19s;}
.banner-csanim.csa-about .csa-ph:nth-child(4) {-webkit-animation-delay: 1.41s;animation-delay: 1.41s;}
.banner-csanim.csa-about .csa-ph img {display: block;width: 234px;height: auto;border-radius: 10px;border: 1px solid rgba(255,255,255,.42);box-shadow: 0 16px 38px rgba(40,0,40,.35);-webkit-animation: csaPhotoFloat 5.6s ease-in-out infinite alternate;animation: csaPhotoFloat 5.6s ease-in-out infinite alternate;}
.banner-csanim.csa-about .csa-ph:nth-child(1) img {-webkit-animation-duration: 5.2s;animation-duration: 5.2s;-webkit-animation-delay: -1.2s;animation-delay: -1.2s;}
.banner-csanim.csa-about .csa-ph:nth-child(2) img {-webkit-animation-duration: 6.4s;animation-duration: 6.4s;-webkit-animation-delay: -3.1s;animation-delay: -3.1s;}
.banner-csanim.csa-about .csa-ph:nth-child(3) img {-webkit-animation-duration: 5.8s;animation-duration: 5.8s;-webkit-animation-delay: -2.2s;animation-delay: -2.2s;}
.banner-csanim.csa-about .csa-ph:nth-child(4) img {-webkit-animation-duration: 6.2s;animation-duration: 6.2s;-webkit-animation-delay: -1.8s;animation-delay: -1.8s;}
@media (hover: hover) {
  .banner-csanim.csa-about .csa-ph img {-webkit-transition: box-shadow .35s ease,border-color .35s ease;transition: box-shadow .35s ease,border-color .35s ease;}
  .banner-csanim.csa-about .csa-ph:hover img {border-color: rgba(255,255,255,.95);box-shadow: 0 24px 48px rgba(30,0,40,.5);}
}
@-webkit-keyframes csaPhotoIn {to {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes csaPhotoIn {to {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}
@-webkit-keyframes csaPhotoFloat {from {-webkit-transform: translateY(0);transform: translateY(0);}to {-webkit-transform: translateY(-10px);transform: translateY(-10px);}}
@keyframes csaPhotoFloat {from {transform: translateY(0);}to {transform: translateY(-10px);}}
/* 减弱动效偏好：全部停帧但保持内容完整可见 */
@media (prefers-reduced-motion: reduce) {
  .banner-csanim .csa-bg,.banner-csanim .csa-shapes i,.banner-csanim .csa-watermark,.banner-csanim .csa-wave,.banner-csanim .banner-sub-txt h2,.banner-csanim .csa-div,.banner-csanim .csa-div i,.banner-csanim .banner-sub-txt p,.banner-csanim.csa-about .csa-ph,.banner-csanim.csa-about .csa-ph img {-webkit-animation: none;animation: none;}
  .banner-csanim .banner-sub-txt h2,.banner-csanim .banner-sub-txt p,.banner-csanim.csa-about .csa-ph {opacity: 1;-webkit-filter: none;filter: none;-webkit-transform: none;transform: none;}
  .banner-csanim .csa-div {width: 150px;}
  .banner-csanim .csa-div i {opacity: 1;}
}

/* [2026-10-07] 资讯中心列表页 banner 动效化（newslist.html，资讯中心及公司动态/AI动态/建站知识/常见问题共用）：
   第三种风格，与前两种刻意区分——模板中心是暗黑红科技粒子、成功案例是鲜艳渐变几何波浪，
   这里是深青底「极光光带 + 同心涟漪扩散 + 横向流光数据线 + 旋转虚线圆环」。
   注意：头部 .header 是透明固定层、logo 与文字为白色，故底色必须保持深色。
   命名前缀 nwa-，只作用于 .banner-nwanim，不影响其他页面 */
.banner-nwanim {position: relative;overflow: hidden;text-shadow: none;background: #04121a;}
.banner-nwanim .container {position: relative;z-index: 5;}
.banner-nwanim .banner-sub-txt {display: table-cell;vertical-align: middle;text-align: center;padding-top: 44px;}
/* 底部一条青色流光细线 */
.banner-nwanim:before {content: "";position: absolute;left: 0;bottom: 0;width: 100%;height: 1px;z-index: 5;background: linear-gradient(90deg,transparent,rgba(34,211,238,.6),transparent);}
/* 深青底色：缓慢流动 */
.banner-nwanim .nwa-bg {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 1;background: linear-gradient(160deg,#04121a 0%,#062430 45%,#041a24 100%);background-size: 200% 200%;-webkit-animation: nwaBg 18s ease-in-out infinite;animation: nwaBg 18s ease-in-out infinite;}
/* 极光光带：三团大半径模糊光斑错峰漂移（青/淡紫/青绿） */
.banner-nwanim .nwa-aurora {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 2;overflow: hidden;}
.banner-nwanim .nwa-aurora i {position: absolute;display: block;border-radius: 50%;-webkit-filter: blur(60px);filter: blur(60px);opacity: .55;}
.banner-nwanim .nwa-aurora i:nth-child(1) {left: -12%;top: -45%;width: 72%;height: 170%;background: radial-gradient(ellipse,rgba(34,211,238,.45),transparent 65%);-webkit-animation: nwaA1 14s ease-in-out infinite;animation: nwaA1 14s ease-in-out infinite;}
.banner-nwanim .nwa-aurora i:nth-child(2) {right: -16%;top: -35%;width: 62%;height: 155%;background: radial-gradient(ellipse,rgba(167,139,250,.34),transparent 65%);-webkit-animation: nwaA2 18s ease-in-out infinite;animation: nwaA2 18s ease-in-out infinite;}
.banner-nwanim .nwa-aurora i:nth-child(3) {left: 22%;bottom: -55%;width: 52%;height: 130%;background: radial-gradient(ellipse,rgba(20,184,166,.4),transparent 65%);-webkit-animation: nwaA3 16s ease-in-out infinite;animation: nwaA3 16s ease-in-out infinite;}
/* 同心涟漪：从中心一圈圈向外扩散淡出 */
.banner-nwanim .nwa-ripple {position: absolute;left: 50%;top: 50%;z-index: 2;pointer-events: none;}
.banner-nwanim .nwa-ripple i {position: absolute;left: -170px;top: -170px;width: 340px;height: 340px;border: 1px solid rgba(34,211,238,.4);border-radius: 50%;opacity: 0;-webkit-animation: nwaRipple 6s ease-out infinite;animation: nwaRipple 6s ease-out infinite;}
.banner-nwanim .nwa-ripple i:nth-child(2) {-webkit-animation-delay: 2s;animation-delay: 2s;}
.banner-nwanim .nwa-ripple i:nth-child(3) {-webkit-animation-delay: 4s;animation-delay: 4s;}
/* 横向流光数据线：一条亮段自左向右循环穿行 */
.banner-nwanim .nwa-lines {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 3;pointer-events: none;}
.banner-nwanim .nwa-lines i {position: absolute;left: 0;width: 100%;height: 1px;background-image: linear-gradient(90deg,transparent,rgba(34,211,238,.75),transparent);background-size: 34% 100%;background-repeat: no-repeat;background-position: -40% 0;-webkit-animation: nwaFlow 5s linear infinite;animation: nwaFlow 5s linear infinite;}
.banner-nwanim .nwa-lines i:nth-child(1) {top: 20%;opacity: .55;}
.banner-nwanim .nwa-lines i:nth-child(2) {top: 33%;-webkit-animation-duration: 7s;animation-duration: 7s;-webkit-animation-delay: 1.2s;animation-delay: 1.2s;opacity: .4;}
.banner-nwanim .nwa-lines i:nth-child(3) {top: 47%;-webkit-animation-duration: 4.5s;animation-duration: 4.5s;-webkit-animation-delay: 2.4s;animation-delay: 2.4s;opacity: .65;}
.banner-nwanim .nwa-lines i:nth-child(4) {top: 62%;-webkit-animation-duration: 8s;animation-duration: 8s;-webkit-animation-delay: .6s;animation-delay: .6s;opacity: .35;}
.banner-nwanim .nwa-lines i:nth-child(5) {top: 75%;-webkit-animation-duration: 6s;animation-duration: 6s;-webkit-animation-delay: 3.2s;animation-delay: 3.2s;opacity: .5;}
.banner-nwanim .nwa-lines i:nth-child(6) {top: 88%;-webkit-animation-duration: 5.5s;animation-duration: 5.5s;-webkit-animation-delay: 1.8s;animation-delay: 1.8s;opacity: .3;}
/* 旋转虚线圆环 + 环上一个发光小点 */
.banner-nwanim .nwa-ring {position: absolute;left: 50%;top: 50%;width: 420px;height: 420px;margin: -210px 0 0 -210px;border: 1px dashed rgba(34,211,238,.3);border-radius: 50%;z-index: 3;pointer-events: none;-webkit-animation: nwaSpin 40s linear infinite;animation: nwaSpin 40s linear infinite;}
.banner-nwanim .nwa-ring:after {content: "";position: absolute;left: 50%;top: -6px;width: 11px;height: 11px;margin-left: -6px;border-radius: 50%;background: #22d3ee;box-shadow: 0 0 16px #22d3ee;}
/* 文字内容：轻微放大 + 上浮淡入（与前两种的入场方式区分） */
.banner-nwanim .banner-sub-txt h2 {margin: 24px 0 0;font-size: 52px;font-weight: 700;color: #fff;letter-spacing: 6px;text-shadow: 0 0 26px rgba(34,211,238,.4),0 4px 18px rgba(0,0,0,.5);opacity: 0;-webkit-transform: translateY(18px) scale(.98);transform: translateY(18px) scale(.98);-webkit-animation: nwaIn 1s cubic-bezier(.2,.7,.3,1) .3s forwards;animation: nwaIn 1s cubic-bezier(.2,.7,.3,1) .3s forwards;}
.banner-nwanim .nwa-div {display: block;position: relative;width: 0;height: 2px;margin: 22px auto 0;background: linear-gradient(90deg,#22d3ee,#14b8a6);-webkit-animation: nwaDiv .9s ease-out .7s forwards;animation: nwaDiv .9s ease-out .7s forwards;}
.banner-nwanim .nwa-div i {position: absolute;left: 50%;top: 50%;width: 7px;height: 7px;border-radius: 50%;background: #22d3ee;box-shadow: 0 0 12px #22d3ee;opacity: 0;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);-webkit-animation: nwaDivDot .4s ease-out 1.35s forwards;animation: nwaDivDot .4s ease-out 1.35s forwards;}
.banner-nwanim .banner-sub-txt p {margin: 20px 0 0;font-size: 18px;color: rgba(255,255,255,.8);letter-spacing: 3px;opacity: 0;-webkit-animation: nwaIn 1s ease-out .55s forwards;animation: nwaIn 1s ease-out .55s forwards;}
@-webkit-keyframes nwaBg {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@keyframes nwaBg {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@-webkit-keyframes nwaA1 {0%,100% {-webkit-transform: translate(0,0);transform: translate(0,0);}50% {-webkit-transform: translate(90px,50px) scale(1.12);transform: translate(90px,50px) scale(1.12);}}
@keyframes nwaA1 {0%,100% {-webkit-transform: translate(0,0);transform: translate(0,0);}50% {-webkit-transform: translate(90px,50px) scale(1.12);transform: translate(90px,50px) scale(1.12);}}
@-webkit-keyframes nwaA2 {0%,100% {-webkit-transform: translate(0,0);transform: translate(0,0);}50% {-webkit-transform: translate(-80px,60px) scale(1.16);transform: translate(-80px,60px) scale(1.16);}}
@keyframes nwaA2 {0%,100% {-webkit-transform: translate(0,0);transform: translate(0,0);}50% {-webkit-transform: translate(-80px,60px) scale(1.16);transform: translate(-80px,60px) scale(1.16);}}
@-webkit-keyframes nwaA3 {0%,100% {-webkit-transform: translate(0,0) scale(1);transform: translate(0,0) scale(1);}50% {-webkit-transform: translate(60px,-50px) scale(1.2);transform: translate(60px,-50px) scale(1.2);}}
@keyframes nwaA3 {0%,100% {-webkit-transform: translate(0,0) scale(1);transform: translate(0,0) scale(1);}50% {-webkit-transform: translate(60px,-50px) scale(1.2);transform: translate(60px,-50px) scale(1.2);}}
@-webkit-keyframes nwaRipple {0% {-webkit-transform: scale(.2);transform: scale(.2);opacity: 0;}15% {opacity: .6;}100% {-webkit-transform: scale(2.7);transform: scale(2.7);opacity: 0;}}
@keyframes nwaRipple {0% {-webkit-transform: scale(.2);transform: scale(.2);opacity: 0;}15% {opacity: .6;}100% {-webkit-transform: scale(2.7);transform: scale(2.7);opacity: 0;}}
@-webkit-keyframes nwaFlow {0% {background-position: -40% 0;}100% {background-position: 140% 0;}}
@keyframes nwaFlow {0% {background-position: -40% 0;}100% {background-position: 140% 0;}}
@-webkit-keyframes nwaSpin {from {-webkit-transform: rotate(0);transform: rotate(0);}to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
@keyframes nwaSpin {from {-webkit-transform: rotate(0);transform: rotate(0);}to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
@-webkit-keyframes nwaIn {to {opacity: 1;-webkit-transform: none;transform: none;}}
@keyframes nwaIn {to {opacity: 1;-webkit-transform: none;transform: none;}}
@-webkit-keyframes nwaDiv {to {width: 150px;}}
@keyframes nwaDiv {to {width: 150px;}}
@-webkit-keyframes nwaDivDot {to {opacity: 1;}}
@keyframes nwaDivDot {to {opacity: 1;}}
/* 减弱动效偏好：全部停帧但保持内容完整可见 */
@media (prefers-reduced-motion: reduce) {
  .banner-nwanim .nwa-bg,.banner-nwanim .nwa-aurora i,.banner-nwanim .nwa-ripple i,.banner-nwanim .nwa-lines i,.banner-nwanim .nwa-ring,.banner-nwanim .banner-sub-txt h2,.banner-nwanim .nwa-div,.banner-nwanim .nwa-div i,.banner-nwanim .banner-sub-txt p {-webkit-animation: none;animation: none;}
  .banner-nwanim .banner-sub-txt h2,.banner-nwanim .banner-sub-txt p {opacity: 1;-webkit-transform: none;transform: none;}
  .banner-nwanim .nwa-div {width: 150px;}
  .banner-nwanim .nwa-div i {opacity: 1;}
}

/* [2026-10-08] 关于我们页重做（about.html）：banner 动效保留（斜切色块滑动+噪点呼吸+金线生长+描边框漂浮+文字字距展开），
   背景换为参照站同款红绸背景图（原图内嵌参照站照片，已裁剪纯红绸区域镜像拼接为 skin/images/aboutbg.jpg），
   配色由「深墨绿+暖金」适配为「深红+暖金」。正文新区块前缀 abt-（见 1151 行后）。旧说明：第四种风格「深墨绿+暖金·编辑杂志风」，
   与前三页拉开距离（模板中心=暗黑红科技粒子 / 成功案例=鲜艳渐变几何波浪 / 资讯中心=深青极光涟漪）。
   头部 .header 透明固定、logo 与文字为白色 → 底色保持深色。前缀 aba-，只作用于 .banner-abanim */
.banner-abanim {position: relative;overflow: hidden;text-shadow: none;background: #30060a;}
.banner-abanim .container {position: relative;z-index: 5;}
.banner-abanim .banner-sub-txt {display: table-cell;vertical-align: middle;text-align: center;padding-top: 44px;}
/* 底色：参照站红绸背景图（cover）+ 缓慢缩放呼吸（abaZoom，背景图微动） */
.banner-abanim .aba-bg {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 1;background: #4a080c url(../images/aboutbg.jpg) center / cover no-repeat;-webkit-animation: abaZoom 16s ease-in-out infinite;animation: abaZoom 16s ease-in-out infinite;}
/* 两块斜切色块：左右缓慢交错滑动（配色适配红底：深红 + 暗金褐） */
.banner-abanim .aba-block {position: absolute;top: -25%;height: 150%;z-index: 2;}
.banner-abanim .aba-block1 {left: -8%;width: 56%;background: linear-gradient(135deg,rgba(88,10,14,.62),rgba(30,4,6,.5));-webkit-transform: skewX(-14deg);transform: skewX(-14deg);-webkit-animation: abaSlide1 13s ease-in-out infinite;animation: abaSlide1 13s ease-in-out infinite;}
.banner-abanim .aba-block2 {right: -12%;width: 44%;background: linear-gradient(135deg,rgba(74,48,16,.55),rgba(24,14,4,.5));-webkit-transform: skewX(-14deg);transform: skewX(-14deg);-webkit-animation: abaSlide2 17s ease-in-out infinite;animation: abaSlide2 17s ease-in-out infinite;}
/* 胶片颗粒噪点：两层不同周期呼吸 */
.banner-abanim .aba-noise {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 3;pointer-events: none;background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");opacity: .16;-webkit-animation: abaNoise 4.5s ease-in-out infinite;animation: abaNoise 4.5s ease-in-out infinite;}
/* 金色细线：自左/右生长 */
.banner-abanim .aba-lines {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 3;pointer-events: none;}
.banner-abanim .aba-lines i {position: absolute;display: block;height: 1px;background: linear-gradient(90deg,rgba(214,178,102,.9),rgba(214,178,102,0));-webkit-transform: scaleX(0);transform: scaleX(0);-webkit-transform-origin: left center;transform-origin: left center;-webkit-animation: abaGrow 2.4s cubic-bezier(.2,.7,.3,1) forwards;animation: abaGrow 2.4s cubic-bezier(.2,.7,.3,1) forwards;}
.banner-abanim .aba-lines i:nth-child(1) {left: 5%;top: 24%;width: 160px;-webkit-animation-delay: .2s;animation-delay: .2s;}
.banner-abanim .aba-lines i:nth-child(2) {right: 5%;top: 33%;width: 230px;-webkit-transform-origin: right center;transform-origin: right center;background: linear-gradient(270deg,rgba(214,178,102,.9),rgba(214,178,102,0));-webkit-animation-delay: .5s;animation-delay: .5s;}
.banner-abanim .aba-lines i:nth-child(3) {left: 8%;bottom: 22%;width: 110px;-webkit-animation-delay: .8s;animation-delay: .8s;}
.banner-abanim .aba-lines i:nth-child(4) {right: 10%;bottom: 30%;width: 180px;-webkit-transform-origin: right center;transform-origin: right center;background: linear-gradient(270deg,rgba(214,178,102,.9),rgba(214,178,102,0));-webkit-animation-delay: 1.1s;animation-delay: 1.1s;}
/* 大号斜切描边框：缓慢左右漂浮 */
.banner-abanim .aba-frame {position: absolute;left: 50%;top: 50%;width: 620px;height: 300px;margin: -150px 0 0 -310px;border: 1px solid rgba(214,178,102,.22);z-index: 3;pointer-events: none;-webkit-transform: skewX(-14deg);transform: skewX(-14deg);-webkit-animation: abaFrame 9s ease-in-out infinite;animation: abaFrame 9s ease-in-out infinite;}
/* 文字内容：暖金标签 + 字距展开的大标题 */
.banner-abanim .banner-sub-txt h2 {margin: 26px 0 0;font-size: 54px;font-weight: 500;color: #fff;letter-spacing: 10px;text-indent: 10px;text-shadow: 0 4px 20px rgba(0,0,0,.55);opacity: 0;-webkit-animation: abaInH2 1.1s cubic-bezier(.2,.7,.3,1) .35s forwards;animation: abaInH2 1.1s cubic-bezier(.2,.7,.3,1) .35s forwards;}
.banner-abanim .aba-div {display: block;position: relative;width: 0;height: 1px;margin: 24px auto 0;background: rgba(214,178,102,.75);-webkit-animation: abaDiv .9s ease-out .9s forwards;animation: abaDiv .9s ease-out .9s forwards;}
.banner-abanim .aba-div i {position: absolute;left: 50%;top: 50%;width: 9px;height: 9px;border: 1px solid #d6b266;background: transparent;opacity: 0;-webkit-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);-webkit-animation: abaDivDot .5s ease-out 1.6s forwards;animation: abaDivDot .5s ease-out 1.6s forwards;}
.banner-abanim .banner-sub-txt p {margin: 20px 0 0;font-size: 18px;color: rgba(255,255,255,.72);letter-spacing: 4px;opacity: 0;-webkit-transform: translateY(14px);transform: translateY(14px);-webkit-animation: abaInY 1s ease-out .65s forwards;animation: abaInY 1s ease-out .65s forwards;}
@-webkit-keyframes abaBg {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@keyframes abaBg {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@-webkit-keyframes abaZoom {0%,100% {-webkit-transform: scale(1);transform: scale(1);}50% {-webkit-transform: scale(1.07);transform: scale(1.07);}}
@keyframes abaZoom {0%,100% {-webkit-transform: scale(1);transform: scale(1);}50% {-webkit-transform: scale(1.07);transform: scale(1.07);}}
@-webkit-keyframes abaSlide1 {0%,100% {-webkit-transform: skewX(-14deg) translateX(0);transform: skewX(-14deg) translateX(0);}50% {-webkit-transform: skewX(-14deg) translateX(40px);transform: skewX(-14deg) translateX(40px);}}
@keyframes abaSlide1 {0%,100% {-webkit-transform: skewX(-14deg) translateX(0);transform: skewX(-14deg) translateX(0);}50% {-webkit-transform: skewX(-14deg) translateX(40px);transform: skewX(-14deg) translateX(40px);}}
@-webkit-keyframes abaSlide2 {0%,100% {-webkit-transform: skewX(-14deg) translateX(0);transform: skewX(-14deg) translateX(0);}50% {-webkit-transform: skewX(-14deg) translateX(-46px);transform: skewX(-14deg) translateX(-46px);}}
@keyframes abaSlide2 {0%,100% {-webkit-transform: skewX(-14deg) translateX(0);transform: skewX(-14deg) translateX(0);}50% {-webkit-transform: skewX(-14deg) translateX(-46px);transform: skewX(-14deg) translateX(-46px);}}
@-webkit-keyframes abaNoise {0%,100% {opacity: .11;}50% {opacity: .22;}}
@keyframes abaNoise {0%,100% {opacity: .11;}50% {opacity: .22;}}
@-webkit-keyframes abaGrow {to {-webkit-transform: scaleX(1);transform: scaleX(1);}}
@keyframes abaGrow {to {-webkit-transform: scaleX(1);transform: scaleX(1);}}
@-webkit-keyframes abaFrame {0%,100% {-webkit-transform: skewX(-14deg) translateX(-14px);transform: skewX(-14deg) translateX(-14px);}50% {-webkit-transform: skewX(-14deg) translateX(14px);transform: skewX(-14deg) translateX(14px);}}
@keyframes abaFrame {0%,100% {-webkit-transform: skewX(-14deg) translateX(-14px);transform: skewX(-14deg) translateX(-14px);}50% {-webkit-transform: skewX(-14deg) translateX(14px);transform: skewX(-14deg) translateX(14px);}}
@-webkit-keyframes abaInX {to {opacity: 1;-webkit-transform: translateX(0);transform: translateX(0);}}
@keyframes abaInX {to {opacity: 1;-webkit-transform: translateX(0);transform: translateX(0);}}
@-webkit-keyframes abaInH2 {from {opacity: 0;letter-spacing: 28px;}to {opacity: 1;letter-spacing: 10px;}}
@keyframes abaInH2 {from {opacity: 0;letter-spacing: 28px;}to {opacity: 1;letter-spacing: 10px;}}
@-webkit-keyframes abaInY {to {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes abaInY {to {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}
@-webkit-keyframes abaDiv {to {width: 170px;}}
@keyframes abaDiv {to {width: 170px;}}
@-webkit-keyframes abaDivDot {to {opacity: 1;}}
@keyframes abaDivDot {to {opacity: 1;}}
/* 减弱动效偏好：停帧但内容完整可见 */
@media (prefers-reduced-motion: reduce) {
  .banner-abanim .aba-bg,.banner-abanim .aba-block,.banner-abanim .aba-noise,.banner-abanim .aba-lines i,.banner-abanim .aba-frame,  .banner-abanim .banner-sub-txt h2,.banner-abanim .aba-div,.banner-abanim .aba-div i,.banner-abanim .banner-sub-txt p {-webkit-animation: none;animation: none;}
  .banner-abanim .banner-sub-txt h2,.banner-abanim .banner-sub-txt p {opacity: 1;-webkit-transform: none;transform: none;}
  .banner-abanim .aba-lines i {-webkit-transform: scaleX(1);transform: scaleX(1);}
  .banner-abanim .aba-div {width: 170px;}
  .banner-abanim .aba-div i {opacity: 1;}
}

/* ===== [2026-10-08] 关于我们页正文（about.html，前缀 abt-；内容结构参照 xd029.com/about，版式原创）===== */
/* --- 通用 --- */
.abt-sec {padding: 76px 0;}
.abt-sec .container {max-width: 1400px;} /* 站点默认 1600，子页统一 1400（2026-10-11 用户要求子页宽度+100px） */
.abt-sec-gray {background-color: #f7f8fa;}
.abt-title {text-align: center;margin-bottom: 46px;}
.abt-title h2 {position: relative;display: inline-block;margin: 0;font-size: 34px;color: #222;letter-spacing: 2px;padding-bottom: 18px;}
.abt-title h2:after {content: '';position: absolute;left: 50%;bottom: 0;width: 44px;height: 3px;margin-left: -22px;border-radius: 2px;background: linear-gradient(90deg,#e62022,#ff7a3c);}
.abt-title p {margin: 14px 0 0;font-size: 15px;color: #888;letter-spacing: 1px;}
/* 图标底座（荣誉/承诺共用） */
.abt-ico {display: inline-flex;align-items: center;justify-content: center;width: 64px;height: 64px;border-radius: 18px;background: linear-gradient(135deg,#fff1f0,#ffe3e0);color: #e62022;}
.abt-ico svg {width: 34px;height: 34px;}

/* --- 01 公司简介 + 数据 --- */
.abt-intro {display: flex;align-items: center;gap: 64px;}
.abt-intro-txt {flex: 1 1 auto;min-width: 0;padding-right: 80px;} /* [2026-10-11] 文字框收窄（右侧留白 80px），文字与右侧图片间距增大；手机端还原见媒体查询 */
.abt-eyebrow {display: inline-block;font-size: 13px;font-style: normal;letter-spacing: 5px;color: #e62022;border: 1px solid rgba(230,32,34,.35);border-radius: 999px;padding: 5px 16px;}
.abt-intro-txt h2 {margin: 20px 0 0;font-size: 36px;color: #222;letter-spacing: 1px;}
.abt-intro-txt-body {margin-top: 22px;}
.abt-intro-txt-body p {margin: 0 0 16px;font-size: 15px;color: #666;line-height: 2;text-align: justify;}
.abt-stats {flex: 0 0 400px;display: grid;grid-template-columns: 1fr 1fr;gap: 16px;list-style: none;margin: 0;padding: 0;}
.abt-stats li {position: relative;background: #fff;border: 1px solid #eee;border-radius: 14px;padding: 26px 12px 22px;text-align: center;overflow: hidden;transition: transform .35s, box-shadow .35s, border-color .35s;}
.abt-stats li:before {content: '';position: absolute;left: 0;top: 0;width: 100%;height: 3px;background: linear-gradient(90deg,#e62022,#ff7a3c);transform: scaleX(0);transform-origin: left;transition: transform .35s;}
.abt-stats li:hover {transform: translateY(-6px);box-shadow: 0 14px 30px rgba(0,0,0,.08);border-color: #f3b9ba;}
.abt-stats li:hover:before {transform: scaleX(1);}
.abt-stats b {font-size: 42px;font-weight: 800;line-height: 1;font-style: normal;background: linear-gradient(135deg,#e62022,#ff5a3c);-webkit-background-clip: text;background-clip: text;color: transparent;}
.abt-stats span {font-size: 18px;font-weight: 700;color: #e62022;margin-left: 2px;}
.abt-stats em {display: block;margin-top: 10px;font-size: 14px;color: #888;font-style: normal;letter-spacing: 1px;}
/* [2026-10-11] 简介右侧数据卡（.abt-stats）换成宣传图 about-intro.jpg（420x384）；
   .abt-stats 规则保留备用（现无模板引用）；[2026-10-11 二次] 用户要求去掉背景和阴影 → 无圆角无投影，白底图与页面白底融合 */
.abt-intro-pic {flex: 0 0 400px;}
.abt-intro-pic img {display: block;width: 100%;height: auto;}

/* --- 02 目标/成长/坚持 三卡 --- */
.abt-goals {display: grid;grid-template-columns: repeat(3,1fr);gap: 24px;list-style: none;margin: 0;padding: 0;}
.abt-goals li {position: relative;background: #fff;border-radius: 14px;padding: 36px 30px 30px;overflow: hidden;transition: transform .35s, box-shadow .35s;}
.abt-goals li:before {content: '';position: absolute;left: 0;top: 0;width: 100%;height: 4px;background: linear-gradient(90deg,#e62022,#ff7a3c);transform: scaleX(0);transform-origin: left;transition: transform .4s;}
.abt-goals li:hover {transform: translateY(-8px);box-shadow: 0 16px 34px rgba(0,0,0,.09);}
.abt-goals li:hover:before {transform: scaleX(1);}
.abt-goals em {display: block;font-size: 15px;font-weight: 800;font-style: normal;letter-spacing: 3px;color: #e3e3e3;transition: color .35s;}
.abt-goals li:hover em {color: rgba(230,32,34,.45);}
.abt-goals h3 {margin: 12px 0 0;font-size: 22px;color: #222;}
.abt-goals p {margin: 12px 0 0;font-size: 14px;color: #888;line-height: 1.9;}

/* --- 03 荣誉资质（徽章卡）--- */
.abt-honors {display: grid;grid-template-columns: repeat(4,1fr);gap: 20px;list-style: none;margin: 0;padding: 0;}
.abt-honors li {background: #fff;border: 1px solid #eee;border-radius: 14px;padding: 34px 22px 28px;text-align: center;transition: transform .35s, box-shadow .35s, border-color .35s;}
.abt-honors li:hover {transform: translateY(-8px);border-color: #f3b9ba;box-shadow: 0 16px 34px rgba(0,0,0,.08);}
.abt-honors .abt-ico {background: linear-gradient(135deg,#fdf6ec,#fae8cf);color: #c9973f;}
.abt-honors h4 {margin: 18px 0 0;font-size: 18px;color: #222;}
.abt-honors p {margin: 10px 0 0;font-size: 13px;color: #999;line-height: 1.8;}

/* --- 03 资质荣誉 [2026-10-11] 重做：徽章卡 → 证书照片轮播（Swiper 4.5，5 张 600x800）；
   .abt-honors 徽章卡规则保留备用（现无模板引用）；
   [2026-10-11 二次] ①箭头与图片留出间距（box 增左右内边距 + 箭头内移，不再压图）
   ②点击卡片弹出放大灯箱（.abt-zoom，DOM 挂 body 下）③卡片动效（相框化 + 常态错相浮动 + 斜向高光扫过 + 抬升）--- */
.abt-cert-box {position: relative;padding: 0 76px;}
.abt-cert-box:before {content: '';position: absolute;left: 50%;top: 50%;width: 78%;height: 86%;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);background: radial-gradient(closest-side,rgba(230,32,34,.07),rgba(230,32,34,0));pointer-events: none;}
.abt-cert-swiper {position: relative;z-index: 1;padding: 26px 0;} /* [2026-10-11] 轮播框体上下留白：卡片顶/底与框体边界留出间距，同时给卡片浮动(-6px)与悬停抬升(-9px)留出余量不被 overflow 裁掉 */
.abt-cert-swiper .swiper-slide {height: auto;-webkit-animation: abtCertFloat 6s ease-in-out infinite alternate;animation: abtCertFloat 6s ease-in-out infinite alternate;}
.abt-cert-swiper .swiper-slide:nth-child(2n) {-webkit-animation-duration: 7.4s;animation-duration: 7.4s;-webkit-animation-delay: -2.6s;animation-delay: -2.6s;}
.abt-cert-swiper .swiper-slide:nth-child(3n) {-webkit-animation-duration: 5.2s;animation-duration: 5.2s;-webkit-animation-delay: -4.3s;animation-delay: -4.3s;}
@-webkit-keyframes abtCertFloat {from {-webkit-transform: translateY(0);}to {-webkit-transform: translateY(-6px);}}
@keyframes abtCertFloat {from {transform: translateY(0);}to {transform: translateY(-6px);}}
.abt-cert-card {position: relative;display: block;overflow: hidden;padding: 15px;border-radius: 12px;background: #fff;border: 1px solid #eee;box-shadow: 0 5px 12px rgba(0,0,0,.07); /* [2026-10-11] 阴影范围缩小贴近卡片：偏移 12→5、扩散 26→12 */-webkit-transition: -webkit-transform .5s cubic-bezier(.2,.7,.3,1),box-shadow .5s ease,border-color .4s ease;transition: transform .5s cubic-bezier(.2,.7,.3,1),box-shadow .5s ease,border-color .4s ease;}
.abt-cert-card img {display: block;width: 100%;height: auto;border-radius: 6px;cursor: -webkit-zoom-in;cursor: zoom-in;}
.abt-cert-card:after {content: '';position: absolute;top: -12%;left: -140%;width: 55%;height: 124%;background: linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.62) 50%,rgba(255,255,255,0) 100%);-webkit-transform: skewX(-16deg);transform: skewX(-16deg);-webkit-transition: left .85s cubic-bezier(.35,0,.25,1);transition: left .85s cubic-bezier(.35,0,.25,1);pointer-events: none;}
.abt-cert-zoom {position: absolute;right: 15px;bottom: 15px;z-index: 2;width: 34px;height: 34px;border-radius: 50%;background: rgba(255,255,255,.94);color: #8a8a8a;box-shadow: 0 4px 14px rgba(0,0,0,.16);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-transition: background-color .35s ease,color .35s ease,-webkit-transform .35s ease;transition: background-color .35s ease,color .35s ease,transform .35s ease;}
.abt-cert-zoom svg {width: 17px;height: 17px;}
@media (hover: hover) {
  .abt-cert-card:hover {border-color: rgba(230,32,34,.45);box-shadow: 0 10px 20px rgba(0,0,0,.13);-webkit-transform: translateY(-9px);transform: translateY(-9px);} /* [2026-10-11] 悬停阴影同步收窄 */
  .abt-cert-card:hover:after {left: 145%;}
  .abt-cert-card:hover .abt-cert-zoom {background: #e62022;color: #fff;-webkit-transform: scale(1.1);transform: scale(1.1);}
}
.abt-cert-prev,.abt-cert-next {position: absolute;top: 50%;z-index: 6;width: 46px;height: 46px;margin-top: -23px;border-radius: 50%;background: #fff;box-shadow: 0 8px 20px rgba(0,0,0,.14);cursor: pointer;-webkit-transition: background-color .3s ease,-webkit-transform .3s ease;transition: background-color .3s ease,transform .3s ease;}
.abt-cert-prev {left: 12px;}
.abt-cert-next {right: 12px;}
.abt-cert-prev:before,.abt-cert-next:before {content: '';position: absolute;left: 50%;top: 50%;width: 12px;height: 12px;border-top: 3px solid #999;border-right: 3px solid #999;-webkit-transition: border-color .3s;transition: border-color .3s;}
.abt-cert-prev:before {-webkit-transform: translate(-30%,-50%) rotate(-135deg);transform: translate(-30%,-50%) rotate(-135deg);}
.abt-cert-next:before {-webkit-transform: translate(-70%,-50%) rotate(45deg);transform: translate(-70%,-50%) rotate(45deg);}
.abt-cert-prev:hover,.abt-cert-next:hover {background: #e62022;-webkit-transform: scale(1.08);transform: scale(1.08);}
.abt-cert-prev:hover:before,.abt-cert-next:hover:before {border-color: #fff;}
.abt-cert-dots {position: static;margin-top: 26px;text-align: center;} /* [2026-10-11] 用户要求去掉轮播点，DOM 已删，规则保留备用 */
.abt-cert-dots .swiper-pagination-bullet {width: 9px;height: 9px;margin: 0 4px;background: #d9d9d9;opacity: 1;-webkit-transition: all .3s;transition: all .3s;}
.abt-cert-dots .swiper-pagination-bullet:hover {background: #b9b9b9;}
.abt-cert-dots .swiper-pagination-bullet-active {width: 22px;border-radius: 5px;background: #e62022;}

/* --- 03 证书放大灯箱（点击卡片图片/放大镜弹出；挂 body 下，避免受父级 transform 影响）--- */
.abt-zoom {position: fixed;top: 0;right: 0;bottom: 0;left: 0;z-index: 9999;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;opacity: 0;visibility: hidden;pointer-events: none;-webkit-transition: opacity .32s ease,visibility .32s ease;transition: opacity .32s ease,visibility .32s ease;}
.abt-zoom.open {opacity: 1;visibility: visible;pointer-events: auto;}
.abt-zoom-mask {position: absolute;top: 0;right: 0;bottom: 0;left: 0;background: rgba(12,4,8,.86);-webkit-backdrop-filter: blur(3px);backdrop-filter: blur(3px);}
.abt-zoom-body {position: relative;z-index: 2;max-width: 88vw;}
.abt-zoom-body img {display: block;margin: 0 auto;max-width: 88vw;max-height: 80vh;width: auto;height: auto;padding: 10px;border-radius: 10px;background: #fff;-webkit-box-sizing: border-box;box-sizing: border-box;box-shadow: 0 34px 90px rgba(0,0,0,.55);-webkit-transform: scale(.9);transform: scale(.9);-webkit-transition: -webkit-transform .38s cubic-bezier(.2,.7,.3,1);transition: transform .38s cubic-bezier(.2,.7,.3,1);}
.abt-zoom.open .abt-zoom-body img {-webkit-transform: scale(1);transform: scale(1);}
.abt-zoom-close {position: absolute;top: -48px;right: 0;width: 34px;height: 34px;border-radius: 50%;background: rgba(255,255,255,.92);cursor: pointer;-webkit-transition: background-color .3s ease,-webkit-transform .3s ease;transition: background-color .3s ease,transform .3s ease;}
.abt-zoom-close:before,.abt-zoom-close:after {content: '';position: absolute;left: 50%;top: 50%;width: 15px;height: 2px;background: #555;}
.abt-zoom-close:before {-webkit-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);}
.abt-zoom-close:after {-webkit-transform: translate(-50%,-50%) rotate(-45deg);transform: translate(-50%,-50%) rotate(-45deg);}
.abt-zoom-close:hover {background: #e62022;-webkit-transform: rotate(90deg);transform: rotate(90deg);}
.abt-zoom-close:hover:before,.abt-zoom-close:hover:after {background: #fff;}
body.abt-zoom-lock {overflow: hidden;}

/* --- 04 我们的承诺（图标+文字横排卡：grid 两列，图标跨两行居中）--- */
.abt-promises {display: grid;grid-template-columns: repeat(3,1fr);gap: 20px;list-style: none;margin: 0;padding: 0;}
.abt-promises li {display: grid;grid-template-columns: 52px 1fr;column-gap: 18px;row-gap: 7px;background: #fff;border: 1px solid #eee;border-radius: 14px;padding: 26px 24px;transition: transform .35s, box-shadow .35s, border-color .35s;}
.abt-promises li:hover {transform: translateY(-6px);border-color: #f3b9ba;box-shadow: 0 14px 30px rgba(0,0,0,.08);}
.abt-promises .abt-ico {grid-row: 1 / span 2;align-self: center;width: 52px;height: 52px;border-radius: 14px;}
.abt-promises .abt-ico svg {width: 28px;height: 28px;}
.abt-promises h4 {margin: 0;font-size: 17px;color: #222;align-self: end;}
.abt-promises p {margin: 0;font-size: 13px;color: #999;line-height: 1.8;align-self: start;}

/* --- 05 CTA --- */
.abt-cta {position: relative;padding: 72px 0;text-align: center;overflow: hidden;background: linear-gradient(120deg,#a30f13,#e62022 55%,#c8141a);}
.abt-cta:before {content: '';position: absolute;left: -120px;top: -140px;width: 420px;height: 420px;border-radius: 50%;background: radial-gradient(circle,rgba(255,190,150,.28),rgba(255,190,150,0));pointer-events: none;}
.abt-cta:after {content: '';position: absolute;right: -140px;bottom: -180px;width: 480px;height: 480px;border-radius: 50%;background: radial-gradient(circle,rgba(120,6,10,.55),rgba(120,6,10,0));pointer-events: none;}
/* [2026-10-11] CTA 标题文字特效：白字逐字波浪起伏 +「你呢？」金色强调（背景光带已按用户要求移除）。
   ★不用 background-clip:text + filter 组合：headless 实测内部 em（transform 合成层）会被错位绘制出文字残影 */
.abt-cta h3 {position: relative;z-index: 1;margin: 0;font-size: 34px;color: #fff;letter-spacing: 3px;-webkit-animation: abtGlow 3.6s ease-in-out infinite;animation: abtGlow 3.6s ease-in-out infinite;}
@keyframes abtGlow {0%,100% {text-shadow: 0 4px 16px rgba(0,0,0,.25),0 0 8px rgba(255,208,130,0);}50% {text-shadow: 0 4px 16px rgba(0,0,0,.25),0 0 18px rgba(255,208,130,.6);}}
@-webkit-keyframes abtGlow {0%,100% {text-shadow: 0 4px 16px rgba(0,0,0,.25),0 0 8px rgba(255,208,130,0);}50% {text-shadow: 0 4px 16px rgba(0,0,0,.25),0 0 18px rgba(255,208,130,.6);}}
/* 单字元素：逐个错峰起伏（--d 由模板内联给出，步进 .1s，形成自左向右的波浪） */
.abt-cta h3 i {display: inline-block;font-style: normal;color: #fff;-webkit-animation: abtWave 2.2s ease-in-out infinite;animation: abtWave 2.2s ease-in-out infinite;-webkit-animation-delay: var(--d,0s);animation-delay: var(--d,0s);}
@keyframes abtWave {0%,55%,100% {-webkit-transform: translateY(0);transform: translateY(0);}25% {-webkit-transform: translateY(-8px);transform: translateY(-8px);}}
@-webkit-keyframes abtWave {0%,55%,100% {-webkit-transform: translateY(0);transform: translateY(0);}25% {-webkit-transform: translateY(-8px);transform: translateY(-8px);}}
/* 「你呢？」金色强调：接续白字波浪（延迟 .9s），保持一个连续波峰流向句尾 */
.abt-cta h3 em {display: inline-block;font-style: normal;color: #ffd98a;text-shadow: 0 2px 10px rgba(0,0,0,.28);-webkit-animation: abtWave 2.2s ease-in-out infinite;animation: abtWave 2.2s ease-in-out infinite;-webkit-animation-delay: .9s;animation-delay: .9s;}
@media (prefers-reduced-motion: reduce) {
  .abt-cta h3,.abt-cta h3 i,.abt-cta h3 em {-webkit-animation: none;animation: none;}
}
.abt-cta-btn {position: relative;z-index: 1;margin-top: 30px;}
.abt-cta-btn a {display: inline-block;padding: 14px 46px;border: 1px solid rgba(255,255,255,.75);border-radius: 999px;background: rgba(255,255,255,.08);color: #fff;font-size: 17px;letter-spacing: 1px;transition: background-color .3s, color .3s, transform .3s;}
.abt-cta-btn a:hover {background: #fff;color: #e62022;transform: translateY(-3px);}
.abt-cta p {position: relative;z-index: 1;margin: 22px 0 0;font-size: 14px;color: rgba(255,255,255,.82);letter-spacing: 2px;}

/* 关于我们页自适应 */
@media (max-width: 991px) {
  .abt-sec {padding: 54px 0;}
  .abt-intro {gap: 40px;}
  .abt-stats {flex: 0 0 340px;}
  .abt-title h2 {font-size: 28px;}
  .abt-goals {gap: 14px;}
  .abt-goals li {padding: 28px 20px 24px;}
  .abt-honors {grid-template-columns: 1fr 1fr;}
  .abt-promises {grid-template-columns: 1fr 1fr;gap: 14px;}
  .abt-cta h3 {font-size: 26px;}
  /* 资质轮播平板端：箭头缩小内移，保持与图片的间距 */
  .abt-cert-box {padding: 0 60px;}
  .abt-cert-prev,.abt-cert-next {width: 38px;height: 38px;margin-top: -19px;}
  .abt-cert-prev {left: 8px;}
  .abt-cert-next {right: 8px;}
  .abt-cert-prev:before,.abt-cert-next:before {width: 10px;height: 10px;}
}
@media (max-width: 767px) {
  .abt-sec {padding: 40px 0;}
  .abt-intro {flex-direction: column;align-items: stretch;gap: 26px;}
  .abt-intro-txt {padding-right: 0;} /* [2026-10-11] 手机端上下堆叠，还原文字框宽度 */
  .abt-intro-txt h2 {font-size: 24px;}
  .abt-intro-txt-body p {font-size: 14px;}
  .abt-stats {flex: none;grid-template-columns: 1fr 1fr;gap: 12px;}
  .abt-intro-pic {flex: none;}
  /* 资质轮播手机端：隐藏箭头（触屏滑动），卡片内边距与放大镜缩小，灯箱适配小屏 */
  .abt-cert-prev,.abt-cert-next {display: none;}
  .abt-cert-box {padding: 0 2px;}
  .abt-cert-box:before {width: 94%;height: 94%;}
  .abt-cert-card {padding: 12px 10px;}
  .abt-cert-swiper {padding: 20px 0;}
  .abt-cert-zoom {right: 10px;bottom: 10px;width: 30px;height: 30px;}
  .abt-cert-zoom svg {width: 15px;height: 15px;}
  .abt-cert-dots {margin-top: 16px;}
  .abt-zoom-body img {max-height: 72vh;padding: 7px;border-radius: 8px;}
  .abt-zoom-close {top: -42px;width: 30px;height: 30px;}
  .abt-stats b {font-size: 32px;}
  .abt-goals {grid-template-columns: 1fr;}
  .abt-title h2 {font-size: 24px;}
  .abt-title p {font-size: 13px;}
  .abt-honors {grid-template-columns: 1fr 1fr;gap: 12px;}
  .abt-honors li {padding: 26px 14px 22px;}
  .abt-honors h4 {font-size: 16px;}
  .abt-promises {grid-template-columns: 1fr;}
  .abt-cta {padding: 50px 0;}
  .abt-cta h3 {font-size: 22px;letter-spacing: 1px;}
  .abt-cta-btn a {padding: 12px 30px;font-size: 15px;}
  .abt-cta p {font-size: 13px;}
}

/* [2026-10-07] 联系我们页 banner 动效化（contact.html）：第五种风格「深紫黑 · 旋转光扇」。
   conic-gradient 光扇缓慢旋转 + 斜向细条纹平移 + 四角十字定位标呼吸 + 紫粉/天蓝光斑缩放，
   文字呈轻微倾斜回正入场。同样保持深色底以适配白色透明导航。前缀 cta-，只作用于 .banner-ctanim */
.banner-ctanim {position: relative;overflow: hidden;text-shadow: none;background: #120a1f;}
.banner-ctanim .container {position: relative;z-index: 5;}
.banner-ctanim .banner-sub-txt {display: table-cell;vertical-align: middle;text-align: center;padding-top: 44px;}
.banner-ctanim .cta-bg {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 1;background: linear-gradient(150deg,#120a1f 0%,#1b1030 50%,#0d0716 100%);background-size: 200% 200%;-webkit-animation: ctaBg 20s ease-in-out infinite;animation: ctaBg 20s ease-in-out infinite;}
/* 旋转光扇：conic 渐变 + 大半径模糊，整体缓慢旋转 */
.banner-ctanim .cta-fan {position: absolute;left: 50%;top: 50%;width: 1000px;height: 1000px;margin: -500px 0 0 -500px;z-index: 2;border-radius: 50%;opacity: .85;-webkit-filter: blur(26px);filter: blur(26px);background: conic-gradient(from 0deg,transparent 0deg,rgba(139,92,246,.3) 40deg,rgba(236,72,153,.2) 80deg,transparent 132deg,transparent 248deg,rgba(56,189,248,.22) 300deg,transparent 360deg);-webkit-animation: ctaFan 26s linear infinite;animation: ctaFan 26s linear infinite;}
/* 斜向细条纹：缓慢横移 */
.banner-ctanim .cta-stripes {position: absolute;left: -20%;top: -20%;width: 140%;height: 140%;z-index: 2;opacity: .14;pointer-events: none;background-image: repeating-linear-gradient(115deg,rgba(255,255,255,.55) 0 1px,transparent 1px 22px);-webkit-animation: ctaStripes 6s linear infinite;animation: ctaStripes 6s linear infinite;}
/* 紫粉 / 天蓝光斑：缩放呼吸 */
.banner-ctanim .cta-glow {position: absolute;border-radius: 50%;z-index: 2;pointer-events: none;-webkit-filter: blur(52px);filter: blur(52px);}
.banner-ctanim .cta-glow1 {left: -6%;bottom: -32%;width: 420px;height: 420px;background: radial-gradient(circle,rgba(236,72,153,.5),transparent 65%);-webkit-animation: ctaGlow 10s ease-in-out infinite;animation: ctaGlow 10s ease-in-out infinite;}
.banner-ctanim .cta-glow2 {right: -4%;top: -28%;width: 380px;height: 380px;background: radial-gradient(circle,rgba(56,189,248,.45),transparent 65%);-webkit-animation: ctaGlow 13s ease-in-out infinite reverse;animation: ctaGlow 13s ease-in-out infinite reverse;}
/* 四角十字定位标：错峰呼吸（top 值已避开 75px 高的透明导航） */
.banner-ctanim .cta-marks {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 4;pointer-events: none;}
.banner-ctanim .cta-marks i {position: absolute;display: block;width: 26px;height: 26px;opacity: .6;-webkit-animation: ctaBlink 3.6s ease-in-out infinite;animation: ctaBlink 3.6s ease-in-out infinite;}
.banner-ctanim .cta-marks i:before {content: "";position: absolute;left: 50%;top: 0;width: 1px;height: 100%;margin-left: -.5px;background: rgba(196,181,253,.75);}
.banner-ctanim .cta-marks i:after {content: "";position: absolute;top: 50%;left: 0;width: 100%;height: 1px;margin-top: -.5px;background: rgba(196,181,253,.75);}
.banner-ctanim .cta-marks i:nth-child(1) {left: 30px;top: 100px;}
.banner-ctanim .cta-marks i:nth-child(2) {right: 30px;top: 100px;-webkit-animation-delay: .9s;animation-delay: .9s;}
.banner-ctanim .cta-marks i:nth-child(3) {left: 30px;bottom: 30px;-webkit-animation-delay: 1.8s;animation-delay: 1.8s;}
.banner-ctanim .cta-marks i:nth-child(4) {right: 30px;bottom: 30px;-webkit-animation-delay: 2.7s;animation-delay: 2.7s;}
/* 文字内容：倾斜回正入场 + 紫粉分隔线 */
.banner-ctanim .banner-sub-txt h2 {margin: 24px 0 0;font-size: 52px;font-weight: 700;color: #fff;letter-spacing: 6px;text-shadow: 0 0 28px rgba(139,92,246,.55),0 4px 18px rgba(0,0,0,.5);opacity: 0;-webkit-transform: translateY(20px) rotate(-2deg) scale(.96);transform: translateY(20px) rotate(-2deg) scale(.96);-webkit-animation: ctaIn 1.1s cubic-bezier(.2,.7,.3,1) .3s forwards;animation: ctaIn 1.1s cubic-bezier(.2,.7,.3,1) .3s forwards;}
.banner-ctanim .cta-div {display: block;position: relative;width: 0;height: 2px;margin: 22px auto 0;background: linear-gradient(90deg,#8b5cf6,#ec4899);-webkit-animation: ctaDiv .9s ease-out .75s forwards;animation: ctaDiv .9s ease-out .75s forwards;}
.banner-ctanim .cta-div i {position: absolute;left: 50%;top: 50%;width: 10px;height: 10px;border-radius: 50%;border: 1px solid rgba(236,72,153,.9);background: rgba(18,10,31,.9);opacity: 0;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);-webkit-animation: ctaDivDot .5s ease-out 1.4s forwards;animation: ctaDivDot .5s ease-out 1.4s forwards;}
.banner-ctanim .banner-sub-txt p {margin: 20px 0 0;font-size: 18px;color: rgba(255,255,255,.8);letter-spacing: 3px;opacity: 0;-webkit-transform: translateY(16px) rotate(-1.5deg);transform: translateY(16px) rotate(-1.5deg);-webkit-animation: ctaIn 1s ease-out .55s forwards;animation: ctaIn 1s ease-out .55s forwards;}
@-webkit-keyframes ctaBg {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@keyframes ctaBg {0%,100% {background-position: 0% 50%;}50% {background-position: 100% 50%;}}
@-webkit-keyframes ctaFan {from {-webkit-transform: rotate(0);transform: rotate(0);}to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
@keyframes ctaFan {from {-webkit-transform: rotate(0);transform: rotate(0);}to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
@-webkit-keyframes ctaStripes {from {-webkit-transform: translateX(0);transform: translateX(0);}to {-webkit-transform: translateX(22px);transform: translateX(22px);}}
@keyframes ctaStripes {from {-webkit-transform: translateX(0);transform: translateX(0);}to {-webkit-transform: translateX(22px);transform: translateX(22px);}}
@-webkit-keyframes ctaGlow {0%,100% {-webkit-transform: scale(1);transform: scale(1);opacity: .55;}50% {-webkit-transform: scale(1.25);transform: scale(1.25);opacity: .85;}}
@keyframes ctaGlow {0%,100% {-webkit-transform: scale(1);transform: scale(1);opacity: .55;}50% {-webkit-transform: scale(1.25);transform: scale(1.25);opacity: .85;}}
@-webkit-keyframes ctaBlink {0%,100% {opacity: .22;}50% {opacity: .85;}}
@keyframes ctaBlink {0%,100% {opacity: .22;}50% {opacity: .85;}}
@-webkit-keyframes ctaIn {to {opacity: 1;-webkit-transform: none;transform: none;}}
@keyframes ctaIn {to {opacity: 1;-webkit-transform: none;transform: none;}}
@-webkit-keyframes ctaDiv {to {width: 160px;}}
@keyframes ctaDiv {to {width: 160px;}}
@-webkit-keyframes ctaDivDot {to {opacity: 1;}}
@keyframes ctaDivDot {to {opacity: 1;}}
/* 减弱动效偏好：停帧但内容完整可见 */
@media (prefers-reduced-motion: reduce) {
  .banner-ctanim .cta-bg,.banner-ctanim .cta-fan,.banner-ctanim .cta-stripes,.banner-ctanim .cta-glow,.banner-ctanim .cta-marks i,.banner-ctanim .banner-sub-txt h2,.banner-ctanim .cta-div,.banner-ctanim .cta-div i,.banner-ctanim .banner-sub-txt p {-webkit-animation: none;animation: none;}
  .banner-ctanim .banner-sub-txt h2,.banner-ctanim .banner-sub-txt p {opacity: 1;-webkit-transform: none;transform: none;}
  .banner-ctanim .cta-div {width: 160px;}
  .banner-ctanim .cta-div i {opacity: 1;}
}

/* ==================================================================
   [2026-10-11] 联系我们页改版（contact.html）：联系信息卡 + 在线留言 + 位置与交通（活动地图）
   版式与动效参考：易百讯（信息卡 + 交通三卡）、多维网讯（留言表单）、凡高网（倾听式文案）；地图 Leaflet + 高德瓦片
   入场动效统一走 WOW（fadeInUp / fadeInLeft / fadeInRight），悬停动效在下方逐条声明。
   ================================================================== */
.ctc-info .container,.ctc-msg .container {max-width: 1400px;}

/* --- 通用区块标题 --- */
.ctc-head {text-align: center;margin-bottom: 46px;}
.ctc-eyebrow {display: inline-block;font-size: 13px;font-style: normal;letter-spacing: 5px;color: #e62022;border: 1px solid rgba(230,32,34,.35);border-radius: 999px;padding: 5px 16px;}
.ctc-head h2 {margin: 20px 0 0;font-size: 34px;color: #222;letter-spacing: 1px;}
.ctc-head p {margin: 14px 0 0;font-size: 15px;color: #888;}

/* --- 01 联系信息卡 --- */
.ctc-info {padding: 76px 0 66px;background: #fff;}
.ctc-cards {display: grid;grid-template-columns: repeat(4,1fr);gap: 24px;list-style: none;margin: 0;padding: 0;}
.ctc-cards li {position: relative;background: #fff;border: 1px solid #eee;border-radius: 16px;padding: 34px 22px 30px;text-align: center;overflow: hidden;-webkit-transition: -webkit-transform .45s cubic-bezier(.2,.7,.3,1),box-shadow .45s ease,border-color .4s ease;transition: transform .45s cubic-bezier(.2,.7,.3,1),box-shadow .45s ease,border-color .4s ease;}
.ctc-cards li:before {content: '';position: absolute;left: 0;top: 0;width: 100%;height: 3px;background: linear-gradient(90deg,#e62022,#ff7a3c);-webkit-transform: scaleX(0);transform: scaleX(0);-webkit-transform-origin: left;transform-origin: left;-webkit-transition: -webkit-transform .45s ease;transition: transform .45s ease;}
.ctc-cards li:hover {border-color: #f3b9ba;box-shadow: 0 16px 34px rgba(230,32,34,.12);-webkit-transform: translateY(-8px);transform: translateY(-8px);}
.ctc-cards li:hover:before {-webkit-transform: scaleX(1);transform: scaleX(1);}
.ctc-ico {display: inline-flex;align-items: center;justify-content: center;width: 62px;height: 62px;border-radius: 18px;background: linear-gradient(135deg,#fff1f0,#ffe3e0);color: #e62022;-webkit-transition: background-color .45s ease,color .45s ease,-webkit-transform .5s cubic-bezier(.2,.7,.3,1);transition: background-color .45s ease,color .45s ease,transform .5s cubic-bezier(.2,.7,.3,1);}
.ctc-ico svg {display: block;width: 30px;height: 30px;}
.ctc-cards li:hover .ctc-ico {background: linear-gradient(135deg,#e62022,#ff5a3c);color: #fff;-webkit-transform: translateY(-2px) scale(1.06);transform: translateY(-2px) scale(1.06);}
.ctc-cards h4 {margin: 18px 0 0;font-size: 17px;color: #222;letter-spacing: 1px;}
.ctc-cards p {margin: 12px 0 0;font-size: 15px;color: #666;line-height: 1.8;}
.ctc-cards p a {color: inherit;}
.ctc-cards p.ctc-big {margin-top: 8px;}
.ctc-cards p.ctc-big a {font-size: 21px;font-weight: 800;color: #e62022;letter-spacing: .5px;-webkit-transition: letter-spacing .35s ease,color .35s ease;transition: letter-spacing .35s ease,color .35s ease;}
.ctc-cards p.ctc-big a:hover {letter-spacing: 1.6px;}
.ctc-cards p.ctc-sub {margin-top: 10px;font-size: 13px;color: #999;}
.ctc-cards p.ctc-sub + p.ctc-big {margin-top: 2px;}

/* --- 位置与交通（并入联系信息版块，信息卡下方）：左交通方式 + 右活动地图 --- */
.ctc-loc-grid {display: grid;grid-template-columns: 440px 1fr;gap: 30px;align-items: stretch;margin-top: 52px;padding-top: 48px;border-top: 1px dashed #e8e8e8;}
.ctc-routes {display: grid;gap: 18px;list-style: none;margin: 0;padding: 0;}
.ctc-routes li {display: flex;align-items: flex-start;gap: 18px;background: #fafafa;border: 1px solid #f0f0f0;border-radius: 16px;padding: 26px 24px;-webkit-transition: background-color .45s ease,border-color .45s ease,box-shadow .45s ease,-webkit-transform .45s cubic-bezier(.2,.7,.3,1);transition: background-color .45s ease,border-color .45s ease,box-shadow .45s ease,transform .45s cubic-bezier(.2,.7,.3,1);}
.ctc-routes li:hover {background: #fff;border-color: #f3b9ba;box-shadow: 0 16px 34px rgba(0,0,0,.08);-webkit-transform: translateY(-6px);transform: translateY(-6px);}
.ctc-rico {display: inline-flex;align-items: center;justify-content: center;flex: 0 0 56px;width: 56px;height: 56px;border-radius: 50%;background: #fff;border: 1px solid #f0e2e2;color: #e62022;-webkit-transition: background-color .45s ease,border-color .45s ease,color .45s ease,-webkit-transform .5s cubic-bezier(.2,.7,.3,1);transition: background-color .45s ease,border-color .45s ease,color .45s ease,transform .5s cubic-bezier(.2,.7,.3,1);}
.ctc-rico svg {display: block;width: 26px;height: 26px;}
.ctc-routes li:hover .ctc-rico {background: #e62022;border-color: #e62022;color: #fff;-webkit-transform: scale(1.06) rotate(-4deg);transform: scale(1.06) rotate(-4deg);}
.ctc-loc-txt {flex: 1 1 auto;min-width: 0;}
.ctc-routes h4 {margin: 4px 0 0;font-size: 18px;color: #222;letter-spacing: .5px;}
.ctc-routes p {margin: 10px 0 0;font-size: 14px;color: #777;line-height: 1.95;}
.ctc-map {display: inline-flex;align-items: center;gap: 8px;margin-top: 14px;font-size: 14px;color: #e62022;letter-spacing: .5px;}
.ctc-map:after {content: '';width: 14px;height: 1px;background: #e62022;-webkit-transition: width .35s ease;transition: width .35s ease;}
.ctc-map:hover:after {width: 26px;}
/* 活动地图 */
.ctc-map-box {position: relative;min-height: 460px;}
.ctc-map-box #ctcMap {position: absolute;left: 0;top: 0;width: 100%;height: 100%;min-height: 460px;border-radius: 16px;border: 1px solid #eee;box-sizing: border-box;z-index: 1;background: #eef1f4;}
.ctc-map-tip {position: absolute;left: 50%;bottom: 16px;z-index: 2;margin: 0;padding: 8px 18px;border-radius: 999px;background: rgba(255,255,255,.92);box-shadow: 0 6px 18px rgba(0,0,0,.12);font-size: 13px;color: #666;letter-spacing: .5px;-webkit-transform: translateX(-50%);transform: translateX(-50%);white-space: nowrap;pointer-events: none;}
/* 定位标记：红点 + 脉冲光圈 */
.ctc-pin {position: relative;background: none;border: 0;}
.ctc-pin-dot {position: absolute;left: 50%;top: 50%;width: 14px;height: 14px;margin: -7px 0 0 -7px;border-radius: 50%;background: #e62022;border: 2px solid #fff;box-shadow: 0 2px 10px rgba(230,32,34,.5);z-index: 2;}
.ctc-pin-ring {position: absolute;left: 50%;top: 50%;width: 14px;height: 14px;margin: -7px 0 0 -7px;border-radius: 50%;background: rgba(230,32,34,.45);-webkit-animation: ctcPin 1.8s ease-out infinite;animation: ctcPin 1.8s ease-out infinite;z-index: 1;}
@keyframes ctcPin {0% {-webkit-transform: scale(1);transform: scale(1);opacity: .8;}100% {-webkit-transform: scale(3.6);transform: scale(3.6);opacity: 0;}}
@-webkit-keyframes ctcPin {0% {-webkit-transform: scale(1);transform: scale(1);opacity: .8;}100% {-webkit-transform: scale(3.6);transform: scale(3.6);opacity: 0;}}
/* Leaflet 弹窗贴近站点风格 */
#ctcMap .leaflet-popup-content-wrapper {border-radius: 12px;box-shadow: 0 10px 30px rgba(0,0,0,.16);}
#ctcMap .leaflet-popup-content {margin: 14px 18px;font-size: 13px;line-height: 1.8;color: #555;}
#ctcMap .leaflet-popup-content b {display: block;margin-bottom: 4px;font-size: 14px;color: #222;}
#ctcMap a.leaflet-popup-close-button {color: #bbb;}
#ctcMap .leaflet-bar a {color: #666;}

/* --- 02 在线留言 --- */
.ctc-msg {padding: 70px 0 76px;background: #f7f8fa;}
.ctc-grid {display: grid;grid-template-columns: 1fr 396px;gap: 36px;align-items: start;}
.ctc-form {background: #fff;border-radius: 18px;padding: 38px 40px 40px;box-shadow: 0 10px 30px rgba(0,0,0,.05);}
.ctc-form form {display: grid;grid-template-columns: 1fr 1fr;gap: 18px 20px;}
.ctc-field {display: block;}
.ctc-field-full {grid-column: 1 / -1;}
.ctc-field > span {display: block;margin-bottom: 9px;font-size: 14px;color: #555;letter-spacing: .5px;}
.ctc-field > span em {font-style: normal;color: #e62022;}
.ctc-field input,.ctc-field textarea {display: block;width: 100%;box-sizing: border-box;padding: 0 16px;height: 48px;line-height: 48px;font-size: 15px;color: #333;background: #f7f8fa;border: 1px solid #f0f0f0;border-radius: 10px;font-family: inherit;-webkit-transition: background-color .35s ease,border-color .35s ease,box-shadow .35s ease;transition: background-color .35s ease,border-color .35s ease,box-shadow .35s ease;}
.ctc-field textarea {height: 116px;line-height: 1.8;padding: 13px 16px;resize: none;}
.ctc-field input:focus,.ctc-field textarea:focus {background: #fff;border-color: rgba(230,32,34,.55);box-shadow: 0 6px 18px rgba(230,32,34,.1);outline: none;}
.ctc-field input::-webkit-input-placeholder,.ctc-field textarea::-webkit-input-placeholder {color: #b5b5b5;}
.ctc-code-box {display: flex;align-items: center;gap: 14px;}
.ctc-code-box input {flex: 1 1 auto;}
.ctc-code-box img {flex: 0 0 118px;width: 118px;height: 48px;border: 1px solid #f0f0f0;border-radius: 10px;background: #f7f8fa;cursor: pointer;-webkit-transition: border-color .35s ease;transition: border-color .35s ease;}
.ctc-code-box img:hover {border-color: rgba(230,32,34,.45);}
.ctc-submit {grid-column: 1 / -1;justify-self: start;height: 52px;padding: 0 54px;border: 0;border-radius: 999px;background: linear-gradient(120deg,#e62022,#ff5a3c);color: #fff;font-size: 16px;letter-spacing: 2px;cursor: pointer;font-family: inherit;-webkit-transition: -webkit-transform .35s ease,box-shadow .35s ease;transition: transform .35s ease,box-shadow .35s ease;}
.ctc-submit:hover {-webkit-transform: translateY(-3px);transform: translateY(-3px);box-shadow: 0 14px 28px rgba(230,32,34,.28);}
.ctc-aside {display: grid;gap: 18px;}
.ctc-qr {display: flex;align-items: center;gap: 18px;background: #fff;border: 1px solid #eee;border-radius: 16px;padding: 20px 22px;-webkit-transition: -webkit-transform .45s cubic-bezier(.2,.7,.3,1),box-shadow .45s ease,border-color .4s ease;transition: transform .45s cubic-bezier(.2,.7,.3,1),box-shadow .45s ease,border-color .4s ease;}
.ctc-qr:hover {border-color: #f3b9ba;box-shadow: 0 14px 30px rgba(0,0,0,.08);-webkit-transform: translateY(-5px);transform: translateY(-5px);}
.ctc-qr img {width: 108px;height: 108px;object-fit: contain;border-radius: 8px;background: #fafafa;-webkit-transition: -webkit-transform .5s cubic-bezier(.2,.7,.3,1);transition: transform .5s cubic-bezier(.2,.7,.3,1);}
.ctc-qr:hover img {-webkit-transform: scale(1.06);transform: scale(1.06);}
.ctc-qr h4 {margin: 0;font-size: 17px;color: #222;letter-spacing: .5px;}
.ctc-qr p {margin: 9px 0 0;font-size: 13px;color: #999;line-height: 1.8;}
.ctc-promise {list-style: none;margin: 0;padding: 22px 26px;}
.ctc-promise li {position: relative;padding-left: 28px;font-size: 14px;color: #666;line-height: 1.8;}
.ctc-promise li:before {content: '';position: absolute;left: 0;top: 6px;width: 16px;height: 16px;border-radius: 50%;background: linear-gradient(135deg,#fff1f0,#ffdad7);border: 1px solid rgba(230,32,34,.35);}
.ctc-promise li:after {content: '';position: absolute;left: 5px;top: 10px;width: 5px;height: 9px;border-right: 2px solid #e62022;border-bottom: 2px solid #e62022;-webkit-transform: rotate(42deg);transform: rotate(42deg);}
.ctc-promise li + li {margin-top: 12px;padding-top: 12px;border-top: 1px dashed #f0f0f0;}
.ctc-promise li + li:before {top: 18px;}
.ctc-promise li + li:after {top: 22px;}

/* --- 联系我们页自适应 --- */
@media (max-width: 1199px) {
  .ctc-cards {grid-template-columns: repeat(2,1fr);}
  .ctc-grid {grid-template-columns: 1fr 330px;gap: 28px;}
  .ctc-loc-grid {grid-template-columns: 380px 1fr;gap: 24px;}
}
@media (max-width: 991px) {
  .ctc-info {padding: 56px 0 50px;}
  .ctc-head {margin-bottom: 36px;}
  .ctc-head h2 {font-size: 28px;}
  .ctc-grid {grid-template-columns: 1fr;gap: 26px;}
  .ctc-loc-grid {grid-template-columns: 1fr;gap: 22px;}
  .ctc-map-box,#ctcMap {min-height: 380px;}
  .ctc-form {padding: 30px 26px 32px;}
}
@media (max-width: 767px) {
  .ctc-info {padding: 40px 0 34px;}
  .ctc-msg {padding: 40px 0 46px;}
  .ctc-loc-grid {margin-top: 34px;padding-top: 28px;gap: 18px;}
  .ctc-head {margin-bottom: 26px;}
  .ctc-head h2 {font-size: 22px;line-height: 1.5;}
  .ctc-head p {font-size: 14px;}
  .ctc-cards {grid-template-columns: 1fr;gap: 16px;}
  .ctc-cards li {padding: 26px 20px 24px;}
  .ctc-cards p.ctc-big a {font-size: 19px;}
  .ctc-map-box,#ctcMap {min-height: 300px;}
  .ctc-map-tip {bottom: 12px;padding: 7px 14px;font-size: 12px;white-space: normal;max-width: calc(100% - 56px);text-align: center;} /* [2026-10-11] 手机端去掉 nowrap：提示条 428px 撑破 390 视口造成横向溢出 */
  .ctc-form {padding: 24px 20px 26px;border-radius: 14px;}
  .ctc-form form {grid-template-columns: 1fr;gap: 15px;}
  .ctc-field input,.ctc-field textarea {height: 46px;line-height: 46px;font-size: 14px;}
  .ctc-field textarea {height: 104px;line-height: 1.8;padding: 12px 14px;}
  .ctc-code-box img {flex: 0 0 100px;width: 100px;height: 46px;}
  .ctc-submit {width: 100%;justify-self: stretch;padding: 0;}
  .ctc-qr {padding: 16px 18px;gap: 14px;}
  .ctc-qr img {width: 92px;height: 92px;}
  .ctc-qr h4 {font-size: 16px;}
  .ctc-routes li {padding: 22px 18px;}
  .ctc-routes h4 {font-size: 17px;}
}

.pages {margin: 40px 0 0;text-align: center;font-size: 0;}
.pages a {display: inline-block;font-size: 14px;line-height: 35px;padding: 0 14px;margin: 2px;background-color: #f5f5f5;border-radius: 3px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.pages a:hover,.pages .cur {background-color: #e62022;color: #fff;border:1px solid #e62022;}

/* [2026-10-19] 栏目条参照 xaxhch.com page-header 重做：白底 + 底部阴影；栏目靠左，右侧面包屑；
   hover 红色背景自底部滑上（scaleY）+ 文字变白；选中态不改背景、只变文字色 */
/* [2026-10-19 v2] 栏目条按 xaxhch.com page-header 一比一扒取（类名换本站 lanmu-* 体系，仅阴影保留本站值）：
   白底 vw 流式高度 4.166667vw；栏目靠左，字色 #4d4d4d；hover 色块 scaleY 自底部滑上+文字变白；
   选中态无背景色、文字也不变色（[2026-10-19 v3] 去掉 .active 红字）；
   栏目标题字号 = 18px（[2026-10-19 v4] 14px +5 后再 -1）；右侧面包屑保留，字号 -2 号（.833333vw - 2px）。
   [2026-10-19 v4] 修复：选中项 hover 时 .active 规则后置同优先级盖住了白色 → 补 .active:hover 白色；
   栏目文字加 white-space:nowrap 防止字号变大后折成两行。 */
.lanmu {position: relative;background-color: #fff;margin-top: -1px;box-shadow: 0 6px 18px rgba(0,0,0,0.08);z-index: 5;}
.lanmu .container {display: flex;justify-content: space-between;height: 4.166667vw;align-items: center;}
.lanmu-left {height: 100%;display: flex;align-items: center;}
.lanmu-title {display: none;}
.lanmu-tc {display: flex;height: 100%;margin: 0;padding: 0;list-style: none;}
.lanmu-tc li {position: relative;z-index: 9;color: #4d4d4d;font-size: 18px;-webkit-transition: all .3s;transition: all .3s;}
.lanmu-tc li a {padding: 0 1.222917vw;height: 100%;display: flex;align-items: center;text-align: center;position: relative;color: inherit;text-decoration:none;white-space: nowrap;}
.lanmu-tc li a:before {content: "";position: absolute;width: 100%;height: 100%;left: 0;bottom: 0;background: #e62022;-webkit-transform: scaleY(0);transform: scaleY(0);-webkit-transition: all .3s;transition: all .3s;-webkit-transform-origin: center bottom;transform-origin: center bottom;}
.lanmu-tc li a span {position: relative;z-index: 9;}
.lanmu-tc li:hover > a {color: #fff;}
.lanmu-tc li:hover > a:before {-webkit-transform: scaleY(1);transform: scaleY(1);}
/* [2026-10-19 v3] 选中态只保留“当前栏目”语义，文字不变色、背景也不变色 */
.lanmu-tc li.active > a {color: #4d4d4d;}
/* [2026-10-19 v4] 选中项同样要响应 hover 变白（.active 规则后置会盖掉上面的 :hover 白字） */
.lanmu-tc li.active:hover > a {color: #fff;}
/* 右侧面包屑（小房子图标 + 首页 > 栏目 > 当前套餐），字号在 .833333vw 基础上再小 2 号 */
.lanmu-crumb {display: flex;font-size: calc(.833333vw - 2px);color: #666;gap: .520833vw;align-items: center;white-space: nowrap;}
.lanmu-crumb:before {content: "";width: 1.041667vw;height: 1.041667vw;margin-top: -.104167vw;background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath fill='%23666' d='M946.5 503.5L538 119c-14.5-13.2-37.5-13.2-52 0L77.5 503.5c-13 11.9-4.4 34.5 13.4 34.5H160v386c0 17.7 14.3 32 32 32h224c17.7 0 32-14.3 32-32V672h128v250c0 17.7 14.3 32 32 32h224c17.7 0 32-14.3 32-32V538h69.1c17.8 0 26.4-22.6 13.4-34.5z'/%3E%3C/svg%3E") no-repeat center/contain;}
.lanmu-crumb a {color: #666;text-decoration: none;}
.lanmu-crumb a:hover {color: #e62022;}
.lanmu-crumb em {font-style: normal;}
/* 窄屏下面包屑避开右侧悬浮客服条（kefu 固定 right:10px 宽 64px） */
@media (max-width: 1550px) {.lanmu-crumb {padding-right: 84px;}}
/* [2026-10-12] 定制建站页（gongneng.html，dz-page 作用域）内容区独立收窄到 1400px，
   与关于/联系/案例等子页一致；共用 web.html 的其他栏目（模板建站/小程序）不受影响 */
.dz-page .container {max-width: 1400px;}

/* [2026-10-12] 定制建站页套餐信息块：默认全部隐藏，由 JS 激活当前套餐（内容页）或第 1 个套餐（列表页） */
.wba-tcs .wba-tc {display: none;}
.wba-tcs .wba-tc.active {display: block;}

.position {padding: 20px 0;background-color: #ededed;color: #777;}
.position i {margin-right: 10px;display: inline-block;vertical-align: top;width: 17px;height: 20px;background: url(../images/daohangdw.png) no-repeat center;}

.seo-1 {margin-left: -25px;}
.seo-1 li {float: left;width: 20%;}
.seo-1 li a {display: block;-webkit-transition: all 0.5s;transition: all 0.5s;margin-left: 25px;padding: 120px 20px 20px;background: no-repeat center / 100% 100%;text-align: center;}
.seo-1 li.i1 a {background-image: url(../images/pc1.png);}
.seo-1 li.i2 a {background-image: url(../images/wap1.png);}
.seo-1 li.i3 a {background-image: url(../images/weixin1.png);}
.seo-1 li.i4 a {background-image: url(../images/web1.png);}
.seo-1 li.i5 a {background-image: url(../images/tel1.png);}
.seo-1 li h4 {margin: 0 0 20px;font-size: 22px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.seo-1 li p {text-align: justify;margin: 0;height: 80px;overflow: hidden;color: #666;-webkit-transition: all 0.5s;transition: all 0.5s;}
.seo-1 li a:hover {-webkit-transform: translateY(-10px);transform: translateY(-10px);color: #fff;}
.seo-1 li a:hover p {color: #fff;}
.seo-1 li.i1 a:hover {background-image: url(../images/pc1_h.png);}
.seo-1 li.i2 a:hover {background-image: url(../images/wap1_h.png);}
.seo-1 li.i3 a:hover {background-image: url(../images/weixin1_h.png);}
.seo-1 li.i4 a:hover {background-image: url(../images/web1_h.png);}
.seo-1 li.i5 a:hover {background-image: url(../images/tel1_h.png);}

.seo-2 {background-color: #fff;padding: 0 30px 30px 0;}
.seo-2 li {float: left;width: 25%;}
.seo-2 li a {display: block;border: 1px solid #ddd;margin: 30px 0 0 30px;padding: 10px;}
.seo-2 li .img-center {height: 240px;line-height: 240px;}
.seo-2 li .text {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;line-height: 35px;background-color: #f4f4f4;font-size: 15px;}
.seo-2 li a:hover {border-color: #e62022;}
.seo-2 li a:hover .text {background-color: #e62022;color: #fff;}

.seo-3 {background: url(../images/con3.jpg) no-repeat center 0;padding-top: 80px;}
.seo-3 ul {position: relative;height: 400px;}
.seo-3 li {position: absolute;border: 2px solid #838383;font-size: 16px;padding: 10px 20px;line-height: 24px;font-weight: bold;background-color: #fff;}
.seo-3 li span {color: #e62022;font-size: 22px;line-height: 1;}
.seo-3 li:after {position: absolute;left: 100%;top: 15px;content: '';width: 0;height: 0;border-style: solid;border-width: 8px 0 8px 16px;border-color: transparent transparent transparent #838383;}
.seo-3 li:nth-child(even):after {left: auto;right: 100%;border-width: 8px 16px 8px 0;border-color: transparent #838383 transparent transparent;}
.seo-3 li.o1 {top: 0;right: 844px;}
.seo-3 li.o2 {top: 0;left: 795px;}
.seo-3 li.o3 {top: 100px;right: 886px;}
.seo-3 li.o4 {top: 100px;left: 838px;}
.seo-3 li.o5 {top: 200px;right: 886px;}
.seo-3 li.o6 {top: 200px;left: 838px;}
.seo-3 li.o7 {top: 300px;right: 844px;}
.seo-3 li.o8 {top: 300px;left: 795px;}
.seo-3 .zd {display: block;margin: 0 auto;border: 1px #e62022 dashed;width: 130px;height: 130px;border-radius: 50%;text-align: center;padding: 5px;}
.seo-3 .zd span {display: block;background-color: #e62022;color: #fff;border-radius: 50%;font-size: 30px;padding: 23px 0;}
.seo-3 .zd:hover {border-color: #000;}
.seo-3 .zd:hover span {background-color: #000;}

.seo-4 .item {float: left;width: 560px;}
.seo-4 .tit {margin-bottom: 30px;}
.seo-4 .tit h4 {margin: 0;font-size: 36px;color: #e62022;}
.seo-4 .tit h4 small {font-weight: normal;color: #333;font-size: 18px;margin-left: 20px;}
.seo-4 .tit span {display: block;font-size: 26px;}
.seo-4 ul {border: 1px solid #e62022;border-radius: 10px;padding: 10px 20px 30px 20px;}
.seo-4 li {margin: 10px 0;font-size: 16px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.seo-4 li span {display: inline-block;vertical-align: top;width: 22px;height: 22px;text-align: center;background-color: #e62022;color: #fff;margin-right: 10px;border-radius: 3px;line-height: 22px;}
.seo-4 li:hover {-webkit-transform: scale(1.02);transform: scale(1.02);}
.seo-4 li em {font-style: normal;color: #e62022;}
.seo-4 .more {display: block;line-height: 44px;width: 180px;text-align: center;margin: -20px auto 0;background-color: #e62022;color: #fff;font-size: 16px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.seo-4 .more:hover {background-color: #000;}

.seo-5 {font-size: 0;margin-left: -50px;text-align: center;}
.seo-5 li {display: inline-block;vertical-align: middle;width: 20%;}
.seo-5 li .wrap {margin: 0 0 0 50px;}
.seo-5 li .m {background: url(../images/img10_2.png) no-repeat center / contain;height: 180px;}
.seo-5 li .m i {display: block;background: no-repeat center / contain;height: 77.77%;}
.seo-5 li .m i.i1 {background-image: url(../images/ys1.png);}
.seo-5 li .m i.i2 {background-image: url(../images/ys2.png);}
.seo-5 li .m i.i3 {background-image: url(../images/ys3.png);}
.seo-5 li .m i.i4 {background-image: url(../images/ys4.png);}
.seo-5 li .m i.i5 {background-image: url(../images/ys5.png);}
.seo-5 li .wrap:hover .m i.i1 {background-image: url(../images/ys11.png);}
.seo-5 li .wrap:hover .m i.i2 {background-image: url(../images/ys22.png);}
.seo-5 li .wrap:hover .m i.i3 {background-image: url(../images/ys33.png);}
.seo-5 li .wrap:hover .m i.i4 {background-image: url(../images/ys44.png);}
.seo-5 li .wrap:hover .m i.i5 {background-image: url(../images/ys55.png);}
.seo-5 li h4 {margin: 15px 0;font-size: 20px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.seo-5 li p {margin: 0;font-size: 14px;color: #666;}

.about-1 {margin: 0;}
.about-1 .text {margin-top: 50px;text-align: justify;font-size: 16px;line-height: 1.8;}
.about-1 .text p {margin: 0;;}
.about-1 .in-total {margin-top: 50px;background: none;color: #333;}
.about-1 .in-total li {padding: 0;}

.about-2 {background-image: url(../images/xuanzebg.jpg);}
.about-2 .logo {margin-bottom: -80px;}
.about-2 .logo img {-webkit-animation: none;animation: none;}

.about-3 {margin: -20px 0 0 -20px;}
.about-3 li {float: left;width: 33.333333%;}
.about-3 li a {display: block;border: 1px solid #eaeaea;padding: 20px;margin: 20px 0 0 20px;}
.about-3 li h4 {font-size: 24px;margin: 0;font-weight: normal;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.about-3 li p {margin: 10px 0 0;height: 40px;overflow: hidden;}
.about-3 li a:hover {box-shadow: 0 0 30px #eeeeee;}

.about-3-more {margin-top: 40px;text-align: center;font-size: 0;}
.about-3-more a {display: inline-block;background-color: #e62022;color: #fff;border-radius: 50px;font-size: 22px;line-height: 45px;width: 400px;vertical-align: middle;margin: 0 20px;}
.about-3-more a:last-child {background-color: #000;}

.table-1 img {display: inline-block;vertical-align: middle;}
.table-1 table {width: 100%;border-collapse: collapse;background-color: #fff;font-size: 16px;}
.table-1 tr:nth-child(odd) {background-color: #eee;}
.table-1 th,.table-1 td {border: 1px solid #ddd;padding: 15px 20px;}
.table-1 th {text-align: center;font-weight: normal;font-size: 18px;color: #fff;}
.table-1 th:first-child {width: 180px;background-color: #474747;}
.table-1 th:nth-child(2) {background-color: #e62022;}
.table-1 th:last-child {background-color: #8e8e8e;}
.table-1 td:first-child {color: #888;}

.map {height: 500px;}

.contact-left {float: left;width: 750px;}
.contact-left .tel {font-size: 20px;margin-bottom: 30px;}
.contact-left .tel strong {font-weight: bold;font-size: 34px;color: #e62022;}
.contact-left li {background: no-repeat 0 0;border-bottom: 1px dashed #cac9c9;padding-left: 45px;font-size: 18px;padding-bottom: 15px;margin-bottom: 15px;line-height: 1.8;}
.contact-left li.i1 {background-image: url(../images/conatct_icon2.png);}
.contact-left li.i2 {background-image: url(../images/conatct_icon3.png);}
.contact-left li.i3 {background-image: url(../images/zuoxi.png);}
.contact-left li.i4 {background-image: url(../images/conatct_icon1.png);}

.contact-right {float: right;width: 370px;}
.contact-right .tit {font-size: 16px;}
.contact-right .tit img {vertical-align: middle;}
.contact-right dl {margin: 20px 0 0;overflow: hidden;}
.contact-right dt {float: left;width: 152px;border: 1px solid #ebebeb;}
.contact-right dd {margin-left: 170px;}
.contact-right dd h4 {font-size: 26px;font-weight: normal;margin: 0;}
.contact-right dd p {margin: 15px 0 0;font-size: 16px;color: #999;}

.v-lanmu {float: right;width: 300px;margin-right: 60px;}

.v-lanmu li { margin-bottom: 10px; transition: all 0.5s; }


.v-lanmu li a.v-lanmu-link { display: flex; flex-direction: column; align-items: stretch; width: 100%; }
.v-lanmu li .v-lanmu-img { width: 100%; height: 0; padding-right: -15px; padding-bottom: 133.33%; position: relative; overflow: hidden; }
.v-lanmu li .v-lanmu-img img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.v-lanmu li .v-lanmu-text { margin-top: 15px; padding: 15px 0; border-top: 2px solid #ddd; text-align: center; transition: border-color 0.3s; }
.v-lanmu li a.v-lanmu-link:hover .v-lanmu-text { border-top-color: #fff; }
.v-lanmu li:hover { transform: translateY(-5px); box-shadow: 0 5px 15px rgba(0,0,0,0.15); border-color: #e62022; }.v-lanmu li a {display: block;width: 100%;padding: 25px;border: 1px solid #ddd;background-color: #fff;border-radius: 8px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.v-lanmu li strong {display: block;line-height: 1.1;margin-bottom: 5px;}
.v-lanmu li:hover a { background-color: #e62022; color: #fff; border-color: #e62022; }
.v-main {float: left; width: calc(100% - 400px); border-radius: 8px; overflow: hidden; box-sizing: border-box;}

.h-lanmu {font-size: 0;margin-bottom: 20px;}
.h-lanmu li:first-child { margin-left: 30px; }
.h-lanmu li {display: inline-block;vertical-align: middle;margin: 0 10px 10px 0;}
.h-lanmu li a {display: block;padding: 0 30px;line-height: 50px;background-color: #fff;font-size: 16px;}
.h-lanmu li a:hover,.h-lanmu li.active a {background-color: #e62022;color: #fff;}

.list-3 li {margin-bottom: 20px;}
.list-3 li a {display: block;overflow: hidden;background-color: #fff;padding: 20px;}
.list-3 li .img-center {float: left;width: 204px;}
.list-3 li .text {margin-left: 224px;}
.list-3 li .text h4 {margin: 0;font-size: 22px;font-weight: normal;}
.list-3 li .text p {color: #999;margin: 15px 0 0;line-height: 1.7;}
.list-3 li .text span {display: block;margin-top: 15px;font-size: 12px;color: #999;}
.list-3 li a:hover {box-shadow: 0 0 20px #eeeeee;}

.banner-content .inner {vertical-align: bottom;}
.content-title {text-align: left;margin-bottom: 40px;}
.content-title h1 {font-size: 38px;margin: 0;}
.content-title p {font-size: 0;margin: 20px 0 0;}
.content-title p span {display: inline-block;vertical-align: middle;font-size: 14px;margin-right: 30px;}
.content-main,.content-xg {background-color: #fff;padding: 30px;}
.content-body {line-height: 1.8;}
.content-body img {max-width: 100% !important;height: auto !important;width: auto !important;}
.content-exp {border-top: 1px dashed #ccc;padding-top: 20px;overflow: hidden;margin-top: 20px;}
.content-exp li {
  float: left;
  width: 50%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;}
.content-exp li:last-child {text-align: right;}
.content-tips {border-top: 1px dashed #ccc;padding-top: 20px;margin-top: 20px;line-height: 1.8;color: #e62022;}
.content-tips .ss {padding: 2px 6px;background-color: #e62022;color: #fff;}
.content-xg {margin-top: 10px;width: calc(100% - 400px);clear: both;border-radius: 8px;overflow: hidden;display: flex;gap: 30px;box-sizing: border-box;}
.content-xg-left {flex: 1;box-sizing: border-box;}
.content-xg-right {flex: 1;box-sizing: border-box;}
.content-xg .tit {line-height: 1;border-left: 6px solid #e62022;font-size: 24px;padding-left: 15px;margin-bottom: 20px;}
.content-xg li {color: #666;line-height: 30px;list-style: disc;list-style-position: inside;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.content-xg li span {float: right;font-size: 12px;color: #999;}


.webdes {margin: 10px 0 0 -20px;}
.webdes li {float: left;width: 25%;}
.webdes li a {display: block;margin: 30px 0 0 20px;background-color: #fff;text-align: center;border: 2px #efefef solid;line-height: 98px;font-size: 24px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-transition: all 0.5s;transition: all 0.5s;}
.webdes li a:hover {border-color: #e62022;color: #e62022;}

/* [2026-10-11] 旧案例详情页标题块（深色 .content-case-title 系列）已随 case.html 改版停用，
   模板中不再引用，规则一并删除；新版标题信息卡样式见下方「cshow-」区块 */

.content-case-xg .tit {font-size: 28px;margin-bottom: 40px;}

.list-4 {margin: -40px 0 0 -40px;}
.list-4 li {float: left;width: 33.333333%;}
.list-4 li a {display: block;background-color: #fff;margin: 40px 0 0 40px;}
.list-4 li .img-cover {padding-top: 71%;}
.list-4 li .text {padding: 20px;}
.list-4 li .text h4 {font-weight: normal;margin: 0;font-size: 22px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.list-4 li .text p {margin: 10px 0 0;color: #888;height: 40px;overflow: hidden;}
.list-4 li a:hover .img-cover span {-webkit-transform: scale(1.1);transform: scale(1.1);}

/* --- [2026-10-11] 案例详情页改版（case.html）：标题信息卡（含微信/电话咨询卡）+ 单栏作品区 ---
   版式参照凡高网络与 k686（标题 + 双按钮 + 效果图展示区），左侧栏已按用户要求移除；
   前缀 cshow-（case show），只作用于本页，不复用被 news/moban 共用的 content-* 规则 */
.banner-csanim.csa-case {height: 440px;}
.cshow {padding: 46px 0 0;}
.cshow .container {max-width: 1400px;}
/* 标题信息卡 */
/* [2026-10-11] 左右栏互换：按钮栏在左（300px），标题+微信/电话咨询卡在右 */
/* [2026-10-11o] 左右两栏合并为单框（标题/元信息/咨询卡 + 白线下方双按钮），不再分左右 grid */
.cshow-head {background: #fff;border: 1px solid #f0f0f0;border-radius: 18px;padding: 40px 44px;box-shadow: 0 12px 34px rgba(0,0,0,.06);}
/* [2026-10-11m2] 元信息移到标题下方（分类胶囊已删） */
.cshow-meta {margin-top: 14px;font-size: 0;}
.cshow-meta span {display: inline-block;margin-right: 18px;font-size: 13px;color: #999;letter-spacing: .5px;}
.cshow-head h1 {margin: 0;font-size: 34px;line-height: 1.4;color: #1a1a1a;letter-spacing: 1px;}
/* [2026-10-11] 微信二维码 + 立即咨询（替代原「项目简介」，浅绿渐变卡——微信绿基调，2026-10-11 由粉红换色） */
/* [2026-10-11p] 咨询卡浅灰底 + 加大上下内边距（[2026-10-11s] 上内边距再 +20px） */
.cshow-kf {margin-top: 30px;padding: 56px 30px 34px;border-radius: 16px;background: -webkit-linear-gradient(315deg,#f9fafb 0%,#f2f3f6 100%);background: linear-gradient(135deg,#f9fafb 0%,#f2f3f6 100%);border: 1px solid #ecedf1;}
/* [2026-10-11p] 白线下方：二维码列 + 右侧电话（上方为按钮行，故分隔线在 .cshow-kf-top 上）；[2026-10-11t] 整块水平居中 */
.cshow-kf-top {display: -webkit-box;display: -ms-flexbox;display: flex;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;gap: 34px;margin-top: 38px;padding-top: 36px;border-top: 1px solid rgba(255,255,255,.95);}
/* 二维码列：图在上、「扫一扫在线咨询」在下 */
.cshow-kf-qrc {-webkit-box-flex: 0;-ms-flex: 0 0 auto;flex: 0 0 auto;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;align-items: center;gap: 10px;}
/* [2026-10-11m2] 二维码加扫描光带动效 */
.cshow-kf-qr {position: relative;overflow: hidden;padding: 7px;border-radius: 12px;background: #fff;box-shadow: 0 8px 18px rgba(64,140,100,.16);}
.cshow-kf-qr:after {content: '';position: absolute;left: 4px;right: 4px;top: -30px;height: 28px;border-radius: 6px;background: linear-gradient(180deg,rgba(64,190,120,0) 0%,rgba(64,190,120,.3) 75%,rgba(64,190,120,.5) 100%);-webkit-animation: cshowScan 2.6s ease-in-out infinite;animation: cshowScan 2.6s ease-in-out infinite;pointer-events: none;}
/* 用 top 百分比扫过（不依赖二维码尺寸，手机缩小后依然扫满全程） */
@-webkit-keyframes cshowScan {0% {top: -30px;opacity: 0;}12% {opacity: 1;}88% {opacity: 1;}100% {top: 100%;opacity: 0;}}
@keyframes cshowScan {0% {top: -30px;opacity: 0;}12% {opacity: 1;}88% {opacity: 1;}100% {top: 100%;opacity: 0;}}
.cshow-kf-qr img {display: block;width: 120px;height: 120px;object-fit: contain;border-radius: 6px;}
.cshow-kf-tip {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;align-items: center;gap: 8px;color: #2f7a52;font-size: 14px;letter-spacing: 1px;white-space: nowrap;}
.cshow-kf-tip svg {display: block;width: 22px;height: 22px;color: #3d8a60;}
/* [2026-10-11q] 白线上方双按钮居中 */
.cshow-kf-bot {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;justify-content: center;gap: 36px;}
.cshow-kf-bot .cshow-btn {-webkit-box-flex: 1;-ms-flex: 1 1 0;flex: 1 1 0;max-width: 220px;}
.cshow-kf-bot .cshow-btn2 {background: #fff;box-shadow: 0 6px 14px rgba(0,0,0,.04);}
.cshow-kf-bot .cshow-btn2:hover {background: #fff;}
.cshow-kf-nums {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;gap: 4px;min-width: 0;}
.cshow-kf-nums em {font-style: normal;font-size: 14px;color: #5c8f74;letter-spacing: 3px;}
.cshow-kf-numlist {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;gap: 4px 34px;}
/* [2026-10-11m2] 电话号码字号调小、改深绿（不用黑色），悬停同色系加深 */
.cshow-kf-numlist a {font-size: 24px;font-weight: 800;line-height: 1.35;letter-spacing: 1px;color: #2f7a52;-webkit-transition: color .3s ease;transition: color .3s ease;}
.cshow-kf-numlist a:hover {color: #1f5c3c;}
/* [2026-10-11o] .cshow-head-r（左栏按钮框）已随左右栏合并移除，按钮移入 .cshow-kf-bot */
.cshow-btn {display: -webkit-box;display: -ms-flexbox;display: flex;align-items: center;justify-content: center;gap: 8px;height: 50px;border-radius: 999px;font-size: 16px;letter-spacing: 1px;-webkit-transition: background-color .35s ease,border-color .35s ease,color .35s ease,box-shadow .35s ease,-webkit-transform .35s ease;transition: background-color .35s ease,border-color .35s ease,color .35s ease,box-shadow .35s ease,transform .35s ease;}
.cshow-btn svg {display: block;width: 18px;height: 18px;}
.cshow-btn1 {background: #e62022;color: #fff;box-shadow: 0 10px 22px rgba(230,32,34,.26);}
.cshow-btn1:hover {background: #c91416;box-shadow: 0 14px 28px rgba(230,32,34,.34);-webkit-transform: translateY(-3px);transform: translateY(-3px);color: #fff;}
.cshow-btn2 {background: #fff;color: #e62022;border: 1px solid rgba(230,32,34,.5);}
.cshow-btn2:hover {background: #fff1f0;border-color: #e62022;-webkit-transform: translateY(-3px);transform: translateY(-3px);color: #e62022;}
/* [2026-10-11r] 标题与元信息居中 */
.cshow-head h1 {text-align: center;}
.cshow-meta {text-align: center;}
/* [2026-10-11r] 白色正文内容卡已按用户要求整块移除（.cshow-main/.cshow-body 样式同步清理），页面为标题卡→相关案例 */
/* 上一篇 / 下一篇（[2026-10-11q] 移入灰色咨询卡底部；[2026-10-11r] 加缩略图，样式参照 k460） */
.cshow-nav {display: grid;grid-template-columns: 1fr 1fr;gap: 18px;list-style: none;margin: 36px 0 0;padding: 32px 0 0;border-top: 1px dashed rgba(255,255,255,.95);font-size: 14px;}
.cshow-nav li {min-width: 0;}
.cshow-nav .cshow-nav-item {display: -webkit-box;display: -ms-flexbox;display: flex;align-items: center;gap: 14px;min-width: 0;color: inherit;}
.cshow-nav .cshow-nav-thumb {-webkit-box-flex: 0;-ms-flex: 0 0 auto;flex: 0 0 auto;width: 96px;height: 64px;border-radius: 8px;overflow: hidden;background: #e8ebee;}
.cshow-nav .cshow-nav-thumb img {display: block;width: 100%;height: 100%;object-fit: cover;-webkit-transition: opacity .3s ease,transform .45s ease;transition: opacity .3s ease,transform .45s ease;}
.cshow-nav .cshow-nav-item:hover .cshow-nav-thumb img {opacity: .85;-webkit-transform: scale(1.06);transform: scale(1.06);}
.cshow-nav .cshow-nav-txt {-webkit-box-flex: 1;-ms-flex: 1 1 auto;flex: 1 1 auto;min-width: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;gap: 5px;}
.cshow-nav .cshow-nav-txt em {font-style: normal;font-size: 13px;color: #8a949e;letter-spacing: 2px;}
.cshow-nav .cshow-nav-txt strong {font-weight: 600;font-size: 15px;color: #333;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-transition: color .3s ease;transition: color .3s ease;}
.cshow-nav .cshow-nav-item:hover .cshow-nav-txt strong {color: #e62022;}
.cshow-nav .cshow-nav-item.is-empty {opacity: .55;}
.cshow-nav li.next {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;}
.cshow-nav li.next .cshow-nav-txt {-webkit-box-align: end;-ms-flex-align: end;align-items: flex-end;}
/* 相关案例 */
.cshow-xg {padding: 56px 0 70px;}
.cshow-xg .container {max-width: 1400px;}
/* [2026-10-11] 相关案例卡片加圆角（.list-4 被 web.html 共用，故限定 .cshow-xg 作用域）；摘要已删，标题垂直居中 */
/* [2026-10-11q] 相关案例改一排 4 个（.list-4 被 web.html 共用需限定作用域），卡片尺寸随列宽缩小 */
.cshow-xg .list-4 li {width: 25%;}
.cshow-xg .list-4 li a {border-radius: 16px;overflow: hidden;-webkit-transition: box-shadow .45s ease,-webkit-transform .45s cubic-bezier(.2,.7,.3,1);transition: box-shadow .45s ease,transform .45s cubic-bezier(.2,.7,.3,1);}
.cshow-xg .list-4 li a:hover {box-shadow: 0 18px 36px rgba(0,0,0,.1);-webkit-transform: translateY(-6px);transform: translateY(-6px);}
.cshow-xg .list-4 li .text {display: -webkit-box;display: -ms-flexbox;display: flex;align-items: center;min-height: 66px;padding-top: 16px;padding-bottom: 16px;}
.cshow-xg .list-4 li .text h4 {font-size: 19px;}

/* --- 案例详情页自适应 --- */
@media (max-width: 1199px) {
  .cshow-head {padding: 34px 32px;}
  .cshow-head h1 {font-size: 30px;}
  .cshow-kf {margin-top: 26px;padding: 52px 26px 30px;}
  .cshow-kf-top {gap: 28px;margin-top: 24px;padding-top: 22px;}
  .cshow-kf-numlist a {font-size: 21px;}
}
@media (max-width: 991px) {
  .banner-csanim.csa-case {height: 360px;}
  .cshow {padding: 34px 0 0;}
  .cshow-head {padding: 30px 26px;}
  .cshow-main {margin-top: 24px;}
  .cshow-xg {padding: 40px 0 50px;}
}
@media (max-width: 767px) {
  .banner-csanim.csa-case {height: 300px;}
  .banner-csanim.csa-case .banner-sub-txt h2 {font-size: 30px;letter-spacing: 3px;}
  .banner-csanim.csa-case .banner-sub-txt p {font-size: 14px;letter-spacing: 1px;}
  .cshow {padding: 24px 0 0;}
  .cshow-head {padding: 24px 20px;border-radius: 14px;}
  .cshow-head h1 {font-size: 23px;}
  .cshow-meta {margin-top: 10px;}
  .cshow-meta span {margin-right: 12px;font-size: 12px;}
  .cshow-kf {margin-top: 20px;padding: 44px 16px 22px;}
  .cshow-kf-top {gap: 16px;margin-top: 20px;padding-top: 18px;}
  .cshow-kf-qr {padding: 6px;border-radius: 10px;}
  .cshow-kf-qr img {width: 76px;height: 76px;}
  .cshow-kf-qrc {gap: 8px;}
  .cshow-kf-tip {font-size: 13px;letter-spacing: 0;gap: 6px;}
  .cshow-kf-tip svg {width: 18px;height: 18px;}
  .cshow-kf-bot {gap: 10px;}
  .cshow-kf-bot .cshow-btn {height: 44px;font-size: 15px;}
  .cshow-kf-nums em {font-size: 13px;letter-spacing: 2px;}
  .cshow-kf-numlist {gap: 2px 18px;}
  .cshow-kf-numlist a {font-size: 17px;letter-spacing: .5px;}
  /* [2026-10-11r] 相关案例手机端恢复一排 2 个；上/下案例在灰卡内改单列、缩略图缩小 */
  .cshow-nav {grid-template-columns: 1fr;gap: 12px;font-size: 13px;margin-top: 20px;padding-top: 16px;}
  .cshow-nav .cshow-nav-thumb {width: 76px;height: 50px;border-radius: 6px;}
  .cshow-nav .cshow-nav-txt strong {font-size: 14px;}
  .cshow-xg .list-4 li {width: 50%;}
  .cshow-xg .list-4 li .text h4 {font-size: 16px;}
  .cshow-xg {padding: 30px 0 40px;}
  .cshow-xg .list-4 li a {border-radius: 12px;}
}
/* 减弱动效偏好 */
@media (prefers-reduced-motion: reduce) {
  .cshow-btn {transition: none;}
  .cshow-kf-qr:after {-webkit-animation: none;animation: none;}
}

.wzjs-1 {margin-bottom: 40px;}
.wzjs-1 .pic {float: left;padding: 10px;width: 450px;background: url(../images/bj_12.jpg) center no-repeat;height: 305px;}
.wzjs-1 .pic .img-center {height: 305px;line-height: 305px;}
.wzjs-1 .info {margin-left: 500px;}
.wzjs-1 .info h1 {margin: 0;font-size: 0;font-weight: normal;}
.wzjs-1 .info h1 span,.wzjs-1 .info h1 small {display: inline-block;vertical-align: middle;}
.wzjs-1 .info h1 span {font-size: 32px;margin-right: 15px;}
.wzjs-1 .info h1 small {font-size: 14px;color: #fff;line-height: 26px;padding: 0 4px;}
.wzjs-1 .text {padding: 15px;background: url(../images/conbg_03.jpg) repeat center;margin-top: 20px;}
.wzjs-1 .text .item {overflow: hidden;margin-bottom: 15px;}
.wzjs-1 .text .item.sb-bb {margin-bottom: 0;}
.wzjs-1 .text .sb-it {display: inline-block;vertical-align: middle;margin-right: 15px;margin-bottom: 15px;}
.wzjs-1 .text .label {float: left;font-size: 12px;line-height: 22px;padding: 0 5px;border: 1px solid #aaaaaa;color: #828282;}
.wzjs-1 .text .con {margin-left: 70px;line-height: 24px;}
.wzjs-1 .text .con strong {color: #e62022;font-size: 20px;}
.wzjs-1 .text .tag {font-size: 0;margin-bottom: -10px;}
.wzjs-1 .text .tag span {font-size: 12px;line-height: 22px;padding: 0 5px;border: 1px solid #333;color: #333;display: inline-block;vertical-align: middle;margin-right: 10px;margin-bottom: 10px;}
.wzjs-1 .text .btn {margin-top: 40px;font-size: 0;}
.wzjs-1 .text .btn a {display: inline-block;font-size: 14px;vertical-align: middle;margin: 10px 10px 0 0;position: relative;border: 1px solid #666;color: #666;line-height: 30px;text-align: center;padding: 0 20px;}
.wzjs-1 .text .btn .img-center {position: absolute;top: 100%;background-color: #666;left: 50%;width: 100px;padding: 5px;margin-left: -55px;display: none;z-index: 1;}
.wzjs-1 .text .btn a:hover {background-color: #666;color: #fff;}
.wzjs-1 .text .btn a:hover .img-center {display: block;}
.wzjs-1 .text .btn a:first-child {background-color: #e62022;color: #fff;border-color: #e62022;}
.wzjs-1 .text .btn a:last-child {background-color: #000;color: #fff;border-color: #000;}

.wzjs-box {margin-bottom: 40px;}
.wzjs-tit {margin-bottom: 20px;border-bottom: 2px solid #d7d7d7;line-height: 22px;}
.wzjs-tit span {display: inline-block;font-size: 22px;border-bottom: 2px solid #e62022;margin-bottom: -2px;padding-bottom: 10px;}
.wzjs-tit span i {display: inline-block;vertical-align: top;line-height: 22px;width: 22px;text-align: center;color: #fff;background-color: #e62022;border-radius: 50%;font-style: normal;font-size: 14px;margin-right: 10px;}
.wzjs-tit em {float: right;font-size: 12px;color: #999;font-style: normal;}

.wzjs-2 {margin-bottom: 20px;font-size: 20px;color: #666;}
.wzjs-2 .tel {float: right;color: #e62022;background: url(../images/gw.jpg) no-repeat 0 center;padding-left: 30px;}
.wzjs-2 strong {color: #e62022;}

.table-2 table {width: 100%;border-collapse: collapse;background-color: #fff;line-height: 1.8;}
.table-2 th,.table-2 td {border: 1px solid #ddd;padding: 12px 20px;}
.table-2 th {font-size: 16px;font-weight: normal;background-color: #f5f6f7;}
/* [2026-10-12] 项目栏（第一列）110→156px（含内边距后整列 152→198px，+30%）；gongneng-desc 说明表格被定制建站页与模板建站页共用，同步生效
   [2026-10-12e2] 原 c-c3.jpg 背景图（152px 宽，自带白竖线+渐变分隔线）按 right 定位后随列加宽错位、白线露在列中间 → 弃用背景图改纯色，分隔线用既有 border */
.table-2 th:first-child,.table-2 td:first-child {width: 156px;background-color: #f5f6f7;}
.table-2 th:last-child,.table-2 td:last-child {width: 200px;}
.table-2 td {color: #666;}
.table-2 td img {display: inline-block;vertical-align: middle;}
.table-2 td .btn {display: inline-block;padding: 2px 12px;background-color: #e62022;color: #fff;}

.wybzd {text-align: center;font-size: 16px;line-height: 2;margin: -20px 0 40px;}
.wybzd p {margin: 0;}

.wzjs-3 li {float: left;width: 16.666666666%;}
.wzjs-3 li .wrap {padding: 10px 20px;text-align: center;}
.wzjs-3 li .img-center {height: 42px;line-height: 42px;-webkit-transition: all 0.5s;transition: all 0.5s;}
.wzjs-3 li p {margin: 10px 0 0;font-size: 16px;}
.wzjs-3 li .wrap:hover {box-shadow: 0 0 26px #d2d2d2;}
.wzjs-3 li .wrap:hover .img-center {-webkit-transform: rotateY(360deg);transform: rotateY(360deg);}
.wzjs-3-tips {margin-top: 20px;padding: 5px 15px;border: 1px solid #e62022;}
.wzjs-3-tips p {margin: 10px 0;}
.wzjs-3-tips p strong {color: #fe6700;}

.wzjs-4 li {float: left;width: 12.5%;}
.wzjs-4 li .wrap {position: relative;}
.wzjs-4 li .wrap:after {content: '';position: absolute;width: 27px;height: 34px;background: url(../images/lc_85.jpg) no-repeat center / cover;top: 13px;right: -13px;}
.wzjs-4 li .img-center {height: 60px;line-height: 60px;}
.wzjs-4 li p {margin: 10px 0 0;text-align: center;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.wzjs-4 li:last-child .wrap:after {display: none;}

.wzjs-5 {position: relative;}
.wzjs-5 .bg {position: absolute;left: 50%;top: 0;background: url(../images/shzb_97.jpg) no-repeat center / contain;width: 28px;height: 100%;margin-left: -14px;}
.wzjs-5 .wzjs-box {width: 520px;}
.wzjs-5 .text {color: #666;line-height: 1.8;}
.wzjs-5-left {float: left;background: url(../images/bg-bg_03.jpg) no-repeat right bottom;}
.wzjs-5-right {float: right;background: url(../images/bg-bg_05.jpg) no-repeat right bottom;}

.wzjs-6 {margin: 0;}
.wzjs-6 dt {float: right;width: 600px;}
.wzjs-6 dd {margin: 0 700px 0 100px;padding-top: 60px;}
.wzjs-6 dd p {margin: 0 0 15px;line-height: 2;font-size: 16px;background-color: #ececec;padding: 0 20px;border-left: 10px solid #e79d22;}

.more-big-2 {display: block;margin: 40px auto 0;line-height: 48px;font-size: 16px;width: 260px;text-align: center;background-color: #ababab;border-radius: 50px;color: #fff !important;}
.more-big-2:hover {background-color: #737373;}

.wzjs-7 {position: relative;}
.wzjs-7 .bg {position: absolute;left: 692px;top: 0;background: url(../images/shzb_97.jpg) no-repeat center / contain;width: 28px;height: 100%;}
.wzjs-7 dl {margin: 0 0 20px;overflow: hidden;}
.wzjs-7 dt {float: left;color: #fff;text-align: center;width: 83px;background: url(../images/psd_123.jpg) no-repeat center 0 / contain;font-size: 22px;padding-top: 10px;height: 92px;}
.wzjs-7 dd {margin-left: 110px;}
.wzjs-7 dd h4 {margin: 0;font-size: 22px;font-weight: normal;}
.wzjs-7 dd p {margin: 15px 0 0;color: #9d9d9d;line-height: 1.8;}
.wzjs-7 .list li {color: #666;line-height: 40px;list-style: disc;list-style-position: inside;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 16px;border-bottom: 1px  dashed #d7d8d8;}
.wzjs-7 .list li span {float: right;font-size: 12px;color: #999;}
.wzjs-7 .menu {overflow: hidden;margin: 0 0 0 -20px;padding-top: 72px;}
.wzjs-7 .menu li {float: left;}
.wzjs-7 .menu li a {display: block;margin: 0 0 20px 20px;line-height: 30px;padding: 0 30px;border-radius: 30px;background-color: #e5e5e5;}
.wzjs-7 .menu li.active a {background-color: #e62022;color: #fff;}
.wzjs-7 .more {display: inline-block;font-size: 16px;margin-top: 20px;}
.wzjs-7-left {float: left;width: 680px;padding-right: 40px;}
.wzjs-7-right {float: right;width: 460px;}

.taocan_titleo {display: block;text-align: center;background-color: #333;color: #fff;font-size: 16px;width: 500px;margin: 30px auto 0;padding: 10px;border-radius: 20px;}

.case-wrap {max-width: 1920px;width: 90%;margin: 0 auto;min-width: 0;}

@media screen and (max-width: 1200px){
.center {
    width: 100%;
}
	
}
@media screen and (max-width: 450px){
.box_tit p {
    font-size: 1rem;
}
.pro_screen ul li {
    width: 31.33%;
    margin: 1%;
}
.pro_screen ul li a {
    width: 100%;
}
.flex_between {
    padding-bottom: 15px;
}
.case_list ul li .text h3 {
    font-size: .118rem;
    line-height: .2rem;
    margin-top: 10px;
    padding: 0;
    padding-bottom: 5px;
    height: .4rem;
    overflow: hidden;
}
.case_list ul li .text2 {
    padding: 0;
}

.case_list ul li .text2 span {
    font-size: .09rem;
    margin-top: 8px;
}
.case_list ul li .text2 span i {
    font-size: .14rem;
}

.case_list ul li .text2 span {
    font-size: .09rem;
    margin-top: 8px;
}

.case_list ul li .text2 a {
    display: none;
}


}

.oneform input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color: #fff;opacity: 0.7;}
.oneform input:-moz-placeholder, textarea:-moz-placeholder {color: #fff;opacity: 0.7;}
.oneform input::-moz-placeholder, textarea::-moz-placeholder {color: #fff;opacity: 0.7;}
.oneform input:-ms-input-placeholder, textarea:-ms-input-placeholder {color: #fff;opacity: 0.7;}

.oneform {position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 9;display: none;}
.oneform .mask {position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.7);}
.onebox {position: absolute;left: 50%;top: 50%;width: 930px;margin-left: -465px;background-color: #ed1c24;color: #fff;margin-top: -260px;}
.onebox-wrap {border: 1px #fff dashed;margin: 15px;padding: 35px;}
.onebox .close {float: right;width: 42px;height: 42px;background: url(../images/tc_btn_1.png) no-repeat center / contain;-webkit-transition: all 0.5s;transition: all 0.5s;}
.onebox .close:hover {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
.onebox .tit {margin-bottom: 35px;font-size: 40px;background: no-repeat 0 center / contain;padding-left: 245px;}
.onebox ul {margin: -15px 0 0 -15px;}
.onebox li {float: left;width: 50%;}
.onebox li.full {width: 100%;}
.onebox li .wrap {margin: 15px 0 0 15px;overflow: hidden;border: 1px #e7a8aa solid;border-radius: 8px;}
.onebox li i {float: left;background: no-repeat center / contain;width: 54px;height: 54px;}
.onebox li i.i1 {background-image: url(../images/tc_ico_1.png);}
.onebox li i.i2 {background-image: url(../images/tc_ico_2.png);}
.onebox li i.i3 {background-image: url(../images/tc_ico_3.png);}
.onebox li i.i4 {background-image: url(../images/tc_ico_4.png);}
.onebox li i.i5 {background-image: url(../images/tc_ico_5.png);}
.onebox li input {display: block;margin-left: 54px;border: none;background: none;box-shadow: none;color: #fff;font-size: 16px;line-height: 30px;padding: 12px;width: 326px;}
.onebox li textarea {display: block;border: none;background: none;box-shadow: none;color: #fff;font-size: 16px;line-height: 30px;padding: 12px;width: 380px;}
.onebox li.full textarea {width: 802px;}
.onebox li.yzm img {float: right;height: 54px;width: 120px;}
.onebox li.yzm input {width: 190px;}
.onebox .submit {display: block;border: 0;height: 54px;width: 100%;cursor: pointer;font-size: 20px;color: #d32329;background: #fff;}
.onebox .submit:hover {background-color: #ed1c24;color: #fff;}

.weizhi {float: right;font-size: 14px;}
.weizhi a {color: #fff;}
.weizhi em {font-style: normal;padding: 0 5px;}

.admin_buy_cn {text-align: center;}
.admin_buy_cn img{ max-width:100% !important; height:auto !important; display:inline-block; text-align:left;}
.admin_buy_cn p{text-wrap: inherit !important;}
.admin_buy_cn p span{text-wrap: inherit !important;}

@media screen and (max-width: 767px) {
    /* padding-top 必须等于手机端顶栏实际高度（63px = 13+36+13+1px 下边框），否则首屏会被顶栏压住
       [2026-10-05] 随顶栏加高 50px→63px */
    body {min-width: 320px;padding-top: 63px;padding-bottom: 58px;}
    .container {width: auto;}

.box_tit {
    margin: 20px 0;
}
.box_tit span {
    font-size: 2rem;
}
.box_tit p {
    padding: 0 8%;
}
.pro_screen {
    padding: 20px 0;
}
.pro_screen ul {
    padding-left: 70px;
}
.pro_screen ul li:first-child {
    position: absolute;
    left: 0;
    
}
.pro_screen ul li a {
    width: 100px;
    padding: 6px 0;
    border: 1px solid #ddd;
    text-align: center;
}

.flex_between {
    padding-top: 0;
    width: 90%;
    margin: 0 5%;
}
.flex_between .text {
    width: 100%;
}
.flex_between .search {
    width: 100%;
    padding-right: 0;
    margin-top: 15px;
}
.flex_between .search input[type="text"] {
    width: 60%;
    
       
    border: 1px solid #ddd;
   
    float: left;
    padding: 0 10px;
    outline: 0;
}


.flex_between .search input[type="submit"] {
    width: 30%;
}
.case_list ul li {
    width: 40.5%;
    margin: 2%;
}

.case_list ul li:nth-child(3n) {
    margin-right: 2%;
}

.case_list ul li .text3{
    display: none;
}



    .kf-conct {display: none;}
    .footer-fix {display: block;}

    /* [2026-10-05 三次调整] 顶栏背景改为「初始不透明、滚动到首屏图片上才半透明」：
         · 初始（未滚动，无 .xg）：纯黑不透明 #000 —— 首屏顶部干净利落
         · 滚动 >50px（JS 在 ≤767 也会给 header 加 .xg，见 style.js 导航滚动变色）：
           转为 50% 半透明 rgba(0,0,0,.5)，透过顶栏能隐约看到下方图片/内容
       两条必须都写：只写 .header 的话，滚动后会被 PC 端通用规则 .header.xg{background:#fff}
       抢走变成白底（PC 规则第 366 行），与手机端设定冲突。
       颜色过渡沿用 PC 通用 .header 的 transition:all .5s ease（第 365 行），无需另写 */
    /* [2026-10-05] 顶栏加高 + logo 放大 20%：padding 10px→13px、logo 30px→36px，
       顶栏总高 51px→63px（13+36+13+1px 下边框）；body 的 padding-top（1319 行）与
       抽屉 .mob-nav 的顶部内边距已同步，保证首屏不被遮、抽屉第一项不贴顶栏
       [2026-10-05 二次调整] logo 再放大、顶栏总高 63px 保持不变：logo 36→42px（+17%），
       上下 padding 13px→10px 让出空间（10+42+10+1px 边框 = 63px，与 body padding-top 仍一致）；
       以后改 logo 高度时，把这里的 padding 改成 (63-1-logo高度)/2 即可维持总高不变 */
    /* [2026-10-05 二次] 白线根除：上一轮把 border-bottom-color 改 transparent 后用户仍看到白线
       —— border 本身还占 1px 盒高，真机上视口取整容易在这条缝里露出 body 白底。
       现在① border-bottom 整条去掉（不占位）② 顶栏加高到 64px（11+42+11），
       而 body 的 padding-top 仍是 63px → 顶栏下沿永远压住内容 1px，任何缝隙都不存在，
       黑色顶栏多盖 1px 图片/内容肉眼不可见。改 logo 高度时同步：padding = (64-logo)/2 */
    .header {background-color: #000;border-bottom: 0;padding: 11px 0;position: fixed;}
    .header.xg {background-color: rgba(0,0,0,.5);border-bottom: 0;padding: 11px 0;position: fixed;}
    .header .logo {height: 42px;padding: 0;line-height: 42px;float: none;}
.header .logo img {height: 42px;width: auto;}
    /* 灰底上固定用白色 logo，禁掉 .xg 的 logo 切换（深色版在灰底上看不清） */
    .header.xg .logo .logo-default {display: block;}
    .header.xg .logo .logo-scroll {display: none;}
    .header .nav {display: none;margin: 10px -15px 0;text-align: left;float: none;}
    .header .nav li {display: block;border-top: 1px solid rgba(255,255,255,0.4);margin: 0;}
    .header .nav li .arr {display: block;}
    .header .nav li a {border-bottom: 0;padding: 0 15px;font-size: 14px;color: #fff !important;line-height: 40px;}
    .header .nav li a span {opacity: 1;}
    .header .nav li.open .arr:after {border-color: #fff;-webkit-transform: rotate(225deg);transform: rotate(225deg);}
    .header .nav .dropdown-box {position: static;width: auto;margin: 0;text-align: left;background-color: #a90002;}
    .header .nav .dropdown-box a {padding: 0 15px;line-height: 40px;}
    .header .nav li.active a, .header .nav li.open a, .header .nav li a:hover {color: #ce2e33;}
    /* [2026-10-05] 汉堡图标放大：三线 20×2px、间距 6px → 26×3px、间距 8px（宽 +30%、粗 +50%，圆角收边）；
       容器 28×36 与 logo 等高（flex 双向居中），因此图标在顶栏里始终与 logo 竖向对齐 */
    .menu-btn {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;width: 28px;height: 42px;margin: 0 0 0 12px;}
    .menu-btn span,.menu-btn span:before,.menu-btn span:after {width: 26px;height: 3px;border-radius: 2px;}
    .menu-btn span:before {top: -8px;}
    .menu-btn span:after {bottom: -8px;}

    /* ===== [2026-10-04] 手机端抽屉导航（参照 namisoft：右侧磨砂抽屉 + 3D 翻转入场 + 手风琴子菜单）=====
       命名沿用本站前缀 mob-*；顶栏保持本站品牌红 + 白色 logo/汉堡，抽屉用白色磨砂玻璃 + 深色文字 */
    .header .nav {display: none !important;}
    /* 电话胶囊 PC 专属：手机端顶栏只有 logo+汉堡，电话走底部导航条 */
    .hd-tel {display: none !important;}
    /* 顶栏抬高到抽屉之上：打开抽屉后右上角仍是 X 关闭钮（参考站同款层级关系） */
    .header {z-index: 998;}
    /* [2026-10-04 v5] 「掀开书页」+ 不抖的关键：把 3D 翻转只留在『书页』本身（纯色矩形），文字不参与旋转
       参考站（namisoft #m_nav）是本翻转期间文字本来就 opacity:0（.6s 后才浮现），所以观感上真正在翻的
       就是那块白色面板。v4 把 rotateY 加在整个抽屉上（含十几行文字 + 10 条 1px 分隔线），手机上每帧都要
       对整块「文字层」按新透视比例重新光栅化 —— 文字边缘/细线逐帧重采样，看起来就是抖/不平滑。
       v5 拆层：.mob-nav 只负责显隐与整体淡入（不做任何变换），:before（纯色书页）单独做 perspective+rotateY。
       收益：① 翻转层只剩一个纯色矩形，逐帧重绘近乎零成本 ② 文字层不再有变换 → 只光栅化一次、永久复用纹理，
       文字始终清晰稳定 ③ 几何完全不变（同一个盒子、同一个 transform-origin:right、同一透视），观感与 v4/参考站一致。
       透视距离按本站抽屉宽度等比换算：参考站 169px 宽配 perspective(600px)（比值 3.55），
       本站抽屉 min(16rem,78vw)=256px，故用 calc(宽 × 3.55)≈909px，保证"翻开角度/景深"与参考站等比一致。
       【勿加 will-change / backface-visibility 到 .mob-nav】：实测它与 visibility:hidden 组合会让浏览器
       "预留合成层却不栅格化"，打开首帧同步栅格化整块抽屉 → 58~75ms 长帧。 */
    .mob-nav {--mn-w: min(16rem, 78vw);display: block;position: fixed;top: 0;right: 0;width: var(--mn-w);height: 100%;padding: 4.75rem 0 3rem;overflow: auto;overscroll-behavior: contain;z-index: 997;pointer-events: none;visibility: hidden;opacity: 0;-webkit-transition: all .5s cubic-bezier(.445,.145,.355,1);transition: all .5s cubic-bezier(.445,.145,.355,1);}
    /* [2026-10-05] 顶部内边距 4.25rem(68px)→4.75rem(76px)：顶栏加高到 63px 后，
       原值会让第一项「首页」贴着顶栏下沿（只剩 5px），同步 +8px 保持改前的舒适间距（13px） */
    .mob-nav.act {visibility: visible;opacity: 1;pointer-events: auto;}
    /* 『书页』本体：只有它做 3D 翻转（去掉了 backdrop-filter 毛玻璃：50px 半径每帧重采样整块背景却几乎看不见） */
    .mob-nav:before {content: '';position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: -1;background: rgba(255,255,255,.96);transform-origin: right;-webkit-transform: perspective(calc(var(--mn-w) * 3.55)) rotateY(-90deg);transform: perspective(calc(var(--mn-w) * 3.55)) rotateY(-90deg);-webkit-transition: -webkit-transform .5s cubic-bezier(.445,.145,.355,1);transition: transform .5s cubic-bezier(.445,.145,.355,1);}
    .mob-nav.act:before {-webkit-transform: perspective(calc(var(--mn-w) * 3.55)) rotateY(0deg);transform: perspective(calc(var(--mn-w) * 3.55)) rotateY(0deg);}
    .mob-nav-list {width: 100%;margin: 0;padding: 0;list-style: none;}
    .mob-nav-list > li {width: 84%;margin: 0 auto;overflow: hidden;}
    /* 分隔线随「文字」一起浮现（0→.36s 期间透明）：1px 细线在 3D 旋转下最容易出现锯齿闪烁，
       拆层后线条留在文字层，若不隐藏会在书页还没翻过来时先飘在半空。
       [2026-10-05] 浮现延迟 .6s→.36s（与 h3 同步，时间轴依据见下方 h3 注释） */
    .mob-nav-list > li + li {border-top: 1px solid rgba(90,90,90,0);-webkit-transition: border-color .2s;transition: border-color .2s;}
    .mob-nav.act .mob-nav-list > li + li {border-top-color: rgba(90,90,90,.1);-webkit-transition: border-color .3s .36s;transition: border-color .3s .36s;}
    /* 基础态就带 transition（无延迟）：transition 取"变化后状态"的值，
       于是打开时用 .act 里的 .32s .36s（书页基本翻到位才上浮），收起时回落这里的 .3s（文字随抽屉立即退出），
       两个方向各自顺畅，不会出现某一侧"跳"一下。收起方向取 .3s 与打开方向的 .32s 对称，开合手感一致 */
    .mob-nav-list li h3 {margin: 0;height: 3.75rem;line-height: 3.75rem;font-size: 1.0625rem;font-weight: normal;color: #000;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;overflow: hidden;-webkit-transform: translateY(40px);transform: translateY(40px);opacity: 0;-webkit-transition: all .3s cubic-bezier(.445,.145,.355,1);transition: all .3s cubic-bezier(.445,.145,.355,1);}
    /* [2026-10-04] 入场延迟：菜单项不能在书页 3D 翻转期间上浮——"透视压缩"和"上浮位移"叠在同一行文字上，
       文字逐帧位移越来越大，看起来就是颤抖；必须等书页翻到位、文字层不再被透视扭曲后才动。
       [2026-10-05] 延迟 .6s→.36s、时长 .5s→.32s（解决"翻完页菜单还空着"）：
       书页翻转仍是 .5s + cubic-bezier(.445,.145,.355,1)（未动），该缓动前段快后段慢，实测各时刻投影宽占比：
         .20s→71.0%   .25s→88.7%   .30s→96.4%   .35s→99.1%   .40s→99.9%
       菜单项左端起于 li 的 84% 居中容器、即抽屉 8% 处，书页覆盖 ≥93% 就已完全垫在文字下面，
       故 .36s 浮现（覆盖 99%+）与原来"翻完再浮现"观感无差别，却把空白等待缩短了 0.24s、
       完全显示时刻由 1.10s 提前到 0.68s。想更快/更慢只改这里的 .36s 与 .32s 两个值即可，
       对书页翻转本身零影响（翻转只认上面 :before 那条规则的 .5s） */
    .mob-nav.act .mob-nav-list li h3 {-webkit-transform: translateY(0);transform: translateY(0);opacity: 1;-webkit-transition: all .32s .36s cubic-bezier(.445,.145,.355,1);transition: all .32s .36s cubic-bezier(.445,.145,.355,1);}
    .mob-nav-list li .mob-a {display: block;-webkit-box-flex: 1;-ms-flex: 1;flex: 1;color: inherit;text-decoration: none;}
    .mob-nav-list li .mob-arr {width: 30px;-webkit-box-flex: 0;-ms-flex: 0 0 30px;flex: 0 0 30px;height: 3.75rem;position: relative;cursor: pointer;}
    .mob-nav-list li .mob-arr:after {content: '';position: absolute;left: 50%;top: 50%;width: 8px;height: 8px;margin: -6px 0 0 -5px;border-right: 1.5px solid #999;border-bottom: 1.5px solid #999;-webkit-transform: rotate(45deg);transform: rotate(45deg);-webkit-transition: all .3s;transition: all .3s;}
    .mob-nav-list li.on .mob-arr:after {margin-top: -2px;-webkit-transform: rotate(-135deg);transform: rotate(-135deg);}
    .mob-nav-list .mob-sub {display: none;padding: 0 0 .875rem;}
    .mob-nav-list .mob-sub a {display: block;font-size: .9375rem;color: #666;line-height: 2.5rem;-webkit-transform: translateY(30px);transform: translateY(30px);opacity: 0;-webkit-transition: all .3s cubic-bezier(.445,.145,.355,1);transition: all .3s cubic-bezier(.445,.145,.355,1);}
    /* 二级项比一级项再晚 .14s（.36s→.50s），保持"逐级浮现"的层次，同样只动文字层、不碰书页翻转 */
    .mob-nav.act .mob-sub a {-webkit-transform: translateY(0);transform: translateY(0);opacity: 1;-webkit-transition: all .32s .5s cubic-bezier(.445,.145,.355,1);transition: all .32s .5s cubic-bezier(.445,.145,.355,1);}
    /* 遮罩同样去掉全屏 backdrop-filter（2px 模糊肉眼不可见，却要对整屏每帧重算），只留半透明色 */
    /* 遮罩同样去掉 will-change：全屏层（750×1500 @2x）常驻合成层、首次显示时同步光栅化，同样是打开瞬间的负担；
       overscroll-behavior 阻止遮罩上的滑动链式传递给底层页面（替代改 body 造成整页重排的滚动锁） */
    /* touch-action:none 取代 body 滚动锁：遮罩铺满全屏，其上的滑动不再穿透到底层页面，
       而 touch-action 是合成器属性，不触发任何布局/重排（参考站连锁都不加，这里兼顾不穿透） */
    .mob-mask {display: block;position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 996;background-color: rgba(20,27,62,.45);opacity: 0;visibility: hidden;pointer-events: none;touch-action: none;overscroll-behavior: contain;-webkit-transition: opacity .5s,visibility .5s;transition: opacity .5s,visibility .5s;}
    .mob-mask.act {opacity: 1;visibility: visible;pointer-events: auto;}
    /* [v2] 原 body.mob-lock{overflow:hidden} 已移除（改由 .mob-mask 的 touch-action:none 防穿透） */

    .sp_nav_body {overflow: visible;}
    .sp_nav {display: none;}
    .sp_nav-box {display: none !important;}

    /* [2026-10-05] banner 按 PC 端比例等比缩放（原 250px 裁切条 → 与 PC 同比例的 16:9 盒子）：
       PC 端 .banner = 100vh 全屏（1920×1080 屏即 16:9），视频 01.mp4 与三张幻灯图全是 16:9
       （960×540 / 1920×1080）。手机端把盒子也做成 16:9、媒体仍用 cover 填充 → 两边比例一致时
       cover 零裁切，手机上看到的就是 PC 画面整体等比缩小的效果，不再被裁成竖条。
       要换比例只改 --banner-ar 一个变量（如 4/3）；旧浏览器不支持 aspect-ratio 时退化为 auto 高度 */
    .banner {--banner-ar: 16 / 9;height: auto;min-height: 0;aspect-ratio: var(--banner-ar);}
    .banner .img-cover,.banner .swiper-pagination {display: block;}
    /* [2026-10-05] 手机端也播放首屏视频：从 display:none 列表里移除 video；
       hero-slide 的背景图播放期间必须保持隐藏（z-index:1 会盖住视频的 z-index:0），
       视频播完/失败由全局 .banner.video-done 规则接管显示图片（见 480 行附近） */
    /* [2026-10-05] 手机端也显示「阵列拼贴图」（视频播完后的第一张幻灯效果，与 PC 端一致）：
       原 ≤768 全局规则把 .wk_wrap 藏了（564 行），这里对 video-done 状态放开；
       拼贴图组按 375 宽小屏等比缩小（PC 350×225 图/30px 间距 → 130×84/12px，rotate 角度不变），
       photlist 的 left/top/宽随缩放比 ≈0.37 换算；视频期的居中文字 hero-text 与 PC 端一样在
       播完后撤下（PC 端该行为在 495 行 min-width:769 内），否则会叠在阵列图上 */
    .banner.video-done .hero-slide .wk_wrap {display: block;}
    .banner.video-done .hero-slide .hero-text {display: none;}
    .banner .wk_wrap .photlist {left: 60px;top: -85px;width: 700px;height: 520px;}
    .banner .wk_wrap .photlist .img {margin-right: 12px;margin-bottom: 12px;}
    .banner .wk_wrap .photlist .img img {width: 200px;height: 150px;border-radius: 8px;}
    /* [2026-10-05] 手机端恢复显示轮播图上的文字（原来是 display:none，导致第 2 张起
       的幻灯图光秃秃没有标题，与 PC 端不一致）。PC 端 .banner .text 是 display:table 的
       整屏覆盖层（自带 rgba(8,8,9,.4) 压暗层保证文字可读），这里保持同一种显示方式，
       只把字号按手机端 16:9 矮盒（约 211px 高）缩小；文字入场沿用 .ani-slide 类，
       手机端与 PC 同一套 swiper 回调（index.html 625/638 行），无需额外脚本 */
    .banner .text {display: table;}
    .banner .text h4 {font-size: 20px;margin-bottom: 10px;}
    .banner .text p {font-size: 13px;}
    /* [2026-10-05] 首屏视频上的 hero 文字在 16:9 矮盒子里按手机端缩小（PC 端字号不适用小屏）：
       h2 30px 会折行且挤满 211px 高的盒子 → 20px 单行；副标题/渐变线同步缩小 */
    .banner .hero-text {padding: 0 15px;}
    .banner .hero-text h2 {font-size: 20px;letter-spacing: 2px;}
    .banner .hero-text .hero-line {margin: 12px auto;}
    .banner .hero-text p {font-size: 12px;letter-spacing: 3px;}
    .banner .text p {font-size: 14px;}
    .banner .text a {margin-top: 20px;font-size: 14px;line-height: 32px;width: 120px; }

    .in-total {margin: 0 -15px;}
    .in-total li {padding: 15px 0;}
    .in-total li span {font-size: 12px;}
    .in-total li strong {font-size: 24px;}
    .in-total li p {margin: 5px 0 0;font-size: 12px;}

    .section {padding: 30px 0;}
    .section-title {font-size: 20px;margin-bottom: 20px;}
    .section-title p {font-size: 12px;}
    .section-title-1 {background-size: auto 28px;background-position: center 0;}
    .section-title-1 strong {padding: 0 10px;}
    .section-sub {padding: 30px 0;}

    .in-server li {width: 50%;}
    .in-server li a {border: 0;}
    .in-server li span {display: none;}
    .in-server li .img-center {line-height: 50px;height: 50px;padding: 0;}
    .in-server li h4 {font-size: 16px;margin: 10px 0 5px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
    .in-server li p {margin: 0;font-size: 12px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}
    .in-server li:first-child {width: 100%;}

    .in-seo li {width: 100%;}
    .in-seo li a {padding: 20px;}
    .in-seo li .img-center {height: 40px;line-height: 40px;}
    .in-seo li p {margin-top: 10px;}

    .in-menu {margin: -5px 0 15px -5px;}
    .in-menu {display: none;}
    .in-menu li a {font-size: 14px;padding: 0 10px;line-height: 32px;margin: 5px 0 0 5px;}

    /* [2026-10-05] 改 flex 换行：原 float 布局在卡片高度不齐时会把某张卡挤得整行只有一张
       （下一行的左列被上一行的高卡挡住，卡只好漂到右列）；flex-wrap 按序排列且同行等高，
       彻底消除错位。
       两侧留白：.list-1 在 HTML 里位于 .container **之外**（模板 448 行 container 已闭合），
       从来吃不到容器的 15px 内边距、一直贴屏；这里给 ul 左右 9px + li 自身 6px 内边距 =
       卡片距屏幕边 15px，卡片之间 12px */
    .list-1 {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin: 0 9px;}
    .list-1 li {float: none;width: 50%;padding: 0 6px;margin: 0 0 12px;-webkit-box-sizing: border-box;box-sizing: border-box;}
    .list-1 li a {margin: 0;}
    .list-1 li .text {position: static;-webkit-transform: scale(1);transform: scale(1);width: auto;height: auto;display: block;background-color: #fff;color: #333;}
    .list-1 li .inner {display: block;text-align: left;padding: 10px;}
    .list-1 li .text h4 {font-size: 16px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
    .list-1 li .text p {font-size: 14px;margin-top: 0;color: #666;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}

    .list-2 {margin: -15px 0 0 -15px;}
    .list-2 li {width: 100%;}
    .list-2 li a {margin: 15px 0 0 15px;padding: 10px;}

    .index-news-menu {display: block;}
    .index-news-con .img-center {display: none;}
    .index-news-con .list-2 {margin-left: -15px;}

    .in-desc .logo {float: none;text-align: center;width: auto;height: 100px;line-height: 100px;}
    .in-desc .text {margin: 20px 0 0;}
    .in-desc .text h4 {font-size: 20px;}
    .in-desc .text h5 {margin: 15px 0 5px;font-size: 14px;}
    .in-desc .text p {font-size: 12px;}
    .in-desc .text a {display: none;}

    .in-partners {margin: -5px 0 0 -5px;}
    .in-partners li a {margin: 5px 0 0 5px;}
    .in-partners li .img-center {height: 45px;line-height: 45px;}

    .in-process {margin-top: -15px;}
    .in-process li {width: 33.333333%;}
    .in-process li a {margin-top: 15px;}
    .in-process li .img-center {height: 30px;line-height: 30px;}
    .in-process li h4 {font-size: 14px;margin-top: 10px;}
    .in-process li p {margin-top: 5px;}

    .in-dynamic {margin-top: -15px;}
    .in-dynamic li {width: 100%;}
    .in-dynamic li a {margin-top: 15px;padding: 15px;}
    .in-dynamic li h4 {font-size: 16px;}
    .in-dynamic li p {margin-top: 10px;}

    .more-big {margin-top: 30px;line-height: 40px;}

    .in-partone li {width: 100%;}
    .in-partone li .wrap {padding: 40px 10px;}
    .in-partone li h4 {font-size: 20px;}
    .in-partone li a {font-size: 14px;margin-top: 20px;width: 120px;}

    .in-ready {display: none;}

    /* [2026-10-03] 底部移动端：栏目两列，联系方式/二维码依次堆叠 */
    .footer {border-top-width: 5px;}
    /* [2026-10-05 二次] 顶留白 30px→45px：LINKS 框下缘压进 footer 约 26px，
       加大后栏目标题（网站建设/模板中心）不再被 LINKS 框盖住 */
    .f-main {padding: 45px 0 20px;}
    .f-nav {float: none;width: 100%;}
    .f-nav ul li {width: 50%;margin-bottom: 15px;}
    .f-nav ul li p {margin-bottom: 10px;}
    .f-contact {float: none;width: 100%;padding-left: 0;margin-top: 10px;}
    .f-contact .tel {font-size: 30px;}
    /* [2026-10-05 七次] 二维码图片 + 「扫一扫 在线咨询」文字手机端整体隐藏（用户要求）：
       直接隐藏 .f-ewm 容器（含 .ewm-img 与 p），它是 f-main 最后一个子元素，
       display:none 不占位、不留空隙；平板档（≤991）仍照常显示 */
    .f-ewm {display: none;}
    .footer-copy {padding: 12px 0;}
    .footer-copy p {line-height: 22px;font-size: 12px;text-align: center;}

    /* [2026-10-03] 友情链接移动端：LINKS 块与链接条上下堆叠，同样下移一半压进 foot */
    /* [2026-10-05 二次] 下移量 50%→30%：50% 时框的上缘距上方灰色区太远、下缘又压住
       footer 栏目标题；改 30% 后框整体上移，压进 footer 仅约 26px，上下间距都正常 */
    .flink-sec {padding-top: 25px;}
    .yunu-link {display: block;-webkit-transform: translateY(30%);-ms-transform: translateY(30%);transform: translateY(30%);}
    .yunu-link h4 {line-height: 46px;font-size: 18px;}
    .yunu-link ul {padding: 5px 15px;}
    .yunu-link li {margin: 4px 20px 4px 0;}

    .banner-sub {height: 120px;font-size: 20px;}

    /* [2026-10-07] 模板中心动效 banner 手机端适配（对应 .banner-mbanim） */
    .banner-mbanim {height: 300px;}
    .banner-mbanim .banner-sub-txt h2 {margin-top: 16px;font-size: 30px;letter-spacing: 2px;}
    .banner-mbanim .banner-sub-txt p {margin-top: 12px;font-size: 14px;letter-spacing: 1px;}
    .banner-mbanim .mba-line {margin: 14px auto 0;}

    /* [2026-10-07] 成功案例动效 banner 手机端适配（对应 .banner-csanim） */
    .banner-csanim {height: 300px;}
    .banner-csanim .banner-sub-txt h2 {margin-top: 16px;font-size: 30px;letter-spacing: 3px;}
    .banner-csanim .banner-sub-txt p {margin-top: 12px;font-size: 14px;letter-spacing: 2px;}
    .banner-csanim .csa-div {margin-top: 14px;}
    .banner-csanim .csa-watermark {font-size: 70px;letter-spacing: 6px;}
    .banner-csanim .csa-ring {width: 80px;height: 80px;border-width: 8px;}
    .banner-csanim .csa-sq {width: 40px;height: 40px;}
    .banner-csanim .csa-tri {border-left-width: 14px;border-right-width: 14px;border-bottom-width: 24px;}
    /* [2026-10-08] about 页荣誉照手机端：四张 2×2 两行，banner 加高到 380px 容纳 */
    .banner-csanim.csa-about {height: 480px;}
    .banner-csanim.csa-about .csa-photos {flex-wrap: wrap;gap: 12px;margin-top: 30px;padding: 0 24px;}
    .banner-csanim.csa-about .csa-ph {flex: 0 0 calc(50% - 6px);min-width: 0;}
    .banner-csanim.csa-about .csa-ph img {width: 100%;border-radius: 7px;box-shadow: 0 8px 20px rgba(40,0,40,.32);}

    /* [2026-10-07] 资讯中心动效 banner 手机端适配（对应 .banner-nwanim） */
    .banner-nwanim {height: 300px;}
    .banner-nwanim .banner-sub-txt h2 {margin-top: 16px;font-size: 30px;letter-spacing: 3px;}
    .banner-nwanim .banner-sub-txt p {margin-top: 12px;font-size: 14px;letter-spacing: 2px;}
    .banner-nwanim .nwa-div {margin-top: 14px;}
    /* 虚线环在窄屏会压到文字，隐藏；涟漪同步缩小 */
    .banner-nwanim .nwa-ring {display: none;}
    .banner-nwanim .nwa-ripple i {left: -110px;top: -110px;width: 220px;height: 220px;}

    /* [2026-10-07] 关于我们动效 banner 手机端适配（对应 .banner-abanim） */
    .banner-abanim {height: 300px;}
    .banner-abanim .banner-sub-txt h2 {margin-top: 18px;font-size: 30px;letter-spacing: 4px;text-indent: 4px;}
    .banner-abanim .banner-sub-txt p {margin-top: 12px;font-size: 14px;letter-spacing: 2px;}
    .banner-abanim .aba-div {margin-top: 16px;}
    .banner-abanim .aba-frame {width: 86%;height: 190px;margin: -95px 0 0 -43%;}
    .banner-abanim .aba-lines i:nth-child(1),
    .banner-abanim .aba-lines i:nth-child(3) {width: 90px;}
    .banner-abanim .aba-lines i:nth-child(2),
    .banner-abanim .aba-lines i:nth-child(4) {width: 120px;}
    @-webkit-keyframes abaInH2 {from {opacity: 0;letter-spacing: 16px;}to {opacity: 1;letter-spacing: 4px;}}
    @keyframes abaInH2 {from {opacity: 0;letter-spacing: 16px;}to {opacity: 1;letter-spacing: 4px;}}

    /* [2026-10-07] 联系我们动效 banner 手机端适配（对应 .banner-ctanim） */
    .banner-ctanim {height: 300px;}
    .banner-ctanim .banner-sub-txt h2 {margin-top: 16px;font-size: 30px;letter-spacing: 3px;}
    .banner-ctanim .banner-sub-txt p {margin-top: 12px;font-size: 14px;letter-spacing: 2px;}
    .banner-ctanim .cta-div {margin-top: 14px;}
    .banner-ctanim .cta-fan {width: 640px;height: 640px;margin: -320px 0 0 -320px;}
    .banner-ctanim .cta-glow1 {width: 260px;height: 260px;}
    .banner-ctanim .cta-glow2 {width: 240px;height: 240px;}
    /* 四角定位标在窄屏太挤，只留上面两个并内缩 */
    .banner-ctanim .cta-marks i {width: 18px;height: 18px;}
    .banner-ctanim .cta-marks i:nth-child(1) {left: 14px;top: 84px;}
    .banner-ctanim .cta-marks i:nth-child(2) {right: 14px;top: 84px;}
    .banner-ctanim .cta-marks i:nth-child(3),
    .banner-ctanim .cta-marks i:nth-child(4) {display: none;}

    .pages {margin-top: 20px;}
    .pages a {font-size: 12px;line-height: 30px;padding: 0 12px;}

    /* [2026-10-19] 移动端栏目条：恢复下拉交互，隐藏面包屑，关闭滑色动画 */
    .lanmu .container {display: block;height: auto;}
    .lanmu-left {height: auto;}
    .lanmu-crumb {display: none;}
    .lanmu-title {display: block;line-height: 50px;font-size: 16px;}
    .lanmu ul {position: absolute;top: 100%;left: 0;width: 100%;height: auto;background-color: #fff;z-index: 11;box-shadow: 0 5px 5px rgba(0,0,0,0.1);display: none;}
    .lanmu li {display: block;height: auto;border-top: 1px solid #ddd;margin: 0;}
    .lanmu li a {display: block;height: auto;line-height: 40px;text-align: center;border-right: 0;font-size: 14px;padding: 0;white-space: normal;}
    .lanmu li a:before {display: none;}
    .lanmu li.active a,.lanmu li a:hover {background-color: transparent;color: #e62022;}

    .position {padding: 10px 0;font-size: 12px;}
    .position i {margin-right: 5px;height: 17px;background-size: 12px;width: 12px;}

    .seo-1 {margin: -10px 0 0 -10px;}
    .seo-1 li {width: 50%;}
    .seo-1 li a {margin: 10px 0 0 10px;padding: 75px 10px 10px;}
    .seo-1 li h4 {margin-bottom: 10px;font-size: 14px;}
    .seo-1 li p {font-size: 12px;height: 85px;}
    .seo-1 li:last-child {display: none;}

    .seo-2 {padding: 0;margin: -10px 0 0 -10px;background-color: transparent;}
    .seo-2 li {width: 50%;}
    .seo-2 li a {margin: 10px 0 0 10px;background-color: #fff;padding: 5px;}
    .seo-2 li .img-center {height: 156px;line-height: 156px;}
    .seo-2 li .text {line-height: 34px;font-size: 12px;}

    .seo-3 {padding: 0;background: none;}
    .seo-3 ul {height: auto;}
    .seo-3 li {position: static;margin-bottom: 15px;padding: 10px 15px;font-size: 14px;}
    .seo-3 li:after {display: none !important;}
    .seo-3 li span {font-size: 16px;}
    .seo-3 .zd {width: 88px;height: 88px;}
    .seo-3 .zd span {font-size: 16px;padding: 22px 0;}

    .seo-4 .item {width: 100%;margin-bottom: 30px;}
    .seo-4 .item:last-child {margin-bottom: 0;}
    .seo-4 .tit {margin-bottom: 20px;}
    .seo-4 .tit h4 {font-size: 20px;}
    .seo-4 .tit h4 small {font-size: 14px;margin-left: 10px;}
    .seo-4 .tit span {font-size: 16px;}
    .seo-4 ul {padding: 10px 15px 20px 15px;}
    .seo-4 li {font-size: 14px;}
    .seo-4 li span {width: 20px;height: 20px;margin-right: 5px;line-height: 20px;}
    .seo-4 .more {line-height: 34px;font-size: 14px;margin-top: -15px;}

    .seo-5 {margin: -15px 0 0 -15px;}
    .seo-5 li {width: 33.333333%;}
    .seo-5 li .wrap {margin: 15px 0 0 15px;}
    .seo-5 li .m {height: 75px;}
    .seo-5 li h4 {margin: 10px 0;font-size: 14px;}
    .seo-5 li p {font-size: 12px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}

    .about-1 .img-center {width: 70%;margin: 0 auto;}
    .about-1 .text {margin-top: 20px;font-size: 14px;}
    .about-1 .in-total {margin-top: 20px;}

    .about-2 .logo {display: none;}
    .about-2 .text {margin-top: 0;}

    .about-3 li {width: 100%;}
    .about-3 li a {padding: 15px;}
    .about-3 li h4 {font-size: 16px;}
    .about-3 li p {height: auto;}

    .about-3-more {margin-top: 20px;}
    .about-3-more a {display: block;margin: 10px 0 0;width: auto;font-size: 16px;line-height: 34px;}

    .table-1 table {font-size: 12px;}
    .table-1 th, .table-1 td {padding: 10px;}
    .table-1 th {font-size: 14px;}
    .table-1 th:last-child {display: none;}
    .table-1 td:last-child {display: none;}
    .table-1 th:first-child {width: 80px;}

    .map {height: 300px;}

    .contact-left,.contact-right {width: auto;float: none;}
    .contact-left .tel {margin-bottom: 20px;font-size: 16px;}
    .contact-left .tel strong {font-size: 24px;}
    .contact-left li {font-size: 14px;background-size: 24px auto;padding-left: 30px;}
    .contact-right {margin-top: 30px;}
    .contact-right .tit img {height: 30px;}
    .contact-right dt {width: 100px;}
    .contact-right dd {margin-left: 115px;}
    .contact-right dd h4 {font-size: 18px;}
    .contact-right dd p {font-size: 14px;margin-top: 10px;}

    .v-lanmu,.h-lanmu {display: none;}
    .v-main {margin: 0;}

    .list-3 li {margin-bottom: 15px;}
    .list-3 li a {padding: 10px;}
    .list-3 li .img-center {width: 100px;}
    .list-3 li .text {margin-left: 110px;}
    .list-3 li .text h4 {font-size: 14px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
    .list-3 li .text p {margin-top: 5px;font-size: 12px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
    .list-3 li .text span {display: none;}

    .banner-content {height: auto;padding: 30px 0;}
    .banner-sbanner-contentub .container {display: block;height: auto;}
    .banner-content .inner {display: block;}
    .content-title {margin: 0;}
    .content-title h1 {font-size: 20px;}
    .content-title p {margin-top: 10px;}
    .content-title p span {font-size: 12px;margin-right: 5px;}
    .content-main, .content-xg {padding: 15px;}
    .content-main {margin: -30px -15px 0;}
    .content-exp {margin-top: 15px;padding-top: 15px;font-size: 12px;}
    .content-exp li {float: none;display: block;width: auto;}
    .content-exp li:last-child {text-align: left;margin-top: 10px;}
    .content-tips {margin-top: 15px;padding-top: 15px;font-size: 12px;}

    .content-xg {margin: 20px -15px 0;flex-direction: column;}
    .content-xg .tit {font-size: 18px;margin-bottom: 10px;}
    .content-xg-left,.content-xg-right {float: none;width: auto;flex: none;width: 100%;}
    .content-xg-left {padding-right: 0;border-right: 0;}
    .content-xg-right {margin-top: 20px;}

    .webdes {margin-left: -10px;}
    .webdes li {width: 50%;}
    .webdes li a {margin: 10px 0 0 10px;line-height: 44px;font-size: 14px;}

    .content-case-title {padding: 30px 0;}
    .content-case-title h4 {font-size: 20px;margin-bottom: 15px;}
    .content-case-title h5 {font-size: 16px;}
    .content-case-title .btn {margin-top: 20px;}
    .content-case-title-left,.content-case-title-right {width: auto;float: none;}
    .content-case-title-right {padding-top: 30px;}

    .content-case-xg .tit {font-size: 20px;margin-bottom: 20px;}

    .list-4 {margin: -15px 0 0 -15px;}
    .list-4 li {width: 50%;}
    .list-4 li a {margin: 15px 0 0 15px;}
    .list-4 li .text {padding: 10px;}
    .list-4 li .text h4 {font-size: 16px;}
    .list-4 li .text p {font-size: 12px;line-height: 20px;}

    .wzjs-1,.wzjs-box {margin-bottom: 30px;}
    .wzjs-1 .pic {width: auto;float: none;padding: 0;background: none;height: auto;}
    .wzjs-1 .pic .img-center {height: 235px;line-height: 235px;}
    .wzjs-1 .info {margin: 20px 0 0;}
    .wzjs-1 .info h1 span {font-size: 18px;margin-right: 5px;}
    .wzjs-1 .info h1 small {font-size: 12px;line-height: 20px;}
    .wzjs-1 .text .btn {margin-top: 20px;}

    .wzjs-1 .text .sb-it {margin-right: 0;display: block;}

    .wzjs-tit {line-height: 20px;}
    .wzjs-tit em {display: none;}
    .wzjs-tit span {font-size: 16px;}
    .wzjs-tit span i {line-height: 20px;width: 20px;margin-right: 5px;}

    .wzjs-2 {font-size: 16px;}
    .wzjs-2 .tel {float: none;margin-bottom: 10px;}

    .table-2 table {font-size: 12px;}
    .table-2 th, .table-2 td {padding: 10px;}
    .table-2 th {font-size: 14px;}
    .table-2 th:first-child,.table-2 td:first-child {width: 80px;}
    .table-2 th:last-child {display: none;}
    .table-2 td:last-child {display: none;}
    .table-2 td:first-child img {height: 16px;width: auto;}

    .wybzd {font-size: 12px;line-height: 1.8;margin: 0 0 20px;}

    .wzjs-3 li {width: 33.333333%;}
    .wzjs-3 li .wrap {padding: 5px;}
    .wzjs-3 li .img-center {height: 24px;line-height: 24px;}
    .wzjs-3 li p {font-size: 12px;margin-top: 5px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
    .wzjs-3-tips {padding: 0 10px;}

    .wzjs-4 {margin-top: -15px;}
    .wzjs-4 li {width: 25%;}
    .wzjs-4 li .wrap {margin-top: 15px;}
    .wzjs-4 li .wrap:after {display: none;}
    .wzjs-4 li .img-center {height: 40px;line-height: 40px;}
    .wzjs-4 li p {font-size: 12px;}

    .wzjs-5 .bg {display: none;}
    .wzjs-5 .wzjs-box {width: auto;}
    .wzjs-5-left,.wzjs-5-right {float: none;}

    .wzjs-6 dt {float: none;width: auto;}
    .wzjs-6 dd {margin: 20px 0 0;padding-top: 0;}
    .wzjs-6 dd p {margin: 10px 0 0;font-size: 14px;padding: 0 10px;}

    .more-big-2 {line-height: 34px;margin-top: 20px;font-size: 14px;}

    .wzjs-7 .bg {display: none;}
    .wzjs-7 dt {font-size: 16px;width: 55px;padding-top: 5px;height: 64px;}
    .wzjs-7 dd {margin-left: 70px;}
    .wzjs-7 dd h4 {font-size: 16px;}
    .wzjs-7 dd p {font-size: 12px;margin-top: 5px;}
    .wzjs-7 .list li {font-size: 14px;}
    .wzjs-7 .more {margin-top: 10px;font-size: 14px;}
    .wzjs-7 .menu {padding-top: 0;margin-left: -10px;}
    .wzjs-7 .menu li a {margin: 0 0 10px 10px;}
    .wzjs-7-left,.wzjs-7-right {width: auto;float: none;padding: 0;}
    .wzjs-7-right {margin-top: 20px;}

    .onebox {width: 290px;margin-left: -145px;margin-top: -250px;}
    .onebox-wrap {margin: 0;padding: 20px;border: none;}
    .onebox .close {width: 20px;height: 20px;}
    .onebox .tit {background: none !important;font-size: 18px;padding-left: 0;margin-bottom: 10px;}
    .onebox li {width: 100%;}
    .onebox li i {width: 34px;height: 40px;}
    .onebox li input {margin-left: 34px;line-height: 20px;padding: 10px 12px;font-size: 14px;width: 86%;box-sizing: border-box;}
    .onebox li textarea {box-sizing: border-box;width: 100% !important;font-size: 14px;line-height: 20px;padding: 10px 12px;}
    .onebox li.yzm img {height: 40px;width: 80px;}
    .onebox li.yzm input {width: 130px;}
    .onebox .submit {height: 38px;font-size: 16px;}

    .taocan_titleo {width: auto;margin-top: 20px;font-size: 12px;}

    .weizhi {display: none;}

    .case-wrap {min-width: auto;width: auto;}
}


.fllist{
    border: 1px solid #eee;
    padding: 30px 50px;
    font-size: 16px;
    background-color: #f9f9f9;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    list-style: none;
    margin: 0 0 30px;
}
.fllist .fllist-info {
    flex: 1 1 30%;
    min-width: 0;
}
.fllist .fllist-info p {
    margin: 8px 0;
    color: #555;
}
.fllist .fllist-btns {
    flex: 1 1 70%;
    min-width: 0;
}
.fllist .fllist-btns .btn-row {
    margin: 18px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.fllist .fllist-btns .case-btns {
    gap: 8px;
}
/* .fllist 子元素改用 .fllist-info / .fllist-btns */
/* 旧 .fllist li a 蓝底样式已废弃，新结构用 .btn-line */
.fllist li a.btn-line {
    background-color: #fff;
    color: #555;
    border: 1px solid #999;
    padding: 8px 26px;
    border-radius: 999px;
    transition: all 0.3s ease;
    display: inline-block;
    font-size: 15px;
    line-height: 1.4;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.fllist li a.btn-line .arrow {
    display: inline-block;
    margin-left: 6px;
    transition: transform 0.3s ease;
}
.fllist li a.btn-line:hover {
    background-color: #e62022;
    color: #fff;
    border-color: #e62022;
}
.fllist li a.btn-line:hover .arrow {
    transform: translateX(4px);
}
.fllist li strong{
  color: #FF6600;
}

@media screen and (max-width: 450px){
  .fllist li {
    width: 45%;
}

}

/* [筛选区域样式] */
.pagebar { padding:40px; overflow:hidden; clear:both}
.pagebar .pagination {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}
.pagination a {
  background: #fff;
  border: 1px solid #ccc;
  color: #333;
  font-size: 12px;
  padding: 8px 10px;
  margin: 0 2px;
  border-radius: 3px; line-height:100%
}
.pagination span {
    color: #333;
    font-size: 12px;
    padding: 7px 2px;
    margin: 0 2px;
    border-radius: 3px;
}
.pagination a:hover {
  color: #333;
  border: 1px solid #333;
}
.pagination a.page-num-current {
  color: #fff;
  background: #333;
  border: 1px solid #333;
}
}}.text-secondary{ text-align:center; padding:20px 0}

/* 最终方案：标签+不限绝对定位，子类统一左对齐 */
.pro_screen ul.pro_screen-flex-first {
    position: relative;
    padding-left: 130px;
    display: block !important;
}
.pro_screen ul.pro_screen-flex-first li.screen-label {
    position: absolute;
    left: 0;
    top: 0;
    width: 40px;
}
.pro_screen ul.pro_screen-flex-first li.screen-active {
    position: absolute;
    left: 45px;
    top: 0;
    width: 80px;
    margin-right: 0 !important;
}
.pro_screen ul.pro_screen-flex-first li:not(.screen-label):not(.screen-active) {
    display: inline-block;
    margin: 0 4px 8px 0;
}

/* ===== K688 do4s 板块（2026-09-12 K688 移植）===== */
#do4s{margin-bottom:2vw;max-width:1600px;margin-left:auto;margin-right:auto;overflow-x:clip}
#do4s .containe{position:relative;width:100%;max-width:1600px;margin:0 auto;padding:0 15px;box-sizing:border-box}
#do4s .ydtitle{margin:2vw 0}
.ydtitle{margin:2vw 0}
#do4s .ydtitle i.arr{display:inline-block;vertical-align:middle;overflow:hidden;width:29px;height:25px;background-image:url(../images/g01.png);background-repeat:no-repeat;-webkit-animation-name:hvr-buzz;animation-name:hvr-buzz;-webkit-animation-duration:1.5s;animation-duration:1.5s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
.ydtitle i.arr{display:inline-block;vertical-align:middle;overflow:hidden;width:29px;height:25px;background-image:url(../images/g01.png);background-repeat:no-repeat;-webkit-animation-name:hvr-buzz;animation-name:hvr-buzz;-webkit-animation-duration:1.5s;animation-duration:1.5s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
#do4s .ydtitle h2{font-size:2.2rem;color:#333;display:inline-block;vertical-align:middle;padding-left:.5rem}
.ydtitle h2{font-size:2.2rem;color:#333;display:inline-block;vertical-align:middle;padding-left:.5rem}
/*#do4s .ydtitle:after{display:inline-block;float:right;content:" ";height:2px;width:20%;z-index:5;background-color:#333;margin-top:1rem}*/
#do4s .dos{display:flex;flex-flow:row nowrap;justify-content:space-between;gap:0}
#do4s .dos>.do:nth-child(even){background:#f6f6f6}
/* [2026-10-05] 悬停切换的过渡由 .6s/1s 缩短为 .45s：鼠标划到卡片上时右侧内容更快展开，
   观感上更接近「划过即显现」（切换机制仍是 hover，见 index.html 的 .do hover 绑定） */
#do4s .do{float:left;transition:all .45s ease-out;-webkit-transition:all .45s ease-out;background-color:#fcfcfc;cursor:pointer;width:18%}
#do4s .do .img{margin-left:auto;margin-right:auto;display:block}
#do4s .do.current{width:46%;background-color:#fff;position:relative;z-index:2;box-shadow:0 8px 10px rgba(70,70,70,0.5);border-bottom-right-radius:15px;overflow:hidden}
#do4s .do.current .item_cate{width:40%;background-color:#e72321}
#do4s .do.current .item_cate *{color:#fff}
#do4s .do.current .item_list{width:60%;height:100%;background-image:url(../images/g06.png);background-repeat:no-repeat;background-position:100% 100%;background-size:auto auto}
#do4s .do.current .img{margin-left:0;filter:drop-shadow(white 100px 0)}
#do4s .item_list{float:right;overflow:hidden;box-sizing:border-box;position:relative;width:0;height:0;padding:2.5vw 7% 2vw;transition:width .45s ease-out}
#do4s .item_list li{margin:2.2rem 0}
#do4s .item_list li:hover *{color:#0e4081}
#do4s .item_list a{font-size:1rem;color:#333;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}
#do4s .item_list .iconfont{float:right;font-size:1.1rem;color:#bbb;line-height:1.2;margin-right:2px}
#do4s .item_cate{height:100%;box-sizing:border-box;text-align:center;padding:3.8vw 1rem;width:100%}
#do4s .item_cate *{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#do4s .item_cate .tubiao{margin-left:auto;margin-right:auto;display:block;color:#333;font-size:4.5rem;line-height:1}
#do4s .item_cate h3{font-size:1.5rem;color:#333;font-weight:700;line-height:2;margin:1.5rem 0 1rem}
#do4s .item_cate small{font-size:1rem;color:#999;display:block;font-weight:400}
#do4s .item_cate p{font-size:14px;color:#666}
#do4s .item_cate .icon-yuanquan{color:#0e4081;font-size:1rem;display:inline-block;padding-top:1.5rem}
#do4s .spot{display:none}
@media (max-width:768px){
  #do4s .ydtitle h2{font-size:1.25rem}
  #do4s .item_list a{font-size:.89rem}
  #do4s .item_list .iconfont{font-size:1.05rem}
  #do4s .item_cate h3{font-size:1.05rem}
  #do4s .item_cate small{font-size:.89rem}
}
@media screen and (max-width:767px){
  /* [2026-10-05 轮播版] 四张卡改成「横向一排、一屏一卡、左右自动切换」：
     .dos 变横向轨道，每张卡占 100% 轨道宽，由内联 JS 每 4s translateX 切到下一张。
     ★裁剪必须放在**不动的外层** #do4s 上：若 overflow:hidden 写在 .dos 自身，
     裁剪盒会跟着轨道一起位移，把停在可视区的卡片也裁没（第一版就栽在这）。
     原堆叠版（display:block 常显）废弃。断点用 767 与 JS 的 isMobile() 一致 */
  /* [2026-10-05 二次] ①外层 padding 0 15px → 0：原结构下轨道宽=345px，卡与卡步进=345px，
     下一张卡的左边缘永远停在视口 padding 区（360~375px），右侧常驻一条 15px 的"脏边"。
     改为外层不留白、每张卡自身 margin 0 15px + flex-basis calc(100% - 30px)，
     步进=345+30=375=轨道宽，切到哪张都严丝合缝；②卡片四角加 14px 圆角 */
  #do4s {box-sizing: border-box;padding: 0;overflow: hidden;}
  #do4s .ydtitle{margin-left:15px;margin-right:15px}
  #do4s .dos{display:flex;flex-flow:row nowrap;-webkit-transition:transform .5s ease;transition:transform .5s ease}
  #do4s .do{float:none;width:calc(100% - 30px);flex:0 0 calc(100% - 30px);margin:0 15px;border-radius:14px;overflow:hidden;-webkit-transition:none;transition:none}
  #do4s .do.current{width:calc(100% - 30px);position:static;box-shadow:none;border-radius:14px}
  /* 每张卡内部仍是 左 40% 色块 + 右 60% 列表 的形态（常显，不依赖选中态） */
  #do4s .do .item_list {width: 60%;height: auto;min-height: 100%;float: right;}
  /* 未选中回落 PC 端深色文字（图标/标题 #333、副标题 #999），选中态仍红底白字（1986/1987 行） */
  #do4s .do .item_cate{width:40%;background-color:#f0f0f0;padding:7vw 3vw 3vw}


  #do4s .item_list a{font-size:1rem}
  #do4s .item_cate small{font-size:1rem}
  #do4s .item_cate p{font-size:13px}
  /* [2026-10-05 二次] 圆点指示器补样式（原 .spot 只有 display 开关、li 没有任何样式=看不见），
     与 whyChooseSec 的 .why-dots 同款外观；位置在卡片正下方居中，与 JS 轮播联动可点直达 */
  #do4s .spot{display:block;position:relative;margin:14px 15px 5vw;padding:0;z-index:22}
  #do4s .spot ul{margin:0;padding:0;list-style:none;text-align:center}
  #do4s .spot li{display:inline-block;width:9px;height:9px;border-radius:50%;background:#d5d5d5;margin:0 4px;cursor:pointer;transition:all .3s ease}
  #do4s .spot li.on{background:#e72321;width:22px;border-radius:6px}
  #do4s .ydtitle i.arr{width:24px;height:14px;background-size:auto 100%}
}
@-webkit-keyframes hvr-buzz{0%{background-position:-29px 0}50%{background-position:0 0}100%{background-position:29px 0}}
@keyframes hvr-buzz{0%{background-position:-29px 0}50%{background-position:0 0}100%{background-position:29px 0}}
/* ===== K688 do4s 结束 ===== */


/* 为什么选择我们（2026-09-14 移植自 K548 公司优势） */
/* 为什么选择我们（2026-09-14 v2: 用 id + !important 强制覆盖，inline style 已兜底） */
#whyChooseUs{box-sizing:border-box;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-ms-flex-wrap:wrap!important;flex-wrap:wrap!important;-webkit-box-pack:justify!important;-ms-flex-pack:justify!important;justify-content:space-between!important;padding-top:0;}
#whyChooseUs li,.why-choose-us li{box-sizing:border-box;width:49%!important;border-radius:15px; margin-bottom:15px!important;box-shadow:0 0 3px rgba(0,0,0,0.3)!important;padding:15px 40px!important;position:relative!important;overflow:hidden!important;z-index:3!important;background:#fff!important;transition:all 0.6s!important;}
#whyChooseUs li a,.why-choose-us li a{display:block!important;color:inherit!important;}
#whyChooseUs li h3,.why-choose-us li h3{font-size:22px!important;color:#000!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
#whyChooseUs li h4,.why-choose-us li h4{font-size:12px!important;color:#666!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;font-family:"arial narrow"!important;text-transform:uppercase!important;letter-spacing:1px!important;padding-top:10px!important;}
#whyChooseUs li p,.why-choose-us li p{font-size:14px!important;color:#666!important;margin-top:5px!important;line-height:32px!important;height:60px!important;overflow:hidden!important;}
#whyChooseUs li .div1,.why-choose-us li .div1{height:60px!important;overflow:hidden!important;line-height:60px!important;float:right!important;}
#whyChooseUs li .div1 strong,#whyChooseUs li .div1 b,.why-choose-us li .div1 strong,.why-choose-us li .div1 b{display:block!important;line-height:60px!important;height:60px!important;font-size:40px!important;transition:all 0.6s!important;}
#whyChooseUs li b,.why-choose-us li b{color:#e72321!important;}
/* [2026-10-04] 卡片右下角默认数字（strong，如 01/02/03/04）颜色；悬停切换出的 b 仍是站点红（见上一行）。
   勿把 color 写进上面 1905 行那条共用规则，否则会连带覆盖 b 的红色 */
#whyChooseUs li .div1 strong,.why-choose-us li .div1 strong{color:#ccc!important;}
#whyChooseUs li:hover b,.why-choose-us li:hover b{margin-top:0!important;}
#whyChooseUs li:hover strong,.why-choose-us li:hover strong{margin-top:-60px!important;}
#whyChooseUs li .cir,.why-choose-us li .cir{position:absolute!important;top:0!important;right:0!important;left:-50%!important;background:#F4F4F4!important;height:200%!important;width:100%!important;transform:scale(0)!important;transition:all 0.6s!important;border-radius:100%!important;z-index:-1!important;}
#whyChooseUs li:hover .cir,.why-choose-us li:hover .cir{transform:scale(1)!important;background:#e72321!important;opacity:0.3!important;}
/* [2026-10-02] 卡片悬停浮起（参照 k48 参考站「高端创意建站品牌专家」.index-ser li:hover）
   效果：上移 2px + 大范围柔和阴影 0 17px 50px rgba(0,0,0,.19)；过渡 进入 .5s ease / 悬停 .3s cubic-bezier(.55,0,.1,1)
   调强弱：改 translate3d 的 -2px（上移量）、box-shadow 的 17px（垂直）/ 50px（扩散）/ .19（浓度）
   注意：此段曾被旧备份覆盖丢失过一次，如需回滚请用 2026-10-02 11:10 之后的备份。 */
#whyChooseUs li{transition:all .5s ease!important;}
#whyChooseUs li:hover{z-index:5!important;box-shadow:0 17px 50px 0 rgba(0,0,0,.19)!important;-webkit-transform:translate3d(0,-2px,0)!important;transform:translate3d(0,-2px,0)!important;-webkit-transition:all .3s cubic-bezier(.55,0,.1,1)!important;transition:all .3s cubic-bezier(.55,0,.1,1)!important;}


/* 为什么选择我们·v3 左右两栏容器（2026-09-14）
   margin-bottom 控制版块底部留白（2026-10-02 由 60px 调到 100px）*/
.why-choose-us-wrap{display:-webkit-box!important;margin-bottom:100px;display:-ms-flexbox!important;display:flex!important;-webkit-box-pack:justify!important;-ms-flex-pack:justify!important;justify-content:space-between!important;-webkit-box-align:stretch!important;-ms-flex-align:stretch!important;align-items:stretch!important;gap:5px;box-sizing:border-box;}
.why-choose-us-left{box-sizing:border-box;width:calc(58% - 15px)!important;-ms-flex-negative:0!important;flex-shrink:0!important;}
.why-choose-us-right{box-sizing:border-box;width:calc(42% - 15px)!important;-ms-flex-negative:0!important;flex-shrink:0!important;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-webkit-box-orient:vertical!important;-ms-flex-direction:column!important;flex-direction:column!important;}

/* v3 右栏 swiper 轮播 */
.why-swiper{width:100%!important;aspect-ratio:16/10;height:auto!important;align-self:flex-start!important;min-height:0;border-radius:25px;overflow:hidden;position:relative;box-sizing:border-box;background:#eee;}
.why-swiper .swiper-wrapper{height:100%!important;}
.why-swiper .swiper-slide{height:100%!important;}
.why-swiper .img-cover{padding-top:0!important;width:100%;height:100%;position:relative;}
/* [2026-10-04] 自适应：为什么选择我们手机端上下堆叠、卡片单列 */
/* 圆点指示器（手机端轮播用，PC 不显示） */
.why-dots{display:none}
@media (max-width:767px){
  /* 修复：≤767 档该 section 宽度塌陷为 0（内容竖排撑出 4117px 高），显式给宽恢复 */
  #whyChooseSec {width: 100%;}
  .why-choose-us-wrap {display: block !important;}
  .why-choose-us-left,.why-choose-us-right {width: 100% !important;}
  .why-choose-us-right {margin-top: 15px;}
  /* [2026-10-05] 标题与「我们能为你做什么」一致（.ydtitle h2 全局 2.2rem≈35px 太大，
     do4s 手机端是 1.25rem，这里对齐）；
     轮播照片下方的「专业/高效/诚信/透明」胶囊手机端不显示（用户要求） */
  #whyChooseSec .ydtitle h2 {font-size: 1.25rem;}
  /* 用 id 提升特异性：下方 2110 行附近的通用 .why-slogan{display:flex!important} 与本条同权重
     且更靠后，若不用 id 选择器会被它盖掉（第一次就踩了这个坑） */
  #whyChooseSec .why-slogan {display: none !important;}
  /* [2026-10-05 轮播版] 四张优势卡横向一排、一屏一卡、左右自动切换：
     ul 变横向轨道，位移由页面内联 JS 控制（与 #do4s 同一套节奏，4s 一张）。
     ★裁剪放外层 .why-choose-us-left（不随轨道位移）——原理同 #do4s，裁剪写轨道自身会裁错位置 */
  #whyChooseUs {flex-wrap: nowrap !important;-webkit-transition: transform .5s ease;transition: transform .5s ease;}
  /* [2026-10-05 二次] 卡片整体缩窄、两侧留白加大（容器15px+22px=37px）。
     ★内缩必须写成「卡片自身 margin 0 22px + flex-basis calc(100% - 44px)」：
     overflow:hidden 的裁剪边界是 padding box（含 padding），给裁剪盒加 padding 挡不住
     下一张卡在 padding 区露边（实测踩坑）；卡片外边距方案下步进=301+44=345=裁剪盒宽，
     下一张卡从 367px 起，彻底出画（与 #do4s 同一套做法） */
  /* [2026-10-05 六次] 裁剪盒顶部留 4px 缓冲：overflow:hidden 从 padding box 顶开始裁，
     当前卡有 translate3d(0,-2px,0) 上浮 → 卡顶会超出裁剪区 2px，1px 上边框整个被裁掉看不见。
     加 padding-top:4px 后 上浮 2px 仍在 padding 区内，上边框正常显示（顶部 padding 不会
     引起两侧露下一张卡的脏边，横向内缩仍由卡片 margin 负责） */
  .why-choose-us-left {overflow: hidden;padding-top: 4px;}
  /* [2026-10-05 三次] 两侧间距减小：37px（22px 卡边距+15px 容器）→ 20px（5px 卡边距+15px 容器）。
     步进仍=轨道宽（translateX -100% 相对裁剪盒），下一张卡从 370px 出画，右缘不露边 */
  #whyChooseUs > li {flex: 0 0 calc(100% - 10px) !important;width: calc(100% - 10px) !important;margin: 0 5px !important;margin-bottom: 0 !important;}
  /* [2026-10-05 三次] 切换圆点按用户要求去掉（HTML 已删，此处兜底隐藏） */
  #whyChooseSec .why-dots {display: none !important;}
  /* [2026-10-05 三次] 当前卡（.cur，由内联 JS 轮播加/摘）等效 PC 悬停态：
     ①红色光晕圆放大 ②数字翻红（灰 01 上移让位红 01，手机端 div1 缩为 43px 故位移 -43px）
     ③上浮 2px ④红色数字 b 加 opacity:.3，与扇面 .cir 的透明度保持一致（用户要求）。
     规则须位于 2097~2110 行 hover 规则之后，!important 同权重靠后胜出 */
  #whyChooseUs > li.cur {z-index: 5 !important;-webkit-transform: translate3d(0,-2px,0) !important;transform: translate3d(0,-2px,0) !important;}
  #whyChooseUs > li.cur .cir {-webkit-transform: scale(1) !important;transform: scale(1) !important;background: #e72321 !important;opacity: .3 !important;}
  #whyChooseUs > li.cur .div1 b {margin-top: 0 !important;opacity: .3 !important;}
  #whyChooseUs > li.cur .div1 strong {margin-top: -43px !important;}
  /* [2026-10-05 四次] 卡片阴影按用户要求全部去掉：基础微阴影（2086 行 0 0 3px rgba(0,0,0,.3)）
     与模板 li 自带的内联 box-shadow（0 0 10px rgba(0,0,0,.15)）一并抹平——
     内联样式优先级高，必须 !important 才压得住；放在 .cur 规则之后同时管住当前卡 */
  /* [2026-10-05 五次] 去掉阴影后改加一条淡灰细边框（1px #e5e5e5）勾勒卡片轮廓——
     卡片白底与版块浅灰底靠边框区分；box-sizing 已被 2086 行设为 border-box，加边不撑宽。
     .cur 当前卡一并覆盖（PC hover 无边框，手机端统一带框，观感更干净） */
  #whyChooseUs > li, #whyChooseUs > li.cur {box-shadow: none !important;border: 1px solid #e5e5e5 !important;}
  /* [2026-10-05] 照片底下空白减小：容器 margin-bottom 100px（PC 值）→ 20px，
     配合下方关于我们版块 110px 顶留白，照片与下一版块间不再有大片空白 */
  #whyChooseSec .why-choose-us-wrap {margin-bottom: 20px;}
}
@media (max-width:640px){
  /* [2026-10-05 三次] 卡片内高度整体压缩（原高 251px）：
     padding 15/20→12/16、标题 22→17px、正文 14/24→13/20、数字牌 60→43px（红/灰两位数字同步缩） */
  #whyChooseUs li,.why-choose-us li {padding: 12px 16px !important;}
  #whyChooseUs li h3,.why-choose-us li h3 {font-size: 17px !important;}
  #whyChooseUs li p,.why-choose-us li p {font-size: 14px !important;height: auto !important;line-height: 20px !important;margin-top: 2px !important;}
  #whyChooseUs li .div1,.why-choose-us li .div1 {height: 43px !important;line-height: 43px !important;}
  #whyChooseUs li .div1 strong,#whyChooseUs li .div1 b,.why-choose-us li .div1 strong,.why-choose-us li .div1 b {height: 43px !important;line-height: 43px !important;font-size: 28px !important;}
}
.why-swiper .img-cover span{position:absolute!important;width:100%!important;height:100%!important;background-size:cover;background-position:center;}

.why-slogan{width:100%;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-webkit-box-pack:center!important;-ms-flex-pack:center!important;justify-content:center!important;gap:20px;padding:18px 15px 5px;box-sizing:border-box}
.why-slogan span{display:inline-block;padding:7px 22px;border-radius:25px;font-size:18px;font-weight:700;color:#fff;background:#333;letter-spacing:.1em;-webkit-transition:all .3s ease!important;transition:all .3s ease!important}
.why-slogan span:nth-child(1){-webkit-animation:why-glow 4s ease infinite!important;animation:why-glow 4s ease infinite!important;-webkit-animation-delay:0s!important;animation-delay:0s!important}
.why-slogan span:nth-child(2){-webkit-animation:why-glow 4s ease infinite!important;animation:why-glow 4s ease infinite!important;-webkit-animation-delay:1s!important;animation-delay:1s!important}
.why-slogan span:nth-child(3){-webkit-animation:why-glow 4s ease infinite!important;animation:why-glow 4s ease infinite!important;-webkit-animation-delay:2s!important;animation-delay:2s!important}
.why-slogan span:nth-child(4){-webkit-animation:why-glow 4s ease infinite!important;animation:why-glow 4s ease infinite!important;-webkit-animation-delay:3s!important;animation-delay:3s!important}
@-webkit-keyframes why-glow{0%,25%,100%{background:#333;color:#fff;-webkit-transform:scale(1)}10%,20%{background:#e72321;color:#fff;-webkit-transform:scale(1.15)}}
@keyframes why-glow{0%,25%,100%{background:#333;color:#fff;transform:scale(1)}10%,20%{background:#e72321;color:#fff;transform:scale(1.15)}}
.why-swiper .swiper-pagination-bullet{background:#fff!important;opacity:.6;}
.why-swiper .swiper-pagination-bullet-active{background:#e72321!important;width:30px;border-radius:10px;opacity:1;}

/* ================================================
   关于我们版块（K587 about-area 移植，2026-09-16）
   ================================================ */
.about-section {
    background-color: #f5f5f5;
    padding: 110px 0 50px;
    /* [2026-10-04] 本版块右侧栏带 WOW fadeInRight（初始 translateX 位移），未滚动到该版块时
       会把文档撑宽 65px，用户可横向拖页。用 overflow-x:clip 只裁横向（不裁纵向，避免影响
       移动端"卡片上压图片"的负 margin），滚动到版块后动画归位，无任何视觉影响。 */
    overflow-x: clip;
}
.about-section > .container {
    width: 100%;
    max-width: 1500px;
}
.about-row {
    display: flex;
    align-items: center;
    justify-content: center; /* 两栏共占95%不满容器，居中分布剩余空间（原整体偏左） */
    position: relative;
}
.about-left {
    flex: 0 0 45%;
    position: relative;
    z-index: 1;
}
.about-thumb {
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
}
.about-thumb img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
}
.about-right {
    flex: 0 0 50%;
    margin-left: -90px;
    position: relative;
    z-index: 2;
}
.about-content {
    background: #fff;
    filter: drop-shadow(0 0 18px rgba(0,0,0,0.15));
    padding: 10px 130px 40px 55px;
    border-radius: 16px;
    position: relative;
}
.about-section-title h6 {
    color: #e72321;
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    margin-bottom: 0;
}
.about-section-title h3 {
    font-size: 32px;
    color: #333;
    line-height: 1;
    margin-top: 18px;
    margin-bottom: 0;
}
.about-desc {
    padding: 20px 0 10px;
}
.about-desc p {
    color: #666;
    font-size: 16px;
    line-height: 2.2;
    margin: 0;
}
.about-btn {
    display: inline-block;
}
.about-btn a {
    position: relative;
    z-index: 1;
    overflow: hidden;
    color: #fff;
    padding: 11px 32px;
    border-radius: 26px;
    display: inline-block;
    background-color: #e72321;
    border: 1px solid #e72321;
    box-shadow: 0 7px 25px rgba(215,164,73,0.3);
    -webkit-transition: 0.5s;
    transition: 0.5s;
    margin-top: 5px;
}
.about-btn a span {
    position: absolute;
    z-index: -1;
    width: 0;
    height: 0;
    display: block;
    border-radius: 30px;
    background-color: #fff;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: width 0.7s ease-in-out, height 0.7s ease-in-out;
    transition: width 0.7s ease-in-out, height 0.5s ease-in-out;
}
.about-btn a:hover {
    background-color: #e72321 !important;
    color: #e72321 !important;
}
.about-btn a:hover span {
    width: 200%;
    height: 500px;
}
/* [2026-10-04] 自适应：公司简介平板缩内边距防溢出，手机端改上下堆叠（卡片上压图片） */
@media (max-width:1280px){
  .about-content {padding: 10px 60px 35px 40px;}
  .about-right {margin-left: -60px;}
}
@media (max-width:991px){
  .about-left {flex: 0 0 44%;}
  .about-right {flex: 0 0 56%;margin-left: -40px;}
  .about-desc p {font-size: 14px;line-height: 1.9;}
}
@media (max-width:767px){
  .about-row {flex-direction: column;justify-content: flex-start;}
  /* [2026-10-05 二次] 顶部灰色背景留白 110px→32px：上一版块（为什么选择我们）底部已有
     20px 外边距，合计约 52px，不再大片空白 */
  .about-section {padding-top: 32px;}
  .about-left {flex: 0 0 100%;}
  .about-right {flex: 0 0 100%;margin-left: 0;margin-top: -45px;}
  .about-content {padding: 18px 18px 28px;}
  .about-section-title h3 {font-size: 24px;}
  .about-desc {padding: 14px 0 6px;}
}
/* ---- 关于我们版块入场动效（2026-10-02）----
   滚动进入视口(.in-view)或鼠标移入(:hover)时：图片栏(.about-left)从左侧滑入，
   文字栏(.about-right)从右侧滑入；播完保持。
   [2026-10-05] 移出 @media(hover:hover) 包裹：手机/触屏同样播放入场动效（用户要求
   「每划到一个版块时都有动效」），触屏上 :hover 永不匹配，只走 .in-view 一条路。 */
.about-section .about-left,
.about-section .about-right {
    opacity: 0;
    -webkit-transition: opacity .8s ease-out 0s, -webkit-transform .8s ease-out 0s;
    transition: opacity .8s ease-out 0s, transform .8s ease-out 0s;
}
.about-section .about-left {
    -webkit-transform: translateX(-80px);
    transform: translateX(-80px);
}
.about-section .about-right {
    -webkit-transform: translateX(80px);
    transform: translateX(80px);
}
.about-section.in-view .about-left,
.about-section:hover .about-left,
.about-section.in-view .about-right,
.about-section:hover .about-right {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/* ====================（建站流程，2026-09-17）==================== */

.pad_top {
    padding-top: 0.5rem;
}
.pad_bot {
    padding-bottom: 5rem;
}

.m {
    max-width: 1700px;
    height: 100%;
    margin: 0 auto;
    padding: 0 100px;
    display: block;
    position: relative;
}

.s_tt {
    text-align: center;
    margin-bottom: 2.5rem;
}

.s_tt h3 {
    font-size: 2.5rem;
    color: #000;
}

.s_tt h3 span {
    display: inline-block;
    position: relative;
    z-index: 1;
}

/* [2026-10-03] 标题右上角装饰由灰色圆圈改为 logo1.png（图片内容偏画布左侧，用 contain 等比缩放） */
.s_tt h3 i {
    display: block;
    width: 4rem;
    height: 4rem;
    background: url(../images/logo1.png) no-repeat center / contain;
    position: absolute;
    right: -1.9rem;
    top: -2rem;
    z-index: -1;
}

.s_tt p {
    font-size: 1rem;
    color: #8d8d8d;
    margin-top: 1rem;
    line-height: 1.5;
}

.j_tab {
    display: table;
    width: 100%;
    height: 100%;
}

.j_tab_cel {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    height: 100%;
}

#s_liucheng {
    width: 100%;
    background: #f5f5f5;
    overflow: hidden;
}

#s_liucheng ul { margin-top: -1rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; }

#s_liucheng ul li {
    text-align: center;
    position: relative;
    padding-top: 1rem;
    width: 11%;
}

#s_liucheng ul li font {
    display: block;
    width: 4.6875rem;
    height: 4.6875rem;
    border-radius: 50%;
    margin: 0 auto;
    text-align: center;
    line-height: 4.6875rem;
    margin-bottom: 1.25rem;
    position: relative;
}

#s_liucheng ul li font img {
    display: inline-block;
    position: relative;
    z-index: 3;
    top: 5px;
}

#s_liucheng ul li p {
    font-size: 1rem;
    color: #333;
    line-height: 1.5rem;
    margin-bottom: 3.625rem;
}

#s_liucheng ul li:hover p {
    color: #e72321;
    font-family: PingFangSC-Medium;
}

#s_liucheng ul li span {
    display: block;
    width: 1.9375rem;
    height: 2.1875rem;
    line-height: 2.1875rem;
    text-align: center;
    background: url(../images/liucheng/liucheng_num.png) center no-repeat;
    margin: 0 auto;
    background-size: contain;
}

#s_liucheng ul li+li:before {
    content: "";
    width: 10px;
    height: 17px;
    display: block;
    background: url(../images/liucheng/liucheng_arrow.png) center no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    margin-left: -5px;
    top: 3rem;
    z-index: 1;
}

#s_liucheng ul li+li:after {
    content: "";
    height: 1px;
    display: block;
    border-bottom: 1px dashed #999;
    position: absolute;
    left: -50%;
    margin-left: 35px;
    right: 50%;
    margin-right: 35px;
    bottom: 1.09375rem;
    z-index: 2;
}

/* [2026-10-04] 自适应：建站流程窄屏加宽每项并隐藏连接箭头/虚线（换行后指向错乱） */
@media (max-width:1200px){
  #s_liucheng ul li {width: 18%;}
}
@media (max-width:991px){
  #s_liucheng ul li+li:before,#s_liucheng ul li+li:after {display: none;}
}
@media (max-width:767px){
  .m {padding: 0 15px;}
  /* [2026-10-05] 一排放 4 个流程：li 30%→22%（4×22%=88% + 3×12px 间距 ≈ 97% 容器宽，正好放下） */
  #s_liucheng ul {gap: 12px;}
  #s_liucheng ul li {width: 22%;}
  #s_liucheng ul li p {font-size: 12px;line-height: 1.4;margin-bottom: 1.6rem;}
  #s_liucheng ul li p br {display: none;}
  /* [2026-10-05 二次] 数字牌（01~02 序号，hover/active 时背景图切换那张）还原为原始尺寸
     （1.9375rem×2.1875rem，随基础规则），上一轮缩到 1.6rem 用户要求改回 */
  #s_liucheng ul li font {width: 3.5rem;height: 3.5rem;margin-bottom: .9rem;
    /* 圆内改 flex 居中：:before/:after 圆环是绝对定位不受影响，图标作为唯一流内子项精准居中 */
    display: flex;align-items: center;justify-content: center;}
  /* 黑色圆底中的图标等比缩到圆的 50%（56px 圆 → 图标约 28px 宽），top 归零由 flex 垂直居中 */
  #s_liucheng ul li font img {width: 50%;height: auto;top: 0;}
  #s_liucheng ul li {padding-top: .6rem;}
}

#s_liucheng ul li font:before {
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
    background: #333333;
    position: absolute;
    z-index: 1;
    left: 0px;
    top: 0px;
    -moz-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -o-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -ms-transition: all .6s cubic-bezier(0.445, 1.045, 0.355, 1);
    transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 1;
    visibility: visible;
}

#s_liucheng ul li font:after {
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
    background: #e72321;
    position: absolute;
    z-index: 2;
    left: 0px;
    top: 0px;
    transform: scale(0.6);
    -webkit-transform: scale(0.6);
    opacity: 0;
    -moz-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -o-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -ms-transition: all .6s cubic-bezier(0.445, 1.045, 0.355, 1);
    transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1);
    visibility: hidden;
}

#s_liucheng ul li:hover font:after {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 1;
    visibility: visible;
}

#s_liucheng ul li:hover font:before {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    opacity: 0;
    visibility: hidden;
}

#s_liucheng ul li:hover span {
    background: url(../images/liucheng/liucheng_num_on.png) center no-repeat;
    color: #fff;
}

/* jello 水波动画（hover 图标抖动效果） */
@-webkit-keyframes jello {
    from, 11.1%, to { -webkit-transform: none; transform: none; }
    22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); }
    33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); }
    44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); }
    55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); }
    66.6% { -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg); }
    77.7% { -webkit-transform: skewX(.390625deg) skewY(.390625deg); transform: skewX(.390625deg) skewY(.390625deg); }
    88.8% { -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg); }
}
@keyframes jello {
    from, 11.1%, to { transform: none; }
    22.2% { transform: skewX(-12.5deg) skewY(-12.5deg); }
    33.3% { transform: skewX(6.25deg) skewY(6.25deg); }
    44.4% { transform: skewX(-3.125deg) skewY(-3.125deg); }
    55.5% { transform: skewX(1.5625deg) skewY(1.5625deg); }
    66.6% { transform: skewX(-.78125deg) skewY(-.78125deg); }
    77.7% { transform: skewX(.390625deg) skewY(.390625deg); }
    88.8% { transform: skewX(-.1953125deg) skewY(-.1953125deg); }
}

/* hover 图标 jello 水波晃动 */
#s_liucheng ul li:hover font img {
    animation: jello 1s;
}

/* 自动轮播高亮（无鼠标悬停时，复用 hover 效果） */
#s_liucheng ul li.active p {
    color: #e72321;
    font-family: PingFangSC-Medium;
}
#s_liucheng ul li.active font:after {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 1;
    visibility: visible;
}
#s_liucheng ul li.active font:before {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    opacity: 0;
    visibility: hidden;
}
#s_liucheng ul li.active span {
    background: url(../images/liucheng/liucheng_num_on.png) center no-repeat;
    color: #fff;
}
#s_liucheng ul li.active font img {
    animation: jello 1s;
}

.why-subtitle{text-align:center;color:#8d8d8d;font-size:1rem;margin:-1vw 0 2vw;letter-spacing:.05em}

/* ===== 成功案例列表悬停动效（对齐参考站 92wailian k686「作品案例」，2026-10-01）=====
   动效构成：红色遮罩自中心展开(600ms) → 四条 1px 白色内框线扫入(340ms,延迟150ms)
             → 标题上浮淡入(300ms,延迟200ms) → 圆形箭头淡入(1600px 以上才显示)
   作用范围：.list-1，即首页「成功案例」版块 + 成功案例列表页
   注意：末尾重新声明了 ≤767px 的移动端样式，覆盖第 1236~1242 行原有规则（移动端不改动效，文字仍在图下方）
*/
.list-1 li a:after {
  content: " ";
  position: absolute;
  left: 0; top: 0; width: 100%; height: 100%;
  z-index: 8;
  /* [2026-10-04] 案例卡片遮罩色：默认深灰 #333（透明度 .85）；调颜色改 rgb 三个值、调透明度改最后一值 */
  background-color: rgba(0, 0, 0, .5);
  opacity: 0;
  -webkit-transition: all 600ms ease 0s;
  transition: all 600ms ease 0s;
  -webkit-clip-path: polygon(50% 20%, 50% 50%, 20% 50%, 50% 50%, 50% 80%, 50% 50%, 80% 50%, 50% 50%);
  clip-path: polygon(50% 20%, 50% 50%, 20% 50%, 50% 50%, 50% 80%, 50% 50%, 80% 50%, 50% 50%);
}
.list-1 li a:hover:after {
  opacity: 1;
  -webkit-clip-path: polygon(50% 0%, 0% 0%, 0% 50%, 0% 100%, 50% 100%, 100% 100%, 100% 50%, 100% 0%);
  clip-path: polygon(50% 0%, 0% 0%, 0% 50%, 0% 100%, 50% 100%, 100% 100%, 100% 50%, 100% 0%);
}

/* [2026-10-03] 案例卡片圆角：只作用于首页「成功案例」版块（#caseSec），
   overflow:hidden 负责把图片、红色遮罩、内框线一并裁成圆角；案例列表页不受影响 */
#caseSec .list-1 li a {border-radius: 15px;overflow: hidden;}

/* [2026-10-07] 首页成功案例卡片比例改 4:3（与案例列表页 .case-wrap 保持一致）：
   padding-top 取宽度的 75% → width:height = 4:3；原本继承全局 .list-1 li .img-cover 的 80%（5:4） */
#caseSec .list-1 li .img-cover { padding-top: 75%; }

/* [2026-10-04] 首页成功案例卡片：悬停只显标题，隐藏摘要（.text 文字层本就仅悬停可见，故等于悬停不出摘要）。
   包 min-width:768px —— 移动端 .list-1 li .text 是图下静态排版，标题+摘要都要保留 */
@media screen and (min-width: 768px) {
  #caseSec .list-1 li .text p { display: none; }
}

/* [2026-10-07] 成功案例列表页（?case/ 及 c1/c2/c3，结构 .case-wrap > .list-1）四项调整：
   1. 一排 3 列（原 25% 即 4 列）
   2. 卡片圆角 15px（overflow:hidden 把图片、遮罩、内框线一并裁圆角）
   3. 悬停遮罩只显标题、不显摘要
   4. 卡片比例改 4:3（原 .list-1 li .img-cover 的 padding-top:80% 是 5:4；
      4:3 → padding-top 取宽度的 75%，即 width:height = 4:3）
   用 .case-wrap 限定作用域，不影响首页 #caseSec 的 4 列布局。
   列宽写在 min-width:768px 里 —— 否则 .case-wrap 的权重会盖过 ≤767px 原有的 2 列规则 */
@media screen and (min-width: 768px) {
  .case-wrap .list-1 li { width: 33.3333%; }
  .case-wrap .list-1 li .text p { display: none; }
}
.case-wrap .list-1 li a { border-radius: 15px; overflow: hidden; }
.case-wrap .list-1 li .img-cover { padding-top: 75%; }

/* 四条内框线容器：四边各内缩 1em（em 由自身 font-size 决定，与参考站一致） */
.list-1 li .css3 {
  position: absolute;
  z-index: 9;
  left: 1em; top: 1em; right: 1em; bottom: 1em;
  font-size: 20px;
}
.list-1 li .border {
  position: absolute;
  z-index: 1;
  background-color: #fff;
}
.list-1 li .border.b_t { left: 0; right: 100%; top: 0; height: 1px; -webkit-transition: all 340ms linear 150ms; transition: all 340ms linear 150ms; }
.list-1 li .border.b_r { top: 0; bottom: 100%; right: 0; width: 1px; -webkit-transition: all 340ms linear 150ms; transition: all 340ms linear 150ms; }
.list-1 li .border.b_b { left: 0; right: 100%; bottom: 0; height: 1px; -webkit-transition: all 340ms linear 150ms; transition: all 340ms linear 150ms; }
.list-1 li .border.b_l { top: 0; bottom: 100%; left: 0; width: 1px; -webkit-transition: all 340ms linear 150ms; transition: all 340ms linear 150ms; }
.list-1 li a:hover .border.b_t,
.list-1 li a:hover .border.b_b { left: 0; right: 0; }
.list-1 li a:hover .border.b_r,
.list-1 li a:hover .border.b_l { top: 1em; bottom: 1em; }

/* 标题层：整体上浮 + 淡入（替代原来的 scale(0) 黑色遮罩放大） */
.list-1 li .text {
  position: absolute;
  left: 0; top: 0; width: 100%; height: 100%;
  z-index: 10;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  box-sizing: border-box;
  overflow: hidden;
  color: #fff;
  text-align: center;
  background: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(20px);
  transform: translateY(20px);
  -webkit-transition: all 250ms ease 0ms;
  transition: all 250ms ease 0ms;
}
.list-1 li a:hover .text {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: all 300ms ease 200ms;
  transition: all 300ms ease 200ms;
}
.list-1 li .inner {
  display: block;
  width: 100%;
  text-align: center;
  padding: 0 30px;
  box-sizing: border-box;
}
.list-1 li .text h4 { margin: 0; }
.list-1 li .text p { margin: 10px 0 0; }

/* 圆形箭头：38px 白圈 + 箭头图标，延迟淡入并回正 */
.list-1 li .inner:after {
  content: " ";
  display: block;
  margin: 20px auto 0;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: #fff solid 1px;
  background-image: url(../images/case_arrow.png);
  background-size: auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  opacity: 0;
  -webkit-transform: rotate(90deg) translateX(10px) scale(0.8);
  transform: rotate(90deg) translateX(10px) scale(0.8);
  -webkit-transition: all 220ms ease 0s;
  transition: all 220ms ease 0s;
}
.list-1 li a:hover .inner:after {
  opacity: 1;
  -webkit-transform: rotate(90deg) translateX(0);
  transform: rotate(90deg) translateX(0);
  -webkit-transition: opacity 300ms ease 340ms, -webkit-transform 400ms ease 440ms;
  transition: opacity 300ms ease 340ms, transform 400ms ease 440ms, -webkit-transform 400ms ease 440ms;
}

@media screen and (max-width: 1440px) { .list-1 li .css3 { font-size: 18px; } }
@media screen and (max-width: 1280px) { .list-1 li .css3 { font-size: 16px; } }

/* 移动端（≤767px）：保持原样式，文字显示在图片下方，关闭悬停动效 */
@media screen and (max-width: 767px) {
  .list-1 li a:after,
  .list-1 li .css3 { display: none; }
  .list-1 li .text {
    position: static;
    width: auto;
    height: auto;
    display: block;
    overflow: visible;
    background-color: #fff;
    color: #333;
    text-align: left;
    opacity: 1;
    visibility: visible;
    -webkit-transform: none;
    transform: none;
  }
  .list-1 li .inner { display: block; text-align: left; padding: 10px; }
  .list-1 li .inner:after { display: none; }
  .list-1 li .text p { margin-top: 0; color: #666; }
}

/* ===== [2026-10-05] 服务页 fuwu.html（V4，banner 仔细参照 lianyayun：多色光斑渐变+光影束+磨砂颗粒；
   版式参照雍熙参考图：左=标题+插图，右=编号在上+文案+单列勾选清单+药丸按钮；02 区块左右反向）===== */
/* --- banner [2026-10-07 V6] 服务页 banner 重做为「深蓝黑 · 蜂巢矩阵」动效横幅（第七版风格）：
   深蓝黑渐变流动底 + 六边形蜂巢图案（斜向缓慢流动）+ 斜向扫过的柔光（screen 混合，经过处蜂巢局部亮起）
   + 右下角脉冲发光的六边形轮廓 + 薄荷绿/蓝双光晕 + 磨砂颗粒。
   文字【与其他栏目 banner 完全统一】：胶囊标签 → h2 标题 → 渐变分隔短线(带发光圆点) → 副标题 p，
   字号 52/18、字距 6/3、间距 24/22/20、入场方式(缩放浮现/上浮)均与其他栏目一致，只是主色换成薄荷绿。
   命名前缀 sva-，只作用于本页 .fw-banner --- */
.fw-banner {position: relative;height: 460px;overflow: hidden;display: flex;align-items: center;justify-content: center;text-align: center;background: linear-gradient(135deg,#04080f 0%,#081321 36%,#0b1c30 62%,#050a11 100%);background-size: 220% 220%;-webkit-animation: svaBg 18s ease-in-out infinite;animation: svaBg 18s ease-in-out infinite;}
@-webkit-keyframes svaBg {0%, 100% {background-position: 0% 0%;} 50% {background-position: 100% 100%;}}
@keyframes svaBg {0%, 100% {background-position: 0% 0%;} 50% {background-position: 100% 100%;}}
.fw-banner .fw-noise {position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: .14;pointer-events: none;z-index: 4;background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");}
/* 蜂巢图案层：六边形线框整体斜向缓慢流动 */
.fw-banner .sva-hex {position: absolute;left: -90px;top: -90px;width: calc(100% + 180px);height: calc(100% + 180px);z-index: 1;pointer-events: none;opacity: .6;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%233ee6b0' fill-opacity='0.22'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-size: 96px 168px;
  -webkit-mask-image: linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.5) 42%,rgba(0,0,0,.16) 100%);mask-image: linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.5) 42%,rgba(0,0,0,.16) 100%);
  -webkit-animation: svaHexFlow 9s linear infinite;animation: svaHexFlow 9s linear infinite;}
@-webkit-keyframes svaHexFlow {from {background-position: 0 0;} to {background-position: 96px 168px;}}
@keyframes svaHexFlow {from {background-position: 0 0;} to {background-position: 96px 168px;}}
/* 柔光扫过：screen 混合叠加在蜂巢层之上，经过处蜂巢线条被点亮 */
.fw-banner .sva-sweep {position: absolute;left: -20%;top: -40%;width: 140%;height: 180%;z-index: 2;pointer-events: none;mix-blend-mode: screen;
  background: radial-gradient(circle at 50% 50%,rgba(62,230,176,.26),rgba(62,230,176,.06) 36%,rgba(62,230,176,0) 62%);
  -webkit-animation: svaSweep 11s ease-in-out infinite;animation: svaSweep 11s ease-in-out infinite;}
@-webkit-keyframes svaSweep {0%, 100% {-webkit-transform: translate(-12%,-16%) scale(1);transform: translate(-12%,-16%) scale(1);} 50% {-webkit-transform: translate(14%,18%) scale(1.2);transform: translate(14%,18%) scale(1.2);}}
@keyframes svaSweep {0%, 100% {-webkit-transform: translate(-12%,-16%) scale(1);transform: translate(-12%,-16%) scale(1);} 50% {-webkit-transform: translate(14%,18%) scale(1.2);transform: translate(14%,18%) scale(1.2);}}
/* 右下角脉冲发光的六边形轮廓（视觉焦点） */
.fw-banner .sva-hexring {position: absolute;right: -80px;bottom: -110px;width: 400px;height: 400px;z-index: 2;pointer-events: none;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,3 95,27 95,73 50,97 5,73 5,27' fill='none' stroke='%233ee6b0' stroke-width='0.55' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  -webkit-animation: svaHexPulse 6.5s ease-in-out infinite;animation: svaHexPulse 6.5s ease-in-out infinite;}
@-webkit-keyframes svaHexPulse {0%, 100% {opacity: .22;-webkit-transform: scale(.95);transform: scale(.95);} 50% {opacity: .62;-webkit-transform: scale(1.05);transform: scale(1.05);}}
@keyframes svaHexPulse {0%, 100% {opacity: .22;-webkit-transform: scale(.95);transform: scale(.95);} 50% {opacity: .62;-webkit-transform: scale(1.05);transform: scale(1.05);}}
/* 薄荷绿 / 蓝双光晕 */
.fw-banner .sva-glow {position: absolute;border-radius: 50%;pointer-events: none;z-index: 2;-webkit-filter: blur(80px);filter: blur(80px);}
.fw-banner .sva-glow1 {left: -130px;top: -170px;width: 520px;height: 520px;background: radial-gradient(circle,rgba(62,230,176,.3),transparent 65%);-webkit-animation: svaGlow1 11s ease-in-out infinite;animation: svaGlow1 11s ease-in-out infinite;}
.fw-banner .sva-glow2 {right: -160px;bottom: -180px;width: 520px;height: 520px;background: radial-gradient(circle,rgba(43,127,255,.4),transparent 65%);-webkit-animation: svaGlow2 14s ease-in-out infinite;animation: svaGlow2 14s ease-in-out infinite;}
@-webkit-keyframes svaGlow1 {0%, 100% {-webkit-transform: translate(0,0) scale(1);transform: translate(0,0) scale(1);} 50% {-webkit-transform: translate(56px,38px) scale(1.14);transform: translate(56px,38px) scale(1.14);}}
@keyframes svaGlow1 {0%, 100% {-webkit-transform: translate(0,0) scale(1);transform: translate(0,0) scale(1);} 50% {-webkit-transform: translate(56px,38px) scale(1.14);transform: translate(56px,38px) scale(1.14);}}
@-webkit-keyframes svaGlow2 {0%, 100% {-webkit-transform: translate(0,0) scale(1.06);transform: translate(0,0) scale(1.06);} 50% {-webkit-transform: translate(-64px,-46px) scale(.9);transform: translate(-64px,-46px) scale(.9);}}
@keyframes svaGlow2 {0%, 100% {-webkit-transform: translate(0,0) scale(1.06);transform: translate(0,0) scale(1.06);} 50% {-webkit-transform: translate(-64px,-46px) scale(.9);transform: translate(-64px,-46px) scale(.9);}}
/* ---- 文字层：排版/字号/字距/间距与其他栏目 banner 一致 ---- */
.fw-banner .banner-sub-txt {position: relative;z-index: 5;padding: 44px 20px 0;text-align: center;}
.fw-banner .banner-sub-txt h1 {margin: 24px 0 0;font-size: 52px;font-weight: 700;line-height: 1.2;color: #fff;letter-spacing: 6px;text-shadow: 0 0 26px rgba(62,230,176,.35),0 4px 18px rgba(0,0,0,.5);opacity: 0;-webkit-transform: translateY(18px) scale(.98);transform: translateY(18px) scale(.98);-webkit-animation: svaIn 1s cubic-bezier(.2,.7,.3,1) .3s forwards;animation: svaIn 1s cubic-bezier(.2,.7,.3,1) .3s forwards;}
.fw-banner .sva-div {display: block;position: relative;width: 0;height: 2px;margin: 22px auto 0;background: linear-gradient(90deg,#3ee6b0,#2b7fff);-webkit-animation: svaDiv .9s ease-out .7s forwards;animation: svaDiv .9s ease-out .7s forwards;}
.fw-banner .sva-div i {position: absolute;left: 50%;top: 50%;width: 7px;height: 7px;border-radius: 50%;background: #3ee6b0;box-shadow: 0 0 12px #3ee6b0;opacity: 0;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);-webkit-animation: svaDivDot .4s ease-out 1.35s forwards;animation: svaDivDot .4s ease-out 1.35s forwards;}
.fw-banner .banner-sub-txt p {margin: 20px 0 0;font-size: 18px;line-height: 1.6;color: rgba(255,255,255,.8);letter-spacing: 3px;opacity: 0;-webkit-animation: svaIn 1s ease-out .55s forwards;animation: svaIn 1s ease-out .55s forwards;}
@-webkit-keyframes svaIn {to {opacity: 1;-webkit-transform: none;transform: none;}}
@keyframes svaIn {to {opacity: 1;-webkit-transform: none;transform: none;}}
@-webkit-keyframes svaDiv {to {width: 150px;}}
@keyframes svaDiv {to {width: 150px;}}
@-webkit-keyframes svaDivDot {to {opacity: 1;}}
@keyframes svaDivDot {to {opacity: 1;}}
/* 减弱动效偏好：全部停帧但保持内容完整可见 */
@media (prefers-reduced-motion: reduce) {
  .fw-banner .sva-hex,.fw-banner .sva-sweep,.fw-banner .sva-hexring,.fw-banner .sva-glow,
  .fw-banner .banner-sub-txt h1,.fw-banner .sva-div,.fw-banner .sva-div i,.fw-banner .banner-sub-txt p {-webkit-animation: none;animation: none;}
  .fw-banner .banner-sub-txt h1,.fw-banner .banner-sub-txt p {opacity: 1;-webkit-transform: none;transform: none;}
  .fw-banner .sva-div {width: 150px;}
  .fw-banner .sva-div i {opacity: 1;}
}
/* 服务页 banner 自适应（文字尺寸与其他栏目 banner 同一套断点数值） */
@media (max-width: 991px) {
  .fw-banner .sva-hexring {width: 300px;height: 300px;right: -70px;bottom: -90px;}
}
@media (max-width: 767px) {
  .fw-banner .banner-sub-txt {padding-top: 30px;}
  .fw-banner .banner-sub-txt h1 {margin-top: 16px;font-size: 30px;letter-spacing: 3px;}
  .fw-banner .banner-sub-txt p {margin-top: 12px;font-size: 14px;letter-spacing: 2px;}
  .fw-banner .sva-div {margin-top: 14px;}
  .fw-banner .sva-hex {background-size: 66px 115px;-webkit-animation-name: svaHexFlowM;animation-name: svaHexFlowM;}
  .fw-banner .sva-hexring {width: 200px;height: 200px;right: -56px;bottom: -70px;}
  .fw-banner .sva-glow1 {width: 300px;height: 300px;left: -100px;top: -120px;}
  .fw-banner .sva-glow2 {width: 280px;height: 280px;right: -110px;bottom: -120px;}
}
@-webkit-keyframes svaHexFlowM {from {background-position: 0 0;} to {background-position: 66px 115px;}}
@keyframes svaHexFlowM {from {background-position: 0 0;} to {background-position: 66px 115px;}}
/* 版块视口动效：栏目进入视口时内容上移淡入（由页尾 IntersectionObserver 加 .in 触发） */
html.js-anim .fw-sec .fw-left,
html.js-anim .fw-sec .fw-right {opacity: 0;transform: translateY(56px);transition: opacity .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1);}
html.js-anim .fw-sec .fw-right {transition-delay: .15s;}
html.js-anim .fw-sec.in .fw-left,
html.js-anim .fw-sec.in .fw-right {opacity: 1;transform: translateY(0);}

/* --- 区块布局（参照雍熙参考图：左标题+插图 / 右编号+文案+勾选清单+按钮；内容收窄加大两侧留白）--- */
.fw-sec {padding: 80px 0;}
.fw-sec .container {max-width: 1260px;}
.fw-sec-gray {background-color: #f7f7f7;}
/* 鼠标移到某一栏目：整个栏目向上移动、叠加在上一栏之上（参照 yongsy services） */
@media (hover: hover) {
  .fw-sec {position: relative;z-index: 1;transition: transform .5s cubic-bezier(.22,.61,.36,1);}
  .fw-sec:hover {transform: translateY(-28px);z-index: 3;}
}
.fw-item {display: flex;align-items: center;gap: 100px;}
.fw-item.fw-rev {flex-direction: row-reverse;}
.fw-left {flex: 0 0 48%;min-width: 0;}
.fw-right {flex: 1 1 auto;min-width: 0;}
.fw-head {margin: 0;}
/* 编号 + 红色动效线 同一行（动效线在编号右侧） */
.fw-top {display: flex;align-items: center;gap: 16px;margin-bottom: 20px;}
.fw-num {font-size: 28px;font-weight: 600;line-height: 1;color: #2b2b2b;font-style: normal;}
.fw-head h2 {font-size: 30px;line-height: 1.3;color: #333;margin: 0;}
.fw-head h2 small {display: block;font-size: 13px;color: #999;letter-spacing: 2px;text-transform: uppercase;margin-top: 8px;font-weight: normal;}
.fw-desc {margin: 0 0 20px;font-size: 15px;color: #666;line-height: 1.9;}
/* 子栏目：单列勾选清单（参照参考图 ✓ 列表） */
.fw-subs {display: block;margin: 0 0 30px;padding: 0;list-style: none;}
.fw-subs li a {position: relative;display: block;padding: 10px 0 10px 34px;font-size: 16px;color: #333;transition: color .3s, transform .3s;}
/* 对号：内联 svg 描边，栏目进入视口时自上而下错峰「打勾」绘制 */
.fw-subs li a .fw-tick {position: absolute;left: 2px;top: 50%;width: 18px;height: 18px;margin-top: -9px;overflow: visible;}
.fw-subs li a .fw-tick path {fill: none;stroke: #e62022;stroke-width: 3;stroke-linecap: round;stroke-linejoin: round;stroke-dasharray: 24;stroke-dashoffset: 0;}
html.js-anim .fw-subs li a .fw-tick path {stroke-dashoffset: 24;}
html.js-anim .fw-sec.in .fw-subs li a .fw-tick path {animation: fwTick .6s cubic-bezier(.6,.05,.35,1) forwards;}
html.js-anim .fw-sec.in .fw-subs li:nth-child(2) .fw-tick path {animation-delay: .3s;}
html.js-anim .fw-sec.in .fw-subs li:nth-child(3) .fw-tick path {animation-delay: .6s;}
html.js-anim .fw-sec.in .fw-subs li:nth-child(4) .fw-tick path {animation-delay: .9s;}
html.js-anim .fw-sec.in .fw-subs li:nth-child(5) .fw-tick path {animation-delay: 1.2s;}
@keyframes fwTick {from {stroke-dashoffset: 24;} to {stroke-dashoffset: 0;}}
.fw-subs li a:hover {color: #e62022;transform: translateX(4px);}
.fw-subs h4 {display: inline;font-size: 16px;color: inherit;font-weight: 500;margin: 0;line-height: 1.5;}
.fw-subs p {display: none;}
/* 药丸咨询按钮（参照参考图：右侧圆圈箭头） */
.fw-btn {display: inline-flex;align-items: center;gap: 14px;padding: 8px 9px 8px 30px;background-color: #e62022;color: #fff;font-size: 15px;border-radius: 999px;transition: background-color .3s, transform .3s, box-shadow .3s;}
.fw-btn:after {content: '';flex: 0 0 auto;width: 32px;height: 32px;border: 1px solid rgba(255,255,255,.65);border-radius: 50%;background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 1l5 5-5 5' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") center / 11px no-repeat;}
.fw-btn:hover {background-color: #c41518;color: #fff;transform: translateY(-2px);box-shadow: 0 10px 24px rgba(200,20,26,.28);}

/* --- 栏目配色主题（作用于编号旁的动效线、勾选对号、咨询按钮）---
   02 AI营销 = .fw-tone-blue（蓝，与动效图同色系）；03 小程序 = .fw-tone-gray（灰） */
.fw-tone-blue .fw-anim:before, .fw-tone-blue .fw-anim-1:after {background-color: #2f7ae5;}
.fw-tone-blue .fw-anim-1:after {animation-name: fwPulseB;}
.fw-tone-blue .fw-subs li a .fw-tick path {stroke: #2f7ae5;}
.fw-tone-blue .fw-subs li a:hover {color: #2f7ae5;}
.fw-tone-blue .fw-btn {background-color: #2f7ae5;}
.fw-tone-blue .fw-btn:hover {background-color: #1b57c4;box-shadow: 0 10px 24px rgba(47,122,229,.3);}
.fw-tone-gray .fw-anim:before, .fw-tone-gray .fw-anim-1:after {background-color: #6b7280;}
.fw-tone-gray .fw-anim-1:after {animation-name: fwPulseG;}
.fw-tone-gray .fw-subs li a .fw-tick path {stroke: #6b7280;}
.fw-tone-gray .fw-subs li a:hover {color: #4b5563;}
.fw-tone-gray .fw-btn {background-color: #5a6069;}
.fw-tone-gray .fw-btn:hover {background-color: #43484f;box-shadow: 0 10px 24px rgba(60,65,72,.3);}
@keyframes fwPulseB {0% {box-shadow: 0 0 0 0 rgba(47,122,229,.42);} 70% {box-shadow: 0 0 0 10px rgba(47,122,229,0);} 100% {box-shadow: 0 0 0 0 rgba(47,122,229,0);}}
@keyframes fwPulseG {0% {box-shadow: 0 0 0 0 rgba(107,114,128,.42);} 70% {box-shadow: 0 0 0 10px rgba(107,114,128,0);} 100% {box-shadow: 0 0 0 0 rgba(107,114,128,0);}}

/* 咨询按钮：电脑端指向「联系我们」页面，手机端点击直接拨号（≤767 见文件末尾媒体查询） */
.fw-btn-mob {display: none;}

/* --- 4:3 动效插图（占满左栏，纯 CSS）--- */
.fw-art {position: relative;width: 100%;aspect-ratio: 4 / 3;margin-top: 34px;border-radius: 18px;overflow: hidden;box-shadow: 0 18px 44px rgba(0,0,0,.07);}
.fw-art i {display: block;}
.fwa1-glow {position: absolute;width: 70%;height: 70%;left: 15%;top: 15%;border-radius: 50%;background: radial-gradient(circle, rgba(255,255,255,.85), rgba(255,255,255,0) 70%);}

/* 01 网站建设：浏览器窗口 + 漂浮方块 */
.fw-art-1 {background: linear-gradient(135deg, #fdf1f0, #fbe4e2 55%, #f6d7d6);}
.fwa1-browser {position: absolute;left: 15%;top: 17%;width: 66%;background: #fff;border-radius: 10px;box-shadow: 0 26px 54px rgba(150,20,22,.16);overflow: hidden;animation: fwBob 5s ease-in-out infinite;}
.fwa1-bar {height: 26px;background: #f4f4f6;display: flex;align-items: center;gap: 6px;padding: 0 12px;box-sizing: border-box;}
.fwa1-bar i {width: 8px;height: 8px;border-radius: 50%;}
.fwa1-bar i:nth-child(1) {background: #f0908f;}
.fwa1-bar i:nth-child(2) {background: #f5c065;}
.fwa1-bar i:nth-child(3) {background: #8fd3a4;}
.fwa1-hero {margin: 9% 6% 0;height: 36%;border-radius: 8px;background: linear-gradient(90deg, #f7dcdc, #f0bcbc, #f7dcdc);background-size: 220% 100%;animation: fwShimmer 2.6s linear infinite;}
.fwa1-line {margin: 5% 6% 0;height: 10px;border-radius: 5px;background: #f1f1f4;}
.fwa1-line.fwa1-l1 {width: 44%;animation: fwGrow 2.2s ease-in-out infinite;}
.fwa1-line.fwa1-l2 {width: 30%;margin-bottom: 9%;animation: fwGrow 2.2s ease-in-out infinite .4s;}
.fwa1-cube {position: absolute;background: #fff;border-radius: 6px;box-shadow: 0 12px 26px rgba(150,20,22,.14);animation: fwFloat 4.5s ease-in-out infinite;}
.fwa1-c1 {width: 34px;height: 34px;right: 9%;top: 14%;transform: rotate(14deg);background: #f7b9ba;}
.fwa1-c2 {width: 20px;height: 20px;right: 18%;bottom: 16%;transform: rotate(-10deg);animation-delay: .8s;}
.fwa1-c3 {width: 44px;height: 44px;left: 7%;bottom: 10%;transform: rotate(20deg);background: #fbe0df;animation-delay: 1.5s;animation-duration: 5.4s;}
.fwa1-c4 {width: 14px;height: 14px;left: 22%;top: 10%;transform: rotate(-16deg);background: #f2a0a1;animation-delay: 2.2s;}

/* 02 AI营销：AI 核心 + 旋转轨道节点 + 数据律动条（蓝色科技配色） */
.fw-art-2 {background: linear-gradient(135deg, #eef5fd, #dceaf9 60%, #cde2f7);}
.fwa2-ring {position: absolute;left: 50%;top: 46%;border: 1px dashed rgba(46,110,200,.55);border-radius: 50%;transform: translate(-50%,-50%);}
.fwa2-r1 {width: 46%;aspect-ratio: 1;animation: fwSpin 16s linear infinite;}
.fwa2-r2 {width: 72%;aspect-ratio: 1;border-color: rgba(46,110,200,.3);animation: fwSpin 26s linear infinite reverse;}
.fwa2-core {position: absolute;left: 50%;top: 46%;width: 74px;height: 74px;margin: -37px 0 0 -37px;border-radius: 50%;background: linear-gradient(135deg, #4f9dfb, #1b57c4);box-shadow: 0 14px 30px rgba(25,65,150,.35);animation: fwPulseB 2s ease-out infinite;}
.fwa2-core:after {content: 'AI';position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);color: #fff;font-size: 22px;font-weight: 800;letter-spacing: 1px;}
.fwa2-node {position: absolute;left: 50%;top: 46%;transform: translate(-50%,-50%);pointer-events: none;}
.fwa2-node:before {content: '';position: absolute;left: 50%;top: 0;width: 13px;height: 13px;margin-left: -6.5px;border-radius: 50%;background: #2f7ae5;box-shadow: 0 0 0 4px rgba(47,122,229,.16);}
.fwa2-n1 {width: 46%;aspect-ratio: 1;animation: fwSpin 16s linear infinite;}
.fwa2-n2 {width: 72%;aspect-ratio: 1;animation: fwSpin 26s linear infinite reverse;}
.fwa2-n2:before {background: #3a9ec9;box-shadow: 0 0 0 4px rgba(58,158,201,.16);}
.fwa2-n3 {width: 72%;aspect-ratio: 1;animation: fwSpin 26s linear infinite reverse;animation-delay: -13s;}
.fwa2-n3:before {background: #9dc4f2;box-shadow: 0 0 0 4px rgba(157,196,242,.22);}
.fwa2-plus {position: absolute;color: rgba(60,120,200,.42);font-size: 26px;font-weight: 700;font-style: normal;animation: fwFloat 5s ease-in-out infinite;}
.fwa2-plus:before {content: '+';}
.fwa2-p1 {right: 10%;top: 12%;}
.fwa2-p2 {left: 9%;bottom: 20%;font-size: 18px;animation-delay: 1.4s;}
.fwa2-eq {position: absolute;left: 50%;bottom: 9%;transform: translateX(-50%);display: flex;align-items: flex-end;gap: 5px;height: 22px;}
.fwa2-eq i {width: 5px;border-radius: 2px;background: #2f7ae5;transform-origin: bottom center;animation: fwBar 1.3s ease-in-out infinite;opacity: .85;}
.fwa2-eq i:nth-child(1) {height: 12px;animation-delay: 0s;}
.fwa2-eq i:nth-child(2) {height: 20px;animation-delay: .15s;}
.fwa2-eq i:nth-child(3) {height: 14px;animation-delay: .3s;}
.fwa2-eq i:nth-child(4) {height: 22px;animation-delay: .45s;}
.fwa2-eq i:nth-child(5) {height: 10px;animation-delay: .6s;}

/* 03 小程序：手机应用 + 会话气泡 + 扫描线 */
.fw-art-3 {background: linear-gradient(135deg, #f4f5f7, #eceff2 60%, #e3e7ec);}
.fwa3-phone {position: absolute;left: 50%;top: 12%;width: 31%;transform: translateX(-50%);aspect-ratio: 9 / 16.6;background: #26262c;border-radius: 22px;padding: 3.5%;box-sizing: border-box;box-shadow: 0 26px 54px rgba(30,30,40,.28);animation: fwBob 5.5s ease-in-out infinite;}
.fwa3-screen {position: relative;width: 100%;height: 100%;background: #fff;border-radius: 14px;overflow: hidden;}
.fwa3-head {height: 9%;background: #f4f4f6;}
.fwa3-head:after {content: '';display: block;width: 36%;height: 5px;margin: 8px auto 0;border-radius: 3px;background: #dcdce2;}
.fwa3-banner {margin: 7% 8% 0;height: 26%;border-radius: 8px;background: linear-gradient(90deg, #f7dcdc, #f0bcbc, #f7dcdc);background-size: 220% 100%;animation: fwShimmer 2.6s linear infinite;}
.fwa3-grid {display: flex;flex-wrap: wrap;gap: 6px;margin: 7% 8% 0;}
.fwa3-grid i {width: calc(33.33% - 4px);aspect-ratio: 1;border-radius: 7px;background: #f1f1f4;transform-origin: center;animation: fwTile 2.4s ease-in-out infinite;}
.fwa3-grid i:nth-child(2) {animation-delay: .2s;}
.fwa3-grid i:nth-child(3) {animation-delay: .4s;}
.fwa3-grid i:nth-child(4) {animation-delay: .6s;}
.fwa3-grid i:nth-child(5) {animation-delay: .8s;}
.fwa3-grid i:nth-child(6) {animation-delay: 1s;}
.fwa3-scan {position: absolute;left: 0;top: 0;width: 100%;height: 3px;background: linear-gradient(90deg, rgba(230,32,34,0), rgba(230,32,34,.7), rgba(230,32,34,0));animation: fwScanY 3s ease-in-out infinite;}
.fwa3-bubble {position: absolute;right: 12%;top: 16%;background: #fff;border-radius: 12px;padding: 12px 14px;display: flex;gap: 5px;align-items: center;box-shadow: 0 16px 34px rgba(30,30,40,.14);animation: fwFloat 4.2s ease-in-out infinite;}
.fwa3-bubble:after {content: '';position: absolute;left: -5px;top: 50%;width: 10px;height: 10px;background: #fff;transform: translateY(-50%) rotate(45deg);border-radius: 2px;}
.fwa3-bubble i {width: 7px;height: 7px;border-radius: 50%;background: #e62022;animation: fwTile 1.2s ease-in-out infinite;}
.fwa3-bubble i:nth-child(2) {animation-delay: .2s;background: #f5a0a1;}
.fwa3-bubble i:nth-child(3) {animation-delay: .4s;background: #f7d3d4;}
.fwa3-chip {position: absolute;background: #fff;border-radius: 8px;box-shadow: 0 12px 26px rgba(30,30,40,.14);animation: fwFloat 5s ease-in-out infinite;}
.fwa3-chip:after {content: '';position: absolute;inset: 22%;background: conic-gradient(#26262c 25%, transparent 0 50%, #26262c 0 75%, transparent 0);border-radius: 2px;opacity: .8;}
.fwa3-ch1 {width: 46px;height: 46px;left: 14%;top: 24%;transform: rotate(-8deg);}
.fwa3-ch2 {width: 34px;height: 34px;right: 16%;bottom: 12%;transform: rotate(10deg);animation-delay: 1.2s;}

@keyframes fwBob {0%, 100% {transform: translateY(0);} 50% {transform: translateY(-9px);}}
.fwa3-phone {animation-name: fwBobX;}
@keyframes fwBobX {0%, 100% {transform: translateX(-50%) translateY(0);} 50% {transform: translateX(-50%) translateY(-9px);}}
@keyframes fwFloat {0%, 100% {translate: 0 0;} 50% {translate: 0 -12px;}}
@keyframes fwSpin {from {rotate: 0deg;} to {rotate: 360deg;}}
@keyframes fwShimmer {from {background-position: 120% 0;} to {background-position: -120% 0;}}
@keyframes fwGrow {0%, 100% {transform: scaleX(.55);} 50% {transform: scaleX(1);}}
.fwa1-line {transform-origin: left center;}
@keyframes fwTile {0%, 100% {transform: translateY(0);opacity: 1;} 50% {transform: translateY(-4px);opacity: .65;}}
@keyframes fwScanY {0%, 100% {top: 6%;} 50% {top: 88%;}}

/* 红色动效线条（纯 CSS）：底线伸缩+末端脉冲圆点，位于编号右侧 */
.fw-anim {position: relative;width: 130px;height: 10px;margin: 0;}
.fw-anim:before {content: '';position: absolute;left: 0;top: 4px;width: 100%;height: 2px;background-color: #e62022;}
.fw-anim-1:before {transform-origin: left center;animation: fwLine 2.4s ease-in-out infinite;}
.fw-anim-1:after {content: '';position: absolute;right: -2px;top: 1px;width: 8px;height: 8px;border-radius: 50%;background-color: #e62022;animation: fwPulse 1.6s ease-out infinite;}
.fw-anim-2 {display: flex;align-items: flex-end;gap: 4px;height: 16px;}
.fw-anim-2:before, .fw-anim-2:after {display: none;}
.fw-anim-2 i {width: 5px;border-radius: 2px;background-color: #e62022;transform-origin: bottom center;animation: fwBar 1.3s ease-in-out infinite;}
.fw-anim-2 i:nth-child(1) {height: 9px;}
.fw-anim-2 i:nth-child(2) {height: 16px;animation-delay: .18s;}
.fw-anim-2 i:nth-child(3) {height: 12px;animation-delay: .36s;}
.fw-anim-3:after {content: '';position: absolute;top: 0;width: 10px;height: 10px;border-radius: 50%;background-color: #e62022;animation: fwRun 2.2s ease-in-out infinite;}
@keyframes fwLine {0%, 100% {transform: scaleX(.35);} 50% {transform: scaleX(1);}}
@keyframes fwPulse {0% {box-shadow: 0 0 0 0 rgba(230,32,34,.4);} 70% {box-shadow: 0 0 0 10px rgba(230,32,34,0);} 100% {box-shadow: 0 0 0 0 rgba(230,32,34,0);}}
@keyframes fwBar {0%, 100% {transform: scaleY(.35);} 50% {transform: scaleY(1);}}
@keyframes fwRun {0% {left: 0;} 50% {left: calc(100% - 10px);} 100% {left: 0;}}
@media (prefers-reduced-motion: reduce) {
  .fw-anim:before, .fw-anim:after, .fw-anim-2 i,
  .fw-banner i, .fw-banner h1, .fw-art i, .fw-art div {animation: none !important;}
  .fw-subs li a .fw-tick path {animation: none !important;stroke-dashoffset: 0 !important;}
  .fw-sec:hover {transform: none !important;}
  html.js-anim .fw-sec .fw-left, html.js-anim .fw-sec .fw-right {opacity: 1 !important;transform: none !important;}
}

/* 服务页自适应：平板收窄间距，手机上下堆叠、清单保持单列 */
@media (max-width: 991px) {
  .fw-item {gap: 60px;}
  .fw-left {flex: 0 0 50%;}
  .fw-banner {height: 380px;}
}
@media (max-width: 767px) {
  .fw-banner {height: 240px;}
  .fw-sec {padding: 44px 0;}
  .fw-item, .fw-item.fw-rev {flex-direction: column;align-items: stretch;gap: 26px;}
  .fw-num {font-size: 24px;margin-bottom: 12px;}
  .fw-head h2 {font-size: 22px;}
  .fw-head h2 small {font-size: 11px;}
  .fw-art {margin-top: 18px;}
  .fw-desc {font-size: 14px;margin: 0 0 14px;}
  .fw-subs {margin-bottom: 22px;}
  .fw-subs li a {font-size: 15px;padding: 8px 0 8px 30px;}
  .fw-top {margin-bottom: 16px;}
  .fw-anim {width: 110px;}
  /* 手机端按钮改为点击拨号 */
  .fw-btn-pc {display: none;}
  .fw-btn-mob {display: inline-flex;}
}

/* ===== 首页红色统计条改造（对齐参考站 92wailian k48，2026-10-01）=====
   结构：.in-total-box(容器,带 perspective) > .in-total-flip(翻转层) > ul.in-total(条框本体)
         + .sub-arrows(banner 前后切换箭头,左侧) + .sub-mouse(鼠标滚动提示,右侧)
   交互：向下滚动 >200px 时条框 rotateX 翻转收起，回到顶部自动展开
*/
.in-total-box {
  position: relative;
  /* banner(.swiper-container) 自带 z-index:1；perspective 会生成独立层叠上下文，
     必须显式抬高，否则整条统计条会被压在 banner 底下 */
  z-index: 3;
  perspective: 800px;
  -webkit-perspective: 800px;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
}
.in-total-flip {
  transform-origin: bottom center;
  -webkit-transform-origin: bottom center;
  transform: rotateX(0deg) translate3d(0, 0, 0);
  -webkit-transform: rotateX(0deg) translate3d(0, 0, 0);
  transition: all .65s cubic-bezier(.55, .65, .55, 1) 0s;
  -webkit-transition: all .65s cubic-bezier(.55, .65, .55, 1) 0s;
}
.in-total-box.active .in-total-flip {
  /* rotateX 翻转收起，同时淡出，避免 100deg 时残留一条细红边 */
  opacity: 0;
  transform: rotateX(100deg) translate3d(0, 0, 0);
  -webkit-transform: rotateX(100deg) translate3d(0, 0, 0);
}
/* 箭头 / 鼠标提示属于条框的一部分，随条框一起收起 */
.in-total-box .sub-arrows,
.in-total-box .sub-mouse {
  transition: opacity .3s ease 0s, visibility .3s ease 0s;
  -webkit-transition: opacity .3s ease 0s, visibility .3s ease 0s;
}
.in-total-box.active .sub-arrows,
.in-total-box.active .sub-mouse {
  opacity: 0;
  visibility: hidden;
}

/* ★ 调条框只改这里 ★
   --bar-h = 条框总高度（margin-top 自动取负值，永远贴住屏幕底部）
   gap     = 三组数字之间的间距
*/
.in-total-box .in-total {
  --bar-h: 130px;
  height: var(--bar-h);
  margin-top: calc(-1 * var(--bar-h));
  padding: 0 200px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 200px;
  border-radius: 15px 15px 0 0;
}
.in-total-box .in-total li {
  float: none;
  width: auto;
  padding: 0;
}
.in-total-box .in-total li p { color: #666; line-height: 25px; margin: 15px 0 0; }
/* [2026-10-04] 自适应：统计条两侧 200px 留白（箭头/鼠标提示）在窄屏放不下，手机端收掉并隐藏装饰件 */
@media (max-width:991px){
  .in-total-box .in-total {--bar-h: 100px;padding: 0 70px;gap: 40px;}
  .in-total-box .sub-arrows {padding-left: 15px;}
  .in-total-box .sub-mouse {padding-right: 15px;}
}
@media (max-width:767px){
  .in-total-box .in-total {--bar-h: 90px;padding: 0 12px;gap: 16px;}
  .in-total-box .sub-arrows,.in-total-box .sub-mouse {display: none;}
  .in-total {margin: 0;}
  .in-total li strong {font-size: 22px;}
  .in-total li strong:before {font-size: 16px;right: -13px;}
  .in-total li span {font-size: 12px;}
  .in-total li p {font-size: 12px;margin-top: 6px;line-height: 18px;}
}

/* 左侧：banner 切换箭头（完全照搬参考站 k48 的 .index-back-box .sub-arrows） */
.in-total-box .sub-arrows {
  position: absolute;
  left: 0;
  top: 0;
  width: auto;
  height: 100%;
  line-height: 100px;
  padding-left: 100px;
  font-size: 0;
  z-index: 4;
}
.in-total-box .sub-arrows i.icom {
  display: inline-block;
  vertical-align: top;
  width: 60px;
  height: 100%;
  cursor: pointer;
  position: relative;
  outline: none;
}
/* 参考站原版：sub-arrows.png 雪碧图（20x15，左右两个 10x15 黑色箭头） */
.in-total-box .sub-arrows i.icom:before {
  content: '';
  display: inline-block;
  position: absolute;
  top: 42%;
  width: 10px;
  height: 15px;
  background-image: url(../images/sub-arrows.png);
  background-position: 0 0;
  background-repeat: no-repeat;
}
.in-total-box .sub-arrows i.icom.prev:before { background-position: 0 0; left: -7px; }
.in-total-box .sub-arrows i.icom.next:before { background-position: -10px 0; left: 24px; }
/* 悬停时出现黑色横线（参考站同款） */
.in-total-box .sub-arrows i.icom:after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -3px;
  width: 30px;
  height: 2px;
  background-color: #000;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  transition: all .3s ease-out 0s;
  -webkit-transition: all .3s ease-out 0s;
}
.in-total-box .sub-arrows i.icom:hover:after { -webkit-transform: scale(1, 1); transform: scale(1, 1); }
/* Swiper 箭头禁用态兜底（loop 模式下不会出现，仅保险） */
.in-total-box .sub-arrows i.icom.swiper-button-disabled { opacity: .35; cursor: default; }
.in-total-box .sub-arrows i.icom.swiper-button-disabled:after { -webkit-transform: scale(0, 1); transform: scale(0, 1); }

/* 右侧：鼠标滚动提示 */
.in-total-box .sub-mouse {
  width: 30px;
  height: 43px;
  position: absolute;
  top: 50%;
  right: 100px;
  margin-top: -15px;
  cursor: pointer;
  z-index: 4;
  -webkit-transform: scale(.7);
  transform: scale(.7);
}
.in-total-box .sub-mouse span {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  animation: ani-svg .85s linear 0s alternate infinite;
  -webkit-animation: ani-svg .85s linear 0s alternate infinite;
}
.in-total-box .sub-mouse img {
  display: block;
  width: 100%;
  height: 100%;
}
@keyframes ani-svg {
  0%   { opacity: .4; -webkit-transform: translateY(-20px); transform: translateY(-20px); }
  15%  { opacity: .65; -webkit-transform: translateY(-15px); transform: translateY(-15px); }
  25%  { opacity: .8; -webkit-transform: translateY(-10px); transform: translateY(-10px); }
  50%  { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
  65%  { opacity: .8; -webkit-transform: translateY(5px); transform: translateY(5px); }
  75%  { opacity: .65; -webkit-transform: translateY(10px); transform: translateY(10px); }
  100% { opacity: .4; -webkit-transform: translateY(15px); transform: translateY(15px); }
}
@-webkit-keyframes ani-svg {
  0%   { opacity: .4; -webkit-transform: translateY(-20px); transform: translateY(-20px); }
  25%  { opacity: .8; -webkit-transform: translateY(-10px); transform: translateY(-10px); }
  50%  { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
  75%  { opacity: .65; -webkit-transform: translateY(10px); transform: translateY(10px); }
  100% { opacity: .4; -webkit-transform: translateY(15px); transform: translateY(15px); }
}

@media screen and (max-width: 767px) {
  /* 移动端：条框恢复常规排版（原第 1206 行规则 margin:0 -15px），箭头/鼠标与翻转收起关闭 */
  .in-total { padding: 0; }
  /* [2026-10-05] 手机端统计条：
     · 上叠量 -30px → -20px —— 即整条向下移动 10px（负 margin 越小越往下）；
     · 底部加 1px 淡灰分隔条 #ececec：把统计条与下方白色版块在视觉上分开，
       避免两片白色连成一整块看不出分界。
     （本条是 ≤767 里最后一条 .in-total-box .in-total 的 margin 规则，2757 行同权重规则会被它覆盖，
       调上叠量/分隔条只动这里） */
  .in-total-box .in-total { margin: -20px -15px 0; height: auto; border-bottom: 1px solid #ececec; }
  .in-total-box .in-total li { height: auto; padding: 15px 0; }
  .in-total li { width: 50%; }
  .in-total-box .sub-arrows,
  .in-total-box .sub-mouse { display: none; }
  .in-total-flip { transition: none; -webkit-transition: none; }
  .in-total-box.active .in-total-flip { transform: none; -webkit-transform: none; opacity: 1; }
  /* [2026-10-05] 资讯中心底部与 LINKS 间距调小：40+25=65px → 16+8=24px
     [2026-10-05 二次] 再压到 0+0：配合 .yunu-link 下移量减到 30%，框上方灰色空带
     由约 118px 缩到约 56px */
  #newsSec {padding-bottom: 0;}
  .flink-sec {padding-top: 0;}
}
/* ===== 首页「我们能为你做什么」入场动效（2026-10-02）=====
   触发方式：①滚动进入视口自动播放（JS 加 .in-view，播完保持，不会留空白）
             ②鼠标移入版块也会触发（保留悬停交互）
   .do 的过渡沿用第 1661 行已有的 transition:all .6s ease-out（不影响原有的宽度展开交互）。
   [2026-10-05] 移出 @media(hover:hover) 包裹：手机/触屏也播放入场动效（用户要求
   「每划到一个版块时都有动效」）。触发由页面内联 JS 的滚动监听加 .in-view（playInView），
   页面加载即调用一次兜底；触屏上 :hover 永不匹配，只走 .in-view 一条路。 */
#do4s .ydtitle {
  opacity: 0;
  -webkit-transform: translateX(-60px);
  transform: translateX(-60px);
  -webkit-transition: opacity .8s ease-out 0s, -webkit-transform .8s ease-out 0s;
  transition: opacity .8s ease-out 0s, transform .8s ease-out 0s;
}
#do4s .dos .do {
  opacity: 0;
  -webkit-transform: translateX(120px);
  transform: translateX(120px);
  -webkit-transition: opacity .7s ease-out 0s, -webkit-transform .7s cubic-bezier(.22,.61,.36,1) 0s, width .45s ease-out, background-color .45s ease-out;
  transition: opacity .7s ease-out 0s, transform .7s cubic-bezier(.22,.61,.36,1) 0s, width .45s ease-out, background-color .45s ease-out;
}
/* [2026-10-05 七次] 卡片入场方向由「上滑 translateY(50px)」改为「**从右往左滑入** translateX(120px)」
   （用户要求：鼠标移到 / 滚动进入「我们能为你做什么」版块时，整个内容从右向左滑入）。
   四张卡错峰 0 / .07 / .14 / .21s，依次从右侧滑进来，观感是整块内容往左推进。
   ★transition 必须写全：原规则只写 opacity/transform 会顶掉 2021 行的 all .45s，
     令「悬停展开」的 width / background-color 失去过渡，故这里把 width、background-color 一并列出；
   ★transition-delay 用四值列表（对应 opacity/transform/width/background-color），
     宽度与背景色不延迟，保证悬停展开依旧即刻响应。
   位移会让卡片向右伸出（溢出），已由 #do4s 的 overflow-x:clip 裁掉，不产生横向滚动条。 */
#do4s .dos .do:nth-child(2) { transition-delay: .07s, .07s, 0s, 0s; }
#do4s .dos .do:nth-child(3) { transition-delay: .14s, .14s, 0s, 0s; }
#do4s .dos .do:nth-child(4) { transition-delay: .21s, .21s, 0s, 0s; }
#do4s.in-view .ydtitle,
#do4s.in-view .dos .do,
#do4s:hover .ydtitle,
#do4s:hover .dos .do {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}
/* ===== [2026-10-05] PC 端「我们能为你做什么」：卡片内容从右往左滑入 =====
   原有悬停交互只是把卡片宽 18%→46%、.item_list 宽 0→60%（内容像被宽度"裁"出来）；
   这里再给展开出来的列表内容本身加一段位移（translateX 90px → 0）+ 淡入，
   鼠标划过卡片时内容是**从右侧滑进来**的。
   时序：延迟 .1s 起步（先让卡片宽度展开一点）+ .5s 滑入到位，与 .45s 宽度过渡自然接力；
       收起方向无延迟、短时长 .25s，鼠标移开时内容迅速退场不滞留。
   ★必须限定 ≥768px：手机端四卡是横向轨道轮播，内联 JS 的 do4sGo 同样会给当前卡加
     .current，但手机上四张卡的内容要**常显**，若一起隐藏会导致非当前卡全空白。 */
@media screen and (min-width: 768px) {
  #do4s .do .item_list > ul {
    opacity: 0;
    -webkit-transform: translateX(90px);
    transform: translateX(90px);
    -webkit-transition: opacity .25s ease-out 0s, -webkit-transform .25s ease-out 0s;
    transition: opacity .25s ease-out 0s, transform .25s ease-out 0s;
  }
  #do4s .do.current .item_list > ul,
  #do4s .do:hover .item_list > ul {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: opacity .5s ease-out .1s, -webkit-transform .5s cubic-bezier(.22,.61,.36,1) .1s;
    transition: opacity .5s ease-out .1s, transform .5s cubic-bezier(.22,.61,.36,1) .1s;
  }
}
/* ===== 首页「为什么选择我们」入场动效（2026-10-02）=====
   触发方式：滚动进入视口自动播放（JS 加 .in-view，播完保持，不会留空白）
   动效：标题与左侧文字块从左侧划入，右侧轮播块从右侧滑入，错峰 0 / .1s / .25s
   外面包 @media (hover:hover) and (pointer:fine)：触屏设备不启用，避免内容被永久隐藏。
   说明：轮播 Swiper 用 offsetWidth 计算尺寸，transform 不改变布局，故动画期间轮播照常工作。
   要调幅度/速度：改下面的 translateX 距离与 .8s 时长；错峰改 transition 末位的延迟值。
*/
/* [2026-10-05] 移出 @media(hover:hover) 包裹：手机/触屏也播放入场动效（用户要求"手指划到
   内容区就要出动效，无需点击"）。触发仍由页面内联 JS 的滚动监听加 .in-view（playInView），
   手机上滚动到版块即播，无需任何点击。触屏安全性：JS 是内联脚本必然执行，若极端情况 JS 未跑，
   版块由 .in-view 缺失保持隐藏——已通过 playInView() 页面加载即调用兜底 */
#whyChooseSec .ydtitle {
  opacity: 0;
  -webkit-transform: translateX(-60px);
  transform: translateX(-60px);
  -webkit-transition: opacity .8s ease-out 0s, -webkit-transform .8s ease-out 0s;
  transition: opacity .8s ease-out 0s, transform .8s ease-out 0s;
}
/* 左侧文字块：从左侧划入 */
#whyChooseSec .why-choose-us-left {
  opacity: 0;
  -webkit-transform: translateX(-80px);
  transform: translateX(-80px);
  -webkit-transition: opacity .8s ease-out .1s, -webkit-transform .8s ease-out .1s;
  transition: opacity .8s ease-out .1s, transform .8s ease-out .1s;
}
/* 右侧轮播块：从右侧滑入 */
#whyChooseSec .why-choose-us-right {
  opacity: 0;
  -webkit-transform: translateX(80px);
  transform: translateX(80px);
  -webkit-transition: opacity .8s ease-out .25s, -webkit-transform .8s ease-out .25s;
  transition: opacity .8s ease-out .25s, transform .8s ease-out .25s;
}
#whyChooseSec.in-view .ydtitle,
#whyChooseSec.in-view .why-choose-us-left,
#whyChooseSec.in-view .why-choose-us-right {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}
/* [2026-10-05] 右栏入场前 translateX(80px) 会把版块撑宽 65~80px（手机上可横向拖页），
   与 about-section 同款修法：只裁横向，不裁纵向 */
#whyChooseSec {overflow-x: clip;}

/* ===== [2026-10-13] 小程序页（xcx.html 总览 / xcx-detail.html 四个子栏目内容页）=====
   命名前缀 xcs-，仅作用于 .xcs-* 容器，不影响本站其他页面；
   参考站 xd029.com/xcx 的原站 class（lanyun-*）一律未沿用 */
/* --- 四大类目导航卡 --- */
/* 保险：本站 .clearfix:before 会变成 grid 的幽灵首格，grid 容器一律禁用伪元素 */
.xcs-cat-list:before, .xcs-grid:before, .xcs-cat-list:after, .xcs-grid:after {display: none;content: none;}
.xcs-cats {padding: 72px 0 24px;background-color: #fff;}
.xcs-cats .container {max-width: 1260px;}
.xcs-cats-head {text-align: center;}
.xcs-cats-head h2 {font-size: 30px;color: #222;letter-spacing: 2px;font-weight: 700;}
.xcs-cats-head h2:after {content: '';display: block;width: 46px;height: 3px;margin: 16px auto 0;background-color: #e62022;}
.xcs-cats-head p {margin-top: 18px;font-size: 15px;color: #888;line-height: 1.9;}
.xcs-cat-list {margin-top: 42px;list-style: none;display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px;}
.xcs-cat-list li {display: flex;}
.xcs-cat-list li a {display: block;flex: 1 1 auto;padding: 30px 24px 26px;background-color: #fff;border: 1px solid #ececec;border-radius: 12px;text-align: left;transition: border-color .35s, box-shadow .35s, transform .35s;}
.xcs-cat-list li a:hover {border-color: #ffd5d6;transform: translateY(-6px);box-shadow: 0 18px 40px rgba(0,0,0,.08);}
.xcs-cat-ico {display: inline-flex;align-items: center;justify-content: center;width: 54px;height: 54px;border-radius: 14px;background-color: rgba(230,32,34,.08);color: #e62022;transition: background-color .35s, color .35s;}
.xcs-cat-ico svg {width: 26px;height: 26px;}
.xcs-cat-list li a:hover .xcs-cat-ico {background-color: #e62022;color: #fff;}
.xcs-cat-list h3 {margin-top: 20px;font-size: 19px;color: #222;font-weight: 600;}
.xcs-cat-list p {margin-top: 10px;font-size: 13px;color: #8b8b8b;line-height: 1.8;}
.xcs-cat-more {display: inline-flex;align-items: center;gap: 6px;margin-top: 16px;font-size: 13px;color: #e62022;}
.xcs-cat-more svg {width: 14px;height: 14px;transition: transform .35s;}
.xcs-cat-list li a:hover .xcs-cat-more svg {transform: translateX(4px);}

/* --- 类目区块 --- */
.xcs-sec {padding: 72px 0;}
.xcs-sec .container {max-width: 1260px;}
.xcs-sec-gray {background-color: #f7f7f7;}
.xcs-sec-head {display: flex;align-items: center;gap: 18px;padding-bottom: 22px;margin-bottom: 36px;border-bottom: 1px solid #ececec;}
.xcs-sec-gray .xcs-sec-head {border-bottom-color: #e6e6e6;}
.xcs-sec-no {flex: 0 0 auto;font-size: 34px;font-weight: 800;font-style: normal;color: #e62022;line-height: 1;letter-spacing: 1px;}
.xcs-sec-tit h2 {font-size: 26px;color: #222;line-height: 1.3;font-weight: 700;}
.xcs-sec-tit small {display: block;margin-top: 8px;font-size: 11px;letter-spacing: 3px;color: #a0a0a0;text-transform: uppercase;}
.xcs-sec-link {margin-left: auto;flex: 0 0 auto;display: inline-flex;align-items: center;gap: 8px;padding: 10px 20px;font-size: 14px;color: #666;border: 1px solid #ddd;border-radius: 999px;transition: background-color .35s, color .35s, border-color .35s;}
.xcs-sec-link svg {width: 15px;height: 15px;transition: transform .35s;}
.xcs-sec-link:hover {background-color: #e62022;border-color: #e62022;color: #fff;}
.xcs-sec-link:hover svg {transform: translateX(3px);}

/* --- 方案卡片网格 --- */
.xcs-grid {display: grid;grid-template-columns: 1fr;gap: 24px;}
.xcs-item {display: flex;flex-direction: row;align-items: stretch;background-color: #fff;border: 1px solid #ececec;border-radius: 14px;overflow: hidden;transition: transform .35s, box-shadow .35s, border-color .35s;}
.xcs-item:hover {transform: translateY(-6px);border-color: #ffd5d6;box-shadow: 0 18px 40px rgba(0,0,0,.09);}
.xcs-shot {position: relative;flex: 0 0 42%;display: flex;align-items: center;justify-content: center;height: 348px;padding: 0;background-color: #f6f7f9;background-image: linear-gradient(160deg, #f8f9fb 0%, #eef1f5 100%);}
.xcs-shot img {display: block;max-width: 86%;max-height: 82%;width: auto;height: auto;object-fit: contain;border-radius: 8px;box-shadow: 0 10px 26px rgba(23,37,63,.12);}
.xcs-shot-one {display: flex;align-items: center;justify-content: center;height: 100%;}
.xcs-shot-two {display: flex;align-items: center;justify-content: center;gap: 12px;height: 100%;}
.xcs-shot-two img {max-width: calc(50% - 6px);max-height: 100%;}
/* 原站未配截图的方案：用纯 CSS 小程序卡片占位，保持版式整齐 */
.xcs-mock {width: 138px;height: 220px;padding: 13px 13px 0;background-color: #fff;border: 1px solid #e6e9ee;border-radius: 18px;box-shadow: 0 12px 28px rgba(23,37,63,.12);overflow: hidden;}
.xcs-mock-bar {display: flex;gap: 5px;margin-bottom: 11px;}
.xcs-mock-bar i {display: block;width: 6px;height: 6px;border-radius: 50%;background-color: #e2e6ec;}
.xcs-mock-bar i:first-child {background-color: #e62022;}
.xcs-mock-banner {height: 66px;border-radius: 8px;background-image: linear-gradient(135deg, #ffe4e4 0%, #ffd0d1 100%);}
.xcs-mock-list {margin-top: 12px;}
.xcs-mock-list i {display: block;height: 25px;margin-bottom: 9px;border-radius: 6px;background-color: #f2f4f7;}
.xcs-body {flex: 1 1 auto;display: flex;flex-direction: column;justify-content: center;padding: 20px 42px 20px 36px;}
.xcs-num {display: block;align-self: flex-start;height: 30px;width: auto;margin-bottom: 14px;}
.xcs-titrow {display: flex;align-items: center;gap: 14px;}
.xcs-titrow .xcs-num {margin-bottom: 0;flex: 0 0 auto;align-self: center;}
.xcs-titrow h3 {margin: 0;}
.xcs-body h3 {font-size: 19px;color: #222;line-height: 1.55;font-weight: 600;}
.xcs-sub {margin-top: 9px;font-size: 13px;color: #e62022;letter-spacing: .3px;}
.xcs-text {margin-top: 13px;font-size: 14px;color: #7c7c7c;line-height: 2;}
.xcs-more {display: inline-block;align-self: flex-start;margin-top: 18px;padding-bottom: 2px;font-size: 13px;color: #999;border-bottom: 1px solid #e0e0e0;transition: color .35s, border-color .35s;}
.xcs-more:after {content: ' \2192';}
.xcs-more:hover {color: #e62022;border-bottom-color: #e62022;}

/* --- 底部咨询 CTA --- */
.xcs-cta {padding: 62px 0;background-image: linear-gradient(120deg, #1d2026 0%, #2c313c 100%);}
.xcs-cta .container {max-width: 1260px;}
.xcs-cta-inner {display: flex;align-items: center;justify-content: space-between;gap: 26px;flex-wrap: wrap;}
.xcs-cta-inner h2 {font-size: 26px;color: #fff;font-weight: 600;}
.xcs-cta-inner p {margin-top: 14px;max-width: 660px;font-size: 14px;color: rgba(255,255,255,.68);line-height: 1.9;}
.xcs-cta .btn {display: flex;align-items: center;gap: 14px;}

/* --- 自适应 --- */
@media screen and (max-width: 1100px) {
  .xcs-cat-list {grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width: 991px) {
  .xcs-sec, .xcs-cats {padding: 52px 0;}
  .xcs-item {flex-direction: column;}
  .xcs-shot {flex: 0 0 auto;height: 230px;min-height: 0;padding: 20px;}
  .xcs-body {padding: 22px 24px 26px;}
}
@media screen and (max-width: 767px) {
  .xcs-cats {padding: 40px 0 12px;}
  .xcs-cats-head h2 {font-size: 22px;}
  .xcs-cats-head p {font-size: 13px;}
  .xcs-cat-list {grid-template-columns: 1fr;margin-top: 28px;gap: 14px;}
  .xcs-cat-list li a {padding: 22px 18px;}
  .xcs-sec {padding: 40px 0;}
  .xcs-sec-head {gap: 10px 12px;flex-wrap: wrap;padding-bottom: 16px;margin-bottom: 24px;}
  .xcs-sec-tit {flex: 1 1 auto;min-width: 0;}
  .xcs-sec-tit h2 {white-space: nowrap;}
  .xcs-sec-no {font-size: 26px;}
  .xcs-sec-tit h2 {font-size: 20px;}
  .xcs-sec-tit small {font-size: 10px;letter-spacing: 2px;}
  .xcs-sec-link {width: 100%;margin-left: 0;justify-content: center;padding: 9px 16px;font-size: 13px;}
  .xcs-grid {grid-template-columns: 1fr;gap: 18px;}
  .xcs-shot {height: 210px;padding: 18px;}
  .xcs-body {padding: 20px 20px 24px;}
  .xcs-body h3 {font-size: 17px;}
  .xcs-text {font-size: 13px;line-height: 1.95;}
  .xcs-cta {padding: 40px 0;}
  .xcs-cta-inner {display: block;}
  .xcs-cta-inner h2 {font-size: 20px;}
  .xcs-cta-inner p {font-size: 13px;margin-top: 10px;}
  .xcs-cta .btn {margin-top: 22px;}
}
/* ===== [2026-10-13] 小程序方案详情页（xcx-s-*.html 15 页共用，前缀 xsd-） =====
   版式沿用 xcs- 体系；banner 为自绘动效 hero（原站 banner 的标题/描述/按钮/手机图全部保留） */

/* --- 动效 Banner --- */
.xsd-hero {position:relative;overflow:hidden;padding:92px 0 86px;background-color:#14161c;
  background-image:linear-gradient(125deg,#15171e 0%,#1d2129 46%,#2a1f2b 100%);
  background-size:180% 180%;animation:xsd-heroShift 16s ease-in-out infinite;}
@keyframes xsd-heroShift {0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.xsd-gridbg {position:absolute;inset:-60px;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:44px 44px;animation:xsd-gridMove 26s linear infinite;}
@keyframes xsd-gridMove {to{background-position:44px 44px}}
.xsd-noise {position:absolute;inset:0;pointer-events:none;opacity:.45;
  background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:24px 24px;
  animation:xsd-noiseDrift 34s linear infinite;}
@keyframes xsd-noiseDrift {to{background-position:240px 240px}}
.xsd-orb {position:absolute;border-radius:50%;pointer-events:none;}
.xsd-orb1 {width:360px;height:360px;left:-100px;top:-120px;
  background:radial-gradient(circle at 35% 35%,rgba(230,32,34,.5),rgba(230,32,34,0) 70%);animation:xsdFloat1 9s ease-in-out infinite;}
.xsd-orb2 {width:280px;height:280px;right:10%;top:6%;
  background:radial-gradient(circle at 40% 40%,rgba(96,126,255,.38),rgba(96,126,255,0) 70%);animation:xsdFloat2 11s ease-in-out infinite;}
.xsd-orb3 {width:220px;height:220px;left:36%;bottom:-90px;
  background:radial-gradient(circle at 40% 40%,rgba(255,190,80,.26),rgba(255,190,80,0) 70%);animation:xsdFloat3 13s ease-in-out infinite;}
@keyframes xsdFloat1 {0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(42px,28px) scale(1.12)}}
@keyframes xsdFloat2 {0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-36px,32px) scale(1.08)}}
@keyframes xsdFloat3 {0%,100%{transform:translate(0,0)}50%{transform:translate(28px,-32px)}}
.xsd-hero .container {position:relative;z-index:2;}
.xsd-hero-in {display:flex;align-items:center;gap:44px;}
.xsd-hero-txt {flex:1 1 auto;min-width:0;}
.xsd-eyebrow {display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:4px;color:rgba(255,255,255,.6);}
.xsd-eyebrow i {display:block;width:26px;height:1px;background-color:rgba(255,255,255,.4);}
.xsd-hero-txt h1 {margin-top:18px;font-size:40px;line-height:1.25;color:#fff;font-weight:700;}
.xsd-div {display:block;width:56px;height:3px;margin:22px 0;background-color:#e62022;border-radius:2px;position:relative;overflow:hidden;}
.xsd-div i {position:absolute;inset:0;background-image:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);animation:xsdShine 2.4s linear infinite;}
@keyframes xsdShine {0%{transform:translateX(-110%)}100%{transform:translateX(110%)}}
.xsd-hero-desc {max-width:600px;font-size:15px;line-height:2;color:rgba(255,255,255,.72);}
.xsd-hero-btns {display:flex;align-items:center;gap:16px;margin-top:30px;flex-wrap:wrap;}
.xsd-btn {position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;padding:13px 30px;
  background-color:#e62022;color:#fff;font-size:15px;border-radius:999px;transition:transform .3s,box-shadow .3s;}
.xsd-btn svg {width:16px;height:16px;}
.xsd-btn:hover {transform:translateY(-2px);box-shadow:0 12px 30px rgba(230,32,34,.45);}
.xsd-btn:after {content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;
  background-image:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);animation:xsdBtnShine 3.4s ease-in-out infinite;}
@keyframes xsdBtnShine {0%{left:-60%}55%,100%{left:130%}}
.xsd-btn-ghost {display:inline-flex;align-items:center;padding:12px 26px;font-size:14px;color:rgba(255,255,255,.8);
  border:1px solid rgba(255,255,255,.28);border-radius:999px;transition:background-color .3s,color .3s,border-color .3s;}
.xsd-btn-ghost:hover {background-color:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.5);}
.xsd-hero-pic {position:relative;flex:0 0 420px;display:flex;align-items:flex-start;justify-content:center;min-height:380px;padding-top:64px;}
.xsd-ring {position:absolute;inset:0;margin:auto;width:76%;aspect-ratio:1;border-radius:50%;border:1px dashed rgba(255,255,255,.18);animation:xsdSpin 28s linear infinite;}
@keyframes xsdSpin {to{transform:rotate(360deg)}}
.xsd-dot {position:absolute;width:14px;height:14px;border-radius:50%;background-color:#e62022;
  box-shadow:0 0 18px rgba(230,32,34,.9);top:5%;right:11%;animation:xsdDot 6s ease-in-out infinite;}
@keyframes xsdDot {0%,100%{transform:translate(0,0)}25%{transform:translate(-32px,20px)}50%{transform:translate(4px,44px)}75%{transform:translate(36px,10px)}}
.xsd-hero-img {position:relative;z-index:2;max-width:100%;max-height:430px;width:auto;height:auto;object-fit:contain;
  border-radius:16px;box-shadow:0 30px 70px rgba(0,0,0,.45);animation:xsdBob 5.5s ease-in-out infinite;}
@keyframes xsdBob {0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-18px) rotate(1deg)}}
/* 入场动效：仅 JS 可用时启用（.js-anim），无 JS 内容照常显示 */
.js-anim .xsd-hero .xsd-ani {opacity:0;animation:xsdUp .85s cubic-bezier(.22,.7,.3,1) forwards;}
.js-anim .xsd-hero .xsd-ani.a1 {animation-delay:.05s}
.js-anim .xsd-hero .xsd-ani.a2 {animation-delay:.18s}
.js-anim .xsd-hero .xsd-ani.a3 {animation-delay:.32s}
.js-anim .xsd-hero .xsd-ani.a4 {animation-delay:.46s}
.js-anim .xsd-hero .xsd-ani.a5 {animation-delay:.6s}
@keyframes xsdUp {from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}

/* --- 内容区块 --- */
.xsd-sec {padding:68px 0;background-color:#fff;}
.xsd-sec-alt {background-color:#f7f7f8;}
.xsd-sec .container {max-width:1260px;}
.xsd-sec-head {display:flex;align-items:center;gap:16px;padding-bottom:20px;margin-bottom:32px;border-bottom:1px solid #ececec;}
.xsd-sec-no {font-size:32px;font-weight:800;font-style:italic;color:#e62022;line-height:1;}
.xsd-sec-tit h2 {font-size:25px;color:#222;font-weight:700;line-height:1.3;}
.xsd-sec-lead {padding:60px 0 4px;background:none;}
.xsd-sec-lead .container {max-width:1260px;}
.xsd-lead {font-size:29px;text-align:center;color:#222;font-weight:700;letter-spacing:1px;}
.xsd-lead:after {content:'';display:block;width:44px;height:3px;margin:16px auto 0;background-color:#e62022;border-radius:2px;}
.xsd-sec-body {display:block;}
.xsd-sec-body > * + * {margin-top:26px;}

/* 卡片 */
.xsd-cards {display:grid;gap:20px;}
.xsd-cards-2 {grid-template-columns:repeat(2,1fr);}
.xsd-cards-3 {grid-template-columns:repeat(3,1fr);}
.xsd-cards-4 {grid-template-columns:repeat(4,1fr);}
.xsd-card {display:flex;gap:16px;padding:24px;background-color:#fff;border:1px solid #ececec;border-radius:14px;
  transition:transform .35s,box-shadow .35s,border-color .35s;}
.xsd-card:hover {transform:translateY(-5px);border-color:#ffd5d6;box-shadow:0 16px 36px rgba(0,0,0,.08);}
.xsd-card-ico {flex:0 0 48px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;
  border-radius:12px;background-color:rgba(230,32,34,.08);}
.xsd-card-ico img {max-width:30px;max-height:30px;width:auto;height:auto;}
.xsd-card-bd {flex:1 1 auto;min-width:0;}
.xsd-card-bd h3 {font-size:17px;color:#222;font-weight:600;line-height:1.5;}
.xsd-card-bd p {margin-top:8px;font-size:13px;color:#7c7c7c;line-height:1.9;}
.xsd-chips {display:flex;flex-wrap:wrap;gap:12px;}
.xsd-chip {padding:10px 24px;background-color:#fff;border:1px solid #e6e6e6;border-radius:999px;font-size:14px;color:#444;
  transition:color .3s,border-color .3s,transform .3s;}
.xsd-chip:hover {border-color:#e62022;color:#e62022;transform:translateY(-2px);}

/* 截图 */
.xsd-shots {display:grid;gap:18px;}
.xsd-shots-2 {grid-template-columns:repeat(2,1fr);}
.xsd-shots-3 {grid-template-columns:repeat(3,1fr);}
.xsd-shots-4 {grid-template-columns:repeat(4,1fr);}
.xsd-shot {display:flex;align-items:center;justify-content:center;min-height:200px;padding:20px;
  background-color:#f6f7f9;background-image:linear-gradient(160deg,#f8f9fb 0%,#eef1f5 100%);border-radius:14px;}
.xsd-sec-alt .xsd-shot {background-color:#fff;background-image:none;border:1px solid #ececec;}
.xsd-shot-img {display:block;max-width:100%;max-height:430px;width:auto;height:auto;object-fit:contain;}

/* 特色功能（上图下文网格，照源站版式；-tint 为四色卡底变体） */
.xsd-feats {display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.xsd-feats-2 {grid-template-columns:repeat(2,1fr);}
.xsd-feats-3 {grid-template-columns:repeat(3,1fr);}
.xsd-feat {display:flex;flex-direction:column;}
.xsd-feat-img {margin:0;overflow:hidden;border-radius:14px;text-align:center;}
.xsd-feat-img img {display:block;width:100%;height:auto;transition:transform .4s;}
.xsd-feat:hover .xsd-feat-img img {transform:translateY(-5px);}
.xsd-feat-bd {flex:1 1 auto;margin-top:14px;padding:20px 16px;border-radius:14px;text-align:center;
  background-color:#f2f3f5;}
.xsd-feats-left .xsd-feat-bd {text-align:left;}
.xsd-feats-tint .xsd-feat:nth-child(1) .xsd-feat-bd {background-color:#e9f3fb;}
.xsd-feats-tint .xsd-feat:nth-child(2) .xsd-feat-bd {background-color:#fdf1de;}
.xsd-feats-tint .xsd-feat:nth-child(3) .xsd-feat-bd {background-color:#f2f3f5;}
.xsd-feats-tint .xsd-feat:nth-child(4) .xsd-feat-bd {background-color:#e3f5f2;}
.xsd-feat-bd h3 {font-size:16px;color:#222;font-weight:600;line-height:1.5;}
.xsd-feat-bd p {margin-top:8px;font-size:13px;color:#7c7c7c;line-height:1.9;}

/* 目标用户群体（2×2 条目） */
.xsd-targets {display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.xsd-target {padding:20px 26px;background-color:#fff;border:1px solid #ececec;border-radius:14px;
  font-size:16px;color:#333;line-height:1.7;transition:border-color .3s,transform .3s;}
.xsd-target:hover {border-color:#ffd5d6;transform:translateY(-3px);}

/* 适用多个行业（5 列 图上标题下） */
.xsd-indus {display:grid;grid-template-columns:repeat(5,1fr);gap:20px;}
.xsd-indus-item {text-align:center;}
.xsd-indus-img {margin:0;display:flex;align-items:center;justify-content:center;height:120px;}
.xsd-indus-img img {max-width:110px;max-height:110px;width:auto;height:auto;transition:transform .4s;}
.xsd-indus-item:hover .xsd-indus-img img {transform:translateY(-5px);}
.xsd-indus-item > span {display:block;margin-top:10px;font-size:15px;color:#333;font-weight:600;}

/* 自建平台（三列一行：卡片 / 图 / 卡片） */
.xsd-duo {display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:center;}
.xsd-duo-img {margin:0;overflow:hidden;border-radius:14px;}
.xsd-duo-img img {display:block;width:100%;height:auto;}

/* 投票页操作流程（三列截图 + 胶囊说明 + 箭头引导） */
.xsd-vote-flow {display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.xsd-vote-item {display:flex;flex-direction:column;}
.xsd-vote-img {margin:0;display:flex;align-items:center;justify-content:center;min-height:300px;padding:16px;
  background-color:#f6f7f9;background-image:linear-gradient(160deg,#f8f9fb 0%,#eef1f5 100%);border-radius:14px;}
.xsd-sec-alt .xsd-vote-img {background-color:#fff;background-image:none;border:1px solid #ececec;}
.xsd-vote-img img {display:block;max-width:100%;max-height:400px;width:auto;height:auto;object-fit:contain;}
.xsd-vote-cap {margin-top:14px;text-align:center;}
.xsd-vote-cap span {display:inline-block;padding:10px 22px;background-color:#fff;border:1px solid #e6e6e6;
  border-radius:999px;font-size:14px;color:#333;transition:color .3s,border-color .3s;}
.xsd-vote-cap span:hover {border-color:#e62022;color:#e62022;}
.xsd-vote-mid {display:flex;flex-direction:column;align-items:center;gap:8px;padding:30px 0 8px;text-align:center;}
.xsd-vote-mid em {font-style:normal;font-size:46px;line-height:1.1;color:#ced4d9;}
.xsd-vote-mid strong {font-size:16px;color:#222;font-weight:700;}

/* 自建商城双列（标签图 + 说明） */
.xsd-tags2 {display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:34px;}
.xsd-tags2-item {position:relative;margin-top:26px;padding:40px 28px 26px;background-color:#fff;border:1px solid #eef0f3;border-radius:14px;box-shadow:0 8px 22px rgba(31,45,61,.07);transition:transform .3s,box-shadow .3s;}
.xsd-tags2-item:hover {transform:translateY(-4px);box-shadow:0 12px 28px rgba(31,45,61,.11);}
.xsd-tags2-img {position:absolute;top:-27px;left:26px;margin:0;height:56px;filter:drop-shadow(0 6px 10px rgba(244,106,116,.28));}
.xsd-tags2-img img {max-height:56px;width:auto;height:auto;}
.xsd-tags2-item p {margin-top:0;font-size:14px;color:#666;line-height:1.95;}
.xsd-tags2-item p::before {content:"";display:block;width:34px;height:3px;border-radius:2px;margin-bottom:14px;background-image:linear-gradient(90deg,#f46a74,#f7a06b);}

/* 表单登记双列卡（宽图+副标题+说明框 | 手机截图，照源站版式） */
.xsd-form2 {display:grid;grid-template-columns:1.55fr 1fr;gap:44px;align-items:center;}
.xsd-form2-pic {margin:0;}
.xsd-form2-pic img {display:block;width:100%;height:auto;}
.xsd-form2-sub {margin-top:26px;font-size:18px;color:#2f7bf6;font-weight:600;text-align:center;letter-spacing:.5px;}
.xsd-form2-note {margin:14px auto 0;max-width:420px;padding:12px 20px;border:1px solid #e3e6eb;border-radius:4px;font-size:13px;color:#888;line-height:1.9;text-align:center;}
.xsd-form2-phone {margin:0;text-align:center;}
.xsd-form2-phone img {display:block;width:100%;max-width:300px;margin:0 auto;height:auto;}

/* --- AI营销页（aiyx- 系列，2026-10-14，蓝色科技系；shipin/GEO/总览共用） --- */
.xsd-hero-blue {background:linear-gradient(135deg,#0c1c38 0%,#12294f 55%,#0c1c38 100%);}
.xsd-hero-blue .xsd-orb1 {background:rgba(64,140,255,.16);}
.xsd-hero-blue .xsd-orb2 {background:rgba(64,140,255,.11);}
.xsd-hero-blue .xsd-orb3 {background:rgba(64,140,255,.08);}
.aiy-hero-flow {position:relative;width:82%;max-width:340px;aspect-ratio:1;margin:auto;border-radius:50%;background:rgba(255,255,255,.05);box-shadow:inset 0 0 60px rgba(64,140,255,.14);}
.xsd-sec-tit small {display:block;margin-top:8px;font-size:14px;color:#e62022;font-weight:500;letter-spacing:.5px;}
.xsd-sec-head-light {border-bottom-color:rgba(255,255,255,.16);}
.xsd-sec-head-light .xsd-sec-no {color:rgba(255,255,255,.35);}
.xsd-sec-head-light .xsd-sec-tit h2 {color:#fff;}
.xsd-sec-head-light .xsd-sec-tit small {color:#ffb26b;}

/* 六列图标卡（短视频营销服务 / AI营销总览能力一览） */
.xsd-ico6 {display:grid;grid-template-columns:repeat(6,1fr);gap:16px;}
.xsd-ico6-item {padding:26px 16px;background-color:#fff;border:1px solid #ececec;border-radius:14px;text-align:center;transition:transform .3s,box-shadow .3s;}
.xsd-ico6-item:hover {transform:translateY(-5px);box-shadow:0 14px 30px rgba(23,37,63,.09);}
.xsd-ico6-item i {display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin:0 auto 14px;border-radius:16px;background-color:#eef5fd;}
.xsd-ico6-item i img {max-width:40px;max-height:40px;width:auto;height:auto;}
.xsd-ico6-item h3 {font-size:15px;color:#222;font-weight:600;}
.xsd-ico6-item p {margin-top:10px;font-size:12.5px;color:#8a8a8a;line-height:1.8;}

/* 三列横排图标卡（多平台矩阵） */
.xsd-hz {display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.xsd-hz-item {display:flex;gap:14px;padding:24px 20px;background-color:#fff;border:1px solid #ececec;border-radius:14px;transition:transform .3s,box-shadow .3s;}
.xsd-hz-item:hover {transform:translateY(-4px);box-shadow:0 12px 28px rgba(23,37,63,.08);}
.xsd-hz-item i {flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background-color:#eef5fd;}
.xsd-hz-item i img {max-width:30px;max-height:30px;}
.xsd-hz-bd h3 {font-size:15px;color:#222;font-weight:600;}
.xsd-hz-bd p {margin-top:8px;font-size:13px;color:#8a8a8a;line-height:1.8;}

/* 深色行业应用区块（短视频获客系统） */
.xsd-dark6 {position:relative;overflow:hidden;padding:64px 0;background:linear-gradient(135deg,#10131c 0%,#1a2340 55%,#10131c 100%);}
.xsd-dark6-list {display:grid;grid-template-columns:repeat(6,1fr);gap:16px;}
.xsd-dark6-item {padding:30px 12px 24px;border-radius:12px;text-align:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);transition:background .3s,transform .3s;}
.xsd-dark6-item:hover {background:rgba(255,255,255,.11);transform:translateY(-4px);}
.xsd-dark6-item i {display:flex;align-items:center;justify-content:center;width:56px;height:56px;margin:0 auto 14px;}
.xsd-dark6-item i img {max-width:46px;max-height:46px;}
.xsd-dark6-item h3 {font-size:14px;color:#fff;font-weight:500;}

/* AI短视频页（aiyx-shipin）：对照 xd029.com/shipin 版式 2026-10-14 */
/* 居中大标题 + 橙色副标题 */
.xsd-sp-head {text-align:center;padding:6px 0 44px;}
.xsd-sp-head h2 {font-size:30px;color:#333;font-weight:700;line-height:1.25;}
.xsd-sp-head small {display:block;margin-top:12px;font-size:22px;color:#f8981c;font-weight:400;line-height:1.5;}
/* 01 服务六卡：浅色楼宇背景 + 白卡 */
.xsd-sp-sec1 {padding:64px 0 76px;background-color:#f5fafe;background-image:url(../images/aiyx/sec01_bg.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;}
.xsd-sp-sec1 .xsd-sp-head h2 {margin-top:12px;}
.xsd-sp-ico6 {display:grid;grid-template-columns:repeat(6,1fr);gap:20px;}
.xsd-sp-ico6-item {padding:32px 18px 28px;background-color:#fff;border-radius:10px;box-shadow:2px 2px 8px rgba(0,0,0,.05);text-align:center;transition:transform .3s,box-shadow .3s;}
.xsd-sp-ico6-item:hover {transform:translateY(-6px);box-shadow:0 16px 32px rgba(23,37,63,.12);}
.xsd-sp-ico6-item i {display:flex;align-items:center;justify-content:center;width:74px;height:74px;margin:0 auto 16px;}
.xsd-sp-ico6-item i img {max-width:100%;max-height:100%;width:auto;height:auto;}
.xsd-sp-ico6-item h3 {font-size:19px;color:#333;font-weight:700;}
.xsd-sp-ico6-item p {margin-top:12px;font-size:13px;color:#888;line-height:1.75;text-align:left;}
/* 02 六项能力：白底 + 灰卡 + 深蓝圆形图标 */
.xsd-sp-hz {display:grid;grid-template-columns:repeat(3,1fr);gap:25px;}
.xsd-sp-hz-item {display:flex;align-items:center;gap:20px;padding:28px 26px;background-color:#f6f6f6;border:1px solid rgba(217,214,214,.35);border-radius:10px;transition:transform .3s,box-shadow .3s;}
.xsd-sp-hz-item:hover {transform:translateY(-4px);box-shadow:3px 3px 12px rgba(0,0,0,.16);}
.xsd-sp-hz-item i {flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background-color:#383a65;transition:background-color .3s;}
.xsd-sp-hz-item i img {width:28px;height:28px;}
.xsd-sp-hz-item:hover i {background-color:#f8981c;}
.xsd-sp-hz-bd {min-width:0;}
.xsd-sp-hz-bd h3 {font-size:18px;color:#383a65;font-weight:700;line-height:1.5;transition:color .3s;}
.xsd-sp-hz-item:hover .xsd-sp-hz-bd h3 {color:#f8981c;}
.xsd-sp-hz-bd p {margin-top:8px;font-size:13px;color:rgba(56,71,94,.7);line-height:1.7;}
/* 03 行业应用：白底标题 + 全宽机械暗色横幅 */
.xsd-sp-dark {padding-top:64px;background-color:#fff;}
.xsd-sp-dark .xsd-sp-head {padding-bottom:0;}
.xsd-sp-dark-band {margin-top:0;padding:66px 0;background-color:#23262e;background-image:url(../images/aiyx/sec03_bg.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;}
.xsd-sp-dark-list {display:grid;grid-template-columns:repeat(6,1fr);gap:16px;}
.xsd-sp-dark-item {padding:42px 8px 30px;border-radius:20px;background-color:rgba(0,0,0,.2);text-align:center;transition:background-color .3s;}
.xsd-sp-dark-item:hover {background-color:rgba(38,61,143,.5);}
.xsd-sp-dark-item i {display:flex;align-items:center;justify-content:center;height:70px;margin:0 auto 34px;}
.xsd-sp-dark-item i img {max-height:70px;max-width:62px;width:auto;height:auto;}
.xsd-sp-dark-item h3 {font-size:16px;color:#fff;font-weight:500;letter-spacing:.5px;}
.xsd-sp-dark-item p {margin-top:14px;font-size:13px;color:rgba(255,255,255,.75);}

/* GEO：全宽大图 hero（标题文字做在背景图内，HTML 侧只放按钮与 sr 标题） */
.xsd-sr {position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.xsd-hero-fw {position:relative;overflow:hidden;display:flex;align-items:flex-end;min-height:600px;background-color:#0c1c38;background-size:cover;background-position:center;}
.xsd-hero-fw .container {position:relative;width:100%;}
.xsd-hero-fw .xsd-hero-btns {margin-top:340px;padding-bottom:56px;}
.xsd-hero-fw .xsd-hero-desc {color:rgba(255,255,255,.88);}

/* GEO：应运而生导语 + 蓝胶囊入口卡 */
.xsd-geo-lead {max-width:960px;margin:0 auto;font-size:14.5px;color:#555;line-height:2.1;text-indent:2em;}
.xsd-geocap {display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px;}
.xsd-geocap-item {position:relative;display:flex;align-items:center;justify-content:center;height:130px;border-radius:12px;overflow:hidden;
  background-color:#0f2547;background-image:linear-gradient(135deg,#14305e,#0c1c38);transition:transform .3s,box-shadow .3s;}
.xsd-geocap-item:before {content:'';position:absolute;inset:0;background:url(../images/aiyx/c0ed0c4a81417ab1897ab770a4409ec5.png) center/72% auto no-repeat;opacity:.95;}
.xsd-geocap-item span {position:relative;color:#fff;font-size:17px;font-weight:600;letter-spacing:1px;text-shadow:0 2px 10px rgba(9,40,80,.55);}
.xsd-geocap-item:hover {transform:translateY(-4px);box-shadow:0 14px 30px rgba(12,40,90,.25);}

/* 四列小图标卡（企业增长新引擎） */
.xsd-ico6-4 {grid-template-columns:repeat(4,1fr);}

/* GEO：应运而生大图背景卡 */
.xsd-geobg {position:relative;padding:74px 40px;border-radius:16px;overflow:hidden;background-color:#12224a;background-size:cover;background-position:center;}
.xsd-geobg-in {position:relative;max-width:900px;margin:0 auto;text-align:center;}
.xsd-geobg-in h3 {font-size:30px;color:#fff;font-weight:700;text-shadow:0 2px 12px rgba(0,0,0,.45);}
.xsd-geobg-in p {margin-top:22px;font-size:14.5px;color:rgba(255,255,255,.92);line-height:2.05;text-align:justify;text-indent:2em;text-shadow:0 1px 8px rgba(0,0,0,.5);}

/* GEO：我们的优势（左2卡 / 中图 / 右2卡） */
.xsd-adv {display:grid;grid-template-columns:1fr auto 1fr;gap:44px;align-items:center;}
.xsd-adv-col {display:grid;gap:32px;}
.xsd-adv-item {display:flex;gap:14px;}
.xsd-adv-item i {flex:0 0 auto;width:52px;height:52px;}
.xsd-adv-item i img {max-width:100%;max-height:100%;}
.xsd-adv-bd h3 {font-size:16px;color:#2f7bf6;font-weight:600;}
.xsd-adv-bd p {margin-top:8px;font-size:13px;color:#8a8a8a;line-height:1.85;}
.xsd-adv-mid {margin:0;width:280px;}
.xsd-adv-mid img {display:block;width:100%;height:auto;animation:fwBob 5.5s ease-in-out infinite;}

/* AI营销总览：两大服务入口卡（2 列） */
.xcs-cat-list-2 {grid-template-columns:repeat(2,1fr);}

/* 图文左右块 */
.xsd-media {display:flex;align-items:center;gap:44px;}
.xsd-media-pic {flex:0 0 46%;display:flex;align-items:center;justify-content:center;
  padding:22px;background-color:#f6f7f9;background-image:linear-gradient(160deg,#f8f9fb 0%,#eef1f5 100%);border-radius:16px;}
.xsd-sec-alt .xsd-media-pic {background-color:#fff;background-image:none;border:1px solid #ececec;}
.xsd-media-pic img {display:block;max-width:100%;max-height:470px;width:auto;height:auto;object-fit:contain;}
.xsd-media-txt {flex:1 1 auto;min-width:0;}
.xsd-media-txt h3 {font-size:22px;color:#222;font-weight:700;line-height:1.4;}
.xsd-media-txt p {margin-top:14px;font-size:14px;color:#7c7c7c;line-height:2;}

/* 正文 / 步骤 / 流程 */
.xsd-para {font-size:14px;color:#666;line-height:2;}
.xsd-steps {display:flex;flex-wrap:wrap;gap:14px;list-style:none;}
.xsd-steps li {display:flex;align-items:center;gap:12px;padding:12px 24px;background-color:#fff;
  border:1px solid #ececec;border-radius:999px;font-size:14px;color:#333;}
.xsd-steps em {font-style:normal;font-weight:700;color:#e62022;}
.xsd-flow {display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.xsd-flow-item {text-align:center;}
.xsd-flow-item figure {display:flex;align-items:center;justify-content:center;min-height:230px;padding:16px;
  background-color:#f6f7f9;background-image:linear-gradient(160deg,#f8f9fb 0%,#eef1f5 100%);border-radius:14px;overflow:hidden;}
.xsd-sec-alt .xsd-flow-item figure {background-color:#fff;background-image:none;border:1px solid #ececec;}
.xsd-flow-item img {display:block;max-width:100%;max-height:330px;width:auto;height:auto;object-fit:contain;
  transition:transform .4s;}
.xsd-flow-item:hover img {transform:translateY(-6px) scale(1.02);}
.xsd-flow-item > span {display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:9px 20px;
  background-color:#fff;border:1px solid #ececec;border-radius:999px;font-size:14px;color:#333;}
.xsd-flow-item em {font-style:normal;font-weight:700;color:#e62022;}
.xsd-flow-blank {width:120px;height:200px;}

/* --- 自适应 --- */
@media screen and (max-width:1100px) {
  .xsd-cards-4 {grid-template-columns:repeat(2,1fr);}
  .xsd-shots-4 {grid-template-columns:repeat(2,1fr);}
  .xsd-feats, .xsd-feats-2, .xsd-feats-3 {grid-template-columns:repeat(2,1fr);}
  .xsd-indus {grid-template-columns:repeat(4,1fr);}
  .xsd-duo {grid-template-columns:1fr;}
  .xsd-tags2 {grid-template-columns:1fr;gap:14px;}
  .xsd-form2 {grid-template-columns:1fr;gap:24px;}
  .xsd-form2-note {max-width:none;}
  .xsd-vote-flow {grid-template-columns:repeat(3,1fr);}
  .xsd-flow {grid-template-columns:repeat(2,1fr);}
  .xsd-hero-fw {min-height:520px;}
  .xsd-hero-fw .xsd-hero-btns {margin-top:280px;padding-bottom:44px;}
  .xsd-geocap {gap:14px;}
  .xsd-ico6-4 {grid-template-columns:repeat(2,1fr);}
  .xsd-hero-pic {flex:0 0 360px;}
  .xsd-ico6 {grid-template-columns:repeat(3,1fr);}
  .xsd-hz {grid-template-columns:repeat(2,1fr);}
  .xsd-dark6-list {grid-template-columns:repeat(3,1fr);}
  .xsd-sp-ico6 {grid-template-columns:repeat(3,1fr);}
  .xsd-sp-hz {grid-template-columns:repeat(2,1fr);}
  .xsd-sp-dark-list {grid-template-columns:repeat(3,1fr);}
  .xsd-sp-head h2 {font-size:26px;}
  .xsd-sp-head small {font-size:18px;}
  .xsd-adv {grid-template-columns:1fr 1fr;gap:26px;}
  .xsd-adv-mid {display:none;}
  .xsd-hero-fw {padding:96px 0 88px;}
  .xsd-geobg {padding:52px 30px;}
}
@media screen and (max-width:991px) {
  .xsd-hero {padding:64px 0 60px;}
  .xsd-hero-in {flex-direction:column;align-items:flex-start;gap:34px;}
  .xsd-hero-txt h1 {font-size:32px;}
  .xsd-hero-pic {flex:0 0 auto;min-height:0;width:100%;max-width:460px;padding-top:0;}
  .xsd-hero-img {max-height:360px;}
  .xsd-sec {padding:50px 0;}
  .xsd-sec-lead {padding:44px 0 2px;}
  .xsd-lead {font-size:24px;}
  .xsd-media {flex-direction:column;gap:26px;}
  .xsd-media-pic {flex:0 0 auto;width:100%;}
}
@media screen and (max-width:767px) {
  .xsd-hero {padding:48px 0 52px;}
  .xsd-eyebrow {font-size:11px;letter-spacing:3px;}
  .xsd-hero-txt h1 {font-size:25px;margin-top:14px;}
  .xsd-div {margin:16px 0;}
  .xsd-hero-desc {font-size:13px;line-height:1.95;}
  .xsd-hero-btns {gap:12px;margin-top:24px;}
  .xsd-btn {padding:11px 24px;font-size:14px;}
  .xsd-btn-ghost {padding:10px 20px;font-size:13px;}
  .xsd-hero-img {max-height:300px;}
  .xsd-sec {padding:38px 0;}
  .xsd-sec-lead {padding:32px 0 0;}
  .xsd-lead {font-size:20px;}
  .xsd-sec-head {gap:12px;padding-bottom:14px;margin-bottom:22px;}
  .xsd-sec-no {font-size:25px;}
  .xsd-sec-tit h2 {font-size:19px;}
  .xsd-cards, .xsd-cards-2, .xsd-cards-3, .xsd-cards-4,
  .xsd-shots, .xsd-shots-2, .xsd-shots-3, .xsd-shots-4,
  .xsd-feats, .xsd-feats-2, .xsd-feats-3 {grid-template-columns:1fr;gap:14px;}
  .xsd-targets {grid-template-columns:1fr;gap:12px;}
  .xsd-indus {grid-template-columns:repeat(2,1fr);gap:14px;}
  .xsd-indus-img {height:96px;}
  .xsd-indus-img img {max-width:84px;max-height:84px;}
  .xsd-vote-flow {grid-template-columns:1fr;gap:14px;}
  .xsd-vote-img {min-height:0;padding:12px;}
  .xsd-vote-img img {max-height:300px;}
  .xsd-vote-mid {padding:20px 0 4px;}
  .xsd-vote-mid em {font-size:34px;}
  .xsd-card {padding:18px;}
  .xsd-flow {grid-template-columns:1fr;gap:18px;}
  .xsd-flow-item figure {min-height:0;padding:12px;}
  .xsd-flow-item img {max-height:240px;}
  .xsd-steps li {padding:10px 18px;font-size:13px;}
  .xsd-ico6 {grid-template-columns:repeat(2,1fr);gap:12px;}
  .xsd-hz {grid-template-columns:1fr;}
  .xsd-dark6 {padding:44px 0;}
  .xsd-dark6-list {grid-template-columns:repeat(2,1fr);gap:12px;}
  .xsd-dark6-item {padding:22px 10px 18px;}
  .xsd-sp-head {padding:0 0 28px;}
  .xsd-sp-head h2 {font-size:21px;}
  .xsd-sp-head small {font-size:14px;margin-top:8px;}
  .xsd-sp-sec1 {padding:44px 0 52px;}
  .xsd-sp-ico6 {grid-template-columns:repeat(2,1fr);gap:12px;}
  .xsd-sp-ico6-item {padding:22px 14px 18px;}
  .xsd-sp-ico6-item i {width:58px;height:58px;}
  .xsd-sp-ico6-item h3 {font-size:16px;}
  .xsd-sp-hz {grid-template-columns:1fr;gap:14px;}
  .xsd-sp-hz-item {padding:20px 18px;}
  .xsd-sp-dark {padding-top:44px;}
  .xsd-sp-dark-band {padding:40px 0;}
  .xsd-sp-dark-list {grid-template-columns:repeat(2,1fr);gap:12px;}
  .xsd-sp-dark-item {padding:26px 8px 20px;}
  .xsd-sp-dark-item i {height:52px;margin-bottom:18px;}
  .xsd-sp-dark-item i img {max-height:52px;max-width:46px;}
  .xsd-sp-dark-item h3 {font-size:14px;}
  .xsd-hero-fw {min-height:0;background-image:none !important;}
  .xsd-hero-fw .xsd-hero-btns {margin-top:0;padding:60px 0 54px;}
  .xsd-geo-lead {font-size:13px;}
  .xsd-geocap {grid-template-columns:1fr;gap:12px;margin-top:20px;}
  .xsd-geocap-item {height:96px;}
  .xsd-geocap-item span {font-size:15px;}
  .xsd-ico6-4 {grid-template-columns:1fr;}
  .xsd-adv {grid-template-columns:1fr;gap:22px;}
  .xcs-cat-list-2 {grid-template-columns:1fr;}
  .xsd-chip {padding:8px 18px;font-size:13px;}
  .xsd-para {font-size:13px;}
  .xsd-media-txt h3 {font-size:19px;}
  .xsd-media-txt p {font-size:13px;}
}

/* --- 亮点菜单（社区团购「功能亮点」：左标题 / 右说明） --- */
.xsd-menu {background-color: #fff;border: 1px solid #ececec;border-radius: 14px;overflow: hidden;}
.xsd-menu-row {display: grid;grid-template-columns: 250px 1fr;}
.xsd-menu-row + .xsd-menu-row {border-top: 1px solid #ececec;}
.xsd-menu-tit {display: flex;align-items: center;gap: 12px;padding: 21px 26px;background-color: #f7f8fa;border-right: 1px solid #ececec;font-size: 16px;font-weight: 600;color: #222;transition: color .3s, background-color .3s;}
.xsd-menu-tit i {flex: 0 0 auto;position: relative;width: 17px;height: 17px;border-radius: 50%;border: 2px solid #c9c9c9;transition: border-color .3s;}
.xsd-menu-tit i:after {content: '';position: absolute;top: 3px;left: 3px;right: 3px;bottom: 3px;border-radius: 50%;background-color: #c9c9c9;transition: background-color .3s;}
.xsd-menu-txt {display: flex;align-items: center;padding: 18px 30px;font-size: 14px;color: #666;line-height: 1.9;}
.xsd-menu-row:hover .xsd-menu-tit {background-color: #fdf1f1;color: #e62022;}
.xsd-menu-row:hover .xsd-menu-tit i {border-color: #e62022;}
.xsd-menu-row:hover .xsd-menu-tit i:after {background-color: #e62022;}
@media screen and (max-width: 767px) {
  .xsd-menu-row {grid-template-columns: 1fr;}
  .xsd-menu-tit {padding: 14px 20px;border-right: 0;}
  .xsd-menu-txt {padding: 2px 20px 16px;font-size: 13px;}
  .xsd-menu-row + .xsd-menu-row {border-top: 1px solid #ececec;}
}

/* --- 方案快捷导航（总览页四大分类下方，15 个详情页直达） --- */
.xcs-nav {padding: 34px 0 30px;background-color: #fff;}
.xcs-nav .container {max-width: 1260px;}
.xcs-nav-list {display: grid;grid-template-columns: repeat(5, 1fr);gap: 14px;list-style: none;}
.xcs-nav-list li {display: flex;}
.xcs-nav-list a {display: flex;align-items: center;gap: 11px;flex: 1 1 auto;padding: 13px 16px;background-color: #fff;border: 1px solid #ececec;border-radius: 10px;font-size: 14px;color: #333;transition: border-color .3s, box-shadow .3s, transform .3s;}
.xcs-nav-list a:hover {border-color: #ffd5d6;transform: translateY(-4px);box-shadow: 0 12px 26px rgba(0,0,0,.08);color: #e62022;}
.xcs-nav-ico {flex: 0 0 auto;display: flex;align-items: center;justify-content: center;width: 38px;height: 38px;border-radius: 10px;}
.xcs-nav-ico svg {width: 21px;height: 21px;}
@media screen and (max-width: 1100px) {
  .xcs-nav-list {grid-template-columns: repeat(3, 1fr);}
}
@media screen and (max-width: 767px) {
  .xcs-nav {padding: 18px 0 6px;}
  .xcs-nav-list {grid-template-columns: repeat(2, 1fr);gap: 10px;}
  .xcs-nav-list a {padding: 11px 12px;font-size: 13px;gap: 9px;}
  .xcs-nav-ico {width: 32px;height: 32px;border-radius: 8px;}
  .xcs-nav-ico svg {width: 18px;height: 18px;}
}

/* --- 网站建设总览页（webhome.html）组件：wzs- 前缀 [2026-10-14] --- */
.xcs-cat-list-3 {grid-template-columns: repeat(3, 1fr);}
.wzs-sec {padding: 74px 0;background-color: #fff;}
.wzs-sec-gray {background-color: #f7f8fa;}
.wzs-head {max-width: 880px;margin: 0 auto;text-align: center;}
.wzs-head small {display: block;font-size: 13px;font-weight: 600;letter-spacing: 4px;color: #b3b3b3;}
.wzs-head h2 {margin-top: 12px;font-size: 30px;font-weight: 700;color: #222;letter-spacing: 1px;}
.wzs-head p {margin-top: 16px;font-size: 15px;color: #888;line-height: 1.9;}
.wzs-head-light small {color: rgba(255,255,255,.62);}
.wzs-head-light h2 {color: #fff;}
.wzs-head-light p {color: rgba(255,255,255,.78);}

/* 01 服务优势四卡 */
.wzs-adv {margin-top: 46px;padding: 0;list-style: none;display: grid;grid-template-columns: repeat(4, 1fr);gap: 22px;}
.wzs-adv li {padding: 34px 28px 30px;background-color: #fff;border: 1px solid #ececec;border-radius: 14px;text-align: center;transition: border-color .35s, box-shadow .35s, transform .35s;}
.wzs-adv li:hover {border-color: #ffd5d6;transform: translateY(-6px);box-shadow: 0 18px 40px rgba(0,0,0,.08);}
.wzs-adv li i {display: inline-flex;align-items: center;justify-content: center;width: 62px;height: 62px;border-radius: 16px;background-color: rgba(230,32,34,.08);color: #e62022;transition: background-color .35s, color .35s;}
.wzs-adv li i svg {width: 30px;height: 30px;}
.wzs-adv li:hover i {background-color: #e62022;color: #fff;}
.wzs-adv h3 {margin-top: 20px;font-size: 18px;font-weight: 600;color: #222;}
.wzs-adv p {margin-top: 12px;font-size: 13px;color: #8b8b8b;line-height: 1.9;text-align: left;}

/* 02 定制网站建设流程（红色渐变区块） */
.wzs-flow {padding: 74px 0;background-image: linear-gradient(125deg, #a51215 0%, #cf1c1f 55%, #e62022 100%);}
.wzs-flow-list {margin-top: 46px;padding: 0;list-style: none;display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px;}
.wzs-flow-list li {padding: 28px 24px 26px;background-color: rgba(255,255,255,.16);border: 1px solid rgba(255,255,255,.26);border-radius: 14px;transition: background-color .35s, transform .35s;}
.wzs-flow-list li:hover {background-color: rgba(255,255,255,.24);transform: translateY(-5px);}
.wzs-flow-list em {display: block;font-size: 30px;font-weight: 700;font-style: normal;color: rgba(255,255,255,.5);line-height: 1;}
.wzs-flow-list h3 {margin-top: 16px;font-size: 17px;font-weight: 600;color: #fff;}
.wzs-flow-list p {margin-top: 10px;font-size: 13px;color: rgba(255,255,255,.82);line-height: 1.85;}
.wzs-flow-btn {margin-top: 42px;text-align: center;}
.wzs-btn-light {display: inline-flex;align-items: center;gap: 10px;padding: 13px 38px;background-color: #fff;color: #e62022;font-size: 15px;font-weight: 600;border-radius: 999px;transition: transform .3s, box-shadow .3s;}
.wzs-btn-light:hover {transform: translateY(-2px);box-shadow: 0 12px 30px rgba(0,0,0,.22);color: #c41518;}
.wzs-btn-light.fw-btn-mob {display: none;}

/* 03 建站套餐一览（读取本地套餐数据，CSS 计数器自动编号） */
.wzs-pkg-group {margin-top: 46px;}
.wzs-pkg-group:first-of-type {margin-top: 0;}
.wzs-pkg-group + .wzs-pkg-group {margin-top: 34px;}
.wzs-pkg-group h3 {display: flex;align-items: center;gap: 10px;margin: 0 0 20px;font-size: 20px;font-weight: 700;color: #222;}
.wzs-pkg-group h3 i {flex: 0 0 auto;width: 5px;height: 20px;border-radius: 3px;background-color: #e62022;}
.wzs-pkg-list {counter-reset: wpk;padding: 0;list-style: none;display: grid;grid-template-columns: repeat(3, 1fr);gap: 18px;}
.wzs-pkg-list li {display: flex;counter-increment: wpk;}
.wzs-pkg-list li a {position: relative;display: flex;flex-direction: column;flex: 1 1 auto;padding: 24px 24px 20px;background-color: #fff;border: 1px solid #ececec;border-radius: 12px;transition: border-color .35s, box-shadow .35s, transform .35s;}
.wzs-pkg-list li a:hover {border-color: #ffd5d6;transform: translateY(-5px);box-shadow: 0 16px 36px rgba(0,0,0,.08);}
.wzs-pkg-no {display: inline-flex;align-items: center;justify-content: center;align-self: flex-start;min-width: 40px;height: 40px;padding: 0 10px;border: 1px solid #f0d3d4;border-radius: 10px;font-size: 14px;font-weight: 700;font-style: normal;color: #e62022;background-color: #fdf4f4;}
.wzs-pkg-no:before {content: counter(wpk, decimal-leading-zero);}
.wzs-pkg-list h4 {margin-top: 16px;font-size: 16px;font-weight: 600;color: #222;line-height: 1.5;}
.wzs-pkg-list p {margin-top: 9px;font-size: 13px;color: #8b8b8b;line-height: 1.8;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.wzs-pkg-cycle {display: inline-flex;align-items: center;gap: 6px;margin-top: 12px;font-size: 12px;color: #b0781a;}
.wzs-pkg-cycle svg {width: 13px;height: 13px;}
.wzs-pkg-more {display: inline-flex;align-items: center;gap: 6px;margin-top: 14px;padding-top: 12px;border-top: 1px solid #f2f2f2;font-size: 13px;color: #e62022;}
.wzs-pkg-more svg {width: 13px;height: 13px;transition: transform .35s;}
.wzs-pkg-list li a:hover .wzs-pkg-more svg {transform: translateX(4px);}

@media screen and (max-width: 1100px) {
  .xcs-cat-list-3 {grid-template-columns: repeat(2, 1fr);}
  .wzs-sec {padding: 54px 0;}
  .wzs-adv {grid-template-columns: repeat(2, 1fr);gap: 16px;}
  .wzs-flow {padding: 54px 0;}
  .wzs-flow-list {grid-template-columns: repeat(2, 1fr);gap: 14px;}
  .wzs-pkg-list {grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width: 767px) {
  .xcs-cat-list-3 {grid-template-columns: 1fr;}
  .wzs-sec {padding: 44px 0;}
  .wzs-head small {font-size: 11px;letter-spacing: 3px;}
  .wzs-head h2 {font-size: 22px;}
  .wzs-head p {font-size: 13px;}
  .wzs-adv {grid-template-columns: 1fr;gap: 14px;margin-top: 32px;}
  .wzs-adv li {padding: 26px 22px 24px;}
  .wzs-flow {padding: 44px 0;}
  .wzs-flow-list {grid-template-columns: 1fr;gap: 12px;margin-top: 32px;}
  .wzs-flow-list li {padding: 22px 18px 20px;}
  .wzs-flow-btn {margin-top: 30px;}
  .wzs-btn-light {padding: 12px 32px;font-size: 14px;}
  /* 手机端按钮改为点击拨号 */
  .wzs-flow .wzs-btn-light.fw-btn-pc {display: none;}
  .wzs-flow .wzs-btn-light.fw-btn-mob {display: inline-flex;}
  .wzs-pkg-group {margin-top: 32px;}
  .wzs-pkg-group h3 {font-size: 17px;}
  .wzs-pkg-list {grid-template-columns: 1fr;gap: 12px;}
  .wzs-pkg-list li a {padding: 20px 18px 16px;}
}





/* [2026-10-16 18:50] newslist 改造 v2：1:1 还原 xd029 左大日期列表 + k688 Rside 右栏
   - 页面宽度修复：newslist 段 .container 改 1200，section padding 改 30
   - 配色按 K654 红 #e62022 替代 xd029/k688 蓝
   - 来源：xd029.com/news (lanyun-section-o8vgo439 区块), yanshi.92wailian.com/k688 (Rside) */

/* === 1) 页面宽度修复（K654 原 .container 1600px 太宽，参考站约 1200）=== */
.newslist-sec { padding: 40px 0; }
.newslist-sec .container { max-width: 1600px; padding: 0 30px; }


.newslist-sec .v-main { float: none; width: 100%; }
/* === 2) 左主列表（1:1 还原 xd029） === */
.news-wrap { display: flex; gap: 30px; align-items: flex-start; }
.news-left { flex: 1 1 auto; min-width: 0; }
.news-right { flex: 0 0 340px; width: 340px; }

.news-item-list { list-style: none; padding: 0; margin: 0; }
.news-item-list .news-item {
  list-style: none; padding: 0; margin: 40px 0 0;
  border: 1px solid #efefef; border-radius: 15px;
  background: #fff;
  box-shadow: 2px 2px 8px 2px rgba(0,0,0,0.05);
  transition: box-shadow .25s ease;
}
.news-item-list .news-item:first-child { margin-top: 0; }
.news-item-list .news-item:hover { box-shadow: 5px 5px 12px 5px rgba(0,0,0,0.05); }
.news-item-list .news-item > a {
  display: flex; align-items: flex-start;
  padding: 55px 50px; color: inherit;
}
.news-item-list .news-date {
  flex: 0 0 auto;
  font-size: 22px; line-height: 1.5;
  margin: 5px 40px 0 0;
  padding: 0 40px 0 0;
  border-right: 1px solid #d7d5d5;
}
.news-item-list .news-date .d {
  display: block; font-size: 36px; font-weight: bold;
  color: #e62022; line-height: 1.1;
}
.news-item-list .news-date .ym {
  display: block; font-size: 16px; color: #666; margin-top: 4px;
}
.news-item-list .news-text { flex: 1 1 auto; min-width: 0; text-align: left; }
.news-item-list .news-title {
  font-weight: bold; font-size: 22px;
  margin: 0 0 12px; line-height: 1.4;
  color: #222;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color .25s;
}
.news-item-list .news-item:hover .news-title { color: #e62022; }
.news-item-list .news-desc {
  font-size: 16px; color: #666; line-height: 1.6;
  margin: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  max-height: 3.2em;
}

/* === 3) 右栏（1:1 还原 k688 Rside 340px） === */
.rside-block { margin-bottom: 24px; }
.rside-block:last-child { margin-bottom: 0; }
.rside-block h2 {
  position: relative;
  font-size: 14px; font-weight: 400; color: #333;
  line-height: 3rem; height: auto;
  background: #fff;
  padding: 0 1rem 0 2rem;
  margin: 0;
}
.rside-block h2::before {
  content: ""; position: absolute;
  top: 50%; left: 0; transform: translateY(-50%);
  width: 3px; height: 60%;
  background: #e62022;
}
.rside-block h2 + ul { background: #fff; padding: 0 1rem; margin: 0; }
.rside-list { list-style: none; }
.rside-list li { list-style: none; }
.rside-list li:first-child { border-top: 1px solid #ddd; }
.rside-list li { border-top: 1px dashed #dfdfdf; }

/* 3a) 热门推荐：简洁行式 + 右箭头（k688 .iauth） */
.rside-iauth li { padding: 10px 0; }
.rside-iauth li a {
  display: flex; align-items: flex-start; gap: 12px;
  color: #333; font-size: 14px;
  transition: color .25s;
}
.rside-iauth li a:hover { color: #e62022; }
.rside-iauth li a:hover h4 { color: #e62022; }
.rside-iauth li a:hover .imgcon img { transform: scale(1.06); }
.rside-iauth .imgcon {
  flex: 0 0 100px; width: 100px; height: 75px;
  overflow: hidden; background: #f5f5f5;
}
.rside-iauth .imgcon img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.rside-iauth .con { flex: 1 1 auto; min-width: 0; padding-top: 2px; }
.rside-iauth .con h4 {
  font-size: 14px; font-weight: 400; color: #333;
  line-height: 1.5em; height: 3em; margin: 0 0 .3em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color .25s;
}
.rside-iauth .con .date { font-size: 12px; color: #999; }

/* 3b) 最新文章：100x75 缩略图 + 标题 + 日期（k688 .news_pre） */
.rside-pre-list li { padding: 0 0 18px; }
.rside-pre-list li:last-child { padding-bottom: 0; }
.rside-pre-list li a {
  display: block; position: relative;
  overflow: hidden;
}
.rside-pre-list .imgcon {
  width: 100%; height: 0; padding-bottom: 65%;
  position: relative; overflow: hidden;
  background: #f5f5f5; border-radius: 4px;
  margin-bottom: 10px;
}
.rside-pre-list .imgcon img {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .35s ease;
}
.rside-pre-list li a:hover .imgcon img { transform: scale(1.06); }
.rside-pre-list .con { padding: 0 2px; }
.rside-pre-list h4 {
  font-size: 14px; color: #333; font-weight: 400;
  line-height: 1.5em; height: 3em;
  margin: 0 0 6px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color .25s;
}
.rside-pre-list li a:hover h4 { color: #e62022; }
.rside-pre-list .date { font-size: 12px; color: #999; }

/* === 4) 移动端（≤768px） === */
@media (max-width: 768px) {
  .newslist-sec { padding: 20px 0; }
  .news-wrap { flex-direction: column; gap: 20px; }
  .news-right { flex: 0 0 auto; width: 100%; }
  .news-item-list .news-item { margin-top: 20px; }
  .news-item-list .news-item > a { padding: 20px 15px; }
  .news-item-list .news-date {
    font-size: 16px; line-height: 1.3;
    margin: 0 12px 0 0; padding: 0 12px 0 0;
  }
  .news-item-list .news-date .d { font-size: 20px; padding-left: 0; }
  .news-item-list .news-date .ym { font-size: 13px; padding-left: 0; }
  .news-item-list .news-title { font-size: 14px; margin-bottom: 2px; }
  .news-item-list .news-desc { font-size: 14px; }
  .rside-block h2 { font-size: 13px; line-height: 2.6rem; }
  .rside-iauth .imgcon { flex: 0 0 80px; width: 80px; height: 60px; }
  .rside-iauth .con h4 { font-size: 13px; }
}
/* === 右下角悬浮客服条（kfView4，红主题） === */
/* [2026-10-18] 悬停展开效果按参考站 k756 重做：图标为 80×80 色块，hover 时向左横向拉开（80→280px）。
   [2026-10-18 三次调整] 对照参考站截图：悬停展开时整个条（含图标方块）背景全黑，移开后恢复红色；
   展开后内容左对齐、图标贴左；电话项只显示号码（不带"电话咨询"字样），号码加粗 19px。 */
/* [2026-10-18 五次调整] 红底与展开黑底改半透明（rgba），图标方块本身透明、颜色统一由 a 的背景决定，
   避免两层半透明叠加导致色块比周围更重。 */
/* [2026-10-18 六次调整] 条宽收窄 80→64，按钮高度 80→56（图标间间距随之变小），
   图标块宽度取满整条（100%）由 background-position 居中，保证图标水平居中。 */
.kfView4{position:fixed;width:64px;top:50%;right:10px;text-align:center;display:block;-webkit-box-shadow:6px 6px 12px rgba(0,0,0,0.1);box-shadow:6px 6px 12px rgba(0,0,0,0.1);border-radius:0 0 8px 8px;font-size:12px;z-index:999}
/* 红底只画顶部头像下方一截（此处没有 a 覆盖）；三个按钮的底色由各自 a 提供，避免半透明双重叠加 */
.kfView4:before{content:"";position:absolute;top:0;left:0;right:0;height:52px;background:rgba(230,32,34,0.9)}
.kfView4 ul{margin:0;padding:52px 0 0;list-style:none;color:#fff}
.kfView4 ul li{position:relative;width:64px;height:56px}
.kfView4 ul li a{position:absolute;top:0;right:0;display:flex;align-items:center;width:64px;height:56px;overflow:hidden;white-space:nowrap;text-align:left;color:#FFF;text-decoration:none;background-color:rgba(230,32,34,0.9);font-size:0;-webkit-transition:width .5s ease,background-color .5s ease;transition:width .5s ease,background-color .5s ease}
/* [2026-10-18 四次调整] 返回顶部只做悬停变色反馈，不再横向展开（参考站该按钮同样只变色）。 */
.kfView4 ul li.kf-item-tel:hover a{width:230px;background-color:rgba(0,0,0,0.85)}
.kfView4 ul li.kf-item-wx:hover a,
.kfView4 ul li.kf-item-top:hover a{background-color:rgba(192,26,28,0.9)}
.kfView4 ul li:last-child a{border-radius:0 0 8px 8px}
/* [2026-10-18 七次调整] 图标高保持用户设定的 50px，宽度取整条宽（64px）以实现水平居中；客服头像放大到 76×76 外挂居中。 */
/* 头像按原图尺寸 80×80 显示（不缩放），水平居中挂在 64px 条上方 */
.kfView4 a.kefu-lx{background-image:url(../images/kefu.png);background-size:80px 80px;background-repeat:no-repeat;background-position:center top;position:absolute;top:-40px;text-indent:-9999px;height:80px;width:80px;z-index:999999;left:-8px;border-width:0;overflow:hidden;-webkit-transition:none;transition:none}
.kfView4 a.kefu-lx:hover{background-color:transparent}
/* 图标：高度 50px、宽度等于条宽 64px，glyph 由 background-position 水平+垂直居中；底色由所在 a 决定（半透明只有一层） */
.kfView4 .kf-ico{display:inline-block;vertical-align:middle;flex:0 0 64px;width:64px;height:40px;background-color:transparent;background-repeat:no-repeat;background-position:center center;background-size:32px 32px}
.kfView4 .kf-ico-tel{background-image:url(../images/kf-tel.png)}
.kfView4 .kf-ico-wx{background-image:url(../images/kf-wx.png)}
.kfView4 .kf-ico-top{background-image:url(../images/kf-jt.png)}
/* 悬停滑出的文字（电话项只显示号码） */
.kfView4 .kf-txt{display:inline-block;vertical-align:middle;flex:0 0 auto;padding-left:6px;font-size:16px;line-height:1.3;text-align:left;color:#fff}
.kfView4 .kf-txt em{display:block;font-style:normal;font-weight:700;font-size:19px;letter-spacing:.5px}
/* 微信二维码卡片（hover 弹出，位于图标左侧） */
.kfView4 .kf-ewm{position:absolute;right:110%;top:50%;width:126px;padding:6px;background:#fff;border-radius:6px;opacity:0;visibility:hidden;-webkit-transform:translate(24px,-50%);transform:translate(24px,-50%);-webkit-transition:all .5s ease;transition:all .5s ease;box-shadow:0 6px 18px rgba(0,0,0,.18);z-index:2}
.kfView4 .kf-ewm img{display:block;width:100%;height:auto}
.kfView4 .kf-ewm:after{content:"";position:absolute;right:-6px;top:50%;margin-top:-6px;width:0;height:0;border:6px solid transparent;border-left-color:#fff;border-right:none}
.kfView4 ul li:hover .kf-ewm{opacity:1;visibility:visible;-webkit-transform:translate(0,-50%);transform:translate(0,-50%)}
@media(max-width:1079px){.kfView4{display:none!important}}