@charset "utf-8"; .float-right-box{ width: 250px; position: fixed; right: 0; top: 50%; margin-top: -127px; background-color: #191919; z-index: 1000; transition: width 0.3s ease 0s; } .float-right-box.on{ width: 50px; } .float-right-box .top-list{ width: 100%; } .float-right-box .top-list ul{ width: 100%; } .float-right-box .top-list li{ width: 100%; position: relative; border-bottom: 1px solid #3b3b3b; transition: background 0.3s ease 0s; height: 50px; } .float-right-box .top-list a{ display: block; width: 100%; } .float-right-box .top-list .ico{ display: inline-block; width: 50px; height: 50px; position: absolute; right: 0; top: 0; transition: background 0.3s ease 0s; z-index: 2; } .float-right-box .top-list .ico1{ background: url(../img/ico_58.png) no-repeat center #191919; } .float-right-box .top-list .ico2{ background: url(../img/ico_59.png) no-repeat center #191919; } .float-right-box .top-list .ico3{ background: url(../img/ico_60.png) no-repeat center #191919; } .float-right-box .top-list .ico4{ background: url(../img/ico_61.png) no-repeat center #191919; } .float-right-box .top-list .ico5{ background: url(../img/ico_62.png) no-repeat center #191919; } .float-right-box .top-list .ico6{ background: url(../img/ico_68.png) no-repeat center #191919; } .float-right-box .top-list .ico7{ background: url(../img/ico_69.png) no-repeat center #191919; } .float-right-box .top-list .stt{ display: inline-block; font-size: 14px; line-height: 50px; color: #fff; transition: color 0.3s ease 0s; position: absolute; left: 28px; top: 0; z-index: 1; width: 222px; } .float-right-box .top-list li:hover .stt{ color: #15191e; } .float-right-box .top-list li:hover .ico1{ background: url(../img/ico_58_h.png) no-repeat center #f5f5f5; } .float-right-box .top-list li:hover .ico2{ background: url(../img/ico_59_h.png) no-repeat center #f5f5f5; } .float-right-box .top-list li:hover .ico3{ background: url(../img/ico_60_h.png) no-repeat center #f5f5f5; } .float-right-box .top-list li:hover .ico4{ background: url(../img/ico_61_h.png) no-repeat center #f5f5f5; } .float-right-box .top-list li:hover .ico5{ background: url(../img/ico_62_h.png) no-repeat center #f5f5f5; } .float-right-box .top-list li:hover .ico6{ background: url(../img/ico_68_h.png) no-repeat center #f5f5f5; } .float-right-box .top-list li:hover .ico7{ background: url(../img/ico_69_h.png) no-repeat center #f5f5f5; } .float-right-box .top-list li:hover{ background-color: #f5f5f5; } .float-right-box .top-list .return-webtop .stt{ font-family: "Arial"; font-weight: bold; } .float-right-box .bot-share{ position: relative; height: 50px; } .float-right-box .bot-share a{ display: inline-block; width: 50px; height: 50px; float: left; transition: background 0.3s ease 0s; margin: 0; padding: 0; } .float-right-box .bot-share .share{ width: 200px; position: absolute; left: 0; top: 0; z-index: 1; } .float-right-box .bot-share .sina{ background: url(../img/ico_63.png) no-repeat center; } .float-right-box .bot-share .wx{ background: url(../img/ico_64.png) no-repeat center; } .float-right-box .bot-share .tx{ background: url(../img/ico_65.png) no-repeat center; } .float-right-box .bot-share .more{ background: url(../img/ico_66.png) no-repeat center; } .float-right-box .bot-share a:hover{ background-color: #525354; } .float-right-box .bot-share .share-ico{ background: url(../img/ico_67.png) no-repeat center #191919; width: 50px; height: 50px; display: inline-block; cursor: pointer; z-index: 2; position: relative; } .new-float{ position: fixed; right: 0; top: 50%; z-index: 50; width: 77px; height: 374px; margin-top: -150px; } .new-float li{ position: relative; width: 77px; height: 57px; margin-bottom: 1px; line-height: 27px; color: #fff; text-align: center; } .new-float li.hover{ overflow: hidden; } .new-float li a{ display: inline-block; color: #fff; } .new-float li a.tit{ width: 77px; height: 27px; padding: 30px 10px 0 0; color: #fff; } .new-float li p{ position: relative; z-index: 2; height: 27px; padding-top: 30px; cursor: pointer; } .new-float li.fi a{ background: url(../img/bg_float01.png) no-repeat; } .new-float li.se a{ background: url(../img/bg_float02.png) no-repeat; } .new-float li.th a{ background: url(../img/bg_float03.png) no-repeat; } .new-float li.fo a.tit{ background: url(../img/bg_float04.png) no-repeat; } .new-float li.fif p{ background: url(../img/bg_float05.png) no-repeat; } .new-float li.zixun a{ background: url(../img/bg_float01.png) no-repeat; } .new-float li .tel{ position: absolute; left: 77px; top: 0; z-index: 1; width: 184px; height: 57px; font: 24px/57px Arial; color: #fff; background: url(../img/bg_float06.png) no-repeat; cursor: pointer; } .new-float a.mof{ display: inline-block; width: 54px; height: 71px; padding: 12px 11px 0 12px; margin-top: 10px; *margin-top: 7px; background: url(../img/bg_float07.png) no-repeat; font-size: 18px; line-height: 22px; color: #fff; }