* {
    font-family: "Microsoft YaHei UI", "Microsoft YaHei", "5FAE8F6F96C59ED1", SimSun, "5B8B4F53", sans-serif;
    box-sizing: border-box;
}

body,
html {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
}

a {
    cursor: pointer;
    text-decoration: none;
}

@font-face {
font-family: "iconfont";
src: url('iconfont.eot?t=1535350313257');
/* IE9*/
src: url('iconfont.eot?t=1535350313257#iefix') format('embedded-opentype'),
/* IE6-IE8 */
url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff'),
url('iconfont.ttf?t=1535350313257') format('truetype'),
/* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
url('iconfont.svg?t=1535350313257#iconfont') format('svg');
/* iOS 4.1- */
}

.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.icon-dh:before {
content: "e751";
}

.icon-qq2:before {
content: "e752";
}

.icon-kefu:before {
content: "e753";
}

.icon-zhuyi:before {
content: "e715";
}


h1,h2,h3,h4,h5,h6,p {
padding: 0;
margin: 0;
}

.chatonline-header {
width: 100%;
height: 80px;
background-color: #f8f8f8;
overflow: hidden;
}

.chatonline-bottom {
width: 100%;
height: 1px;
background-color: #eee;
}

.chatonline-header-inner {
width: 300px;
margin: 22px auto;
}

.chatonline-header-inner img {
float: left;
margin-right: 20px;
}

.chat-line {
height: 29px;
width: 1px;
background-color: #BFBFBF;
float: left;
margin-right: 20px;
margin-top: 5px;
}
.chatonline-header-inner p {
font-size: 24px;
color: #666;
float: left;
letter-spacing: 1px;
line-height: 38px;
}

.chatonline-notice {
width: 360px;
margin: 47px auto 18px;
padding-bottom: 5px;
border-top: 1px solid #DCDCDC;
/* height: 35px; */
line-height: 35px;
}
.chatonline-notice img {
width: 26px;
height: 26px;
display: block;
float: left;
margin-right: 6px;
margin-top: 5px;
}

.chatonline-notice p {
font-size: 16px;
color: #666;
}

.chatonline-notice p a {
color: #5185ff;
}

.chatonline-adviser {
width: 560px;
font-size: 18px;
color: #666;
font-weight: bold;
margin-left: calc(50% - 280px);
margin-top: 48px;
text-align: center;
}

.chatonline-adviser img {
width: 20px;
height: 20px;
position: relative;
top: 3px;
}

.chatonline-adviser a {
color: #5185ff;
font-weight: 400;
}

.chatonline-contact {
width: 190px;
margin: 10px auto 10px;
height: 30px;
line-height: 30px;
text-align: center;
}

.chatonline-contact img {
width: 24px;
height: 24px;
margin-right: 5px;
position: relative;
top: 5px;
}

.chatonline-contact span {
font-size: 16px;
color: #999;
line-height: 24px;
}

.chatonline-qr-code {
width: 150px;
height: 150px;
display: block;
margin: 0 auto;
background-color: #f8f8f8;
border: 1px solid #dcdcdc;
}

.chatonline-scan {
width: 150px;
text-align: center;
font-size: 12px;
color: #999;
margin: 16px auto 56px;
}

.chatonline-click-communicate {
/* display: block; */
width: 170px;
color: #fff;
background-color: #5185ff;
height: 47px;
line-height: 47px;
font-size: 18px;
letter-spacing: 1px;
border-radius: 3px;
margin: 0 auto;
text-align: center;
}

.chatonline-follow {
width: 320px;
margin-left: calc(50% - 160px);
display: inline-block;
}

.scan_code {
width: 108px;
}

.scan_code {
margin-right: 74px;
}

.ercode_left img {
width: 128px;
height: 128px;
/*border: 1px solid #dcdcdc;*/
}

.ercode_left {
width: 120px;
float: left;
}

.ercode_left p {
text-align: center;
margin-top: 15px;
color: #666;
font-size: 12px;
padding-bottom: 30px;
}

.chatonline-customer-service {
display: inline-block;
width: 230px;
text-align: center;
margin-left: calc(50% - 115px);
margin-bottom: 48px
}

