@charset "utf-8";
/* CSS Document */


#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:48%;}
#i_banner .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}
#i_banner .pic2{ display:none;}
#i_banner .txtb { position: absolute; left: 0; top: 4.7vw; bottom: 7.7vw; right: 0; right: 0;
display: flex; justify-content: center; align-items: center;}
#i_banner .txtb .txt { width:62%; 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 .comp { line-height: 1.2;  font-weight: lighter;}
#i_banner .txtb .txt .name { margin-top: .3em;  font-weight: bold; line-height: 1.2;}
#i_banner .txtb .txt .intro { margin-top: .4em; line-height: 1.2;  font-weight: lighter;
overflow: hidden; height: 1.2em;}
#i_banner .txtb .txt .btnWhite { margin-top: 1.9em;}

#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 { height: 6.28em; padding: 0 2.8%;
 bottom: 0; border-top: 1px solid rgba(255,255,255,0.5);
   display: flex; justify-content: flex-start; align-items: center;}
#i_banner .swiper-pagination-bullet { width: 0.8em; height: 0.8em;
 background-color: #fff; margin: 0 0.4em !important;
  filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
}
#i_banner .swiper-pagination-bullet-active { position: relative; z-index: 0;
	 filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
	 background-color: #0075be;
}


#i_banner .btnNPW { position: absolute; right:0; margin-right: 2.8%;  bottom: 1.1em;
z-index: 1000;height: 2.8em; width:7.9em; text-align: center; }
#i_banner .btnNext,#i_banner .btnPrev { position: relative;
	cursor: pointer; display: inline-block;
	width:1.6em; height: 1.6em; margin:0 0.1em;
	transition: all 0.5s;
	-webkit-transition:all 0.5s;
	-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
	background: url(../images/arrow_2.png) center center no-repeat;
	background-size:contain;
} 
#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 {
filter:alpha(opacity=80);-moz-opacity:0.8; opacity:0.8;
}

#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:828px) { 
#i_banner .con { width:  90vw; margin: 0 5vw;}
#i_banner .pic{display: none;}
#i_banner .pic2 {display: block; position: relative; z-index: 0; }/*padding-top: 80%;*/
#i_banner .pic2 img {width: 100%;height: 100%;object-fit: cover;}
#i_banner .txtb { width: 100vw;}
#i_banner .txtb .txt { width: 80%; right: auto; left: 0;}
#i_banner .txtb .txt .name { font-size: 5.8vw;}
#i_banner .txtb .txt .intro { font-size:3.4vw;}
#i_banner .txtb .txt .btn { font-size: 2vw; margin-top: 1.8em;}
#i_banner .btnNPW  { font-size: 2vw; }
#i_banner .swiper-pagination { font-size: 2vw;}
#i_banner .swiper-pagination-bullet { width: 6px; height: 6px;}
}
 /*banner*/
 
