.case
{
	color: #333
}

.case .main
{
	margin: 50px auto 120px
}

@media only all and (max-width: 768px)
{
	.case .main
	{
		margin: 35px auto 30px
	}
}

.case .main>h5
{
	font-family: myFirstFont3;
	font-size: 30px;
	color: #90b44b;
}

@media only all and (max-width: 1366px)
{
	.case .main>h5
	{
		font-size: 24px
	}
}

@media only all and (max-width: 768px)
{
	.case .main>h5
	{
		font-size: 24px
	}
}

.case .main>p
{
	font-size: 24px
}

@media only all and (max-width: 1366px)
{
	.case .main>p
	{
		font-size: 19px;
		margin-bottom: 10px
	}
}

@media only all and (max-width: 768px)
{
	.case .main>p
	{
		font-size: 18px
	}
}

.case .main .content
{
	margin-top: 50px
}

@media only all and (max-width: 768px)
{
	.case .main .content
	{
		margin-top: 15px
	}
}

.case .main .content>a
{
	position: relative;
	display: block;
	float: left;
	width: 50%;
	font-size: 0;
	box-sizing: border-box;
	border-bottom: 2px solid #fff;
	border-right: 2px solid #fff;
	overflow: hidden
}

@media only all and (max-width: 768px)
{
	.case .main .content>a
	{
		width: 100%;
		float: none
	}
}

.case .main .content>a>img
{
	width: 100%;
	transition: 2s all;
	max-width: 100%;
	height: 100%
}

.case .main .content>a .txt
{
	position: absolute;
	left: 30px;
	bottom: 30px;
	color: #fff
}

.case .main .content>a .txt>h5
{
	font-size: 23.86px;
	font-family: myFirstFont2;
	text-transform: uppercase
}

@media only all and (max-width: 1440px)
{
	.case .main .content>a .txt>h5
	{
		font-size: 17px
	}
}

@media only all and (max-width: 768px)
{
	.case .main .content>a .txt>h5
	{
		font-size: 16px
	}
}

.case .main .content>a .txt>p
{
	font-size: 23.86px
}

@media only all and (max-width: 1440px)
{
	.case .main .content>a .txt>p
	{
		font-size: 17px
	}
}

@media only all and (max-width: 768px)
{
	.case .main .content>a .txt>p
	{
		font-size: 16px
	}
}

.case .main .content>a .hover_img
{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	transition: 1s all;
	background: rgba(144,180,75,0.8);
	opacity: 0
}

@media only all and (max-width: 768px)
{
	.case .main .content>a .hover_img
	{
		display: none
	}
}

.case .main .content>a .hover_img>div
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	text-align: center
}

.case .main .content>a .hover_img>div .icon
{
	margin-bottom: 35px;
	text-align: center
}

.case .main .content>a:nth-child(2n)
{
	border-right: none
}

.case .main .content>a:hover .hover_img
{
	opacity: 1
}

.case .main .content>a:hover>img
{
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1)
}

.case_list .main .ellipsis
{
	margin: 50px auto 30px
}

@media only all and (max-width: 768px)
{
	.case_list .main .ellipsis
	{
		margin: 15px auto 15px
	}
}

.case_list .main>span
{
	font-size: 16px;
	color: #020202
}

.case_list .main .content>a
{
	width: 33.3%
}

@media only all and (max-width: 768px)
{
	.case_list .main .content>a
	{
		width: 100%;
		float: none
	}
}

.case_list .main .content>a:nth-child(2n)
{
	border-right: 2px solid #fff
}

.case_list .main .content>a .txt>p
{
	font-size: 16px
}

.case_details
{
	margin-top: 90px
}

@media only all and (max-width: 1366px)
{
	.case_details
	{
		margin-top: 70px
	}
}

.case_details .main
{
	margin-top: 60px;
	height: 660px;
	overflow: hidden;
	margin-bottom: 120px
}

@media only all and (max-width: 1280px)
{
	.case_details .main
	{
		height: 642px
	}
}

@media only all and (max-width: 1024px)
{
	.case_details .main
	{
		height: 582px
	}
}

@media only all and (max-width: 768px)
{
	.case_details .main
	{
		height: auto
	}
}

.case_details .main .left
{
	float: left;
	width: 66.6%
}

@media only all and (max-width: 768px)
{
	.case_details .main .left
	{
		width: 100%;
		float: none
	}
}

.case_details .main .left .inner_t
{
	padding: 55px 40px;
	background: #999999;
	color: #fff
}

@media only all and (max-width: 768px)
{
	.case_details .main .left .inner_t
	{
		padding: 30px 20px
	}
}

