.banner{width: 100%;height: auto;overflow: hidden;}
.banner>img{max-width: 100%;display: block;}

.wrap .title{padding: 40px 0;}
/*.bline{border-bottom: 1px solid #ccc;}*/
.wrap .title h2{font-size: 30px;color:#000;}
.wrap .title h3{font-size: 30px;font-weight: bold;color:#000;width: 130px;margin: 0 auto;padding:12px 0;}
.wrap .title p{font-size: 14px;color: #000;margin-top: 40px;line-height: 1.6;}
.clearlove{width: 25%;float: left;}
.eyes_box{margin-top:20%;padding-bottom: 50px;position: relative;}
.eyes_con{width: 100%;text-align: center;float: right;cursor: pointer;}
.icon1,.icon2,.icon3,.icon4{width: 30%;margin: 0 auto;border:2px solid #a40000;border-radius: 100%;margin-bottom: 10px;}
/*.eyes_con:hover img{transform: scale(1.2);}*/
.eyes_con .icon1>img{width: 100%;display: block;margin: 0 auto;transition: .3s ease-out;}
.eyes_con .icon2>img{width: 100%;display: block;margin: 0 auto;transition: .3s ease-out;}
.eyes_con .icon3>img{width: 100%;display: block;margin: 0 auto;transition: .3s ease-out;}
.eyes_con .icon4>img{width: 100%;display: block;margin: 0 auto;transition: .3s ease-out;}
.eyes_con .txt-box>h2{font-size:16px;color: #000;padding: 10px 0;font-weight: bold;}
.eyes_con .txt-box>h3{font-size: 20px;color: #000;font-weight: bold;}
.hove-show{opacity:0;transition: 1.2s ease-out;}
.eyes_con:hover .hove-show{opacity: 1;}
.hove-show>h2{font-size: 20px;color: #a40000;font-weight: bold;}
.childtog{position: relative;top: 50%;margin-top: -10%;}
.chidline1{position: absolute;width: 1px;background: #ccc;height: 260px;bottom: 1px;left: 0;}
.chidline1>i{display: block;width: 15px;height: 15px;position: relative;right: 6px;background: #000;border-radius: 100%;}
.chidline2{position: absolute;width: 1px;background: #ccc;height: 260px;bottom: 1px;left:25%;}
.chidline2>i{display: block;width: 15px;height: 15px;position: relative;right: 6px;background: #000;border-radius: 100%;}
.chidline3{position: absolute;width: 1px;background: #ccc;height: 260px;bottom: 1px;right:25%;}
.chidline3>i{display: block;width: 15px;height: 15px;position: relative;right: 6px;background: #000;border-radius: 100%;}
.chidline4{position: absolute;width: 1px;background: #ccc;height: 400px;bottom: 1px;right:50%;}
.chidline4>i{display: block;width: 15px;height: 15px;position: relative;right: 6px;background: #000;border-radius: 100%;}
.chidline5{position: absolute;width: 1px;background: #ccc;height: 260px;bottom: 1px;right:0;}
.chidline5>i{display: block;width: 15px;height: 15px;position: relative;right: 6px;background: #000;border-radius: 100%;}

.main .title{padding: 40px 0;width: 1200px;margin: 0 auto;}
.main .title h2{font-size: 40px;color:#000;font-family: "Calibri Light";}
.main .title h3{font-size: 26px;font-weight: bold;color:#000;padding-top: 10px;padding-bottom: 20px;}
.main .title p{font-size: 14px;color: #000;margin-top: 40px;line-height: 1.6;}
.case_con{width:33.333%;float: left;position: relative;cursor: pointer;}
.case_con>img{width: 100%;display: block;transition: .5s ease-out;}
.cover{position: absolute;top:0;width:100%;height: 100%;background: rgba(0,0,0,0.65);box-sizing: border-box;opacity: 1;transition: .8s ease-out;}
.cover>h2{font-size: 34px;font-weight: bold; color: #fff;box-sizing: border-box;/*padding: 10px;*/text-align: center;padding-top: 20%;}
.cover>h3{color: #fff;font-weight: bold;text-align: center;/*font-family:"Calibri Light";*/  font-size:18px;font-weight: bold;padding-bottom: 10px;padding-top: 4px;}
.cover>p{font-size: 16px;color: #fff;box-sizing: border-box;padding: 5px;text-align: center;font-weight: bold;}
.cover .cline{width:0;height: 6px;background-color:#a40000;position: absolute;bottom: 0;transition: .5s ease-out;}
.case_con:hover .cover{opacity: 0}
.case_con:hover .cline{width: 100%;}
.block{display: block!important;}
.hidden .tab_con{margin-top: 10px;}
.hidden{width: 50%;margin: 0 auto;box-sizing: border-box;padding: 0 2px;}
.facbox{position: relative;}
.bline{height: 1px;width: 100%;background: #dcdddd;position: absolute;bottom: 0}
.three_tab{width: 33.333%;float: left;text-align: center;}
.tab_box{width: 50%;margin: 0 auto;}
.content{position: relative;padding-bottom: 60px;}
.bline38{position: absolute;bottom: 0;height: 1px;background: #dcdddd;width: 100%;}
.foot .title{margin-top: 20px;}
.tab_pic{width: 120px;height: 120px;margin: 0 auto;border:2px solid #a40000;border-radius: 100%;}
.tab_pic img{width: 100%;display: block;}
.ttname{padding-bottom: 40px;}
.ttname h2{font-size: 50px;text-align: center;padding-bottom: 30px;font-weight: bold;}
.ttname h2 span{color: #a40000;padding-left: 10px;}
.ttname p{font-size: 14px;text-align: center;padding: 4px 0;font-weight: bold;color: #000;}
.thbox{padding-top: 30px;}

/*.case-txt{position: absolute;top: 0;width: 100%;height: 100%;}
.case-txt>h2{font-size: 34px;font-weight: bold;color:#898989;box-sizing: border-box;text-align: center;padding-top: 20%;}
.case-txt>h3{color:#898989;font-weight: bold;text-align: center; font-size:18px;font-weight: bold;padding-bottom: 10px;padding-top: 4px;}
.case-txt>p{font-size: 16px;color:#898989;box-sizing: border-box;padding: 5px;text-align: center;font-weight: bold;}*/

@media(max-width: 1200px){
	.main .title{width: 100%;}
}
@media screen and (max-width: 1000px) and (min-width: 768px){
	.tab_pic{height: 240px;}
	.cover{padding: 170px 0;}
}
@media(max-width: 767px){
	.cover{padding: 60px 0;}
}
@media(max-width: 768px){
	.eyes_box{width: 100%;margin-top: 20px;}
	.icon1, .icon2, .icon3, .icon4,.chidline2,.chidline1,.chidline3,.chidline4,.chidline5,.hove-show{display: none;}
	.eyes_con .txt-box>h2{font-size: 12px;border-top: 1px solid #a40000;margin-top: 10px;/*margin-left: 10px; margin-right: 10px;*/display: inline-block;padding-bottom: 0;}
	.clearlove{float: none;width: 62%;margin-left: auto;margin-right: auto;margin-bottom: 20px;margin-top: 0;padding: 20px 0;border: 1px solid #a40000;}
	.eyes_con{float: none;}
	.childtog{top:0;    padding: 15px 0;}
	.eyes_con .txt-box>h3{font-size: 18px;}
	.case_con{width:100%;}
	.main .title{box-sizing:border-box; padding: 10px 4px;}
	.cover>h2{padding: 4px;font-size: 16px;}
	.cover>p{padding: 4px;font-size: 12px;}
	.tab_pic{width: 33%;text-align: center;margin: 0 auto;}
	.tab_pic img{width: 100%;display: block;}
	.tab_box,.hidden{width: 80%;}
	.white>p,.red>p{font-size: 16px;}
	.main .title p{margin-top: 10px;}
	.ttname h2{font-size: 28px;padding-bottom: 10px;}
	.three_tab{width: 100%;margin-bottom: 30px;}
	.content{padding-bottom: 10px;}
	.thbox{padding-top: 0;}
	
	.ttname{box-sizing: border-box;padding: 0 6px;padding-bottom: 20px;}
	.banner>img{transform: scale(1.7); padding: 7% 0;}
}
@media(max-width: 350px){
	.tab_pic{width: 38%;}
}

.clearlove:hover .big_item{
	/*-webkit-animation-name: jello;*/
	/*animation-name: jello;*/
	/*-webkit-transform-origin: center;*/
	/*transform-origin: center;*/
	-webkit-animation-name: rubberBand;
	animation-name: rubberBand;
}
.tab_pic:hover .big_item{
	/*-webkit-animation-name: jello;*/
	/*animation-name: jello;*/
	/*-webkit-transform-origin: center;*/
	/*transform-origin: center;*/
	-webkit-animation-name: rubberBand;
	animation-name: rubberBand;
}
.tab_pic>img,.tab_pic>img,.tab_pic>img,.tab_pic>img{
	display: block;
	margin: 0 auto;
	transition: 0.3s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
.eyes_con>.icon1>img,.eyes_con>.icon2>img,.eyes_con>.icon3>img,.eyes_con>.icon4>img{
	display: block;
	margin: 0 auto;
	transition: 0.3s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
@-webkit-keyframes jello {
	from, 11.1%, to {
		-webkit-transform: none;
		transform: none;
	}

	22.2% {
		-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
		transform: skewX(-12.5deg) skewY(-12.5deg);
	}

	33.3% {
		-webkit-transform: skewX(6.25deg) skewY(6.25deg);
		transform: skewX(6.25deg) skewY(6.25deg);
	}

	44.4% {
		-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
		transform: skewX(-3.125deg) skewY(-3.125deg);
	}

	55.5% {
		-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
		transform: skewX(1.5625deg) skewY(1.5625deg);
	}

	66.6% {
		-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
		transform: skewX(-0.78125deg) skewY(-0.78125deg);
	}

	77.7% {
		-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
		transform: skewX(0.390625deg) skewY(0.390625deg);
	}

	88.8% {
		-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
		transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
	}
}

@keyframes jello {
	from, 11.1%, to {
		-webkit-transform: none;
		transform: none;
	}

	22.2% {
		-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
		transform: skewX(-12.5deg) skewY(-12.5deg);
	}

	33.3% {
		-webkit-transform: skewX(6.25deg) skewY(6.25deg);
		transform: skewX(6.25deg) skewY(6.25deg);
	}

	44.4% {
		-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
		transform: skewX(-3.125deg) skewY(-3.125deg);
	}

	55.5% {
		-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
		transform: skewX(1.5625deg) skewY(1.5625deg);
	}

	66.6% {
		-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
		transform: skewX(-0.78125deg) skewY(-0.78125deg);
	}

	77.7% {
		-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
		transform: skewX(0.390625deg) skewY(0.390625deg);
	}

	88.8% {
		-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
		transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
	}
}

@-webkit-keyframes rubberBand {
	from {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}

	30% {
		-webkit-transform: scale3d(1.25, 0.75, 1);
		transform: scale3d(1.25, 0.75, 1);
	}

	40% {
		-webkit-transform: scale3d(0.75, 1.25, 1);
		transform: scale3d(0.75, 1.25, 1);
	}

	50% {
		-webkit-transform: scale3d(1.15, 0.85, 1);
		transform: scale3d(1.15, 0.85, 1);
	}

	65% {
		-webkit-transform: scale3d(.95, 1.05, 1);
		transform: scale3d(.95, 1.05, 1);
	}

	75% {
		-webkit-transform: scale3d(1.05, .95, 1);
		transform: scale3d(1.05, .95, 1);
	}

	to {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@keyframes rubberBand {
	from {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}

	30% {
		-webkit-transform: scale3d(1.25, 0.75, 1);
		transform: scale3d(1.25, 0.75, 1);
	}

	40% {
		-webkit-transform: scale3d(0.75, 1.25, 1);
		transform: scale3d(0.75, 1.25, 1);
	}

	50% {
		-webkit-transform: scale3d(1.15, 0.85, 1);
		transform: scale3d(1.15, 0.85, 1);
	}

	65% {
		-webkit-transform: scale3d(.95, 1.05, 1);
		transform: scale3d(.95, 1.05, 1);
	}

	75% {
		-webkit-transform: scale3d(1.05, .95, 1);
		transform: scale3d(1.05, .95, 1);
	}

	to {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
