body{overflow: hidden;}
.index-panerl{position:relative;}

/*轮播图样式*/
#carousel-banner{position:absolute;top:0;width:100%;height:100%;}
#carousel-banner .carousel-inner{height:100%;}
#carousel-banner .item{background:no-repeat center;background-size:cover;height:100%;}
#carousel-banner .item.first{background-image:url(../img/banner-1.jpg);filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.jiapucable.com/img/banner-1.jpg',sizingMethod='scale');}
#carousel-banner .item.second{background-image:url(../img/banner-2.jpg);filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.jiapucable.com/img/banner-2.jpg',sizingMethod='scale');}
#carousel-banner .item.third{background-image:url(../img/banner-3.jpg);filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.jiapucable.com/img/banner-3.jpg',sizingMethod='scale');}
#carousel-banner .carousel-control{background-image:none;}
.carousel-indicators{width:1170px;margin-left:-585px;bottom:15px;}
.carousel-indicators li{width:32%;border-radius: 0;height: 2px;border:none;background: #fff;display: block;float:left;}
.carousel-indicators li.active{background: #ffff00;width:33%;height: 2px;border:none;margin: 1px;}

/*第二屏*/
.second .top{height:50%;}
.second .container{display:table;height:100% !important;}
.second .row{display:table-cell;vertical-align:middle;}
.second h2{text-align:left;color:#000;margin-top:0;}
.second .top .row .pic{text-align:center;}
.second .top .row .pic img{width:90px;margin-right:20px;}
.second .top .more{color:#0660d8;float:right;margin-top:30px;}
.second .bottom{height:50%;background: #eee url(../img/index-about-bg.png) left bottom;background-size:cover;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.jiapucable.com/img/index-about-bg.png',sizingMethod='scale');}
.second .bottom .row .col-sm-4{padding:0 60px;}
.second .bottom .row .box{border:2px solid #333;text-align: center;height:260px;}
.second .bottom .row h4{font-weight: bold;}

/*第三屏*/
.third .top{height:55%;}
.third .container{display:table;height:100% !important;}
.third .middle{display:table-cell;vertical-align:middle;}
.third h2{position: relative;text-align: center;color:#000;margin:30px 0 20px;}
.third h2 .more{position: absolute;color:#0660d8;right:20px;font-size: 14px;top:16px;}
.third .box{overflow: hidden;position:relative;}
.third .box .row-line{-webkit-transition: right 0.5s;-ms-transition: right 0.5s;transition: right 0.5s;position: absolute;width:100%;height:100%;border-top:2px solid #333;border-bottom:2px solid #333;right:100%;z-index:99;}
.third .box .col-line{-webkit-transition: bottom 0.5s;-ms-transition: bottom 0.5s;transition: bottom 0.5s;position: absolute;width:100%;height:100%;border-left:2px solid #333;border-right:2px solid #333;bottom:100%;z-index:99;}
.third .box img{width: 80%;-webkit-transition:-webkit-transform 0.5s;-ms-transition:-ms-transform 0.5s;transition: transform 0.5s;}
.third .box+h4{font-size:14px;line-height:15px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.third .row a:hover .box img{-webkit-transform: scale(1.2);-ms-transform: scale(1.2);transform: scale(1.2);}
.third .row a:hover .box .row-line{right:0;}
.third .row a:hover .box .col-line{bottom:0;}
.third .bottom{position:relative;height:45%;background: #f5f5f5;}
.third .bottom .container{position: relative;}
.third .bottom .container .heng{position: absolute;left: -100px; height:100%;width:100%;background:url(../img/index-pro-heng.png) left 70% no-repeat;background-size:auto 100px;}
.third .bottom h2{text-align: left;width:200px;margin-top:80px;}
.third .bottom .pro-sort{position: absolute;right:0;top:0;height: 100%;z-index:99;}
.third .bottom .pro-sort a{-webkit-transition:width 0.3s;-ms-transition:width 0.3s;transition:width 0.3s;left:30px;float:left;width:20%;height: 100%;border-left:1px solid #ccc;-webkit-transform:skew(-10deg);transform:skew(-10deg);background: #eee;display: block;position: relative;padding:30px 20px;}
.third .bottom .pro-sort a h4{color:#000;-webkit-transform:skew(10deg);-ms-transform:skew(10deg);transform:skew(10deg);}
.third .bottom .pro-sort a:hover h4{color:#0660d8;}
.third .bottom .pro-sort a img{-webkit-transform:skew(10deg);-ms-transform:skew(10deg);transform:skew(10deg);position: absolute;bottom:0;width:100px;margin-left: -50px;left:50%;}
.third .bottom .pro-sort a.three-pic img{width:200px;}
.third .bottom .pro-sort a.hover{width:28%;}
.third .bottom .pro-sort a.nohover{width:18%;}

/*第四屏*/
.fourth{height:100%;overflow: auto;}
.fourth .top{height:60%;}
.fourth .top .container{position: relative;}
.fourth h2{color:#000;margin:30px 0;}
.fourth ul.pull-left{width:35%;position: relative;}
.fourth ul.pull-left li{filter:alpha(opacity=0);opacity:0;position:absolute;top:0;z-index:2;}
.fourth ul.pull-left li.active{filter:alpha(opacity=100);opacity:1;-webkit-transition:opacity 1s;transition:opacity 1s;z-index:3;width:100%;}
.fourth ul.pull-left .line .number{float: left}
.fourth ul.pull-left .line a{float: right;color:#999;}
.fourth ul.pull-left .line a:hover{color:#0660d8;}
.fourth ul.pull-left h4{clear: both; padding:20px 0 10px;}
.fourth ul.pull-left .date{color:#666;}
.fourth ul.pull-left .text{overflow: hidden;height: 180px;}

.fourth ul.pull-right{width:60%;position:absolute;top:100px;right:0;[;display:table;];}
.fourth ul.pull-right li{-webkit-transition:width 0.5s,left 0.5s;-ms-transition:width 0.5s,left 0.5s;transition:width 0.5s,left 0.5s;display:table-cell;vertical-align:middle;overflow:hidden;position: relative;background: #fff;}
.fourth ul.pull-right li.one{width:40%;left:0;z-index:3;}
.fourth ul.pull-right li.two{width:32%;left:-30px;z-index:2;}
.fourth ul.pull-right li.three{width:28%;left:-60px;z-index:1;}
.fourth ul.pull-right li img{width:100%;border-radius:10px;-webkit-transition:opacity 0.3s;-ms-transition:opacity 0.3s;transition:opacity 0.3s;}
.fourth ul.pull-right li.two img{filter:alpha(opacity=70);opacity:0.7;}
.fourth ul.pull-right li.three img{filter:alpha(opacity=50);opacity:0.5}
.fourth ul.pull-right li.active{width:40%!important;z-index:3!important;}
.fourth ul.pull-right li.active img{filter:alpha(opacity=100)!important;opacity:1!important;}



.fourth .bottom{background: #f5f5f5;height:40%;}
.fourth .bottom .nav li{text-align:center;}
.fourth .bottom .nav li img{width:60px;
								 -ms-transform:none;
								 -webkit-transform:none;
								 transform:none;
								 -webkit-transition:-webkit-transform 500ms;
								 -ms-transition:-ms-transform 500ms;
								 transition:transform 500ms;}
.fourth .bottom .nav li:hover img{-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg);transform:rotate(360deg);}
.fourth .bottom .nav li h4{margin:4px 0;font-size:14px}
.fourth .bottom .nav li .line{width:66%;margin:0 auto;height:3px;background:#000;}
.fourth .bottom .nav li p{margin:6px 0 10px;color:#333;}
.fourth .bottom .nav+p{color:#111;text-align:center;margin-top:20px;}

/*第五屏*/
.fifth{height: 472px!important;}


@media(max-width:1199px){
	.second .top .row .pic{padding:0;}
	.second .bottom .row .col-sm-4{padding:0 20px;}
	.third .bottom h2{font-size: 24px;}
	.third .bottom .pro-sort a h4{font-size: 16px}
	.fourth ul.pull-left{width:36%;}
	.fourth ul.pull-right{width:60%;top:140px;}
}
@media(max-width:991px){
	.second .top .row .pic img{width:70px;margin-right:10px;}
	.second .bottom .row .col-sm-4{padding:0 10px;}
	.second .bottom .row .box{height: 280px;}
	.third .bottom{background-image:none;}
	.third .bottom h2{display: none;}
	.third .bottom .pro-sort a h4{font-size: 12px}
	.fourth ul.pull-left h4{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
	.fourth .bottom .nav+p{margin-top: 10px;}
}

@media(max-width:767px){
	body{overflow:auto;}
	#carousel-banner{position:static;height: 400px;margin-top:-1px;}
	.index-panel h2{font-size:20px;line-height: 1}
	.second .top{padding:40px 0;}
	.second .bottom{padding-top: 30px;}
	.second .bottom .col-sm-4{margin-bottom: 30px;}
	.second .bottom .col-sm-4 .box{height: auto;}
	.second .bottom h4{font-size:16px;}
	.third .top,.fourth .bottom{padding:10px 0 40px;}
	.third .bottom .pro-sort{width:100%!important;position: static;overflow: hidden;}
	.third .bottom .pro-sort a{width:33%;height:200px;left:0;padding:20px 14px;}
	.third .bottom .pro-sort a:first-child{color:#000;padding-top:30px;font-weight: bold;}
	.third .bottom .pro-sort a img{width:60px;}
	.third .bottom .pro-sort a.three-pic img{width:100px;}
	.fourth h2{margin-bottom: 10px;}
	.fourth ul.pull-left{width:60%;}
	.fourth ul.pull-left li{display: none;position: static;}
	.fourth ul.pull-left li:first-child{display: block;}
	.fourth h2+h4{padding:0;font-size:14px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;margin-top: 20px;}
	.fourth ul.pull-left .text{overflow: hidden;margin-bottom: 30px;}
	.fourth ul.pull-right{width:36%;top:130px;}
	.fourth ul.pull-right li.one{left:0!important;}






}
@media(max-width:440px){
	#carousel-banner{height:200px;}
	.second .top .col-sm-2,.second .top .col-sm-7{width:100%;}

}


