@charset "UTF-8";

/* ================================
 * 공통 속성
 * ================================ */

[data-theme='light-mode'] body, input, select, textarea, button {
    font-family: 'Roboto', 'NotoSansKR', sans-serif;
    font-size: 13.5px;
    font-weight: 400;
    /*220809수정*/
    color: #60636c;
}


[data-theme='light-mode'] .container {
    display: flex;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background: #F3F6F9;
}

[data-theme='light-mode'] select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: url(/web_resources/images_ver2/select-arrow.png) no-repeat right 8px center;
    background-size: 10px;
    background-color: #FFF;
}

[data-theme='light-mode'] select:focus {
    background: url(/web_resources/images_ver2/select-arrow_focus.png) no-repeat right 8px center;
    background-size: 10px;
    background-color: #FFF;
}

/* ------------------------------------------------------- */
/* 라디오 radio style 추가 */
[data-theme='light-mode'] .radio-form {
}

[data-theme='light-mode'] .radio-form input[type="radio"] {
    display: none;
}

[data-theme='light-mode'] .radio-form input[type="radio"] + span {
    font-weight: normal;
}

[data-theme='light-mode'] .radio-form input[type="radio"] + span:before {
    display: inline-block;
    margin-right: 5px;
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 16px;
    border: 1px solid #c5c8d3;
    vertical-align: -3px;
    cursor: pointer;
    background: #fff;
}

[data-theme='light-mode'] .radio-form input[type="radio"]:checked + span:before {
    background: url(/web_resources/images_ver2/radio_w.png) #3669f5 no-repeat center;
    border: 1px solid #fff;
    background-size: 6px;
}


[data-theme='light-mode'] input[class*="txt-c"] {
    text-indent: 0 !important;
    border: 0 !important;
    outline: none !important;
}

[data-theme='light-mode'] input[class="txt-ck"]:checked + span {
    background: #F0F0F8;
    font-weight: 700;
    font-size: 13.5px;
}

[data-theme='light-mode'] input[class="txt-ck"] + span {
    display: inline-block;
    height: 36px;
    line-height: 36px;
    border: 1px solid #EAEAEA;
    border-radius: 4px;
    background: #fff;
    text-align: center;
    cursor: pointer;
    outline: 0 !important;
    font-weight: 500;
}


[data-theme='light-mode'] .btn_s {
    background-color: #2764f7;
    padding: 0 0.8em;
    border-radius: 6px;
    color: #fff;
}

[data-theme='light-mode'] .btn_s1 {
    background: rgba(39, 100, 247, 0.15);
    padding: 0 0.8em;
    border-radius: 6px;
}

[data-theme='light-mode'] .btn_s1:hover {
    background: rgba(39, 100, 247, 0.35);
    padding: 0 0.8em;
    border-radius: 6px;
    color: #FFF;
}

[data-theme='light-mode'] .btn-st1 {
    background: #4E5983;
    color: #fff;
    padding: 0 0.8em;
    border-radius: 8px;
    opacity: 0.8;
}

[data-theme='light-mode'] .btn-st1:hover {
    background: #334596;
    transition: .25s;
}

[data-theme='light-mode'] .btn-st2 {
    background: #8796be;
    color: #fff;
    padding: 0 0.8em;
    border-radius: 6px;
}

[data-theme='light-mode'] .btn-st2:hover {
    background: #5a6e9b;
    transition: .15s;
}

[data-theme='light-mode'] .btn-st3 {
    background: #A016E6;
    color: #fff;
    padding: 0 0.8em;
    border-radius: 6px;
}

[data-theme='light-mode'] .btn-st3:hover {
    background: #B92FFF;
    transition: .25s;
}

[data-theme='light-mode'] .btn-st4 {
    background: #1CC69F;
    color: #fff;
    padding: 0 0.8em;
    border-radius: 6px;
}

[data-theme='light-mode'] .btn-st4:hover {
    background: #3CDEB9;
    transition: .25s;
}

[data-theme='light-mode'] .btn-st5 {
    background: rgba(78, 89, 131, 0.15);
    padding: 0 0.8em;
    border-radius: 6px;
}

[data-theme='light-mode'] .btn-st5:hover {
    background: rgba(78, 89, 131, 0.3);
    transition: .25s;
}

[data-theme='light-mode'] .btn-st6 {
    background: #F0F0F8;
    color: #4C5C77;
    padding: 0 0.8em;
    border-radius: 6px;
}

[data-theme='light-mode'] .btn-st6:hover {
    background: #e4e4ef;
    transition: .15s;
}
[data-theme='light-mode'] .btn_st7{
    background: #5a6e9b;
    transition: .15s;
    line-height: 36px;
    padding: 0 0.8em;
    border-radius: 6px;
    color: #FFF;
    font-weight: 500;
    height: 36px;
    cursor:pointer;
}



[data-theme='light-mode'] .btn_search {
    background: #4E5983;
    color: #fff;
    padding: 0 0.8em;
    border-radius: 6px;
    font-weight: 600;
}

[data-theme='light-mode'] .btn_excel {
    background: #fff;
    color: #2e7d32;
    border: 1px solid #92c294;
    padding: 0 0.8em;
    border-radius: 6px;
}

[data-theme='light-mode'] .btn_excel:hover {
    background: #DEEFDF;
    border: 1px solid #2e7d32;
    transition: .25s;
}

[data-theme='light-mode'] button .fa {
    opacity: 0.6;
}

/*220829  추가  */
[data-theme='light-mode'] button {
    background-color: transparent;
}


[data-theme='light-mode'] .con-box-area {
    vertical-align: top;
    display: inline-block;
    overflow-y: auto;
    overflow-x: hidden;
}

[data-theme='light-mode'] .con-box-area .con-box.w-bottom {
    height: calc(100% - 116px);
    border-radius: 0 !important;
    padding: 16px 24px;
}


/*차트많이 보이게  접기 전체 0904 추가*/
[data-theme='light-mode'] .container_1 {
    display: flex;
    overflow: hidden;
    width: 100%;
    height: 100%;

    /*background: #FFF; 2022_1004추가 */

}


/* ================================
 * Side Menu Toggle Button 사이드메뉴 접힘 토글
 * ================================ */


[data-theme='light-mode'] .btn_top-toggle1:hover .info-box {
    display: block;
}

[data-theme='light-mode'] .btn_side-toggle1 .info-box {
    top: 46px;
    right: 0;
}

[data-theme='light-mode'] .info-box {
    display: none;
    z-index: 1000;
    position: absolute;
    padding: 0.5em;
    border-radius: 6px;
    white-space: nowrap;
    line-height: 1.5em;
    background: rgba(0, 0, 0, 0.3);
    background-color: aqua;
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    /*top: 0;
	height: 100%;*/
    padding: 0 16px;
    width: 200px;
    background: #131418;
    /*접혀있을때 사이드 전체 라인 여기서 컨트롤*/
    border-right: 1px solid #E2E5E9;
    box-shadow: 0 0 10px 0 rgba(50, 61, 90, 0.2);
}

[data-theme='light-mode'] input[id="side-toggle1"]:checked + label .fa {
    transform: rotate(180deg);
    transition: all 0.25s;
}

[data-theme='light-mode'] .btn_top-toggle1:hover .info-box {
    display: block;
}

[data-theme='light-mode'] .btn_side-toggle1 .info-box {
    top: 46px;
    right: 0;
}

[data-theme='light-mode'] .btn_side-toggle1 {
    position: absolute;
    /*화살표 위치*/
    right: 40px;
    z-index: 999;
    width: 40px;
    height: 40px;
    display: block;
    font-size: 18px;
    /*text-align: center;*/
    cursor: pointer;
}

[data-theme='light-mode'] .btn_side-toggle1 .fa {
    color: #FFF;
    opacity: 0.6;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 40px;
    text-align: center;
    background: rgba(23, 154, 255, 0.35);
}

[data-theme='light-mode'] .btn_side-toggle1 .fa:hover {
    opacity: 0.9;
    transition: 0.25s;
    background: rgba(23, 154, 255, 0.55);
    color: #fff;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 40px;
    text-align: center;
}

[data-theme='light-mode'] .day_warp .box .btn_side-toggle1 .fa {
    display: inline-block;
    width: 32px;
    height: 32px;
    vertical-align: top;
    background: #FFF;
    cursor: pointer;
    color: #333;
    transition: 0.25s;
    text-align: center;
    line-height: 32px;
    font-size: 16px;
    opacity: 0.4;
}

[data-theme='light-mode'] input[id="side-toggle1"] {
    display: none;
}

[data-theme='light-mode'] input[id="side-toggle1"]:checked + label {
    left: 0;

    top: 0;
    /*height: 100%;*/
    height: calc(100% - 64px);
    padding: 24px;
    width: 220px;
    /*221005임시사이즈 */
    width: 1200px;
    background: #FFF;
    border-right: 1px solid #E2E5E9;
    /* 접혀있을때 사이드 전체 라인 여기서 컨트롤 border-right: 1px solid #E2E5E9;
    box-shadow: 0 0 10px 0 rgba(50, 61, 90, 0.2);
    background: #fff;*/
}

[data-theme='light-mode'] input[id="side-toggle1"]:checked + label .fa {
    transform: rotate(180deg);
    transition: all 0.25s;
}

/* 사이드 접힘 시 보여지는 메뉴아이콘 */
[data-theme='light-mode'] input[id="side-toggle1"] + label .toggle-menu {
    display: none;
    width: 220px;

    /*test 임시 가로 사이즈  221005 */
    width: 1200px;
    /* border-top: 1px solid #E2E5E9;
    margin-top: 30px;*/
    background-color: antiquewhite;

}


[data-theme='light-mode'] input[id="side-toggle1"] + label .toggle-menu .fa {
    font-size: 14px;
    transform: rotate(0deg) !important;
    margin: 0;
    right: 0px !important;
}

[data-theme='light-mode'] input[id="side-toggle1"]:checked + label .toggle-menu {
    display: block;
}

[data-theme='light-mode'] input[id="side-toggle1"]:checked + label .toggle-table {
    display: block;
}

/* 사이드 접힘 후 컨텐츠영역 */
[data-theme='light-mode'] input[id="side-toggle1"]:checked + label + div {
    left: -1000px;
    width: -1200px; /*여기 수정해야 함 left: -60%;*/

}

[data-theme='light-mode'] input[id="side-toggle1"]:checked + label + div + .contents-area {
    width: calc(100% - 990px);
    width: calc(100% - 990px);
}

/* 사이드 접힘 후 컨텐츠영역 가로크기*/


[data-theme='light-mode'] .con1 {
    left: 0;
    position: relative;
    display: inline-block;
    width: 60%;
    background: #FFF;
    border-right: 1px solid #E2E5E9;
    /*box-shadow: 0 0 10px 0 rgba(50, 61, 90, 0.1);*/
    font-size: 13.5px;
    font-weight: 400;
    transition: all 0.35s;
    z-index: 2;
    padding: 24px;
    height: calc(100% - 64px);
    overflow-y: auto;
    border-radius: 10px 0px 0px 10px;
}

[data-theme='light-mode'] .con2 {
    position: relative;
    display: inline-block;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    width: 40%;
    height: calc(100% - 64px);
    background-color: #FFF;
    border-radius: 0px 10px 10px 0px;
}

[data-theme='light-mode'] .contents-area1 {
    display: inline-block;
    position: relative;
    height: 100%;
    /*width: calc(100% - 60%);  사이드 접힘 전 컨텐츠영역 크기*/
    vertical-align: top;
    font-size: 13px;
}


/* ================================
 * Side Menu Toggle Button 사이드메뉴 접힘 토글
 * ================================ */
[data-theme='light-mode'] .btn_side-toggle {
    position: absolute;
    left: 165px;
    z-index: 999;
    width: 72px;
    height: 64px;
    display: block;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
    /*background-color: #1e2024;*/
    border-radius: 8px 0px 0px 0px;
}

[data-theme='light-mode'] .btn_side-toggle .fa { /*220818 수정color: #323D5A; */
    color: #646464;
    opacity: 0.6;
    line-height: 48px;
    margin-top: 8px;
}

[data-theme='light-mode'] .btn_side-toggle .fa:hover {
    opacity: 0.9;
    transition: 0.25s;
}

[data-theme='light-mode'] input[id="side-toggle"] {
    display: none;
}

[data-theme='light-mode'] input[id="side-toggle"]:checked + label {
    left: 0;
    top: 0;
    padding: 0 16px;
    width: 80px;
    height: 100%;
    /*220816 border-right: 1px solid #E2E5E9; #1e1f22 */
    border-right: 1px solid #1e1f22;

    /*
    box-shadow: 0 0 10px 0 rgba(50, 61, 90, 0.2);
 220816 수정 background: #fff;*/
}

[data-theme='light-mode'] input[id="side-toggle1"]:checked + label .fa {
    transform: rotate(180deg);
    transition: all 0.25s;
}

/* 사이드메뉴 접힘 시 보여지는 메뉴아이콘 */
[data-theme='light-mode'] input[id="side-toggle"] + label .toggle-menu {
    display: none;
    width: 48px;
    /*220816 수정border-top: 1px solid #E2E5E9;
	 margin-top: 7px;*/
    margin-top: 8px;
}

[data-theme='light-mode'] input[id="side-toggle"] + label .toggle-menu .fa {
    font-size: 14px;
    transform: rotate(0deg) !important;
    margin: 0;
}

[data-theme='light-mode'] input[id="side-toggle"]:checked + label .toggle-menu {
    display: block;
}

[data-theme='light-mode'] .toggle-menu ul.menu {
    margin-top: 38px;
    position: relative;
}

[data-theme='light-mode'] .toggle-menu ul.menu li .fa {
    display: block;
    width: 48px;
    height: 48px;
    line-height: 48px;
    border-radius: 6px;
}


/*220816 접힘 후
.toggle-menu ul.menu li.checked .fa:after {content: "";
    display: block; position: absolute; top: 0; left: 60px;
    width: 4px; height: 48px; border-radius: 4px;
    background: #061139;
}*/
[data-theme='light-mode'] .toggle-menu ul.menu li.checked .fa {
    /*220816 background: #F4F4FA;*/

    background: #282b30;
    opacity: 1;
    transition: 0.25s;
}

/* 사이드 접힘 후 컨텐츠영역 */
[data-theme='light-mode'] input[id="side-toggle"]:checked + label + div {
    left: -160px;
    width: 80px;
    transition: all 0.15s;
}

[data-theme='light-mode'] input[id="side-toggle"]:checked + label + div + .contents-area {
    width: calc(100% - 80px);
}

/* 사이드 접힘 후 컨텐츠영역 가로크기*/

/*220817 사이드 메뉴 접힘 후 텍스트 보여주기 추가*/

[data-theme='light-mode'] .toggle-menu ul.menu li .fa:hover .txtview {
    visibility: visible;
    opacity: 1 !important;
    transition: .25s;
}

[data-theme='light-mode'] .toggle-menu ul.menu li .fa .txtview {
    z-index: 1;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    left: 56px;
    top: 50%;
    transform: translateY(-50%);
    line-height: 32px;
    padding: 0 16px;
    border-radius: 6px;
    white-space: nowrap;
    /*background:#459cf0; opacity: 0.7; */
    background: rgba(69, 156, 240, 0.9);
    color: #FFF;
    font-size: 14px;
    font-weight: 500;
    transition: .25s;
}

[data-theme='light-mode'] .toggle-menu ul.menu li .fa .txtview:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: -12px;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
    border-left: 6px solid transparent;
    border-right: 6px solid #459cf0;
}


/* swith btn  */
[data-theme='light-mode'] #switch:checked + .switch_label .onf_btn {
    left: 58px;
    background: #fff;
    box-shadow: 1px 2px 3px #00000020;
}


[data-theme='light-mode'] #switch {
    position: absolute;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    display: none;
}

[data-theme='light-mode'] #switch:checked + .switch_label {
    background: #3490DE;
    border: 2px solid #3490DE;
}


[data-theme='light-mode'] .switch_label {
    position: relative;
    cursor: pointer;
    display: inline-block;
    width: 85px;
    height: 30px;
    background: #fff;
    border: 2px solid #f0bb40;
    border-radius: 20px;
    transition: 0.2s;
}

[data-theme='light-mode'] .switch_label:hover {
    background: #fff9ea;
}

label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700;
}

[data-theme='light-mode'] .onf_btn {
    position: absolute;
    top: 3px;
    left: 3px;
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    /*background: #3490DE;*/
    background: #f0bb40;
    transition: 0.2s;
}


[data-theme='light-mode'] .onf_txt {
    position: absolute;
    top: 3px;
    left: 36px;
    display: inline-block;
    width: 20px;
    height: 20px;
    /*color: #3490DE;*/
    color: #555;
}


[data-theme='light-mode'] #switch:checked + .switch_label .onf_txt {
    left: 10px;
    background: #3490DE;
    color: #FFF;
}

/* ================================
 * 운영관리 Side Menu Style 라이트 버전 메뉴 스타일
 * ================================ */

[data-theme='light-mode'] .side_menu_operation {
    left: 0;
    position: relative;
    display: inline-block;
    width: 240px;
    height: 100%;

    background: #FFF;
    /*220818  수정

	border-right: 1px solid #E2E5E9;
	box-shadow: 0 0 10px 0 rgba(50, 61, 90, 0.2);*/
    font-family: 'Noto Sans KR', sans-serif;
    border-right: 1px solid #1e1f22;
    border-right: 1px solid #E2E5E9;
    box-shadow: 0 0 10px 0 rgba(50, 61, 90, 0.2);
    color: #333;
    font-size: 13.5px;
    font-weight: 400;
    transition: all 0.35s;
    z-index: 2;
    background: #fff;
}

[data-theme='light-mode'] .side_menu_operation .side_logo {
    /*220818 수정
	 padding: 20px 8px 0 8px;
	 border-bottom: 1px solid #E2E5E9;
	 margin: 0 16px;
	*/
    background-color: #0f0e10;
    background-color: #FFF;
    height: 64px;
    padding: 16px 10px 0 20px;
    font-size: 22px;
    color: #333;
    border-bottom: 1px solid #E2E5E9;
    font-family: 'paybooc-ExtraBold'

}


[data-theme='light-mode'] .side_menu_operation .side_logo .svg {


    height: 36px;
    margin-top: -2px;

}

[data-theme='light-mode'] .side_menu_operation .side_logo .v {
    color: #777;
    font-size: 10px;
    margin-left: 5px;
}


[data-theme='light-mode'] .side_menu_operation ul {
    width: 100%;
    padding: 0 16px;
}

[data-theme='light-mode'] .side_menu_operation ul.menu {
    margin-top: 24px;
}

[data-theme='light-mode'] .side_menu_operation ul.menu li {
    position: relative;
    list-style-type: none;
}

[data-theme='light-mode'] .side_menu_operation ul.menu li a {
    display: block;
    width: 100%;
    line-height: 46px;
    color: #878b8f;
    color: #323D5A;
    opacity: 0.85;
    cursor: pointer;
}

[data-theme='light-mode'] .side_menu_operation ul.menu .fa {
    display: inline-block;
    width: 48px; /* 220816 수정  font-size: 14px; width값으로 아이콘과 텍스트 간격 조절  */
    text-align: left;
    text-indent: 10px;
    opacity: 0.7;
}

[data-theme='light-mode'] .side_menu_operation ul.menu li .sub {
    margin-bottom: 5px;
    display: none;
}

[data-theme='light-mode'] .side_menu_operation ul.menu li .sub a {
    position: relative;
    width: 100%;
    line-height: 40px;
    text-indent: 32px;
}

