.kefu-cb{ width: 70px; height: 245px; /*height: 300px;*/ background-color: #e9e9e9; position: fixed; top: 50%; /*top: 80%;*/ transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); /*right: 303px;*/ right: 20px; border-radius: 5px; z-index: 9999999; } .kefu-cb ul{ padding: 0; margin: 0; text-align: center; } .kefu-cb ul>li{ height: 65px; color: #666666; border-radius: 5px 5px 0 0; cursor: pointer; position: relative; font-size: 13px; } .kefu-cb ul>li a{ color: #ffffff; } .kefu-cb ul>li a:hover{text-decoration: none} .kefu-cb ul>li:first-child{ height: 65px; background-color: #1226aa; color: #fff; border-radius: 5px 5px 0 0; } .kefu-cb ul>li div.item{ height: 37px; position: relative; } .kefu-cb ul>li div>span{ display: block; width: 30px; height: 25px; background-image: url(../images/icon/product-zx.png); background-position: center; background-repeat: no-repeat; position: absolute; bottom: 5px; left: 50%; transform: translate(-50%,0); } .kefu-cb ul>li:nth-of-type(2) div>span{ background-image: url(../images/icon/product-dh.jpg); } .kefu-cb ul>li:nth-of-type(3) div>span{ /*background-image: url(../images/icon/product-qq.jpg); */ background-image: url(../images/icon/product-wx.jpg); } /*.kefu-cb ul>li:nth-of-type(3) p{ color: #666666; }*/ /*.kefu-cb ul>li:nth-of-type(4) div>span{ background-image: url(../images/icon/product-qq.jpg); } .kefu-cb ul>li:nth-of-type(4) p{ color: #666666; }*/ /*.kefu-cb ul>li:nth-of-type(4) div>span{ background-image: url(../images/icon/ywzx.png); } .kefu-cb ul>li:nth-of-type(4) p{ color: #666666; }*/ .kefu-cb ul>li:nth-of-type(4) div>span{ background-image: url(../images/icon/product-top.jpg); } .kefu-cb ul>li div.kefu-cb-nr{ background: #ffffff; position: absolute; width: 180px; line-height: 65px; font-size: 20px; top: 0; left: -180px; transition: all .4s; -webkit-transition: all .4s; -moz-transition: all .4s; -ms-transition: all .4s; -o-transition: all .4s; transform-origin: right; -webkit-transform-origin: right; -moz-transform-origin: right; -o-transform-origin: right; -ms-transform-origin: right; transform: scaleX(0); -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -o-transform: scaleX(0); -ms-transform: scaleX(0); border-radius: 5px 0 0 5px; box-shadow: 0 0 5px rgba(0,0,0,.2); -webkit-box-shadow: 0 0 5px rgba(0,0,0,.2); -o-box-shadow: 0 0 5px rgba(0,0,0,.2); -moz-box-shadow: 0 0 5px rgba(0,0,0,.2); -ms-box-shadow: 0 0 5px rgba(0,0,0,.2); } .kefu-cb ul>li div.kefu-cb-nr.kefu-cb-wxh{top: -130px;} .kefu-cb ul > li div.kefu-cb-nr .ftel{font-size: 13px; line-height: 32px; text-align: left; padding: 15px 0 15px 15px;} .kefu-cb ul > li div.kefu-cb-nr b{clear: both; font-weight: normal; font-size: 14px;display: block; font-weight: bold; color: #1226aa} .kefu-cb ul>li> div.kefu-cb-nr.kefu-cb-wx{ background: url(../images/ewm.jpg); height: 110px; width: 110px; left: -110px;background-size: 100% } .kefu-cb ul>li> div.kefu-cb-nr.kefu-cb-wxh{ width: 360px; left: -390px;padding: 15px; } .kefu-cb ul>li> div.kefu-cb-nr.kefu-cb-wxh dl{float: left; width: 120px; } .kefu-cb ul>li> div.kefu-cb-nr.kefu-cb-wxh dl dt{line-height: 30px; font-size: 14px; font-weight: bold;color: #1226aa} .kefu-cb ul>li> div.kefu-cb-nr.kefu-cb-wxh dl dd{font-size: 13px; line-height: 20px;} .kefu-cb ul>li> div.kefu-cb-nr.kefu-cb-wxh img{max-width: 120px;} .kefu-cb ul>li:hover > div.kefu-cb-nr{ transform: scaleX(1); -webkit-transform: scaleX(1); -o-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); } @media (max-width:767px) { .hidden-xs { display: none!important } } @media (min-width:768px) and (max-width:991px) { .hidden-sm { display: none!important } }