.chatonline-customer-service img {
width: 24px;
height: 24px;
margin-right: 10px;
color: #999;
display: block;
float: left;
position: relative;
top: 50%;
}

.chatonline-customer-service span {
font-size: 16px;
color: #666;
float: left;
}

.chatonline-footer {
width: 100%;
height: 28px;
background-color: #f8f8f8;
border-top: 1px solid #e0e0e0;
position: fixed;
left: 0;
bottom: 0;
}
@media(min-width:800px) {
    #page{
        width: auto;
        height: auto;
    }
    .chatonline-header {
    width: 100%;
    height: 80px;
    background-color: #f8f8f8;
    overflow: hidden;
    }
    
    .chatonline-bottom {
    width: 100%;
    height: 1px;
    background-color: #eee;
    }
    
    .chatonline-header-inner {
    width: 300px;
    margin: 22px auto;
    }
    
    .chatonline-header-inner img {
    float: left;
    margin-right: 20px;
    }
    
    .chat-line {
    height: 29px;
    width: 1px;
    background-color: #BFBFBF;
    float: left;
    margin-right: 20px;
    margin-top: 5px;
    }
    .chatonline-header-inner p {
    font-size: 24px;
    color: #666;
    float: left;
    letter-spacing: 1px;
    line-height: 38px;
    }
    
    .chatonline-notice {
    width: 360px;
    margin: 47px auto 18px;
    padding-bottom: 5px;
    border-top: 1px solid #DCDCDC;
    /* height: 35px; */
    line-height: 35px;
    }
    .chatonline-notice img {
    width: 26px;
    height: 26px;
    display: block;
    float: left;
    margin-right: 6px;
    margin-top: 5px;
    }
    
    .chatonline-notice p {
    font-size: 16px;
    color: #666;
    }
    
    .chatonline-notice p a {
    color: #5185ff;
    }
    
    .chatonline-adviser {
    width: 560px;
    font-size: 18px;
    color: #666;
    font-weight: bold;
    margin-left: calc(50% - 280px);
    margin-top: 48px;
    text-align: center;
    }
    
    .chatonline-adviser img {
    width: 20px;
    height: 20px;
    position: relative;
    top: 3px;
    }
    
    .chatonline-adviser a {
    color: #5185ff;
    font-weight: 400;
    }
    
    .chatonline-contact {
    width: 190px;
    margin: 10px auto 10px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    }
    
    .chatonline-contact img {
    width: 24px;
    height: 24px;
    margin-right: 5px;
    position: relative;
    top: 5px;
    }
    
    .chatonline-contact span {
    font-size: 16px;
    color: #999;
    line-height: 24px;
    }
    
    .chatonline-qr-code {
    width: 150px;
    height: 150px;
    display: block;
    margin: 0 auto;
    background-color: #f8f8f8;
    border: 1px solid #dcdcdc;
    }
    
    .chatonline-scan {
    width: 150px;
    text-align: center;
    font-size: 12px;
    color: #999;
    margin: 16px auto 56px;
    }
    
    .chatonline-click-communicate {
    /* display: block; */
    width: 170px;
    color: #fff;
    background-color: #5185ff;
    height: 47px;
    line-height: 47px;
    font-size: 18px;
    letter-spacing: 1px;
    border-radius: 3px;
    margin: 0 auto;
    text-align: center;
    }
    
    .chatonline-follow {
    width: 320px;
    margin-left: calc(50% - 160px);
    display: inline-block;
    }
    
    .scan_code {
    width: 108px;
    }
    
    .scan_code {
    margin-right: 74px;
    }
    
    .ercode_left img {
    width: 128px;
    height: 128px;
    /*border: 1px solid #dcdcdc;*/
    }
    
    .ercode_left {
    width: 120px;
    float: left;
    }
    
    .ercode_left p {
    text-align: center;
    margin-top: 15px;
    color: #666;
    font-size: 12px;
    padding-bottom: 30px;
    }
    
    .chatonline-customer-service {
    display: inline-block;
    width: 230px;
    text-align: center;
    margin-left: calc(50% - 115px);
    margin-bottom: 48px
    }
    
    .chatonline-customer-service img {
    width: 24px;
    height: 24px;
    margin-right: 10px;
    color: #999;
    display: block;
    float: left;
    position: relative;
    top: 50%;
    }
    
    .chatonline-customer-service span {
    font-size: 16px;
    color: #666;
    float: left;
    }
    
    .chatonline-footer {
    width: 100%;
    height: 28px;
    background-color: #f8f8f8;
    border-top: 1px solid #e0e0e0;
    position: fixed;
    left: 0;
    bottom: 0;
    }
}
/* 响应式图片 */
.responsive-img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* 头部样式 */
.chatonline-header {
    width: 100%;
    height: auto;
    padding: 15px 0;
    background-color: #f8f8f8;
    overflow: hidden;
}

