/*폰트 변경 (맑은 고딕 -> D2Coding) */
/*폰트 변경 (D2Coding -> pretendard) -by Berdo*/
/*@import url(https://cdn.jsdelivr.net/npm/d2coding@1.3.2/d2coding-full.min.css);*/
@import url(pretendard.css);

/* -- system ----------------------------------------------- */
/* 마우스오버시 커서포인터 사용 */
.PointerCursor:hover {
    cursor: pointer;
}

.ZoomCursor:hover {
    cursor: se-resize;
}

/* 텍스트 드래그 방지 */
.DragPrevent {
    -ms-user-select:none;
    -moz-user-select:none;
    -khtml-user-select:none;
    -webkit-user-select:none;
    user-select:none;
}

/* 이미지 드래그 방지 -by Berdo */
.DragPreventImg {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

.IEScrollPrevent {
    /* -ms-overflow-style: none; */
    overflow-x: hidden;
    overflow-y: hidden;
}

.ScrollPrevent {
    /* -ms-overflow-style: none; */
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}

iframe {
    border: none;
}

.ellipsis {
    text-overflow : ellipsis;
}

/* -- body ----------------------------------------------- */
body{
    margin: 0;
    padding: 0;
    font-family: 'Pretendard';
    font-size: 10pt;
    /* 웹뷰에서 드래그하려면 user-select 부분 주석처리 필요 -by Raemin 2024-10-11  */
    -ms-user-select:none;
    -moz-user-select:-moz-none;
    -khtml-user-select:none;
    -webkit-user-select:none;
    user-select:none;
}

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

.scroll_y_test:hover {
    opacity : 1;
}

input[type='button']:focus { outline: none; }

/* IE에서 edit ctl 삭제 버튼 자동생성 방지 */
input[type=text]::-ms-clear {
    display:none;
}

/*div:focus-visible{*/
/*    outline: 0;*/
/*}*/

/* -- Form ----------------------------------------------- */

div#FORM {
    border: none;
}


.ITGForm {
    width: 100vw;
    height: 100vh;
    background-color: white;
    margin: 0;
    padding: 0;
    font-family: 'Pretendard';
    font-size: 10pt;
}

/* -- Ctl Default ---------------------------------------- */
.ITGCtlDefStyle{
    margin: 0;
    padding: 0;
    font-family: 'Pretendard';
    font-size: 10pt;
}


/* -- Ctl Common ----------------------------------------- */

/* 에디트 등 input type="text" 에서 포커스시 외곽선이 파란색으로 나오는것 방지 - cory 2022.02.25. */
input[type="text"] {
    /*border: solid 2px #FFE4B5;
    -webkit-transition: 0.5s;
    transition: 0.5s;*/
    outline: none;
    font-family: Pretendard;
    font-variant-numeric: tabular-nums;
}

input[type="password"]{
    outline: none;
    font-family: Pretendard;
    font-variant-numeric: tabular-nums;
}
input[type="number"]{
    outline: none;
    font-family: Pretendard;
    font-variant-numeric: tabular-nums;
}

/* 우측 스핀 없애기 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="search"]{
    outline: none;
    font-family: Pretendard;
    font-variant-numeric: tabular-nums;
}

/* 브라우저제공 스크롤UI 숨김(커스텀UI 사용: PC에서)  -by Raemin 2022-03-11 */
.ITGScrollbar::-webkit-scrollbar {
    display: none;
}

/* 브라우저제공 스크롤UI 숨김(커스텀UI 사용: PC에서) -by Raemin 2022-03-11 */
.ITGScrollbar {
    scrollbar-width: none;
}

/* -- Ctl Button ------------------------------------------ */
.ITGButton {
    display: flex; /* 추가 -by may 2023-08-16 */
}

.ITGButton:active {
    /* background: linear-gradient(to bottom, lightgray, white); */
    /* 사용자가 border값 설정하도록 변경(기본값 설정 안함) -by Raemin 2022-05-31*/
    /*border: 1px solid black;*/
}

/* -- Ctl Edit -------------------------------------------- */
.ITGEdit{
    /* border: 1px solid black; */  /* 주석처리; -by Raemin 2020-06-23기준 디자인 */
    /* box-sizing: border-box; */
    justify-content: center;
}

input.editbutton {
    width: 20px;
}

/* 에디트 컨트롤 아이콘이미지 부모영역 CSS -by Raemin 2023-09-11 */
div.edit_icon_parent {
    display: flex;
    overflow: hidden;
    justify-content : flex-start;
}

/* -- Ctl WebView ----------------------------------------- */
.ITGWebview {
    /*overflow: auto;*/ /* 주석처리; -by HU 2023-08-09 스크롤바 중복생성 문제 */
}

