@charset "utf-8";

/* loading 250729 재정의_mj */

.loginBodyWrap{
    width: 100%;
    text-align: center;
}

.loginBodyWrap .loading{
    margin: 0 auto;
    width: 50px;
    height: 50px;
    position: relative;    
}

.loading span {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: grey;
    top: 0;
    left: 0;
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0%,
    100% {
      top: 0;
      left: 0;
      background-color: red;
    }
    25% {
      top: 0;
      left: calc(100% - 10px);
      background-color: dodgerblue;
    }
    50% {
      top: calc(100% - 10px);
      left: calc(100% - 10px);
      background-color: orange;
    }
    75% {
      top: calc(100% - 10px);
      left: 0;
      background-color: yellowgreen;
    }
  }  
      
  .loading span:nth-child(2) {
    animation-delay: .75s;
  }	

/* ******* Main Layout 250515 재정의_mj *******/
.layout {
    overflow: hidden;
    min-width: 1276px;
}

/********************* Header *********************/
/* .layout-header {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 15px;
      width:100%;  /* V2 버전삭제 
    min-width: 1024px;
    height: 50px;
    background-color: transparent;
} */

.layout-header {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;
    margin-top: 15px;
    margin-left: 200px;
    min-width: 1024px;
    height: 50px;
    /*overflow: hidden;*/
    background: transparent;
    /* system.css에 #333 색상정의 되어 있어 투명으로바꿈 */
}

.layout-header::after {
    content: "";
    display: block;
    clear: both;
}

/********************* Body *********************/

.layout-body {
    width: 100%;
    height: 100%;
}

/********************* left menu *********************/

.layout-body-left {
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--ls_slide_bg_color);
    color: var(--ls_slide_text_color);
    border-right: 0;
    box-shadow: 0 0 2rem 0 rgba(0, 0, 0, .05);
    width: 245px;
    z-index: 1;
	/*	(2025.09.26 채준수 레이아웃 오류발생으로 인해 주석처리)*/
	/*	height: 100vh; */
    padding: 0 15px;
    margin-left: 0;
    /* 기본적으로 보이도록 왼쪽 마진을 0으로 설정 */
    transition: margin-left 0.4s ease-in-out;
    /* 부드러운 전환 효과 */
    border-right: var(--ls_slide_bg_line_color);
}

.layout-body-left a {
    display: block;
}

.layout-body-left::after {
    content: "";
    display: block;
    clear: both;
}

/* left logo*/
.sidebarBrand,
.sidebarBrand:hover {
    color: #fff;
    display: block;
    font-size: 1.175rem;
    font-weight: 500;
    padding: 40px 15px 15px;
    text-decoration: none;
    width: 100%;
    background-color: transparent;
    text-align: center;
}

.sidebarBrand img {
    filter: var(--ls_slide_logo_filter);
}

/* left User */
.sidebarUser {
    background-color: var(--ls_slide_sidebarUser_bg_color);
    color: var(--ls_slide_sidebarUser_text_color);
    padding: 15px;
    text-align: center;
    border: var(--ls_primary_line_style);
    margin: 15px 0 20px;
    border-radius: 15px;
}

.sidebarUser .sidebarUserName {
    font-size: var(--ls-title-size);
    font-weight: bold;
}

.sidebarUser img {
    height: 92px;
    width: 92px;
    border-radius: 50%;
    margin-bottom: 14px;
}

.sidebarUserTitle {
    display: flex;
    margin-top: 15px;
    border-top: var(--ls_primary_line_style);
}

.sidebarUserTitle li {
    margin-top: 15px;
    width: 50%;
}

.sidebarUserTitle li:first-child {
    border-right: var(--ls_primary_line_style);
}

.sidebarUserTitle li a {
    display: block;
    color: var(--ls_slide_sidebarUserTitle_text_color);
}

.sidebarUserTitle li a i {
    margin-right: 5px;
}

.sidebarUser img {
    height: 92px;
    width: 92px;
    border-radius: 50%;
    margin-bottom: 14px;
}

/* left TabMenu (업무메뉴 / 나의 메뉴)*/

.layout-body-left .nav-tabs {
    margin-bottom: 15px;
}

.layout-body-left .nav-tabs ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
}

