a{ color: #111;}
a:hover{ color: #285cb1; }
#top{ padding: 10px 0; }
#top img{ display: block; height: 40px; }
#top .fr{ display: block; font-size: 14px; color: #666; padding-left: 40px; background: url(tel.png) left center no-repeat; }
#top .fr b{ display: block; color: #285cb1; font-size: 20px; }
nav{ background-color: #111; }
nav .fr{ float: none; }
nav a{ color: #fff; }
nav li>a{ padding: 0 20px; height: 50px; line-height: 50px; font-weight: bold; border-bottom: 3px solid transparent; transition: all 0.3s;}
nav li:hover>a{ border-color: #fff; color: #fff; text-decoration: none; }
nav li>div{ padding-top: 10px; }
nav li>div>div{ background-color: #5e8de4; }
nav li div a{ display: block; padding: 0 20px; height: 36px; line-height: 36px; }
nav li div a:hover{ background-color: #285cb1;color: #fff; text-decoration: none; }
.swiper-button-next, .swiper-button-prev{ }
#banner .swiper-pagination-bullets .swiper-pagination-bullet{ width: 60px; height: 4px; border-radius: 0; background-color: rgba(255,255,255,1); }
.bpart{ margin: 60px 0; position: relative;}
.bpart.bg{ padding: 60px 0;}
.bpart>.title{ text-align: center; color: #285cb1; margin-bottom: 30px;}
.bpart>.title h2{font-size: 26px; letter-spacing: 3px;}
.bpart>.title div{ height: 2px; background-color: #ffb530; width: 60px; margin: 6px auto; }
.bpart>.title span{text-transform: uppercase; color: #666;}
.bg>.title span,.bg>.title h2{ color: #fff; }
#case,#pro{ background-color: #3e74ce;}
#pro .cate{ text-align: center; margin-bottom: 30px; }
#pro .cate a{ display: inline-block; margin: 3px; background: #1b4996; color: #fff; padding: 4px 12px; border-radius:1px; transition: all 0.5s;}
#pro .cate a:hover{ background: #ff670f; text-decoration: none; }
#case .plist{ overflow: hidden;}
#case .plist .swiper-slide,#pro #plist li{ background-color: #f1f1f1; padding: 4px; }
#pro #plist li{ float: left; width: calc((100% - 60px) / 4); margin: 0 20px 20px 0;}
#pro #plist li:nth-child(4n){ margin-right: 0; }
#case .plist .swiper-slide h3 a,#pro #plist li h3 a{ display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: normal; color: #666; font-size: 16px; padding: 10px; text-align: center; }
#case .plist .swiper-slide h3 a:hover{ color: #285cb1; text-decoration: none; }
#why .body>div{ float: left; width: 50%; }
#why dl{ width: 80%; }
#why dt{ font-size: 18px; color: #285cb1; font-weight: bold; background: url(arr.jpg) left center no-repeat; padding-left: 20px;}
#why dd{ color: #666;margin: 1em 0 2em; padding-left: 20px;}
#about{ background-size: cover; background-position:  center; background-repeat: no-repeat; color: #fff; }
#about ul{ margin-top: 60px; }
#about li{ margin-bottom: 20px; width: 50%; float: left; background-color:rgba(47, 122, 166, 0.75); height: 80px; line-height: 80px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 20px; }
#about li:nth-child(2n){ text-align: right; }
#about .img{ width: 360px; position: absolute; left:calc(50% - 180px); top: -30px; }
#process .body{ text-align: center; }
#process li{ display: inline-block; width: 120px; height: 120px; background-color: #285cb1; color: #fff; text-align: center; line-height: 120px; border-radius:30px; margin: 0 12px 12px 12px;}
#news li{ width: calc((100% - 12px) / 4); margin-right: 4px; float: left; padding: 20px; background-color:#f1f1f1;}
#news li:nth-child(4n){ margin-right: 0; }
#news li a{ font-weight: normal; padding-bottom: 10px; display: block; height: 60px;overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; }
#news li time{ color: #666; font-size: 14px; display: block;  padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #ddd;}
#news li p{ text-indent: 0;overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 4; color: #666; font-size: 14px; height: 84px;  }
#news li:hover{ background-color: #222; }
#news li:hover *{ color: #fff; }
#news li:hover time{ color: #285cb1; }
#news li:hover a:hover{ color: #ffb530; }
#btm{ background-color: #285cb1; padding: 10px 0; color: #fff; }
#link{ background-color:#333; margin-top: 10px; text-align: center; padding: 10px 0;}
#link a{ color: #ccc; }
@media screen and (max-width: 1000px){
	#top .fr{ display: none; }
	#pro #plist li{ width: calc((100% - 20px) / 3); margin: 0 10px 10px 0; }
	#pro #plist li:nth-child(4n){ margin-right: 10px; }
	#pro #plist li:nth-child(3n){ margin-right: 0; }
	#news li{ width: calc(50% - 5px); margin:0 10px 10px 0; }
	#news li:nth-child(2n){ margin-right: 0; }
}
@media screen and (max-width: 640px){
	#pro #plist li{ width: calc(50% - 5px); }
	#pro #plist li:nth-child(3n){ margin-right: 10px; }
	#pro #plist li:nth-child(2n){ margin-right: 0; }
	#news li,#about li,#why .body > div{ width: 100%; float: none; }
	#about .img{ display: none; }
	#about li{ text-align: left !important; }
}