﻿.product{padding:58px 0;}
.product-title{text-align:center;}
.product-title h2{font-size:32px; line-height:1; font-weight:bold; margin-bottom:6px; color:#1258af;}
.product-title b{text-align:center; padding:8px 0; display:block; position:relative; overflow:hidden}
.product-title b:before,
.product-title b:after{width:200px; height:1px; position:absolute; content:''; right:50%; margin-right:18px; bottom:50%; background:#d8d8d8;}
.product-title b:after{left:50%; margin:0 0 0 18px}
.product-title b i{font-size:18px; color:#1258af;}
.product-title p{font-size:16px; color:#686868;}
@media(max-width:767px){
.product-title h2{font-size:26px;}
.product-title b{padding:4px 0;}
.product-title b:before,
.product-title b:after{width:120px;}
.product-title p{font-size:14px;}
}
.product-content{margin-top:28px;}
.product-nav{width:24%; float:left; background:#f0f0f0;}
.product-nav h3{padding:18px; position:relative; color:#fff; background:#1258af ;}
.product-nav h3>p{font-size:16px; margin-bottom:12px; line-height:1;}
.product-nav h3>b{display:block; font-size:26px; line-height:1;}
.product-nav ul{padding:8px;}
.product-nav ul:after{display:block; content:''; clear:both;}
.product-nav ul>li{float:left; width:100%; padding:8px;}
.product-nav ul>li>a{display:block; padding:12px 18px; font-size:16px; background:#fff; transition:.3s; position:relative;}
.product-nav ul>li>a:before{position:absolute; left:-2px; top:12px; bottom:12px; width:4px; content:''; transition:.3s; background:#1258af;}
.product-nav ul>li>a:after{display:block; content:''; clear:both;}
.product-nav ul>li>a>b{float:left; font-weight:normal;}
.product-nav ul>li>a>i{float:right; line-height:inherit; transition:.3s; color:#989898;}
.product-nav ul>li>a:hover{color:#fff; background:#1258af;}
.product-nav ul>li>a:hover:before{background:#fff;}
.product-nav ul>li>a:hover>i{color:#fff;}
.product-list{width:76%; float:left; padding-left:28px;}
.product-list>ul{margin:-8px -8px 0 -8px;}
.product-list>ul:after{display:block; content:''; clear:both}
.product-list>ul>li{float:left; width:33.333%; padding:0 8px; margin-top:8px;}
.product-list>ul>li>a{display:block; text-align:center;}
.product-list>ul>li>a>ins{display:block; overflow:hidden;}
.product-list>ul>li>a>ins>img{display:block; width:100%; transition:.3s;}
.product-list>ul>li>a>span{display:block; margin:0 18px; position:relative; top:-16px; transition:.3s; z-index:8; background:#f8f8f8; padding:12px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:center; font-size:17px;}
.product-list>ul>li>a:hover>ins>img{transform:scale(1.08);}
.product-list>ul>li>a:hover>span{top:0; margin:0; color:#fff; background:#1258af;}
@media(max-width:1200px){
.product{padding:38px 0;}
.product-nav{width:100%;}
.product-nav ul>li{width:33.333%;}
.product-list{width:100%; padding-left:0; margin-top:28px;}
}
@media(max-width:992px){
.product-nav ul>li{width:50%;}
.product-list>ul>li{width:50%;}
}
@media(max-width:767px){
.product{padding:18px 0;}
.product-content{margin-top:18px;}
.product-nav h3{padding:12px;}
.product-nav h3>p{font-size:14px; margin-bottom:8px;}
.product-nav h3>b{font-size:22px;}
.product-nav ul{padding:4px;}
.product-nav ul>li{width:100%; padding:4px;}
.product-nav ul>li>a{padding:8px 12px; font-size:15px;}
.product-list{margin-top:18px;}
.product-list>ul{margin:-4px -4px 0 -4px;}
.product-list>ul>li{padding:0 4px; margin-top:4px;}
.product-list>ul>li>a>span{margin:0 8px; top:-16px; padding:8px; font-size:15px;}
}

.stance{padding:58px 0; overflow:hidden; position:relative; background:url('') center; background-size:cover;}
.stance-title{text-align:center;}
.stance-title h2{font-size:32px; line-height:1; font-weight:bold; margin-bottom:6px; color:#1258af;}
.stance-title b{text-align:center; padding:8px 0; display:block; position:relative; overflow:hidden}
.stance-title b:before,
.stance-title b:after{width:200px; height:1px; position:absolute; content:''; right:50%; margin-right:18px; bottom:50%; background:#d8d8d8;}
.stance-title b:after{left:50%; margin:0 0 0 18px}
.stance-title b i{font-size:18px; color:#1258af;}
.stance-title p{font-size:16px; color:#686868;}
@media(max-width:767px){
.stance-title h2{font-size:26px;}
.stance-title b{padding:4px 0;}
.stance-title b:before,
.stance-title b:after{width:120px;}
.stance-title p{font-size:14px;}
}
.stance-image{margin:38px -8px 0 -8px; text-align:left}
.stance-image:after{display:block; content:''; clear:both}
.stance-image>div{float:left; padding:8px;}
.stance-image>div>aside{display:block; width:100%; height:100%; position:relative; z-index:1; background:#fff no-repeat bottom right; padding:28px;}
.stance-image>div>aside:before{display:none; position:absolute; top:0; right:0; z-index:2; bottom:0; left:0; background:#000; content:''; opacity:.38;}
.stance-image>div>aside>img{position:absolute; bottom:0; right:0; z-index:1; object-fit:cover;}
.stance-image>div>aside>span{display:block; position:relative; z-index:3;}
.stance-image>div>aside>span>b{font-size:24px; display:block; margin-bottom:16px;}
.stance-image>div>aside>span>p{color:#686868;}
.stance-image>div>aside>span>u{text-decoration:none; display:block; margin:28px 0 8px 0;}
.stance-image>div>aside>span>u>a{display:inline-block; border-radius:3px; padding:6px 16px; color:#fff; border:1px solid #1258af; background:#1258af;}
.stance-image>div>aside>span>u>a:hover{background:#fff; color:#1258af;}
.stance-image>div:nth-child(1){width:36%; height:600px;}
.stance-image>div:nth-child(1)>aside:before{display:block;}
.stance-image>div:nth-child(1)>aside>img{width:100%; height:100%;}
.stance-image>div:nth-child(1)>aside>span{position:absolute; bottom:58px; left:28px; right:28px}
.stance-image>div:nth-child(1)>aside>span>b,
.stance-image>div:nth-child(1)>aside>span>p{color:#fff;}
.stance-image>div:nth-child(2){width:64%; height:280px;}
.stance-image>div:nth-child(2)>aside>img{height:100%;}
.stance-image>div:nth-child(2)>aside>span{width:58%}
.stance-image>div:nth-child(3),
.stance-image>div:nth-child(4){width:32%; height:320px;}
.stance-image>div:nth-child(3)>aside>img,
.stance-image>div:nth-child(4)>aside>img{height:50%;}
@media(max-width:1200){
.stance{padding:38px 0;}
}
@media(max-width:992px){
.stance-image>div:nth-child(1),
.stance-image>div:nth-child(2){width:100%; height:auto;}
.stance-image>div:nth-child(1)>aside>span{position:relative; bottom:auto; left:auto; right:auto;}
.stance-image>div:nth-child(3),
.stance-image>div:nth-child(4){width:50%;}
}
@media(max-width:767px){
.stance{padding:18px 0;}
.stance-image{margin:18px -4px 0 -4px;}
.stance-image>div{padding:4px;}
.stance-image>div>aside{padding:12px;} 
.stance-image>div:nth-child(2)>aside>span{width:100%}
.stance-image>div:nth-child(2)>aside>img{height:50%;}
.stance-image>div:nth-child(3),
.stance-image>div:nth-child(4){width:100%; height:auto;}
}

.service{padding:58px 0;}
.service-title{text-align:center;}
.service-title h2{font-size:32px; line-height:1; font-weight:bold; margin-bottom:6px; color:#1258af;}
.service-title b{text-align:center; padding:8px 0; display:block; position:relative; overflow:hidden}
.service-title b:before,
.service-title b:after{width:200px; height:1px; position:absolute; content:''; right:50%; margin-right:18px; bottom:50%; background:#d8d8d8;}
.service-title b:after{left:50%; margin:0 0 0 18px}
.service-title b i{font-size:18px; color:#1258af;}
.service-title p{font-size:16px; color:#686868;}
@media(max-width:767px){
.service-title h2{font-size:26px;}
.service-title b{padding:4px 0;}
.service-title b:before,
.service-title b:after{width:120px;}
.service-title p{font-size:14px;}
}



.service-content{margin:38px 0 0;display: flex;flex-wrap: wrap;justify-content: space-evenly;}
.service-content:after{display:block; content:''; clear:both;}  
.service-li{float:left; width:25%; text-align:center; background:#fafafa; transition:.3s; -moz-transition:.3s; -webkit-transition:.3s;}
.service-li:nth-child(2n-1){background:#f0f0f0;}
.service-li>a{display:block; overflow:hidden; position:relative;}
.service-li>a>img{display:block; width:100%;}
.service-li b{display:block;}
.service-li b>a{font-size:22px;}
.service-li i{font-style:normal; font-size:18px; display:block; color:#686868;}
.service-li i:after{width:38px; height:2px; content:''; display:block; margin:10px auto 14px auto; background:#1258af;}
.service-li p{color:#686868;}
.service-li span{display:block; padding:8px 10px;}
.service-li:hover{background:#1258af;}
.service-li:hover b>a,
.service-li:hover i,
.service-li:hover p{color:#fff;}
.service-li:hover i:after{background:#fff;}
@media(max-width:1200px){
.service{padding:38px 0;}
}
@media(max-width:992px){
.service-li{width:50%;}
.service-li span{padding:18px;}
}
@media(max-width:767px){
.service{padding:18px 0;}
.service-content{margin:18px 0 0;}

.service-li{width:50%;}
.service-li span{padding:12px;}
}

.employ{padding:58px 0; background:#f8f8f8;}
.employ-title{text-align:center;}
.employ-title h2{font-size:32px; line-height:1; font-weight:bold; margin-bottom:6px; color:#1258af;}
.employ-title b{text-align:center; padding:8px 0; display:block; position:relative; overflow:hidden}
.employ-title b:before,
.employ-title b:after{width:200px; height:1px; position:absolute; content:''; right:50%; margin-right:18px; bottom:50%; background:#d8d8d8;}
.employ-title b:after{left:50%; margin:0 0 0 18px}
.employ-title b i{font-size:18px; color:#1258af;}
.employ-title p{font-size:16px; color:#686868;}
@media(max-width:767px){
.employ-title h2{font-size:26px;}
.employ-title b{padding:4px 0;}
.employ-title b:before,
.employ-title b:after{width:120px;}
.employ-title p{font-size:14px;}
}
.employ-content{margin:38px 0 0;}
.employ-content:after{display:block; content:''; clear:both;}  
.employ-item{float:left; width:25%; overflow:hidden;}
.employ-item a{display:block; overflow:hidden; position:relative;}
.employ-item a>img{display:block; width:100%; height:auto;}
.employ-item aside{position:absolute; top:0; right:0; bottom:0; left:0; text-align:center; color:#fff; transition:.3s; background:rgba(0,0,0,.18); display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-o-box; display:box; 
-webkit-box-pack:center; -moz-box-pack:center; -ms-flex-pack:center; -o-box-pack:center; box-pack:center; 
-webkit-box-align:center; -moz-box-align:center; -ms-flex-align:center; -o-box-align:center; box-align:center;}
.employ-item aside>span{display:block; padding:28px;}
.employ-item aside>span>img{width:auto; transition:all 0.3s ease 0s;}
.employ-item aside>span>h3{display:block; overflow:hidden; font-size:20px; padding-top:8px; text-shadow:0 0 8px #000;}
.employ-item aside>span>p{display:block; overflow:hidden; height:0; transition:.3s; margin:0; color:#f0f0f0;}
.employ-item aside>span>u{display:block; overflow:hidden; height:0; transition:.3s; text-decoration:none;}
.employ-item aside>span>u>b{display:inline-block; border-radius:3px; font-weight:normal; padding:8px 18px; background:#fff; color:#1258af;}
.employ-item a:hover aside{background:#1258af;}
.employ-item a:hover aside>span>img{transform:rotate(360deg);}
.employ-item a:hover aside>span>h3{text-shadow:none;}
.employ-item a:hover aside>span>p{height:48px; margin:6px 0 18px 0;}
.employ-item a:hover aside>span>u{height:40px;}
@media (max-width:992px){
.employ{padding:38px 0;}
.employ-item{width:50%;}
}
@media (max-width:767px){
.employ{padding:18px 0;}
.employ-content{margin:18px 0 0;}
.employ-item aside>span>h3{font-size:16px;}
.employ-item a:hover aside>span>p,
.employ-item a:hover aside>span>u{display:none;}
}

.news{padding:58px 0;}
.news-title{text-align:center;}
.news-title h2{font-size:32px; line-height:1; font-weight:bold; margin-bottom:6px; color:#1258af;}
.news-title b{text-align:center; padding:8px 0; display:block; position:relative; overflow:hidden}
.news-title b:before,
.news-title b:after{width:200px; height:1px; position:absolute; content:''; right:50%; margin-right:18px; bottom:50%; background:#d8d8d8;}
.news-title b:after{left:50%; margin:0 0 0 18px}
.news-title b i{font-size:18px; color:#1258af;}
.news-title p{font-size:16px; color:#686868;}
@media(max-width:767px){
.news-title h2{font-size:26px;}
.news-title b{padding:4px 0;}
.news-title b:before,
.news-title b:after{width:120px;}
.news-title p{font-size:14px;}
}
.news-content{display:block; margin:28px -18px 0 -18px;}
.news-content:after{display:block; content:''; clear:both;}  
.news-item{float:left; width:50%; padding:18px;}
.news-list{border:1px solid #e8e8e8; background:#fff;}
.news-list:after{display:block; content:''; clear:both;}
.news-name{line-height:58px; border-bottom:1px solid #e8e8e8;}
.news-name:after{display:block; content:''; clear:both;}
.news-name i{float:left; line-height:inherit; font-size:24px; padding:0 12px 0 28px; color:#1258af;}
.news-name b{float:left; font-size:20px;}
.news-name a{float:right; line-height:32px; padding:0 14px; margin:12px 12px 0 0; border-radius:3px; color:#fff; border:1px solid #1258af; background:#1258af;}
.news-name a:hover{background:#fff; color:#1258af;}
.news-name a u{text-decoration:none; padding-left:4px;}
.news-text{padding:28px;}
.news-first{padding-bottom:18px;}
.news-first:after{display:block; content:''; clear:both;}
.news-first>a{float:left; overflow:hidden; margin-right:18px;}
.news-first>a>img{display:block; height:124px; transition:.3s;}
.news-first>a:hover>img{transform:scale(1.08);}
.news-first span{display:block; overflow:hidden;}
.news-first span i{display:block; font-style:normal; line-height:1; font-size:28px; color:#1258af;}
.news-first span h3{display:block; margin:12px 0 6px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.news-first span p{margin:0; height:50px; overflow:hidden; color:#686868;}
.news-li{padding:0 88px 8px 18px; margin-top:8px; position:relative; border-bottom:1px dashed #e8e8e8;}
.news-li:before{position:absolute; top:8px; left:0; width:6px; height:6px; border-radius:6px; content:''; background:#1258af;}
.news-li a{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
.news-li i{position:absolute; top:0; right:0; font-style:normal; color:#686868;}
@media(max-width:1200px){
.news{padding:38px 0;}
.news-content{margin:28px -8px 0 -8px;}
.news-item{padding:8px;}
}
@media(max-width:992px){
.news-item{width:100%;}
}
@media(max-width:767px){
.news{padding:18px 0;}
.news-content{margin:16px -4px 0 -4px;}
.news-name i{font-size:22px; padding:0 8px 0 18px;}
.news-item{padding:4px;}
.news-first{padding-bottom:12px;}
.news-text{padding:12px;}
}
