﻿

@media (min-width: 1200px) {

	a{ text-decoration:none; color:#333;  }

	/* 本例子css */
	.picScroll-left{ width: 1100px;  overflow:hidden; position:relative;  margin-top: 20px;   }
	.picScroll-left .hd{height: 1px;}
	.picScroll-left .bd .prev {float: left; margin-right: 15px; position: relative;  top: 70px;left: 70px;}
	.picScroll-left .bd .next {float: right;position: relative; top: -115px;
		left: -50px;}

	.picScroll-left .hd .next{ background-position:0 -50px;  }
	.picScroll-left .hd .prevStop{ background-position:-60px 0; }
	.picScroll-left .hd .nextStop{ background-position:-60px -50px; }
	.picScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
	.picScroll-left .hd ul li{ float:left;  width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("../image/icoCircle.gif") 0 -9px no-repeat; }
	.picScroll-left .hd ul li.on{ background-position:0 0; }
	.picScroll-left .bd{ padding:10px;
		margin-top: -20px;}
	.picScroll-left .bd ul{ overflow:hidden; zoom:1; }
	.picScroll-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center;  }
	.picScroll-left .bd ul li .pic{ text-align:center; }
	.picScroll-left .bd ul li .pic img{ width:140px; display:block;  padding:2px;  }
	.picScroll-left .bd ul li .pic a:hover img{ border-color:#999;  }
	.picScroll-left .bd ul li .title{ line-height:24px;   }


	
	

	.textDes{
		font-size:1.3rem;
		text-indent:2em;
		line-height:30px;
		padding:20px 0;
	}
	.imgEg,.whDes{
		overflow:hidden;
	}
	.imgEg li{
		float:left;
		background:rgb(247,247,247);
		width: 285px;
		margin-right:20px;
	}
	.imgEg li .imgbox{
		width: 100%;
		height: 160px;
		overflow:hidden;
	}
	.imgEg li.lastEle,.whDes li.lastEle{
		margin-right:0;
	}
	.imgEg li p{
		line-height:65px;
		text-align:center;
		font-size:16px;
		color:rgb(138,138,138);
	}
	.whTitle{
		text-align:center;
		padding:40px 0;
	}
	.whTitle .title1{
		color:red;
		font-size:2rem;
		margin-bottom:20px;
	}
	.whTitle .title2{
		font-size:1.3rem;
	}

	.whDes{
		/* margin-top: */
	}
	.whDes li{
		float:left;
		width: 285px;
		margin-right:20px;
		color:rgb(102,102,102);
	}
	.whDes li .imgbox{
		width: 198px;
		
		position:relative;
		margin:auto;
	}
	.whDes li .imgbox img{
		width:100%;
		height: 100%;
	}
	.whDes li .imgbox p{
		 padding-top: 20px;
		bottom:26px;
		text-align:center;
		font-size:20px;
	}
	.whDes li .textbox{
		font-size:14px;
		padding:25px 10px 10px;
	}
	.ryDes{
		padding:20px 50px;
		position:relative;
		overflow:hidden;
		text-align: -webkit-center;
	}
	.ryDes .ulbox{
		height: 247px;
		width: 100%;
		overflow:hidden;
		position:relative;
	}
	.ryDes .desul{
		/* background:red; */
		width: 1760px;
		position:absolute;
		top:0;
		left:0;
		bottom:0;
		transition:left .3s linear;
	}
	.ryDes .goBtn{
		width: 30px;
		height: 30px;
		/* background:yellow; */
		position:absolute;
		top:130px;
		cursor:pointer;
	}

	.ryDes .goBtn:hover .redBtn{
		opacity:1
	}
	.ryDes .goBtn:hover .dftBtn{
		opacity:0
	}
	.ryDes .goBtn .redBtn{
		position:absolute;
		top:0;
		left:0;
		opacity:0;
	}
	.ryDes .leftGo{
		left:0;
	}
	.ryDes .rightGo{
		right:0;
	}

	.ryDes .ulbox li{
		float:left;
		width: 190px;
		height: 247px;
		margin:0 15px;
		border:1px solid rgb(219,219,219);
		box-sizing:border-box;
		padding:10px;
	}
	.ryDes .ulbox li img{
		width: 100%;
		height:100%;
	}
}


@media (max-width: 1199px) {

	/* 本例子css */
	.picScroll-left{ width: 900px;   position:relative;  margin-top: 20px;  margin-left: 25%; }
	.picScroll-left .hd{height: 1px;}
	.picScroll-left .bd .prev {float: left; margin-right: -10px; position: relative; top: 210px;right: -30px}
	.picScroll-left .bd .next {float: right;position: relative; top: 10px; left: -560px;}

	.picScroll-left .hd .next{ background-position:0 -50px;  }
	.picScroll-left .hd .prevStop{ background-position:-60px 0; }
	.picScroll-left .hd .nextStop{ background-position:-60px -50px; }
	.picScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
	.picScroll-left .hd ul li{ float:left;  width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("../image/icoCircle.gif") 0 -9px no-repeat; }
	.picScroll-left .hd ul li.on{ background-position:0 0; }
	.picScroll-left .bd{ padding:10px;   }
	.picScroll-left .bd ul{ overflow:hidden; zoom:1; }
	.picScroll-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center;  }
	.picScroll-left .bd ul li .pic{ text-align:center; }
	.picScroll-left .bd ul li .pic img{ width:140px; display:block;  padding:2px; border:1px solid #ccc; }
	.picScroll-left .bd ul li .pic a:hover img{ border-color:#999;  }
	.picScroll-left .bd ul li .title{ line-height:24px;   }
	

	.textDes{
		font-size:1.3rem;
		text-indent:2em;
		line-height:30px;
		padding:20px 20px;
	}
	.imgEg,.whDes{
		overflow:hidden;
		margin-left: 20%;
	}
	.imgEg li{
		float:left;
		background:rgb(247,247,247);
		width: 285px;
		margin-right:20px;
		margin-bottom: 20px;
	}
	.imgEg li .imgbox{
		width: 100%;
		height: 160px;
		overflow:hidden;
	}
	.imgEg li.lastEle,.whDes li.lastEle{
		margin-right:0;
	}
	.imgEg li p{
		line-height:65px;
		text-align:center;
		font-size:16px;
		color:rgb(138,138,138);
	}
	.whTitle{
		text-align:center;
		padding:40px 0;
	}
	.whTitle .title1{
		color:red;
		font-size:2rem;
		margin-bottom:20px;
	}
	.whTitle .title2{
		font-size:1.3rem;
	}

	.whDes{
		/* margin-top: */
	}
	.whDes li{
		float:left;
		width: 285px;
		margin-right:20px;
		color:rgb(102,102,102);
	}
	.whDes li .imgbox{
		width: 160px;
		height: 180px;
		position:relative;
		margin:auto;
	}
	.whDes li .imgbox img{
		width:100%;
		height: 100%;
	}
	.whDes li .imgbox p{
		position:absolute;
		left:0;
		right:0;
		bottom:26px;
		text-align:center;
		font-size:20px;
	}
	.whDes li .textbox{
		font-size:14px;
		padding:25px 10px 10px;
	}
	.ryDes{
		padding:20px 50px;
		position:relative;
		overflow:hidden;
	}
	.ryDes .ulbox{
		height: 247px;
		width: 100%;
		overflow:hidden;
		position:relative;
	}
	.ryDes .desul{
		/* background:red; */
		width: 100%;
		position:absolute;
		top:0;
		left:0;
		bottom:0;
		transition:left .3s linear;
	}
	.ryDes .goBtn{
		width: 30px;
		height: 30px;
		/* background:yellow; */
		position:absolute;
		top:130px;
		cursor:pointer;
	}

	.ryDes .goBtn:hover .redBtn{
		opacity:1
	}
	.ryDes .goBtn:hover .dftBtn{
		opacity:0
	}
	.ryDes .goBtn .redBtn{
		position:absolute;
		top:0;
		left:0;
		opacity:0;
	}
	.ryDes .leftGo{
		left:0;
	}
	.ryDes .rightGo{
		right:0;
	}

	.ryDes .ulbox li{
		float:left;
		width: 190px;
		height: 247px;
		margin:0 15px;
		border:1px solid rgb(219,219,219);
		box-sizing:border-box;
		padding:10px;
	}
	.ryDes .ulbox li img{
		width: 100%;
		height:100%;
	}
}

@media (max-width: 867px) {

	/* 本例子css */
	.picScroll-left{ width: 900px;   position:relative;  margin-top: 20px;  margin-left: 25%; }
	.picScroll-left .hd{height: 1px;}
	.picScroll-left .bd .prev {float: left; margin-right: -10px; position: relative; top: 210px;right: -30px}
	.picScroll-left .bd .next {float: right;position: relative; top: 10px; left: -560px;}

	.picScroll-left .hd .next{ background-position:0 -50px;  }
	.picScroll-left .hd .prevStop{ background-position:-60px 0; }
	.picScroll-left .hd .nextStop{ background-position:-60px -50px; }
	.picScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
	.picScroll-left .hd ul li{ float:left;  width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:url("../image/icoCircle.gif") 0 -9px no-repeat; }
	.picScroll-left .hd ul li.on{ background-position:0 0; }
	.picScroll-left .bd{ padding:10px;   }
	.picScroll-left .bd ul{ overflow:hidden; zoom:1; }
	.picScroll-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden; text-align:center;  }
	.picScroll-left .bd ul li .pic{ text-align:center; }
	.picScroll-left .bd ul li .pic img{ width:140px; display:block;  padding:2px; border:1px solid #ccc; }
	.picScroll-left .bd ul li .pic a:hover img{ border-color:#999;  }
	.picScroll-left .bd ul li .title{ line-height:24px;   }
	
	.textDes{
		font-size:1.3rem;
		text-indent:2em;
		line-height:30px;
		padding:20px 20px;
	}
	.imgEg,.whDes{
		overflow:hidden;
		margin-left: 20%;
	}
	.imgEg li{
		float:left;
		background:rgb(247,247,247);
		width: 285px;
		margin-right:20px;
		margin-bottom: 20px;
	}
	.imgEg li .imgbox{
		width: 100%;
		height: 160px;
		overflow:hidden;
	}
	.imgEg li.lastEle,.whDes li.lastEle{
		margin-right:0;
	}
	.imgEg li p{
		line-height:65px;
		text-align:center;
		font-size:16px;
		color:rgb(138,138,138);
	}
	.whTitle{
		text-align:center;
		padding:40px 0;
	}
	.whTitle .title1{
		color:red;
		font-size:2rem;
		margin-bottom:20px;
	}
	.whTitle .title2{
		font-size:1.3rem;
	}

	.whDes{
		/* margin-top: */
	}
	.whDes li{
		float:left;
		width: 285px;
		margin-right:20px;
		color:rgb(102,102,102);
	}
	.whDes li .imgbox{
		width: 160px;
		height: 180px;
		position:relative;
		margin:auto;
	}
	.whDes li .imgbox img{
		width:100%;
		height: 100%;
	}
	.whDes li .imgbox p{
		position:absolute;
		left:0;
		right:0;
		bottom:26px;
		text-align:center;
		font-size:20px;
	}
	.whDes li .textbox{
		font-size:14px;
		padding:25px 10px 10px;
	}
	.ryDes{
		padding:20px 50px;
		position:relative;
		overflow:hidden;
	}
	.ryDes .ulbox{
		height: 247px;
		width: 100%;
		overflow:hidden;
		position:relative;
	}
	.ryDes .desul{
		/* background:red; */
		width: 100%;
		position:absolute;
		top:0;
		left:0;
		bottom:0;
		transition:left .3s linear;
	}
	.ryDes .goBtn{
		width: 30px;
		height: 30px;
		/* background:yellow; */
		position:absolute;
		top:130px;
		cursor:pointer;
	}

	.ryDes .goBtn:hover .redBtn{
		opacity:1
	}
	.ryDes .goBtn:hover .dftBtn{
		opacity:0
	}
	.ryDes .goBtn .redBtn{
		position:absolute;
		top:0;
		left:0;
		opacity:0;
	}
	.ryDes .leftGo{
		left:0;
	}
	.ryDes .rightGo{
		right:0;
	}

	.ryDes .ulbox li{
		float:left;
		width: 190px;
		height: 247px;
		margin:0 15px;
		border:1px solid rgb(219,219,219);
		box-sizing:border-box;
		padding:10px;
	}
	.ryDes .ulbox li img{
		width: 100%;
		height:100%;
	}
}

@media (max-width: 866px) {

	/* 本例子css */
	.picScroll-left {
		width: 900px;
		position: relative;
		margin-top: 20px;
		margin-left: 5%;
	}

	.picScroll-left .hd {
		height: 1px;
	}

	.picScroll-left .bd .prev {
		float: left;
		margin-right: -10px;
		position: relative;
		top: 210px;
		right: -30px
	}

	.picScroll-left .bd .next {
		float: right;
		position: relative;
		top: 10px;
		left: -560px;
	}

	.picScroll-left .hd .next {
		background-position: 0 -50px;
	}

	.picScroll-left .hd .prevStop {
		background-position: -60px 0;
	}

	.picScroll-left .hd .nextStop {
		background-position: -60px -50px;
	}

	.picScroll-left .hd ul {
		float: right;
		overflow: hidden;
		zoom: 1;
		margin-top: 10px;
		zoom: 1;
	}

	.picScroll-left .hd ul li {
		float: left;
		width: 9px;
		height: 9px;
		overflow: hidden;
		margin-right: 5px;
		text-indent: -999px;
		cursor: pointer;
		background: url("../image/icoCircle.gif") 0 -9px no-repeat;
	}

	.picScroll-left .hd ul li.on {
		background-position: 0 0;
	}

	.picScroll-left .bd {
		padding: 10px;
	}

	.picScroll-left .bd ul {
		overflow: hidden;
		zoom: 1;
	}

	.picScroll-left .bd ul li {
		margin: 0 8px;
		float: left;
		_display: inline;
		overflow: hidden;
		text-align: center;
	}

	.picScroll-left .bd ul li .pic {
		text-align: center;
	}

	.picScroll-left .bd ul li .pic img {
		width: 140px;
		display: block;
		padding: 2px;
		border: 1px solid #ccc;
	}

	.picScroll-left .bd ul li .pic a:hover img {
		border-color: #999;
	}

	.picScroll-left .bd ul li .title {
		line-height: 24px;
	}

	

	.textDes {
		font-size: 1.3rem;
		text-indent: 2em;
		line-height: 30px;
		padding: 20px 20px;
	}

	.imgEg, .whDes {
		overflow: hidden;
		margin-left: 0;
	}

	.imgEg li {
		float: left;
		background: rgb(247, 247, 247);
		width: 68%;
		margin-left:16%;
		margin-bottom: 20px;
	}

	.imgEg li .imgbox {
		width: 100%;
		height: auto;
		overflow: hidden;
	}
.imgEg li .imgbox img{
		width: 100%;
	}
	.imgEg li.lastEle, .whDes li.lastEle {
		margin-right: 0;
	}

	.imgEg li p {
		line-height: 65px;
		text-align: center;
		font-size: 16px;
		color: rgb(138, 138, 138);
	}

	.whTitle {
		text-align: center;
		padding: 40px 0;
	}

	.whTitle .title1 {
		color: red;
		font-size: 2rem;
		margin-bottom: 20px;
	}

	.whTitle .title2 {
		font-size: 1.3rem;width: 68%;
		margin-left: 16%;
	}

	.whDes {
		/* margin-top: */
	}

	.whDes li {
		float: left;
		width: 100%;
		
		color: rgb(102, 102, 102);
	}

	.whDes li .imgbox {
		width: 160px;
		height: 180px;
		position: relative;
		margin: auto;
	}

	.whDes li .imgbox img {
		width: 100%;
		height: auto;
	}

	.whDes li .imgbox p {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 26px;
		text-align: center;
		font-size: 20px;
		margin-bottom: -30px;
	}

	.whDes li .textbox {
		font-size: 14px;
		padding: 25px 10px 10px;
	}

	.ryDes {
		padding: 20px 50px;
		position: relative;
		overflow: hidden;
		margin-left: -10%;
	}

	.ryDes .ulbox {
		height: 247px;
		width: 100%;
		overflow: hidden;
		position: relative;
	}

	.ryDes .desul {
		/* background:red; */
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		transition: left .3s linear;
	}

	.ryDes .goBtn {
		width: 30px;
		height: 30px;
		/* background:yellow; */
		position: absolute;
		top: 130px;
		cursor: pointer;
	}

	.ryDes .goBtn:hover .redBtn {
		opacity: 1
	}

	.ryDes .goBtn:hover .dftBtn {
		opacity: 0
	}

	.ryDes .goBtn .redBtn {
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
	}

	.ryDes .leftGo {
		left: 0;
	}

	.ryDes .rightGo {
		right: 0;
	}

	.ryDes .ulbox li {
		float: left;
		width: 190px;
		height: 247px;
		margin: 0 15px;
		border: 1px solid rgb(219, 219, 219);
		box-sizing: border-box;
		padding: 10px;
	}

	.ryDes .ulbox li img {
		width: 100%;
		height: 100%;
	}
}



















