@import "reset.css";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

body {font-family:'Noto Sans KR', sans-serif;background:#f8f8f8;}

/*네비게이션 버튼*/
.nav_open , .nav_close_wrap {display:none;}

/*공통버튼*/
button {cursor:pointer;}
.top_button {position:relative;display:inline-block;padding:0 25px;line-height:36px;background:#fff;border:1px solid hsla(122, 85%, 26%, 0.961);border-radius:5px;font-size:0.9375rem;color:#068d0f;}
.top_button span {position:absolute;border-radius:50%;top:-7px;right:-7px;display:inline-block;text-align:center;width:22px;height:22px;line-height:22px;font-size:0.875rem;color:#fff;background:#068d0f;}

.modify_btn,.delete_btn {display:inline-block;font-size:0.9375rem;background:#fff;color:#444;font-weight:400;text-align:center;line-height:26px;padding:0 15px;border:1px solid #ccc;border-radius:4px;}
.modify_btn i {margin-right:5px;vertical-align:middle;display:inline-block;width:18px;height:18px;background:url("../images/modify_icon.png") no-repeat;}
.delete_btn i {margin-right:5px;vertical-align:middle;display:inline-block;width:18px;height:18px;background:url("../images/delete_icon.png") no-repeat;}

.middle_line_btn {margin-left:5px;vertical-align:middle;display:inline-block;font-size:1rem;line-height:30px;padding:0 20px;color:#222;border:1px solid #999;background:#fff;text-align:center;}
.dark_btn {margin-left:5px;vertical-align:middle;display:inline-block;font-size:1rem;line-height:40px;padding:0 20px;background:#2f323a;color:#fff;border-radius:5px;text-align:center;}

.cancel_btn {display:inline-block;padding:0 30px;line-height:40px;background:#fff;font-weight:500;font-size:1rem;color:#2f323a;border:1px solid #2f323a;border-radius:5px;}
.apply_btn {display:inline-block;padding:0 30px;line-height:40px;background:#2f323a;font-weight:500;font-size:1rem;color:#fff;border:1px solid #2f323a;border-radius:5px;}

/*어드민관리 보기,수정버튼*/
.small_btn {vertical-align:middle;display:inline-block;background:#fff;padding:0 10px;color:#444;font-size:0.875rem;line-height:26px;height:26px;border-radius:4px;border:1px solid #ccc;}
.small_btn.active {color:#076916;border:1px solid #074f12;}

.exel_down {display:inline-block;font-size:0.9375rem;color:#444;font-weight:400;text-align:center;line-height:40px;padding:0 15px;border:1px solid #ccc;border-radius:4px;}

.down_btn {display:inline-block;border-radius:5px;width:125px;line-height:40px;background:#068d0f;text-align:center;color:#fff;font-size:1rem;}
.down_btn i {display:inline-block;margin-left:5px;width:14px;height:14px;background:url("../images/download_icon.png") no-repeat;}

.reset_btn {display:inline-block;width:78px;height:26px;line-height:26px;border:1px solid #ccc;background:#fff;font-size:0.9375rem;color:#444;border-radius:3px;}
.reset_btn i {vertical-align:middle;display:inline-block;width:16px;height:16px;background:url("../images/reset_icon.png") no-repeat;margin-right:3px;}
.reset_btn.red {border:1px solid #e8493e;color:#e8493e;background:#fff;}
.reset_btn.red i {background:url("../images/reset_icon_red.png") no-repeat;}


/*파일첨부*/
.filebox input[type="file"] {position: absolute;width: 0;height: 0;padding: 0;overflow: hidden;border: 0;}
.filebox label { display: inline-block;width:35%;padding: 10px 0;text-align:center;color: #fff;vertical-align: middle;background-color: #555;cursor: pointer;height: 40px;margin-left: 10px;border-radius:4px;}
.filebox .upload-name {display: inline-block;height: 40px;padding: 0 10px;vertical-align: middle;border: 1px solid #dddddd;width:60%;color: #999999;border-radius:4px;}



/*텍스트박스*/
input[type="text"], input[type="password"]  {padding:0 10px;vertical-align:middle;height:40px;color:#2f323a;border-radius:5px;border:1px solid #2f323a;}

input[type="text"]::placeholder {color:#999;}
input[type="text"]:-ms-input-placeholder {color:#999;}
input[type="text"]::-ms-input-placeholder {color:#999;}
input[type="password"]::placeholder {color:#999;}
input[type="password"]:-ms-input-placeholder {color:#999;}
input[type="password"]::-ms-input-placeholder {color:#999;}

/*체크박스*/
input[type="checkbox"] {vertical-align:middle;}
.check_circle {display:none;}
.check_circle + label {cursor:pointer;margin:0 2px;vertical-align:middle;display:inline-block;width:22px;height:22px;background:url("../images/checkbox01.png") no-repeat 0 0;}
.check_circle:checked + label {background:url("../images/checkbox01_checked.png") no-repeat;}

.check_box {display:none;}
.check_box + label {cursor:pointer;margin:0 2px;vertical-align:middle;display:inline-block;width:15px;height:15px;background:url("../images/checkbox02.png") no-repeat 0 0;}
.check_box:checked + label {background:url("../images/checkbox02_checked.png") no-repeat;}




/*셀렉트박스*/
select {background:url("../images/select_arrow.png") no-repeat 95% 50% #fff;-o-appearance: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;vertical-align:middle;font-size:1rem;font-weight:500;height:40px;line-height:40px;padding:0 30px 0 15px;border-radius:5px;border:1px solid #2f323a;color:#2f323a;}
select::-ms-expand {display: none;}

.mt40 {margin-top:40px;}

/*어드민 전용 페이지 레이아웃*/
.wrap_admin {width:100%;min-width:1600px;}
/*레이아웃*/
.wrap {width:100%;min-width:375px;}
.header {z-index:99;position:fixed;width:100%;background:#fff;display:flex;flex-wrap:wrap;border-bottom:1px solid rgba(0,0,0,0.15);}
.header h1 {width:300px;height:80px;line-height:80px;background:#068d0f;text-align:center;}
.header h1 a img {vertical-align:middle;}
.header .root {flex:1 0 auto;text-align:left;font-size:1rem;line-height:80px;padding-left:40px;color:#222;}
.header .root strong {font-weight:700;}
.header .topbutton_wrap {flex:1 0 auto;text-align:right;padding-right:40px;line-height:80px;position:relative;}
.header .topbutton_wrap .top_button {vertical-align:middle;margin-left:5px;margin-top:-5px;}

.header .topbutton_wrap .notice_wrap {display:none;z-index:1000;position:absolute;top:75px;right:40px;width:440px;height:400px;background:#fff;border:1px solid #ddd;box-shadow:0 0 5px 5px rgba(0,0,0,0.05);border-radius:3px;}
.header .topbutton_wrap .notice_wrap h4 {position:relative;padding:0 20px;line-height:45px;text-align:left;border-bottom:1px solid #ddd;}
.header .topbutton_wrap .notice_wrap h4 .notice_del_btn {position:absolute;top:1px;width:50%;right:20px;text-align:right;}
.header .topbutton_wrap .notice_wrap h4 .notice_del_btn a {display:inline-block;font-size:0.875rem;color:#666;line-height:25px;padding:3px 17px;border:1px solid #ddd;}
.header .topbutton_wrap .notice_wrap  .notice_list {height:300px;overflow:auto;}
.header .topbutton_wrap .notice_wrap  .notice_list  ul  li {position:relative;width:100%;padding:20px;border-bottom:1px solid #ddd;}
.header .topbutton_wrap .notice_wrap  .notice_list  ul  li  h5 {width:60%;line-height:24px;color:#222;text-align:left;}
.header .topbutton_wrap .notice_wrap  .notice_list  ul  li  h5 > strong {font-weight:700;}
.header .topbutton_wrap .notice_wrap  .notice_list  ul  li .read_btn {position:absolute;width:40%;height:32px;line-height:32px;top:50%;right:20px;margin-top:-16px;text-align:right;}
.header .topbutton_wrap .notice_wrap  .notice_list  ul  li .read_btn a {display:inline-block;width:100px;height:32px;line-height:32px;text-align:center;border:1px solid #ddd;color:#666;}

.header .topbutton_wrap .notice_wrap .all_notice_view {border-top:1px solid #ddd;text-align:center;line-height:45px;}
.header .topbutton_wrap .notice_wrap .all_notice_view a {vertical-align:middle;color:#222;}
.contents_wrap {width:100%;padding-top:80px;}

.navi {z-index:100;position:fixed;top:80px;left:0;bottom:0;width:300px;background:#2f323a;}
.navi_scroll {height:100%;}
.navi .navi_inner {width:100%;position:relative;}
.navi .navi_inner > ul {padding-top:20px;}
.navi .navi_inner > ul > li {line-height:60px;}
.navi .navi_inner > ul > li > a {display:inline-block;width:100%;color:#aaaaaa;font-weight:500;font-size:1.125rem;line-height:60px;padding-left:40px;}
.navi .navi_inner > ul > li > ul  {padding:10px 0;}
.navi .navi_inner > ul > li > ul > li {line-height:36px;}
.navi .navi_inner > ul > li > ul > li > a {color:#97999d;font-size:1rem;font-weight:400;line-height:36px;padding-left:60px;font-weight:300;}
.navi .navi_inner > ul > li.active > a {background:url("../images/navi_acitve_bg.png") no-repeat top left,#21252f;color:#fff;}
.navi .navi_inner > ul > li > a:hover {background:url("../images/navi_acitve_bg.png") no-repeat top left,#21252f;color:#fff;}
.navi .navi_inner > ul > li.active > ul > li > a {color:#fff;}
.navi .navi_inner > ul > li.active > ul > li.active > a {color:#068d0f;}
.navi .navi_inner > ul > li > ul > li > a:hover {color:#068d0f;}

.navi .navi_inner dl {position:absolute;left:20px;bottom:30px;width:260px;}
.navi .navi_inner dl dt {line-height:55px;background:#068d0f;text-align:center;color:#fff;font-weight:500;font-size:1.125rem;border-radius:15px 15px 0 0;}
.navi .navi_inner dl dd {padding:20px;background:#21252f;border-radius: 0 0 15px 15px;}
.navi .navi_inner dl dd ul li {padding:10px 0;}
.navi .navi_inner dl dd ul li span {display:inline-block;width:48%;color:#909297;}
.navi .navi_inner dl dd ul li strong {display:inline-block;width:50%;text-align:right;color:#fff;font-weight:300;}
.navi .navi_inner dl dd ul li .progress {position:relative;overflow:hidden;width:100%;height:5px;background:#2f323a;margin-top:10px;}
.navi .navi_inner dl dd ul li .progress .bar {height:5px;}
.navi .navi_inner dl dd ul li .progress .line {position:absolute;height:5px;width:4px;top:0;z-index:3;margin-left:-2px;background:#21252f;}
.navi .navi_inner dl dd ul li .progress .line:nth-child(2) {left:25%;}
.navi .navi_inner dl dd ul li .progress .line:nth-child(3) {left:50%;}
.navi .navi_inner dl dd ul li .progress .line:nth-child(4) {left:75%;}


.wrap .contents {margin-left:300px;padding:40px;width:calc(100% - 300px);height:100%;}
.wrap_admin .contents {margin-left:300px;padding:40px;position:relative;width:calc(100% - 300px);}