.case_details .main .left .inner_t>h5
{
	font-size: 24px;
	margin-bottom: 25px
}

@media only all and (max-width: 1366px)
{
	.case_details .main .left .inner_t>h5
	{
		font-size: 20px
	}
}

@media only all and (max-width: 768px)
{
	.case_details .main .left .inner_t>h5
	{
		font-size: 19px
	}
}

@media only all and (max-width: 768px)
{
	.case_details .main .left .inner_t>h5
	{
		font-size: 14px
	}
}

.case_details .main .left .inner_t>p
{
	font-size: 14px
}

.case_details .main .left .inner_t>p>span i
{
	display: inline-block;
	width: 14px;
	height: 14px;
	vertical-align: middle;
	margin-right: 5px
}

.case_details .main .left .inner_t>p .time
{
	letter-spacing: 2px;
	margin-right: 50px
}

@media only all and (max-width: 768px)
{
	.case_details .main .left .inner_t>p .time
	{
		margin-right: 15px
	}
}

.case_details .main .left .inner_t>p .time i
{
	background: url("../images/time_icon.png") no-repeat
}

.case_details .main .left .inner_t>p .place i
{
	background: url("../images/poititon_icon.png") no-repeat
}

.case_details .main .left .inner_b
{
	height: 530px
}

.case_details .main .left .inner_b .swiper-container
{
	height: 100% !important
}

.case_details .main .left .inner_b .swiper-container .swiper-slide>img
{
	width: 100%;
	max-width: 100%;
	max-height: 100%
}

.case_details .main .left .inner_b .next
{
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	right: auto;
	width: 65px;
	height: 65px;
	background: url("../images/prev_1.jpg") no-repeat;
	background-size: 100% 100%
}

@media only all and (max-width: 1366px)
{
	.case_details .main .left .inner_b .next
	{
		width: 50px;
		height: 50px
	}
}

@media only all and (max-width: 414px)
{
	.case_details .main .left .inner_b .next
	{
		width: 35px;
		height: 35px
	}
}

.case_details .main .left .inner_b .next:hover
{
	background: url("../images/prev_h_1.jpg") no-repeat;
	background-size: 100% 100%
}

.case_details .main .left .inner_b .prev
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	left: auto;
	right: 0;
	width: 65px;
	height: 65px;
	background: url("../images/next_1.jpg") no-repeat;
	background-size: 100% 100%
}

@media only all and (max-width: 1366px)
{
	.case_details .main .left .inner_b .prev
	{
		width: 50px;
		height: 50px
	}
}

@media only all and (max-width: 414px)
{
	.case_details .main .left .inner_b .prev
	{
		width: 35px;
		height: 35px
	}
}

.case_details .main .left .inner_b .prev:hover
{
	background: url("../images/next_h_1.jpg") no-repeat;
	background-size: 100% 100%
}

.case_details .main .right
{
	float: left;
	width: 33.4%;
	height: 100%
}

@media only all and (max-width: 768px)
{
	.case_details .main .right
	{
		width: 100%;
		float: none;
		height: auto
	}
}

.case_details .main .right .inner_t
{
	height: 72%;
	background: #f7f7f7
}

.case_details .main .right .inner_t>p
{
	position: relative;
	width: 80%;
	height: 82%;
	top: 50px;
	left: 50%;
	overflow: hidden;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	line-height: 3
}

@media only all and (max-width: 1366px)
{
	.case_details .main .right .inner_t>p
	{
		line-height: 2.5
	}
}

@media only all and (max-width: 1024px)
{
	.case_details .main .right .inner_t>p
	{
		line-height: 2
	}
}

@media only all and (max-width: 768px)
{
	.case_details .main .right .inner_t>p
	{
		top: 0;
		left: 0;
		margin: 0 auto;
		padding: 20px 0;
		width: 90%;
		transform: translateX(0) translateY(0);
		-webkit-transform: translateX(0) translateY(0);
		-moz-transform: translateX(0) translateY(0)
	}
}

.case_details .main .right .inner_b
{
	height: 28%;
	background: #ff9134;
	color: #fff;
	text-align: center;
	padding: 40px 0
}

.case_details .main .right .inner_b>a p
{
	text-align: center
}

.case_details .main .right .inner_b .title
{
	font-size: 18px;
	font-weight: bold
}

.swiper-slide
{
	display: inline-block
}

.will
{
	display: inline-block;
	width: 100%;
	position: relative
}

.will img
{
	width: 100%
}

.openVideo
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	width: 72px !important
}

@media only all and (max-width: 1024px)
{
	.openVideo
	{
		width: 50px !important
	}
}