/* No:20170806023101 Mod:customer Name:多彩方客服  Autor:paul Copyright(C):maiyuncms.com Date:20170814 */
@charset "UTF-8";
.cus_wrapper{position:fixed;right:10px;bottom:75px;z-index:99999}
.cus_layer{position:relative;width:92px;height:92px;border-radius:0;margin-bottom:-1px;}
.cus_layer a{display:block;width:90px;height:90px;background:#fff;color:#999999;font-size:12px;text-align:center;border:1px solid #dddddd;transition:.5s;-webkit-transition:.5s;-moz-transition:.5s; z-index:99998}
.cus_layer a:hover{background-color:#3f7ea0;border:1px solid #3f7ea0; color:#FFFFFF; z-index:99999}
.cus_layer a span{background:url(../images/cus_kefu.png) no-repeat;padding-top:64px;display:inline-block;width:100%;overflow:hidden}
.cus_close{ display:none; position:absolute; left:-26px; overflow:hidden;}
.cus_wrapper:hover .cus_close{ display:block; }
.cus_close a{width:22px;height:22px; background:none; border-radius:50%;}
.cus_close a span{background:url(../images/cus_gb.png) no-repeat; padding-top:34px;}
.cus_close:hover.cus_close a{color:#fff; border-radius:50%;}
.cus_close:hover.cus_close a span{background:url(../images/cus_gb1.png) no-repeat;}
.cus_close a{ overflow:hidden; }
.cus_close:hover.cus_close a{ overflow:visible;}
.cus_qq_box a{}
.cus_qq_box a span{background:url(../images/cus_kf.png) no-repeat;background-position:center 12px;}
.cus_qq_box a:hover{color:#fff;}
.cus_qq_box:hover.cus_qq_box a span{background:url(../images/cus_kf1.png) no-repeat;background-position:center 12px;}
.cus_phone a{position:relative;right:0}
.cus_phone a span{background:url(../images/cus_dh.png) no-repeat;background-position:center 12px;}
.cus_phone a p{display:none;line-height:100px}
.cus_phone:hover.cus_phone a{width:214px;right:124px;overflow:hidden;}
.cus_phone:hover.cus_phone a span{display:none;background:url(../images/cus_dh1.png) no-repeat;background-position:center 12px;}
.cus_phone:hover.cus_phone a p{width:100%;height:100%;display:block;color:#fff;overflow:hidden;font-size:18px;line-height:100px;margin:0;padding:0}
.cus_wx a{}
.cus_wx a span{background:url(../images/cus_wx.png) no-repeat;background-position:center 12px;}
.cus_box{position:absolute;top:0;left:-156px;width:140px;height:140px;border:1px solid #62ad44;border-radius:7px;display:none;border-color:#3f7ea0;background-color:#3f7ea0}
.cus_box:after{content:"";position:absolute;top:18%;right:-8px;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:8px solid #3f7ea0}
.cus_box img{display:block;width:120px;height:120px;position:relative;top:10px;left:10px}
@keyframes i{0%{opacity:0;filter:alpha(opacity=0);-webkit-transform:translatex(-20px);-moz-transform:translatex(-20px);-ms-transform:translatex(-20px);-o-transform:translatex(-20px);-khtml-transform:translatex(-20px)}
100%{opacity:1;filter:alpha(opacity=100);-webkit-transform:translatex(0);-moz-transform:translatex(0);-ms-transform:translatex(0);-o-transform:translatex(0);-khtml-transform:translatex(0)}
}
@keyframes i{0%{opacity:0;filter:alpha(opacity=0);-webkit-transform:translatex(-20px);-moz-transform:translatex(-20px);-ms-transform:translatex(-20px);-o-transform:translatex(-20px);-khtml-transform:translatex(-20px)}
100%{opacity:1;filter:alpha(opacity=100);-webkit-transform:translatex(0);-moz-transform:translatex(0);-ms-transform:translatex(0);-o-transform:translatex(0);-khtml-transform:translatex(0)}
}
@-webkit-keyframes i{0%{opacity:0;filter:alpha(opacity=0);-webkit-transform:translatex(-20px);-moz-transform:translatex(-20px);-ms-transform:translatex(-20px);-o-transform:translatex(-20px);-khtml-transform:translatex(-20px)}
100%{opacity:1;filter:alpha(opacity=100);-webkit-transform:translatex(0);-moz-transform:translatex(0);-ms-transform:translatex(0);-o-transform:translatex(0);-khtml-transform:translatex(0)}
}
@-moz-keyframes i{0%{opacity:0;filter:alpha(opacity=0);-webkit-transform:translatex(-20px);-moz-transform:translatex(-20px);-ms-transform:translatex(-20px);-o-transform:translatex(-20px);-khtml-transform:translatex(-20px)}
100%{opacity:1;filter:alpha(opacity=100);-webkit-transform:translatex(0);-moz-transform:translatex(0);-ms-transform:translatex(0);-o-transform:translatex(0);-khtml-transform:translatex(0)}
}
@-o-keyframes i{0%{opacity:0;filter:alpha(opacity=0);-webkit-transform:translatex(-20px);-moz-transform:translatex(-20px);-ms-transform:translatex(-20px);-o-transform:translatex(-20px);-khtml-transform:translatex(-20px)}
100%{opacity:1;filter:alpha(opacity=100);-webkit-transform:translatex(0);-moz-transform:translatex(0);-ms-transform:translatex(0);-o-transform:translatex(0);-khtml-transform:translatex(0)}
}
.cus_wx:hover.cus_wx a{color:#fff;}
.cus_wx_box{}
.cus_wx:hover.cus_wx a span{background:url(../images/cus_wx1.png) no-repeat;background-position:center 12px;}
.cus_wx:hover .cus_wx_box{display:block;animation:i .3s linear;-webkit-animation:i .3s linear;-moz-animation:i .3s linear;-o-animation:i .3s linear}
.cus_wy a{}
.cus_wy a span{background:url(../images/cus_ewm.png) no-repeat;background-position:center 12px;}
.cus_wy_box{}
.cus_wy_box:after{}
.cus_wy:hover.cus_wy a{color:#fff;}
.cus_wy:hover.cus_wy a span{background:url(../images/cus_ewm1.png) no-repeat;background-position:center 12px;}
.cus_wy:hover .cus_wy_box{display:block;animation:i .3s linear;-webkit-animation:i .3s linear;-moz-animation:i .3s linear;-o-animation:i .3s linear}
.cus_top{display:none}
.cus_top a{}
.cus_top a span{background:url(../images/cus_top.png) no-repeat;background-position:center 12px;}
.cus_top:hover.cus_top a{}
.cus_top:hover.cus_top a span{background:url(../images/cus_top1.png) no-repeat;background-position:center 12px;}
.cus_open{position:fixed;top:50%;margin-top:-11px;right:10px;display:none;z-index:9999999999}
.cus_open{width:22px;height:22px;}
.cus_open a{width:22px;height:22px; background:none; border-radius:50%; overflow:hidden; }
.cus_open a span{background:url(../images/cus_kq.png) no-repeat; padding-top:34px;}
.cus_open:hover.cus_open a{color:#fff;background:#3f7ea0; overflow:visible;}
.cus_open:hover.cus_open a span{background:url(../images/cus_kq1.png) no-repeat;}
@media all and (max-width:749px){.cus_open{display:block;right:5px;width:30px;height:30px;cursor:pointer}
.cus_open{background:url(../images/cus_kefu.png) no-repeat -63px -360px}
.cus_open:hover{transform:rotate(-360deg)}
.cus_open a{display:none}
.cus_wrapper{display:none}
#jsx_customer{ display:none;}
}
