@charset "utf-8";

/* Login ***************************************************************************************************/
.loginArea{position: relative; width: 100%; height: 100%; background: url(../images/img/login/bg03.png) no-repeat 50% 50%; background-size: cover; }
.loginArea .boxArea{position: absolute; right: 0px; width: 620px; height: 100%; background: rgba(0,0,0,0.7); backdrop-filter: blur(3px); }
.loginArea .boxArea > div{display: flex; flex-direction: column; align-items: center; justify-content: center; width: calc(100% - 240px); height: 100%; margin: -100px 120px 0; }
.loginArea .boxArea h1{display: block; overflow: hidden; text-indent: -999em; width: 350px; height: 44px; background: url(../images/logo/cubecore/symbol_cubecore_white.svg) no-repeat 50% 0; background-size: contain; margin-bottom: 80px; }
.loginArea .boxArea input{width: 100%; height: 58px; font-size: 18px; background-color: #FFFFFF; border: 1px solid #C8C8C8; border-radius: 6px; padding: 20px; margin-bottom: 25px; transition: all 0.3s ease; }
.loginArea .boxArea input::placeholder{color: #A1A1A1; }
.loginArea .boxArea input:focus{border: 2px solid #4176FF; padding-left: 19px; }
.loginArea .boxArea button{width: 100%; height: 58px; font-size: 18px; line-height: 58px; color: #FFFFFF; text-align: center; background: #4176FF; border-radius: 6px; margin-bottom: 25px; }
.loginArea .boxArea button:hover{background: rgba(65,118,255,0.95)/* #4176FF */; }

.loginArea .boxArea input,
.loginArea .boxArea button{box-shadow: 0px 2px 5px rgba(0,0,0,0.3); }

.loginArea .sub{width: calc(100% - 30px); font-size: 18px; color: #FFFFFF; line-height: 28px; }
.loginArea .sub a{display: inline-block; color: #FFFFFF; text-decoration: 2px underline; text-underline-offset: 3px; }
.loginArea .sub a:hover{color: #4176FF; }

/* Login 구분 */
.loginArea.divi_cube::before{display: block; content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); }
.loginArea.divi_cube .boxArea > div{width: 100%; justify-content: space-between; margin: 0; }
.loginArea.divi_cube .boxArea h1{margin-bottom: 0; }
.loginArea.divi_cube .boxArea{position: absolute; top: 50%; left: 50%; width: 700px; height: 550px; background: none; margin: calc(-610px / 2) 0 0 calc(-700px / 2); }

.loginArea.divi_cube .diviWrap{display: flex; align-items: center; width: 100%; }
.loginArea.divi_cube .diviWrap li{width: 50%; height: 448px; padding: 0 12px; }
.loginArea.divi_cube .diviWrap li a{display: block; width: 100%; height: 100%; background: #FFFFFF; border-radius: 10px; }
.loginArea.divi_cube .diviWrap li dl{display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; }
.loginArea.divi_cube .diviWrap li dt{font-size: 28px; font-weight: bold; color: #333333; background-position: 50% 0; background-repeat: no-repeat; padding: 143px 30px 0; margin: 18px 0 24px; }
.loginArea.divi_cube .diviWrap li dd{font-size: 20px; color: #666666; text-align: center; line-height: 28px; }

.loginArea.divi_cube .diviWrap li.office dt{background-image: url(../images/img/login/user_style1_blue.svg); }
.loginArea.divi_cube .diviWrap li.partner dt{background-image: url(../images/img/login/user_style2_green.svg); }

.loginArea.divi_cube .diviWrap li.office a:hover{background: #4176FF; }
.loginArea.divi_cube .diviWrap li.partner a:hover{background: #13A850; }

.loginArea.divi_cube .diviWrap li.office a:hover dt{background-image: url(../images/img/login/user_style1_white.svg); }
.loginArea.divi_cube .diviWrap li.partner a:hover dt{background-image: url(../images/img/login/user_style2_white.svg); }
.loginArea.divi_cube .diviWrap li a:hover dt,
.loginArea.divi_cube .diviWrap li a:hover dd{color: #FFFFFF; }


/* 레이아웃 구성 **********************************************************************************************/
.container{display: flex; justify-content: space-between; flex-wrap: wrap; }

.gnbArea{display: flex; }

.content{width: calc(100% - 60px); }


/* 레이아웃 화면 변경모음 ****************************************************************************************/
.gnbArea.toggle_on .gnb .gnb_panels{display: block; }
.gnbArea.toggle_hover .gnb .gnb_panels{display: block; z-index: 5; box-shadow: 0 2px 6px rgba(0,0,0,0.3); }

.gnbArea.toggle_on + .content .main{margin-left: 290px; }
.gnbArea.toggle_hover + .content .main{position: relative; z-index: 1; }

.conTopArea_hide .gnbArea .gnb .gnb_panels{top: 0px; height: 100vh; }
.conTopArea_hide .gnbArea .gnb .gnb_panels section{height: 100vh; }

.conTopArea_hide .content .conTopArea{display: none !important; }
.conTopArea_hide .content .conTopArea + .main{height: 100vh; }

.conTopArea_hide .content .conTopArea + .main .historyArea .history_btnArea .toggle_header{background-color: #666666; border: 1px solid #666666; }
.conTopArea_hide .content .conTopArea + .main .historyArea .history_btnArea .toggle_header a{background-image: url(../images/ico/arrow/down_white.svg); }

.conTopArea_hide .content .conTopArea + .main .conWrap{height: calc(100vh - 30px); }


/* GNB 메뉴 *************************************************************************************************/
.gnb{position: relative; }

.gnb .gnb_navbar{position: relative; z-index: 10; width: 60px; height: 100vh; background: #333333; }

/* GNB 메뉴 - 접기/펴기 토글 */
.gnb .gnb_navbar .gnb_toggle{display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; background: #252525; }
.gnb .gnb_navbar .gnb_toggle a{display: block; overflow: hidden; text-indent: -999em; width: 46px; height: 46px; background: url(../images/ico/menu/menu_style2_white.svg) no-repeat 50% 50%; background-size: 30px; border-radius: 50%; }
.gnb .gnb_navbar .gnb_toggle a:hover{background-color: #333333; transition: all 0.3s; }

/* GNB 메뉴 - 대표 아이콘 버튼 */
.js-tabs-controls{display: flex; flex-wrap: wrap; }
.is-hidden{display: none !important; }

.gnb .gnb_navbar .gnb_quick li a{display: block; overflow: hidden; text-indent: -999em; width: 60px; height: 60px; background-repeat: no-repeat; background-position: 50% 50%; background-size: 30px; }
.gnb .gnb_navbar .gnb_quick li a:hover{background-color: rgba(255,255,255,0.05); transition: all 0.3s; }

.gnb .gnb_navbar .gnb_quick li.gnb_menu a{background-image: url(../images/ico/apps/apps_style1_fill_gray.svg); }
.gnb .gnb_navbar .gnb_quick li.gnb_search a{background-image: url(../images/ico/search/search_style1_gray.svg); }
.gnb .gnb_navbar .gnb_quick li.gnb_favorite a{background-image: url(../images/ico/star/star_style1_gray.svg); }
.gnb .gnb_navbar .gnb_quick li.gnb_groupware a{background-image: url(../images/ico/monitor/monitor_style3_gray.svg); background-size: 28px; }
.gnb .gnb_navbar .gnb_quick li.gnb_help a{background-image: url(../images/ico/info/info_style1_gray.svg); }

.gnb .gnb_navbar .gnb_quick li.active a{background-color: rgba(255,255,255,0.05); }
.gnb .gnb_navbar .gnb_quick li.active a::before{display: block; content: ""; width: 4px; height: 60px; background: #5E83FF; background-image: linear-gradient(180deg, #69C0FF 0%, #5E83FF 100%); }

.gnb .gnb_navbar .gnb_quick li.gnb_menu a:hover,
.gnb .gnb_navbar .gnb_quick li.active.gnb_menu a{background-image: url(../images/ico/apps/apps_style1_fill_white.svg); }
.gnb .gnb_navbar .gnb_quick li.gnb_search a:hover,
.gnb .gnb_navbar .gnb_quick li.active.gnb_search a{background-image: url(../images/ico/search/search_style1_white.svg); }
.gnb .gnb_navbar .gnb_quick li.gnb_favorite a:hover,
.gnb .gnb_navbar .gnb_quick li.active.gnb_favorite a{background-image: url(../images/ico/star/star_style1_white.svg); }
.gnb .gnb_navbar .gnb_quick li.gnb_groupware a:hover,
.gnb .gnb_navbar .gnb_quick li.active.gnb_groupware a{background-image: url(../images/ico/monitor/monitor_style3_white.svg); }
.gnb .gnb_navbar .gnb_quick li.gnb_help a:hover,
.gnb .gnb_navbar .gnb_quick li.active.gnb_help a{background-image: url(../images/ico/info/info_style1_white.svg); }

/* GNB 메뉴 - 기타 아이콘 버튼 */
.gnb .gnb_navbar .gnb_etc{position: absolute; bottom: 0px; }
.gnb .gnb_navbar .gnb_etc li{position: relative; }
.gnb .gnb_navbar .gnb_etc li > a{display: block; overflow: hidden; text-indent: -999em; width: 36px; height: 36px; background-color: rgba(255,255,255,0.05); background-repeat: no-repeat; background-position: 50% 50%; background-size: 20px; border-radius: 50%; margin: 12px; }
.gnb .gnb_navbar .gnb_etc li > a:hover{background-color: rgba(255,255,255,0.1); transition: all 0.3s; }

.gnb .gnb_navbar .gnb_etc li.gnb_user > a{background-image: url(../images/ico/user/user_style6_gray.svg); }
.gnb .gnb_navbar .gnb_etc li.gnb_set > a{background-image: url(../images/ico/setting/setting_style2_gray.svg); }
.gnb .gnb_navbar .gnb_etc li.gnb_logout > a{background-image: url(../images/ico/login/logout_style1_gray.svg); }

.gnb .gnb_navbar .gnb_etc li.active > a{background-color: #6082E5; }

.gnb .gnb_navbar .gnb_etc li.gnb_user > a:hover,
.gnb .gnb_navbar .gnb_etc li.active.gnb_user > a{background-image: url(../images/ico/user/user_style6_white.svg); }
.gnb .gnb_navbar .gnb_etc li.gnb_set > a:hover,
.gnb .gnb_navbar .gnb_etc li.active.gnb_set > a{background-image: url(../images/ico/setting/setting_style2_white.svg); }
.gnb .gnb_navbar .gnb_etc li.gnb_logout > a:hover{background-image: url(../images/ico/login/logout_style1_white.svg); }

/* GNB 메뉴 - 기타 아이콘 개인정보 및 설정 활성화 */
.gnb .gnb_navbar .gnb_etc > li > a+ div{display: none; position: absolute; z-index: 10; left: 65px; width: 330px; background: #FFFFFF; border: 1px solid #6082E5; border-radius: 4px; padding: 15px 15px 20px; box-shadow: 0px 2px 4px rgba(0,0,0,0.2); }
.gnb .gnb_navbar .gnb_etc > li > a+ div .gnb_etc_tit{font-size: 16px; }

/* GNB 메뉴 - 기타 아이콘 개인정보 활성화 */
.gnb_user_con{bottom: -103px; }

/* 사용자이미지 */
.gnb_user_con .userImgArea{display: flex; justify-content: center; align-items: center; padding: 20px 0; }
.gnb_user_con .userImgArea p{position: relative; width: 100px; height: 100px; background: rgba(65,118,255,0.1)/* #4176FF */; border-radius: 50%; }
.gnb_user_con .userImgArea p a{display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background-image: none !important; }

/* 사용자이미지 - 카메라모양 표시 */
.gnb_user_con .userImgArea p a::after{content: ""; position: absolute; right: 0px; bottom: 0px; width: 32px; height: 32px; background: #B4B5B7 url(../images/ico/camera/camera_style1_white.svg) no-repeat 50% 50%; background-size: 20px; border-radius: 50%; box-shadow: 0 1px 4px rgba(0,0,0,0.1); }
.gnb_user_con .userImgArea p a:hover::after{background-color: #4176FF; }

/* 사용자이미지 -  카메라모양 숨기기 */
.gnb_user_con .userImgArea p.none a::after{display: none; }

/* 사용자이미지 -  사진이미지 사용 */
.gnb_user_con .userImgArea p a img{display: block; width: 100px; height: 100px; max-width: 100%; max-height: 100%; border-radius: 50%; object-fit: cover; }

/* 사용자이미지 -  사진이미지 미사용 때 아이콘처리 */
.gnb_user_con .userImgArea p a.my_empty{background-image: url(../images/ico/user/user_style4_blue.svg) !important; background-repeat: no-repeat; background-position: 50% 50%; background-size: 64px; }
.gnb_user_con .userImgArea p a.my_empty img{display: none; }

/* 개인정보 리스트 */
.gnb_user_con .userInfoList dl{position: relative; display: flex; align-items: center; justify-content: space-between; height: 50px; background-position: 0 50%; background-repeat: no-repeat; background-size: 20px; border-bottom: 1px solid #D8D8D8; padding-left: 25px; }
.gnb_user_con .userInfoList dl.name{background-image: url(../images/ico/user/user_style1.svg); }
.gnb_user_con .userInfoList dl.phone{background-image: url(../images/ico/phone/phone_style1.svg); }
.gnb_user_con .userInfoList dl.password{background-image: url(../images/ico/lock/lock_style1.svg); }

.gnb_user_con .userInfoList dl dt{font-size: 14px; color: #333333; line-height: 50px; }
.gnb_user_con .userInfoList dl dd{font-size: 14px; color: #666666; line-height: 50px; }

.gnb_user_con .userInfoList dl.phone dd > button{display: flex; align-items: center; font-size: 14px; color: #666666; }
.gnb_user_con .userInfoList dl.phone dd > button::before{display: block; content: ""; width: 20px; height: 20px; background: #F2F2F2 url(../images/ico/edit/edit_style2_fill_blue.svg) no-repeat 50% 50%; background-size: 12px; border-radius: 50%; margin-right: 5px; }
.gnb_user_con .userInfoList dl.phone dd.formStyle{display: none; }
.gnb_user_con .userInfoList dl.phone.on{align-items: flex-start; height: 90px; background-position: 0 15px; }
.gnb_user_con .userInfoList dl.phone.on dd:not(.formStyle){display: none; height: 50px; padding: 15px 0; }
.gnb_user_con .userInfoList dl.phone.on dd.formStyle{position: absolute; top: 48px; left: 0px; display: flex; align-items: center; line-height: 0px; }
.gnb_user_con .userInfoList dl.phone.on dd.formStyle .clearInput{width: calc(100% - 136px); margin-right: 2px; }
.gnb_user_con .userInfoList dl.phone.on dd.formStyle .btnArea{width: calc((68px * 2) + 2px); margin: 0px; }

.gnb_user_con .userInfoList dl a{display: flex; align-items: center; justify-content: space-between; width: 100%; }
.gnb_user_con .userInfoList dl a dd{font-size: 14px; color: #666666; text-align: right; }
.gnb_user_con .userInfoList dl a dd button{display: block; overflow: hidden; text-indent: -999em; width: 24px; height: 24px; background: url(../images/ico/arrow/right_gray.svg) no-repeat 50% 50%; }

.gnb_user_con .userInfoList dl a:hover dd button{background-image: url(../images/ico/arrow/right_blue.svg); }

/* 개인정보 리스트 - 비밀번호 변경 */
.gnb_user_con .pw_change li{margin-top: 15px; }
.gnb_user_con .pw_change li input{height: 34px; padding: 7px 27px 7px 5px; }
.gnb_user_con .pw_change li .clearInput button{top: 9px; right: 9px; }
.gnb_user_con .pw_change + .btnArea{width: calc(100% + 4px); margin: 13px 0 0 -2px; }
.gnb_user_con .pw_change + .btnArea button{width: calc(50% - 4px); height: 34px; }
.gnb_user_con .pw_change + .btnArea button span{line-height: 28px; }

/* GNB 메뉴 - 기타 아이콘 설정 활성화 */
.gnb_set_con{bottom: -55px; }
.gnb_set_con .setList{margin-top: 20px; }
.gnb_set_con .setList dl{position: relative; display: flex; align-items: center; justify-content: space-between; height: 50px; border-bottom: 1px solid #D8D8D8; }
.gnb_set_con .setList dt{font-size: 14px; color: #333333; line-height: 50px; }

/* 테마선택 */
.gnb_set_con .setList dl.thema{height: 90px; }
.gnb_set_con .setList dl.thema dt{position: absolute; top: 0px; }
.gnb_set_con .setList dl.thema dd{position: absolute; top: 49px; left: 0px; display: flex; align-items: center; justify-content: space-between; width: 100%; }
.gnb_set_con .setList dl.thema dd p{display: flex; align-items: center; justify-content: center; width: 20%; height: 24px; text-align: center; background: #FFFFFF; border: 1px solid #C8C8C8; border-radius: 4px; }
.gnb_set_con .setList dl.thema dd p:not(:last-child){margin-right: 5px; }
.gnb_set_con .setList dl.thema dd p:hover{background: #F2F2F2; }
.gnb_set_con .setList dl.thema dd p.active{color: #FFFFFF; background: #4176FF; border: 1px solid #4176FF; }


/* GNB 메뉴 아이콘 활성화영역 ************************************************************************************/
.gnbArea .gnb .gnb_panels{display: none; position: absolute; top: 60px; left: 60px; width: 290px; height: calc(100vh - 60px); background: #F0F1F7; border-right: 1px solid #CCCCCC; overflow-y: auto; }
.gnbArea .gnb .gnb_panels section{height: calc(100vh - 60px); }

/* GNB 메뉴 아이콘 활성화영역 - 메뉴 */
.gnbArea .gnb .gnb_panels .gnb_menu > div{background: #F0F1F7; }

/* 전체메뉴 열기 옵션표시 - Switch */
.gnbArea .gnb .gnb_panels .gnb_menu .gnb_menu_opt{position: sticky; z-index: 1; top: 0; width: 289px; height: 30px; background: #DFE2EC; }
.gnbArea .gnb .gnb_panels .gnb_menu .gnb_menu_opt dl{display: flex; align-items: center; justify-content: space-between; height: 100%; margin: 0 10px; }
.gnbArea .gnb .gnb_panels .gnb_menu .gnb_menu_opt dt{font-size: 12px; color: #666666; }

/* 메뉴 리스트 */
nav li .submenu{display: none; }
nav li.menuOn .submenu{display: block; }

nav li .submenu .submenu2{display: none; }
nav li .submenu .menuOn .submenu2{display: block; }

nav li .submenu .submenu2 .submenu3{display: none; }
nav li .submenu .submenu2 .menuOn .submenu3{display: block; }

nav li .submenu .submenu2 .submenu3 .submenu4{display: none; }
nav li .submenu .submenu2 .submenu3 .menuOn .submenu4{display: block; }

nav ol > li > a{display: block; height: 44px; line-height: 42px; font-size: 14px; color: #666666; box-sizing: border-box; }
nav ol > li > a:hover{background-color: rgba(96,130,229,0.07)/* #6082E5 */; }
nav ol > li > a + ul{display: none; background-color: #FFFFFF; border-bottom: 1px solid #DDDDDD; padding-bottom: 10px; }

nav ol > li a em{display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background-repeat: no-repeat; background-position: 18px 50%; padding: 2px 0 0 50px; }
nav ol > li a em.account{background-image: url(../images/ico/calculator/calculator_style1.svg); } /* 회계 */
nav ol > li a em.construction{background-image: url(../images/ico/cone/cone_style2.svg); } /* 공사 */
nav ol > li a em.control{background-image: url(../images/ico/video/video_style1.svg); } /* 관제 */
nav ol > li a em.cooperation{background-image: url(../images/ico/handshake/handshake_style1.svg); } /* 협업 */
nav ol > li a em.dart{background-image: url(../images/ico/alert/alert_style3.svg); } /* 공시 */
nav ol > li a em.defect{background-image: url(../images/ico/wrench/wrench_style1.svg); } /* 하자 */
nav ol > li a em.funds{background-image: url(../images/ico/dollarbag/dollarbag_style1.svg); } /* 자금 */
nav ol > li a em.hr{background-image: url(../images/ico/user/user_style7.svg); } /* 인사 */
nav ol > li a em.labor{background-image: url(../images/ico/hardhat/hardhat_style1.svg); } /* 노무 */
nav ol > li a em.management{background-image: url(../images/ico/user/user_style8.svg); } /* 경영 */
nav ol > li a em.material{background-image: url(../images/ico/truck/truck_style1.svg); } /* 자제 */
nav ol > li a em.orders{background-image: url(../images/ico/like/like_style1.svg); } /* 수주 */
nav ol > li a em.outsourcing{background-image: url(../images/ico/doc/doc_file_style6.svg); } /* 외주 */
nav ol > li a em.presale{background-image: url(../images/ico/building/building_style2.svg); } /* 분양 */
nav ol > li a em.quality{background-image: url(../images/ico/ribbon/ribbon_style2.svg); } /* 품질 */
nav ol > li a em.remixcon{background-image: url(../images/ico/truck/truck_style2.svg); background-size: 28px; } /* 레미콘 */
nav ol > li a em.safe{background-image: url(../images/ico/plus_circle/plus_circle_style1.svg); } /* 안전 */
nav ol > li a em.smart{background-image: url(../images/ico/building/building_style5.svg); } /* 스마트건설 */
nav ol > li a em.system{background-image: url(../images/ico/setting/setting_style3.svg); } /* SYSTEM */

nav ol > li.on > a{border-bottom: 1px solid #DDDDDD; }
nav ol > li.on > a + ul{display: block; }
nav ol > li.active > a > em{color: #FFFFFF; background-color: #6082E5; }
nav ol > li.active a em.account{background-image: url(../images/ico/calculator/calculator_style1_white.svg); } /* 회계 */
nav ol > li.active a em.construction{background-image: url(../images/ico/cone/cone_style2_white.svg); } /* 공사 */
nav ol > li.active a em.control{background-image: url(../images/ico/video/video_style1_white.svg); } /* 관제 */
nav ol > li.active a em.cooperation{background-image: url(../images/ico/handshake/handshake_style1_white.svg); } /* 협업 */
nav ol > li.active a em.dart{background-image: url(../images/ico/alert/alert_style3_white.svg); } /* 공시 */
nav ol > li.active a em.defect{background-image: url(../images/ico/wrench/wrench_style1_white.svg); } /* 하자 */
nav ol > li.active a em.funds{background-image: url(../images/ico/dollarbag/dollarbag_style1_white.svg); } /* 자금 */
nav ol > li.active a em.hr{background-image: url(../images/ico/user/user_style7_white.svg); } /* 인사 */
nav ol > li.active a em.labor{background-image: url(../images/ico/hardhat/hardhat_style1_white.svg); } /* 노무 */
nav ol > li.active a em.management{background-image: url(../images/ico/user/user_style8_white.svg); } /* 경영 */
nav ol > li.active a em.material{background-image: url(../images/ico/truck/truck_style1_white.svg); } /* 자제 */
nav ol > li.active a em.orders{background-image: url(../images/ico/like/like_style1_white.svg); } /* 수주 */
nav ol > li.active a em.outsourcing{background-image: url(../images/ico/doc/doc_file_style6_white.svg); } /* 외주 */
nav ol > li.active a em.presale{background-image: url(../images/ico/building/building_style2_white.svg); } /* 분양 */
nav ol > li.active a em.quality{background-image: url(../images/ico/ribbon/ribbon_style2_white.svg); } /* 품질 */
nav ol > li.active a em.remixcon{background-image: url(../images/ico/truck/truck_style2_white.svg); } /* 레미콘 */
nav ol > li.active a em.safe{background-image: url(../images/ico/plus_circle/plus_circle_style1_white.svg); } /* 안전 */
nav ol > li.active a em.smart{background-image: url(../images/ico/building/building_style5_white.svg); } /* 스마트건설 */
nav ol > li.active a em.system{background-image: url(../images/ico/setting/setting_style3_white.svg); } /* SYSTEM */

nav ol > li > a + ul,
nav ul:first-child{padding-top: 10px; }

/* 메뉴 1단계인경우 */
nav li.menu > a{display: flex; align-items: center; width: 100%; height: 24px; background-image: url(../images/ico/arrow/fill_right_gray6.svg); background-repeat: no-repeat; background-position: 9px 50%; background-size: 18px; transition: .2s; }
nav li.menu > a:hover{background-color: rgba(96,130,229,0.07)/* #6082E5 */; }
nav li.menu.menuOn > a{background-image: url(../images/ico/arrow/fill_down_gray6.svg); }

nav li.menu > a > em{width: 100%; font-size: 13px; line-height: 18px; color: #666666; background: url(../images/ico/folder/folder_style2_gray6.svg) no-repeat 27px 50%; background-size: 18px; padding: 4px 5px 2px 50px; }
nav li.menu.menuOn > a > em{background-image: url(../images/ico/folder/folder_style2_open_gray6.svg); }

/* 메뉴 1단계인경우 : .no_depth */
nav li.menu.no_depth > a{background-image: none !important; }
nav li.menu.no_depth > a > em{background-image: url(../images/ico/doc/doc_style2_gray6.svg); }

/* 메뉴 다단계인경우 - 공통 */
nav li.menu .submenu li a{position: relative; display: flex; align-items: center; }
nav li.menu .submenu li a:hover{background-color: rgba(96,130,229,0.07)/* #6082E5 */; }
nav li.menu .submenu li a em{font-size: 13px; color: #666666; background-image: url(../images/ico/doc/doc_style2_gray6.svg); background-repeat: no-repeat; background-size: 18px; }

/* 메뉴 다단계인경우 - 2단계 */
nav li.menu .submenu li a .submenu_indicator{left: 19px; }
nav li.menu .submenu li a em{background-position: 37px 50%; padding: 7px 5px 4px 60px; }

/* 메뉴 다단계인경우 - 3단계 */
nav li.menu .submenu2 li a .submenu_indicator{left: 29px; }
nav li.menu .submenu2 li a em{background-position: 47px 50%; padding: 7px 5px 4px 70px; }

/* 메뉴 다단계인경우 - 4단계 */
nav li.menu .submenu3 li a .submenu_indicator{left: 39px; }
nav li.menu .submenu3 li a em{background-position: 57px 50%; padding: 7px 5px 4px 80px; }

/* 메뉴 다단계인경우 - 5단계 */
nav li.menu .submenu4 li a .submenu_indicator{left: 49px; }
nav li.menu .submenu4 li a em{background-position: 67px 50%; padding: 7px 5px 4px 90px; }

/* 접기버튼, 펴기버튼 */
nav li.menu .submenu li a .submenu_indicator{position: absolute; width: 18px; height: 18px; background-repeat: no-repeat; background-position: 50% 50%; background-size: 18px; }

/* 접기버튼 */
nav li.menu .submenu li a .submenu_indicator,
nav li.menu .submenu .menuOn .submenu2 li a .submenu_indicator,
nav li.menu .submenu .menuOn .submenu2 .menuOn .submenu3 li a .submenu_indicator{background-image: url(../images/ico/arrow/fill_right_gray6.svg); }

/* 펴기버튼 */
nav li.menu .submenu li.menuOn a .submenu_indicator,
nav li.menu .submenu .menuOn .submenu2 li.menuOn a .submenu_indicator,
nav li.menu .submenu .menuOn .submenu2 .menuOn .submenu3 li.menuOn a .submenu_indicator{background-image: url(../images/ico/arrow/fill_down_gray6.svg); }

/* 접기버튼 + 접기폴더 */
nav li.menu .submenu li a .submenu_indicator + em,
nav li.menu .submenu .menuOn .submenu2 li a .submenu_indicator + em,
nav li.menu .submenu .menuOn .submenu2 .menuOn .submenu3 li a .submenu_indicator + em{background-image: url(../images/ico/folder/folder_style2_gray6.svg); }

/* 펴기버튼 + 펴기폴더 */
nav li.menu .submenu li.menuOn a .submenu_indicator + em,
nav li.menu .submenu .menuOn .submenu2 li.menuOn a .submenu_indicator + em,
nav li.menu .submenu .menuOn .submenu2 .menuOn .submenu3 li.menuOn a .submenu_indicator + em{background-image: url(../images/ico/folder/folder_style2_open_gray6.svg); }

/* 메뉴 활성화 - 1단계 : 접기버튼, 펴기버튼 + 접기폴더, 펴기폴더 */
nav ol > li.on.active > a{border-bottom: 1px solid #6082E5; }

nav li.menu.active > a{background-color: rgba(96,130,229,0.2)/* #6082E5 */; background-image: url(../images/ico/arrow/fill_right_blue.svg); }
nav li.menu.active > a > em{color: #4176FF; background-image: url(../images/ico/folder/folder_style2_blue.svg); }
nav li.menu.menuOn.active > a{background-image: url(../images/ico/arrow/fill_down_blue.svg); }
nav li.menu.menuOn.active > a > em{background-image: url(../images/ico/folder/folder_style2_open_blue.svg); }

/* 메뉴 활성화 : 문서모양 */
nav li.menu .submenu li.active > a{background-color: rgba(96,130,229,0.2)/* #6082E5 */; }
nav li.menu .submenu li.active > a > em{color: #4176FF; background-image: url(../images/ico/doc/doc_style2_blue.svg); }

/* 메뉴 활성화 - 1단계 : .no_depth */
nav li.menu.no_depth.active > a > em{background-image: url(../images/ico/doc/doc_style2_blue.svg); }

/* 메뉴 활성화 - 접기버튼 */
nav li.menu .submenu li.active a .submenu_indicator,
nav li.menu .submenu .menuOn .submenu2 li.active a .submenu_indicator,
nav li.menu .submenu .menuOn .submenu2 .menuOn .submenu3 li.active a .submenu_indicator{background-image: url(../images/ico/arrow/fill_right_blue.svg); }

/* 메뉴 활성화 - 펴기버튼 */
nav li.menu .submenu li.menuOn.active a .submenu_indicator,
nav li.menu .submenu .menuOn .submenu2 li.menuOn.active a .submenu_indicator,
nav li.menu .submenu .menuOn .submenu2 .menuOn .submenu3 li.menuOn.active a .submenu_indicator{background-image: url(../images/ico/arrow/fill_down_blue.svg); }

/* 메뉴 활성화 - 접기버튼 + 접기폴더 */
nav li.menu .submenu li.active a .submenu_indicator + em,
nav li.menu .submenu .menuOn .submenu2 li.active a .submenu_indicator + em,
nav li.menu .submenu .menuOn .submenu2 .menuOn .submenu3 li.active a .submenu_indicator + em{background-image: url(../images/ico/folder/folder_style2_blue.svg); }

/* 메뉴 활성화 - 펴기버튼 + 펴기폴더 */
nav li.menu .submenu li.menuOn.active a .submenu_indicator + em,
nav li.menu .submenu .menuOn .submenu2 li.menuOn.active a .submenu_indicator + em,
nav li.menu .submenu .menuOn .submenu2 .menuOn .submenu3 li.menuOn.active a .submenu_indicator + em{background-image: url(../images/ico/folder/folder_style2_open_blue.svg); }

/* GNB 메뉴 아이콘 활성화영역 - 메뉴검색 */
.gnbArea .gnb .gnb_panels .gnb_search{background: #FFFFFF; }
.gnb_search .gnb_searchBox{position: relative; display: flex; align-items: center; justify-content: space-between; margin: 0 10px; }
.gnb_search .gnb_searchBox input{width: 100%; height: 50px; font-size: 14px; border-bottom: 1px solid #C8C8C8; box-sizing: border-box; padding: 0 60px 0 0; transition: all 0.3s ease; }
.gnb_search .gnb_searchBox input:focus{border-bottom: 2px solid #6082E5; outline: none; }
.gnb_search .gnb_searchBox button{position: absolute; display: block; overflow: hidden; text-indent: -999em; }
.gnb_search .gnb_searchBox button.close{right: 30px; top: 15px; width: 20px; height: 20px; background: #C8C8C8 url(../images/ico/cross/cross_8_white.svg) no-repeat 50% 50%; background-size: 10px; border-radius: 50%; }
.gnb_search .gnb_searchBox button.close:hover{background-color: #666666; }
.gnb_search .gnb_searchBox button.search{right: 0px; width: 30px; height: 50px; background: url(../images/ico/search/search_style1_gray.svg) no-repeat 100% 50%; cursor: pointer; }
.gnb_search .gnb_searchBox button.search:focus,
.gnb_search .gnb_searchBox input:focus ~ button.search{background-image: url(../images/ico/search/search_style1_blue.svg); }

.gnb_search p{font-size: 13px; color: #888888; padding: 17px 10px; }

.gnb_search nav mark{color: #6082E5; }

/* GNB 메뉴 아이콘 활성화영역 - 즐겨찾기 */
.gnbArea .gnb .gnb_panels .gnb_favorite{background: #FFFFFF; }
.gnb_favorite .gnb_favorite_opt{position: sticky; z-index: 1; top: 0; width: 100%; height: 30px; background: #DFE2EC; }
.gnb_favorite .gnb_favorite_opt a{display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: #666666; line-height: 18px; background: url(../images/ico/setting/setting_style2_fill_gray6.svg) no-repeat 0 50%; background-size: 18px; padding: 7px 20px 5px; margin: 0 10px; }
.gnb_favorite .gnb_favorite_opt a:hover{color: #4176FF; background-image: url(../images/ico/setting/setting_style2_fill_blue.svg); }

.gnb_favorite .gnb_favorite_opt + p{font-size: 13px; color: #888888; padding: 17px 10px; }


/* Header영역 ***********************************************************************************************/
.conTopArea{position: relative; z-index: 10; display: flex; align-items: center; width: 100%; height: 60px; background: #5C38FF; background-image: linear-gradient(90deg, #69C0FF 0%, #5E83FF 78%); }
.conTopArea h1{width: 290px; }
.conTopArea h1 a{display: block; overflow: hidden; text-indent: -999em; width: 100%; height: 32px; background: url(../images/logo/cubecore/symbol_cubeerp_white.svg) no-repeat 14px 50%; background-size: contain; }

/* Header영역 : 공지사항 */
.conTopArea .conTop_notice{position: relative; display: flex; align-items: center; width: calc(100% - 680px); height: 40px; border-radius: 20px; background: rgba(255,255,255,0.15); overflow: hidden; }
.conTopArea .conTop_notice p{display: block; overflow: hidden; text-indent: -999em; width: 44px; height: 40px; background: url(../images/ico/megaphone/megaphone_style3_white.svg) no-repeat 10px 8px; }
.conTopArea .conTop_notice ul{position: absolute; left: 44px; display: flex; align-items: center; height: 40px; overflow: hidden; }
.conTopArea .conTop_notice li{display: flex; align-items: center; }
.conTopArea .conTop_notice li em{font-size: 14px; color: #FFFFFF; margin-right: 25px; }

/* Header영역 : 퀵버튼 및 개인정보 */
.conTopArea .conTop_etc{position: absolute; right: 0px; display: flex; align-items: center; }
.conTopArea .conTop_etc ul{display: flex; align-items: center; }
.conTopArea .conTop_etc li{position: relative; display: flex; align-items: center; justify-content: center; width: 54px; height: 40px; border-left: 1px solid rgba(255,255,255,0.15); }
.conTopArea .conTop_etc li a{background-repeat: no-repeat; background-position: 50% 0; padding-top: 24px; }
.conTopArea .conTop_etc li.account a{background-image: url(../images/ico/building/building_style4_white.svg); }
.conTopArea .conTop_etc li.organization a{background-image: url(../images/ico/organization/organization_style1_white.svg); }
.conTopArea .conTop_etc li.spot a{background-image: url(../images/ico/location/location_style1_white.svg); }
.conTopArea .conTop_etc li a span{font-size: 8px; color: #FFFFFF; text-align: center; }

.conTopArea .conTop_etc .conTop_user{display: flex; align-items: center; justify-content: space-between; border-left: 1px solid rgba(255,255,255,0.15); margin-right: 20px; }
.conTopArea .conTop_etc .conTop_user dl{margin: 0 10px 0 15px; }
.conTopArea .conTop_etc .conTop_user dt{font-size: 14px; color: #FFFFFF; text-align: right; }
.conTopArea .conTop_etc .conTop_user dd{font-size: 11px; color: rgba(255,255,255,0.7); text-align: right; margin-top: 4px; }
.conTopArea .conTop_etc .conTop_user img{display: block; width: 36px; height: 36px; max-width: 100%; max-height: 100%; border-radius: 50%; object-fit: cover; }

/* Header영역 : 퀵버튼 - 부서변경 활성화 */
.conTopArea .conTop_etc .spot_con{display: none; position: absolute; z-index: 10; left: 50%; top: 55px; width: 280px; background: #FFFFFF; border: 1px solid #6082E5; border-radius: 4px; padding: 15px 15px 20px; box-shadow: 0px 2px 4px rgba(0,0,0,0.2); margin-left: -140px;  }
.conTopArea .conTop_etc .spot_con .spot_titArea{display: flex; align-items: center; justify-content: space-between; }
.conTopArea .conTop_etc .spot_con .spot_titArea .btnArea button{margin: 0 0 0 4px; }
.conTopArea .conTop_etc .spot_con .spotList{margin-top: 10px; }
.conTopArea .conTop_etc .spot_con .spotList dl{display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #D8D8D8; padding: 12px 0; }
.conTopArea .conTop_etc .spot_con .spotList dt{width: calc(100% - 60px); }
.conTopArea .conTop_etc .spot_con .spotList dt label{font-size: 14px; color: #666666; }
.conTopArea .conTop_etc .spot_con .spotList dt label:hover,
.conTopArea .conTop_etc .spot_con .spotList dt input[type="radio"]:checked + label{color: #333333; }
.conTopArea .conTop_etc .spot_con .spotList dd{width: 60px; font-size: 12px; color: #666666; text-align: right; }

@media screen and (max-width: 1190px) {
    .conTopArea .conTop_notice{width: calc(100% - 638px); }

}


/* 방문페이지 영역 *********************************************************************************************/
.historyArea{display: flex; align-items: center; justify-content: space-between; width: 100%; height: 30px; background: #F1F3F9; }
.historyArea .history_list{position: relative; display: flex; width: calc(100% - 249px); overflow-x: auto; }
.historyArea .history_list li{height: 30px; line-height: 30px; border-right: 1px solid #E8E8E8; }
.historyArea .history_list li a{position: relative; display: flex; overflow: hidden; padding: 0 7px; }
.historyArea .history_list li a::after{position: absolute; bottom: 0; left: 0; content: ''; width: 100%; height: 3px; background: #4176FF; transition: transform 0.3s; transform: translate3d(0, 150%, 0); }

.historyArea .history_list li a em{display: block; width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: #666666; line-height: 18px; padding: 6px 0px; }
.historyArea .history_list li.home a em{display: block; overflow: hidden; text-indent: -999em; width: 30px; background-image: url(../images/ico/home/home_style1_gray6.svg); background-repeat: no-repeat; background-position: 50% 50%; background-size: 20px; }

.historyArea .history_list li a .ico_closed{display: block; overflow: hidden; text-indent: -999em; }

/* 방문페이지 영역 - Hover일 때 닫기버튼 보이기 */
.historyArea .history_list li a:hover{background-color: #FFFFFF; }
.historyArea .history_list li a:hover em{color: #333333; }

.historyArea .history_list li a:hover .ico_closed{position: absolute; right: 7px; top: 7px; content: ""; display: block; width: 16px; height: 16px; background: #CBD1E4 url(../images/ico/cross/cross_8_white.svg) no-repeat 50% 50%; background-size: 10px; border-radius: 3px; }
.historyArea .history_list li.home a:hover .ico_closed{display: none; }

/* 방문페이지 영역 - Active일 때 */
.historyArea .history_list li.active a{background-color: #FFFFFF; }
.historyArea .history_list li.active a::after{transform: translate3d(0,0,0); }

.historyArea .history_list li.active a em,
.historyArea .history_list li.active a:hover em{font-weight: 600; color: #4176FF; }
.historyArea .history_list li.active.home a em{background-image: url(../images/ico/home/home_style1_fill_blue.svg); }

/* 방문페이지 영역 - Active일 때 + Hover일 때 닫기버튼 보이기 */
.historyArea .history_list li.active a:hover .ico_closed{background-color: #4176FF; }

/* 방문페이지 버튼영역 */
.historyArea .history_btnArea{display: flex; align-items: center; margin: 0 20px 0 15px; }
.historyArea .history_btnArea > div{display: flex; align-items: center; }

.historyArea .history_btnArea > div,
.historyArea .history_btnArea p{background-color: #FFFFFF; border: 1px solid #C8C8C8; border-radius: 4px; }

.historyArea .history_btnArea > div > div{position: relative; }
.historyArea .history_btnArea > div > div:not(:last-child){border-right: 1px solid #C8C8C8; }

.historyArea .history_btnArea > div > div > a,
.historyArea .history_btnArea p a{display: block; overflow: hidden; text-indent: -999em; width: 28px; height: 18px; background-repeat: no-repeat; background-position: 50% 50%; }

.historyArea .history_btnArea p > a,
.historyArea .history_btnArea > div > div.btn_prev > a,
.historyArea .history_btnArea > div > div.btn_next > a,
.historyArea .history_btnArea > div > div.history_all > a{background-size: 20px; }
.historyArea .history_btnArea > div > div.new_window > a,
.historyArea .history_btnArea > div > div.closed_all > a{background-size: 10px; }

.historyArea .history_btnArea > div > div.btn_prev > a{background-image: url(../images/ico/arrow/left_gray6.svg); }
.historyArea .history_btnArea > div > div.btn_next > a{background-image: url(../images/ico/arrow/right_gray6.svg); }
.historyArea .history_btnArea > div > div.history_all > a{background-image: url(../images/ico/more/more_style1_h_gray6.svg); }
.historyArea .history_btnArea > div > div.new_window > a{background-image: url(../images/ico/bullet/new_window_8_gray6.svg); }
.historyArea .history_btnArea > div > div.closed_all > a{background-image: url(../images/ico/cross/cross_8_gray6.svg); }

.historyArea .history_btnArea > div > div.btn_prev > a:hover{background-image: url(../images/ico/arrow/left_blue.svg); }
.historyArea .history_btnArea > div > div.btn_next > a:hover{background-image: url(../images/ico/arrow/right_blue.svg); }
.historyArea .history_btnArea > div > div.history_all > a:hover{background-image: url(../images/ico/more/more_style1_h_blue.svg); }
.historyArea .history_btnArea > div > div.new_window > a:hover{background-image: url(../images/ico/bullet/new_window_8_blue.svg); }
.historyArea .history_btnArea > div > div.closed_all > a:hover{background-image: url(../images/ico/cross/cross_8_blue.svg); }

.historyArea .history_btnArea > div > div.btn_prev.off > a,
.historyArea .history_btnArea > div > div.btn_prev.off > a:hover{background-image: url(../images/ico/arrow/left_gray.svg); }
.historyArea .history_btnArea > div > div.btn_next.off > a,
.historyArea .history_btnArea > div > div.btn_next.off > a:hover{background-image: url(../images/ico/arrow/right_gray.svg); }
.historyArea .history_btnArea > div > div.history_all.off > a,
.historyArea .history_btnArea > div > div.history_all.off > a:hover{background-image: url(../images/ico/more/more_style1_h_gray.svg); }
.historyArea .history_btnArea > div > div.new_window.off > a,
.historyArea .history_btnArea > div > div.new_window.off > a:hover{background-image: url(../images/ico/bullet/new_window_8_gray.svg); }
.historyArea .history_btnArea > div > div.closed_all.off > a,
.historyArea .history_btnArea > div > div.closed_all.off > a:hover{background-image: url(../images/ico/cross/cross_8_gray.svg); }

.historyArea .history_btnArea p{margin-left: 4px; }
.historyArea .history_btnArea .toggle_header a{background-image: url(../images/ico/arrow/up_gray6.svg); }
.historyArea .history_btnArea .toggle_header a:hover{background-image: url(../images/ico/arrow/up_blue.svg); }
.historyArea .history_btnArea .toggle_search a{background-image: url(../images/ico/arrow/up_double_gray6.svg); }
.historyArea .history_btnArea .toggle_search a:hover{background-image: url(../images/ico/arrow/up_double_blue.svg); }

.historyArea .history_btnArea .toggle_search.search_hide{background-color: #4176FF; border: 1px solid #4176FF; }
.historyArea .history_btnArea .toggle_search.search_hide a{background-image: url(../images/ico/arrow/down_double_white.svg); }

/* 방문페이지 버튼영역 - 방문페이지 전체보기 활성화 */
.historyArea .history_btnArea > div > div.history_all.on > a{width: 30px; height: 20px; background-color: #6082E5; background-image: url(../images/ico/more/more_style1_h_white.svg); margin: -1px; }

.historyArea .history_btnArea .history_all_con{display: none; position: absolute; z-index: 3; top: 22px; left: -59px; flex-direction: column; width: 214px; max-height: calc(100vh - 150px); background: #FFFFFF; border: 1px solid #6082E5; border-radius: 4px; padding: 5px 0; box-shadow: 0px 0px 4px rgba(0,0,0,0.2); overflow-y: auto !important; }
.historyArea .history_btnArea .history_all_con dd{padding: 7px 10px 4px; }
.historyArea .history_btnArea .history_all_con dd:hover{background-color: rgba(96,130,229,0.07)/* #6082E5 */; }
.historyArea .history_btnArea .history_all_con dd.active{background-color: rgba(96,130,229,0.2)/* #6082E5 */; }

.historyArea .history_btnArea .history_all_con dd a{display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #666666; }
.historyArea .history_btnArea .history_all_con dd.active a{color: #4176FF; }


/* 컨텐트 영역 ************************************************************************************************/
iframe{width: 100%; }

.conWrap{width: 100%; /* height: calc(100vh - 90px);*/ }
.conWrap.scrollbar{overflow-x: auto; }

.conWrap .mainContent{height: calc(100vh - 43px); padding: 0 15px 15px; overflow-x: hidden; overflow-y: auto; }
/* iframe .conWrap .mainContent{height: calc(100vh - 43px); } */

.grid_table{display: block; overflow: hidden; text-indent: -999em; width: 100%; min-height: 150px; height: calc(100% - 33px); background: url(../images/img/table_light.svg) no-repeat 0 0; overflow: hidden; }

.editArea{padding: 7px 5px; overflow-y: auto; }
.box_titArea + .editArea{height: calc(100% - 33px); border-top: 1px solid #A1A1A1; }

.editArea .boxTitle{margin-left: 5px; margin-bottom: 10px; }
.editArea .bulletTit{margin-left: -5px; }

/* DatePicker */
.dp__overlay_cell_active{background: #4176FF; }