/*viewport*/
#viewport {
    background: #f1f1f1 !important;
    position: relative;
    height: 76px !important;
    width: 100% !important;
    padding: 10px;
    box-sizing: border-box;
}


div.nav_top {
    display: flex;
    width: 100%;
    height: 64px !important;
    position: relative;
}

/*״̬div*/
div.nav_top div#statusbar {
    margin: 0px;
    width: auto;
    height: 64px;
    line-height: 64px;
    vertical-align: middle;
    font-size: 14px;
}

/*СԲ  */
div.nav_top div#statusbar span {
    position: absolute;
    top: 28px;
    left: 0px;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #00BA13;
}

/*ʱ  */
#infotimer {
    margin-left: 16px;
}

/*״̬*/
#infotip {
    margin-left: 10px;
}

#keytable_box {
    position: absolute;
    top: 60px
}

/*   밴  div*/
div.infodialplate {
    position: relative;
    display: flex !important;
    flex-direction: row;
    align-items: center;
    width: 260px !important;
    height: 48px !important;
    border-radius: 5px;
    margin-top: 8px;
    margin-left: 16px;
    margin-right: 28px;
    box-sizing: border-box;
    background: #F5F5F5 !important;
}

div.infodialplate>div {
    width: 160px !important;
    height: 22px;
    box-sizing: border-box;
    margin: 13px 0px 13px 10px;
    padding: 0px !important;
}

/*     */
div.infodialplate .keyboard {
    font-size: 14px;
    width: 160px !important;
    height: 22px;
    line-height: 22px;
    box-sizing: border-box;
    padding: 0px 0px 0px 3px !important;
}

div.infodialplate .keyboard:focus {
    border: 1px solid #106DFA;
    outline: 1px solid #106DFA;
    border-radius: 0px;
}

/*   ̰      û     */
div.infodialplate .keyboard_btn,
div.infodialplate .user_btn {
    display: inline-block;
    width: 36px;
    height: 36px;
    padding: 4px 10px;
    box-sizing: border-box;
    background: url("../images/keyboard.svg") center center no-repeat #F5F5F5 !important;

}

/* û     */
div.infodialplate .user_btn {
    background: url("../images/user_active.svg") center center no-repeat #F5F5F5 !important;
}

div.infodialplate .user_btn.disabled {
    background: url("../images/user_no.svg") center center no-repeat #F5F5F5 !important;
}

/*    */
div.infodialplate>span {
    width: 1.5px;
    box-sizing: border-box;
    background: #E6E6E6 !important;
}

.btnplate {
    display: flex;
}

div.btnplate div.icon_outer {
    padding: 0 !important;
    margin: 0px !important;
    margin-left: 16px;
    width: 48px;
    height: 64px;
    text-align: center;
}

/*  ť ı */
div.btnplate div.icon_outer p {
    padding: 0 !important;
    margin: 0px !important;
    width: 48px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    font-size: 12px !important;
}

/*  ť*/
button {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    box-sizing: border-box !important;
    margin: 0 auto !important;
    font-size: 12px !important;
    padding: 0px !important;
    border-radius: 50% !important;
    background-color: #F5F5F5 !important;
    transition: background 0.5s;
    -webkit-transition: background 0.5s;
    outline: none;
}

/*    */
button:hover {
    background: rgba(16, 109, 250, 0.05) !important;
}

/*    */
button:active {
    background: rgba(16, 109, 250, 0.12) !important;
}

button:focus {
    outline: transparent;
}

/*  ¼ ˳ div*/
div#loginbar {
    /*display: none;*/
    position: absolute;
    right: 31px;
}

/*  ¼*/
button.infologin {
    color: #fff;
    margin-top: 16px !important;
    margin-left: 16px !important;
    border: 2px solid white;
    border-radius: 2px !important;
    background: #106DFA !important;
    transition: border .15s ease-in-out, color .15s ease-in-out, background-color .15s ease-in-out;
}

button.infologin:hover {
    border-radius: 0px !important;
    border: 2px solid #666ce4;
}

button.infologin:active {
    border-radius: 0px !important;
    border: 2px solid #666ce4;
}

