@charset "utf-8";
.title{text-align: center;color: #000;margin: 50px auto;height: 60px;}
.title h4{
    font-size: 16px;
    color: #666;
    font-weight: normal;
}
.title h2{background: url(../images/t.png) no-repeat bottom center;font-size: 25px;}
/*about*/
#about{
    overflow: hidden;
    padding-bottom: 50px;
}
.aboutL{}
.aboutL h1{
    color: #116099;
    font-size: 25px;
    line-height: 2;
}
.aboutL>p{
    font-size: 14px;
}
.aboutL>a{
    display: inline-block;
    padding: 2px 15px;
    background: #0F619B;
    color: #fff;
    font-size: 14px;
    margin: 15px 0;
    transform:translateZ(0);
}
.aboutL>a:hover{color:#fff;}
.aboutL>a:after{position:absolute;top:0;left:0;display:block;content:' ';width:0;height:100%;background:#333;z-index:-1;transition:.5s all}
.aboutL>a:hover:after{width:100%;}
.aboutR{position: relative;height: 0;padding: 0 0 29% 0;}
.aboutR img{max-width:100%;padding: 10px 0;}
/*product*/
#product{
    padding-bottom: 50px;
    background: url(../images/product_bg.jpg) no-repeat center bottom;
}
.prolist{
    margin-bottom: 15px;
}
.prolist dt{
    background: #0869AE;
    color: #fff;
    font-size: 25px;
    padding-left: 20px;
}
.prolist dd{padding: 5px 10px 0;}
.prolist dd:last-child{padding-bottom:15px;}
.prolist dd a{
    display: block;
    background: #0869AE;
    color: #fff;
    padding: 0 10px;
    box-shadow: 2px 1px 5px #eee;
}
.prolist dd a:hover{background:#333}
.prolist dd a:after{content:'>';float: right;width: 20px;line-height: 20px;background: #fff;border-radius: 50%;margin-top: 5px;color: #0869AE;text-align: center;font-weight: bold;}
.prolist dd a:hover:after{color:#333}
.prolist-div{border:2px solid #0869AE;}
.prolist dd img{
    display: block;
    margin: 0 auto;
    padding-top: 15px;
    max-width: 100%;
}
.product{}
.product li{}
.product>li>a{
    display: block;
    border: 1px solid #ccc;
    position: relative;
    height: 0;
    padding: 0 0 82% 0;
    background: #fff;
}
.product>li>a>img{
    max-width: 100%;
    max-height: 100%;
    display: block;
    position: absolute;
    top: 50%;
    left:50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.product>li>p{
    text-align: center;
    background: #0C6AB0;
    margin: 5px auto 20px;
    line-height: 2.5;
}
.product>li>p>a{
    color: #fff;
    display: block;
    font-size: 14px;
}
/*ys*/
#ys{
    margin-bottom: 50px;
    margin-top: 50px;
}
.title2{
    text-align: center;
    margin-bottom: 30px;
}
.title2 h2{
}
.title2 h2 img{
    display: block;
    margin: 0 auto;
}
.title2 h4{
    background: #0C6AB0;
    display: inline-block;
    line-height: 40px;
    border-radius: 20px;
    padding: 0 50px;
    color: #fff;
    margin: 20px 0 15px 0;
}
.title2 p{
    color: #666;
    line-height: 1.5;
    max-width: 700px;
    margin: 20px auto;
}
#ys dl{
    position: relative;
    padding-left: 115px;
    margin-bottom: 20px;
}
#ys3{margin-top:25px}
#ys img{
    max-width: 100%;
}
#jiang{display: block;margin: -48px auto 0;}
#ys dt{
    font-size: 18px;
    border-bottom: 1px solid #ccc;
}
#ys dt span{color: #0C6AB0;font-size: 25px;}
#ys1 dt:before{content:'01'}
#ys2 dt:before{content:'02';}
#ys3 dt:before{content:'03'}
#ys4 dt:before{content:'04'}
#ys dt:before{position: absolute;display: block;width: 78px;line-height: 78px;text-align: center;background: url(../images/ys_title.png);color: #fff;font-size: 25px;left: 0;top: 23px;}
#ys dd{
    font-size: 16px;
    color: #666;
}
/*case*/
#case{
    background: #146DAF url(../images/case_bg.jpg) no-repeat center;
    overflow: hidden;
    text-align: center;
}
#case .title,#case .title h4{
    color: #fff;
}
#case .title h2{
    background: url(../images/t2.png) no-repeat bottom center;
}
.case1{position: relative;}
.case1 li{padding:0 5px;line-height: 50px;text-align: center;}    
.case1 li a{
    display: block;
    border: 3px solid #fff;
    position: relative;
    height: 0;
    padding: 0 0 72% 0;
    background: #ccc;
}
.case1 li img{
	max-width: 100%;
    max-height: 100%;
    display: block;
    position: absolute;
    top: 50%;
    left:50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.case1 .swiper-button-prev{background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'><path%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F><%2Fsvg>");}
.case1 .swiper-button-next{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}

/*zhichi*/
#zhichi{
    background: #0F619B url(../images/zhichi.jpg) center;
    color: #fff;
    padding: 30px 0;
}
#zhichi h2{
    display: inline-block;
    border-bottom: 2px solid;
}
#zhichi p{
    font-size: 14px;
}
#zhichi a{
    display: inline-block;
    padding: 2px 15px;
    border: 1px solid #fff;
    color: #fff;
    font-size: 14px;
    margin: 15px 0;
    transform: translateZ(0);
}
#zhichi a:after{position:absolute;top:0;left:0;display:block;content:' ';width:0;height:100%;background:#333;z-index:-1;transition:.5s all}
#zhichi a:hover:after{width:100%;}
/*contact*/
#contact{
    padding-bottom: 40px;
    background: url(../images/contact.jpg) center no-repeat bottom;
}
.contact{}
.contact li{
    text-align: center;
    padding: 10px 15px;
}
.contact li div{border: 2px solid #959595;padding: 10% 1%;}
.contact li.on{}
.contact li.on div{border: 0;background: #0F619B;color: #fff;border: 2px solid #0F619B;}
.contact img{
    display: block;
    margin: 0 auto;
    max-width: 50%;
}
.contact p{
    font-size: 14px;
    height: 56px;
    overflow: hidden;
}
.case_more{
    display: inline-block;
    background: #fff;
    margin: 30px 0;
    padding: 5px 15px;
    color: #146DAF;
}
/*news*/
#news{
    padding-bottom: 50px;
    overflow: hidden;
    background: #F8F8F8 url(../images/news_bg.jpg) no-repeat center bottom;
}
#news li{
    border-bottom: 1px solid #ccc;
    margin: 30px 0;
}
.news-c{
    margin: 0 165px 0 120px;
}
.center{}
.center a{
    color: #000;
    font-weight: bold;
}
.center p{
    font-size: 16px;
    color: #666;
}
.news-l{
    width: 100px;
    top: 0;
    float: left;
    border-right: 1px solid;
}
.news-l span{
    text-align: center;
    display: block;
    font-size: 30px;
    color: #045D9F;
    line-height: 1.5;
    padding: 20px 0;
}
.news-l span i{
    display: block;
    font-style: normal;
    font-size: 16px;
}
.news-r{
    float: right;
    width: 160px;
}
.news-r a{}
.news-r img{
    max-width: 100%;
}
@media (max-width: 768px) {
	.prolist dd a{padding: 0 5px;}
	.prolist dd{padding: 10px 5px 0;}
	#news ul{padding:0 10px;}
	.news-c{margin:0}
	.title{margin:20px auto;}
	.aboutL li h6{font-size:14px;}
	.aboutL li p{font-size:12px;}
	#ys dl{padding-left: 0;margin-bottom: 5px;margin-top: 10px;}
	#ys dt:before{display:none;}
	#ys dt span{font-size:16px;}
	#ys dt{font-size:14px;}
	#zhichi {background: #0F619B;}
	.aboutR{position: relative;height: 0;padding: 0 0 57.4% 0;}
	.aboutL h1{font-size:20px;}
	.product>li>a{}
	#product{padding:0}
	#ys{margin: 20px 0;}
	#news{padding-bottom: 0;}
}