/* -- Ctl RadioButton ------------------------------------- */
.RadioButton > div {
    display: flex;
}

.RadioButton:hover {
    cursor: pointer;
}

.RadioBtnStyleDefault {
    box-sizing: border-box;
    background: linear-gradient(to bottom, white, lightgray);
    border: 1px solid black;
}

.RadioBtnStyleDefault:active {
    background: linear-gradient(to bottom, lightgray, white);
    border: 1px solid black;
}

/* -- add by Raemin 2022-03-03 -- */
.RadioBtnStyleDefault_disable {
    box-sizing: border-box;
    background: linear-gradient(to bottom, lightgray, lightgray);
    opacity: 0.5;
    border: 1px solid black;
    cursor: default;
}

.RadioBtnStyleDefault_select {
    box-sizing: border-box;
    background: linear-gradient(to bottom, lightgray, gray);
    border: 1px solid black;
}

.RadioTransparent {
    background-image : none;
    background: none;
    border: 0px;
}

/* -- Ctl Calendar ---------------------------------------- */
.ITGCalendar {
    box-shadow:grey 0px 0px 0px 1px inset;
}

/* -- Ctl Tab --------------------------------------------- */
.ITGTabItem{
    /* border-radius:10px 10px 0 0; */
    text-align:center;
    cursor: pointer;
    transition: 0.02s;
}

.ITGTabArrow{
    background-color:transparent;
    height: 26px;
    width: 26px;
    /* background: lightgrey; */
    /* text-align:center; */
    opacity: 0.5;
    border: none;
}

/* add Raemin 2023-07-25 */
.ITGTabMorelist{
    background-color:transparent;
    height: 26px;
    width: 26px;
    /* background: lightgrey; */
    /* text-align:center; */
    border: none;
}

.ITGGridArrow{
    background-color:transparent;
    opacity: 0.3;
    border: none;
}

/* -- Ctl Check Button-------------------------------------- */

.ITGChkbutton {
    -webkit-transition: All 250ms ease;
    -moz-transition: All 250ms ease;
    -o-transition: All 250ms ease;
    -ms-transition: All 250ms ease;
    transition: All 250ms ease;
}

.ITGChkbutton:active {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-transition: All 250ms ease;
    -moz-transition: All 250ms ease;
    -o-transition: All 250ms ease;
    -ms-transition: All 250ms ease;
    transition: All 250ms ease;
}

/* -- Ctl Image ------------------------------------------ */
.ImageZoom:active {
    transition: all ease 30s; /* ZOOM Speed */
    transform: scale( 20.0 );

}

/* -- Ctl Combo ------------------------------------------ */
.ITGCombo * { box-sizing: border-box; }
.ITGCombo {
    position: relative;
    width: 150px;
    height: 35px;
    /*border-radius: 4px;*/
    /*border: 2px solid lightcoral;*/
    /*background: url('https://freepikpsd.com/media/2019/10/down-arrow-icon-png-7-Transparent-Images.png') calc(100% - 7px) center no-repeat;*/
    background-size: 20px;
    cursor: pointer;
}

.ITGCombo:after {
    content: '';
    display: block;
    width: 2px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 35px;
    /*background: lightcoral;*/
}

/* Start of tabmorelist Raemin 2023-07-25 */
.tabmorelist {
    position: absolute;
    top: 20px;
    left: 0;
    width: 100%;
    background: white;
    /*background: white;*/
    /*border-color: darkgray;*/
    color: #000000;
    list-style-type: none;
    padding: 0;
    border-radius: 6px;
    overflow: hidden;
    max-height: 0;
    transition: .3s ease-in;
}

