body { font-family: "寰蒋闆呴粦","Helvetica Neue",Helvetica,Arial,sans-serif; } .container-fluid, .container { padding: 0 0; } a { color: #333; } a:hover { color: #1766A9; text-decoration: none; } .left { float: left; } .right { float: right; } .header { height: 96px; } .top-left { float: left; width: 626px; } .top-left img:nth-child(2) { margin: 6px 6px 0; } .list-group-item { border: none; border-bottom: solid 1px #E4E4E4; margin-bottom: 0; } .top-right { float: right; width: 204px; margin-top: 10px; vertical-align: text-top; margin-right: 10px; } .top-right span { background: url(../img/phone.png) no-repeat left center; padding-left: 28px; margin-right: 8px; font-size: 20px; display: inline-block; height: 36px; } .top-right img { vertical-align: text-top; } /*index.html*/ .nav { height: 434px; background-color: #F6FAFE; overflow: hidden; } .subbannar { height: 402px; } .wrong { height: 40px; } .wrong-con { text-align: center; } .wrong-con form { margin-top: 20px; margin-bottom: 20px; } .wrong-con button { width: 140px; height: 40px; background-color: #169BD5; border-radius: 6px; color: #fff; } .wrong-con button:hover { background-color: red; } .nav ul { float: left; margin-bottom: 0; } .nav li { display: inline-block; font-size: 16px; margin-right: 36px; text-align: center; width: 110px; height: 42px; line-height: 42px; position: relative; } .nav li:before { background-color: #D9E3E7; content: ""; height: 16px; left: 130px; position: absolute; top: 14px; width: 1px; } .nav li:last-child:before { width: 0px; height: 0; display: none; } .nav li a { } .nav li a:hover { text-decoration: none; color: #2197E1; } .nav li.active { border-bottom: solid 3px #2197E1; color: #2197E1; } .nav form { float: right; margin-top: 7px; position: relative; } .nav form .form-control { width: 244px; height: 30px; border-radius: 4px; border: none; border: solid 1px #E5E8EA; } .nav form a { position: absolute; right: 6px; top: 6px; z-index: 99; } .title { background-color: #F6F6F6; height: 74px; border-bottom: solid 1px #E4E4E4; text-align: center; } .title h1 { font-size: 20px; font-weight: bold; color: #333; margin-top: 16px; margin-bottom: 4px; } .title h1:hover { color: #1766A9; } .news { } .comn-box { max-width: 476px; margin-top: 20px; padding-bottom: 6px; overflow: hidden; margin-bottom: 26px; } .con-rit .comn-box { height: 260px; } .news .comn-box { border-bottom: 3px solid #d4d4d4; } .comn-box img { margin-bottom: 12px; border: solid 1px #fff; } .news .comn-box img { width: 296px; height: 186px; } .products .comn-box img { width: 202px; height: 202px; } .comn-box img:hover { border: dotted 1px #A7D8FF; } .comn-box p { color: #888; } .comn-box p a { } .solution-box { max-width: 407px; margin-top: 20px; overflow: hidden; position: relative; margin-bottom: 26px; } .solution-box a { position: absolute; display: block; height: 44px; line-height: 44px; color: #fff; background-color: hsla(0,0%,0%,0.4); z-index: 111; bottom: 0; font-size: 16px; font-weight: bold; left: 0; width: 100%; text-align: center; } .solution-box a:hover { color: #d8edff; } .solution-box img { border: solid 1px #fff; } .solution-box img:hover { border: dotted 1px #FF771C; } .more-con { width: 100%; position: absolute; height: 100%; background-color: hsla(0,0%,0%,0.7); top: 0; left: 0; color: #fff; text-align: center; padding: 30px; display: none; } .more-con h4 { white-space: normal; height: 40px; line-height: 2; overflow: hidden; } .more-con p { line-height: 1.8; text-align: left; margin: 10px 0 22px 0; height: 76px; overflow: hidden; } .more-con button { width: 82px; height: 36px; line-height: 36px; background-color: #0071B7; } .products { text-align: center; } .products p a { font-size: 16px; font-weight: bold; } .products p:last-child { text-align: left; line-height: 1.8; height: 74px; overflow: hidden; } .tips-ico { text-align: center; margin-bottom: 26px; } .tips-ico li { width: 10px; height: 10px; border-radius: 5px; border: solid 1px #0071B7; margin: 0 6px; display: inline-block; } .tips-ico li.active { background-color: #0071B7; border: solid 1px #000099; } .viedo { position: relative; width: 100%; background: url(../img/7.jpg) no-repeat center top; height: 474px; } .viedo h1 { position: absolute; top: 10px; left: 30px; font-size: 32px; font-weight: bold; } .viedo img.viedo-ico { position: absolute; right: 10px; top: 20px; } .viedo ul { position: absolute; bottom: 10px; left: 0; width: 100%; } .viedo li { float: left; margin-left: 9%; } .viedo span { position: absolute; font-size: 70px; color: #fff; top: 30%; left: 50%; transform: translate(-30%,-50%); } .viedo span:hover { color: #333; } .footer { margin-top: 20px; border-top: solid 1px #E4E4E4; margin-bottom: 22px; } .footer-link { height: 42px; line-height: 42px; border-bottom: dotted 1px #E4E4E4; margin-bottom: 16px; } .footer-link a { margin: 0 8px; } .footer-mean { width: 68%; float: left; margin-bottom: 16px; background: url(../img/vline1.jpg) no-repeat right center; } .footer-mean ul { width: 100%; } .footer-mean li { float: left; width: 20%; } .footer-mean li b { font-size: 16px; font-weight: bold; } .footer-mean li a, .footer-mean li p { display: block; font-size: 14px; margin-top: 12px; } .footer-mean li:last-child { width: 40%; } .footer-two { width: 30%; float: right; } .footer-two li { float: left; text-align: center; margin-right: 46px; } .footer-bottom { clear: both; border-top: solid 1px #E4E4E4; margin-top: 20px; padding-top: 12px; margin-bottom: 300px; } .fb-left { float: left; margin-left: 210px; } .fb-right { float: right; } .footer-bottom li { margin-right: 8px; border-right: solid 1px #ccc; float: left; padding-right: 10px; } .footer-bottom li:last-child { border: none; } .bannar { width: 100%; } .mean { position: relative; z-index: 1; } .submean { z-index: 1200; width: 578px; height: 344px; border-radius: 6px; border: solid 1px #e4e4e4; background-color: #fff; position: relative; left: 0px; top: 0px; display: none; display: none; } .submean2 { left: 310px; } .submean ul { width: 100%; margin-bottom: 0; } .submean li { float: left; font-size: 14px; width: 144px; height: 166px; margin-right: 0; border-right: solid 1px #E4E4E4; border-bottom: solid 1px #E4E4E4; } .subm1-list2 li { border-bottom: none; } .subm1-list1 { margin-top: 4px; } .submean li:last-child { border-right: none; } .submean li:before { height: 0; } .submean h3 { font-size: 16px; font-weight: bold; margin-top: 16px; margin-bottom: 0px; } .submean h3 a { height: 16px; } .submean a { display: block; border: none; height: 28px; } .comonmean { width: 100px; height: auto; text-align: center; border: none; } .comonmean ul { border-radius: 6px; background-color: #fff; border: solid 1px #e4e4e4; } .comonmean ul li { height: 40px; line-height: 40px; width: 96px; margin-left: 1px; text-align: center; border: none; border-bottom: solid 1px #E4E4E4; } .comonmean ul li { border-right: none; } .comonmean ul li:last-child { border-bottom: none; } .submean3 { left: 448px; } .submean4 { left: 596px; } .submean5 { left: 750px; } /*products.html*/ .bread-swap { border-bottom: solid 1px #E4E4E4; margin-bottom: 10px; } .bread-swap h2 { float: left; font-size: 18px; font-weight: bold; } .breadcrumb { float: right; background-color: #fff; margin-top: 14px; margin-bottom: 6px; } .bread-swap span { font-size: 12px; color: #1766A9; margin-right: 4px; } .mean-left { width: 20%; float: left; } .mean-left li span { color: #999; font-size: 12px; margin-right: 12px; } .mean-left li i { font-style: normal; } .mean-left li a:hover, .mean-left li span:hover { color: #1766A9; font-weight: bold; } .mean-left img { margin-top: 14px; } li.gactive { background: none; border-bottom: none; padding: 0; text-indent: 8px; } .list-group-item.gactive > a { color: #1766A9; font-weight: bold; border-bottom: solid 1px #e4e4e4; display: block; padding: 10px 0; } .list-group-item.gactive > a > span { color: #1766A9; } .secondary-mean li { text-indent: 2.8em; margin-top: 16px; padding-bottom: 6px; border-bottom: solid 1px #e9e9e9; } .secondary-mean li a, .secondary-mean li a:visited { color: #888; } .secondary-mean li a:active, .secondary-mean li a:hover { color: #1766A9; font-weight: normal; } .secondary-mean li a.active { color: #1766A9; } .con-rit { width: 78%; float: right; text-align: center; max-height: 5000px; min-height: 600px; border-left: solid 1px #E4E4E4; padding-left: 26px; } .con-rit h2 { font-size: 24px; font-weight: bold; color: #0071B7; } .con-rit img { margin-bottom: 10px; } .con-rit p { line-height: 1.8; text-align: left; } .con-rit p.pro-abstract { height: 246px; overflow: hidden; } .con-rit li { margin-bottom: 22px; border-bottom: dotted 1px #E4E4E4; margin-top: 40px; } /*products-list.html*/ .pro-list li { position: relative; margin-top: 4px; } .pro-list p { text-align: center; height: 60px; width: 200px; } .pro-list img { float: left; width: 200px; height: 200px; margin-right: 26px; text-align: left; margin-bottom: 2px; } .pro-list h4 { font-weight: bold; text-align: left; margin-top: 30px; } .pro-list h4 a:link, .pro-list h4 a:visited { color: #333; white-space: nowrap; } p.assist-ico { position: absolute; right: 10px; bottom: 12px; height: auto; } p.assist-ico a, p.assist-ico a:visited { float: left; display: inline-block; margin-right: 18px; border-bottom: none; } .pro-list li a { color: #999; } .pro-list li a:active, .pro-list li a:hover { color: #1766A9; } .pro-list li span { margin-right: 6px; } /*products-details.html*/ .resolve img { width: 260px; height: 160px; margin-bottom: 20px; margin-top: 6px; } .resolve p { text-align: left; width: auto; height: auto; } .resolve div { width: 70%; overflow: hidden; height: 140px; } .resolve-details { padding: 12px 42px; } .resolve-details h1 { font-size: 32px; font-weight: bold; } .abstract { border-radius: 10px; border: solid 1px #e4e4e4; padding: 16px; margin: 16px 0; } .resolve-details hr { border: none; border-top: dotted 1px #B6D8F9; } .correlation-con p { text-align: center; } .pro-details li { margin: 0; border: none; } .prdetails-lef { width: 378px; float: left; margin-bottom: 16px; } .prdetails-lef div { margin-top: 12px; } .prdetails-lef div span { float: left; color: #B2B2B2; margin-top: 24px; } .prdetails-lef ul { float: left; } .prdetails-lef li { float: left; width: 90px; height: 58px; border: solid 1px #E4E4E4; margin: 0 10px; } .prdetails-lef li img { margin-top: 6px; } .bigpic { width: 378px; height: 292px; border: solid 1px #e4e4e4; } .bigpic img { width: 275px; height: 244px; margin-top: 20px; } .prdetails-rit { width: 580px; float: right; text-align: left; position: relative; min-height: 372px; } .share { position: absolute; left: 20px; bottom: 2px; width: 100%; } .share span { float: left; margin-right: 6px; } .prdetails-rit h2 { color: #333; font-size: 24px; } .pro-parameter { clear: both; margin-top: 20px; } .pro-parameter ul { border-bottom: solid 1px #E4E4E4; height: 36px; } .pro-parameter li { float: left; list-style: none; } .pro-parameter li.active { width: 102px; height: 36px; line-height: 36px; background-color: #0071B7; margin-right: 1px; color: #fff; } .pro-parameter li a { display: inline-block; width: 102px; line-height: 36px; height: 36px; background-color: #E4E4E4; margin-right: 1px; } .parameter-con { clear: both; text-align: left; } .parameter-con h4 { margin-top: 20px; } .correlation-con { border: solid 1px #E4E4E4; } .correlation-con p.correlation-tit { background-color: #F2F2F2; font-size: 16px; height: 40px; line-height: 40px; border-bottom: solid 1px #E4E4E4; text-indent: 2em; text-align: left; } .correlation-con .comn-box { margin-bottom: 6px; } .correlation-con .comn-box img { width: 200px; height: 200px; } /*service.html*/ .service { padding: 12px 42px; } .service h3 { font-size: 18px; font-weight: bold; color: #333; } .service h4 { color: #C94716; margin: 18px 0; font-weight: bold; font-size: 18px; } /*news-viedo.html*/ .news-viedo .comn-box { position: relative; } .news-viedo .comn-box img { width: 476px; height: 282px; margin-bottom: 0; border: none; } .news-viedo .comn-box span { position: absolute; font-size: 46px; color: #fff; top: 46%; left: 50%; transform: translate(-30%,-50%); } .viedo-con { position: absolute; bottom: 6px; left: 0; width: 100%; height: 48px; line-height: 48px; padding: 2px 10px; color: #fff; background-color: hsla(0,0%,0%,0.6); } .viedo-con a, .viedo-con a:visited { color: #fff; font-size: 16px; } .viedo-con a:active, .viedo-con a:hover { color: #64C4FF; font-size: 16px; } .viedo-con .right span { font-size: 12px; position: static; margin-top: 10px; transform: translate(0,0); color: hsla(0,0%,100%,0.8); } @media (min-width: 768px) and (max-width: 991px) { .container { width: 750px; } .top-right, .nav form { display: none; } .nav li { margin-right: 4px; width: 110px; } .nav li:before { left: 120px; } .viedo ul li img { width: 90%; } .viedo li { margin-left: 3%; width: 30%; } .footer-mean { width: 53%; } .footer-two { width: 46%; } .footer-mean li { float: left; width: 33%; } .star-pro img { width: 96%; } .pro-list div { width: 59%; } .prdetails-lef { width: 248px; } .prdetails-rit { width: 310px; } .bigpic { width: 232px; height: 178px; } .bigpic img { width: 169px; height: 150px; margin-top: 10px; } .prdetails-lef li { width: 50px; } .con-rit p.pro-abstract { height: 170px; } .prdetails-rit { min-height: 240px; } .resolve img { width: 220px; height: 135px; } .pro-list div { width: 54%; } .resolve div { height: 110px; } .mean-left img { width: 96%; } .resolve-details img, .service img { width: 92%; } .sm-hidden { display: none; } } @media (min-width: 992px) and (max-width: 1199px) { .container { width: 970px; } .footer-mean { width: 60%; } .footer-two { width: 36%; } .footer-mean li { float: left; width: 33%; } .viedo li { margin-left: 3%; } .news .comn-box { text-align: center; } .nav form { display: none; } .star-pro img { width: 92%; } .pro-list div { width: 66%; } .prdetails-rit { width: 320px; } .pro-list div { width: 60%; } .mean-left img { width: 97%; } .resolve-details img { width: 96%; } .md-hidden { display: none; } } @media (min-width: 1200px) and (max-width: 1299px) { .container { width: 1170px; } .viedo li { width: 30%; margin-left: 3%; } .pro-list div { width: 74%; } .prdetails-rit { width: 470px; } .share { bottom: 16px; } .resolve div { width: 67%; } .mean-left img { width: 98%; } } @media (min-width: 1300px) { .container { width: 1300px; } }