.banner{ margin: 0 auto; width: 1920px;; height:480px; overflow:hidden;} .bannercon{ position:relative;zoom:1;} .bannercon .main{ width:100%; float:left;} .bg_colors{ position:absolute; left:0; top:0; width:100%; height:480px;} .bgs_box{ position:absolute; left:0; top:0; width:100%; height:480px; opacity:0;filter:alpha(opacity=0);} .bgs_box img{width:100%; background:center; width:100%; height:480px; } .bgs_box a{ display:block; height:480px; line-height:10000px; } .bg_colors .on{opacity:1;filter:alpha(opacity=100)} .item_txt_box{position:relative; width:800px; margin:0px auto;} .item_txt{width:800px;position:absolute; top:320px; left:-9999px;} .item_txt span{padding-left:18px; padding-right:18px; float:left; background:url(../images/hstm.png) repeat; color:#fff; font-size:24px; font-family:"微软雅黑"; line-height:50px; height:50px;} .item_txt span a{color:#fff;} .item_txt_box .on{ left:0;} .s_arr{ position:relative;} .s_left, .s_right{width:65px; height:65px;cursor:pointer; position:absolute; z-index:66; margin-top:230px;} .s_left{ background:url(../images/an1.png) no-repeat; left:0px; top:130px; } .s_right{background:url(../images/an2.png) no-repeat; right:0px; top:130px;} .switch_list{ position:relative; left:53%; top:430px; width:50%; height:50px; margin-left:-90px; overflow:hidden; } .switch_list div{ position:absolute; bottom:10px;} .switch_list div span{float:left; vertical-align:top; width:16px; height:16px; overflow:hidden; margin:0 0px; background:url(../images/dd1.png) top left no-repeat; cursor:pointer;} .switch_list div .on{ background:url(../images/dd.png) top left no-repeat;} .item_img_css3{ -webkit-animation:img_item .8s ease-out; animation:img_item .8s ease-out; } @-webkit-keyframes img_item{ 0%{-webkit-transform:translateX(-500px); opacity:0} 100%{-webkit-transform:translateX(0); opacity:1} } @keyframes img_item{ 0%{transform:translateX(-500px);opacity:0} 100%{transform:translateX(0); opacity:1} } .item_img_css3 .shadow01{ -webkit-animation:img_item01 .8s ease-out; animation:img_item01 .8s ease-out; } @-webkit-keyframes img_item01{ 0%{-webkit-transform:translateX(500px); opacity:0} 100%{-webkit-transform:translateX(0); opacity:1} } @keyframes img_item01{ 0%{transform:translateX(500px);opacity:0} 100%{transform:translateX(0); opacity:1} } @-webkit-keyframes txt_item{ 0%{-webkit-transform:translateX(-500px); opacity:0} 100%{-webkit-transform:translateX(0); opacity:1} } @keyframes txt_item{ 0%{transform:translateX(-500px);opacity:0} 100%{transform:translateX(0); opacity:1} }