.layout-body-left .nav-tabs li {
    /* float: left; */
    padding: 0;
    margin: 0;
    width: 50%;
}


.layout-body-left .nav-tabs li a {
    display: block;
    width: 100%;
    border: 1px solid #f4f4f4;
    padding: 5px;
    font-size: var(--ls-basic-size);
    text-align: center;
    line-height: 1.5;
}

.layout-body-left .nav-tabs li a:hover,
.layout-body-left .nav-tabs li a:focus,
.layout-body-left .nav-tabs li a:active {
    background: rgba(222, 226, 230, 0.5);
}

.layout-body-left .nav-tabs li a.on {
    color: white;
    border: 1px solid #009bb4;
    background: #009bb4;
}


/* 나의메뉴 */
.layout-body-left .lnb-myMenu li {
    position: relative;
    border-bottom: 1px solid #e0e0e0;
    /*    background-color: #eee;  */
}

.layout-body-left .lnb-myMenu li:hover {
    background: #f6fafd;
}

.layout-body-left .lnb-myMenu li a {
    position: relative;
    padding: 9px 15px;
    -webkit-transition: all .7s;
    transition: all .7s;
    margin-right: 20px;
    color: var(--ls_sub_gray);
}

.layout-body-left .lnb-myMenu li a:hover {
    /* color: #c8294b; */
    color: #222c6b;
    font-weight: 500;
    /* 250616 추가_mj */
}

.layout-body-left .lnb-myMenu li .fav-del {
    position: absolute;
    right: 13px;
    top: 50%;
    margin-top: -6px;
    width: 12px;
    height: 12px;
    cursor: pointer;
    background: url('../images/btn-fav-del.png') 50% no-repeat;
}


/*********************************/
/*       탭 재정의                */
/*********************************/

.layout-body-tab-header {
    position: absolute;
    top: 55px;
    left: 20px;
    /* right: 20px; */
    right: 14px;
    margin-left: 200px;
    min-width: 984px;
    height: 35px;
    /* border-bottom: 1px solid #949494; 250610 삭제_mj*/
    overflow: hidden;
    background-color: transparent;
    z-index: 1;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: end;
    background-color: white;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.layout-body-tab-header .scrollBlind {
    width: calc(100% - 40px); /* 좌우 버튼 공간 제외 */
    margin-right: 20px;
    overflow-x: auto;
    white-space: nowrap;
    position: relative;
    height: 30px;
}

.layout-body-tab-header .scrollBlind::-webkit-scrollbar {
    /* 250624 해당 부분만 scroll bar 안보이게 처리_mj */
    display: none;
    width: 0;
    height: 0;
}

#ul-main-tab-header {
    display: flex;           /* flex 컨테이너 */
    flex-wrap: nowrap;     /*   한 줄로 유지, 줄바꿈 금지 */
    align-items: center;     /* 세로 정렬 */
    overflow-x: auto;        /* 가로 스크롤 가능 */
    white-space: nowrap;     /* 텍스트 줄바꿈 방지 */
    margin: 0;
    padding: 0;
    list-style: none;
    height: 30px;            /* 필요 시 높이 고정 */
    min-width: max-content;  /* 부모보다 넓으면 스크롤 가능 */
    
}

/* li는 inline-block 말고 flex item으로 */
#ul-main-tab-header > li {
    flex: 0 0 auto;          /* 아이템 너비 고정 */
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 2px;
    height: 30px;            /* 부모 높이에 맞춤 */
    width: 150px;
    background: #edf2f9;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

#ul-main-tab-header > li:hover{
    background: rgba(237, 242, 249, 0.1);
background: linear-gradient(180deg,rgba(237, 242, 249, 1) 0%, rgba(237, 242, 249, 1) 90%, rgba(0, 186, 200, 1) 90%, rgba(0, 186, 200, 1) 100%);
-webkit-transition: background-color 0.3s, -webkit-transform 0.3s;
    transition: background-color 0.3s, transform 0.3s;
    /* -webkit-transition-timing-function: ease, cubic-bezier(0.7, 0, 0.3, 1);
    transition-timing-function: ease, cubic-bezier(0.7, 0, 0.3, 1);
    -webkit-transform: translate3d(0, 100%, 0) translate3d(0, -3px, 0);
    transform: translate3d(0, 100%, 0) translate3d(0, -4px, 0); */
}

