@charset "gb2312";
@import url("common.css");

.item{ background:#f6f6f8; padding: 20px 5px 10px; overflow: hidden; position: relative}
.item .swiper-slide{ width: 100%; overflow: hidden;}
.item .swiper-slide a{ display: block; width: 18%; margin:3px 3.5%; font-size: 0.9em; color: #666; text-align: center; float: left; position: relative}
.item .swiper-slide a i{ display: block; width: 100%; margin-bottom: 5px; border-radius:23px;}
.item .swiper-slide.ic1 a:nth-child(1) i{ background-color: #ee4b47;}
.item .swiper-slide.ic1 a:nth-child(2) i{ background-color: #27a9f4;}
.item .swiper-slide.ic1 a:nth-child(3) i{ background-color: #ff8040;}
.item .swiper-slide.ic1 a:nth-child(4) i{ background-color: #6440ff;}
.item .swiper-slide.ic1 a:nth-child(5) i{ background-color: #3cc24c;}
.item .swiper-slide.ic1 a:nth-child(6) i{ background-color: #ffcb40;}
.item .swiper-slide.ic1 a:nth-child(7) i{ background-color: #498bfc;}
.item .swiper-slide.ic1 a:nth-child(8) i{ background-color: #f54e91;}

.item .swiper-slide.ic1 a:nth-child(9) i{ background-color: #2aa9f2;}
.item .swiper-slide.ic1 a:nth-child(10) i{ background-color: #ff8040;}
.item .swiper-slide.ic1 a:nth-child(11) i{ background-color: #6440ff;}
.item .swiper-slide.ic1 a:nth-child(12) i{ background-color: #3cc24c;}
.item .swiper-slide.ic1 a:nth-child(13) i{ background-color: #ffcb40;}
.item .swiper-slide.ic1 a:nth-child(14) i{ background-color: #498bfc;}
.item .swiper-slide.ic1 a:nth-child(15) i{ background-color: #f54e91;}
.item .swiper-slide.ic1 a:nth-child(16) i{ background-color: #ee4b47;}

.item .swiper-slide.ic2 a:nth-child(1) i{ background-color: #2aa9f2;}
.item .swiper-slide.ic2 a:nth-child(2) i{ background-color: #ff8040;}
.item .swiper-slide.ic2 a:nth-child(3) i{ background-color: #6440ff;}
.item .swiper-slide.ic2 a:nth-child(4) i{ background-color: #3cc24c;}
.item .swiper-slide.ic2 a:nth-child(5) i{ background-color: #ffcb40;}
.item .swiper-slide.ic2 a:nth-child(6) i{ background-color: #498bfc;}
.item .swiper-slide.ic2 a:nth-child(7) i{ background-color: #f54e91;}
.item .swiper-slide.ic2 a:nth-child(8) i{ background-color: #ee4b47;}
.itemBtn{ text-align: center}
.itemBtn span{ width:6%; height: 3px; background: #ccc; margin:0 4px; display:inline-block; text-indent: -999px; overflow: hidden; border-radius: 0; opacity: 1}
.itemBtn span.swiper-pagination-bullet-active{ background: #c2996d}

.item .swiper-slide.ic1 a:nth-child(8) i img{animation: jgb linear 0.5s 2s alternate infinite;}
.item .swiper-slide.ic1 a b{display: block; position: absolute; top:35%; left: 40%; width: 10px; height: 10px; opacity: 0}
.item .swiper-slide.ic1 a b:nth-last-of-type(1){ animation: q1 linear 0.8s 2s infinite; -webkit-animation: q1 linear 0.8s 2s infinite; background: url(../img/q.png) no-repeat; background-size: 100%;}
.item .swiper-slide.ic1 a b:nth-last-of-type(2){ animation: q2 linear 1s 2.4s infinite; -webkit-animation: q2 linear 1s 2.4s infinite; background: url(../img/q.png) no-repeat; background-size: 100%;}
.item .swiper-slide.ic1 a b:nth-last-of-type(3){ animation: q3 linear 0.8s 2s infinite; -webkit-animation: q3 linear 0.8s 2s infinite; background: url(../img/q2.png) no-repeat; background-size: 70%;}
.item .swiper-slide.ic1 a b:nth-last-of-type(4){ animation: q3 linear 0.8s 2.5s infinite; -webkit-animation: q3 linear 0.8s 2.5s infinite; background: url(../img/q.png) no-repeat; background-size: 100%;}
.item .swiper-slide.ic1 a b:nth-last-of-type(5){ animation: q1 linear 0.8s 2.5s infinite; -webkit-animation: q1 linear 0.8s 2.5s infinite; background: url(../img/q2.png) no-repeat; background-size: 70%;}

@keyframes jgb{
	0%{
		transform: scale(1);-webkit-transform: scale(1);
	}
	
	100%{
		transform: scale(0.8);-webkit-transform: scale(0.8);
	}
}
@keyframes q1{
	0%{
		top:35%; left: 40%; opacity: 1
	}
	10%{ left: 38%;}
	20%{ left: 30%;}
	30%{ left: 26%;}
	40%{top: 10%; left:22%;}
	50%{ top:11%; left: 5%; transform: rotateZ(-90deg); -webkit-transform: rotateZ(-90deg)}
	
	80%{ top: 40%; left: -10%;}	
	
	100%{
		top: 80%; left: -15%; transform: scale(1.3) rotateZ(-180deg); -webkit-transform: scale(1.3) rotateZ(-180deg); opacity: 1
	}
}
@keyframes q2{
	0%{
		top:35%; opacity: 1
	}
	40%{top: -5%;}
	100%{
		top: 80%; transform: scale(1.2) rotateZ(180deg); -webkit-transform: scale(1.3) rotateZ(180deg); opacity: 1
	}
}
@keyframes q3{
	0%{
		top:35%; left: 50%; opacity: 1
	}
	10%{ left: 52%;}
	20%{ left: 60%;}
	30%{ left: 64%;}
	40%{top: 10%; left:78%;}
	50%{ top:11%; left: 80%; transform: rotateZ(90deg); -webkit-transform: rotateZ(90deg)}
	
	80%{ top: 40%; left: 94%;}	
	
	100%{
		top: 80%; left: 100%; transform: scale(1.3) rotateZ(180deg); -webkit-transform: scale(1.3) rotateZ(180deg); opacity: 1
	}
}

.news{ background: #fff; border-bottom: 8px solid #f6f6f8; height: 25px; line-height: 25px; padding:8px 15px; overflow: hidden; }
.news .ncL{ width: 21%; height: 25px; overflow: hidden; float: left; background: #c2996d url(../img/newsico.png) no-repeat 5%; background-size: 18%; padding-left:5.5%; margin-right: 2.5%; box-sizing: border-box; font-size: 12px; color: #fff; border-radius: 5px}
.news .newsCon{ overflow: hidden; width:75%; height: 25px; float: left}
.news .newsCon i{display: inline-block; width: 30px; height: 11px; margin-left: 3px; background: url(../img/newshot.png) no-repeat; background-size: 100%;}
.news .newsCon li{ width: 100%; height: 25px; overflow: hidden;}

.secTit{ text-align: center}
.secTit h2{ color: #c2996d; font-size: 1.4em}
.secTit i{ display: block; color: #ccc; font-size: 1.2em; margin-top: -5px}

.jigou{ padding: 20px 0;border-bottom: 8px solid #f6f6f8; margin: 0 15px; overflow: hidden;}
.jigou .jgCon{ width: 100%; padding:15px 15px 0; box-sizing: border-box; position: relative}
.jigou .jgCon .swiper-slide{ text-align: center;}
.jigou .jgCon .swiper-slide img{ border-radius: 10px; overflow: hidden;}
.jigou .jgCon .swiper-slide p{ padding-top: 10px}
.jgbtn{ width: 70%; margin: 20px auto 0; overflow: hidden;}

.jg_next{ background: #ccc; color: #fff; text-align: center;  width: 20%; height: 30px; line-height:25px; border-radius:5px; font-size: 20px; float:left}
.jg_prev{ background: #ccc; color: #fff; text-align: center;  width: 20%; height: 30px; line-height:25px; border-radius:5px; font-size: 20px; float:left}

.jgbtn a{display: block; width: 56%; height: 30px; line-height: 30px; text-align: center; background: #c2996d; color: #fff; border-radius: 5px; margin: 0 2%; font-size: 1.2em;float:left}

.ys{ padding: 20px 0}
.ys .ysCon{ width: 100%; padding-top:10px}
.ys .ysCon .swiper-slide{ width: 100%; padding: 0 15px; box-sizing: border-box; overflow: hidden;}
.ys .ysCon .swiper-slide p{ width: 50%; padding-top: 4%; float: right}
.ys .ysCon .swiper-slide p b{display:inline-block; padding-bottom: 3px; border-bottom: 3px solid #c2996d; font-size: 1.2em; margin-bottom: 3px}
.ys .ysCon .swiper-slide p i{ display: block; padding-bottom: 4%}
.ys .ysCon .swiper-slide p strong{display: block; color: #c2996d; font-size: 1.2em}
.ys .ysCon .swiper-slide p span{display: block; padding-bottom: 10%}
.ys .ysCon .swiper-slide p a{display: block; width: 90%; height: 30px; line-height: 30px; text-align: center; background: #c2996d; color: #fff; border-radius: 5px; font-size: 1.2em}
.ys .ysCon .swiper-slide img{ display: block; width: 48%; float: left}
.yscbtn{ text-align: center; padding-top: 10px}
.yscbtn span{ width: 10px; height: 10px; background: #ccc; margin: 0 5px; border-radius: 50%; display: inline-block; text-indent: -999px; overflow: hidden;}
.yscbtn span.swiper-pagination-bullet-active{ background: #c2996d}

.case{ padding: 10px 18% 20px; border-bottom: 8px solid #f6f6f8;}
.case .caseCon{ width: 100%; padding-top:20px;}
.case .caseCon .swiper-slide{ width: 100%; float: left; border-radius: 10px; transform: scale(0.8); -webkit-transform: scale(0.8); background: #000; transition: ease all 0.5s}
.case .caseCon .swiper-slide>img{display: block; opacity: 0.5;}
.caseBtn{display: block; width: 50%; height: 35px; clear: both; margin:20px auto 0; line-height:35px; text-align: center; background: #c2996d; color: #fff; border-radius: 5px; font-size: 1.2em}
.case .caseCon .swiper-slide.swiper-slide-active{ z-index: 2; background: none; transform: scale(1); -webkit-transform: scale(1)}
.case .caseCon .swiper-slide.swiper-slide-active>img{ opacity: 1;}

.caseUps{ transform: scale(0) translateY(80%); -webkit-transform: scale(0) translateY(80%); width: 140%; box-shadow: 0 0 5px #999; position: absolute; bottom:-55px; left: -20%; z-index:9; border-radius: 10px; background: #f0f0f0; transition: ease transform 0.5s; -webkit-transition: ease transform 0.5s}
.caseUps.add{ transform: scale(1) translateY(0); -webkit-transform: scale(1) translateY(0)}
.caseUps .caseClose{ position: absolute; top: 10px; right: 10px; width: 20px; height: 20px; z-index:5; background: url(../img/caseClose.png) no-repeat; background-size: 100%}
.caseUps .cuTop{ background: #666; border-top-left-radius: 10px; border-top-right-radius: 10px}
.caseUps .cuTop img{display: block; width:45%; margin-top: -45px; float: left}
.caseUps .cuTop span{ display: block; width: 51%; padding-top: 8%; float: right; color: #fff; font-size: 1.2em}
.caseUps p{ padding: 15px 25px; }
.caseUps p em{display: block; border-bottom: 1px dashed #ccc; line-height: 30px}
.caseUps p em i{ color: #333;}
.caseUps .cuBottom{ overflow: hidden; padding: 0 25px 15px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px}
.caseUps .cuBottom a{ display: block; width: 47%; height: 35px; line-height: 35px; text-align: center; border-radius: 5px; color: #fff; font-size: 1.2em}
.caseUps .cuBottom a:nth-last-of-type(1){ background: #c2996d; float: left}
.caseUps .cuBottom a:nth-last-of-type(2){ background: #666; float: right}

@media only screen and (min-device-width: 360px)and (-webkit-min-device-pixel-ratio: 3) {
/*	.titemMain.add{ height:260px;}  */
}


/*Ð¡³ÌÐò»ú¹¹Ò³*/
.xcx_main{ padding: 20px 15px}
.xcx_main .xcx_text{ padding: 20px 10px; text-indent: 2em; line-height: 26px}
.xcx_text i{ color: #c2996d;}
.xcx_main ul{ overflow: hidden;}
.xcx_main ul li{ width:50%; float: left; overflow: hidden; border-right: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; padding: 10px 0; box-sizing: border-box}
.xcx_main ul li span{display: block; width: 40%;background: #eee; float: left; border-radius: 10px; overflow: hidden; margin-left: 5px}
.xcx_main ul li p{ width: 55%; float: right}
.xcx_main ul li p b{ display: block; padding-bottom: 5px; text-align: center}
.xcx_main ul li p i{ width: 80%; height: 22px; line-height: 22px; margin: 0 auto; text-align: center; color: #c2996d; border: 1px solid #c2996d; border-radius: 11px; font-size: 12px; display: block;}
.xcx_main ul li:nth-child(even){ border-right: 0}

.xcx_bul{ border-top:10px solid #eee; border-bottom:1px solid #eaeaea; padding: 20px 20px 5px; overflow: hidden;}
.xcx_bul p{ width: 50%; line-height: 30px; margin-bottom: 15px; float: left; overflow: hidden; display: block; color: #333;}
.xcx_bul p i{ width: 30px; height: 30px; display:block; float: left; margin-right: 5px}

.xcx_b2nav p{ border-bottom: 1px solid #eaeaea; padding: 0 20px; height: 40px; line-height: 40px; color: #333; background: url(../img/xcx_jt.png) no-repeat 92%; background-size: auto 20px}

.xcx_tit{ border-top:10px solid #eee; font-size: 16px; padding: 10px 15px}

.xcx_zxkf{ width: 40%; height: 36px; line-height: 36px; text-indent: 7%; border: 1px solid #333; color: #333; border-radius: 18px; margin: 0 auto 20px; background: url(../img/xcx_zxkf.png) no-repeat 10%; background-size: auto 25px}

footer span{display: block; width: 30%; margin: 0 auto 20px;}




