@charset "utf-8";
/* ==========================================================================
   精衡仪器官网 - 全站公共样式 common.css
   主题色：#1E6FFF（科技蓝）  深色：#0A1E44 / #081830  标题：#0B2550
   ========================================================================== */

/* reset start */
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box;}
body { font: 16px/1.5 '\5FAE\8F6F\96C5\9ED1', 'Microsoft Yahei', 'Arial', 'Helvetica', 'sans-serif'; color: #5C6B85; background: #fff;}
table, th, td, tr { border-collapse: collapse; border-spacing: 0; font-size: 16px;}
ol, ul { list-style: none;}
li { list-style-type: none;}
img { max-width: 100%; border: 0; display: block;}
.clear::after { content: ''; display: block; height: 0; overflow: hidden; clear: both;}
a { color: #3A4A66; text-decoration: none; transition: color .3s, background .3s, border-color .3s; -webkit-transition: color .3s, background .3s, border-color .3s; -moz-transition: color .3s, background .3s, border-color .3s;}
a:visited, a:hover, a:active { text-decoration: none;}
.fl { float: left;}
.fr { float: right;}
input, textarea, button { font-family: '\5FAE\8F6F\96C5\9ED1', 'Microsoft Yahei', Arial, sans-serif; outline: none;}
h1, h2, h3, h4, h5 { font-weight: 700; color: #0B2550; line-height: 1.4;}
/* reset end */

/* 滚动条 start */
::-webkit-scrollbar { width: 6px; height: 0;}
::-webkit-scrollbar-track { background: #fff;}
::-webkit-scrollbar-thumb { background: #b8c4d8;}
::-webkit-scrollbar-thumb:hover { background: #1E6FFF;}
/* 滚动条 end */

/* 容器宽度 start */
.container-width { width: 1600px; margin: 0 auto;}
@media (max-width:1680px) { .container-width { width: 1400px;}}
@media (max-width:1440px) { .container-width { width: 1280px;}}
@media (max-width:1366px) { .container-width { width: 1200px;}}
@media (max-width:1280px) { .container-width { width: 1080px;}}
@media (max-width:1080px) { .container-width { width: 94%;}}
/* 容器宽度 end */

/* 图片填充 start */
.cover, .cover1, .cover2 { display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0;}
.cover { width: 100%; height: 100%; object-fit: cover; -o-object-fit: cover;}
.cover1 { max-width: 100%; max-height: 100%; margin: auto;}
.cover2 { max-width: 90%; max-height: 90%; margin: auto;}
/* 图片填充 end */

/* SVG 图标 start */
.icon { display: block; width: 100%; height: 100%;}
/* SVG 图标 end */

/* mt-header start */
.mt-header { position: relative; z-index: 99; width: 100%; background: #fff; border-bottom: 1px solid #E4EAF3; transition: all .3s; -webkit-transition: all .3s;}
.mt-header.fxd { position: fixed; left: 0; top: 0; box-shadow: 0 2px 16px rgba(11,37,80,.10); -webkit-box-shadow: 0 2px 16px rgba(11,37,80,.10);}
.mt-header-container { display: flex; display: -webkit-flex; align-items: center; justify-content: space-between; height: 84px;}
.mt-header-logo { display: flex; display: -webkit-flex; align-items: center;}
.mt-header-logo i { display: block; width: 40px; height: 40px; flex-shrink: 0;}
.mt-header-logo .mt-logo-text { padding-left: 10px;}
.mt-header-logo .mt-logo-text b { display: block; font-size: 19px; font-weight: 700; color: #0B2550; line-height: 1.2;}
.mt-header-logo .mt-logo-text span { display: block; font-size: 8px; letter-spacing: 1px; color: #8B99B3; line-height: 1.6;}
/* mt-header end */

/* mt-nav start */
.mt-nav { display: flex; display: -webkit-flex; align-items: center; flex: 1; padding-left: 46px;}
.mt-nav_list > ul { display: flex; display: -webkit-flex; align-items: center; gap: 36px;}
.mt-nav_list > ul > li { position: relative;}
.mt-nav_list > ul > li > a { display: block; font-size: 16px; color: #3A4A66; padding: 30px 0; position: relative;}
.mt-nav_list > ul > li > a::after { content: ''; display: block; position: absolute; left: 50%; bottom: 24px; width: 0; height: 3px; background: #1E6FFF; border-radius: 2px; transform: translateX(-50%); -webkit-transform: translateX(-50%); transition: width .3s; -webkit-transition: width .3s;}
.mt-nav_list > ul > li:hover > a::after { width: 100%;}
.mt-nav_list > ul > li:hover > a { color: #1E6FFF;}
.mt-nav_list > ul > li.active > a { color: #1E6FFF; font-weight: 700;}
.mt-nav_list > ul > li.active > a::after { width: 100%;}
.mt-nav_btn { display: none; width: 30px; height: 24px; position: relative; cursor: pointer;}
.mt-nav_btn span { display: block; position: absolute; left: 0; width: 100%; height: 2px; background: #0B2550; transition: all .3s; -webkit-transition: all .3s;}
.mt-nav_btn span:nth-child(1) { top: 2px;}
.mt-nav_btn span:nth-child(2) { top: 11px;}
.mt-nav_btn span:nth-child(3) { top: 20px;}
.mt-nav_btn.open span:nth-child(1) { top: 11px; transform: rotate(45deg); -webkit-transform: rotate(45deg);}
.mt-nav_btn.open span:nth-child(2) { opacity: 0;}
.mt-nav_btn.open span:nth-child(3) { top: 11px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.mt-nav_mask { display: none;}
/* mt-nav end */

/* 头部右侧 start */
.mt-header-tools { display: flex; display: -webkit-flex; align-items: center; gap: 20px; flex-shrink: 0;}
.mt-header-tel { display: flex; display: -webkit-flex; align-items: center; gap: 8px;}
.mt-header-tel i { display: block; width: 18px; height: 18px; flex-shrink: 0;}
.mt-header-tel b { display: block; font-size: 15px; font-weight: 700; color: #0B2550; line-height: 1.3;}
.mt-header-tel span { display: block; font-size: 10px; color: #8B99B3;}
.mt-btn { display: inline-flex; display: -webkit-inline-flex; align-items: center; justify-content: center; padding: 12px 24px; border-radius: 8px; background: #1E6FFF; color: #fff; font-size: 14px; border: 1px solid #1E6FFF;}
.mt-btn:hover { background: #0d55d6; border-color: #0d55d6; color: #fff;}
.mt-btn-blue-line { background: transparent; color: #1E6FFF;}
.mt-btn-blue-line:hover { background: #1E6FFF; color: #fff;}
.mt-btn-white { background: #fff; color: #0B2550; border-color: #fff;}
.mt-btn-white:hover { background: #EAF2FF; color: #0B2550; border-color: #EAF2FF;}
.mt-btn-white-line { background: transparent; color: #fff; border-color: rgba(255,255,255,.6);}
.mt-btn-white-line:hover { background: rgba(255,255,255,.12); color: #fff;}
/* 头部右侧 end */

/* 版块标题 start */
.mt-title { text-align: center;}
.mt-title-tag { display: inline-block; padding: 6px 18px; border-radius: 100px; background: #EAF2FF; font-size: 12px; font-weight: 700; color: #1E6FFF; letter-spacing: 1px;}
.mt-title h2 { font-size: 34px; color: #0B2550; margin-top: 14px;}
.mt-title p { font-size: 15px; color: #5C6B85; margin-top: 12px;}
/* 版块标题 end */

/* mt-more 按钮 start */
.mt-more a { display: inline-flex; display: -webkit-inline-flex; align-items: center; gap: 8px; line-height: 40px; padding: 0 24px; font-size: 14px; color: #1E6FFF; border: 1px solid #1E6FFF; border-radius: 8px;}
.mt-more a:hover { color: #fff; background: #1E6FFF;}
.mt-more a i { display: block; width: 16px; height: 16px;}
.mt-more-line a:hover i path { stroke: #fff;}
/* mt-more 按钮 end */

/* mt-featured 左图右文 start */
.mt-featured { display: flex; display: -webkit-flex; align-items: center; gap: 48px; padding: 48px 0;}
.mt-featured .mt-featured-img { width: 600px; height: 360px; flex-shrink: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 16px 36px rgba(11,37,80,.20); -webkit-box-shadow: 0 16px 36px rgba(11,37,80,.20);}
.mt-featured .mt-featured-img img { width: 100%; height: 100%; object-fit: cover; -o-object-fit: cover; transition: transform .6s; -webkit-transition: transform .6s;}
.mt-featured:hover .mt-featured-img img { transform: scale(1.05); -webkit-transform: scale(1.05);}
.mt-featured .mt-featured-con { flex: 1;}
.mt-featured-tag { font-size: 13px; font-weight: 700; color: #1E6FFF;}
.mt-featured .mt-featured-con h2 { font-size: 24px; color: #0B2550; line-height: 36px; margin-top: 12px;}
.mt-featured .mt-featured-con > p { font-size: 14px; color: #5C6B85; line-height: 26px; margin-top: 14px;}
.mt-featured-meta { font-size: 13px; color: #8B99B3; margin-top: 14px;}
.mt-featured-reverse { flex-direction: row-reverse; -webkit-flex-direction: row-reverse;}
@media (max-width:1280px) {
  .mt-featured { gap: 32px;}
  .mt-featured .mt-featured-img { width: 460px; height: 300px;}
  .mt-featured .mt-featured-con h2 { font-size: 21px; line-height: 32px;}
}
@media (max-width:1080px) {
  .mt-featured, .mt-featured-reverse { flex-direction: column; -webkit-flex-direction: column; padding: 32px 0;}
  .mt-featured .mt-featured-img { width: 100%; height: 280px;}
}
/* mt-featured 左图右文 end */

/* mt-inner-banner start */
.mt-inner-banner { position: relative; height: 220px; display: flex; display: -webkit-flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; overflow: hidden; background: linear-gradient(90deg, #071B33 0%, #123060 100%); background: -webkit-linear-gradient(90deg, #071B33 0%, #123060 100%);}
.mt-inner-banner img.cover { opacity: .28;}
.mt-inner-banner::before { content: ''; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: linear-gradient(90deg, rgba(7,27,51,.92) 0%, rgba(18,48,96,.72) 100%); background: -webkit-linear-gradient(90deg, rgba(7,27,51,.92) 0%, rgba(18,48,96,.72) 100%); z-index: 1;}
.mt-inner-banner_text { position: relative; z-index: 2; padding: 0 20px;}
.mt-inner-banner_text .mt-crumb { font-size: 13px; color: #8FA6CC;}
.mt-inner-banner_text .mt-crumb a { color: #8FA6CC;}
.mt-inner-banner_text .mt-crumb a:hover { color: #fff;}
.mt-inner-banner_text h1 { font-size: 40px; color: #fff; margin-top: 12px;}
.mt-inner-banner_text p { font-size: 14px; color: #B9C9E6; margin-top: 10px;}
/* mt-inner-banner end */

/* mt-footer start */
.mt-footer { background: #081830; padding: 56px 0 24px;}
.mt-footer-top { display: flex; display: -webkit-flex; gap: 60px; justify-content: space-between;}
.mt-footer-brand { width: 360px; flex-shrink: 0;}
.mt-footer-brand .mt-foot-logo { display: flex; display: -webkit-flex; align-items: center; gap: 10px;}
.mt-footer-brand .mt-foot-logo i { display: block; width: 36px; height: 36px;}
.mt-footer-brand .mt-foot-logo b { font-size: 18px; color: #fff;}
.mt-footer-brand > p { font-size: 13px; color: #8FA3C4; line-height: 24px; margin-top: 14px;}
.mt-footer-brand > span { display: block; font-size: 13px; color: #8FA3C4; line-height: 26px;}
.mt-footer-col { width: 150px; flex-shrink: 0;}
.mt-footer-col b { display: block; font-size: 15px; font-weight: 700; color: #fff; margin-bottom: 14px;}
.mt-footer-col a { display: block; font-size: 13px; color: #8FA3C4; line-height: 32px;}
.mt-footer-col a:hover { color: #4DA3FF;}
.mt-footer-bottom { border-top: 1px solid #1B2E52; margin-top: 32px; padding-top: 20px; font-size: 12px; color: #5E7296;}
/* mt-footer end */

/* mt-view 悬浮工具 start */
.mt-view { position: fixed; right: 16px; bottom: 120px; z-index: 90;}
.mt-view a { display: block; width: 52px; height: 52px; margin-bottom: 10px; border-radius: 8px; background: #fff; box-shadow: 0 4px 16px rgba(11,37,80,.14); -webkit-box-shadow: 0 4px 16px rgba(11,37,80,.14); position: relative;}
.mt-view a i { display: block; width: 24px; height: 24px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}
.mt-view a.mt-view-top { background: #1E6FFF;}
.mt-view a:hover { background: #1E6FFF;}
.mt-view a:hover i path { fill: #fff;}
.mt-view a.mt-view-top:hover { background: #0d55d6;}
/* mt-view 悬浮工具 end */

/* mt-page 分页 start */
.mt-page { display: flex; display: -webkit-flex; align-items: center; justify-content: center; gap: 8px; padding: 40px 0 0;}
.mt-page a { display: block; min-width: 36px; height: 36px; line-height: 34px; text-align: center; border: 1px solid #E4EAF3; border-radius: 6px; font-size: 14px; color: #5C6B85; padding: 0 10px;}
.mt-page a:hover, .mt-page a.active { background: #1E6FFF; border-color: #1E6FFF; color: #fff;}
/* mt-page 分页 end */

/* 内页通用留白 start */
.mt-section { padding: 72px 0;}
.mt-section-gray { background: #F7FAFE;}
/* 内页通用留白 end */

/* 响应式 start */
@media (max-width:1440px) {
  .mt-nav { padding-left: 26px;}
  .mt-nav_list > ul { gap: 26px;}
}
@media (max-width:1280px) {
  .mt-header-tel span { display: none;}
  .mt-footer-brand { width: 300px;}
  .mt-footer-top { gap: 30px;}
}
@media (max-width:1080px) {
  .mt-header-container { height: 68px;}
  .mt-nav { flex: none; padding-left: 0; order: 3;}
  .mt-nav_btn { display: block;}
  .mt-nav_mask { display: block; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5); z-index: 98; opacity: 0; visibility: hidden; transition: all .4s; -webkit-transition: all .4s;}
  .mt-nav_mask.open { opacity: 1; visibility: visible;}
  .mt-nav_list { position: fixed; left: -100%; top: 0; width: 100%; height: 100%; z-index: 99; transition: left .4s; -webkit-transition: left .4s;}
  .mt-nav_list.open { left: 0;}
  .mt-nav_list > ul { display: block; width: 60%; height: 100%; background: #fff; overflow-y: auto; padding: 90px 24px 24px; gap: 0;}
  .mt-nav_list > ul > li > a { padding: 14px 0; font-size: 17px; color: #16233F; border-bottom: 1px solid #EEF2F8;}
  .mt-nav_list > ul > li > a::after { display: none;}
  .mt-nav_list > ul > li.active > a { color: #1E6FFF;}
  .mt-header-tools { margin-left: auto;}
  .mt-footer-top { flex-wrap: wrap; -webkit-flex-wrap: wrap;}
  .mt-footer-brand { width: 100%;}
  .mt-footer-col { width: 45%;}
  .mt-view { display: none;}
}
@media (max-width:767px) {
  .mt-header-tel { display: none;}
  .mt-inner-banner { height: 170px;}
  .mt-inner-banner_text h1 { font-size: 26px;}
  .mt-title h2 { font-size: 24px;}
  .mt-nav_list > ul { width: 78%;}
  .mt-footer-col { width: 100%;}
  .mt-footer { padding: 36px 0 20px;}
}
@media (max-width:390px) {
  .mt-inner-banner_text h1 { font-size: 22px;}
  .mt-title h2 { font-size: 21px;}
}
/* 响应式 end */
