
/* 客户案例 banner start */
.top-banner .title-box { padding: 80px 55px 0 0; text-align: right; }
.top-banner .title-box h1 { margin-bottom: 22px; font-size: 27px; text-shadow: 1px 2px 3px #000; }
.top-banner .title-box p { font-size: 17px; margin-bottom: 22px; }
.top-banner .title-box .btn { display: inline-block; padding: 0 20px; height: 36px; line-height: 36px; text-align: center; border-radius: 10px; font-size: 17px; color: #000; background-image: linear-gradient(90deg, #2b9be5, #2bf1f8); }
/* 客户案例 banner end */
/* 案例导航 strat*/
.case .case-nav ul { padding: 15px 0 0; }
.case .case-nav ul:nth-child(2) { padding: 0 0 0; }
.case .case-nav ul li { display: inline-block; margin-right: 10px; height: 50px; line-height: 50px; font-size: 16px; color: #666666; cursor: pointer; }
.case .case-nav ul li:nth-child(1) { cursor: default; }
.case .case-nav ul li span{ display: inline-block; line-height: 16px; border: 1px solid #fff; padding: 7px 21px; }
.case .case-nav ul li.active span{ border: 1px solid #e1e1e1; border-radius: 5px; }
.case .case-nav ul li.active span a { color: #f3813c !important; }
/* 案例导航 end*/
/* 案例 start */
.content { background-color: #f9f9f9; padding: 36px 0 26px; min-height: 300px; }
.content>div:nth-child(1){ display: block; }
.content>div { display: none; }
.case-box { display: flex; justify-content: flex-start; flex-wrap: wrap; }
.case-box .prod { display: block; width: 386px; height: 260px; margin: 0 18px 20px 0; cursor: pointer; background-color: #ffffff; border: 1px solid #cccccc; color: #000; }
.case-box .prod:nth-child(3n+3) { margin: 0 0 20px 0; }
.case-box .prod:hover{ box-shadow: 2px 3px 4px rgba(0,0,0,0.2), -2px -3px 5px rgba(0,0,0,0.2); }
.case-box .prod:hover .text{ color: #f3813c; }
.case-box .prod .prod-img { height: 180px; width: 100%; }
.case-box.prod .prod-img img { width: 100%; height: 100%; }
.case-box .prod .text { font-size: 18px; line-height: 30px; padding: 10px 20px 10px 10px; }
/* 案例 end */
@media screen and (max-width: 750px) {
	.top-banner .title-box { padding: 40px 0 0;}
	.top-banner .title-box h1 { margin-bottom: 5px; font-size: 14px; }
	.top-banner .title-box p { font-size: 14px; margin-bottom: 10px; }
	.top-banner .title-box .btn { padding: 0 15px; height: 26px; line-height: 26px; text-align: center; border-radius: 5px; font-size: 12px; }
	.case .case-nav ul { padding: 10px 0; }
	.case .case-nav ul li { margin-right: 0; font-size: 12px; height: 30px; line-height: 30px; }
	.case .case-nav ul li span { padding: 5px 10px; }
	.case .case-nav ul li.active span { background-color: #f27622; border: 1px solid #f27622; }
	.case .case-nav ul li.active span a { color: #fff !important; }
	.content { padding: 10px 0 20px; }
	.case-box .prod { height: 120px; width: calc(50% - 5px); margin: 0 5px 10px 0; position: relative; }
	.case-box .prod .prod-img { height: 120px; width: 100%; }
	.case-box .prod:nth-child(3n+3) { margin: 0 5px 10px 0; }
	.case-box .prod:nth-child(2n+2) { margin: 0; }
	.case-box .prod .text { position: absolute; bottom: 0; left: 0; width: 100%; box-sizing: border-box; color: #eee; background-color: rgba(0,0,0,.6); font-size: 12px; line-height: 24px; padding: 5px; -webkit-line-clamp: 1; }
}
