/* ============================================================
   威富通官网 · 老站视觉基调复刻
   迁移自 swiftpass2018 LESS，保留原类名与像素级布局。
   PC 端专用（min-width 1200 内容区）。
   ============================================================ */

:root {
  --sp-primary: #2148B1;      /* 主色 深蓝 */
  --sp-blue: #3E6DFF;         /* 强调蓝 / 导航底 */
  --sp-blue-hover: #3B6FF7;   /* 下拉 hover */
  --sp-link: #4A76FF;         /* 链接蓝 */
  --sp-grey-bg: #F8FAFC;      /* section 灰底 */
  --sp-white: #ffffff;
  --sp-ink: #333333;          /* 主标题 */
  --sp-ink-sub: #777777;      /* 副标题 */
  --sp-ink-desc: #999999;     /* 说明文字 */
  --sp-footer-bg: #081A43;    /* 页脚深蓝 */
  --sp-footer-link: #7D869B;  /* 页脚链接 */
  --sp-footer-copy: #525F7B;  /* 版权文字 */
  --sp-divider: #E4E8F3;      /* 分隔线/圆点 */
  --sp-card-border: #dddddd;  /* 卡片边框 */
}

/* ---------- reset ---------- */
* { margin: 0; padding: 0; box-sizing: border-box;
  font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif; }
