@charset "UTF-8";
/*login*/
.container {padding-top: 200px;}
.login_wrap {width:340px; margin: 0 auto;}
.login_box {width:100%;}
.login_box h1{ margin-bottom: 15px; font-size: 34px; color: #414757;}
.login_box p { margin-bottom: 37px; font-size: 13px; color: #666;}
.main_login_form  label {display: inline-block; padding-bottom:6px; width:100%; font-size: 13px; font-weight: 700;}
.main_login_form  input {width:100%; margin-bottom: 15px;}
.login_box .btn_area {margin-top: 25px;}
.login_box .btn_area  button {width:100%; height: 43px; border-radius: 5px;
                                -webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.4);
                                -moz-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.4);
                                box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.4); }
.login_box  .btn_area  button  span {display: inline-block; width:100%; height:43px; font-size:15px; color:#fff; font-weight:700; line-height: 41px; text-align: center;  border-top:1px solid #6e7382; border-left:1px solid #b8b9be; border-right:1px solid #a3a5ab; border-bottom:1px solid #c5c6ca; border-radius: 5px;
                                        background: #7c8293;
                                        background: -moz-linear-gradient(top, #7c8293 0%, #767b8d 41%, #6c7183 100%);
                                        background: -webkit-linear-gradient(top, #7c8293 0%,#767b8d 41%,#6c7183 100%);
                                        background: linear-gradient(to bottom, #7c8293 0%,#767b8d 41%,#6c7183 100%);
                                        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7c8293', endColorstr='#6c7183',GradientType=0 );}
.login_box .btn_area button:hover {opacity: 0.8;}


.header {position:relative; z-index:1; width:100%; height:51px; border-bottom:1px solid #b9b9b9; background: #fff;
            -webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
            box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);}
.header:after {display:block;clear:both;content:'';}
.header .logo_wrap {z-index:99; position:absolute; top:17px; left:25px; width:325px; height: 27px; }
.header .logo_wrap a span {display: inline-block; padding:0 0 3px 5px; font-size:13px; font-weight:800; color:#000; letter-spacing: -1px;}
.main_wrap .header {background: #f5f5f5}
.list_wrap .header {background: #fff;}
.gnb {position: absolute; top:0; left:351px; width:580px; height: 50px;}
.gnb .dep01 {width:100%; height: 100%; border-left:1px solid #b9b9b9;}
.gnb .dep01 > li {position:relative; float: left; width:25%; height: 50px; border-right:1px solid #b9b9b9;}
.gnb .dep01 > li a {display: inline-block; width:100%; height: 100%;}
.gnb .dep01 > li a span {display: inline-block; width:100%; height: 100%; font-size: 16px; line-height: 50px; font-weight: 800; color: #000; text-align: center;}
.gnb .dep01 > li.active:after {position: absolute; bottom:0; left:0; width:100%; height: 8px; background: #000; content:'';}
.gnb .dep01 > li:hover:after {position: absolute; bottom:0; left:0; width:100%; height: 8px; background: #000; content:'';}

.gnb .dep01 > li:hover .dep02 {display:block;}
.dep02 {display: none; z-index:10; position: absolute; left:0; top:100%; width:800px; height:40px;}
.dep02 ul {display: inline-block; margin-top:5px; height:25px; padding:0 20px;   border-radius: 15px;  background:#c1ccd2;}
.dep02 ul li {display: inline-block;}
.dep02 ul li a {display: inline-block; padding: 0 15px; font-size: 12px; line-height: 25px; font-weight: 800; color: #586a75;}
.dep02 ul li a:hover {color: #fff; background:#7e919c;}
.dep02 ul li.active a {color: #fff; background:#7e919c;}

.gnb_tab {position: absolute; top:0; left:350px; width:435px; height: 50px;}
.gnb_tab .main_info_tab_lst {width:100%; height: 100%; border-left:1px solid #b9b9b9;}
.gnb_tab .main_info_tab_lst li {position:relative; float: left; width:33.3%; height: 50px; border-right:1px solid #b9b9b9;}
.gnb_tab .main_info_tab_lst li a {display: inline-block; width:100%; height: 100%; font-size: 16px; line-height: 50px; font-weight: 800; color: #000; text-align: center;}
.gnb_tab .main_info_tab_lst li.active:after {position: absolute; bottom:0; left:0; width:100%; height: 8px; background: #000; content:'';}

.login_info {position: absolute; top:10px; right:10px;  height: 30px;}
.login_info > a {position:relative; display: inline-block; padding:0 5px; height:27px; vertical-align: middle;}
.login_info > a:hover {opacity: 0.5;}
.login_info .dropdown {position:relative; vertical-align: middle; margin-top: -2px;}
.content_wrap {position:relative; padding-left: 236px;}
.content_wrap:before {position: fixed; z-index: 0; top:0; left:0; bottom:0; width:230px; background: #ffffff; border-right:1px solid #b9b9b9; content: '';
-webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
            box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);}
.main_wrap .content_wrap {width:100%; padding-left: 0;}
.main_wrap .content_wrap:before {display: none;}
.employee_detail_wrap .content_wrap {position:relative; padding-left: 360px; border:0; background: none;}
.employee_detail_wrap .content_wrap > .content  > .content_box {border:0; background: none; padding: 0;}
.employee_detail_wrap .content_wrap:before {position: fixed; z-index: 0; top:0; left:0; bottom:0; width:351px; background: #ffffff; border-right:1px solid #b9b9b9; content: '';
-webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
            box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);}
.content_wrap:after {display:block;clear:both;content:'';}
.content {width:100%; padding:0 6px 6px 6px; min-height: 800px;}
.content:after {display:block;clear:both;content:'';}
.location_wrap {position:relative; width:100%; height:37px; padding-left:0;}
.location_wrap:after {display:block;clear:both;content:'';}
.btn_wrap {position: absolute; top:4px; right:6px;padding:3px 0 3px 10px; height:30px;}
.btn_list li {float: left; width:25px; height: 25px;}
.btn_list li button {display:block; width:25px; height: 25px; background: #fff; border:1px solid #91aab8; border-radius: 3px; color: #fff; text-align: center;}
.btn_list li button.font_plus {border-right:0; background: #c1ccd2 url(../images/new/icon_plus.png) no-repeat center center; border-radius: 3px 0 0 3px;}
.btn_list li button.font_minus {background: #c1ccd2 url(../images/new/icon_minus.png) no-repeat center center; border-radius: 0 3px 3px 0;}
.btn_list li:nth-child(2) {margin-right:15px;}
.btn_list li button.font_reset {background: #fff url(../images/new/icon_reset.png) no-repeat center center;}
.btn_list li:nth-child(3) {margin-right:9px;}
.btn_list li button.btn_setup {background: #fff url(../images/new/icon_setup.png) no-repeat center center;}
.btn_list li button .material-icons {display:none;}

.btn_list li button:hover {opacity: 0.7;}
.location {display:inline-block; height:34px; margin-right: 15px;}
.location  li {position:relative; display:inline-block;margin-left:20px; height:34px; padding: 3px 0; vertical-align: bottom;}
.location  li:first-child {margin-left:10px;}
.location  li:after {display: block; position: absolute; width:10px; height:34px; top:3px; right:-16px; font-size:12px; line-height:34px; text-align: center; content: ">"}
.location  li:last-child:after {display: none;}
.location  li a {line-height: 34px;}
.location  li a .material-icons {display: none;}
.location  li:first-child a {display: inline-block; width:12px; height: 34px;  background: url(../images/new/icon_home.png) no-repeat center center;}
.location  li span {line-height: 34px; font-weight: 700;}
/*tab*/
.tab_basic {z-index:0; position: relative; width:100%; height:30px; margin: 15px 0;}
.tab_basic:after {display:block;clear:both;content:'';}
.tab_basic > .tab_lst {display: block; width:100%; height: 100%; padding-left:10px;}
.tab_basic > .tab_lst li{display:inline-block; float: left; min-width: 127px;  height: 30px; margin:0 4px; background: #fff;}
.tab_basic > .tab_lst li a {display: inline-block; width: 100%; height: 100%; padding:0 10px; font-size: 14px; color: #7a8e99; font-weight: 700; border:1px solid #7a8e99; line-height: 28px; text-align: center;  border-radius: 15px;}
.tab_basic > .tab_lst li.active a {color: #fff; background:#9013fe; border:0;}
.tab_container{margin: 20px 0;}
.tab_container .tab_content{display: block; visibility: hidden; height: 0; width:100%; overflow: hidden;}
.tab_container .tab_content.active {visibility: visible; height: auto; overflow: visible;}


.main_info_tab {width: calc(50% - 3px); height:222px; padding:0; float: left;}
.main_info_tab  .info_tabcontent {display: block; visibility: hidden; height: 0; width:100%; overflow: hidden;}
.main_info_tab  .info_tabcontent.active {visibility: visible; height: auto;}

/*main*/
.main_content .content_left {width: 68%;  height: auto; float: left; padding-right: 6px; padding-top: 6px; transition: all .2s;}
.main_content.active .content_left {width:100%; padding-right: 0;}
.main_content .content_left:after {display:block;clear:both;content:'';}
.main_content .content_box {background: transparent; padding: 0;}
.content_box  {z-index:0; position:relative; width:100%; padding:10px 12px; background: #fff; border:1px solid #b9b9b9;}
.reservation_wrap {position: relative; width:100%; height: auto;  min-height:400px; margin-bottom:6px; border:0;}
.reservation_wrap:after {display:block;clear:both;content:'';}
.reservation_wrap .tab_basic {position: absolute; top:10px; right:69px; height:20px; width:50%; display: inline-block}
.reservation_wrap .tab_basic:before {display: none;}
.reservation_wrap .tab_basic > .tab_lst {height: 20px; text-align: right;}
.reservation_wrap .tab_basic > .tab_lst li {float: none; min-width: 70px; height:20px; border-bottom:0; border-radius: 3px;}
.reservation_wrap .tab_basic > .tab_lst li a {line-height: 20px; font-size: 12px;}
@-moz-document url-prefix(){.reservation_wrap .tab_basic > .tab_lst li a  {line-height: 17px;} }
.reservation_wrap .tab_basic > .tab_lst li.active a:after {display: none;}
.reservation_wrap .tab_container {margin: 0;}
.reservation_wrap .reserv_btn_wrap {position: absolute; z-index:99; top:3px; right:1px;}
.reservation_wrap .reserv_btn_wrap a {position:relative; display:inline-block; width: 20px; height:20px; border-radius:2px; border:1px solid #b9b9b9; font-size: 0; overflow: hidden; text-indent: -9999%; background: #fff url(../images/new/icon04.png) no-repeat center center;}
.reservation_wrap .reserv_btn_wrap.active a{background: #fff url(../images/new/icon05.png) no-repeat center center;}
.reservation_wrap .reserv_btn_wrap a:hover {opacity: 0.7;}
/* calendar */
.calendar_wrap {position: relative; z-index: 0; padding-top: 27px;}
#calendar {}
.btn_holder {position:absolute; top:3px; left:15px; text-align: left; vertical-align: bottom;}
.btn_holder .c_date {display: inline-block; padding:0 10px; font-size:16px; color:#000;font-weight:700; line-height:20px; vertical-align: middle;}
.btn_holder .material-icons {width:20px; height: 20px; line-height: 20px; text-align: center; color: #ccc; font-size: 18px; }
@-moz-document url-prefix(){ .btn_holder .material-icons {line-height: 23px;} }
.btn_holder button {display: inline-block;  width:20px; height: 20px; overflow: hidden; border-radius: 3px; vertical-align: bottom; background: #333;}
.infobox {padding: 10px; text-align: right;}
.infobox > span {position:relative; display: inline-block; padding-left:30px;}
.infobox > span:before {position: absolute; top:-1px; left: 10px; width:15px; height: 15px; border: 1px solid #dcdcdc; background: #fff; content: '';}
.infobox > span:first-child:before {background: #eceafe;}
.tbl {z-index:0; position:relative; width: 100%; height:613px; border-collapse: collapse; background: #fff;}
.tbl tbody tr:last-child td.dt {border-bottom:1px solid #bcbcbc;}
.day {height: 21px;font-weight: 800;text-align: center; font-size:10px; color: #5b6770; background: #f2f2f2;  border:1px solid #e6e6e6; border-top:1px solid #bcbcbc;}
.day.sun {border-left:1px solid #bcbcbc;}
.day.sun:after {position: absolute; right:0; top:17px; width: calc(100% / 7); height:5px; background: #0584fa; content:'';}
.day.sat {border-right:1px solid #bcbcbc;}
.day.sat:after {position: absolute; left:0; top:17px; width: calc(100% / 7); height:5px; background: #ea5541; content:'';}
.dt.sun {border-left:1px solid #bcbcbc;}
.dt.sat {border-right:1px solid #bcbcbc;}
.dt {border:1px solid #dcdcdc;}
.dt.date_cell {height: auto; background: #fff; vertical-align: top;}
.dt.current {background: #f3fcfc;}
.dt.unable {background: #faf6f5;}
.dt.not_this_month {background: #f9f9f9;color: #999}
.dt.not_this_month .daybox > p > span {color:#b6bcbc;}
.dt.prev_date .daybox > p > span {color:#b6bcbc;}
.daybox {position: relative; padding:0 8px 8px 8px;width:100%;}
.daybox p {line-height: 17px; font-size: 11px; color:#63656a; text-align: right; letter-spacing: -0.5px;}
.daybox > .dt_box  {display: block;  height:40px;}
.daybox > .dt_box span {display:block; float: right; width:40px; height:40px;  color:#dce0d9; font-size:24px; font-weight:700; line-height: 40px; text-align: right}
.dt.sun .daybox > .dt_box span {color:#ffaeb2;}
.dt.sat .daybox > .dt_box span {color:#a4c7fd;}
.daybox > .dt_box > span.btn_day_info {cursor: pointer}
.daybox > span {display: block; padding-bottom:5px; font-size: 12px;}
/*.daybox:after {display:none; z-index:10; position:absolute; top:0; left:0; width:100%; height: 100%; border:2px solid rgba(0,0,0,0.3); content: ''; box-sizing: border-box;}
.daybox:hover:after {display: block;}*/
.daybox > p > span {display: inline-block; font-size: 11px; color: #3c2e2e; line-height: 15px; padding: 0 3px;}
.daybox > p > span .material-icons {padding-right:3px; font-size: 11px; color:#72adb9; line-height: 15px; vertical-align: middle;}
.daybox p.reserv > span {padding: 0 1px;}
.daybox p.reserv > span:after{display: inline; content: ' / ';}
.infobox_wrap {width: calc(50% - 5px); height:222px; padding:0; background:#fff !important; float: left; border:1px solid #b9b9b9;}
.infobox_wrap h2 {position:relative; width:100%; height: 30px; padding-left:30px; color:#000; font-size: 13px; font-weight: 800; line-height: 30px; background:#fff; border-bottom:1px solid #b9b9b9;}
.infobox_wrap h2:before {position: absolute; top:0; left:0; width:30px; height: 30px; background: url(../images/new/h2_bg01.png) no-repeat center center; content: '';}
.main_info_tab .info_tabcontent .infobox_wrap {width:100%; box-shadow: none !important;}
.infobox_wrap .tab_basic {height:30px; display: inline-block; margin: 0;}
.infobox_wrap .tab_basic:before { position: absolute; top:0; left:0; width:30px; height: 30px; background: url(../images/new/h2_bg05.png) no-repeat center center; content: '';}
.system_box_wrap .tab_basic:before {background: url(../images/new/h2_bg07.png) no-repeat center center; content: '';}
.infobox_wrap .tab_basic > .tab_lst {position:relative; padding-left:37px; height: 30px;  padding-right:10px; text-align: right;}


.infobox_wrap .tab_basic > .tab_lst li {float: none; min-width:auto; width:auto; margin:0 0 0 15px;height:27px; border-radius: 0;}
.infobox_wrap .tab_basic > .tab_lst li:first-child {margin-left: 0;}
.infobox_wrap .tab_basic > .tab_lst li a {padding:0; line-height: 27px; height:27px; font-size: 13px; color: #bcbcbc; border:0; background: none; text-align: left;}
.infobox_wrap .tab_basic > .tab_lst li.active a {color: #101010; font-weight:700;}
.infobox_wrap .tab_basic > .tab_lst li.active a:after {display: none;}
.infobox_wrap .tab_container {margin:-1px 0 0 0;}
.infobox_wrap .info_area {position: absolute; top:35px; left:10px; height:22px; display: inline-block}
.infobox_wrap .info_area ul {height: 22px;  padding-right:10px; text-align: right;}
.infobox_wrap .info_area ul li {float: none; display:inline-block; height:20px; margin-left: 2px; cursor: pointer;}
.infobox_wrap .info_area ul li span {display:inline-block; padding:0 10px; line-height:18px; font-size: 12px; font-weight:700; color: #63656a; background:#fff; border-radius: 10px; border:1px solid #63656a; cursor: pointer;}
.infobox_wrap .info_area ul li.active span {color: #bd10e0; border:1px solid #bd10e0;}
.infobox_wrap .btn_more {position: absolute; display:block; top:7px; right:5px; width:16px; height:16px; }
.infobox_wrap .btn_more .material-icons {font-size: 16px; color: #d8d8d8;}

.day_info_box {display:none; z-index:999; position: absolute; top:50%; left:50%; width:1; height:1;}
.day_info_box.active {display: block;}
.day_reserv_info {position: relative; z-index:999; width:170px; height:auto; padding:30px 10px 10px 10px; margin: -112px 0 0 -85px; background: #313e47; border-radius: 5px; -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.5); -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.5); box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.5);}
.day_reserv_info .day_num {position:absolute; top:30px; right:10px; width:40px; height: 30px; font-size:36px; font-weight: 700; color:#afb2b4; text-align: right; line-height: 30px; letter-spacing: -2px;}
.day_reserv_info p {padding-top: 15px; font-size:14px; font-weight: 700; color:#e9e9e9;}
.day_reserv_list {width:100%;}
.day_reserv_list li {width:100%; margin-top: 9px; height: 13px;}
.day_reserv_list li .graph {display:block; float: left; width:90px; height: 13px;}
.day_reserv_list li .graph > span{ display: inline-block; height:13px; border-radius: 3px;}
.day_reserv_list li .graph .graph_color01 {background:#d3b4ee;}
.day_reserv_list li .graph .graph_color02 {background:#8073e0;}
.day_reserv_list li .graph .graph_color03 {background:#99c8f8;}
.day_reserv_list li .graph .graph_color04 {background:#78e4e1;}
.day_reserv_list li .graph .graph_color05 {background:#84e478;}
.day_reserv_list li .graph .graph_color06 {background:#d6e478;}
.day_reserv_list li .graph .graph_color07 {background:#f5a623;}
.day_reserv_list li .graph .graph_color08 {background:gray;}
.day_reserv_list li .graph .graph_color09 {background:gray;}
.day_reserv_list li .graph .graph_color10 {background:gray;}
.day_reserv_list li .reserv_name {display:inline-block;  float: left; margin-left: 9px; width:31px; height: 13px; font-size:12px; font-weight: 700; color:#e9e9e9; line-height: 13px;}
.day_reserv_list li .reserv_num {display:inline-block;  float: left; width:17px; height: 13px; font-size:12px; font-weight: 700; color:#e9e9e9; line-height: 13px; text-align: right; letter-spacing: -1px;}
.day_reserv_info .btn_reserv_list_close {display:block;position: absolute;top: 5px;right:5px;width: 12px;height: 12px; overflow: hidden;}
.day_reserv_info .btn_reserv_list_close .material-icons {color: #e9e9e9; font-size: 12px;}

.schedule_wrap .btn_reg {position:absolute; top:6px; right:3px; display: inline-block; height: 18px; padding:0 10px; margin-right:5px; color:#fff; font-size:11px; font-weight:700; line-height:18px; background: #5ad8f6; text-align: center; border-radius:5px;}
.schedule_wrap .btn_reg:hover {opacity: 0.8;}
.schedule_list {width:100%; height: 190px;}
.schedule_list > li {float: left; width:50%; height:50%;}
.schedule_list > li:first-child {border-bottom:1px solid #e6e6e6; border-right:1px solid #e6e6e6;}
.schedule_list > li:nth-child(2) {border-bottom:1px solid #e6e6e6;}
.schedule_list > li:nth-child(3) {border-right:1px solid #e6e6e6;}
.schedule_list h3 {color:#5b6770; font-size: 12px; font-weight: 700; padding-left: 5px; background:#f2f2f2; border-bottom:1px solid #e6e6e6;}
.schedule_list h3 .material-icons {color:#5b6770; font-size: 13px; vertical-align: middle;}
.schedule_list h3:before {display: none;}
.schedulebox {width:100%; height: 67px;overflow: hidden; overflow-y: auto;}
.schedulebox li {position:relative; padding:5px 5px 6px 15px;}
.schedulebox li:first-child {margin-top: 2px;}
.schedulebox li:before {position: absolute; top: 10px; left:7px; width:2px; height: 2px; background:#5b6770; content:'';}
.schedulebox li:hover {background:#f2f2f25e;}
.schedulebox li a {display:inline-block; font-size: 11px; color: #5b6770; max-width:97%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.reserv_list_wrap {height: 180px;}
.reserv_list_wrap .title_box {width:100%; height:25px; margin-top:29px; background: #f2f2f2; border-bottom: 1px solid #e6e6e6; border-top: 1px solid #e6e6e6;}
.reserv_list_wrap .title_box span {display:inline-block; float: left; font-size: 11px; color:#5b6770; line-height: 25px; text-align: center; cursor: pointer;}
.reserv_list_wrap .title_box span.time {width:15%;}
.reserv_list_wrap .title_box span.name {width:15%;}
.reserv_list_wrap .title_box span.reserv_title {width:70%;}
.reserv_list_wrap .title_box span.reserv_title04 {width:22%;}
.reserv_list_wrap .title_box span.reserv_title02 {width:22%;}
.reserv_list_wrap .title_box span.reserv_title03 {width:26%;}
.reserv_list_wrap .title_box span .material-icons {line-height: 25px; display: inline; vertical-align: middle;}
.reserv_list_wrap .reserv_list {width:100%; height: calc(100% - 46px);overflow: hidden; overflow-y: auto;}
.reserv_list_wrap .reserv_list li {width:100%; height:26px;}
.reserv_list_wrap .reserv_list li:hover {background:#f2f2f25e;}
.reserv_list_text {position: relative; width:100%; height: 100%;}
.reserv_list_text span {display:inline-block; float: left; font-size: 12px; color:#63656a; line-height: 26px;}
.reserv_list_text span.time {position:relative; width:15%; text-align: center; color: #63656a; font-weight: 700;}
.reserv_list_text span.time:after {position: absolute; top:2px; right:0; width:1px; height: 22px; background: rgba(256,256,256,0.1); content: '';}
.reserv_list_text span.name {position:relative; width:15%; text-align: center; color: #63656a; font-weight: 700;}
.reserv_list_text span.name:after {position: absolute; top:2px; right:0; width:1px; height: 22px; background: rgba(256,256,256,0.1); content: '';}
.reserv_list_text span.reserv_text {color: #63656a; padding-left: 10px; max-width: calc(70% - 50px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reserv_list_text span.reserv_title{width:70%; text-align: left; padding-left: 10px;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.reserv_list_text span.reserv_title04{width:22%; text-align: center;}
.reserv_list_text span.reserv_title02 {width:22%; text-align: center;}
.reserv_list_text span.reserv_title03 {width:26%; text-align: center;}
.reserv_list_text .btn_more {position: absolute; top:5px; right:10px; width:17px; height: 17px; background: #5ad8f6 url(../images/new/icon06.png) no-repeat center center; border-radius:100%;}
.reserv_list_text .btn_more:hover {opacity: 0.7;}


.notice_wrap .tab_basic {height:30px; display: inline-block; margin: 0;}
.notice_wrap .tab_basic:before { position: absolute; top:0; left:0; width:30px; height: 30px; background: url(../images/new/h2_bg02.png) no-repeat center center; content: '';}
.notice_wrap .tab_basic > .tab_lst {position:relative; padding-left:40px; height: 30px;  /* padding-right:10px; */ text-align: left;}


.notice_wrap .tab_basic > .tab_lst li {float: none; min-width:auto; width:auto; margin:0 0 0 15px;height:27px; border-radius: 0;}
.notice_wrap .tab_basic > .tab_lst li:first-child {margin-left: 0;}
.notice_wrap .tab_basic > .tab_lst li a {padding:0; line-height: 27px; height:27px; font-size: 13px; color: #bcbcbc; border:0; background: none; text-align: left;}
.notice_wrap .tab_basic > .tab_lst li.active a {color: #101010; font-weight:700;}
.notice_wrap .tab_basic > .tab_lst li.active a:after {display: none;}
.notice_wrap .tab_container {margin:-1px 0 0 0;}


.notice_wrap {width: 50%; height:223px; padding:0; background: #fff !important; float: right; border: 1px solid #b9b9b9;}
.notice_wrap h2 {position:relative; width:100%; height: 30px; padding-left:30px; color:#000; font-size: 13px; font-weight: 800; line-height: 30px; background:#fff; border-bottom:1px solid #b9b9b9;}
.notice_wrap h2:before {position: absolute; top:0; left:0; width:30px; height: 30px; background: url(../images/new/h2_bg02.png) no-repeat center center; content: '';}

.notice_tab_wrap {width: 100%; height:222px; padding:0; background: #fff !important; float: right; border: 1px solid #b9b9b9;}
.notice_tab_wrap h2 {position:relative; width:100%; height: 30px; padding-left:30px; color:#000; font-size: 13px; font-weight: 800; line-height: 30px; background:#fff; border-bottom:1px solid #b9b9b9;}
.notice_tab_wrap h2:before {position: absolute; top:0; left:0; width:30px; height: 30px; background: url(../images/new/h2_bg02.png) no-repeat center center; content: '';}


.notice_list {width:100%; height:100%; padding: 10px 15px;}
.notice_list li {position:relative; width:100%; height:28px;}
.notice_list li:first-child {border-top:0;}
.notice_list li a {display: block; width:100%; height: 100%;}
.notice_list li:hover {background:#f2f2f25e;}
.notice_list li a .title {position:relative; max-width: calc(100% - 20px); display:inline-block; padding-right: 20px; font-size: 13px; color:#63656a; line-height: 27px;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notice_list li a.new span.title:after {position:absolute; top:7px; right:0; display:block; font-size:10px;  width:15px; height:15px; line-height:15px; color:#fff; font-weight:700; text-align:center; background:#fd0221; content: 'N'; border-radius:100%;}
.notice_wrap .btn_more {position: absolute; display:block; top:33px; right:10px; width:16px; height:16px; }
.notice_wrap .btn_more .material-icons {font-size: 16px; color: #565555;}
.manual_list { height: 190px !important; overflow: hidden; overflow-y: auto; padding-top: 0 !important; border-bottom:0 !important;}
.statu_wrap .manual_list li a .title {max-width:100% !important; padding-right: 5px;}

.main_content .content_right {width:32%; float: right; padding-top: 6px;}
.main_content.active .content_right {display: none;}
.day_info {padding: 0; border:0;}
.day_info .date_box_wrap {width:100%; height: 27px;}
.calendar_wrap .list_header {width: 180px; margin-top:0; position:absolute; top:0; left:0; z-index: 999;}
.calendar_wrap .list_header .date_box_wrap  {margin-top: 0;}
.calendar_wrap .list_header .select_box_wrap .select_box .sel-box .select-list {top:-1px !important;}

.date_box {z-index:9999; position:relative; height: 24px; padding-top: 3px;}
.date_box button .material-icons {display:none; width:20px; height: 20px; line-height: 20px; text-align: center; color: #ccc; font-size: 18px; }

@-moz-document url-prefix(){ .date_box button .material-icons {line-height: 23px;} }
.datepicker_wrap {display: inline-block;  width:20px; height: 20px; overflow: hidden; vertical-align: bottom;}
.datepicker_wrap label{cursor: pointer; }
.datepicker_wrap .material-icons {font-size: 0; display: inline-block; width:20px; height: 20px; background: url(../images/new/icon_datepicker.png) no-repeat center center; overflow: hidden;}
@-moz-document url-prefix(){ .datepicker_wrap .material-icons {line-height: 23px;} }
.date_box .hidden_inp {position: absolute; bottom:0; left:0; bottom:0; width:230px; height: 0; opacity: 0;}
.btnprev {position:relative; display: inline-block;  width:20px; height: 20px; overflow: hidden; vertical-align: bottom; background: #fff; border:1px solid #b9b9b9;}
.btnprev:before {position:absolute; right:7px; top:4px; width: 0; height: 0; border: 5px solid #b9b9b9; border-bottom-color: transparent; border-top-color: transparent; border-left-color: transparent; content: '';}
.btnprev:hover {opacity: 0.6;}
.btnnext {position:relative; display: inline-block;  width:20px; height: 20px; overflow: hidden; vertical-align: bottom; background: #fff; border:1px solid #b9b9b9;}
.btnnext:before {position:absolute; left:7px; top:4px; width: 0; height: 0; border: 5px solid #b9b9b9; border-bottom-color: transparent; border-top-color: transparent; border-right-color: transparent; content: '';}
.btnnext:hover {opacity: 0.6;}
.currentday{padding: 0 10px; line-height: 20px; font-size:14px; font-weight:700; color: #000;}

.statu_wrap {width:100%;}
.statu_wrap + .statu_wrap {padding-top:6px;}
.statu_wrap:after{content:'';clear:both;display:block}
.statu_box {position:relative; width:100%; min-height: 100px; background: #f3f3f3;}
.statu_box:after{content:'';clear:both;display:block}
.statu_box h2 {position:relative; width:100%; height: 30px; padding-left:30px; color:#000; font-size: 13px; font-weight: 800; line-height: 30px; background:#fff; border-bottom:1px solid #b9b9b9;}
.work_box h2:before {position: absolute; top:0; left:0; width:30px; height: 30px; background: url(../images/new/h2_bg03.png) no-repeat center center; content: '';}

.statu_box .btn_more {position: absolute; display:block; top:7px; right:5px; width:16px; height:16px; }
.statu_box .btn_more .material-icons {font-size: 16px; color: #d8d8d8;}
.work_box {width:50%; float: left; border: 1px solid #b9b9b9; height: 258px; background: #fff;}
.work_list {width:100%; height: calc(100% - 30px); padding:10px 5px 5px 5px;background: #fff; overflow: hidden; overflow-y: auto;}
.work_list li {display:table; width:100%; height:29px; margin-bottom:13px; padding-left:15px; border-top:1px solid rgba(256,256,256,0.1);}
.work_list li:last-child {margin-bottom: 0;}
.work_list li .profile_thum {display: table-cell; width:35px;}
.work_list li .profile_thum > span {display:inline-block; width:29px; height: 29px; overflow: hidden; border-radius: 100%; border:1px solid #72d6fe;}
.work_list li .profile_thum > span > img {width:100%; height: 100%;}
.work_list li .info_text {display: table-cell; width: calc(100% - 35px);vertical-align: middle;}
.work_list li .info_text span {display: inline-block; padding: 0 2px; font-size:13px; color:#63656a; }
.work_statu {width:100%; height: 225px; padding-top:10px; background: -moz-linear-gradient(top, #dfdbfd 0%, #e1dcfd 40%, #ffecfd 100%);
            background: -webkit-linear-gradient(top, #dfdbfd 0%,#e1dcfd 40%,#ffecfd 100%);
            background: linear-gradient(to bottom, #dfdbfd 0%,#e1dcfd 40%,#ffecfd 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dfdbfd', endColorstr='#ffecfd',GradientType=0 );}
.chart_box {position:relative; width:99%; height: 100%; margin: 0 auto;}
.chart_box .total_num {position:absolute; top:90px; left:0; width:100%; font-size: 18px; color: #000000; font-weight: 700; text-align: center;}
.work_statu_list {width:164px; margin: 20px auto 0 auto;}
.work_statu_list li {position:relative; width:50%; float: left; padding-bottom: 7px; padding-left: 15px;}
.work_statu_list li span {display:inline-block; color: #101010; font-size: 13px;}
.work_statu_list li span.title {width:30px;}
.work_statu_list li:before {position: absolute;  top:3px; left:0; width:9px; height: 9px; background:#78e4e1; content: ''; border-radius: 100%;}
.work_statu_list li:nth-child(2):before {background:#cc1485;}
.work_statu_list li:nth-child(3):before {background:#6eba44;}
.work_statu_list li:nth-child(4):before {background:#ffd900;}

.total_wap {float: left; position:relative; z-index:0; display: table; width:75px; height: 100%; min-height: 75px;}
.total_wap .total {display: table-cell; width:100%; height: 100%;}
.total_wap .total .material-icons {z-index:1; position:absolute; top:7px; left:50%; margin-left:-30px; width:60px; height: 60px; color:#f3f3f3; font-size: 50px; background: #fff; border-radius: 50%; text-align: center; line-height: 60px;}
.total_wap .total .total_text {z-index:1; position:absolute; top:9px; left:50%; padding-top:13px; margin-left:-30px; width:60px; height: 60px; color:#999; font-size: 11px; font-weight:700;border-radius: 50%; text-align: center; line-height: 1;}
.total_wap .total .total_text em {color:#333; font-size: 16px;}

.resev_box {width:50%; height:259px; float: right; border: 1px solid #b9b9b9; border-left:0;}
.resev_box h2:before {position: absolute; top:0; left:0; width:30px; height: 30px; background: url(../images/new/h2_bg06.png) no-repeat center center; content: '';}


.statu_wrap .content_box {border-radius: 0; box-shadow:none;  width:50%;  height: 258px;}
.statu_wrap .content_box_1  {border-radius: 0; box-shadow:none;  width:100%;  height: 223px;}
.statu_wrap .content_box h2:before { background: url(../images/new/h2_bg04.png) no-repeat center center;}
.statu_wrap .notice_wrap {border-left:1;}
.statu_wrap .infobox_wrap .tab_basic > .tab_lst{text-align: left;}
.statu_wrap .infobox_wrap .tab_basic > .tab_lst li {min-width: auto;float: left; margin-right: 1px; background: #fff; border-bottom:none;}
.statu_wrap .infobox_wrap .btn_more {position: absolute; display:block; top:5px; right:5px; width:16px; height:16px; }
.statu_wrap .infobox_wrap .btn_more .material-icons {font-size: 16px; color: #565555;}

.statu_wrap + .statu_wrap .content_box {height: 259px;}
.day_checkbox + .content_right .statu_wrap + .statu_wrap .content_box {height: 221px;}
.day_checkbox + .content_right .statu_wrap + .statu_wrap .resev_box {height: 221px;}
.day_checkbox + .content_right .statu_wrap + .statu_wrap .tb_wrap + .tb_wrap {height: 103px;}
.statu_wrap .tb_wrap {margin:0; background: #fff;}
.statu_wrap .tb_wrap table {width:100%;}
.statu_wrap .tb_wrap table thead th {height:19px;border:0; background:#f2f2f2; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; color:#63656a; font-size:10px; font-weight: 700; line-height:19px; text-align: center; vertical-align: middle;}
.statu_wrap .tb_wrap table tbody td {height:25px; padding:0 0 0 15px; border:0; font-size:13px; text-align: left; letter-spacing: -1px; background: #eff8fc;}
.statu_wrap .tb_wrap table tbody td:last-child {padding:0 10px 0 0; text-align: right;}
.statu_wrap .tb_wrap + .tb_wrap {height:140px; border-bottom:1px solid #dad9d7; margin-bottom:10px; overflow: hidden; overflow-y: auto;}
.total_expe {display: block; width: 100%; padding: 0 10px 15px 15px;}
.total_expe span {display: block;font-size: 13px; color: #39beff; font-weight: 700;}
.total_expe span em {display: block; float: right; width: calc(100% - 30px); text-align: right;}
.statu_wrap .btn_reg {display:block; margin:0 auto; width:156px; height:22px; border:1px solid #39beff; color:#0060fa; font-size:13px; font-weight:700; line-height:20px; background: #b9e3fe; text-align: center; border-radius:2px;}
.statu_wrap .btn_reg:hover {opacity: 0.7;}
.statu_wrap .notice_list {height: auto; padding: 10px 8px 0 8px; margin-bottom:9px; border-bottom:1px solid #dad9d7;}
.statu_wrap .notice_list li:last-child {border-bottom:1px solid rgba(256,256,256,0.1);}
.statu_wrap .notice_list li a .title {max-width: calc(100% - 70px);}
.statu_wrap .notice_list li a .date {display:inline-block; float: right; width:60px; font-size: 10px; color:#63656a; line-height: 27px; text-align: center;}

.system_box_wrap {position:relative; width:100%; height:120px; padding:0; background: #fff;}
.system_box_wrap h2  {width:100%; height: 25px; padding-left:10px; color:#fff; font-size: 13px; font-weight: 700; line-height: 25px; background:#62759d; }
.system_box_wrap h2 .btn_setup {display: inline-block; width:20px; height: 24px; overflow: hidden; vertical-align: middle;}
.system_box_wrap h2 .btn_setup .material-icons {width:20px; height: 24px; font-size: 12px; color: #fff; line-height: 24px; text-align: center;}
.system_box_wrap .system_box {}
.arrow_box {position: absolute; top:5px; right:25px;}
.arrow_box.mdpark {right:5px;}
.arrow_box .btnprev {display: inline-block;  width:16px; height: 16px; overflow: hidden; border-radius: 3px; vertical-align: bottom; background: #fff;}
.arrow_box .btnnext {display: inline-block;  width:16px; height: 16px; overflow: hidden; border-radius: 3px; vertical-align: bottom; background: #fff;}
.arrow_box .btnprev:before {right:5px; top:2px;}
.arrow_box .btnnext:before {left:5px; top:2px;}

@-moz-document url-prefix(){ .arrow_box .material-icons {line-height: 19px;} }

.system_list {width:100%; padding:12px 30px 0 30px;}
.system_list li {display:inline-block; float: left; width:20%; height:85px; padding: 0 2px;}
.system_list li a {display: inline-block; width:100%; text-align: center;}
.system_list li a span {display: inline-block; width:50px; height:50px; border-radius: 8px; overflow: hidden; -webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
            box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);}
.system_list li a span img {width:100%; height: 53px;}
.system_list li a p {padding-top:5px; font-size: 12px; font-weight: 700;}

.banner_wrap {width:100%; height:146px; padding:0; background: #fff; float: left;  border: 1px solid #b9b9b9; text-align: center; line-height: 144px;}
.banner_wrap img {width:100%; height: 144px;}
/*
.banner_wrap  div {width:50%; height: 100%;  border-left: 1px solid #b9b9b9; float: left;}
.banner_wrap  div:first-child { border-left:none;}
.banner_wrap + .banner_wrap {border-left:0;}
*/


.messenger_wrap {position:relative; width:100%; height:70px; margin:6px 0; background: #fff; border: 1px solid #b9b9b9;}
.messenger_wrap h2 {position:relative; width:100%; height: 30px; padding-left:30px; color:#000; font-size: 13px; font-weight: 800; line-height: 30px; background:#fff; border-bottom:1px solid #b9b9b9;}
.messenger_wrap h2:before {position: absolute; top:0; left:0; width:30px; height: 30px; background: url(../images/new/h2_bg08.png) no-repeat center center; content: '';}

.talk_info_wrap {height: 38px; background: #3b4b56;}
.talk_info_wrap .talk_info {position:relative; width:100%; height: 22px; padding: 0 10px 0 33px; width:100%; overflow: hidden;}
.talk_info_wrap .talk_info:before {position: absolute; top: 2px; left: 9px; width:16px; height: 16px; background: url(../images/new/icon07.png) no-repeat 0 0; content: '';}
.talk_count {position: absolute; display:inline-block; top:0; right:0; padding:5px; min-width:22px; height:22px; font-size: 11px; color: #fff; background: #fd6a5a; border-radius: 11px; text-align: center; box-shadow: -2px -2px 0px 0px rgba(0,0,0,0.3);}
.talk_info_wrap .talk_info .talk_count {position: static; padding: 5px; width:89px; margin-left: 4px; background: #ff6a6d; box-shadow: none;}
.talk_info_wrap .talk_info .talk_count:hover {opacity: 1;}
.talk_info_wrap .talk_info .talk_count span {font-size: 11px; color: #fff;}
.talk_info_wrap .talk_info .ellipsis {display:none; position: absolute; top: 9px; right:20px; width:20px; height:10px; overflow: hidden;background: url(../images/new/icon08.png) no-repeat 0 0; }
.talk_info_wrap .talk_info .ellipsis.on {display: block;}


.day_checkbox {height:30px; margin-top:7px; float: right;}
.day_checkbox:after{content:'';clear:both;display:block}
.day_checkbox .dropdown, .day_checkbox .btn_basic  {float: left;}
.day_checkbox input[type=password] {width:180px; margin:0 8px; float: left;}

.day_checkbox + .content_right {margin-top: 5px; border-top:1px solid #dad9d7; padding-top: 1px;}
/*table*/
.table_wrap {width:100%; border-top:1px solid #dcdcdc;}
.table_wrap table {width:100%;}
.table_wrap table thead th {height:30px; padding:5px; border:1px solid #dcdcdc; border-top:0; background:#f5f5f6; color:#333; font-size:13px; font-weight: 700; line-height:15px; text-align: center; vertical-align: middle;}
.table_wrap table tbody th {height:30px; padding:5px 10px; border:1px solid #dcdcdc; border-top:0; color:#333; font-size:13px; font-weight: 700; text-align: center; vertical-align: middle;letter-spacing: -1px;}
.table_wrap table tbody th.th_type02 {background:#e9e9e9;}
.table_wrap table tbody td {height:30px;padding:5px; border:1px solid #dcdcdc; border-top:0; text-align: center; letter-spacing: -1px;}
.table_wrap table tbody td.title {text-align: left;}
.table_wrap table tbody td.title a {display: inline-block; vertical-align: middle;}
.table_wrap table tbody td.title a:hover {color: #4a63a1;}
.table_wrap table tbody td.title a.lock:after {margin-left:5px;display: inline-block; width:12px; height:18px; vertical-align: middle; background:  url(../images/bg_lock.png) no-repeat 0 0; content:'';}
.table_wrap table tbody td textarea {width:100%; height: 100px; padding: 5px; border:1px solid #dcdcdc; line-height: 18px;}
.table_wrap table tbody td textarea.fix_textarea {width:730px; height: 100px;}
.table_wrap + .table_wrap {margin-top: 10px;}
.read_tb table tbody th {background: #f3f3f3;}
.read_tb table tbody td {text-align: left;}
.read_tb table tbody td .inner_content {width:100%; height: 120px; padding:10px 10px 10px 0; overflow: auto;}
/*
.read_tb table tbody td .question_view {height: 143px;}
.read_tb table tbody td .inner_editor {width:100%; height: 170px; padding:0; border: 1px solid #dcdcdc;}
*/
.read_tb table tbody td input[type=radio] + label{position: relative; padding-right: 7px;}
.read_tb table tbody td .datepicker_box {display: inline-block; vertical-align: middle; margin-bottom:0;}
.read_tb table tbody td > input[type=text] + .btn_gray {margin-top:-1px;}
.inner_content_text {line-height:20px;}

.tb_statu table thead th {background:#e9e9e9;}
.tb_statu table tbody th {height:30px; color:#333; background:#f3f3f3; font-size:13px;}
.tb_statu table tbody td {height:30px; text-align: center;}
.tb_statu table tbody td.total {background:#dcdcdc; color: #000; font-size:13px; font-weight: 700;}
.tb_statu + h2 {margin-top: 10px;}
.tb_statu + h3 {margin-top: 10px;}
.tb_statu + .tb_statu {margin-top: 10px;}

.tb_reg table thead th {background:#e9e9e9;}
.tb_reg table thead th:first-child {border-left: 0;}
.tb_reg table thead th:last-child {border-right: 0;}
.tb_reg table tbody th {height:30px; color:#101010; background:#f3f3f3; font-size:13px; border-left:0; border-right:0;}
.tb_reg table tbody td {height:30px; text-align: left; border-left:0; border-right:0;}
/*.tb_reg table tbody th + td {border-left:1px solid #dcdcdc;}*/
.tb_reg table tbody td + td {border-left:1px solid #dcdcdc;}
.tb_reg table tbody td > input[type=text] {width:100%; float: left;}
.tb_reg table tbody td > input[type=text] + .btn_gray {float: left; margin-left: 3px;}
.tb_reg table tbody td > input[type=text] + .in_btn_search {float: left; margin-left: 3px; margin-top: 3px;}
.tb_reg table tbody td > input[type=text] + .btn_gray + input[type=text] {margin-left: 3px;}
.tb_reg table tbody td > input[type=text] + .in_btn_search + input[type=text] {margin-left: 3px;}
.tb_reg table tbody td > input[type=text] + input + label {float: left; margin-top: 7px; margin-left: 3px;}
.tb_reg table tbody td > input[type=text] + input[type=text] {margin-left: 3px}
.tb_reg table tbody td > input[type=text] + span {float:left;}
.tb_reg table tbody td > input[type=text] + span   + input + label {float: left; margin-top: 7px; margin-left: 3px;}
.tb_reg table tbody td > span {line-height: 30px;}
.tb_reg table tbody td .dropdown {width:120px}
.tb_reg table tbody td .datepicker_box {margin-bottom: 0;}
.tb_reg table tbody td .datepicker_box input[type=text] {width:110px;}
.tb_reg.with_btnreg {position: relative;}
.tb_reg.with_btnreg table tbody tr:last-child td:last-child {padding-right: 72px;}
.tb_reg.with_btnreg .btn_area {position:absolute; right:0; bottom:6px; margin: 0;}

.tb_search {position:relative; border: 1px solid #f3f3f3; background: #f3f3f387; border-radius: 5px; padding: 5px;}
.tb_search table tbody tr th {border:0;}
.tb_search table tbody tr td {border:0; text-align: left;}
.tb_search table tbody tr td .btn_gray {position: absolute; bottom:10px; right:10px;}
.tb_search table tbody tr + tr th { border-top: 1px solid #e2e2e2;}
.tb_search table tbody tr + tr td { border-top: 1px solid #e2e2e2;}
.tb_search +.read_tb {border-top: 1px solid #dcdcdc;}

.td_left {text-align: left !important;}
.td_right {text-align: right !important;}
.td_left {text-align: left !important;}
.td_center {text-align: center !important;}

.time_wrap {text-align: center;}
.time_wrap .dropdown {width:75px !important;}
.time_wrap .dropdown .sel-box .select-list {max-height: 170px !important;}
.time_wrap input[type=text] {text-align:center;}
.time_wrap02 {text-align: left;}
.time_wrap02 .datepicker_box {margin-bottom: 0;}
.time_wrap02 > div {margin-right: 3px;}
.time_wrap02 .dropdown {width:70px !important;}
.time_wrap02 .dropdown .sel-box .select-list {max-height: 140px !important;}

.fileup_wrap {position:relative; display: inline-block; width:80px; height: 28px; vertical-align: middle; cursor: pointer; overflow: hidden;}
.fileup_wrap .btn_inform {z-index: 0; top:0; left:0;margin-left: 0;display:inline-block; margin-left:2px; width:80px; height: 28px; border:1px solid #6a6a6a; background:#898989; color:#fff; line-height:26px; text-align: center; vertical-align: middle;}
.fileup_wrap:hover .btn_inform {opacity: 0.8;}
.fileup_wrap .file_up {z-index: 1; position: absolute; top:0; left:-100px; width:200px; height: 28px;  opacity: 0;filter:alpha(opacity=0); cursor: pointer;}
.read_tb table tbody td input[type=text].file_up1 {border: 0; width: calc(100% - 85px); box-shadow: none;}
.btn_fileup_open {position:relative; display: inline-block; margin-left:3px; width:20px; height: 20px; background:#c1ccd2; border-radius:3px; vertical-align: middle;}
.btn_fileup_open  span {display: block;width:0; height: 0; font-size: 0; text-indent: -9999%; overflow: hidden;}
.btn_fileup_open:after {content:'';position:absolute;top:8px;left:5px;width: 0; height: 0; border-left:5px solid transparent; border-top:5px solid #fff; border-right:5px solid transparent; transition: all .2s;}
.btn_fileup_open.active:after {transform: rotate(-180deg); top:7px;}
.uploader_area {width:100%; height:0; border:0; transition: all .2s; overflow: hidden;}
.uploader_area.active {height:108px; border: 1px solid #dcdcdc; margin-top: 5px;}

#fileZone {width:100%;}
#fileZoneBtnArea {height: 20px; text-align: right;padding:0 5px 0 0; margin-bottom:0 !important;}
#fileZoneBtnArea  a {display:inline-block; margin-left:5px; line-height:20px; font-size: 11px; color: #333; font-weight: 700;}
#fileZoneBtnArea  a:hover {color: #4a63a1;}
#fileZoneContentTitle { width:100%; padding-top:5px; display: inline-block; text-align: center;}
.fileZoneHeader {width:100%;}
.fileZoneHeader ul {width:100%;}
.fileZoneHeader ul li {float: left;  height: 20px; background:#c1ccd2; color: #fff; font-size: 11px; line-height:20px; text-align: center; box-sizing: border-box;}
.fileZoneHeader ul li.file_select {width:30px}
.fileZoneHeader ul li.file_select label{width:0; height: 0; vertical-align:top; margin-top:1px;}
.fileZoneHeader ul li.file_select label:before {vertical-align: top; margin-top:2px;}
.fileZoneHeader ul li.file_name {width: calc(100% - 180px);}
.fileZoneHeader ul li.file_size {width:70px}
.fileZoneHeader ul li.file_delete {width:80px}
.fileZoneContent {width:100%; height: 64px; overflow: hidden; overflow-y: auto;}
.fileZoneContent ul {width:100%; border-bottom:1px solid #f3f3f3;}
.fileZoneContent ul:hover {background: #f3f3f3;}
.fileZoneContent ul li {float: left;  height: 20px; border-left:1px solid #f3f3f3; color: #333; font-size: 11px; line-height:20px; text-align: center; box-sizing: border-box;}
.fileZoneContent ul li.file_select {width:30px}
.fileZoneContent ul li.file_select label{width:0; height: 0;}
.fileZoneContent ul li.file_select label:before {vertical-align: top; margin-top:2px;}
.fileZoneContent ul li.file_name {width: calc(100% - 180px); text-align: left; padding-left: 5px;}
.fileZoneContent ul li.file_size {width:70px}
.fileZoneContent ul li.file_delete {width:80px;}
.fileZoneContent ul li.file_delete a {line-height:20px;}

#fileView {width:100%;}
#fileViewContentTitle { width:100%; padding-top:5px; display: inline-block; text-align: center;}
.fileViewHeader {width:100%;}
.fileViewHeader ul {width:100%;}
.fileViewHeader ul li {float: left;  height: 20px; background:#c1ccd2; color: #fff; font-size: 11px; line-height:20px; text-align: center; box-sizing: border-box;}
.fileViewHeader ul li.file_no {width:30px}
.fileViewHeader ul li.file_name {width: calc(100% - 180px);}
.fileViewHeader ul li.file_size {width:70px}
.fileViewHeader ul li.file_down {width:80px}
.fileViewContent {width:100%; height: 64px; overflow: hidden; overflow-y: auto;}
.fileViewContent ul {width:100%; border-bottom:1px solid #f3f3f3;background: #fff}
.fileViewContent ul:hover {background: #f3f3f3;}
.fileViewContent ul li {float: left;  height: 20px; border-left:1px solid #f3f3f3; color: #333; font-size: 11px; line-height:20px; text-align: center; box-sizing: border-box;}
.fileViewContent ul li.file_no {width:30px}
.fileViewContent ul li.file_name {width: calc(100% - 180px); text-align: left; padding-left: 5px;}
.fileViewContent ul li.file_size {width:70px}
.fileViewContent ul li.file_down {width:80px}
.fileViewContent ul li.file_down a {line-height:20px;}



/***********************************
*  MODAL POP
************************************/
.modal_pop{height: auto;}
.md_body{}
.modalWrap {display: none;position: absolute;top: 0;right: 0;width:100%; height:100%;z-index:12;}
.modal_pop {position: fixed;overflow: hidden;top: 0;bottom: 0;left: 0;right: 0;margin: auto; background: #fff;box-shadow: 0 0 4px rgba(0,0,0,0.2);z-index: 11;}
.md_body > .md_clo {display:block;position: absolute;top: 5px;right:5px;width: 17px;height: 17px; overflow: hidden;}
.md_body > .md_clo .material-icons {color: #fff; font-size: 17px;}
.md_footer {}
.modal_pop .table_wrap .excp-sel-box .select-list{height:140px !important;}
.md_bg{position: fixed;width: 100%;height: 100%;background-color: #000;opacity: 0.7;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";filter:alpha(opacity=80);-moz-opacity: 0.8;-khtml-opacity: 0.8;}
.modal_pop h2 {padding-left:10px; width:100%; height:30px; font-size:15px; color:#fff; background: #c1ccd2; line-height: 30px;}
.md_content {padding: 10px;}
.md_content .list_header {margin-bottom: 5px;}

#support_ecEmctt_popup .modal_pop{width: 400px; height: 400px;}
#support_ecEmctt_popup .md_content{height: 370px; line-height:  200%;overflow:hidden;overflow-y:auto;}

#notice_popup .modal_pop{width: 800px; height: 655px;}
#notice_popup .md_body {width: 800px; height: 655px;}
#support_popup .modal_pop{width: 800px; height: 655px;}
#support_popup .md_body {width: 800px; height: 655px;}
#insurance_popup .modal_pop{width: 800px; height: 655px;}
#insurance_popup .md_body {width: 800px; height: 655px;}
#workmanual_popup .modal_pop{width: 800px; height: 470px;}
#workmanual_popup .md_body {width: 800px; height: 470px;}
#exp_popup .modal_pop{width: 400px; height: 200px;}
#exp_popup .md_body {width: 400px; height: 200px;}
#ecc_popup .modal_pop{width: 400px; height: 190px;}
#ecc_popup .md_body {width: 400px; height: 190px;}
#exp_popup td input {width:100%; text-align: center;}
#ecc_popup td input {width:100%; text-align: center;}
#expEcc_popup .modal_pop{width: 800px; height: 480px;}
#expEcc_popup .md_body {width: 800px; height: 480px;}
#fax_popup .modal_pop{width: 75%; height: 80%;}
#fax_popup .md_body {width: 100%; height: 100%;}
#mysys_popup .modal_pop {width: 300px; height: 160px;}
#mysys_popup .md_body {width: 300px; height: 160px;}
#support_question_popup .modal_pop{width: 800px; height: 610px;}
#support_question_popup .md_body {width: 800px; height: 610px;}
#schedule_popup  .modal_pop {width:1100px; height:338px; paddi  ng-top: 20px;}
#schedule_popup  .md_body {width:1100px; height:338px;}
#schedule_popup  .md_body > .md_clo .material-icons {color: #666;}
#salary_dtails_popup .modal_pop {width: 700px; height: 420px;}
#salary_dtails_popup .md_body {width: 700px; height: 420px;}
#salary_dtails_popup .md_body .grid_area {min-height: 290px;}
#contract_popup .modal_pop {width: 950px; height: 890px;}
#contract_popup .md_body {width: 950px; height: 890px;}
#contract_popup .md_body .md_content {height: 840px; overflow: hidden; overflow-y: auto;}
#payslip_popup .modal_pop {width: 950px; height: 860px;}
#payslip_popup .md_body {width: 950px; height: 860px;}
#schedule_reg_popup .modal_pop{width: 700px; height: 375px;}
#schedule_reg_popup .md_body{width: 700px; height: 375px;}
#login_popup .modal_pop{width: 380px; height: 220px;}
#login_popup .md_body{width: 380px; height:220px;}
#login_popup .login_box .btn_area {margin-top: 10px; text-align: center;}

#alert_popup .modal_pop{width: 450px; height:300px; background:#c1ccd2;}
#alert_popup .md_body{width: 450px; height:300px;}
#alert_popup .md_body .btn_area {margin-top: 10px; text-align: center;}
#alert_popup .md_body .md_clo {width:20px; height: 20px; background:#c1ccd2; text-align: center;}
#alert_popup .md_body .md_clo .material-icons {font-size:17px; line-height: 20px;}
.alertbox_wrap {width:100%; height: 230px; padding: 30px 20px 0 20px; vertical-align: middle;}
.alertbox_wrap .alertbox {display:table;   width:100%; height:100%; background:#f3f3f3; border-radius:20px;}
.alertbox_wrap .alerttext {display: table-cell; text-align: center; vertical-align: middle; }
.alertbox_wrap .alerttext p {font-size: 15px; font-weight: 700; padding-top: 10px;}
.alertbox_wrap .alerttext p .material-icons {font-size: 50px; color:#f55959;}

#confirm_popup .modal_pop{width: 450px; height:300px; background:#c1ccd2;}
#confirm_popup .md_body{width: 450px; height:300px;}
#confirm_popup .md_body .btn_area {margin-top: 10px; text-align: center;}
#confirm_popup .md_body .md_clo {width:20px; height: 20px; background:#c1ccd2; text-align: center;}
#confirm_popup .md_body .md_clo .material-icons {font-size:17px; line-height: 20px;}
.confirmbox_wrap {width:100%; height: 230px; padding: 30px 20px 0 20px; vertical-align: middle;}
.confirmbox_wrap .confirmbox {display:table;   width:100%; height:100%; background:#f3f3f3; border-radius:20px;}
.confirmbox_wrap .confirmtext {display: table-cell; text-align: center; vertical-align: middle; }
.confirmbox_wrap .confirmtext p {font-size: 15px; font-weight: 700; padding-top: 10px;}
.confirmbox_wrap .confirmtext p .material-icons {font-size: 50px; color:#f55959;}

#zipcode_popup .modal_pop{width: 900px; height: 470px;}
#zipcode_popup .md_body {width: 900px; height: 470px;}
.zipcode_search_box {width:100%; padding: 0 0 10px 0;}
.zipcode_search_box label {display:inline-block; width:70px; font-weight: 700; text-align: center;}
.zipcode_search_box button {width:70px; height: 28px;  border:1px solid #6a6a6a; background:#898989; color:#fff; line-height:26px; text-align: center;}
.zipcode_search_box input[type=text] {width: calc(100% - 136px);}

#find_popup .modal_pop{width: 600px; height: 510px;}
#find_popup .md_body{width: 600px; height:510px;}
#code_popup .modal_pop{width: 600px; height: 510px;}
#code_popup .md_body{width: 600px; height:510px;}

#organization_popup .modal_pop{width: 300px; height: 420px;}
#organization_popup .md_body{width: 300px; height: 420px;}
#organization_popup .authority_box {padding: 10px; height: 320px;}
#organization_popup .authority_list ul {margin-left: 50px;}
#organization_popup .authority_list li ul:before {width:50px; left:-43px;}
#organization_popup .authority_list li .a_link {line-height:16px; font-weight: 700;}
#organization_popup .authority_list li .a_link .material-icons {font-size: 12px; line-height: 16px; vertical-align: middle;}
#organization_popup .authority_list li .a_link:hover {color: #0C90FF;}

#employment_contract_popup .modal_pop{width: 700px; height: 280px;}
#employment_contract_popup .md_body {width: 700px; height: 280px;}
.employment_contract_popup .info_text {font-size: 17px; font-weight: 700; padding-bottom: 10px;}

#password_popup .modal_pop{width: 380px; height: 180px;}
#password_popup .md_body{width: 380px; height: 180px;}


.member_detail_popup .modal_pop{width: 750px; height: 465px;}
.member_detail_popup .md_body{width: 750px; height: 465px;}
.member_modify_popup .modal_pop{width: 850px; height: 635px;}
.member_modify_popup .md_body{width: 850px; height: 635px;}
.support_write_popup .modal_pop{width: 750px; height: 650px;}
.support_write_popup .md_body{width: 750px; height: 650px;}
.support_detail_popup .modal_pop{width: 750px; height: 650px;}
.support_detail_popup .md_body{width: 750px; height: 650px;}
.notice_detail_popup .modal_pop{width: 750px; height: 650px;}
.notice_detail_popup .md_body{width: 750px; height: 650px;}
.notice_write_popup .modal_pop{width: 750px; height: 570px;}
.notice_write_popup .md_body{width: 750px; height: 570px;}
.banner_detail_popup .modal_pop{width: 650px; height: 470px;}
.banner_detail_popup .md_body{width: 650px; height: 470px;}
.banner_reg_popup .modal_pop{width: 650px; height: 530px;}
.banner_reg_popup .md_body{width: 650px; height: 530px;}
.support_question_detail_popup .modal_pop{width: 750px; height: 650px;}
.support_question_detail_popup .md_body{width: 750px; height: 650px;}
.support_question_reg_popup .modal_pop{width: 750px; height: 760px;}
.support_question_reg_popup .md_body{width: 750px; height: 760px;}
#workinfo_popup .modal_pop{width: 800px; height: 480px;}
#workinfo_popup .md_body {width: 800px; height: 480px;}

.manual_reg_popup .modal_pop{width: 1000px; height: 550px;}
.manual_reg_popup .md_body{width: 1000px; height: 550px;}
.manual_reg_popup_content {width:100%;}
.manual_reg_popup_content:after {content:'';clear:both;display:block}
.manual_reg_popup_content_left {width:400px; float: left;}
.manual_reg_popup_content_right {width: calc(100% - 420px); float: right;}

.curriculum_popup .modal_pop{width: 650px; height: 510px;}
.curriculum_popup .md_body{width: 650px; height: 510px;}


.check_wrap {width:100%; padding: 10px 5px; border-bottom:1px solid #ccc;}
.check_wrap .inp_check {padding: 5px 5px 5px 0; display: inline-block; min-width:85px;}
.check_wrap .inp_check input {vertical-align: middle;}
.check_wrap .inp_check label {display:inline-block; vertical-align: middle;}

.datepicker_box {height: 30px;margin-bottom: 5px;}
.datepicker_box input {float: left; width:120px; padding-right: 27px; margin: 0 !important;}
.datepicker_box label {width:20px; height: 30px; display: inline-block; float: left; margin-left:-25px !important; background: url(../images/new/icon_datepicker.png) no-repeat center center;cursor: pointer; text-align: center;}

.datepicker_box label .material-icons {display: none;}
.date_term {height: 30px;}
.date_term .datepicker_box {display: inline-block; margin-bottom: 0; vertical-align: middle;}
.date_term .term_text { width:8px; height: 24px; display: inline-block;  line-height: 24px; text-align: center; vertical-align: middle;}

.pagination_wrap {width:100%; text-align: center;}
.pagination{display:inline-block;padding-left:0;margin:10px 0 10px 0;}
.pagination>li{display:inline-block;margin-left: -4px; position: relative;}
.pagination>li>a,.pagination>li>span{z-index:1; position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;color:#666666;text-decoration:none;background-color:#f4f4f4;border:1px solid #ddd}
.pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;}
.pagination>li:last-child>a,.pagination>li:last-child>span{}
.pagination>li>a:hover,.pagination>li>span:hover,.pagination>li>a:focus,.pagination>li>span:focus{color:#4a63a1;background-color:#fff;border-color:#ddd}
.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus{z-index:2;color:#222222;cursor:default;background-color:#fff;font-weight:800; border-color:#dcdcdc}
.pagination>.disabled>span,.pagination>.disabled>span:hover,.pagination>.disabled>span:focus,.pagination>.disabled>a,.pagination>.disabled>a:hover,.pagination>.disabled>a:focus{color:#777;cursor:not-allowed;background-color:#fff;border-color:#ddd}
.pagination > li.pre {margin-right: 40px;}
.pagination > li.next {margin-left: 40px;}
.pagination > li.pre a {padding-left:20px; background: #fff;}
.pagination > li.next a {padding-right:20px; background: #fff;}
.pagination > li.first a {padding-left:20px; background: #fff;}
.pagination > li.last a {padding-right:20px; background: #fff;}
.pagination > li.next:before {position:absolute; z-index:4; right:11px; top:11px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #999; content: '';}
.pagination > li.next:after {position:absolute; z-index:5; display: block; right:12px; top:11px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #fff; content: '';}
.pagination > li.next:hover:before {border-color: transparent transparent transparent #4a63a1;}
.pagination > li.pre:before {position:absolute; z-index:4; left:11px; top:11px; width: 0; height: 0; border-style: solid; border-width: 4.5px 5px 4.5px 0; border-color: transparent #999 transparent transparent ; content: '';}
.pagination > li.pre:after {position:absolute; z-index:5; display: block; left:12px; top:11px; width: 0; height: 0; border-style: solid; border-width: 4.5px 5px 4.5px 0; border-color: transparent #fff transparent transparent ; content: '';}
.pagination > li.pre:hover:before {border-color: transparent #4a63a1 transparent transparent;}
.pagination > li.last:before {position:absolute; z-index:4; right:11px; top:11px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #999; content: '';}
.pagination > li.last:after {position:absolute; z-index:5; display: block; right:12px; top:11px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #fff; content: '';}
.pagination > li.last:hover:before {border-color: transparent transparent transparent #4a63a1;}
.pagination > li.last > a:before {position:absolute; z-index:2; right:6px; top:10px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #999; content: '';}
.pagination > li.last > a:after {position:absolute; z-index:3; display: block; right:7px; top:10px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #fff; content: '';}
.pagination > li.last:hover > a:before {border-color: transparent transparent transparent #4a63a1;}

.pagination > li.first:before {position:absolute; z-index:4; left:11px; top:11px; width: 0; height: 0; border-style: solid; border-width: 4.5px 5px 4.5px 0; border-color: transparent #999 transparent transparent; content: '';}
.pagination > li.first:after {position:absolute; z-index:5; display: block; left:12px; top:11px; width: 0; height: 0; border-style: solid; border-width: 4.5px 5px 4.5px 0; border-color: transparent #fff transparent transparent; content: '';}
.pagination > li.first:hover:before {border-color: transparent #4a63a1 transparent transparent;}
.pagination > li.first > a:before {position:absolute; z-index:2; left:6px; top:10px; width: 0; height: 0; border-style: solid; border-width: 4.5px 5px 4.5px 0; border-color: transparent #999 transparent transparent; content: '';}
.pagination > li.first > a:after {position:absolute; z-index:3; display: block; left:7px; top:10px; width: 0; height: 0; border-style: solid; border-width: 4.5px 5px 4.5px 0; border-color: transparent #fff transparent transparent; content: '';}
.pagination > li.first:hover > a:before {border-color: transparent #4a63a1 transparent transparent;}

/*search*/
.search-wrap { width:100%;  padding-bottom:5px;}
.search-wrap:after {display:block;clear: both;content:'';}
.search-wrap .search-box {}
.search-wrap .search-box > div {margin-left:8px; float: left;}
.search-wrap .search-box > div:first-child {margin-left:0;}
.search-wrap .search-box > .input-box {width:200px;}
.search-wrap .search-box > label {display: inline-block; float: left; line-height: 22px;}
.search-wrap .search-box .checkbox_wrap {margin-right: 12px;}
.search-wrap .search-box .checkbox_wrap input[type=checkbox] + label {color: #000; font-weight: 700; font-size: 14px;}
.search-wrap .search-box .checkbox_wrap input[type=checkbox] + label:before{ display: inline-block; width: 17px; height: 17px; margin-top:-1px; margin-right:9px; vertical-align: middle;background:url('../images/bg_spr.png') no-repeat -50px -80px; content: "";}
.search-wrap .search-box .checkbox_wrap input[type=checkbox]:checked + label {color:#9013fe;}
.search-wrap .search-box .checkbox_wrap input[type=checkbox]:checked + label:before{ background-position: 0 -80px;}


.dropdown {display:inline-block; width:100px; height:30px; vertical-align: middle;}
.sel-box {display:block;width:100%;position:relative;text-align:left;}
.sel-box .selected-headline{display:block;width:100%;height:30px; border: 1px solid #dcdcdc; border-color:#9c9c9c #c5c5c5 #c7c7c7 #a09f9f; background:#fff;padding:0 30px 0 12px; color:#a8a8aa;cursor:pointer;overflow:hidden; border-radius:4px;
-webkit-box-shadow: inset 1px 1px 0px 0px rgba(0,0,0,0.05);
-moz-box-shadow: inset 1px 1px 0px 0px rgba(0,0,0,0.05);
box-shadow: inset 1px 1px 0px 0px rgba(0,0,0,0.05);}
.sel-box .selected-headline span {display:block; width: 100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;box-sizing: border-box; line-height: 28px;}
.sel-box .selected-headline:before{content:'';position:absolute;top:0;right:0;width:26px; height:30px; border:1px solid #b9b9b9; background:#c4c4c4; box-sizing: border-box; border-radius: 0 4px 4px 0;}
.sel-box .selected-headline:after{content:'';position:absolute;top:12px;right:9px;width: 0; height: 0; border-left:4px solid transparent; border-top:7px solid #7a8e99; border-right:4px solid transparent;}
.sel-box:hover .selected-headline:before {opacity: 0.5;}
.sel-box:hover .selected-headline:after{opacity: 0.5;}

.sel-box .select-list{width:100%; height:auto !important; max-height:250px; overflow-y:auto;border:1px solid #ccc;background:#fff;position:absolute;top:0;left:0;z-index:9;}
.tab_content .sel-box .select-list {top:30px !important;}
.sel-box .select-list li {width:100%;}
.sel-box .select-list .select-list-link{display:block;width:100%;padding:5px 12px;color:#333;text-overflow:ellipsis;white-space:nowrap;overflow:hidden; }
.sel-box .select-list .select-list-hover {background: #f3f3f3;}
.sel-box .select-list .select-list-selected{background:#c1ccd2;color:#fff}
/*.sel-box .select-list-selfocus{border:1px dotted #4a63a1 !important}*/
.sel-box.sch-sel .selected-headline{height:36px;line-height:36px;background:#fff;border:1px solid #d0d0d0;color:#999;padding:0 12px}
.sel-box.sch-sel .selected-headline:after{top:15px}
.up_type {width:130px;}
.up_type .sel-box .select-list {top: auto !important; bottom:30px !important;}
.compulsory .sel-box .selected-headline{background-color: #f3fdfd !important;}
.compulsory .sel-box .selected-headline:focus{outline: 1px solid #0195ff9e;}

/* iframe */
.iframe_wrap {background: #fff; width:780px; min-width:auto;}
.popup_iframe {border:0;}


/*btn*/
.btn_area {margin-top: 10px; text-align: right;}
.btn_area_inleft {float: left; text-align: left; height: 24px;}
.btn_area_inleft label{display:inline-block; margin-top: 10px; font-weight: 800;}
.btn_basic {display:inline-block; min-width:54px; padding:0 10px; height:30px;   border-radius: 3px; font-size:14px; font-weight:700; color: #fff; line-height: 30px; text-align: center; vertical-align:middle;
                background: -moz-linear-gradient(top, #b2c1c9 0%, #96a7b1 50%, #7c8f9a 100%);
                background: -webkit-linear-gradient(top, #b2c1c9 0%,#96a7b1 50%,#7c8f9a 100%);
                background: linear-gradient(to bottom, #b2c1c9 0%,#96a7b1 50%,#7c8f9a 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2c1c9', endColorstr='#7c8f9a',GradientType=0 );}
.btn_basic:hover {opacity: 0.7;}
.btn_gray {display:inline-block; min-width:54px; padding:0 10px; height:30px;   border-radius: 3px; font-size:14px; font-weight:700; color: #fff; line-height: 30px; text-align: center; vertical-align:middle;
                background: -moz-linear-gradient(top, #b2c1c9 0%, #96a7b1 50%, #7c8f9a 100%);
                background: -webkit-linear-gradient(top, #b2c1c9 0%,#96a7b1 50%,#7c8f9a 100%);
                background: linear-gradient(to bottom, #b2c1c9 0%,#96a7b1 50%,#7c8f9a 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2c1c9', endColorstr='#7c8f9a',GradientType=0 );}
.btn_gray:hover {opacity: 0.7;}
.btn_gray.compulsory {border: 1px solid #dcdcdc; color:#5b6770 !important; line-height:28px;
    background: -moz-linear-gradient(top, #f0f9ff 0%, #f3fdfd 48%, #bee0df 100%);
    background: -webkit-linear-gradient(top, #f0f9ff 0%,#f3fdfd 48%,#bee0df 100%);
    background: linear-gradient(to bottom, #f0f9ff 0%,#f3fdfd 48%,#bee0df 100%);}
.btn_i_gray {display:inline-block; min-width:54px; padding:0 10px; height:24px;  border:1px solid #666;  border-radius: 3px; background: #666; font-size:12px; font-weight:700; color: #fff; line-height: 22px; text-align: center; vertical-align: middle;}
.btn_i_gray:hover {border:1px solid #4a63a1; background:#4a63a1; color: #fff;}
.btn_i_gray .material-icons {font-size: 15px; line-height: 22px; vertical-align: middle; }
.btn_red{display:inline-block; min-width:54px; padding:0 10px; height:30px;   border-radius: 3px; font-size:14px; font-weight:700; color: #fff; line-height: 30px; text-align: center; vertical-align:middle;
                background: -moz-linear-gradient(top, #c9b2b2 0%, #b19696 50%, #9a7c7c 100%);
                background: -webkit-linear-gradient(top, #c9b2b2 0%,#b19696 50%,#9a7c7c 100%);
                background: linear-gradient(to bottom, #c9b2b2 0%,#b19696 50%,#9a7c7c 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9b2b2', endColorstr='#b19696',GradientType=0 );}
.btn_red:hover {opacity: 0.7;}
.btn_icon {display:inline-block; min-width:54px; padding:0 10px; height:30px;   border-radius: 3px; font-size:14px; font-weight:700; color: #fff; line-height: 30px; text-align: center; vertical-align:middle;
                background: -moz-linear-gradient(top, #b2c1c9 0%, #96a7b1 50%, #7c8f9a 100%);
                background: -webkit-linear-gradient(top, #b2c1c9 0%,#96a7b1 50%,#7c8f9a 100%);
                background: linear-gradient(to bottom, #b2c1c9 0%,#96a7b1 50%,#7c8f9a 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2c1c9', endColorstr='#7c8f9a',GradientType=0 );}
.btn_icon:hover {opacity: 0.7;}
.btn_icon .material-icons {font-size: 15px; vertical-align: middle; }
.btn_i_blue {display:inline-block; min-width:54px; padding:0 10px; height:30px;   border-radius: 3px; background: #c1ccd2; font-size:12px; font-weight:700; color: #fff; line-height: 22px; text-align: center; vertical-align: middle;}
.btn_i_blue:hover {opacity: 0.8;}
.btn_i_blue .material-icons {font-size: 17px; line-height: 30px; vertical-align: middle; }

.btn_small {display:inline-block; min-width:30px; padding:0 10px; height:20px; border-radius: 10px; background: #91aab8; font-size:11px; color: #fff; line-height: 20px; text-align: center; }
.btn_small:hover {opacity: 0.8;}
.btn_small_white {display:inline-block; min-width:30px; padding:0 10px; height:20px; border-radius: 10px; background: #fff; font-size:11px; color: #4a63a1; line-height: 20px; text-align: center; }
.btn_small_white:hover {opacity: 0.8;}
.btn_close{display:block;position: absolute;top: 5px;right:5px;width: 17px;height: 17px; overflow: hidden;}
.btn_close .material-icons {color: #fff; font-size: 17px;}
.in_btn_search {display:inline-block; width:24px; height: 24px; border-radius: 3px; background:#c1ccd2; vertical-align: middle; text-align: center;}
.in_btn_search .material-icons {font-size: 18px; color:#fff; line-height: 24px;}
.in_btn_search.compulsory {border: 1px solid #dcdcdc; color:#5b6770 !important;
    background: -moz-linear-gradient(top, #f0f9ff 0%, #f3fdfd 48%, #bee0df 100%);
    background: -webkit-linear-gradient(top, #f0f9ff 0%,#f3fdfd 48%,#bee0df 100%);
    background: linear-gradient(to bottom, #f0f9ff 0%,#f3fdfd 48%,#bee0df 100%);}
.in_btn_search.compulsory .material-icons {color:#5b6770 !important;line-height:22px;}
@-moz-document url-prefix(){ .in_btn_search .material-icons {line-height: 27px;}}
.in_btn_search:hover {opacity: 0.8;}

.btn_download {display:inline-block; width:30px; height: 30px; background: url(../images/new/icon_download.png) no-repeat center bottom; font-size:0; overflow: hidden; text-indent: -9999px; vertical-align: middle;}
.btn_upload {display:inline-block; width:30px; height: 30px; background: url(../images/new/icon_upload.png) no-repeat center bottom; font-size:0; overflow: hidden; text-indent: -9999px; vertical-align: middle;}
.btn_write {display:inline-block; width:30px; height: 30px; background: url(../images/new/icon_write.png) no-repeat center bottom; font-size:0; overflow: hidden; text-indent: -9999px; vertical-align: middle;}
.btn_download:hover, .btn_write:hover, .btn_upload:hover {opacity: 0.8;}

.btn_area_c {text-align: center; margin-top: 15px; margin-bottom: 20px;}
.btn_area + .grid_area {margin-top: 10px;}
.btn_area + .table_wrap {margin-top: 10px;}
/*직원관리*/
.list_header {position: relative; z-index:999; margin: 7px 0;}
.employee_detail_right .list_header.list_header02 {padding:0 25px; margin-bottom: 10px;}
.employee_detail_right .list_header.list_header02 .search-wrap + .search-wrap {margin-top: 16px; padding-top: 16px; border-top:1px solid #dad9d7;}
.list_header:after {content:'';clear:both;display:block}
.list_header .date_box_wrap {margin: 5px 0 0 0; float: left;}
.list_header .date_box_wrap .date_box {position: relative; text-align: left; padding-top: 0; height: 24px;}
.list_header .date_box_wrap .date_box .currentmonth {padding: 0 10px; line-height: 20px; font-size:15px; font-weight: 700; color: #000; letter-spacing: -1px;}
.list_header .date_box_wrap + .search-wrap .search-box {float: right;}
.list_header .btn_open_select {display:inline-block; position: relative; width:20px; height: 20px; background:#dad9d7; overflow: hidden; text-indent: -9999px; vertical-align: middle; border-radius: 3px;}
.list_header .btn_open_select:after {position:absolute; display:inline-block; left:5px; top:8px; width: 0;height: 0; border: 5px solid #b2b2b2;border-bottom-color: transparent;border-right-color: transparent;border-left-color: transparent;content:''; transition: all .2s;}
.list_header .btn_open_select.active:after {transform: rotate(180deg); top:2px;}
.list_header .btn_open_select:hover{opacity: 0.7;}
.month_select_box {display:none; position: absolute; left:0; top:100%; width:169px; height:165px; background: #c1ccd2; -webkit-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.1);
            -moz-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.1);
            box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.1);}
.month_select_box.active {display: block;}
.select_box_wrap {z-index:999; position:relative; width:100%; padding-top: 25px;}
.select_box_wrap p {position: absolute; top:5px; left:8px; color: #fff; font-weight: 700;}
.select_box_wrap .select_box {width:100%; height: 140px;padding-left: 1px;}
.select_box_wrap .select_box .dropdown {width:76px; margin-left:-2px;}
.select_box_wrap .select_box .dropdown:first-child {margin-left: 0px; width:90px;}
.select_box_wrap .select_box .sel-box .selected-headline {display: none;}
.select_box_wrap .select_box .sel-box .select-list {display: block !important;}
.select_box_wrap .select_box .sel-box .select-list{width:100%; height:140px !important;}
.select_box_wrap .btn_close {display:block;position: absolute;top: 3px;right:4px;width: 17px;height: 17px; overflow: hidden;}
.select_box_wrap .btn_close .material-icons {color: #fff; font-size: 17px;}

.list_header .search-wrap {padding-bottom: 0;}
.list_header .search-wrap input[type=radio] + label{position: relative; padding-right: 7px;}
.list_header .name_box {float: left; min-width:70px; height:24px; padding: 0 10px; color: #3B5998; font-size: 13px; font-weight: 700; background:#bbe1e9; line-height:24px; border-radius:5px;  text-align: center; }
.list_header .search-wrap label {display: inline-block; margin-left:8px; line-height: 30px; font-weight: 700;}
.list_header .search-wrap label.ico_arrow {position:relative; margin-left: 0; padding-left: 20px; font-size: 14px; color: #101010; font-weight: 700;}
.list_header .search-wrap label.ico_arrow:before {position: absolute; top:10px; left:0; width:10px; height: 9px; background: url(../images/new/icon_arrow.png) no-repeat 0 0; content: '';}
.list_header .search-wrap .datepicker_box label {margin-left: 0;}
.list_header .search-wrap .search-box > div + label {margin-left: 20px;}
.list_header h3 {position: absolute; left:0; top:6px; margin-top:0;}
.employee_detail_right .list_header .search-wrap input[type=text] {width:150px; float: left; margin-left:25px;}
.employee_detail_right .list_header .search-wrap .datepicker_box input {width:120px;}
.detail_right .tab_container .list_header {height: 30px; margin-top: 0;}
.list_header .search-wrap .btn_area {float: right; margin-top: 0; margin-left:100px;}
.list_header h3 + .search-wrap .search-box {text-align: right;}
.list_header h2 {float: left;}
.list_header h2 + .search-wrap .search-box {float:right;}
.detail_right .tab_container .list_header .search-wrap .search-box {float:right;}

.btn_area + .list_header {margin-top: 10px; margin-bottom:0; padding:10px 0; border-top:1px solid #e7e5e5; background: #faf9f9;}

.grid_area {border:0px;/*1px solid #ccc;*/ min-height:730px;}
.tb_search + .grid_area {margin-top: 10px;}

.employee_detail_left {z-index:99; position: absolute; top:-37px; left:-366px; bottom:0; width:350px;}
.employee_detail {width:100%;}
.employee_detail:after{content:'';clear:both;display:block}
.employee_profile {position: relative; width:100%; height:195px; margin-bottom:5px; padding: 10px; border-bottom:5px solid #dad9d7;}
.employee_profile:after{content:'';clear:both;display:block}
.employee_profile .photo_box {z-index:1; position:relative; width:100px; height:100px; float: left; margin: 17px 0 0 17px;}
.employee_profile .photo_box .photo {width:100px; height:100px; margin: 0 auto; border:5px solid #9393ac; background:#9393ac; border-radius:50%; overflow: hidden;}
.employee_profile .photo_box .photo img {width:100%; height:100%;}

.photo_fileup_wrap {position: absolute; display: block; left:0; bottom:0; width:100px; height: 100px; border-radius:50%; overflow: hidden;}
.photo_fileup {position:relative; display: inline-block; width:100px; height: 100px; z-index: 0; border-radius:50%; overflow: hidden;}
.photo_fileup .btn_photo_profile {display:inline-block; width:100px; height: 100px; background:transparent; border-radius: 50%;}
.photo_fileup .file_up {z-index: 1; position: absolute; top:0; left:-100px; width:200px; height:100px;  opacity: 0;filter:alpha(opacity=0); cursor: pointer;}


.employee_profile .profile {position:relative; width:195px; float: right; margin-top: 17px;}
.employee_profile .profile .profile_list {width:100%;}
.employee_profile .profile .profile_list > li {padding:0; padding-top:5px;}
.employee_profile .profile .profile_list > li:first-child {padding-top:0;}
.employee_profile .profile .profile_list > li h1 {font-size: 32px; color: #000; margin-bottom: 15px; letter-spacing: -3px;}
.employee_profile .profile .profile_list > li .btn_small {font-size: 11px; letter-spacing: -0.5px;}
.employee_profile .profile .profile_list > li input[type=text] {width:100%; letter-spacing: -0.5px}
.employee_profile .profile .profile_list > li .inp_birth {width:90px !important; float: left;}
.employee_profile .profile .profile_list > li .dropdown {width:70px !important; margin-left:5px;}
.employee_profile .profile .btn_small {position:absolute;top:-7px; right:-7px; display:inline-block; width:20px; height:30px; background: url(../images/new/icon_write.png) no-repeat center bottom; font-size:0; overflow: hidden; text-indent: -9999px; vertical-align: middle;}
.employee_profile .profile .btn_small:hover {opacity: 0.8;}

.issuebox_wrap {display:none; position: absolute; top:2px; right:25px;}
.issuebox_wrap.active {display: block;}
.issuebox_wrap .issue {width:25px; height:25px; cursor: pointer;}
.issuebox_wrap .issue:hover {opacity: 0.5;}
.issuebox_wrap .issue span {position:relative;  z-index:99; display:inline-block; width:25px; height:25px; background: #f42020; border-radius: 50%; line-height: 25px; color: #fff; font-size:11px; font-weight: 700; text-align: center;
            -webkit-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2);
            box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2);}
.issuebox_wrap .issue span:after {position:absolute; left:3px; bottom:-5px; display:inline-block; width: 0; height: 0; border-left: 3px solid transparent; border-right: 3px solid transparent; border-top: 10px solid #f42020; transform: rotate(30deg); content:'';}
.issuebox {z-index:50; position: absolute; top:30px; left:-500px; width:0; height:190px; background: #fff; border:1px solid #c1ccd2; border-radius: 5px; transition: 0.2s all;
            -webkit-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2);
            box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2); opacity: 0;}
.issuebox.active {width:250px; left:0; opacity: 1;}
.issuebox h2 {width:100%; height: 30px; padding-left:14px; color:#fff; font-size: 14px; font-weight: 700; line-height: 30px; background:#c1ccd2;  border-radius: 5px 5px 0 0;}
.issue_list {width:100%; padding: 10px;}
.issue_list li {position:relative; width:100%; height:28px; padding-left:15px; border-top:1px solid rgba(256,256,256,0.1);}
.issue_list li:before {position: absolute; top: 12px; left:5px; width:2px; height: 2px; background: #ccc; content: '';}
.issue_list li:first-child {border-top:0;}
.issue_list li a {display: block; width:100%; height: 100%;}
.issue_list li:hover {background:#f2f2f25e;}
.issue_list li a .title {position:relative; max-width: 100%;/*calc(100% - 70px);*/ display:inline-block; font-size: 12px; color:#63656a; line-height: 27px;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.issue_list li a.new span.title:after {position:absolute; top:7px; right:0; display:block; font-size:10px;  width:12px; height:12px; line-height:12px; color:##63656a; font-weight:700; text-align:center; background:#f1fd71; content: 'N'; border-radius: 2px;}
.issue_list li:last-child {border-bottom:1px solid rgba(256,256,256,0.1);}
/*.issue_list li a .date {display:inline-block; float: right; width:60px; font-size: 10px; color:#63656a; line-height: 27px; text-align: center;}*/

.employee_info {position: relative;}
.employee_info h2 {position: relative; width:100%; height: 36px; padding-left:51px; color:#101010; font-size: 14px; font-weight: 700; line-height: 36px;}
.employee_info h2:before {position: absolute; top:0; left:24px; width:25px; height: 36px; background: url(../images/new/h2_bg09.png) no-repeat center left; content:'';}
.employee_info h2.bg02:before {background: url(../images/new/h2_bg10.png) no-repeat center left;}
.employee_info h2.bg03:before {background: url(../images/new/h2_bg11.png) no-repeat center left;}
.employee_info .table_wrap {border-top:0; border-bottom:1px solid #dad9d7;}
.employee_info .table_wrap table tbody th {position:relative; height:36px; font-size: 14px; padding-left:53px;  color:#101010; font-size: 14px; font-weight: 700; text-align: left; border:0;}
.employee_info .table_wrap table tbody th:before {position: absolute; top:-2px; left:24px; width:25px; height: 36px; background: url(../images/new/tb_bg.png) no-repeat center center; content:'';}

.employee_info .table_wrap table tbody td {height:36px; padding-right:15px; font-size: 14px; text-align: left; color:#5b6770; border:0;}
.employee_info .btn_small_white  {position:absolute;top:-7px; right:5px; display:inline-block; width:20px; height:30px; background: url(../images/new/icon_write.png) no-repeat center bottom; font-size:0; overflow: hidden; text-indent: -9999px; vertical-align: middle;}
.employee_info .btn_small_white:hover {opacity: 0.8;}

.employee_info .table_wrap .dropdown {width:100%;}
.employee_info .table_wrap table tbody tr:hover th, .employee_info .table_wrap table tbody tr:hover td {background: #f2f2f2;}



.employee_detail_right {width:100%;}

.summary_box {position:relative; width:100%; height:109px; margin-bottom:10px; background: #fff; border:1px solid #b9b9b9;}
.employee_detail_right .summary_box h2 {position: absolute; top:0; left:10px;}
.summary_box ul {width:100%; height: 100%;}
.summary_box ul li {float: left; width:16.666%; height:100%; padding:21px 10px 10px 10px; border-left:1px solid #b9b9b9;}
.summary_box ul li:first-child {border-left:0;}
.summary_box ul li .summary {z-index:1; position:relative; width:123px; height: 100%; margin: 0 auto; background: url(../images/new/icon_employee_detail01.png) no-repeat left bottom;}
.summary_box ul li:nth-child(2) .summary {background: url(../images/new/icon_employee_detail02.png) no-repeat 0 25px;}
.summary_box ul li:nth-child(3) .summary {background: url(../images/new/icon_employee_detail03.png) no-repeat left bottom;}
.summary_box ul li:nth-child(4) .summary {background: url(../images/new/icon_employee_detail04.png) no-repeat left bottom;}
.summary_box ul li:nth-child(5) .summary {background: url(../images/new/icon_employee_detail05.png) no-repeat left bottom;}
.summary_box ul li:nth-child(6) .summary {background: url(../images/new/icon_employee_detail06.png) no-repeat left bottom;}
.summary_box ul li .text_box {float:right; display: inline-block; padding-top:27px; vertical-align: middle; font-size: 14px; font-weight: 700; line-height: 17px; letter-spacing: -0.5px;}
.summary_box ul li .text_box span {font-size: 14px; font-weight: 700; line-height: 17px; letter-spacing: -0.5px;}
.summary_box ul li:nth-child(3) .text_box {padding-top:17px;}
.employee_detail_right h2 {height: 30px; color:#101010; font-size: 14px; font-weight: 700; line-height: 30px;}
.employee_detail_right h2 > span {font-size: 10px; color:#101010; font-weight: 700;}
h3 {position:relative; height:25px; padding-left:25px; margin-bottom:2px; color:#101010; font-size: 14px; font-weight: 700; line-height: 25px;}
h3:before {position: absolute; top:6px; left:3px; width:16px; height:15px; background: url(../images/new/h3_bg01.png) no-repeat center center; content: '';}
div + h3 {margin-top: 10px;}
div + div > h3 {margin-top: 10px;}
.contract_wrap {width:100%;}
.contract_wrap:after{content:'';clear:both;display:block}
.contract_left {width:490px; float: left;}
.contract_right {width: calc(100% - 505px); float: right;}

/*급여관리*/
.severancepay_wrap {margin-bottom:15px; height:50px; color:#fff; font-size:27px; text-align:center; background:#101010; border-radius: 10px; line-height: 50px;}
.severancepay_wrap em {font-weight: 700; color: #f1fd71;}
.info_text_wrap {margin-top: 5px;}
.info_text_wrap p {position:relative; padding-left:10px; font-size: 11px; color: #f42020; line-height: 18px;}
.info_text_wrap p:before {position: absolute; top:0; left:2px; font-size: 11px; color: #f42020; content: '*';}
.specification_wrap {width:100%; overflow: hidden;}
.specification_wrap > li {float: left; width:50%; padding:0 0 0 7px; box-sizing: border-box;}
.specification_wrap > li:first-child {padding: 0 7px 0 0; }
.specification {padding: 0; width:100%; height: 100%; border:2px solid #000;}
.specification table {border:0; margin-bottom: 0;}
.specification table th {padding:5px 10px; font-size:15px; height:40px;  border: 0; border-bottom:1px solid #000; box-sizing: border-box;}
.specification table tbody tr td {position:relative; padding:0; font-size:15px; height:590px;  border:0; vertical-align: top;}
.specification table tbody tr td:after {position: absolute; top:0; left:50%; width:0; height: 100%; border-right:1px solid #000; content:'';}
.specification table tfoot th {border: 2px solid #000; border-bottom:0; border-left:0; font-size:15px; color: #333; font-weight: 700; background: #f5f5f6; text-align: center;}
.specification table tfoot td.won {border: 2px solid #000; padding-right:5px; border-bottom:0; border-right:0; font-size:15px;  color: #333; text-align: right; font-weight: 700;}
.specification_list {width:100%; height:100%;}
.specification_list > li {width:100%; height: 40px;}
.specification_list > li > span {display: inline-block; float: left; width:50%; padding:5px 10px;text-align: left; color:#333; font-weight:700; line-height:30px; box-sizing: border-box;}
.specification_list > li > span.won {text-align: right;}
.total {margin: 14px auto; width:100%;}
.total table tfoot th {border-top:0;}
.total table tfoot td.won {border-top:0;}

/*개인현황관리*/
.employee_detail_right > h1 {position:relative; height: 30px; margin-bottom:10px; padding-left:10px; color:#fff; font-size: 16px; font-weight: 700; line-height: 30px; border-radius: 5px; background: #3b5998;}

/*상세관리*/
.lnb_wrap {position:absolute; top:0; left:0; width:230px;}
.lnb {width:100%; overflow:hidden;}
.lnb .sub_title {display:none; width:100%; height:40px; font-size:15px; font-weight:700; color:#fff; background: #101010; line-height: 40px; text-align: center;}
.lnb_dep01 {width:100%;}
.lnb_dep01 > li {position:relative; width:100%;}
.lnb_dep01 li {background: #fff;}
.lnb_dep01 > li > a {display: block; width:100%; height: 42px; padding-left:53px; border-bottom:1px solid #b9b9b9; font-size: 14px; font-weight:700; line-height:41px; color: #101010;}
.lnb_dep01 > li:before {position: absolute; top:13px; left:25px; width:21px; height: 17px; background: url(../images/new/h2_bg09.png) no-repeat center center; content: '';}
.lnb_dep01 > li:nth-child(2):before {background: url(../images/new/h2_bg10.png) no-repeat center center;}
.lnb_dep01 > li:nth-child(3):before {background: url(../images/new/h2_bg11.png) no-repeat center center;}
.lnb_dep01 > li > a:before {position:absolute; right:20px; top:15px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #8a8a8a; content: ''; transition: all .2s;}
.lnb_dep01 > li > a:after {position:absolute; right:22px; top:15px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #fff; content: ''; transition: all .2s;}
.lnb_dep01 > li.active > a:before {transform: rotate(90deg); top:17px;}
.lnb_dep01 > li.active > a:after {transform: rotate(90deg); top:15px; right:20px}

.lnb_dep02 {width:100%; display: none;}
.active .lnb_dep02 {display: block;}
.lnb_dep02 > li {position:relative; display:block; width:100%; }
.lnb_dep02 > li:hover, .lnb_dep02 > li.active {background: #f2f2f2;}
.lnb_dep02 > li:before {position: absolute; top:-2px; left:24px; width:25px; height: 36px; background: url(../images/new/tb_bg.png) no-repeat center center; content:'';}
.lnb_dep02 > li > a {display: block; width:100%; height:36px; padding: 0 35px 0 54px; font-size: 13px;  font-weight: 700; line-height:36px; color: #101010;}
.lnb_dep02 > li.has_children > a:before {position:absolute; right:30px; top:15px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #8a8a8a; content: ''; transition: all .2s;}
.lnb_dep02 > li.has_children > a:after {position:absolute; right:32px; top:15px; width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 5px; border-color: transparent transparent transparent #fff; content: ''; transition: all .2s;}
.lnb_dep02 > li.has_children:hover > a:after {border-color: transparent transparent transparent #f2f2f2;}
.lnb_dep02 > li.has_children.active > a:before {transform: rotate(90deg); top:15px;}
.lnb_dep02 > li.has_children.active > a:after {transform: rotate(90deg); top:13px; right:30px; border-color: transparent transparent transparent #f2f2f2;}
.lnb_dep02 > li:last-child {border-bottom: 1px solid #b9b9b9;}
.lnb_dep02 > li.has_children.active:last-child {border-bottom: none;}

.lnb_dep03 {width:100%; display:none;}
.lnb_dep02 > li.active .lnb_dep03 {display: block;}
.lnb_dep02 > li.active > .lnb_dep03:after {position:absolute; left:0; bottom:0; width:100%; height:1px; background:#f2f2f2; content:'';}
.lnb_dep03 > li {position:relative; display:block; width:100%;}
.lnb_dep03 > li > a {display: block; width:100%; height:30px; padding: 0 20px 0 60px; font-size: 13px; line-height:30px; color: #101010; letter-spacing: -0.1px;}
.lnb_dep03 > li > a:before {position: absolute; top:0; left:50px; height: 30px; width:5px; font-size: 12px; line-height:30px; color: #101010; content: '-'}
.lnb_dep03 > li.active > a {color:#101010; font-weight: 700;}
.lnb_dep03 > li > a:hover {color:#101010; font-weight: 700;}
.lnb_dep03 > li.active > a:before {color: #101010;}
.lnb_dep03 > li > a:hover:before {color: #101010;}

.detail_right {width:100%; float: right;}
.detail_right h2 {height: 30px; color:#101010; font-size: 14px; font-weight: 700; line-height: 30px;}

.mysys_wrap {width:100%; height: 700px;  margin: 0 auto;}
.mysys {width:100%;}
.mysys > li {float: left; width:25%; height: 100%;}
.mysys > li:nth-child(2) {width:50%; padding: 0 10px;}

.hospital_list {width:100%; height: 580px;}
.hospital_list .dropdown {width:100%;}
.hospital_list .sel-box .selected-headline {display: none;}
.hospital_list .sel-box .select-list {display: block !important; top:0 !important;}
.hospital_list .sel-box .select-list{width:100%; height:580px !important;}
.hospital_list .sel-box .select-list li {border-bottom:1px solid #d0d0d0;}
.hospital_list .sel-box .select-list .select-list-link {padding: 7px 12px;}

.authority_box {width:100%; height: 579px; padding:5%; background:#f3f3f3; border: 1px solid #d2d2d2; overflow: auto;}
.authority_list {width:100%;}
.authority_list li {position:relative; margin-top: 7px; padding-left:20px;}
.authority_list li label {line-height: 16px;}
.authority_list a.i_root {display:none; z-index:10; position:absolute; top:3px; left:2px; width:9px; height: 9px; background: url(../images/bg_spr.png) no-repeat -22px -47px; font-size: 0; text-indent: -9999px; }
.authority_list .has_child > a.i_root {display: block;}
.authority_list .active a.i_root {background-position:0 -47px;}
.authority_list ul {position: relative; margin-left: 100px;}
.authority_list .active ul {display: none;}
.authority_list li:before {position: absolute; top:7px; left:6px; width:1px; height: calc(100% + 7px); background:#d2d2d2; content: '';}
.authority_list li:first-child:before {position: absolute; top:7px; left:6px; width:10px; height: calc(100% + 7px); border-left:1px solid #d2d2d2; border-top:1px solid #d2d2d2; background:none; content: '';}
.authority_list li:last-child:before {width:0; height:0;}
.authority_list li:after {position: absolute; top:7px; left:6px; width:10px; height:1px; background: #d2d2d2; content: '';}
.authority_list li ul:before {position: absolute; top:-7px; left:-93px; width:100px; height:14px;border-bottom:1px dotted #d2d2d2;border-left:1px dotted #d2d2d2; content: '';}

.check_list {width:100%; height: 579px; padding: 15px; border: 1px solid #d2d2d2; }
.check_list  li {padding: 5px 0;}

.thissys_wrap {width:900px; margin: 0 auto;}
.thissys_wrap .mysys > li {float: left; width:40%; height: 100%;}
.thissys_wrap .mysys > li:nth-child(2) {width:60%; padding-right: 0;}

.manual_wrap {width:900px; margin: 0 auto;}
.manual_wrap .mysys > li {float: left; width:50%; height: 100%;}
.manual_wrap .mysys > li:nth-child(2) {width:50%; padding-right: 0;}

.setting_wrap {padding-top:10px; border-top:1px solid #d2d2d2}
.setting_wrap .read_tb table tbody th {text-align: left;}
.setting_wrap .read_tb table tbody td {padding-left: 10px;}
.setting_wrap .read_tb table tbody td .info_text {display: inline-block; margin-left: 10px;}
.setting_wrap .read_tb table tbody td input[type=text] {width:150px;}
.setting_wrap .read_tb table tbody td label.in_lable {display: inline-block; min-width:72px; text-align:center; font-weight: 700; margin: 0 5px 0 0; background: #f5f8fa; line-height: 25px;}
.setting_wrap .read_tb table tbody td label.in_lable + input {margin-right: 10px;}
.setting_wrap .read_tb table tbody td  .info {padding-left:10px; text-indent:-10px; color: #605eb3;line-height: 14px;}
.compulsory{background-color: #f3fdfd !important;}
.compulsory:focus{outline: 1px solid #0195ff9e;}
.detail_right h3 + .table_wrap {margin-bottom: 20px; margin-top:5px;}
.setting_wrap .address_wrap input{float: left;}
.setting_wrap .address_wrap .btn_gray {float: left; margin: 0 3px;}

/*인사관리*/
.gridTotal { text-align:right; padding:5px 10px 5px 0px; font-size:13px; font-weight:800; color: #5378a6;}
.gridTotal  + .table_wrap {margin-top: 20px;}
.profile_wrap {margin:15px 0 40px 0; padding:10px; background: #f9f9f9; border: 1px solid #f3f3f3; border-radius: 5px;}
.profile_wrap:after {content:'';clear:both;display:block}
.profile_wrap .employee_profile {float: left; padding:0; width:100px; height:100px; margin:0; border:none; background: none; overflow: hidden;}
.profile_wrap .employee_profile .photo_box {margin: 0;}
.profile_wrap .table_wrap {width: calc(100% - 110px); margin-top:33px; float: right; border-top:1px solid #dcdcdc;}
.profile_wrap .table_wrap table tbody td {background: #fff; text-align: left;}

.estimation_wrap {width:100%;}
.estimation_wrap:after {content:'';clear:both;display:block}
.estimation_wrap .estimation_left {float: left; width:calc(100% - 640px)}
.estimation_wrap .estimation_left .list_header {height: 30px;}
.estimation_wrap .estimation_right {float: right; width:630px;}
.estimation_wrap .estimation_right .list_header .search-wrap .search-box {text-align: right;}
.estimation_wrap .estimation_right .list_header .search-wrap .search-box > label {float: none;}

.radio_wrap {display: inline-block; margin-right:7%;}
.radio_wrap label {margin-right: 10px;}

.in_box {padding:15px; background:#f9f9f9; border-radius:5px; margin-top:5px;}
.in_box h4 {color: #333; font-size: 12px; font-weight: 800; margin-bottom:6px;}
.in_box h4 + .table_wrap {margin-bottom: 20px;}
.in_box td {background: #fff !important;}
.in_box h5 {margin-top:-10px; margin-bottom: 5px; color: #333; font-size: 12px; font-weight: 700;}
.in_box .grid_area {margin-bottom: 20px;}
.in_box .table_wrap {border-top: 1px solid #dcdcdc;}
.in_box .table_wrap:last-child {margin-bottom: 0;}

#ui-datepicker-div * {font-family: '돋움',dotum,Tahoma,sans-serif; font-size: 12px;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {width:35%; margin:0 3px; height:18px; font-size:11px; line-height: 16px; border: 1px solid #dcdcdc;}
.ui-datepicker .ui-datepicker-title {font-size: 12px;}

.banner_wrap {position: relative;}
.banner_wrap .swiper-button-prev,
.banner_wrap .swiper-button-next{position:absolute; display:table; top:50%; margin-top:-20px; width: 24px;height: 40px; background: rgba(0,0,0,0.3); cursor: pointer}
.banner_wrap .swiper-button-prev {left:0;}
.banner_wrap .swiper-button-next {right:0;}
.banner_wrap .swiper-button-prev:hover,
.banner_wrap .swiper-button-next:hover{background: rgba(0,0,0,0.7);}
.banner_wrap .swiper-button-prev .material-icons,
.banner_wrap .swiper-button-next .material-icons {display: table-cell; width:100%; height: 100%; vertical-align: middle; color: #fff; text-align: center;}

.btn_more:hover {opacity: 0.7;}

@media all and (max-width:1500px){
    .detail_right .tab_basic > .tab_lst.max_tab li{min-width: 95px;}
    .infobox_wrap .info_area ul li span { padding:0 6px;}
}
@media all and (max-width:1300px){
    .table_wrap table tbody th {padding:5px;}
}


/* 예약 스케줄 PopUp */
.schedule_popup_content {width:100%;overflow-x:scroll; overflow-y:hidden;}
.timetbl {position:relative; width:5000px; border: 1px solid #999; /*border-top: 1px solid #999;border-bottom: 1px solid #999;*/ overflow: hidden;}
.timetbl table {width: 100%; background: #fff;}
.timetbl table thead th{width:25px; height:25px; font-size: 12px; background-color: #f3f3f3; border: 1px solid #d9d9d9; color:#666; font-weight: bold; vertical-align: middle; }
.timetbl table thead tr:first-child th { height:25px; font-size: 14px;background-color: #e9e9e9; color: #333; border-right:solid 1px #999;}
.timetbl table thead tr:first-child th:first-child{width:117px; z-index : 999999;}
.timetbl table thead tr:first-child th:last-child{border-right:0px;}
.timetbl table tbody th {border-right:solid 1px #999;}
.timetbl table tbody th:first-child{width:100px; border: solid 1px #d9d9d9; background-color: #f3f3f3; text-align: center; font-weight:600; z-index : 999999;}
.timetbl table tbody td{width:25px; height:25px; border: solid 1px #d9d9d9;}
.timetbl table tbody th:first-child .checkbox .form-chk {padding-right: 0;}
.timetbl table tbody th:first-child .checkbox label {font-weight: bold; }
.timetbl table thead tr:first-child th:first-child:after {position: absolute; display: block; width:1px; height: 100%; top:0; left: 125px; background: #999; content: '';}
.timetbl table thead tr:nth-child(2) th > div {position: relative; width:100%;}
.timetbl table thead tr:nth-child(2) th:nth-child(12n) > div:after {position: absolute; display: block; width:1px; height:1000px ; top:-100px;; right:-1px; background: #999; content: '';}
.timetbl table thead tr:nth-child(2) th:last-child > div:after {display: none;}

.timestate_wrap {width:100%; height:24px;}
.timestate_wrap .timestate {width:100%; height: 100%; position: relative;}
.timestate_wrap .timestate .state {width:100%; height: 100%; cursor: pointer; text-align: center; line-height: 24px;}
.timestate_wrap .timestate .state:hover:after {display: block; position: absolute; top:0; left:0; width:100%; height: 100%; border: 2px solid #1AAAA6; content: '';}
/*예약완료 표시 */
.timestate_wrap .timestate .state.impossible {cursor: default; background: #999; color: #fff;}
.timestate_wrap .timestate .state.impossible:hover:after {display: none;}
/*해당예약  */
.timestate_wrap .timestate .state.booking {background: #8abc49; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.booking:hover:after {display: none;}
/*중복 예약*/
.timestate_wrap .timestate .state.overlap {background: #947abc; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.overlap:hover:after {display: none;}
.timestate_wrap .timestate .state.jasin {background: #990000; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.jasin:hover:after {display: none;}
/*의사 선택가능 색상  */
/* 1번 */
.timestate_wrap .timestate .state.dct1 {background: #7ea5d5; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct1:hover:after {display: none;}
/* 2번 */
.timestate_wrap .timestate .state.dct2 {background: #e391c7; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct2:hover:after {display: none;}
/* 3번 */
.timestate_wrap .timestate .state.dct3 {background: #f0728a; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct3:hover:after {display: none;}
/* 4번 */
.timestate_wrap .timestate .state.dct4 {background: #f09072; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct4:hover:after {display: none;}
/* 5번 */
.timestate_wrap .timestate .state.dct5 {background: #edad24; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct5:hover:after {display: none;}
/* 6번 */
.timestate_wrap .timestate .state.dct6 {background: #609f59; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct6:hover:after {display: none;}
/* 7번 */
.timestate_wrap .timestate .state.dct7 {background: #4e9db8; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct7:hover:after {display: none;}
/* 8번 */
.timestate_wrap .timestate .state.dct8 {background: #a95b8f; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct8:hover:after {display: none;}
/* 9번 */
.timestate_wrap .timestate .state.dct9 {background: #c0979f; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct9:hover:after {display: none;}
/* 10번 */
.timestate_wrap .timestate .state.dct10 {background: #be7862; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct10:hover:after {display: none;}
/* 11번 */
.timestate_wrap .timestate .state.dct11 {background: #4ba790; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct11:hover:after {display: none;}
/* 12번 */
.timestate_wrap .timestate .state.dct12 {background: #8ab955; color: #fff; cursor: default;}
.timestate_wrap .timestate .state.dct12:hover:after {display: none;}

#loadingImg {z-index:1}

/* Grid width 문제 : font size에 관련하여 itemRenderer 사용할 경우 글자에 대한 width 문제 때문에 다음과 같이 바꿈 */
.rMateH5__DataGrid {
    font-size : 14px !important;
}

/* Grid height 문제 : font size에 관련하여 DataGridItem 영문 글자에 대한 height 문제 때문에 다음과 같이 바꿈 */
span.rMateH5__DataGridItemRenderer {
    height: 15px !important;
}

.bold {font-weight: bold;color:#32383d;}
.normalTr.on {background:#c8ced4}

.block_imp{display:block !important;}

.btn_green{display:inline-block; min-width:54px; padding:0 10px; height:30px;   border-radius: 3px; font-size:14px; font-weight:700; color: #fff; line-height: 30px; text-align: center; vertical-align:middle;
                background: -moz-linear-gradient(top, #b7d48b 0%, #a0ce63 50%, #98aa81 100%);
                background: -webkit-linear-gradient(top, #b7d48b 0%, #a0ce63 50%, #98aa81 100%);
                background: linear-gradient(to bottom, #b7d48b 0%, #a0ce63 50%, #98aa81 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7d48b', endColorstr='#98aa81',GradientType=0 );}
.btn_green:hover {opacity: 0.7;}
.btn_blue{display:inline-block; min-width:54px; padding:0 10px; height:30px;   border-radius: 3px; font-size:14px; font-weight:700; color: #fff; line-height: 30px; text-align: center; vertical-align:middle;
                background: -moz-linear-gradient(top, #76a2be 0%, #4f95c2 50%, #4485b0 100%);
                background: -webkit-linear-gradient(top, #76a2be 0%, #4f95c2 50%, #4485b0 100%);
                background: linear-gradient(to bottom, #76a2be 0%, #4f95c2 50%, #4485b0 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4485b0', endColorstr='#76a2be',GradientType=0 );}
.btn_blue:hover {opacity: 0.7;}

/* .btn_basics{height: 24px;padding: 0 4px;line-height: 24px;background: url('../../images/btn_search_bg.png') repeat 0 0;color: #666;border: 1px solid #dcdcdc;} */