@charset "utf-8";

@import url(./reset.css);

/* 공통 요소 */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@font-face {
  font-family:'Pretendard';
  src:url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
  font-weight:400;
  font-style:normal;
}

@font-face {
  font-family:'Pretendard';
  src:url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
  font-weight:500;
  font-style:normal;
}

@font-face {
  font-family:'Pretendard';
  src:url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
  font-weight:700;
  font-style:normal;
}

:root {
  --black:#121212;
  --white:#fff;
  --gray10:#F8F8F8;
  --gray:#888;
  --primary90:#129295;
  --primary80:#269681;
  --primary70:#399A6D;
  --primary60:#4D9D59;
  --primary50:#68A24E;
  --primary40:#8CA64C;
  --primary30:#B1AB4A;
  --primary20:#D5AF48;
}
.blind {overflow:hidden;clip:rect(1px, 1px, 1px, 1px);position:absolute !important;width:1px;height:1px;}

.contents .btn_area{display:flex;gap:20px;align-items:center;justify-content:center;margin-top:50px}
.contents .btn_area .hc_btn_primary{min-width: 100px;}
.hc_btn_primary{display:flex;justify-content:center;align-items:center;background:var(--gray10);border-radius:4px;color:#78797d;box-sizing:border-box;padding:0 12px}
.hc_btn_primary.border{border:1px solid #999;color:#555}
.hc_btn_primary.black{background:var(--black);color:var(--gray10);}
.hc_btn_primary.primary{background:var(--primary90);color:var(--gray10);}
.hc_btn_primary.danger{background:#d9534f;color:var(--gray10);}
.hc_btn_primary.danger:hover{background:#c9302c;}
.hc_btn_primary.info{background:#3b82f6;color:var(--gray10);}
.hc_btn_primary.info:hover{background:#2563eb;}


.hc_btn_primary.size_xs{height:24px;font-size:14px;padding:0 10px}
.hc_btn_primary.size_s{height:30px;font-size:14px}
.hc_btn_primary.size_m{height:36px;font-size:14px;padding:0 20px;}
.hc_btn_primary.size_l{height:46px;font-size:16px;font-weight:700}


.wrap{margin:0 auto;}
header,.contents{min-width: 1200px;}
.contents{margin:48px auto 184px;max-width:1200px;min-height:900px;box-sizing:border-box;}
/* .contents{margin:10px auto 84px;max-width:1200px;min-height:900px;box-sizing:border-box;} */
.contents.compact{width:700px;min-width:700px}
.contents.print{margin:40px auto}

header .inner{position:relative;display:flex;justify-content:space-between;align-items:center;max-width:1920px;height:72px;padding:0 40px;margin:0 auto;box-sizing:border-box;}
header .header_logo{width:232px;height:44px;}
header .header_logo a{display:block}
header .header_logo img{width:100%;height:100%;}
header .header_user{display:flex;align-items:center;}
header .header_user_txt{font-size:12px;color:#78797d;margin-right:14px;}
header .top_menu {display:flex;gap:8px}
header .top_menu .btn_line{display:flex;justify-content:center;align-items:center;height:36px;padding:0 20px;background:#f8f8f8;border-radius:4px;color:#78797d;box-sizing:border-box;border:1px solid #e8e8e8;font-size:14px;font-weight:500;}
header .top_menu .btn_line:hover{border-color:#999;color:#555}
header .top_menu .btn_black{display:flex;justify-content:center;align-items:center;height:36px;padding:0 20px;background:#121212;color:var(--white);border:none;border-radius:4px;box-sizing:border-box;font-size:14px;font-weight:500;}
header .top_menu .btn_black:hover{background:var(--primary90)}
header .top_menu .btn_remote{display: block;width:140px;height:38px;background: url(../images/btn_remote.png) 0 / 140px auto no-repeat;}
.header_gnb{height:100%;}
.header_gnb .gnb_list{display:flex;gap:50px;align-items:center;}
.header_gnb .gnb_list .depth1_link {display:block;height:100%;font-size:16px;font-weight:700;color:#121212;line-height:69px;box-sizing:border-box;border-bottom:3px solid transparent;}
.header_gnb .gnb_list .gnb_item{height:100%;line-height:72px;}
.header_gnb .gnb_list .gnb_item .depth2_box{display:none;position:absolute;top:72px;left:0;width:100%;background-color:#f8f8f8;} 
.header_gnb .gnb_list .gnb_item .depth2_box .gnb_depth2{height:48px;display:flex;justify-content:center;align-items:center;}
.header_gnb .gnb_list .gnb_item .depth2_box .gnb_depth2 .depth2_link{display:block;padding:0 15px;font-size:14px;color:#888}
.header_gnb .gnb_list .gnb_item .depth2_box .gnb_depth2_item.active .depth2_link{color:#333}

.header_gnb .gnb_list .gnb_item.active .depth1_link,
.header_gnb .gnb_list .depth1_link:hover{color:var(--primary90);border-bottom:3px solid var(--primary90);}
.header_gnb .gnb_list .gnb_item.active .depth2_box,
.header_gnb .gnb_list .gnb_item:hover .depth2_box{display:block;}

/* gnb_dropdown: 부모 메뉴 바로 아래로 세로 드롭다운 (세션·로그 등) */
.header_gnb .gnb_list .gnb_item.gnb_dropdown{position:relative;}
.header_gnb .gnb_list .gnb_item.gnb_dropdown .depth2_box{left:0;width:auto;min-width:160px;box-shadow:0 2px 6px rgba(0,0,0,0.08);}
.header_gnb .gnb_list .gnb_item.gnb_dropdown .depth2_box .gnb_depth2{flex-direction:column;align-items:stretch;justify-content:flex-start;height:auto;padding:6px 0;}
.header_gnb .gnb_list .gnb_item.gnb_dropdown .depth2_box .gnb_depth2 .gnb_depth2_item{width:100%;line-height:1.4;}
.header_gnb .gnb_list .gnb_item.gnb_dropdown .depth2_box .gnb_depth2 .depth2_link{display:block;padding:10px 18px;white-space:nowrap;}

footer {background:#f8f8f8;border-top:1px solid #e8e8e8;}
footer .inner{display:flex;justify-content:center;align-items:center;max-width:1182px;height:64px;margin:0 auto;box-sizing:border-box;}
footer .inner .copyright{color:#888;font-size:14px;}
footer .inner .footer_link{display:flex;gap:10px;}
footer .inner .footer_link a{display:block;height:36px;box-sizing:border-box;padding:0 10px;background:var(--primary90);color:var(--gray10);border-radius:4px;line-height:36px;}  
.main footer .inner{justify-content:space-between;}

/* 인풋 공통 */
.item_row{display: flex;align-items: center;gap:10px}
.item_row .ipt_box{width:218px}
.item_row .ipt_select select{width:auto}
.btn_type .ipt_box{flex:1}

.ipt_box{border:1px solid #e6e6e6;border-radius:4px;overflow:hidden;}
.ipt_box input[type=text],
.ipt_box input[type=number],
.ipt_box input[type=password]{border:none;padding:14px 20px;width:100%;box-sizing:border-box;font-size:14px;color:#121212}
.ipt_box input[type=text]::placeholder,
.ipt_box input[type=number]::placeholder,
.ipt_box input[type=password]::placeholder{color:#adb5bf}
.ipt_box.size_s input{padding:0 10px;height:30px}

.text_area_box {height:92px;border:1px solid #e6e6e6;border-radius:4px;overflow:hidden;}
.text_area_box textarea{width:100%;height:100%;font-size:14px;color:#121212;line-height: 18px;}

.user_html .text_area_box{height:240px}
.user_html .hc_btn_primary{margin:20px auto 0}

.ipt_chk input[type=checkbox]{width:16px;height:16px;cursor:pointer;background:url(../images/ico_chk_16.png) 0 / 100% no-repeat;}
.ipt_chk input[type=checkbox]:checked{background:url(../images/ico_chk_16_checked.png) 0 / 100% no-repeat;}
.ipt_chk:has(.lbl){display:flex;gap:10px;}
.ipt_chk .lbl{color:#121212;font-weight:500;font-size:14px;line-height:16px;}


.ipt_box.btn_type{display:flex;align-items:center;gap:8px;padding:8px;background-color:var(--white);box-sizing:border-box;height:46px}
.ipt_box.btn_type.size48{height:48px;}
.ipt_box.btn_type input[type=text]{flex:1;padding:0;}
.ipt_box.btn_type .hc_btn_primary.size_s{padding:0 18px}
.ipt_box.btn_type .hc_btn_primary.size_xs{width:100px}
/* 로그인 */
.login_wrap{position:relative;height:100vh;}
.login_box{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;width:700px;border-radius:20px;box-sizing:border-box;box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.15);}
.login_box .img_login{width:400px;height:400px}
.login_box .form_box{padding:67px 40px;box-sizing:border-box;width:300px;}
.login_box .form_box h1{font-size:32px;font-weight:700;color:var(--primary90)}
.login_box .form_box .form_area{margin-top:20px}
.login_box .form_box .form_area li{display:flex;gap:10px;align-items:center;}
.login_box .form_box .form_area li::before{content:"";display:block;width:24px;height:24px;}
.login_box .form_box .form_area li.id_item::before{background:url('../images/ico_user.png') 0 / 24px no-repeat;}
.login_box .form_box .form_area li.pw_item::before{background:url('../images/ico_password.png') 0 / 24px no-repeat;}
.login_box .form_box .form_area li +li {margin-top:10px}
.login_box .form_box .hc_btn_primary{margin-top:20px;width:100%;box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.15);}

.free_footer{position:fixed;bottom:0;left:0;width:100%;height:64px;background:#f8f8f8;border-top:1px solid #e8e8e8;z-index:100;}
.free_footer .free_copyright{max-width:1920px;margin:0 auto;height:64px;line-height:64px;text-align:center;color:#888;font-size:14px;}

.page_title{height:120px;line-height:120px;text-align:center;color:#121212;font-weight:700;font-size:48px}
.search_box{display:flex;align-items:center;justify-content:flex-end;gap:4px;padding:10px 15px}
.ipt_select select,
.search_box .search_select,
.search_box .search_input{border:1px solid #000;border-radius:2px;height:20px;box-sizing:border-box;padding:0 4px;color:#121212;font-size:14px;font-weight:500;}
.search_box .search_select{padding-right: 18px;}
.ipt_select select,
.search_box .hc_btn_primary{width:80px;}
.search_box .search_input{width:130px;}
.search_box .search_select,
.ipt_select select{background:url(../images/ico_search_select.png) right 4px top 50% / 10px auto no-repeat;}
.ipt_select select{padding-right:20px}
.search_box strong{font-size: 14px;color:#121212;font-weight:700;}

.search_box.type02{gap:10px;padding:10px 0}
.search_box.type02 .search_select{height: 30px;padding:0 34px 0 10px}
.search_box.type02 .search_input{height: 30px;}

.tbl_type01 table{width:100%;}
.tbl_type01 tr th{border-top:1px solid #e6e6e6;background:#f8f8f8;font-size:14px;color:#000;font-weight:700;text-align:center;line-height:40px;box-sizing:border-box;}
.tbl_type01 tr td{border-top:1px solid #e6e6e6;padding:12px 0;text-align:center;font-size:14px;color:#000;vertical-align: middle;}
.tbl_type01 tr td .hc_btn_primary{margin:0 auto}
.tbl_type01 tr td .status.color_red{color:#f1151a}
.tbl_type01 tr td .status.color_blue{color:#0009B9}
.tbl_type01 tr td .txt{text-align:center;font-size:14px;color:#000;line-height:20px}
.tbl_type01 tr td .txt + button{margin-top:1px}
.tbl_type01 tr:last-child td{border-bottom:1px solid #e6e6e6}
.tbl_type01.last_left td:last-child{text-align: left;}
.tbl_type01.error_type td{padding:15px 10px}
.tbl_type01.error_type .hc_btn_primary{min-width:100px}
.tbl_type01:has(.btn_all_chk) + .page_box{margin-top:0}

.tbl_type02 table{width:100%;}
.tbl_type02 thead{border-top:1px solid #121212}
.tbl_type02 thead tr th{background:#fafafa;font-size:14px;color:#121212;font-weight:700;text-align:center;height:48px;box-sizing: border-box;vertical-align: middle;}
.tbl_type02 tbody tr td{border-top:1px solid #e8e8e8;height:48px;padding:10px;text-align:center;font-size:14px;color:#121212;vertical-align: middle;box-sizing: border-box;}
.tbl_type02 tfoot tr th, 
.tbl_type02 tfoot tr td{border-top:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;background:#fafafa;font-size:14px;color:#121212;font-weight:700;text-align:center;height:48px;box-sizing: border-box;vertical-align: middle;}

.tbl_type03 table{width:100%;}
.tbl_type03 tr th{border-top:1px solid #e6e6e6;background:#f8f8f8;font-size:14px;color:#000;font-weight:700;text-align:center;height:40px;box-sizing: border-box;vertical-align: middle;}
.tbl_type03 tr td{border-top:1px solid #e6e6e6;height:40px;padding:10px;text-align:left;font-size:14px;color:#000;vertical-align: middle;box-sizing: border-box;}
.tbl_type03 tr:last-child th,
.tbl_type03 tr:last-child td{border-bottom:1px solid #e6e6e6}


[class^="tbl_"] .btn_all_chk{display:flex;height:40px;align-items:center;}
.page_box{display:flex;align-items:center;justify-content:center;height:40px;margin-top:40px}
.page_box button{width:24px;height:24px}
.page_box .page{color:#000;font-size:14px;font-weight:500;}
.page_box .page.active{background:var(--primary90);color:var(--white);padding:2px;border-radius:50%}
.page_box [class^="btn_"]{font-size:0;}
.page_box .btn_prev{background:url(../images/btn_prev.png) 50% 50% / 24px auto no-repeat;}
.page_box .btn_prev.btn_group{background:url(../images/btn_group_prev.png) 50% 50% / 24px auto no-repeat;}
.page_box .btn_next{background:url(../images/btn_next.png) 50% 50% / 24px auto no-repeat;}
.page_box .btn_next.btn_group{background:url(../images/btn_group_next.png) 50% 50% / 24px auto no-repeat;}


.edit_section .option_toggle{display:flex;justify-content:center;align-items:center;width:100%;height:46px;background:#f8f8f8;border-top:1px solid #e6e6e6;box-sizing:border-box;text-align:center;font-size:14px;color:#000;font-weight:500;}
.edit_section .option_toggle span::after{content:"";width:20px;height:15px;margin:2px auto 0;box-sizing:border-box;display:block;background:url(../images/btn_toggle.png) 0 / 15px auto no-repeat;transform: rotateX(-180deg);}
.edit_section .option_toggle.active span::after{transform: rotateX(0);}
.edit_section .toggle_con{display:none;}
.edit_section .toggle_con.active{display:block;}

.edit_section ~ .edit_section{margin-top:40px}
.edit_section .toggle_con .form_list{margin-top:20px;}
.edit_section .form_list li ~ li{margin-top:20px}
.edit_section .form_list li strong{display:block;font-size:14px;color:#121212;font-weight:700;margin-bottom:10px;}
.edit_section .form_list .select_btn{display:flex;gap:10px;}
.edit_section .form_list .select_btn .hc_btn_primary {width:100px}
.edit_section .form_list .ip_range{display:flex;align-items:center;gap:10px;box-sizing:border-box;}
.edit_section .form_list .ip_range .ipt_box{width:210px;}
.edit_section .form_list .ip_range .ex_txt{ font-size:14px;color:#adb5bf;font-weight:500;text-wrap:nowrap;}
.edit_section .form_list .item_row .filter_actions .hc_btn_primary{width:auto}
.edit_section .form_list .form_txt{height:46px;line-height: 46px;color:#121212;font-weight: 500;}
.edit_section .form_actions{display: flex;align-items: center;justify-content: center;gap:10px; margin-top:20px}
.edit_section .form_actions.form_web{margin-top:40px}
.edit_section .form_actions button{width:110px;}

.edit_section .ip_form_list{margin-top:40px}
.edit_section .ip_form_list li{display: flex;gap:20px;align-items: center;}
.edit_section .ip_form_list li .lbl{font-size:20px;font-weight:500;width:97px}
.edit_section .ip_form_list li .ipt_box{flex:1}
.edit_section .ip_form_list li ~ li{margin-top:40px}

/* 통계 */

.stats_filter{display: flex;align-items: flex-end;justify-content: space-between;gap:180px;padding:10px 0}
.stats_filter .filter_list{display: flex;flex-wrap: wrap;gap:0 10px}
.stats_filter .filter_list .filter_item{display: flex;align-items: center;gap:10px;padding:5px 0}
.date_range{display: flex;align-items: center;gap:10px}
.stats_filter .filter_actions{display: flex; gap:10px;}
.stats_filter .ipt_select select{border:1px solid #e6e6e6;border-radius:2px;width:auto;height:30px;box-sizing:border-box;padding:0 4px;color:#121212;font-size:14px;font-weight:500;padding-right:30px;background:url(../images/ico_select_arr_24.png) right 4px top 50% / 24px auto no-repeat;}
.stats_filter .form_actions{display: flex;gap:10px;padding:5px 0}
.stats_filter .form_actions button{width:100px;}
.stats_filter .hc_btn_primary{font-weight:700;}
.stats_filter .hc_btn_primary.primary.border{color:var(--gray10)}
.stats_filter .hc_btn_primary.border{color:#000;border:1px solid #E6E6E6}


.stats_report_box{margin-top:40px}
.stats_report_box{padding:20px 0;  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.15);border-radius:20px;}
.stats_report_box .report_header{text-align: center;}
.stats_report_box .report_header .report_tit,
.stats_report_box .report_header .txt_period{display: block;color:#121212;font-size:16px;font-weight:700;line-height: 39px;}
.stats_report_box .report_chart{width:1060px;margin:0 auto}

.report_detail {margin-top:40px;}
.report_detail .btn_more{display: block;}
.report_detail .btn_more span {display: flex;justify-content: center;gap:10px;color:#121212;font-size:20px;font-weight:500;line-height: 24px;}
.report_detail .btn_more span::after{content: "";width:24px;height:24px;box-sizing: border-box;display: block;background: url(../images/btn_toggle.png) 0 / 15px auto no-repeat;transform: rotateX(-180deg)}
.report_detail .btn_more.active span::after{transform: rotateX(0);}
.report_detail .toggle_con{margin-top:16px;display: none;}
.report_detail .toggle_con.active{display:block;}


.pop_wrap{width:600px;padding:20px 20px 46px;box-sizing: border-box;}
.pop_remote .title{text-align: center;font-size:20px;font-weight:500;color:#121212;padding:10px 0;}
.pop_remote .tbl_type03{margin-top:20px}
.pop_remote .btn_area{display: flex;justify-content: center; margin-top:20px;}
.pop_remote .btn_area .hc_btn_primary{width:100px}


.print .report_header{text-align: left;}
.print .report_header .report_tit,
.print .report_header .txt_period{display: block;color:#121212;font-size:16px;font-weight:700;line-height: 39px;}
.print .stats_report_box{margin-top:60px}
.print .stats_report_box{box-shadow: none;}