html { scroll-behavior: smooth; }
body { color: var(--sp-ink); background: #fff; line-height: 1.6; -webkit-font-smoothing: antialiased; }
ul, ol { list-style: none; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; border: 0; }
.font_arial { font-family: Arial, sans-serif; }

/* ---------- 布局工具 ---------- */
.clear_fix::after, .clearfix::after { content: ""; display: block; clear: both; }
.fl { float: left; }
.fr { float: right; }
.hide, .none { display: none !important; }
.swift_hid { visibility: hidden; }
.table { display: table; width: 100%; }
.table_cell { display: table-cell; }
.v_center .table_cell { vertical-align: middle; }

/* ---------- 通用内容区块 .swift_blocker ---------- */
.swift_blocker { padding: 120px 0; text-align: center; overflow: hidden; }
.swift_blocker.theme_white { background: var(--sp-white); }
.swift_blocker.theme_grey { background: var(--sp-grey-bg); }
.swift_blocker > h1 { font-size: 30px; color: var(--sp-ink); line-height: 42px; font-weight: 500; }
.swift_blocker > h2 { font-size: 20px; color: var(--sp-ink-sub); line-height: 30px; font-weight: 400; margin-top: 6px; }
.swift_blocker .divider { margin: 20px auto; }
.swift_blocker .divider > span { display: block; width: 40px; height: 3px; background: var(--sp-divider); margin: 0 auto; }

/* ---------- 卡片阴影/悬浮 ---------- */
.swift_shadow { box-shadow: 0 0 10px rgba(0,0,0,0.1); }

/* ---------- 链接跳转箭头 ---------- */
.a_jumper { color: var(--sp-link); font-size: 16px; }
.a_jumper .iconfont { font-size: 14px; margin-left: 4px; }

/* ---------- 按钮 .swift_btn ---------- */
.swift_btn { display: inline-block; border-radius: 100px; text-align: center; cursor: pointer;
  box-shadow: 0 3px 5px 0 rgba(50,50,50,0.5); transition: all .3s; }
.swift_btn.theme_default { background: #fff; color: var(--sp-primary); }
.swift_btn.theme_green { background: var(--sp-blue); color: #fff; }
.swift_btn.theme_blue { background: var(--sp-primary); color: #fff; }
.swift_btn.size_small { height: 46px; line-height: 46px; font-size: 20px; padding: 0 37px; }
.swift_btn.size_medium { height: 56px; line-height: 56px; font-size: 24px; padding: 0 62px; }

/* ---------- 联系我们 CTA .contact_us ---------- */
.contact_us { height: 320px; text-align: center; overflow: hidden;
  background: url(../images/imgs/business_cooperation.jpg) no-repeat; background-size: cover; }
.contact_us .txt_zh { padding-top: 70px; font-size: 44px; color: #fff; line-height: 62px; }
.contact_us .txt_en { margin-top: 10px; font-size: 20px; color: #fff; line-height: 28px; }
.contact_us .txt_jianli { margin-top: 18px; font-size: 20px; color: #fff; line-height: 28px; }
.contact_us .txt_a { position: relative; display: block; font-size: 24px; color: var(--sp-primary);
  line-height: 56px; height: 56px; width: 220px; margin: 36px auto 0; border-radius: 60px;
  box-shadow: 0 3px 5px 0 rgba(32,85,138,0.5); background: #fff; cursor: pointer; }
.contact_us .txt_a:hover, .contact_us .txt_a:active { background: rgba(255,255,255,0.9); }

/* ---------- 右侧悬浮客服栏 .pop_indicator_wrap ---------- */
.pop_indicator_wrap { position: fixed; bottom: 20%; right: 100px; z-index: 40; }
.pop_indicator { border-radius: 100px; box-shadow: 0 1px 8px 0 rgba(0,0,0,0.07); background: #fff; }
.pop_indicator > li { display: flex; align-items: center; justify-content: center;
  height: 48px; width: 40px; border-bottom: 1px solid var(--sp-divider);
  position: relative; color: var(--sp-ink-desc); cursor: pointer; }
.pop_indicator > li:last-child { border-bottom: 0; }
.pop_indicator > li:hover { color: var(--sp-blue); }
.pop_indicator .indicator_icon { display: flex; align-items: center; justify-content: center;
  color: inherit; line-height: 1; }
.pop_indicator .indicator_icon .iconfont { font-size: 25px !important; line-height: 1; }
.pop_indicator .iconplus { width: 25px; height: 25px; fill: currentColor; }
.pop_qr { position: absolute; left: -175px; bottom: 30px; padding: 20px; text-align: center;
  background: #fff; border-radius: 6px; box-shadow: 0 1px 8px 0 rgba(0,0,0,0.07); }
.pop_qr img { width: 120px; }
.pop_qr p { margin-top: 8px; font-size: 13px; color: var(--sp-ink-sub); }

/* ---------- 彩色 SVG 图标 ---------- */
.iconplus { width: 1em; height: 1em; fill: currentColor; overflow: hidden; }

/* ---------- 进场动画(animate.css 精简) ---------- */
/* 动画元素默认隐藏，避免 JS 介入前先闪现原图再播动画（JS 禁用时由 <noscript> 兜底恢复可见）*/
/* 初始隐藏(等价老站 swift_hid: visibility:hidden)。动画类里的 visible 恢复可见 */
[data-animate], [secondery-animate] { visibility: hidden; }
.animated { animation-duration: 1s; animation-fill-mode: both; }
.animated.visible { visibility: visible; }
.animated.infinite { animation-iteration-count: infinite; }

/* --- fade 系列(animate.css v3.6.0 原版:位移为元素自身 100%) --- */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes fadeInDown { from { opacity: 0; transform: translate3d(0, -100%, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%, 0, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes fadeInRight { from { opacity: 0; transform: translate3d(100%, 0, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
.fadeIn { animation-name: fadeIn; }
.fadeInUp { animation-name: fadeInUp; }
.fadeInDown { animation-name: fadeInDown; }
.fadeInLeft { animation-name: fadeInLeft; }
.fadeInRight { animation-name: fadeInRight; }

/* --- contact_us 专用 Short 变体(_animation.less,生效值) --- */
@keyframes fadeInLeftShort { from { opacity: 0; transform: translate3d(-300px, 0, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes fadeInRightShort { 0% { opacity: 0; transform: translate3d(100px, 0, 0); } to { opacity: 1; transform: none; } }
.fadeInLeftShort { animation-name: fadeInLeftShort; }
.fadeInRightShort { animation-name: fadeInRightShort; }

/* --- bounce 系列(animate.css v3.6.0) --- */
.bounceIn { animation-duration: 0.75s; animation-name: bounceIn; }
@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0%   { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); }
  20%  { transform: scale3d(1.1, 1.1, 1.1); }
  40%  { transform: scale3d(0.9, 0.9, 0.9); }
  60%  { opacity: 1; transform: scale3d(1.03, 1.03, 1.03); }
  80%  { transform: scale3d(0.97, 0.97, 0.97); }
  to   { opacity: 1; transform: scale3d(1, 1, 1); }
}
.bounceOut { animation-duration: 0.75s; animation-name: bounceOut; }
@keyframes bounceOut {
  20%     { transform: scale3d(0.9, 0.9, 0.9); }
  50%, 55% { opacity: 1; transform: scale3d(1.1, 1.1, 1.1); }
  to      { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); }
}
.bounceInUp { animation-name: bounceInUp; }
@keyframes bounceInUp {
  from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from { opacity: 0; transform: translate3d(0, 3000px, 0); }
  60%  { opacity: 1; transform: translate3d(0, -20px, 0); }
  75%  { transform: translate3d(0, 10px, 0); }
  90%  { transform: translate3d(0, -5px, 0); }
  to   { transform: translate3d(0, 0, 0); }
}
/* 地图信标专用:webkit 0.4s / 标准 0.8s(照抄老站源码的不一致) */
.bounceInDownShort { animation-name: bounceInDownShort; -webkit-animation-duration: 0.4s; animation-duration: 0.8s; }
@keyframes bounceInDownShort {
  from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0%   { opacity: 0; transform: translate3d(0, -200px, 0); }
  60%  { opacity: 1; transform: translate3d(0, 25px, 0); }
  75%  { transform: translate3d(0, -10px, 0); }
  90%  { transform: translate3d(0, 5px, 0); }
  to   { transform: translate3d(0, 0, 0); }
}

/* ============================================================
   顶部导航 #topNav
   ============================================================ */
#topNav { position: fixed; left: 0; right: 0; top: 0; z-index: 100; height: 70px; text-align: center;
  background: transparent; transition: all 1s ease; box-shadow: 0 0 10px rgba(0,0,0,0); }
#topNav:hover { background: rgba(62,109,255,0.9); }
#topNav.active { background: rgba(62,109,255,0.9); box-shadow: 0 0 10px rgba(0,0,0,0.6); }
#topNav .top_wrap { width: 1200px; height: 100%; margin: 0 auto; }
#topNav .top_logo { float: left; line-height: 70px; }
#topNav .top_logo img { vertical-align: middle; }
/* PC 端只显示 PC 专用白色 logo；移动端两张 logo 隐藏 */
#topNav .top_logo_pc { display: inline-block; }
#topNav .top_logo_dark,
#topNav .top_logo_light { display: none; }
#topNav .top_menu { float: right; }

.swift_nav { font-size: 16px; }
.swift_nav .menu { float: left; height: 70px; line-height: 70px; position: relative; }
.swift_nav .menu > a { padding: 0 30px; color: rgba(255,255,255,0.8); cursor: pointer; }
.swift_nav .menu a { color: rgba(255,255,255,0.8); }
.swift_nav .menu:before { content: ""; position: absolute; left: 0; top: 0; width: 0; height: 4px;
  background: #fff; opacity: 0; transition: all .5s ease; }
.swift_nav .menu.on:before, .swift_nav .menu:hover:before { opacity: 1; width: 100%; }
.swift_nav .menu.on > a, .swift_nav .menu:hover > a { color: #fff; }
.swift_nav .menu:hover .sub_menu { opacity: 1; visibility: visible; transform: translateY(0);
  transition: all .3s cubic-bezier(.645,.045,.355,1); }
.swift_nav .sub_menu { opacity: 0; visibility: hidden; transform: translateY(10px);
  position: absolute; left: 0; z-index: 99; text-align: left; background: #fff;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3); padding: 18px 70px 18px 30px; }
.swift_nav .sub_menu > li { line-height: normal; white-space: nowrap; }
.swift_nav .sub_menu > li > a { display: block; color: #333; padding: 10px 0; }
.swift_nav .sub_menu > li.on > a, .swift_nav .sub_menu > li:hover > a { color: var(--sp-blue-hover); font-weight: bold; }

/* ============================================================
   页脚 #bottomNav
   ============================================================ */
#bottomNav { background: var(--sp-footer-bg); position: relative; z-index: 1; }
.bottomnav_wraper { width: 1180px; margin: 0 auto; padding: 60px 10px; text-align: center; background: #081A43; }
.bottomnav_wraper .table { display: table; width: 100%; table-layout: fixed; }
.bottomnav_list { display: table-cell; vertical-align: top; text-align: left; }
.bottomnav_list h2 { color: #fff; font-size: 20px; font-weight: 400; margin-bottom: 40px; }
.bottomnav_list ul li a { color: var(--sp-footer-link); font-size: 16px; line-height: 32px; transition: color .2s; }
.bottomnav_list ul li a:hover { color: #fff; }
.bottomnav_list .bottomnav_logo { width: 110px; height: 110px; position: relative; top: 7px; }
.bottomNav_btm { margin-top: 70px; }
.bottomNav_btm .table_cell { vertical-align: middle; }
.bottomNav_btm .hotline { display: table-cell; vertical-align: middle; width: 300px; height: 52px; line-height: 52px;
  color: #fff; font-size: 24px; background: #3979FF; background: linear-gradient(to right, #3979FF, #2B9EFF); }
.bottomNav_btm .copyright { display: table-cell; vertical-align: middle; text-align: left; padding-left: 40px; color: var(--sp-footer-copy); font-size: 14px; }
.bottomNav_btm .copyright > p { line-height: 26px; }
.bottomNav_btm .copyright a.beian { color: var(--sp-footer-copy); margin-left: 12px; }
.bottomNav_btm .copyright a.beian:hover { color: #fff; }
.bottomNav_btm .copyright .ico_beian { display: inline-block; width: 20px; height: 20px; vertical-align: middle;
  margin-right: 5px; background: url("../images/imgs/ico_beian.png") no-repeat center / 20px 20px; }
