@charset "utf-8";

/* 效果CSS开始 */
.mod18{width:677px;position:relative;margin:0 auto;}
.mod18 .btn{position:absolute;cursor:pointer;z-index:99;font-size:50px;font-weight:bold;}
.mod18 .prev{left:10px;background:url(../images/prevBtn.png) no-repeat;}
.mod18 #prevTop,.mod18 #nextTop{top:250px;width:32px;height:48px;}
.mod18 #prev,.mod18 #next{top:490px;width:10px;height:16px;}
.mod18 #prevTop{background:url(../images/prevBtnTop.png) 0 0 no-repeat;}
.mod18 #nextTop{background:url(../images/nextBtnTop.png) 0 0 no-repeat;}
.mod18 .next{right:10px;background:url(../images/nextBtn.png) no-repeat;}
.mod18 li{float:left;}
.mod18 .cf li{position:relative;color:#fff;}
.mod18 .cf a{display:block;width:526px;height:377px;position:absolute;color:#fff;}
.mod18 .cf li span{display:block;width:486px;position:absolute;left:75px;bottom:0;padding:10px 20px;line-height:22px;text-align:left;background:rgba(0,0,0,0.6);filter:progid:DXImageTransform.Microsoft.gradient( GradientType = 0,startColorstr = "#60000000",endColorstr = "#60000000");}
.mod18 .picBox{width:526px; height:394px; padding-left:75px; padding-right:76px;position:relative;overflow:hidden; background:#f8f8f8; padding-top:40px;}
.mod18 .picBox ul{height:377px;position:absolute; left:0;}
.mod18 .picBox li{padding-left:75px; padding-right:1px; width:526px;height:377px;}
.mod18 .listBox{width:642px;height:100px;margin:0 auto;position:relative; padding-top:15px;overflow:hidden;}
.mod18 .listBox ul{height:88px;position:absolute; padding-left:12px;}
.mod18 .listBox li{width:127px;height:77px;cursor:pointer;position:relative; padding:5px 0 0 0;}
.mod18 .listBox li i{display:none;}
.mod18 .listBox li a{display:block;width:108px;height:77px;}
.mod18 .listBox img{border:3px solid #fff;}
.mod18 .listBox .on img{border:3px solid #CECDCC;}
.mod18 .listBox .on{background:url(../images/img_bg.jpg) center top no-repeat;}
.mod18 .listBox .on i{display:block;}

@media screen and (max-width:540px) {
.mod18{width:500px;position:relative;margin:0 auto;}
.mod18 .btn{position:absolute;cursor:pointer;z-index:99;font-size:50px;font-weight:bold;}
.mod18 .prev{left:10px;background:url(../images/prevBtn.png) no-repeat;}
.mod18 #prevTop,.mod18 #nextTop{top:250px;width:32px;height:48px;}
.mod18 #prev,.mod18 #next{top:490px;width:10px;height:16px;}
.mod18 #prevTop{background:url(../images/prevBtnTop.png) 0 0 no-repeat;}
.mod18 #nextTop{background:url(../images/nextBtnTop.png) 0 0 no-repeat;}
.mod18 .next{right:10px;background:url(../images/nextBtn.png) no-repeat;}
.mod18 li{float:left;}
.mod18 .cf li{position:relative;color:#fff;}
.mod18 .cf a{display:block;width:426px;height:377px;position:absolute;color:#fff;}
.mod18 .cf li span{display:block;width:426px;position:absolute;left:75px;bottom:0;padding:10px 20px;line-height:22px;text-align:left;background:rgba(0,0,0,0.6);filter:progid:DXImageTransform.Microsoft.gradient( GradientType = 0,startColorstr = "#60000000",endColorstr = "#60000000");}
.mod18 .picBox{width:500px; height:394px; padding-left:75px; padding-right:76px;position:relative;overflow:hidden; background:#f8f8f8; padding-top:40px;}
.mod18 .picBox ul{height:377px;position:absolute; left:0;}
.mod18 .picBox li{padding-left:75px; padding-right:1px; width:526px;height:377px;}
.mod18 .listBox{width:500px;height:100px;margin:0 auto;position:relative; padding-top:15px;overflow:hidden;}
.mod18 .listBox ul{height:88px;position:absolute; padding-left:12px;}
.mod18 .listBox li{width:127px;height:77px;cursor:pointer;position:relative; padding:5px 0 0 0;}
.mod18 .listBox li i{display:none;}
.mod18 .listBox li img{width:100%;}
.mod18 .listBox li a{display:block;width:108px;height:77px;}
.mod18 .listBox img{ border:3px solid #fff;}
.mod18 .listBox .on img{border:3px solid #CECDCC;}
.mod18 .listBox .on{background:url(../images/img_bg.jpg) center top no-repeat;}
.mod18 .listBox .on i{display:block;}
	
}

@media screen and (max-width:450px) {
.mod18{width:420px;position:relative;margin:0 auto;}
.mod18 .btn{position:absolute;cursor:pointer;z-index:99;font-size:50px;font-weight:bold;}
.mod18 .prev{left:10px;background:url(../images/prevBtn.png) no-repeat;}
.mod18 #prevTop,.mod18 #nextTop{top:250px;width:32px;height:48px;}
.mod18 #prev,.mod18 #next{top:490px;width:10px;height:16px;}
.mod18 #prevTop{background:url(../images/prevBtnTop.png) 0 0 no-repeat;}
.mod18 #nextTop{background:url(../images/nextBtnTop.png) 0 0 no-repeat;}
.mod18 .next{right:10px;background:url(../images/nextBtn.png) no-repeat;}
.mod18 li{float:left;}
.mod18 .cf li{position:relative;color:#fff;}
.mod18 .cf a{display:block;width:406px;height:377px;position:absolute;color:#fff;}
.mod18 .cf li span{display:block;width:386px;position:absolute;left:75px;bottom:0;padding:10px 20px;line-height:22px;text-align:left;background:rgba(0,0,0,0.6);filter:progid:DXImageTransform.Microsoft.gradient( GradientType = 0,startColorstr = "#60000000",endColorstr = "#60000000");}
.mod18 .picBox{width:420px; height:394px; padding-left:75px; padding-right:76px;position:relative;overflow:hidden; background:#f8f8f8; padding-top:40px;}
.mod18 .picBox ul{height:377px;position:absolute; left:0;}
.mod18 .picBox li{padding-left:75px; padding-right:1px; width:326px;height:234px;}
.mod18 .picBox li img{ width:100%;}
.mod18 .listBox{width:420px;height:100px;margin:0 auto;position:relative; padding-top:15px;overflow:hidden;}
.mod18 .listBox ul{height:88px;position:absolute; padding-left:12px;}
.mod18 .listBox li{width:127px;height:77px;cursor:pointer;position:relative; padding:5px 0 0 0;}
.mod18 .listBox li i{display:none;}
.mod18 .listBox li a{display:block;width:108px;height:77px;}
.mod18 .listBox img{border:3px solid #fff;}
.mod18 .listBox .on img{border:3px solid #CECDCC;}
.mod18 .listBox .on{background:url(../images/img_bg.jpg) center top no-repeat;}
.mod18 .listBox .on i{display:block;}
	
}

@media screen and (max-width:360px) {
.mod18{width:320px;position:relative;margin:0 auto;}
.mod18 .btn{position:absolute;cursor:pointer;z-index:99;font-size:50px;font-weight:bold;}
.mod18 .prev{left:10px;background:url(../images/prevBtn.png) no-repeat;}
.mod18 #prevTop,.mod18 #nextTop{top:150px;width:16px;height:24px;}
.mod18 #prev,.mod18 #next{top:280px;width:10px;height:16px;}
.mod18 #prevTop{background:url(../images/prevBtnTop1.png) 0 0 no-repeat;}
.mod18 #nextTop{background:url(../images/nextBtnTop1.png) 0 0 no-repeat;}
.mod18 .next{right:10px;background:url(../images/nextBtn.png) no-repeat;}
.mod18 li{float:left;}
.mod18 .cf li{position:relative;color:#fff;}
.mod18 .cf a{display:block;width:326px;height:234px;position:absolute;color:#fff;}
.mod18 .cf li span{display:block;width:286px;position:absolute;left:25px;bottom:0;padding:10px 20px;line-height:22px;text-align:left;background:rgba(0,0,0,0.6);filter:progid:DXImageTransform.Microsoft.gradient( GradientType = 0,startColorstr = "#60000000",endColorstr = "#60000000");}
.mod18 .picBox{width:320px; height:234px; padding-left:25px; padding-right:76px;position:relative;overflow:hidden; background:#f8f8f8; padding-top:40px;}
.mod18 .picBox ul{height:234px;position:absolute; left:0;}
.mod18 .picBox li{padding-left:25px; padding-right:1px; width:326px;height:234px;}
.mod18 .picBox li img{ width:100%;}
.mod18 .listBox{width:320px;height:40px;margin:0 auto;position:relative; padding-top:15px;overflow:hidden;}
.mod18 .listBox ul{height:40px;position:absolute; padding-left:12px;}
.mod18 .listBox li{width:42px;height:25px;cursor:pointer;position:relative; padding:5px 0 0 0;}
.mod18 .listBox li i{display:none;}
.mod18 .listBox li a{display:block;width:42px;height:25px;}
.mod18 .listBox img{border:3px solid #fff;}
.mod18 .listBox .on img{border:3px solid #CECDCC;}
.mod18 .listBox .on{background:url(../images/img_bg.jpg) center top no-repeat;}
.mod18 .listBox .on i{display:block;}
	
}