[data-theme='light-mode'] .side_menu ul.menu li .sub a:before {
    content: "";
    display: inline-block;
    position: absolute; left: 12px; top: calc(50% - 2px);
    width: 4px; height: 4px; border-radius: 4px;
    background: #323D5A; opacity: 0.5;
}

/* 메뉴 hover(마우스 커서 올라감)*/
[data-theme='light-mode'] .side_menu_operation ul.menu li a:hover {
    opacity: 1;
    background: #F4F6FA;
    border-radius: 10px;
    color: #3669f5;
    transition: 0.25s;
}

[data-theme='light-mode'] .side_menu_operation ul.menu li a:hover .fa {
    opacity: 0.95;
    transition: 0.25s;
}

[data-theme='light-mode'] .side_menu_operation ul.menu li .sub a:hover:before {
    background: #061139;
    opacity: 0.9;
}

[data-theme='light-mode'] .side_menu_operation ul.menu li .sub a:hover {
    background: #FFF;
}

/* 메뉴 checked(선택되어졌을때)*/
[data-theme='light-mode'] .side_menu_operation ul.menu li a.checked {

    background: #F4F6FA;
    border-radius: 10px;
    transition: 0.25s;
    /*color: #4e4f51;*/
    font-weight: 500;
    color: #3669f5;
}


[data-theme='light-mode'] .side_menu_operation ul.menu > li > a.checked:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: -16px;
    width: 4px;
    height: 48px;
    border-radius: 4px;
    background: #3669f5;
}

[data-theme='light-mode'] .side_menu_operation ul.menu li a.checked .fa {
    color: #061139;
    opacity: 1;
}


/* ================================
 * Side Menu Style 라이트 버전 메뉴 스타일
 * ================================ */
[data-theme='light-mode'] .side_menu {
    left: 0;
    position: relative;
    display: inline-block;
    width: 240px;
    height: 100%;
    background: #FFF;
    font-family: 'Noto Sans KR', sans-serif;
    border-right: 1px solid #E2E5E9;
    box-shadow: 0 0 10px 0 rgba(50, 61, 90, 0.2);
    color: #333;
    font-size: 13.5px;
    font-weight: 400;
    transition: all 0.35s;
    z-index: 2;
    background: #fff;
}

[data-theme='light-mode'] .side_menu .side_logo {
    /*220818 수정
	 padding: 20px 8px 0 8px;
	 border-bottom: 1px solid #E2E5E9;
	 margin: 0 16px;
	*/
    background-color: #0f0e10;
    background-color: #FFF;
    height: 64px;
    padding: 16px 10px 0 20px;
    font-size: 22px;
    color: #333;
    border-bottom: 1px solid #E2E5E9;
    font-family: 'paybooc-ExtraBold'

}


[data-theme='light-mode'] .side_menu .side_logo .svg {


    height: 36px;
    margin-top: -2px;

}

[data-theme='light-mode'] .side_menu .side_logo .v {
    color: #777;
    font-size: 10px;
    margin-left: 5px;
}


[data-theme='light-mode'] .side_menu ul {
    width: 100%;
    padding: 0 16px;
}

[data-theme='light-mode'] .side_menu ul.menu {
    margin-top: 24px;
}

[data-theme='light-mode'] .side_menu ul.menu li {
    position: relative;
    list-style-type: none;
}

[data-theme='light-mode'] .side_menu ul.menu li a {
    display: block;
    width: 100%;
    line-height: 46px;
    color: #323D5A;
    opacity: 0.85;
    cursor: pointer;
}

[data-theme='light-mode'] .side_menu ul.menu .fa {
    display: inline-block;
    width: 48px; /* 220816 수정  font-size: 14px; width값으로 아이콘과 텍스트 간격 조절  */
    text-align: left;
    text-indent: 10px;
    opacity: 0.7;
}

[data-theme='light-mode'] .side_menu ul.menu li .sub {
    margin-bottom: 5px;
    display: none;
}

[data-theme='light-mode'] .side_menu ul.menu li .sub a {
    position: relative;
    width: 100%;
    line-height: 40px;
    text-indent: 32px;
}

/*
.side_menu ul.menu li .sub a:before {content: "";
    display: inline-block;
    position: absolute; left: 12px; top: calc(50% - 2px);
    width: 4px; height: 4px; border-radius: 4px;
    background: #323D5A; opacity: 0.5;
}*/

/* 메뉴 hover(마우스 커서 올라감)*/
[data-theme='light-mode'] .side_menu ul.menu li a:hover {
    opacity: 1;
    background: #F4F6FA;
    border-radius: 10px;
    color: #3669f5;
    transition: 0.25s;
}

[data-theme='light-mode'] .side_menu ul.menu li a:hover .fa {
    opacity: 0.95;
    transition: 0.25s;
}

[data-theme='light-mode'] .side_menu ul.menu li .sub a:hover:before {
    background: #061139;
    opacity: 0.9;
}

[data-theme='light-mode'] .side_menu ul.menu li .sub a:hover {
    background: #FFF;
}

/* 메뉴 checked(선택되어졌을때)*/
[data-theme='light-mode'] .side_menu ul.menu li a.checked {

    background: #F4F6FA;
    border-radius: 10px;
    transition: 0.25s;
    /*color: #4e4f51;*/
    font-weight: 500;
    color: #3669f5;
}


[data-theme='light-mode'] .side_menu ul.menu > li > a.checked:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: -16px;
    width: 4px;
    height: 48px;
    border-radius: 4px;
    background: #3669f5;
}

[data-theme='light-mode'] .side_menu ul.menu li a.checked .fa {
    color: #061139;
    opacity: 1;
}

[data-theme='light-mode'] .side_menu ul.menu li .sub a.checked {
    background: #FFF;
    color: #3669f5;
    font-weight: 500;


}

[data-theme='light-mode'] .side_menu ul.menu li .sub a.checked:before {
    background: #3669f5;
    /* opacity: 0.9;*/
    opacity: 1;
}

/*23-01-18 메뉴 화살표
/* arrow */
[data-theme='light-mode'] .side_menu ul.menu > li > a:after {
    content: "";
    position: absolute;
    top: calc(22px - 3px);
    right: 18px;
    width: 6px;
    height: 6px;
    /*220915수정 right: 24px; */
    /*220818 수정 border: 1px solid rgba(125, 125, 125, 0.4);*/
    border: 1px solid rgba(125, 125, 125, 0.8);
    border-width: 0 1px 1px 0;
    transform: rotate(45deg);
}

[data-theme='light-mode'] .side_menu ul.menu > li > a:hover:after {
    border: 1px solid rgba(6, 17, 57, 1);
    border-width: 0 1px 1px 0;
    transition: 0.25s;
}

/* arrow checked(선택되어졌을때) */
[data-theme='light-mode'] .side_menu ul.menu > li > a.checked:after {
    top: calc(26px - 5px);
    border: 1px solid rgba(54, 105, 245, 1);
    border-width: 0 1px 1px 0;
    transform: rotate(-45deg);
    transition: 0.25s;
}


/*220818 추가 공통 haed*/
[data-theme='light-mode'] .head_warp {
    height: 64px;
    padding: 10px 20px 0px 32px;
    position: relative;
    top: 0;
    width: 100%;
    background-color: #FFF;
    display: inline-block;
    border-bottom: 1px solid #E2E5E9;
}

/*HR, 그룹웨어, 운영관리 tabs*/

[data-theme='light-mode'] .tabs_warp {
    width: 300px;
    display: inline-block;
}

[data-theme='light-mode'] ul.tabs {
    font-size: 17.5px;
    margin-top: 11px;
}

[data-theme='light-mode'] ul.tabs li.current {

    color: #2764f7;

}

[data-theme='light-mode'] ul.tabs li.fs19 {
    font-size: 19px
}


[data-theme='light-mode'] ul.tabs li {

    background: none;
    color: #70737a;
    display: inline-block;
    cursor: pointer;
    font-family: 'NanumSquare';
    font-weight: 700;
    float: left;
    position: relative;
    margin-right: 26px;
    font-size: 19.5px;
}

[data-theme='light-mode'] ul.tabs li:before {
    content: "";
    display: block;
    position: absolute;
    left: -14px;
    top: 8px;
    width: 4px;
    height: 4px;
    background: #E2E5E9;
    border-radius: 10px;
}

/*border-radius: 50px;
border-bottom: 3px solid #3c7cec;*/
[data-theme='light-mode'] ul.tabs li:first-child {
    font-size: 19.5px;
}

[data-theme='light-mode'] ul.tabs li:first-child.current:after {
    margin-top: 16px;
}

[data-theme='light-mode'] ul.tabs li:first-child:before {
    display: none;
}

[data-theme='light-mode'] ul.tabs li.current:after {
    content: '';
    height: 4px;
    display: block;
    position: absolute;
    margin-top: 18px;
    /*border-radius: 4px;
border-bottom: 4px solid #f00;*/
    border-radius: 0.475rem;
    /*border-bottom: 4px solid #3669f5;*/
    background-color: #3669f5;
    width: calc(100% + 16px);
    left: -8px;
    transition: 0.25s;
}


[data-theme='light-mode'] ul.tabs li:hover {
    color: #2764f7;
}


[data-theme='light-mode'] .info_warp {
    display: flex;
    float: right;
    align-items: center;
}


[data-theme='light-mode'] .icon_mode {
    display: inline-block;
    margin-right: 20px;
    vertical-align: middle;
    background: url(/web_resources/images_ver2/icon_moon.png);
    background-repeat: no-repeat;
    border-radius: 25px;
    background-size: 22px 22px;
    height: 42px;
    /*width: 123px;*/
    padding: 0px 14px 0px 0px;
    background-position: 10% 50%;
    background-color: #f1f3f4;
    /* border: 2px solid  #e7e9eb;*/
    line-height: 42px;
    font-size: 13px;
}

[data-theme='light-mode'] .icon_mode:hover {
    display: inline-block;
    margin-right: 20px;
    vertical-align: middle;
    background: url(/web_resources/images_ver2/icon_moon_hover.png);
    background-repeat: no-repeat;
    border-radius: 25px;
    /*border: 2px solid rgba(39,100,247,0.1); */
    height: 42px;
    /*width: 123px;*/
    padding: 0px 13px 0px 0px;
    background-position: 10% 50%;
    background-color: #404040;
    /* border: 2px solid  #e7e9eb;*/
    background-size: 22px 22px;
    line-height: 42px;
    font-size: 13px;
    color: #FFF;
}

[data-theme='light-mode'] .icon_mode .font {
    padding-left: 35px; /*color: #7c8084;*/

}

[data-theme='light-mode'] .icon_mode .font:hover {
    padding-left: 35px;

}

[data-theme='light-mode'] .icon_bell {
    display: inline-block;
    margin-right: 40px;
    vertical-align: middle;
    font-size: 20px;
    color: #89919B;
}

[data-theme='light-mode'] .number {
    position: absolute;
    background-color: #e94936;
    color: #FFF;
    padding: 2px 4px;
    font-size: 11px;
    border-radius: 10px;
    font-weight: 500;
    margin: -23px 0px 0px 11px;
}


[data-theme='light-mode'] .profile {
    display: inline-block;
    margin-right: 13px;
    vertical-align: middle;
    font-family: 'Noto Sans KR', sans-serif;

}

[data-theme='light-mode'] .name {
    font-weight: 600;
    font-size: 13px;
    color: #333;
    display: block;
    text-align: right;
}


[data-theme='light-mode'] .company {
    color: #595a62;
    font-weight: 500;
    font-size: 12px;
}


[data-theme='light-mode'] .Photo {
    display: flex;
    margin-right: 4px;
    /*border: 1px solid  #e7e9eb;
    border: 1px solid rgba(39,100,247,0.1); */
    border-radius: 9px;
    font-size: 17px;
    color: #89919B;
    background: #F2F3F5;
    /*background: #F4F4FA;
    padding:9px 9px 0px 10px;*/
    height: 42px;
    width: 44px;
    align-items: center;
    justify-content: center;
}

[data-theme='light-mode'] .btn_logout {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    /*border: 2px solid rgba(39,100,247,0.1);
    border: 1px solid  #e7e9eb;*/

    color: #89919B;
    background: #F2F3F5;
    font-size: 20px;
    height: 42px;
    width: 44px;
    /*
    background-image: url(/web_resources/images_ver2/logout.png);
    background-repeat: no-repeat;
    background-position: 54% 65%;*/
}

[data-theme='light-mode'] .btn_logout:hover {
    color: #3669f5;
    /*
background-image: url(/web_resources/images_ver2/logout.png);
background-position: 54% 65%;
background-repeat: no-repeat;*/
}

[data-theme='light-mode'] .head_title {
    background-color: #FFF;
    color: #666670;
    border-bottom: 1px solid #E2E5E9;
    width: 100%;
    height: 65px;
    display: inline-block;
    font-size: 18px;
    color: #181C32;
    line-height: 65px;
    padding-left: 24px;
    font-weight: 500;
}

/*  contents */
[data-theme='light-mode'] .contents {
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    width: 100%;
    height: calc(100% - 64px);
    padding: 24px;
    display: flex;
}

[data-theme='light-mode'] .contents_2 {
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    width: 100%;
    height: calc(100% - 64px); /*padding: 24px;*/
    display: flex;

}

/*22-11-11 통계 검색 박스 추가 */
[data-theme='light-mode'] .contents_3 {
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    width: 100%;
    height: calc(100% - 64px);
    padding: 24px;
    white-space: nowrap !important;
    /*display: flex;*/
}


[data-theme='light-mode'] .contents_4 {
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    width: 100%;
    /*height: calc(100% - 64px); */
    padding: 24px;
    display: flex;
}

[data-theme='light-mode'] .contents_5 {
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    width: 100%;
    height: calc(100% - 44px);
    padding: 24px;
    display: flex;
}

[data-theme='light-mode'] .con-area_un {
    display: flex;
    max-height: 100%;
    padding: 24px;
    width: 100%;
    max-height: calc(100% - 840px) !important;
}


[data-theme='light-mode'] .con-area {
    display: flex;
    max-height: 100%;
    /*220818   수정  padding: 24px;
  /* height는 html상에서 제어 */
    width: 100%;
}

[data-theme='light-mode'] .con-area2 {
    display: flex;
    max-height: 100%;
    /*220818   수정  padding: 24px;
  /* height는 html상에서 제어 */
    padding: 24px;
    width: 100%;
    flex-direction: row;
}

[data-theme='light-mode'] .con_boxwarp {
    background-color: #FFF;
    color: #666670;
    /*border-bottom:1px solid #1e1f22; */
    width: 100%;
    height: 65px;
}

[data-theme='light-mode'] .con_boxwarp .tix {
    padding-left: 24px;
    display: inline-block;
    font-size: 18px;
    color: #364168;
    font-weight: 700;
    line-height: 65px;
    /*font-family:'NanumSquare',sans-serif;*/
}

[data-theme='light-mode'] .con_boxwarp .btnwarp_top {
    text-align: center;
    float: right;
    margin-top: 7px;
}


[data-theme='light-mode'] .con_boxwarp .warp_top .input {
    background-color: #292d34;
    -webkit-box-shadow: 1px black;
    box-shadow: 1px black;
}

[data-theme='light-mode'] .btnwarp {
    text-align: center;
    float: right;

}

[data-theme='light-mode'] .btnwarp .topbtn {
    display: inline-block;
    /*color: #FFF;*/
}


[data-theme='light-mode'] .con_boxwarp .btnwarp {
    text-align: center;
    float: right;
    margin-top: 7px;
}

[data-theme='light-mode'] .con_boxwarp .warp_top {
    text-align: center;
    margin-top: 13px;
    float: right;

}

[data-theme='light-mode'] .con_boxwarp .btnwarp .topbtn {
    display: inline-block;
    /*color: #FFF;*/

}

[data-theme='light-mode'] .con-box_calender select {
    border-radius: 4px;
    border: 1px solid #f1f3f4;
    border: 1px solid #E3E5EF;
    /* background-color: #f1f3f4; */
    height: 36px;
    text-indent: 10px
}

[data-theme='light-mode'] .con-box_top_n {
    position: relative;
    font-size: 18px;
    font-weight: 700;
    color: #364168;
    color: #222;
    background-color: #FFF;
}

[data-theme='light-mode'] .con-box_calender {
    position: relative;
    font-size: 18px;
    font-weight: 700;
    color: #364168;
    color: #222;
    background-color: #FFF;

    border-radius: 10px;
    height: 150px;
    width: 100%;
    display: flex;
    display: -webkit-flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    justify-content: center;

}


[data-theme='light-mode'] .con-box_top_notice {
    border-radius: 10px;
    height: 60px;
    width: 100%;
    justify-content: center;
    margin-bottom: 20px;
    position: relative;
    font-size: 18px;
    font-weight: 700;
    color: #364168;
    color: #222;
    background-color: #FFF;
}


[data-theme='light-mode'] .con-box_top_notice .tixwarp {
    line-height: 56px;
    position: relative;
    padding: 15px;
    font-size: 17px;
    font-weight: 600;
}


[data-theme='light-mode'] .con-box_top_notice .tit {
    margin-left: 70px;
    font-size: 16px;
    font-weight: 400;
    color: #666;
}

[data-theme='light-mode'] .con-box_top_notice .date {
    margin-left: 25px;
    font-weight: 400;
    color: #777;
    font-size: 14px;
}

[data-theme='light-mode'] .tit:before {
    content: "";
    display: block;
    position: absolute;
    left: 190px;
    top: 28px;
    width: 5px;
    height: 5px;
    background: #438bd3;
    border-radius: 10px;
}


[data-theme='light-mode'] .con-box_top_notice .tixwarp .icon {
    line-height: 32px;
    margin-right: 7px;
}


[data-theme='light-mode'] .attendance_calender {
    display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    align-items: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    /*min-height: 73px;*/
    padding: 0 15px 0 60px;


}

[data-theme='light-mode'] .in_user {

    flex-wrap: nowrap;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    display: inline-block;
    width: 220px;
    margin-left: 40px;


}

[data-theme='light-mode'] .in_user_date {
    font-size: 26px;
    margin-top: 6px;
}


[data-theme='light-mode'] .in_user .today {
    font-size: 14px;
    color: #999;
    margin-right: 9px;
    font-weight: 500;
}

[data-theme='light-mode'] .attendance_warp {
    width: 70%;
    margin-left: 35px;
}


[data-theme='light-mode'] .attendance_warp .tixtop {
    margin-left: 70px;
    display: inline-block;
    font-weight: 400;
    color: #175ce5;
}

[data-theme='light-mode'] .vacation {
    margin-left: 80px;
    display: inline-block;
    font-weight: 400;
    color: #38a2fa;
}


[data-theme='light-mode'] .absenteeism {
    margin-left: 80px;
    display: inline-block;
    font-weight: 400;
    color: #dc0000;
}

[data-theme='light-mode'] .holiday {
    margin-left: 80px;
    display: inline-block;
    font-weight: 400;
    color: #858585;

}

[data-theme='light-mode'] .tardy {
    margin-left: 80px;
    display: inline-block;
    color: #fa4a38;
    font-weight: 400;
}

[data-theme='light-mode'] .tixtop .tix {
    padding-left: 10px;
}

[data-theme='light-mode'] .attendance_number {
    font-size: 60px;
    font-weight: 600;
}


[data-theme='light-mode'] .attendance_top {
    position: relative;
    padding: 0px 0px 0px 20px;
    height: 60px;
    /*line-height: 56px;*/

    font-weight: 500;
    color: #364168;
    color: #222;
    background-color: #FFF;
    border-radius: 10px 10px 0 0;
    border-left: 1px solid #E2E5E9;
    border-bottom: 1px solid #E2E5E9;
}


