﻿#info_box{ width:1000px; margin:0 auto;}
.site_banner{ width:100%; margin-bottom:30px;}
.site_banner img{ display:block; margin:0 auto;}
.infos{ position:relative; float:left; width:68%; padding:28px 14px 0; background-color:#f7f7f7;}
.infos h2{ font-size:18px; color:#333333; width:42%; border-bottom:#ba3530 2px solid; line-height:34px; font-weight:normal; text-align:center;}
.infos p{ width:42%; color:#666; margin-top:30px; line-height:28px; }
.infos p a{ color:#ba3530; text-decoration:none; float:right;_float:none;}
.infos p a:hover{ font-size:16px; font-weight:normal;}
.infos img{ width:380px; height:230px; float:right; overflow:hidden; margin-left:8px;_width:380px;}
.infos .morebg{ position:absolute; top:70px; left:19%; display:block; width:40px; height:14px; text-align:center; line-height:15px; font-size:6px; background-color:#992b2c; text-decoration:none; color:#fff;}
.infos .morebg:hover{ cursor: pointer; color:#fff;}
.else_info{ float:right; width:27%;}
.top{ display:block; cursor:pointer; height:40%; width:100%; margin-bottom:8px; overflow:hidden;}
.top:hover{opacity:0.8;}
.bottom{ display:block; cursor:pointer; height:42%; width:100%;overflow:hidden;}
.bottom:hover{opacity:0.8;}

@media only screen and (max-width:768px){
#info_box,.infos{clear:both;width:100%; box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
 .else_info{clear:both; width:100%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box; margin-top:20px;}
 .else_info .top,.else_info .bottom{width:50%;overflow:hidden;height:104px;}
 .else_info .top{ float:left; text-align: center;}
 .else_info .bottom{ float:right; text-align: center;border-radius: 10px 0 10px 0 !important;} 

}
@media only screen and (max-width:720px){
#info_box,.infos{clear:both;width:100%; box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
 .else_info{clear:both; width:100%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box; margin-top:20px;}
 .else_info .top,.else_info .bottom{width:50%;overflow:hidden;height:104px;}
 .else_info .top{ float:left; text-align: center;}
 .else_info .bottom{ float:right; text-align: center;border-radius: 10px 0 10px 0 !important;} 

}

@media only screen and (max-width:640px){
 .infos{clear:both;width:100%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
 .infos p,.infos h2{ width:100%;}
  .infos img{display: block;clear:both;margin: 30px auto 0px;margin-right: 130px;width: 335px;}
 .infos .morebg{ position:absolute; top:70px; left:47%;}
 
}
@media only screen and (max-width:580px){
  .infos img{display: block;clear:both;margin: 30px auto 0px;margin-right: 100px;width: 335px;}
}
@media only screen and (max-width:520px){
  .infos img{margin-right: 70px;}
.else_info{clear:both; width:100%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box; margin-top:20px;}
 .else_info .top,.else_info .bottom{clear:both; width:100%;overflow:hidden;text-align: center;}
}
@media only screen and (max-width:500px){
  .infos img{margin-right:0;width: 100%;}
} 