.tit { text-align: center; margin-bottom: 25px;}
.tit h2 { font-size: 36px; color: #2758a3; font-weight: bold; letter-spacing: 3px; margin-bottom: 20px;}
.tit h2 span { color: #e77e0f;}
.tit p { font-size: 16px; color: #555; line-height: 28px;}

.product { padding: 40px 0 25px 0;}
.p_list li { float: left; width: 23.7%; margin: 0 1% 12px 0; border: 1px solid #ddd; padding: 2px;}
.p_list li.mr0 { margin-right: 0;}
.p_list li a.pic { position: relative; width: 100%; padding: 50% 0; display: block; overflow: hidden;}
.p_list li a.pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block;}
.p_list li a.txt { width: 100%; display: block; background: #3D4044; line-height: 40px; color: #fff; font-size: 18px; margin-top: 1px;
	text-align: center;}
.p_list li:hover { border: 1px solid #2758a3;}
.p_list li:hover a.pic img { transform: scale(1.08); transition: all 0.5s ease 0s; -webkit-transform: scale(1.08);
	-webkit-transform: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s;}
.p_list li:hover a.txt { background: #2758a3;}

.about { background: #26559b url(../img/main_d_bg.jpg) center top no-repeat; padding: 50px 0;}
.about .ab_box { width: 41.3%; background: url(../img/main_d_left_bg.png) left top no-repeat; padding: 28px 0px 0px 28px; height: 373px; position: relative;}
.about .ab_box .ab_box_tit { position: absolute; left: 33px; top: 33px; font-size: 18px; padding: 12px 25px; background: #26559b; color: #fff;
    z-index: 99;}
.about .ab_box .hd { position: absolute; right: 10px; bottom: 38px; z-index: 88;}
.about .ab_box .hd li { float: left; width: 13px; height: 13px; margin: 0 5px; background: #ccc; border-radius: 50%;}
.about .ab_box .hd li.on { background: #fff;}
.about .ab_box .bd { width: 490px; height: 340px; overflow: hidden; border: 5px solid #fff;}
.about .ab_box .bd li a { position: relative; width: 100%; padding: 34.7% 0; display: block;}
.about .ab_box .bd li a img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block;}
.about .ab_txt { width: 48.1%;}
.about .ab_txt h2 { display: inline-block; border-bottom: 1px solid #839abd; font-size: 36px; line-height: 62px; margin-bottom: 20px; color: #fff;}
.about .ab_txt p { font-size: 14px; color: #fff; line-height: 30px;}
.about .ab_txt a.more { display: block; width: 110px; height: 37px; text-align: center; line-height: 37px; background: #e77e0f; font-size: 14px;
    color: #fff; margin-top: 30px;}
.about .ab_txt a.more:hover { background: #f99124;}

.service { padding: 30px 0 18px 0;}
.service .ser_l li { float: left; width: 31.8%; height: auto; padding: 5px; position: relative; background: #2758a3; margin: 0 1% 12px 0;
    overflow: hidden; border-radius: 15px;}
.service .ser_l li.mr0 { margin-right: 0;}
.service .ser_l li a { position: relative; width: 100%; padding: 28.6% 0; display: block; overflow: hidden;}
.service .ser_l li a img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; border-radius: 10px;}
.service .ser_l li p { position: absolute; left: 0; bottom: 0; line-height: 40px; background: #2758a3; width: 100%; color: #fff; font-size: 14px;}
.service .ser_l li p span { float: right; font-size: 17px;}
.service .ser_l li h2 { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding-top: 25%; background: url(../img/h.png); color: #fff;
    font-size: 18px; display: none; text-align: center;}
.service .ser_l li:hover a img { transform: scale(1.2); -webkit-transform: scale(1.2); transition: all ease .9s; -webkit-transition: all ease .9s;
    -moz-transition: all ease .9s; -ms-transition: all ease .9s; -o-transition: all ease .9s;}

.new { background: #ecffff; padding: 30px 0 18px 0;}
.new .new_l li { width: 98%; box-shadow: 0 0 10px rgba(64,126,202, .5); margin: 15px 0; overflow: hidden; background: #fff; padding: 10px 1%;}
.new .new_l li h2 { font-size: 18px; font-weight: normal; color: #26559b; line-height: 40px;}
.new .new_l li span { color: #999; font-size: 14px; line-height: 22px;}
.new .new_l li p { color: #666; font-size: 14px; line-height: 20px;}

@media screen and ( max-width: 1920px ) {}
@media screen and ( max-width: 1680px ) {}
@media screen and ( max-width: 1440px ) {}
@media screen and ( max-width: 1366px ) {}
@media screen and ( max-width: 1280px ) {}
@media screen and ( max-width: 1024px ) {
	.p_list li { width: 23.6%;}

	.about .ab_box { width: 46%;}
	.about .ab_box .bd { width: 100%; height: auto;}
	.about .ab_box .bd li a { padding: 37% 0;}

	.service .ser_l li { float: left; width: 31.6%;}
}
@media screen and ( max-width: 768px ) {
	.product, .about, .service { padding: 1em 0;}
	.p_list li { width: 48.7%; margin: 0 .5em .5em 0;}

	.about .ab_box { width: 100%; padding: 0; height: auto;}
	.about .ab_box .ab_box_tit { left: 5px; top: 5px; width: 160px; padding: 0; text-align: center; line-height: 50px;}
	.about .ab_box .bd { width: 98%;}
	.about .ab_txt { width: 100%;}
	.about .ab_txt h2 { width: 144px; display: block; margin: .3em auto;}
	.about .ab_txt a.more { width: 110px; margin: .3em auto;}

	.service .ser_l li { width: 48%; margin: 0 .5em .5em 0;}
	.p_list li.mr0, .service .ser_l li.mr0 { margin-right: .5em;}
	.p_list li:nth-child(2n), .service .ser_l li:nth-child(2n) { margin-right: 0;}
}
@media screen and ( max-width: 414px ) {
	.tit, .tit h2 { margin-bottom: .2em;}

	.p_list li { width: 47.5%;}
	.product .p_list li a.txt { line-height: 40px;}
	.about .ab_box .bd { width: 97%;}
	.service .ser_l li { width: 46.5%;}
	.service .ser_l li a { padding: 38% 0;}
	.service .ser_l li p { text-align: center; line-height: 20px}
}
@media screen and ( max-width: 411px ) {}
@media screen and ( max-width: 400px ) {}
@media screen and ( max-width: 375px ) {
	.p_list li { margin: 0 .2em .2em 0;}
	.service .ser_l li { margin: 0 .2em .2em 0;}
	.p_list li.mr0, .service .ser_l li.mr0 { margin-right: .2em;}
	.p_list li:nth-child(2n), .service .ser_l li:nth-child(2n) { margin-right: 0;}
}
@media screen and ( max-width: 360px ) {
	.service .ser_l li { width: 46.5%;}
	.product .p_list li a.txt { font-size: 18px;}
	.product .p_list li a.txt p span { font-size: 20px;}
}
@media screen and ( max-width: 320px ) {}