body{ background:rgb(217, 244, 251)}
.Toubu{width: 100%; background:url(../images/Toubu.jpg) no-repeat center top;background-size:auto 100%; }
.root {width: 100%;height: 149px;position: relative;}
.root dt {float: left;margin-top: -76px;width:20%;height: 225px;}
.root dt img {display: block;width: 251px;height: 225px; z-index:19999; position:relative}
.root .wzgg {padding-top: 26px;position: relative;height: 113px;width:53%;float: left;font-size: 15px;color: #fff;line-height: 30px;text-indent: 2em; overflow:hidden; padding-right:13%;}
.root .wzgg p { display:inline}
.root .wzgg p em {font-weight: bold;}
.root .wzgg h1{ font-size: 15px;display:inline; font-weight:normal}
.root .wzgg h2{font-size: 15px; display:inline; font-weight:normal; height:50px; overflow:hidden}
.root .wzgg h3{font-size: 15px; display:inline; font-weight:normal}
.root .wzgg span{ display:inline; font-weight:normal}
.root .wzgg i {display: block;position: absolute;right: 0;bottom: 24px;width: 100px;height: 100px;}
.root .wzgg img {display: block;width: 100px;height: 100px;}
.wzgg{display:inline}
.wzgg_bt{display:inline; color:#FFFFFF} 
@media only screen and (max-width:1920px) { 
.Toubu{width: 100%; background:url(../images/Toubu.jpg) no-repeat center top;background-size:100% 100%; }
}
@media only screen and (max-width:1880px) { 
.Toubu{ background:url(../images/Toubu.jpg) no-repeat left top;background-size:103% 100%; } 
}
@media only screen and (max-width:1680px) { 
.root .wzgg{ margin-left:3%; padding-top:16px; width:48%; padding-right:21%} 
} 
@media only screen and (max-width:1440px) { 
.Toubu{background-size:116% 100%; }
.root .wzgg{ width:62%; padding-right:15%} 
}
@media only screen and (max-width:1400px) { 
.Toubu{  background-size:116% 100%; } 
}
@media only screen and (max-width:1300px) { 
.Toubu{  background-size:121% 100%; } 
}
@media only screen and (max-width:1200px) { 
.Toubu{background-size:150% 100%; }
.root .wzgg{ width:69%; padding-right:0%; margin-left:0%; float:right} 
.root .wzgg{ padding-top:15px}
.root .wzgg i{ display:none}
}
@media only screen and (max-width:1024px) {  
.root{ height:auto}
.root dt{ margin-top:-33px; width:24%}
.root .wzgg i{ display:none}
.root .wzgg{ padding-top:30PX;}
}
@media only screen and (max-width:850px) {   
.Toubu{ background: none}
.root{ padding:2% 0% 2% 0%; height:auto}
.root dt{ width:100%; margin-top:0%; text-align:center}
.root dt img{ margin: 0 auto;}
.root .wzgg{  display:none} 
 
}
@media only screen and (max-width:450px) { 
}

.product{ width:100%; margin: 0 auto;  background:url(../images/product.jpg) no-repeat;background-attachment:fixed;background-position:center;background-size:100% 100%;} 
.product .infoTitle{ width:100%;text-align:center; background:url(../images/pt.png) no-repeat center center; }
.product .infoTitle h2{line-height:50px; font-size:36px; color:#fff; display:block; font-weight:normal; margin-bottom:30px; }
.product .infoTitle h2 strong{ padding:0px 0px 0px 1%;}
.product .infoTitle h1{ font-size:28px; color:#fff; line-height:40px; display:block; font-weight:normal; text-transform: uppercase; display:none}
.product .infoTitle span{ color:#bbb; font-size:16px; text-transform:uppercase; font-weight:normal } 

.productInfo{ width:80%; margin: 0 auto; margin-bottom:0%; text-align:center;}
.productInfo li { width:10%; float:left;background:url(../images/p1.png) no-repeat left top;background-size:100% 100%;height:40px; margin:0% 1% 1% 1%; line-height:40px; overflow:hidden} 
.productInfo li a{ font-size:16px; color:#fff}
.productInfo li:hover{ background:url(../images/p2.png) no-repeat left top;background-size:100% 100%; } 
.productInfo li:hover a{  color:#006600}
.productInfo li:nth-child(n+25){ display:none}
.prolist{ width:100%; }
.prolist div{ width:18.8%; float: left; overflow:hidden; margin:0% 0.5% 1% 0.5%; position:relative; text-align:center; background:#fff; padding:0.06%; } 
.prolist div h2{width:100%;float:left; overflow:hidden; max-height:300px; padding-bottom:100%; position:relative; display:block; text-align:left; }
.prolist div h2 img{ width:100%; height:100%; float:left; position:absolute; margin:inherit}
.prolist div h3{ width:100%; overflow: hidden; height:50px;line-height:50px; font-size:18px; color:#006600;  font-weight:normal; text-align:center; float:left; z-index:19999; position:relative; } 
.prolist div i{ width:100%; overflow: hidden; height:74px;line-height:40px; font-size:24px; color:#fff; font-style:normal; float:left; z-index:19999; position: absolute; text-align:center; bottom:10%; display:none}   
.prolist div img {width: 100%;height:100%; display: block;transition: .3s;-moz-transition: .3s;-ms-transition: .3s;-o-transition: .3s;-webkit-transition: .3s;} 
.prolist div:hover img {transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1);-o-transform: scale(1.1);-webkit-transform: scale(1.1);}    
.prolist div dt{ width:100%; overflow: hidden; height:100%;background:url(../images/cpdtss.png) no-repeat center bottom;z-index:19998;background-size:100% 100%; position:absolute; right:0px; bottom:0%; display:none} 
.prolist div span{ height:40px; line-height:40px; margin:0% 5% 0% 0%;font-size:18px; right:0%; bottom:12%; position:absolute; z-index:19999; color:#FFFFFF; text-align:center}
.prolist div span p{display:inline; color:#FFFFFF}
.prolist div:hover{ background:#ddac3a}
.prolist div:hover dt{ display:block}
.prolist div:hover i{ display:block; }
.prolist div:hover h3{ color:#FFFFFF}
@media only screen and (max-width:1680px) {
.prolist li span p{ display:none}  
.prolist div h3{ line-height:60px;}
.prolist div i{ font-size:22px; line-height:30px; bottom:-10px}
}
@media only screen and (max-width:1440px) { 
.productInfo{ width:95%} 
}
@media only screen and (max-width:1200px) { 
.product .infoTitle h1{ font-size:36px;}
.product .infoTitle h2{ font-size:30px;}
.prolist div{ width:32.33333%; padding:0% }  
.prolist div i{ bottom:1px;}
.prolist div:nth-child(n+25){ display:none}
.productInfo{ width:100%; } 
}
@media only screen and (max-width:1024px) {
.prolistsy div{ width:18.433333%} 
.productInfo{ display:none}
}
@media only screen and (max-width:900px) {
}  
@media only screen and (max-width:850px) {  
.product .infoTitle h2{ font-size:24px; margin-bottom:0px;}  
.product .infoTitle h2 em{ font-size:24px;}   
.product .infoTitle h1{ font-size:38px;} 
.prolist div{ width:48%; margin:0% 1% 1% 1%;}
.prolist div:hover i{ display:none}
.prolist div:hover dt{ display: none}
}     
@media only screen and (max-width:768px) { 
}
@media only screen and (max-width:600px) { 
}
@media only screen and (max-width:500px) {  
}  
@media only screen and (max-width:450px) {
}
@media only screen and (max-width:414px) {  
.product .infoTitle h1{ font-size:28px;}  
}
@media only screen and (max-width:328px) {  
}

.cpfl{  padding:0% 0% 0% 0%; } 
.cpfl .sideTitle{ text-align:center;background:url(../images/cpflt.png) no-repeat center center; padding:0% 0% } 
.cpfl .sideTitle p{ width:50px; height:6px; background:#333; display:block; margin: 0 auto}
.cpfl .sideTitle i{ font-size:18px;  color:#006600; display:block; line-height:40px; font-style:normal; overflow:hidden}
.cpfl .sideTitle h1{ font-size:36px; line-height:36px; padding-left:2%; color:#ec6700}
.cpfl .sideTitle h2{ font-size:36px; color:#009900;text-shadow: #d9f4fb 4px 0 0, #d9f4fb 0 1px 0, #d9f4fb -1px 0 0, #d9f4fb 0 -1px 0; }
.cpfl .sideTitle h2 span{ padding-left:20px;font-weight: normal; color:#4c4c49;text-shadow: #d9f4fb 4px 0 0, #d9f4fb 0 1px 0, #d9f4fb -1px 0 0, #d9f4fb 0 -1px 0; }

.sideList{width:100%; float:left;  } 
.sideList li{width:11.233333%; float:left; margin:0px 0.5% 20px 0.5%; background:#fff; padding:1%; overflow:hidden; position:relative; } 
.sideList li h2{overflow:hidden; padding-bottom:100%;position:relative; display:block; }
.sideList li h2 img{ height:100%;  float:left; position:absolute; max-width:none} 
.sideList li dt{  line-height:30px; height:30px; overflow:hidden; font-size:16px;  font-weight:normal; color:#006000; text-align: center; margin:10px 0px 0px 0px;}     
.sideList li h2 img {height:100%; display: block;transition: .3s;-moz-transition: .3s;-ms-transition: .3s;-o-transition: .3s;-webkit-transition: .3s;} 
.sideList li:hover h2 img {transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1);-o-transform: scale(1.1);-webkit-transform: scale(1.1);} 
.sideList li:hover dt{ font-weight:bold} 
.sideList li:nth-child(n+21) h2{background:url(/UploadImages/IndexImages/20220107042755353.jpg) no-repeat center center;background-size:cover;}
@media only screen and (max-width:1440px) { 
.sideList li{ width:16.9333333%}  
.sideList li:nth-child(n+21){ display:none}
}
@media only screen and (max-width:1200px) {
.cpfl .sideTitle h2{ font-size:30px;}
.cpfl{ padding:0% 0%;} 
.sideList li{ width:21.8%}    
}
@media only screen and (max-width:1024px){ 
.sideList dl dt p{ font-size:38px;}  
}
@media only screen and (max-width:850px) { 
.cpfl{  padding:0% 0% 0% 0%; } 
.cpfl .sideTitle h2{ font-size:24px}
.cpfl .sideTitle i{ font-size:16px}
.cpfl .sideTitle{ padding:3% 0% 3% 0%}
}
@media only screen and (max-width:768px) {  
.cpfl{ } 
.sideList li{width:47%; } 
} 
@media only screen and (max-width:550px) { 
.cpfl .sideTitle i{ width:80%; padding-right:3%} 
.sideList li{width:47%; } 
}
@media only screen and (max-width:414px) {   
.cpfl .sideTitle i{ width:100%; overflow:hidden}
}
@media only screen and (max-width:328px) {   
.cpfl .sideTitle h2{ font-size:22px;} 
} 
.bom{background:url(../images/bom.jpg) no-repeat center center #009900;background-size:cover; padding:0% 0%;}
.bom ul{ width:60%; float:left; color:#FFFFFF}
.bom ul h2{ font-size:24px; margin-top:10px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.bom ul p{ font-size:24px;}
.bom dl{ width:200px; float: right;background:url(../images/bomdl.png) no-repeat left center; color:#FFFFFF; padding-left:109px; font-size:24px;} 
.bom dl p{ font-size:36px;}
@media only screen and (max-width:1300px) {  
.bom dl p{ font-size:32px;}
}
@media only screen and (max-width:1050px) {  
.bom dl{ font-size:20px;}
.bom dl p{ font-size:30px;}
.bom ul h2{ font-size:20px;}
.bom ul p{ font-size:16px}
}
@media only screen and (max-width:850px) {  
.bom{background:url(../images/boms.jpg) no-repeat center center #009900; }
.bom ul{ width:100%; text-align:center; padding-bottom:3%}
.bom dl{ width:50%; margin-left:26%; float:left}
}
@media only screen and (max-width:768px) { 
.bom ul h2 b{ display:block} 
}
@media only screen and (max-width:500px) { 
.bom dl{margin-left:12%;}
}
@media only screen and (max-width:414px) { 
.bom dl{margin-left:0%;}
.bom ul h2{ font-size:18px;}
}
@media only screen and (max-width:340px) { 
.bom ul h2{ display:none}
.bom dl{ font-size:18px; padding:0px 0px 20px 109px;}
.bom dl p{ font-size:26px;}
}

.icompany{ width:100%; margin: 0 auto; padding:0% 0% 0% 0%; } 
.icompany .infoTitle{ color:#000;  overflow:hidden; background:url(../images/infoTitle.png) no-repeat center center; text-align:center; } 
.icompany .infoTitle p{ font:36px/44px "΢ÈíÑźÚ"; display:block; padding-bottom:13px} 
.icompany .infoTitle p strong{ padding-right:20px; color:#006600}
.icompany .infoTitle span{ font-size:18px;font-weight:normal; color:#333}
.companyt{width:100%; float: left; }
.companyt ul{ padding:0px 8% 0px 8%; display:block; width:74%; float:left;} 
.companyt ul p{ line-height:29px; color:#777575; text-align:center }   

.companyt .infonn{ text-align:center; width:100%; float:left; height:50px;  margin:28px 50px 0px 0px; display: none;  } 
.companyt .infonn h2{ font-size:16px;width:240px; height:50px; line-height:50px; font-size:16px; color:#006600; border:1px #006600 solid;  padding:0px; float: left;border-radius:50px; }
.companyt .infonn:hover h2{ background:#f7970f;border:1px #f7970f solid; color:#FFFFFF} 
.company{ width:39%; float: left; display:none}   
.company img{ transition: .3s;-moz-transition: .3s;-ms-transition: .3s;-o-transition: .3s;-webkit-transition: .3s; display:none} 
.company:hover img {transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1);-o-transform: scale(1.1);-webkit-transform: scale(1.1);}
.company #img1{ width:240px; height:240px; font-size:40px; line-height:150px; position:absolute; bottom:0%; right:0%; display:block; background:#f3c329; color:#FFFFFF; text-align:center}

.companyt .n_part1{ display:block; width:100%; float:left;} 
.companyt .n_part1 h1{color:#009900; font-size:36px; line-height:40px; margin-top:10px;}
.companyt .n_part1 h1 strong{ padding-right:20px; }
.companyt .n_part1 h2{color:#006600; font-size:20px; line-height:40px; margin-top:10px; border-left:3px solid #f7970f; padding-left:20px;}
.companyt .n_part1 span{color:#4c4c4c; font-size:20px; line-height:30px; font-weight:normal ;display:block}
.companyt .n_part1 p{ color:#cccccc; font-size:14px; font-weight:normal}

#colee_left{ width:100%; padding-top:0px; display: block; width:100%; float:left;}
#colee_left li{ width:16.33444444%; text-align:center; padding:0% 2% 0% 0%; float:left; margin:0% 1%; border-right:1px solid #0da00d;} 
#colee_left li dt{ line-height:30px; display:block; font-weight:bold; font-size:28px; color:#006600; padding-bottom:20px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
#colee_left li h1{ font-size:14px; display:block; height:70px; color:#444444; overflow:hidden; margin-top:20px; font-weight:normal}
#colee_left li h2{ width:100%; margin: 0 auto; height:150px; overflow:hidden;border-radius:10px;}
#colee_left li h2 img{  }
#colee_left li:nth-child(5){ border:none; padding-right:0%} 
#colee_left li:hover h2{ transform:rotateY(180deg); }  
@media only screen and (max-width:1680px){ 
#colee_left li dt{ font-size:24px}
}
@media only screen and (max-width:1440px){ 
#colee_left li dt{ font-size:18px; font-weight:normal}
#colee_left li h1{ height:98px; }
}
@media only screen and (max-width:1200px){   
.icompany .infoTitle{ text-align:center; display:block}  
.icompany .infoTitle p{ font-size:30px; line-height:37px }  
.icompany .infoTitle .wrap{ background:none}
.companyt .n_part1{ display:none}
.companyt{ width:100%; padding:0% 0% 0% 0%; background:none; box-shadow: none; margin-top:0%} 
.company{ width:100%; float: left; display:block; background:none; height:auto; margin-top:0%; text-align:center; padding:0%}
.company img{ display:block; width:50%; margin:0% auto; display: block; text-align:center; margin-bottom:0%; float:none}
#colee_left li{ width:16.30444444%}
#colee_left li h2{ font-size:18px}
.companyt ul{ padding:20px 4% 20px 4%;width:82%;}  
.companyt .infonn h2{ float:none; margin: 0 auto}
}
@media only screen and (max-width:1024px){  
#colee_left li{ width:15%; padding:0% 1%}    
#colee_left li h2{ height: auto}
}  
@media only screen and (max-width:876px){  
}
@media only screen and (max-width:850px){   
.icompany .infoTitle p{ font-size:24px}
.companyt ul{ padding:20px 0% 20px 0%; width:100%;} 
.companyt ul p{ height:50px; overflow:hidden}  
#colee_left li{ width:27.9%; margin-bottom:1%}
#colee_left li:nth-child(4){ margin-left:19%;}
}
@media only screen and (max-width:768px){   
.company img{ width:80%; height:auto}
}
@media only screen and (max-width:610px){   
#colee_left li{ width:45%; border:none; margin-bottom:0%}
#colee_left li:nth-child(4){ display:none} 
}
@media only screen and (max-width:500px){  
#colee_left li h2{ font-size:16px}
}
@media only screen and (max-width:450px){
}
@media only screen and (max-width:328px){
#colee_left li{ width:98%}
#colee_left li h1{ height:auto}
}
 
.gc{ width:100%; display:none} 
.gc_t{ width:100%; text-align:center; margin-bottom:3%;line-height:60px; font-size:24px;  color:#006600;background: url(../images/gc_t.png) no-repeat center bottom; padding-bottom:20px} 
.gc_t h1{ width:50px; height:2px; background:#f7970f; display: none; margin: 0 auto}
.gc li{float:left; width:31.33333%; margin:0% 1% 1% 1%;  }
.gc li h2{ width:100%; overflow:hidden; padding-bottom:100%; position:relative; display:block; float:left }
.gc li h2 img{ width:100%; height:100%; float:left; position:absolute; margin:inherit; }    
.gc li h3{ width:100%; overflow: hidden; height:500px;text-align:center; float:left;background:rgba(0, 0, 0, 0.7); margin-top:-500px; z-index:19999; position:relative; }  
.gc li h3 strong{ width:20px; margin: 0 auto;line-height:50px; font-size:36px; color:#000;  font-weight:normal; margin-top:150px;writing-mode:tb-rl;}
.gc li dt{width:100%; overflow: hidden; height:50px;line-height:50px; font-size:16px; color:#006600;  font-weight:normal;text-align:center; float:left; position:relative }    
@media only screen and (max-width:850px) {  
.gc{ display: block}
}

.xwones{ padding:0% 0% 1% 0%;  background: url(../images/xwones.jpg) no-repeat center top;background-size:cover;}
.xwones .boxti{ width:100%; text-align:center; margin-bottom:0%;background: url(../images/xwonest.png) no-repeat center center;}
.xwones .boxti h2{ font:36px/60px "΢ÈíÑźÚ";  } 
.xwones .boxti h2 span{ padding-right:0%;font-weight:bold; color:#006600;}
.xwones .boxti h1{ color:#006600;text-transform:uppercase; font-size:18px; font-weight:normal}
.xwones .boxti p{ line-height:30px;  color:#006600;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;} 
.xwones .boxti b{ width:50px; height:2px; background:#f7970f; margin:0px auto; display: block} 
 
.picScroll { width:100%; }  
.picScroll ul { }
.picScroll li {width:25%; float:left; overflow:hidden}
.picScroll li .cont {padding:12px 44px 0 44px; background: #f3f3f3; height:120px;}
.picScroll li .cont h3{padding-bottom: 0px; font-size:24px; color:#006600;padding-left: 35px;}
.picScroll li .cont .pic { border-bottom: 1px solid #e6e6e6; background: url(../images/bg0.png) no-repeat; }
.picScroll li .cont .pic1 { border-bottom: 1px solid #e6e6e6; background: url(../images/bg1.png) no-repeat;}
.picScroll li .cont .pic2 { border-bottom: 1px solid #e6e6e6; background: url(../images/bg2.png) no-repeat;}
.picScroll li .cont .pic3 { border-bottom: 1px solid #e6e6e6; background: url(../images/bg3.png) no-repeat;}
.picScroll li .cont .desc {font-size: 14px; color: #666; padding-top: 14px; } 
.picScroll li h2{ height:133px; overflow:hidden; position:relative} 
.picScroll li h2 img{ width:100%; height:134%}
.picScroll li h2 i{ width:100%; height:10px; position:absolute; z-index:19999; margin: 0 auto;}
.picScroll a:nth-child(1) li h2 i{ background: url(../images/j1.png) no-repeat center top; top:0%;}
.picScroll a:nth-child(2) li h2 i{ background: url(../images/j2.png) no-repeat center top; bottom:0%;}
.picScroll a:nth-child(3) li h2 i{ background: url(../images/j1.png) no-repeat center top; top:0%;}
.picScroll a:nth-child(4) li h2 i{ background: url(../images/j2.png) no-repeat center top; bottom:0%;}
@media only screen and (max-width:1440px) { 
.picScroll li .cont{ padding:40px 44px 0 44px; height:180px;} 
.picScroll li h2{ height:220px;}
}
@media only screen and (max-width:1200px) { 
.xwones .boxti h2{ font-size:30px}
.xwones .boxti h1{ font-size:18px}  
.picScroll li .cont h3{ font-size:17px;}  
}
@media only screen and (max-width:1024px) { 
.picScroll li {width:33.3333333%;}
.picScroll a:nth-child(4){ display:none}
}
@media only screen and (max-width:850px) {
.picScroll{ display:none}
.xwones .boxti h2{ font-size:24px} 
}
@media only screen and (max-width:768px) { 
.xwones .boxti h1{ font-size:16px} 
}
@media only screen and (max-width:450px) {   
}
  
.xwone{ padding:0% 0% 0% 0%;}
.xwone_top{ width:100%; text-align:center; }
.xwone_top h3{ font-size:36px; line-height:50px; font-weight:normal;  } 
.xwone_top h3 strong{padding-right:2%; color:#009900} 
.xwone_top h2{ font-size:18px; line-height:30px; font-weight:normal; display:none }   

.xwone .part4{ width:40%; float: left; }
.xwone .info{ width:27%; float: left; margin-left:3%}
.xwone ul li{ height:30px; line-height:30px; overflow:hidden; margin-bottom:0px;}
.xwone ul li span{ float:right; margin-right:20px;} 
.xwone .info ul li{ background:url(../images/new-h.jpg) no-repeat center right}
.xwone .info ul li a{ padding-left:20px;}
.xwone .info ul li span{ display:none}
.xwone .info .bobox{ height:46px; font-size:24px;background:url(../images/xwonet.png) no-repeat left bottom; padding-left:88px; }
.xwone .info .bobox span{ padding-left:20px; font-size:15px}
.xwone .info .infoTitle{ height:46px; font-size:24px;background:url(../images/xwonet.png) no-repeat left bottom; padding-left:88px;  }
.xwone .info .infoTitle span{ padding-left:20px; font-size:15px}
.xwone .part4 .boxti{ height:46px; font-size:24px;background:url(../images/xwonet.png) no-repeat left bottom; padding-left:88px; }
.xwone .part4 .boxti span{ padding-left:20px; font-size:18px}
 
.xwone .part4 dl{ padding-bottom:0px}
.xwone .part4 dl dt{ width:30%; height:110px; float:left; margin-right:20px;background:url(../images/xwonebj.jpg) no-repeat center top;background-size:cover;}
.xwone .part4 dl h2{white-space:nowrap;text-overflow:ellipsis;overflow:hidden; margin-top:9px; color:#006600}
.xwone .part4 dl span{ margin:0px 0px; display:block}
.xwone .part4 dl p{ height:50px; overflow:hidden}
 
@media only screen and (max-width:1680px){  
}
@media only screen and (max-width:1440px){   
}
@media only screen and (max-width:1200px){
.xwone_top h3{ font-size:30px;} 
.infono{ display:none}
.xwone .part4{ width:49%}
.xwone .info{ width:46%}
}
@media only screen and (max-width:850px){
.xwone{ display:none}
}
@media only screen and (max-width:350px){  
} 

.sidebox{background:url(../images/sidebox.jpg) no-repeat center top;background-size:cover; padding:0% 0%; position:relative}
.sidebox .contitle{ font-size:36px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden; text-align:center;}
.sidebox .contitle a{ color:#fff}
.sidebox .contitle span{ display: none; color:#fff; padding-left:20px; text-transform:uppercase; font-size:28px}  
.conList{ width:41%; float:right;}
.conList img{ padding:80px 0% 50px 0%; display:none}
.conList p{ width:100%; float:left; font-size:14px; font-weight:normal; color:#FFFFFF; text-align: left; }  
.conList b{ width:250px; height:40px; line-height:40px;border-radius:50px; background:#f7970f; color:#FFFFFF; display:block; margin: 20px auto}

#sideBar{ width:40%; float:left; margin-left:10%;}
#sideBar ul{ font-size:16px; color:#FFFFFF; text-transform: uppercase; margin-bottom:0px} 
#sideBar ul b{ width:20px; height:2px; background:#fff; display:block}
#sideBar ul i{ width:40px; height:2px; background:#fff; display:block}
.qbot{ width:56%; float:left; margin-left:10%; background:#fff;}

.qbot li{width:49%; float:left; overflow:hidden; position:relative; } 
.qbot li h2{overflow:hidden; padding-bottom:100%;position:relative; display:block; }
.qbot li h2 img{ height:100%;  float:left; position:absolute; max-width:none;display: block;transition: .3s;-moz-transition: .3s;-ms-transition: .3s;-o-transition: .3s;-webkit-transition: .3s;} 
.qbot li:hover h2 img {transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1);-o-transform: scale(1.1);-webkit-transform: scale(1.1);} 
.qbot li:nth-child(1){ margin-bottom:2%} 
.qbot li:nth-child(2){ margin-left:2%; margin-bottom:2%}
.qbot li:nth-child(4){ margin-left:2%}
.qbot li:nth-child(5){ display:none}
.mb0{ width:33%; float:right;overflow:hidden; padding-bottom:56%;position:relative; display:block;background:url(../images/mb0.jpg) no-repeat center top;background-size:cover;}
.sideboxbj{ width:50%; float:left; position:absolute; height:200px; left:0%; bottom:0%; display: none;background:url(../images/sideboxbj.jpg) no-repeat center center ;background-size:cover;}
@media only screen and (max-width:1440px) {   
}
@media only screen and (max-width:1200px) {  
.sidebox{ }
.sidebox .contitle{ font-size:30px}
#sideBar{ width:50%;  margin-left:0%;}
.qbot{ width:66%;margin-left:0%;}
#sideBar ul{ font-size:24px}
.conList p{ line-height:30px;}
.conList img{ padding:20px 0% 10px 0%}
.mb0{ padding-bottom:66%}
}
@media only screen and (max-width:970px) {
.sidebox{ }  
.conList{ width:46%}
}
@media only screen and (max-width:900px) {  
.sidebox{ }  
}
@media only screen and (max-width:850px) { 
.sidebox{background:url(../images/sidebox.jpg) no-repeat left top;background-size:200% 100%; padding:3% 0% 3% 0%}  
.sidebox .contitle{ font-size:24px}
#sideBar{ width:100%; padding:0%;  } 
.conList{ width:100%; padding-top:2%}  
.conList img{ display:none}
.sideboxbj{ display:none}
}
@media only screen and (max-width:450px) {    
}