body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { margin: 0; padding: 0 }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block }
audio, canvas, video { display: inline-block }
table { border-collapse: collapse; border-spacing: 0 }
th { text-align: inherit }
fieldset, img { border: 0 }
abbr, acronym { border: 0; font-variant: normal }
del { text-decoration: line-through }
ol, ul { list-style: none }
ins, a { text-decoration: none }
code, kbd, pre, samp { font-family: monospace,serif; font-size: 1em }
.layout:after, .clf:after { visibility: hidden; display: block; font-size: 0; content: "."; clear: both; height: 0 }
.layout, .clf { zoom: 1 }
.clear { font-size: 0; line-height: 0; height: 0; clear: both; visibility: hidden; overflow: hidden }
.fl { float: left }
.fr { float: right }
html { box-sizing: border-box; font-family: -apple-system,BlinkMacSystemFont,Roboto,Ubuntu,Helvetica Neue,Helvetica,Arial,PingFang SC,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Source Han Sans CN,sans-serif; font-size: 16px; line-height: 1.5; overflow-y: scroll; min-height: 100%; word-wrap: break-word; scroll-behavior: smooth }
body { color: #333 }
select, input, textarea { font-family: -apple-system,BlinkMacSystemFont,Roboto,Ubuntu,Helvetica Neue,Helvetica,Arial,PingFang SC,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Source Han Sans CN,sans-serif }
*, *:before, *:after { box-sizing: inherit }
:focus { outline: none }
.layout { width: 1180px; margin: 0 auto }
::-moz-selection { background: rgba(44,92,196,.6); color: #fff }
::selection { background: rgba(44,92,196,.6); color: #fff }
.pt-5 { padding-top: 5px }
.mt-5 { margin-top: 5px }
.pt-10 { padding-top: 10px }
.mt-10 { margin-top: 10px }
.pt-15 { padding-top: 15px }
.mt-15 { margin-top: 15px }
.pt-20 { padding-top: 20px }
.mt-20 { margin-top: 20px }
.pt-25 { padding-top: 25px }
.mt-25 { margin-top: 25px }
.pt-30 { padding-top: 30px }
.mt-30 { margin-top: 30px }
.pt-35 { padding-top: 35px }
.mt-35 { margin-top: 35px }
.pb-5 { padding-bottom: 5px }
.mb-5 { margin-bottom: 5px }
.pb-10 { padding-bottom: 10px }
.mb-10 { margin-bottom: 10px }
.pb-15 { padding-bottom: 15px }
.mb-15 { margin-bottom: 15px }
.pb-20 { padding-bottom: 20px }
.mb-20 { margin-bottom: 20px }
.pb-25 { padding-bottom: 25px }
.mb-25 { margin-bottom: 25px }
.pb-30 { padding-bottom: 30px }
.mb-30 { margin-bottom: 30px }
.pb-35 { padding-bottom: 35px }
.mb-35 { margin-bottom: 35px }
.pl-5 { padding-left: 5px }
.ml-5 { margin-left: 5px }
.pl-10 { padding-left: 10px }
.ml-10 { margin-left: 10px }
.pl-15 { padding-left: 15px }
.ml-15 { margin-left: 15px }
.pl-20 { padding-left: 20px }
.ml-20 { margin-left: 20px }
.pl-25 { padding-left: 25px }
.ml-25 { margin-left: 25px }
.pl-30 { padding-left: 30px }
.ml-30 { margin-left: 30px }
.pl-35 { padding-left: 35px }
.ml-35 { margin-left: 35px }
.pr-5 { padding-right: 5px }
.mr-5 { margin-right: 5px }
.pr-10 { padding-right: 10px }
.mr-10 { margin-right: 10px }
.pr-15 { padding-right: 15px }
.mr-15 { margin-right: 15px }
.pr-20 { padding-right: 20px }
.mr-20 { margin-right: 20px }
.pr-25 { padding-right: 25px }
.mr-25 { margin-right: 25px }
.pr-30 { padding-right: 30px }
.mr-30 { margin-right: 30px }
.pr-35 { padding-right: 35px }
.mr-35 { margin-right: 35px }
.mb-40 { margin-bottom: 40px }
.mt-40 { margin-top: 40px }
.button { display: inline-block; border-radius: 4px; font-size: 16px; text-align: center; overflow: hidden; cursor: pointer; height: 48px; width: 220px }
.button.w240 { width: 240px }
.button .iconfont { line-height: 1; vertical-align: middle; font-size: 20px }
.button.block { width: 100%; display: block }
.button.wide { width: auto; padding-left: 40px; padding-right: 40px }
.button.btn-red { line-height: 48px }
.button.btn-primary { line-height: 48px; border: 0 none }
.button.btn-normal { line-height: 46px }
.button.small { height: 40px; font-size: 14px }
.button.btn-primary.small, .button.btn-red.small { line-height: 40px }
.btn-normal { border: 1px solid #8aa4de; background: #e9eef9; color: #2c5cc4; transition: background .2s,color .2s }
.btn-normal:hover { border-color: #2c5cc4; background-color: #2c5cc4; color: #fff }
.btn-red { border: 0 none; background-color: #d8262b; color: #fff; background-image: linear-gradient(to right, #bf2226, #bf2226); background-size: 0 100%; transition: background .3s; background-repeat: no-repeat }
.btn-red:hover { background-size: 100% 100% }
.btn-primary { color: #fff; background-color: #2c5cc4; background-image: linear-gradient(to right, #2650ab, #2650ab); background-size: 0 100%; transition: background .3s; background-repeat: no-repeat }
.btn-primary:hover { background-size: 100% 100% }
.btn-red-line { border: 1px solid #d8262b; line-height: 38px; font-size: 14px; color: #d8262b; transition: color .2s,background .2s }
.btn-red-line:hover { color: #fff; background: #d8262b }
.btn-gray-line { border: 1px solid #dcdfe1; border-radius: 4px; text-align: center; font-size: 13px; color: #666 }
.btn-gray-line:hover { color: #fff; background: #2c5cc4; border-color: #2c5cc4 }
.btn-white { background: #fff; line-height: 48px; color: #2c5cc4 }
.btn-gray { line-height: 48px; color: #666; background: #f6f6f6; border: 0 none }
.link-img { overflow: hidden }
.link-img img { max-width: 100%; max-height: 100%; transition: transform .3s }
@supports((-o-object-fit: cover) or (object-fit: cover)) {
    .link-img img { -o-object-fit: cover; object-fit: cover; height: 100%; width: 100% }
}
.link-img .img { transition: transform .3s }
.link-img:hover .img, .link-img:hover img { transform: scale(1.1) }
.middle-img { text-align: center; font-size: 0 }
.middle-img:before { content: ""; width: 0; height: 100%; display: inline-block; vertical-align: middle }
.middle-img img { max-width: 100%; max-height: 100%; vertical-align: middle }
.link-arrow .iconfont { transition: transform .3s; transform: translate3d(0, 0, 0) }
.link-arrow:hover .iconfont { transform: translate3d(3px, 0, 0) }
.u-col-4 .col { float: left; width: 280px; margin-right: 20px }
.u-col-4 .col:last-child { margin-right: 0 }
.u-col-3 .col { float: left; width: 380px; margin-right: 20px }
.u-col-3 .col:last-child { margin-right: 0 }
.lay-main { width: 880px }
.lay-side { width: 280px; position: -webkit-sticky; position: sticky; top: 0 }
.u-icon { height: 72px; width: 72px; margin-left: auto; margin-right: auto; text-align: center; border: 2px solid rgba(44,92,196,.5); border-radius: 50%; background: rgba(44,92,196,.1); line-height: 68px; color: #2c5cc4 }
.u-icon .iconfont { font-size: 40px }
.u-icon.small { height: 46px; width: 46px; line-height: 46px; border-width: 1px }
.u-icon.small .iconfont { font-size: 24px }
.u-popup { padding: 36px 0; width: 160px; border-radius: 8px; text-align: center; background: #fff; position: fixed; left: 50%; top: 40%; margin-left: -78px; margin-top: -85px; box-shadow: 0 2px 4px 0 rgba(0,0,0,.1); z-index: 19999 }
.u-popup .icon { display: inline-block; height: 40px; width: 40px; margin-bottom: 6px }
.u-popup .i-success { background: url(//static.gcimg.net/i/201705/Mkd1UBK8Na.png) no-repeat center center }
.u-popup .i-failed { background: url(//static.gcimg.net/i/201705/cCp2w6gLNP.png) no-repeat center center }
.u-popup .tit { margin-bottom: 3px; font-size: 14px }
.u-popup .con { font-size: 12px; color: #999 }
@font-face { font-family: bananaslip; src: url(../file/bananaslip.otf) }
.ft-primary { color: #2c5cc4 }
.ft-gray { color: #666 }
.ft-red { color: #d8262b }
.ft-light { color: #999 }
.ft-white { color: #fff }
.ft-tit { margin-bottom: 20px; font-size: 26px; line-height: 32px; font-weight: 700; text-align: center }
.ft-tit.mb-40 { margin-bottom: 40px }
.ft-ellipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis }
.ft-con { font-size: 14px; line-height: 1.72 }
.ft-link { color: #333 }
.ft-link:hover { color: #2c5cc4 }
.ft-num { font-family: bananaslip }
.ft-26 { font-size: 26px; line-height: 32px }
.ft-18 { font-size: 18px; line-height: 24px }
.ft-center { text-align: center }
.ft-500 { font-weight: 500 }
.ft-600 { font-weight: 600 }
.ft-700 { font-weight: 700 }
.l-g { letter-spacing: -0.31em; display: flex; flex-flow: row wrap; align-content: flex-start }
.l-u { display: inline-block; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto }
.l-u-1-2 { width: 50% }
.l-u-1-3 { width: 33.3333333333% }
.l-u-2-3 { width: 66.6666666667% }
.l-u-1-4 { width: 25% }
.l-u-2-4 { width: 50% }
.l-u-3-4 { width: 75% }
.l-u-1-5 { width: 20% }
.l-u-2-5 { width: 40% }
.l-u-3-5 { width: 60% }
.l-u-4-5 { width: 80% }
.l-u-1-6 { width: 16.6666666667% }
.l-u-2-6 { width: 33.3333333333% }
.l-u-3-6 { width: 50% }
.l-u-4-6 { width: 66.6666666667% }
.l-u-5-6 { width: 83.3333333333% }
.m-header { position: absolute; z-index: 100; left: 0; width: 100%; color: #fff }
.m-header .top { padding-top: 16px; padding-bottom: 15px; height: 79px; border-bottom: 1px solid rgba(255,255,255,.2) }
.m-header .logo { float: left; margin-right: 20px }
.m-header .slogan { padding-left: 19px; height: 40px; margin-top: 4px; border-left: 1px solid rgba(255,255,255,.2); font-size: 22px; font-weight: 500; float: left; line-height: 40px }
.m-header .nav { float: right; padding-top: 12px }
.m-header .nav-item { float: left; padding-left: 24px; padding-right: 24px; font-size: 14px; line-height: 1.72; position: relative; color: #eaeaea }
.m-header .nav-item a { color: #eaeaea }
.m-header .nav-item a:hover { color: #fff }
.m-header .nav-item:after { content: ""; width: 1px; height: 14px; background-color: rgba(255,255,255,.2); position: absolute; right: 0; top: 5px }
.m-header .nav-wechat { position: relative; padding-right: 0 }
.m-header .nav-wechat .wechat-tit { cursor: default }
.m-header .nav-wechat .iconfont { font-size: 17px; vertical-align: middle; margin-right: 7px }
.m-header .nav-wechat:after { display: none }
.m-header .wechat-drop { position: absolute; padding: 20px 0 20px 20px; border-radius: 4px; background: #fff; width: 316px; right: 0; opacity: 0; visibility: hidden; transition: opacity .2s }
.m-header .wechat-drop .qrcode { height: 128px; width: 128px; padding: 3px; margin-bottom: 10px; border-radius: 4px; border: 1px solid #eaeaea }
.m-header .wechat-drop img { height: 120px; width: 120px }
.m-header .wechat-drop .code-name { text-align: center; font-size: 13px; color: #666 }
.m-header .nav-wechat:hover .wechat-drop { opacity: 1; visibility: visible }
.u-nav { position: relative; padding-top: 25px }
.u-nav .nav-wrap { float: left }
.u-nav .nav-li { float: left }
.u-nav .nav-a { color: #fff; padding-left: 41px; padding-right: 40px; display: block; line-height: 22px; position: relative }
.u-nav .nav-a:before { content: ""; height: 3px; background: #d8262b; opacity: 0; visibility: hidden; left: 40px; right: 40px; position: absolute; bottom: -9px; transform: translate3d(0, 3px, 0); transition: .2s; transform-origin: 0 bottom }
.u-nav .nav-li:hover .nav-a:before { opacity: 1; visibility: visible; transform: translate3d(0, 0, 0) }
.u-nav .nav-index .nav-a { padding-left: 0 }
.u-nav .nav-index .nav-a:before { left: 0 }
.u-nav .nav-index .nav-a:after { display: none }
.u-nav .nav-a:after { content: ""; position: absolute; left: 0; top: 4px; width: 1px; height: 14px; background: rgba(255,255,255,.2) }
.u-nav .nav-right { float: right }
.u-nav .search { padding-right: 30px; float: left }
.u-nav .language { float: right; position: relative; padding-left: 40px; cursor: default }
.u-nav .language:after { content: ""; width: 1px; height: 14px; position: absolute; left: 0; top: 7px; background: rgba(255,255,255,.2) }
.u-nav .language .icon-globle { font-size: 18px; vertical-align: middle }
.u-nav .language .icon-down1 { font-size: 12px }
.u-nav .lang-drop { position: absolute; padding-top: 10px; right: 0; opacity: 0; visibility: hidden; transition: opacity .2s }
.u-nav .lang-link { color: #eaeaea }
.u-nav .lang-link:hover { color: #fff }
.u-nav .lang-list { background: #fff; padding-top: 8px; padding-bottom: 8px; border-radius: 4px; width: 95px; text-align: center; font-size: 14px; line-height: 2; box-shadow: 0 4px 18px 0 rgba(0,0,0,.12) }
.u-nav .lang-li { height: 28px }
.u-nav .lang-a { color: #666; display: block }
.u-nav .lang-a:hover { background: #2c5cc4; color: #fff }
.u-nav .language:hover .lang-drop { visibility: visible; opacity: 1 }
.u-nav .search-trigger { height: 32px; width: 32px; line-height: 32px; text-align: center; margin-top: -4px; cursor: pointer }
.u-nav .search-drop { position: absolute; left: 0; right: 0; background: #fff; border-radius: 4px; height: 240px; top: 67px; opacity: 0; visibility: hidden; transform: translate3d(0, -20px, 0); transition: transform .2s,opacity .1s; box-shadow: 0 4px 18px 0 rgba(0,0,0,.12) }
.u-nav .search-drop.show { opacity: 1; visibility: visible; transform: translate3d(0, 0, 0) }
.u-nav .search-wrap { width: 640px; padding-top: 72px; margin: 0 auto }
.u-nav .search-form { height: 48px; margin-bottom: 20px }
.u-nav .search-input { width: 592px; height: 48px; padding: 10px 17px; border: 1px solid #eaeaea; background: #f6f6f6; border-radius: 4px 0 0 4px; font-size: 16px }
.u-nav .search-btn { width: 48px; border: 0 none; float: right; border-radius: 0 4px 4px 0; height: 48px; cursor: pointer }
.u-nav .search-close { position: absolute; height: 24px; width: 24px; right: 20px; top: 20px; color: #999; line-height: 1; cursor: pointer }
.u-nav .search-close:hover { color: #2c5cc4 }
.u-nav .search-close .iconfont { font-size: 24px }
.u-hot { color: #666; font-size: 14px }
.u-hot .hot-icon, .u-hot .hot-label, .u-hot .hot-a { float: left }
.hot-icon { margin-right: 6px; color: #d8262b }
.hot-a { margin-right: 10px; color: #666; text-decoration: underline }
.nav-dropdown { position: absolute; left: 0; right: 0; top: 47px; padding-top: 20px; opacity: 0; visibility: hidden; transition: opacity .5s; box-shadow: 0 4px 18px 0 rgba(0,0,0,.12) }
.nav-li:hover .nav-dropdown { visibility: visible; opacity: 1 }
.drop-pro { padding-left: 11px; padding-right: 19px; background: #fff; border-radius: 4px }
.drop-pro_item { padding: 29px 19px 20px; width: 20% }
.drop-pro_cate { margin-top: 21px; position: relative; overflow: hidden; color: #1d2226; font-size: 16px; font-weight: 600 }
.drop-pro_cate .icon-right { float: right; right: 0; position: absolute; font-weight: 400; color: #999 }
.drop-pro_img { display: block; margin-bottom: 16px; height: 64px; padding-top: 1px; border-radius: 2px }
.drop-pro_img img { float: left; margin-right: 7px; border-radius: 100%; overflow: hidden; width: 64px; height: 64px; }
.drop-pro_img:hover .drop-pro_name { color: #2c5cc4 }
.drop-pro_li { margin-bottom: 10px }
.drop-pro_link { padding-right: 26px; display: block; font-size: 14px; color: #333; position: relative; line-height: 24px; height: 24px }
.drop-pro_arrow { position: absolute; right: 0; top: 0; color: #999 }
.drop-pro_link:hover { text-decoration: underline }
.drop-nav { padding: 30px 0 30px 30px; background: #fff; border-radius: 4px }
.drop-nav_side { float: left; padding-right: 45px; min-height: 80px; width: 241px; border-right: 1px solid #dcdfe1 }
.drop-nav_tit { display: block; margin-bottom: 6px; position: relative; font-weight: 700; color: #333 }
.drop-nav_tit .iconfont { float: right; color: #999; font-size: 18px }
.drop-nav_des { margin-bottom: 20px; color: #666; font-size: 12px }
.drop-nav_img img { border-radius: 4px }
.drop-nav_list { padding-left: 45px; padding-top: 4px; overflow: hidden }
.drop-nav_li { float: left; padding-top: 16px; padding-bottom: 16px; width: 25%; font-size: 14px }
.drop-nav.terse .drop-nav_list { padding-top: 0; margin-bottom: -30px }
.drop-nav.terse .drop-nav_li { padding-top: 0; padding-bottom: 0; margin-bottom: 30px }
.drop-nav_a { color: #333; display: inline-flex; align-items: center }
.drop-nav_a span { font-weight: 700 }
.drop-nav_a .iconfont { margin-left: 10px; font-size: 16px; color: #999 }
.drop-nav_a:hover { color: #2c5cc4 }
.m-footer { padding-top: 60px; color: #fff; background: #262626 url(../images/footer-bg.jpg) no-repeat left bottom; background-attachment: fixed }
.m-footer .nav-pro { width: 124px }
.m-footer .nav-ser { width: 104px }
.m-footer .nav-news { width: 104px }
.m-footer .nav-about { width: 162px }
.m-footer .contact { width: 558px; float: left }
.m-footer .button { margin-right: 18px }
.m-footer .button .iconfont { margin-right: 10px; font-size: 20px; vertical-align: middle }
.m-footer .copyright { padding-top: 20px; padding-bottom: 47px; font-size: 12px; color: #999 }
.footer_nav-wrap { float: left; padding-bottom: 14px }
.footer_nav-col { float: left; width: 144px; padding-bottom: 20px }
.footer_nav-col .fn-li { margin-bottom: 24px; font-size: 14px; line-height: 1.72 }
.footer_nav-col .fn-a { color: #999 }
.footer_nav-col .fn-a:hover { color: #fff; text-decoration: underline }
.footer_nav-tit { margin-bottom: 24px; font-weight: 600; color: #fff }
.footer_tel-tit { margin-bottom: 10px; font-weight: 600 }
.footer_tel { margin-bottom: 22px; font-size: 32px; font-family: bananaslip,arial,sans-serif }
.footer_addr { padding-bottom: 22px; font-size: 14px; color: #999; line-height: 1.72 }
.footer_addr p { margin-bottom: 22px }
.footer_qrcode { float: left; color: #999; font-size: 13px }
.footer_qrcode .fq-img { height: 128px; width: 128px; padding: 4px; border-radius: 3px; background: #fff }
.footer_qrcode .fq-des { margin-top: 10px; margin-bottom: 22px; width: 128px; text-align: center }
.footer_bottom { border-top: 1px solid rgba(255,255,255,.2) }
.u-sidebar { position: fixed; right: 10px; bottom: 200px; z-index: 99 }
.u-sidebar .ur-item { width: 80px; height: 64px; position: relative; margin-bottom: 1px }
.u-sidebar .ur-box { padding-top: 10px; background: rgba(0,0,0,.45); border-radius: 4px; display: block; width: 100%; height: 100%; text-align: center; color: #fff }
.u-sidebar .ur-box .iconfont { font-size: 24px; line-height: 1 }
.u-sidebar .ur-name { font-size: 13px }
.u-sidebar .active { background: #d8262b }
.u-sidebar .back-top { cursor: pointer }
.u-sidebar .ur-qrcode-box { position: absolute; right: 80px; padding-right: 10px; top: 0 }
.u-sidebar .ur-qrcode { width: 148px; padding: 10px 10px 1px; text-align: center; background: #fff; box-shadow: 0 2px 4px 0 rgba(0,0,0,.1); border-radius: 4px }
.u-sidebar .img { height: 128px; width: 128px; padding: 3px; margin-bottom: 4px; border: 1px solid #eaeaea; border-radius: 4px }
.u-sidebar .img img { height: 120px; width: 120px }
.u-sidebar .text { margin-bottom: 10px; font-size: 13px; color: #666 }
.u-sidebar .ur-tel { position: absolute; top: 0; right: 0; height: 64px; padding-top: 18px; width: 292px; text-align: center; line-height: 1; border-radius: 4px; background: #d8262b; color: #fff; white-space: nowrap; font-size: 28px }
.u-sidebar .ur-tel .iconfont { font-size: 28px }
.u-sidebar .ur-tel, .u-sidebar .ur-qrcode-box { visibility: hidden; opacity: 0; transition: opacity .2s,visibility .2s }
.u-sidebar .ur-item:hover .ur-box { background: #d8262b; color: #fff }
.u-sidebar .ur-item:hover .ur-tel, .u-sidebar .ur-item:hover .ur-qrcode-box { visibility: visible; opacity: 1 }
.slick-slide img { max-width: 100%; max-height: 100% }
.col, .pro-hot_item, .pro-hot_primary, .ms-pro_item, .ms-album_item, .ms-trait_item { transition: all .36s ease }
.col:hover, .pro-hot_item:hover, .pro-hot_primary:hover, .ms-pro_item:hover, .ms-album_item:hover, .ms-trait_item:hover { transform: translate3d(0, -10px, 0); box-shadow: 0 6px 25px rgba(0,0,0,.08) }
.m-banner { position: relative }
.slider-list { height: 660px }
.slider-list .item { height: 660px }
.slider-list .image { height: 660px; background-color: #032cac; background-repeat: no-repeat; background-position: center center; background-size: cover }
.slider-list .slide-inner { position: relative }
.slider-list .slide-a { position: absolute; left: 63px; top: 450px; width: 165px; height: 40px }
.slick-dots { position: absolute; left: 0; width: 100%; bottom: 20px; text-align: center }
.slick-dots li { display: inline-block; margin: 0 5px }
.slick-dots button { font-size: 0; line-height: 0; display: block; width: 15px; height: 6px; background: rgba(255,255,255,.5); border: 0 none; transition: width .2s }
.slick-dots .slick-active button { background: #d8262b; width: 30px }
.u-i-hd { position: relative }
.u-i-hd .more { position: absolute; right: 0; top: 7px; bottom: 5px; color: #666 }
.u-i-hd .more:hover { color: #2c5cc4 }
.u-i-hd .hd-tip { font-size: 13px; color: #666; display: inline-block; vertical-align: super }
.u-i-tit { font-size: 32px; line-height: 48px; font-weight: 600; margin-bottom: 40px }
.m-index-tech { padding-top: 60px; padding-bottom: 80px; background: #fff }
.m-index-tech .tech-cell { float: left; position: relative; border-radius: 4px; overflow: hidden }
.m-index-tech .tech-cell:hover .tech-bg { transform: scale(1.1) }
.m-index-tech .tech-bg { position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-size: cover; transition: transform .3s }
.m-index-tech .cell1 { width: 380px; height: 595px; margin-right: 20px }
.m-index-tech .cell1 .tech-bg { background-image: url(../images/tech-1.jpg) }
.m-index-tech .cell2 { width: 780px; height: 290px; margin-bottom: 15px }
.m-index-tech .cell2 .tech-bg { background-image: url(../images/tech-2.jpg) }
.m-index-tech .cell3, .m-index-tech .cell4 { width: 380px; height: 290px }
.m-index-tech .cell3 { margin-right: 20px }
.m-index-tech .cell3 .tech-bg { background-image: url(../images/tech-3.jpg) }
.m-index-tech .cell4 .tech-bg { background-image: url(../images/tech-4.jpg) }
.m-index-tech .tc-info { padding-left: 32px; padding-bottom: 24px; position: absolute; bottom: 0; left: 0 }
.m-index-tech .tc-title { color: #f8f8f8; font-weight: 600; font-size: 21px; line-height: 32px; margin-bottom: 2px }
.m-index-tech .tc-intro { color: #fff; font-size: 13px }
.m-index-pro { padding-top: 60px; padding-bottom: 80px; background: #f3f6f8 }
.m-s-cate .cell1 { width: 380px; height: 529px; margin-right: 20px; background-image: url(../images/product-1.jpg) }
.m-s-cate .cell1 .ms-cate_hd { padding-left: 40px }
.m-s-cate .cell1 .ms-cate_more { right: 40px }
.m-s-cate .cell2 { margin-right: 20px; margin-bottom: 20px; background-image: url(../images/product-2.jpg) }
.m-s-cate .cell3 { margin-bottom: 20px; background-image: url(../images/product-3.jpg) }
.m-s-cate .cell4 { margin-right: 20px; background-image: url(../images/product-4.jpg) }
.m-s-cate .cell5 { background-image: url(../images/product-5.jpg) }
.m-s-cate .l1 { transition-delay: 0.03s }
.m-s-cate .l2 { transition-delay: 0.06s }
.m-s-cate .l3 { transition-delay: 0.09s }
.m-s-cate .l4 { transition-delay: 0.12s }
.m-s-cate .l5 { transition-delay: 0.15s }
.m-s-cate .l6 { transition-delay: 0.18s }
.m-s-cate .l7 { transition-delay: 0.21s }
.m-s-cate .l8 { transition-delay: 0.24s }
.m-s-cate .l9 { transition-delay: 0.27s }
.m-s-cate .l10 { transition-delay: 0.3s }
.ms-cate_grid { margin-bottom: 40px }
.ms-cate_cell { float: left; width: 380px; height: 256px; background-size: cover; position: relative }
.ms-cate_cell .logo-mark { position: absolute; left: 20px; top: 0 }
.ms-cate_hd { position: absolute; bottom: 0; padding: 0 30px 20px; width: 100% }
.ms-cate_cate { margin-bottom: 2px; font-size: 20px; line-height: 1.4; color: #333; font-weight: 500 }
.ms-cate_intro { color: #666; font-size: 16px }
.ms-cate_more { position: absolute; right: 30px; top: -3px; color: #666 }
.ms-cate_more .iconfont { font-size: 24px }
.ms-cate_layer { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px 30px 0; border-radius: 8px; background: rgba(16,67,179,.96); color: #fff; opacity: 0; visibility: hidden; transition: opacity .4s }
.ms-cate_cell:hover .ms-cate_layer { opacity: 1; visibility: visible }
.ms-cate_cell:hover .ms-cate_li { opacity: 1; transform: translate3d(0, 0, 0) }
.ms-cate .cate-name { font-size: 24px; line-height: 28px; font-weight: 600; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.2) }
.ms-cate_list { font-size: 18px; line-height: 24px }
.ms-cate_a { display: block; position: relative; color: #fff }
.ms-cate_a .ft-ellipsis { display: block; max-width: 80% }
.ms-cate_a:hover { text-decoration: underline }
.ms-cate_a:hover .ms-cate_a-icon { transform: translate3d(3px, 0, 0) }
.ms-cate_a-icon { position: absolute; right: 0; top: 0; transition: transform .2s }
.ms-cate_li { margin-top: 16px; transform: translate3d(0, -5px, 0); opacity: 0; transition: .2s }
.ms-filter_search { padding: 30px 0 30px 20px; border: 10px solid #e5e9ef; border-radius: 4px; background-color: #fff; font-size: 14px }
.ms-filter .search-wrap { width: 790px; padding-right: 24px; float: left; border-right: 1px solid #eaeaea }
.ms-filter .help { float: left; padding-top: 24px; padding-left: 9px }
.ms-filter .help .hp-item { padding-left: 20px }
.ms-filter .help .hp-tit { font-size: 16px; font-weight: 500 }
.ms-filter .btn-red-line { margin-top: 20px; width: 140px }
.ms-filter_form { padding-bottom: 10px }
.ms-filter_form .label, .ms-filter_form .unit, .ms-filter_form .input, .ms-filter_form .radio, .ms-filter_form .submit, .ms-filter_form .ask { float: left }
.ms-filter_form .kw-wrap { padding-top: 5px; width: 33.3%; float: left }
.ms-filter_form .radio-wrap { float: left; width: 33.3%; padding-top: 10px }
.ms-filter_form .label { width: 50px; line-height: 30px }
.ms-filter_form .controls { float: left; width: 690px; padding-top: 5px; line-height: 30px }
.ms-filter_form .unit { line-height: 30px }
.ms-filter_form .input { width: 96px; height: 30px; padding: 0 10px; border: 1px solid #e6e6e6; border-radius: 4px; margin-right: 10px }
.ms-filter_form .btn-wrap { overflow: hidden }
.ms-filter_form .submit { width: 120px; height: 40px; margin-right: 15px; border: 0 none; border-radius: 4px; font-weight: 500; font-size: 14px; cursor: pointer }
.ms-filter_form .ask { color: #d8262b; line-height: 40px }
.ms-filter .fi-label { height: 70px; margin-top: 10px; float: left; border: 1px solid #eaeaea; border-radius: 4px; width: 30px; padding: 13px 7px 0 }
.ms-filter .fi-item { width: 98px; height: 30px; line-height: 28px; border: 1px solid #eaeaea; text-align: center; border-radius: 4px; margin-left: 10px; margin-top: 10px; color: #666; transition: background .1s,color .3s; overflow: hidden }
.ms-filter .fi-item:hover { background-color: #d8262b; color: #fff; border-color: #d8262b }
.ui-radio { margin-right: 40px; cursor: pointer }
.ui-radio input { display: none }
.ui-radio i { display: inline-block; height: 16px; width: 16px; border: 1px solid #cccdcd; border-radius: 50%; position: relative; margin-right: 10px; vertical-align: middle }
.ui-radio i:after { content: ""; display: inline-block; height: 8px; width: 8px; border-radius: 50%; position: absolute; background-color: #d8262b; top: 3px; left: 3px; transform: scale(0); transition: transform .3s,opacity .3s; opacity: 0 }
.ui-radio span { vertical-align: middle; display: inline-block }
.ui-radio input:checked + i { border-color: #d8262b }
.ui-radio input:checked + i:after { transform: scale(1); opacity: 1 }
.m-index-solution { padding-top: 80px; padding-bottom: 80px; background: #244999 url(../images/solution-bg.jpg) no-repeat center center; background-attachment: fixed }
.m-index-solution .sol-hd { margin-bottom: 40px; position: relative; color: #fff }
.m-index-solution .title { font-size: 32px; font-weight: 600; margin-bottom: 20px }
.m-index-solution .sol-more { position: absolute; right: 0; bottom: 0; color: #fff }
.m-index-solution .sol-more:hover span { text-decoration: underline }
.m-index-solution .sol-main { background: #fff; border-radius: 0 8px 8px 0; overflow: hidden }
.m-index-solution .sol-tab { float: left }
.sol-tab-nav { width: 280px; height: 80px; position: relative; padding-left: 60px; line-height: 80px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 18px; color: #666; font-weight: 500; margin-bottom: 1px; background: #f6f6f6; transition: background .2s,color .2s }
.sol-tab-nav.current { color: #2c5cc4; background: #fff }
.sol-tab-nav.current .sol-icon { border-color: rgba(44,92,196,.5); background-color: rgba(44,92,196,.14) }
.sol-tab-nav.current:before { content: ""; width: 8px; background-color: #d8262b; position: absolute; left: 0; top: 0; height: 100% }
.sol-tab-nav .sol-icon, .sol-tab-nav .sol-cate { vertical-align: middle; display: inline-block }
.sol-tab-nav .sol-icon { height: 40px; width: 40px; margin-right: 10px; text-align: center; border: 1px solid transparent; line-height: 38px; border-radius: 50%; transition: background .2s,border .2s }
.sol-tab-nav .sol-icon .iconfont { font-size: 22px }
.sol-tab-con { padding: 60px 60px 0; overflow: hidden; display: none }
.sol-tab-con.show { display: block }
.sol-tab-con .sol-primary { height: 255px; margin-bottom: 33px }
.sol-tab-con .sol-image { width: 340px; height: 255px; margin-right: 40px; overflow: hidden; float: left; display: none }
.sol-tab-con .sol-image img { width: 340px; height: 255px; -o-object-fit: cover; object-fit: cover }
.sol-tab-con .sol-title { margin-bottom: 26px; font-size: 24px; font-weight: 500 }
.sol-tab-con .sol-intro { height: 126px; overflow: hidden; font-size: 14px; line-height: 1.72; color: #666 }
.sol-tab-con .button { float: left; margin-right: 20px }
.sol-tab-con .case { margin-bottom: 26px }
.sol-tab-con .case-tit { margin-bottom: 15px; font-weight: 600; background: url(../images/case-title.png) no-repeat 79px center }
.sol-tab-con .case-li { float: left; text-align: center }
.sol-tab-con .case-li + .case-li { margin-left: 20px }
.sol-tab-con .case-li:nth-child(4) { display: none }
.sol-tab-con .case-img { width: 240px; height: 128px; margin-bottom: 10px; border: 6px solid #f5f5f5; background: #f5f5f5; overflow: hidden }
.sol-tab-con .case-img img { max-width: 228px; max-height: 116px; height: 116px; width: 228px; -o-object-fit: cover; object-fit: cover; transition: transform .2s }
.sol-tab-con .case-name { height: 20px; overflow: hidden; line-height: 20px; font-size: 14px; color: #333 }
.sol-tab-con .case-name:hover { color: #2c5cc4 }
.sol-tab-con .relate { padding-top: 25px; font-size: 14px; border-top: 1px solid #eaeaea }
.sol-tab-con .rel-a { margin-left: 20px; color: #666 }
.sol-tab-con .rel-a:hover { color: #2c5cc4 }
.m-s-service { padding-top: 80px; padding-bottom: 80px; background: #f3f6f8 }
.ms-ser_item { padding-top: 50px; text-align: center; height: 414px; border: 1px solid #e1e8ed; background-color: #fff; border-radius: 8px }
.ms-ser_icon { margin: 0 auto 18px }
.ms-ser_name { margin-bottom: 30px; font-size: 24px; font-weight: 500 }
.ms-ser_intro { width: 287px; height: 112px; margin: 0 auto; font-size: 14px; line-height: 24px; color: #657787 }
.ms-ser_intro p { margin-bottom: 6px }
.m-s-vr { position: relative; overflow: hidden; background-color: #666 }
.m-s-vr .vr { position: absolute; left: 0; top: -100px; width: 100%; bottom: 0 }
.m-s-vr .layer { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../images/vr-layer.png) no-repeat center center }
.m-s-vr .vr-content { position: relative; padding-top: 80px; padding-bottom: 80px }
.m-s-vr .vr-hd { height: 376px; color: #fff; font-size: 14px }
.m-s-vr .vr-hd .iconfont { margin-right: 13px; font-size: 46px; float: left; line-height: 1; height: 48px; font-weight: 400 }
.m-s-vr .vr-des { line-height: 1.7 }
.m-s-vr .vr-title { margin-bottom: 20px; height: 48px; font-size: 32px; font-weight: 600 }
.m-s-vr .vr-button { display: block; width: 220px; height: 48px; border: 1px solid #fff; box-shadow: 0 1px 6px 0 rgba(43,49,63,.06); background: rgba(255,255,255,.85); border-radius: 4px; line-height: 44px; text-align: center; font-weight: 600; color: #2c5cc4; transition: .2s }
.m-s-vr .vr-button span { vertical-align: middle }
.m-s-vr .vr-button .iconfont { margin-left: 13px; font-size: 18px; vertical-align: middle }
.m-s-vr .vr-button:hover { background: #2c5cc4; border-color: #2c5cc4; color: #fff }
.m-index-visit { padding-top: 82px; padding-bottom: 60px; background: #f3f6f8 }
.ms-visit_hd { margin-bottom: 26px }
.ms-visit_title { margin-right: 20px; background: url(../images/appointment-icon.png) no-repeat 0 center; padding-left: 37px; background-size: 26px 26px; color: #353a3d; font-weight: 600; float: left; font-size: 24px; line-height: 1.33 }
.ms-visit_des { padding-top: 5px; float: left; font-size: 14px; color: #9aa5b0 }
.ms-visit_box { position: relative; padding: 40px 0 34px 320px; background: #f7fafc url(../images/appointment-bg.jpg) no-repeat right 0; border: 20px solid #fff }
.ms-visit .button { font-weight: 500; width: 180px }
.ms-visit_img { position: absolute; width: 240px; height: 252px; background-image: url(../images/appointment.png); left: 40px; bottom: 0 }
.ms-visit_form .input-item { float: left; width: 180px; height: 48px; margin-right: 20px; position: relative }
.ms-visit_form .input { width: 180px; height: 48px; padding-left: 83px; border: 1px solid #eaeaea; border-radius: 4px; transition: border .2s; font-size: 16px }
.ms-visit_form .input:focus { border-color: #2c5cc4 }
.ms-visit_form .error { color: #d8262b; font-size: 12px }
.ms-visit_label { position: absolute; top: 12px; left: 16px; color: #999 }
.m-s-news { padding-top: 60px }
.m-s-news .ms-news_intro { color: #999 }
.ms-news_list { padding: 10px; background: #f3f6f8; border-radius: 4px }
.ms-news_li { float: left; padding: 10px; width: 50% }
.ms-news_wrap { padding: 20px; background: #fff }
.ms-news_img { width: 200px; height: 150px; margin-right: 20px; float: left }
.ms-news_tit { padding-top: 10px; margin-bottom: 10px; font-size: 18px; font-weight: 500 }
.ms-news_a { color: #333; transition: color .2s }
.ms-news_a:hover { color: #2c5cc4 }
.ms-news_date { margin-bottom: 20px; line-height: 1.4; font-size: 14px; color: #999 }
.ms-news_intro { height: 52px; font-size: 14px; line-height: 1.72; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2 }
.m-s-qa, .m-s-wiki { padding-top: 60px; width: 570px; float: left }
.m-s-qa .u-i-tit, .m-s-wiki .u-i-tit { margin-bottom: 20px; font-size: 26px }
.u-info-list { border-radius: 4px; padding: 10px 30px; background: #f3f6f8 }
.u-info-list li { padding: 20px 0 20px 16px; position: relative; border-bottom: 1px solid #dcdfe1 }
.u-info-list li:last-child { border-bottom: 0 none }
.u-info-list li:before { content: ""; height: 6px; width: 6px; border-radius: 50%; position: absolute; left: 0; top: 28px; background: #657787 }
.u-info-list .tit { float: left; font-size: 18px; line-height: 24px; max-width: 378px }
.u-info-list .info-a { color: #333 }
.u-info-list .info-a:hover { color: #2c5cc4 }
.u-info-list .date { float: right; width: 116px; text-align: right; color: #666; font-size: 14px }
.m-s-wiki { margin-right: 40px }
.u-friend-link { padding-top: 30px; padding-bottom: 20px; font-size: 14px }
.u-friend-link .tit, .u-friend-link .link { float: left }
.u-friend-link .tit { margin-right: 20px; font-weight: 600 }
.u-friend-link .link { margin-right: 20px; margin-bottom: 10px }
.u-friend-link .link-a { color: #666; text-decoration: underline }
.u-friend-link .link-a:hover { color: #2c5cc4 }

@media screen and (min-width: 1600px) {
    .m-main.index .layout { width: 1420px }
    .m-main.index .slider-list { height: 880px }
    .m-main.index .slider-list .item, .m-main.index .slider-list .image { height: 880px }
    .m-main.index .slider-list .slide-a { position: absolute; left: 8px; top: 600px; width: 221px; height: 53px }
    .m-main.index .m-index-tech .cell1 { width: 460px; height: 720px }
    .m-main.index .m-index-tech .cell2 { width: 940px; height: 350px; margin-bottom: 20px }
    .m-main.index .m-index-tech .cell3, .m-main.index .m-index-tech .cell4 { width: 460px; height: 350px }
    .m-main.index .m-index-tech .tc-info { padding-left: 40px }
    .m-main.index .m-index-tech .tc-title { margin-bottom: 10px; font-size: 26px; line-height: 1.2 }
    .m-main.index .m-index-tech .tc-intro { font-size: 16px }
    .m-main.index .m-s-cate .cell1 { width: 460px; height: 640px }
    .m-main.index .ms-cate_cell { width: 460px; height: 310px }
    .m-main.index .ms-cate_cate { margin-bottom: 8px; font-size: 24px; line-height: 1.62 }
    .m-main.index .ms-cate_more { top: 3px }
    .m-main.index .ms-cate_layer { padding: 40px 40px 0 }
    .m-main.index .ms-cate_li { margin-top: 24px }
    .m-main.index .ms-filter_search { padding: 30px }
    .m-main.index .ms-filter .search-wrap { width: 970px; padding-right: 4px }
    .m-main.index .ms-filter .btn-red-line { width: 160px }
    .m-main.index .ms-filter .fi-label { width: 40px; padding: 13px 12px 0 }
    .m-main.index .ms-filter .fi-item { width: 120px }
    .m-main.index .ms-filter_form .input { width: 160px }
    .m-main.index .ms-filter_form .btn-wrap { padding-left: 50px }
    .m-main.index .sol-tab-con .sol-image { display: block }
    .m-main.index .sol-tab-con .case-li:nth-child(4) { display: block }
    .m-main.index .ms-ser_item { margin-right: 32px; width: 452px }
    .m-main.index .ms-ser_item:last-child { margin-right: 0 }
    .m-main.index .m-index-appointment .ms-visit_box { padding: 40px 0 34px 340px }
    .m-main.index .m-index-appointment .button { width: 220px }
    .m-main.index .ms-visit_form .input-item { width: 220px }
    .m-main.index .ms-visit_form .input { width: 220px }
    .m-main.index .m-s-qa, .m-main.index .m-s-wiki { width: 690px }
    .m-main.index .u-info-list .tit { min-width: 498px }
    .m-main.index .m-footer .nav-pro { width: 178px }
    .m-main.index .m-footer .nav-ser { width: 164px }
    .m-main.index .m-footer .nav-news { width: 144px }
    .m-main.index .m-footer .nav-about { width: 199px }
    .m-main.index .m-footer .contact { width: 597px }
}
