html { margin: 0; padding: 0; border: 0; } a, address, b, blockquote, body, code, dd, div, dl, dt, em, fieldset, footer, form, h1, h2, h3, h4, header, hgroup, iframe, img, label, li, nav, object, ol, p, pre, section, span, ul { margin: 0; padding: 0; border: 0; } body { background: #fff; color: #666; position: relative; font: 12px/1.5 Microsoft YaHei, arial, 瀹嬩綋, sans-serif; vertical-align: baseline; width: 100%; overflow-x: hidden; } input { padding: 0; margin: 0; font-family: "Microsoft YaHei"; } img { border: none; background: 0 0; vertical-align: middle; } li, ol, ul { list-style-type: none; } img, input, select { vertical-align: middle; } table { border-collapse: collapse; border-spacing: 0; } table, td, th { vertical-align: middle; } .clearfix:after { content: "."; display: block; height: 0; clear: both; overflow: hidden; visibility: hidden; } .clearfix { zoom: 1; } .clearboth { height: 0; line-height: 0; overflow: hidden; clear: both; font-size: 0; } h1, h2, h3, h4 { font-size: 12px; font-weight: 700; } hr { border: 0; border-top: 1px solid #ccc; height: 0; } .fl { float: left; } .fr { float: right; } .fwn { font-weight: 400; } .wh, .w1200 { width: 1200px; margin: 0 auto; } .container { width: 1200px !important; } #header { width: 1200px; margin: 0 auto; } .tophead { width: 100%; height: 32px; background: #090000; position: relative; z-index: 999; } .headtitle { font-size: 12px; color: #a5a3a3; line-height: 32px; } .sechead { width: 1200px; margin: 0 auto; height: 108px; line-height: 108px; position: relative; } .logo { float: left; } .logo h1 { display: inline-block; } #menu { background-color: #1258c6; } .nav { height: 52px; text-align: center; margin: 0 auto; } .nav li { text-align: center; width: auto; float: left; position: relative; z-index: 999; transition: 0.4s; } .nav li + li { margin-left: 52px; } .nav li h2 { line-height: 52px; height: 52px; font-weight: 400; } .nav li h2 a { display: block; font-size: 16px; color: #fff; width: 104px; transition: 0.4s; } .nav li h2 > a:hover { background-color: #114ba2; } .nav .sec { background: #114ba2; color: #fff; overflow: hidden; z-index: 9999; position: absolute; top: 36px; left: -13px; display: none; } .nav .sec a { background: #114ba2; color: #fff; height: 38px; line-height: 38px; width: 90px; } .nav .sec a:hover { background: #000; text-decoration: none; } /* 浜у搧 */ .pro { background: url(../images/pro_bg.jpg) 0 0; padding: 25px 0; overflow: hidden; } .proleft { background: #004ebe; width: 254px; overflow: hidden; } .proleft h3 { background: url(../images/proleft_tit.jpg) no-repeat 0 0; font-size: 26px; height: 68px; line-height: 68px; color: #fff; font-weight: 400; text-align: center; } .proleft h3 span { font-size: 16px; color: #819cd7; text-transform: uppercase; } .proleft .box { background-color: #fff; margin: 0 2px 2px; text-align: center; padding: 24px 0; } .proleft ul { width: 210px; margin: 0 auto; } .proleft ul li { height: 40px; line-height: 40px; margin-bottom: 24px; text-align: left; text-indent: 50px; font-size: 16px; } .proleft ul li a { color: #fff; transition: 0.4s; width: 100%; display: block; background-color: #004ebe; } .proleft ul li a:hover { background-color: #ff7f3b; } .proright { width: 930px; overflow: hidden; } .proright .biaoti { width: 100%; text-align: left; height: 40px; line-height: 40px; position: relative; margin-top: 15px; overflow: hidden; border-bottom: 3px solid #004ebe; } .proright .biaoti h3 { font-size: 24px; color: #004ebe; } .proright .biaoti .more { float: right; color: #141414; font-size: 16px; } .product_list1 { margin-top: 14px; overflow: hidden; } .product_list1 li { float: left; width: 290px; position: relative; margin: 15px 12px; overflow: hidden; } .product_list1 li:nth-child(3n) { margin-right: 0; } .product_list1 li img { width: 290px; height: 282px; transition: 0.5s; } .product_list1 li .ks { background-color: rgba(0, 0, 0, 0.7); position: absolute; bottom: 0; left: 0; right: 0; } .product_list1 li h4 { text-align: center; color: #fff; font-size: 14px; font-weight: 400; line-height: 36px; transition: 0.5s; } .product_list1 li:hover h4 { line-height: 282px; } .product_list1 li:hover img { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); } .protj { overflow: hidden; width: 100%; } .protj .biaoti { height: 105px; position: relative; overflow: hidden; text-align: center; } .protj .biaoti::before { content: ""; background-color: #e1e1e1; width: 100%; height: 1px; position: absolute; left: 0; right: 0; top: 90px; z-index: 0; } .protj h3 { line-height: 75px; font-size: 33px; font-weight: 400; color: #000; } .protj .more { line-height: 30px; width: 150px; display: inline-block; background-color: #474954; border-radius: 10px; color: #fff; position: relative; z-index: 1; } .prolist { margin: 30px 0 0; } .prolist li { width: 290px; margin-right: 20px; text-align: center; overflow: hidden; } .prolist li .img { width: 100%; height: 282px; display: block; overflow: hidden; } .prolist li img { width: 290px; height: 282px; transition: 0.4s; } .prolist li h4 { font-size: 16px; line-height: 80px; font-weight: 400; } .prolist li h4 a { color: #343434; } .prolist li:hover img { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); } /* 浼樺娍 */ .ys { background: url(../images/youshi_bg.jpg) no-repeat 50% 0; padding: 55px 0 20px 0; text-align: center; } .ys-tit { color: #fff; height: 100px; overflow: hidden; } .ys-tit h3 { font-size: 26px; line-height: 36px; position: relative; padding-bottom: 10px; } .ys-tit h3 span { font-size: 28px; display: block; font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; font-weight: 400; } .ys-tit h3::after { content: ""; position: absolute; bottom: 0; left: 0; width: 50px; height: 2px; background-color: #fff; } .ys-tit p { font-size: 20px; font-weight: 400; line-height: 30px; } .ys-tit p span { text-align: right; text-transform: uppercase; display: block; font-size: 12px; line-height: 18px; color: #a8bddb; } .ys-cont { background-color: #fff; overflow: hidden; } .ys-tab { width: 1126px; margin: 24px auto; } .ys-tab .hd { width: 92px; height: 400px; background-color: #114ba2; text-align: center; margin-left: 1px; } .ys-tab .hd li { height: 100px; position: relative; transition: 0.3s; } .ys-tab .hd li a { display: block; width: 100%; overflow: hidden; cursor: pointer; } .ys-tab .hd li a img { margin-top: 15px; } .ys-tab .hd li a h3 { font-size: 14px; font-weight: 400; color: #fff; margin-top: 25px; position: relative; } .ys-tab .hd li a h3::after { content: ""; width: 33px; height: 2px; background-color: #ffffff; position: absolute; top: -14px; left: 50%; transform: translateX(-50%); } .ys-tab .hd li.on { background-color: #377cca; } .ys-tab .hd li.on::after { content: ""; width: 11px; height: 16px; background: url(../images/jiao.png) no-repeat center center; position: absolute; right: -11px; top: 50%; transform: translateY(-50%); } .ys-tab .bd li img { width: 1000px; height: 406px; } .ys-tab .bd li p { font-size: 16px; line-height: 30px; color: #565656; margin: 16px 0; } .ys .more { display: inline-block; margin: 0 auto; width: 200px; font-size: 18px; line-height: 60px; font-weight: 700; color: #fff; text-align: center; background-color: #ff7f3b; } /* 鍏充簬鎴戜滑 */ .about { background: url(../images/about_bg.jpg) 50% 0 no-repeat; overflow: hidden; max-height: 930px; text-align: center; } .about_tit { border-bottom: 1px solid #3b86d4; } .about_tit h3 { font: 700 22px/56px "寰蒋闆呴粦"; color: #fff; text-align: center; border: 1px solid #fff; display: inline-block; padding: 0 15px 0 20px; margin: 70px auto 24px; letter-spacing: 5px; } .about_txt { max-height: 350px; text-align: left; font-size: 16px; line-height: 48px; color: #fff; overflow: hidden; text-overflow: ellipsis; /* 鏂囧瓧婧㈠嚭鐨勬椂鍊欑敤鐪佺暐鍙锋潵鏄剧ず */ display: -webkit-box; /* 寮规€т几缂╃洅瀛愭ā鍨嬫樉绀 */ -webkit-line-clamp: 9; /* 闄愬埗鍦ㄤ竴涓潡鍏冪礌鏄剧ず鐨勬枃鏈殑琛屾暟 */ -webkit-box-orient: vertical; /* 璁剧疆鎴栨绱几缂╃洅瀵硅薄鐨勫瓙鍏冪礌鐨勬帓鍒楁柟寮 */ } .about_list { } .about_list li { width: 290px; overflow: hidden; box-sizing: border-box; border: 1px solid #9fbbd7; float: left; background-color: rgba(255, 255, 255, 0.7); margin: 10px 13px 10px 0; } .about_list li:last-child { margin-right: 0; } .about_list li .img { width: 290px; height: 194px; overflow: hidden; display: block; } .about_list li img { width: 290px; height: 194px; transition: 0.4s; } .about_list li h4 { line-height: 68px; font-size: 16px; } .about_list li h4 a { color: #393939; } .about_list li:hover img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); } .about .more { display: block; text-align: left; text-indent: 90px; width: 300px; height: 60px; line-height: 60px; font-size: 16px; color: #fff; background-color: #ff7f3b; position: relative; margin: 40px auto; transition: 0.4s; box-sizing: border-box; } .about .more::after { content: "鈫?; position: absolute; text-indent: 0; font-size: 30px; height: 60px; width: 30px; left: 180px; top: 0; } .about .more:hover { border-radius: 30px; } .case { overflow: hidden; text-align: center; margin: 30px auto; } .case_tit { text-align: left; } .case_tit h3 { font-size: 30px; font-weight: 400; line-height: 50px; } .case_tit h3 b { font-size: 33px; color: #004bb7; text-transform: uppercase; } .case_tit h3 span { color: #004bb7; } .case_tit .more { float: right; line-height: 50px; } .case_list { } .case_list li { width: 290px; overflow: hidden; box-sizing: border-box; border: 1px solid #dcdcdc; float: left; margin: 10px 10px 10px 0; } .case_list li:last-child { margin-right: 0; } .case_list li .img { width: 290px; height: 194px; overflow: hidden; display: block; } .case_list li img { width: 290px; height: 194px; transition: 0.4s; } .case_list li h4 { line-height: 68px; font-size: 16px; font-weight: 400; } .case_list li h4 a { color: #393939; } .case_list li:hover img { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); } .news { } .news { overflow: hidden; text-align: center; margin: 30px auto; } .news_tit { text-align: left; } .news_tit h3 { font-size: 30px; font-weight: 400; line-height: 50px; } .news_tit h3 b { font-size: 33px; color: #004bb7; text-transform: uppercase; } .news_tit h3 span { color: #004bb7; } .news_tit .more { float: right; line-height: 50px; } .newspic { overflow: hidden; margin: 35px auto; } .newspic img { float: left; width: 560px; height: 320px; } .newspic .cont { float: right; width: 600px; text-align: left; } .newspic .cont .date { font-size: 14px; color: #8f8f8f; line-height: 55px; margin-top: 24px; display: block; } .newspic .cont .tit { font-size: 18px; line-height: 50px; color: #000; } .newspic .cont .txt { height: 84px; line-height: 28px; font-size: 14px; color: #666; } .newspic .cont .more { width: 146px; height: 40px; color: #fff; display: block; font-size: 14px; margin-top: 18px; line-height: 40px; text-align: center; background-color: #004bb7; } .newslist { overflow: hidden; } .newslist li { float: left; width: 390px; height: 164px; overflow: hidden; text-align: left; transition: 0.5s; margin-right: 10px; } .newslist li a { color: #666666; } .newslist .date { float: left; width: 85px; text-align: center; } .newslist .date b { font-size: 48px; color: #02041d; transition: 0.5s; } .newslist .date span { font-size: 14px; transition: 0.5s; } .newslist .cont { float: right; width: 270px; font-size: 14px; margin: 0 20px 0 0; } .newslist .tit { font-size: 16px; line-height: 45px; color: #02041d; transition: 0.5s; } .newslist .txt { line-height: 26px; height: 52px; overflow: hidden; margin: 6px 0; transition: 0.5s; } .newslist .more { line-height: 36px; transition: 0.5s; } .newslist li:hover { background-color: #004bb7; } .newslist li:hover * { color: #fff; } .adline { width: 100%; height: 200px; background: url(/images/adline.jpg) no-repeat 50%; } .foot { background-color: #014bb7; padding: 35px 0; margin-top: 24px; overflow: hidden; } .foot_nav { color: #fff; padding-bottom: 20px; margin-bottom: 45px; overflow: hidden; border-bottom: 1px solid #5c8cd1; } .foot_nav h3 { color: #fff; font-size: 16px; line-height: 24px; font-weight: 400; } .foot_nav h3 span { display: block; text-transform: uppercase; } .foot_nav p a { line-height: 48px; display: inline-block; color: #dde3f2; font-size: 16px; margin-left: 70px; } .foot_nav p a:hover { color: #fff; } .foot_cont { position: relative; overflow: hidden; } .foot_cont::after { content: ""; position: absolute; top: 0; left: 420px; bottom: 0; width: 1px; height: 100%; background: #5c8cd1; } .foot_com, .foot_com a { color: #FFF; } .foot_com { width: 400px; padding-right: 20px; } .foot_com h3 { font-size: 28px; line-height: 1.6; } .foot_com h3 span { font-size: 14px; display: block; } .foot_com .txt { font-size: 14px; line-height: 1.8; } .er { color: #dedee9; text-align: center; line-height: 14px; margin-top: 10px; } .er img { padding: 0 45px 10px; } .wchat { width: 90px; height: 90px; padding-right: 26px; } #footer { border-top: 1px solid #5c8cd1; background-color: #014bb7; padding: 18px 0 12px 0; font-size: 14px; line-height: 26px; text-align: center; } #footer, #footer a { color: #e8e8ea; } .ys33 { margin-top: 24px; } .layui-form-label { box-sizing:content-box; }