[data-theme='light-mode'] .attendance_top:first-child {
    border-left: 0;
}

[data-theme='light-mode'] .attendance_icon_warp {
    width: 10%;
    display: inline-block;
    height: 60px;
    vertical-align: middle;
}

[data-theme='light-mode'] .attendance_icon {
    line-height: 32px !important;
    font-size: 18px;
    display: inline-block;
    height: 32px;
    width: 32px;
    border-radius: 13px;
    background: #F2F3F5;
    color: #ABAEBC;
    text-align: center;

}

[data-theme='light-mode'] .attendance_box {
    width: 80%;
    display: inline-block;
    padding: 12px 0px 0px 11px;
}

[data-theme='light-mode'] .attendance_tit {
    display: block;
    font-size: 15px;
}

[data-theme='light-mode'] .attendance_tits {
    font-size: 12px;
    color: #888;
    display: block;
}

[data-theme='light-mode'] .attendance_t_warp {
    height: 280px !important;
    border-radius: 0 0 10px 10px !important;
    padding-top: 24px;
    border-left: none !important;
}


/*22-12-20 수정*/
[data-theme='light-mode'] .con-box_top {
    position: relative;
    padding: 0px 24px 0px 16px;
    height: 56px;
    line-height: 56px;
    font-size: 18px;
    font-weight: 700;
    color: #364168;
    color: #222;
    background-color: #FFF;
}

[data-theme='light-mode'] .topbtn span {
    display: block;
    font-size: 12.5px;
}

[data-theme='light-mode'] .smenu:hover {

    filter: invert(31%) sepia(52%) saturate(5772%) hue-rotate(219deg) brightness(96%) contrast(87%);
    color: #2b61e6 !important;
}

[data-theme='light-mode'] .smtit:hover {
    color: #2b61e6;
}


[data-theme='light-mode'] .con-area ~ .con-area {
    padding-top: 0;
}

/* 2단 이상 박스일 때 padding-top 제거 */
[data-theme='light-mode'] .con-box-area {
    vertical-align: top;
    /*220823 display: inline-block; */

    overflow-y: auto;
    overflow-x: hidden; /* width는 html상에서 제어 */

    /*

    23-01-09 수정 그림자
    -webkit-box-shadow: 0px 1px 15px 1px rgb(69 65 78 / 8%);*/


}


/* con-box_top.sub 추가 -- 2021-09-14 */
[data-theme='light-mode'] .con-box_top.sub {
    border-radius: 0 !important;
    font-size: 15px;
}

[data-theme='light-mode'] .con-box_top.sub + .con-box {
    height: calc(100% - 56px);
}


[data-theme='light-mode'] .searchbox {
    width: 100%;
    height: 40px;
    margin-bottom: 16px;
    margin-top: 20px;

}


[data-theme='light-mode'] .searchbox1 {
    width: 100%;
    height: 40px;
    margin-bottom: 4px;
    /*margin-top: 20px;*/
    margin-top: 5px;
}

[data-theme='light-mode'] .searchbox2 {
    width: 100%;
    height: 40px;
    margin-bottom: 16px;

}

[data-theme='light-mode'] .succession {
    margin: 3px 5px 3px 7px;
    vertical-align: middle;
    display: inline-block;
}

[data-theme='light-mode'] .succession span {
    width: 6px;
    height: 6px;
    background-color: #44d7f6;
    border-radius: 10px;
    float: left;
    margin: 10px 7px 10px 0px;

}


[data-theme='light-mode'] .blacklist {
    margin: 3px;
    vertical-align: middle;
    display: inline-block;
}


[data-theme='light-mode'] .blacklist span {
    width: 6px;
    height: 6px;
    background-color: #eb4a36;
    border-radius: 10px;
    float: left;
    margin: 10px 7px 10px 0px;
}


[data-theme='light-mode'] .btn_ri_blue {
    background: rgba(39, 100, 247, 0.88);
    color: #FFF;
    display: inline-block;
    padding: 0px 10px 0px 10px;
    height: 34px;
    border-radius: 4px;
    border-radius: 10px;
    vertical-align: middle;
    text-align: center;
    line-height: 32px;
    font-size: 19px;
}

[data-theme='light-mode'] .btn_blue .icon_card {
    height: 26px;
    margin-right: 7px;
    margin-bottom: 2px;
}

[data-theme='light-mode'] .btn_blue .icon_writing {
    height: 24px;
    margin-right: 4px;
    margin-bottom: 2px;
}

[data-theme='light-mode'] .btn_ri_blue:hover {
    background: #2764f7;
    color: #FFF;
    display: inline-block;
    padding: 0px 10px 0px 10px;
    height: 34px;
    border-radius: 10px;
    vertical-align: middle;
    text-align: center;
    line-height: 32px;
}


[data-theme='light-mode'] .btn_find {
    background: rgba(39, 100, 247, 0.9);
    color: #FFF;
    display: inline-block;
    width: 60px;
    height: 35px;
    border-radius: 4px;
    vertical-align: middle;
    text-align: center;
    line-height: 35px;
    font-weight: 600;
}


[data-theme='light-mode'] .btn_find:hover {
    background: #2764f7;
    color: #FFF;
    display: inline-block;
    width: 60px;
    height: 35px;
    border-radius: 4px;
    vertical-align: middle;
    text-align: center;
    line-height: 35px;
}


[data-theme='light-mode'] .btn_dk_transparent_warp {
    margin: 0 auto;
    text-align: center;
}

[data-theme='light-mode'] .btn_dk_transparent {
    background: #272b31;
    opacity: 0.8 !important;
    /*border: 1px solid rgba(39,100,247,0.3);
/*background: #101010;*/
    color: #FFF;
    border: 1px solid transparent;
    display: inline-block;
    padding: 0px 12px 0px 12px;
    height: 34px;
    border-radius: 4px;
    vertical-align: middle;
    text-align: center;
    line-height: 35px;
    margin-right: 4px;
    -webkit-box-shadow: 1px 1px 1px 1px black;
    box-shadow: 1px 1px 1px 1px black
}


[data-theme='light-mode'] .btn_dk_transparent:hover {

    background: #282b30;
    opacity: 1 !important;
    border: 1px solid #2764f7;

    /* border: 1px solid #2e7d32;*/
    /*background: #101010;*/
    color: #FFF;
    display: inline-block;

    padding: 0px 12px 0px 12px;
    height: 34px;
    border-radius: 4px;

    text-align: center;
    line-height: 35px;

}


[data-theme='light-mode'] .btn_mo {
    display: block;
    border-radius: 10px;
    background: rgba(39, 43, 49, 0.8);
    padding: 5px;
    width: 60px;
    text-align: center;
    vertical-align: middle;

}

[data-theme='light-mode'] .btn_mo:hover {
    display: block;
    border-radius: 10px;
    background: rgba(39, 43, 49, 1);
    padding: 5px;
    width: 60px;
    text-align: center;

    color: #FFF;

}


[data-theme='light-mode'] .btn_mo .icon {
    height: 13px;
    opacity: 0.6;
    margin-right: 4px;
    margin-bottom: 2px;
}


[data-theme='light-mode'] .btn_ri_co {
    /*: 1px solid #353839; background:#282b30;
	*/
    background: #FFF;
    /*opacity: 0.8 !important;
	/*background: #101010;*/

    border: 1px solid transparent;
    display: inline-block;
    border: 1px solid rgba(39, 100, 247, 0.1);
    /*border: 1px solid #dadada;*/
    padding: 0px 10px 0px 10px;
    height: 32px;
    border-radius: 10px;
    vertical-align: middle;
    text-align: center;
    line-height: 32px;

    font-size: 19px;
    /*-webkit-box-shadow: 1px 1px 1px 1px black;
	box-shadow: 1px 1px 1px 1px black;*/


}

[data-theme='light-mode'] .btn_ri_co:hover {
    border: 1px solid #3669f5;
    opacity: 0.8;
    background: #282b30;
    background: rgba(39, 100, 247, 0.95);
    opacity: 1 !important;
    /*border: 1px solid rgba(39,100,247,0.9);
	/*background: #101010;*/
    color: #FFF;
    display: inline-block;

    padding: 0px 10px 0px 10px;
    height: 32px;
    border-radius: 10px;

    text-align: center;
    line-height: 32px;

}


[data-theme='light-mode'] .btn_dk_excel {
    /*: 1px solid #353839; background:#282b30;
	*/
    background: #272b31;
    opacity: 0.8 !important;
    /*border: 1px solid rgba(39,100,247,0.3);
	/*background: #101010;*/
    color: #FFF;
    border: 1px solid transparent;
    display: inline-block;

    padding: 0px 12px 0px 12px;
    height: 34px;
    border-radius: 4px;
    vertical-align: middle;
    text-align: center;
    line-height: 35px;
    margin-right: 4px;
    -webkit-box-shadow: 1px 1px 1px 1px black;
    box-shadow: 1px 1px 1px 1px black;

}

[data-theme='light-mode'] .btn_dk_excel:hover {
    border: 1px solid #2e7d32;
    background: #282b30;
    opacity: 1 !important;
    /*border: 1px solid rgba(39,100,247,0.9);
	/*background: #101010;*/
    color: #FFF;
    display: inline-block;

    padding: 0px 12px 0px 12px;
    height: 34px;
    border-radius: 4px;

    text-align: center;
    line-height: 35px;

}

/*table 공통*/

[data-theme='light-mode'] .noline tr:last-child td {
    border-bottom: 0 !important;
}

/*테이블 둥근 테두리*/
[data-theme='light-mode'] .round tr:first-child th:first-child {
    -moz-border-radius: 6px 0 0 0;
    -webkit-border-radius: 6px 0 0 0;
    border-radius: 6px 0 0 0;
}

[data-theme='light-mode'] .round tr:first-child th:last-child {
    -moz-border-radius: 0 6px 0 0;
    -webkit-border-radius: 0 6px 0 0;
    border-radius: 0 6px 0 0;
}

[data-theme='light-mode'] .round tr:first-child th:only-child {
    -moz-border-radius: 6px 6px 0 0;
    -webkit-border-radius: 6px 6px 0 0;
    border-radius: 6px 6px 0 0;
}

[data-theme='light-mode'] .round tr:last-child td:first-child {
    -moz-border-radius: 0 0 0 6px;
    -webkit-border-radius: 0 0 0 6px;
    border-radius: 0 0 0 6px;
}


[data-theme='light-mode'] .round tr:last-child td:last-child {
    -moz-border-radius: 0 0 6px 0;
    -webkit-border-radius: 0 0 6px 0;
    border-radius: 0 0 6px 0;
}

[data-theme='light-mode'] .round tr:last-child td:only-child {
    -moz-border-radius: 0 0 6px 6px;
    -webkit-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
}

[data-theme='light-mode'] .s_box {
    height: 36px;
    line-height: 36px;
    background: #8796be;
    color: #fff;
    /*padding: 0 0.8em;*/
    width: 90px;
    border-radius: 4px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    display: inline-block;

}

/*근태  테이블 박스 */
[data-theme='light-mode'] .table_attendance {
    box-sizing: border-box;
    width: 100%;
    font-size: 14px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;
    /*
-webkit-box-shadow: 1px 1px 1px 1px black;
box-shadow: 1px 1px 1px 1px black;*/
    border-radius: 6px;
    cursor: pointer;
}


[data-theme='light-mode'] .table_attendance th {
    padding: 8px;
    /*background: #16191c; */
    background-color: #1c1d21;
    background-color: #F2F3F5;
    background-color: #f5f8fa;
    /*color: #FFF;*/
    height: 40px;

    /*border-bottom: 1px solid #242629;
	border-right: 1px solid rgba(36, 38, 41, 0.07);
border-right: 1px solid #e5e7eb;*/
    border-bottom: 1px solid #e5e7eb !important;
    border-right: 1px solid #e5e7eb;
}

[data-theme='light-mode'] .table_attendance th:first-child {

    width: 25px;
}

[data-theme='light-mode'] .table_attendance td:first-child {

    width: 25px;
    color: #999 !important;
}

[data-theme='light-mode'] .table_attendance td {
    /* background-color: #16191c;
background-color:#1c1d21;*/
    color: #60636c;
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #eaeaea !important;
    background-color: #FFF;

}

[data-theme='light-mode'] .table_attendance tr:hover td {
    /*background-color:#0f0e10;*/
    background-color: rgba(245, 248, 250, 0.3);
    /*color: #FFF;*/
}

/*근태  휴가신청 테이블 박스 */
[data-theme='light-mode'] .table1_attendance {
    box-sizing: border-box;
    width: 100%;
    font-size: 14px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;
    /*
-webkit-box-shadow: 1px 1px 1px 1px black;
box-shadow: 1px 1px 1px 1px black;*/
    border-radius: 6px;
    cursor: pointer;
}


[data-theme='light-mode'] .table1_attendance th {
    padding: 8px;
    /* background: #16191c; */
    background-color: #F2F3F5;
    /* color: #FFF; */
    height: 40px;
    color: #60636c;
    /* border-right: 1px solid #e5e7eb; */
}

[data-theme='light-mode'] .table1_attendance th:first-child {
    border-radius: 10px 0px 0px 0px;

}

[data-theme='light-mode'] .table1_attendance th:last-child {
    border-radius: 0px 10px 0px 0px;

}

[data-theme='light-mode'] .table1_attendance td {
    /* background-color: #16191c;
background-color:#1c1d21;*/
    color: #60636c;
    padding: 8px;
    text-align: center;
    border-bottom: 1px solid #eaeaea !important;
    background-color: #FFF;

}

[data-theme='light-mode'] .table1_attendance tr:hover td {
    /*background-color:#0f0e10;*/
    background-color: rgba(245, 248, 250, 0.3);
    /*color: #FFF;*/
}


[data-theme='light-mode'] .table1_attendance > tbody > tr:nth-child(2n+2) > td {
    background-color: #fafbfc;
}

[data-theme='light-mode'] .table1_attendance th:after {
    content: "";
    display: block;
    width: 1px;
    height: 14px;
    background: #ddd;
    position: absolute;
    /* left:0;*/

    top: 11%;
    margin-top: 0px;
}


[data-theme='light-mode'] .table1_attendance th:first-child:after {
    content: none;

}


/* table1 인사조회 테이블 */


[data-theme='light-mode'] .table_1 {
    box-sizing: border-box;
    width: 100%;
    font-size: 14px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;
    /*
-webkit-box-shadow: 1px 1px 1px 1px black;
box-shadow: 1px 1px 1px 1px black;*/
    border-radius: 6px;
    cursor: pointer;
}


[data-theme='light-mode'] .table_1 th {
    padding: 4px 7px;
    /*background: #16191c; */
    background-color: #1c1d21;
    background-color: #F2F3F5;
    background-color: #f5f8fa;
    /*color: #FFF;*/
    height: 40px;

    /*border-bottom: 1px solid #242629;
	border-right: 1px solid rgba(36, 38, 41, 0.07);
border-right: 1px solid #e5e7eb;*/
    border-bottom: 1px solid #e5e7eb !important;
    border-right: 1px solid #e5e7eb;
}

[data-theme='light-mode'] .table_1 th:first-child {
    width: 25px;
}

[data-theme='light-mode'] .table_1 td {
    /* background-color: #16191c;
background-color:#1c1d21;*/
    color: #60636c;
    border-bottom: 1px solid rgba(36, 38, 41, 0.4);
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #eaeaea !important;
    background-color: #FFF;

}

[data-theme='light-mode'] .table_1 tr:hover td {
    /*background-color:#0f0e10;*/
    background-color: rgba(245, 248, 250, 0.3);
    /*color: #FFF;*/
}


/*22-12-12  테이블 td bg   color 추가 */
[data-theme='light-mode'] .table_1 > tbody > tr:nth-child(2n+2) > td {
    background-color: #fafbfc;
}


[data-theme='light-mode'] .cored {
    color: #eb4a36 !important;
}


[data-theme='light-mode'] .fa-sort-amount-down, .fa-sort-amount-up {
    color: #999;
}

[data-theme='light-mode'] .fa-sort-amount-down:hover, .fa-sort-amount-up:hover {
    color: #00b8ff;
}

[data-theme='light-mode'] .select {
    color: #00b8ff;
}

/*2022-10-12  센터별 매출 차트(기간별) 테이블  */


[data-theme='light-mode'] .ch_warp {
    position: relative;
    display: inline-block;
    width: 100%;
    background: #FFF;
    font-size: 13.5px;
    font-weight: 400;
    transition: all 0.35s;
    /*padding: 24px;*/
    height: calc(100% - 64px);
    overflow-y: auto;
    overflow-x: hidden;
    border-radius: 10px;

}

[data-theme='light-mode'] .ch_tix2 {
    background-color: #FFF;
    color: #666670;
    border-bottom: 1px solid #eaeaea;
    border-bottom: 1px solid #eff2f5;
    width: 100% !important;
    min-width: 100% !important;
    height: 55px;
    display: block;
    font-size: 19px;
    color: #181C32;
    line-height: 55px;
    font-weight: 500;
    padding-left: 20px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;

}

[data-theme='light-mode'] .ch_tix {
    background-color: #FFF;
    color: #666670;
    border-bottom: 1px solid #eaeaea;
    border-bottom: 1px solid #eff2f5;
    width: 100% !important;
    height: 55px;
    display: inline-block;
    font-size: 19px;
    color: #181C32;
    line-height: 55px;
    font-weight: 500;

}


/* 센터별 수지 입력 chart */


[data-theme='light-mode'] .ch_box_warp {
    width: 100%;
    float: left;
    height: 72px;
    position: sticky;
    padding: 20px 0px 20px 0px;
    background-color: #FFF;
    top: 0;
}


[data-theme='light-mode'] .hidden {
    display: none;
}


[data-theme='light-mode'] .thead-sticky {

    position: sticky !important;
    top: 72px;
    background-color: #FFF !important;
    z-index: 99;
    margin: 0 !important;
    padding: 0 !important;
}


[data-theme='light-mode'] .fa {
    vertical-align: middle !important;
}

[data-theme='light-mode'] .year-div-sticky {
    height: 62px;
    position: sticky;
    top: 0;
    background-color: #FFF !important;
    z-index: 99;
    margin: 0 !important;
    padding: 5px 0 0 5px !important;
}


[data-theme='light-mode'] .chart-div-sticky {
    height: 56px;
    position: sticky;
    top: 72px;
    background-color: #FFF !important;
    z-index: 99;
    margin: 0 !important;
    padding: 0 0 0 10px !important;
    display: flex;
    max-width: 1200px;
    max-height: calc(100vh - 260px);
    float: left;
}


[data-theme='light-mode'] .center-th-sticky {
    height: 56px;
    position: sticky;
    top: 90px;
    z-index: 99;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #F6F6F6;
    border: 1px solid #a7abc3 !important;

}


[data-theme='light-mode'] .chart_warp {

    padding: 0px 0px 0px 24px;
    text-align: left;

}

[data-theme='light-mode'] .chart_tix {

    font-size: 20px !important;
    width: 45%;
    float: left;

}

[data-theme='light-mode'] .chart_tix_m {
    font-weight: 600;
    color: #333;
}

[data-theme='light-mode'] .chart_cnter {
    color: #3669f5;
    font-weight: 600;

}

[data-theme='light-mode'] .t_warp {
    border: 1px solid #E8E8ED;
    overflow: auto;
    border-radius: 6px;
}