.tabmorelist::-webkit-scrollbar {width: 6px;}
.tabmorelist::-webkit-scrollbar-track {background: transparent; }
.tabmorelist::-webkit-scrollbar-thumb {background: #303030; border-radius: 45px;}
.tabmorelist::-webkit-scrollbar-thumb:hover {background: #303030;}


.tabmorelist {
    margin: 7px 0px 0px 0px;
    max-height: 500px;
    overflow: auto;
    border: 1px black solid;
    box-shadow: 3px 3px 5px grey;
}

.tabmoreitem {
    border-bottom: 1px dashed rgb(161, 158, 158);
    padding: 5px 15px 5px;
    transition: .1s;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 15px;
    overflow: hidden;
    white-space: nowrap;
}

.tabmoreitem > button {
    background-color : transparent;
    border : none;
    opacity: 0.7;
    cursor: grab;
}

.tabmoreitem:hover {
    background: rgba(0, 0, 0, 0.1);
    /*cursor: pointer;*/
}

.tabmoreitem:last-child {
    border-bottom: 0 none;
}
/* End of tabmorelist */

/* -- Main Popup ---------------------------------------- */
/* add -by Raemin 2022-03-30 */
div.popup_bg_area {
    top:0px;
    position:absolute;
    background-color:rgba(0,0,0,0.1);
    z-index: 2; /* 추후 z-index 단계 설계필요. */
}

div.popup_bg_area > div.popup_flex_area_center {
    background-color:rgba(0,0,0,0.1);
    display:flex;
    align-content:center;
    justify-content:center;
    align-items:center;
}

/* -- Main Toast ---------------------------------------- */
div.toast_bg_area {
    bottom:10px;
    position:absolute;
    background-color:rgba(0,0,0,0.6);
    border-radius:20px;
    display:flex;
    justify-content:center;
    /*margin: 0px 10px 0px 10px;*/
}
div.toast_bg_area > div.popup_flex_area {
    display:flex;
    padding:20px;
    align-content:center;
    justify-content:center;
    align-items:center;
    font-size:15px;
    line-height:150%;
    color:antiquewhite;
}

/* -by Raemin 2022-04-14 */
div.minitoast_bg_area {
    width: auto;
    background-color: rgba(0,120, 200, 0.5);
    z-index: 9; /* -by Raemin 2025-01-22 */
}

div.minitoast_bg_area > div.popup_flex_area {
    width: auto;
}

/* -- Main framepopup -------------------------------------- */

.framepopup_scroll {
    box-shadow: 3px 3px 8px 0px rgba(0,0,0,0.2);
}
.framepopup_scroll::-webkit-scrollbar {width: 6px; height: 6px}
.framepopup_scroll::-webkit-scrollbar-track {background: transparent; }
.framepopup_scroll::-webkit-scrollbar-thumb {background: #303030; border-radius: 45px;}
.framepopup_scroll::-webkit-scrollbar-thumb:hover {background: #303030;}

.framedialog_scroll {
    box-shadow: 0px -15px 25px 10px rgba(0,0,0,0.2);
}
.framedialog_scroll::-webkit-scrollbar {width: 6px; height: 6px}
.framedialog_scroll::-webkit-scrollbar-track {background: transparent; }
.framedialog_scroll::-webkit-scrollbar-thumb {background: #303030; border-radius: 45px;}
.framedialog_scroll::-webkit-scrollbar-thumb:hover {background: #303030;}

.framepopup_bg_css {
    position:absolute;
    border:1px solid blue;
}

.framedialog_bg_css {
    position:absolute;
    border-left: 7px solid rgba(013,110,253,0.7);
    border-right: 7px solid rgba(013,110,253,0.7);
    border-bottom: 7px solid rgba(013,110,253,0.7);
    border-radius: 7px;
}

.framepopup_flex_css {
    display:flex;
    flex-direction:column;
    width:unset;
    height:unset;
}

.framepopup_move_head_css {
    height:25px;
    display:grid;
    grid-template-columns:1fr 25px 25px;
    cursor: move;
    border-bottom: 1px solid blue;
}

.framedialog_move_head_css {
    height:25px;
    display:grid;
    grid-template-columns:1fr 49px;
    border-bottom: 1px solid blue;
    background-color: rgba(013,110,253,0.7);
}

.framepopup_move_title_css {
    height:25px;
    color: #ffffff;
    font-size:20px;
    background-color:white;
    padding: 0px 0px 0px 10px;
    word-break: unset;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /*background-color: lightsteelblue;*/
}

.framedialog_move_title_css {
    height:25px;
    color:white;
    font-size:20px;
    background-color:transparent;
    padding: 0px 0px 0px 10px;
    word-break: unset;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /*background-color: lightsteelblue;*/
}

.framepopup_move_close_css {
    height:25px;
    color:red;
    font-size:15px;
    cursor:pointer;
}

.framedialog_move_close_css {
    height:20px;
    color:white;
    font-size:13px;
    cursor:pointer;
    background-color:red;
    border: 0px;
    border-radius: 0px 0px 5px 5px;
    padding: 0px;
}

.framepopup_move_minimize_css {
    height:25px;
    color:black;
    font-size:15px;
    cursor:pointer;
}

.framepopup_statusbar_css {
    height:25px;
    color:black;
    font-size:20px;
    background-color:gray;
    word-break: unset;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: grid;
    grid-template-columns: 25px 1fr 10px;
    align-content: space-around;
    align-items: center;
}

.framepopup_statusbar_combo_css {
    width: auto;
    height: 18px;
}

.modeless {
    width:unset;
    height:unset;
    justify-content:unset;
}

/* 힌트 placeholder 사용 : Div에 usehint="true" placeholder="힌트" 추가*/
[useHint=true]:empty:not(:focus):before{
    content:attr(placeholder)
}
/* ------------------------------------------------------- */

/* Dropdown Button */
.dropbtn {
    /* background-color: #3498DB; */
    color: #000;
    /* padding: 16px; */
    font-size: 16px;
    /* border: none; */
    cursor: pointer;
}

/* Dropdown button on hover & focus */
/* .dropbtn:hover, .dropbtn:focus {
background-color: rgb(202, 230, 248);
} */

/* The container <div> - needed to position the dropdown content */
.dropdown {
    border: 1px solid black;
    position: relative;
    display: inline-block;
}

.dropdown2 {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 30px; /* 추후에 더 최소너비를 줄일 수 경우 조정할 것 */
    box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    /* padding: 12px 16px; */
    text-decoration: none;
    display: block;
}

.popup_box_shadow {
    box-shadow: 3px 3px 8px 0px rgba(0,0,0,0.2);
    border-radius: 5px;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content2 {
    position: absolute;
    background-color: #f1f1f1;
    min-width: 30px; /* 추후에 더 최소너비를 줄일 수 경우 조정할 것 */
    box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content2 a {
    color: black;
    /* padding: 12px 16px; */
    text-decoration: none;
    display: block;
}


/* Change color of dropdown links on hover */
.dropdown-content a:hover {
    background-color: #ddd;
    cursor: pointer;
}

.droppadd:hover {
    cursor: pointer;
}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.dropdown-show {
    display:block;
}

/*************** SCROLLBAR BASE CSS ***************/

.scroll-wrapper {
    overflow: hidden !important;
    padding: 0 !important;
    position: relative;
}

.scroll-wrapper > .scroll-content {
    border: none !important;
    box-sizing: content-box !important;
    /* height: auto; */
    left: 0;
    margin: 0;
    /* max-height: none; */
    max-width: none !important;
    overflow: hidden !important;
    padding: 0;
    position: relative !important;
    top: 0;
    width: auto !important;
}

.scroll-wrapper > .scroll-content::-webkit-scrollbar {
    height: 0;
    width: 0;
}

.scroll-element {
    display: none;
}
.scroll-element, .scroll-element div {
    box-sizing: content-box;
}

.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {
    display: block;
}

.scroll-element .scroll-bar,
.scroll-element .scroll-arrow {
    cursor: default;
}

.scroll-textarea {
    border: 1px solid #cccccc;
    border-top-color: #999999;
}
.scroll-textarea > .scroll-content {
    overflow: hidden !important;
}
.scroll-textarea > .scroll-content > textarea {
    border: none !important;
    box-sizing: border-box;
    height: 100% !important;
    margin: 0;
    max-height: none !important;
    max-width: none !important;
    overflow: scroll !important;
    outline: none;
    padding: 2px;
    position: relative !important;
    top: 0;
    width: 100% !important;
}
.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {
    height: 0;
    width: 0;
}


/*************** SIMPLE INNER SCROLLBAR ***************/

.scrollbar-inner > .scroll-element,
.scrollbar-inner > .scroll-element div
{
    border: none;
    margin: 0;
    padding: 2px;
    position: absolute;
    z-index: 10;
}

.scrollbar-inner > .scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}

.scrollbar-inner > .scroll-element.scroll-x {
    bottom: 2px;
    height: 8px;
    left: 0;
    width: 100%;
}

.scrollbar-inner > .scroll-element.scroll-y {
    height: 100%;
    right: 5px;
    top: 0;
    width: 8px;
}

.scrollbar-inner > .scroll-element .scroll-element_outer {
    overflow: hidden;
}

.scrollbar-inner > .scroll-element .scroll-element_outer,
.scrollbar-inner > .scroll-element .scroll-element_track,
.scrollbar-inner > .scroll-element .scroll-bar {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.scrollbar-inner > .scroll-element .scroll-element_track,
.scrollbar-inner > .scroll-element .scroll-bar {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
    opacity: 0.4;
}

.scrollbar-inner > .scroll-element .scroll-element_track { background-color: #e0e0e0; }
.scrollbar-inner > .scroll-element .scroll-bar { background-color: #c2c2c2; }
.scrollbar-inner > .scroll-element:hover .scroll-bar { background-color: #919191; }
.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar { background-color: #919191; }


/* update scrollbar offset if both scrolls are visible */

.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -16px; }
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -12px; }


.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -16px; }
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -12px; }


.ui-icon-mainmenubtn{
    /* background-color: DodgerBlue; */
    border: none; /* Remove borders */
    color: rgb(0, 0, 0); /* text */
    padding: 6px 8px; /* Some padding */
    font-size: 16px; /* Set a font size */
    cursor: pointer; /* Mouse pointer on hover */
    /* background: url(../img/favicon.png) no-repeat; */
    background-color:white;
}
.ui-icon-mainmenubtn:hover {
    /* background-color: RoyalBlue; */
    background-color:whitesmoke;
}
.fa{
    display:inline-block;
    font:normal normal normal 14px/1 FontAwesome;
    font-size:inherit;
    text-rendering:auto;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}

@keyframes move {
    /* keyframe */
    from {
        top: -5%;
    }
    /* keyframe */
    99% {
        top: 10%;
    }
    to {
        top: unset;
    }
}

.sortico-org{
    width: 0;
    height: 0;
    border: 4px solid transparent;
    border-bottom-color: #4F5559;
    position: absolute;
    display: inline-block;
    top: 0px;
    margin: 1px 3px 0 2px;
}
.sortico-org:after{
    content: '';
    position: absolute;
    display: inline-block;
    left: -4px;
    top: 6px;
    width: 0;
    height: 0;
    border: 4px solid transparent;
    border-top-color: #4F5559;
}

.sortico-asc{
    width: 0;
    height: 0;
    border: 4px solid transparent;
    border-bottom-color: #4F5559;
    position: absolute;
    display: inline-block;
    top: 0px;
    margin: 1px 3px 0 2px;
}
.sortico-asc:after{
    content: '';
    position: absolute;
    display: inline-block;
    left: -4px;
    top: 6px;
    width: 0;
    height: 0;
    border: 4px solid transparent;
    border-top-color: #098df3;
}

.sortico-dsc{
    width: 0;
    height: 0;
    border: 4px solid transparent;
    border-bottom-color: #098df3;
    position: absolute;
    display: inline-block;
    top: 0px;
    margin: 1px 3px 0 2px;
}
.sortico-dsc:after{
    content: '';
    position: absolute;
    display: inline-block;
    left: -4px;
    top: 6px;
    width: 0;
    height: 0;
    border: 4px solid transparent;
    border-top-color: #4F5559;
}

/*
    기본 등락부호 / 소트열 처리 한투걸로 변경.
 */

/* 배경색 투명화 -by Raemin 2023-10-31 */
.bg_clear {
    background: transparent;
}

/*
    연결폼 로딩 CSS -by Berdo 2024-01-16
 */
.linkfm-loading {
    display: inline-block;
    position: absolute;
    width: 80px;
    height: 80px;
}
.linkfm-loading div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid #0080C0;
    border-radius: 50%;
    animation: linkfm-loading 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #0080C0 transparent transparent transparent;
}
.linkfm-loading div:nth-child(1) {
    animation-delay: -0.45s;
}
.linkfm-loading div:nth-child(2) {
    animation-delay: -0.3s;
}
.linkfm-loading div:nth-child(3) {
    animation-delay: -0.15s;
}
@keyframes linkfm-loading {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* css class화 -by Raemin 2024-03-21  */
.csscls_common_cursor_pointer {
    cursor : pointer ;
}

.csscls_common_NoTextShadow {
    text-shadow : none;
}

.csscls_common_invisible {
    opacity : 0
}
.csscls_common_enable {
    pointer-events : auto;
    opacity : 1
}

.csscls_common_disable {
    pointer-events : none;
    opacity : 0.5
}

.csscls_common_ellipsis {
    overflow : hidden;
    white-space : nowrap;
    text-overflow : ellipsis;
}

.csscls_common_NoEllipsis {
    overflow : hidden;
    white-space : nowrap;
    text-overflow : "";
}

.csscls_ITGButton {

}

.csscls_ITGButton_Text {

}

.csscls_ITGButton_Img {

}

.csscls_ITGButton_BGDefault {
    background-image  : none;
    background : linear-gradient(to bottom, white, lightgray);
}

.csscls_ITGButton_BGPressed {
    background-image  : none;
    background : linear-gradient(to bottom, lightgray, white);
}

.csscls_ITGButton_Text_NoIcon {
    overflow : hidden;
    white-space : nowrap;
    text-overflow : "";
}

.csscls_ITGButton_Text_Multiline {
    overflow : hidden;
    overflow-wrap : anywhere;;
}

.csscls_ITGButton_Text_NoMultiline {
    overflow : hidden;
    overflow-wrap : unset;
}

.csscls_ITGLabel {
    overflow: clip; /* 불릿이미지가 컨트롤 영역 밖까지 나오는 현상 방지 -by Raemin 2024-04-09 */
}

.csscls_ITGLabel_Text {
    z-index: 1;
}

.ITGLabel_SignImg {
    margin-left : auto;
    margin-right : auto;
    display : block;
    object-fit : none;
}

.csscls_ITGEdit {

}

.csscls_ITGEdit_Text {
    position: absolute;
    width: 98%;
    height: 100%;
}

.csscls_ITGEdit_Clearbtn {
    width : 23px;
    height: 100%;
    background-color : transparent;
    background-repeat : no-repeat;
    background-image: url("../img/0/ctl/edit_clear_02.png");
    background-size : 23px 23px;
    background-position : center;
    border : none;
    display: none;
    position: absolute;
    /* oText태그 position이 absolute로 변경(2024-06-08)되어서, 패딩주었을 때 UI위치상 문제가 발생해서 css파일에서 '.csscls_ITGEdit_Clearbtn' 항목으로 제어 -by Raemin 2024-06-21 */
    right : 2%;
}

.csscls_ITGEdit_Text_Cursor {
    caret-color : auto;
}

.csscls_ITGEdit_Text_NoCursor {
    caret-color : transparent;
}

.csscls_ITGCommbo {
     /* border-style : groove; */
    box-shadow : 0px 0px 0px 1px gray inset;
     /*"box-sizing : border-box; */
    align-items : center;
    align-content : center;
}

.csscls_ITGCommbo_Icon {
    margin-left : 5px;
    width : 10px;
    height : 10px;
    display : none;
}

.csscls_ITGCommbo_Text {
    overflow : hidden;
    white-space : nowrap;
    text-overflow : ellipsis;
    background : none;
    width : inherit;
    padding : 0px 0px 0px 8px;
}

.csscls_ITGCommbo_TextInput {
    overflow : hidden;
    white-space : nowrap;
    text-overflow : ellipsis;
    background : none;
    border : none;
    width : inherit;
    padding : 0px 0px 0px 8px;
    display : none;
}

.csscls_ITGCommbo_Openbtn {
    background-color : transparent;
    background-repeat : no-repeat;
    background-position : center;
    border : none;
    display : block;
    width : 30px;
    height : inherit;
}

/*.ITGCombo .combolist {*/
.csscls_ITGCommbo_List {
    position: absolute;
    top: 20px;
    left: 0;
    width: 100%;
    background: white;
    /*background: white;*/
    /*border-color: darkgray;*/
    color: #000000;
    list-style-type: none;
    padding: 0;
    border-radius: 6px;
    overflow: hidden;
    transition: .3s ease-in;
    z-index : 99;
    max-height : 0;
}

.csscls_ITGCommbo_List::-webkit-scrollbar {width: 6px;}
.csscls_ITGCommbo_List::-webkit-scrollbar-track {background: transparent; }
.csscls_ITGCommbo_List::-webkit-scrollbar-thumb {background: #303030; border-radius: 45px;}
.csscls_ITGCommbo_List::-webkit-scrollbar-thumb:hover {background: #303030;}


.csscls_ITGCommbo_List {
    margin: 7px 0px 0px 0px;
    max-height: 500px;
    overflow: auto;
    border: 1px black solid;
    box-shadow: 3px 3px 5px grey;
}

.csscls_ITGCommbo_ListItem {
    border-bottom: 1px dashed rgb(161, 158, 158);
    padding: 5px 15px 5px;
    transition: .1s;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 15px;
    overflow: hidden;
    white-space: nowrap;
}

.csscls_ITGCommbo_ListItem:hover {
    background: rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.csscls_ITGCommbo_ListItem:last-child {
    border-bottom: 0 none;
}

.csscls_ITGCommbo_ListItem_Selected {
    background: bisque;
}

.csscls_ITGChkbutton {
    display : grid;
}

.csscls_ITGChkbutton_ChkArea {
    grid-row : 2 / 3;
    grid-column : 1 / 2;
    margin : 0;
}

.csscls_ITGChkbutton_ChkArea_HiddenChk {
    display : none;
    margin : 0;
}

.csscls_ITGChkbutton_ChkArea_ViewedChk {

}

.csscls_ITGChkbutton_TextArea {
    grid-row : 1 / 4;
    grid-column : 2 / 3;
    overflow: hidden;
}

.csscls_ITGChkbutton_TextArea_AlignArea {
    display : flex;
    align-items : center;
    justify-content : center; /* for텍스트세로정렬 */
}

.csscls_ITGChkbutton_TextArea_AlignArea_Text {
    display : block;
    overflow : hidden; /* 텍스트 넘칠 시 자동으로 숨기기 */
}

.csscls_ITGChkbutton_Text_Multiline {
    white-space : pre-wrap; /* 멀리라인 적용 */
    word-break : break-all; /* 글자단위로줄바꿈 */
}

.csscls_ITGChkbutton_Text_NoMultiline {
    white-space : nowrap; /* 멀티라인 해제 */
    word-break : break-all; /* 글자단위로줄바꿈 */
}

.csscls_ITGChkbutton_pushstyle_disable {
    position : absolute;
    background-image : linear-gradient(to bottom, lightgray, white);
    background-size : auto 100%;
    background-repeat : no-repeat;
    border-radius : 5px;
    border : 1px gray solid;
    box-shadow : inset 7px 7px 7px #898AA6;
    grid-template-columns : 0px 1fr;
}

.csscls_ITGChkbutton_pushstyle_checked {
    position : absolute;
    background-image : linear-gradient(to bottom, lightgray, white);
    background-size : auto 100%;
    background-repeat : no-repeat;
    border-radius : 0px;
    border : 1px gray solid;
    box-shadow : inset 7px 7px 7px #898AA6;
    grid-template-columns : 0px 1fr;
}

.csscls_ITGChkbutton_pushstyle_unchecked {
    position : absolute;
    background-image : linear-gradient(white, lightgray);
    background-size : auto 100%;
    background-repeat : no-repeat;
    border-radius : 5px;
    border : 1px gray solid;
    box-shadow : none;
    grid-template-columns : 0px 1fr;
}

.csscls_ITGRadioGroup {

}

.csscls_ITGRadioGroup_Item {

}

.csscls_ITGRadioGroup_Item_AlignArea {

}

.csscls_ITGRadioGroup_Item_AlignArea_Img {

}

.csscls_ITGRadioGroup_Item_AlignArea_div1 {

}

.csscls_ITGRadioGroup_Item_AlignArea_div1_div2 {

}

.csscls_ITGRadioGroup_Item_AlignArea_div1_div2_Text {

}

.csscls_ITGTab {

}

.csscls_ITGTab_Pagingbar {
    position : absolute;
    z-index : 2;
    padding-left : 0;
    justify-content : center;
}

.csscls_ITGFormTab {

}

.csscls_ITGFormTab_Pagingbar {
    position: absolute;
    z-index: 2;
    padding-left: 0;
    justify-content: center;
}

.csscls_ITGTabHeader {
    position: relative;
    left : 0;
    top : 0;
    overflow : hidden;
}

.csscls_ITGTabHeader_ItemsArea {
    position : relative;
    background-color : inherit;
    width : max-content;
    display : flex; /* 글자가 크면 영역도 덩달아 커지는 현상 방지. -by Raemin 2023-08-11 */
}

.csscls_ITGTabHeader_Item_selected_IMG {
    background-color : unset;
}

.csscls_itgtabheader_Item_selected_CLR {
    background-image : none;
}

.csscls_ITGTabHeader_Item_selected_DEFAULT {
    background-color : unset;
    background: url("../img/0/ctl/tab_header_sel.png");

    background-repeat : no-repeat;
    border : none;
    border-radius : 0;
    border-image : none;
}

.csscls_ITGTabHeader_Item_unselected_IMG {
    background-color : unset;
}

.csscls_ITGTabHeader_Item_unselected_CLR {
    background-image : none;
}

.csscls_ITGTabHeader_Item_unselected_DEFAULT {
    background-image: none;
    background-color : white;
}

.csscls_ITGTabHeader_Item_common {
    background-repeat : no-repeat;
    border : none;
    border-radius : 0;
}

.csscls_ITGTabHeader_LeftArrow {
    background-image: url("../img/0/ctl/ctl_ico_arrow01.png");
    position:absolute;
    cursor:pointer;
}

.csscls_ITGTabHeader_RightArrow {
    background-image: url("../img/0/ctl/ctl_ico_arrow02.png");
    position:absolute;
    cursor:pointer;
}

.csscls_ITGTabHeader_MoreList {
    background-image: url("../img/0/ctl/ctl_tab_more_black.png");
    position:absolute;
    cursor:pointer;
}

.csscls_ITGCalendar {
    /* border-style : groove; */
    /* box-sizing : border-box; */
    align-items : center;
    align-content : center;
    display : flex;
    background-color : white;
}

.csscls_ITGCalendar_Text {
    /* border : "none; */
    overflow : hidden;
    white-space : nowrap;
    text-overflow : ellipsis;
    background : none;
    width : inherit;
    border-right: 1px solid; /* 구분선 may 2023-08-22 */
}

.csscls_ITGCalendar_Icon {
    background-color : transparent;
    background-repeat : no-repeat;
    background-image: url("../img/0/ctl/ico_calendar.png");
    background-size : 18px 18px;
    background-position : center;
    border : none;
    display: block;
    width: 30px;
}

/* 호가 시고저 표시 텍스트 버전 -by Raemin 2024-05-21 */
.csscls_ITGHogaTable_StartPriceIndicator {
    z-index: 1;
    width: 15px;
    height: 15px;
    position: absolute;
    background: #3f3e3e;
    color: white;
    text-align : center;
    align-content : center;
    border-radius : 15px;
}

.csscls_ITGHogaTable_HighPriceIndicator {
    z-index: 1;
    width: 15px;
    height: 15px;
    position: absolute;
    background: #ff0000;
    color: white;
    text-align : center;
    align-content : center;
    border-radius : 15px;
}

.csscls_ITGHogaTable_lowPriceIndicator {
    z-index: 1;
    width: 15px;
    height: 15px;
    position: absolute;
    background: #0000ff;
    color: white;
    text-align : center;
    align-content : center;
    border-radius : 15px;
}

.csscls_ITGLabel_SignImg {
    width : 10px;
    height : 10px;
}

/* 호가 시고저 표시 이미지 버전 -by Raemin 2024-04-11 */
/*.csscls_ITGHogaTable_StartPriceIndicator {*/
/*    !* z-index: 1; *!*/
/*    top:0;*/
/*    width: 34px;*/
/*    height: 31px;*/
/*    position: absolute;*/
/*    background-image: url("../img/0/hoga_start.png");*/
/*    background-size: cover;*/
/*}*/

/*.csscls_ITGHogaTable_HighPriceIndicator {*/
/*    !* z-index: 1; *!*/
/*    top:0;*/
/*    width: 34px;*/
/*    height: 31px;*/
/*    position: absolute;*/
/*    background-image: url("../img/0/hoga_high.png");*/
/*    background-size: cover;*/
/*}*/

/*.csscls_ITGHogaTable_lowPriceIndicator {*/
/*    !* z-index: 1; *!*/
/*    top:0;*/
/*    width: 34px;*/
/*    height: 31px;*/
/*    position: absolute;*/
/*    background-image: url("../img/0/hoga_row.png");*/
/*    background-size: cover;*/
/*}*/

.css_scroll_panev {
    /*background-color : rgba(255,255,255,0.05) !* 서버제어페이지 *!*/
    background-color : rgba(0,0,0,0.05) /* default */
}

.css_scroll_paneh {
    /*background-color : rgba(255,255,255,0.05) !* 서버제어페이지 *!*/
    background-color : rgba(0,0,0,0.05) /* default */
}

.css_scroll_slider {
    /*background-color : rgba(255,255,255,0.25) !* 서버제어페이지 *!*/
    background-color : rgba(0,0,0,0.25) /* default */
}

/* ============================================================================================ */
/* Waiting Cursor */
/* ============================================================================================ */

.new-loading {
    width: 90px; height: 90px; border-radius: 90px; background: rgb(255 255 255 / 0.1); display: flex; align-items: center; justify-content: center;
    position: fixed; z-index: 10000; border:1px solid rgb(0 0 0 / 0.05 );
    top:50%; left: 50%; transform: translate(-50%, -50%);
}

.new-loading:after { content: ''; display: block; width: 50px; height: 50px; background: url('../img/0/itg-loading-logo.svg') no-repeat center / 53% auto; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); filter: drop-shadow(0px 0px 10px #035a56); }

.l-img { width: 60px; height: 60px; position: relative;
    background: radial-gradient(circle 100px at 10% 10%, #0d0e0d 5%, #878888 95%);
    border-radius: 20px; position: relative;
    animation: loader5 2s linear infinite;

    box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px,
    rgba(42, 51, 69, 0.04) 0px 0px 1px 0px,
    rgba(42, 51, 70, 0.04) 0px 0px 3px 0px,
    rgba(42, 51, 70, 0.04) 0px 0px 6px 0px,
    rgba(14, 63, 126, 0.05) 0px 0px 20px 0px,
    rgba(14, 63, 126, 0.07) 0px 0px 50px 0px;
}

.l-img::before { content:''; display: block; width: 12px; height: 12px; position: absolute; top:-10px; left:-10px; background: #E97935; border-radius: 20px; animation: cir1 1s linear infinite; }
.l-img::after { content:''; display: block; width: 12px; height: 12px; position: absolute; top:-10px; right:-10px; background: #a0c6f7; border-radius: 20px; animation: cir1 2s linear infinite; opacity: 0;}

@keyframes loader5 {
    0% { transform: rotate(0deg) scale(1.0); border-radius: 20px; }
    25% { transform: rotate(90deg) scale(0.9); }
    50% { transform: rotate(180deg) scale(1.0); border-radius: 50px;  }
    75% { transform: rotate(270deg) scale(0.9); }
    100% { transform: rotate(360deg) scale(1.0); border-radius: 20px; }
}

@keyframes cir1 {
    0% { transform: scale(0.1); opacity: 0; }
    50% { transform: scale(1.2); opacity: 1; }
    100% { transform: scale(0.1); opacity: 0; }
}
/* ============================================================================================ */