/*  ¼    */
div.login_pop {
    display: none;
    position: absolute;
    top: 150px;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 5;
    width: 442px !important;
    height: 320px !important;
    box-sizing: border-box;
    box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.12);
    background-color: #fff;
    padding: 42px 90px;
}

div.login_pop p {
    width: 72px !important;
    height: 28px !important;
    line-height: 28px;
    box-sizing: border-box;
    font-size: 18px;
    font-weight: holder;
    margin: 0px;
}

div.login_pop .row {
    position: relative;
    width: 262px !important;
    height: 40px !important;
    box-sizing: border-box;
    border: 1px solid #E5E5E5;
    line-height: 40px;
    margin-top: 24px;
}
.login_pop div.row:nth-last-of-type(2) {
    display: none;
}
div.login_pop .row span {
    display: inline-block !important;
    width: 36px !important;
    height: 36px !important;
    box-sizing: border-box;
    margin: 2px 2px;
    background: url("../images/login_password.svg") center center no-repeat #fff !important;
    background-size: 10px 13px;
    transition: background .15s;
}

div.login_pop .row span:hover {
    background: url("../images/login_password_hover.svg") center center no-repeat #fff !important;
    background-size: 10px 13px;
}

div.login_pop .row:nth-child(2) span {
    background: url("../images/login_user.svg") center center no-repeat #fff !important;
    background-size: 10px 13px;
    transition: background .15s;
}

div.login_pop .row:nth-child(2) span:hover {
    background: url("../images/login_user_hover.svg") center center no-repeat #fff !important;
    background-size: 10px 13px;
}

div.login_pop .row input {
    position: absolute;
    left: 40px;
    top: 9px;
    width: 216px !important;
    height: 22px !important;
    padding-left: 3px !important;
    line-height: 22px;
    box-sizing: border-box;
    text-align: left;
    border: none;
}

div.login_pop .row input::-webkit-input-placeholder {
    color: #ccc;
}

div.login_pop .row input:focus {
    border-radius: 0px;
    border: 1px solid #106DFA;
    outline: 1px solid #106DFA;
}

/*ȷ ϰ ť*/
div.login_pop .login_btn {
    width: 262px !important;
    height: 32px !important;
    margin: 46px auto 0;
}

