/* CSS Document */
@import url("core.css");
@import url("public.css");

#container {
	padding: 60px 0;
	background: #fff
}

.height60 {
	height: 60px
}

.center {
	width: 1200px;
	margin: 0 auto
}

.cate_ul {
	max-width: 1300px;
	margin: 0 auto;
	margin-bottom: 30px
}

.cate_ul li {
	float: left;
	margin-right: 35px;
	margin-bottom: 15px
}

.cate_ul li a {
	display: block;
	padding: 8px 0;
	line-height: 20px;
	background: 0 0;
	color: #666;
	text-align: center;
	vertical-align: middle;
	-moz-box-shadow: 2px 2px 5px transparent;
	-webkit-box-shadow: 2px 2px 5px transparent;
	box-shadow: 2px 2px 5px transparent;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-moz-border-radius: 4px;
	font-size: 14px
}

.cate_ul li.on a,
.cate_ul li.on a:hover {
	color: #d80000
}

.cate_ul li a:hover {
	color: #d80000
}

#case_ul {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	max-width: 100%;
	margin: 0 auto
}

#case_ul ul {
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap
}

#case_ul li {
	float: left;
	width: 360px;
	margin-right: 30px;
	margin-bottom: 30px;
	-webkit-transition: .3s;
	-moz-transition: .3s;
	transition: .3s
}

#case_ul li:hover {
	color: #fff
}

#case_ul li:hover a {
	color: #fff
}

#case_ul li:hover p {
	color: #fff
}

#case_ul li .thumb {
	display: block;
	margin-bottom: 15px;
	position: relative;
	overflow: hidden
}

#case_ul li .thumb img {
	-webkit-transition: .3s;
	-moz-transition: .3s;
	transition: .3s
}

#case_ul li:hover .thumb img {
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	transform: scale(1.2)
}

#case_ul li .thumb:before {
	width: 100%;
	height: 100%;
	background: #000;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	transform: scale(0);
	opacity: 0;
	-webkit-transition: opacity .5s ease-out;
	-moz-transition: opacity .5s ease-out;
	transition: opacity .5s ease-out;
	z-index: 989
}

#case_ul li:after {
	content: "";
	display: block;
	height: 10px;
	width: 100%;
	background: #fff
}

#case_ul li:hover .thumb:before {
	opacity: .6;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	transform: scale(1)
}

#case_ul li:hover:after {
	background: 0 0
}

#case_ul li .thumb img {
	width: 100%;
	height: auto;
	display: block
}

#case_ul li:nth-child(4n) {
	margin-right: 0
}

#case_ul li a.thumb {
	padding-bottom: 0;
	height: 360px;
	overflow: hidden
}

#case_ul li a {
	color: #333;
	font-size: 14px;
	font-weight: 700;
	display: block;
	margin-bottom: 5px;
	line-height: 24px
}

#case_ul li a.title {
	padding-left: 15px;
	padding-right: 15px
}

#case_ul li a span {
	padding-bottom: 3px;
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis
}

#case_ul li p {
	font-size: 12px;
	color: #ccc;
	display: block;
	padding: 0 15px;
	overflow: hidden;
	height: 41px
}

#case_ul li .thumb:after {
	content: "";
	background: url(../images/hlogo.png) no-repeat center center;
	display: block;
	width: 69px;
	height: 69px;
	margin-left: -34.5px;
	margin-top: -34.5px;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 990;
	opacity: 0;
	-webkit-transition: opacity .5s ease-out;
	-moz-transition: opacity .5s ease-out;
	transition: opacity .5s ease-out;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	transform: scale(0)
}

#case_ul li .back {
	background: #fff;
	-webkit-transition: .3s;
	-moz-transition: .3s;
	transition: .3s
}

#case_ul li:hover .back {
	background: 0 0
}

#case_ul li .thumb:hover:after {
	opacity: 1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	transform: scale(1)
}

@-webkit-keyframes opacity {
	0% {
		-webkit-transform: scale(0);
		-moz-transform: scale(0);
		transform: scale(0)
	}

	100% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes opacity {
	0% {
		-webkit-transform: scale(0);
		-moz-transform: scale(0);
		transform: scale(0)
	}

	100% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		transform: scale(1)
	}
}

#csoe_show .tips {
	margin-top: 25px;
	border-top: 1px solid #eee;
	padding-top: 15px
}

#csoe_show .case_content {
	max-width: 1530px
}

.case_content {
	max-width: 1200px;
	margin: 0 auto;
	color: #6a6a6a;
	font-size: 14px;
	line-height: 1.8
}

