@charset "utf-8";
/* CSS Document */

/*banner*/
#i_banner { position: relative; z-index: 0;}
#i_banner .swiper-slide { position: relative; z-index: 0;}
#i_banner .pic { position: relative; z-index: 0; padding-top: 878px;}
#i_banner .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}

#i_banner .txtb { position: absolute; left: 0; top: 6.7vw; bottom: 6.7vw; right: 0; right: 0;
display: flex; justify-content: center; align-items: center;}
#i_banner .txtb .txt { width: 51%; margin: 0 auto 0 0; text-align: left; color: rgba(255,255,255,0.9); 
filter:alpha(opacity=0);-moz-opacity:0; opacity:0;
transition: all 1s;
-webkit-transition:all 1s;
transform: translate(0,90px);
-ms-transform: translate(0,90px);
-webkit-transform: translate(0,90px);}
#i_banner .txtb .txt .name {font-size:40px; font-weight: bold; font-style: italic; line-height: 1.5;}
#i_banner .txtb .txt .intro { margin-top: 4%; line-height: 1.25; font-size: 24px; max-height: 2.5em;
overflow: hidden;font-style: italic;}
#i_banner .txtb .txt .btn { margin-top: 6%;}
#i_banner .swiper-slide-active  .txtb .txt {
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
transform: translate(0,0);
-ms-transform: translate(0,0);
-webkit-transform: translate(0,0);}

#i_banner .swiper-pagination { left: 9.3%; right: 9.3%; width: auto;
 bottom: 2.43em; display: flex; justify-content: flex-start; align-items: center;}
 #i_banner .swiper-pagination-bullet { flex: 1; height: 1px;
 -moz-border-radius:0; -webkit-border-radius:0; border-radius:0;
 background-color: #fff; margin: 0 !important;
 filter:alpha(opacity=60);-moz-opacity:0.6; opacity:0.6;
}
#i_banner .swiper-pagination-bullet-active {height: 2px; background-color: #058d7f;
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;}

#i_banner .btnNPW { position: absolute; right: 50%; margin-right: -3em; bottom: 2.6em;
z-index: 1000;height: 2.8em; width:8em; text-align: center; }
#i_banner .btnNext,#i_banner .btnPrev { position: relative;
	cursor: pointer; display: inline-block;
	width: 2.8em; height: 2.8em; margin:0 0.4em;
	border: 1px solid #fff;
	transition: all 0.5s;
	-webkit-transition:all 0.5s;
	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
} 
#i_banner .btnPrev { left: 5.2%; right: auto;
transform: rotate(180deg);
-ms-transform: rotate(180deg); 
-webkit-transform: rotate(180deg); 
}
#i_banner .btnNext:hover,
#i_banner .btnPrev:hover {
	background: linear-gradient(to bottom,  rgba(29,140,196,1) 0%,rgba(0,92,172,1) 100%); 
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
#i_banner .btnPrev::before,
#i_banner .btnNext::before{
	content: ""; display: block;position: absolute; z-index: 1;
top: 0; left: 0; width: 100%; height: 100%;
background:  url(../images/arrow.png) center center no-repeat;
	background-size: 26.6% auto;}
#i_banner  .swiper-button-disabled,
#i_banner  .swiper-button-disabled:hover{  background: transparent;
filter:alpha(opacity=50);-moz-opacity:0.5; opacity:0.5;}

#i_banner .num { position: absolute; z-index: 1000; left: 9.3%; color: #fff;bottom: 2.6em;}
#i_banner .num span.cur { font-size: 1.5em;}

 @media only screen and (max-width:1920px) {
#i_banner .pic { padding-top: 45.72%;}
#i_banner .txtb .txt .name {font-size: 2vw; }
#i_banner .txtb .txt .intro { font-size: 1.25vw;}
}
 @media only screen and (max-width:828px) { 
#i_banner .con { width: auto; margin: 0 1em;}
#i_banner .pic { position: relative; z-index: 0; padding-top: 80%;}
#i_banner .txtb .txt { width: auto;}
#i_banner .txtb .txt .name { font-size: 4.8vw;}
#i_banner .txtb .txt .intro { font-size: 2vw;}
#i_banner .txtb .txt .btn { font-size: 2vw; margin-top: 1.8em;}
#i_banner .num { font-size: 2vw; }
#i_banner .btnNPW  { font-size: 2vw; }
#i_banner .swiper-pagination { font-size: 2vw;}
}