[data-theme='light-mode'] .table_ch_line {
    border: 1px solid #eff2f5;
    /*22-12-20 라인 컬러 변경 */
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    /*overflow: auto;*/

}

[data-theme='light-mode'] .cb_bg_b {

    background-color: #f0f6fe !important;
    text-align: right !important;
}

[data-theme='light-mode'] .table_ch {
    box-sizing: border-box;
    font-size: 13.5px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;
    border-collapse: separate;
    /*table-layout: fixed;
-webkit-box-shadow: 1px 1px 1px 1px black;
box-shadow: 1px 1px 1px 1px black;
-webkit-box-shadow:2px 2px 2px 2px rgba(82, 63, 105, 0.10);
box-shadow: 2px 2px 2px 2px rgba(82, 63, 105, 0.10);
*/
    -webkit-box-shadow: 0px 5px 5px 0px rgb(82 63 105 / 10%);
    box-shadow: 0px 5px 5px 0px rgb(82 63 105 / 10%);
    box-shadow: 0px 0px 20px 0px rgba(76, 87, 125, 0.02);
    -webkit-box-shadow: 0px 0px 20px 0px rgba(76, 87, 125, 0.02);
    border-color: #eff2f5;
    border-radius: 6px;
    cursor: pointer;
}


/*문서작성 테이블 추가*/
[data-theme='light-mode'] .table_v2 {
    border-collapse: collapse;
}

[data-theme='light-mode'] .table_v2 th {
    text-align: center;
    padding: 4px;
    color: #5c6579;
    /*height: 50px;*/
    /*border-bottom: 1px solid #242629;*/
    border-bottom: 1px solid rgba(36, 38, 41, 0.07);
    /*border-right: 1px solid rgba(36, 38, 41, 0.07);*/
    border-bottom: 1px solid #e5e7eb !important;
    background-color: #F2F3F5;
    background-color: #f5f8fa;
    border-collapse: collapse;
    font-size: 13.5px;
}

[data-theme='light-mode'] .txt-group_2 {
    background: #FFECDB;
    color: #FC9228;
}

[data-theme='light-mode'] *[class*="txt-group"] {
    display: inline-block;
    padding: 0 8px;
    line-height: 24px;
    border-radius: 12px;
    font-weight: 500;
    letter-spacing: -0.05em;
    font-size: 13px;
}

[data-theme='light-mode'] .txt-group_3 {
    background: #e8f2ff;
    color: #066fff;
}

[data-theme='light-mode'] *[class*="txt-group"] {
    display: inline-block;
    padding: 0 8px;
    line-height: 24px;
    border-radius: 12px;
    font-weight: 500;
    letter-spacing: -0.05em;
    font-size: 13px;
}

/*문서작성 상세기재  테이블 추가 */
[data-theme='light-mode'] .table_ch_v2_1 th {
    text-align: center;
    padding: 5px;

    color: #5c6579;
    /*height: 50px;*/
    /*border-bottom: 1px solid #242629;*/
    border-bottom: 1px solid rgba(36, 38, 41, 0.07);
    border-right: 1px solid rgba(36, 38, 41, 0.07);
    border-right: 1px solid #e5e7eb;


    border-bottom: 1px solid #e5e7eb !important;
    border-bottom: 1px solid #F5F5F5 !important;
    /* background: #16191c;
background-color:#1c1d21;
background-color:#FFF;
background: #F0F0F8;
background: #e0ebfc;
background:rgba(224,235,252, 0.5);
background-color:#f4f6fa;*/
    background-color: #F2F3F5;
    background-color: #f5f8fa;
    font-size: 13.5px;

}

[data-theme='light-mode'] .table_ch_v2_1 th:last-child {
    border-right: none;
    border-bottom: none !important;
}

[data-theme='light-mode'] .table_ch_v2_1 td:last-child {
    border-right: none !important;

}


[data-theme='light-mode'] .table_ch_v2_1 td {
    /* background-color: #16191c;

background-color:#1c1d21;
background-color:#FFF;	 */
    color: #60636c;
    border-bottom: 1px solid #F5F5F5;
    border-right: 1px solid #F5F5F5;
    padding: 4px;

    font-size: 13.5px;

}


[data-theme='light-mode'] .table_v2 td {
    /* background-color: #16191c;*/


    color: #60636c;
    border-bottom: 1px solid #eaeaea !important;
    padding: 5px;
    text-align: right;
    font-size: 13.5px;
    height: 46px;
}


[data-theme='light-mode'] .table_v2 th:last-child {
    border-right: none;
    border-bottom: none !important;
}


[data-theme='light-mode'] .table_v3 th {
    text-align: center;
    padding: 6px;

    color: #5c6579;
    /*height: 50px;*/
    /*border-bottom: 1px solid #242629;*/
    border-bottom: 1px solid rgba(36, 38, 41, 0.07);
    border-right: 1px solid rgba(36, 38, 41, 0.07);
    border-right: 1px solid #e5e7eb;


    border-bottom: 1px solid #e5e7eb !important;
    border-bottom: 1px solid #F5F5F5 !important;
    /* background: #16191c;
background-color:#1c1d21;
background-color:#FFF;
background: #F0F0F8;
background: #e0ebfc;
background:rgba(224,235,252, 0.5);
background-color:#f4f6fa;*/
    background-color: #F2F3F5;
    background-color: #f5f8fa;

    border-collapse: separate;
    font-size: 13.5px;

}


[data-theme='light-mode'] .table_v3 td {
    /* background-color: #16191c;*/

    background-color: #1c1d21;
    background-color: #FFF;
    color: #60636c;
    border-bottom: 1px solid #F5F5F5 !important;
    border-right: 1px solid #F5F5F5;
    padding: 6px;
    text-align: right;
    font-size: 13.5px;

    height: 36px;
}


/*지출결의서 문서번호 테이블*/

[data-theme='light-mode'] .table_ch_v3 {
    width: 300px;
}

[data-theme='light-mode'] .table_ch_v3 th {
    text-align: center;
    padding: 6px 8px;
    color: #5c6579;
    color: #333;
    height: 46px;
    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb !important;
    border-collapse: separate;
    font-size: 13.5px;

}

[data-theme='light-mode'] .table_ch_v3 td {
    /* background-color: #16191c;

background-color:#1c1d21;
background-color:#FFF;	 */
    color: #60636c;
    border-bottom: 1px solid #e5e7eb;

    padding: 7px;

    font-size: 13.5px;

}

[data-theme='light-mode'] .table_ch_v3 tr:last-child th {
    border-bottom: none !important;

}

[data-theme='light-mode'] .table_ch_v3 tr:last-child td {
    border-bottom: none !important;

}

[data-theme='light-mode'] transmit_add div ~ div {
    margin-top: 5px;
}

[data-theme='light-mode'] .transmit_add div {
    position: relative;
    display: inline-block;
    width: 100px;
    height: 30px;
    line-height: 30px;
    border-radius: 30px;
    background: #E2E7F7;
    color: #4C5C77;
    font-weight: 700;
    text-align: center;
}

[data-theme='light-mode'] .remove {
    cursor: pointer;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
    background: url(/web_resources/images_ver2/ico_delete-w.png) no-repeat center;
    background-size: 8px;
}

[data-theme='light-mode'] .remove:hover {
    cursor: pointer;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
    background: url(/web_resources/images_ver2/ico_delete.png) no-repeat center;
    background-size: 8px;
}

/* 지출결의서 팝업   */

[data-theme='light-mode'] .table_ch_v3_popup {
    width: 100%;
}

[data-theme='light-mode'] .table_ch_v3_popup th {
    text-align: center;
    padding: 6px 8px;
    color: #5c6579;
    color: #333;
    height: 46px;
    border-right: 1px solid #e5e7eb;


    font-size: 13.5px;

}

[data-theme='light-mode'] .table_ch_v3_popup td {
    /* background-color: #16191c;

background-color:#1c1d21;
background-color:#FFF;	 */
    color: #60636c;
    border-bottom: 1px solid #e5e7eb;
    border-right: 1px solid #e5e7eb;
    padding: 7px;
    height: 100px;
    font-size: 13.5px;

}

[data-theme='light-mode'] .table_ch_v3_popup tr:last-child th {
    border-bottom: none !important;

}

[data-theme='light-mode'] .table_ch_v3_popup tr:last-child td {
    border-bottom: none !important;

}


[data-theme='light-mode'] .table_v4 th {
    text-align: center;
    padding: 6px;
    color: #5c6579;
    /*height: 50px;*/
    /*border-bottom: 1px solid #242629;*/
    border-bottom: 1px solid rgba(36, 38, 41, 0.07);
    /*border-right: 1px solid rgba(36, 38, 41, 0.07);*/
    border-bottom: 1px solid #e5e7eb !important;
    border-right: 1px solid #e5e7eb;
    background-color: #F2F3F5;
    background-color: #f5f8fa;
    border-collapse: collapse;
    font-size: 13.5px;
}


[data-theme='light-mode'] .table_v4 td {

    color: #60636c;
    border-bottom: 1px solid #F5F5F5 !important;
    border-right: 1px solid #e5e7eb;
    padding: 6px;
    text-align: center;
    font-size: 13.5px;
    height: 36px;
}


[data-theme='light-mode'] .table_v4 td:last-child {
    border-right: none !important;

}

[data-theme='light-mode'] .table_v4 th:last-child {
    border-right: none !important;

}

/*22-12-16 추가*/
[data-theme='light-mode'] .txt-group_0 {
    background: #fde9f3;
    color: #e33a97;
}

[data-theme='light-mode'] *[class*="txt-group"] {
    display: inline-block;
    padding: 0 8px;
    line-height: 24px;
    border-radius: 12px;
    font-weight: 600;
    letter-spacing: -0.05em;
    font-size: 13px;
}


[data-theme='light-mode'] .btn_104_blue_outline {
    background-color: #FFF;
    /*border: 1px solid #3a9ad9;*/
    color: #3a9ad9;
    border-radius: 0.25rem;
    text-align: center;
    cursor: pointer;
    letter-spacing: -1px;
    height: 26px;
    padding: 4px 8px;
    /*width: 90px;*/
    font-size: 13px;
    font-weight: 600;
    line-height: 26px;
    margin-top: 10px;
}

[data-theme='light-mode'] .btn_104_blue_outline:hover {
    background-color: #3a9ad9;
    /*border: 1px solid #3a9ad9;*/
    color: #FFF;
    border-radius: 0.25rem;
    text-align: center;
    cursor: pointer;
    letter-spacing: -1px;
    height: 26px;
    line-height: 26px;
    padding: 4px 8px;
    /*width: 90px;*/
    font-size: 13px;
    font-weight: 600;
    margin-top: 10px;
}


/*재무회계팀 차트테이블 추가 */
[data-theme='light-mode'] .table_ch_v1 th {
    text-align: center;
    padding: 10px;

    color: #5c6579;
    /*height: 50px;*/
    /*border-bottom: 1px solid #242629;*/
    border-bottom: 1px solid rgba(36, 38, 41, 0.07);
    border-right: 1px solid rgba(36, 38, 41, 0.07);
    border-right: 1px solid #e5e7eb;


    border-bottom: 1px solid #e5e7eb !important;
    border-bottom: 1px solid #F5F5F5 !important;
    /* background: #16191c;
background-color:#1c1d21;
background-color:#FFF;
background: #F0F0F8;
background: #e0ebfc;
background:rgba(224,235,252, 0.5);
background-color:#f4f6fa;*/
    background-color: #F2F3F5;
    background-color: #f5f8fa;
    white-space: nowrap;
    border-collapse: separate;
    font-size: 13.5px;

}


[data-theme='light-mode'] .table_ch_v1 td {
    /* background-color: #16191c;

background-color:#1c1d21;
background-color:#FFF;	 */
    color: #60636c;
    border-bottom: 1px solid #F5F5F5;
    border-right: 1px solid #F5F5F5;
    padding: 10px;
    text-align: right;
    font-size: 13.5px;
    white-space: nowrap;

}


[data-theme='light-mode'] .table_ch_v1 td:nth-child(1) {
    /*background-color:#1c1d21;*/
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: left;
    font-size: 13.5px;
}


[data-theme='light-mode'] .table_ch_v1 th:last-child {
    border-right: none;

}


[data-theme='light-mode'] .table_ch_v1 td:last-child {
    border-right: none;

}

[data-theme='light-mode'] .table_1 th:last-child {
    border-right: none;

}


[data-theme='light-mode'] .table_ch th {
    text-align: center;
    padding: 7px;
    color: #5c6579;
    border-bottom: 1px solid rgba(36, 38, 41, 0.07);
    border-right: 1px solid rgba(36, 38, 41, 0.07);
    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
    background-color: #f6f8fa;
    border-collapse: separate;
}

[data-theme='light-mode'] .table_ch td {
    background-color: #FFF;
    color: #60636c;
    border-bottom: 1px solid #eaeaea;
    padding: 7px;
    text-align: right;
}


[data-theme='light-mode'] .table_ch tr:first-child {
    color: #2764f7;
}

[data-theme='light-mode'] .table_ch tr:hover td {

    background-color: rgba(239, 245, 253, 0.3);
    /*background-color:#F4F6FA;*/
    /*background-color:#f0f6fe;*/
}

[data-theme='light-mode'] .table_ch th:last-child {

    top: 0;
    padding: 7px;
    /*background: #16191c;
	 background-color:#1c1d21;*/
    /* color: #FFF;
	 border-right: none;*/
    /* height: 50px;

	border-right: 0px solid rgba(36, 38, 41, 0.10);*/


}

[data-theme='light-mode'] .lin_r {
    border-right: 1px solid rgba(36, 38, 41, 0.95) !important;


}

[data-theme='light-mode'] .lin_none {
    border-right: none !important;


}


[data-theme='light-mode'] .table_ch td:nth-child(2),
[data-theme='light-mode'] .table_ch td:nth-child(3),
[data-theme='light-mode'] .table_ch td:nth-child(4) {
    /*background-color:#1c1d21;*/
    color: #60636c;
    background-color: #FFF;
    padding: 10px;
    text-align: left;
}


[data-theme='light-mode'] .chco_warp {
    margin-top: 20px;
    width: 100%;
    float: left;
    display: block;
}

[data-theme='light-mode'] .chco1 {
    background: #e1463a;
    width: 35px;
    height: 12px;
    display: inline-block;
}


[data-theme='light-mode'] .chco2 {
    background: #8aaf53;
    width: 35px;
    height: 12px;
    display: inline-block;
}

[data-theme='light-mode'] .chco3 {
    background: #8e71d0;
    width: 35px;
    height: 12px;
    display: inline-block;
}


[data-theme='light-mode'] .chco4 {
    background: #ee7e38;
    width: 35px;
    height: 12px;
    display: inline-block;
}

[data-theme='light-mode'] .chco5 {
    background: #d2d3d5;
    width: 35px;
    height: 12px;
    display: inline-block
}


[data-theme='light-mode'] .chco_tix {
    display: inline-block;
    font-size: 12px;
    margin-right: 7px;
}


[data-theme='light-mode'] .bnt_ch_input {
    float: right;
    cursor: pointer;
    display: inline-block;
    padding: 0px 12px;
    height: 32px;

    border: 1px solid #F2F2F2;
    border: 1px solid #92c294;
    border-radius: 6px;
    transition: 0.2s;
    /*color:#3490DE;*/
    text-align: center;
    line-height: 32px;
    font-weight: 600;
    margin-right: 6px;
    color: #2e7d32;
    /* background-color:#F4F4FA;*/

}

[data-theme='light-mode'] .flaticon2-avatar:before {
    content: "\f10a";
}


[data-theme='light-mode'] .bnt_ch_input:hover {
    float: right;
    cursor: pointer;
    display: inline-block;
    padding: 0px 12px;
    height: 32px;
    /* background: #3490DE;*/

    border: 1px solid rgba(10, 187, 135, 0.1);
    border-radius: 10px;
    transition: 0.2s;
    /*color:#457b3b;*/
    text-align: center;
    line-height: 32px;
    font-weight: 600;
    margin-right: 6px;

    background: rgba(10, 187, 135, 0.1);


}


[data-theme='light-mode'] .btn_ch_s {
    background: #272b31;
    opacity: 0.8 !important;
    color: #FFF;
    border: 1px solid transparent;
    display: inline-block;
    padding: 0px 7px 0px 7px;
    height: 24px;
    border-radius: 4px;
    text-align: center;
    line-height: 24px;
    margin: 0px 1px 0px 10px;

}

[data-theme='light-mode'] .btn_ch {
    background: #272b31;
    opacity: 0.4 !important;
    color: #FFF;
    border: 1px solid transparent;
    display: inline-block;
    padding: 0px 7px 0px 7px;
    height: 24px;
    border-radius: 4px;
    text-align: center;
    line-height: 24px;
    margin: 0px 1px 0px 1px;

}

[data-theme='light-mode'] .btn_ch:hover {
    background: #272b31;
    opacity: 0.8 !important;
    color: #FFF;
    border: 1px solid transparent;
    display: inline-block;
    padding: 0px 7px 0px 7px;
    height: 24px;
    border-radius: 4px;
    text-align: center;
    line-height: 24px;
    margin: 0px 1px 0px 1px;

}

/*220915 센터별 수지 입력 테이블*/


[data-theme='light-mode'] .table_no {
    box-sizing: border-box;

    font-size: 14px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;
    /*-webkit-box-shadow: 1px 1px 1px 1px black;
box-shadow: 1px 1px 1px 1px black;*/
    border-radius: 6px;
    cursor: pointer;
    letter-spacing: 0px;
}

[data-theme='light-mode'] .su .table_no .input {
    width: 110px;
    background-color: #0f0e10;
    text-align: right;
    padding-right: 7px;
    color: #c8c7ca;
    box-shadow: none;

}

[data-theme='light-mode'] .su .table_no .input_gr {
    width: 110px;
    background-color: #292d34;
    text-align: right;
    padding-right: 7px;
    color: #c8c7ca;
    box-shadow: none;

}

[data-theme='light-mode'] .table_no th {
    text-align: center;
    padding: 6px;
    /* background: #16191c; */
    background-color: #1c1d21;
    color: #c8c7ca;
    color: #FFF;
    opacity: 0.85;
    height: 36px;
    border-bottom: 1px solid #242629;
    border-right: 1px solid rgba(36, 38, 41, 0.95);

}

[data-theme='light-mode'] .table_no td {
    /* background-color: #16191c;*/

    background-color: #1c1d21;
    color: #60636c;
    border-bottom: 1px solid rgba(36, 38, 41, 0.4);

    padding: 10px;
    text-align: right;

}

[data-theme='light-mode'] .table_no tr:hover td {
    /*background-color:#0f0e10;*/
    background-color: #000;
    color: #FFF;
}

[data-theme='light-mode'] .table_no th:last-child {

    top: 0;
    padding: 6px;
    /*background: #16191c; */
    background-color: #1c1d21;
    color: #FFF;
    height: 36px;
    border-bottom: 1px solid #242629;
    border-right: none;

}

[data-theme='light-mode'] .lin_r {
    border-right: 1px solid rgba(36, 38, 41, 0.95) !important;
}


[data-theme='light-mode'] .table_no td:nth-child(2) {
    background-color: #1c1d21;
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: left;
}


/*220915 센터별 수지 입력 혼합형 테이블*/

[data-theme='light-mode'] .su .table_no1 .input {
    width: 120px;
    background-color: #0f0e10;
    text-align: right;
    padding-right: 7px;
    color: #c8c7ca;
    box-shadow: none;
    height: 33px;

}