.case_info {
	padding-top: 10px;
	float: left;
	width: 1200px;
	position: relative
}

.case_info:after {
	z-index: 990;
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: block
}

.case_info p{
	margin-bottom: 10px;
}

.case_info img {
	max-width: 100%;
	height: auto
}

.case_h1 {
	float: right;
	width: 300px
}

.case_h1 h1 {
	font-size: 20px;
	font-weight: 700;
	color: #333;
	margin-bottom: 15px
}

.case_lt {
	float: left;
	width: 100%
}

.case_lt p {
	display: block;
	position: relative;
	padding-left: 50px;
	margin-bottom: 10px;
	min-height: 20px
}

.case_lt p label {
	font-weight: 700;
	position: absolute;
	left: 0;
	top: 0
}

.case_rt {
	float: right;
	width: 100%;
	line-height: 20px
}

.case_rt b {
	display: block;
	padding-bottom: 10px
}

.case_copy {
	border-top: 1px solid #eee;
	margin-top: 20px;
	padding-top: 15px
}

.case_keyword {
	border-top: 1px solid #eee;
	margin-top: 30px;
	padding-top: 15px
}

#header {
	max-width: 1530px
}

#case_body .cate_ul {
	max-width: 1530px
}

#case_body .cate_ul p {
	display: block
}

#case_body .cate_ul p a,
#case_body .cate_ul p span {
	display: inline-block;
	margin-right: 15px;
	vertical-align: middle;
	color: #999
}

#case_body .cate_ul p a {
	color: #828181;
	margin-right: 25px;
	font-size: 14px
}

#case_body .cate_ul p a.on,
#case_body .cate_ul p a:hover {
	color: #d80000
}

#case_body #container {
	padding-top: 50px
}

.case_center {
	max-width: 1530px;
	margin: 0 auto
}

.news_info {
	max-width: 1300px;
	margin: 0 auto;
	font-size: 14px;
	line-height: 1.8;
	color: #333
}

.news_info .news_title {
	display: block;
	font-weight: 400
}

.news_p {
	display: block;
	padding: 10px 0;
	border-bottom: 1px solid #dedede
}

.news_container {
	margin-top: 25px;
	margin-bottom: 25px
}

.news_container img {
	max-width: 100%;
	vertical-align: top
}

.tips {
	display: block;
	padding-top: 15px
}

.tips span {
	vertical-align: middle
}

.tips a {
	font-size: 13px;
	color: #333;
	vertical-align: middle;
	margin-right: 25px
}

.tips a:hover {
	color: #ce050b
}

#body_news {
	background: #f9f9f9
}

#body_news #container {
	background: 0 0
}

#body_news .cate_ul {
	max-width: 1530px
}

#news_ul {
	max-width: 1530px;
	margin: 0 auto
}

#news_ul * {
	transition: All .3s ease;
	-ms-transition: All .3s ease;
	-moz-transition: All .3s ease;
	-webkit-transition: All .3s ease
}

#news_ul ul {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap
}

#news_ul li {
	float: left;
	width: 23.5%;
	margin-right: 2%;
	background: #fff;
	margin-bottom: 2%;
	padding: 20px
}

#news_ul li:hover {
	box-shadow: 0 15px 50px 0 rgba(0, 0, 0, .18);
	-ms-box-shadow: 0 15px 50px 0 rgba(0, 0, 0, .18);
	-moz-box-shadow: 0 15px 50px 0 rgba(0, 0, 0, .18);
	-webkit-box-shadow: 0 15px 50px 0 rgba(0, 0, 0, .18);
	-webkit-transform: rotate(0) scale(1) translate(0, 0);
	transform: rotate(0) scale(1) translate(0, 0)
}

#news_ul li .thumb {
	display: block;
	overflow: hidden;
	margin-bottom: 10px
}

#news_ul li .thumb img {
	display: block;
	width: 100%;
	height: 198px
}

#news_ul li:nth-child(4n) {
	margin-right: 0
}

#news_ul li a.title {
	font-size: 14px;
	display: block
}

#news_ul li p.desc {
	line-height: 20px;
	overflow: hidden;
	height: 40px;
	margin-top: 10px;
	margin-bottom: 10px
}

#cases_hot {
	margin-top: 25px
}

#cases_hot #case_ul li {
	width: 277.5px
}

#cases_hot #case_ul li a.thumb {
	height: 277.5px
}

#return_a {
	margin-top: 25px
}

