ul{list-style:none;padding:0}
ol{padding:0}
*{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}
a:hover,a:link,a:visited,a:active{text-decoration:none}
img{vertical-align:middle}
img{border:0}
.h1,.h2,.h3,h1,h2,h3{margin:0}
.clear{clear:both}

/* 企业宣传片 */
.fix-qq>ul .xuanchuan-wrap{border: none;background-color: transparent;background-image: url(./images/xuanchuan-bg.png);background-repeat: no-repeat;background-size: 100%;line-height: 50px;}
.fix-qq>ul .xuanchuan-wrap a{border: none;line-height: 1;height: 50px;display: inline-block;vertical-align: middle;letter-spacing: -1px;background-color: transparent;}
.fix-qq>ul>li.on, .fix-qq>ul>.xuanchuan-wrap:hover {background-color: transparent;}
.fix-qq>ul>li.on, .fix-qq>ul>.xuanchuan-wrap:hover a {background-color: transparent;}

.fix-qq{position:fixed;right:10px;top: 40%;z-index: 9999;}
.fix-qq>ul>li{text-align:center;margin:2px auto;position:relative}
.fix-qq>ul>li>a{display:block;width:48px;height:50px;border:1px solid #6087ff;border-radius:2px;background-color:#fafafa;font-size:12px;color:#04304c}
.qq-icon{display:block;width:24px;height:24px;background-image:url(./images/qq-icon.png);margin:4px auto 2px}
.qq-icon02{background-position:-24px 0}
.qq-icon03{background-position:-48px 0}
.qq-icon04{background-position:-72px 0}
.qq-icon05{display:inline-block;width:20px;height:20px;background-image:url(./images/qq-icon.png);background-position:-4px -51px;vertical-align:middle}
.qq-icon06{display:inline-block;width: 24px;height:20px;background-image:url(./images/qq-icon.png);background-position: -26px -51px;vertical-align:middle;}
.qq-bubble{position:absolute;right: 50px;top:50%;margin-top:-58px;text-align:left;display: none;padding-right: 20px;}
.qq-bubble-item{padding:15px 30px;box-shadow:0 3px 10px rgba(178,178,178,.13);background-color:#fff;border-radius:5px;white-space:nowrap}
.qq-bubble-item p{font-size:14px;color:#4b8af4;margin:10px 0;white-space:nowrap}
.qq-bubble-item:after{content:'';position:absolute;right: 0;top:50%;margin-top: -10px;display:block;width:0;height:0;border-width:10px;border-style:solid;border-color:transparent transparent transparent #fff;}
.qq-bubble-item h3{white-space:nowrap;color:#04304c;font-size:14px;font-weight:normal}
.qq-bubble-item p{font-size:14px;color:#4b8af4;margin:10px 0;white-space:nowrap}
.qq-bubble-item .btn{display:inline-block;line-height:30px;padding:0 12px;background-color:#4b8af4;color:#fff;border-radius:20px;font-size:12px}
.fix-qq>ul>li:hover>a,.fix-qq>ul>li.pop>a{background-color:#6087ff;color:#fff}
.fix-qq>ul>li:hover .qq-icon01,.fix-qq>ul>li.pop .qq-icon01{background-position:0 -24px}
.fix-qq>ul>li:hover .qq-icon02{background-position:-24px -24px}
.fix-qq>ul>li:hover .qq-icon03{background-position:-48px -24px}
.fix-qq>ul>li:hover .qq-icon04{background-position:-72px -24px}
.fix-qq>ul>li:hover .qq-bubble,.fix-qq>ul>li.pop .qq-bubble{display:block}
.fix-qq>ul>li .qq-bubble .bubble{margin-top: -200px}

.fix-qq-mobile{display: none;position: fixed;right: -198px;bottom: 150px;z-index: 15;background-color: #4b89f3;padding:10px;border-top-left-radius: 40px;border-bottom-left-radius: 40px;}
.fix-qq-mobile ul{margin: 0}
.fix-qq-mobile li{display: inline-block;margin:0 2px}
.fix-qq-mobile li .btn{border:1px solid #fff;padding:5px 15px;border-radius: 50px;color:#fff;display:initial}
.qq-icon-mobile{display:inline-block;width:24px;height:24px;background-size: 100%;vertical-align: middle}
.qq-icon-mobile01{background-image:url(./images/qq-mobile-01.png);}
.qq-icon-mobile02{background-image:url(./images/qq-mobile-02.png);}
.qq-icon-mobile03{background-image:url(./images/qq-mobile-03.png);}

.fix-qq-mobile .btn:active{background-color:#fff;color:#6087ff}
.fix-qq-mobile .btn:active .qq-icon-mobile02{background-image:url(./images/qq-mobile-02-1.png);}
.fix-qq-mobile .btn:active .qq-icon-mobile03{background-image:url(./images/qq-mobile-03-1.png);}

/* 预约弹窗 */
#fix-appoint{height: 210px;background-color: rgba(24,37,60,0.9);position: fixed;bottom: 0;left: 0;width: 100%;z-index: 99999;padding: 25px 0;box-sizing: border-box;}
#fix-appoint .close{color: #fff;font-size: 28px;float: right;margin: -15px 20px 0 0;position: relative;z-index: 99}
#fix-appoint h3{font-weight: bold;color:#fff;text-align: center;font-size: 18px;line-height: 30px;}
#fix-appoint p{color:#fff;font-size: 15px;margin: 20px 0;font-weight: bold}
#fix-appoint .wrapper{width: 1160px}
#fix-appoint ul{width: 100%}
#fix-appoint li{float:left;color:#fff;width: calc(20% - 10px);margin-left: 10px;font-size: 12px;line-height: 30px;}
#fix-appoint li input{width: 100%;height: 40px;border:0;padding:0 10px;box-sizing: border-box;color: #04304b;}
#fix-appoint li:first-child{margin-left: 0}
#fix-appoint .appoint-btn{display: block;width: 100%;line-height: 40px;text-align: center;background-color: #4b89f3;color:#fff;}

#fix-appoint .tips{position: fixed;bottom: 120px;left: 50%;-webkit-transform: translate(-50%, 0);-moz-transform: translate(-50%, 0);-ms-transform: translate(-50%, 0);-o-transform: translate(-50%, 0);transform: translate(-50%, 0);background-color: #fff;line-height: 30px;padding: 20px 50px;border-radius: 4px;z-index: 99999999999;font-size: 16px;}
#fix-appoint .mask{z-index: 99;height: 300px;bottom: 0;top: auto;display: block;}

/*客服弹窗*/
.kf-wrapper{width:684px;background-color: #fff;box-shadow: 0 0 15px rgba(0,0,0,0.15)}
.kf-wrapper .online,.kf-wrapper .offline{display:inline-block;width: 20px;height: 20px;background-size: 100% 100%;vertical-align: middle;z-index: 2;position: relative}
.kf-wrapper .online{background-image: url(images/qq-online.png);}
.kf-wrapper .offline{background-image: url(images/qq-offline.png);}
.kf-wrapper .offline-item span{color: #b4b9c1}

.kf-header{background-image: url(images/customer_service_title_bg.png);background-repeat: no-repeat;padding:25px 40px}
.kf-header *{color: #fff}
.kf-header > *{display: inline-block;}
.kf-header h1{font-size: 22px;font-weight: normal;margin-right: 15px;line-height: 45px}
.kf-container{position: relative;padding:20px 40px 30px}
.mask{background-color: rgba(0,0,0,0.6);position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 99999;}
.kf-wrapper{color:#fff;}
.kf-close{position: absolute;right: 15px;top: 15px;display: none}
.kf-close i{font-size: 22px;color: #fff}

.kf-title{font-weight: bold;font-size: 14px;color: #2a2a36;margin:18px 0 0;text-align: left;line-height: 25px;}
.kf-title:first-child{margin-top: 0}
.kf-list li{margin:4px 0;float: left;height: 30px;box-sizing: border-box;position: relative}
.kf-list li a{display: block;line-height: 30px;}
.kf-list li span{display: inline-block;line-height: 20px;margin-left: 5px;color:#5f6069;font-size: 14px}
.kf-list li:hover a span{color:#0096ff}
.kf-sq{width: 435px;position: relative}
.kf-sq:after{content:'';display: block;width: 1px;height: 80%;position: absolute;right: 22px;top: 10%;background-color: #eee}
.kf-sq li{width: 33.33333%;text-align: left;position: relative}
.kf-sq li span{position: relative;z-index: 2}
.kf-sq li:hover:before{content:'';position: absolute;left: -8px;top: 0;height: 100%;width: 100px;background-color: #edeef2;}
.kf-other{width: 158px;}
.kf-help{margin-top: 10px;}
.kf-help li{float: left;width: 194px;margin-right: 10px;}
.kf-help li:last-child{margin-right: 0}
.kf-help li a{display: block;color:#fff;line-height: 42px;background: -webkit-linear-gradient(to left, #25a5ff,#0096ff);background: -o-linear-gradient(to left, #25a5ff,#0096ff);background: -moz-linear-gradient(to left, #25a5ff,#0096ff);background: linear-gradient(to left, #25a5ff,#0096ff);filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#25a5ff,endcolorstr=#0096ff,gradientType=1);text-align: center}
.kf-help li img{display: block;}
.kf-help li i{font-size: 26px;vertical-align: top}

.kf-phone{font-size: 16px;color: #1a80ff;line-height: 1.6em}

.kf-wx{background-color: #edeef2;position: absolute;left: -8px;top: 100%;z-index: 9;padding: 10px;visibility: hidden;white-space: nowrap}
.kf-wx>*{display:inline-block;vertical-align:top}
.kf-wx-qrcode{width: 92px;margin-right: 6px;}
.kf-wx-qrcode img{display:block;width: 92px;height: 92px;transition: transform .3s}
/*.kf-wx-qrcode:hover img{transform: scale(1.6)}*/
.kf-wx-info>*{white-space: nowrap;font-size: 14px}
.kf-wx-info>b{display:block;line-height: 26px;color: #333}
.kf-wx-info>p{line-height: 20px;color: #666}

.kf-list li:hover .qq{background-color: #f2f2f2;}
.kf-list li:hover .kf-wx{visibility: visible}
.kf-sq li:nth-child(3n) .kf-wx{left: auto;right: 53px}
.kf-sq li:nth-last-child(1) .kf-wx,.kf-sq li:nth-last-child(2) .kf-wx,.kf-sq li:nth-last-child(3) .kf-wx,.kf-sq li:nth-last-child(4) .kf-wx,.kf-sq li:nth-last-child(5) .kf-wx,.kf-sq li:nth-last-child(6) .kf-wx,.kf-sq li:nth-last-child(7) .kf-wx,.kf-sq li:nth-last-child(8) .kf-wx,.kf-sq li:nth-last-child(9) .kf-wx,.kf-sq li:nth-last-child(10) .kf-wx{top: auto;bottom: 100%}

.pop .bubble{position: fixed;top: 50%;left: 50%;margin: -237px 0 0 -342px}
.pop .kf-close{display: block}

/* 手机端适配 */
@media screen and (max-width: 768px) {
    /*.fix-qq{display: none}*/
    .fix-qq>ul>li>a{display: none !important;}
    .fix-qq>ul>li .qq-bubble{display: none !important;}
    .fix-qq>ul>li.pop .qq-bubble{display: block !important;}
    .fix-qq-mobile{display: block}
    .fix-qq>ul>li .qq-bubble .bubble{margin-top: 20%}

    #fix-appoint{height: auto;padding: 65px 0 25px;}
    #fix-appoint .close{margin-top: -52px;}
    #fix-appoint li{width: calc(50% - 5px);margin-top: 10px}
    #fix-appoint li:nth-child(2n-1){margin-left: 0}
    #fix-appoint li:last-child{width: 100%}
    #fix-appoint p{margin: 20px 0;}


    .pop .bubble{width: 80%;max-height: 80%;margin: 10% 0 0 10%;top: 0;left: 0;}
    .kf-wrapper{width: 100%;}
    .kf-sq,.kf-other{width: 100%}
    .kf-sq{margin-bottom: 20px}
    .kf-sq:after{display: none}
    .kf-sq li:nth-child(3n-1){text-align: center}
    .kf-sq li:nth-child(3n){text-align: right}
    .kf-container{height: calc(80vh - 95px);overflow-y:auto}

    .kf-sq li:hover:before{display: none}
    .kf-wx{display: none}
}

@media screen and (max-width: 640px) {
    .qq_mask{display: block}
	.stop-scroll{width: 100%;height: 100% ;overflow: hidden;position: fixed}

    .pop .bubble{width: 90%;max-height: 60%;margin: 20% 0 0 5%;}
    .kf-container{padding-left: 20px;padding-right: 20px;height: calc(60vh - 95px)}

    .kf-sq li span{font-size: 12px;margin-left: 0}
}

@media screen and (max-width: 480px){
    .kf-header{padding: 15px 30px}
}

@media screen and (max-height: 800px) {
    .fix-qq{top:35%}
}

