/* QQ Service Online */
@import url(css/font-awesome.min.css);
.qos-wrap { position:absolute; z-index:9999; width:180px; height:335px; -webkit-box-shadow:0 5px 9px rgba(4,0,0,.17); box-shadow:0 5px 9px rgba(4,0,0,.17);}
.qos-wrap .qos-group { position:absolute; top:0; right:0;}
.qos-wrap .qos-group .qos-container { margin:0 auto; width:180px; border-radius:3px; background-color:#fff;}

.qos-group-header { clear:both; width:180px; height:130px; border-top-left-radius:3px; border-top-right-radius:3px; background:url(qq-service-header.png) no-repeat center top;}
.qos-group-header .qos-close { float:right; display:block; margin:10px 10px 0 0; width:16px; height:16px;background:url(qq-service-close.png) no-repeat center;  overflow:hidden; text-indent:-20000px;}

.qos-qlist-group { clear:both; }
.qos-qlist-group .qos-qlist { display:block; margin:0; padding:0; list-style:none; background-color:#fff;}
.qos-qlist-group .qos-qlist .qos-qlist-item { clear:both; display:block; margin-top:1px; height:50px;}
.qos-qlist-group .qos-qlist .qos-qlist-item:first-child { margin-top:0;}
.qos-qlist-group .qos-qlist .qos-qlist-item a { display:block; padding-left:0px; line-height:50px; background-color:#fafafa; text-align:center; font-size:16px; font-family:"Microsoft Yahei"; color:#484A4F; transition:all ease-out .3s;}
.qos-qlist-group .qos-qlist .qos-qlist-item a:hover { background-color:#484A4F; color:#fff; text-decoration:none;}
.qos-qlist-group .qos-qlist .qos-qlist-item .fa { margin-right:10px;}

.qos-phone { clear:both; height:90px; border-bottom-left-radius:3px; border-bottom-right-radius:3px; background-color:#fff;}
.qos-phone .qos-title { clear:both; padding:0px; line-height:40px; text-align:center; font-size:16px; font-family:"Microsoft Yahei";}
.qos-phone .qos-title .fa { margin-right:13px;}
.qos-phone .qos-content { line-height:40px; text-align:center; font-size:18px; color:#4DCDCD; font-family:Arial;}

.qos-share-group { clear:both; margin-top:3px; height:32px; border-radius:3px; background-color:#fff; -webkit-box-shadow:0 5px 9px rgba(4,0,0,.17); box-shadow:0 5px 9px rgba(4,0,0,.17);}
.qos-share-group .qos-share-btn,.qos-share-group .qos-totop-btn { position:relative; float:left; display:block; margin-right:1px; width:32px; line-height:32px; text-align:center; font-size:14px; color:#62BFE1; transition:all ease-out .3s;}
.qos-share-group .qos-share-btn:hover,.qos-share-group .qos-totop-btn:hover { background-color:#62BFE1; color:#fff; text-decoration:none;}
.qos-share-group .qos-totop-btn { float:right; margin-right:0; width:114px; font-family:"Microsoft Yahei";}
.qos-share-group .qos-totop-btn .fa { margin-left:10px;}

.qos-btn { display:none; float:left; width:32px; height:216px; border-radius:3px; background-color:#62BFE1; color:#fff;}
.qos-btn .qos-btn-item { position:relative; clear:both; display:block; height:32px; line-height:32px; text-align:center; color:#fff; cursor:pointer; transition:all ease-out .3s;}
.qos-btn .qos-btn-item:hover { background-color:#3bafda; color:#fff; text-decoration:none;}
.qos-btn .qos-btn-item:last-child { border-bottom-left-radius:3px; border-bottom-right-radius:3px;}

.qos-btn .qos-btn-item.qos-btn-text { height:120px; line-height:1.5; border-top-left-radius:3px; border-top-right-radius:3px;}
.qos-btn .qos-btn-item.qos-btn-text span { display:block; margin:0 auto; padding:10px 0; width:20px; text-align:center; word-wrap:break-word;}
.qos-btn .qos-btn-item.qos-btn-text span em { display:block; margin-bottom:10px; width:20px; height:20px; line-height:20px; border-radius:50%; background-color:#fff; font-style:normal; color:#62BFE1;}

.showHeight { height:216px !important;}

/*- Qcode Tips -*/
.qos-share-group .qos-share-btn:hover .qcode-tips { display:block; transition:all ease-in .3s;}
.qcode-tips { position:absolute; top:37px; left:50%; display:none; margin-left:-55px; padding:5px; width:110px; height:110px; border-radius:3px; background-color:#484A4F;}
.qcode-tips img { width:100px; height:100px;}
.qcode-tips .fa { position:absolute; top:-10px; left:50%; margin-left:-4px; color:#484A4F;}

.qos-btn .qos-btn-item:hover .qcode-tips { display:block; transition:all ease-in .3s;}
.qcode-tips.qos-btn-tips { top:50%; left:-115px; margin-top:-55px; margin-left:auto;}
.qcode-tips.qos-btn-tips .fa { top:50%; left:auto; right:-4px; margin-top:-7px; margin-left:auto;}