.chatonline-bottom {
    width: 100%;
    height: 1px;
    background-color: #eee;
}

.chatonline-header-inner {
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-img {
    width: 100%;
    max-width: 150px;
    height: auto;
    margin-right: 20px;
}

.chat-line {
    height: 29px;
    width: 1px;
    background-color: #BFBFBF;
    margin-right: 20px;
}

.chatonline-header-inner p {
    font-size: 24px;
    color: #666;
    letter-spacing: 1px;
    line-height: 38px;
}

/* 主要内容 */
.mid_img {
    margin: 10px auto;
    text-align: center;
    width: 100%;
    max-width: 380px;
}

.chatonline-adviser {
    width: 100%;
    font-size: 18px;
    color: #666;
    font-weight: bold;
    margin: 20px auto 0;
    text-align: center;
}

.chatonline-contact {
    width: 100%;
    max-width: 190px;
    margin: 10px auto;
    height: 30px;
    line-height: 30px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chatonline-contact img {
    width: 24px;
    height: 24px;
    margin-right: 5px;
}

.chatonline-contact span {
    font-size: 16px;
    color: #999;
    line-height: 24px;
}

.chatonline-qr-code {
    width: 150px;
    height: 150px;
    display: block;
    margin: 0 auto;
    background-color: #f8f8f8;
    border: 1px solid #dcdcdc;
}

.chatonline-scan {
    width: 100%;
    max-width: 150px;
    text-align: center;
    font-size: 12px;
    color: #999;
    margin: 16px auto;
}

/* 按钮区域 */
.button-container {
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
    text-align: center;
}

.chatonline-click-communicate {
    display: inline-block;
    width: 45%;
    max-width: 170px;
    color: #fff;
    background-color: #5185ff;
    height: 47px;
    line-height: 47px;
    font-size: 16px;
    letter-spacing: 1px;
    border-radius: 3px;
    margin: 5px;
    text-align: center;
}

.wechat-btn {
    background-color: #bf1a21;
}

.chatonline-notice {
    width: 100%;
    margin: 20px auto;
    padding: 10px 10px 10px 10px;
    border-top: 1px solid #DCDCDC;
    line-height: 1.5;
    display: flex;
    align-items: center;
}

.chatonline-notice img {
    width: 26px;
    height: 26px;
    margin-right: 6px;
}

.chatonline-notice p {
    font-size: 14px;
    text-align: left;
    color: #666;
    margin: 0;
}

.chatonline-notice p a {
    color: #5185ff;
}

/* 媒体查询 */
@media (max-width: 600px) {
    .chatonline-header-inner p {
        font-size: 20px;
    }
    
    .chatonline-adviser {
        font-size: 16px;
    }
    
    .chatonline-click-communicate {
        width: 90%;
        max-width: none;
        font-size: 14px;
    }
    
    .chatonline-notice {
        flex-direction: column;
        text-align: center;
    }
    
    .chatonline-notice img {
        margin-bottom: 10px;
    }
}

@media (max-width: 400px) {
    .chatonline-header-inner {
        flex-direction: column;
        text-align: center;
    }
    
    .chat-line {
        display: none;
    }
    
    .logo-img {
        margin-right: 0;
        margin-bottom: 10px;
    }
    
    .chatonline-click-communicate {
        width: 90%;
        margin: 5px auto;
    }
}