/*.online-service-20*/
.online-service-20{box-sizing: content-box;width:208px;border: 1px solid #efefef;background: #fff;}
@media screen and (max-width: 768px) {
    .online-service-20.right,.online-service-22.left,.online-service-20.left,.online-service-22.right{
        visibility: hidden !important;
        display: none !important;
        width: 0;
        height: 0;
    }
}
/*.online-service-20.left{ left: 0px;top:50%;margin-top: -10%;}*/
.online-service-20 .online-service-header{height: 40px;line-height: 40px;background: #4BACE8 url(../images/kefu.png) 16px center no-repeat;}
.online-service-20 .online-service-header-text{margin-left: 46px;font-size:14px;color:#fff;}
.online-service-20 .online-service-header-close{float: right;width: 40px;height: 40px;background: transparent url(../images/del.png) center center no-repeat;cursor:pointer;}
/*.online-service-20 .online-service-header-close:hover{background-color:#619EFB;}*/
.online-service-20 .online-service-accounts-item{height: 38px;line-height: 38px;border-bottom: 1px dashed #f7f7f7;}
.online-service-20 .online-service-accounts-item a{display: block;height: auto !important;margin-left: 16px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;color: #333;font-size: 14px;text-decoration: initial;}
.online-service-20 .online-service-accounts-item a:hover{text-decoration: underline;}
.online-service-20 .online-service-accounts-item a img{margin-right: 5px;height: 18px;max-height: 18px;overflow: hidden;}

.online-service-20 .online-service-contacts-title {height: 40px;line-height: 40px;border-bottom:1px solid #f5f5f5;background: transparent url(../images/lianxi.png) 16px center no-repeat;}
.online-service-20 .online-service-contacts-title-text {font-size:14px;margin-left: 45px;}

.online-service-20 .online-service-contacts-item {height: auto;line-height: 30px;margin: 4px 15px;font-size: 14px;color: #666;}
/*.online-service-20 .online-service-contacts-item-content{display: block;width: 100%;line-height: 24px;font-size: 14px;color: #4BACE8;word-break: break-all;}*/
.online-service-20 .online-service-contacts-item-content{line-height: 24px;font-size: 14px;margin-left:10px;word-break: break-all;}

.online-service-20 .online-service-qrcode {}
.online-service-20 .online-service-qrcode-title {height: 40px;line-height: 40px;background: transparent url(../images/erweima.png) 16px center no-repeat;}
.online-service-20 .online-service-qrcode-title-text{margin-left: 45px;font-size:14px;}
.online-service-20 .online-service-qrcode-content {padding-top: 6px;padding-bottom: 20px;}
.online-service-20 .online-service-qrcode-img{display: block;width: 128px;height: 128px;margin: 0 auto;}

.online-service-20 .online-service-toggle-btn{position: absolute;left: 225px;top:50%;margin-top: -60px;width: 40px;height: 120px;z-index: 1001;background: #4BACE7 url(../images/left.png) center 90px no-repeat;text-align: center;cursor: pointer;border: 1px solid #ccc;}
.online-service-20.left .online-service-toggle-btn{left: 209px;background-image:url(../images/left.png);}
.online-service-20.right .online-service-toggle-btn{ left: -40px; background-image:url(../images/right.png);}
.online-service-20 .online-service-toggle-btn.left{background-image:url(../images/left.png);}
.online-service-20 .online-service-toggle-btn.right{background-image:url(../images/right.png);}
.online-service-20 .online-service-toggle-btn-text{display: block;width: 14px;margin: 20px auto;color:#fff;line-height: 16px;font-size: 14px;}

.online-service-20.out{width: 0;border:0;}
.online-service-20.out .online-service-header,
.online-service-20.out .online-service-content{display:none;}

.online-service-20.red .online-service-header, 
.online-service-20.red .online-service-toggle-btn{background-color:#e60012;}
.online-service-20.green .online-service-header, 
.online-service-20.green .online-service-toggle-btn{background-color:#a9e047;}
.online-service-20.blue .online-service-header, 
.online-service-20.blue .online-service-toggle-btn{background-color:#4BACE8;}
.online-service-20.yellow .online-service-header, 
.online-service-20.yellow .online-service-toggle-btn{background-color:#ffb800;}
.online-service-20.black .online-service-header, 
.online-service-20.black .online-service-toggle-btn{background-color:#010101;}

/*.online-service-22 */
.online-service-22{position:fixed;z-index: 99;}
.online-service-22.left{left: 20px;bottom: 100px;}
.online-service-22.right{right: 20px;bottom: 100px;}
.online-service-22 .online-service-btn{box-sizing: content-box;margin-bottom: 4px;padding: 6px 10px 14px 10px;width: 35px;height: 35px;line-height: 20px;border-radius: 5px;background: #4BACE7;color: #fff;text-align: center;font-size: 14px;cursor: context-menu;}
.online-service-22 .online-service-btn3{padding: 0px;width: 56px;height: 56px;line-height: 56px;}
.online-service-22 .online-service-content{display:none;}
.online-service-22 .online-service-content{position: absolute;/*top: 0;*/top:initial;bottom:0;left: -176px;width: 166px;height: auto;border: 1px solid #efefef;background: #fff;}
.online-service-22.left .online-service-content{left: 60px;}
.online-service-22.right .online-service-content{left: -176px;}
.online-service-22 .online-service-accounts{display:none;}
.online-service-22 .online-service-accounts-title{height: 44px;line-height: 44px;text-indent: 44px;font-size: 14px;background: transparent url(../images/kefu2.png) 12px center no-repeat;}
.online-service-22 .online-service-accounts-item{height: 40px;line-height: 40px;padding: 0 14px;word-break: break-word;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.online-service-22 .online-service-accounts-item a{display: inline;height: 25px;line-height: 26px;font-size: 14px;text-decoration: initial;color: #333;cursor: pointer;}
.online-service-22 .online-service-accounts-item a img{margin-right: 10px;height: 14px;max-height: 14px;overflow: hidden;}
.online-service-22 .online-service-contacts{display:none;}
.online-service-22 .online-service-contacts-title{height: 44px;line-height: 44px;text-indent: 44px;font-size: 14px;background: transparent url(../images/lianxi.png) 12px center no-repeat;}
.online-service-22 .online-service-contacts-item{height: auto;line-height: 30px;color: #666;font-size: 14px;margin-left: 13px;margin-right: 13px;}
.online-service-22 .online-service-contacts-item-content{display: block;width: 100%;line-height: 24px;font-size: 14px;word-break: break-all;}
.online-service-22 .online-service-qrcode{display:none;}
.online-service-22 .online-service-qrcode-title{height: 42px;line-height: 42px;background: transparent url(../images/erweima.png) 16px center no-repeat;}
.online-service-22 .online-service-qrcode-title-text{margin-left: 45px;font-size:16px;}
.online-service-22 .online-service-qrcode-content{padding-bottom: 20px;}
.online-service-22 .online-service-qrcode-img{display: block;width: 128px;height: 128px;margin: 0 auto;}

.online-service-22.red .online-service-btn.online-service-btn1,
.online-service-22.red .online-service-btn.online-service-btn2,
.online-service-22.red .online-service-btn.online-service-btn3{background-color:#e60012;}
.online-service-22.green .online-service-btn.online-service-btn1,
.online-service-22.green .online-service-btn.online-service-btn2,
.online-service-22.green .online-service-btn.online-service-btn3{background-color:#a9e047;}
.online-service-22.blue .online-service-btn.online-service-btn1,
.online-service-22.blue .online-service-btn.online-service-btn2,
.online-service-22.blue .online-service-btn.online-service-btn3{background-color:#4BACE8;}
.online-service-22.yellow .online-service-btn.online-service-btn1,
.online-service-22.yellow .online-service-btn.online-service-btn2,
.online-service-22.yellow .online-service-btn.online-service-btn3{background-color:#ffb800;}
.online-service-22.black .online-service-btn.online-service-btn1,
.online-service-22.black .online-service-btn.online-service-btn2,
.online-service-22.black .online-service-btn.online-service-btn3{background-color:#010101;}


/*.online-service-23 */
.online-service-23 .online-service-btn{background-repeat: no-repeat;background-position: center 8px;font-size: 12px;padding: 0;width: 55px;height: 55px;line-height: 87px;}
.online-service-23 .online-service-btn1{background-image: url(../images/kefu3.png);}
.online-service-23 .online-service-btn2{background-image: url(../images/tel.png);}
.online-service-23 .online-service-btn3{background-image: url(../images/WeChat.png);}