@font-face {
    font-family: hgx-supportBtn;
    src: url(hgx-supportBtn.ttf);
    font-weight: 400;
    font-style: normal
}
.hgx-SupportBox-right-bottom {
    position: relative;z-index: 999
}
.hgx-SupportBox-right-bottom * {
    margin: 0;
    padding: 0;
    box-sizing: content-box
}
.hgx-SupportBox-right-bottom .hgx-support-btn-style{
    right: 50px;
    bottom: 50px
}
.hgx-SupportBox-right-bottom .hgx-support-panel{
    right: 50px;
    bottom: 10px
}

/*影子*/
.hgx-support-btn-style, .hgx-support-panel{
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, .2), 0 6px 20px 0 rgba(0, 0, 0, .19)
}
.hgx-support-btn:hover {
    box-shadow: 0 12px 15px 0 rgba(0, 0, 0, .24), 0 17px 50px 0 rgba(0, 0, 0, .19)
}

.hgx-support-panel {
    position: fixed;
    height: 540px;
    width: 360px;
    background: #f9f9f9;
    overflow: hidden;
    z-index: 2;
    border-radius: 2px;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}
.hgx-support-panel_close{
    position: absolute;
    text-indent: -9999px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNyIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTcgOSI+PHBhdGggZmlsbD0iI0ZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMCAuNDVDMCAuMzM1LjA0Ni4yMi4xMzMuMTMyYy4xNzQtLjE3Ni40NTgtLjE3Ni42MzIgMEw4LjUgNy45MTJsNy43MzctNy43OGMuMTc0LS4xNzYuNDU4LS4xNzYuNjMyIDAgLjE3My4xNzUuMTczLjQ2IDAgLjYzNmwtOC4wNTUgOC4xYy0uMTc0LjE3Ni0uNDU4LjE3Ni0uNjMyIDBMLjEzLjc2OEMuMDQ0LjY4IDAgLjU2NSAwIC40NDhWLjQ1eiIvPjwvc3ZnPg==) no-repeat 50%;
    opacity: 0.6;
    height: 30px;
    width: 30px;
    right: 10px;
    top: 3px;
    overflow: visible
    cursor: pointer;
}

.hgx-support-panel_close:hover {
    opacity: 1
}
.hgx-support-header {
    position: relative;
    z-index: 2;
    max-height: 360px;
    background: #00A4E6;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.hgx-support-header img {

    /*display: inline-block;*/
    margin: 10px 5px 8px 15px;
	float:left;
    border-radius: 100%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    height: 40px;
    width: 40px;
}

.hgx-support-header h2 {
    line-height: 1;
    margin: 0;
    padding-top:10px;
    margin-bottom: 10px;
    font-size: 14px;
	color:#fff;
}

.hgx-support-header p {
    font-size: 10px;
	color:#fff;
}

.hgx-support-btn{
	color:#ffffff; 
	background:#4677C1;
    position: fixed;
    cursor: pointer;
    overflow: hidden;/*visible*/
    z-index: 10;
    -webkit-font-smoothing: antialiased
}

.hgx-support-btn:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.hgx-support-btn-style {
    width: 56px;
    line-height: 54px;
    text-align: center;
    background: #5d94f3;
    border-radius: 100%;
    color: #fff;
    border: 1px solid rgba(0, 0, 0, .05);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}

.hgx-support-btn-style:before {
    font-family: hgx-supportBtn !important;
    font-size: 24px;
    display: inline-block;
    vertical-align: middle;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .15)
}
.hgx-support-btn-style span {
    display: none
}

.hgx-support-btn-icon:before {
    content: "\e60b"
}
/* ---------------------------------- end: hgx-sbox-popup -----------------------------   */
.hgx-support-body{background: #fff;margin: 0 15px 15px 15px}
.hgx-support-body_head{border-bottom:1px solid #e5e5e5;padding:10px}
.hgx-support-body_head h3, .hgx-support-body_head p{font-size:14px;font-weight:lighter;color:#666}
.hgx-support-body_card{padding:10px;}
.form_item_title{margin-left:5px}
.form_item_title label{font-size:14px;font-weight:lighter;color:#303030}
.form_item_title span{font-size:14px;color:red}
.form_item{margin-bottom:15px}
.form_item input, .form_item textarea{width:280px;height:28px;border:1px solid #d3d3d3;margin-left:2px}
.hgx-support-body_card-form textarea{width:270px;height:58px;font-size:16px;padding:5px}
.form_verify{margin:20px 0}
.form_body{height:270px;overflow-y:auto;}

.hgx-support-body_card .tncode, .hgx-support-body_card .fromSubmit{
    text-align:center;
    width: 280px;
    height: 38px;
    line-height: 38px;
}
.hgx-support-body_card .fromSubmit{
    width: 150px;
}
.hgx-support-body_card .form_submit{
    text-align:center;
}
.hgx-upfile-input{width:220px;height:28px;padding-left:4px;background:white url(input-background.jpg) no-repeat;line-height:28px;font-size:15px;border-top:1px solid #b1b1b1;border-left:1px solid #b1b1b1;border-bottom:1px solid #dadada;border-right:1px solid #dadada}
.reset{cursor:pointer;margin-left:5px;padding:2px 5px;background-color:#ffcccc;border:1px solid #666666}
.box-upfile{margin-bottom:10px}
#hgx-loading{text-align:center;margin-top:100px}

@media(max-width:500px){
    .hgx-SupportBox-right-bottom .hgx-support-panel{ right: 10px; }
}
@media(max-width:400px){
	.hgx-support-panel { width: 94%;}/* width: 360px; */
    .hgx-SupportBox-right-bottom .hgx-support-panel{ left: 3%; right: initial; } /*10px*/
	.form_item input, .form_item textarea, #hgx-tncode{width: 96%;}
	.hgx-support-body_card-form textarea{width: 92%;}
}