[data-theme='light-mode'] .su .table_no1 .input_gr {
    width: 110px;
    background-color: #292d34;
    text-align: right;
    padding-right: 7px;
    color: #c8c7ca;
    box-shadow: none;

}

[data-theme='light-mode'] .table_no1 {
    box-sizing: border-box;
    font-weight: 400;
    font-size: 13.5px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;

    /*-webkit-box-shadow: 1px 1px 1px 1px black;
box-shadow: 1px 1px 1px 1px black;*/

    border-radius: 6px;
    cursor: pointer;
    letter-spacing: 0px;
}


[data-theme='light-mode'] .table_no1 input[type="text"] {
    text-align: right;
    padding-right: 6px;
    border: 1px solid #f1f3f4;
    background-color: #f1f3f4;
    background: rgba(39, 100, 247, 0.10);
}


[data-theme='light-mode'] .table_no1 th {
    padding: 7px;
    /* background: #16191c;
background-color:#1c1d21;
	border-bottom: 1px solid #242629;*/

    /*
	background-color:#272b31;
color: #c8c7ca;
	opacity: 0.85;
color: #FFF; */

    color: #3669f5;
    color: #333;

    border-bottom: 1px solid #eaeaea;
    /*border-right: 1px solid rgba(36, 38, 41, 0.95);*/
    line-height: 30px;
}

[data-theme='light-mode'] .table_no1 td {
    background-color: #FFF;
    color: #60636c;
    border-bottom: 1px solid rgba(36, 38, 41, 0.1);
    text-align: right;
    padding: 4px;
    text-align: center;
    height: 42px;
}

[data-theme='light-mode'] .table_no1 .rline {
    border-right: 1px solid rgba(36, 38, 41, 0.1);
}

[data-theme='light-mode'] .table_no1 .btline {
    border-bottom: 1px solid rgba(36, 38, 41, 0.1);
}


[data-theme='light-mode'] .table_no1 tr:hover td {
    /*background-color:#0f0e10;*/


}

[data-theme='light-mode'] .arrow_r {
    margin-right: 10px;
    color: rgba(66, 104, 238, 0.38);
}

.t_center {
    text-align: center !important;
}


[data-theme='light-mode'] .po_v {
    background: rgba(188, 196, 240, 0.36) !important;
    color: #333 !important;
}

[data-theme='light-mode'] .line_through {
    color: #8e71d0;
    text-decoration: line-through;
}

[data-theme='light-mode'] .po {

    text-align: left !important;
    padding-left: 20px !important;
}

[data-theme='light-mode'] .po_bg {
    /*background-color: #fffdef;
	 background:rgba(247, 196, 247, 0.48)

	 background:rgba(247, 196, 247, 0.48)!important;
	background:rgba(247, 216, 188, 0.4)!important; */
    background-color: rgba(206, 230, 188, 0.25) !important;

}

[data-theme='light-mode'] .po_bg_y {

    background: rgba(247, 216, 188, 0.4) !important;


}

[data-theme='light-mode'] .po_ff {
    color: #FFF !important;
}

[data-theme='light-mode'] .po_31 {
    color: #31BEB3 !important;
}

[data-theme='light-mode'] .table_no1 td:last-child {
    padding-right: 6px;
    text-align: right;
    font-weight: bold;
}

[data-theme='light-mode'] .lp {
    text-align: left !important;
    padding-left: 20px !important;
}


[data-theme='light-mode'] .fa-long-arrow-alt-up, .fa-long-arrow-alt-down {
    color: #59595c;
    color: #999;
}


[data-theme='light-mode'] .fa-long-arrow-alt-up:hover, .fa-long-arrow-alt-down:hover {
    color: darkcyan
}

[data-theme='light-mode'] .fa-long-arrow-alt-down {
    margin-left: 1px;
}

[data-theme='light-mode'] .rd_lb {
    border-bottom-left-radius: 6px !important;
    border-bottom: 0px !important;
}

[data-theme='light-mode'] .rd_lb0 {
    border-bottom-left-radius: 0px !important;
}

[data-theme='light-mode'] .profit_close_span {
    font-weight: 500;
    border: 1px solid #ff6a2f;
    border-radius: 1rem;
    color: #ff6a2f;
    padding: 3px 13px 3px;
    font-size: 14px;
    margin: 0;

    font-weight: 400;
    /* box-shadow: 1px 1px 1px 1px black;*/
}

/*
.profit_close_span:hover {
    border:  1px solid #ff6a2f;
    border-radius: 1rem;
    color: #FFF;
    padding: 1px 13px 2px;
    font-size: 13.5px;
    margin: 0;
    font-weight: 400;
    background: #ff6a2f;
    box-shadow: 1px 1px 1px 1px black;
}
*/


[data-theme='light-mode'] .btn_profit_save {
    font-weight: 500;
    background: rgba(122, 122, 122, 0.99);
    color: #FFF;
    display: inline-block;
    padding: 0px 14px 0px 14px;
    height: 30px;
    border-radius: 4px;
    vertical-align: middle;
    text-align: center;
    line-height: 30px;
    /* box-shadow: 1px 1px 1px 1px black;*/
}

[data-theme='light-mode'] .btn_profit_save:hover {
    background: rgba(122, 122, 122, 0.94);
    color: #FFF;
    display: inline-block;
    padding: 0px 14px 0px 14px;
    height: 30px;
    border-radius: 4px;
    vertical-align: middle;
    text-align: center;
    line-height: 30px;
    /*  box-shadow: 1px 1px 1px 1px black;*/
}

[data-theme='light-mode'] .btn_profit_close {

    font-weight: 500;
    background: rgba(255, 106, 47, 0.88);
    color: #FFF;
    display: inline-block;
    padding: 0px 14px 0px 14px;
    height: 30px;
    border-radius: 4px;
    vertical-align: middle;
    text-align: center;
    line-height: 30px;
    /* box-shadow: 1px 1px 1px 1px black;*/
}

[data-theme='light-mode'] .btn_profit_close:hover {
    background: rgba(255, 106, 47, 1);
    color: #FFF;
    display: inline-block;
    padding: 0px 14px 0px 14px;
    height: 30px;
    border-radius: 4px;
    vertical-align: middle;
    text-align: center;
    line-height: 30px;
    /*box-shadow: 1px 1px 1px 1px black;*/
}


[data-theme='light-mode'] .profit_temp_span {
    border: 1px solid #67c6fd;
    border-radius: 1rem;
    color: #67c6fd;
    padding: 3px 13px 3px;
    font-size: 13.5px;
    margin: 0;
    font-weight: 500;
    /*box-shadow: 1px 1px 1px 1px black;*/
}


/*
.profit_temp_span:hover {
    border: 1px solid #67c6fd;
    border-radius: 1rem;
    color: #FFF;
    padding: 1px 13px 2px;
    font-size: 13.5px;
    margin: 0;

    background-color: #67c6fd;
    box-shadow: 1px 1px 1px 1px black;
}

 */


/* 모달 박스 1*/

[data-theme='light-mode'] .mobox1 {
    display: inline-block;
    /*background-color: #29292B;
background-color:#1b1d20; */
    background-color: #272b31;
    width: 300px;
    height: 470px;
    border-radius: 10px;
    padding: 20px;
    -webkit-box-shadow: 1px 1px 1px 1px black;
    box-shadow: 1px 1px 1px 1px black;

}

[data-theme='light-mode'] .mobox2 {
    display: inline-block;
    /*background-color: #29292B; */
    background-color: #272b31;
    width: 694px;
    height: 470px;
    border-radius: 10px;
    padding: 20px;
    margin-left: 15px
}

[data-theme='light-mode'] .mobox3 {
    float: left;
    margin-left: 20px;
    vertical-align: top;
    width: 350px;
    height: 427px;
}


[data-theme='light-mode'] .mo_upload {
    border: 1px dashed #ddd;

    height: 120px;
    border-radius: 10px;
    color: #60636c;
    margin: 5px;
    text-align: center;
    padding: 25px;

}


[data-theme='light-mode'] .mo_upload:hover {
    border: 1px dashed #2985ff;
    height: 120px;
    border-radius: 10px;
    color: #60636c;
    margin: 5px;
    padding: 25px;
}

[data-theme='light-mode'] .mo_upload .pd18 {
    padding: 18px;
}

/* 모달 테이블 */
[data-theme='light-mode'] .co_w {
    color: #FFF;
}

[data-theme='light-mode'] .table_mo .fs24 {
    font-size: 24px;
    color: red;
}

[data-theme='light-mode'] .table_mo .fs12 {
    font-size: 12px;
}

[data-theme='light-mode'] .table_mo .card {

    text-align: right;
    font-size: 13.5px;
    padding-bottom: 7px;
    color: #FFF;
}

[data-theme='light-mode'] .linetop {

    border-top: 1px solid rgba(0, 0, 0, 0.4);
    height: 30px;
    padding-top: 7px;
}

[data-theme='light-mode'] .table_mo .add {
    font-size: 13px;
    height: 50px;
    vertical-align: top;
}

[data-theme='light-mode'] .dis_b {
    display: block !important;

}

[data-theme='light-mode'] .table_mo td:nth-child(2) {
    text-align: right;
}

[data-theme='light-mode'] .table_mo {

    box-sizing: border-box;
    width: 100%;
    font-size: 13px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;
    height: 427px !important;
    color: #60636c;

}

[data-theme='light-mode'] .talbe_mo td {
    padding: 10px;
    text-align: left;
}


[data-theme='light-mode'] .table_mo1 {
    box-sizing: border-box;
    width: 100%;
    font-size: 13px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;
    /*height: 427px !important; */
    color: #60636c;
    text-align: left;
}

[data-theme='light-mode'] .talbe_mo1 td {
    padding: 10px;
    text-align: left;

}

[data-theme='light-mode'] .ponu {
    color: #2985ff;
    margin-left: 4px;
}

[data-theme='light-mode'] .table_mo1 td:nth-child(1) {
    width: 73px;
}


[data-theme='light-mode'] .warp {

    padding: 25px 0px 10px 0px !important;

}


/*법인카드 영수증 관리 테이블   */

[data-theme='light-mode'] .icon18 {
    height: 18px;
}


/*법인카드 영수증 관리 테이블  th center*/
[data-theme='light-mode'] .table_2 {
    width: 100%;
    font-size: 14px;
    white-space: nowrap;
    text-align: center;
    border-spacing: 0;
    -webkit-box-shadow: 1px 1px 1px 1px black;
    box-shadow: 1px 1px 1px 1px black;
    border-radius: 6px;
}


[data-theme='light-mode'] .table_2 th {

    position: sticky;
    top: 0;
    padding: 10px;
    /*background: #16191c; */
    background-color: #1c1d21;
    color: #FFF;
    height: 50px;
    border-bottom: 1px solid #242629;
    border-right: 1px solid rgba(36, 38, 41, 0.95);

}


[data-theme='light-mode'] .table_2 th:last-child {
    position: sticky;
    top: 0;
    padding: 10px;
    /*background: #16191c; */
    background-color: #1c1d21;
    color: #FFF;
    height: 50px;
    border-bottom: 1px solid #242629;
    border-right: none;

}


[data-theme='light-mode'] .table_2 td {

    background-color: #1c1d21;
    color: #60636c;
    /*   background-color: #16191c;
border-bottom: 1px solid #242629;*/
    padding: 10px;
    border-bottom: 1px solid rgba(36, 38, 41, 0.5);

}


[data-theme='light-mode'] .table_2 td:nth-child(10) {
    background-color: #1c1d21;
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: right;
}


[data-theme='light-mode'] .table_2 td:nth-child(3) {
    background-color: #1c1d21;
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: left;
}

[data-theme='light-mode'] .table_2 td:nth-child(4) {
    background-color: #1c1d21;
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: left;
}

[data-theme='light-mode'] .table_2 td:nth-child(7) {
    background-color: #1c1d21;
    color: #60636c;
    /*border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: left;
}


[data-theme='light-mode'] .table_2 td:nth-child(8) {
    background-color: #1c1d21;
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: left;
}


[data-theme='light-mode'] .table_2 td:nth-child(9) {
    background-color: #1c1d21;
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: left;
}


[data-theme='light-mode'] .table_2 tr:hover td {
    /*background-color:#0f0e10;*/
    background-color: rgba(15, 14, 16, 0.2);
    color: #FFF;
}


[data-theme='light-mode'] .table_3 {
    width: 100%;
    font-size: 14px;
    white-space: nowrap;
    text-align: center;
    border-spacing: 0;
    -webkit-box-shadow: 1px 1px 1px 1px black;
    box-shadow: 1px 1px 1px 1px black;
    border-radius: 6px;

}


[data-theme='light-mode'] .table_3 th {
    position: sticky;
    top: 0;
    padding: 10px;
    /*background: #16191c; */
    background-color: #1c1d21;
    color: #FFF;
    height: 50px;
    border-bottom: 1px solid #242629;
    border-right: 1px solid rgba(36, 38, 41, 0.95);

}


[data-theme='light-mode'] .table_3 td {

    background-color: #1c1d21;
    color: #60636c;
    /*   background-color: #16191c;
border-bottom: 1px solid #242629;*/
    padding: 10px;
    border-bottom: 1px solid rgba(36, 38, 41, 0.5);

}


[data-theme='light-mode'] .table_3 td:nth-child(5) {
    background-color: #1c1d21;
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: left;
}

[data-theme='light-mode'] .table_3 td:nth-child(6) {
    background-color: #1c1d21;
    color: #60636c;
    /* background-color: #16191c;
	border-bottom: 1px solid #242629;*/
    padding: 10px;
    text-align: right;
}


[data-theme='light-mode'] .table_3 tr:hover td {
    /*background-color:#0f0e10;*/
    background-color: rgba(15, 14, 16, 0.2);
    color: #FFF;
}


/*  센터 매출 월별/분기별/연도별 버튼 */
[data-theme='light-mode'] .ant-radio-wrapper {
    align-items: center;
    box-sizing: border-box;
    color: #242a30;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 400;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.5;
    list-style: none;
    margin: 0 8px 0 0;
    padding: 0;
    text-align: left;
    text-align: center;
    white-space: nowrap
}

[data-theme='light-mode'] .ant-radio-wrapper .ant-radio-inner {
    transition: .15s
}

[data-theme='light-mode'] .ant-radio-wrapper:hover .ant-radio .ant-radio-inner {
    background-color: rgba(36, 42, 48, .04)
}

[data-theme='light-mode'] .ant-radio-wrapper:hover .ant-radio-checked .ant-radio-inner {
    background-color: #06a016
}

[data-theme='light-mode'] .ant-radio-wrapper:active .ant-radio .ant-radio-inner {
    -webkit-transform: scale(.9);
    transform: scale(.9);
    transition: .03s
}

[data-theme='light-mode'] .ant-radio-wrapper-disabled {
    opacity: .6
}

[data-theme='light-mode'] .ant-radio {
    box-sizing: border-box;
    color: #242a30;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.5;
    list-style: none;
    margin: 0;
    outline: none;
    padding: 0;
    position: relative;
    text-align: left
}

[data-theme='light-mode'] .ant-radio-checked:after {
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    visibility: hidden;
    width: 100%
}

[data-theme='light-mode'] .ant-radio-inner {
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(36, 42, 48, 0), inset 0 0 0 2px rgba(36, 42, 48, .2);
    display: block;
    height: 20px;
    left: 0;
    position: relative;
    top: 0;
    width: 20px
}

[data-theme='light-mode'] .ant-radio-inner:after {
    background-color: #fff;
    border-radius: 50%;
    content: " ";
    display: table;
    height: 6px;
    left: 7px;
    opacity: 0;
    position: absolute;
    top: 7px;
    -webkit-transform: scale(-1);
    transform: scale(-1);
    width: 6px
}