.aboutBox { padding: 5.8em 0 ; overflow:hidden;}
.aboutBox .tit { display: flex; justify-content: space-between; align-items: center;}
.aboutBox .tit .name { font-weight: bold;}
.aboutBox .tit .more { color: #666;}
.aboutBox .tit .more:hover { color: #0075be;}


.aboutBox .conA{ display: flex; justify-content: space-between; align-items: center;}
.aboutBox .conL {margin-top: 0em; width: 46%;  }
.aboutBox .conR {margin-top: 0em; width: 50%; }

.aboutBox .conL .pic {  width: 100%; position: relative; z-index: 0; padding-top: 52%;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;overflow: hidden;
 }
.aboutBox .conL .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}

.aboutBox .conR { text-align: left; }
.aboutBox .conR .teit{ color: #0066cb;   font-weight: 500; margin:1em 0;}  .aboutBox .conR .teit span{ padding:0.6em 0; border-bottom:2px solid #0066cb; }
.aboutBox .conR .name { color: #11b2a4b; font-weight: bold;}
.aboutBox .conR .name2 { margin-top: 0.2em; color: #1b2a4b;}
.aboutBox .conR .intro { margin-top: 1em; color: #666; line-height: 1.7;}

.aboutBox .conB {display: flex; justify-content: space-between;  padding: 2em 0 0 0;}
.aboutBox .conB  .list { width:100%;}
.aboutBox .conB  .list ul { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start;}
.aboutBox .conB  .list li {  width: 24%; margin-right: 1%; padding:2em 0;  background-color:#f5f6f8; -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;}
.aboutBox .conB  .list  .teia{ font-weight:bold; color:#0066cb; margin:0.6em 0;}
.aboutBox .conB  .list  .mrozi{ margin:0 0.6em;}
 @media only screen and (max-width:828px) { 
 .aboutBox { padding: 3.8em 0 ; overflow:hidden;}
 .aboutBox .conA { display: block;}
.aboutBox .conL { width: 100%;}
.aboutBox .conR { width: 100%;}
.aboutBox .conB  .list li{ width: 49%; margin-right: 1%; margin-bottom:1%;}
 }
 
 /*about*/
 
.txtbra .teit{ color: #0066cb;   font-weight: 500; margin:1em 0;}  .txtbra .teit span{ padding:0.6em 0; border-bottom:2px solid #0066cb; }
.txtbra .name { color: #fff; font-weight: bold;}
.txtbra .name2 { margin-top: 0.2em; color: #fff;}

.txtbra2 .teit{ color: #0066cb;   font-weight: 500; margin:1em 0;}  .txtbra2 .teit span{ padding:0.6em 0; border-bottom:2px solid #0066cb; }
.txtbra2 .name { color: #1b2a4b; font-weight: bold;}
.txtbra2 .name2 { margin-top: 0.2em; color: #5c6b80;}

.datatBox { padding: 3.8em 0 7.8em 0 ; overflow:hidden;}
.datatBox   .list ul { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start;}
.datatBox   .list li { margin-top: 4.6em; width:19.5%; border-right: 1px solid #dae1e7; 
text-align:  center; color: #666;}
.datatBox  .list li:nth-child(5n) { border-right: none;}

.datatBox  .counter{font-size:4.8rem; color:#0066cb; font-weight:bold;}
.datatBox  .i{  color:#0066cb; font-weight:bold;}
@media screen and (max-width:800px){
.datatBox   .list li{width:33%; margin-top: 2.6em;} .datatBox  .list li:nth-child(3n) { border-right: none;} .datatBox  .list li:nth-child(5n) { border-right: none;} .datatBox  .counter{font-size:3rem; }
}
 /*data*/
 




.solutiBox{ padding: 3.8em 0 5.8em 0 ; background:#1a2948; } .solutiBox  .list{ width:100%;}
.solutiBox   .list ul { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start;}
.solutiBox  .list li { margin-top: 2.6em; width:31.3%; margin-right:2%;  background-color: #16243f; color:#fff; position:relative;
-moz-border-radius:0.4em; -webkit-border-radius:0.4em; border-radius:0.4em;
transition: all 0.5s;
-webkit-transition:all 0.5s; text-align: left;  }
.solutiBox  .list li:nth-child(3n) { margin-right: 0;}

.solutiBox  .list li:hover {border: 1px solid #0066cb; background-color: #0066cb;  
-moz-box-shadow: 0 0 0.8em rgba(0, 102, 204, .26);
-webkit-box-shadow: 0 0 0.8em rgba(0, 102, 204, .26);
box-shadow: 0 0 0.8em rgba(0, 102, 204, .26);}


.solutiBox  .zimena{ position:absolute; left:5%; bottom:5%; color:#fff; width:100%; text-align:left;}
.solutiBox  .list li:hover a{color:#fff;}
.solutiBox .list .pic { display: block; cursor: pointer; position: relative; z-index: 0;padding-top: 60%;}
.solutiBox  .list .pic img { position: absolute; left: 0; top: 0; width:100%; height:100%; opacity: 0.5;  object-fit: cover; -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;}
.solutiBox  .list .pic img:hover{opacity: inherit !important;}
.solutiBox  .list .teia {  line-height:1.2em ;}
.solutiBox  .list .teia { font-weight:bold; text-align: left;}
.solutiBox  .moresd{ margin-top:2em}
	
.solutiBox  .list .nanerm{  line-height:1.3em ;  text-align: left; } 
@media only screen and (max-width:828px) {.solutiBox { padding: 2.8em 0 2.8em 0 ; }  .solutiBox  .list li {margin-top: 1.6em;   width:48%; margin-right:2%;  } .solutiBox  .list li:nth-child(2n) { margin-right:0;} .solutiBox  .list li:nth-child(3n) { margin-right:2%;}
.solutiBox  .list  .font24{font-size: 16px;	}}
/*soluti*/

/*--serverBar--*/
 .serverBar {
 	display:block;
 	position:fixed;
 	z-index:99999999;
 	top: 350px;
 	right: 0px;
 }
 .serverBar li {
 	position:relative;
 	margin-bottom: 5px;
 }
 .serverBar li a {
 	display:block;
 	padding: 5px 5px;
 	width: 48px;
 	height: 48px;
 	text-align:center;
 	color:#666 !important;
 	background:#fff;
 	border:#f0f0f0 solid 1px;
 }
 .serverBar li a>i {
 	display:block;
 	font-size:18px;
 }
 .serverBar li a>span {
 	display:block;
 	font-size:12px;
 }
 .serverBar li:hover a {
 	color:#fff !important;
 	background:#0075be;
 	border-color:#0075be;
 }
 .serverBar li .infos {
 	display:none;
 	position:absolute;
 	left: -166px;
 	padding:10px;
 	background:#fff;
 	border:#f0f0f0 solid 1px;
 	box-shadow:0 0 10px rgba(255, 255, 255, 0.1);
 }
 .serverBar li .tel {
 	top:0;
 }
 .serverBar li .tel dt {
 	font-size:14px;
 	color:#666;
 }
 .serverBar li .tel dd {
 	padding-top:4px;
 	font-size:20px;
 	color: #006633;
 	border-bottom:#f0f0f0 solid 1px;
 }
 .serverBar li .QRcode {
 	bottom:0;
 	overflow:hidden;
 	left:-152px;
 }
 .serverBar li .QRcode .item {
 	overflow:hidden;
 	float: left;
 	margin: 0 5px;
 	width: 120px;
 }
 .serverBar li .QRcode .item i {
 	display:block;
 	margin:0 auto;
 	width:100px;
 }
 .serverBar li .QRcode .item img {
 	display:block;
 	width:100%;
 }
 .serverBar li .QRcode .item p {
 	font-size:14px;
 	color:#666;
 	text-align:center;
 }
 .serverBar li:hover .infos {
 	display:block;
 }
 .serverBar a .icon {
 	margin-top: 4px;
 	display: inline-block;
 	width: 20px;
 	height: 20px;
 	background: url(../images/r_icon.png) center center no-repeat;
 }
 .serverBar a:hover .icon {
 	background: url(../images/r_icon_a.png) center center no-repeat;
 }
 .serverBar a .icon.con, .serverBar a:hover .icon.con {
 	background-position: 0 0;
 }
 .serverBar a .icon.tel, .serverBar a:hover .icon.tel {
 	background-position: -20px 0;
 }
 .serverBar a .icon.vr, .serverBar a:hover .icon.vr {
 	background-position: -40px 0;
 }
 .serverBar a .icon.wx, .serverBar a:hover .icon.wx {
 	background-position: -60px 0;
 }
 .serverBar a .icon.top, .serverBar a:hover .icon.top {
 	background-position: -80px 0;
 }
 #gotop {
 	display: none;
 }
  @media(max-width:768px) {
 .serverBar {
 top: 55%;
 }
 .serverBar li {
 display:none;
 }
 .serverBar li:hover .tel {
 display:none !important;
 }
 .serverBar li:first-child, .serverBar li#backTop {
 display:block;
 }
 .serverBar li a {
 display:block;
 padding: 4px 4px;
 width: 42px;
 height: 42px;
 text-align:center;
 color:#666 !important;
 background:#fff;
 border:#f0f0f0 solid 1px;
 }
 .serverBar a .icon {
  margin: 0;
 }
