/*基本样式------------------*/
*{padding:0px; margin:0px;}
h1,h2,h3,h4,h5,h6,b{ font-weight:normal; font-size:100%;}
input,select,button,textarea{vertical-align:middle;line-height:normal;font-size:100%;font-family:Arial;}
textarea{line-height:100%;} 
a{outline:0;cursor:pointer;*star:expression(this.onFocus=this.blur()); text-decoration:none; color:#333;}
a:hover{color:#046Eb8;}
input:focus,select:focus,textarea:focus,button:focus{outline:none;}
table{border-spacing:1;}
img{border:0;}
ul,li{list-style:none;}
em,i{font-style:normal;}
p{word-break:break-all;text-justify:inter-ideograph; line-height:1.7em; color:#666;}
.fl{float:left;}
.fr{float:right;}
.tCen{ text-align:center;}
.clear{clear:both;height:0;font-size:0;line-height:0;visibility:hidden; overflow:hidden;} 
.hd{ overflow:hidden;}
.block{ display:block;}
.none{ display:none;}
img{ max-width:100%;}
body{color:#333;font-size:12px;}
/*-------基本样式end---------*/
/*-------内容区宽度---------*/
.pageMain{width:1480px; margin:0 auto;}
.pageMain2{width:1480px; margin:0 auto;}
#goup{ width:50px; height:50px;}
/*-------顶部---------*/
.headerKong{height:80px;}
.header{ width:100%; background:#fff; position:fixed; top:0; left:0; z-index:99; border-bottom:1px solid #ddd;box-shadow: 0px 0px 6px 0px rgb(0 0 0 / 20%);} 
.header .logo{ width:20%;float:left;padding:10px 0;}
.header .logo img{transition:all .5s; max-width:100%; max-height:70px;}
.header .logo span{ display:block; height:16px; font-size:14px; margin-top:2px;}
.header .nav{width:55%;float:left; height:100%; position:relative; margin-top:26px}
.header .nav a{font-size:16px; color:#333;box-sizing: border-box; display:inline-block; height:38px; line-height:38px; text-align:center}
.header .nav ul{ text-align:center;}
.header .nav ul li{ display:inline-block; margin:0 30px; position:relative; text-align:center; height:60px;}
.header .nav ul li div{ position:absolute; left:-30px; top:60px; background:#fff; width:150px; display:none; z-index:2;-webkit-transition: 0.6s ease;  -moz-transition: 0.6s ease;box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);}
.header .nav ul li:hover div{ display:block; }
.header .nav ul li div ul{ padding:5px 0; text-align:center;}
.header .nav ul li div ul li{ margin:0 0px;height:40px; display:block; border-bottom:1px dashed #ddd;}
.header .nav ul li div ul li a{font-size:14px; line-height:40px; display:block; width:100%;-webkit-transition: 0.6s ease;  -moz-transition: 0.6s ease;}
.header .nav ul li div ul li:hover a { background: #2ea7e0; color:#fff;}
.header .nav a:hover{ color:#046Eb8;}
.header .nav a.active {color:#046Eb8;}

.outLine{width:220px;float: right; text-align:right; padding-top:36px; position:relative;}
.outLine span{margin:0px 20px 0 0; text-align:center; display:inline-block;}
.outLine span.pd1{ background:url(../images/ser.png) no-repeat 0 0; width:22px; height:22px; background-size:100% 100%;cursor:pointer;}
.outLine span.pd2{color:#bbb; font-size:14px; height:22px; margin-bottom:13px;vertical-align:middle;}
.outLine span.pd2 a{color:#666; font-size:16px;}
.outLine span.pd2 a:hover{color:#1F84CA; }
.outLine span.pd3{color:#bbb; font-size:14px; height:22px; margin-bottom:13px;vertical-align:middle;}
.outLine span.pd3 a{color:#666; font-size:16px;}
.outLine span.pd3 a:hover{color:#1F84CA; }
/*-------顶部 end ---------*/
.banner{ width:100%; height:700px; overflow:hidden; position:relative;font-size:0}
.b-img{ height:100%;  position:absolute; left:0; top:0;}
.b-img a{ display:block; height:100%; float:left; background-size: auto 100%;}
.b-list{ height:50px; padding-top:680px; position:relative; margin:0 auto;z-index:1;}
.b-list span{ display:block;cursor:pointer; width:5px; height:5px; border-radius:50%; border:2px solid #fff; float:left; margin:0 5px; _margin:0 3px;}
.b-list .spcss{border:2px solid #046Eb8;}
.bar-left{ position:absolute; z-index:1; display:block; width:100px; height:100%; left:0px; background:none; top:0px; }
.bar-right{ position:absolute;z-index:1; display:block; width:100px; height:100%; right:0px; background:none; top:0px; }
.bar-left em{ display:block; width:50px; height:100px; background:url(../images/arrow.png) 0px 0px no-repeat; margin:0 auto; margin-top:325px;}
.bar-right em{ display:block; width:50px; height:100px; background:url(../images/arrow.png) -50px 0px no-repeat; margin:0 auto; margin-top:325px;}
.bar-left .emcss{ background-position:0px -100px;}
.bar-right .emcss{ background-position:-50px -100px;}

/*-------标题和介绍---------*/
.titleBox{ width:100%; margin:0 0 50px 0; text-align:center;}
.titleBox h1{ text-transform: uppercase; font-size: 66px; position: relative; z-index: 1;  font-weight: bold; line-height: 80px;color:#cbdbe7;} 
.titleBox h2{ font-size: 48px;  color: #444;  font-weight: bold;  margin-top: -40px; position: relative; z-index: 2; line-height: 54px;} 
.titleBox p{font-size:1.4em; text-align:center}
.titleBox p span{ display:inline-block; width:60px; height:3px; background:#2ea7e0; margin-top:15px;}

.linebot{ border-bottom: 2px dashed #ccc; padding:0 0 80px 0 }
.pagebg{ padding:80px 0;}
.pagebg3{ padding:80px 0 40px;}
.pagebg2{ padding:10px 0 50px;}
.page1{ background:#eee;}

a.moreN{ display:inline-block; padding:6px 10px; border-radius:5px;  font-size:1.2em; color:#fff; margin-top:15px;background-color:#2ea7e0;-webkit-transition: 0.6s ease;  -moz-transition: 0.6s ease;}
a.moreN:hover{ background-color:#999;}

a.more{ display:inline-block; padding:10px 20px; border-radius:30px;  font-size:1.2em; color:#fff; margin-top:15px;background-color:#2ea7e0;-webkit-transition: 0.6s ease;  -moz-transition: 0.6s ease;}
a.more:hover{ background-color:#999;}
a.theme_button { border-radius:10px;margin: 30px 0 0; font-size:1.3em; background-color:#2ea7e0; color: #fff; padding: 10px 20px; display: inline-block; -webkit-transition: 0.6s ease;  -moz-transition: 0.6s ease;}
a.theme_button:hover { background-color:#999;}

.InBoutL{ width:44%; float:right; margin-top:3em;}
.titleBox3 h1{font-size:2.6em; font-weight:bold; margin-bottom:20px;}
.titleBox3 p{font-size:1.3em; text-indent:2em;margin-bottom:20px; color:#999}
.InBoutR{ width:48%; float:left}
.InBoutR .img{ text-align:center;}
.InBoutR .img img{ width:100%;}

.youshibox{ text-align:center}
.youshibox img{ width:auto !important}

/*-------合作---------*/
.three {padding: 0 0 70px;}
.three li {
    width: 25%;
    float: left;
    text-align: center;
}

.three li p {
    font-size: 16px;
    color: #888888;
    line-height: 24px;
}

.three li h4 { color:#046Eb8;
    font-size: 16px;
    line-height: 60px;
    position: relative;
}

.three li h4 b {
    font-size: 60px;
    font-weight: bold;
    display: inline-block;
}

.three li h4 img {
    position: absolute;
    margin-left: 15px;
    margin-top: 10px;
}

.InClass{ margin:50px 0%;text-align:center;}
.InClass ul li{ cursor:pointer; text-align:center; display:inline-block; border-radius:6px; background: #eee; color: #333; font-size:1.4em; padding: 2px 20px; height:40px; line-height:40px; -webkit-transition: 0.6s ease;  -moz-transition: 0.6s ease;}
.InClass ul li:hover, .InClass ul li.over{background: #2ea7e0; color:#fff;}
.InClass ul li:nth-child(6n){margin-right:0%;}

.inProHot .inLiPro{ display:none;margin:20px auto 0;}
.inProHot .nowopen{ display:block;}
.inProHot .inLiPro ul li{ background:#fff; float:left; width:32%;  margin-right:2%; margin-bottom:25px; position:relative}
.inProHot .inLiPro ul li:nth-child(3n){margin-right:0%;}
.inProHot .inLiPro ul li .pic{text-align:center;position: relative;overflow: hidden;} 
.inProHot .inLiPro ul li .pic img{width: 100%;object-fit: cover;transform: scale(1.0);transition: all ease 0.5s;}
.inProHot .inLiPro ul li:hover .pic img{transform: scale(1.0.2);transition: all ease 0.5s;}
.inProHot .inLiPro ul li .info { padding:20px;} 
.inProHot .inLiPro ul li .info h1{font-size: 1.4em;color: #046eb8; font-weight: bold;line-height: 40px;} 
.inProHot .inLiPro ul li .info p{ font-size:1.2em; line-height:180%; margin-bottom:10px;} 

.proXGLi{ margin:20px auto 0;background: #eee;}
.proXGLi h2{ color: #046eb8; font-weight:bold; font-size: 16px; line-height:50px; padding-left:10px; text-align:center;  border-bottom: 1px ccc}
.proXGLi ul { padding:10px;} 
.proXGLi ul li .pic{text-align:center;position: relative;overflow: hidden;} 
.proXGLi ul li .pic img{width: 100%;object-fit: cover;transform: scale(1.0);transition: all ease 0.5s;}
.proXGLi ul li:hover .pic img{transform: scale(1.0.2);transition: all ease 0.5s;}
.proXGLi ul li .info h1{font-size: 1em;line-height: 40px; text-align:center} 

.InProCl ul{ margin:0 auto; }
.InProCl ul li{ background:#fff; float:left; width:24%;  margin-right:1.2%; margin-bottom:25px; position:relative}
.InProCl ul li:nth-child(4n){margin-right:0%;}
.InProCl ul li .box{ border:2px solid #ddd;-webkit-transition: 0.6s ease;  -moz-transition: 0.6s ease;}
.InProCl ul li:hover .box{ border:2px solid #AACD06; }
.InProCl ul li .pic{position: relative;overflow: hidden;} 
.InProCl ul li .pic img{height: 100%;}
.InProCl ul li .info{ margin:10px 5px; }
.InProCl ul li .info h1{font-size:1.5em;color: #00B0EC; font-weight: bold;line-height:30px;height:30px; overflow:hidden; margin-bottom:5px; text-align:center;} 
.InProCl ul li .info p{ font-size:1.2em;line-height:25px;height:50px; overflow:hidden; margin-bottom:10px; text-align:center} 

.ProLeft{ float:left; width:23%; margin-bottom:50px;}
.proClass{}
.proClass h3{background: #046eb8;color: #fff; font-size: 24px; font-weight: bold; line-height: 80px;text-align: center;  border-bottom: 1px solid #fff;}
.proClass ul{text-align:center}
.proClass ul li{ }
.proClass ul li a { display:block; width:100%; background: #eee; color: #333; border-bottom: 1px solid #fff; font-size:1.4em; padding: 8px 0px; height:50px; line-height:50px; -webkit-transition: 0.6s ease;  -moz-transition: 0.6s ease;}
.proClass ul li.ov a, .proClass ul li:hover a { background: #2ea7e0; color:#fff;}

.InPro{ float:right; width:74%;}
.InPro ul{ margin:0 auto; }
.InPro .box{ border:1px solid #ccc; }
.InPro ul li{ background:#fff; float:left; width:32%;  margin-right:2%; margin-bottom:25px; position:relative}
.InPro ul li:nth-child(3n){margin-right:0%;}
.InPro ul li .pic{text-align:center;position: relative;overflow: hidden;} 
.InPro ul li .pic img{width: 100%;object-fit: cover;transform: scale(1.0);transition: all ease 0.5s;}
.InPro ul li:hover .pic img{transform: scale(1.02);transition: all ease 0.5s;}
.InPro ul li h1{background: #2ea7e0;font-size: 15px; text-align: center;  line-height: 40px;  color: #fff;  position: relative;} 
.InPro ul li p{ font-size:1.2em; line-height:180%;} 


.InNews ul{ margin:0 auto; }
.InNews ul li{ background:#fff; float:left; width:32%;  margin-right:2%; margin-bottom:30px; position:relative}
.InNews ul li:nth-child(3n){margin-right:0%;}
.InNews ul li .pic{text-align:center; height:225px; position: relative;overflow: hidden;}
.InNews ul li .pic img{width: 100%;object-fit: cover;transform: scale(1.0);transition: all ease 0.5s;}
.InNews ul li:hover .pic img{transform: scale(1.2);transition: all ease 0.5s;}

.InNews ul li .pic span{ display:inline-block; padding:0 5px; position:absolute; bottom:2px; right:2px; border:1px solid #eee; color:#fff;
font-size: 14px;  text-align: center; line-height: 30px;} 
.InNews ul li h1{ font-size:1.2em;margin:10px 0;text-align:center; color:#000; overflow:hidden;} 
.InNews ul li p{ font-size:1.2em; line-height:180%;} 

/*底部*/
.footer{ border:1px solid #ccc;padding:40px 0; background:#333}
.footer h2{ font-size:1.4em; margin-bottom:20px;}
.footer p{ line-height:200%;}
.footer .fotC{ float:left; width:25%;}
.footer .fotC .fotnav{ margin:0px 0 10px;}
.footer .fotC .fotnav h2{font-size: 16px; color: #fff; font-weight:bold;}
.footer .fotC .fotnav a{color:#fff;line-height:200%; display:inline-block; width:40%;font-size:14px;}
.footer .fotC .fotinfo a{color:#fff;line-height:200%; }
.footer .fotC2{ float:left; width:15%;}
.footer .fotC2 .fotnav{ margin:0px 0 10px;}
.footer .fotC2 .fotnav h2{font-size: 16px; color: #fff; font-weight:bold;}
.footer .fotC2 .fotnav a{color:#fff;line-height:200%; display:block; font-size:14px;}
.footer .fotC2 .fotinfo a{color:#fff;line-height:200%; }
.footer .fotR{ float:right; width:55%;}
.footer .fotR .fotpro{font-size: 14px; color:#fff;line-height:200%;}

/*about*/
.banbox{ height:360px;}
.banbox a{ display:block; height:100%;  text-align:center}
.banbox span{ text-align:center;
	display: inline-block;
	padding: 9rem 0 0;
	font-size: 3em;
	font-weight: bold;
	color: #fff;
	position: relative;
}
.banbox span:before{ background:#FFF;content: '';display: block;width: 70px;height:1px; margin:30px 0 0 0px; position:absolute; left:-6rem; top:9rem; z-index:3} 
.banbox span:after{background:#FFF;content: '';display: block;width: 70px;height:1px; margin:30px 0 0 0px; position:absolute; right:-6rem; top:9rem; z-index:3} 

.titleNow{ border-bottom:1px solid #ddd; line-height:40px; margin: 30px 0 10px;}
.titleNow a{ font-size:1.2em;}
.Nowhome:before {content: ""; width: 20px; height: 20px; display: inline-block; background: url(../images/tip.png) no-repeat center;vertical-align: sub; margin-right: 5px;}
.titleNow .port3{ display:inline-block; float:right; }
.titleNow .port3 span{ background:#ccc; width:5px; height:5px; border-radius:3px; display:inline-block; margin-left:5px; margin-top:18px;}

.aBoutInfo{float:right; width:73%;}
.aBoutInfo .info{} 
.aBoutInfo h1{ font-size:1.6em; margin:0.5em 0; font-weight:bold; text-align:center;}
.aBoutInfo p{ font-size:1.2em; line-height:180%;margin-bottom:5px; text-indent:2em;}
.aBoutInfo p img {display: block; }
.aBoutInfo2{float:right; width:73%;}
.aBoutInfo2 h1{ font-size:1.6em; margin:0.5em 0; font-weight:bold; text-align:center;}
.aBoutInfo2 h2{ font-size:1em; color:#999; text-align:center; margin-bottom:15px;}
.aBoutInfo2 p{ font-size:1.2em; line-height:180%;margin-bottom:5px;}

.NewsList{float:right; width:74%;}
.NewsList ul li{ background:#fff;  margin-bottom:20px; position:relative}
.NewsList ul li .pic{float:left; width:26%;  margin-right:3%;text-align:center;  position: relative;overflow: hidden;}
.NewsList ul li .pic img{width: 100%;object-fit: cover;transform: scale(1.0);transition: all ease 0.5s;}
.NewsList ul li:hover .pic img{transform: scale(1.2);transition: all ease 0.5s;}
.NewsList ul li .borlin{ border:1px solid #ccc; overflow:hidden}
.NewsList ul li .info{float:left; width:71%;} 
.NewsList ul li .info h1{ font-size:1.4em;margin:10px 0;color:#000; overflow:hidden;} 
.NewsList ul li .info h1 i{ width:50px; color:#df0448} 
.NewsList ul li .info h2{ font-size:1.2em; color:#999; margin-bottom:10px;} 
.NewsList ul li .info p{ font-size:1.2em; line-height:180%;} 

.contact{margin-top:30px; min-height:300px;}
.contact .info{ width:100%; margin:0 auto; font-size:1.4em; line-height:180%;}
.showleft{ float:left; width:50%;}
.showRigth{ float:left; width:50%; text-align:center}

/*产品展示*/
._left{float:left;}
._right{float:right;}
.ProClass{ width:25%;border:1px solid #eee; background:#FCFCFC;}
.ProClass ul{margin:10px auto; }
.ProClass ul li{ margin-bottom:10px;border-bottom:1px solid #eee; line-height:30px; position:relative;}
.ProClass ul li .product_more {  font-size: 20px;  position: absolute;  right: 0px; line-height: 46px;  width: 18%;  top: 0; text-align: center;  cursor: pointer; color:#999;}
.ProClass ul li a { color: #333; font-size:1.4em; padding: 8px 0px 8px 20px; display:block;}
.ProClass ul li.active a {color:#2ea7e0;}
.ProClass ul li:hover a {color:#2ea7e0;}
.ProClass ul li dl{ margin:0px 0 10px 20px; display:none;}
.ProClass ul li.active dl{ display:block;}
.ProClass ul li dl dd{ margin-bottom:5px;line-height:30px;}
.ProClass ul li dl dd a { color: #666; font-size:1.2em; padding: 2px 0px 2px 20px; }
.ProClass ul li.active dl dd a { color: #666;}
.ProClass ul li:hover dl dd a { color: #666;}
.ProClass ul li dl dd.av a {color:#2ea7e0;}
.ProClass ul li:hover dl dd a:hover {color:#2ea7e0;}

.ProList{ float:right; width:73%;}
.ProList ul{ margin:0 auto; }
.ProList .box{ padding:10px;}
.ProList ul li{ background:#fff; border:1px solid #eee; float:left; width:31%;  margin-right:3%; margin-bottom:25px; position:relative}
.ProList ul li:nth-child(3n){margin-right:0%;}
.ProList ul li .pic{ text-align:center} 
.ProList ul li h1{ font-size:1.2em;margin:10px 0;text-align:center; height:21px; overflow:hidden} 
.ProList ul li p{ font-size:1.2em; line-height:180%;} 

/*分页*/
.pager{ padding:30px 0; text-align:center}
.pager a{ border:1px solid #ddd; display:inline-block; width:30px; height:30px; line-height:30px; border-radius:5px; margin:0 3px; font-size:1.2em; }
.pager a:hover{	text-decoration: none; font-weight:600;}
.pager a.cur, .pager a:hover{ color:#fff; background:#2ea7e0}
.pager a.pre, .pager a.next{position:relative;}
.pager a.moreto{border:0px solid #ddd;  }
.pager a.pre em {    -webkit-backface-visibility: hidden;
    position: absolute;    right:12px;    top: 9px;    width: 0;    height: 0;    border-width: 7px;    border-style: solid dashed dashed;
    border-color: transparent #666 transparent transparent;    font-size: 0;    line-height: 0;
}
.pager a.next em {    -webkit-backface-visibility: hidden;    position: absolute;    left:12px;    top: 9px;    width: 0;    height: 0;    border-width: 7px;    border-style: solid dashed dashed;    border-color: transparent transparent transparent #666;    font-size: 0;    line-height: 0;
}

.ProBody{float:right; width:73%;}
.proHot{ margin:50px 0 30px;}
.proHot h1{ font-size:2em; color:#333; font-weight:600; margin-bottom:20px; text-align:center; }
.proHot .Img{width:100%; text-align:center}
.proInfo{ margin-bottom:3em;}
.proInfo .proSmTitle{ font-size:1.6em; color:#2ea7e0;  margin-bottom:20px; border-bottom:1px solid #ddd; padding-bottom:10px;}
.proInfo .proSmTitle table{ width:100% !important;}
.proInfo table tr td:first-child{ width:25% !important;}
.proInfo p{ font-size:1.2em; line-height:180%;}

.proInfo p strong { font-weight:600;}
.proInfo ul { margin:10px 0 10px 30px;}
 
.proInfo ul li {
   list-style:outside; line-height:200%;
}
.NewsList ul{ margin:0 auto; }
.NewsList ul li{ background:#fff;  margin-bottom:20px; position:relative}
.NewsList ul li .pic{float:left; width:26%;  margin-right:3%;text-align:center;  position: relative;overflow: hidden;}
.NewsList ul li .pic img{width: 100%;object-fit: cover;transform: scale(1.0);transition: all ease 0.5s;}
.NewsList ul li:hover .pic img{transform: scale(1.2);transition: all ease 0.5s;}
.NewsList ul li .info{float:left; width:71%;} 
.NewsList ul li .info h1{ font-size:1.2em;margin:10px 0;color:#000; overflow:hidden;} 
.NewsList ul li .info h1 span{ float:right; color:#999;} 
.NewsList ul li .info p{ font-size:1.2em; line-height:180%;} 

.five_n { width: 50%; float: left;  margin-top: 30px;}
.five_n li {width: 48%; float: left; background: #fff; margin: 20px 1% 0; border-radius: 100px; position: relative;  overflow: hidden;  z-index: 0;}
.five_n li h4 {font-size: 24px;font-weight: bold;  color: #444444;  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  line-height: 34px; margin-top: 30px;}
.five_n li p {font-size: 14px;color: #999999; display: block; line-height: 28px; white-space: nowrap;overflow: hidden; text-overflow: ellipsis;}
.five_n li img {float: left; margin-right: 15px;max-width: 110px; display: block; border: 4px solid #bbbbbb; border-radius: 50%; transition: all 0.5s;}
.five_n li:hover img,
.five_n li.cur img {  transform: rotate(360deg);}
.five_n li:before { content: '';  display: block;  position: absolute;  width: 0;  height: 100%;  border-radius: 100px;   top: 0;  left: 0; transition: all .5s ease;  z-index: -1;}
.five_n li:hover:before,
.five_n li.cur:before {  width: 100%;}
.five_n li:hover h4,
.five_n li:hover p,
.five_n li.cur h4,
.five_n li.cur p {
    color: #fff;
}

.four_n li.cur a,
.four_n li a:hover,
.five_n li:before,
.five_c li a.more span {
    background: #2ea7e0;
}
.five_c {
    width: 50%;
    float: right;
    margin-top: 50px;
    box-sizing: border-box;
    padding-left: 5%;
}
.five_t h4 {
    font-size: 42px;
    font-weight: bold;
    line-height: 60px;
}

.five_t p {
    line-height: 35px;
    background: #2ea7e0;
    color: #fff;
    font-size: 18px;
    display: inline-block;
    padding: 0 25px;
}

.five_t em {
    display: block;
    font-size: 126px;
    font-weight: bold;
    font-family: 'arial';
    color: #999;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 110px;
}

.five_t {
    position: relative;
    padding-left: 150px;
    margin-bottom: 35px;
}

.five_text {
    font-size: 16px;
    line-height: 30px;
    color: #666;
}

.five_c li a.more {padding: 5px 20px;
    width: 170px;
    display: block;
    line-height: 50px;
    border-radius: 4px;
    font-size: 18px;
    color: #fff;
    position: relative;
    margin-top: 30px;
    text-align: center;
}

.eight_c {
    margin-top: 20px;
}

.eight_c li {
    width: 48%;
    float: left;
    margin: 30px 1% 0;
    background: #f4f6f8;
    border-radius: 15px;
    padding: 30px;
    box-sizing: border-box;
}

.eight_c li span { background:#2ea7e0;
    color: #fff;
    font-family: arial;
    width: 90px;
    float: left;
    text-align: center;
    padding: 7px 0;
    line-height: 25px;
    margin-right: 20px;
}

.eight_c li span b {
    display: block;
    font-size: 48px;
    line-height: 50px;
}

.eight_c li h4 {
    font-size: 18px;
    font-weight: bold;
    line-height: 30px;
    color: #333333;
    min-height: 25px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: all .5s ease;
}

.eight_c li p {
    font-size: 14px;
    color: #555555;
    line-height: 25px;
    min-height: 50px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 10px;
}