@charset "utf-8";
/* CSS Document */
html,body {
	height: auto;
	padding: 0;
	margin: 0;
	font-size: 14px;
	font-family:"arial","微软雅黑",'sans-serif', "Helvetica", "Helvetica Neue";
	color: #666;
	line-height: 1.5;
	text-align: center;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}

input,textarea {
	font-family: "arial","微软雅黑",'sans-serif', "Helvetica", "Helvetica Neue";
	color: #1b1c20;outline:none;
}
input:focus,textarea:focus { outline: none; }
ul,li {	list-style: none;	padding: 0;	margin: 0;}

h1,h2,h3,h4,h5,h6,p,dl,dd,dt {	margin: 0;	padding: 0;}
h1, h2, h3, h4, h5, h6 {
    margin: 0 0 15px;
    color: #444;
    font-weight: 700;
}

a {	text-decoration: none;	color: #666;}
a:hover {	color: #0595e1;	text-decoration: none;}
a img {	border: 0;}

input::-webkit-input-placeholder {	color: #838383;}
input::-moz-placeholder {	color: #838383;}
input:-ms-input-placeholder {	color: #838383;}

.font32 { font-size: 32px;}
.font28 { font-size: 28px;}
.font26 { font-size: 26px;}
.font25 { font-size: 25px;}
.font24 { font-size: 24px;}
.font22 { font-size: 22px;}
.font20 { font-size: 20px;}
.font18 { font-size: 18px;}
.font16 { font-size: 16px;}
.font14 { font-size: 14px;}
.font13 { font-size: 13px;}
.font12 { font-size: 12px;}

.con,.conn {max-width: 1200px; width: 90%; margin: 0 auto;}
@media only screen and (max-width:828px) {
.con,.conn {margin: 0 1em; width: auto;}
.font28 { font-size: 20px;}
.font26 { font-size: 22px;}
.font25 { font-size: 23px;}
.font22 { font-size: 20px;}
}
.wrap { width: 100%; overflow: hidden;}

/*头部*/
.header { position: relative; z-index: 12;  margin: 0 auto; }
.header .con { padding: 22px 0;
 display: flex; justify-content:space-between; align-items: center;}
 
.header .webInfo {display: flex; justify-content: flex-start; align-items: center; text-align: left;}

.header .logo { color: #fff; text-align: left; font-size: 40px; font-weight: bold;}
.header .logo a { color: #fff;}
.header .logo img {display: block;}
.header .webInfo .name { margin-left: 22px; padding-left: 22px;
 color: #000; line-height: 1.3; border-left:1px solid #c5c5c5;}
.header .webInfo .name h3 { font-size: 26px; font-weight: bold;}
.header .webInfo .name p { font-size: 14px; color: #464646; }

.header .btnW { display: flex; flex-direction: column;
align-items: flex-end; justify-content: center;
 text-align: right;}
.header .sl { display: flex; flex-wrap: wrap; align-items: center;
 justify-content: flex-end;}

.header .header-info { font-weight: bold; font-size: 14px; margin-right: 2em;
 display: flex; justify-content: flex-start; align-items: center; text-align: left;}
.header .header-info .header-icon { margin-right: 10px;}
.header .header-info .header-icon i {    color: #0089d0;
    font-size: 34px;
    line-height: 40px;}
.header .header-info .info-first {display: block; color: #444;}
.header .header-info .info-simple { display: block; color: #777;}


.social-links li {
    display: inline-block;
    margin-right: 5px;
    margin-top: 5px;
    margin-left: 5px;
}
.social-links.brand-color ul li a {
    border: 2px solid transparent;
}
.social-links.circle li a {
    border-radius: 100%;
}
.social-links li a {
    border: 2px solid #cacaca;
    /* display: inline-block; */
    height: 40px;
    line-height: 1.7;
    margin-right: 0;
    padding: 0;
    text-align: center;
    vertical-align: middle;
    width: 40px;
    overflow: hidden;
    color: #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
@media only screen and (max-width:828px) {
	.social-links { display: none;}
}
.facebook-bg {
    background-color: #3b5998 !important;
}
.youtube-bg {
    background-color: #CD322D !important;
}
.twitter-bg {
    background-color: #55ACEF !important;
}
.linkedin-bg {
    background-color: #0279BB !important;
}

.header .lan { position: relative; z-index: 1001;  line-height: 2em;
font-size: 14px;white-space:nowrap; *white-space:nowrap;color: #333;}
.header .lan .lanBtn { cursor: pointer; border: 1px solid #767676;
background-color: #efefef; padding: 0 0.5em;
 -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px;}
.header .lan img{ vertical-align: middle; height: 14px; width: 19px;background-size:contain;
}
.header .lan .arr { position: relative; top: 1px; margin-left: 0;
    display: inline-block; color: #222;
    font: normal normal normal 8px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;}
.header .lan .arr:before {content: "\f0d7";	}

.header .lan span{vertical-align: middle;}
.header .lan .lanPopup { position: absolute; top: 2.2em; right: 0; width: 140px;
background-color: #fff; border: 1px solid #c6c6c6; display: none;
-moz-box-shadow: 0 0.6em 0.9em rgba(0, 0, 0, .1);
-webkit-box-shadow: 0 0.6em 0.9em rgba(0, 0, 0, .1);
box-shadow: 0 0.6em 0.9em rgba(0, 0, 0, .1);
-moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;
} 
.header .lan .lanPopup ul { padding: 0.5em 0; }
.header .lan .lanPopup li { text-align: left; overflow: hidden;
 line-height: 1em;}
.header .lan .lanPopup li:hover { background-color: #f5f5f5;}
.header .lan .lanPopup li a { display: block; cursor: pointer;padding: 0.3em 0.5em;
color: #333;
}
.header .lan .lanPopup li:hover a { color: #333;}
.header .lan .lanPopup li img{ vertical-align: middle; height: 14px; width: 19px;
object-fit: contain;}
.header .lan .lanPopup li span {vertical-align: middle;}

.header .searchBox {margin-right:10px; display: flex; justify-content: flex-start; align-items: center; }
.header .searchBox .iW { margin-right: 4px;}
.header .searchBox .input { display: block; border: 1px solid #919191; width: 136px;
 outline-width: 0; font-size: 18px; padding: 0 0.6em;  font-size: 12px;
     line-height: 21px;
     height: 21px;
     border: 1px solid #919191;
    -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;
     padding-left: 4px;}
.header .btnSearch { margin-top: 1px; line-height: 1.8;font-size: 12px; display: block;cursor: pointer;
background: #0089d0; color: #fff; padding: 0 0.4em;
-moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;}

.header .tel { margin-top: 0.3em; font-size: 22px; color: #000; padding-left: 32px;
background: url(../images/tel_03.jpg) no-repeat 0 center  / 28px auto;}

@media only screen and (max-width:1060px) {
   .header .con { padding: 12px 0 6px;flex-direction: row; align-items: flex-start;}
   .header .searchBox { margin-right: -38px;}
   .header .lan { margin-top: 8px;}
   .header .btnW { padding-right: 38px;}
   
   .header .logo img { width: 180px;}
   .header .webInfo { flex:1; display: block; margin-top: 0;}
   .header .webInfo .name { margin-top: 5px; margin-left:0; border-left:0; padding-left: 0;}
   .header .tel { position: relative; right: -38px; font-size: 18px;}
   /* .header .webInfo .name h3 { font-size: 5vw;}
   .header .webInfo .name p { font-size: 2.5vw;} */
   
   .header .btnW { position: relative; z-index: 0;}
}
@media only screen and (max-width:828px) {
	.wrap { padding-top: 129px;}
	.header { position: fixed; z-index: 5000; left: 0; top: 0; width: 100%; background-color: #fff;}
	.header .con { padding:18px 0 ;}
	.header .header-info { display: none;}
	.header .logo img { display: block;}
	.header .lan { margin-top: 0;}
	.header .lan img { height: 26px;}
	.header .lan span { font-size: 12px;}
}
@media only screen and (max-width:650px) {
	.header .webInfo .name h3 { font-size: 22px;}
	.header .webInfo .name p { font-size: 12px;}
}
@media only screen and (max-width:580px) {
	.header .webInfo .name h3 { font-size: 18px;}
	.header .webInfo .name p { font-size: 10px;}
	.header .tel { font-size: 16px; padding-left: 1.6em; background-size:1.3em auto ;}
}
@media only screen and (max-width:460px) {
	.header .webInfo .name h3 { font-size: 3.6vw;}
	.header .webInfo .name p { font-size: 2vw;}
	.header .lan img { height: 26px;}
	.header .logo img { width: 39vw;}
}

/*头部导航*/
.nav { height: 60px; border-top: 1px solid rgba(255,94,20,.2); ;
position: relative; z-index: 10; }
.nav>.con { position: relative; z-index: 10;}
.nav>.con>ul { margin-right: 8em; height: 100%;display: flex; justify-content:space-between;  text-align: center;
align-items: center;padding: 0; line-height: 60px; font-size: 13px;}
.nav>.con>ul>li { 
	position: relative; 
	z-index: 100;
	cursor: pointer; font-weight: bold;
	text-transform: uppercase;
}
.nav>.con>ul>li>a { padding: 0 1.6em; transition: all 0.5s; color: #444;}
.nav>.con>ul>li>a:hover { background: #0089d0; color: #fff;}
.nav>.con>ul>li:hover .arr {background-image: url(../images/arrow_6.png)}
.nav>.con>ul>li:hover>a::before { content: ""; display: block; position: absolute;
left: 0; top: 0; width: 100%; height: 2px; background: #0089d0;}

@media only screen and (max-width:980px) {
	.nav>.con>ul>li>a { padding: 0 1.3em 0 1.1em;}
	.nav>.con { width: 96%;}
}
@media only screen and (max-width:900px) {
	.nav>.con>ul>li>a { padding: 0 1.2em 0 .09em;}
}

.nav>.con>ul>li>a,.nav>.con>ul>li>span,.nav>.con>ul>li>.name>a {
	position: relative; display: block;
	z-index: 0; color: #444;
}
.nav>.con>ul>li .arr { position: absolute; top: 1.9em; right: 0.3em;
width: 0.7em; height: 0.7em;
background: url(../images/arrow_5.png) no-repeat  center center / contain;}

.nav>.con>ul>li>a .arr:before {
	    content: "\f0d7";
	}
.nav>.con>ul>li.liW { position: static;}
.nav .sub_nav,
.nav>.con>ul>li>ul{
	display: none;
	position: absolute;
	top: 60px;
	left: 0; width: 220px;
	text-align: left;
	background: #fff;  
	-moz-box-shadow: 0 0 1em rgba(0, 0, 0, .1);
		-webkit-box-shadow: 0 0 1em rgba(0, 0, 0, .1);
	box-shadow: 0 0 1em rgba(0, 0, 0, .1);
}
.nav>.con>ul>li>ul::before { content: ""; display: block; position: absolute;
left: 0; top: 0; width: 100%; height: 2px; background: #0089d0;}
.nav>.con>ul>li.liW .sub_nav,
.nav>.con>ul>li.liW ul{ width: 100%;}
/* .nav>.con>ul>li:hover  .sub_nav { display: block;} */
.nav .sub_nav li a,
.nav>.con>ul>li>ul li a{padding: 0 2em 0 2em; display: block; }
.nav>.con>ul>li>ul li a:hover { background: #0089d0; color: #fff;}

/*三级*/
.nav>.con>ul>li>ul>li { position: relative; z-index: 0;}
.nav>.con>ul>li>ul>li>ul { display: none; background-color: #fff; position: absolute; left: 100%; top: 0; width: 100%; }
.nav>.con>ul>li>ul>li>ul::before { content: ""; display: block; position: absolute;
left: 0; top: 0; width: 100%; height: 2px; background: #0089d0;}

.nav .sub_nav .conn,
.nav>.con>ul>li>ul .conn{ padding: 2em 0;  text-align: left;
display: flex; justify-content: flex-start; align-items: stretch;}
.nav .sub_nav .conn .item,
.nav>.con>ul>li>ul .item{ width: 24%; margin-right: 1%;}
.nav>.con>ul>li>ul .item ul {display: block; position: static;
}
.nav .sub_nav .conn .item dt,
.nav>.con>ul>li>ul .conn .item dt{ font-weight: bold;}
.nav .sub_nav .conn .item li a,
.nav>.con>ul>li>ul .conn .item li a{padding: 0 2em 0 2em; 
background: url(../images/arrow_3_right.png) no-repeat 0.5em center / 0.5em auto;}

.nav>.con .searchWBox { position: absolute; top: 50%; right: 0; margin-top: -1.7em;}
.nav>.con .searchWBox .searchSwitch { line-height: 3.4; height: 3.4em; width: 3.4em; outline-width: 0;
border: 0;
 display: block;cursor: pointer;
background: #0089d0; color: #fff; 
-moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;}

.searchPBox { position: absolute; right:1em; top: 4em; width: 300px;
display: none; justify-content: space-between; align-items: center; }
.searchPBox form { width: 100%;
display: flex; justify-content: space-between; align-items: center;}
.searchPBox .iW { flex: 1; padding: 0 1em; margin-right: 3px; background-color: #eee;}
.searchPBox .input { width: 100%; display: block; border: 0; width: 100%;
 outline-width: 0; background-color: #eee;
     line-height: 3.4em;
     height: 3.4em;
   }
.searchPBox .btnSearch {  line-height: 3.4; height: 3.4em; width: 3.4em; outline-width: 0;
border: 0;
 display: block;cursor: pointer;
background: #0089d0; color: #fff; }

.header .c-switch { display: none; width: 26px; cursor: pointer;}
.header .c-switch i {
  position: relative;
  display: block;
  height: 2px;
  -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;
  background: #0595e1;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.header .c-switch i:nth-child(1) {
  top: 0;
}
.header .c-switch i:nth-child(3) {
  bottom: 0;
}
.header .c-switch i:nth-child(2) {
  margin: 6px 0;
}
.header .c-switch.show i:nth-child(2) {
  opacity: 0;
}
.header .c-switch.show i:nth-child(1) {
  top: 8px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.header .c-switch.show i:nth-child(3) {
  bottom: 8px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.nav .close { display: none;}
@media only screen and (max-width:828px) {
.header .c-switch {  display: block; position: absolute; top: 50%; margin-top: -9px; right: 0;}
.nav { display: none; font-size: 18px;
width: 100%;  height: auto;
background-image: none;
overflow-y: auto;}
.nav::before { display: flex; position: fixed; z-index: 9; background-color: #0383cc;
left: 0; top: 0; width: 100%; height: 3.2em; content: "";}
.nav>.con .searchWBox .searchSwitch { display: none;}
.nav .close { display: block; position: fixed; z-index: 10; top: 1em; right: 1em;
 width: 1.2em; height: 1.2em;
 background: url(../images/close.png) no-repeat center center / contain;}
.nav>.con { margin: 0;}
.nav>.con>ul { display: block; padding: 0 2em; line-height: 3.4;margin-right: 0;}
.nav>.con>ul>li { border-bottom: 1px solid #ddd; position: relative; z-index: 0; margin-top: 2px;
 display: flex; flex-wrap:wrap ; text-align: left; width: auto; }
.nav>.con>ul>li.liW { position: relative;}
.nav>.con>ul>li>ul { width: 100%; position: static;
 background-color: transparent; text-align: left;
 -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
 -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
 box-shadow: 0 0 0 rgba(0, 0, 0,0);}
.nav>.con>ul>li>ul a { margin-left: 0;padding: 0 2em;}
.nav .sub_nav li a, .nav>.con>ul>li>ul li a {padding: 0 2em 0 3em;}
.nav>.con>ul>li>ul::before { display: none;}
.nav>.con>ul>li>ul dt a { padding: 0;}
.nav>.con>ul>li>a,.nav>.con>ul>li>.name {margin: 0;}
.nav>.con>ul>li>a, .nav>.con>ul>li>span {display: block;}
.nav>.con>ul>li.liW>a,.nav>.con>ul>li.liW2>a { display: inline-block;}
.nav .sub_nav { display: none; position: static; width: 100%;}
.nav .sub_nav li a { padding: 0 2em 0 3em;}
.nav>.con>ul>li.cur {background-color: transparent;}
.nav>.con>ul>li.cur a {  background-image: none;}
.nav>.con>ul>li:hover,.nav>.con>ul>li:active {background-color: transparent; }
.nav>.con>ul>li:hover a {background-image: none;}
.nav>.con>ul>li>a:hover { background-color: transparent; color: #444;}
.nav>.con>ul>li .arr { position: absolute; top: 1.1em; right: 1em;
width: 1em; height: 1em;
background: url(../images/arrow_4.png) no-repeat  center center / contain;
transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);}
.nav>.con>ul>li:hover .arr {background-image: url(../images/arrow_4.png)}

.nav>.con>ul>li.show .arr {
	transform: rotate(0);
	-ms-transform: rotate(0);
	-webkit-transform: rotate(0);
}
.nav>.con>ul>li.liW .sub_nav { background-color: #0064a2;}
.nav .sub_nav .conn, .nav>.con>ul>li>ul .conn { padding: 1em 2em; display: block;}
.nav .sub_nav .conn .item,.nav>.con>ul>li>ul .conn .item { line-height: 2.2em; width: auto; margin-right: 0;}
.nav .sub_nav .conn .item a,.nav>.con>ul>li>ul .conn .item a { color: #fff;}

.nav>.con>ul>li.liW2 .sub_nav { background-color: #0064a2; text-align: left;}
.nav>.con>ul>li.liW2 .sub_nav a { color: #fff;}
.nav>.con>ul>li:hover>a::before { display: none;}
}

.swiper-banner { height: 780px; max-height: calc( 100vh - 149px);}
.swiper-banner .pic { position: relative; z-index: 0; width: 100%; 
height: 100%;}
.swiper-banner .pic img { position: absolute; left: 0; top: 0;
	display: block; width: 100%; height: 100%;
	object-fit:cover; object-position: center center;
}
.swiper-banner .swiper-button-prev,
.swiper-banner .swiper-button-next  {left:10%;
cursor: pointer;
    border-radius: 3px;font-size: 22px;
    margin-top: -20px;line-height: 48px;
	width: 44px;
	height: 44px; color: #fff; border: 2px solid #fff; background-image: none;
	background-color: #d6d6d6; transition: all 0.2s; opacity: 0;
	display: flex; justify-content: center; align-items: center;
	}
.swiper-banner .swiper-button-next { left: auto; right: 10%;}
.swiper-banner .swiper-button-prev:hover,
.swiper-banner .swiper-button-next:hover {color: #fff;
    background: #0089d0;    border: 2px solid #0089d0;}
	
.swiper-banner:hover .swiper-button-prev,
.swiper-banner:hover .swiper-button-next { opacity: 1;}
.swiper-banner:hover .swiper-button-next { right: 2.2%;}
.swiper-banner:hover .swiper-button-prev { left: 2.2%;}
@media only screen and (max-width: 1200px) {
	.swiper-banner { height: 65vw; max-height: initial;}
}

.banner { position: relative; z-index: 0;}
.banner img { display: block; width: 100%; height: 150px; 
object-fit:cover; object-position: center center;}
.banner .txt { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
display: flex; justify-content: center; align-items: center; text-align: left; font-size: 36px;
font-weight: bold; color: #444;}
@media only screen and (max-width: 1200px) {
	/* .banner img { height: 50vw;} */
}
.bannerS {}
.bannerS img { display: block; width: 100%; height: 360px; 
object-fit:cover; object-position: center center;}
@media only screen and (max-width: 1200px) {
	.bannerS img { height: 30vw;}
}

 .title { padding-top: 7%; display: flex; justify-content: center; align-items: center;}
 .title .name h3 {line-height: 1.6;
    color: #0089d0;
    font-weight: 400;}
 .title .name p {line-height: 1.7;
    color: #909090;
    text-transform: uppercase;}
 .title .name .line { width: 75%; margin: 0 auto; height: 3px; background-color: #000;}
 .title .line1 { width: 2em; height: 1.5em; margin-right: 0.5em;
background: url(../images/tit-bg_03.png) no-repeat center center / contain;}
 .title .line2 {width: 2em; height: 1.5em; margin-left: 0.5em;
background: url(../images/tit-bg_04.png) no-repeat center center / contain;}

@media only screen and (max-width: 1200px) {
	.title { padding-top: 1.5em;}
	 .title .name p { font-size: 0.64em;}
}

.searchSBox { 
display: flex; justify-content: space-between; align-items: center; }
.searchSBox form { width: 100%;
display: flex; justify-content: space-between; align-items: center;}
.searchSBox .iW { flex: 1; padding: 0 1em; margin-right: 3px; background-color: #eee;}
.searchSBox .input { width: 100%; display: block; border: 0; width: 100%;
 outline-width: 0; background-color: #eee;
     line-height: 3.4em;
     height: 3.4em;
   }
.searchSBox .btnSearch {  line-height: 3.4; height: 3.4em; width: 3.4em; outline-width: 0;
border: 0;
 display: block;cursor: pointer;
background: #0089d0; color: #fff; }

.main { max-width: 1182px; margin: 0 auto; padding-bottom: 2em;overflow: hidden;
display: flex; justify-content: space-between; text-align: left;}
.mainL { margin-top: 3.1em;
	/* width: 18.8%; */ width: 24%;
}
.mainR { margin-top: 3.1em; /* width: 78.8%; */ flex: 1; margin-left: 2.7%;
overflow: hidden;}


@media only screen and (max-width: 1200px) {
.main { margin: 0 1em; }
}
@media only screen and (max-width: 828px) {
.main { flex-wrap: wrap; flex-direction: column-reverse;}
.mainL { width: 100%;}
.mainR { width: 100%; margin-left: auto;}

}

.main .side .titd { margin-top: 0.6em; border-left:5px solid #007ebc ;
	background-color: #f5f5f5; padding: 1.2em 0.5em 1em; text-align: left;
	font-weight: bold; color: #444; font-size: 1.2em;
}
.main .side>div:first-child { margin-top: 0;}
.main .side .sideNav { font-size: 0.9em;}
.main .side .titLi { line-height: 3.6em; height: 3.6em; overflow: hidden;
 margin-top: 10px; border: 1px solid #ddd; color: #323238; padding: 0 1em 0 1em;
 -moz-border-radius:0.3em; -webkit-border-radius:0.3em; border-radius:0.3em;
 display: flex; justify-content: space-between; align-items: center;

 }
.main .side li li .titLi { padding-left: 2.5em;}
.main .side li ul { display: none;}
.main .side .titLi a {color: #323238; display: inline-block; overflow: hidden;
line-height: 3.6em; height: 3.6em;
}
.main .side .titLi a:hover {color: #007ebc;}
.main .side .titLi a::before{content: '◈';
    margin-right: 10px;
    display: inline-block;
    width: 10px;
    color: #007ebc;}
.main .side .titLi i.fa { margin-right: -1em; cursor: pointer; width: 3.6em; height: 3.6em; line-height: 3.4em;
text-align: center;
 background-color:#007ebc  ;color:#fff;}
 
/*产品详情*/

.pDeTopBox { display: flex; justify-content: flex-start; align-items: flex-start;}
.pDeTopBox .picb { width: 40%; }
/* .pDeTopBox .pic { width: 100%; padding-top: 84.8%; position: relative; z-index: 0;
 overflow: hidden;}
.pDeTopBox .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
 object-fit: contain;} */

.pDeTopBox .picd { display: block; padding-top: 84.8%; position: relative; z-index: 0;
 border: 1px solid #ddd;}
.pDeTopBox .picd a {position: absolute; left: 0; top: 0; width: 100% !important;
 height: 100% !important; }
.pDeTopBox .picd img { position: absolute; left: 0; top: 0; width: 100%;
 height: 100%; object-fit: contain;
 filter:alpha(opacity=100) !important; -moz-opacity:1.0 !important;  opacity:1.0 !important;}
.pDeTopBox .pics { margin-top: 0.6em; position: relative; z-index: 0; }

 .swiper_pro_s { margin: 0 1.5em;}
 .swiper_pro_s .item {border: 1px solid #ddd; margin: 0 3%;}
 .swiper_pro_s .pic { position: relative; z-index: 0; padding-top:84.8%;}
 .swiper_pro_s .pic img { position: absolute; 
 	width: 100%; height: 100%; left: 0; top: 0; object-fit: contain;}
 .swiper_pro_s .name { margin-top: 0.8em; line-height: 1.5em; height: 1.5em;
 overflow: hidden;}
 .swiper_pro_s .swiper-slide {  cursor: pointer; width: 20%;}
 .swiper_pro_s .swiper-slide.cur .item { border: 1px solid #ad1116;}
 .swiper_pro_s .swiper-button-disabled {
 	filter:alpha(opacity=40);-moz-opacity:.4; opacity:0.4;
 }
.pDeTopBox .pics .btnNext,
.pDeTopBox .pics .btnPrev {
 	position: absolute; z-index: 10; left: auto; top: 50%; margin-top: -0.45em;
 	right:0; cursor: pointer;
 	width:1em; height:1em;
 	background:  url(../images/arrow_2.png) center center no-repeat;
 	background-size:contain;
 	transition: all 0.5s;
 	-webkit-transition:all 0.5s;
 	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
 } 
 
.pDeTopBox .pics .btnPrev { left: 0; right: auto;
 transform: rotate(180deg);
 -ms-transform: rotate(180deg); 
 -webkit-transform: rotate(180deg); }
 
.pDeTopBox .pics  .swiper-button-disabled {
 	filter:alpha(opacity=40);-moz-opacity:.4; opacity:0.6; }
 
.pDeTopBox .txt { margin-left: 3.8%; flex:1;}
.pDeTopBox .txt .proName {  margin-bottom:1em; font-weight: bold; font-size: 1.3em;
line-height: 1.4; min-height: 2.8em; }
.pDeTopBox .txt .intro { margin-top: 0.5em; padding-top: 1em; border-top: 1px solid #eee; line-height: 2}
.pDeTopBox .txt dl { color: #666; display: flex;
 justify-content: flex-start; align-items: flex-start; }
.pDeTopBox .txt dl dt { line-height: 2; font-weight: normal; margin-right: 1em;}
.pDeTopBox .txt dl dd { line-height: 2; flex: 1;}

.pDeTopBox .txt .btnW { margin-top: 2em;}

.pDeTopBox .txt .share { margin-top: 1.6em; font-size: 1.3em;}
.pDeTopBox .txt .share a { background-color: #3b5998; display: inline-block;
width: 1.8em; height: 1.8em; line-height: 1.8em; color: #fff; text-align: center;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
}
.pDeTopBox .txt .share a:nth-child(2){ background-color: #1da1f2;}
.pDeTopBox .txt .share a:nth-child(3){ background-color: #738a8d;}
.pDeTopBox .txt .share a:nth-child(4){ background-color: #848484;}
.pDeTopBox .txt .share a:nth-child(5){ background-color: #cb2027;}
.pDeTopBox .txt .share a:nth-child(6){ background-color: #ff6550;}
.pDeTopBox .txt .share a i {}

.pDeTopBox .btnCont { font-size: 1.1em; padding: 0 1.5em;  margin-right: 0.2em;
border: 2px solid #ddd; display: inline-block; cursor: pointer;
 line-height: 2.6;  background-color: #fff; color: #323232; font-weight: bold;
 transition: all 0.5s;
 -webkit-transition:all 0.5s;
 -moz-border-radius:1.6em; -webkit-border-radius:1.6em; border-radius:1.6em;}
 .pDeTopBox .btnCont:hover { background-color: #000; color: #fff;}
.pDeTopBox .btnInqu {  font-size: 1.1em;padding: 0 1.5em;  border: 2px solid #ddd; display: inline-block; cursor: pointer;
line-height: 2.6;   background-color: #6c757d; color: #fff;font-weight: bold;
transition: all 0.5s;
-webkit-transition:all 0.5s;
 -moz-border-radius:1.6em; -webkit-border-radius:1.6em; border-radius:1.6em;}
 .pDeTopBox .btnInqu:hover { background-color: #000;}
 

 @media only screen and (max-width: 828px){
 	.pDeTopBox {flex-wrap: wrap;}
 	.pDeTopBox .picb { width: 100%;}
	.pDeTopBox .txt { margin-top: 2em;}
	.pDeTopBox .txt .proName { min-height: initial;}
 }
 
 
 .videoDBox { position: absolute; z-index: 1;  left: 0; top: 0;
   width: 100%; height: 100%;
  background-color: #000; overflow: hidden;}
 .videoDBox video { position: absolute; z-index: 0; left: 0; top: 0;
 width:100%; height: 100%; object-fit: contain;}
 .videoDBox .btnPlay{ position: absolute; z-index: 2; 
 left: 50%; top: 50%; 
 margin: -1.5em auto auto -2em;
 width: 4em; height:3em; cursor: pointer;
 background:url(../images/play2.png) center center no-repeat;
 background-size:contain;}
 .videoDBox.curPlay .btnPlay {display: none; }
 
 .videoSBox { position: absolute; z-index: 1;  left: 0; top: 0;
   width: 100%; height: 100%;
  background-color: #000; overflow: hidden;}
 .videoSBox video { position: absolute; z-index: 0; left: 0; top: 0;
 width:100%; height: 100%; object-fit: contain;}
 .videoSBox .btnPlay{ position: absolute; z-index: 2; 
 left: 50%; top: 50%; 
 margin: -1em auto auto -1em;
 width: 2em; height:2em; cursor: pointer;
 background:url(../images/play2.png) center center no-repeat;
 background-size:contain;}
 .videoSBox.curPlay .btnPlay {display: none; }
 
.pDeBox { margin-top: 2em;}
.pDeBox .tab {}
.pDeBox .tabc {}
.pDeBox .tab ul { border-left: 1px solid #ddd;
display: flex; justify-content: flex-start; align-items: stretch;}
.pDeBox .tab li { cursor: pointer; padding: 0.9em 1.6em 0.8em; border-right: 1px solid #ddd; 
border-top: 3px solid #ddd; border-right: 1px solid #ddd;
color: #222; font-weight: bold; line-height: 1.5em; position: relative; z-index: 0;
display: flex; justify-content: center; align-items: center; text-align: center;}
.pDeBox .tab li.cur::before { content: ""; display: block;
position: absolute;
 height: 3px; width: 100%; left: 0; top: -2px; background-color: #007ebc;
}
.pDeBox .tab li.cur { color: #007ebc;}
.pDeBox .pConZ { border: 1px solid #ddd;}
.pDeBox .pCon { padding: 1.2em; display: none; line-height: 1.8;}

.paraTable{ border-collapse: collapse; width: 100%;}
.paraTable td{ padding: 0.2em 0.5em; border: 1px solid #000;}
 
/*产品列表*/
.proBox{ padding-bottom: 4.8em;}

.proBox .proTab { margin-top: 2em; border: 1px solid #ddd; padding:0 0.4em 0;}
.proBox .proTab ul { line-height: 1.5; margin: 0; display: flex; justify-content:
 space-around; align-items: stretch; flex-wrap: wrap;}
.proBox .proTab li { width: 25%; margin: 0.4em 0; padding: 0.8em 0 0.6em;}
.proBox .proTab li.cur { background-color: #f3f3f3; border-bottom:2px solid #0089d0; }
.proBox .proTab a { display: block; cursor: pointer;}

.proBox .proCla { margin-top: 2em; border: 1px solid #ddd; padding:1.4em 0.8em 1.2em;}
.proBox .proCla .claName { padding:0 0.7em; text-align: left; line-height: 2.4em;
 font-weight: bold;
 background-color: #f3f3f3; border-left:2px solid #0089d0; }
.proBox .list ul {margin: 2.6% 0; 
display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;}
.proBox .list li { width: 23%; margin: 1.29% 2.58% 1.29% 0; text-align: center;}
.proBox .list li:nth-child(4n) { margin-right: 0;}
.proBox .list li .lib { flex: 1; border: 1px solid #ddd; padding: 5.2%;}
.proBox .list .pic { display: block; cursor: pointer; border: 1px solid #ccc;
 padding-top:100%;
 position: relative; z-index: 0; border: 1px solid #eee; }
.proBox .list .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  object-fit: contain;}
.proBox .list .name { margin-top: 0.9em; font-size: 0.9em; height: 1.5em; line-height: 1.5em; font-weight: bold;
 overflow: hidden; text-overflow:ellipsis;
display:-webkit-box; text-align: left;
-webkit-box-orient:vertical;
-webkit-line-clamp:1; }
.proBox .btnW { margin-top: 0.9em; font-size: 0.85em;
display: flex; justify-content: space-between; align-items: stretch;}
.proBox .btnView { display: inline-block; cursor: pointer;
 line-height: 2.7; width: 49%; background-color: #007ebc; color: #fff;
 transition: all 0.5s;
 -webkit-transition:all 0.5s;}
 .proBox .btnView:hover { background-color: #000;}
.proBox .btnGray {  display: inline-block; cursor: pointer;
line-height: 2.7; width: 49%;  background-color: #6c757d; color: #fff;
transition: all 0.5s;
-webkit-transition:all 0.5s;}
 .proBox .btnGray:hover { background-color: #000;}
 
.proBox .listApp {margin: 2.6% 0; }
.proBox .listApp li { text-align: left;}
.proBox .listApp li .lib { flex: 1; border-bottom: 1px solid #ddd; padding:1.5em 0;
display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;
}
.proBox .listApp  .picb { width:21em;}
.proBox .listApp  .pic { display: block; cursor: pointer; border: 1px solid #ccc;
 padding-top:66.6%;
 position: relative; z-index: 0; border: 1px solid #ccc; }
.proBox .listApp  .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  object-fit: contain;}
  .proBox .listApp  .txtb { flex: 1; margin-left: 1.8em;}
.proBox .listApp  .name { 
	margin-top: 0.9em; font-size: 1.2em; height: 1.5em; line-height: 1.5em; font-weight: bold;
 overflow: hidden; text-overflow:ellipsis;
display:-webkit-box; text-align: left;
-webkit-box-orient:vertical;
-webkit-line-clamp:1; }
.proBox .listApp .about { font-style: italic; margin-top: 0.6em;}
.proBox .listApp .intro { margin-top: 0.6em; height: 7.5em;
 overflow: hidden; text-overflow:ellipsis;
display:-webkit-box; text-align: left;
-webkit-box-orient:vertical;
-webkit-line-clamp:5; 
}
 @media only screen and (max-width: 1100px) {
	 .main .mainR .proBox .list li { width: 47%; margin: 3% 1.5% 0;}
	 .main .mainR .proBox .list li:nth-child(2n) { margin-right: 0;}
 }
@media only screen and (max-width: 828px) {
.proBox .proTab li { width: 50%;}
.proBox .list li { width: 47%; margin: 3% 1.5% 0;}
.proBox .list li:nth-child(2n) { margin-right: 0;}
.proBox .listApp li .lib { border-bottom: 0; padding: 1em 0;}
.proBox .listApp  .picb { width:100%;}
.proBox .listApp .txtb { margin-left: 1.5em; margin-right: 1.5em;}
}


 .listHot ul {margin: 1em 0; padding-bottom: 0.7em; border: 1px solid #ddd;}
 .listHot li .lib { 
 padding: 0.7em 0.7em 0; text-align: left;
  display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;}
.listHot .picb { width: 5.6em;}
.listHot .txtb { flex:1; margin-left: 1em;}
 .listHot .pic { display: block; cursor: pointer; border: 1px solid #ddd;
  padding-top:100%;
  position: relative; z-index: 0;  }
 .listHot .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
   object-fit: contain;}
 .listHot .name { margin-top: 0.9em; font-size: 0.9em; 
 height: 4.5em; line-height: 1.5em; font-weight: bold;
  overflow: hidden; text-overflow:ellipsis;
 display:-webkit-box; text-align: left;
 -webkit-box-orient:vertical;
 -webkit-line-clamp:3; }
 
.swiper_hot .swiper-container { border: 1px solid #ddd; overflow: hidden; height: 28.4em;}
.swiper_hot .swiper-slide { height: 7.1em;}
.swiper_hot .lib { 
 padding: 0.7em 0.7em 0; text-align: left;
  display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;}
.swiper_hot .picb { width: 5.6em;}
.swiper_hot .txtb { flex:1; margin-left: 1em;}
.swiper_hot .pic { display: block; cursor: pointer; border: 1px solid #ddd;
  padding-top:100%;
  position: relative; z-index: 0;  }
.swiper_hot .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
   object-fit: contain;}
.swiper_hot .name { margin-top: 0.9em; font-size: 0.9em; 
 height: 4.5em; line-height: 1.5em; font-weight: bold;
  overflow: hidden; text-overflow:ellipsis;
 display:-webkit-box; text-align: left;
 -webkit-box-orient:vertical;
 -webkit-line-clamp:3; }
 .swiper_hot .btnNext, .swiper_hot .btnPrev { cursor: pointer;
  width:100%; height: 2.4em; 
 display: block; margin: 0 auto;
 background:#F4F4F4 url(../images/arrow_4.png) center center no-repeat ;
 background-size:auto 50%;}
 .swiper_hot .btnPrev { margin-top: 1em;
	 transform: rotate(-180deg);
	 -ms-transform: rotate(-180deg); /* IE 9 */
	 -webkit-transform: rotate(-180deg); /* Safari and Chrome */
 }
 
 /*产品展示*/
 .proDesList {}
 .proDesList ul { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;}
 .proDesList li { width: 28.1%; margin: 1.6% 1.3% 0;  text-align: center;}
 .proDesList .pic { display: block; cursor: pointer; 
 padding-top:58.9%; position: relative; z-index: 0; }
.proDesList .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  object-fit: contain;}
 @media only screen and (max-width: 828px) {
 .proDesList li { margin-top: 1em;}
 }

/*产品详情*/
.proDBox { margin-top: 1.5em;}
.proDBox .proTop { display: flex; justify-content: space-between; align-items: stretch;}
.proDBox .proTop .proTopL { width: 44.5%;}
.proDBox .proTop .proTopL .picD { border: 1px solid #ccc; padding-top: 75%; position: relative; z-index: 0;}
.proDBox .proTop .proTopL .picD img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: contain;}

.proDBox .proTop .proTopL .picS { display: flex; justify-content: space-between; align-items: stretch; margin-top: 0.6em;}
.proDBox .proTop .proTopL .picS ul { display: flex;}
.proDBox .proTop .proTopL .picS li { cursor: pointer; position: relative; z-index: 0; margin-top: 1.6%; margin-left: 1.6%; width: 19.6%; 
 border: 1px solid #fff; }
.proDBox .proTop .proTopL .picS li:hover { border: 1px solid #006699;}
.proDBox .proTop .proTopL .picS li.cur {border: 1px solid #006699;}
.proDBox .proTop .proTopL .picS .pic { cursor: pointer; position: relative; z-index: 0;padding-top: 70%;}
.proDBox .proTop .proTopL .picS img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: contain;}
.proDBox .proTop .proTopL .picS .swiper-slide .pic{ margin: 0 0.3em; border: 1px solid #fff;}
.proDBox .proTop .proTopL .picS .swiper-slide-active .pic  {border: 1px solid #006699;}

.proDBox .swiper-pic { flex: 1;}
.proDBox .button-prev { width: 1.5em; cursor: pointer; margin-right: 0.3em;
 background: #ededed url(../images/arrow_3_left.png) no-repeat center center / 60% auto;}
.proDBox .button-next { width: 1.5em; cursor: pointer;  margin-left: 0.3em;
background: #ededed url(../images/arrow_3_right.png) no-repeat center center / 60% auto;}


.proDBox .proTop .proTopR { width: 44.5%; text-align: left; color: #333; border: 1px solid #d5d5d5;
background-color: #f2f2f2; color: #666;}
.proDBox .proTop .proTopR .proC { padding:0 1.4em 1.4em;}
.proDBox .proTop .proTopR .name {  border-bottom: 1px solid #dbdbdb; 
line-height: 1.5em;  padding:0.7em 0 0.4em; color: #006699; font-weight: normal;}
.proDBox .proTop .proTopR .tits { margin-top: 1.8em; line-height: 1.3; font-weight: bold;}
.proDBox .proTop .proTopR .txt { margin-top: 1em; line-height: 2;}
.proDBox .proTop .proTopR .txt span { color: #000;}
.proDBox .proTop .proTopR .tel { margin-top: 4em; line-height: 1.4;
  background: url(../images/tel.png) no-repeat 0 0.4em / 2em auto; padding-left:2.6em;}
.proDBox .proTop .proTopR .tel .num { color: #006699;}
.proDBox .proTop .proTopR .btnw { text-align: left; margin-top: 1em;}

.btnBuy {display: inline-block; color: #fff; line-height: 2.5em; width: 10.6em;
background: #4b4b4b url(../images/fav.png)  no-repeat 1.2em center;text-align: center;
 margin-right: 0.8em; transition: all 0.3s; }
.btnBuy:hover { color: #fff; opacity: 0.8;}
.btnCons { display: inline-block; color: #fff; line-height: 2.5em; width: 10.6em;
background: #006699 url(../images/cons.png)  no-repeat 1.2em center;text-align: center; 
margin-right: 0.8em;  transition: all 0.3s; }
 .btnCons:hover { color: #fff; opacity: 0.8;}

.proDBox .proDBot { margin-top: 3.5em;}
.proDBox .proDBot .tab { border-bottom: 1px solid #ddd;}
.proDBox .proDBot .tab ul { display: flex; justify-content: flex-start; align-items: flex-start;}
.proDBox .proDBot .tab li { cursor: pointer; margin-right: 5px; 
    background: #eee; line-height: 2.5em; min-width: 9.4em;	}
.proDBox .proDBot .tab li.cur { position: relative; z-index: 0; background-color: #006699; color: #fff;}
.proDBox .proDBot .tab li.cur::before{ position: absolute;
    content: "";
    bottom: -12px;
    left: 50%; margin-left: -6px;
    border: 6px solid transparent;
    border-top-color: #006699;}
.proDBox .proDBot .pConZ { margin: 1em 0 2em;}
.proDBox .proDBot .pConZ .pCon { display: none; text-align: left; overflow: hidden; line-height: 1.7;
color: #666;}
.proDBox .proDBot .pConZ .pCon img { max-width: 100%; height: auto;}
.proDBox .proDBot .pConZ .pCon table { width: 100%;}
 @media only screen and (max-width: 828px) {
.proDBox .proTop { display: block;}
.proDBox .proTop .proTopL { width: auto;}
.proDBox .proTop .proTopR { margin-top: 1.5em; width: auto;}
.proDBox .proDBot .tab ul { justify-content: space-around;}
.proDBox .proDBot .tab li { flex: 1; padding: 0;min-width:initial}

.btnBuy {width: 7em; margin-right: 2%; text-indent: 2.2em; background-position: 0.6em center ;
 text-align: left;}
.btnCons { width: 7em; text-indent: 2.2em;  background-position: 0.6em center ;
text-align: left;}
}

.proDBox .proList ul { margin: 1em 0 0;}
.proDBox .proList li { width: 19.8%; }
@media only screen and (max-width: 828px) {
.proDBox .proList li {width: 44.8%; margin: 3% 1.5% 0;}
}



/*留言*/
.messBox { margin-top: 2em; text-align: center;}
.messBox dl { margin-top: 1.1em; display: flex; justify-content: flex-start; align-items: flex-start;}
.messBox dt { width: 22%; text-align: right; color: #000; line-height: 2.6;}
.messBox dd { margin-left: 1em; flex: 1;
 display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start;}
.messBox .iw { width: 64%;
}
.messBox .tip { flex: 1; margin-left: 4.3%;
margin-top: 0.7em; color: #737373; line-height: 1.8; 
text-align: left; font-size: 0.95em;}
.messBox .input,.messBox select { width: 100%; line-height: 2.6; height: 2.6em; font-size: 14px;
outline-width: 0; border: 1px dotted #cccccc;     padding: 0 1em;
-moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;}
.messBox .tw {width: 64%;}
.messBox .textarea {width: 100%; height: 210px;outline-width: 0;font-size: 14px;
 border: 1px dotted #cccccc; padding: 1em 1em 0.5em;
-moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;}


.messBox .btnW { margin-top: 1.5em; border-top:1px solid #eeeeee; padding-top: 3em; padding-bottom: 2em;}
.messBox .btnSubmit  {  font-size: 1.1em; width: 62%; margin: 0 auto;
border: 2px solid #ddd; display: inline-block; cursor: pointer;
 line-height: 2.6;   background-color: #007ebc; color: #fff;font-weight: bold;
 transition: all 0.5s;
 -webkit-transition:all 0.5s;
  -moz-border-radius:1.6em; -webkit-border-radius:1.6em; border-radius:1.6em;}
.messBox .btnSubmit:hover { background-color: #000;}
.messBox .tip2 { font-size: 0.9em; width: 62%; padding: 9px;
    margin: 0 auto; text-align: left; line-height: 1.8; 
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);}

 @media only screen and (max-width: 828px) {
.messBox dl { display: block;}
.messBox dt { width: auto; text-align: left; }
.messBox dd{ margin-left: 0;}
.messBox .iw,.messBox .tw { width: 100%;}
.messBox .tip { margin-left: 0;}
.messBox .btnSubmit { width: auto; display: block;}
.messBox .tip2 { width: auto;}
 }


.position { font-size: 14px; line-height: 2; padding: 0.7em 0 0.6em; color: #222; text-align: left;
    background: #f1f1f1;
    border-bottom: 1px solid #d3d3d3;}
.position a {color: #222; font-size: 16px;}
.position i { padding: 0 10px;}

.posiBox { background-color: #e6e6e6; padding: 1.1em 0; text-align: right; color: #666;}
.posiBox .position { margin: 0;}
.posiBox .position a { color: #666;}
.curName { padding: 0.2em 0 0.3em; text-indent: 1em; font-weight: normal;
    color: #000; border-bottom: 1px solid #ccc;
    text-transform: uppercase;
	background: url(../images/page_right_tit_img1.png) no-repeat 0 center ;}
	
@media only screen and (max-width: 828px) {
.position { margin-top: 2em;}
}

.page { padding: 3.5em 0 0; text-align: center;color: #666; line-height: 2.4;
 font-size: 0.9em; display: flex; justify-content: center; align-items: center;}
.page a,.page span { display: inline-block; border: 1px solid #ccc;
  color: #333;  padding: 2px 1.1em 0; margin: 0 0.15em;
 -moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;}
.page a:hover {border-color:#007ebc; color: #007ebc; }
.page .dot { border: 0; display: inline-block;padding: 0 0.55em;}
.page .cur,.page .cur:hover {display: inline-block;
background-color:#007ebc;  color: #fff;
}
.page .pageGo { margin-left: 5%; color: #999;}
.page .pageGo .input { margin: 0 0.2em; border: 1px solid #ccc; text-align: center;
outline-width: 0; width: 4em; line-height: 2.35;
 -moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;
}
@media only screen and (max-width: 828px) {
.page { display: block;}
.page .pageGo { margin-top: 2em; margin-left: auto;}
}
 
 .page .pageGo .btnGo { margin: 0 0.2em; border: 1px solid #ccc; text-align: center;
 outline-width: 0; width: 4.5em; line-height: 2.4; color: #666; background-color: #fff;
  -moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;
  transition: all 0.5s;
  -webkit-transition:all 0.5s;}
.page .pageGo .btnGo:hover { background-color: #007ebc; color: #fff;}

/*底部*/
.flinkBox { padding-top: 7%; text-align: left;}
.flinkBox .tit {}
.flinkBox .flinkCon a { margin-right: 0.8em;}

.footer { margin-top: 1em; line-height: 1.8;
}
.footer .footer1 { padding: 2em 0 1em;
	background: #e3e3e3 url(../images/footer-bg_02.jpg) no-repeat center center / cover;
}
.footer .con {}
.footer .fLogo { text-align: left;}
.footer .fAbout { margin-top: 1.5em; display: flex; justify-content: space-between; align-items: flex-start;}
.footer .fAbout .fNav { flex:1; display: flex; justify-content:center; align-items: flex-start;
text-align: left;}
.footer .fAbout .fNav dl { margin: 0 7%;}
.footer .fAbout .fNav dt { color: #000; font-weight: 600;}
.footer .fAbout .fTel { margin-right: 6%; text-align: left;}
.footer .fAbout .fTel  .num { font-weight: 900; color: #000;}
.footer .fAbout .fTel .btn { margin-top: 0.9em; line-height: 2.3; padding:0 1.2em;}
.footer .fAbout .fAboutL {flex:1; display: flex; justify-content:flex-end; align-items: flex-start;}
.footer .fAbout .fQRCode {  text-align: center;}
.footer .fAbout .fQRCode img { display: block; width: 130px; margin: 0 auto; height: auto;}
.footer .fAbout .fQRCode .txt { margin-top: 1em; color: #4b4c4d; line-height: 1.3;}

.footer .footer2 { background-color: #f5f5f5; padding: 1.1em 0;}
.footer .footer2 .con {display: flex; justify-content: space-between;
 align-items: flex-start;}
.footer .footer2 .add { text-align: left;} 
.footer .footer2 .add span { display: inline-block; margin-right: 1em;}
.footer .footer2 .copyright { text-align: right; }
.footer .footer2 .copyright span { display: inline-block; margin-right: 1em;}
@media only screen and (max-width: 828px) { 
	.footer .footer1 { padding: 3em 0;}
	.footer .fAbout { display: block;}
	.footer .footer2 .con { display: block;}
	.footer .fAbout .fAboutL { display: block;}
	.footer .fLogo { text-align: center;}
	.footer .fAbout .fTel { margin-top: 2em; text-align: center; margin-right: 0;}
	.footer .fAbout .fTel .btn { margin-top: 0;}
	.footer .fAbout .fQRCode { margin-top: 2em;}
	.footer .footer2 .add { text-align: center; line-height: 1.4;} 
	.footer .footer2 .copyright { margin-top: 0.8em; text-align: center; line-height: 1.4; }
}

.bottom { display: none;}
@media only screen and (max-width: 828px) {
	.bottom { font-size: 0.8em; display: block; position: fixed; z-index: 4000; 
	left: 0; bottom: 0;
	width: 100%; background-color: #fff; line-height: 1.4em; 
	-moz-box-shadow: 0 -0.8em 0.8em rgba(0, 0, 0, .06);
	-webkit-box-shadow: 0 -0.8em 0.8em rgba(0, 0, 0, .06);
	box-shadow: 0 -0.8em 0.8em rgba(0, 0, 0, .06);}
	.bottom ul { display: flex; justify-content: space-around; align-items: stretch;}
	.bottom ul li {flex: 1; border-right:1px solid #fff; }
	.bottom ul li:last-child { border-right: 0;}
	.bottom a {height: 3.4em;  
	display: flex; justify-content: center; align-items: center; width: 100%; 
	 cursor: pointer;background-color: #12579d; color: #fff;}
	.bottom .cur a { background-color: #fff; color:#12579d ;}
}

/*新底部 start*/
.site-info {
    float: right;
}

.copyright {
    float: left;
}
.footer-container {
    background-color: #312b27;
    overflow: hidden;
}
.footer-nav { padding: 1em 0; background-color: #181410; color: #fff; line-height: 2.2em;}
.footer-nav ul {display: flex; justify-content: space-between; align-items: center;}
.footer-nav ul li { border-right:1px solid rgba(255,255,255,0.5) ; flex: 1; display: inline-block;}
.footer-nav ul li:last-child { border-right: 0;}
.footer-nav ul li a { color: #fff;}
.footer-nav ul li a:hover { color: #aaa;}

#footer-widgets {
    overflow: hidden;
    padding: 30px 0;
    color: #fff;
    font-size: 16px;
    position: relative;
    z-index: 9;
    background-attachment: fixed; text-align: left;
}
#footer-widgets .container { display: flex; justify-content: space-between; align-items: flex-start;}
#footer-widgets .container::before { display: none;}
#footer-widgets .container::after { display: none;}
#footer-widgets .add { width: 28%; margin-right: 4%;}
#footer-widgets .email { width: 28%; margin-right:1.5%;
display: flex; justify-content: flex-start; align-items: flex-start;}
#footer-widgets .tel { width: 28%; margin-right: 1.5%;
display: flex; justify-content: flex-start; align-items: flex-start;}
#footer-widgets .book { width: 5%;
 display: flex; justify-content: flex-start; align-items: flex-start;}
#footer-widgets .pics { margin-top: 0.3em; font-weight: lighter; padding-right: 0.6em; border-right:1px solid rgba(255,255,255,0.4);
 font-size: 1.4em; margin-right: 0.6em; color: rgba(255,255,255,0.6);}
 #footer-widgets dd { margin-top: 0.3em;}
#footer-widgets ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#footer-widgets ul li {
    font-size: 15px;
    padding: 0px 15px 5px 20px;
    position: relative; margin-bottom: 12px;
}

#footer-widgets ul li::before {
    color: #ccc;
    content: "\f105";
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 13px;
    left: 3px;
    position: absolute;
    top: 2px;
    font-weight: 900;
}

#footer-widgets .footer-widget-area {
    padding: 0 25px;
    color: #ccc;
}

#footer-widgets a,
#footer-widgets a:visited {
    color: #ccc;
}

#footer-widgets a:hover,
#footer-widgets a:active,
#footer-widgets a:focus {
    color: #ffffff;
}

#footer-widgets .widget-title {
    color: #fff;
    font-weight: 500;
    margin-bottom: 40px;
    position: relative;
    font-size: 22px;
}

.recent-posts-widget p {
    margin-bottom: 10px;
    font-style: italic;
    font-size: 14px;
    color: #ccc;
}

#footer-widgets .social-links ul li:before {
    display: none;
}
#footer-widgets .social-links ul li {
    display: inline-block;
    margin-right: 5px;
    margin-top: 0;
    padding: 0;
}

#footer-widgets .social-links {
    float: left;
    margin-top: 20px;
}

.widget-quick-contact span {
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    line-height: 2;
    display: table;
    clear: both;
}

.widget-quick-contact span i {
    font-size: 18px;
    padding-right: 10px;
    display: table-cell;
}
.recent-post-item {
    clear: both; display: flex; justify-content: flex-start; align-items: flex-start;
    margin-bottom: 15px;
    overflow: hidden;
}
.recent-posts-widget h4 {
    margin: 0; flex: 1;
    font-weight: 500;
    color: #fff;
    line-height: 1.5;
    font-size: 16px;
}

.recent-posts-widget img {
    max-width: 80px;
    margin-right: 25px;display: inline;
    float: left;
}
.copyright { color: #fff; float: left;}
.copyright>p {
    margin-bottom: 0;
    color: #ddd;
}


#colophon {
    clear: both;
    font-size: 14px;
    text-align: center;
    padding: 15px 0;
    margin: 0;
}
#colophon .container { display: flex; justify-content: space-between; align-items: center;}
#colophon .container::after {display: none;}
#colophon .container::before { display: none;}
#colophon .pics ul { color: #999; line-height: 2em;
display: flex; justify-content: center; align-items: flex-start;}
#colophon .pics ul li { margin: 0 0.5em;}
#colophon .pics ul img { display: block; width: 6em; margin-bottom: 0.1em; height: auto;}
/*新底部 end*/

@media only screen and (max-width: 828px) {
	.footer-nav { display: none;}
	#footer-widgets .container { display: block;}
	#footer-widgets .add { width: auto; margin-right: auto;}
	#footer-widgets .email { margin-top: 1.5em; width: auto; margin-right: auto;}
	#footer-widgets .tel{ margin-top: 1.5em; width: auto; margin-right: auto;}
	#footer-widgets .book { margin-top: 1.5em; width: auto; margin-right: auto;}
	#colophon { padding-top: 0;}
	#colophon .container {display: block;}
	#colophon .container::after { display: block; content: ""; clear: both;}
	.copyright { float: none; text-align: left;}
	#colophon .container .pics { float: left; margin-top: 1.5em;}
}


/*latest news*/
.section-headline {
    margin-bottom: 60px;
    position: relative;
}
.section-headline h3 {
    display: inline-block;
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
	margin: 0 0 15px;
}
.section-headline p {
    max-width: 650px;
    font-size: 16px;
    letter-spacing: .5px;
    margin: 0 auto;
    line-height: 26px;
}
.section-headline::after {
   
	border: 1px solid #0089d0;
	    bottom: -27px;
	    content: "";
	    left: 0;
	    margin: 0 auto;
	    position: absolute;
	    width: 60px;
	    right: 0;
		-webkit-box-sizing: border-box;
		    -moz-box-sizing: border-box;
		    box-sizing: border-box;
		max-width: 650px;
		width: 100%;
}
@media only screen and (max-width: 828px) {
	.section-headline { margin-bottom: 30px;}
}
.blog-content a h4 {
    font-size: 20px;
    text-transform: capitalize;
    font-weight: 400;
    color: #444;
    line-height: 26px;
    margin-top: -20px;
	margin-bottom: 15px;
	height: 52px;
	    overflow: hidden;
}
.blog-content p {
    height: 72px;
    overflow: hidden;
	    font-size: 15px;
	    letter-spacing: .5px;
		margin-bottom: 15px;
}
.blog-btn {
    display: inline-block;
    font-weight: 700;
    color: #444;
    position: relative;
    text-transform: capitalize;
    font-size: 12px;
    padding: 5px 10px;
    border: 1px solid #0089d0;
}


.single-blog {
    margin-top: 30px;
    position: relative;
    overflow: hidden; text-align: left;
}
.blog-image {
    overflow: hidden;
    display: block;
	padding-bottom: 100%;
	    position: relative;
}
.image-scale {
    position: relative;
    transform: scale(1.1);
    display: block;
    transition: .5s;
	position: absolute;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    overflow: hidden;
}

.image-scale img {
	max-width: 100%;
	max-height: 100%;
	vertical-align: middle;
    min-height: 100%;
    max-width: unset;
}
.blog-meta {
    position: relative;
    top: -40px;
    background: #0089d0;
    width: 64px;
    padding: 7px 10px;
    left: 15px;
    text-align: center;
}
.blog-meta span {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
}

.overview-area {
    background: rgba(0,0,0,0);
}
.overview-area .company-content .view-images img {
	width: 1.2em; height: 1.2em;
}
.parallax-bg {
    position: relative;
}
.single-client {
    float: left;
    width: 33.3%;
    padding: 10px;
}
.single-client>a { cursor: pointer; display: block; width: 100%; padding-top: 59.4%;
position: relative; z-index: 0;}
.single-client>a img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: contain;}
.overview-area.parallax-bg:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .8;
    content: "";
}

.client-details {
    padding: 12% 16%;
    text-align: center;
    display: block;
    overflow: hidden;
}
.client-head {
    text-align: left;
    margin-left: 10px;
    padding-left: 20px;
    position: relative;
	min-height: 80px;
	
}
.client-head::before {
    position: absolute;
    content: "";
    width: 5px;
    height: 80px;
    background: #0089d0;
    left: 0;
    top: 0;
}
.client-head h3 {
	font-size: 30px;
	    line-height: 32px;
    color: #fff;
    text-transform: capitalize;
    margin-bottom: 5px;
}
.client-head p {
    color: #fff;
	margin: 0 0 15px;
}
.company-content {
    padding: 12% 16%; text-align: left;
}
.company-content .main-view:first-child { padding-top:3.8em;}
@media screen and (min-width: 1920px){
 .company-content  {
    padding: 16% 30% 16% 10%;
 }
}
@media screen and (max-width: 828px){
.company-content .main-view:first-child  { padding-top: 0;}
}
.single-view {
	
}
.view-content h4 {
    text-transform: capitalize;
    font-size: 20px;
    margin-bottom: 10px;
    font-weight: 600;
	line-height: 26px; color: #fff;
}
.view-images {
    float: left;
    font-size: 50px;
    line-height: 50px;
    text-align: center;
    color: #fff;
}
.main-view {
    padding-bottom: 15px;
}
.view-content {
    padding-left: 80px;
}
.view-content p {
	margin: 0 0 15px;
	color: #ccc;
}

/* 1 start*/
.area-padding {
    padding: 90px 0;
}

.home-product {padding: 0 0 90px;}
@media only screen and (max-width: 828px) {
	.area-padding {
	    padding:45px 0;
	}
	.home-product {padding: 45px 0;}
	
}
.well-inner {
    margin-top: -30px;
}
.well-services {
    padding: 30px 20px;
    box-shadow: 0 5px 25px rgb(0 0 0 / 10%);
    position: relative; text-align: left;
}
.well-inner .well-services { position: relative; z-index: 0;
    margin-top: 30px; transition: all 0.5s;
}
.well-inner .well-services::after { display: block; content: "";
 position: absolute; left: 0; bottom: 0;  width: 0; transition: all 0.5s;
 height: 2px;background-color: #0089d0;}
 
.well-inner .well-services:hover::after { width: 100%;}
.well-inner .well-services:hover {background-color: #0089d0;}
.well-inner .well-services:hover .well-content h4 a { color: #fff;}
.well-inner .well-services:hover .well-content p {color: #fff;}
.welcome-area-2 .well-services {
    position: relative;
    transition: .4s;
}
.well-icon {
    margin-bottom: 20px;
    display: block;
}
.well-content h4 {
    font-size: 18px;
    
    line-height: 30px;
    text-transform: capitalize;
    height: 60px;
    overflow: hidden;
}
.well-content h4 a { color: #444;}
.well-content p {
    margin: 0;
    height: 75px;
    overflow: hidden;
}
.home-product .nav-tabs { display: flex; flex-wrap: wrap;
    border-bottom: none; height: auto;
    justify-content: center;
    margin-bottom: 10px; border-top:0 ;
}
.nav-tabs>li { cursor: pointer;
    margin:0 1px -1px;
	    
	    font-size: 14px;
	    padding: 0 10px;
	    text-transform: uppercase;
	    transition: all .3s ease 0s;
	    font-weight: 700;
	    letter-spacing: .5px;
	    border-radius: 2px; height: 32px; line-height: 32px;
}
.nav-tabs>li:hover,.nav-tabs>li.cur {
	    background-color: #0089d0!important;
	    border-color: #0089d0;
		color: #fff;
}
.single-awesome-project {
    float: left;
    overflow: hidden;
    width: 100%;
}
.home-product .single-awesome-project {
    margin-top: 30px;
    border: 1px solid #ccc;
    position: relative;
}
.project-dec {
    display: block;
    padding: 20px 10px;
    position: absolute;
    top: 10px;
    transition: .5s;
    opacity: 0; text-align: left;
}
.project-dec h4 {
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    text-decoration: none;
    text-transform: capitalize;
    margin-bottom: 5px;
    cursor: pointer;
}
.project-dec h4 a {
    color: #fff;
}
.awesome-img {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
	text-align: center;
}
.awesome-img>a {
	max-width: 100%;
	    max-height: 100%;
	    vertical-align: middle;
    display: block;
    position: relative;
}
.awesome-img>a::after {
    background: rgba(45,139,1,.9);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    opacity: 0;
    transition: .4s;
}
.awesome-img img {
    transform: scale(1);
    transition: .4s;
    height: 266px; object-fit: contain;
}
.add-actions {
    display: block;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    transition: all .4s ease 0s;
    width: 100%;
    z-index: 9999;
    top: 0;
    cursor: pointer;
}
.add-actions>a { display: block; width: 100%; height: 100%;}
.port-icon {
    color: #f4f4f4;
    display: inline-block;
    cursor: pointer;
    top: 80%;
    position: relative;
    font-size: 40px;
    margin-top: -25px;
    float: right;
    right: 20px;
}
.single-awesome-project:hover .awesome-img>a::after {
    opacity: 1;
}
.single-awesome-project:hover .add-actions {
    opacity: 1;
}
.single-awesome-project:hover .project-dec {
    transition: .5s;
    opacity: 1;
}

/*1 end*/

/*新闻*/
.newBox {  padding-bottom: 4.8em;}
.newBox .tit { border-bottom: 1px solid #ddd; line-height: 3em;
 text-align: left; font-size: 1.2em; font-weight: bold;}
.newBox .list ul {border-bottom: 1px solid #ddd;}
.newBox .list li { 
    border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd; margin-bottom: 1px;
    padding: 1.25em;}
.newBox .list li::after { display: block; content: ""; clear: both;}
.newBox .list li:nth-child(2n+1) {background: #f9f9f9;}
.newBox .list li:first-child { border-top:0 ; margin-top: 0;}
.newBox .list .picb { width: 200px; float: left; margin-right: 1.25em; margin-bottom: 0.6em;}
.newBox .list .picb .pic {display: block; cursor: pointer; position: relative; z-index: 0;
 width: 100%; padding-top: 75%; overflow: hidden;
 -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;
     box-shadow: 4px 6px 8px #888;
	 -moz-box-shadow: 4px 6px 8px #888;
	 -webkit-box-shadow: 4px 6px 8px #888;
	 box-shadow: 4px 6px 8px #888;}
.newBox .list .picb .pic img { position: absolute; left: 0; top:0; 
width:100%; height: 100%; overflow: hidden;
display: flex; justify-content: center; align-items: center; object-fit: cover;}
.newBox .list .txtb { text-align: left;}
.newBox .list .txtb .name { font-size: 16px; color: #323232; font-weight: bold;}
.newBox .list .txtb .name a {color: #323232;}
.newBox .list .txtb .name a:hover {color: #007ebc;}
.newBox .list .txtb .date { margin-top: 0.5em; font-style: italic; }
.newBox .list .txtb .intro {margin-top: 0.5em;color: #666;
 line-height: 1.5em;  
 -webkit-line-clamp:4;
}
.newBox .list .txtb .btnMore { float: right; color: #8f9395; margin-top: 0.7em;}
.newBox .list .txtb .btn { margin-top: 1.4em; display: inline-block; color: #fff; background-color: #007ebc;
font-size: 0.9em; padding: 0.6em 0 0.5em; text-align: center; width: 21.5em;
-moz-border-radius:0; -webkit-border-radius:0; border-radius:0;
transition: all 0.5s;
-webkit-transition:all 0.5s;
}
.newBox .list .txtb .btn:hover { background-color: #000;}

@media only screen and (max-width:1100px) {

}
@media only screen and (max-width: 440px) {
	.newBox .list .picb { width: 150px;}
	/* .newBox .list .picb { width: 100%;}
	.newBox .list .txtb { width: 100%; margin-left: 0; margin-right: 0;} */
}

/*新闻详情*/
.newDBox { margin-top: 5.5em; margin-bottom: 3.6em; }
    
.newDBox .container { padding: 0 50px 3.6em; border: 1px solid #ddd;text-align: left;}
.newDBox .title {  line-height: 1.7;display: block; width: 100%; text-align: left; 
font-size: 30px;  padding:20px 0 6px;
    color: #121212; font-weight: bold;}
.newDBox .about {text-align: left; font-size: 14px; padding-bottom: 22px;
 border-bottom: 1px solid #eee;}
.newDBox .content { line-height: 1.8; font-size: 14px;  margin-top: 36px; overflow: hidden;}
.newDBox .content img { max-width:100%; height: auto;}
.newDBox .nBot {  font-size: 16px; border-top: 1px solid #eee; 
margin:3.6em -20px 0;
 padding: 20px 20px 0;}


/*关于我们*/
.aboutBox { padding: 2em 0;}
.aboutBox .container {display: flex; justify-content: space-between; align-items: center;}
.aboutBox .picb { width: 40%;}
.aboutBox .picb .pic { position: relative; z-index: 0; width: 100%; padding-top: 82%;}
.aboutBox .picb .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}
.aboutBox .txtb{ flex: 1; margin-left: 2.5%; text-align: left;}
.aboutBox .txtb .name { line-height: 1.3; font-size: 2.2em; font-weight: bold; color: #007ebc;}
.aboutBox .txtb .intro { margin-top: 1em; font-size: 1.1; color: #777; line-height: 1.8;}
@media only screen and (max-width: 828px) {
	.aboutBox .container { display: block;}
	.aboutBox .picb{ width: 100%;}
	.aboutBox .txtb{ margin-left: 0; width: 100%; margin-top: 2em;}
}

.aboutLBox { padding: 4em 0 2em;}
.aboutLBox .list ul { margin-top: -2.5%; display: flex; flex-wrap:wrap ; justify-content: flex-start;
 align-items: stretch;}
.aboutLBox .list li { margin-top: 2.5%; width: 31.6%; margin-right: 2.5%; 
display: flex; flex-direction: column; justify-content: center; align-items: stretch;}
.aboutLBox .list li .lib { position: relative; z-index: 0; flex: 1; border: 1px solid #eaeaea;
padding: 2em 1.5em; text-align: left;}
.aboutLBox .list li .lib::before { content: ""; display: block; position: absolute; top: -2px;
height: 3px; width: 50%; left: 25%;background-color: #0089d0;}
.aboutLBox .list li:nth-child(3n) { margin-right: 0;}
.aboutLBox .list li .name {color: #222; font-weight: bold; font-size: 1.3em;}
.aboutLBox .list li .intro { margin-top: 0.8em; color: #777; line-height: 1.5;}
@media only screen and (max-width: 828px) {
	.aboutLBox .list ul { display: block;}
	.aboutLBox .list li { width: 100%; margin-right: 0;}
}


/*联系我们*/
.contBox { padding: 3em 0 5em;}
.contBox .container { text-align: left; display: flex; justify-content: space-between; align-items: flex-start;}
.contBox .container::before {display: none;}
.contBox .container::after { display: none;}
.contBox .contForm { width: 58%; display: flex;
 flex-wrap: wrap; justify-content: flex-start; align-items: flex-start;}
.contBox .contForm form { flex: 1;display: flex;
 flex-wrap: wrap; justify-content: space-between; align-items: flex-start;}
.contBox .contForm  dl { margin-top: 1.2em; width: 31.4%;}
.contBox .contForm  dl.dl_2 { width: 100%;}
.contBox .contForm  dl dd { margin-top: 0.6em;}
.contBox .contForm .red { color: #ff0000}
.contBox .contForm .iw {border: 1px solid #ccc; padding: 0 0.6em;}
.contBox .contForm .tw {border: 1px solid #ccc; padding: 0.6em 0.6em;}
.contBox .contForm .input { width: 100%; 
border: 0; line-height: 2.6em; height: 2.6em;
outline-width: 0;}
.contBox .contForm .textarea { display: block; width: 100%; 
border: 0; line-height: 1.3em; height: 15.6em;
outline-width: 0;}
.contBox .contForm .btnW { margin-top: 2em;}
.contBox .contForm .btn { display: inline-block; background-color: #0089d0; color: #fff;}
.contBox .info { width: 38%;}
.contBox .info dl { margin-top: 1em; display: flex;
 justify-content: flex-start; align-items: flex-start;}
.contBox .info dt i { width: 1.8em; height: 1.8em; line-height: 1.8em; text-align: center; 
color: #fff; background-color: #0089d0;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
}
.contBox .info dt img { width: 1.8em; height: 1.8em; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
}
.contBox .info dd { margin-top: 0.2em; flex: 1; margin-left: 0.7em;}

.suppBox {}
.suppBox .tit { border-bottom: 1px solid #ddd; line-height: 3em; text-align: left; font-size: 1.2em; font-weight: bold;}
.suppBox .list { margin-top: 1.1em;}
.suppBox .list li:nth-child(2n+1) { background-color: #eee;}
.suppBox .list li.tits { margin-bottom: 1.1em; display: flex; justify-content: space-between; align-items: center;
 color: #fff; background-color: #0089d0; }
.suppBox .list li { display: flex; justify-content: space-between; align-items: center;
}

.suppBox .list .name { flex: 1;padding: 1em 1.5em;}
.suppBox .list .btnW {padding: 1em 0; text-align: center; width: 5em;
 border-left:1px solid rgba(255,255,255,0.5);}
.suppBox .list .btnW i{ font-size: 1.4em; color: #999;}
.suppBox .list .btnW a:hover i { color:#0089d0 ;}

@media only screen and (max-width: 828px) {
	.contBox .container { display: block;}
	.contBox .contForm { width: 100%;}
	.contBox .info { margin-top: 3em; width: 100%;}
	.contBox .contForm  dl{width: 100%;}
}

@media only screen and (max-width: 420px) {
	html,
	body {
		font-size: 14px;
	}
}
@media only screen and (max-width: 375px) {
	html,
	body {
		font-size: 12px;
	}
}

.list_ab .tit { border-bottom: 1px solid #ddd; line-height: 3em; text-align: left; font-size: 1.2em; font-weight: bold;}
.list_ab ul { margin-top: 1.1em; display: flex; flex-wrap: wrap; text-align: center; justify-content: flex-start; align-items: flex-start;}
.list_ab li { width: 31%; margin-right: 3.45%; margin-bottom: 1.2em; }
.list_ab li:nth-child(3n) {margin-right: 0; }
.list_ab .pic  { padding-top: 66%; position: relative; z-index: 0; overflow: hidden; }
.list_ab .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
 object-fit: cover;}
.list_ab .name { margin-top: 0.8em; }

@media only screen and (max-width: 828px) {
	.list_ab li {width: 48%; margin-right:4%;}
	.list_ab li:nth-child(3n) {margin-right: 4%; }
	.list_ab li:nth-child(2n) {margin-right: 0; }
}


.list_ce .tit { border-bottom: 1px solid #ddd; line-height: 3em; text-align: left; font-size: 1.2em; font-weight: bold;}
.list_ce ul { margin-top: 1.1em; display: flex; flex-wrap: wrap; text-align: center; justify-content: flex-start; align-items: flex-start;}
.list_ce li { width: 31%; margin-right: 3.45%; margin-bottom: 3.45%; }
.list_ce li:nth-child(3n) {margin-right: 0; }
.list_ce .pic  { padding-top: 139%; position: relative; z-index: 0; overflow: hidden; }
.list_ce .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
}
.list_ce .name { margin-top: 0.8em; }

@media only screen and (max-width: 828px) {
	.list_ce li {width: 48%; margin-right:4%;}
	.list_ce li:nth-child(3n) {margin-right: 4%; }
	.list_ce li:nth-child(2n) {margin-right: 0; }
}



.list_ot .tit { border-bottom: 1px solid #ddd; line-height: 3em; text-align: left; font-size: 1.2em; font-weight: bold;}
.list_ot ul {  display: flex; flex-wrap: wrap; text-align: center; justify-content: flex-start; align-items: flex-start;}
.list_ot li { width: 23.1%; margin-right: 2.53%; margin-top: 2.53%; }
.list_ot li:nth-child(4n) {margin-right: 0; }
.list_ot .pic  { border: 1px solid #ddd; 
padding-top: 50%; position: relative; z-index: 0; overflow: hidden; }
.list_ot .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
 object-fit: contain;}

@media only screen and (max-width: 828px) {
	.list_ot li {width: 48%; margin-right:4%;}
	.list_ot li:nth-child(2n) {margin-right: 0; }
}

/*视频列表*/
.videoList ul { margin-top: 1.1em; display: flex; flex-wrap: wrap; text-align: center; justify-content: flex-start; align-items: flex-start;}
.videoList li { width: 31%; margin-right: 3.45%; margin-bottom: 1.2em; }
.videoList li:nth-child(3n) {margin-right: 0; }
.videoList .pic  { display: block; cursor: pointer;
 padding-top: 65.1%; position: relative; z-index: 0; overflow: hidden; 
 background-color: #000;}
.videoList .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
 object-fit: cover; filter:alpha(opacity=70);-moz-opacity:0.7; opacity:0.7;}
.videoList .name { margin-top: 0.3em; }
.videoList .pic .btnPlay{ position: absolute; z-index: 2; 
left: 50%; top: 50%; margin-top: -5.8%; margin-left: -5.8%; 
width: 11.7%; padding-top: 11.7%; height: 0; cursor: pointer;
background: url(../images/btn_play_2.png) center center no-repeat;
background-size:contain;
}

.videoList .item { position: relative; z-index: 0; padding: 0; margin: 0;}
.videoList .item .txts { position: absolute; left: -0.2em; top: 1.2em; 
font-size: 15px; color: #004f81; 
transform: rotate(90deg);
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Safari and Chrome */}
.videoList .item .picb { position: relative; z-index: 0; padding-top: 65.1%;
overflow: hidden;}
.videoList .item .videoBox { position: absolute; z-index: 0; left: 0; top: 0;
  width: 100%; height: 100%;
 background-color: #000;}
.videoList .item .videoBox video { position: absolute; z-index: 0; left: 0; top: 0;
width:100%; height: 100%; object-fit: contain;}
.videoList .item .videoBox .videoPic { position: absolute; z-index: 1; left: 0; top: 0;
width: 100%; height: 100%;}
.videoList .item .videoBox .btnPlay{ position: absolute; z-index: 2; 
left: 50%; top: 50%; margin-top: -5.8%; margin-left: -5.8%; 
width: 11.7%; padding-top: 11.7%; height: 0; cursor: pointer;
background: url(../images/btn_play_2.png) center center no-repeat;
background-size:contain;
}
.videoList .item .videoBox.curPlay .videoPic { display: none; }
.videoList .item .videoBox.curPlay .btnPlay {display: none; }

.videoList .item .videoBox.pausePlay .videoPic { display: none; }
.videoList .item .videoBox.pausePlay .btnPlay {display: block; }

.videoList .item .txt { position: relative; z-index: 1;
 background-color: #fff; text-align:center; margin: 0.2em 4.3% 0; 
 -moz-border-top-left-radius:0.5em; 
 -webkit-border-top-left-radius:0.5em; 
 border-top-left-radius:0.5em;
 
 -moz-border-bottom-right-radius:0.5em;
 -webkit-border-bottom-right-radius:0.5em; 
 border-bottom-right-radius:0.5em;
 
 -moz-border-top-right-radius:1.5em;
 -webkit-border-top-right-radius:1.5em; 
 border-top-right-radius:1.5em;
 
 -moz-border-bottom-left-radius:1.5em;
 -webkit-border-bottom-left-radius:1.5em; 
 border-bottom-left-radius:1.5em;
 }
.videoList .item .txt .name { height: 2em;color: #434D4E;
line-height: 2em; overflow: hidden; 
text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;}
.videoList .item .txt .name a{ transition: all 0.2s;color: #434D4E;#1A6F7D
-webkit-transition:all 0.2s;}
.videoList .item .txt .name a:hover { color: #1A6F7D; }
.videoList .item .btnw { text-align: right;}
.videoList .item .more { border-bottom: 1px solid #939393; line-height: 1.1;
display: inline-block; font-size: 14px; margin-top: 1.5em; color: #7a7a7a;}
.videoList .item .more span{ display: inline-block; font-size: 1.2em;}
.videoList .item .more:hover { color: #ee1b1a;}

@media only screen and (max-width: 828px) {
	.videoList li {width: 48%; margin-right:4%;}
	.videoList li:nth-child(3n) {margin-right: 4%; }
	.videoList li:nth-child(2n) {margin-right: 0; }
}

/*弹出*/

.inquPopup {  position: fixed; z-index: 6000; left: 0; top: 0; width: 100%; height: 100%;
 display: flex;display: none; justify-content: center; align-items: center; 
 background-color: rgba(0,0,0,0.3);
}
.inquCon { position: relative; z-index: 0; max-width: 700px; width: 90%; margin: 0 auto; background-color: #fff;}
.inquCon .close { cursor: pointer; position: absolute; top: 1em; right: 1em;
 background:#999 url(../images/close.png) center center no-repeat; 
 background-size:0.8em auto ;
 width: 1.2em; height: 1.2em;
 filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;}
 .inquCon .close:hover { background-color:#666; filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;}
.inquCon .mCon { padding: 1.5em 2.5em 1.5em;}
.inquPopup dl { margin-top: 1.1em; display: flex; justify-content: flex-start; align-items: flex-start;}
.inquPopup dt { width: 5em; text-align: right; color: #000; line-height: 2.6;}
.inquPopup dd { margin-left: 1em; flex: 1;
 display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start;}
.inquPopup .iw { width: 100%;
}
.inquPopup .tip { width: 100%;  margin-left: 4.3%;
margin-top: 0.7em; color: #737373; line-height: 1.8; 
text-align: left; font-size: 0.95em;}
.inquPopup .input,.inquPopup select { width: 100%; line-height: 2.6; height: 2.6em; font-size: 14px;
outline-width: 0; border: 1px dotted #cccccc;     padding: 0 1em;
-moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;}
.inquPopup .tw {width: 100%;}
.inquPopup .textarea {width: 100%; height: 90px;outline-width: 0;font-size: 14px;
 border: 1px dotted #cccccc; padding: 1em 1em 0.5em;
-moz-border-radius:0.2em; -webkit-border-radius:0.2em; border-radius:0.2em;}


.inquPopup .btnW { margin-top: 1.5em; border-top:1px solid #eeeeee; padding-top: 3em; padding-bottom: 2em;}
.inquPopup .btnSubmit  {  font-size: 1.1em; width: 62%; margin: 0 auto;
border: 2px solid #ddd; display: inline-block; cursor: pointer;
 line-height: 2.6;   background-color: #007ebc; color: #fff;font-weight: bold;
 transition: all 0.5s;
 -webkit-transition:all 0.5s;
  -moz-border-radius:1.6em; -webkit-border-radius:1.6em; border-radius:1.6em;}
.inquPopup .btnSubmit:hover { background-color: #000;}
.inquPopup .tip2 { font-size: 0.9em; width: 62%; padding: 9px;
    margin: 0 auto; text-align: left; line-height: 1.8; 
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);}

 @media only screen and (max-width: 828px) {
.inquPopup dl { display: block;}
.inquPopup dt { width: auto; text-align: left; }
.inquPopup dd{ margin-left: 0;}
.inquPopup .iw,.inquPopup .tw { width: 100%;}
.inquPopup .tip { margin-left: 0;}
.inquPopup .btnSubmit { width: auto; display: block;}
.inquPopup .tip2 { width: auto;}
 }
 
.aboutIBox { text-align: left;
    line-height: 1.8;}
.aboutIBox .videoAboutBox { text-align: center;}
.aboutIBox .videoAboutBox video { max-width: 100%; height: auto;}
.aboutIBox .tit {    color: #3399ff;
    font-size: 20px;}
.aboutIBox .txt { color: #666;}
.aboutIBox .txt p{
margin: 0;
    padding: 8px 0;
    font-size: 14px;
	}
	
.product-cat-tit { border-bottom:1px solid #ddd; padding-top: 2.8em; text-align: left;}
.product-cat-tit h2::before { position: relative; z-index: 0; top: 0.1em; margin-right: 0.4em; display: inline-block; content: "";
height: 1em; width: 4px; background: #007ebc;}