/*** 반응형 ***/

/* 대시보드 반응형 (태블릿 대응) */
@media (max-width: 1245px) {
    .dash_monitor_container {
        flex-direction: column;
    }

    .dash_row01 {
        flex-direction: column;
        height: auto;
    }

    /* 통화 연결까지 대기시간(서비스레벨), 응대율 */
    .doughnut_monitor_container {
        width: 100%;
    }

    /* 인입 응대호 */
    .dash_row01 .dash_callcount {
        width: 100%
    }

    .dash_row01 .dash_rate {
        margin-right: 0px;
    }

    .slide_content > .slide_section:nth-child(4) {
        display: none
    }
}


/**
 * ====================
 * 해상도별 mediaQuery 설정
 * ====================
 */
/* 모바일 공통 사항*/
@media (max-width: 730px) {
    /** 로그인 페이지 **/
    .login_wrap {
        overflow: hidden;
    }

    .login_box {
        width: 85%;
        min-width: 300px;
    }

    .login_content {
        width: 80%;
    }

    .login_logo {
        margin: 5px 0 33px;
    }

    .login_logo img {
        width: 210px;
    }

    /** 대시보드 **/
    .logo_cnt {
        margin: 14px 0 0 12px !important;
    }

    .logo_cnt > img {
        width: 139px;
    }

    header .util li:first-child {
        display: none
    }

    .aside_btn > .menuIcon {
        line-height: 34px;
    }

    section.dashbox .header span {
        font-size: 18px;
    }

    .dash_monitor {
        margin-right: 12px;
    }

    .dash_monitor div[class^="stat_"]:last-of-type {
        flex-wrap: wrap;
    }

    .stat_call > .in_total_cnt_wrap {
        border-radius: 15px;
    }

    .dash_monitor div.stat_call > div {
        width: 49%;
        border-radius: 6px;
        min-width: 150px;
    }

    .dash_monitor div[class^="stat_"] > div {
        padding: 0;
        min-height: 0;
    }

    .dash_monitor div[class^="stat_"] > div p {
        padding: 9px 19px;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: center;
        font-size: 20px;
    }

    .dash_monitor div[class^="stat_"] > div p span {
        margin-top: 0px;
        font-size: 16px;
    }

    #_refresh_time {
        line-height: 24px;
        height: 26px;
    }

    .content_wrap > .today_counsel_count {
        flex-direction: column;
    }

    .content_wrap > .today_counsel_count > div:first-child {
        margin-bottom: 8px;
    }

    .content_wrap > .today_counsel_count > div:first-child > label {
        margin: 0 4px 0;
    }

    .content_wrap > .today_counsel_count > div:nth-child(2) {
        width: auto;
        display: flex;
        justify-content: space-between;
    }

    .content_wrap > .today_counsel_count > div:nth-child(2) > select {
        max-width: 105px;
    }

    .content_wrap > .today_counsel_count > div:nth-child(2) > .search_rid .ss-value-text {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        word-break: break-all;
        max-width: 150px;
    }

    /* 대기콜 영역 */
    .dash_monitor div.stat_cti > div {
        width: 49%;
        border-radius: 6px;
        min-width: 150px;
    }

    .dash_monitor div.stat_cti > div:first-child {
        border-radius: 6px;
    }

    /* 상담원 상태 목록 */
    .dash_agent .stat_agent_list {
        max-height: 100px;
    }

    .dash_agent .header {
        height: 56px !important;
        flex-direction: column;
        align-items: flex-start;
    }

    .dash_agent .header > div {
        width: 100%;
        max-height: 100px;
        justify-content: space-between;
        margin-top: 3px;
    }

    .dash_agent .header > div > select {
        margin: 0 !important;
    }

    /* 차트 영역*/
    .doughnut_monitor_container {
        flex-direction: column;
        gap: 0;
    }

    .dash_row01 {
        gap: 0;
    }

    .dash_row01 .dash_typecount,
    .dash_row01 .dash_rate,
    .dash_row01 .dash_callcount {
        height: auto;
    }

    .dash_row01 section .dashitem {
        align-items: center;
        justify-content: space-between;
    }

    .dash_row01 .dash_typecount > .header {
        margin-bottom: 5px
    }

    /* 통화 연결까지 대기시간 */
    #ring_time_cnt_0 > span:first-child, #ring_time_cnt_1 > span:first-child, #ring_time_cnt_2 > span:first-child, #ring_time_cnt_3 > span:first-child, #ring_time_cnt_4 > span:first-child,
    #w4-call_try_cnt > span:first-child, #w4-call_success_cnt > span:first-child, #w4-call_fail_cnt > span:first-child, #w4-call_give_up_cnt > span:first-child {
        padding: 4px;
    }

    .dash_row02 {
        flex-direction: column;
        height: auto !important;
    }

    .dash_row02 .dash_timecount {
        margin-right: 0;
    }

    .dash_row02 .dash_timecount,
    .dash_row02 .dash_weekcount {
        width: auto;
    }

    .dash_row02 .dash_weekcount {
        display: flex;
        justify-content: space-between;
        flex-direction: column;
    }

    .call_count_text > ul {
        margin-top: 0;
    }

    .dash_row02 .dash_weekcount .dashitem {
        display: flex;
        flex-direction: column-reverse;
    }

    .dash_weekcount .header span {
        font-size: 16px !important;
    }

    /* 환경설정 팝업 */
    .account_info, .pwd_info {
        width: 280px;
        margin: -220px 0px 0px -140px;
    }

    .account_info_edit footer .setting_save_btn, .pwd_info_edit footer .setting_save_btn {
        margin: 22px auto 0;
    }

    .account_info_edit > form > div > input[type="text"] {
        width: 100%;
    }

    /* 시스템 운영 현황 */
    .slide_content_wrap > .slide_content {
        overflow-y: auto;
        gap: 22px;
        flex-direction: column;
    }
}