@CHARSET "utf-8";
html {
margin: 0;
padding: 0;
border: 0;
}
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
p,
blockquote,
pre,
a,
address,
code,
b,
em,
img,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
footer,
header,
hgroup,
nav,
section {
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;
}
a {
text-decoration: none;
outline: none;
}
/* a:link {
color: #666;
} */
a:visited {
/* color: #666; */
}
a:hover,
a:active,
a:focus {
/* color: #e87518;
text-decoration: none;
outline: none; */
}
input {
padding: 0;
margin: 0;
font-family: 'Microsoft YaHei';
}
img {
border: none;
background: none;
vertical-align: middle;
}
ul,
ol,
li {
list-style-type: none;
}
select,
input,
img,
select {
vertical-align: middle;
}
table {
border-collapse: collapse;
border-spacing: 0
}
table,
th,
td {
vertical-align: middle
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
overflow: hidden;
visibility: hidden;
}
.clearfix {
zoom: 1
}
.clearboth {
height: 0px;
line-height: 0px;
overflow: hidden;
clear: both;
font-size: 0px;
}
h1,
h2,
h3,
h4 {
font-size: 12px;
font-weight: bold;
}
hr {
border: 0;
border-top: 1px solid #ccc;
height: 0;
}
.com-img {
display: inline;
overflow: hidden;
margin: 0 auto;
display: table;
}
.com-img img {
transition: all 0.5s ease-in 0s;
-webkit-transition: all 0.5s ease-in 0s;
-moz-transition: all 0.5s ease-in 0s;
-o-transition: all 0.5s ease-in 0s;
}
.com-img: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);
}
@font-face {
font-family: 'constan2';
src: url('../fonts/Microsoft JhengHei UI/msjhl_0.ttc') format('truetype');
}
.ssddds {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.demo-message-wrap input::-webkit-input-placeholder,
.demo-message-wrap textarea::-webkit-input-placeholder {
/* WebKit browsers */
color: #fff;
}
.demo-message-wrap input:-moz-placeholder,
textarea:-moz-placeholder {
/* Mozilla Firefox 4 to 18 */
color: #fff;
}
.demo-message-wrap input::-moz-placeholder,
textarea::-moz-placeholder {
/* Mozilla Firefox 19+ */
color: #fff;
}
.demo-message-wrap input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
/* Internet Explorer 10+ */
color: #fff;
}
.demo-message-wrap input[type='text']::-webkit-input-placeholder {
color: #fff;
}
.aby_hh li:hover .aby_hh_img img {
filter: invert(49%) sepia(93%) saturate(369%) hue-rotate(900deg) brightness(60%) contrast(93%);
}
/*头部样式*/
.sky {
width: 1920px;
position: relative;
left: 50%;
margin-left: -960px;
height: 35px;
background: #dddddd;
}
.sky_con {
width: 1200px;
margin: 0 auto;
}
.huan {
float: left;
color: #666666;
font: 400 12px/35px "Microsoft Yahei";
}
.huan a {
line-height: 35px;
color: #666666;
font-size: 12px;
padding-right: 5px;
}
.k1x {
float: right;
line-height: 35px;
color: #666666;
font-size: 12px;
}
.k1x a {
color: #666666;
font-size: 12px;
}
.xyin-case-sort li:hover,
.xyin-case-sort li.on {
background: #3c486d;
position: relative;
color: #fff;
cursor: pointer;
}
.xyin-case-sort li:hover a,
.xyin-case-sort li.on a {
color: #fff;
}
.tou_con {
width: 1920px;
position: relative;
left: 50%;
margin-left: -960px;
background: #f5f5f5
}
.tou {
width: 1200px;
margin: 0 auto;
height: 120px;
overflow: hidden
}
.logo {
float: left;
line-height: 80px;
}
.telx {
float: right;
margin-top: 30px;
}
#search-type {
float: left;
width: 100px;
height: 24px;
border: 1px solid #c8c8c8;
margin-right: 5px;
}
.hotSearch a {
margin-right: 6px;
}
#formsearch input#s_btn {
width: 44px;
height: 35px;
line-height: 35px;
text-align: center;
background: url(../images/so.png) no-repeat center;
color: #fff;
border: none;
cursor: pointer;
}
#menu {
width: 1920px;
position: relative;
left: 50%;
margin-left: -960px;
background: #03479c;
}
.ct1 {
color: #03479c;
font-size: 42px;
text-align: center;
}
.ct1 span {
display: block;
text-transform: uppercase;
font-size: 18px;
font-weight: normal;
color: #888888;
font-family: "Arial";
line-height: 30px;
}
.container {
width: 1400px;
margin: 0 auto;
}
@media (max-width:1400px) {
.container {
width: 100%;
}
}
/*高品质追求*/
.box2 {
width: 1200px;
margin: 0 auto;
margin-top: 20px;
}
.tabz {
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin-top: 50px;
}
.tabz li {
float: left;
width: 140px;
height: 32px;
display: block;
line-height: 32px;
background: #eaeaea;
text-align: center;
color: #666666;
font-size: 14px;
cursor: pointer;
margin-left: 10px;
}
.tabz li.cur {
color: #fff;
text-decoration: none;
font-size: 14px;
background: #03479c;
}
.tabz li:hover,
.tabz li.cur {
background: #03479c;
position: relative;
color: #fff;
cursor: pointer;
}
.tabz li:hover a,
.tabz li.cur a {
color: #fff;
}
.ttz {
display: none;
margin-top: 30px;
}
.list1z {
padding: 8px 10px;
}
.list1z li {
position: relative;
vertical-align: middle;
float: left;
margin-right: 26px;
margin-bottom: 26px
}
.list1z li a.img {
display: block
}
.list1z li a.img img {
width: 376px;
height: 270px;
}
.list1z li:nth-child(3n) {
float: right;
margin-right: 0px;
}
.dac {
background: #03479c;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
line-height: 45px;
height: 45px;
}
.list1z li h3 {
color: #fff;
font-size: 16px;
float: left;
font-weight: normal;
margin-left: 5%;
}
.list1z li h3 a {
color: #fff;
font-size: 16px;
line-height: 45px;
}
.list1z li:hover .dac {
background: #b99562;
}
.mx {
float: right;
color: #fff;
font-size: 16px;
margin-right: 5%;
}
.mx a {
color: #fff;
font-size: 16px;
}
/*滚动*/
.pin {
width: 1200px;
margin: 0 auto;
}
.chan {
text-align: center;
padding-top: 30px;
position: relative;
margin-bottom: 40px;
}
.l_btn,
.r_btn {
position: absolute;
cursor: pointer;
top: 55%;
}
.l_btn {
left: -50px;
}
.r_btn {
right: -50px;
}
.twt {
float: left;
}
.twt li a.img {
display: block;
}
.twt li a.img img {
display: block;
width: 273px;
height: 150px;
}
.twt li {
float: left;
overflow: hidden;
margin-left: 20px;
}
#m_demo {
overflow: hidden;
width: 100%;
margin: 0 auto;
padding-top: 20px;
}
#m_indemo {
float: left;
width: 800%
}
#m_demo1 {
float: left;
}
#m_demo2 {
float: left;
}
.huise {
width: 1920px;
position: relative;
left: 50%;
margin-left: -960px;
background: #f5f5f5;
padding-bottom: 50px;
padding-top: 70px;
}
#demo {
overflow: hidden;
width: 100%;
margin: 0 auto;
}
#indemo {
float: left;
width: 800%
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
.anls {
width: 1200px;
margin: 0 auto;
padding-top: 40px;
border-top: 1px solid #e5e5e5
}
.product_list3 {}
.product_list3 li {
float: left;
margin-right: 38px;
margin-bottom: 38px;
_display: inline;
position: relative;
width: 376px;
height: 248px;
}
.product_list3 li a.img {}
.product_list3 li a.img img {
width: 376px;
height: 248px;
}
.product_list3 li h3 {
text-align: center;
position: absolute;
bottom: 0px;
width: 100%;
background: url(../images/h3.png) no-repeat center top;
height: 40px;
color: #fff;
}
.product_list3 li h3 a {
font-weight: normal;
line-height: 40px;
font-size: 16px;
color: #fff;
}
.product_list3 li a.img {
display: block;
}
.product_list3 li a.img:hover {
border-color: #b99562;
}
.xypg-left {
float: left;
width: 280px;
}
.page-wrap-right {
float: right;
width: calc(100% - 310px);
}
@media (max-width:992px) {
.page-wrap-right{
width: 100%;
}
}
/*jg*/
.wrapper {
padding: 0 60px;
}
@media (max-width: 768px) {
.wrapper {
padding: 0 15px;
}
}
.flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media (max-width: 992px) {
.flex {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.title {
text-align: center;
position: relative;
padding: 15px 0 2px;
}
.title h2 {
font: 400 32px/42px "Microsoft YaHei";
color: #000000;
}
.title strong {
font: 600 62px/65px "Arial";
color: rgba(153, 153, 153, 0.2);
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
text-transform: uppercase;
}
.header .top {
background: #04408d;
font: 400 12px/33px "Microsoft YaHei";
color: #fff;
}
.header .top a {
font: 400 12px/33px "Microsoft YaHei";
color: #fff;
}
.header .top a:hover {
color: #ccc;
}
.header .top .keys a:not(:last-child):after {
content: ',';
}
.header .nav {
padding: 12px 0;
}
.header .nav .logo {
width: 25.555%;
}
.header .nav .logo img {
max-width: 100%;
}
.header .nav .menu {
width: 59.555%;
}
.header .nav .menu li {
width: 12.5%;
text-align: center;
border-radius: 19px;
}
.header .nav .menu li a {
display: block;
font: 400 16px/38px "Microsoft YaHei";
color: #333333;
}
@media (max-width: 1200px) {
.header .nav .menu li a {
font: 400 14px/38px "Microsoft YaHei";
}
}
.header .nav .menu li.active {
background: #04408d;
}
.header .nav .menu li.active a {
color: #fff;
}
.header .nav .menu li:hover {
background: #04408d;
}
.header .nav .menu li:hover a {
color: #fff;
}
.about .about-cate {
background: #e8e8e8;
}
.about .about-cate li {
width: 16.666%;
text-align: center;
position: relative;
}
@media (max-width: 768px) {
.about .about-cate li {
width: 100%;
}
}
.about .about-cate li .about-ico {
display: inline-block;
height: 23px;
overflow: hidden;
position: relative;
top: 5px;
}
.about .about-cate li .about-ico img {
-webkit-transition: all .3s;
transition: all .3s;
}
.about .about-cate li span {
font: 500 18px/85px "Microsoft YaHei";
color: #333333;
}
@media (max-width: 768px) {
.about .about-cate li span {
font: 500 18px/50px "Microsoft YaHei";
}
}
.about .about-cate li:after {
content: '';
display: none;
width: 18px;
height: 14px;
background: url("../images/about_arrow.png") no-repeat center;
position: absolute;
left: 50%;
margin-left: -9px;
}
@media (max-width: 768px) {
.about .about-cate li:after {
display: none !important;
}
}
.about .about-cate li.active {
background: #04408d;
}
.about .about-cate li.active .about-ico img {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
.about .about-cate li.active span {
color: #fff;
}
.about .about-cate li.active:after {
display: block;
}
.about .about-cate li:hover {
cursor: pointer;
}
.about .about-cate li:hover .about-ico img {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
.about .about-cate li:hover:after {
display: block;
}
.about .about-con {
background: url("../images/about_con_bg.png") no-repeat center;
background-size: cover;
padding: 70px 100px 100px;
}
@media (max-width: 992px) {
.about .about-con {
padding: 30px 10px 30px;
}
}
.about .about-con .about-wz {
width: 49%;
}
@media (max-width: 992px) {
.about .about-con .about-wz {
width: 100%;
}
}
.about .about-con .about-wz h1 {
font: 400 36px/46px "Microsoft YaHei";
color: #04408d;
}
@media (max-width: 992px) {
.about .about-con .about-wz h1 {
font: 600 18px/28px "Microsoft YaHei";
}
}
.about .about-con .about-wz h2 {
font: 100 24px/34px "Microsoft YaHei";
color: #999999;
}
@media (max-width: 992px) {
.about .about-con .about-wz h2 {
font: 100 14px/24px "Microsoft YaHei";
}
}
.about .about-con .about-wz h2:after {
content: '';
display: block;
width: 80px;
height: 1px;
background: #666666;
margin: 22px 0 34px;
}
.about .about-con .about-wz p {
font: 400 16px/32px "Microsoft YaHei";
color: #666666;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
overflow: hidden;
}
.about .about-con .about-wz a {
display: block;
width: 134px;
text-align: center;
font: 400 16px/40px "Microsoft YaHei";
color: #fff;
background: #04408d;
margin-top: 40px;
}
.about .about-con .about-img {
width: 43%;
position: relative;
}
.about .about-con .about-img video{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background-color: #000;
}
.about .about-con .about-box:nth-child(n+2) .about-img video{
display: none;
}
@media (max-width: 992px) {
.about .about-con .about-img {
width: 100%;
}
}
.about .about-con .about-img img {
max-width: 100%;
}
.eq {
padding: 50px 0;
}
.quality {
padding: 50px 0;
background: #f7f7f7;
}
.quality .qu-list {
margin-top: 30px;
}
.quality .qu-list li {
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 24%;
padding: 35px 0 25px;
text-align: center;
}
@media (max-width: 768px) {
.quality .qu-list li {
width: 49%;
}
}
.quality .qu-list li strong,
.quality .qu-list li span {
display: block;
}
.quality .qu-list li strong {
font: 400 20px/30px "Microsoft YaHei";
color: #333333;
margin-top: 40px;
}
.quality .qu-list li span {
font: 400 14px/28px "Microsoft YaHei";
color: #666666;
margin-top: 10px;
}
.quality .qu-list li:hover {
cursor: pointer;
background: #04408d;
}
.quality .qu-list li:hover strong,
.quality .qu-list li:hover span {
color: #fff;
}
.quality .qu-list li .qu-img2 {
display: none;
}
.quality .qu-list li:hover .qu-img1 {
display: none
}
.quality .qu-list li:hover .qu-img2 {
display: inline-block;
}
.news {
padding: 50px 0 80px;
}
.news .news-list {
margin-top: 45px;
}
.news .news-list li {
width: 24%;
}
@media (max-width: 768px) {
.news .news-list li {
width: 49%;
}
.news .news-list li:nth-child(n + 3) {
margin-top: 20px;
}
}
.news .news-list li img {
width: 100%;
max-height: 238px;
}
.news .news-list li .news-title {
background: #f7f7f7;
padding: 15px 18px 7px;
}
.news .news-list li .news-title h3 {
-ms-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
margin-bottom: 7px;
}
.news .news-list li .news-title h3 a {
font: 400 16px/26px "microsoft yahei";
color: #4c4c4c;
}
.news .news-list li .news-title h3 a:hover {
color: #04408d;
}
.news .news-list li .news-title p {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font: 400 13px/23px "Microsoft YaHei";
color: rgba(128, 128, 128, 0.73);
}
.news .news-list li .news-title .news-more {
margin-top: 16px;
}
@media (max-width: 480px) {
.news .news-list li .news-title .news-more {
display: none;
}
}
.news .news-list li .news-title .news-more a {
font: 400 12px/22px "Microsoft YaHei";
color: #999999;
text-transform: uppercase;
}
.news .news-list li .news-title .news-more span {
font: 400 12px/22px "Microsoft YaHei";
color: #999999;
}
.news .news-list li:hover .news-title {
background: #04408d;
}
.news .news-list li:hover .news-title h3 a {
color: #fff;
}
.news .news-list li:hover .news-title p {
color: #fff;
}
.news .news-list li:hover .news-title .news-more span {
color: #fff
}
.news .news-list li:hover .news-title .news-more a {
color: #fff
}
.product {
background: url("../images/product_bg.png") no-repeat center;
background-size: cover;
padding: 50px 0;
}
.product .p-cate {
margin-top: 42px;
}
.product .p-cate .flex {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.product .p-cate .flex li {
margin: 0 7px;
}
.product .p-cate .flex li a {
display: block;
padding: 0 20px;
font: 400 18px/35px "Microsoft YaHei";
color: #ffffff;
border-radius: 6px;
border: 1px solid rgba(244, 244, 246, 0.4);
}
.product .p-cate .flex li a:hover {
background: #04408d;
color: #fff;
}
.product .p-list {
margin-top: 35px;
}
.product .p-list .product-box {
/*padding: 60px 0 30px;*/
background: #dedede;
}
.product .p-list .product-box .product-img {
display: block;
overflow: hidden;
}
.product .p-list .product-box img {
width: 100%;
transition: all .3s
}
.product .p-list .product-box:hover img {
transform: scale(1.1);
}
.product .p-list .product-box h3 {
background: #dedede;
text-align: center;
font: 400 16px/40px "Microsoft yahei";
}
.product .p-list .product-box h3 a {
font: 400 16px/26px "Microsoft YaHei";
color: #333;
}
.partner {
background: url("../images/partner_bg.jpg") no-repeat center;
padding: 50px 0 70px;
}
.partner .partner-list {
margin-top: 52px;
}
@media (max-width: 1440px) {
.partner .partner-list {
padding: 0 0px;
}
.product .p-cate .flex li a{
padding: 0 10px;
font-size: 16px;
}
}
.partner .partner-list .flex {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.partner .partner-list li {
width: 15%;
}
.partner .partner-list .flex li img {
max-width: 100%;
-webkit-transition: all .3s;
transition: all .3s;
}
.partner .partner-list .flex li:nth-child(n + 7) {
margin-top: 20px;
}
.partner .partner-list .flex li img {
border: 1px solid #e6e6e6;
}
.partner .partner-list .flex li:hover {
cursor: pointer;
}
.partner .partner-list .flex li:hover img {
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}
.partner .partner-tel {
text-align: center;
margin-top: 45px;
}
.partner .partner-tel p {
font: 600 26px/36px "Arial";
color: #333333;
}
.partner .partner-tel span {
display: block;
font: 100 15px/25px "Microsoft YaHei";
color: #666666;
}
@media (max-width:992px) {
.partner .partner-list .flex li{
width: 25%;
}
.partner .partner-list .flex li:nth-child(n + 7){
margin-top: 0;
}
}
.links {
background: #003476;
padding: 23px 0;
}
.links .links-box {
}
.links .links-box span {
font: 100 14px/24px "Microsoft YaHei";
color: #ffffff;
}
.links .links-box a {
font: 100 14px/24px "Microsoft YaHei";
color: #ffffff;
}
.links .links-box a:hover {
color: #ccc;
}
.foot {
background: #04408d;
padding: 38px 0 12px;
}
.foot .foot-nav {
padding: 0 200px;
}
.foot .foot-nav .flex {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.foot .foot-nav .flex li {
padding: 0 50px;
border-right: 1px solid rgba(229, 229, 229, 0.2);
}
@media (max-width: 1440px) {
.foot .foot-nav .flex li {
padding: 0 24px;
}
}
@media (max-width: 1366px) {
.foot .foot-nav .flex li {
padding: 0 15px;
}
}
@media (max-width: 1200px) {
.foot .foot-nav .flex li {
display: none;
}
}
.foot .foot-nav .flex li:last-child {
border-right: none;
}
.foot .foot-nav .flex li a {
font: 400 16px/16px "Microsoft YaHei";
color: #ffffff;
}
.foot .foot-nav .flex li a:hover {
color: #ccc;
}
.foot .foot-contact {
margin-top: 40px;
}
@media (max-width: 1440px) {
.foot .foot-contact {
padding: 0 60px;
}
}
@media (max-width: 1200px) {
.foot .foot-contact {
padding: 0 5px;
}
}
.foot .foot-contact .foot-l {
font: 400 14px/28px "Microsoft YaHei";
color: #ffffff;
width: 60%;
}
.foot .foot-contact .foot-l a {
font: 400 14px/28px "Microsoft YaHei";
color: rgba(255, 255, 255, 0.7);
}
.foot .foot-contact .foot-l a:hover {
color: #ccc;
}
@media (max-width: 767px) {
.foot .foot-contact .foot-l{
display: block;
width: 100%;
}
.page-banner{
display:none;
}
}
.header .nav .search {
width: 10%;
border: 1px solid #9e9e9e;
border-radius: 18px;
overflow: hidden;
}
.header .nav .search #formsearch #keyword {
/*
border: none;
padding: 0;
float: left;
color: #999999;
background: transparent; */
line-height: 36px;
height: 36px;
font-size: 14px;
float: left;
width: calc(100% - 35px);
border: none;
padding-left: 10px;
outline: none;
}
.header .nav .search #formsearch #s_btn {
float: left;
outline: none;
border: none;
width: 35px;
line-height: 36px;
height: 36px;
font-size: 0;
background-image: url(../images/icon_spirit.png);
background-color: transparent;
background-repeat: no-repeat;
background-position: 0 -207px;
}
.w-1400px{
width: 1400px;
margin: 0 auto;
}
@media (max-width:1440px){
.w-1400px{
width: 100%;
}
}