.infologinyes {
    display: inline-block !important;
    width: 262px !important;
    height: 32px !important;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    letter-spacing: .5px;
    text-decoration: none;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    padding: 0.375rem 0.75rem;
    font-size: 0.85rem;
    border-radius: 0.15rem !important;
    margin-left: 3px;
    /* margin-right: -1px; */
    background: #106DFA !important;
    color: #fff;
    border: 2px solid white;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.infologinyes:hover {
    background: #106DFA !important;
    border: 2px solid #7D6DE0;
    border-radius: 0 !important;
}

/*ȡ    ť*/
.infologinno {
    position: absolute;
    top: 19.75px;
    right: 19.75px;
    width: 12.5px !important;
    height: 12.5px !important;
    border-radius: 0px !important;
    background: url("../images/cancel.svg") center center no-repeat transparent !important;
    background-size: 12.5px 12.5px;
    transition: background .15s;
}

.infologinno:hover {
    background: url("../images/cancel_hover.svg") center center no-repeat transparent !important;
    background-size: 12.5px 12.5px;
}

/* ˳ */
button.infologout {
    color: #fff;
    margin-top: 16px !important;
    margin-left: 16px !important;
    border: 2px solid white;
    border-radius: 2px !important;
    background: #106DFA !important;
}

button.infologout:hover {
    border-radius: 0px !important;
    border: 2px solid #666ce4;
}

button.infologout:active {
    border-radius: 0px !important;
    border: 2px solid #666ce4;
}

/*    */
button.infomakecall {
    background: url("../images/call.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infomakecall:hover {
    background: url("../images/call.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infomakecall:active {
    background: url("../images/call.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

button.infomakecall.disabled {
    background: url("../images/call_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/* Ҷ */
button.infodropcall {
    background: url("../images/hang_up.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infodropcall:hover {
    background: url("../images/hang_up.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infodropcall:active {
    background: url("../images/hang_up.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

button.infodropcall.disabled {
    background: url("../images/hang_up_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*С  */
button.infoparking {
    background: url("../images/small_rest.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infoparking:hover {
    background: url("../images/small_rest.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infoparking:active {
    background: url("../images/small_rest.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

button.infoparking.disabled {
    background: url("../images/small_rest_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*    */
button.infoprocessing {
    background: url("../images/deal_with.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infoprocessing:hover {
    background: url("../images/deal_with.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infoprocessing:active {
    background: url("../images/deal_with.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

button.infoprocessing.disabled {
    background: url("../images/deal_with_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*       */
button.infoanswercall {
    background: url("../images/answer.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infoanswercall:hover {
    background: url("../images/answer.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infoanswercall:active {
    background: url("../images/answer.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

button.infoanswercall.disabled {
    background: url("../images/answer_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;

}

/*    */
button.infohold {
    background: url("../images/keep.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infohold:hover {
    background: url("../images/keep.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infohold:active {
    background: url("../images/keep.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

button.infohold.disabled {
    background: url("../images/keep_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*ȡ      */
button.infounhold {
    background: url("../images/recover.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infounhold:hover {
    background: url("../images/recover.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infounhold:active {
    background: url("../images/recover.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

/*ת  */
button.infotransfer {
    background: url("../images/transfer.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infotransfer:hover {
    background: url("../images/transfer.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infotransfer:active {
    background: url("../images/transfer.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

button.infotransfer.disabled {
    background: url("../images/transfer_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*    */
button.infostartconference {
    background: url("../images/three_meeting.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infostartconference:hover {
    background: url("../images/three_meeting.svg") center center no-repeat rgba(125, 109, 224, 0.1) !important;
    background-size: 26px 13px;
}

button.infostartconference:active {
    background: url("../images/three_meeting.svg") center center no-repeat rgba(125, 109, 224, 0.12) !important;
    background-size: 26px 13px;
}

button.infostartconference.disabled {
    background: url("../images/three_meeting_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*    */
button.infoMonitor {
    background: url("../images/monitor.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infoMonitor:hover {
    background: url("../images/monitor.svg") center center no-repeat rgba(125, 109, 224, 0.1) !important;
    background-size: 26px 13px;
}

button.infoMonitor:active {
    background: url("../images/monitor.svg") center center no-repeat rgba(125, 109, 224, 0.12) !important;
    background-size: 26px 13px;
}

button.infoMonitor.disabled {
    background: url("../images/monitor_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*  Ƶ*/
.sound_tool {
    display: flex;
    padding-left: 20px;
}

.sound_tool .icon_outer {
    text-align: center;
    width: 54px;
    position: relative;
}

.sound_tool .icon_outer p {
    margin: 2px !important;
    font-size: 12px !important;
}

/*        */
button.infoheadphonesound {
    background: url("../images/ear_phone.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infoheadphonesound:hover {
    background: url("../images/ear_phone.svg") center center no-repeat rgba(125, 109, 224, 0.1) !important;
    background-size: 26px 13px;
}

button.infoheadphonesound.disabled {
    background: url("../images/ear_phone_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*       */
button.infomicrophonesound {
    background: url("../images/mac.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infomicrophonesound:hover {
    background: url("../images/mac.svg") center center no-repeat rgba(125, 109, 224, 0.1) !important;
    background-size: 26px 13px;
}

button.infomicrophonesound.disabled {
    background: url("../images/mac_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*    */
button.infomutesound {
    background: url("../images/mute.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infomutesound:hover {
    background: url("../images/mute.svg") center center no-repeat rgba(125, 109, 224, 0.1) !important;
    background-size: 26px 13px;
}

button.infomutesound.disabled {
    background: url("../images/mute_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infoset {
    background: url("../images/set.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infoset:hover {
    background: url("../images/set.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infoset:active {
    background: url("../images/set.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

button.infoset.disabled {
    background: url("../images/set_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*  λ*/
button.inforeset {
    background: url("../images/reset.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.inforeset.disabled {
    background: url("../images/reset_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/*  λ*/
button.infobusiness {
    background: url("../images/business.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infobusiness.disabled {
    background: url("../images/business_disabled.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

/* û */
.infouser {
    float: left;
    width: 150px;
    font-size: 12px;
    float: right;
    margin-right: 84px;
}

.user_name {
    color: rgba(0, 0, 0, 0.65);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*      ϯ*/
button.infomakecallagent {
    background: url("../images/call.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infomakecallagent:hover {
    background: url("../images/call.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infomakecallagent:active {
    background: url("../images/call.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

/*   йؼ   */
button.infomakecallkeyword {
    background: url("../images/call.svg") center center no-repeat #F5F5F5 !important;
    background-size: 26px 13px;
}

button.infomakecallkeyword:hover {
    background: url("../images/call.svg") center center no-repeat rgba(16, 109, 250, 0.05) !important;
    background-size: 26px 13px;
}

button.infomakecallkeyword:active {
    background: url("../images/call.svg") center center no-repeat rgba(16, 109, 250, 0.12) !important;
    background-size: 26px 13px;
}

/*ҵ   ַtab л   ť*/
div#poptabs {
    display: flex;
    white-space: nowrap;
    overflow-x: auto;
    text-align: left;
    margin: 5px 0;
    background: #f1f1f1;
}

/*  ¼    */
div.infologintab {
    padding-left: 10px;
    letter-spacing: 0.02em !important;
    width: 126px !important;
    height: 30px !important;
    line-height: 30px;
    border-radius: 3px;
}

/*        */
div.infocallouttab {
    display: flex;
    align-items: center;
    padding-left: 5px;
    padding-right: 12px;
    border-right: 1px solid gray;
    cursor: pointer;
}

/*   뵯  */
div.infocallintab {
    padding-left: 10px;
    letter-spacing: 0.02em !important;
    width: 126px !important;
    height: 30px !important;
    line-height: 30px;
    border-radius: 3px;
    transition: background .15s;
}

/*         뵯  */
div.infosesscallintab {
    padding-left: 10px;
    width: 100px !important;
    height: 30px !important;
    line-height: 30px;
    letter-spacing: 0.02em !important;
    border-radius: 3px;
    transition: background .15s;
}

button.calloutdel,
button.callindel,
button.infotooldel {
    display: inline-block;
    margin-left: 10x !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 0px !important;
    background: url("../images/cha.svg") center center no-repeat transparent !important;
    background-size: 7.5px 7.5px;
    vertical-align: initial;

}

button.calloutlarge,
button.callinpoplarge,
button.sessioncallinpoplarge {
    display: inline-block;
    margin-left: 5px !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 0px !important;
    background: url("../images/zhankai.svg") center center no-repeat transparent !important;
    background-size: 7.5px 7.5px;
    vertical-align: initial;

}

button.calloutlarge.disabled,
button.callinpoplarge.disabled,
button.sessioncallinpoplarge.disabled {
    display: inline-block;
    margin-left: 5px !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 0px !important;
    background: url("../images/shouqi.svg") center center no-repeat transparent !important;
    background-size: 7.5px 7.5px;
    vertical-align: initial;
}

#popiframe {
    width: 100%;
    height: 770px;
    z-index: 99;

}

#popiframe iframe {
    height: 100%;
    width: 100%;
}

/* û   */
#freeagent {
    margin: 0;
    width: 200px !important;
    height: 276px;
    z-index: 999;
    position: absolute;
    left: 83%;
    top: 60px;
    text-align: left;
}

#free-nav::-webkit-scrollbar {
    width: 8px;
    height: 1px;
}

#free-nav::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.2);
    ;
}

#free-nav::-webkit-scrollbar-track {
    border-radius: 10px;
    background: #ededed;
}

#free-nav {
    font-size: 12px;
    user-select: none;
    -webkit-user-select: none;
    box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.12);
    width: 200px !important;
    height: 267px;
    overflow: auto;
    padding: 10px !important;
    box-sizing: border-box;
    margin: 0 !important;
    background-color: white;
}

#free-nav .nav_menu {
    width: 100%;
    box-sizing: border-box;
    /* height: 26px; */
}

#free-nav .menu_one {
    height: 26px;
    line-height: 26px;
    display: flex;
    align-items: center;
}

#free-nav .menu_two {
    display: none;
}

#free-nav .menu_two_c {
    height: 26px;
    position: relative;
    box-sizing: border-box;
    line-height: 26px;
    padding-left: 44px;
    background-size: 12px 12px;
    background: url(../images/head.svg) 16% center no-repeat;
}

#free-nav .menu_two div:hover {
    background-color: #F7F7F9;
}

#free-nav .menu_two div:hover>.tel {
    position: absolute;
    left: 80%;
    top: 6px;
    cursor: pointer;
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(../images/dianhua.svg) center center no-repeat;
    background-size: 16px 16px;
}

#free-nav .nav_head {
    display: inline;
    width: 100%;
    padding-left: 20px;
    background: url(../images/tree.svg) left center no-repeat;
    background-size: 12px 12px;
}

#free-nav .menu_one:hover>.tel {
    cursor: pointer;
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(../images/dianhua.svg) center center no-repeat;
    background-size: 16px 16px;
}

#free-nav .menu_one>.tel {
    cursor: pointer;
    display: inline-block;
    width: 24px;
    height: 24px;
}

div.infodialplate .arrow-btn {
    width: 12px;
    height: 12px;
    margin-right: 8px;
    display: inline-block;
    background: url(../images/right_arrow.svg) center 150% no-repeat;
    background-size: 10px 10px;
}

div.infodialplate .close_btn {
    float: right;
    font-size: 16px;
    width: 0;
    top: 19px;
    background: none !important;
    margin-right: 12px;
}

#infosystem_messsage {
    position: fixed;
    bottom: 0;
    left: 73px;
}

#headVol,
#micoVol {
    display: block;
    height: 106px;
    width: 30px;
    background: white;
    position: absolute;
    padding: 5px;
    border-radius: 5px;
    left: 15px;
    z-index: 999;
    box-shadow: rgb(0 0 0 / 25%) 0px 4px 6px;
}

#headVolJd,
#micoVolJd {
    transform: rotate(270deg);
    position: absolute;
    /* height: 119px; */
    width: 100px;
    left: -80%;
    top: 47px;
}

#headvolColor,
#micovolColor {
    height: 50%;
    width: 5px;
    background-color: #F5F5F5;
    pointer-events: none;
}

#micovolBlok,
#headvolBlok {
    position: absolute;
    height: 13px;
    width: 13px;
    background-color: #106DFA;
    border-radius: 100%;
    bottom: 50%;
    left: -4px;
    pointer-events: none;
    margin-right: -3.5px;
}

#entericon-phone {
    display: none;
    position: fixed;
    right: 50px;
    bottom: 80px;
    z-index: 9999;
    cursor: pointer;
    width: 50px;
    height: 50px;
    background: lightgreen;
}

#infobirdlogo {
    position: absolute;
    width: 82px;
    height: 33px;
    left: 16px;
    top: 33px;
}

#poptabs::-webkit-scrollbar {
    width: 1px;
    /*高宽分别对应横竖滚动条的尺寸*/
    height: 8px;
}

#poptabs::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.2);
    ;
}

#poptabs::-webkit-scrollbar-track {
    border-radius: 10px;
    background: #ededed;
}

.active {
    background: white;
    border-right: 1px solid transparent !important;
}

.callouttitle {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 84px;
    display: block;
}

/* 新增设置 */
#popSet {
    width: 300px;
    position: fixed;
    border: 1px solid gray;
    background: #f5f5f5;
    padding: 10px;
    z-index: 9999;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}

#audioSet {
    margin: 10px 0;
}

#titleConf {
    margin: 0;
}

#micoLabel,
#headLabel {
    width: 53px;
}

#headTab,
#micoTab {
    display: flex;
    margin: 10px 0;
}

#getMicoDevice,
#getHeadDevice {
    width: 150px;
    margin: 0 8px;
    outline: none;
    padding: 0 5px;
    cursor: pointer;
}

#micoTest,
#headTest {
    padding: 0 5px;
    cursor: pointer;
    font-size: 14px;
    border: 1px solid gray;
    box-sizing: content-box;
    width: 78px;
    text-align: center;
}

#ConfSub {
    display: flex;
    justify-content: space-evenly;
    margin: 20px 10px 0 10px;
}

#ConfSave,
#ConfCancel {
    border: 1px solid;
    cursor: pointer;
    padding: 0 5px;
    font-size: 14px;
}