/*banner*/



.title-box{position:relative; width:1200px; margin:30px auto;}
.title-box h2{ font-size:24px; line-height:36px; display:block; margin:0 auto;-webkit-transform:translateX(0); -o-transform:translateX(0); -ms-transform:translateX(0); -moz-transform:translateX(0);transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; -o-transition:.3s;position:relative;z-index:1; border-radius:0 20px 20px 0; color:#FFF}
.title-box h2 span{ padding-left:10px; font-size:18px; font-weight:100}


.roundabout_box {width:980px;height:480px;}
.roundabout_box ul {}
.roundabout_box img {width:100%;}
/**********roundabout**********/
.roundabout_box {height:440px;width:1200px;margin:40px auto 20px auto;}
.roundabout-holder{list-style:none;width:800px;height:425px;margin:0px auto;}
.roundabout-moveable-item{font-size:12px!important;height:425px;width:650px;cursor:pointer;}
.roundabout-moveable-item a{ position:relative; height:100%; display:block;}
.roundabout-moveable-item img{height:100%;width:100%;background-color:#FFFFFF;margin:0;}
.roundabout-in-focus{cursor:auto;border-left:1px #fff solid;border-right:1px #fff solid;}
.roundabout-in-focus000:hover{-webkit-box-shadow:0px 0px 20px #787878;-moz-box-shadow:0px 0px 20px #787878;background:#f9f9f9;}
.roundabout-holder .text{color:#999;}
.roundabout-in-focus000:hover span{display:inline;position:absolute;bottom:5px;right:5px;padding:8px 20px;background:#f9f9f9;color:#3366cc;z-index:999;-webkit-border-top-left-radius:5px;-moz-border-radius-topLeft:5px;border-left:1px solid #aaaaaa;border-top:1px solid #aaaaaa;}
.roundabout a:active, .roundabout a:focus, .roundabout a:visited{outline:none;text-decoration:none;}
.roundabout li{margin:0}
.roundabout-moveable-item a b{ text-align:center; width:100%; font-size:16px; line-height:30px; padding:10px 0; font-weight:normal; display:block; position:absolute; bottom:0px; background:rgba(0,0,0,0.7); color:#fff;}


.bg-gray{ width:100%; background:#f9f9f9; padding:40px 0; overflow:hidden;}
.bg-red{ width:100%; background:url(../images/bg-about_1.jpg) no-repeat center center; padding:40px 0; overflow:hidden;}
.bg-red .title-box a h2{ color:#fff;}
.bg-red .title-box a h2 span{ color:#d7d7d7;}
.bg-red .title-box a i b.more{-webkit-box-shadow:3px 3px 5px #b41417;-moz-box-shadow:3px 3px 5px #b41417;box-shadow:3px 3px 5px #b41417;}
.bg-red .title-box a:hover,.bg-red .title-box a:hover i b.more{ background-color:#36404b;}

.scroll-brand{width:1200px;margin:0px auto;position:relative;}
.scroll-brand .brand-box{overflow:hidden;position:relative;width:1200px;margin:0 auto; padding-bottom:20px;}
.scroll-brand .brand-list{overflow:hidden;width:9999px;}
.scroll-brand .brand-list li{float:left;width:240px; text-align:center;}
.scroll-brand .prev,.scroll-brand .next{ display:none;}
.brand-list li a{ width:226px; border:#e4e4e4 1px solid; background:#fff; margin:0 6px;transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;z-index:9; position:relative;display: inline-block;}
.brand-list li img{max-height:50px; max-width:100%; vertical-align: middle; margin:8px;}
.brand-list li a:hover{-webkit-animation:swing 1s .2s ease both;-moz-animation:swing 1s .2s ease both;}


@-webkit-keyframes swing{
20%,40%,60%,80%,100%{-webkit-transform-origin:top center}
20%{-webkit-transform:rotate(15deg)}
40%{-webkit-transform:rotate(-10deg)}
60%{-webkit-transform:rotate(5deg)}
80%{-webkit-transform:rotate(-5deg)}
100%{-webkit-transform:rotate(0deg)}
}
@-moz-keyframes swing{
20%,40%,60%,80%,100%{-moz-transform-origin:top center}
20%{-moz-transform:rotate(15deg)}
40%{-moz-transform:rotate(-10deg)}
60%{-moz-transform:rotate(5deg)}
80%{-moz-transform:rotate(-5deg)}
100%{-moz-transform:rotate(0deg)}
}