@charset "utf-8";



@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 300;
    src: url(../fonts/NotoSansKR-Regular.woff2) format('woff2'), url(../fonts/NotoSansKR-Regular.woff) format('woff'), url(../fonts/NotoSansKR-Regular.otf) format('opentype');
}



@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/NotoSansKR-Medium.woff2) format('woff2'), url(../fonts/NotoSansKR-Medium.woff) format('woff'), url(../fonts/NotoSansKR-Medium.otf) format('opentype');
}



@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: bold;
    src: url(../fonts/NotoSansKR-Bold.woff2) format('woff2'), url(../fonts/NotoSansKR-Bold.woff) format('woff'), url(../fonts/NotoSansKR-Bold.otf) format('opentype');
}

@font-face {
    font-family: 'SCDream';
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/SCDream5.woff2) format('woff2'), url(../fonts/SCDream5.woff) format('woff'), url(../fonts/SCDream5.otf) format('opentype');
}



@font-face {
    font-family: 'SCDream';
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/SCDream6.woff2) format('woff2'), url(../fonts/SCDream6.woff) format('woff'), url(../fonts/SCDream6.otf) format('opentype');
}


@font-face {
    font-family: 'GmarketSans';
    font-style: normal;
    font-weight: 300;
    src:  url('../fonts/GmarketSansLight.woff') format('woff'),
       url(../fonts/GmarketSansLight.otf) format('opentype');
}

@font-face {
    font-family: 'GmarketSans';
    font-style: normal;
    font-weight: 500;
    src:  url('../fonts/GmarketSansMedium.woff') format('woff'),
       url(../fonts/GmarketSansMedium.otf) format('opentype');
}

@font-face {
    font-family: 'GmarketSans';
    font-style: normal;
    font-weight: 700;
    src:  url('../fonts/GmarketSansBold.woff') format('woff'),
       url(../fonts/GmarketSansBold.otf) format('opentype');
}







* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}

:after, :before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}


