@charset "utf-8";
/* CSS Document */
.prodBox{height:300px; margin:5px 8% 0;}
.prodBox .proLeft{ position: relative;width:37%; float:left;}
.prodBox .proLeft .img01{ position:relative;top:0;left:0;}
.prodBox .proLeft .img02{ width:100%;margin-top:10px;/* height:100%; position: absolute;top:10%;left: -30px;*/}
.prodBox .proRight{ width:63%; float:right;padding:5px 15px 0;}
.prodBox .proRight .proTit{ height:23px\9;padding:0 10px; color:#217fc4; overflow:hidden;}
.prodBox .proRight .proConte{ height:160px;padding:20px 10px 10px; font-size:1rem; text-align:justify; overflow:hidden;}
.prodBox .proRight .more{width:108px\9;margin-top:13px; float:right; overflow:hidden;}
.lookMore{ width:100px; height:30px; line-height:30px; margin:20px auto 30px; text-align:center; cursor:pointer; border:1px solid #CCC; overflow:hidden;}
@media screen  and (max-width:1200px){
.prodBox{height:240px;margin-bottom: 40px;}
.prodBox .proRight{ width:;}
.prodBox .proRight .proConte{ height:117px;padding:20px 10px 10px; text-align:justify;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:4;}
.prodBox .proRight .more{ margin-top:10px; float:right; overflow:hidden;}
}
@media screen  and (max-width:970px){
.prodBox{height:208px;}
.prodBox .proRight .proConte{ height:95px;font-size:.75rem;}
.prodBox .proRight .more{ float:right; overflow:hidden;}
}
@media screen  and (max-width:880px){
.prodBox{height:185px;}
.prodBox .proRight .proConte{ height:69px;padding:11px 10px 10px;font-size:.75rem;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:3;}
.prodBox .proRight .more{ float:right; overflow:hidden;}
.prodBox .proRight .more .button{ height:27px; line-height:27px; font-size:.6rem;}
}
@media screen  and (max-width:799px){
.prodBox{height:173px;}
}
@media screen  and (max-width:667px){
.prodBox{height:140px;}
}
@media screen and (max-width:540px){
.prodBox .proRight .proTit{ font-size:.75rem;}
.prodBox .proRight .proConte{ height:39px;padding:5px 10px 10px;font-size:.75rem;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2;}
.prodBox .proRight .more{ float:right; overflow:hidden;}
.prodBox .proRight .more .button{ height:27px; line-height:27px;}
}
@media screen and (max-width:480px){
.prodBox{height:132px; margin:3px 8% 0;position:relative;}
.prodBox .proLeft .img02{ position: absolute;top:10%;left: -9px;}
.prodBox:after {content: '';position: absolute;margin:0 auto;top:117px;right: 0;bottom: 0;left: 0;width:100%;height:1px;background-color: #d6d6d6;}
.prodBox .proRight{ width:65%;height:121px;padding:0 9px 0;}
.prodBox .proRight .proTit{ height:15px;padding:0 10px; color:#217fc4; overflow: hidden;}
.prodBox .proRight .proConte{ height:42px;padding:7px 10px 10px;text-align:justify; overflow: hidden;}	
.more{ width:30%; margin-top:8px; float:right;}
.more .button{ height:27px; line-height:27px; font-size:.6rem;}
}
@media screen and (max-width:360px){
.prodBox{height:103px; }
.prodBox .proRight{ height:88px;padding:0 9px 0;}
.prodBox .proRight .proTit{text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.prodBox .proRight .proConte{ height:25px;padding:7px 10px 10px;text-align:justify; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:1;}	
.prodBox:after{top: 86px;}
}