/*悬浮链接*/ .suspension { position: fixed; z-index: 55; right: 0; bottom: 85px; width: 70px; height: 240px; } .suspension-box { position: relative; float: right; } .suspension .a { display: block; width: 44px; height: 44px; background-color: #353535; margin-bottom: 4px; cursor: pointer; outline: none; } .suspension .a.active, .suspension .a:hover { background: #F05352; } .suspension .a .i { float: left; width: 44px; height: 44px; background-image: url(../images/side_icon.png); background-repeat: no-repeat; } /* .suspension .a-service .i{background-position:0 0;} */ .suspension .a-service .i { width: 20px; height: 20px; margin-top: 12px; margin-left: 12px; background-image: url(../images/suspension-bg.png); background-repeat: no-repeat; background-position: 0 0; } .suspension .a-service-phone .i { width: 20px; height: 20px; margin-top: 12px; margin-left: 12px; background-image: url(../images/suspension-bg.png); background-repeat: no-repeat; background-position: -27px 0; } .suspension .a-qrcode .i { background-position: -44px 0; } .suspension .a-cart .i { background-position: -88px 0; } .suspension .a-top .i { background-position: -132px 0; } .suspension .a-top { background: #D2D3D6; display: none; } .suspension .a-top:hover { background: #c0c1c3; } .suspension .d { display: none; width: 223px; background: #fff; position: absolute; right: 67px; min-height: 90px; border: 1px solid #E0E1E5; border-radius: 3px; box-shadow: 0px 2px 5px 0px rgba(161, 163, 175, 0.11); } .suspension .d .arrow { position: absolute; width: 8px; height: 12px; background: url(../images/side_bg_arrow.png) no-repeat; right: -8px; top: 31px; } .suspension .d-service { top: 0; } .suspension .d-service-phone { top: 34px; } .suspension .d-qrcode { top: 78px; } .suspension .d .inner-box { padding: 8px 22px 12px; } .suspension .d .inner-box .qrcode-img img{ width: 130px; height: 130px; } .suspension .d-service-item { display: inline-block; border-bottom: 1px solid #eee; padding: 14px 0; } .suspension .d-service .d-service-item { border-bottom: none; } .suspension .d-service-item .circle { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background: #F1F1F3; display: block; float: left; } .suspension .d-service-item .i-qq { width: 44px; height: 44px; background: url(../images/side_con_icon03.png) no-repeat center 15px; display: block; transition: all .2s; border-radius: 50%; overflow: hidden; } .suspension .d-service-item:hover .i-qq { background-position: center 3px; } .suspension .d-service-item .i-tel { width: 44px; height: 44px; background: url(../images/side_con_icon02.png) no-repeat center center; display: block; } .suspension .d-service-item h3 { float: left; width: 112px; line-height: 44px; font-size: 15px; margin-left: 12px; color: #333;} .suspension .d-service-item .FuWu { float: left; width: 112px; line-height: 22px; font-size: 15px; margin-left: 12px;} .suspension .d-service-item .FuWu .number { font-family: Arial,"Microsoft Yahei","HanHei SC",PingHei,"PingFang SC","Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif; } .suspension .d-service-intro { display: inline-block; padding-top: 10px; } .suspension .d-service-intro p { float: left; line-height: 27px; font-size: 12px; width: 50%; white-space: nowrap; color: #888; } .suspension .d-service-intro i { background: url(../images/side_con_icon01.png) no-repeat center ; height: 27px; width: 14px; margin-right: 5px; vertical-align: top; display: inline-block; } .suspension .d-qrcode { text-align: center; } .suspension .d-qrcode .inner-box { padding: 20px 0; } .suspension .d-qrcode p { font-size: 16px; color: #93959c; }