.scrollpic {width: 1200px;margin:5px auto 0 auto;}
#myscroll {display: block;width: 100%;position: relative;height: 240px;overflow: hidden;}
#myscroll #myscrollbox {display: block;	float: left;position: absolute;	left: 0;top: 0;	width: 1000000px;}
#myscroll ul {display: block;float: left;list-style-type: none;	padding: 0;	margin: 0;}
#myscroll ul li {display: block;float: left;padding: 0;	width:300px;}
#myscroll ul li a { background:none;}
#myscroll ul li a:hover{ background:none;}
#myscroll ul li img{ width:280px; height:176px;object-fit:inherit;margin:0 0px;}
#mybtns {margin: 10px 0;width: 1200px;display: block;height: 42px;}
#mybtns a {width: 42px;	height: 176px;display: block;background-color: #c1c1c1;}
#mybtns a:hover {background-color: #174f99;}
#mybtns #left {	background-image:url(../images/jt_r.png); background-repeat:no-repeat; background-position:center; float:right;}
#mybtns #right {background-image:url(../images/jt_l.png);background-repeat:no-repeat; background-position:center; float:left;}
#mybtns a:hover, #myscroll, #mybtns a, #myscroll a:hover .intro, #myscroll a .intro, #myscroll #myscrollbox {
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
#mybtns .area{float:left; display:block; width:1200px; margin-left:10px; height:165px;}

@media screen and (max-width: 1100px) {
.scrollpic {width: 100%;margin:20px auto 0 auto;}
#myscroll {display: block;width: 100%;position: relative;height: 155px;overflow: hidden;}
#myscroll #myscrollbox {display: block;	float: left;position: absolute;	left: 0;top: 0;	width:100%;}
#myscroll ul {display: block;float: left;list-style-type: none;	padding: 0;	margin: 0;}
#myscroll ul li {display: block;float: left;padding: 0;	width:23%; margin-right:1%;}
#myscroll ul li a { background:none;}
#myscroll ul li a:hover{ background:none;}
#myscroll ul li img{ width:100%; height:155px;object-fit:inherit;}
#mybtns {margin: 10px 0;width: 100%;display: block;height: 42px;}
#mybtns a { width:100%;height: 155px;display: block;background-color: #c1c1c1;}
#mybtns a:hover {background-color: #347fdc;}
#mybtns #left {	background:#c1c1c1 url(../images/jt_r.png) no-repeat center center; float:right; display:none;}
#mybtns #right {background:#c1c1c1 url(../images/jt_l.png) no-repeat center center; float:left; display:none;}
#mybtns .area{float:left; display:block; width:1000px; margin-left:0px; height:155px;}	
	}
@media screen and (max-width: 1000px) {
.scrollpic {width: 100%;margin:20px auto 0 auto;}
#myscroll {display: block;width: 100%;position: relative;height: 155px;overflow: hidden;}
#myscroll #myscrollbox {display: block;	float: left;position: absolute;	left: 0;top: 0;	width:100%;}
#myscroll ul {display: block;float: left;list-style-type: none;	padding: 0;	margin: 0;}
#myscroll ul li {display: block;float: left;padding: 0;	width:32%; margin-right:1%;}
#myscroll ul li a { background:none;}
#myscroll ul li a:hover{ background:none;}
#myscroll ul li img{ width:100%; height:155px;object-fit:inherit;}
#mybtns {margin: 10px 0;width: 100%;display: block;height: 42px;}
#mybtns a { width:100%;height: 155px;display: block;background-color: #c1c1c1;}
#mybtns a:hover {background-color: #347fdc;}
#mybtns #left {	background:#c1c1c1 url(../images/jt_r.png) no-repeat center center; float:right; display:none;}
#mybtns #right {background:#c1c1c1 url(../images/jt_l.png) no-repeat center center; float:left; display:none;}
#mybtns .area{float:left; display:block; width:100%; margin-left:0px; height:155px;}
	}
@media screen and (max-width: 770px){
	#myscroll {display: block;width: 100%;position: relative;height: 100px;overflow: hidden;}
	#myscroll ul li {display: block;float: left;padding: 0;	width:49%; margin-right:1%;}
	#mybtns .area{float:left; display:block; width:100%; margin-left:0px; height:100px;}
	#myscroll ul li img{ width:100%; height:100px;object-fit:inherit;}
	}
@media screen and (max-width: 479px) {
	#myscroll ul li {display: block;float: left;padding: 0;	width:46%; margin-right:1%;}
	#mybtns .area{float:left; display:block; width:100%; margin-left:0px; height:100px;}
	#myscroll ul li img{ width:100%; height:100px;object-fit:inherit;}
	}
@media screen and (max-width: 319px) {
		#myscroll ul li {display: block;float: left;padding: 0;	width:89%; margin-right:0px;}
	#mybtns .area{float:left; display:block; width:100%; margin-left:0px; height:100px;}
	#myscroll ul li img{ width:100%; height:100px;object-fit:inherit;}
	}