.servBox { max-width: 1920px; margin: 0 auto;display: flex; justify-content: space-between;
  align-items: flex-start;}
.servBox .iTit .name {padding-left: 0.7em; background-size:auto 0.277em ;}
 .servBox .conL { position: relative; z-index: 1; width: 46%; margin-left: 9.42%; padding-top: 5.2%;}
 .servBox .conL .txtb {text-align: left;}
 .servBox .conL .txtb .name { font-weight: bold;}
 .servBox .conL .txtb .intro { margin-top: 1.5em;line-height: 1.2;
 height: auto; overflow: hidden;}
 .servBox .conL .btnW { margin-top: 2.5em;}
 
 .servBox .conL .picb_1 { position: relative; z-index: 0; margin-top: 20.38%; width: 66.5%; margin-left: -20.38%;}
 .servBox .conL .pic_1 { position: relative; z-index: 0;padding-top: 49.5%; width: 100%;
   overflow: hidden;}
 .servBox .conL .pic_1 img { position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: cover;
 transition: all 0.5s;
 -webkit-transition:all 0.5s;}
 .servBox .conL .pic_1:hover img {
 	 -ms-transform: scale(1.05, 1.05);
 	 -webkit-transform: scale(1.05, 1.05);
 	 transform: scale(1.05, 1.05);
 }
 
 .servBox .conL .picb_2 { position: absolute; z-index: 0; bottom: 0; right: 0; width: 75.2%; margin-right: -20.38%;}
 .servBox .conL .pic_2 { position: relative; z-index: 0;padding-top: 64.1%; width: 100%;
  overflow: hidden;}
 .servBox .conL .pic_2 img { position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: cover;
 transition: all 0.5s;
 -webkit-transition:all 0.5s;}
 .servBox .conL .pic_2:hover img {
 	 -ms-transform: scale(1.05, 1.05);
 	 -webkit-transform: scale(1.05, 1.05);
 	 transform: scale(1.05, 1.05);
 }
 
 .servBox .conR { width: 40.2%; margin-top: -4.3%;}
 .servBox .conR .pic { position: relative; z-index: 0;  padding-top: 108.8%;
 overflow: hidden;}
 .servBox .conR .pic img { position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: cover; 
transition: all 0.5s;
-webkit-transition:all 0.5s;}
.servBox .conR .pic:hover img {
	 -ms-transform: scale(1.05, 1.05);
	 -webkit-transform: scale(1.05, 1.05);
	 transform: scale(1.05, 1.05);
}
 
@media only screen and (max-width:1200px) {
	.servBox .conL {  margin-left: 4.5%}
}
  @media only screen and (max-width:828px) {
 	 .servBox { display: block;}
 	 .servBox .conL { width: auto; margin-left: 1em; margin-right: 1em;}
 	 .servBox .conR { margin-top: 1.5em; width: auto;}
  }

