* { margin: 0; padding: 0; outline: none; list-style: none;}
body { min-width: 1300px; font-family: Microsoft YAHEI,Poppins,Arial,Helvetica,sans-serif; font-size: 12px; color: #333; margin: 0 auto; background: #fff;}
a { color: #333; text-decoration: none;}
a:hover { text-decoration: none;}
.clear { clear: both;}
.warp { width: 1300px; margin: 0 auto; position: relative;}
#VCode { cursor: pointer;}
input[type=button],
input[type=submit],
input[type=file],
button { cursor: pointer; -webkit-appearance: none;}
textarea { -webkit-appearance: none;}
::-webkit-input-placeholder { color: #999;} 
:-moz-placeholder { color: #999;} 
::-moz-placeholder { color: #999;}
:-ms-input-placeholder { color: #999;} 

@font-face { 
	font-family: 'FontAwesome'; 
		    src: url('../fonts/fontawesome-webfont.eot?v=4.7.0'); 
	        src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),
			     url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),
				 url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),
				 url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),
				 url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg'); 
	font-weight: normal; 
	 font-style: normal; 
}
@font-face {
	font-family: 'Oswald';
		    src: url('../fonts/Oswald.ttf');
	font-weight: normal;
	 font-style: normal;
}

/*头部*/
.kong { width: 100%; height: 80px;}
.header { width: 100%; height: 80px; margin: 0 auto; box-shadow: 0 2px 8px rgba(0,0,0,0.05); background: #fff; position: fixed; z-index: 99;}
.header .logo { float: left; width: 230px; height: 50px; margin: 15px 0;}
.header .logo img { display: block; height: 100%;}

/*导航*/
.header .nav { float: right; max-width: calc(100% - 230px);}
.header .nav li { float: left; height: 80px; margin-left: 40px; text-align: center; position: relative;}
.header .nav li::after { display: block; content: ""; width: 0; height: 3px; margin: auto; background: #004cca; position: absolute; left: 0; right: 0; bottom: 0; -webkit-transition: all .5s ease; transition: all .5s ease;}
.header .nav li a { display: block; line-height: 80px; font-size: 16px; color: #5c5c60; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease;}
.header .nav li:hover a,
.header .nav .on a { color: #004cca;}
.header .nav .on a { font-weight: bold;}
.header .nav li:hover::after,
.header .nav .on::after { width: 100%;}
.header .nav li p { display: none; width: 190px; border-radius: 0 0 4px 4px; box-shadow: 0 5px 10px rgba(0,0,0,0.05); overflow: hidden; background: rgba(255,255,255,0.95); position: absolute; top: 80px; left: -40px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.header .nav li p a { line-height: 45px; font-weight: 500 !important; font-size: 14px; color: #666 !important; border-top: 1px solid #f8f8f8; padding: 0 10px;}
.header .nav li p a::after { display: none;}
.header .nav li:hover p { display: block;}
.header .nav li p a:hover { color: #fff !important; background: #004cca;}

.header .nav .serch { width: 80px; margin-left: 0;}
.header .nav .serch::after { display: none;}
.header .nav .serch span { display: block; width: 100%; height: 80px; line-height: 80px; font-size: 16px; color: #fff; cursor: pointer; background: url(../images/sz01.png) no-repeat center; -webkit-transition: all .5s ease; transition: all .5s ease;}
.header .nav .serch .souo { display: none; width: 400px; height: 50px; padding: 15px; box-shadow: 0 5px 10px rgba(0,0,0,0.05); background: #fff; position: absolute; right: 0; top: 80px; z-index: 9;}
.header .nav .serch .souo input { display: block; float: left; width: calc(100% - 96px); height: 44px; line-height: 44px; font-size: 14px; color: #333; padding: 0 10px; border: 3px solid #004cca; background: #fff;}
.header .nav .serch .souo .btn { width: 70px; height: 50px; line-height: 50px; font-size: 16px; color: #fff; padding: 0; border: none; background: #004cca;}
.header .nav .serch.on .souo { display: block;}

.header .nav .ask { margin-left: 0;}
.header .nav .ask::after { display: none;}
.header .nav .ask a { display: block; width: 100px; height: 40px; margin-top: 20px; line-height: 40px; font-size: 18px; color: #fff; text-align: center; border-radius: 20px; overflow: hidden; background: #004cca; -webkit-transition: all .5s ease; transition: all .5s ease;}
.header .nav .ask:hover a { color: #fff; border-radius: 4px;}

/*脚部*/
.footer { width: 100%; padding-top: 50px; background: #18263c;}
.footer a { color: rgba(255,255,255,0.5); -webkit-transition: all .5s ease; transition: all .5s ease;}
.footer a:hover { color: #fff !important;}
.footer .eml { float: left; width: calc(62% - 35px); padding-left: 35px; background: url(../images/sz15.png) no-repeat left 2px;}
.footer .eml li { float: left; min-width: 235px; margin-bottom: 15px;}
.footer .eml li span { display: block; width: 100%; height: 25px; line-height: 25px; font-size: 14px; color: #fff;}
.footer .eml li a { display: block; height: 25px; line-height: 25px; font-size: 14px; text-decoration: underline; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.footer .rgt { float: right; width: 37%;}
.footer .rgt p { height: 30px; line-height: 30px; font-size: 14px; color: #fff;}
.footer .rgt .tel { margin-bottom: 20px; padding-left: 35px; background: url(../images/sz16.png) no-repeat left 2px;}
.footer .rgt .tel p { float: left; width: calc(50% - 10px); margin: 0 20px 5px 0;}
.footer .rgt .tel p:nth-child(2n) { margin-right: 0;}
.footer .rgt .wct { padding-left: 35px; background: url(../images/sz17.png) no-repeat left 2px;}
.footer .botms { width: 100%; height: 37px; margin-top: 40px; padding: 15px 0; border-top: 1px solid rgba(255,255,255,0.1);}
.footer .botms li { float: left; width: 37px; height: 37px; margin-right: 10px; overflow: hidden; background-repeat: no-repeat; background-position: center;}
.footer .botms li a,
.footer .botms li img { display: block; width: 37px; height: 37px;}

.footer .botms p { float: right; line-height: 37px; font-size: 13px; color: rgba(255,255,255,0.5);}

/*右侧客服*/
.webonline { width: 35px; position: fixed; right: 0; bottom: 10%; z-index: 99999;}
.webonline li { display: none; width: 35px; height: 35px; line-height: 35px; font-family: FontAwesome; font-size: 16px; color: #fff; text-align: center; cursor: pointer; border-radius: 4px; background: #004cca;}

/**栏目标题**/
.tits { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; height: 50px; margin-bottom: 25px;}
.tits h3 { line-height: 50px; font-size: 30px; color: #000; text-transform: Uppercase; padding: 0 30px; position: relative;}
.tits h3::before,
.tits h3::after { display: block; content: ""; width: 8px; height: 12px; background-repeat: no-repeat; background-position: center; position: absolute; top: 25px;}
.tits h3::before { background-image: url(../images/sz03.png); left: 0;}
.tits h3::after { background-image: url(../images/sz04.png); right: 0;}
.more { display: block; width: 130px; height: 50px; line-height: 50px; font-weight: bold; font-size: 16px; color: #fff; text-transform: Uppercase; padding: 0 25px 0 20px; border-radius: 25px; background: #004cca url(../images/sz05.png) no-repeat 145px center; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease;}
.more:hover { border-radius: 4px;}

/*简介*/
.about { width: 100%; padding: 70px 0; overflow: hidden;}
.about .img { float: left; width: 610px; height: 680px; border-radius: 20px; overflow: hidden; position: relative;}
.about .img img { display: block; width: 100%; height: 100%; -webkit-transition: all .5s ease; transition: all .5s ease;}
.about .img a { display: flex; flex-direction: row; justify-content: center; align-items: center; width: 285px; height: 50px; padding-top: 20px; border-radius: 20px 0 0 0; overflow: hidden; background: #fff; position: absolute; right: 0; bottom: 0; z-index: 2;}
.about .img a i { display: block; width: 30px; height: 30px; padding: 10px; border-radius: 50%; overflow: hidden; background: #abc929 url(../images/sz02.png) no-repeat center;}
.about .img a b { display: block; line-height: 50px; font-size: 18px; color: #000; text-transform: Uppercase; margin-left: 15px; padding-right: 25px; position: relative;}
.about .img a b::after { display: block; content: ""; width: 0; height: 0; margin: auto; border-style: solid; border-width: 6px 0 6px 6px; border-color: transparent transparent transparent #abc929; border-radius: 4px; overflow: hidden; position: absolute; top: 0; bottom: 0; right: 0;}
.about .img:hover img { transform: scale(1.1,1.1);}
.about .msg { float: right; width: calc(100% - 670px);}
.about .msg h1 { width: 100%; height: 50px; margin-bottom: 20px;}
.about .msg h1 span {display: inline-block; line-height: 50px; font-size: 30px; color: #000; text-transform: Uppercase; padding: 0 30px; position: relative;}
.about .msg h1 span::before,
.about .msg h1 span::after { display: block; content: ""; width: 8px; height: 12px; background-repeat: no-repeat; background-position: center; position: absolute; top: 25px;}
.about .msg h1 span::before { background-image: url(../images/sz03.png); left: 0;}
.about .msg h1 span::after { background-image: url(../images/sz04.png); right: 0;}
.about .msg .lh { height: 300px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 10; -webkit-box-orient: vertical;}
.about .msg .more { margin: 40px 0 70px 0;}
.about .msg li { float: left; width: calc(100% / 3); padding-top: 60px; background-repeat: no-repeat; background-position: left top;}
.about .msg .tp01 { background-image: url(../images/sz06.png);}
.about .msg .tp02 { background-image: url(../images/sz07.png);}
.about .msg .tp03 { background-image: url(../images/sz08.png);}
.about .msg li h3 { display: flex; flex-direction: row; align-items: flex-start; width: 100%; height: 50px; line-height: 50px; font-family: 'Oswald'; font-size: 34px; color: #000;}
.about .msg li h3 sub { display: block; margin-left: 5px;}
.about .msg li p { width: 100%; height: 25px; line-height: 25px; font-size: 14px; color: #999;}

/*产品*/
.prods { width: 100%; padding: 70px 0; overflow: hidden; background: #f0f2f5 url(../images/sz09.jpg) no-repeat center top;}
.prods .tits { margin-bottom: 35px;}
.prods .tits h3 { color: #fff;}
.prods .more { float: right; padding: 0 10px 0 0; border-radius: 0; background: url(../images/sz05.png) no-repeat right center;}
.prods .tabs { display: flex; flex-direction: row; justify-content: space-between; width: 100%; height: 50px; margin-bottom: 60px;}
.prods .tabs p { float: left; line-height: 50px; font-size: 14px; color: #fff; cursor: pointer; text-align: center; margin-right: 15px; padding: 0 25px; border-radius: 25px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: rgba(255,255,255,0.1); position: relative; -webkit-transition: all .5s ease; transition: all .5s ease;}
.prods .tabs p:last-child { margin-right: 0;}
.prods .tabs p.on { background: #abc929;}
.prods .swiper-slide {}
.prods .swiper-slide .swiper-container { padding-bottom: 80px;}
.prods .swiper-slide .swiper-slide { width: 306px; height: 400px; border-radius: 15px 15px 0 0; overflow: hidden; background: #fff;}
.prods .swiper-slide .swiper-slide a { display: block; padding: 20px 20px 70px 20px; position: relative;}
.prods .swiper-slide .swiper-slide a::after { display: block; content: ""; width: 0; height: 0; border-style: solid; border-width: 0 0 65px 65px; border-color: transparent transparent #f0f2f5 transparent; overflow: hidden; position: absolute; right: 0; bottom: 0; z-index: 3;}
.prods .swiper-slide .swiper-slide .img { width: 100%; height: 310px; overflow: hidden;}
.prods .swiper-slide .swiper-slide .img img { display: block; width: 100%; height: 100%; -webkit-transition: all .5s ease; transition: all .5s ease;}
.prods .swiper-slide .swiper-slide .msg { width: 100%; height: 0%; overflow: hidden; background: linear-gradient(rgba(255,255,255,0) 20%,#abc929); position: absolute; left: 0; bottom: 0; z-index: 2; -webkit-transition: all .5s ease; transition: all .5s ease;}
.prods .swiper-slide .swiper-slide .msg i { display: block; width: 100%; height: 320px; position: relative;}
.prods .swiper-slide .swiper-slide .msg i::before,
.prods .swiper-slide .swiper-slide .msg i::after { display: block; content: ""; margin: auto; background: #fff; position: absolute; left: 0; right: 0;}
.prods .swiper-slide .swiper-slide .msg i::before { width: 40px; height: 3px; top: 200px;}
.prods .swiper-slide .swiper-slide .msg i::after { width: 3px; height: 40px; top: 180px;}
.prods .swiper-slide .swiper-slide .msg h3 { width: 75%; height: 80px; line-height: 80px; font-size: 18px; color: #fff; text-transform: Uppercase; padding-left: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.prods .swiper-slide .swiper-slide:hover .img img { transform: scale(0.95);}
.prods .swiper-slide .swiper-slide:hover .msg { height: 100%;}
.prods .swiper-slide .swiper-button-prev,
.prods .swiper-slide .swiper-button-next { width: 30px; height: 70px; overflow: hidden; background: #004cca; top: 40%; -webkit-transition: all .5s ease; transition: all .5s ease;}
.prods .swiper-slide .swiper-button-prev { border-radius: 0 4px 4px 0; left: 0;}
.prods .swiper-slide .swiper-button-next { border-radius: 4px 0 0 4px; right: 0;}
.prods .swiper-slide .swiper-button-prev::after,
.prods .swiper-slide .swiper-button-next::after { font-size: 16px; color: #fff;}
.prods .swiper-slide .swiper-button-prev:hover,
.prods .swiper-slide .swiper-button-next:hover { background: #abc929;}
.prods .swiper-slide .swiper-scrollbar { width: 100%; height: 3px; left: 0; bottom: 0;}
.prods .swiper-slide .swiper-scrollbar .swiper-scrollbar-drag { background: #004cca;}

/*优势*/
.advants { width: 100%; padding: 70px 0; overflow: hidden;}
.advants .tits { justify-content: center;}
.advants li { float: left; width: calc(100% / 4 - 79px); margin-right: 20px; padding: 30px; border: 2px solid #edf0f4; border-radius: 10px; overflow: hidden; background: #fff; -webkit-transition: all .5s ease; transition: all .5s ease;}
.advants li:last-child { margin-right: 0;}
.advants li .top { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%;}
.advants li .top i { display: block; width: 40px; height: 40px; padding: 15px; border-radius: 50%; overflow: hidden; background-color: #f0f9ff; background-repeat: no-repeat; background-position: center; -webkit-transition: all .5s ease; transition: all .5s ease;}
.advants li .top h3 { width: calc(100% - 90px); height: 60px; line-height: 30px; font-size: 20px; color: #000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; -webkit-transition: all .5s ease; transition: all .5s ease;}
.advants li p { width: 100%; height: 45px; line-height: 22px; font-size: 14px; color: #999; margin-top: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; -webkit-transition: all .5s ease; transition: all .5s ease;}
.advants li:hover { border-color: #004cca; background: #004cca;}
.advants li:hover .top i { background-color: #fff;}
.advants li:hover .top h3 { color: #fff;}
.advants li:hover p { color: rgba(255,255,255,0.8);} 
.advants li.ad01 .top i { background-image: url(../images/sz10.png);}
.advants li.ad01:hover .top i { background-image: url(../images/sz10h.png);}
.advants li.ad02 .top i { background-image: url(../images/sz11.png);}
.advants li.ad02:hover .top i { background-image: url(../images/sz11h.png);}
.advants li.ad03 .top i { background-image: url(../images/sz12.png);}
.advants li.ad03:hover .top i { background-image: url(../images/sz12h.png);}
.advants li.ad04 .top i { background-image: url(../images/sz13.png);}
.advants li.ad04:hover .top i { background-image: url(../images/sz13h.png);}

/*案例*/
.cases { width: 100%; padding-bottom: 70px; overflow: hidden;}
.cases .tits { justify-content: center;}
.cases .more { margin: 10px auto 0 auto;}
.cases li { float: left; width: calc(100% / 3 - 24px); margin: 0 30px 40px 0; border: 2px solid #edf0f4; border-radius: 10px; overflow: hidden; background: #fff; -webkit-transition: all .5s ease; transition: all .5s ease;}
.cases li:nth-child(3n) { margin-right: 0;}
.cases li a { display: block; padding: 25px;}
.cases li .top { width: 100%; height: 30px; margin-bottom: 50px;}
.cases li .top p { float: left; display: flex; flex-direction: row; align-items: center; height: 30px; line-height: 30px;}
.cases li .top p img { display: block; width: 30px; height: 30px; margin-right: 10px;}
.cases li .top p span { display: block; font-size: 14px; color: #004cca; padding: 0 10px; border-radius: 10px; overflow: hidden; background: #f0f9ff;}
.cases li .top .tim { float: right; line-height: 30px; font-size: 14px; color: #77859a; padding-left: 20px; background: url(../images/sz14.png) no-repeat left center;}
.cases li h3 { width: 100%; height: 70px; line-height: 35px; font-weight: 500; font-size: 26px; color: #000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; -webkit-transition: all .5s ease; transition: all .5s ease;}
.cases li:hover { border-color: #004cca;}
.cases li:hover h3 { color: #004cca;}

/*************** 子页公用 *******************/
.fl { float: left;}
.fr { float: right;}

.content { width: 1300px; margin: 0 auto; padding: 25px 0;}

.comnav { width: 100%; overflow: hidden; background: #fff;}
.comnav p { height: 45px; line-height: 45px; font-size: 14px; color: #999; padding-left: 25px; background: url(../images/posit.png) no-repeat left center / 18px;}
.comnav p a { color: #333;}
.comnav p a:last-child { color: #004cca;}
.comnav h3 { width: 100%; height: 65px; line-height: 65px; font-size: 50px; color: #000; text-align: center; text-transform: Uppercase; letter-spacing: 4px; margin: 15px 0 30px 0;}
.comnav .lst { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; width: 100%; margin-bottom: 30px;}
.comnav .lst a { display: block; text-align: center; margin: 0 5px 10px 5px; padding: 20px 15px; border: 2px solid #f0f9ff; border-radius: 10px; background: #f0f9ff; -webkit-transition: all .5s ease; transition: all .5s ease;}
.comnav .lst a img { display: block; width: 30px; height: 30px; margin: 5px auto 10px auto;}
.comnav .lst a b { display: block; width: 100%; line-height: 25px; font-size: 14px; color: #004cca; -webkit-transition: all .5s ease; transition: all .5s ease;}
.comnav .lst a:hover { border-color: #004cca;}
.comnav .lst .on { border-color: #004cca; background: #004cca;}
.comnav .lst .on img { filter: grayscale(100) brightness(100);}
.comnav .lst .on b { color: #fff;}

/*详情页公用*/
.lh { min-height: 500px; line-height: 30px; font-size: 16px; color: #333; text-align: justify;}
.lh img { max-width: 100%; height: auto !important;}
.show_h3 { width: 100%; margin: 15px 0 50px 0;}
.show_h3 h3 { line-height: 65px; font-size: 50px; color: #000; margin-bottom: 15px;}
.show_h3 p { width: 100%; height: 30px; line-height: 30px; font-size: 14px; color: #333;}
.show_h3 p span { display: inline-block; margin-right: 30px;}
.show_sxp { width: 100%; height: 60px; line-height: 60px; font-size: 16px; color: #999; margin-top: 30px; border-top: 1px solid #eee;}
.show_sxp p { width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.show_sxp a { color: #333;}
.show_sxp .fr { text-align: right;}
.show_sxp p a:hover { color: #004cca;}
.serchms { height: 300px; line-height: 300px; font-size: 50px; color: #000; text-align: center;}

/*分页*/
.scott { text-align: center; margin-top: 20px; overflow: hidden;}
.scott li { display: inline-block; line-height: 45px; margin: 0 5px; border: 1px solid #eee; border-radius: 4px; overflow: hidden; background: #fff; -webkit-transition: all .5s ease; transition: all .5s ease;}
.scott a,
.scott span { display: block; padding: 0 20px; font-size: 16px; color: #666; cursor: pointer; -webkit-transition: all .5s ease; transition: all .5s ease;}
.scott li:hover,
.scott .active { color: #004cca; border-color: #004cca; background: #004cca;}
.scott li:hover a,
.scott li:hover span,
.scott .active span { color: #fff;}

/*新闻列表*/
.newlist { width: 100%;}
.newlist li { float: left; width: calc(100% / 4 - 19px); margin: 0 20px 20px 0; border: 2px solid #edf0f4; border-radius: 10px; overflow: hidden; background: #fff; -webkit-transition: all .5s ease; transition: all .5s ease;}
.newlist li:nth-child(4n) { margin-right: 0;}
.newlist li a { display: block; padding: 20px;}
.newlist li .img { width: 100%; height: 135px; overflow: hidden;}
.newlist li .img img { display: block; width: 100%; min-height: 100%; -webkit-transition: all .5s ease; transition: all .5s ease;}
.newlist li h3 { width: 100%; height: 60px; line-height: 30px; font-size: 20px; color: #000; margin: 15px 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; -webkit-transition: all .5s ease; transition: all .5s ease;}
.newlist li p { width: 100%; height: 50px; line-height: 25px; font-size: 14px; color: #999; margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.newlist li span { display: block; height: 20px; line-height: 20px; font-size: 12px; color: #999;}
.newlist li:hover { border-color: #004cca;}
.newlist li:hover .img img { transform: scale(1.1,1.1);}
.newlist li:hover h3 { color: #004cca;}

/*产品列表*/
.prolst { width: 100%;}
.prolst li { float: left; width: calc(100% / 4 - 21px); height: 400px; margin: 0 25px 25px 0; border: 1px solid #eee; border-radius: 15px 15px 0 15px; overflow: hidden; background: #fff;}
.prolst li:nth-child(4n) { margin-right: 0;}
.prolst li a { display: block; padding: 20px 20px 70px 20px; position: relative;}
.prolst li a::after { display: block; content: ""; width: 0; height: 0; border-style: solid; border-width: 0 0 65px 65px; border-color: transparent transparent #fff transparent; overflow: hidden; position: absolute; right: 0; bottom: 0; z-index: 3;}
.prolst li .img { width: 100%; height: 310px; overflow: hidden;}
.prolst li .img img { display: block; width: 100%; height: 100%; -webkit-transition: all .5s ease; transition: all .5s ease;}
.prolst li .msg { width: 100%; height: 0%; overflow: hidden; background: linear-gradient(rgba(255,255,255,0) 20%,#abc929); position: absolute; left: 0; bottom: 0; z-index: 2; -webkit-transition: all .5s ease; transition: all .5s ease;}
.prolst li .msg i { display: block; width: 100%; height: 320px; position: relative;}
.prolst li .msg i::before,
.prolst li .msg i::after { display: block; content: ""; margin: auto; background: #fff; position: absolute; left: 0; right: 0;}
.prolst li .msg i::before { width: 40px; height: 3px; top: 200px;}
.prolst li .msg i::after { width: 3px; height: 40px; top: 180px;}
.prolst li .msg h3 { width: 75%; height: 80px; line-height: 80px; font-size: 18px; color: #fff; text-transform: Uppercase; padding-left: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.prolst li:hover .img img { transform: scale(0.95);}
.prolst li:hover .msg { height: 100%;}

/*图片列表*/
.piclst { width: 100%;}
.piclst li { float: left; width: calc(100% / 3 - 24px); margin: 0 30px 40px 0; border: 2px solid #edf0f4; border-radius: 10px; overflow: hidden; background: #fff; -webkit-transition: all .5s ease; transition: all .5s ease;}
.piclst li:nth-child(3n) { margin-right: 0;}
.piclst li a { display: block; padding: 25px;}
.piclst li .top { width: 100%; height: 30px; margin-bottom: 50px;}
.piclst li .top p { float: left; display: flex; flex-direction: row; align-items: center; height: 30px; line-height: 30px;}
.piclst li .top p img { display: block; width: 30px; height: 30px; margin-right: 10px;}
.piclst li .top p span { display: block; font-size: 14px; color: #004cca; padding: 0 10px; border-radius: 10px; overflow: hidden; background: #f0f9ff;}
.piclst li .top .tim { float: right; line-height: 30px; font-size: 14px; color: #77859a; padding-left: 20px; background: url(../images/sz14.png) no-repeat left center;}
.piclst li h3 { width: 100%; height: 70px; line-height: 35px; font-weight: 500; font-size: 26px; color: #000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; -webkit-transition: all .5s ease; transition: all .5s ease;}
.piclst li:hover { border-color: #004cca;}
.piclst li:hover h3 { color: #004cca;}

/*详情页*/
.comlft { float: left; width: calc(100% - 400px);}
.comrgt { float: right; width: 300px;}
.comrgt .more { width: 100%; height: 70px; line-height: 70px; font-size: 22px; text-align: center; letter-spacing: 2px; padding: 0; border-radius: 4px; background: #004cca;}
.comrgt .more:hover { border-radius: 35px;}
.comrgt li { margin-top: 25px; border: 1px solid rgba(0,76,202,0.1); border-radius: 10px; box-shadow: 0 5px 10px rgba(0,76,202,0.05); overflow: hidden; background: #fff; -webkit-transition: all .5s ease; transition: all .5s ease;}
.comrgt li a { display: block; padding: 15px;}
.comrgt li i { display: inline-block; height: 25px; line-height: 25px; font-style: normal; font-size: 12px; color: #004cca; padding: 0 10px; border-radius: 4px; overflow: hidden; background: #f0f9ff;}
.comrgt li h3 { width: 100%; line-height: 30px; font-size: 20px; color: #000; margin-top: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; -webkit-transition: all .5s ease; transition: all .5s ease;}
.comrgt li p { width: 100%; height: 45px; line-height: 22px; font-size: 12px; color: #666; margin: 5px 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.comrgt li span { display: block; line-height: 25px; font-style: 12px; color: #999;}
.comrgt li:hover { border-color: #004cca; box-shadow: 0 5px 10px rgba(0,76,202,0.25);}
.comrgt li:hover h3 { color: #004cca;}