/*Internet Explorer 10 并没有对 屏幕的宽度 和 视口（viewport）的宽度 进行区分*/
@-ms-viewport       { width: device-width; }
@-o-viewport        { width: device-width; }
@viewport           { width: device-width; }  
/*Internet Explorer 10 并没有对 屏幕的宽度 和 视口（viewport）的宽度 进行区分 end*/
ul,ol,dl,table,th,tr,td,input,textarea,li,a,div,span,em,i,img{ margin:0; padding:0; border:0;}
a:hover{ text-decoration:none;}
li{ list-style:none;}
/*全局样式*/
html, body {width:100%; margin: 0 auto;}
/*= 清除浮动=*/
.clear{clear: both; height:0px; line-height:0px; font-size:0px; overflow:hidden;display: block;}
.clearfix:after { content: ""; display: block; height: 0px;  clear: both; visibility: hidden; font-size:0px;}
/* Hides from IE-mac \*/
* html .clearfix {height: 0%;}
/* End hide from IE-mac */
*+html .clearfix {min-height: 0%;}

/* 针对IE7 */
* + html .clearfix {min-height:0%;}
.fl {float: left;}
.fr {float: right;}

/*原文件配置*/
.w1200{ width:1400px;max-width:85% ;margin:0 auto;position: relative;}
body {color:#333; }
a{ color:#333;text-decoration: none;}
a:hover{color:#89211b;}
.mt20{margin-top: 20px}
.mt30{margin-top: 30px}
.mt50{margin-top: 50px}
input{outline:none}
em,i{font-style: normal;}

/*纵向居中*/
.v_middle{ vertical-align:middle;}
/*横向居中*/
.te-align{ text-align:center;}
/*相对定位*/
.p_r{ position:relative;}
input::-webkit-input-placeholder{color: #999}
input::-moz-placeholder{color: #999}
input:-moz-placeholder{color: #999}
input:-ms-input-placeholder{color: #999}
.top{background-color: #f0f0f0;height: 30px;line-height: 30px;}
.top .code{height: 30px;padding-right: 15px;background: url(../images/icon2.png) no-repeat right center;position: relative;}
.top .code img{display: inline-block;vertical-align: middle;margin-right: 5px;margin-left: 25px;}
.top .code .erwma{display: none;}
.top .code:hover .erwma{display: block;position: absolute;top: 30px;left: 10px;background-color: #FFF;z-index: 99;}
.top .code:hover .erwma img{margin: 0;width: 110px}
.top .tel{background: url(../images/icon3.png) no-repeat left center;padding-left: 15px;margin-right: 10px;}
.top a{margin-left: 10px;}

.head{background: linear-gradient(to right, #0091d9, #26aca5);}
.head h1{margin-right: 30px;}
.head .search{width: 210px;height:22px;border:1px #00b1ff solid;border-radius: 20px;overflow: hidden;}
.head .search .input{width: 160px;height: 24px;background: none;color: #d0b689;text-indent: 10px;}
.head .search .submit{width: 41px;height: 24px;overflow: hidden;text-indent: -99px;}
.head-nav-bg{
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 120px;
}
.nav{display: flex;}
.nav .m{ position:relative;}
.nav h3{  font-size:100%; font-weight:normal; font-size:16px; overflow:hidden;margin: 0;position:relative;}
.nav h3 a{ display:block;display: block;line-height: 85px;width: 140px;text-align: center;color: #fff; font-weight: bold;position: relative; z-index: 1; font-size: 24px;}
.nav .on h3 a,.nav .m:hover h3 a{color:#fff;}
.nav h3::after{content:'';display:block;position: absolute;top:0;left:0;width:100%;height:100%;opacity: 0;background-image: linear-gradient(45deg, #6df8d4, #00c5ef);transition: all .3s;}
.nav .on h3::after,.nav .m:hover h3::after{opacity:1;}
.nav .sub{ display:none;width:115px; position:absolute; left:0px; top:85px; background:#00b1ff; text-align:center;z-index: 999; }
.nav .sub li{ vertical-align:middle; }
.nav .sub li a{ height:30px; line-height:30px; padding:4px 0;  display:block; color:#fff;font-size: 14px;}
.nav .sub li a:hover{ color:#ff0;}

/* banner */
.banner{ min-width:1000px;  position:relative;  height:600px; overflow:hidden;  }
.banner .bd{ position:relative; z-index:0;  }
.banner .bd ul{ width:100% !important; }
.banner .bd li{ width:100% !important;  height:600px;    background-size: cover;    background-position: center; }
.banner .bd li .siteWidth{ width:1000px; position:relative;  margin:0 auto;  height:600px;  }
.banner .next{position: absolute;background: url(../images/right.png) no-repeat;right: 0;top: -340px;z-index: 999;width: 45px;height: 45px;}
.banner .prev{position: absolute;background: url(../images/left.png) no-repeat;left: 0;top: -340px;z-index: 999;width: 45px;height: 45px;}

.list-banner-bg {
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.list-banner {
    height: 300px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    flex-shrink: 0;
}
.list-text {
    position: absolute;
    font-size: 40px;
    color: #fff;
    letter-spacing: 6px;
    text-shadow: 0px 0px 4px #2b9d90;
}

.list-text p{
    margin: 0;
    padding: 12px 0;
    border-bottom: 1px solid #fff;
    text-align: center;
}
.list-text .en{
font-size: 20px;
    letter-spacing: 0px;
    border: 0;
    padding: 0;
}

.img-a {
display: flex;
    justify-content: space-around;
    padding: 80px 40px;
    box-sizing: border-box;
    padding-top: 0;
    margin: 80px auto;
    position: relative;
    z-index: 10;
    flex-wrap: wrap;
    background: rgb(194 244 255 / 70%);
}
/***
.img-a-item{
    width: 25%;
    text-align: center;

position: relative;
transition: all .3s;
box-shadow: 0 0 9px 0px transparent;

}
.img-a-item img{
    display: block;
    width: 100%;
}
.img-a-item:hover{
    box-shadow: 0 0 15px 0px #949494;
}
**/

.img-a-item{
  width: 21%;
  text-align: center;
  margin: 0 1%;
  box-sizing: border-box;
  background-image: url(../images/cxds_bg.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  background-color: rgba(255, 255, 255, 0);
  transition: background-color 0.4s, box-shadow 0.4s;
  box-shadow: 0px 6px 16px rgba(208, 208, 208, 0.2);
  background-color: rgba(255, 255, 255, 1);
}

.fwys_img {
  width: 120px;
  height: 120px;
  margin: 0 auto 20px;
  border-radius: 50%;
  box-shadow: 0px 6px 16px rgba(208, 208, 208, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
}
.fwys_img img {
  display: block;
  width: 50%;
  transition: transform 0.8s;
  transform: rotateY(0deg);
}
.fwys_item:hover img {
  transform: rotateY(360deg);
}
.img-a-item:hover {
  box-shadow: 0px 6px 16px rgba(208, 208, 208, 0.2);
  background-color: rgba(255, 255, 255, 1);
}
.fwys_text {
  font-weight: 500;
  font-size: 18px;
  color: #1c1c1c;
  opacity: 0.8;
  margin-bottom: 18px;
}


.img-a-item .line::before {
	display: block;
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	width: 0;
	height: 0;
	border-right: 4px solid transparent;
	border-bottom: 4px solid transparent;
	box-sizing: border-box;
}

.img-a-item .line::after {
	display: block;
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-left: 4px solid transparent;
	box-sizing: border-box;
}

.img-a-item:hover .line::before {
	width: 100%;
	height: 100%;
	border-color: #fff;
	-webkit-transition:height .25s ease-in-out , width .25s ease-in-out .25s;
	-moz-transition:height .25s ease-in-out , width .25s ease-in-out .25s;
	-o-transition:height .25s ease-in-out , width .25s ease-in-out .25s;
	transition: height .25s ease-in-out , width .25s ease-in-out .25s;
}

.img-a-item:hover .line::after {
	width: 100%;
	height: 100%;
	border-color: #fff;
	-webkit-transition: height .25s ease-in-out .5s, width .25s ease-in-out .75s;
	-moz-transition: height .25s ease-in-out .5s, width .25s ease-in-out .75s;
	-o-transition: height .25s ease-in-out .5s, width .25s ease-in-out .75s;
	transition: height .25s ease-in-out .5s, width .25s ease-in-out .75s;
}

.server-item{
    display: inline-block;
    background: rgba(255, 255, 255, .7) url(../images/word_bg.png) center center no-repeat;
    text-align: center;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 92, 159, 0.08);
    box-shadow: 0px 0px 15px 0px rgba(0, 92, 159, 0.08);
    width: 20%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    border-radius: 3px;
    position: relative;
    overflow: hidden;
}
.server-item a {
    padding: 36px;
    border-radius: 3px;
    border: 3px transparent solid;
    display: block;
}
.server-item div {
    height: 87px;
    line-height: 87px;
}
.server-item img {
    max-width: 100%;
    width: 70px;
}
.server-item label {
    color: #005c9f;
    font-size: 18px;
    font-weight: bold;
}

.arrows-body{
wdith:3%;
	position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.arrows{
    position: relative;
    width: 14px;
    padding-top: 14px;
    border-bottom: 4px solid #fff;
    border-right: 4px solid #fff;
    transform: rotate(45deg);
    animation: arrow-load 2s infinite;
}
.arrows:nth-child(3){
    right: 5px;
    animation-delay: -0.4s;
}
.arrows:nth-child(2){
    animation-delay: -0.2s;
}
.arrows:nth-child(1){
    left: 5px;
}
@keyframes arrow-load{
    0%{
        opacity: 0;
        transform: rotate(-45deg) translate(-14px,-14px);
    }
    0%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: rotate(-45deg) translate(14px,14px);
    }
}

.news{
    overflow: hidden;
    /* padding: 40px 0 160px; */
    background: url(../images/index_main.png);
    background-position: center bottom;
    background-size: cover;
}

#particles-js{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ffffff;
    background: radial-gradient(at center, #74e0ff, #007c90);
}

.title{width: 100%;display: table;}
.title span{border-left: 2px #00b1ff solid;border-right: 2px #00b1ff solid;font-size: 24px;padding:0 15px;display: inline-block;}
.title p{color: #c4c4c4;font-size: 18px;}
.home-news{height: 430px;}
.home-news ul{margin-left: -110px;width: 1310px;height: 430px;overflow: hidden;}
.home-news li{width: 325px;height: 430px;overflow: hidden;margin-left: 110px;background-color: #eeeeee}
.home-news li .pic{width: 100%;height: 180px;overflow: hidden;}
.home-news li .pic img{width: 100%;height: 180px;}
.home-news li h3{font-weight: normal;font-size: 16px;overflow: hidden;height: 24px;padding: 0 10px}
.home-news li p{font-size: 14px;line-height: 24px;color: #9b9b9b;padding: 0 10px;height: 80px;overflow: hidden;}
.home-news li .more{height: 30px;width: 100%;}
.home-news li .more a{display: inline-block;height: 30px;line-height: 30px;color: #00b1ff;border:1px #00b1ff solid;border-radius: 20px;width: 150px;font-size: 16px;}
.home-news li .more a:hover{background-color: #00b1ff;color: #FFF}

.home-bg{height: 300px;width: 100%;background-color: #02b1fe}
.home-bg ul{margin: 0 auto 0 -100px;width: 1300px}
.home-bg li{width: 220px;height: 195px;overflow: hidden;border:2px #eeeeee solid;margin-left: 100px;color: #FFF;position: relative;margin-top: 45px;}
.home-bg li h3{font-size: 18px;font-weight: normal;margin-bottom: 0}
.home-bg li p{font-size: 16px;margin-top: 10px}
.home-bg li .txt{padding-top: 60px;}
.home-bg li .i1{background: url(../images/i1.png) no-repeat center 20px;}
.home-bg li .i2{background: url(../images/i2.png) no-repeat center 20px;}
.home-bg li .i3{background: url(../images/i3.png) no-repeat center 20px;}
.home-bg li .i4{background: url(../images/i4.png) no-repeat center 20px;}
.home-bg li .more{position: absolute;bottom: 0;left: 0;right: 0;height: 45px;line-height: 45px;background-color: #eeeeee}
.home-bg li .more a{font-size: 14px;display: block;}
.home-bg li .more a:hover{color: #02b1fe}

.open{}
.open li{height: 120px;width: 100%;background-color: #eeeeee}
.open li span{display: block;width: 225px;height: 120px;color: #FFF;background-color: #03b2ff;font-size: 20px;line-height: 120px;}
.open li .txt{padding-left: 355px;padding-right: 135px;padding-top: 5px}
.open li .txt h3{font-size: 16px;font-weight: normal;height: 24px;overflow: hidden;}
.open li .txt p{font-size: 14px;color: #9b9b9b;line-height: 24px;height: 48px;overflow: hidden;}

.open .more{height: 45px;line-height: 45px;width: 100%;overflow: hidden;}
.open .more a{display: inline-block;height: 30px;line-height: 30px;color: #00b1ff;border:1px #00b1ff solid;border-radius: 20px;width: 150px;font-size: 16px;}
.open .more a:hover{background-color: #00b1ff;color: #FFF}

.about-box{height: 280px;width: 100%;padding:25px 0;background: url(../images/bg.jpg);}
.about-box .about{width: 1200px;height: 280px; overflow: hidden;}
.about-box .about img{width: 455px;height: 280px;}
.about-box .about .txt{padding-left: 475px;padding-right: 10px;}
.about-box .about .txt p{font-size: 14px;line-height: 30px;color: #FFF;height: 215px;overflow: hidden;}
.about-box .about .txt .more{width: 100%;height: 35px;}
.about-box .about .txt .more a{display: inline-block;height: 30px;line-height: 30px;color: #FFF;border:1px #FFF  solid;border-radius: 20px;width: 150px;font-size: 16px;}
.about-box .about .txt .more a:hover{background-color: #00b1ff;color: #FFF}
.about-box .login{width: 320px;height: 280px;overflow: hidden;}
.about-box .login .txt{line-height: 40px;}
.about-box .login .txt a{font-size: 12px;color: #FFF}
.about-box .login .submit{width: 100%;height: 40px;line-height: 40px;color: #FFF;font-size: 16px;border-radius: 5px;background-color: #404040;font-family: 'Microsoft YaHei', arial, sans-serif}
.about-box .login li{height: 40px;line-height: 40px;background-color: #FFF;border-radius: 5px;width: 100%;overflow: hidden;}
.about-box .login li label{display: inline-block;width: 90px;text-align: center;font-size: 16px;}
.about-box .login li .input{height: 40px;width: 220px;}

.coop{width: 100%;display: table;}
.coop ul{border-top: 1px #e6e6e6 solid}
.coop li{border-bottom: 1px #e6e6e6 solid}
.coop li a{display: block;width: 399px;height: 100px;border-right: 1px #e6e6e6 solid}
.coop li .pic{width: 399px;height: 100px;vertical-align: middle;display: table-cell;text-align: center;}
.coop li .pic img{vertical-align: middle;}


.coop .more{height: 30px;width: 100%;}
.coop .more a{display: inline-block;height: 30px;line-height: 30px;color: #00b1ff;border:1px #00b1ff solid;border-radius: 20px;width: 150px;font-size: 16px;}
.coop .more a:hover{background-color: #00b1ff;color: #FFF}


.footer{overflow: hidden;background: linear-gradient(to right, #0191d8, #25aca5); /* 从左到右的渐变 */}


/*页面主体部分*/
.mainWrap{ width: 100%; height: auto; min-width: 1200px;     overflow: hidden;    background: url(../images/main.png);
    background-position: center;
    background-size: cover; }
.main{ height: auto;margin:0 auto; position: relative;}
.mainL{ width: 790px;}
/**/
.mainTop{ width: 100%; height: auto;}
/*内页banner*/
.list-banner{width:100%; height:300px; text-align:center; overflow:hidden;}
.left{width:260px; margin-top:-60px;  position:relative; z-index:100; float:left;}
.right{width:870px; margin-top:20px; float:right;}
.lmcc{background:#00b1ff; height:100px; line-height:100px; color:#fff; padding-left:50px; width:210px; font-size:30px; letter-spacing:1px;}
.left-list{background:#ededed; padding-bottom:200px; padding-top:15px; padding-left:10px; width:250px;}
.left-list li{width:250px; height:46px; line-height:46px; font-size:16px;}
.left-list li a{display:block; font-size:16px; padding-left:20px; float:left; width:230px; height:46px; margin-bottom:10px; line-height:46px; color:#333; float:left;}
.left-list li a:hover,.left-current{background:#fff!important; color:#00b1ff!important;}
.local{width:100%; height:60px; line-height:60px; border-bottom:1px solid #cecece;}
.local h3{color:#484848; margin:0; font-size:24px; font-weight:bold; float:left;}
.dqwz{float:right; color:#333; font-size:12px; background:url(../images/pic4.png) no-repeat left center; padding-left:16px; font-family:'宋体'}
.dqwz a{color:#333; line-height:70px; padding:0 6px;}

.content,.jj,.list,.pic-list{width:100%; margin:20px 0; min-height:560px;}
.content-title{width:100%; margin:20px 0; text-align:center;color:#169af3; margin: 66px 0;letter-spacing: 6px;padding-left:6px; display: flex; justify-content: center;    align-items: center;}
.content-title p{margin:0}
.content-title h3{width:100%; float:left; display:block; font-size:24px; color:#333; line-height:36px; margin:0;}
.content-title i{margin-top:6px; width:100%; font-style:normal; float:left; display:block; font-size:12px; line-height:24px;color:#666;}


.news-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.news-list li {
  border-bottom: 1px solid #ddd;
}
.news-list a {
  display: flex;
  padding: 24px 0;
  align-items: center;
  text-decoration: none;
  position: relative;
  transition: all 0.5s;
}
.news-list a::after {
  content: "";
  z-index: 0;
  position: absolute;
  bottom: 0px;
  height: 100%;
  left: 0;
  box-shadow: 0px 0px 0.4rem 0px rgba(10, 76, 58, 0.5);
  border: 1px solid #0a4c3a;
  background: #fff;
  opacity: 0;
  width: 100%;
  transition: all 0.5s;
}
.news-img {
  width: 200px;
  height: 150px;
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}
.news-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1, 1);
  transition: transform 0.5s;
}
.news-text {
  flex-grow: 1;
  position: relative;
  z-index: 2;
  overflow: hidden;
  padding-left: 16px;
}
.news-title {
  font-size: 16px;
  color: #333;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: 0.5s;
}
.news-time {
  font-size: 14px;
  color: #169AF3;
  line-height: 1.2;
  align-items: center;
  margin: 6px 0;
  padding-left: 20px;
  background: url("../2024img/time.png") no-repeat left center;
  background-size: 16px auto;
}
.news-title-b {
  font-size: 14px;
  color: #888;
  line-height: 20px;
  max-height: 40px;
  margin-bottom: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.news-title-r {
  width: 24px;
  height: 20px;
  background: url("../2024img/right.png") no-repeat left center;
  background-size: 100% auto;
}
.news-list li a:hover::after {
  opacity: 1;
}
.news-list a:hover {
  padding: 24px;
}
.news-list a:hover .news-title {
  color: #169AF3;
}

.title-l{
    height: 2px;
    width: 60px;
    margin-right: 30px;
    position: relative;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #169af3 100%);
}
.title-l::after{
    content: '';
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 6px;
    height: 6px;
    background: #169af3;
    border-radius: 50%;
}
.title-r{
    height: 2px;
    width: 60px;
    margin-left: 30px;
    position: relative;
    background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, #169af3 100%);
}
.title-r::after{
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 6px;
    height: 6px;
    background: #169af3;
    border-radius: 50%;
}
.content-title.wh{
color:#fff
}
.wh .title-l{
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #fff 100%);
}
.wh .title-r{
    background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, #fff 100%);
}
.wh .title-l::after,
.wh .title-r::after{
    background: #fff;
}

.content-con p,.jj p{display:block; width:100%; line-height:36px; color:#333; font-size:15px; text-indent:2em; margin-bottom:15px;}
.content-sxt{margin-top:30px; border-top:1px solid #e3e3e3; padding-top:15px; line-height:30px; font-size:13px; width:100%;}
.content-sxt a{display:block; width:100%; color:#333; font-size:14px;}

.list{width:870px; margin:20px 0;}
.list li a{ width: 718px; background: url(../images/ico3.png) 0 center no-repeat; font-size: 15px; color: #000; display: block; float: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.list li i{ width:130px; font-style:normal; text-align: right; display: block; float: right; font-size: 12px; color: #666;}
.list li a:hover{color: #00b1ff;}
.dqwz a:hover{color: #00b1ff;}

.pic li{width:260px; margin-right:45px; float:left; margin-bottom:30px; margin-top:10px;}
.img{width:100%; height:170px; overflow:hidden;}
.img img{width:100%; height:100%;}
.pic li .txt{width:100%; height:36px; line-height:36px; margin-top:10px; color:#333; font-size:14px; text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.list li{ width: 100%; height: auto; float: left; height: 36px; line-height: 36px;}



.bq{
line-height: 20px;
    color: #fff;
    font-size: 16px;
    padding: 14px 0;
    text-align: center;
}
.bq p {

margin:0;
    padding: 4px 0;
}