html { height: 100%; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body {   height: 100%; background: #f3f3f3; font-family:SCDream,Noto Sans KR,Malgun gothic,Myriad Pro,sans-serif,Arial,Dotum; color: #555;  font-size: 16px;}


body, div, dl, dt, dd, ul, ol, menu, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td, p { margin: 0px; padding: 0px; }
table { border-collapse: collapse; border-spacing: 0px; }
fieldset, img, abbr, acronym { margin: 0px; border: 0px; _vertical-align: top; }
address, caption, cite, code, dfn, em, var { font-style: normal; font-weight: normal; }
ol,ul,menu { list-style: none; }
legend { border: 0 none; *margin-left: -7px }
q:before, q:after { content:''; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }
hr { display: none; }
em { color: inherit; font-weight: normal; font-style: normal; }
img { line-height: 0;}
.fl_r {float:right !important;}
.fl_l {float:left !important;}
.dp_none {display:none;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary  { display: block; margin: 0; padding: 0; }
table caption { display: none;}
.al_left { text-align: left !important;}
.al_right { text-align: right !important;}
.al_center { text-align: center !important;}

.mgb_0 { margin-bottom: 0px !important; }
.mgb_5 { margin-bottom: 5px !important; }
.mgb_10 { margin-bottom: 10px !important; }
.mgb_20 { margin-bottom: 20px !important; }
.mgb_30 { margin-bottom: 30px !important; }
.mgb_40 { margin-bottom: 40px !important; }


.pdl_0 { padding-left:0 !important; } 
.mgr_15 { margin-right: 15px !important; }
.mgr_20 { margin-right: 20px !important; }
.mgt_10 { margin-top: 10px !important; }
.mgt_20 { margin-top: 10px !important; }

.tbl_int {   border: 1px solid #c4c4c4;  height: 30px;  width: 100%;  font-size: 14px; padding: 0 0 0 4px;  }
.seltype_a {border:1px solid #a4a4a4; height:21px; width:99.8%;  background: #fff;vertical-align: top; font-size: 12px; }
.sel_span { display: inline-block; border:1px solid #d0d0d0;  height: 28px; padding: 2px 0 0 0; background: #fff; min-width: 100px;}
.sel_span select {  width:100%; height: 22px; border:none; background: #fff; font-size: 14px;}

/* Skip Navigation */
#u_skip{position:relative;z-index:2147483647}
#u_skip h3 { display: none; }
#u_skip a{position:absolute;left:0;top:-30px;width:99.8%;background: #000; border:1px solid #4e26bf;text-align:center;outline:none; color:#fff; height: 24px; line-height: 24px;}
#u_skip a:active,#u_skip a:focus{top:0;text-decoration:none;cursor:pointer;color:#fff;zoom:1}




.inner_field_box { border:1px solid #e6e6e6; border-radius: 8px; height: 290px; padding: 15px; overflow-y: scroll; }
.inner_field_box .form-check-label {  color: #343434; font-size: 14px;  }

.custom_check .form-check-input {  width:16px; height: 16px; background: #d5d5d5; border-color: #d5d5d5; margin-top: 5px;  }
.custom_check .form-check-input:checked  {    background-color: #3826a7;border-color: #3826a7;   }

.custom_check .form-check-label,
.custom_radio .form-check-label { font-size: 16px; color: #333; }


.custom_radio .form-check-input { width:16px; height: 16px; margin-top: 5px; background: #d5d5d5; border-color: #d5d5d5;    }
.custom_radio .form-check-input:checked {  background-color: #3826a7;border-color: #3826a7;   }


.normal_bt { display: inline-block; color: #fff; font-size: 15px;   font-family: SCDream;   background: #004ca2;  border-radius: 8px; padding: 0px 20px; height: 38px;  line-height: 38px; transition:all 0.3s ease; }
.normal_bt:hover  { background:#00418b;  }


.normal_bt span { display: inline-block; padding: 0 30px 0 0; background: url(../img/download_icon_w.png) no-repeat right 50%;  }
.normal_bt:hover { color: #fff; }


.line_bt {  border:1px solid #c7c7c7; color: #3b3737; font-size: 15px; display: inline-block; background: #fff;   line-height: 36px; padding: 0 14px; height: 38px;  transition:all 0.3s ease;  border-radius:8px; text-align: center; }

.line_bt span {display: inline-block; padding: 0px 30px 0 0; line-height: 30px; transition:all 0.1s ease;  }
.line_bt:hover  {color: #000; border-color:#13338e;  }

.line_bt .l_b_task_add {   background: url(../img/bt_task_add.png) no-repeat right 50%; }
.line_bt .l_b_upload_i {   background: url(../img/bt_uplaod_i.png) no-repeat right 4px; }
.line_bt .l_b_gear_i {   background: url(../img/bt_gear_i.png) no-repeat right 6px; }
.line_bt .l_b_refresh_i {   background: url(../img/bt_refresh_i.png) no-repeat right 7px; }
.line_bt .l_b_chart_i {   background: url(../img/bt_chart_i.png) no-repeat right 8px; }
.line_bt .l_b_export_i {   background: url(../img/bt_export_i.png) no-repeat right 6px; }
.line_bt .l_b_j_add_i {   background: url(../img/bt_j_add_i.png) no-repeat right 6px; background-size: 20px auto; }


.line_drop_bt .dropdown-menu li { border-bottom: 1px solid #ddd;  }
.line_drop_bt .dropdown-menu li:last-child  { border-bottom: 0px;  }


.brick {     background: #fff;
    border-radius: 15px;
    position: relative;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -webkit-hyphens: auto; transition: all 0.3s linear;
    hyphens: auto;  box-shadow: 0 1px 1px rgba(72,72,72,0.1); border:1px solid #eeeaeb;
}
.brick:hover {  box-shadow: 0 3px 20px rgba(72,72,72,0.1); }

.select_type {   border:1px solid #dadada; height: 38px; border-radius: 8px; }



header { background: #fff;z-index: 9; position: fixed; top:0; height:64px;right:0;left:0px; border-bottom: 1px solid #dedede; }

.header_inner  { padding: 0px 0px 0 0px; }


.header_l_box h1 {  float:left; margin: 0 0 0 15px }
.header_l_box h1 a{ display: block; width: 211px; height: 64px;  background: url(../img/logo.png) no-repeat 0 22px;  text-indent: -9999px; overflow: hidden; background-size: 102px auto; }


.contents_s_bt { display: block; position: fixed; right: 0px; bottom: 0px;  width:42px; height: 42px;background:#eaeaea;  border-radius: 0px;  border: 0px;  color: #555;  }

.contents_s_bt .c_s_b_mini  {  display: none;  }
.contents_s_bt .c_s_b_max  {  display: block;  }
.contents_s_bt.active .c_s_b_mini {  display: block; }
.contents_s_bt.active .c_s_b_max {  display: none; }



.header_right_box { float: right; }

.h_r_user { float: left; padding:17px 0 0 0; margin-right: 30px;  }
.h_r_user span {  display: inline-block;  color: #222;  position: relative; padding: 0 0 0 42px;line-height: 32px; }
.h_r_user span:after {  content: ''; display: block; position: absolute;left:0; top:0;  width: 32px; height: 32px;  background:#004ca2 url(../img/h_user_icon.png) no-repeat 50% 11px;  border-radius: 22px;  background-size: 20px auto;   }
/*.h_r_user a {  display: inline-block; padding: 0 0px 0 17px;  line-height: 31px;  margin-left: 10px;   background: url(../img/top_logout_arr.png) no-repeat right 7px; color: #696969;      }*/

.h_r_user a {  display: inline-block; padding: 0 0px 0 17px;  line-height: 31px;  margin-left: 10px;   color: #696969;    }
.h_r_user a:hover  {  color: #000 }

.user_link_box {  float: left; border-left: 1px solid #dedede;   }
.user_link_box a {  display: block; width: 64px; height: 63px;  transition:all 0.3s ease; position: relative;   font-size: 12px;  }

.h_r_user a.h_login_bt {  line-height: 44px; }


.h_link_a { display: block; text-align: center; color: #3b6fb6; font-size: 14px;  background: url(../img/top_s2_logo.png) no-repeat 50% 11px; padding: 33px 0 0 0; background-size: 28px auto;   }

.h_link_a:hover {  background-color: #f9f9f9; }


.h_manual_bt{ float: left;      border-left: 1px solid #dedede;   }
.h_manual_bt a { display: block; text-align: center; width: 64px; height: 63px;transition:all 0.3s ease; padding: 11px 0 0 0;  color: #fff; background: #fff;   }
.h_manual_bt a:hover  { background-color: #f3f3f3;  }
.h_manual_bt a:hover span  { }
.h_manual_bt a span {  display: block; text-align: center; font-size: 12px;  color: #333;  }
.h_manual_bt a i { color: #333333; font-size: 18px;    }


.left_sidebar { width: 64px;top:64px;  position: fixed; left: 0; transition: all 0.5s; background: #13338e; bottom:0;  z-index: 99; }
.left_sidebar h1 a{ font-size: 11px; font-family: GmarketSans; font-weight: 500;  color: #d8d8d8; text-align: center; height: 64px; padding: 17px 0 0 0; background: #313131; display: block; }
.left_sidebar h1 a strong {  font-size: 16px; font-weight: 500;  display: block; }

.left_menu { padding: 20px 0 0 0;  height: 100%; position: relative; display: flex; flex-direction: column; }
.left_menu >ul>li { margin-bottom:8px; position: relative; padding: 0 7px;  }
.left_menu > ul > li > a {  font-size: 12px; color: #fff; text-align: center; display: block; padding-top: 9px; font-family: SCDream; border-radius: 10px; transition: all 0.5s;  }
.left_menu > ul > li > a span{ text-indent: -9999px; overflow: hidden; display: block;   height: 50px; width: 50px;  position: relative; margin: 0 auto; }

.left_menu > ul > li > a span:before { content: ''; display: block;  position: absolute;  width: 50px; height: 50px; border-radius: 16px;   transition:all 0.3s ease;  background: #516fc4;  opacity: 0;  transform: scale(0); }

.left_menu > ul > li > a span:after  { content: ''; display: block;   width: 34px; height: 34px;  position: absolute; left: 50%; top:10px; margin-left: -17px }
.left_menu > ul > li > a .l_m_icon01:after { background: url(../img/l_m_icon01.png) no-repeat 50% 50%;     background-size: 20px auto; }
.left_menu > ul > li > a .l_m_icon02:after { background: url(../img/l_m_icon02.png) no-repeat 50% 50%;background-size: 23px auto;  }
.left_menu > ul > li > a .l_m_icon03:after  {  background: url(../img/l_m_icon03.png) no-repeat 50% 50%;background-size: 22px auto; }
.left_menu > ul > li > a .l_m_icon04:after  {  background: url(../img/l_m_icon04.png) no-repeat 50% 50%;background-size: 20px auto;  }
.left_menu > ul > li > a .l_m_icon05:after  {  background: url(../img/l_m_icon05.png) no-repeat 50% 50%; background-size: 20px auto; }

.left_menu > ul > li > a .l_m_home:after  {  background: url(../img/l_m_home.png) no-repeat 50% 50%; background-size: 22px auto; }



.left_menu > ul > li:hover > a span:before  { transform: scale(1);  opacity: 1;}
.left_menu > ul > li > a.on .l_m_icon01:after  {  background: url(../img/l_m_icon01_on.png) no-repeat 50% 50%;     background-size: 22px auto;   }
.left_menu > ul > li > a.on .l_m_icon02:after  {  background: url(../img/l_m_icon02_on.png) no-repeat 50% 50%; background-size: 25px auto;   }
.left_menu > ul > li > a.on .l_m_icon03:after  {  background: url(../img/l_m_icon03_on.png) no-repeat 50% 50%;  background-size: 24px auto;   }
.left_menu > ul > li > a.on .l_m_icon04:after  {  background: url(../img/l_m_icon04_on.png) no-repeat 50% 50%; background-size: 22px auto;    }
.left_menu > ul > li > a.on .l_m_icon05:after  {  background: url(../img/l_m_icon05_on.png) no-repeat 50% 50%; background-size: 22px auto;    }


.left_menu > ul > li > a.on .l_m_home:after  {  background: url(../img/l_m_home_on.png) no-repeat 50% 50%; background-size: 24px auto; }

.left_menu > ul > li > a.on span:before { background: #d2dcf9; transform: scale(1); opacity: 1; }


/*.l_m_set { position: absolute; left: 0; bottom:0;}*/
.l_m_set { margin-top: auto;  }

.l_m_set_bt { margin-bottom:25px; position: relative; padding: 0 7px;  }
.l_m_set_bt > a {  font-size: 13px; color: #fff; text-align: center; display: block; padding-top: 14px; font-family: SCDream; border-radius: 10px; transition: all 0.5s;  }
.l_m_set_bt > a span{ text-indent: -9999px; overflow: hidden; display: block;   height: 50px; width: 50px;  position: relative; margin: 0 auto 5px auto; }
.l_m_set_bt > a span:before { content: ''; display: block;  position: absolute;  width: 50px; height: 50px; border-radius: 22px;   transition:all 0.3s ease;  background: #516fc4;  opacity: 0;  transform: scale(0); }
.l_m_set_bt > a span:after  { content: ''; display: block;   width: 45px; height: 36px;  position: absolute; left: 50%; top:10px; margin-left: -22px }
.l_m_set_bt > a .l_m_icon03:after  {  background: url(../img/l_m_icon03.png) no-repeat 50% 50%;background-size: 23px auto; }
.l_m_set_bt:hover > a span:before  { transform: scale(1);  opacity: 1;}
.l_m_set_bt a.on span:before { background: #d2dcf9; transform: scale(1); opacity: 1; }
.l_m_set_bt a.on .l_m_icon03:after  {  background: url(../img/l_m_icon03_on.png) no-repeat 50% 50%;  background-size: 23px auto;   }




.sub_contents_wrap { position: absolute; left: 64px; top:64px; bottom:0;  right:0px;  min-width: 1300px;  }
.sub_contents_box{ width: 1200px; margin: 0 auto;  padding: 48px 0 0 0;  transition: all 0.3s ease; }

.wide_con_type { width: 94%; }


.sub_h3_tit { color: #3b3232; font-size: 26px; position: relative;  padding: 0 0 0 50px; margin-bottom: 20px;  }
.sub_h3_tit:after { content: ''; display: block; position: absolute; width: 40px; height: 40px; border-radius: 23px;  left: 0; top:-6px; }
.h3_nav_i01:after  { background:#0f0d82 url(../img/l_m_icon01.png) no-repeat 50% 50%;   background-size: 21px auto }
.h3_nav_i02:after  { background:#0f0d82 url(../img/l_m_icon02.png) no-repeat 50% 50%;   background-size: 27px auto }
.h3_nav_i03:after  { background:#0f0d82 url(../img/l_m_icon03.png) no-repeat 50% 50%;   background-size: 24px auto }
.h3_nav_i04:after  { background:#0f0d82 url(../img/l_m_icon04.png) no-repeat 50% 50%;   background-size: 24px auto }
.h3_nav_i05:after  { background:#0f0d82 url(../img/l_m_icon05.png) no-repeat 50% 50%;   background-size: 24px auto }



.a_v_l_top {margin-bottom: 10px; position: relative; }
.a_v_l_top:after {clear: both; }
.a_v_l_top:after,
.a_v_l_top:before { display: table;content: " "; }



.l_top_bt_area {  position: absolute; left:0; top:0;  height: 38px; background: #ebe5e5; border-radius: 20px;padding: 3px 4px 0 10px; display: none; transition:all 0.3s ease;  }
.l_top_bt_area.active { display: block; }

.l_top_a_t { font-size: 15px;  color: #3b3232;   float: left; padding: 7px 0 0 0; margin-right: 20px}
.l_top_a_t span { display: inline-block; color: #0f0d82; font-weight: 700;   }

.l_top_br_row { float: left; }
.l_top_br_row a{  display:inline-block;font-size: 18px;width: 32px;height: 32px;border-radius: 17px;text-align: center; padding: 4px 0 0 0; transition:all 0.3s ease; }
.l_top_br_row a:hover { background: #ccc; color: #000 }

.l_top_bt_close { width: 32px; height: 32px; float: left; text-indent: -9999px; overflow: hidden; border:0px; border-radius: 17px; background: url(../img/l_bt_close.png) no-repeat 50% 50%;   transition:all 0.3s ease;   }
.l_top_bt_close:hover { background-color:#ccc; }

.a_v_r_text { padding: 8px 0 0 8px; font-size: 16px; font-family: GmarketSans;font-weight: 500;    }
.a_v_r_text strong { color: #3253ce; font-weight: 500; display: inline-block; margin-left: 8px;  }



.list_d_sort { display: inline-block; vertical-align: top; position: relative; margin-right: 12px;  }
.list_d_sort .select_type { min-width: 100px; }

.list_row_box .task_list_box { margin-bottom: 8px;}
.list_row_box .brick  { margin-bottom: 8px;}
.list_row_box .brick:last-chidl   { margin-bottom: 0px;}


.task_list_box {  padding: 25px 20px; position: relative; border:1px solid #fff;  }


.taks_list_tit_box { max-width: 80%; line-height: 0 }



.taks_list_tit { display: inline-block; font-size: 18px; color: #3b3232; text-overflow: ellipsis;
    white-space: nowrap;
    overflow-wrap: normal;
    overflow: hidden;  }
.taks_list_tit .fa {  margin-right: 5px }

.taks_list_tit:hover { color: #000; }

.task_share_i { padding: 0 30px 0 0; background: url(../img/l_share_icon.png) no-repeat right 50%;    }

.task_list_box .form-check { position: absolute; left: 0px; top:50%; margin: -8px 0 0 0; padding: 0;  }
.task_list_box .custom_check .form-check-input { margin: 0; }

.task_list_item{  position: relative;padding: 0 0 0 30px }

.t_l_r_info { position: absolute; right:0;  top:50%; margin-top: -15px; }
.t_l_r_info span { display: inline-block;font-size: 15px; color: #555;  margin-left: 15px; }
.t_l_r_info span:first-child {   margin-left: 0px; }

.t_l_r_info span .blue_num_t  {  min-width: 52px;display: inline-block;  text-align: right; }


.blue_num_t { color: #3235cf; }

.task_l_cheaked{ border-color: #13338e;  box-shadow: 0 2px 15px rgba(72,72,72,0.3);    }
.task_l_cheaked .taks_list_tit{  color: #0f0d82;    }


.l_state_r_t {text-align: center; width: 64px; color: #fff !important; background: #2263da; border-radius: 30px;line-height: 32px;    display: inline-block; }
.l_state_r_t.l_green_bg{ background: #339e16; }
.l_state_r_t.l_red_bg{ background: red; }

.t_l_r_info .l_state_r_t { margin-top: -5px}


.t_l_n_box{  margin: 10px 0 0 0;  overflow: hidden; }

.t_l_num{ float: left; margin-right: 30px;  font-size: 14px; color: #777; text-align: left; min-width: 74px;}
.t_l_num span {  display: inline-block; text-align: center; color: #3235cf;  font-size: 14px;   margin-left: 5px; }
.t_l_n_box .t_l_num:last-child { margin-right: 0px;    }
.t_l_n_box .t_l_num:last-child span { color: #ff973a;   }
.t_l_n_box .t_l_error {color: red}


.paginate_complex { line-height: normal; text-align: center; margin-top: 15px; }
.paginate_complex a, .paginate_complex strong { display: inline-block; position: relative; z-index: 2; margin: 0px 2px; line-height: 42px;min-width: 32px; font-size: 15px; color:#777; text-decoration: none; vertical-align: middle; }
.paginate_complex a:hover, .paginate_complex a:active, .paginate_complex a:focus { background-color: rgb(248, 248, 248); }
.paginate_complex strong { color: #000; font-weight: normal; }
.paginate_complex .direction { border: 1px solid #dbdbdb; text-indent: -9999px; width: 40px; margin: 0px; height: 40px; border-radius: 12px;  z-index: 1;  text-decoration: none !important; }
.paginate_complex .first_prev { background: url("../img/paginate_bg01.png") 12px 50% no-repeat rgb(255, 255, 255); }
.paginate_complex .prev { background: url("../img/paginate_bg01.png") -37px 50% no-repeat rgb(255, 255, 255); }
.paginate_complex .last_next { background: url("../img/paginate_bg02.png") -33px 50% no-repeat rgb(255, 255, 255); }
.paginate_complex .next { background: url("../img/paginate_bg02.png") 17px 50% no-repeat rgb(255, 255, 255); }
.paginate_complex .direction:hover, .paginate_complex .direction:active, .paginate_complex .direction:focus { border: 1px solid rgb(99, 99, 99); position: relative; z-index: 999; }


.page_back_bt { width: 46px; height: 46px;background:#fff url("../img/p_back_arr.png") 50% 50% no-repeat; border-radius: 23px;  display: inline-block;  text-indent: -9999px; overflow: hidden;vertical-align: middle; margin-right: 8px;  border:1px solid #fff;  transition:all 0.3s ease; }
.page_back_bt:hover  { border-color: #13338e; }

.view_top_tit{  margin-bottom: 20px; position: relative; }
.v_t_t_text { display: inline-block; font-size: 26px; color:#3b3232; vertical-align: middle; }
.v_t_add_box { position: absolute; right:0; top:5px;  }


.view_help_box { background: #fff; border-radius: 14px; padding:20px 25px; margin-bottom: 30px;  }
.view_help_box ul li { position: relative; font-size: 16px; padding: 0 0 0 12px;  margin-bottom: 8px; }
.view_help_box ul li:last-child { margin-bottom: 0; }
.view_help_box ul li:after  {  content: ''; display: block; position: absolute; left:0; top:9px; width: 4px; height: 4px; background: #b0b0b0;  }


.custom_modal_tit { color: #222; font-size: 20px; font-weight: 700;  position: relative; padding: 15px 20px;  }
.custom_modal_tit:after  { content: ''; display: block; position: absolute; left:20px; bottom:0px; 
 width: 58px; height: 4px; background: #0f0d82; }


.modal_header{ border-bottom: 1px solid #dcdcdc;  position: relative; }

.modal_close_bt { border:0px;  width: 46px; height: 46px;background:url("../img/close_bt_i.png") 50% 50% no-repeat;  position: absolute; right: 9px;    top: 5px; outline:none;  }

/* 0805 사이즈 col / item 사이즈 변경 120 130 -> 150 160 */
.form_row{ margin-bottom: 15px; } 
.form_column{ float: left;  width: 150px; color: #555; font-size: 16px; padding: 7px 0 0 0;  }
.form_item{ margin: 0 0 0 160px; }


.tbl_view_box { border-top:2px solid #13338e;border-radius:15px;   overflow: hidden;   }
.tbl_view {  width: 100%; }
.tbl_view tbody th {  background: #ecf1ff;  padding:10px 15px;color: #555; font-weight: 500; }
.tbl_view tbody td {  background: #fff;  padding:10px 15px; color: #111;  }



.journal_list_b {  padding: 15px; transition:all 0.3s ease;  }
.journal_list_inner{  position: relative; padding: 0 0 0 80px }

.journal_list_num {  font-size: 16px; color: #555;  display: block; position: absolute; left: 10px; top: 30px; }

.journal_l_type { margin-bottom: 5px; }
.journal_l_type span { font-size: 12px;
    color: #fff;
    line-height: 20px;
    height: 20px;
    font-family: SCDream;
    border-radius: 5px;
    display: inline-block;
    text-align: center;
    min-width: 62px;
    vertical-align: top;
    padding: 0 15px; font-weight: 700; 
    border: none; }


.j_l_orange {  background: #f37020 ; }
.j_l_green  {  background: #7d8a0f ; }
.j_l_blue {  background: #3b4faa ; }

.j_l_date_t { position: absolute; right: 0; top:0; font-family: GmarketSans; font-size: 15px; }

.journal_l_tit { display: block;  font-size: 18px; color: #111;  margin-bottom: 15px; }

.l_r_bottom {overflow: hidden;  }
.l_r_bottom ul  {  float: left}
.l_r_bottom ul li { float: left; padding: 0 0 0 10px;  margin-left: 10px;  position: relative;  color: #777; }
.l_r_bottom ul li:after{  content: ''; display: block; position: absolute; left:0; top:5px; width: 1px; height: 12px;  background: #d1d1d1; }
.l_r_bottom ul li:first-child  {  padding: 0 0 0 0px;   margin: 0;  }
.l_r_bottom ul li:first-child:after  {  display: none; }

.j_b_r {  float: right; }
.j_b_r span  {  display: inline-block; font-size: 15px; color: #3b3232;   margin-left: 15px;  }
.j_b_r span:first-child   {   margin-left: 0px;  }

.journal_list_b:hover  { transform: translate(2px,-2px);}
.journal_list_b:hover .journal_l_tit { color: #13338e;   }


.j_b_num_box { float:left;   margin-left: 20px; }
.j_b_num_box:first-child   {   margin-left: 0px;  }
.j_b_num_box span {  vertical-align: middle;margin-left: 5px;   }
.j_b_num_box em  { vertical-align: middle;   display: inline-block; font-size: 14px; background: #f3f3f3; padding: 0 6px; border-radius: 5px; color: #777;  }





/* 엑셀 팝업 스타일 */
/* 수정내역: top_fixed position fixed 제거, excel_view_wrap padding top 244 -> 30*/
.excel_view_wrap { background: #fff; padding: 30px 30px 30px 30px;height: 100%; }

.e_v_top_fixed {left: 30px; right: 30px; top:30px;background: #fff; z-index: 9}
.e_v_pv_t { font-size: 16px; color: #7f7f7f;  margin-bottom: 5px; }
.e_v_tit { font-size: 28px; color: #111;  margin-bottom: 15px; }

.excel_v_info { border-radius: 10px; background: #f3f3f3; overflow: hidden; padding: 15px 25px; position: relative; margin-bottom: 20px;  }

.e_v_i_col { float: left;  color: #333; margin-right: 50px }
.e_v_i_col span { color: #777;  display: inline-block; margin-right: 10px  }
.e_v_i_col:last-child { margin-right: 0; }
.e_v_i_r { position: absolute; right:8px; top:8px;}

.e_v_i_col .l_state_r_t { margin-top: -5px  }

.search_dl {  width: 340px   }
.search_dl dt { width: 134px;  padding: 0; float: left; }
.search_dl dd {margin: 0 0 0 138px;position:relative; padding:5px 40px 0 10px; border:1px solid #ced4da; border-radius: 8px; height: 38px; background: #fff; }
.search_dl dd .l_t_s_int { width: 100%; border:0px;  height: 26px;  font-size: 15px; outline: none;  }
.search_dl dd .search_o_bt  { position: absolute; right:0; top:0; display: block; width: 36px; color: #000; height: 36px;  border:0; border-radius: 8px; background: #fff;  }

.tbl_list{ width: 100%;   margin-top: 1px }
.tbl_list thead {background: #e6e6e6; }
.tbl_list thead th {     background: #f6f6f6;text-align: center; border-bottom: 1px solid #e6e6e6;border-right: 1px solid #e6e6e6; color: #333;font-family: SCDream; font-size: 15px; font-weight: 500;padding:10px;  white-space:nowrap; }
.tbl_list thead th:last-child {   border-right: 0px; } 
.tbl_list tbody th,
.tbl_list tfoot th  { background: #f9f9f9;padding: 15px 10px;  text-align: center;      border-bottom: 1px solid #ced0d7;   font-weight: normal; border-right: 1px solid #e1e1e1;  font-family: SCDream; }  
.tbl_list tbody td,
.tbl_list tfoot td  { border-right: 1px solid #e6e6e6; padding: 15px 10px;  text-align: center;      border-bottom: 1px solid #e6e6e6;font-family: SCDream;   }
.tbl_list tbody td:last-child { border-right: 0px; }
.tbl_list thead tr:first-child th { border-top: 1px solid #000;  }


.green_chk {  color: #1bab55; }




/* table 고정  스타일 */

/*.fixed_scroll_box  { height: 500px;
  overflow:scroll;  
  flex-grow:1;
  width:100%; border-top: 1px solid #000; 
}*/

.fixed_scroll_box  {


    width:100%;
}


.fixed_scroll_box table {border-top: 0px; 
   border-collapse: unset; 
  width:100%;
}


.fixed_scroll_box thead {

  position: sticky; 
  z-index:9; 
  top:0px;
}
/*
.fixed_scroll_box thead tr > th {

  position: sticky;
  z-index:2;
  top: 0;
}
*/
.fixed_scroll_box thead tr:nth-child(2) > th {

  top: 43px; 
}


/*
.fixed_scroll_box thead tr > :first-child {
  z-index:3;
  left:0;
  top:0;
}
*/

.fixed_scroll_box thead tr > .sec_fixed_th {
  z-index:3;
  left:160px;
  top:0;
}
.fixed_scroll_box thead tr > .third_fixed_th {
  z-index:3;
  left:320px;
  top:0;
}

/* 개선용 */
.fixed_scroll_box table thead tr > .first_thead {
    position: sticky;
    z-index:1;
    left:0;
}

.fixed_scroll_box table thead tr > .second_thead {
    position: sticky;
    z-index:1;
    left:50px;
}


.fixed_scroll_box table tbody tr > :first-child {
    position: sticky;
    z-index:1;
    left:0;
    background-color: #fff;
}

.second_fixed table tbody tr > :nth-child(2) {
    position: sticky;
    z-index:1;
    left:50px;
    background-color: #fff;
}



.table_article_title {
    max-width: 400px;
    overflow: scroll;
    overflow-y: hidden;
    /*text-overflow: ellipsis;*/
    white-space: nowrap;
    -ms-overflow-style: none;
}
.table_article_title::-webkit-scrollbar{
    display:none;
}
.article_tbl_list thead th{
    padding: 5px 1px;
    font-size: 14px;
}
.article_tbl_list tbody td{
    padding: 10px;
    font-size: 14px;
}

.fixed_scroll_box table tbody tr > .gray_th {
  position: sticky;
  z-index:1;
  left:160px;
}
.fixed_scroll_box table tbody tr > .third_fixed_th {
  position: sticky;
  z-index:1;
  left:320px;
}


/* 0801 스타일 추가 */
.link_t { color: #3235cf; }
.link_t:hover  {   text-decoration: underline}

/*  로그인  */
.login_wrap {  height: 100vh; width: 100vw;     background: url(../img/login_bg.jpg) no-repeat 50% 0; background-size: cover; }
.login_inner {    width:650px;height: 540px; position: absolute;top:50%; left:50%; margin: -270px 0 0 -325px; padding: 0px 0px 0px 0px; }
.login_inner h2  {  font-family:  GmarketSans;  font-weight: 500; color: #000;  font-size: 40px; text-align: center;  margin-bottom: 45px; }
.login_inner h2 span { display: block;  font-size: 23px; letter-spacing: 1.8px}


.login_t_box p{ font-size: 46px; color: #000;font-family: GmarketSans;  font-weight: 300;  text-align: center; margin-bottom: 15px; }
.login_t_box span { margin-bottom: 40px; display: block; font-size: 15px; color: #616161;  text-align: center;   }

.login_contents {  padding: 0 100px; }
.login_contents .login_int_b {  height: 50px;  background:#efefef;   margin-bottom: 23px; padding: 2px 0 0 20px; transition:all 0.3s ease;  border-radius: 4px; border:1px solid #efefef;  }

.login_contents .login_int_b input {  height: 26px;  width:100%;border:0px;  background: transparent;outline: none; font-size: 18px;  margin-top: 10px;  }
.login_contents .login_int_b input::placeholder {color: #A49595}
.login_contents .login_bt { background:#004ca2; border:1px solid #fff; width:100%; height: 50px; display: block;  color: #fff; text-align: center;border-radius: 10px; font-weight: normal;  margin-bottom: 10px; position: relative;overflow: hidden;  transition: all 0.3s ease;  line-height: 44px;font-size: 16px; }
.login_contents .login_bt:hover { color: #fff;  background:#00418b;  }
.login_contents .login_orcid_bt, .login_orcid_bt { background:#fff; border:1px solid #ccc; width:100%; height: 50px; display: block; color: #616161; text-align: center;border-radius: 10px; font-weight: normal;  margin-bottom: 10px; position: relative;overflow: hidden;  transition: all 0.3s ease; line-height: 44px;font-size: 16px; }




.ef_line {  box-shadow: 0 3px 26px rgba(0,0,0,0.2) !important; border:1px solid #5b5ed9 !important; }
.l_bottom_t { color: #fff;font-weight: 300; font-size: 12px;line-height: 16px;font-style: italic;  }
.l_footer {   font-size: 13px; color: #999; text-align: center;  display: block;  margin: 50px 0 0 0;}
.login_forgot_bt { text-align: right; margin-bottom: 30px;  }
.login_forgot_bt a{ display: block;  color: #555 }

.login_bottom_box{ margin-bottom: 30px;   overflow: hidden; }
.login_bottom_box a { font-family: SCDream;   display: block; float: left;  font-size: 14px; }
.login_b_r { float: right; }
.login_b_r a:last-child{ float: right;  margin-left: 15px; }

.loading_progress{
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 9999;
    background: url(../img/loading_progress.gif) no-repeat 50% 50%;
    background-size: 200px 200px;
    background-color: #dddddd;
    opacity: 40%;
}

.l_loding_wrap { position: relative; }
.l_loding_wrap:before{ content: ''; display: block;  position: absolute; left: 0;   top:87px; right:0; bottom:0; z-index: 99;    backdrop-filter: blur(2px);  }

.l_loding_wrap_notop { position: relative; }
.l_loding_wrap_notop:before{ content: ''; display: block;  position: absolute; left: 0;  top:0; right:0; bottom:0; z-index: 99;    backdrop-filter: blur(2px);  }

.loding_box {  position: absolute; left: 50%;   top:50%; z-index: 99;}


.pw_verify_wrap { margin-bottom: 40px; }
.pw_verify_tit { display: block; font-size: 20px; margin-bottom: 10px; }

.h4_tit { font-size: 22px; color: #222; margin-bottom: 10px; margin-left: 5px;  }


.tbl_form_type tbody th { border-bottom: 1px solid #d6dced;  }
.tbl_form_type tbody td { border-bottom: 1px solid #eee;  }



.chart_view_wrap { background: #fff; padding: 30px 30px 30px 30px;height: 100%; }
/*.e_v_top_fixed { position: fixed; left: 30px; right: 30px; top:30px;background: #fff; z-index: 9}*/


.chart_view_list { position: relative; }


.box_inner_box {   overflow: auto;
    position: -webkit-sticky;
    position: sticky;
    top:0;z-index: 9 }

.box_inner_tab { position: relative;  overflow: hidden;   background:#f3f3f3 url(../img/depth2_bg.png) repeat-x 0 bottom; margin: 0px 0px 10px 0px; border-radius: 10px 10px  0 0;  margin-bottom: 20px; }
.box_inner_tab ul li{ float: left; margin-right: 1px;    }
.box_inner_tab ul li:first-child{ margin-left: 1px;    }
.box_inner_tab ul li a { text-align: center; font-size: 16px; display: block; padding: 18px 20px 0 20px;  height: 58px;  color: #555; background: #f3f3f3;  border-bottom:1px solid #e0e0e0;  min-width: 140px; }
.box_inner_tab ul li a:hover  {  color: #000}
.box_inner_tab ul li a.active   {  background: #fff !important; position: relative;border:1px solid #e0e0e0; border-bottom: 0px;  color: #000 !important;   }
.box_inner_tab ul li a.active:before  { content: ''; display: block; position: absolute; height: 2px; background:#13338e; right:0px; top:-1px;  left:0;  }

.white_tab_type .box_inner_tab { background-color: #fff; }
.white_tab_type .box_inner_tab ul li a { background-color: #fff; }

.r_chart_box{ padding:30px 25px 25px 25px; }
.r_chart_box h3 { font-size: 20px; text-align: left; margin-bottom: 30px }

.chart_type_bt {   position: absolute; right: 20px; top:20px; }
.chart_type_bt a{ display: block; float: left; border: 1px solid #ddd; border-radius: 7px; width: 36px; height: 36px;  line-height: 36px; text-align: center; margin-left: 5px;  }
.chart_type_bt a:hover { border-color:#13338e; color: #000; }

.brick_line {background: #fff;border-radius: 15px; border:1px solid #eee; position: relative; transition: all 0.3s ease;  }
.brick_line:hover { border:1px solid #ddd;    }

.c_group_type a{ width: auto; padding: 0 20px; transition:all 0.3s ease; }
.c_group_type a.active { background: #13338e; color: #fff;  border-color: #13338e; }



.b_i_t_sub { overflow: hidden;  margin-bottom: 30px;  position: relative; margin-top: -20px; padding-top: 20px; background: #fff; }
.b_i_t_sub:after  {  content: ''; display: block; position: absolute; left: 0; bottom:0; right: 0;  height: 1px; background: #ddd; }
.b_i_t_sub ul li {  float: left;  min-width: 120px;text-align: center; }
.b_i_t_sub ul li a{ display: block; line-height: 56px;  position: relative; color: #777;  padding: 0 25px;  }
.b_i_t_sub ul li a:hover { color:#000; }
.b_i_t_sub ul li a.active { color: #13338e;  }
.b_i_t_sub ul li a.active:after {   content: ''; display: block; position: absolute; left: 0; bottom:0; right: 0;  height: 3px; background: #000;   }
.division_line { height: 1px; width: 100%;  margin: 20px 0; background: #eee; }


.data_tbl {  background: #f9f9f9; padding: 12px; border-radius: 10px;}
.data_tbl .tbl_list {background: #fff; border-radius: 10px;overflow: hidden; }
.data_tbl .tbl_list thead th  {background: #f6f6f6; border-top: 1px solid #000  }

.alert_red { color: #ff5151}

.report_info_box { padding: 15px;  background: #fff; border-radius: 20px; position: relative; }
.report_info_box em  {  display: block;  width: 40px;  height: 40px; border-radius: 30px; text-align: center; background: #fff;  line-height: 40px;  margin-bottom: 15px;  }
.report_info_box p { font-family: GmarketSans; font-size: 18px;  }
.report_info_box span  { font-family: GmarketSans; font-size: 30px;  font-weight: 300;  position: absolute; right: 20px; top:10px; }


.r_i_b_bg01 { background: #e1e2f7; }
.r_i_b_bg02 { background: #f7ede1; }
.r_i_b_bg03 { background: #eff7e0; }
.r_i_b_bg04 { background: #f6f7f9; }


.add_tab_fixed .v_scroll_box {overflow: scroll; position: fixed; left: 30px; right:30px; top:325px; bottom:92px; border-bottom: 1px solid #ddd;  }

.none_tab_fixed .paginate_complex,
.add_tab_fixed .paginate_complex  { position: fixed;  left: 30px; right:30px; bottom:30px; z-index: 2;  background: #fff;  }


/*.none_tab_fixed .tbl_list tbody tr:last-child td,
.add_tab_fixed .tbl_list tbody tr:last-child td{  border-bottom: 0px  }*/

.l_sort_bt { display: inline-block; position: relative;  padding: 0 17px 0 0;   color: #333;  }
.l_sort_bt:hover  { color: #000;  }
.l_sort_bt:after  {  content: ''; display: block; position: absolute; width: 8px; height: 10px;  background: url(../img/list_sort_icon.png) no-repeat 0 0;  right:0; top:5px;   }
.l_sort_bt.l_asc_icon:after  {  background: url(../img/list_sort_icon_a.png) no-repeat 0 0;  }
.l_sort_bt.l_desc_icon:after  {  background: url(../img/list_sort_icon_a.png) no-repeat 0 0; transform: rotate(180deg);}


.none_tab_fixed .v_scroll_box { overflow: scroll; position: fixed; left: 30px; right:30px; top:250px; bottom:92px; border-bottom: 1px solid #ddd;  }


.s_r_fillter {float: left; }

.result_fillter_bt { background: #fff; border:1px solid #014a94; border-radius: 10px;  height: 38px; width:  175px;  position: relative; font-size: 15px; }
.result_fillter_bt:hover { background: #f9f9f9; }
.result_fillter_bt .r_f_num { display: block; position: absolute; right: -10px; top:-10px; min-width: 24px;height: 24px;background: #000; color: #fff; text-align: center; border-radius: 12px; font-size: 13px;  line-height: 24px; }

.result_fillter_scroll {max-height: 62vh;  overflow-y: scroll; overflow-x:hidden; }
.result_fillter_scroll .s_fillter_row {padding:4px;}

.list_form_group {  }
.list_form_group:after {clear: both; }
.list_form_group:after,
.list_form_group:before { display: table;content: " "; }

.list_form_col { float: left;  margin-right: 10px;  }
.list_form_col:last-child  {  margin-right: 0px;  }



.list_chk_top_box {
    margin-left: 5px;
}

.list_chk_top_box .dropdown-item { font-size: 14px; padding-left: 25px; }

.list_chk_top_box .dropdown {
    float: left;
    padding: 2px 2px 2px 5px;
    border: 1px solid #f3f3f3;
    border-radius: 3px;
}

.list_chk_top_box .sho1w {
    background: #dfdfdf;
    border: 1px solid #ccc;
}


.list_chk_top_box .dropdown-toggle { background: #ccc;border:0px;  background: #f9f9f9; padding: 3px 5px 0 6px; margin-left: 5px;border-radius: 5px;  }



.tbl_chk_box {
    display: block;
    float: left;
    padding: 6px 3px 0 0;
    height: 20px;
}

.tbl_chk_box .form-check-input {
    width: 16px; height: 16px; margin: 0;
}

.tbl_chk_box .form-check-input:checked  {    background-color: #3826a7;border-color: #3826a7;   }





.list_chk_drop {
    display: block;
    height: 20px;
    float: left;
    text-indent: -9999px;
    background: url(../img/chk_down_arr.png) no-repeat 50% 50%;
    width: 20px;
}

.list_chk_drop:hover {
    background-color: #dfdfdf;
}


.list_top_left { padding: 5px 0 0 0; }
.list_top_left .list_chk_top_box { position: relative; margin-left: 15px;  padding-right: 15px;  margin-right: 20px; float: left; }
.list_top_left .list_chk_top_box:after { content: '';  display: block; position: absolute; right:0; top:6px; width: 1px; background: #999; height: 16px; }
.list_top_left .a_v_r_text {  float: left; padding-top: 3px; padding-left: 0 }



.list_top_left .l_top_bt_area { left: 68px;  }


.result_fillter_drop { background: none;  border:0px;  padding-top: 6px; max-height:62vh;      }
.result_fillter_inner { width: 368px; border-radius: 10px; padding: 30px 15px 15px 20px; box-shadow: 0 10px 25px rgba(72,72,72,0.3); border:0px; background: #fff;  height: 100%; }
/*.result_fillter_inner:after  { content: ''; display: block; position: absolute; top: 5px; background: url(../img/f_drop_arr.png) no-repeat 50% 50%;background-size: 25px auto; width:25px; height: 20px;     right: 64px;  }*/


.s_fillter_tit { font-size: 16px; color:#222;  margin-bottom: 10px}

.s_fillter_sel {  position: relative; border-bottom: 1px solid #e9e9e9; padding-bottom: 20px; margin-bottom: 20px;  }

.s_fillter_sel ul  { overflow: hidden; }
.s_fillter_sel ul li {   float: left; background: #fff; border:1px solid #333;  padding: 5px; font-size: 14px; border-radius: 10px; margin-right: 5px; }

.s_fillter_del { display: inline-block;  color: #afafaf;  margin-left: 5px;   }
.s_fillter_del:hover  { color: #000; }

.s_f_t_clear {  display: block; position: absolute;background: #fff;  right: 0; top:-5px; border:0px; width: 32px;height: 32px;  border-radius: 10px; }
.s_f_t_clear:hover { background: #f9f9f9; }

.s_fillter_col { border-bottom: 1px solid #e9e9e9; padding: 0 0 20px 0; margin-bottom: 20px; }

.s_fillter_item a{ display: block; background: #f3f3f3; border-radius: 8px; font-size: 14px;  padding: 7px 5px 7px 20px; position: relative; border:1px solid #f3f3f3;}
.s_fillter_item a:before  { content: ''; display: block;  background: url(../img/fillter_chk.png) no-repeat 0 0px;   position: absolute; left: 0px; top: 12px;     background-size: 11px auto;  width: 11px; height: 11px;  transition:all 0.3s ease; opacity: 0; visibility: hidden; }
.s_fillter_item a:hover { color: #014a94; }
.s_fillter_item a.on  {border-color: #014a94; background: #fff; color: #014a94;   }
.s_fillter_item a.on:before  { opacity: 1; visibility:visible;  left: 5px;  }

.s_fillter_row .s_fillter_col:last-child { border-bottom: 0px;  padding:0 0 0 0;  margin-bottom: 20px; }

.s_f_add_n a {  position: relative; padding-right:70px;}
.s_f_add_n a em { display: block; position: absolute; right: 5px; top:7px; }



.s_fillter_s_box {     border-bottom: 1px solid #e9e9e9;
    padding-bottom: 20px;
    margin-bottom: 20px; }
.s_fillter_search{ position:relative; padding:5px 40px 0 10px; border:1px solid #ced4da; border-radius: 8px; height: 38px; background: #fff; }
.s_fillter_search .l_t_s_int { width: 100%; border:0px;  height: 26px;  font-size: 15px; outline: none;  }
.s_fillter_search .search_o_bt  { position: absolute; right:0; top:0; display: block; width: 36px; color: #000; height: 36px;  border:0; border-radius: 8px; background: #fff;  }






/* home */
.home_type_wrap {  background: url(../img/home_top_bg.jpg) no-repeat 50% 0; background-size: 100% 224px;}


.home_top_wrap {  padding: 36px 0 0 0px; margin-bottom: 25px; display: flex; flex-direction:column; position: relative; }
.home_top_wrap:after {content: '';
    display: block;
    position: absolute;
    right: 0;
    bottom: -65px;
    background: url(../img/home_top_img.png) no-repeat right bottom;
    width: 690px;
    height: 253px;
    background-size: auto 210px;   }
.home_type_wrap .sub_contents_box { padding-bottom: 50px; width: 90%; padding-top: 0; }

.home_t_lb {  padding: 0 0 0 0px; }
.home_t_lb p{ color: #fff;  font-family: GmarketSans;  font-size: 28px; margin-bottom: 0px; font-weight: 300; }
.home_t_lb span {  color: #fff;  display: block; font-size: 18px; }

.home_t_rb  { line-height: 40px;  color: #fff; font-size: 18px;  position: relative;  padding: 0 0 0 38px; display: flex; align-items: center; }
.home_t_rb:after {  content: ''; display: block; position: absolute;left:0; top:6px;  width: 28px; height: 28px;  background:#fff url(../img/home_t_user.png) no-repeat 50% 7px;  border-radius: 22px; background-size: 19px auto;   }
.home_t_rb p{ margin-left: 10px; float: right;  font-size: 14px; }
.home_t_rb p span { display: inline-block;  font-family: GmarketSans;  font-size: 26px;   margin-left: 15px;}

.h_t_u_n {margin-left: 12px;float: right;font-size: 14px;  color: #fff; margin-bottom: 0px;}
.h_t_u_n span {  font-family: GmarketSans; font-weight: 300;  font-size: 26px; display:inline-block; }

.home_state_box { padding:20px; }
.home_state_box h3 {  font-size: 18px;  color: #222; margin-bottom: 22px;  }
.h_s_item { position: relative; padding: 0 5px 0 15px; }
.h_s_item:after  {  content: ''; display: block; position: absolute; left: 0; width: 2px; top:4px; bottom:4px; background: #d7d7d7; border-radius: 5px  }

.h_s_item p {font-size: 14px; color: #555;  position: relative; padding: 0px 0 0 0px; margin-bottom: 5px; line-height: 22px; }
/*.h_s_item p:after {  content: ''; display: block; position: absolute; right: 0; top:8px; width: 5px; height: 5px; background: #2f3ce2;  border-radius: 10px;}*/
.h_s_item .h_s_i_bg02:after {  background: #d677f2; }
.h_s_item .h_s_i_bg03:after {  background: #19bf92; }
.h_s_item .h_s_i_bg04:after {  background: #36da32; }
.h_s_item .h_s_i_bg05:after {  background: #efa337; }
.h_s_item .h_s_i_num {font-size: 14px; color: #777;  }
.h_s_item .h_s_i_num span  { font-family: GmarketSans;  display: inline-block;  font-size: 24px;  font-weight:500; color: #000;  }

.h_s_l01:after {  background: #d677f2; }
.h_s_l02:after {  background: #19bf92; }
.h_s_l03:after {  background: #36da32; }
.h_s_l04:after {  background: #efa337; }

.home_num_box { padding: 20px;  }
.home_num_box:after { display: none;  }
.home_num_box p { font-size: 18px;  color: #222;padding: 47px 0 0 0;   margin-bottom: 5px;  }
.home_num_box p:after  {  content: ''; display: block; position: absolute; right: 0; top:8px;  left: 0; top:0;   width:40px; height: 40px; border-radius: 12px;  }
.home_num_box .h_user_i:after  {  background:#76d8e4 url(../img/home_u_i.png) no-repeat 50% 7px;  }
.home_num_box .h_journal_i:after  {  background:#76e4c1 url(../img/home_j_i.png) no-repeat 12px 8px;  }

.brick_pd { padding: 20px; }

.home_h3_tit { font-size: 20px; color: #222; margin-bottom: 25px; border-bottom: 1px solid #eee;   position: relative; padding-bottom: 15px; }
.home_h3_tit:after  {  content: ''; display: block;  position: absolute;left: 0; bottom:-1px; width: 26px; height: 2px; background: #13338e; }

.home_file_list ul li { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #eee; }
.home_file_list ul li:last-child  { margin-bottom: 0px;padding-bottom: 0px; border-bottom: 0px;    }
.home_file_list ul li a { display: block;  font-size: 16px;color: #222;  text-overflow: ellipsis; white-space: nowrap; overflow-wrap:normal; overflow: hidden; }
.home_file_list ul li span { display: block; font-size: 14px; padding: 0 0 0 20px; color: #777; }
.home_file_list ul li a i{ color: #777; margin-right: 5px;  }


.add_bt_box {  position: relative; padding: 0 70px 0 0; }
.add_bt_box .line_bt {   position: absolute; right: 0; top:0;  }

.list_sel_group { margin-top: 15px; }
.list_sel_group h4 { font-size: 16px; margin-bottom: 10px; }
.list_sel_group .list_sel_inner {overflow-y: scroll; height: 280px;  background: #f9f9f9; padding: 15px; border-radius: 15px;  }

.list_sel_inner ul li  {padding: 10px; position: relative; border:1px solid #ddd; border-radius: 10px; margin-bottom: 5px; background: #fff;  }
.list_sel_inner ul li:last-child { margin-bottom: 0px; }
.list_sel_inner ul li .form-check-input { position: absolute;right: 10px; top: 10px; }


.list_sel_bottom { margin-top: 15px; border-top: 1px solid #ccc;  padding-top: 15px; position: relative; }
.list_sel_bottom .line_bt { display: block;  width: 100%; }


.list_sel_drop { border-top:1px solid #000;     position: absolute; left: -16px;right: -16px;  top: -57px; height: 156px; background: #fff; padding: 15px 30px;  box-shadow: 0 -10px 10px rgba(0,0,0,0.2); transition:all 0.3s ease; opacity: 0; visibility: hidden; }
.list_sel_drop .form_column { float: none;  padding: 0; }
.list_sel_drop .form_item { margin: 5px 0 0 0;  }
.list_sel_drop .form_item .line_bt {margin-top: 10px; }
.list_sel_drop.active { opacity: 1; visibility: visible; top: -87px;    }

.list_sel_drop .modal_close_bt { background-size: 18px auto; width: 34px;height: 34px;     right: 23px; }


.user_list_type .taks_list_tit_box { line-height: normal; }
.user_list_type.task_list_box .form-check { top: 2px;margin: 0;  }
.user_list_type .u_l_n_t  {  display: inline-block; background: #f3f3f3; border-radius: 7px; padding: 3px 8px; font-size: 15px;  margin-left: 5px;  }


.u_l_g_row {  overflow: hidden; margin-top: 5px;  }
.u_l_g_row ul li { float: left;  position: relative;  background: url(../img/u_l_g_arr.png) no-repeat right 2px;padding-right: 20px; margin-right: 15px;    }
.u_l_g_row ul li:last-child {background: none; padding-right: 0; margin-right: 0px;  }
.u_l_g_row ul li a  { display: block; font-size: 14px; color: #777; }
.u_l_g_row ul li a:hover   { color: #222; }


.l_g_ver_t ul li {  float: none;  background: none;  position: relative;  padding-right: 0px; margin-right: 0px;   padding-left: 12px;  margin-bottom: 8px;  }
.l_g_ver_t ul li:last-child  { margin-bottom: 0px;  }
.l_g_ver_t ul li:after { content: ''; display: block; position: absolute; left: 0; top:6px; width: 4px; height: 4px; background: #999; }

.l_p_tit { margin-bottom: 15px; font-size: 20px; }
.l_p_late  {  font-family: GmarketSans;  margin-top: 8px;  }
.l_progressbar_type  {background: rgba(0,0,0,0.7); text-align: center; border-radius: 20px;width: 400px;margin-left: -200px; top: 20%;  padding: 50px 0 40px 0;  color: #fff; }


.l_progressbar_box { width: 340px;height: 15px; border-radius: 10px;overflow: hidden; position: relative; background: #eee; margin: 0 auto; transition:all 0.3s ease; }
.l_progressbar_box span { display: block; position: absolute; left: 0; top: 0; bottom:0; background: #2f7ef5; border-radius: 20px; box-shadow: 0 5px 15px rgba(0,0,0,0.8);  }


.l_p_time { margin-top: 15px;}


/* 갱신 애니메이션 */
link {color: #E45635;display:block;font: 12px;text-align:center; text-decoration: none;}
#link:hover {color: #CCCCCC}

#link, #link:hover {-webkit-transition: color 0.5s ease-out;-moz-transition: color 0.5s ease-out;-ms-transition: color 0.5s ease-out;-o-transition: color 0.5s ease-out;transition: color 0.5s ease-out;}

/** BEGIN CSS **/

@keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

@-moz-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

@-webkit-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

@-o-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

@keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

@-moz-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

@-webkit-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

@-o-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

@keyframes loading-text-opacity {
    0%  {opacity: 0}
    20% {opacity: 0}
    50% {opacity: 1}
    100%{opacity: 0}
}

@-moz-keyframes loading-text-opacity {
    0%  {opacity: 0}
    20% {opacity: 0}
    50% {opacity: 1}
    100%{opacity: 0}
}

@-webkit-keyframes loading-text-opacity {
    0%  {opacity: 0}
    20% {opacity: 0}
    50% {opacity: 1}
    100%{opacity: 0}
}

@-o-keyframes loading-text-opacity {
    0%  {opacity: 0}
    20% {opacity: 0}
    50% {opacity: 1}
    100%{opacity: 0}
}
.loading-container,
.loading {
    height: 100px;
    position: relative;
    width: 100px;
    border-radius: 100%;
}


.loading-container { margin: 10px auto 30px auto;}

.loading {
    border: 2px solid transparent;
    border-color: transparent #fff transparent #FFF;
    -moz-animation: rotate-loading 1.5s linear 0s infinite normal;
    -moz-transform-origin: 50% 50%;
    -o-animation: rotate-loading 1.5s linear 0s infinite normal;
    -o-transform-origin: 50% 50%;
    -webkit-animation: rotate-loading 1.5s linear 0s infinite normal;
    -webkit-transform-origin: 50% 50%;
    animation: rotate-loading 1.5s linear 0s infinite normal;
    transform-origin: 50% 50%;
}

.loading-container:hover .loading {
    border-color: transparent #2f7ef5 transparent #2f7ef5;
}
.loading-container:hover .loading,
.loading-container .loading {
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

#loading-text {
    -moz-animation: loading-text-opacity 2s linear 0s infinite normal;
    -o-animation: loading-text-opacity 2s linear 0s infinite normal;
    -webkit-animation: loading-text-opacity 2s linear 0s infinite normal;
    animation: loading-text-opacity 2s linear 0s infinite normal;
    color: #ffffff;
    font-family: "Helvetica Neue, "Helvetica", ""arial";
    font-size: 10px;
    font-weight: bold;
    margin-top: 45px;
    opacity: 0;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 0;
    width: 100px;
}

.home_ani_box  {  opacity: 0; margin-top: 60px;  }
.s_top_tab { text-align: center;  margin-bottom: 20px; padding-top: 10px;   }
.s_top_tab ul  {display: flex; justify-content: space-between; }
.s_top_tab ul li  { flex-grow: 1;  }
.s_top_tab ul li a { display:block; width: 100%; text-align: center; line-height: 42px;  background: #e9e9e9; color: #555; border-radius: 24px;   font-size: 18px;  transition:all 0.3s ease;   }
.s_top_tab ul li a:hover{ color: #000; background: #e3e3e3; }
.s_top_tab ul li a.on {  background: #004ca2; color: #fff;  }


.h_logo_box{ float: left;    }
.h_logo_box a { display: block; text-align: center; width: 64px; height: 64px;transition:all 0.3s ease; padding: 18px 0 0 0;  color: #fff;  background:#0c2b82  url(../img/left_bar_logo.png) no-repeat 50% 50%;       background-size: 46px auto;  text-indent: -99999px;  }

.home_t_r_sel { flex-direction: column; width: 320px;  display: flex; color: #fff; margin-bottom: 10px; margin-top: 15px;  }
.home_t_r_sel p{ font-size: 13px; margin-bottom: 5px; color: #c5d5ff;   }