.newBox { padding: 3em 0 4.25em;}
.newBox .con { overflow: visible;}
.swiper-new  { position: relative; z-index: 0; margin-top: 2.5em;}
.swiper-new .lib { padding:3.5em 10.7% 6.5em; background-color: #f8f8f8;
display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch;}
.swiper-new .swiper-slide-active .lib {padding:0; flex-direction: column-reverse;}
.swiper-new .txtb { padding: 0; text-align: left; }
.swiper-new .date .dd { font-weight: lighter; font-size: 3.75em;  color: #1a6eb5; line-height: 1.2;}
.swiper-new .date .yymm { font-size: 0.87em; color: #333; font-weight: lighter; line-height: 1.2;}
.swiper-new .swiper-slide-active .date .dd { position: absolute; bottom: 3.2rem; line-height: 1em; right: 7.2%;}
.swiper-new .swiper-slide-active .date .yymm {position: absolute; bottom: 3.4rem; left: 7.2%;}
.swiper-new .swiper-slide-active .txtb { padding:2.3em 7.2% 13em;}
.swiper-new .swiper-slide-active .txtb .name{ margin-top: 0;}
.swiper-new .txtb .name { margin-top: 9.8%; color: #333; 
line-height: 1.25em; height: 3.75em; overflow: hidden; overflow: hidden;
  text-overflow:ellipsis;
  display:-webkit-box; 
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3; }
.swiper-new .picb { margin:6em auto 0 0; width: 80.4%;}
.swiper-new .swiper-slide-active .picb {margin:0 auto 0 0;  width: 100%;}
.swiper-new .pic {position: relative; z-index: 0; padding-top: 74.7%; height: 0; 
overflow: hidden;}
.swiper-new .pic img { position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: cover;
 transition: all 0.5s;
 -webkit-transition:all 0.5s;
}
.swiper-new .pic:hover img {
	-ms-transform: scale(1.05, 1.05);
	-webkit-transform: scale(1.05, 1.05);
	transform: scale(1.05, 1.05);
}
.swiper-new .btnNext,.swiper-new .btnPrev { position: absolute;
	cursor: pointer; display: block; top: 50%; margin-top: -1.45em;
	width: 2.8em; height: 2.8em;
	border: 1px solid #cfcfcf;
	transition: all 0.5s;
	-webkit-transition:all 0.5s;
	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
} 
.swiper-new .btnNext {right: -4.5em;}
.swiper-new .btnPrev { left: -4.5em; 
transform: rotate(180deg);
-ms-transform: rotate(180deg); 
-webkit-transform: rotate(180deg); 
}
.swiper-new .btnNext:hover,
.swiper-new .btnPrev:hover {background:#1a6eb5;  border: 1px solid #1a6eb5;
}
.swiper-new .btnPrev::before,
.swiper-new .btnNext::before{
	content: ""; display: block;position: absolute; z-index: 1;
top: 0; left: 0; width: 100%; height: 100%;
background:  url(../images/arrow_4.png) center center no-repeat;
	background-size: 26.6% auto;}
.swiper-new .btnNext:hover::before,
.swiper-new .btnPrev:hover::before { background-image:url(../images/arrow.png) ;}
.swiper-new  .swiper-button-disabled,
.swiper-new  .swiper-button-disabled:hover{  background: transparent;
filter:alpha(opacity=50);-moz-opacity:0.5; opacity:0.5;}
@media only screen and (max-width:828px) {
	.swiper-new { margin-left: 2.5em; margin-right: 2.5em;}
	.swiper-new .btnNext,.swiper-new .btnPrev{ width: 2em; height: 2em; margin-top: -1em;}
	.swiper-new .btnNext {right: -3em;}
	.swiper-new .btnPrev { left: -3em; }
}







.aboutBox { padding: 5em 0 8em; position: relative; z-index: 0;
	background: #2c75ba; color: #fff;
}
.aboutBox .aboutBg { position: absolute; z-index: 0; top: 0; left: 0; width: 100%; height: 100%;
 object-fit: cover;}
 
.aboutBox .aboutBg .videoBox { position: absolute; z-index: 0; left: 0; top: 0;
     width: 100%; height: 100%;   background-color: #000; overflow: hidden;}
.aboutBox .aboutBg .videoBox video { position: absolute; z-index: 0; left: 0; top: 0;
   width:100%; height: 100%; object-fit: cover;}
.aboutBox .aboutBg .videoBox .videoPic { position: absolute; z-index: 1;
 left: 0; top: 0;
   width: 100%; height: 100%;
transition: all 0.5s;
-webkit-transition:all 0.5s;}
.aboutBox:hover .aboutBg .videoBox .videoPic {
	-ms-transform: scale(1.05, 1.05);
	-webkit-transform: scale(1.05, 1.05);
	transform: scale(1.05, 1.05);
}
.aboutBox .aboutBg .videoBox .btnPlay{ position: absolute; z-index: 2; 
   left: 50%; top: 50%; margin-top: -4.1%; margin-left: -4.1%; 
   width:8.3%; padding-top: 8.3%; height: 0; cursor: pointer;
   background: url(../images/play.png) center center no-repeat;
   background-size:contain;  }
.aboutBox .aboutBg .videoBox.curPlay .videoPic { display: none; }
.aboutBox .aboutBg .videoBox.curPlay .btnPlay {display: none; }
   
.aboutBox .aboutBg .videoBox .videoPic { display: block; }
.aboutBox .aboutBg .videoBox .btnPlay {display: block; }

.aboutBox .picBg { position: absolute; z-index: 0; top: 0; left: 0; width: 100%; height: 100%;
 object-fit: cover;}
.aboutBox .con { position: relative; z-index: 1;}
.aboutBox .con .iTit .name { color: #fff;
background-image: url(../images/dot.png);}
.aboutBox .con .btnMore { color: #fff;
background-image: url(../images/arrow_2_white.png);}
.aboutBox .conA { display: flex; justify-content: space-between; align-items:center;}
.aboutBox .conL { width: 49.5%; text-align: left;}
.aboutBox .conL .name{ margin: 1em 3.6% 0; font-weight: bold;}
.aboutBox .conL .intro{ margin: 1.2em 3.6% 0; font-weight: lighter; line-height: 1.2;}
.aboutBox .conL .list { padding-top: 4.4%;}
.aboutBox .conL .list ul { flex-wrap: wrap; display: flex; justify-content: space-between; align-items: stretch;}
.aboutBox .conL .list li { margin-top: 2.4%; width: 48.5%; background-color:rgba(238,244,249,.5);}
.aboutBox .conL .list .lib { padding: 5.3% 7.4% 5%; text-align: left;}
.aboutBox .conL .list .num { line-height: 1.3; color: #1d8cc4;}
.aboutBox .conL .list .num b { vertical-align: top;font-size: 2.25em;}
.aboutBox .conL .list .num i { vertical-align: top; font-style: normal; font-size: 1.1em;}
.aboutBox .conL .list .info{ font-weight: lighter; color: #333; line-height: 1.2;}
.aboutBox .conR { width: 47.6%; display: flex; justify-content: center; align-items: center;}
.aboutBox .conR .btnPlay { display:block ;  cursor: pointer; width: 4.6em; height: 4.6em;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
border: 1px dashed #fff;
background: url(../images/play.png) center center no-repeat;
background-size: 86.5% 86.5%;
}
.aboutBox .conR .btnPlay.curPlay {display: none;}
.aboutBox:hover .conR .btnPlay.curPlay { display: block; background-image: url(../images/btn_pause.png);}

@media only screen and (max-width:828px) {
	.aboutBox .conA { display: block;}
	.aboutBox .conL { width: 100%;}
	.aboutBox .conR { width: 100%; margin-top: 3em;}
}




.picbox { padding: 5em 0 8em; position: relative; z-index: 0;
	background: #2c75ba; color: #fff; height:830px;
}
.picbox .aboutBg { position: absolute; z-index: 0; top: 0; left: 0; width: 100%; height: 100%;
 object-fit: cover;}
 
.picbox .aboutBg .videoBox1 { position: absolute; z-index: 0; left: 0; top: 0;
     width: 100%; height: 100%;   background-color: #000; overflow: hidden;}
.picbox .aboutBg .videoBox1 video { position: absolute; z-index: 0; left: 0; top: 0;
   width:100%; height: 100%; object-fit: cover;}
.picbox .aboutBg .videoBox1 .videoPic { position: absolute; z-index: 1;
 left: 0; top: 0;
   width: 100%; height: 100%;
transition: all 0.5s;
-webkit-transition:all 0.5s;}
.picbox:hover .aboutBg .videoBox1 .videoPic {
	-ms-transform: scale(1.05, 1.05);
	-webkit-transform: scale(1.05, 1.05);
	transform: scale(1.05, 1.05);
}
.picbox .aboutBg .videoBox1 .btnPlay{ position: absolute; z-index: 2; 
   left: 50%; top: 50%; margin-top: -4.1%; margin-left: -4.1%; 
   width:8.3%; padding-top: 8.3%; height: 0; cursor: pointer;
   background: url(../images/play.png) center center no-repeat;
   background-size:contain;  }
.picbox .aboutBg .videoBox1.curPlay .videoPic { display: none; }
.picbox .aboutBg .videoBox1.curPlay .btnPlay {display: none; }
   
.picbox .aboutBg .videoBox1 .videoPic { display: block; }
.picbox .aboutBg .videoBox1 .btnPlay {display: block; }

.picbox .picBg { position: absolute; z-index: 0; top: 0; left: 0; width: 100%; height: 100%;
 object-fit: cover;}
.picbox .con { position: relative; z-index: 1;}
.picbox .con .iTit .name { color: #fff;
background-image: url(../images/dot.png);}
.picbox .con .btnMore { color: #fff;
background-image: url(../images/arrow_2_white.png);}
.picbox .conA { display: flex; justify-content: space-between; align-items:center;}
.picbox .conL { width: 49.5%; text-align: left;}
.picbox .conL .name{ margin: 1em 3.6% 0; font-weight: bold;}
.picbox .conL .intro{ margin: 1.2em 3.6% 0; font-weight: lighter; line-height: 1.2;}
.picbox .conL .list { padding-top: 4.4%;}
.picbox .conL .list ul { flex-wrap: wrap; display: flex; justify-content: space-between; align-items: stretch;}
.picbox .conL .list li { margin-top: 2.4%; width: 48.5%; background-color: #eef4f9;}
.picbox .conL .list .lib { padding: 5.3% 7.4% 5%; text-align: left;}
.picbox .conL .list .num { line-height: 1.3; color: #1d8cc4;}
.picbox .conL .list .num b { vertical-align: top;font-size: 2.25em;}
.picbox .conL .list .num i { vertical-align: top; font-style: normal; font-size: 1.1em;}
.picbox .conL .list .info{ font-weight: lighter; color: #666; line-height: 1.2;}
.picbox .conR { width: 100%; display: flex; justify-content: center; align-items: center; height:100%; margin-top:0;}
.picbox .conR .btnPlay { display:block ;  cursor: pointer; width: 4.6em; height: 4.6em;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
border: 1px dashed #fff;
background: url(../images/play.png) center center no-repeat;
background-size: 86.5% 86.5%;z-index: 99999;
}
.picbox .conR .btnPlay.curPlay {display: none;}
.picbox:hover .conR .btnPlay.curPlay { display: block; background-image: url(../images/btn_pause.png);}

@media only screen and (max-width:828px) {
	.picbox .conA { display: block;}
	.picbox .conL { width: 100%;}
	.picbox .conR { width: 100%; margin-top: 3em;}
	.picbox{height:300px;}
}
 
 .proBox { padding: 4.9em 0 5em;}
 .proList { margin-top: 2em;}
 .proList ul { margin: -3.5% auto 0;  display: flex; flex-wrap: wrap;
 justify-content: flex-start; align-items: stretch;}
 .proList ul li { width: 24.3%; margin-top:3.5%; margin-right: 0.93%;
  background: #f8f7f7 url(../images/pro_bg.jpg) center center no-repeat;
  background-size:100% 100%;
  transition: all 0.5s;
  -webkit-transition:all 0.5s;
   overflow: hidden;
   position: relative; z-index: 0;}
 .proList ul li:nth-child(4n) { margin-right: 0;}
 .proList ul li::after { content: ""; display: block;
	 position: absolute; z-index: 0; left: 0; bottom: 0; width: 0;
	 height: 1px;
	 transition: all 0.5s;
	 -webkit-transition:all 0.5s;
	  background: linear-gradient(to right,  rgba(25,109,181,1) 0%,rgba(92,188,161,1) 100%); 
	  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ }
.proList ul li:hover::after {width: 100%; }
.proList .lib { position: relative; z-index: 1; display: block; cursor: pointer;
  padding: 5.2% 5.2% 7% 5.2%; }
.proList .pic { padding-top: 86.5%; position: relative; z-index: 1;}
.proList .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	 display: block;  object-fit: cover;  
transition: all 0.5s;  
-webkit-transition:all 0.5s;}
.proList .pic:hover img {
	-ms-transform: scale(1.05, 1.05);
	-webkit-transform: scale(1.05, 1.05);
	transform: scale(1.05, 1.05);
}
.proList .txt { display: flex; justify-content: space-between; align-items: center;
  padding: 0.5em 5.5% 0 0;} 
.proList .txt .name { margin-left: -5.1%; color: #333; flex: 1; text-align: left; }
.proList .txt .name::before { content: ""; display: inline-block; vertical-align: middle;
height: 1px; width: 1em; background-color: #1a6eb5;}
.proList .arrow { width: 0.75em; height: 0.75em;
background: url(../images/arrow_3.png) center center no-repeat;
background-size:contain ;
  transition: all 0.5s;
  -webkit-transition:all 0.5s;}
.proList li:hover .arrow {transform: translate(6px,0);
	-ms-transform: translate(6px,0); /* IE 9 */
	-webkit-transform: translate(6px,0); /* Safari and Chrome */}
.proList .txt .name a:hover { color: #333;}


.videovideo1{ display:none}


 @media only screen and (max-width:828px) {
     .videovideo{ display:none}
     .videovideo1{ display:block}
	 .proList ul li { width: 49%; margin-right: 2%;}
	 .proList ul li:nth-child(2n) { margin-right: 0;}
	 .proList .txt { padding: 1.2em 5% 0;} 
 }