@charset "utf-8"; /* ==================== 重置默认样式 start ==================== */ * { padding: 0; margin: 0; box-sizing: border-box; font-family: "Microsoft YaHei", "微软雅黑", "Microsoft JhengHei", "华文细黑", "STHeiti", "MingLiu"; } *:before, *:after { vertical-align: middle; box-sizing: border-box; } html { margin: 0 auto; } ul, li, ol { list-style: none; } em { font-style: normal; } img { vertical-align: middle; max-width: 100%; } a { color: inherit; text-decoration: none; outline: none; -webkit-backface-visibility: hidden; } a:hover { text-decoration: none; } a:focus { outline: none; } input:focus, select:focus, textarea:focus { outline: -webkit-focus-ring-color auto 0; } button, input { border: 0; outline: none; background: none; } table { border-collapse: collapse; border-spacing: 0; } th, td { vertical-align: middle; } i { font-style: inherit; } #map label { max-width: initial; } #map img { max-width: initial; } /* ==================== 重置默认样式 end ==================== */ /* ==================== 常用样式 start ==================== */ /* 清除浮动 */ .clearfix { display: block; zoom: 1; } .clearfix:after { content: " "; display: block; font-size: 0; height: 0; clear: both; visibility: hidden; } /* bootstart ul */ ul, h1, h2, h3, h4, li, p { padding: 0; margin: 0; } /* 外层容器样式 */ section { overflow: hidden; } /* 通用正文样式 */ article { font-size: 18px; line-height: 1.8; text-align: justify; color: #333; } /* 图片统一动画 */ .mxw-image { overflow: hidden; } .mxw-image:hover img { transform: scale(1.1); } .mxw-image img { transition: all 0.4s; width: 100%; } /* ==================== 常用样式 end ==================== */ /* ==================== 置顶按钮 start ==================== */ #goto-top { position: fixed; z-index: 10; right: 0.3333rem; bottom: 10%; width: 0.6667rem; height: 0.6667rem; cursor: pointer; background: #014099; display: flex; align-items: center; justify-content: center; border-radius: 2px; transition: all 0.4s; visibility: hidden; opacity: 0; border: 1px solid #fff; } #goto-top.active { visibility: visible; opacity: 1; } #goto-top:after { content: ""; display: block; width: 0.2333rem; height: 0.2333rem; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(-45deg); margin-top: 6px; } @media screen and (max-width: 751px) { #goto-top { width: 30px; height: 30px; right: 10px; } } /* ==================== 置顶按钮 end ==================== */ /* ==================== 文本行数限制 start ==================== */ .u-line-1 { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .u-line-2 { -webkit-line-clamp: 2; } .u-line-3 { -webkit-line-clamp: 3; } .u-line-4 { -webkit-line-clamp: 4; } .u-line-5 { -webkit-line-clamp: 5; } .u-line-6 { -webkit-line-clamp: 6; } .u-line-2, .u-line-3, .u-line-4, .u-line-5, .u-line-6 { overflow: hidden; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; } /* ==================== 文本行数限制 end ==================== */ /* ==================== flex通用布局 start ==================== */ .u-flex { display: flex; flex-direction: row; align-items: center; } .u-flex-wrap { flex-wrap: wrap; } .u-flex-nowrap { flex-wrap: nowrap; } .u-flex-col { flex-direction: column; } .u-grow-1 { flex-grow: 1; } .u-col-center { align-items: center; } .u-col-top { align-items: flex-start; } .u-col-bottom { align-items: flex-end; } .u-row-center { justify-content: center; } .u-row-left { justify-content: flex-start; } .u-row-right { justify-content: flex-end; } .u-row-between { justify-content: space-between; } .u-row-around { justify-content: space-around; } /* ==================== flex通用布局 end ==================== */ /* ==================== 通用布局 start ==================== */ @media screen and (min-width: 751px) { .u-row-2, .u-row-3, .u-row-4, .u-row-5, .u-row-6 { display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; } .u-row-2 > .u-col { width: 48%; } .u-row-2 > .u-col:nth-child(2n) { margin-left: 4%; } .u-row-2 > .u-col:nth-child(2) ~ .u-col { margin-top: 4%; } .u-row-3 > .u-col { width: 32%; } .u-row-3 > .u-col:nth-child(3n-1) { margin-left: 2%; margin-right: 2%; } .u-row-3 > .u-col:nth-child(3) ~ .u-col { margin-top: 2%; } .u-row-4 > .u-col { width: 23.5%; margin-right: 2%; } .u-row-4 > .u-col:nth-child(4n) { margin-right: 0%; } .u-row-4 > .u-col:nth-child(4) ~ .u-col { margin-top: 2%; } .u-row-5 > .u-col { width: 18.4%; margin-right: 2%; } .u-row-5 > .u-col:nth-child(5n) { margin-right: 0%; } .u-row-5 > .u-col:nth-child(5) ~ .u-col { margin-top: 2%; } .u-row-6 > .u-col { width: 15%; margin-right: 2%; } .u-row-6 > .u-col:nth-child(6n) { margin-right: 0%; } .u-row-6 > .u-col:nth-child(6) ~ .u-col { margin-top: 2%; } } @media screen and (max-width: 751px) { .u-row-2, .u-row-3, .u-row-4, .u-row-5, .u-row-6 { display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; } .u-row-2 .u-col { width: 100%; } .u-row-2 .u-col:nth-child(1) ~ .u-col { margin-top: 2%; } .u-row-3 > .u-col, .u-row-4 > .u-col, .u-row-5 > .u-col, .u-row-6 > .u-col { width: 48%; } .u-row-3 > .u-col:nth-child(2n), .u-row-4 > .u-col:nth-child(2n), .u-row-5 > .u-col:nth-child(2n), .u-row-6 > .u-col:nth-child(2n) { margin-left: 4%; } .u-row-3 > .u-col:nth-child(2) ~ .u-col, .u-row-4 > .u-col:nth-child(2) ~ .u-col, .u-row-5 > .u-col:nth-child(2) ~ .u-col, .u-row-6 > .u-col:nth-child(2) ~ .u-col { margin-top: 4%; } } /* ==================== 通用布局 end ==================== */ /* ==================== 侧边栏样式 start ==================== */ aside { font-size: 0; display: flex; align-items: flex-start; position: relative; width: 4.6667rem; margin-right: 1rem; flex-shrink: 0; } aside .aside-btn-group .aside-btn { width: 0.6667rem; height: 0.6667rem; position: fixed; right: 0.1667rem; bottom: 20%; background: rgba(0, 0, 0, 0.5); z-index: 99; display: flex; align-items: center; justify-content: center; } aside .aside-btn-group .aside-btn-menu i { width: 0.1rem; height: 0.1rem; background: #fff; display: block; border-radius: 100%; margin: 0 0.0333rem; } aside .aside-btn-group .aside-btn-top { transform: translateY(0.7rem); } aside .aside-btn-group .aside-btn-top:after { content: ""; display: block; width: 0.3333rem; height: 0.3333rem; border-top: 0.0333rem solid #fff; border-right: 0.0333rem solid #fff; transform: rotate(-45deg); margin-top: 0.1667rem; } aside .aside-itembox { width: 100%; } aside .aside-itembox .aside-item { border: 0.0167rem solid #ccc; } aside .aside-itembox .aside-item:first-child ~ .aside-item { margin-top: 0.3333rem; } aside .aside-itembox .aside-item .desc p { border-bottom: 0.0167rem solid #f5f5f5; font-size: 0.2333rem; padding: 0.25rem 0.3333rem; } aside .aside-itembox .head { position: relative; width: 100%; background: #014099; text-align: left; font-weight: bold; padding: 0.25rem 0.3333rem; } aside .aside-itembox .head .cn { color: #fff; font-size: 0.4rem; line-height: 1.2; } aside .aside-itembox .body { background: #fff; } aside .aside-nav { padding-left: 0.3333rem; padding-right: 0.3333rem; } aside .aside-nav > li { font-size: 0.3rem; color: #333; } aside .aside-nav > li:hover { color: #014099; } aside .aside-nav > li:hover:after { border-color: #014099; } aside .aside-nav > li.active > .aside-sub-nav { display: block; } aside .aside-nav > li:last-child { border-bottom: 0; } aside .aside-nav > li > a { border-bottom: 0.0167rem solid #f5f5f5; position: relative; display: block; width: 100%; padding: 0.25rem 0; font-size: 0.25rem; line-height: 1.2; display: flex; align-items: center; } aside .aside-nav > li > a:last-child { border-bottom: 0; } aside .aside-nav > li > a span { flex-grow: 1; } aside .aside-nav > li > a:after { content: ""; display: block; width: 0.1667rem; height: 0.1667rem; border-top: 0.0333rem solid #333; border-right: 0.0333rem solid #333; transform: rotate(45deg); flex-shrink: 0; } aside .aside-sub-nav { display: none; } aside .aside-sub-nav > li { border-bottom: 0.0167rem dashed #eee; } aside .aside-sub-nav > li.active a, aside .aside-sub-nav > li:hover a { color: #014099; } aside .aside-sub-nav > li:last-child { border-bottom: 0; } aside .aside-sub-nav > li > a { padding: 0.1333rem; display: block; line-height: 0.3333rem; color: #818181; font-size: 0.2333rem; } aside .recommended { padding: 0.1667rem 0.25rem; } aside .recommended .rec-item { display: block; font-size: 0.25rem; line-height: 1.8; } aside .recommended .rec-item:hover { color: #014099; } aside .recommended .rec-item:before { content: "+"; font-size: 0.3333rem; font-weight: bold; line-height: 0.3333rem; vertical-align: inherit; margin-right: 0.1667rem; } aside .recommended .rec-item:first-child ~ .rec-item { margin-top: 0.1667rem; } @media screen and (max-width: 751px) { aside { width: auto; margin-right: 0; } aside .aside-itembox { position: fixed; width: 100%; height: 100%; z-index: 9990; background: #000000; top: 0; left: 100%; padding: 80px 20px; transition: all 0s; opacity: 0; visibility: hidden; visibility: visible!important; animation-name: none!important; } aside .aside-itembox.active { left: 0; visibility: visible; opacity: 1; } aside .aside-itembox .aside-item { display: flex; flex-flow: column; height: 100%; border: 0; } aside .aside-itembox .aside-item .body { overflow: auto; flex-grow: 1; } aside .aside-itembox .aside-item:first-child ~ .aside-item { display: none; } aside .aside-itembox .aside-head { height: 65px; } aside .aside-itembox .aside-head .cn { font-size: 22px; } aside .aside-itembox .aside-head .en { line-height: 65px; font-size: 24px; } aside .aside-itembox .aside-nav { background: #fff; flex-grow: 1; min-height: 0; overflow: auto; } aside .aside-itembox .aside-nav > li { font-size: 14px; } aside .aside-itembox .aside-nav > li > a { padding: 12px 0; } } .aside-box.active { position: relative; width: 100%; height: 100%; z-index: 999999; } .aside-box.active .cloes { display: block; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAAAkFBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+WABnwAAAAL3RSTlMAe5SyqXJQ5Z1vCqGDjNxYKcWmdWxoZBb17unPrUMwIASYVtRLJvvgysbAiQ9hO0NijawAAAI8SURBVEjHpVfreoIwDG0LVBBRQbxMmXNednOO93+7rS22QFJ1X84fbZND0za3Mg92W8lFGgSp4HK7Y//AKaoGdQuDMDo9SJ0ENYJgcp855OPagzEf3ubu352teRgLEYe528H7/gZ1GTZaq2I+HVpjpoti1QjCpY97XBuNTQJUlsnGyNZHnBsZ8afExfLTyDkmHGnRW8S8iN60yhlKMi34mLIbmH5opVF/nuvpV3YHsVbrWfeMf9Jn4HPHNZ7UVOYhwKN5aruLdsjUS4CWB24s1fjAHsRBacuu0S+Pkl86hs/UKGEPI1H6s2YwUC7ZCo4MccEfUbrBRsVNE7/dw59jZlzsWvZiTXx/qVh1ejmyiUXd1VEx/2X3X7LWyoC96LtQaU7YBNPqmzm8Gnb/cxVz+F4126j+fgvWhjBsyHUIjaPsVAa46Bm4tuOG8BDWO7ZVohPzskv9t+gHp5rcMmnvDFiuQi8BXOcbUgdyzjzs/b72hEyuE5JwG4KWG8RAaE5MsNRJcTYujbVBgf4EBu6yJb6t4AZ5YsgTP9lv9qxuUHrNdgcGjQZscGD2qjAuH1k2elXOSSA3uybqOe4kuHuOrlzLRt0TDYxzO35TPVhggYGFZGbvF2e7kITJQPR9ozBsmAxgGjJletZdR+EI0hBMgGOkDla6pIAECFPvGXJNMatg6oVJn4cSKa2HYAmSPqHcUAodpcRSijupraA0NJRWitLEUdpHSuNKaZkpzTrhmUB+oNCfRvRHGek5+As4i6p2W+L7BQAAAABJRU5ErkJggg==") no-repeat center; width: 30px; height: 30px; background-size: 100%; position: fixed; z-index: 9999; right: 20px; top: 30px; } /* ==================== 侧边栏样式 end ==================== */ /* ==================== 新闻详情 start ==================== */ .ny-news-desc { padding: 0.7258rem 0.4032rem; padding-top: 0; margin-bottom: 0.5645rem; } .ny-news-desc > .mxw-box { padding-top: 1rem; } .ny-news-desc .title { font-weight: bold; font-size: 0.4516rem; color: #333; padding-bottom: 0.3226rem; } .ny-news-desc .info { font-size: 0; padding-bottom: 0.3226rem; border-bottom: 1px solid #d5d5d5; margin-bottom: 0.3226rem; } .ny-news-desc .info .text { font-size: 0.2581rem; color: #999; display: inline-block; margin-right: 0.3226rem; border-left: 1px solid #ccc; padding-left: 0.3226rem; } .ny-news-desc .info .tip + .text { border-left: 0; } .ny-news-desc .info .tip { border: 1px solid #999; border-radius: 1.6129rem; padding: 0.0806rem 0.1613rem; line-height: 1; font-size: 0.2258rem; display: inline-block; color: #999; } .ny-news-desc .article img { display: block; margin: 0 auto; } .ny-news-desc .article { line-height: 1.8; text-align: justify; font-size: 0.2581rem; } .ny-news-desc .article p { line-height: 1.8; } @media screen and (max-width: 751px) { .ny-news-desc { padding: 0; background: none; margin-bottom: 0; } .ny-news-desc > .mxw-box { padding: 30px 20px; } .ny-news-desc .article { font-size: 0.28rem; } .ny-news-desc .info .text { margin-right: 0.1rem; padding-left: 0.1rem; line-height: 2em; display: inline; } .ny-news-desc .info { padding-bottom: 0.2rem; } } /* ==================== 新闻详情 end ==================== */ /* ==================== 产品详情页 start ==================== */ .ny-product-desc { overflow: hidden; } .ny-product-desc .product-image { width: 10rem; margin-right: 0.6667rem; flex-shrink: 0; position: relative; z-index: 9; } .ny-product-desc .product-image img { width: 100%; } .ny-product-desc .product-desc { flex-grow: 1; } .ny-product-desc .product-desc .title { font-size: 0.4667rem; padding-bottom: 0.3333rem; border-bottom: 0.0167rem solid #ddd; margin-bottom: 0.3333rem; font-weight: bold; color: #014099; } .ny-product-desc .product-desc .desc { font-size: 0.3rem; color: #666; line-height: 1.8; } .ny-product-desc .bottom { margin-top: 0.6667rem; font-size: 0.2667rem; line-height: 1.8; text-align: justify; } .easyzoom-flyout img { max-width: inherit!important; width: auto!important; } @media screen and (max-width: 751px) { .ny-product-desc { padding: 0; } .ny-product-desc .product-image { width: 100%; margin-right: 0; margin-bottom: 15px; pointer-events: none; } .ny-product-desc .product-desc .title { font-size: 18px; margin-bottom: 10px; padding-bottom: 10px; } .ny-product-desc .top { flex-flow: column; } .ny-product-desc .product-desc .desc { font-size: 14px; } .ny-product-desc .bottom { margin-top: 15px; } } /* ==================== 产品详情页 end ==================== */ /* ==================== 通用工具栏 start ==================== */ .mxw-tool { position: fixed; z-index: 99; } .mxw-tool .icon { overflow: hidden; } @media screen and (min-width: 751px) { .mxw-tool { box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.2); right: 0; top: 50%; transform: translateY(-50%); padding: 20px 0; border-radius: 100px; background-color: #fff; } .mxw-tool .tool-item { font-size: 0; position: relative; display: flex; flex-flow: column; justify-content: center; align-items: center; text-align: center; padding: 20px 15px 15px; border-bottom: 1px solid #e6e6e6; transition: background-color 0.4s; } .mxw-tool .tool-item:hover { background-color: rgba(27, 75, 174, 0.1); } .mxw-tool .tool-item:hover .tool-content { opacity: 1; visibility: visible; transform: translateX(0); z-index: 9; } .mxw-tool .tool-item:hover .tool-content:hover { opacity: 1; visibility: visible; transform: translateX(0); z-index: 9; } .mxw-tool .tool-item:last-child { border-bottom: 0; } .mxw-tool .tool-item .icon { width: 30px; height: 30px; margin-bottom: 10px; } .mxw-tool .tool-item .text { font-size: 14px; color: #666; line-height: 1.2; } .mxw-tool .tool-content { position: absolute; top: 0; height: 100%; background: #fff; width: 200px; right: 86px; color: #333; font-size: 14px; display: flex; flex-flow: column; justify-content: center; align-items: flex-start; padding: 0 20px; font-size: 16px; line-height: 1.6; border: 1px solid #ddd; border-radius: 5px; transform: translateX(100%); opacity: 0; visibility: hidden; transition: all 0.4s; } } @media screen and (max-width: 751px) { .mxw-tool { padding: 6px 10px; display: flex; align-items: center; justify-content: space-around; bottom: 0; left: 0; width: 100%; background-color: #333; color: #fff; font-size: 14px; } .mxw-tool .tool-item { width: 18%; height: 50px; display: flex; flex-flow: column; justify-content: center; align-items: center; } .mxw-tool .tool-item:nth-child(5) ~ .tool-item { display: none; } .mxw-tool .tool-item .icon { width: 24px; height: 24px; flex-shrink: 0; margin-bottom: 5px; } .mxw-tool .tool-item .text { font-size: 13px; width: 100%; text-align: center; letter-spacing: 1px; text-indent: 1px; } } /* ==================== 通用工具栏 end ==================== */ /* ==================== 分页样式 start ==================== */ .mxw-pagination { margin-top: 50px; font-size: 0; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; } .mxw-pagination > a { padding: 6px 12px; font-size: 14px; color: #666; line-height: 1.2; border: 1px solid #ccc; display: block; margin: 4px; } .mxw-pagination > a.active, .mxw-pagination > a:hover { background-color: #014099; color: #fff !important; } .mxw-pagination > a:first-child { margin-left: 0; } .mxw-pagination > a:last-child { margin-right: 0; } @media screen and (max-width: 751px) { .mxw-pagination { margin-top: 30px; } .mxw-pagination > a { font-size: 12px; margin: 2px; padding: 8px 10px; } } /* ==================== 分页样式 end ==================== */ /* ==================== 通用标签页 start ==================== */ /* 标签页 */ .mxw-tabs { padding-left: 0; padding-right: 0; } .mxw-tabs .mxw-tabs-header { display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; } .mxw-tabs .mxw-tabs-wrap { position: relative; display: flex; overflow-x: scroll; max-width: 100%; align-items: center; justify-content: flex-start; } .mxw-tabs .mxw-tabs-wrap::-webkit-scrollbar { display: none; } .mxw-tabs .mxw-tabs-item { flex-shrink: 0; text-align: center; cursor: pointer; font-size: 0.3rem; white-space: nowrap; background: #eaeaea; color: #333; padding: 0rem 0.5rem; margin-right: 0.9rem; line-height: 0.6667rem; } .mxw-tabs .mxw-tabs-item:last-child { margin-right: 0; } .mxw-tabs .mxw-tabs-item.active { background: #014099; color: #fff; } @media screen and (max-width: 751px) { .mxw-tabs .mxw-tabs-header { margin-bottom: 20px; } .mxw-tabs .mxw-tabs-item { font-size: 14px; padding: 0 20px; margin-right: 10px; } .mxw-tabs .mxw-tabs-item:last-child { margin-right: 0; } } /* ==================== 通用标签页 end ==================== */ /* ==================== 关键词 start ==================== */ .mxw-keywords { position: relative; z-index: 99; width: 100%; background: #fff; border-bottom: 1px solid #e1e1e1; } .mxw-keywords .mxw-box { position: relative; display: flex; align-items: center; padding-top: 15px; padding-bottom: 15px; } .mxw-keywords .left { position: relative; flex-grow: 1; font-size: 16px; line-height: 1.2; color: #666; } .mxw-keywords .left strong { vertical-align: inherit; } .mxw-keywords .left span { color: #014099; vertical-align: inherit; } .mxw-keywords .left a:after { content: ","; padding-left: 5px; padding-right: 5px; } .mxw-keywords .left a:hover { color: #014099; } .mxw-keywords .left a:last-child { padding-right: 0; } .mxw-keywords .left a:last-child::after { display: none; } .mxw-keywords .right form { display: flex; align-items: stretch; justify-content: space-between; position: relative; } .mxw-keywords .right form:before { content: ""; display: block; width: 2px; height: 16px; background-color: #d9d9d9; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); } .mxw-keywords .right input { width: 230px; height: 44px; line-height: 44px; padding: 0 20px; font-size: 14px; color: #333; border: 1px solid #c4c4c4; border-right: 0; background-color: #fff; } .mxw-keywords .right input::-webkit-input-placeholder { /*Webkit browsers*/ color: #999; } .mxw-keywords .right input:-moz-placeholder { /*Mozilla Firefox 4 to 8*/ color: #999; } .mxw-keywords .right input::moz-placeholder { /*Mozilla Firefox 19+*/ color: #999; } .mxw-keywords .right input:-ms-input-placeholder { /*Internet Explorer 10+*/ color: #999; } .mxw-keywords .right button { border: 0; outline: none; border-left: 0; cursor: pointer; background: #014099; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; width: 70px; } .mxw-keywords .right button .icon { display: block; width: 20px; height: 20px; overflow: hidden; font-size: 0; } .mxw-keywords .right button .text { font-size: 14px; padding-left: 5px; } /* ==================== 关键词 end ==================== */ /* ==================== 头部 start ==================== */ header { width: 100%; z-index: 99; transition: all 0.4s; position: relative; } header .welcome { border-bottom: 1px solid #f2f2f2; height: 32px; line-height: 32px; background-color: #2b2b2b; } header .welcome .mxw-box { display: flex; align-items: center; justify-content: space-between; color: #fff; } header .welcome .left { font-size: 14px; line-height: 1.2; } header .welcome .right { display: flex; align-items: center; font-size: 13px; } header .pc-nav .top > .mxw-box { display: flex; align-items: center; justify-content: space-between; padding: 40px 0; } header .pc-nav .top .left { flex-shrink: 0; display: flex; align-items: center; } header .pc-nav .logo { width: 380px; margin-right: 20px; position: relative; } header .pc-nav .logo:after { content: ""; display: block; width: 1px; height: 63px; position: absolute; top: 50%; transform: translateY(-50%); right: -20px; background-color: #014099; } header .pc-nav .left-desc { margin-left: 20px; flex-shrink: 0; } header .pc-nav .left-desc p { margin-bottom: 10px; } header .pc-nav .left-desc p:last-child { margin-bottom: 0; } header .pc-nav .left-desc strong { font-size: 22px; color: #014099; line-height: 1.1; display: block; } header .pc-nav .tel { flex-shrink: 0; display: flex; align-items: center; } header .pc-nav .tel .icon { width: 50px; margin-right: 15px; } header .pc-nav .tel .desc { min-width: 0; flex-grow: 1; } header .pc-nav .tel .desc p { color: #666; font-size: 14px; line-height: 1.2; margin-bottom: 5px; } header .pc-nav .tel .desc p:last-child { margin-bottom: 0; } header .pc-nav .tel .desc strong { font-size: 30px; font-weight: bold; color: #333; line-height: 1.1; display: block; } header .pc-nav .bottom { border-top: 1px solid #ccc; } header .pc-menu { position: relative; display: flex; align-items: stretch; justify-content: space-between; } header .pc-menu > li { flex-grow: 1; display: flex; align-items: center; justify-content: center; position: relative; text-align: center; } header .pc-menu > li:after { content: ""; display: block; width: 0; height: 100%; background-color: #014099; position: absolute; right: 50%; top: 0; transform: translateX(50%); transition: width 0.4s; } header .pc-menu > li.active:after, header .pc-menu > li:hover:after { width: 100%; } header .pc-menu > li.active > a, header .pc-menu > li:hover > a { font-weight: bold; color: #fff !important; } header .pc-menu > li:hover > ul { opacity: 1; visibility: visible; z-index: 9; } header .pc-menu > li ul { background-color: #fff; width: 3.3333rem; position: relative; visibility: hidden; opacity: 0; transition: opacity 0.4s, transform 0.4s, visibility 0s; } header .pc-menu > li ul:hover { opacity: 1; visibility: visible; } header .pc-menu > li ul li.active > ul, header .pc-menu > li ul li:hover > ul { opacity: 1; visibility: visible; z-index: 9; } header .pc-menu > li ul li a { position: relative; } header .pc-menu > li ul li a:after { content: ""; display: block; width: 80%; height: 0.0167rem; background-color: #eee; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); } header .pc-menu > li ul a { display: block; white-space: nowrap; text-overflow: ellipsis; width: 100%; overflow: hidden; font-size: 0.2333rem; color: #333; line-height: 1.2; padding: 0.2333rem; } header .pc-menu > li > a { font-size: 18px; color: #333; text-align: center; line-height: 1.2; padding: 20px 0; display: flex; align-items: center; justify-content: center; z-index: 9; position: relative; z-index: 2; width: 100%; } header .pc-menu > li > ul { border-top: 0.0167rem solid #ddd; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); } header .pc-menu > li > ul > li > a.active, header .pc-menu > li > ul > li > a:hover { background-color: rgba(0, 0, 0, 0.04); } header .pc-menu > li > ul > li > a.active:after, header .pc-menu > li > ul > li > a:hover:after { display: none; } header .pc-menu > li > ul > li > a:last-child:after { display: none; } header .pc-menu > li > ul > li > ul { position: absolute; left: 3.3333rem; top: 0; border-left: 0.0167rem solid #ddd; } header .pc-menu > li > ul > li > ul > li > ul { position: absolute; left: 3.3333rem; top: 0; border-left: 0.0167rem solid #ddd; } @media screen and (max-width: 1680px) { header .mxw-box { max-width: 96%; } } @media screen and (max-width: 1400px) { header .pc-menu > li > a { font-size: 14px; } header .pc-nav .top > .mxw-box { padding: 20px 0; } header .pc-nav .logo { width: 330px; } header .pc-nav .left-desc strong { font-size: 20px; } header .pc-nav .tel .icon { width: 40px; margin-right: 10px; } header .pc-nav .tel .desc strong { font-size: 24px; } } /* ==================== 头部 end ==================== */ /* ==================== 移动端头部 start ==================== */ @media screen and (max-width: 751px) { header { z-index: 99999; } .mxw-mob-nav .head { font-size: 0; padding-left: 12px; padding-right: 12px; display: flex; align-items: center; justify-content: space-between; height: 60px; max-width: 750px; width: 100%; transform: translateX(-50%); position: fixed; top: 0; left: 50%; z-index: 99; background-color: #fff; } .mxw-mob-nav .logo { display: block; flex-shrink: 0; } .mxw-mob-nav .logo img { height: 30px; } .mxw-mob-nav .menu-btn { flex-shrink: 0; width: 26px; height: 20px; cursor: pointer; outline: none; display: flex; flex-flow: column; justify-content: space-between; align-items: center; } .mxw-mob-nav .menu-btn i { display: block; width: 100%; height: 3px; border-radius: 100px; background-color: #333; } .mxw-mob-nav .menus-box { position: fixed; width: 100%; height: 100%; top: 0; right: 50%; max-width: 450px; z-index: 9999; background: rgba(0, 0, 0, 0.5); visibility: hidden; opacity: 0; transform: translateX(50%); } .mxw-mob-nav .menus-box.active { visibility: visible; opacity: 1; } .mxw-mob-nav .menus-box.active .menus { transform: translateX(0); } .mxw-mob-nav .menus { width: 60%; height: 100%; margin-right: 0; margin-left: auto; background: #fff; transform: translateX(100%); transition: all 0.5s; display: flex; align-items: flex-start; justify-content: flex-start; flex-flow: column; } .mxw-mob-nav .menus > ul { width: 100%; overflow: auto; } .mxw-mob-nav .menus > ul > li.active > ul { display: block; } .mxw-mob-nav .menus > ul > li > a { display: block; width: 100%; padding: 15px 18px; font-size: 14px; color: #555; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mxw-mob-nav .menus > ul > li > a.sub:after { content: ""; display: inline-block; vertical-align: middle; width: 0; height: 0; border-top: 4px solid #555; border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 0; margin-left: 10px; } .mxw-mob-nav .menus > ul > li > ul { display: none; padding: 0px 24px; } .mxw-mob-nav .menus > ul > li > ul > li > a { font-size: 14px; color: #888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; line-height: 36px; height: 36px; border-bottom: 1px solid #f3f3f3; } .mxw-mob-nav .menus-head { width: 100%; flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; background: #F8F8F8; border-bottom: 0.6px solid #eee; font-size: 16.8px; font-weight: bold; line-height: 54px; height: 54px; padding-left: 18px; padding-right: 18px; } .mxw-mob-nav .menus-head .text { color: #333; line-height: 1.2; } .mxw-mob-nav .menus-head .mxw-close { flex-shrink: 0; width: 20px; height: 20px; cursor: pointer; outline: none; position: relative; transform: rotate(45deg); } .mxw-mob-nav .menus-head .mxw-close:before, .mxw-mob-nav .menus-head .mxw-close:after { content: ""; display: block; border-radius: 100px; position: absolute; left: 50%; top: 50%; background-color: #333; transform: translate(-50%, -50%); } .mxw-mob-nav .menus-head .mxw-close:before { width: 2px; height: 100%; } .mxw-mob-nav .menus-head .mxw-close:after { width: 100%; height: 2px; } } /* ==================== 移动端头部 end ==================== */ /* ==================== 轮播图 start ==================== */ .mxw-banner { font-size: 0; position: relative; } .mxw-banner .swiper-slide { overflow: hidden; } .mxw-banner .swiper-slide img { width: 100%; } .mxw-banner .swiper-pagination { width: 100%; max-width: 1680px; display: flex; justify-content: center; align-items: center; position: absolute; bottom: 60px; right: 50%; transform: translateX(50%); left: auto; } .mxw-banner .swiper-pagination .swiper-pagination-bullet { width: 12px; height: 12px; border-radius: 100%; background-color: #fff; opacity: 1; margin-left: 10px; margin-right: 10px; transition: width 0.4s; } .mxw-banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 30px; border-radius: 100px; background-color: #014099; } .mxw-banner .swiper-button-next, .mxw-banner .swiper-button-prev { width: 1.4rem; height: 1.4rem; border-radius: 100%; display: flex; align-items: center; justify-content: center; background-color: rgba(0, 0, 0, 0.3); background-image: none; outline: none; z-index: 99; } .mxw-banner .swiper-button-next { right: 0.5rem; } .mxw-banner .swiper-button-prev { left: 0.5rem; } .mxw-banner .banner-swiper { --swiper-navigation-color: #fff; /* 单独设置按钮颜色 */ --swiper-navigation-size: 24px; /* 设置按钮大小 */ } .mxw-banner .banner-text { z-index: 8; width: 80%; height: 100%; display: flex; flex-flow: column; justify-content: center; align-items: center; transform: translateX(-50%); position: absolute; top: 0; left: 50%; color: #fff; text-align: center; } .mxw-banner .banner-text .text1 { font-size: 52px; line-height: 1.2; font-weight: bold; margin-bottom: 30px; } .mxw-banner .banner-text .text2 { font-size: 16px; opacity: 0.67; margin-bottom: 50px; } .mxw-banner .banner-text .mxw-more { width: 190px; height: 45px; border-radius: 100px; color: #fff; text-align: center; font-size: 18px; background-color: #014099; line-height: 45px; display: block; } .mxw-banner .down-btn { position: absolute; bottom: 40px; left: 50%; z-index: 10; animation: arrowAnimate 2s linear infinite; cursor: pointer; width: 20px; } @media screen and (max-width: 1300px) { .mxw-banner .banner-text .text1 { font-size: 40px; margin-bottom: 15px; } .mxw-banner .banner-text .text2 { font-size: 14px; } .mxw-banner .banner-text .mxw-more { width: 160px; height: 36px; line-height: 36px; font-size: 14px; } } @media screen and (max-width: 751px) { .mxw-banner .swiper-pagination { padding-right: 0px; bottom: 10px; max-width: 80%; } .mxw-banner .swiper-pagination .swiper-pagination-bullet { margin: 0 5px; font-size: 14px; width: 8px; height: 8px; } .mxw-banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { font-size: 18px; } .mxw-banner .swiper-button-next, .mxw-banner .swiper-button-prev { display: none; } .mxw-banner .banner-text { width: 90%; } .mxw-banner .banner-text .text1 { font-size: 16px; margin-bottom: 10px; } .mxw-banner .banner-text .text2 { font-size: 12px; margin-bottom: 15px; } .mxw-banner .banner-text .mxw-more { width: auto; height: auto; line-height: inherit; font-size: 12px; padding: 6px 20px; } } /* ==================== 轮播图 end ==================== */ /* ==================== 通用标题 start ==================== */ .mxw-title { margin-bottom: 1rem; text-align: center; overflow: hidden; } .mxw-title .text1 { font-size: 0.7333rem; font-weight: bold; line-height: 1.2; margin-bottom: 0.3333rem; color: #014099; } .mxw-title .text2 { font-size: 0.3rem; color: #787878; line-height: 1.6; } @media screen and (max-width: 751px) { .mxw-title { margin-bottom: 30px; } .mxw-title .text1 { font-size: 20px; margin-bottom: 10px; } .mxw-title .text2 { font-size: 12px; line-height: 1.8; color: #888; } } /* ==================== 通用标题 end ==================== */ /* ==================== 5123导航通五湖 start ==================== */ .mxw-about { background: url(../images/img03.jpg) no-repeat center bottom #fff; } .mxw-about .info .text1 { font-size: 0.4333rem; color: #014099; line-height: 1.2; margin-bottom: 0.3333rem; } .mxw-about .info .text2 { font-size: 0.5333rem; font-weight: bold; margin-bottom: 0.5rem; color: #014099; } .mxw-about .info .desc { font-size: 0.3rem; color: #666; line-height: 2; text-align: justify; margin-bottom: 1rem; } .mxw-about .itembox { display: flex; align-items: flex-start; } .mxw-about .item { width: 2rem; height: 2rem; display: flex; flex-flow: column; align-items: center; justify-content: center; border: 0.0167rem dashed #dbdbdb; margin-right: 0.5rem; text-align: center; border-radius: 0.1rem; } .mxw-about .item:hover { border-color: #014099; color: #014099; } .mxw-about .item:hover .icon img { transform: translateY(0); } .mxw-about .item:hover .text { color: #014099; } .mxw-about .item:last-child { margin-right: 0; } .mxw-about .item .icon { width: 0.8333rem; height: 0.8333rem; margin-bottom: 0.1667rem; overflow: hidden; } .mxw-about .item .icon img { transform: translateY(-50%); } .mxw-about .item .text { font-size: 0.2667rem; color: #666; } @media screen and (min-width: 751px) { .mxw-about .mxw-box { padding-top: 1.6667rem; padding-bottom: 1.6667rem; display: flex; align-items: center; } .mxw-about .info { min-width: 0; flex-grow: 1; margin-right: 2.3333rem; } .mxw-about .image { flex-shrink: 0; width: 11.3333rem; } } @media screen and (max-width: 751px) { .mxw-about .info .text1 { margin-bottom: 5px; font-size: 18px; font-weight: bold; } .mxw-about .info .text2 { font-size: 14px; line-height: 1.6; font-weight: 400; margin-bottom: 20px; } .mxw-about .info .desc { font-size: 14px; margin-bottom: 20px; } .mxw-about .itembox { margin-bottom: 20px; } .mxw-about .item { width: 23.5%; margin-right: 2%; height: auto; padding: 10px 10px; } .mxw-about .item .icon { width: 30px; height: 30px; } .mxw-about .item:nth-child(4n) { margin-right: 0; } } /* ==================== 5123导航通五湖 end ==================== */ /* ==================== 产品服务 start ==================== */ .mxw-product { background-color: #f6f7f9; } .mxw-product .item .bottom { margin-top: 0.3333rem; display: flex; align-items: center; } .mxw-product .item .bottom .arrow { flex-shrink: 0; width: 0.5rem; height: 0.5rem; display: flex; align-items: center; justify-content: center; background-color: #014099; } .mxw-product .item .bottom .arrow:after { content: ""; display: block; width: 0.2rem; height: 0.2rem; border-top: 0.0167rem solid #fff; border-right: 0.0167rem solid #fff; transform: rotate(-45deg); margin-top: 0.1667rem; } .mxw-product .item .bottom .text { min-width: 0; flex-grow: 1; font-weight: bold; color: #014099; font-size: 0.35rem; padding: 0 0.25rem; } .mxw-product .item .bottom .more { font-size: 0.2667rem; color: #666; line-height: 1.2; flex-shrink: 0; } @media screen and (min-width: 751px) { .mxw-product .mxw-box { padding-top: 1.6667rem; padding-bottom: 1.6667rem; } .mxw-product .mxw-tabs-header { margin-bottom: 1rem; } .mxw-product .mxw-tabs-item { width: 4.85rem; border: 0.0167rem solid #d3d3d3; height: 1.1333rem; line-height: 1.1333rem; text-align: center; font-size: 0.3333rem; color: #333; margin-right: 1rem; background-color: transparent; } .mxw-product .mxw-tabs-item.active { background-color: #014099; color: #fff; } } @media screen and (max-width: 751px) { .mxw-product .mxw-tabs-wrap { flex-wrap: wrap; justify-content: space-between; } .mxw-product .mxw-tabs-item { margin-top: 2%; width: 49%; margin-right: 0; } .mxw-product .item .bottom { margin-top: 10px; } .mxw-product .item .bottom .arrow { display: none; } .mxw-product .item .bottom .text { text-align: center; font-size: 14px; padding: 0; } .mxw-product .item .bottom .more { display: none; } } /* ==================== 产品服务 end ==================== */ /* ==================== 解决方案 start ==================== */ .mxw-cases { background-color: #fff; } .mxw-cases .swiper-slide { position: relative; overflow: hidden; border-radius: 1.3333rem 0 0 0; } .mxw-cases .swiper-slide:hover .title { background-color: #014099; } .mxw-cases .swiper-slide .title { position: absolute; bottom: 0; left: 0; width: 100%; z-index: 9; height: 1.2333rem; line-height: 1.2333rem; display: flex; align-items: center; justify-content: center; background-color: rgba(0, 0, 0, 0.5); color: #fff; } .mxw-cases .swiper-slide .icon { width: 0.8333rem; flex-shrink: 0; margin-right: 0.3333rem; } .mxw-cases .swiper-slide .text { font-size: 0.3167rem; font-weight: bold; } @media screen and (min-width: 751px) { .mxw-cases .mxw-box { padding-top: 1.6667rem; padding-bottom: 1.6667rem; } .mxw-cases .swiper-slide { max-width: 340px; } } @media screen and (max-width: 751px) { .mxw-cases .mxw-title { margin-bottom: 20px; } .mxw-cases .swiper-wrapper { flex-flow: row wrap; } .mxw-cases .swiper-slide { margin-top: 10px!important; border-radius: 40px 0 0 0; } .mxw-cases .swiper-slide .title { height: 40px; line-height: 40px; } .mxw-cases .swiper-slide .icon { width: 30px; margin-right: 5px; } .mxw-cases .swiper-slide .text { font-size: 12px; } } /* ==================== 解决方案 end ==================== */ /* ==================== 优势 start ==================== */ .mxw-advantage { background: url(../images/img22.jpg) no-repeat center; background-size: cover; } .mxw-advantage .mxw-title .text1, .mxw-advantage .mxw-title .text2 { color: #fff; } .mxw-advantage .item .icon { margin: 0 auto; width: 3.5rem; } .mxw-advantage .item .info { background-color: #fff; padding: 1.6667rem 0.8333rem 1rem; margin-top: -1.4667rem; } .mxw-advantage .item .title { font-size: 0.5rem; color: #000; line-height: 1.2; margin-bottom: 0.3333rem; text-align: center; } .mxw-advantage .item .desc { font-size: 0.2667rem; color: #666; line-height: 1.8; text-align: center; } .mxw-advantage .mxw-more { margin: 0.9333rem auto 0; color: #fff; font-size: 0.2667rem; text-align: center; width: 2.5rem; height: 0.6667rem; border-radius: 1.6667rem; background-color: #014099; display: block; line-height: 0.6667rem; transition: box-shadow 0.4s, transform 0.4s; } .mxw-advantage .mxw-more:hover { color: #fff; box-shadow: 0 0 0.1667rem -0.0333rem rgba(255, 255, 255, 0.4); transform: translateY(-0.1667rem); } @media screen and (min-width: 751px) { .mxw-advantage { background-attachment: fixed; } .mxw-advantage .mxw-box { padding-top: 1.6667rem; padding-bottom: 1.3333rem; } .mxw-advantage .item { transition: margin-top 0.4s; } .mxw-advantage .item:hover { margin-top: -0.3333rem; } .mxw-advantage .item:hover .title { color: #014099; } } @media screen and (max-width: 751px) { .mxw-advantage .item { width: 100%; margin: 0 !important; } .mxw-advantage .item .title { margin-bottom: 10px; font-size: 18px; font-weight: bold; } .mxw-advantage .item .info { padding: 50px 15px 15px; margin-top: -40px; } .mxw-advantage .item .icon { width: 100px; } .mxw-advantage .mxw-more { margin-top: 20px; } } /* ==================== 优势 end ==================== */ /* ==================== 案例展示 start ==================== */ .mxw-cases2 { overflow: hidden; } .mxw-cases2 .item { overflow: hidden; display: block; box-shadow: 0rem 0rem 0.2167rem 0rem rgba(6, 0, 1, 0.08); } .mxw-cases2 .name { background: rgba(0, 0, 0, 0.6); height: 1rem; line-height: 1rem; text-align: center; font-size: 0.3333rem; color: #fff; padding: 0 15px; position: absolute; bottom: 0; left: 0; width: 100%; } .mxw-cases2 .cases2-swiper .swiper-slide { width: 8.8333rem; } @media screen and (min-width: 751px) { .mxw-cases2 .mxw-box { padding-top: 1.6667rem; padding-bottom: 1.6667rem; } } @media screen and (max-width: 751px) { .mxw-cases2 .cases2-swiper .swiper-slide { width: 100%; } .mxw-cases2 .name { font-size: 14px; height: 40px; line-height: 40px; } } /* ==================== 案例展示 end ==================== */ /* ==================== 新闻资讯 start ==================== */ .mxw-news { background-color: #fafafa; } .mxw-news .item { display: block; } .mxw-news .item:hover .title { color: #014099; } .mxw-news .item .info { background-color: #fff; padding: 0.6667rem 0.5rem; box-shadow: 0 0 0.1667rem -0.0333rem rgba(0, 0, 0, 0.18); } .mxw-news .item .time { font-size: 0.2667rem; line-height: 1.2; color: #666; margin-bottom: 0.1667rem; } .mxw-news .item .title { font-size: 0.3333rem; font-weight: bold; color: #333; line-height: 1.2; margin-bottom: 0.3333rem; } .mxw-news .item .desc { font-size: 0.2667rem; color: #666; line-height: 1.6; text-align: justify; margin-bottom: 0.3333rem; } .mxw-news .item .mxw-more { color: #014099; text-transform: uppercase; font-size: 0.2333rem; } .mxw-news .right .item { padding-top: 0.5rem; padding-bottom: 0.5rem; border-bottom: 0.0167rem dashed #ccc; transition: all 0.4s; } .mxw-news .right .item:hover { transform: translateX(0.3333rem); } .mxw-news .right .item:first-child { padding-top: 0; } @media screen and (min-width: 751px) { .mxw-news .mxw-box { padding-top: 1.0833rem; padding-bottom: 1.5rem; } .mxw-news .mxw-title { margin-bottom: 1rem; } .mxw-news .mxw-title .cn { margin-bottom: 0; } .mxw-news .body { display: flex; align-items: flex-start; } .mxw-news .left { width: 11.8333rem; flex-shrink: 0; margin-right: 0.6667rem; } .mxw-news .right { padding-top:20px; min-width: 0; flex-grow: 1; } } @media screen and (max-width: 751px) { .mxw-news .item .info { padding: 20px 15px; } .mxw-news .item .title { font-size: 14px; margin-bottom: 10px; font-weight: bold; } .mxw-news .left { margin-bottom: 20px; } .mxw-news .right .item { padding-bottom: 15px; padding-top: 15px; } } /* ==================== 新闻资讯 end ==================== */ /* ==================== 合作伙伴 start ==================== */ .mxw-brand .image { border: 0.0167rem solid #ececec; } .mxw-brand .text { margin-top: 0.3333rem; font-size: 0.3rem; color: #787878; text-align: center; line-height: 1.2; } @media screen and (min-width: 751px) { .mxw-brand .mxw-box { padding-top: 1.6667rem; padding-bottom: 1.6667rem; } .mxw-brand .swiper-slide { max-width: 360px; } } @media screen and (max-width: 751px) { .mxw-brand .mxw-title { margin-bottom: 20px; } .mxw-brand .swiper-wrapper { flex-flow: row wrap; } .mxw-brand .swiper-slide { max-width: 50%; margin-top: 10px!important; } .mxw-brand .text { font-size: 12px; line-height: 1.6; margin-top: 10px; display: none; } } /* ==================== 合作伙伴 end ==================== */ /* ==================== 底部样式 start ==================== */ footer .foot-top { background-color: #232324; padding: 80px 0 20px; } footer .foot-top > .mxw-box { display: flex; justify-content: space-between; align-items: flex-start; } footer .foot-top > .link{ color: #c2c2c2; justify-content: flex-start; margin: 40px auto 0;} footer .foot-top > .link a{color: #c2c2c2; margin: 0 5px;} footer .foot-nav { display: flex; align-items: flex-start; justify-content: flex-start; } footer .foot-nav .nav-item { margin-right: 100px; } footer .foot-nav .nav-item:last-child { margin-right: 0; } footer .foot-nav .head { font-size: 17px; font-weight: bold; color: #fff; margin-bottom: 30px; } footer .foot-nav .list > a { display: block; font-size: 14px; color: rgba(255, 255, 255, 0.5); line-height: 1.8; margin-bottom: 10px; } footer .foot-nav .list > a:hover { color: #fff; } footer .foot-nav .list > a:last-child { margin-bottom: 0; } footer .foot-contact .logo { width: 280px; margin-bottom: 20px; display: block; } footer .foot-contact .desc { font-size: 14px; color: rgba(255, 255, 255, 0.5); line-height: 2; margin-bottom: 25px; } footer .qr-group { display: flex; align-items: flex-start; } footer .qr-group .qr { margin-right: 40px; width: 120px; text-align: center; font-size: 14px; color: rgba(255, 255, 255, 0.5); line-height: 1.2; } footer .qr-group .qr:last-child { margin-right: 0; } footer .qr-group .qr img { width: 100%; display: block; margin-bottom: 20px; } footer .mxw-copyright { background-color: #014099; } footer .mxw-copyright > .mxw-box { color: #fff; font-size: 14px; line-height: 1.8; padding: 30px 0; text-align: center; } @media screen and (max-width: 1500px) { footer .foot-nav .nav-item { margin-right: 40px; } footer .foot-top { padding: 50px 0; } footer .qr-group .qr { width: 100px; margin-right: 20px; } footer .mxw-copyright > .mxw-box { padding: 20px 0; } } footer .mxw-copyright a:hover{color:#fff;} @media screen and (max-width: 751px) { footer .foot-top { padding: 0; } footer .foot-contact .logo { margin: 0 auto 20px; } footer .foot-contact .desc { font-size: 13px; margin-bottom: 0; } footer .mxw-copyright > .mxw-box { padding: 20px; font-size: 12px; } } /* ==================== 底部样式 end ==================== */ /* ==================== 通用分享 start ==================== */ .mxw-share { display: flex; align-items: center; } .mxw-share .share-item { margin-right: 20px; position: relative; } .mxw-share .share-item:hover .qr { opacity: 1; visibility: visible; } .mxw-share .share-item:last-child { margin-right: 0; } .mxw-share .icon { width: 40px; height: 40px; overflow: hidden; font-size: 0; line-height: inherit; } .mxw-share .qr { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(15px); width: 120px; opacity: 0; visibility: hidden; transition: opacity 0.4s, visibility 0.4s; } .mxw-share .qr img { width: 100%; } .mxw-share .qr:hover { opacity: 1; visibility: visible; } @media screen and (max-width: 751px) { .mxw-share .qr { transform: translateX(-50%) translateY(-15px); bottom: 100%; top: auto; } } /* ==================== 通用分享 end ==================== */ /* 容器大小 */ .mxw-box { max-width: 1500px; margin: 0 auto; font-size: 16px; color: #333; } .mxw-box p { margin-bottom: 0; } .mxw-box a:hover { color: #014099; } /* 内页 banner */ .ny-banner img { width: 100%; } /* ==================== 页面自定义样式 start ==================== */ @media screen and (min-width: 1680px) { /* pc端固定html标签文字大小(rem适配) */ html { font-size: 60px !important; } } @media screen and (max-width: 1680px) { .mxw-box { max-width: 86%; } } @media screen and (min-width: 751px) { .pc-none, .mob-nav, .pc-none { display: none !important; } .mxw-ny-box { padding-top: 1.1667rem; padding-bottom: 1.1667rem; } } @media screen and (max-width: 751px) { .mxw-ny-box { max-width: 100%; font-size: 0; padding: 30px 20px; } } @media screen and (max-width: 751px) { body { margin-top: 60px; } html { font-size: 50px; } .m-none, .pc-nav { display: none !important; } .mxw-box { padding: 30px 20px; max-width: 100%; } .mxw-section { padding-left: 0; padding-right: 0; } article { font-size: 15px; } } /* ==================== 页面自定义样式 end ==================== */ /* ==================== 动画 start ==================== */ @keyframes arrowAnimate { 0% { transform: translate(0rem, 0rem); } 50% { transform: translate(0rem, -0.1667rem); } 100% { transform: translate(0rem, 0rem); } } /* ==================== 动画 end ==================== */