[data-theme='light-mode'] .ant-radio-input {
    bottom: 0;
    cursor: pointer;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

[data-theme='light-mode'] .ant-radio-checked .ant-radio-inner {
    background-color: #07b419;
    box-shadow: 0 0 0 0 rgba(36, 42, 48, 0)
}

[data-theme='light-mode'] .ant-radio-checked .ant-radio-inner:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

[data-theme='light-mode'] .ant-radio-button-wrapper {
    align-items: center;
    border-radius: 6px; /* color:#3c4651; */
    cursor: pointer;
    display: inline-flex;
    font-size: 13px;
    font-weight: 500;
    height: 30px;
    justify-content: center;
    margin: 0;
    padding: 0 14px;
    position: relative;
    white-space: nowrap
}

/* 버튼 전체 bg */
[data-theme='light-mode'] .ant-radio-button-wrapper:before {
    background-color: rgba(85, 99, 114, .6);
    border-radius: 0;
    bottom: 0;
    bottom: -2px;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    top: -2px;
    transition: .15s
}

[data-theme='light-mode'] .ant-radio-button-wrapper:first-child:before {
    border-bottom-left-radius: 6px;
    border-top-left-radius: 6px;
    left: -2px
}

[data-theme='light-mode'] .ant-radio-button-wrapper:last-child:before {
    border-bottom-right-radius: 6px;
    border-top-right-radius: 6px;
    right: -2px
}

[data-theme='light-mode'] .ant-radio-button-wrapper:hover:not(.ant-radio-button-wrapper-checked):not(.ant-radio-button-wrapper-disabled) {
    color: #ccc;
}

[data-theme='light-mode'] .ant-radio-button-wrapper:hover:not(.ant-radio-button-wrapper-checked):not(.ant-radio-button-wrapper-disabled):after {
    opacity: .06
}

[data-theme='light-mode'] .ant-radio-button-wrapper a {
    color: #3c4651
}

[data-theme='light-mode'] .ant-radio-button-wrapper > .ant-radio-button {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

[data-theme='light-mode'] .ant-radio-button-wrapper .ant-radio-inner, .ant-radio-button-wrapper input[type=checkbox], .ant-radio-button-wrapper input[type=radio] {
    height: 0;
    opacity: 0;
    pointer-events: none;
    width: 0
}

[data-theme='light-mode'] .ant-radio-button-wrapper .ant-radio-inner.focus-visible, .ant-radio-button-wrapper input[type=checkbox].focus-visible, .ant-radio-button-wrapper input[type=radio].focus-visible {
    box-shadow: 0 0 0 2px #000
}

[data-theme='light-mode'] .ant-radio-button-wrapper .ant-radio-inner:focus-visible, .ant-radio-button-wrapper input[type=checkbox]:focus-visible, .ant-radio-button-wrapper input[type=radio]:focus-visible {
    box-shadow: 0 0 0 2px #000
}

[data-theme='light-mode'] .ant-radio-button-wrapper-disabled {
    color: rgba(85, 99, 114, .5);
    cursor: not-allowed
}

[data-theme='light-mode'] .ant-radio-button-wrapper-disabled.ant-radio-checked {
    box-shadow: none;
    cursor: not-allowed
}

[data-theme='light-mode'] .ant-radio-disabled {
    color: rgba(85, 99, 114, .5);
    cursor: not-allowed
}

[data-theme='light-mode'] .ant-radio-disabled + span, .ant-radio-disabled .ant-radio-inner, .ant-radio-disabled .ant-radio-input {
    cursor: not-allowed
}

[data-theme='light-mode'] span.ant-radio + * {
    padding-left: 8px;
    padding-right: 12px
}

[data-theme='light-mode'] .ant-radio-group {
    border-radius: 8px;
    display: inline-flex;
    position: relative;
}

[data-theme='light-mode'] .ant-radio-group .ant-radio-button-wrapper {
    margin-bottom: 2px;
    margin-top: 2px;
    overflow: visible;
    width: 100%
}

[data-theme='light-mode'] .ant-radio-group .ant-radio-button-wrapper:first-child {
    margin-left: 2px
}

[data-theme='light-mode'] .ant-radio-group .ant-radio-button-wrapper:last-child {
    margin-right: 2px
}

[data-theme='light-mode'] .ant-radio-group .ant-radio-button-wrapper:not(:first-child):after {

    /* 220901   수정 background-color: rgba(36, 42, 48, .10);*/
    background-color: #ddd;
    opacity: 0.3;
    content: "";
    height: 50%;
    left: 0;
    position: absolute;
    transition: .3s;
    width: 1px
}

[data-theme='light-mode'] .ant-radio-group .ant-radio-button-wrapper > .ant-radio-button {
    background-color: #242a30;
    border-radius: 4px;
    opacity: 0;
}

[data-theme='light-mode'] .ant-radio-group .ant-radio-button-wrapper > .ant-radio-button:hover {
    opacity: .04;
    -webkit-transform: none;
    transform: none
}

[data-theme='light-mode'] .ant-radio-group .ant-radio-button-wrapper > .ant-radio-button:active {
    opacity: .08
}

[data-theme='light-mode'] .ant-radio-group-large .ant-radio-button-wrapper {
    font-size: 14px;
    height: 36px;
    padding: 0 18px
}

[data-theme='light-mode'] .ant-radio-group-small .ant-radio-button-wrapper {
    font-size: 12px;
    height: 26px;
    padding: 0 10px
}

[data-theme='light-mode'] .ant-radio-group-solid .ant-radio-button-wrapper {
    background-color: transparent
}

[data-theme='light-mode'] .ant-radio-group-solid .ant-radio-button-wrapper:before {
    opacity: 0
}

[data-theme='light-mode'] .ant-radio-group-solid .ant-radio-button-wrapper-checked {
    background-color: #3c4651;
    color: #fff
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper {
    overflow: visible
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked.ant-radio-button-wrapper-disabled .ant-radio-button-checked {
    cursor: not-allowed
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked.ant-radio-button-wrapper-disabled .ant-radio-button-checked + span {
    cursor: not-allowed;
    opacity: .6
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked {
    cursor: default;
    position: relative
}

/* 블록 체크*/
[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked > span.ant-radio-button-checked {
    background-color: #fff;
    bottom: 0;
    box-shadow: 0 4px 8px 0 rgba(36, 42, 48, .04);
    left: 0;
    opacity: 0.8;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked > span.ant-radio-button-checked:hover {
    opacity: 1
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked > span.ant-radio-button-checked + span {
    color: #242a30;
    z-index: 1
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked + .ant-radio-button-wrapper:after, .ant-radio-group-outline .ant-radio-button-wrapper-checked:after {
    opacity: 0;
    -webkit-transform: scaleY(0);
    transform: scaleY(0)
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked.focus-visible {
    box-shadow: 0 0 0 4px rgba(58, 151, 212, .3), 0 0 0 1px rgba(36, 42, 48, .24)
}

[data-theme='light-mode'] .ant-radio-group-outline .ant-radio-button-wrapper-checked:focus-visible {
    box-shadow: 0 0 0 4px rgba(58, 151, 212, .3), 0 0 0 1px rgba(36, 42, 48, .24)
}

/*****************************************************************************************************************************************************/


[data-theme='light-mode'] .arr span {
    position: relative;
    margin-left: 6px;
    top: 2px;
}

[data-theme='light-mode'] .arr span::before {
    content: '';
    width: 0px; /* 사이즈 */
    height: 0px; /* 사이즈 */
    border: 5.5px solid transparent;
    border-top: 0px;
    border-bottom-color: #4C5C77; /* 선 두께 */
    border-right: 0px; /* 선 두께 */
    display: inline-block;
    transform: rotate(-135deg); /* 각도 */
    position: absolute;
    top: 0px; /* 기본 0px 값으로 해주세요 */
    left: 0px; /* 기본 0px 값으로 해주세요 */
    opacity: 0.6;


}

[data-theme='light-mode'] .arr span::after {
    content: '';
    width: 0px; /* 사이즈 */
    height: 0px; /* 사이즈 */
    border: 5.5px solid transparent;
    border-top: 0px solid #4C5C77;
    border-bottom-color: #4C5C77; /* 선 두께 */
    border-right: 0px solid #4C5C77; /* 선 두께 */
    display: inline-block;
    transform: rotate(45deg); /* 각도 */
    position: absolute;
    top: 4px; /* 기본 0px 값으로 해주세요 */
    left: 0px; /* 기본 0px 값으로 해주세요 */
    opacity: 0.6;

}


/* ================================
 * Top-bar Toggle Button 탑 접힘 토글
 * ================================ */
[data-theme='light-mode'] input[id="top-toggle"] {
    display: none;
}

[data-theme='light-mode'] .btn_top-toggle {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    display: block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 40px;
    font-size: 18px;
    text-align: center;
    color: rgba(0, 0, 0, 0.15);
    cursor: pointer;
    transition: .15s;
}

[data-theme='light-mode'] .btn_top-toggle:hover {
    background: rgba(0, 0, 0, 0.1);
    color: #fff;
    transition: .15s;
}

[data-theme='light-mode'] .info-box {
    display: none;
    z-index: 1000;
    position: absolute;
    padding: 0.5em;
    border-radius: 6px;
    white-space: nowrap;
    line-height: 1.5em;
    background: rgba(0, 0, 0, 0.3);
    color: #fff;
    font-weight: 600;
    font-size: 14px;
}

[data-theme='light-mode'] .btn_top-toggle .info-box {
    top: 46px;
    right: 0;
}

[data-theme='light-mode'] .btn_top-toggle:hover .info-box {
    display: block;
}

[data-theme='light-mode'] .btn_top-bar_menu {
    position: relative;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
}

[data-theme='light-mode'] .btn_top-bar_menu .fa {
    line-height: 40px;
    transition: .15s;
}

/* 탑 접힘 후 화살표 */
[data-theme='light-mode'] input[id="top-toggle"]:checked + label {

}

[data-theme='light-mode'] input[id="top-toggle"]:checked + label .fa {
    transform: rotate(180deg);
    transition: .15s;
}

[data-theme='light-mode'] input[id="top-toggle"]:checked + label:hover .info-box {
    display: none;
}

/* 탑 접힘 후 top-bar 이동 */
[data-theme='light-mode'] input[id="top-toggle"]:checked + label + .top-bar {
    top: -64px;
    transition: 0.25s;
}

/* 탑 접힘 후 컨텐츠영역 세로 크기*/
[data-theme='light-mode'] input[id="top-toggle"]:checked + label + .top-bar + .contents {
    position: absolute;
    top: 0;
    height: 100%;
}

[data-theme='light-mode'] input[id="side-toggle"]:checked + label {
    left: 0;
    top: 0;
    padding: 0 16px;
    width: 80px;
    height: 100%;
    border-right: 1px solid #E2E5E9;
    box-shadow: 0 0 10px 0 rgb(50 61 90 / 20%);
    background: #1e1f22;
}


[data-theme='light-mode'] .state-bar-area {
    position: sticky;
    top: 0;
    z-index: 1;
    font-size: 0;
}

[data-theme='light-mode'] .state-bar {
    width: 100%;
    height: 80px;
    background: #fff;
    border-bottom: 1px solid #E2E5E9;
}

[data-theme='light-mode'] .state {
    display: inline-block;
    height: 60px;
    vertical-align: top;
}

[data-theme='light-mode'] .state-box {
    display: inline-block;
    margin: 16px 16px 0 0;
    padding: 0 1.3em 0 1.1em;
    height: 48px;
    border-radius: 10px;
    background: #F4F4FA;
    text-align: center;
    font-size: 15px;
}

[data-theme='light-mode'] .state_icon {
    display: inline-block;
    margin-top: 8px;
    width: 32px;
    height: 32px;
    border-radius: 100%;
    background: #00AD94;
    color: #fff;
}

[data-theme='light-mode'] .state_icon .fa {
    margin-top: 9px;
    opacity: 0.7;
}

[data-theme='light-mode'] .state_text {
    display: inline-block;
    height: 32px;
    line-height: 32px;
    color: #323D5A;
}

[data-theme='light-mode'] .state_time {
    margin-left: 10px;
    display: inline-block;
    height: 32px;
    line-height: 32px;
    font-size: 1.1em;
    color: #33C679;
    font-weight: 700;
}

[data-theme='light-mode'] .state_btn {
    display: inline-block;
    margin-top: 16px;
    vertical-align: top;
    padding: 6px;
    height: 48px;
    border-radius: 10px;
    background: #F4F4FA;
}

[data-theme='light-mode'] .state_btn button {
    position: relative;
    width: 72px;
    height: 36px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    transition: .5s;
}

[data-theme='light-mode'] .state_btn button ~ button {
    margin-left: 6px;
}

/* 상담화면-상태 버튼 */
[data-theme='light-mode'] .btn_normal {
    color: #89919B;
    background: #E9EBF0;
}

[data-theme='light-mode'] .btn_normal:hover {
    background: #FFF;
    color: #061139;
    box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.1);
    transition: .25s;
}

[data-theme='light-mode'] .btn_active {
    color: #FFF;
    background: #00AD94;
    box-shadow: 0 -2px 0 0 rgba(0, 0, 0, 0.2) inset;
}

[data-theme='light-mode'] .btn_active:before {
    content: "";
    position: absolute;
    top: 6px;
    left: calc(50% - 2px);
    width: 4px;
    height: 4px;
    border-radius: 4px;
    background: #fff;
}

[data-theme='light-mode'] .btn_reserve {
    color: #FFF;
    background: #F15D6F;
    box-shadow: 0 -2px 0 0 rgba(0, 0, 0, 0.1) inset;
}


[data-theme='light-mode'] .state_warp {
    display: inline-block;
    font-weight: 700;
}

[data-theme='light-mode'] .state_warp ul {
    padding-inline-start: 0px !important;
}

[data-theme='light-mode'] .state_warp ul li {
    display: inline-block;
}

[data-theme='light-mode'] .state_warp ul li ~ li {
    margin-left: 8px;
}

[data-theme='light-mode'] .state_warp ul li span:first-child {
    font-size: 13px;
    padding: 0 8px 0 12px;
    color: #383E6E;
}

[data-theme='light-mode'] .state_warp .to, .state_warp .po2, .state_warp .total {
    display: inline-block;
    width: 70px;
    height: 40px;
    line-height: 40px;
    border-radius: 10px;
    text-align: center;
    color: #383E6E;
    font-size: 18px;
    font-weight: 700;
}

/* 인바운드 배경 컬러 */
[data-theme='light-mode'] .state_warp .to {
    background: #FFE8EB;
    color: #F15D6F;
}

[data-theme='light-mode'] .state_warp .po2 {
    background: #E4F8F7;
    color: #31BEB3;
}

[data-theme='light-mode'] .state_warp .total {
    background: #FFECDB;
    color: #FC9228;
}


/* 탭 메뉴 버튼
#eff2f5;*/
[data-theme='light-mode'] .tab_area.tab_chat .con-box_top {
    font-size: 16px;
}

[data-theme='light-mode'] .tab_area.tab_chat .con-box_top .list li {
    margin-right: 10px;
}

[data-theme='light-mode'] .tab_area.tab_chat .con-box_top .list li ~ li {
    margin-left: 10px;
}

[data-theme='light-mode'] .tab_area.tab_chat .con-box_top .list li ~ li:before {
    left: -10px;
}


[data-theme='light-mode'] .con-box_top .list li {
    float: left;
    position: relative;
    margin-right: 16px;
}

[data-theme='light-mode'] .con-box_top .list li:last-child {
    margin-right: 0 !important;
}

[data-theme='light-mode'] .con-box_top .list li ~ li {
    margin-left: 16px;
}

[data-theme='light-mode'] .con-box_top .list li ~ li:before {
    content: "";
    display: block;
    position: absolute;
    left: -16px;
    top: 5px;
    width: 1px;
    height: 22px;
    background: #E2E5E9;
}

[data-theme='light-mode'] .con-box_top .list li a {
    position: relative;
    display: block;
    height: 32px;
    opacity: 0.5;
}

[data-theme='light-mode'] .con-box_top .list li a:hover {
    opacity: 1;
    transition: all .25s;
}

[data-theme='light-mode'] .con-box_top .list li.is_on a {
    opacity: 1;
    transition: all .25s;
}

[data-theme='light-mode'] .con-box_top .list li.is_on:after {
    content: "";
    display: block;
    position: absolute;
    left: -8px;
    bottom: -12px;
    width: calc(100% + 16px);
    height: 3px;
    border-radius: 3px;
    background: #00AD94;
    transition: all .25s;
}

/* con-box 순서별 border, border-radius 설정*/
[data-theme='light-mode'] .con-area .con-box-area .con-box_top {
    border-left: 1px solid #E2E5E9;
    border-bottom: 1px solid #E2E5E9;
    /*border-bottom: 1px solid #eff2f5;*/
}

[data-theme='light-mode'] .con-area .con-box-area .con-box_top_1 {
    border-left: 0px solid #E2E5E9;

    border-bottom: 1px solid #E2E5E9;
    position: relative;
    padding: 0px 24px 0px 24px;
    height: 56px;
    line-height: 56px;
    font-size: 18px;
    font-weight: 700;
    color: #364168;
    background-color: #FFF;

}


[data-theme='light-mode'] .con-area .con-box-area:first-child .con-box_top {
    border-radius: 10px 0 0 0;
    border-left: 0;
}

[data-theme='light-mode'] .con-area .con-box-area:last-child .con-box_top {
    border-radius: 0 10px 0 0
}

[data-theme='light-mode'] .con-area .con-box-area:first-child .con-box {
    border-radius: 0 0 0 10px;
}

[data-theme='light-mode'] .con-area .con-box-area:last-child .con-box {
    border-radius: 0 00px 0;
}

[data-theme='light-mode'] .con-area .con-box-area:only-child .con-box_top {
    border-radius: 10px 10px 0 0;
}

[data-theme='light-mode'] .con-area .con-box-area:only-child .con-box {
    border-radius: 0 0 10px 10px;
}

[data-theme='light-mode'] .con-box_top-sub {
    display: inline-block;
    width: 32px;
    height: 32px !important;
    line-height: 32px !important;
    background: #000;
    border-radius: 8px;
    text-align: center;
}

[data-theme='light-mode'] .con-box_top-sub .fa {
    opacity: 0.7;
    font-size: 16px;
}

[data-theme='light-mode'] .con-box_top-sub:hover .fa {
    opacity: 1;
    transition: .25s;
}

/* 박스상단 - 버튼 */
[data-theme='light-mode'] .con-box_top-btn {
    position: absolute;
    top: 0;
    right: 0;
    height: 100% !important;
    background: #FFF;
    border-left: 1px solid #E2E5E9;
}

[data-theme='light-mode'] .con-box_top-btn1 {
    position: absolute;
    top: 0;
    right: 0;
    height: 100% !important;
    background: #FFF;
    border-radius: 0 10px 0 0 !important;
    /*border-left: 1px solid #1e1f22;*/
    border-left: 1px solid #E2E5E9;
    /*220823 수정 모달 팝업
background: #000;
border-left: 1px solid #E2E5E9;
background: #fff;*/
}

[data-theme='light-mode'] .con-box_top-btn2 {
    position: absolute;
    top: 0;
    right: 0;
    height: 100% !important;
    background: #FFF;
    border-radius: 0 10px 0 0 !important;
    border-left: 1px solid #E2E5E9;


    /*border-left: 1px solid #E2E5E9;*/
    /*220823 수정 모달 팝업
background: #000;
border-left: 1px solid #E2E5E9;
background: #fff;*/
}


[data-theme='light-mode'] .con-box_top-info {
    position: absolute;
    top: 0;
    right: 0;
    height: 100% !important;
    background: #FFF;
    border-radius: 0 10px 0 0 !important;
    margin-right: 20px;
}


[data-theme='light-mode'] .con-box_top-btn:hover {
    /*background: #e9effe;*/
    color: #2e5df6;
}

[data-theme='light-mode'] .con-box_top-btn1:hover {
    /*background: #e9effe;*/
    color: #2e5df6;
}

[data-theme='light-mode'] .con-box_top-btn2:hover {
    background: #e9effe;
    color: #2e5df6;
}

[data-theme='light-mode'] .con-box_top-btn:hover .fa {
    opacity: 1;
    transition: .25s;
}

[data-theme='light-mode'] .con-box-area:only-child .con-box_top-btn1 {
    border-top-right-radius: 10px;
}

[data-theme='light-mode'] .con-box {
    width: 100%;
    padding: 24px;
    position: relative;
    overflow-y: auto;
    font-size: 13px;
    background: #131418;
    background: #FFF;
    /*220823 수정 background: #fff; */
    color: #6C7293;

}

[data-theme='light-mode'] .con-box-area .con-box {

    padding: 16px 24px 24px;
    border-left: 1px solid #E2E5E9;
    max-height: calc(100% - 56px); /* con-box_top을 뺀 나머지 height */
}

[data-theme='light-mode'] .w-bottom2 {
    padding: 16px 24px;
    height: 100%;
    background-color: #FFF;
    border-left: 1px solid #E2E5E9;
    border-top: 1px solid #E2E5E9;
    border-radius: 0 0 10px 0;
    max-height: calc(100% - 0px); /* con-box_top을 뺀 나머지 height */
}

[data-theme='light-mode'] .con-box-area:first-child .con-box_bottom {
    border-radius: 0 0 0 10px;
    border-left: 0;
}

[data-theme='light-mode'] .con-area .con-box-area:first-child .con-box {
    border-left: 0;
}

[data-theme='light-mode'] .con-box-area .con-box.full {
    height: calc(100vh - 56px);
}

/* 화면에 height 꽉차도록 */
[data-theme='light-mode'] .con-box-area .con-box.full_info {
    height: calc(100vh - 56px);
    border-radius: 10px !important;
}


[data-theme='light-mode'] .con-box-area .con-box1 {
    padding: 16px 24px 24px;
    border-left: 1px solid #E2E5E9;
    /*max-height: calc(100% - 56px);*/
}


[data-theme='light-mode'] .w-bottom1 {
    padding: 16px 24px !important;
    background-color: #FFF;
    height: 100%;
    border-radius: 0 0 0 10px;
    border-left: 0;
    border-top: 1px solid #E2E5E9;
    max-height: calc(100vh - 50px) !important;


}

[data-theme='light-mode'] .w-bottom3 {
    padding: 24px 24px 9px 24px !important;
    background-color: #FFF;
    height: 100%;
    border-radius: 0 0 0 10px;
    border-left: 0;
    border-top: 1px solid #E2E5E9;
    max-height: calc(100vh) !important;
}

[data-theme='light-mode'] .con-box-area:last-child .con-box_bottom1 {
    border-radius: 0 0 10px 0;
    /*height: calc(100% - 70px);*/
}


[data-theme='light-mode'] .table-ver2 {
    text-align: left;
    font-size: 13px;
    table-layout: fixed;
}

/* 하단 영역 있는 con-box */
[data-theme='light-mode'] .con-box-area .con-box.fullx2 {
    height: 100%;
    max-height: 100%;
}

[data-theme='light-mode'] .con-box.board {
    padding: 0 0 24px 0;
}

/* 박스 전체가 테이블 형태 */

/* con-box_bottom  */
[data-theme='light-mode'] .con-box_bottom {
    border-top: 1px solid #E2E5E9;
    border-left: 1px solid #E2E5E9;
    padding: 12px 24px;
    width: 100%; height: 60px; line-height: 60px;
    background: #FFF;

}

/* con-box_bottom  */
[data-theme='light-mode'] .con-box_bottom1 {
    /*220823 수정  border-top: 1px solid #E2E5E9;*/
    border-top: 1px solid #1e1f22;
    border-left: 1px solid #E2E5E9;
    padding: 12px 24px;
    width: 100%;
    height: 60px;
    line-height: 60px;
    /*220823  수정  background: #fff;*/
    background: #FFF;
}

[data-theme='light-mode'] .con-box-area:first-child .con-box_bottom {
    border-radius: 0 0 0 10px;
    border-left: 0;
}

[data-theme='light-mode'] .con-box-area:last-child .con-box_bottom {
    border-radius: 0 0 10px 0;
}

[data-theme='light-mode'] .con-box-area:only-child .con-box_bottom {
    border-radius: 0 0 10px 10px;
    border-left: 0;
}

/* input, select */
[data-theme='light-mode'] .con-box-area input[type="text"],
[data-theme='light-mode'] .con-box-area input[type="search"],
[data-theme='light-mode'] .con-box-area select {
    text-indent: 10px;
    border-radius: 4px;
}

[data-theme='light-mode'] .con-box input[type="text"],
[data-theme='light-mode'] .con-box input[type="search"],
[data-theme='light-mode'] .con-box input[type="date"],
[data-theme='light-mode'] .con-box input[type="time"],
[data-theme='light-mode'] .con-box select,
[data-theme='light-mode'] div[class*="popup_"] input[type="text"],
[data-theme='light-mode'] div[class*="popup_"] input[type="search"],
[data-theme='light-mode'] div[class*="popup_"] select {
    height: 36px;
    text-indent: 10px;
}


[data-theme='light-mode'] .con-box-area input[type="text"],
[data-theme='light-mode'] .con-box-area input[type="search"],
[data-theme='light-mode'] .con-box-area input[type="date"],
[data-theme='light-mode'] .con-box-area input[type="time"],
[data-theme='light-mode'] .con-box-area select,
[data-theme='light-mode'] .con-box-area textarea,
[data-theme='light-mode'] div[class*="popup_"] input[type="text"],
[data-theme='light-mode'] div[class*="popup_"] input[type="search"],
[data-theme='light-mode'] div[class*="popup_"] select,
[data-theme='light-mode'] div[class*="popup_"] textarea {
    border-radius: 4px;
    border: 1px solid #E3E5EF;
    background-color: #FFF;
    height: 36px;
    color: #60636c;
}


[data-theme='light-mode'] .con-box-area input[type="text"]:focus,
[data-theme='light-mode'] .con-box-area input[type="search"]:focus,
[data-theme='light-mode'] .con-box-area input[type="date"]:focus,
[data-theme='light-mode'] .con-box-area input[type="time"]:focus,
[data-theme='light-mode'] .con-box-area select:focus,
[data-theme='light-mode'] .con-box-area textarea:focus,
[data-theme='light-mode'] .popup-table input[type="text"]:focus,
[data-theme='light-mode'] div[class*="popup_"] input[type="search"]:focus,
[data-theme='light-mode'] div[class*="popup_"] select:focus,
[data-theme='light-mode'] div[class*="popup_"] textarea:focus {
    border: 1px solid #2764f7;
    box-shadow: 0 0 0 2px rgba(0, 173, 148, 0.3);
    caret-color: #364168;
    transition: .15s;
}

[data-theme='light-mode'] .check-form input[type="checkbox"]:checked + span:before {
    background: url(/web_resources/images_ver2/check_w.png) #2764f7 no-repeat center;
    /* border: 1px solid #353839; */
    background-size: 10px;
}

[data-theme='light-mode'] .check-form input[type="checkbox"] + span:before {
    display: inline-block;
    margin-right: 5px;
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid #ddd;
    vertical-align: -3px;
    cursor: pointer;
    /* background: #1b1d20;*/
}

[data-theme='light-mode'] .con-box textarea,
[data-theme='light-mode'] div[class*="popup_"] textarea {
    padding: 10px 12px;
    line-height: 1.4em;
}

[data-theme='light-mode'] .con-box input::placeholder,
[data-theme='light-mode'] .con-box textarea::placeholder,
[data-theme='light-mode'] div[class*="popup_"] input::placeholder,
[data-theme='light-mode'] div[class*="popup_"] textarea::placeholder {
    color: #ccc;
}

[data-theme='light-mode'] .no_effect {
    border: 0 !important;
}

[data-theme='light-mode'] .no_effect:focus {
    border: 0 !important;
    box-shadow: none !important;
}

/* file upload */
[data-theme='light-mode'] .upload_filename {
    border-radius: 4px 0 0 4px !important;
    border-right: 0 !important;
}

[data-theme='light-mode'] .file-upload input[type="file"] {
    display: none;
}

[data-theme='light-mode'] .btn_find-file {
    text-align: center;
    width: 90px;
    line-height: 36px;
    background: #4E5983;
    color: #fff;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
}

/* 날짜 입력 input style */
[data-theme='light-mode'] .input_calendar {
    height: 30px;
    font-weight: 400;
}

[data-theme='light-mode'] .input_calendar div {
    display: inline-block;
    float: left;
}

[data-theme='light-mode'] .input_calendar input:first-child {
    border-radius: 4px 0 0 4px !important;
}

[data-theme='light-mode'] .input_calendar_txt {
    display: inline-block;
    width: 12px !important;
    height: 100%;
    line-height: 30px;
    text-align: center;
    border-top: 1px solid #E8EAEE;
    border-bottom: 1px solid #E8EAEE;
    color: #4C5C77;
    background: #FAFAFA;
}

[data-theme='light-mode'] .input_calendar_img {
    display: inline-block;
    width: 30px !important;
    height: 100%;
    line-height: 30px;
    text-align: center;
    border: 1px solid #E8EAEE;
    border-left: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    color: #4C5C77;
    background: #FAFAFA;
}

[data-theme='light-mode'] .input_calendar_img .fa {
    opacity: 0.5;
    line-height: 30px;
}

[data-theme='light-mode'] .input_calendar input:last-child {
    border-radius: 0 4px 4px 0 !important;
}

/* -------------------
 * Custom-select Box
 * -------------------*/

/*the container must be positioned relative:*/
[data-theme='light-mode'] .custom-select {
    color: #4C5C77;
    position: relative;
    border-radius: 4px;
    border: 1px solid #E8EAEE;
    height: 36px;
    font-size: 13px;
    font-weight: normal;
    background: #fff;
}

[data-theme='light-mode'] .custom-select select {
    display: none; /*hide original SELECT element:*/
}

/*style the arrow inside the select element:*/
[data-theme='light-mode'] .select-selected:before {
    content: "";
    position: absolute;
    top: calc(50% - 5px);
    right: 9px;
    width: 5px;
    height: 5px;
    border: 2px solid #8F9CB2;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/*point the arrow upwards when the select box is open (active):*/
[data-theme='light-mode'] .select-selected.select-arrow-active:before {
    top: calc(50% - 2px);
    transform: rotate(225deg);
    transition: .05s;
}

[data-theme='light-mode'] .select-selected.select-arrow-active:after {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid #00AD94; /* focus일때 border Color  */
    box-shadow: 0 0 0 2px rgba(0, 173, 148, 0.3); /* focus일때 그림자  */
    border-radius: 4px;
    background: transparent;
    transition: all .25s;
}

/*style the items (options), including the selected item:*/
[data-theme='light-mode'] .select-items div, .select-selected {
    padding: 8px 16px 8px 10px;
    cursor: pointer;
    user-select: none;
    height: calc(100% + 2px);
    line-height: calc(100% + 4px);
    border: 0;
    background-color: transparent;
}

/*.select-items div:first-child {color: #818181;} 첫번째항목이 셀렉트 주제일 경우 */

[data-theme='light-mode'] .select-items div:first-child:hover {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

[data-theme='light-mode'] .select-items div:last-child:hover {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

/*style items (options):*/
[data-theme='light-mode'] .select-items {
    position: absolute;
    top: calc(100% + 2px);
    left: -1;
    right: 0;
    z-index: 99;
    padding: 0; /* 드롭다운 선택영역 위아래 여백 */
    width: calc(100% + 2px);
    border: 1px solid #E3E5EF;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 1px 4px -2px rgba(0, 0, 0, 0.3);
    transition: all .15s;
}

/*hide the items when the select box is closed:*/
[data-theme='light-mode'] .select-hide {
    display: none;
}

[data-theme='light-mode'] .select-items div {
    height: 36px;
    line-height: 18px;
}

[data-theme='light-mode'] .select-items div:hover, .same-as-selected {
    background-color: #ecf5f4 !important; /* 드롭다운 선택영역 오버 시 배경color */
}


/* 텍스트X, 개별 체크박스(테이블 내부에서 사용됨) */
[data-theme='light-mode'] table[class*="con-list"] input[class="ck_only"] {
    display: none;
}

[data-theme='light-mode'] table[class*="con-list"] input[class="ck_only"] + span {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 1px solid #C6CCE7;
    border-radius: 4px;
}

[data-theme='light-mode'] table[class*="con-list"] input[class="ck_only"]:checked + span {
    background: url(/web_resources/images_ver2/check_w.png) #8796be no-repeat center;
    border: 1px solid #8796be;
    background-size: 10px;
}

/* 체크박스 + 텍스트 */
[data-theme='light-mode'] input[class="ck_txt"] {
    display: none;
}

[data-theme='light-mode'] input[class="ck_txt"] + span:before {
    display: inline-block;
    margin-right: 5px;
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid #C6CCE7;
    vertical-align: -3px;
    background: #fff;
}

[data-theme='light-mode'] input[class="ck_txt"]:checked + span:before {
    background: url(/web_resources/images_ver2/check_w.png) #8796be no-repeat center;
    border: 1px solid #8796be;
    background-size: 10px;
}

/* 텍스트X, 개별 라디오(테이블 내부에서 사용됨) */
[data-theme='light-mode'] table[class*="con-list"] input[class="radio_only"] {
    display: none;
}

[data-theme='light-mode'] table[class*="con-list"] input[class="radio_only"] + span {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 1px solid #C6CCE7;
    border-radius: 100%;
}

[data-theme='light-mode'] table[class*="con-list"] input[class="radio_only"]:checked + span {
    background: url(/web_resources/images_ver2/radio_w.png) #8796be no-repeat center;
    border: 1px solid #8796be;
    background-size: 8px;
}

/* 라디오 + 텍스트 */
[data-theme='light-mode'] input[class="radio_txt"] {
    display: none;
}

[data-theme='light-mode'] input[class="radio_txt"] + span:before {
    display: inline-block;
    margin-right: 5px;
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 16px;
    border: 1px solid #C6CCE7;
    vertical-align: -3px;
    background: #fff;
}

[data-theme='light-mode'] input[class="radio_txt"]:checked + span:before {
    background: url(/web_resources/images_ver2/radio_w.png) #8796be no-repeat center;
    border: 1px solid #8796be;
    background-size: 8px;
}


[data-theme='light-mode'] .table_round {

}

[data-theme='light-mode'] .table_round tr:first-child th:first-child {
    -moz-border-radius: 6px 0 0 0;
    -webkit-border-radius: 6px 0 0 0;
    border-radius: 6px 0 0 0;
}

[data-theme='light-mode'] .table_round tr:first-child th:last-child {
    -moz-border-radius: 0 6px 0 0;
    -webkit-border-radius: 0 6px 0 0;
    border-radius: 0 6px 0 0;
}

[data-theme='light-mode'] .table_round tr:first-child th:only-child {
    -moz-border-radius: 6px 6px 0 0;
    -webkit-border-radius: 6px 6px 0 0;
    border-radius: 6px 6px 0 0;
}

[data-theme='light-mode'] .table_round tr:last-child td:first-child {
    -moz-border-radius: 0 0 0 6px;
    -webkit-border-radius: 0 0 0 6px;
    border-radius: 0 0 0 6px;
}

[data-theme='light-mode'] .table_round tr:last-child td:last-child {
    -moz-border-radius: 0 0 6px 0;
    -webkit-border-radius: 0 0 6px 0;
    border-radius: 0 0 6px 0;
}

[data-theme='light-mode'] .table_round tr:last-child td:only-child {
    -moz-border-radius: 0 0 6px 6px;
    -webkit-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
}

[data-theme='light-mode'] .table_round th {
    background: #EAEAF2;
}

[data-theme='light-mode'] .table_round tbody tr ~ tr {
    border-top: 1px solid #E3E5EF;
}

[data-theme='light-mode'] .table_round tbody td {
    background: #F4F4FA;
}

/* -------------------------------------------- */

[data-theme='light-mode'] .table-title {
    height: 32px;
    line-height: 32px;
    font-size: 15px;
    font-weight: 700;
    color: #353C55;
}

[data-theme='light-mode'] .title_icon {
    display: inline-block;
    height: 32px;
    width: 32px;
    border-radius: 13px;
    background: #F2F3F5;
    color: #ABAEBC;
    text-align: center;
    line-height: 32px !important;
    margin-right: 7px;

}

[data-theme='light-mode'] .title_icon .fa {
    line-height: 32px !important;
}

/* 테이블 제목 + 검색,버튼 등(서브항목) 있을 경우 _ .and_sub */
[data-theme='light-mode'] .and_sub {
    font-size: 13px;
    color: #617099;
}

[data-theme='light-mode'] .con-table {
    text-align: left;
    font-size: 13px;
}

[data-theme='light-mode'] .con-table tr {
    height: 36px;
}

[data-theme='light-mode'] .con-table th {
    color: #353C55;
}

[data-theme='light-mode'] .con-table th, .con-table td {
    padding-top: 4px;
}

[data-theme='light-mode'] thead[class="left_line"] th ~ th {
    border-left: 1px solid #EAEAEA;
}

[data-theme='light-mode'] tbody[class="left_line"] td ~ td {
    border-left: 1px solid #F5F5F5;
}

/* 테이블 공통 설정 */
[data-theme='light-mode'] table[class*="con-list"].txt-l th, table[class*="con-list"].txt-l td {
    text-align: left;
}

/* table class에 "color" 추가하여 th 부분 배경색 바꾸기*/
[data-theme='light-mode'] table[class*="con-list"].color th {
    background: #D5D8EA;
}

/* table class에 "not_hover" 추가하여 배경색 마우스오버 적용되지 않게 함 */
[data-theme='light-mode'] table[class*="con-list"].not_hover tbody tr:hover {
    background: transparent;
    cursor: auto;
}

/* table class에 "no-line" 추가하여 tbody tr에 bottom line 없애기 */
[data-theme='light-mode'] table[class*="con-list"].no-line tbody td {
    border-bottom: 0;
}

/* 테이블 ver2 */
[data-theme='light-mode'] .table-ver2 {
    text-align: left;
    font-size: 13px;
    table-layout: fixed;
}

[data-theme='light-mode'] .table-ver2 tr th {
    height: 32px;
    padding: 0 0 0.3em 0 !important;
    vertical-align: bottom !important;
    color: #353C55;
}

[data-theme='light-mode'] .table-ver2 tr td {
    padding: 0 8px 0 0 !important;
}

[data-theme='light-mode'] .table-ver2 tr td:last-child {
    padding: 0 !important;
}

/* 테이블 ver2 정보형 input,textarea,select 설정 */
[data-theme='light-mode'] .table-ver2.infor input[type="text"],
[data-theme='light-mode'] .table-ver2.infor input[type="search"],
[data-theme='light-mode'] .table-ver2.infor select,
[data-theme='light-mode'] .table-ver2.infor textarea,
[data-theme='light-mode'] .submit_img.infor {
    background: #F4F4FA;
    border: 1px solid #F4F4FA;
}

[data-theme='light-mode'] .table-ver2.infor input[type="text"]:focus,
[data-theme='light-mode'] .table-ver2.infor input[type="search"]:focus,
[data-theme='light-mode'] .table-ver2.infor select:focus,
[data-theme='light-mode'] .table-ver2.infor textarea:focus {
    background: #fff;
    border: 1px solid #00AD94;
}

[data-theme='light-mode'] textarea[class*="infor"] {
    background: #F4F4FA;
    border: 1px solid #F4F4FA;
}

[data-theme='light-mode'] textarea[class*="infor"]:focus {
    background: #fff;
    border: 1px solid #00AD94;
}

/* focus 활성화 안되도록 처리 추가 - 2021-09-30 */
[data-theme='light-mode'] .table-ver2.infor.readonly input[type="text"]:focus,
[data-theme='light-mode'] .table-ver2.infor.readonly input[type="search"]:focus,
[data-theme='light-mode'] .table-ver2.infor.readonly select:focus,
[data-theme='light-mode'] .table-ver2.infor.readonly textarea:focus {
    background: #F4F4FA;
    border: 1px solid #F4F4FA;
    box-shadow: none;
}

/* 테두리 없는 textarea 추가 - 2021-10-25 */
[data-theme='light-mode'] textarea[class*="readonly"] {
    background: #fff;
    border: 0 !important;
}

[data-theme='light-mode'] textarea[class*="readonly"]:focus {
    border: 0;
    box-shadow: none;
}

/* 셀렉트 화살표 배경img 설정 - 2021-09-28 */
[data-theme='light-mode'] .table-ver2.infor select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: url(/web_resources/images_ver2/select-arrow.png) no-repeat right 8px center;
    background-size: 10px;
    background-color: #F4F4FA;
}

[data-theme='light-mode'] .table-ver2.infor select:focus {
    background: url(/web_resources/images_ver2/select-arrow_focus.png) no-repeat right 8px center;
    background-size: 10px;
    background-color: #fff;
}

[data-theme='light-mode'] .table-ver2.infor.readonly select:focus {
    background: url(/web_resources/images_ver2/select-arrow_focus.png) no-repeat right 8px center;
    background-size: 10px;
    background-color: #F4F4FA;
}

/* 테이블 - 카테고리 등록 */
[data-theme='light-mode'] .table-cate {
    table-layout: fixed;
    font-size: 13px;
}

[data-theme='light-mode'] .table-cate tr {
    height: 48px;
}

/*.table-cate tr~tr {border-top: 1px solid #F5F5F5;}*/
[data-theme='light-mode'] .table-cate tr:first-child, .table-cate tr:last-child {
    height: 58px;
}

[data-theme='light-mode'] .table-cate tr:first-child th, .table-cate tr:first-child td {
    padding-top: 8px;
}

[data-theme='light-mode'] .table-cate tr:last-child th, .table-cate tr:last-child td {
    padding-bottom: 8px;
}

[data-theme='light-mode'] .table-cate th {
    color: #353C55;
    text-align: left;
}

[data-theme='light-mode'] .table-cate td {
    padding-right: 16px;
}

[data-theme='light-mode'] .table-cate th:first-child {
    padding-left: 24px;
}

[data-theme='light-mode'] .table-cate td:last-child {
    padding-right: 24px;
}

/* 테이블 (리스트형) */
[data-theme='light-mode'] .list-title {
    height: 30px;
    line-height: 30px;
}

[data-theme='light-mode'] .list-area {
    overflow: auto;
    border-top: 1px solid #E8E8ED;
    border-bottom: 1px solid #E8E8ED;
}

[data-theme='light-mode'] .list-area.round {
    border-radius: 4px;
    border: 1px solid #E8E8ED;
}

/* list-area를 감싸는 list-area에 dp_flex 추가 -> 하위 list-area width 균등하게 */
[data-theme='light-mode'] .list-area.dp_flex .list-area {
    flex: 1;
}

[data-theme='light-mode'] .list-area.dp_flex .list-area ~ .list-area {
    border-left: 1px solid #F0F0F8 !important;
}

[data-theme='light-mode'] .list-area.dp_flex .list-area th,
[data-theme='light-mode'] .list-area.dp_flex .list-area td {
    padding: 5px 24px;
}


[data-theme='light-mode'] .con-list {
    font-size: 13px;
    white-space: nowrap;
    text-align: center !important;
    border-spacing: 0;
}

[data-theme='light-mode'] .con-list thead th {
    position: sticky;
    top: 0;
}

[data-theme='light-mode'] .con-list tr {
    height: 40px;
}

[data-theme='light-mode'] .con-list th {
    background: #F0F0F8;
}

[data-theme='light-mode'] .con-list thead tr {
    border-bottom: 1px solid #E8E8ED;
}

[data-theme='light-mode'] .con-list tbody tr:hover {
    background: #F9F9FC;
}

[data-theme='light-mode'] .con-list th, .con-list td {
    padding: 5px 10px;
}

[data-theme='light-mode'] .con-list tr th:first-child, .con-list tr td:first-child {
    border-left: 0;
}

[data-theme='light-mode'] .con-list td {
    border-bottom: 1px solid #F5F5F5;
}

[data-theme='light-mode'] .con-list th ~ th {
    border-left: 1px solid #EAEAEA;
}

[data-theme='light-mode'] .con-list td ~ td {
    border-left: 1px solid #F5F5F5;
}

/* 마지막 라인 없도록 설정 - 테이블에 "last-noline" class 추가 */
[data-theme='light-mode'] .last-noline tr:last-child th,
[data-theme='light-mode'] .last-noline tr:last-child td {
    border-bottom: 0 !important;
}

/* 텍스트 왼쪽 정렬 및 줄바꿈*/
[data-theme='light-mode'] .td_break {
    white-space: normal;
    padding: 8px 24px !important;
    text-align: left;
}

/* 테이블2 (테이블형) */
[data-theme='light-mode'] .con-list2 {
    font-size: 13px;
    text-align: left;
    border-spacing: 0;
}

[data-theme='light-mode'] .con-list2 tr {
    height: 40px;
    border-bottom: 1px solid #E8E8ED;
}

[data-theme='light-mode'] .con-list2 tr:last-of-type {
    border-bottom: 0;
}

[data-theme='light-mode'] .con-list2 th {
    text-align: center;
    background: #F0F0F8;
}

[data-theme='light-mode'] .con-list2 th, .con-list2 td {
    padding: 0.6em 12px;
    border-left: 1px solid #EAEAEA;
}

[data-theme='light-mode'] .con-list2 th:first-of-type {
    border-left: 0;
}

/* 테이블22 추가 - 2010-10-21 */
[data-theme='light-mode'] .con-list22 {
    font-size: 13px;
    border-spacing: 0;
}

[data-theme='light-mode'] .con-list22 tr {
    height: 40px;
}

[data-theme='light-mode'] .con-list22 th, .con-list22 td {
    padding: 4px;
    border-left: 1px solid #EAEAEA;
    border-bottom: 1px solid #E8E8ED;
}

[data-theme='light-mode'] .con-list22 tr:last-of-type th, .con-list22 tr:last-of-type td {
    border-bottom: 0;
}

[data-theme='light-mode'] .con-list22 th {
    padding: 4px 4px 4px 8px;
    text-align: center;
    background: #F0F0F8;
    line-height: 36px;
    vertical-align: middle;
}

[data-theme='light-mode'] .con-list22 th:first-of-type {
    border-left: 0;
}

[data-theme='light-mode'] .con-list22 td {
    text-align: left;
}


[data-theme='light-mode'] .table-top {
    height: 70px;
    padding: 20px 15px;
    line-height: 30px;
    font-size: 14px;
    font-weight: 700;
    color: inherit;
}

/* 테이블3 (리스트형) */
[data-theme='light-mode'] .con-list3 {
    font-size: 13px;
    white-space: nowrap;
    text-align: center !important;
    border-spacing: 0;
}

[data-theme='light-mode'] .con-list3 thead th {
    position: sticky;
    top: 0;
}

[data-theme='light-mode'] .con-list3 tr {
    height: 40px;
}

[data-theme='light-mode'] .con-list3 th {
    background: #F0F0F8;
}

[data-theme='light-mode'] .con-list3 tbody th {
    background: #f6f6fc;
    border-bottom: 1px solid #E8E8ED;
}

[data-theme='light-mode'] .con-list3 thead tr {
    border-bottom: 1px solid #E8E8ED;
}

[data-theme='light-mode'] .con-list3 tbody tr:hover {
    background: #F9F9FC;
}

[data-theme='light-mode'] .con-list3 th, .con-list3 td {
    padding: 5px 10px;
}

[data-theme='light-mode'] .con-list3 td {
    border-bottom: 1px solid #F5F5F5;
}

[data-theme='light-mode'] .con-list3 th ~ th {
    border-left: 1px solid #EAEAEA;
}

[data-theme='light-mode'] .con-list3 td {
    border-left: 1px solid #F0F0F8;
}


[data-theme='light-mode'] .sort {
    cursor: pointer;
}


[data-theme='light-mode'] .sort:before {
    display: block;
    content: "";
    position: absolute;
    right: 8px;
    bottom: calc(50% - 6px);
    height: 0;
    z-index: -1;
    border-bottom: 4px solid;
    border-left: 4px solid rgba(0, 0, 0, 0);
    border-right: 4px solid rgba(0, 0, 0, 0);
    color: #4C5C77;
    opacity: 0.6;
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
}

[data-theme='light-mode'] .sort:after {
    content: "";
    position: absolute;
    right: 8px;
    top: calc(50% - 6px);

    height: 0;
    z-index: -1;
    border-bottom: 4px solid;
    /* 220819  수정
	border-bottom: 3px solid;*/
    border-left: 4px solid rgba(0, 0, 0, 0);
    border-right: 4px solid rgba(0, 0, 0, 0);
    color: #4C5C77;
    opacity: 0.6;
}


[data-theme='light-mode'] .arrow {
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
}

[data-theme='light-mode'] .arrow-down {

    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #f63;

}

[data-theme='light-mode'] .arrow-up {
    border-bottom: 5px solid #f63;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    top: 50px;
}

[data-theme='light-mode'] .arrow-left {
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 5px solid #f63;
    top: 100px;
}

[data-theme='light-mode'] .arrow-right {
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #288;
    top: 150px;
}

/* 테이블 컬럼 부분 디자인 추가 (정렬 화살표, 배경 컬러 변경) */
[data-theme='light-mode'] .table_sort {
    cursor: pointer;
    padding-right: 20px !important;

}

[data-theme='light-mode'] .table_sort:before {
    content: "";
    position: absolute;
    right: 8px;
    bottom: calc(50% - 6px);
    height: 0;
    z-index: -1;
    border-bottom: 4px solid;
    border-left: 4px solid rgba(0, 0, 0, 0);
    border-right: 4px solid rgba(0, 0, 0, 0);
    color: #4C5C77;
    opacity: 0.6;
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
}

[data-theme='light-mode'] .table_sort:after {
    content: "";
    position: absolute;
    right: 8px;
    top: calc(50% - 6px);

    height: 0;
    z-index: -1;
    border-bottom: 4px solid;
    /* 220819  수정
	border-bottom: 3px solid;*/
    border-left: 4px solid rgba(0, 0, 0, 0);
    border-right: 4px solid rgba(0, 0, 0, 0);
    color: #4C5C77;
    opacity: 0.6;
}

/* table_sort.up,down 추가 - 2021-12-13 */
[data-theme='light-mode'] .table_sort.up:before {
    content: none;
}

[data-theme='light-mode'] .table_sort.up:after {
    top: calc(50% - 3px);
    opacity: 1;
}

[data-theme='light-mode'] .table_sort.down:after {
    content: none;
}

[data-theme='light-mode'] .table_sort.down:before {
    bottom: calc(50% - 3px);
    opacity: 1;
}

[data-theme='light-mode'] .th_change {
    background: #E2E8F8 !important;
}

/* th_change2 추가 - 2021-12-13 */
[data-theme='light-mode'] .th_change2 {
    background: #eee2f8 !important;
}


/*220901 추가  매출 차트  기간    화살표 */

[data-theme='light-mode'] .day_warp {
    display: block;
    vertical-align: top;
}

[data-theme='light-mode'] .day_warp .date {
    font-weight: 600;
    text-align: left;
    display: inline-block;
    padding: 0;
    font-size: 28px;
    color: #333;
    float: left;
    border: none !important;
    background-color: #FFF !important;
    width: 80px;
}

[data-theme='light-mode'] .day_warp .month {
    float: left;
    margin: 0px 0px 10px 10px;
}

[data-theme='light-mode'] .day_warp .box {
    display: inline-block;
    width: 32px;
    height: 32px;
    vertical-align: top;
    border-radius: 4px;
    cursor: pointer;

    color: #333;
    transition: 0.25s;
    text-align: center;
    line-height: 32px;
    font-size: 16px;
    /*border: 1px solid none;*/
    opacity: 0.4;

}

[data-theme='light-mode'] .day_warp .box:hover {
    display: inline-block;
    width: 32px;
    height: 32px;
    vertical-align: top;
    border-radius: 4px;
    cursor: pointer;

    color: #333;
    transition: 0.25s;
    text-align: center;
    line-height: 32px;
    font-size: 16px;
    /* border: 1px solid #3669f5;*/
    opacity: 0.8;
}


[data-theme='light-mode'] .dim1, .dim2, .dim3, .dim4 {
    display: none;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background: rgba(0,0,0,0.4);*/
    transition: all 0.35s;
}


/* ----------------
 * 모달 팝업 Style
 * ----------------*/
[data-theme='light-mode'] .dim {
    display: none;
    position: fixed;
    z-index: 2;
    top: 0px;
    width: 100%;
    height: 100%;
    /*220819 수정background: rgba(0,0,0,0.3); */
    background: rgba(255, 255, 255, 0.4);

    transition: all 0.35s;
}

/*220826 추가 모달 팝업 배경  style */
[data-theme='light-mode'] .mdbg {
    display: none;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(39, 43, 49, 0.8);
    transition: all 0.35s;
}

/* ===========
*  모달 팝업 설정
* ============ */
[data-theme='light-mode'] section[class*="modal"] {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*220826 수정  background: #fff;*/
    background-color: rgba(39, 43, 49, 0.8);
    border-radius: 10px;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
    display: none;
}

[data-theme='light-mode'] section[class*="modal"] .con-box_top {
    border-radius: 10px 10px 0 0 !important;
    border-bottom: 1px solid #E2E5E9 !important;
    position: relative;
    padding: 0px 24px 0px 16px;
    height: 55px;
    line-height: 56px;
    font-size: 18px;
    font-weight: 700;
    color: #364168;
    background-color: #FFF;
}


[data-theme='light-mode'] section[class*="modal"] .con-box {
    border: 0;
    /*220823 수정  padding: 8px 24px 24px; */
    padding: 24px;
}


[data-theme='light-mode'] section[class*="modal"] .con-box_bottom {
    border-left: 0;
    border-radius: 0 0 10px 10px;
}

[data-theme='light-mode'] section[class*="modal"] .con-box_bottom span {
    line-height: 34px;
}


/* line button 디자인 추가 - 2021-01-06 */
[data-theme='light-mode'] .btn-line {
    border: 1px solid #E3E5EF;
    border-radius: 4px;
    background: #fff;
}

[data-theme='light-mode'] .btn-line:hover {
    border: 1px solid #4E5983;
    transition: .3s;
}

[data-theme='light-mode'] .btn-line .fa {
    opacity: .6;
    font-size: 16px;
}

[data-theme='light-mode'] .btn-line:hover .fa {
    opacity: 1;
    transition: .3s;
}

/* flex 정렬 조건 - 추가 */
[data-theme='light-mode'] .flex_a-c {
    display: flex;
    align-items: center;
}

[data-theme='light-mode'] .mgl_auto {
    margin-left: auto;
}

/* 오른쪽 정렬*/
[data-theme='light-mode'] .mgr_auto {
    margin-right: auto;
}

/* 왼쪽 정렬*/


/* 말줄임 css 추가 - 2022-04-27 */
[data-theme='light-mode'] .txt_ellipsis {
    width: 400px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


/* 말풍선 - 키워드 텍스트 강조*/
[data-theme='light-mode'] .pointxt {
    padding: 2px 1px;
    background: #ffff00;
    color: #0000ff;
    font-weight: 700;
}

[data-theme='light-mode'] .pointxt1 {
    padding: 2px 1px;
    background: #0000ff;
    color: #ffff00;
    font-weight: 700;
}

[data-theme='light-mode'] .pointxt2 {
    padding: 2px 1px;
    background: #ff0000;
    color: #fff;
    font-weight: 700;
}


/* 테이블설정 추가 - colspan 셀 병합 있는 테이블 - 2022-04-11 */
[data-theme='light-mode'] .con-list.colspan th, .con-list.colspan td {
    border-left: 0;
}

[data-theme='light-mode'] .con-list.colspan th {
    border-right: 1px solid #EAEAEA;
}

[data-theme='light-mode'] .con-list.colspan td {
    border-right: 1px solid #F5F5F5;
}

[data-theme='light-mode'] .con-list.colspan tr th:last-child,
[data-theme='light-mode'] .con-list.colspan tr td:last-child {
    border-right: 0;
}


/* 입력칸 비활성화 디자인 추가 -- 2022-05-16 */
[data-theme='light-mode'] .chat_bottom {
    overflow: hidden;
}

[data-theme='light-mode'] .pre_chat {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: rgba(100, 115, 150, 0.8);
}

[data-theme='light-mode'] .pre_chat > div {
    color: #fff;
    text-align: center;
    position: absolute;
    left: 50%;
    top: 16px;
    transform: translate(-50%, 0);
    font-weight: bold;
}


/* 23--215 센터관리 테이블  모달 */

[data-theme='light-mode'] section[class*="modal"].table_cen

{
    font-size: 13px;
    box-sizing: border-box;
    width: 100%;
    font-size: 13px;
    white-space: nowrap;
    /* text-align: center !important;*/
    border-spacing: 0;/*
-webkit-box-shadow: 1px 1px 1px 1px black;
box-shadow: 1px 1px 1px 1px black;*/
    border-radius:6px;
    cursor:pointer;
    border-collapse: collapse;

}
[data-theme='light-mode'] section[class*="modal"] .fa{opacity: 1 !important;}
[data-theme='light-mode'] section[class*="modal"] .table_cen th {
    font-size: 13px;
    text-align: left;
    padding: 6px 6px 6px 10px;
    color: #5c6579;
    /* height: 50px; */
    /* border-bottom: 1px solid #242629; */
    border-right: 1px solid  #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
    background-color: #f6f8fa;
    width: 140px;
}


[data-theme='light-mode'] section[class*="modal"] .table_cen td {
    font-size: 13px;
    text-align: left;
    padding: 6px 6px 6px 8px;
    color: #5c6579;
    /* height: 50px; */
    /* border-bottom: 1px solid #242629; */
    border-bottom: 1px solid rgba(36, 38, 41, 0.07);

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb ;

    border-collapse: separate;
    height: 50px;
    width: 260px;
    line-height: 32px;

}


[data-theme='light-mode'] section[class*="modal"] .table_cen td:last-child{

    border-right:none;}

[data-theme='light-mode'] section[class*="modal"] label{ margin-bottom: 0px;}



[data-theme='light-mode'] .disable_css {
    background-color: #f7f8fa !important;
}
[data-theme='light-mode'] .title_icon_s {
    display: inline-block;
    height: 36px;
    width: 36px;
    border-radius: 6px;


    background:#5a6e9b;
    color: #FFF;
    text-align: center;
    line-height: 36px !important;
    margin-right: 7px;
}

[data-theme='light-mode'] .title_icon_up {
    display: inline-block;
    height: 36px;
    width: 36px;
    border-radius: 6px;


    background:#5a6e9b;
    color: #FFF;
    text-align: center;
    line-height: 36px !important;
    margin-right: 7px;
}

[data-theme='light-mode'] .table_cen_line {

    border: 1px solid #e5e7eb;
    border-radius: 6px;
    /* overflow: auto; */
}


[data-theme='light-mode'] .bornon{border-bottom: 0px !important;}




[data-theme='light-mode'] .box_modal_9 {
    z-index: 999;
    position: fixed;
    display: block;
    width: 570px;

    top: 60%;
    left: 40%;
    margin-top: -337px;
    margin-left: 80px;
    border-radius: 9px;
    background: #FFF;
    border: 2px solid #5d78ff;
    overflow: auto;
    visibility: collapse;
    filter: alpha(opacity=60);
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    -webkit-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    transform: scale(0, 0);
}

[data-theme='light-mode'] .box_modal_9 .warp_mo {
    padding-top: 0 !important;
    padding: 20px;
}

[data-theme='light-mode'] .box_modal_9 .warp_motop {
    position: sticky;
    top: 0;
    height: 58px;
    background-color: #FFF;

}

[data-theme='light-mode'] .box_modal_9 .warp_mo_tit {
    color: #444;
    float: left;
    line-height: 58px;
    margin-bottom: 0 !important;
    font-size: 16px;
    font-weight: 500;

}

[data-theme='light-mode'] .box_modal_9 .close_st {
    position: sticky;
    top: 14px;
    font-size: 14px;
    float: right;

}


[data-theme='light-mode'] input#modal_9[type=checkbox]:checked ~ .box_modal_9 {
    visibility: visible;
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
}


/* 모달안 레이어 테이블 */



section[class*="modal"] .con-box_bottom {
    border-left: 0;
    border-radius: 0 0 10px 10px;
}

[data-theme='light-mode'] .table_modal_9 {
    box-sizing: border-box;
    width: 100%;
    font-size: 13px;
    white-space: nowrap;
    border-spacing: 0;
    border-radius: 6px;
    cursor: pointer;
}


[data-theme='light-mode'] section[class*="modal"] .table_modal_9 th {
    padding: 4px 7px;
    /*background: #16191c; */
    text-align: center !important;

    background: rgba(188, 196, 240, 0.16) !important;

    /*color: #FFF;*/
    height: 40px;
    border-bottom: none !important;

}

[data-theme='light-mode'] section[class*="modal"] .table_modal_9 th:last-child {
    border-right: none !important;


}


[data-theme='light-mode'] section[class*="modal"] .table_modal_9 td {

    /* background-color: #16191c;
    background-color:#1c1d21;*/
    color: #60636c;
    vertical-align: middle !important;
    line-height: 40px;
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #eaeaea !important;
    border-right: none !important;
    background-color: #FFF;

}
[data-theme='light-mode'] .con-box-area button {
    height: 36px;
    line-height: 36px;
}

/*23-0214 추가 */
[data-theme='light-mode'] .arr_nav:after {content: ""; position: absolute;
    top: calc(19px - 3px);
    right: 3px;
    width: 6px;
    height: 6px;
    /*220915수정 right: 24px; */
    /*220818 수정 border: 1px solid rgba(125, 125, 125, 0.4);*/
    border: 1px solid rgba(125, 125, 125, 0.8);
    border-width: 0 1px 1px 0; transform: rotate(45deg);}

/*23-0214 추가 */
[data-theme='light-mode'] .arr_nav:hover:after {
    border: 1px solid rgba(6, 17, 57, 1);
    border-width: 0 1px 1px 0; transition: 0.25s;
}