/*===========================================================================
	RESET
============================================================================*/
html, body {/*min-width:1400px;*/ background-color:#EEEFF2; /*height:100%;*/}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, button, input, br {margin:0; padding:0; border:0; box-sizing:border-box; font-size:14px; color:#373B42; line-height:1.2; letter-spacing:-0.36px; font-family:'SUIT', sans-serif;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
a {display: inline-block; text-decoration:none; color:inherit;}
a:link, a:visited {text-decoration:none;}
a:hover, a:active {text-decoration:none;}
img {border:none;vertical-align:middle;}
ol, ul, li {list-style:none;}
i, em {font-style: normal;}
table {border-collapse: collapse; border-spacing: 0;}
fieldset {border:none;}
legend{width:1px;height:1px;overflow:hidden; visibility:hidden; line-height:0; font-size:0; position:absolute; left:-999px;}
button, input[type="button"] {padding:0; margin:0; border:none; vertical-align:middle; cursor:pointer; background:transparent;}
input{margin:0; padding:0; border:0;}
input[type=text]::-ms-clear {display:none;}
input[type=password]::-ms-clear {display:none;}
textarea {resize:none;}
input, select, button, textarea{outline: none; -moz-appearance: none; -webkit-appearance: none;}
button:focus{outline:0;}
input[type="text"], input[type="password"], input[type="number"], textarea, select {padding:10px 12px; border:1px solid #DFDFDF; border-radius:6px; background-color: #FFFFFF;}
input::placeholder, textarea::placeholder {color:#B5BAC4; font-weight: 400;}
input[type="checkbox"] {display:none;}
input:read-only{background:#EEEFF2; color:#373B42;}
select:disabled{background:#EEEFF2; color:#373B42;}
input:disabled{background:#EEEFF2; color:#373B42;}
input:disabled + label{cursor: auto}
select{width: 100%; font-size: 13px; font-weight: 400; font-family:'SUIT', sans-serif; color: #B5BAC4; padding: 11px 30px 11px 14px; border: 1px solid #EEEFF2; background: right 14px center / auto no-repeat url("/resources/img/icon/select.svg"); background-color: #FFFFFF;}
select.text_selected {color: #373B42;}
select.sm{height:28px; padding:0 12px; padding-right:34px; font-size:13px;}
input {height:34px;}
/* RESET END */

/* SCROLL BAR */
*::-webkit-scrollbar {width: 4px; height:4px; margin-right:0px;}
*::-webkit-scrollbar-track {background-color:transparent;}
*::-webkit-scrollbar-thumb {background: #CFD2D9; border-radius: 183px; cursor:pointer;}
*::-webkit-scrollbar-button {display: none;}

/*===========================================================================
	FONT
============================================================================*/
/* COLOR */
.point_t {color:#89699C !important;}
.red_t {color: #FF6F00 !important;}
.gray_t {color: #4D525C !important;}
/*SIZE*/

/*WEIGHT*/



/*===========================================================================
	BUTTON
============================================================================*/
/* btn */
.btn {background:#89699C; color:#fff; border-radius:4px; padding:12px 0; font-size:12px; font-weight:bold;}
.btn:disabled {cursor: auto;}
.green_btn {background-color:#00B99B; color:#fff; transition: background-color 0.4s;}
.green_btn:hover {background-color:#009E85;}
.green_line {background-color: #FFFFFF; border: 1px solid #00B99B; color: #00B99B; transition: all 0.4s;}
.green_line:hover {border: 1px solid #009E85; color: #009E85;}
button.lignt_gray_bg {color: #787F8F; border-color: transparent; background-color: #EEEFF2; transition: background-color 0.4s;}
button.lignt_gray_bg:hover {background-color: #E4E5E8;}
button.lignt_gray_bg:disabled {color: #CFD2D9;}
button.gray_bg {color: #787F8F; border-color: transparent; background-color: #E6E8EC; transition: background-color 0.4s;}
button.gray_bg:hover {background-color: #D5D7DB;}
button.black_line {color: #4D525C; border: 1px solid #4D525C; background-color: #FFFFFF; transition: background-color 0.4s;}
button.black_line:hover {color: #222429; border: 1px solid #222429;}
button.black_bg {color: #FFFFFF; border: 1px solid #4D525C; background-color: #4D525C; transition: background-color 0.4s;}
button.black_bg:hover {border: 1px solid #222429; background-color: #222429;}
button.black_bg2 {background-color: #373B42; transition: background-color 0.4s;}
.search_btn {width:32px; height:30px; border-radius:8px; background-color:#787F8F;}

/* btn > more info */
.btn_info {width: 15px; height: 15px; background: center / 14px no-repeat url('/resources/img/icon/icon_i.svg'); margin-left: 6px; }

/* btn > 임시저장 */
.side button.icon_save {transition:all 0.4s;}
.side button.icon_save:hover {/*box-shadow: 0 0 6px 0 rgb(82 93 107 / 0.21);*/background-color: #F5F6F7;}
.side .pop_foot button.icon_save {font-weight: 500; color: #373B42; padding-left: 40px; position: relative;}
.icon_save:before {content: ''; display: block; width: 16px; height: 16px; background: center / auto no-repeat url('/resources/img/icon/icon_save.svg'); position: absolute; left: 16px; top: calc(50% - 1px); transform: translateY(-50%);}



/*===========================================================================
	INPUT, TEXTAREA
============================================================================*/
/* file */
input[type="file"] {display: none;}
input[type="file"] + label {cursor: pointer;}

/* text */
input[type="text"], input[type="password"] {width: 100%; height: 44px; padding: 14px; border: 1px solid #EEEFF2; font-size: 14px; font-weight: 500; color: #373B42; transition: all 0.4s;}
input[type="text"]::placeholder, input[type="password"]::placeholder {font-weight: 300; color: #B5BAC4;}
input[type="text"]:focus, input[type="password"]:focus {border-color: #00B99B; box-shadow: 0 0 12px 0 rgba(82,93,107,0.06);}
input[name="datepicker"]:read-only {background-color: #FFFFFF; color: #373B42; cursor: pointer;}
input[name="datepicker"]:disabled {background-color: #EEEFF2; color: #373B42; cursor: default;}

/*체크박스*/
.checkbox + label {font-size:13px; font-weight:400; color:#585d67; cursor: pointer; display: flex; align-items: center;}
.checkbox + label i {display:inline-block; vertical-align:middle; margin-right:8px; width:20px; height:20px; border-radius:4px; border:1px solid #E6E8EC;}
.checkbox:checked + label i {border-color:#00B99B; background:url("/resources/img/icon/icon_chk_on.svg") no-repeat center;}

/* radio */
.radio {display: none; }
.radio + label {line-height:1.1; cursor: pointer; font-size: 13px;; font-weight: 500; color: #A1A7B1; padding: 8px 16px; height: 32px; background-color: #F5F6F7; border: 1px solid #F5F6F7; border-radius: 6px;}
.radio:checked + label {font-weight: 600; color: #00B99B; border-color: #00B99B; background-color: #FFFFFF;}
.radio + label + .radio {margin-left: 10px;}
.gap_radio {display: flex; align-items: center; gap: 10px;}
.gap_radio.gray_type {gap: 8px; justify-content: center; flex-wrap: wrap;}
.gray_type input[type="radio"] + label {width: 100%; height: auto; text-align: center; font-size: 14px; font-weight:500; line-height:1.3; color: #A1A7B1; padding: 8px 12px; border-color: #EEEFF2; background-color: #EEEFF2;}
.gray_type input[type="radio"]:checked + label {color: #626975; border-color: #CFD2D9; background-color: #CFD2D9;}

/* textarea */
textarea {width: 100%; height: 180px; border: 1px solid #EEEFF2; border-radius: 6px; padding: 14px; font-size: 14px; font-weight: 500; font-family:'SUIT', sans-serif; color: #373B42; transition: all 0.4s;  box-sizing : border-box;}
textarea::placeholder {font-weight: 300; color: #B5BAC4;}
textarea:focus {border-color: #00B99B; box-shadow: 0 0 12px 0 rgba(82,93,107,0.06);}

/*component(1) : input+button*/
.with_btn {display: flex; justify-content: space-between; gap: 8px;}
.with_btn input {width: calc(100% - 78px);}
.with_btn .btn, .with_btn label {display: block; width: 70px; height: 44px; line-height: 44px; border-radius: 6px; font-size: 12px; font-weight: 600; padding: 0; text-align: center;}
/*시간이 노출되어야 할 때*/
.with_btn .with_timer {width: calc(100% - 78px);}
.with_timer {position: relative;}
.with_timer input {width: 100%; padding-right: 45px;}
.with_timer .timer {font-size: 12px; color: #FF6F00; position: absolute; top: 50%; right: 14px; transform: translateY(-50%);}



/*===========================================================================
	COMMON CLASS
============================================================================*/
/* CLEAR */
.clear:after {content:''; display:block; clear:both;}
.clearfix:after, .clearfix2:after {content:''; display:block; clear:both;}
.clearfix>* {float:left;}
.clearfix2>*:first-child {float:left;}
.clearfix2>*:nth-child(2) {float:right;}
/* 요소정렬 */
.float_l {float:left;}
.float_r {float:right;}
/* 텍스트 정렬 */
.left_t {text-align:left;}
.right_t {text-align:right;}
.center_t {text-align:center;}
/* 말줄임 */
.ellipsis {white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ellipsis2 {text-overflow:ellipsis; white-space:normal; overflow:hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
/* 기타 */
.pointer {cursor:pointer;}
.display_none {display:none !important;}
.display_table {display:table; width: 100%; height: 100%;}
.display_table_cell {display:table-cell; vertical-align:middle;}
.mb_only, .mb_flex {display:none !important;}
.full {width: 100% !important;}
/*margin*/
.mt5 {margin-top: 5px;}
.self_gap {margin-left: 20px; margin-right: 20px;}

.datepicker {z-index:999999999999999 !important;}
.hover tbody tr:hover {background-color: #F6FAFA;}
.flex_none {display:inline-block !important;}
.icon_dash {margin: 0 4px;}
.flex_1 {display:flex; max-width:100% !important; flex:1 !important;}
/*===========================================================================
	POPUP
============================================================================*/
.pop_wrap {position:fixed; top:0; left:0; z-index:/*999;*/ -1; width:100%; height:100%; visibility:hidden; opacity:0; transition:all 0.6s;} /*23.03.09 HUBDNC AJY 'z-index' 수정*/
.pop_wrap.on {visibility:visible; opacity:1; z-index:999}
.pop_dim {position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(34,36,41,0.1);}
.pop_wrap .pop_cont {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background-color:#fff; width:calc(100% - 32px); max-width:480px; border-radius:12px; margin-top:-40px; transition:all 0.6s;}
.pop_wrap.on .pop_cont {margin-top:0;}
.pop_title {position:relative; font-size:15px; font-weight:600; color:#373B42; padding:16px 24px; border-bottom:1px solid #F5F6F7;}
.pop_title button.pop_close {position:absolute; right:24px; top:50%; transform:translateY(-50%);}
/**/
.pop_title button.pop_close img {display: none;}
.pop_title button.pop_close {width: 26px; height: 26px; /*width: 20px; height: 20px; */background: center / 10px 10px no-repeat url('/resources/img/icon/icon_x.svg'); transition: all 0.3s;}
.pop_title button.pop_close:hover {background-image: url('/resources/img/icon/icon_x_on.svg'); background-color: #ebfaf7; border-radius: 4px;}
.side .pop_title.back_btn {padding-left:50px;}
.side .pop_title.back_btn button.pop_close {width:20px; background-image: url('/resources/img/icon/back_arrow.svg'); background-size:19px; right: auto; left: 16px;}
.side .pop_title.back_btn button.pop_close:hover {background-image: url('/resources/img/icon/back_arrow.svg')}
.side .pop_title.back_btn .icon_btn {padding-left:40px; font-weight:600; color:#373B42;}

.pop_text {max-width:480px; height:290px; padding:20px 24px 24px;}
.pop_text p {height:100%; line-height:20px; overflow-y:auto;}
.pop_foot {padding:18px; border-top:1px solid #F5F6F7;}
.pop_foot button {min-width:77px; height:33px; border-radius:6px; font-size:12px; font-weight:bold;}
.pop_foot .input_wrap {padding:5px 0;}
.pop_cont select {height: 38px;}
.pop_cont input[type="text"], .pop_wrap input[type="password"] {height: 38px; padding: 11px 14px; font-size: 13px;}
.pop_cont .with_btn .btn, .pop_cont .with_btn label {height: 38px; line-height: 38px;}
/* .pop_cont .form_input > li:not(:first-child) {margin-top: 24px;} */
.pop_cont .form_input {gap: 24px;}
/* .pop_cont .form_input > li:not(:last-child) {margin-bottom: 4px;}  */
.pop_cont .form_input > li > .label + .gap_radio {margin-top: 12px;}
/* .txt_box {height: 300px !important; background-color: #FDFBED; border-radius: 8px; font-size: 18px; font-weight: 300; color: #D49C00;} */ /* 에디터영역 표시용 스타일 */
.txt_box {height: 300px !important; background-color: #FFFFFF; border-radius: 8px; font-size: 18px; font-weight: 300; color: #D49C00;} /* 에디터영역 표시용 스타일 [23.04.14 AJY bg-color 수정] */

/* popup.side (화면 우측에서 나오는 팝업) */
.pop_wrap.side .pop_cont {max-width: 600px; top: 0; bottom: 0; right: 0; left: auto; transform: translate(0,0); border-radius: 20px 0 0 20px; margin-top: 0; margin-right: -40px;}
.pop_wrap.side .pop_cont.big {max-width: 800px;}
.pop_wrap.side.on .pop_cont {margin-right: 0;}
.side .pop_title {font-size: 18px; height: 57px; padding-top: 20px;}
.side .pop_middle {height: calc(100% - 117px); overflow-x: hidden; overflow-y: auto; padding: 30px 24px;}
.side .pop_foot {height: 60px; padding: 14px 24px; box-shadow: 0 -3px 6px 0 rgba(82,93,107,0.02);}
.side .pop_foot button {min-width: 63px; height: 32px; /*line-height: 32px;*/ font-size: 13px; padding: 0 20px; font-weight:600;}
.side .pop_foot button:not(:first-child) {margin-left: 8px;}
.side .tab_menu {width: calc(100% + 48px); margin: -26px 0 30px -24px; padding: 0 24px; gap: 14px; border-bottom-color: #F5F6F7;}
.side .tab_menu li a {font-size: 15px; padding-bottom: 10px;}

.div_hr {width: calc(100% + 48px); margin-left: -24px; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 3px solid #EEEFF2;}
.div_hr > div {/*max-height: 200px; overflow: auto;*/ padding: 0 24px;}
.div_hr > div > div:not(:first-child) {margin-top: 12px;}
.title_s {font-size:13px; font-weight: 600; color: #626975; padding-left: 10px; position: relative; margin-bottom: 12px;}
.title_s:before {content: ''; display: block; width: 3px; height: 3px; border-radius: 50%; background-color: #373B42; position: absolute; left: 4px; top: 50%; transform: translate(-100%, -50%);}
.title_s:not(:first-child) {margin-top: 40px;}
.title_s:not(:first-child).top_0 {margin-top: 0;}

.pop_wrap.full .pop_cont {width:100%; height:100%; border-radius:0;}
.pop_wrap.full .pop_middle {height: calc(100% - 122px);}
.pop_wrap.full .pop_foot {height:70px; padding:12px 16px;}
.pop_wrap.full .pop_foot button {width:80px; height:100%; font-size:14px; font-weight:bold;}
.pop_wrap.full .pop_foot button:last-child {width:calc(100% - 90px);}
.pop_wrap.full .pop_foot button:last-child.w100 {width: 100%;}



/*===========================================================================
	POPUP publishing
============================================================================*/
/*알림팝업*/
.alarm_pop {top:60px; position:absolute; right:0; width:260px; background-color:#fff; border:1px solid #E6E8EC; border-radius:12px; visibility:hidden; opacity:0; transition:all 0.3s;}
.alarm_pop.on {top:40px; visibility:visible; opacity:1;}
.alarm_title {padding:13px 20px; border-bottom:1px solid #F5F6F7; position:relative; line-height: 18px;}
.alarm_title span{font-size:13px; font-weight:600; color:#373B42; vertical-align:middle;}
.alarm_title i {display:inline-block; width:18px; height:18px; border-radius:50%; background-color:#FF6F00; text-align:center; line-height:18px; font-size:11px; color:#fff; margin-left:4px; vertical-align:middle;}
.alarm_list {padding:16px 20px;}
.alarm_list > ul {max-height:190px; overflow-y:auto; width:calc(100% + 15px); padding-right:15px;}
.alarm_list li {padding-left:12px; position:relative;}
.alarm_list li a {font-size:13px; font-weight:400; color:#0D0E0F; line-height: 18px;}
.alarm_list li.disabled a {color:#626975;}
.alarm_list li:after {content:''; display:block; width:4px; height:4px; border-radius:50%; position:absolute; top:7px; left:0; background-color:#373B42;}
.alarm_list li.disabled:after {background-color:#CFD2D9;}
.alarm_list li:not(:first-child) {margin-top:14px;}
.alarm_close {width:20px; height:20px; position:absolute; top:50%; right:20px; transform:translateY(-50%); background:url("/resources/img/icon/icon_x_btn.svg") no-repeat center; transition:all 0.2s;}
.alarm_close:hover {background-image:url("/resources/img/icon/icon_x_btn_on.svg");}

/*설정 팝업*/
.inner_pop {top:60px; position:absolute; right:0; width:160px; /*height:0;*/ overflow:hidden; background-color:#fff; border:1px solid #E6E8EC; border-radius:12px; visibility:hidden; opacity:0; transition:all 0.3s; box-shadow: 0 0 12px 0 rgba(82,93,107,0.12)}
.inner_pop.on {top:40px; visibility:visible; opacity:1; z-index:101; /*height:auto;*/ overflow:visible;}
.inner_pop > ul > li {padding:14px 20px; text-align:left; font-size:13px; font-weight:500; color:#373B42;}
.inner_pop > ul > li:not(:first-child) {border-top:1px solid #F5F6F7;}
.inner_pop > ul > li > a {font:inherit; color:inherit; padding-left:28px;background-repeat: no-repeat; background-position: left center; transition:all 0.2s;}
.setting_pop li:nth-child(1) a {background-image:url("/resources/img/icon/icon_edit.svg");}
.setting_pop li:nth-child(2) a {background-image:url("/resources/img/icon/icon_logout.svg");}
.setting_pop li:hover a {background-image:url("/resources/img/icon/icon_edit_on.svg");}
.setting_pop li:nth-child(2):hover a {background-image:url("/resources/img/icon/icon_logout_on.svg");}
.side_info > li .setting_open img {margin-right:0;}
.setting_open {width:32px; height:32px; border:1px solid transparent; overflow:hidden; border-radius:50%; background: url('/resources/img/icon/icon_no_profile.svg') no-repeat center /cover;}
.setting_open img {width:100%;}
.setting_open.on {border:1px solid #00B99B;}

/*내정보수정하기 팝업*/
.myinfo_pop.pop_wrap.side .pop_cont {max-width: 368px;}
.myinfo_pop .pop_middle > *:not(:first-child) {margin-top: 30px;}
.nametag_box {display: flex; align-items: center; gap: 24px;}
.nametag_left {width: 66px; height: 66px; /*border: 1px solid #EAEBEE;*/ border-radius: 50%; position: relative; background: center / cover no-repeat url('/resources/img/icon/icon_no_profile.svg');}
.nametag_left label {display: block; position: absolute; right: 0; bottom: 0;}
.nametag_right p:first-child {font-size: 16px; font-weight: 500; color: #222429; margin-bottom: 6px;}
.nametag_right p:last-child {font-size: 13px; font-weight: 600; color: #787F8F; display: flex; align-items: center; gap: 5px;}
.nametag_right p:last-child i {font-size: 0;}
.nametag_right p:last-child span {font-size: 13px; display: inline-block; color:#787F8F;}
.pop_cont .info_box {padding: 20px; background-color: #F8F9FA; border: 1px dashed #EAEBEE; border-radius: 8px;}
.pop_cont .info_box li {display: flex; align-items: center;}
.pop_cont .info_box li:not(:first-child) {margin-top: 12px;}
.pop_cont .info_box li:first-child p {gap:8px;}
.pop_cont .info_box li b {width: 70px; font-size: 13px; font-weight: 500; color: #787F8F; padding-left: 10px; position: relative;}
.pop_cont .info_box li b:before {content: ''; display: block; width: 3px; height: 3px; background-color: #787F8F; border-radius: 50%; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.pop_cont .info_box li p {display: flex; align-items: center;font-size: 14px; font-weight: 500; color: #4d525c; flex-wrap:wrap;}
.pop_cont .info_box li .myteam {font-size: 11px; font-weight: 500; color: #626975; padding: 4px 8px; height: 22px; border: 1px solid #E6E8EC; border-radius: 5px; /*margin-left: 8px;*/ background-color: #FCFCFC;}



/*===========================================================================
	HEADER, GNB, FOOTER
============================================================================*/
/* HEADER */
.header {width:100%; padding:0 60px; background-color:#fff; position:fixed; top:0; left:0; z-index:21; }
.header_inner {position:relative; height:68px;}
h1.logo {position:absolute; top:calc(50% + 2px); left:0; transform:translateY(-50%);}
/*오른쪽 메뉴*/
.side_info {position:absolute; top:50%; /*right:60px;*/ right:0; transform:translateY(-50%);}
.side_info > li {display:inline-block; font-weight:600; color:#373B42; position:relative;}
.alarm {margin-right:8px;}
.alarm.on:after {content:''; display:block; width:3px; height:3px; border-radius:50%; background-color:#FF6F00; position:absolute; top:4px; right:4px;}
.alarm img {margin-right:0;}
.alarm img:last-child {display:none;}
.alarm.on img:last-child {display:inline-block;}
.alarm.on img:first-child {display:none;}
.alarm_btn {line-height:28px;font-size:0;}
/*.alarm img {display:n}*/
.side_info > li:nth-child(1) {margin-right:28px;}
.side_info > li:nth-child(1) a {line-height:32px;}
.side_info > li.index_3 {margin-right:20px;}
.side_info > li img {margin-right:8px; margin-top:-2px;}
/*홍길동 옆 상세정보*/
.detail_info {font-size:0;}
.detail_info, .detail_info li {display:inline-block;}
.detail_info li {position:relative; margin-left:12px;font-size:12px; font-weight:500; color:#787F8F;}
.detail_info li:last-child:after {content:''; display:block; width:2px; height:2px; border-radius:50%; background-color:#B5BAC4; position:absolute; left:-6px; top:50%; transform:translate(-50%,-50%);}
/*모바일*/
.mb_header {position:fixed; z-index:100; width:100%; height:56px; padding:10px 16px; background-color:#fff; display:none;}
.mb_header > div:first-child button {width:20px; margin-right:25px; /*padding:9px 0;*/}
.mb_header > div .logo {height:36px; position: absolute; top: calc(50% + 2px); left: 50%; /*transform: translate(-50%,-50%);*/ margin-left:-42.8px; margin-top:-18px;}
.mb_header > div .logo img {height:100%;}
.mb_header > div:last-child {font-size:0; padding:3.5px 0;}
.mb_header > div:last-child button {width:28px; height:28px;}
.mb_header > div:last-child button:last-child {margin-left:12px;}
.mb_header > div button img {max-width:90%; max-height:90%;}
.mb_header .alarm {position:relative;}
.mb_header .alarm.on:after {top:4px; right:2px;}
/*.mb_header .alarm_pop {right:-36px;}*/
.mb_header .inner_pop {width:140px; right:16px;}
.mb_header .inner_pop.on {top:54px;}
.mb_header .inner_pop li {padding:15px 17px;}
/*햄버거*/
.gnb_pop {position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; visibility:hidden; opacity:0; overflow:hidden; transition: all 0.4s;}
.gnb_pop.on {visibility:visible; opacity:1;}
.gnb_close {position:absolute; top:14px; right:20px; }
.gnb_close img {width:15px;}
.gnb_pop .pop_cont {position:absolute; top:0; left:-300px; transform:none; width:300px; height:100%; background-color:#fff; border-radius:0 20px 20px 0; padding:50px 0 30px; transition:all 0.4s;}
.gnb_pop.on .pop_cont {left:0;}
.gnb_pop nav {position:static; width:100%; height:100%; box-shadow:none;}
.gnb_pop .nav_top {padding:0 20px 25px; border-bottom: 1px solid #F5F6F7;}
.gnb_pop .nav_bottom {height:calc(100% - 164px); display:block; overflow-y:auto;}
/*header type2 (<section/>에 '.header2_page' 클래스가 있으면 type2로 변경됨)*/
.header_type2 {display: none; width: 100%; height: 68px; padding: 16px; background-color: #222429; text-align: center; position: fixed; top: 0; left: 0; right: 0; z-index: 1;}
.header2_on .header {display: none;}
.header2_on .header_type2 {display: block;}
.header2_page > .container_inner {padding-top: 6.3%; /* padding-top: 120px;*/}
/*header type3 (<section/>에 '.header3_page' 클래스가 있으면 type3로 변경됨)*/
.header3_on .header {display: none;}
.header3_on .header_type3 {display: block; z-index: 4;}
.header_type3 {display: none; width: 100%; height: 68px; padding: 15px 60px; background-color: #FFFFFF; text-align: center; position: fixed; top: 0; left: 0; right: 0; z-index: 1;}
.header_type3 > div {display: flex; align-items: center; justify-content: space-between;}
.header_type3 .goback {width: 25px; height: 25px; display: flex; align-items: center; justify-content: center;}
.header_type3 .goback img {width: 20px; height: 15px;}
.header3_left {display: flex; align-items: center;}
.header3_left h3 {font-size: 20px; font-weight: 600; color: #0D0E0F; margin: 0 11px 0 24px;}
.header_type3 .btn {height: 38px; padding: 10px 14px 10px 38px; border-radius: 6px; font-size: 14px; font-weight: 500; position: relative; transition: all 0.3s;}
.header_type3 .btn:not(:first-child) {margin-left: 12px;}
.header_type3 .btn.icon_save {background-color: transparent; color: #373B42;}
.header_type3 .btn.icon_save:hover {background-color: #F5F6F7;}
.header_type3 .btn.black_bg2:hover {background-color: #222429;}
.header_type3 .btn.black_bg2:before {content: ''; display: block; width: 16px; height: 16px; background: center / auto no-repeat url('/resources/img/icon/icon_plus_inbox_b.svg'); position: absolute; left: 16px; top: 50%; transform: translateY(-50%)}
/* FOOTER */
.footer {border-top:1px solid #E6E8EC; padding:20px 60px; font-size:12px; font-weight:300; color:#A1A7B1;}


/*===========================================================================
	LAYOUT
============================================================================*/
/* html/body height (<section/>에 '.h_auto_page' 클래스 있으면 적용됨) */
html.h_auto, html.h_auto body {height: 100%;}

/* SECTION */
.container {padding-top:68px; /*min-height:calc(100vh - 56px); height:calc(100% - 56px);*/}
.container.header2_page {/*min-height:calc(100vh - 56px);*/ height:calc(100% - 56px);}
.container_inner {padding:40px 60px; height:100%;}

/* 기본 레이아웃 */
.container_inner nav {width:280px; height: calc(100% - 204px); position:fixed; top:108px;}
.container_inner nav + div {width:calc(100% - 340px); height:100%;}
/* NAV 상단 */
.nav_top {padding:20px; border-bottom:1px solid #F5F6F7;}
.nav_top > div {padding:20px 20px 18px; background-color:rgba(0,167,185,0.02); border:1px solid rgba(0,136,185,0.14); border-radius:12px; text-align:center; position:relative;}
.nav_top .d_day {/*width:58px;*/padding:0 10px; line-height:19px; position:absolute; top:0; left:14px; transform:translateY(-50%); background-color:#4D525C; font-size:10px; font-weight:500; color:#fff; font-family:"Spoqa Han Sans Neo", 'SUIT', sans-serif; border-radius:100px; box-shadow: 0 0 6px 0 rgb(82 93 107 / 0.21);}
.nav_top p {font-size:12px; font-weight: 600; color:#787F8F; line-height:15px;}
.nav_top p.date {font-size:14px; font-weight: bold; font-family:"Spoqa Han Sans Neo", 'SUIT', sans-serif; color:#373B42; line-height:18px; margin-top:4px;}
.nav_top button {width:100%; height:34px; background: linear-gradient(to right, #02C5BE, #1AE48C); font-size:13px; font-weight:500; color:#fff; border-radius:6px; margin-top:18px; box-shadow: 0 0 12px 0 rgba(82 93 107 / 0.08);}
.nav_top button img {margin-right:6px; margin-top:-2px;}
/* NAV 하단 */
.nav_bottom {padding:20px 0; height: calc(100% - 170px);}
.gnb {height:100%; overflow-y:auto;}
.gnb .arrow {position:relative;}
.gnb .arrow:after {content:''; display:block; width:10px; height:6px; background:url('/resources/img/icon/icon_arrow.svg') no-repeat center /10px; position:absolute; top:50%; right:28px; transform:translateY(-50%); /*transition:all 0.4s;*/}
/*.gnb .on .arrow:after {background-image: url('/resources/img/icon/icon_arrow_black.svg')}*/
.gnb .on .arrow:after {background-image: url('/resources/img/icon/icon_arrow_green.svg')}
.gnb > li {padding:4px 0;}
.gnb > li:hover > a {color:#0D0E0F;}
.gnb > li:hover > a img:last-child {display:inline-block;}
.gnb > li:hover > a img:first-child, .gnb > li:hover > a img:nth-child(2) {display:none;}
.gnb > li > a {font-size:16px; font-weight:600; color:#787F8F; display:block; padding:15px 28px 15px 66px; position:relative;}
.gnb > li img {display:none; margin-right:12px; position: absolute; top: 50%; left: 28px; transform: translateY(-50%);}
.gnb > li img:first-child {display:inline-block;}
.gnb > li.this_page img:nth-child(2), .gnb > li.on img:nth-child(2) {display:inline-block;}
.gnb > li.this_page img:first-child, .gnb > li.on img:first-child {display:none;}
.gnb > li.this_page:hover img:last-child, .gnb > li.on:hover img:last-child {display:none;}
.gnb > li.this_page:hover img:nth-child(2), .gnb > li.on:hover img:nth-child(2) {display:inline-block;}
/* .gnb > li.on > a, .gnb > li.this_page > a, .gnb > li.this_page > a:not(.arrow) {color: #222429;} */
.gnb > li.on > a, .gnb > li.this_page > a, .gnb > li.this_page > a:not(.arrow) {color: #00B99B;}
.gnb > li.this_page li.on > a {color:#222429;}
/*.gnb > li.this_page {color:#00B99B;}*/
/*.gnb > li.this_page > a:not(.arrow) {color: #00B99B;}*/
.gnb > li .sub {margin-left:52px;height:0;overflow:hidden;/*transition: height 0.4s;*/}
.sub > li:first-child {margin-top:/*12px*/4px;}
.sub > li:last-child {margin-bottom:8px;}
.sub > li a {padding:12px 16px; position:relative; font-weight:500; color:#4D525C; display:block;}
.sub > li a:hover {font-weight:600; color:#0D0E0F;}
.sub > li.on a {color:#222429; font-weight:bold;}
.sub > li a:after {content:''; display:block; width:8px; height:2px; border-radius:50%; background-color:#4D525C; position:absolute; top:50%; left:0; transform:translateY(-50%); border-radius:0.8px;}
.sub > li.on a:after {background-color:#222429;}
.gnb > li.on .sub {height:auto;}
.gnb > li.on .sub.short {height:auto;}

.gnb_foot {border-top:1px solid #F5F6F7;}
.gnb_foot>ul:first-of-type {float:left; text-align:right; padding: 20px 0; width: 50%; box-sizing: border-box;}
.gnb_foot>ul:last-of-type {float:right; text-align:left; padding: 20px 0; width: 50%; box-sizing: border-box;}
.gnb_foot ul {display:inline-block;}
.gnb_foot li {display:inline-block; position:relative;}
.gnb_foot li:last-child {margin:0 17px;}
.gnb_foot li:last-child:after {content:''; display:block; width:1px; height:8px; position:absolute; top:50%; left:-17px; transform:translate(-50%,-50%); background-color:#E6E8EC;}
.gnb_foot li a {display:block; font-size:15px; font-weight:500; color:#626975;}
.gnb_foot img {margin-top:-4px; margin-right:8px;}

/* 카드 스타일 */
.card {background-color:#fff; border-radius:20px; padding:24px; box-shadow: 0 0 12px 0 rgb(82 93 107 / 0.06);}
.card.padding_big {padding: 30px 40px 150px 40px; position:relative;}
.calculator .card.padding_big {padding-bottom: 30px;}
nav.card {padding:0; padding-bottom:20px;}
.card_title {position:relative; font-size:16px; font-weight:600; color:#222429; margin-bottom:28px;}
.card_contents {position:relative; height: calc(100% - 48px); padding:20px 16px; border-radius:8px; border:1px dashed #EAEBEE; overflow-y:auto;}
.list li:not(:first-child) {margin-top:8px;}
.list li a {display:block; padding:9px 12px 9px 24px; border-radius:6px; background-color:#F8F9FA; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; position:relative;}
.list li a:after {content:''; display:block; width:3px; height:3px; background-color:#787F8F; border-radius:50%; position:absolute; top:50%; left:12px; transform:translateY(-50%);}
.list.target li {padding-left:38px;}
.list.target li:after {content:'1'; width:18px; height:18px; line-height:18px; border-radius:4px; text-align:center; color:#4D525C; font-size:11px; font-family:"Spoqa Han Sans Neo", 'SUIT', sans-serif; background:#CFD2D9;}
.list.target li.on:after {background: linear-gradient(to right bottom, #02C5BE, #1AE48C); color:#fff;}



/*===========================================================================
	공통 Component
============================================================================*/
/*더보기팝업(.more_area) 닫힘용 dim*/
.common_dim {display: none; position: fixed; left: 0; bottom: 0; top: 0; right: 0; z-index: 3; background-color: transparent;}
.common_dim.on {display: block;}

/*스크롤방지*/
.scroll_lock {overflow:hidden !important; height:100%;}

/*페이지, 카드 타이틀*/
.page_title {font-size:20px; font-weight:bold; color:#0D0E0F; margin-bottom:24px;}
.card_title button, .card_title a {min-width:90px; height:32px; line-height:32px; padding:0 14px; border-radius:6px; background-color:#373B42; color:#fff; font-size:13px; font-weight:500; margin-top:-8px; transition:background-color 0.3s;}
.card_title button:hover, .card_title a:hover {background-color:#222429;}
.card_title .sub_text {font-size:12px; font-weight:400; color:#A1A7B1; margin-top:6px;}
.card_title button img, .card_title a img {margin-right:4px; margin-top: -2px;}
.card_title .root {position:relative; font-weight:500; color:#B5BAC4; margin-left:21px;}
.card_title .root:after {content:''; display:block; width:3px; height:3px; border-radius:50%; background-color:#B5BAC4; position:absolute; top:50%; left:-12px; transform:translateY(-50%);}
.estimation_list .card_title .root:after {left:-13px;}
.tag {font-size:13px; font-weight:600; /*padding:8px 14px; border-radius:16px;*/}
.tag img {margin-right:4px; margin-top:-3px;}
.tag.blue {/*background-color:rgba(88,157,239,0.05);*/ color:#387CCD;}
.dashboard .tag.blue {margin-top: -2px; margin-bottom: 4px; display: block;height:16px;}

/*검색영역*/
.card.padding_big .search_box {width: calc(100% + 80px); margin-left: -40px; padding-left: 40px; padding-right: 40px;}
.card.padding_big .search_box button {min-width: 32px; height:30px; border-radius:6px; background:#787F8F url("/resources/img/icon/icon_search_line.svg") no-repeat center; transition:all 0.4s;}
.card .search_box button:hover {background-color:#626975;}
.evaluation_pop .search_box {background-color: #FFFFFF;}
.page_type + .search_box {margin-top: -15px; margin-bottom: 20px;}
.search_box {display: flex; align-items: center; padding: 10px; background-color: #FCFCFD; border-top: 1px solid #F5F6F7; border-bottom: 1px solid #F5F6F7; gap: 12px;}
.search_box input[type="text"] {/*width: calc(100% - 44px);*/ height: 32px; padding: 9px 14px; border-radius: 6px; font-size: 12px;}
.search_box > div {/*flex:1;*/ max-width: 100%;}
.search_box > div:first-child {max-width: 260px;align-self:flex-start;}
.search_box > div.select {flex:0.5; max-width: 120px; min-width: 90px;}
.search_box .search_input_area input[type="text"] {width:100% !important; max-width: 260px; min-width:115px}
.search_box select {/*width: calc(100% - 44px);*/ height: 32px; padding: 0 14px; border-radius: 6px; font-size: 12px;}
.search_box .single {max-width: 264px;}
/*태그가 들어가는 리스트*/
.tag_list {margin-top:20px;}
.tag_list li {padding:13px 24px; border:1px solid #EEEFF2; border-radius:8px; transition:background 0.4s;}
.tag_list li:hover {background-color:#FDFEFF;}
.tag_list li:not(:first-child) {margin-top:12px;}
.tag_list li > * {display:inline-block; vertical-align:middle;}
.tag_list .tag {width:54px; line-height:22px; border-radius:5px; background-color:#F5F6F7; font-size:11px; font-weight:600; padding:0; text-align:center; margin-right:10px; color:#787F8F;}
.tag_list .on .tag {background-color:#D8F2D8; color:#537E46;}
.tag_list .date {font-family:"Spoqa Han Sans Neo", 'SUIT', sans-serif; font-size:13px; margin-left:4px; color:#787F8F; font-weight:400;}
.tag_list .text {width: calc(100% - 175px); text-overflow:ellipsis; white-space:nowrap; overflow:hidden; margin-right:20px; color:#373B42; font-weight:500;}

/* tab menu */
.tab_menu {width: calc(100% + 80px); padding: 0 40px; margin-left: -40px; display: flex; gap: 20px; border-bottom: 1px solid #F5F6F7; margin-bottom: 20px;}
.tab_menu li a{font-size: 14px; font-weight: 500; color: #626975; padding-bottom: 9px; cursor: pointer;}
.tab_menu li.on a{font-weight: 700; color: #373B42; border-bottom: 2px solid #373B42;}

/* 검색입력 */
.search_input_area {position: relative;}
.search_dim {display: none; position: fixed; left: 0; right: 0; top: 0; bottom: 0;}
.search_option {position: absolute; left: 0; top: 40px; z-index: 10; width: 100%; max-height: 0; overflow-y: auto; border: 1px solid #EEEFF2; border-radius: 8px; background-color: #FFFFFF; box-shadow: 0 0 12px 0 rgba(82,93,107,0.06); visibility: hidden; transition: all 0.3s;}
.search_option ul {padding: 12px 2px;}
.search_option li {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding: 6px 30px 7px 13px; font-size: 12px; color: #373B42; position: relative; cursor: pointer;}
.search_option li:not(.list-no-data):hover {/*color: #00B99B;*/ font-weight: 600;}
.search_option li.on {font-weight: 600; color: #00B99B; background-color: rgba(0,185,155,0.03);}
.search_option li.on:after {content: ''; display: block; width: 8px; height: 6px; background: center / contain no-repeat url('/resources/img/icon/icon_chk_on.svg'); position: absolute; right: 14px; top: 50%; transform: translateY(-50%);}
.search_input_area.on .search_dim {display: block;}
.search_input_area.on .search_option {max-height: 186px; visibility: visible;}
/*개발팀확인용 소스*/
/*
.search_option li:first-child {font-weight: 600; color: #00B99B; background-color: rgba(0,185,155,0.03);}
.search_option li:first-child:after {content: ''; display: block; width: 8px; height: 6px; background: center / contain no-repeat url('/resources/img/icon/icon_chk_on.svg'); position: absolute; right: 14px; top: 50%; transform: translateY(-50%);}
*/

/* pagination */
.pagination {display: flex; align-items: center; justify-content: center; margin-top: 80px; position:absolute; left:50%; bottom:40px; transform:translateX(-50%);}
.pagination li {font-size: 0;}
.pagination li:not(:last-child) {margin-right: 7px;}
.pagination li.left.double {margin-right: 4px;}
.pagination li.left.single {margin-right: 18px;}
.pagination li.right.single {margin-right: 4px; margin-left: 14px;}
.pagination li a {width: 27px; height: 27px; line-height: 25px; font-size: 12px; color: #626975; text-align: center; border: 1px solid #EEEFF2; border-radius: 6px; background-color: #FFFFFF;}
.pagination li.on a {border-color: #585D67; font-weight: 600;}
.pagination li.single a {background: #FFFFFF center / auto no-repeat url('/resources/img/icon/pagination_arrow1.svg')}
.pagination li.double a {background: #FFFFFF center / auto no-repeat url('/resources/img/icon/pagination_arrow2.svg')}
.pagination li.single.right a,.pagination li.double.right a {transform: rotate(180deg);}
.pagination li.single.active a {background-image: url('/resources/img/icon/pagination_arrow1_on.svg')}
.pagination li.double.active a {background-image: url('/resources/img/icon/pagination_arrow2_on.svg')}

/* 에디터영역 (+ border/padding) */
.editor_wrap {padding: 12px 14px 14px; border: 1px solid #EEEFF2; border-radius: 6px; background-color: #FFFFFF;}
.editor_wrap .txt_box {white-space:pre;}
.toastui-editor-tooltip span {color:inherit;}

.mb_flex_1 {min-width:264px;}

/*.no_data_box {padding: 50px !important; text-align: center; border: 1px solid #EEEFF2; border-radius: 8px; position:relative;}*/

.outcome_create_pop .save_btn {margin-left:8px;}

/* 2023-03-20 HUBDNCHYJ */
.search_after_list {display:flex; gap:8px; align-items:center; position:relative; flex-wrap:wrap;}
/*.search_after_list:after {content:''; display:block; width:1px; height:12px; background-color:#E5E7EB; position:absolute; left:-12px; top:50%; transform:translateY(-50%);}*/
.search_after_list li {padding:8px 12px; border-radius:8px; background-color:#EEEFF2;}
.search_after_list li:first-of-type:after {content:''; display:block; width:1px; height:12px; background-color:#E5E7EB; position:absolute; left:-12px; top:50%; transform:translateY(-50%);}
.search_after_list i {display:inline-block; margin-left:10px; cursor:pointer;}

@media screen and (max-width: 768px){
	.estimation_outgoing .card.padding_big .search_box {flex-wrap:wrap;}
	.estimation_outgoing .card.padding_big .search_box > div {flex:none; width:100%;}
	.search_after_list {white-space:nowrap; overflow-x:auto;}
}



/*===========================================================================
	공통 미디어쿼리 (관리자단에도 해당됨)
============================================================================*/
@media screen and (max-width: 1440px){
	.header {padding-left:40px; padding-right:40px;}
}
