﻿@charset "utf-8";
.h-tlt{text-align: center;padding:10px 0 20px;width:100%;}
.h-tlt h1{font-family:"微软雅黑"; font-size:2em;font-weight:bolder; color: #021f59;line-height: 1.4;}
.h-tlt .p2{margin:10px 0;font-size: 13px;font-family: Arial;color:#f22e2e;text-transform: uppercase;line-height: 1.8em;}
.h-tlt .more{display: inline-block;width: 130px;height: 35px;margin: 0 12px;background: #3796DE;color: #fff;font-size: 14px;line-height: 35px;transition: all .77s;border-radius: 17px;}
.h-tlt .more:hover{background: #f22e2e;}
@media screen and (max-width: 768px) {
 
}

.About{padding: 34px 0px;width:100%; background:url(../images/bg.png);}
.About .About-inner{margin:0px auto 30px;}
.About li{width:32.83333%;overflow:hidden;float:left;}
.About li img{width:100%;} 
.About li:nth-child(3n){float:right;margin-left:.5%; height:254px;}
.About li:nth-child(3n+1){float:left;margin-right:.5%; height:254px;}
.About li:nth-child(3n+2){float:left;margin-right:.25%;margin-left:.25%; height:254px;}
.About li .img{overflow:hidden;}
.About li p{text-align:center;}
.About li:nth-child(3n) .img{height:200px;padding-top:20px;}
.About li:nth-child(3n+1) .img{ height:200px;padding-top:20px;}
.About li:nth-child(3n+2) .img{height:180px;}
 
.About li a{color:#000;}
.About li a:hover{color:#f22e2e}
.About li:nth-child(3n) p,.About li:nth-child(3n+1) p{line-height:30px;}
.About li:nth-child(3n+2) p{line-height:54px;}
.About .About-inner .contt{ padding:20px 10%;line-height:1.5em;color:#444;}
.About .About-inner .contt h1,.products-inner h1,.case h1{ font-family:"微软雅黑"; font-size:2em;font-weight:bolder;line-height:2em;text-align:center;color: #021f59;}
.About .About-inner .contt  .itlt,.products-inner .itlt,.case .itlt{margin:0px auto 20px;width:100%;font-size:2em;color:#f22e2e;font-weight:300;text-align:center;}
.about-link {padding-top: 14px;text-align: center;}
.about-link a{display: inline-block;width: 110px;height: 35px;margin: 0 12px;background: #A6A6A6;color: #fff;font-size: 14px;line-height: 35px;transition: all .77s;border-radius: 5px;}
.about-link a:hover{background:#3796DE;}
@media screen and (max-width: 768px) {
.About .About-inner .About-img{ width:80%;float:none;margin:10px auto;padding:0px;border:0px solid #fff;}
.About .About-inner .About-img img{padding:2px;border:1px solid #ccc;}
.About .About-inner .contt{ padding:1%;font-size:.8em;font-weight:100;line-height:1.5em;color:#333;}
.about-link a{width: 30%;height:35px;margin: 0 1.5%;}
.About li{width:96%;overflow:hidden;float:none;margin:2px 2%;}
.About li:nth-child(n) p{line-height: 30px;}
.About li:nth-child(n){height: auto;margin:2px 2%;}
.About li:nth-child(n) .img{height: auto;padding-top:2px;}
 }
.products-inner {padding:30px 0;}
.products .ProBox .hd{ height:30px; position:relative;}
.products .ProBox .hd ul{ float:left; position:absolute;top:-1px;width:100%;}
 
.products .ProBox .hd ul li {width:10.1111111%;height:40px;line-height:40px;text-align:center;float:left;margin:0 .5% 2px .5%;cursor:pointer;font-weight:300;background:#021f59;transition:ease-in-out .5s;}
.products .ProBox .hd ul li.on,.products .ProBox .hd ul li:hover {background:#3796DE;color:#fff;}
.products .ProBox .hd ul li,.products .ProBox .hd ul li:hover {color:#fff;}
 

.products{padding:30px 0;background:#fff;}
.products .ProBox .bd ul li.iprolist{width:19%;margin:10px 0.5%;float:left;}
.products .ProBox .bd ul li.iprolist img,.prolist .con ul li.iprolist img{width:100%;height: 203px;}
.products .ProBox .bd ul li.iprolist figcaption{text-align:center;margin: 0;background-color: #F2F2F2;}
.products .ProBox .bd ul li  a{font-size:0.8em;color:#000;font-family:Tahoma,Geneva,sans-serif;font-weight:500;}
.products .ProBox .bd ul li a:hover {color:#f22e2e;text-decoration: none;}
.products .ProBox .bd ul li.iprolist1{width:23%;margin:10px 0.7%;float:left;}
.products .ProBox .bd ul li.iprolist1 img,.prolist .con ul li.iprolist img{width:100%;}
.products .ProBox .bd ul li.iprolist1 figcaption{text-align:center;margin: 0;background-color: #ccc;}


.case{position:relative;z-index:1;height:600px;}
.case li{float:left;height:200px;overflow:hidden;margin-bottom:10px;}
.case li:nth-child(2),.case li:nth-child(3){width:37.8%;}
.case li:nth-child(1),.case li:nth-child(4){width:61.2%;}
.case li:nth-child(1),.case li:nth-child(3){margin-rignt:0.4%;}
.case li:nth-child(2),.case li:nth-child(4){margin-left:0.4%;}
.case li img{width:100%;}
.case p{width:90%;margin:15px 5%;}
@media screen and (max-width: 1024px) {
 
 } 

@media screen and (max-width: 768px) {
.products .ProBox .hd{ height:126px; position:relative;}
.products .ProBox .hd ul li{width:31.333333%;height: 30px;float:left; padding:1px 0.5%; font-weight:300;} 
.products .ProBox .bd ul li.iprolist{width:49%;margin:10px 0.5%;float:left;}
.products .ProBox .bd ul li.iprolist img,.prolist .con ul li.iprolist img{width:100%;height: auto;}
 }
 
@media screen and (max-width: 642px) {
 .why-inner img{top:45%;}
.About{padding: 10px 0px;}
.shadow-bg{display:none;}
.About .About-inner{margin:10px auto;}
 
 } 
@media screen and (max-width: 480px) {
.h-tlt h1{font-size: 20px;}
.h-tlt{text-align: center;padding:10px 0 10px;width:100%;}
 
.why{height:250px;}
.why-inner{height:250px;}
.why-inner .h-tlt{padding: 20px 0 0px;}
.why-inner img{top:40%;}
 .why-inner .con  .ad p{font-size:.5em;}
.why-inner .con  .ad .bg{width:16px;line-height:19px;background:url(../images/timg_16.png) no-repeat;margin:0 5px;color:#592512;font-weight:200;font-size:.5em;}
.why-inner .con .ad{line-height:19px;width:46%;margin:10px 0;}
 }
.App {padding:20px 0 0;background:#fff; background:#f3f3f3;background-size: cover;}
.App-list li:nth-child(1){width:49%;margin:0.5%;float:left;position:relative;overflow:hidden;}
.App-list li:nth-child(n+2){width:23%;margin:0.5%;float:left;position:relative;overflow:hidden;}
.App-list li:nth-child(2),.App-list li:nth-child(3){width:23%;margin:0.5%;}
.App-list li:nth-child(4),.App-list li:nth-child(5){width:23%;margin:1% 0.5% 0 0.5%;}
 .App-list li img{width:100%;height:auto;}
.App-list  li:hover:nth-child(1) figcaption{ bottom:0;}
.App-list  li:hover:nth-child(n+2) figcaption{ bottom:0;}
.pro-inner{ width:100%; float:left;  height:auto; overflow:hidden; position:relative;}
.App-list li:nth-child(1) figcaption{ display:block; padding:60px; position:absolute; left:0; bottom:-326px; transition:320ms ease-in-out; box-sizing:border-box; width:100%;height:auto;  background: url(../images/pic_bg.png) repeat left top;}
.App-list li:nth-child(1) figcaption h3 a{ font-weight:normal; line-height:normal; color:#fff; font-size:1.5em; padding-bottom:20px; border-bottom:1px solid #fff;}
.App-list li:nth-child(1) figcaption p,.App-list li:nth-child(1) figcaption a.more{color:#fff; font-size:1.0em;}
.App-list li:nth-child(1) figcaption a.more{float:right;    border:1px solid #fff;color:#fff;display:block;font-size:14px;margin-top:20px;width:120px;text-align:center;}
.App-list li:nth-child(n+2) figcaption{ display:block; padding:15px; position:absolute; left:0; bottom:-153px; transition:320ms ease-in-out; box-sizing:border-box; width:100%;height:auto;  background: url(../images/pic_bg.png) repeat left top;}
.App-list li:nth-child(n+2) figcaption h3 a{ font-weight:normal; line-height:normal; color:#fff; font-size:1em; padding-bottom:10px; border-bottom:1px solid #fff;}
.App-list li:nth-child(n+2) figcaption p{color:#fff; font-size:.6em;line-height:1.8em;height:1.8em;overflow:hidden;}
.App-list li:nth-child(n+2) figcaption a.more{color:#fff; font-size:.6em;line-height:2em;}
.App-list li:nth-child(n+2) figcaption a.more{float:right;    border:1px solid #fff;color:#fff;display:block;font-size:.6em;margin-top:0px;width:120px;text-align:center;}

@media screen and (max-width: 768px) {
.App{display: none;}
}
 
.news{background:#ededed;padding:30px 0;}
.news .pic-news{width:38%;float:left;margin-right:0.2%;position: relative;}
.news .pic-news img{width:100%;}
.news .pic-news .figcaption{display:block; padding:5px 10px; position:absolute; left:0; bottom:0px;  box-sizing:border-box; width:100%;height:40px;  background: url(../images/news_bg.png) repeat left top;}
.news  a{color:#fff;}
.news  a:hover{color:#3796DE;}
.news .newslist{width:61.6%;float:left;margin-left:0.2%;}
.news-inner li{width:96%;height:131px;float:left;overflow:hidden;background: url(../images/news_bg.png) repeat left top;}
.news-inner li:nth-child(1){margin-bottom:7px;}
.news-inner li:nth-child(3){margin-top:8px;}
.news-inner li img{width:auto;height:100%;float:left;}
.news-inner li .figcaption{float:left;width:70%;margin:0 0 0 10px;}
.news-inner li .figcaption p{line-height:20px;color:#021F59;}
@media screen and (max-width: 768px) {
.news .pic-news,.news .newslist{width:99%;float:left;margin:5px 0.5%;position: relative;}
.news-inner li img{width:26%;height:auto;float:left;}
.news-inner li .figcaption p{display:none;}
.news-inner li{width:100%;height: auto;}
}
@media screen and (max-width: 642px) {

 }