/* placeholder 스타일 (위치 잡는 용도) */
.tab-placeholder {
    width: 120px; /* 탭 너비와 비슷하게 */
    border: 2px dashed #ccc;
    background: #f9f9f9;
    visibility: visible !important;
}

#ul-main-tab-header::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

#ul-main-tab-header li.tab-current button.tab-close-btn i {
    color: white;
}

#ul-main-tab-header li.open
 {
    background: #00bac8;
}

#ul-main-tab-header li.open a{
    color: var(--ls_primary_white);
}

#ul-main-tab-header li a {
    position: relative;
    width: 133px;
    padding: 0 2px 0 9px;
    font-size: 13px;
    font-weight: 500;
    color: #222c6b;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    box-sizing: border-box;
}

#ul-main-tab-header li:first-child a {
    margin-left: 0;
}

#ul-main-tab-header button.tab-close-btn
 {    
    display: block;
    background-color: transparent;
    width: 17px;
    height: 100%;
    font-size: 11px;
}

#ul-main-tab-header button.tab-close-btn svg {
    position: relative;
    font-size: 10px;
    color: #222c6b;
    top: 0;
    left: -2px;
}

#ul-main-tab-header li.open button.tab-close-btn svg {
    color: white;
}


/* Util Menu  (탭 우측 화살표 버튼)*/

.util_menu {
    position: relative;
    right: auto;
    left: 0;
    background-color: transparent;
    padding: 0 10px 4px 20px;
    flex-shrink: 0;
}

.util_menu .btn-menu-favicon,
.util_menu .btn-mdi-prev,
.util_menu .btn-mdi-next,
.util_menu .tab-close-all-btn {
    position: relative;
    /* float: left; */
    width: 20px;
    height: 20px;
    /* margin-left: 2px; */
    background-color: var(--ls_primary_blue);
    border-radius: 1px;
    color: #fff;
}

.util_menu .btn-menu-favicon {
    border: 1px solid #d4d4d4;
    background-color: transparent;
    margin-right: 5px;
}

.util_menu .btn-menu-favicon::before,
.util_menu .btn-mdi-prev::before,
.util_menu .btn-mdi-next::before,
.util_menu .tab-close-all-btn::before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    top: 5px;
    left: 7px;
    background: url("../images/btn-tabClose-all.png") no-repeat;
}

.util_menu .tab-close-all-btn::before {
    left: 5px;
}

.util_menu .btn-menu-favicon::before {
    top: 3px;
    left: 3px;
    width: 12px;
    height: 11px;
    background: url("../images/btn-menu-faviconOff.png") no-repeat;
}

.util_menu .btn-menu-favicon.on::before {
    background: url("../images/btn-menu-favicon.png") no-repeat;
}

.util_menu .btn-mdi-prev::before,
.util_menu .btn-mdi-next::before {
    width: 5px;
    height: 9px;
    background: url("../images/btn-mdi-prev.png") no-repeat;
}

.util_menu .btn-mdi-next::before {
    left: 8px;
    background: url("../images/btn-mdi-next.png") no-repeat;
}


/* .layout-body-tab-body { // 250725 하단 중복 삭제_mj
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    min-width: 1024px;
} */