#return_a a {
	border: 1px solid #ddd;
	display: inline-block;
	padding: 8px 15px;
	color: #6a6a6a;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-moz-border-radius: 3px
}

#return_a a i {
	margin-right: 10px
}

#return_a a:hover {
	background: #d80000;
	color: #fff;
	border-color: #d80000
}

.toolbar {
	width: 52px
}

@media screen and (max-width:1620px) {
	#case_body .cate_ul {
		max-width: none
	}

	.case_center {
		max-width: 100%;
		padding-left: 45px;
		padding-right: 45px
	}

	#cases_hot #case_ul li {
		width: 24%;
		margin-right: 1.333333333333333%;
		margin-bottom: 1.333333333333333%
	}

	#cases_hot #case_ul li a.thumb {
		height: auto
	}

	#cases_hot #case_ul li:nth-child(4){
		margin-right: 0;
	}

	#csoe_show .case_content {
		max-width: 100%;
		padding-left: 45px;
		padding-right: 45px
	}

	.case_info {
		width: 70%
	}

	.case_h1 {
		width: 30%;
		padding-left: 45px
	}
}

@media screen and (max-width:1530px) {
	#body_news .cate_ul {
		padding: 0 45px
	}

	#news_ul {
		padding: 0 45px
	}

	.news_info {
		padding: 0 45px
	}

	#news_ul li .thumb img {
		height: 11.56862745098039vw
	}
}

@media screen and (max-width:1230px) {
	.cate_ul li {
		margin-bottom: 0
	}
}

@media screen and (max-width:1200px) {
	#cases_hot #case_ul li {
		width: 32%;
		margin-right: 2%;
		margin-bottom: 2%
	}

	#cases_hot #case_ul li:nth-child(4n) {
		margin-right: 2%
	}

	#cases_hot #case_ul li:nth-child(3n) {
		margin-right: 0
	}
}

@media screen and (max-width:1000px) {
	.case_info {
		width: 100%
	}

	.case_h1 {
		width: 100%;
		padding-left: 0
	}

	#return_a,
	.case_copy {
		display: none
	}

	#news_ul li {
		width: 32%;
		margin-right: 2%
	}

	#news_ul li:nth-child(4n) {
		margin-right: 2%
	}

	#news_ul li:nth-child(3n) {
		margin-right: 0
	}

	#news_ul li .thumb img {
		height: 15vw
	}

	#body_news #container {
		padding: 40px 0
	}
}

@media screen and (max-width:800px) {
	.news_info {
		padding: 0 25px
	}

	#body_news .cate_ul {
		margin-bottom: 15px
	}

	#body_news .cate_ul {
		padding: 0 25px
	}

	#news_ul {
		padding: 0 25px
	}

	.case_center {
		max-width: 100%;
		padding-left: 25px;
		padding-right: 25px
	}

	#case_body #container {
		padding-top: 25px
	}

	#csoe_show .case_content {
		max-width: 100%;
		padding-left: 25px;
		padding-right: 25px
	}

	#body_news #container {
		padding: 30px 0
	}
}

@media screen and (max-width:600px) {
	#news_ul li {
		width: 49%;
		margin-right: 2%
	}

	#news_ul li:nth-child(4n) {
		margin-right: 2%
	}

	#news_ul li:nth-child(3n) {
		margin-right: 2%
	}

	#news_ul li:nth-child(2n) {
		margin-right: 0
	}

	#news_ul li .thumb img {
		height: 23.33333333333333vw
	}

	#case_ul li a {
		font-size: 12px;
	}

	#case_ul li a.title{
		padding-left: 5px;
		padding-right: 5px;
	}

	#case_ul li p{
		padding: 0 5px;
	}
}

@media screen and (max-width:500px) {
	#cases_hot #case_ul li {
		width: 49%;
		margin-right: 2%;
		margin-bottom: 2%;
		background:unset;
	}

	#cases_hot #case_ul li:nth-child(4n) {
		margin-right: 2%
	}

	#cases_hot #case_ul li:nth-child(3n) {
		margin-right: 2%
	}

	#cases_hot #case_ul li:nth-child(2n) {
		margin-right: 0
	}
}

@media screen and (max-width:350px) {
	#case_ul li {
		width: 100%;
		margin-right: 0;
		margin-bottom: 2%
	}

	#case_ul li:nth-child(4n) {
		margin-right: 0
	}

	#case_ul li:nth-child(3n) {
		margin-right: 0
	}

	#case_ul li:nth-child(2n) {
		margin-right: 0
	}
}

.case_info a {
	position: relative;
	z-index: 992
}
