@charset "UTF-8"; /* banner */ #banner { width: 100%; height: 600px; background: #4ea8e4; position: relative; /*top:80px;*/ } #banner .wrapper { width: 986px; margin: 0 auto; position: relative; } #banner_img { display: block; position: relative; overflow: hidden; height: 600px; width: 100%; } #banner_img li { position: absolute; top: 0; left: 0; width: 100%; height: 600px; background-position: center; display: none; /*background-size: 100% 100%;*/ } #banner_img li.item0 { background-image: url(../../../front/common/images/shangshi.jpg); display: block; background-repeat: no-repeat; background-color: #9f0b13; } #banner_img li.item1 { background-image: url(../../../front/common/images/banner1.jpg); display: block; background-repeat: no-repeat; background-color: #132146; } #banner_img li.item2 { background-image: url(../../../front/common/images/banner2.jpg); background-color: #5b89ba; background-repeat: no-repeat; } #banner_img li.item3 { background-image: url(../../../front/common/images/banner3.jpg); background-color: #040548; background-repeat: no-repeat; } #banner_img li.item4 { background-image: url(../../../front/common/images/banner4.jpg); background-color: #e3e8ee; background-repeat: no-repeat; } #banner_img li.item5 { background-image: url(../../../front/common/images/banner5.gif); background-size: cover; background-repeat: no-repeat; } #banner_img .item5 .item5bg { width: 100%; height: 600px; background-color: rgba(0,23,66,0.75); } #banner_img li.item1 .item1_font { /*background-image: url(../../../front/common/images/banner0_font.png);*/ width: 651px; height: 123px; margin: 0px auto; position: relative; top: -120px; } #banner_img li.item2 .item2_font { /*background-image: url(../../../front/common/images/banner1_font.png);*/ width: 507px; height: 89px; position: relative; top: 70px; float: right; right: -550px; } #banner_img li.item2 .item2_font2 { /*background-image: url(../../../front/common/images/banner2_font2.png);*/ width: 762px; height: 428px; position: absolute; top: 55px; left: -762px; } #banner_img li.item3 .item3_font1 { /*background-image: url(../../../front/common/images/banner2_font3.png);*/ width: 575px; height: 105px; position: absolute; top: -95px; left: 240px; } #banner_img li.item3 .item3_font2 { color: #fff; position: absolute; bottom: -45px; border: 1px solid #fff; width: 160px; line-height: 40px; text-align: center; font-size: 21px; border-radius: 5px; left: 245px; cursor: pointer; } #banner_img li.item3 .item3_font3 { /*background-image: url(../../../front/common/images/banner2_font1.png);*/ width: 362px; height: 333px; position: absolute; right: -370px; top: 120px; background-position:center center; } #banner_img li.item4 .item4_pic{ background-image: url(../../../front/common/images/banner4pic.png); background-position: center center; background-repeat: no-repeat; width:1920px; height: 600px; margin: 0 auto; } #banner_img li.item5 .item5_pic{ background-image: url(../../../front/common/images/banner5pic.png); background-position: center center; background-repeat: no-repeat; width:1169px; height: 600px; margin: 0 auto; } #banner_ctr { position: absolute; top: 540px; left: 47%; overflow: hidden; padding: 2px; z-index: 10; } #banner_ctr ul { font-size: 0; line-height: 0; position: relative; } #banner_ctr li { display: block; float: left; width: 16px; height: 16px; cursor: pointer; overflow: hidden; padding: 0px; background-repeat: no-repeat; margin-right: 10px; background: rgba(255,255,255,0.4); border-radius: 16px; transition: all 0.5s ease; -webkit-transition: all 1s ease; } #banner_ctr li.first-item { background: #fff; width: 40px; -webkit-border-radius: 20px 0 0 20px; -moz-border-radius: 20px 0 0 20px; border-radius: 20px 0 0 20px; cursor: default; } #banner_ctr li.last-item { background: #fff; width: 40px; -webkit-border-radius: 0 20px 20px 0; -moz-border-radius: 0 20px 20px 0; border-radius: 0 20px 20px 0; cursor: default; } #banner_ctr .selected { background: #fff; width: 32px; }