.layout-body-tab-body {
    position: absolute;
    left: 20px;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    /* min-width: 1024px; */
    min-width: 984px;
    margin: 1em;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

.layout-footer {
    width: 100%;
    display: none;
}

.iframe {
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
}

.contents {
    /* clear: both; 250718 ::after 중복으로 삭제_mj*/
    float: none;
    width: auto;
    width: initial;
    /* padding: 5px 20px 20px; 250716 수정_mj*/
    padding: 5px 20px;
    min-height: auto;
}

.contents::after {
    content: "";
    display: block;
    clear: both;
    height: 100%;
}


/*********************************/
/*       컴포넌트 영역             */
/*********************************/


/* ******* RapWeb Validation 시작 *******/
.required-header:before {
    content: "*";
    color: #c8294b;
}

.required-body,
.required-body .ax5select-display-table,
.required-body input,
.required-body textarea,
.required-body .required-target {
    /* background-color:#fff5f5 !important // 250605 색상 변경_mj*/
    background-color: var(--ls_form_required_bg_color) !important;
}

.required-body-white {
    background-color: #fff !important
}

.required-tooltip {
    background-color: #1c96da !important;
    border-color: #0d80bf !important;
    font-family: var(--ls-basic-font-family) !important;
    color: #ffffff !important;
    font-weight: normal !important;
}

.info-tooltip {
    background-color: #fffac4 !important;
    border-color: #f8ce3a !important;
    font-family: var(--ls-basic-font-family) !important;
    color: #866c12 !important;
    font-weight: normal !important;
}

/* ******* RapWeb Validation 끝 *******/

/* ******* RapWeb Disabled 시작 *******/
.disabled,
.disabled .ax5select-display-table,
.disabled input,
.disabled textarea,
.disabled .required-target,
.disabled .searchcombo-result,
.disabled [data-ax5select-display="label"],
:disabled,
button[type="button"]:disabled:hover {
    pointer-events: none;
    background-color: #f0f0f0 !important;
    color: var(--ls_basic_font_color);
}

a.ico_up:disabled:hover,
button[type="button"][class~="ico_up"]:disabled:hover {
    padding-left: 23px;
    background-position: 3px -332px
}

a.ico_down:disabled:hover,
button[type="button"][class~="ico_down"]:disabled:hover {
    padding-left: 23px;
    background-position: 3px -357px
}

/* ******* RapWeb Disabled 끝 *******/

.tab-body {
    width: 100%;
    min-height: 100%;
}

.form-container {}

.rapweb-form {
    position: absolute;
    width: 100%;
    height: 100%;
}

/* 250619 빈 그리드 영역 표시 추가 - 기준정보 > 권역그룹 관리 _mj */
.rapweb-form-box{
    position: relative;
    background: rgba(0, 117, 190, 0.035);
    padding: 20px 15px;
    border-radius: 10px;
    width: 100%;
    height: auto;
    min-height: 200px;
}

.rapweb-form-box::before{
    content: '조회 결과 내용이 나오는 영역입니다.';
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: var(--ls-headline-size);
    color: var(--ls_primary_blue);
    opacity: 0.5;
    text-align: center;
    width: 80%;
}
/* // 250619 빈 그리드 영역 표시 추가 - 기준정보 > 권역그룹 관리 _mj */

/* ******* RapWebInput 시작 *******/
.input-container {
    line-height: 0;
}

/*  20250506 삭제 처리_mj
.input-container input[type='text']{
    width: 100%;
    padding: 5px 7px 4px !important;
}
*/

.input-container input:focus {
    /* 250605 추가_mj */
    color: #212529;
    background-color: #fff;
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

/* ******* RapWebInput 끝 *******/


/* ******* RapWebSelect 시작 *******/
.select-container {
    width: 100%;
    height: 26px !important;
    border: none;
    padding: 0px !important;
    margin: 0px !important;
}

/* ******* RapWebSelect 끝 *******/

/* ******* RapWebTextArea 시작 *******/
.textarea-container {
    width: 100%;
    border: 1px solid #ccc;
}

.textarea-header {
    height: 15px !important;
    line-height: 15px !important;
    border: none;
    padding: 7px 10px 5px 10px !important;
}

.textarea-textarea {
    border: none;
    padding: 0px 10px 10px 10px !important;
    font-family: var(--ls-basic-font-family);
}

.textarea-btn-up {
    padding: 0 0 0 16px !important;
    background: url('../images/file/ic_up.png') 3px 50% no-repeat;
}

.textarea-btn-down {
    padding: 0 0 0 16px !important;
    background: url('../images/file/ic_down.png') 3px 50% no-repeat;
}

.textarea-hover {
    border-radius: 3px;
    background-color: #e5e5e5 !important;
}

.textarea-overflow {
    color: #ba1f3f;
}

/* ******* RapWebTextArea 끝 *******/


/* ******* RapWebSearchCombo 시작 *******/

.searchcombo-search {

    border: 1px solid #ccc;

    /* display: table; 250528 삭제_mj  */

    display: flex;/* 250528 변경_mj */
    align-items: center;/* 250925 추가_mj*/

    background-color: #fff; 

    line-height: 26px;

    width: 100%;

    border-radius: 4px;
    /* 250528 추가_mj*/

}

.searchcombo-search .searchimage {

    /* display: table-cell; 250925 삭제_mj */

    display: inline-block;
    /* 250925  변경_mj */

    width: 24px;

    line-height: 25px;

}

.searchcombo-search .searchcontents {
    /* display: table-cell; 250925 삭제_mj*/

    /*250925 추가_mj*/
    display: flex;
    flex-grow: 1;
    overflow: hidden;
    /* //250925 추가_mj*/

    line-height: 25px;
}

.searchcombo-search .searchbutton {
    display: table-cell;
    line-height: 25px;
    width: 20px;
    text-align: left;
}

.searchcombo-search .ic-search::before {
    display: inline-block;
    content: "\f002";
    font: 13px/1 fontAwesome;
    color: #747474;
}

.searchcombo-search div input[type="text"] {
    border: none !important;
    padding: 0px !important;
    height: 22px !important;
    width: 100% !important;
}

.searchcombo-resultdisplay {
    overflow: hidden;/* 250929 추가_mj */
    border: 1px solid transparent;
    background: #eee;
    position: relative;
    margin: 3px 4px 3px 4px;
    padding: 0px 5px 0px 6px;
    cursor: default;
    width:100%;/* 250929 수정(auto -> 100%) _mj */
    /* float: left; 250925 삭제_mj*/  
    border-radius: 3px;
    font-size: 13px;
    line-height: 17px !important;
}

/* 250925 추가_mj */
 .searchcombo-resultdisplay label{
    width: 95%;
    position: relative;
    top: 2px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
 } 

  .searchcombo-resultdisplay a{
    position: absolute;
    right: 3px;
    top: 2px;
  }

  /* // 250925 추가_mj */

.searchcombo-readonly {
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-radius: 3px;
    font-size: 13px;
    line-height: 17px !important;
}

.searchcombo-readonly a:hover {
    text-decoration: underline;
    color: #0054ff;
}

.searchcombo-result {
    width: 100%;
    height: 60px;
    margin-top: 2px;
    padding: 3px 0px;
    border: 1px solid #ccc;
    background-color: #fbfbfb;
    color: #555;
    overflow: auto;
}

/* ******* RapWebSearchCombo 끝 *******/

/* ******* RapWebFile 시작 *******/

.file-container {

    width: 100%;

    padding: 5px 7px;

    position: relative;

    border: 1px #c3c3c3 dashed;

    border-radius: var(--ls_primary_line_board_radius);
    /*  250528 추가_mj */
}


.file-container-single {

    width: 100%;

    padding: 0px 7px;

    position: relative;

    border: 1px #c3c3c3 dashed;

    border-radius: var(--ls_primary_line_board_radius);
    /*  250528 추가_mj */

}

.file-not-exists {
    line-height: 24px;
    vertical-align: middle;
    color: #888;
}

.file-header {
    height: 28px;
}

.file-header-single {
    height: 24px;
}

.file-header-left {
    line-height: 24px;
}

.file-header-right {
    line-height: 24px;
}

.file-header-right span {
    margin-right: 5px !important;
}

.file-body {
    padding-top: 5px;
    margin-right: 0px;
    min-height: 28px;
    border-top: 1px #e1e1e1 dashed;
}

.file-body-single {
    margin-right: 0px;
    min-height: 24px;
}

.dragover {
    /* min-height:24px !important; */
    border: 1px #f92465 solid !important;
    background-color: #ffebf1;
}

.file-body-scroll {
    overflow: auto;
    overflow-x: hidden
}

.file-table .file-table-single {
    border-top: none !important;
}

.file-table tbody td {
    padding: 0px 5px 0px 0px !important;
    border: 0px !important;
    height: 22px !important;
}

.file-table-single tbody td {
    padding: 0px 5px 0px 0px !important;
    border: 0px !important;
    height: 24px !important;
}

.file-table tbody td a {
    hover:hover {
        text-decoration: underline;
    }
}

.file-table-single tbody td a {
    hover:hover {
        text-decoration: underline;
    }
}

.file-table-td-delete {
    width: 27px;
}

.file-table-td-thumbnail {
    width: 21px;
}

.file-table-td-name {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.file-table-td-size {
    text-align: right !important;
    width: 100px;
}

.file-btn-add {
    margin-right: 5px !important;
    padding: 0 0 0 24px !important;
    background: url('../images/file/ic_clip.png') 2px 50% no-repeat;
}

.file-btn-delete {
    margin-right: 5px !important;
    padding: 0 0 0 24px !important;
    background: url('../images/file/ic_trash.png') 5px 50% no-repeat;
}

.file-btn-up {
    margin-left: 5px !important;
    padding: 0 0 0 16px !important;
    background: url('../images/file/ic_up.png') 3px 50% no-repeat;
}

.file-btn-down {
    margin-right: 5px !important;
    padding: 0 0 0 16px !important;
    background: url('../images/file/ic_down.png') 3px 50% no-repeat;
}

.file-btn-download {
    margin-right: 5px !important;
    padding: 0 0 0 24px !important;
    background: url('../images/file/ic_download.png') 2px 50% no-repeat;
}

.hover {
    border-radius: 3px;
    background-color: #e5e5e5 !important;
}

.file-btn-sub-download {
    padding: 0 0 0 25px !important;
    background: url('../images/file/ic_download.png') 5px 50% no-repeat;
}

.file-btn-sub-delete {
    padding: 0 0 0 25px !important;
    background: url('../images/file/ic_trash.png') 5px 50% no-repeat;
}

/* ******* RapWebFile 끝 *******/


/* ******* RealGrid 시작 *******/
.rgrw-header {
    height: 25px;
}

.rgrw-footer {
    height: 28px;
    background-color: #f4f3f3;
    border-width: 0 1px 1px 1px;
    border-style: solid;
    border-color: #e0e0e0;
}

.rgrw-paging {
    vertical-align: middle;
}

.rgrw-paging-count {
    vertical-align: middle;
}

.rgrw-paging .txtPageIndex {
    width: 40px;
    height: 24px;
    text-align: right;
    padding: 5px 3px
}

.rgrw-paging .selRowSize {
    width: 56px;
    height: 24px;
}

.rgrw-paging span {
    line-height: 26px;
    vertical-align: middle;
}

/* Icon 출처, fontawesome & octicon, https://fontawesome.com, https://octicons.github.com */
.rgrw-paging .btnMoveFirst {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/step-backward.png')no-repeat center
}

.rgrw-paging .btnMoveFirst-disabled {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/step-backward_disable.png')no-repeat center
}

.rgrw-paging .btnMovePrev {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/caret-left.png')no-repeat center
}

.rgrw-paging .btnMovePrev-disabled {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/caret-left_disable.png')no-repeat center
}

.rgrw-paging .btnMoveNext {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/caret-right.png')no-repeat center
}

.rgrw-paging .btnMoveNext-disabled {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/caret-right_disable.png')no-repeat center
}

.rgrw-paging .btnMoveLast {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/step-forward.png')no-repeat center
}

.rgrw-paging .btnMoveLast-disabled {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/step-forward_disable.png')no-repeat center
}

.rgrw-paging .btnRefresh {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/sync.png')no-repeat center
}

.rgrw-paging .btnRefresh-disabled {
    width: 35px;
    height: 23px;
    border: none;
    background: url('../images/ico/sync_disable.png')no-repeat center
}

.rgrw-paging-count span {
    line-height: 26px;
    vertical-align: middle;
}

/* ******* ErrorPage 시작 *******/
.errorCode {
    position: relative;
    top: 20%;
    width: 680px;
    margin: 0 auto;
    /* border: 1px solid #d6d7d8;
    background-color: #f8f8f8; */
    border-radius: 10px;
    text-align: center;
    padding: 190px 20px 50px;
}

.errorCode::before {
    content: '';
    display: block;
    position: absolute;
    top: 40px;
    left: 50%;
    width: 127px;
    height: 113px;
    background: url('../images/img_error_common.png') no-repeat;
}

.errorCode>ul {
    border-top: 1px solid #eaeaea;
    padding-top: 10px;
}

.errorCode>ul>li {
    font-size: 20px;
    color: #2d353c;
    padding: 8px 0;
}

.errorCode>ul>li:first-child {
    font-size: 30px;
    color: #981a4a;
    letter-spacing: -.009em;
    /* line-height: initial; */
    padding: 20px 0 30px;
}

/* ******* ErrorPage 끝 *******/

.bgColor-none {
    background-color: transparent !important;
}

/* Table thead Fixed */
.fixed-table table tbody {
    overflow-y: auto;
    display: inline-block;
}

.fixed-table table tbody tr {
    table-layout: fixed;
    display: table;
    width: 100%;
}

/* System Warning */
.system-warning-text {
    position: absolute;
    right: 20px;
    bottom: 2px;
    z-index: 30000;
    font-size: 13px;
    font-weight: bold;
    color: red;
}


/*********************************/
/*            Log-in             */
/*********************************/
/* body {
    margin: 0;
    font-family: 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif; /* 한국어 폰트 추가 
    overflow: hidden; /* 배경 이미지가 스크롤되는 것을 방지 
} */

.login .background-container {
    background: url('/resource/images/home/login_bg.jpg') no-repeat center center fixed; /* 이미지 파일명을 제공된 이미지 파일명으로 수정했습니다. */
    background-size: cover;
    width: 100vw; 
    height: 100vh;
    display: flex;
    justify-content: center; 
    align-items: center; 
    overflow: hidden;
}

.login .login-container {
    display: flex;
    background-color: rgba(255, 255, 255, 0.95);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    overflow: hidden;
    width: 800px;
    max-width: 90%;
    font-size: var(--ls-title-size);
    color: var(--ls_primary_blue);
    line-height: 1.5;
    font-weight: 500;
    border-radius: 11px;
}

.login .login-left {
    flex: 1; 
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f0f2f5;
}

.login .login-left img {
    max-width: 100%;
    height: auto;
    display: block;
}

.login .login-right {
    flex: 1;
    padding: 0 50px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    background: white;
}

.login .login-header {
    width: 100%;
    text-align: center;
    margin-top: 40px;
}

.login .login-header h2 {
    margin: 0;
    color: #333;
    font-size: var(--ls-display-size);
    font-weight: normal;
    line-height: 1.2;
}

.login .login-form {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.login .input-area{
    width: 100%;
    text-align: center;
    margin-bottom: 50px;
}

.login .input-group {
    width: 100%;
}

.login .input-group + .input-group{
    margin-top: 8px;
}

.login .input-group input[type="text"],
.login .input-group input[type="password"]
 {
    width: 100%;
    height: 40px;
    padding: 12px 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: inherit;
    box-sizing: border-box;
    color: var(--ls_basic_font_color);
}

.login .input-group input[type="text"]:focus,
.login .input-group input[type="password"]:focus
 {
    color: #212529;
    background-color: #fff;
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.login .login-button {
    position: relative;
    width: 65%;
    padding: 14px 20px;
    background: #0075be;
    font-size: inherit;
    font-weight: 500;
    color: white;
    border: none;
    border-radius: 25px;
    cursor: pointer;
    margin-top: 20px;
    transition: 0.6s cubic-bezier(0.77, 0, 0.175, 1);    
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20);
    overflow: hidden;
}

.login .login-button span{
    position: relative; 
  z-index: 1;
}

.login .login-button::after{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 490%;
    width: 140%;
    background: #004381;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    -webkit-transform: translateX(-98%) translateY(-25%) rotate(45deg);
    transform: translateX(-98%) translateY(-25%) rotate(45deg);
}

.login .login-button:hover::after,
.login .login-button.none-member:hover::after {
    -webkit-transform: translateX(-9%) translateY(-25%) rotate(45deg);
    transform: translateX(-9%) translateY(-25%) rotate(45deg);
}

.login .logo-area div:first-child::after {
    content: "서비스 이행";
    font-size: 0.85em;
    color: #666;
    margin-top: 5px;
}

.login .logo-area div:last-child::after {
    content: "설치/시운전 이행";
    font-size: 0.85em;
    color: #666;
    margin-top: 5px;
}

.login .logo-area.second div:first-child::after {
    content: "서비스 요청";
    font-size: 0.85em;
    color: #666;
    margin-top: 5px;
}

.login .logo-area.second div:last-child::after {
    content: "설치/시운전 확인";
    font-size: 0.85em;
    color: #666;
    margin-top: 5px;
}

.login .sign-button{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.login .sign-button a,
.login .member_search button
{
    font-size: var(--ls-basic-size);
    color: var(--ls_primary_blue);
}

.login .sign-button a:hover,
.login .sign-button a:active,
.login .sign-button a:focus,
.login .member_search button:hover,
.login .member_search button:active,
.login .member_search button:focus{
    color: var(--ls_sub_green);
}

.login .sign-button span{
    font-size: 10px;
    vertical-align: middle;
    width: 10px;
    display: inline-block;
    text-align: center;
    color: var(--ls_sub_gray);
}

.login .login-button.none-member{
    width: 100%;
    background: #009bb4;
}

.login .login-button.none-member::after{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 800%;
    width: 120%;
    background: #ed174b;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    -webkit-transform: translateX(-98%) translateY(-25%) rotate(45deg);
    transform: translateX(-90%) translateY(-7%) rotate(45deg);
}
.none-member:hover,
.none-member:active,
.none-member:focus
 {
    background-color: rgba(5, 105, 160, 0.75);
}

/*	(2025.09.26 채준수 레이아웃 오류발생으로 인해 사이드컨텐트 영역 스타일 수정)*/
.side-content{
	padding-bottom:10px;
}

.side-content .download-manual-btn{
	position: relative;
	width: 100%;
	padding: 8px 16px;
	background: #f4f4f4;
	font-size: 12px;
	color: #6c757d;
    border: none;
    border-radius: 5px;
    cursor: pointer;
	display:flex;
	align-items: center;
	margin-top:10px;
}

.side-content .go-family-site-btn {
    position: relative;
    width: 100%;
    padding: 8px 16px;
    background: #f4f4f4;
    font-size: 12px;
	color: #6c757d;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 5px;
	display:flex;
	align-items: center;
	justify-content: space-between;
}

.side-content .go-family-site-btn .familyMenu{
    font-family: var(--ls-basic-font-family);
	display: none;
	position: absolute;
	bottom: 34px;
	left:0px;
	padding: 8px 15px 10px;
	border-radius: 6px;
	border : 1px solid #ddd;
	box-sizing: border-box;
	background: #f4f4f4;
	color: var(--ls_gnbArea_subNav_text_color);
	font-size: var(--ls_gnbArea_subNav_text_font_size);
	z-index: 99999;
	letter-spacing: -0.05em;
	width: 100%;
	max-height: 90px;
	overflow:auto;
	transition: margin-left 0.3s ease-in-out;
	/* 부드러운 전환 효과 */
}

.side-content .go-family-site-btn .familyMenu>li {
    font-family: var(--ls-basic-font-family);
    display: block;
    padding: 0;
    line-height: 28px;
    white-space: nowrap;
}

.side-content .go-family-site-btn .familyMenu.on {
    display: block
}

.side-content .go-family-site-btn .familyMenu>li a {
    display: block;
    padding: 0;
    font-size: 12px;
    line-height: 28px;
    color: var(--ls_gnbArea_subNav_link_color);
    white-space: nowrap
}

.side-content .go-family-site-btn .familyMenu>li>a:hover {
    font-weight: 500;
    color: var(--ls_gnbArea_subNav_link_hover_color);
}

.side-content .manager-info {
    position: relative;
    width: 100%;
    padding: 8px 16px;
    background: #f4f4f4;
    font-size: inherit;
    color: #6c757d;
    border: none;
    border-radius: 5px;
    margin-top: 5px;
    overflow: hidden;
}

.side-content .manager-info h5{
	margin-bottom: 5px;
}

.side-content .manager-info p{
	font-size: 12px;
	line-height: 1.2em;
}


/* 모바일 반응형 (250721 오픈 시 필요 없으면 삭제하세요_mj)*/
@media (max-width: 768px) {
    .login .login-container {
        flex-direction: column; 
        width: 95%;
    }

    .login .login-left {
        display: none; 
    }

    .login .login-right {
        padding: 20px;
    }
}

/* Privacy View Button 정의 */
.side-content .privacy-view-btn {
    position: relative;
    width: 100%;
    padding: 8px 16px;
    background: #f4f4f4;
    font-size: 12px;
    color: #6c757d;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    margin-top: 5px;
    justify-content: flex-start;
    transition: background 0.3s ease, color 0.3s ease;
}

.side-content .privacy-view-btn:hover {
    background: #e9ecef;
    color: #0b2c6b;
}

.side-content .privacy-view-btn i {
    margin-right: 6px;
    color: #6c757d;
}

.side-content .privacy-view-btn:hover i {
    color: #0b2c6b;
}
