@font-face { font-family: 'NanumSquareRound'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRound.woff') format('woff'); font-weight: normal; font-style: normal; }

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:400,500,700,900&display=swap&subset=korean');

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button,figure {margin:0;padding:0}
body,th,td,input,select,textarea,button {color:#222}

/* color값은 디자인가이드에 맞게사용 */
body *{line-height:1.3; font-family: 'Noto Sans KR', sans-serif; }
form{height:100%;}
dl,ul,ol,menu,li {list-style:none}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}
table {border-collapse: collapse;border-spacing: 0;}
body,html{height:100%;}
html{font-size: 16px;}
button{background:none; border:none; outline:none; cursor:pointer;}
input,select,button{box-sizing:border-box;}
a{color:#333; text-decoration: none;}
.clearfix:after{content:"";clear:both;display:block;}
.hidden_label{display:block; width:0 !important; height:0 !important; visibility:hidden; margin:0 !important; padding:0 !important;}
.screen_out {overflow:hidden;position:absolute;width:0;height:0;line-height:0;text-indent:-9999px}

/* 대체텍스트가 아닌 접근성을 위한 숨김텍스트를 제공할때 */


/****************/
/*** 공통 css ***/
/****************/

input[type=text], 
input[type=password]{-webkit-border-radius:0; -webkit-appearance:none;}
.content-max-box{width:100%; max-width: 1280px; margin:0 auto; box-sizing: border-box;}


/*********************/
/*** login-content ***/
/*********************/

.login-container{background-image: url(/Resources/Images/bg.png); width: 100%; min-width: 1280px; height: 100%; padding-top: 100px; box-sizing: border-box;}
.login-content{border:1px solid #D1D1D1; background:#FFF; width:500px; margin:0 auto; padding: 60px 40px; box-sizing: border-box; border-radius: 20px;}
.login-content h2.title{text-align: center; font-size: 47px; font-family: 'NanumSquare', sans-serif !important;}
.login-content strong{display: block; text-align: center; font-size: 37px; color: #000; font-weight: 300;}
.login-content .login-form-box{display:flex; align-items: center; justify-content: space-between; margin-top: 30px;}
.login-content .login-form-box .logo{width:170px;}
.login-content .login-form-box .input-box-div{display: flex; align-items: center; justify-content: space-between; width:320px;}
.login-content .login-form-box .input-box{width:170px;}
.login-content .login-form-box input{display:inline-block; width:100%; outline: none; border:1px solid #D1D1D1; background: #EEE; border-radius: 15px; padding: 6px 10px;}
.login-content .login-form-box input[type="text"]{margin-bottom: 10px;}
.login-content .login-form-box .login-btn{width: 80px; height: 80px; line-height: 80px; color: #FFF; background: #F87A00; text-align: center; border-radius: 80px;}
.login-content .err-txt{display:block; text-align: center; font-size: 11px; color: #F87A00;}
.err-txt2{display:block; text-align: center; font-size: 12px; margin-top: 15px; color:#444;}



/*************************/
/*** gnb-nav-container ***/
/*************************/

.gnb-nav-container{background:#FFF; height: 100px; width: 100%; display:flex; align-items: center; justify-content: space-between;}
.gnb-nav-container .logo-box{width:200px; margin-right:20px; text-align: center;}
.gnb-nav-container .menu-box{width: calc(100% - 700px);}
.gnb-nav-container .log-box{margin-right: 20px; width:440px;}


.gnb-nav-container .menu-box ul li{display: inline-block;}
.gnb-nav-container .menu-box ul li a{display:block; padding: 0 40px; border-right: 1px solid #DDDADA; line-height: 1; font-family: 'NanumSquare', sans-serif; font-weight: 700;}
.gnb-nav-container .menu-box ul li:last-child a{border-right: none;}
.gnb-nav-container .menu-box ul li a.active{color: #F77900;}

.gnb-nav-container .log-box{text-align: right;}
.gnb-nav-container .log-box .profile-name,
.gnb-nav-container .log-box .btn-box{display:inline-block; vertical-align: middle;}
.gnb-nav-container .log-box .profile-name{font-size: 12px; padding-right: 5px;}
.gnb-nav-container .log-box .btn-box .log-btn{background:#858585; color: #FFF; padding: 5px 15px; border-radius: 20px; display:flex; align-items: center; font-size: 12px;}
.gnb-nav-container .log-box .btn-box img{display: inline-block; padding-right: 5px;}



/**********************/
/*** todo-container ***/
/**********************/

.todo-container{width: 100%; min-width: 1280px; height: 100%;}
.todo-container .todo-section-box{background: #EEE; width:100%; height: calc(100% - 100px); padding-top: 10px; box-sizing: border-box;}
.todo-container .todo-section-box .content-max-box{height: 100%;}
.todo-container .todo-section-box .lnb-container{float:left; width:200px; height: 100%; max-height: 600px; background:#0676C2;}
.todo-container .todo-section-box .content-container{float:left; width: calc(100% - 200px); padding: 10px 20px 0 20px; box-sizing: border-box;}

.todo-container .todo-section-box .lnb-container .lnb-title{height: 55px; line-height: 55px; font-family: 'NanumSquare', sans-serif !important; color:#FFF; font-size: 16px; border-right: 4px solid #F77900; text-indent: 18px;}

.todo-container .todo-section-box .lnb-container ul li{border-bottom: 1px solid #056AAE;}
.todo-container .todo-section-box .lnb-container ul li a{display:block; width:100%; height:36px; line-height: 36px; text-align: center; display:flex; align-items: center; justify-content: space-between; padding: 0 20px; box-sizing: border-box; color:#FFF; font-size: 12px; opacity: 0.7;}
.todo-container .todo-section-box .lnb-container ul li img{display:inline-block; vertical-align: middle}
.todo-container .todo-section-box .lnb-container ul li a.active{background:#056AAE; opacity: 1;}
.todo-container .todo-section-box .lnb-container ul li a .txt{padding-left: 5px; }

.todo-container .todo-section-box .search-content{border:1px solid #D4D4D4; background:#E3E3E3; width:100%; padding: 14px 20px; box-sizing: border-box; border-radius:4px; }
.todo-container .todo-section-box .search-content.charge{border:none; background: none;}
.todo-container .todo-section-box .search-content > div{display: inline-block; vertical-align: middle;}
.todo-container .todo-section-box .search-content > div.radio-box input{position: relative; top: 3px;}
.todo-container .todo-section-box .search-content > div.radio-box label{margin-left: 0; padding-left: 5px;}
.todo-container .todo-section-box .search-content input[type="text"]{background:none; outline: none; border:none; max-width: 120px; font-size: 12px; display:inline-block; vertical-align:middle; height: 100%;}
.todo-container .todo-section-box .search-content label{padding: 0px 7px; margin: 0 10px; box-sizing: border-box; display:inline-block; border-radius: 4px; height: 25px; vertical-align:middle;} 
.todo-container .todo-section-box .search-content label.box{background:#FFF; }
.todo-container .todo-section-box .search-content label img{display:inline-block; vertical-align:middle;}
.todo-container .todo-section-box .search-content span{display:inline-block; font-size: 12px; vertical-align: middle;}
.todo-container .todo-section-box .search-content select{line-height: 1; min-width: 100px; font-size: 12px; display:block; width: 100%; height: 100%; padding-right: 17px; box-sizing: border-box; border:none; background: url('/Resources/Images/ico_select_down.png') no-repeat 99% 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.todo-container .todo-section-box .search-content select::-ms-expand {display: none;}
.todo-container .todo-section-box .search-content select:focus{background: url('/Resources/Images/ico_select_up.png') no-repeat 99% 50%;}
.todo-container .todo-section-box .search-content .select-btn-box{width: 100px; height: 25px; float: right;}
.todo-container .todo-section-box .search-content .select-btn-box a{display:block; width: 100%; height: 100%; line-height: 25px; background:#0676C2; color:#FFF; border-radius: 4px; text-align:center; font-size: 14px;}
.todo-container .todo-section-box .search-content.charge .charge-warning-box span{color: #F77900}
.todo-container .todo-section-box .search-content label.check{margin-left: 0; padding-left: 0;}
.todo-container .todo-section-box .search-content input.long{max-width: 265px; width: 265px;}

.todo-container .todo-section-box .excel-btn-box{margin:20px 0 10px 0; align-items:center; display:flexbox;}
.todo-container .todo-section-box .excel-btn-box.off{display: none;}
.todo-container .todo-section-box .excel-btn-box .btn{display:block; width:100px; height: 25px; line-height: 25px; color:#FFF; background: #858585; text-align: center; border-radius: 4px; font-size: 12px;}
.todo-container .todo-section-box .excel-btn-box .btn.sale-btn{margin-left: auto; background: #F77900;}

.todo-container .todo-section-box .date-table-content{border:1px solid #D4D4D4; border-radius:4px; overflow:hidden;}
.todo-container .todo-section-box .date-table-content table{width: 100%;}
.todo-container .todo-section-box .date-table-content table th{font-size: 14px; font-weight: 400; padding:12px 0; background: #EEECEC; border-right: 1px solid #D4D4D4; }
.todo-container .todo-section-box .sale-add-data-content table th{width: 20%;}
.todo-container .todo-section-box .sale-status-data-content table th{width: 12.5%;}
.todo-container .todo-section-box .sale-detail-data-content table th{width: 25%;}
.todo-container .todo-section-box .charge-data-content table th{width: 33.33%;}
.todo-container .todo-section-box .sale-charge-data-content table th{width: 25%;}

.todo-container .todo-section-box .date-table-content table th:last-child{border-right: 0;}
.todo-container .todo-section-box .date-table-content table tbody tr{width:100%;}
.todo-container .todo-section-box .date-table-content table tbody td{background: #FFF; text-align: center; color: #666; padding:12px 0; font-size: 13px; border-right: 1px solid #D4D4D4;}
.todo-container .todo-section-box .date-table-content table tbody td:last-child{border-right: 0;}
.todo-container .todo-section-box .date-table-content table tbody td a{color: #0676c2; text-decoration: underline;}
.todo-container .todo-section-box .date-table-content table tbody.data-ok tr:nth-child(even) td{background: #e9e9ef;}

.todo-container .todo-section-box .pagination-content{margin-top: 20px; text-align: center;}
.todo-container .todo-section-box .pagination-content ul li{display:inline-block;}
.todo-container .todo-section-box .pagination-content ul li a{display:inline-block; font-size: 14px; padding: 0 3px; color: #A5A5A5; vertical-align: middle;}
.todo-container .todo-section-box .pagination-content ul li a.active{color: #0676C2}
.todo-container .todo-section-box .pagination-content ul li a img{display:inline-block;}

.off{display: none;}


/*****************/
/*** layer popup-box ***/
/*****************/
.parking-popup-content .popup-content{max-width: 500px;}
.sale-popup-content .popup-content{max-width: 300px;}

.popup-box{position:fixed; left: 0; top:0; width: 100%; height: 100%; background:rgba(0,0,0,0.7); display:none;}
.popup-box .popup-content{position: absolute; width: 100%; left: 50%; top: 50%; transform: translate(-50% , -50%); border-radius: 4px; background-image: url(/Resources/Images/popup_pattern.png); padding:20px; box-sizing: border-box;}
.popup-box.active{display:block;}
.popup-box h2{text-align: center; padding: 10px 0; box-sizing: border-box; color:#FFF; font-size: 24px; font-weight: 400;}

.parking-popup-content .parking-popup-close{position: absolute; top: 20px; right: 10px; width: 20px; height: 20px;}
.parking-popup-content .parking-popup-close span{display:block; width: 100%; height: 2px; background: #FFF; position: absolute; left: 0; top: 50%; margin-top: -1px; }
.parking-popup-content .parking-popup-close span.line1{transform: rotate(45deg)}
.parking-popup-content .parking-popup-close span.line2{transform: rotate(-45deg)}

.popup-box .parking-popup-table{background: #FFF; padding: 20px; box-sizing: border-box; border-radius: 4px; margin-top: 20px;}
.popup-box .parking-popup-table table{width:100%;}
.popup-box .parking-popup-table table th{text-align: left; width: 105px; font-size: 14px; color: #000; font-weight: 500;}
.popup-box .parking-popup-table table td{padding: 15px 0; box-sizing: border-box; color: #858585; font-size: 14px; font-weight: 400;}

.popup-box .parking-popup-table .sale-select select{border:1px solid #D4D4D4; border-radius: 4px; padding: 3px 20px 3px 5px; font-size: 14px; margin-right: 5px; box-sizing: border-box; background: url('/Resources/Images/ico_select_down.png') no-repeat 95% 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.popup-box .parking-popup-table .sale-select select::-ms-expand {display: none;}
.popup-box .parking-popup-table .sale-select a{display:inline-block; padding: 4px 5px; background: #0676C2; color:#FFF; border-radius: 4px; cursor: pointer;}

.popup-box .parking-popup-table .sale-status th{padding-top: 15px;}
.popup-box .parking-popup-table .sale-status th,
.popup-box .parking-popup-table .sale-status td{vertical-align:top;}
.popup-box .parking-popup-table .sale-status td ul li{padding-bottom: 3px;}
.popup-box .parking-popup-table .sale-status td ul li .status-close-btn{display:inline-block; width: 15px; height: 15px; margin-left: 5px; background:#0676C2; vertical-align:middle; position: relative;}
.popup-box .parking-popup-table .sale-status td ul li .status-close-btn span{position: absolute; left: 0; top:50%; width:100%; height:1px; background: #FFF; margin-top: -0.5px;}
.popup-box .parking-popup-table .sale-status td ul li .status-close-btn span.line1{transform: rotate(45deg);}
.popup-box .parking-popup-table .sale-status td ul li .status-close-btn span.line2{transform: rotate(-45deg);}

.popup-box .popup-close-btn-box{position: absolute; top: 10px; right: 10px; width: 20px; height: 20px;}
.popup-box .popup-close-btn-box a{display: block; width: 100%; height: 100%;}
.popup-box .popup-close-btn-box span{display:block; width: 100%; height: 2px; background: #FFF; position: absolute; left: 0; top: 50%; margin-top: -1px; }
.popup-box .popup-close-btn-box span.line1{transform: rotate(45deg)}
.popup-box .popup-close-btn-box span.line2{transform: rotate(-45deg)}

.popup-box .sale-popup-form-box{background: #FFF; padding:10px; box-sizing: border-box; border-radius: 4px;}
.popup-box .sale-popup-form-box table{width:100%;}
.popup-box .sale-popup-form-box tr{}
.popup-box .sale-popup-form-box th{text-align: left; width: 85px; font-size: 14px; color: #000; font-weight: 500;}
.popup-box .sale-popup-form-box td{padding: 10px 0; box-sizing: border-box; color: #858585; font-size: 14px; font-weight: 400;}
.popup-box .sale-popup-form-box td select {width: 100%; padding: 3px 10px; outline: none; border: 1px solid #D4D4D4; background: url('/Resources/Images/ico_select_down.png') no-repeat 95% 50%; border-radius: 4px; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.popup-box .sale-popup-form-box td select select::-ms-expand {display: none;}
.popup-box .sale-popup-form-box td input[type="text"]{border:1px solid #D4D4D4; outline: none; border-radius: 4px; padding: 3px 10px;}

.popup-box .sale-popup-btn-box{display: flex; align-items: center; justify-content:space-between; margin: 20px 0;}
.popup-box .sale-popup-btn-box a{display:inline-block; font-size: 14px; width: 110px; height: 35px; line-height: 35px; border-radius:4px; box-sizing: border-box; margin:0 9px; text-align: center;}
.popup-box .sale-popup-btn-box a.parking-popup-ok-btn{background: #0676C2; color: #FFF; margin-left: 0;}
.popup-box .sale-popup-btn-box a.parking-popup-close{background:#FFF; margin-right:0;}


/******************/
/*** datepicker ***/
/******************/
.ui-widget.ui-widget-content{border:none; box-shadow: 0 0 10px rgba(0,0,0,0.2); border-radius: 0;}
.ui-widget-header{background: none; border:none;}

.ui-state-default, 
.ui-widget-content .ui-state-default, 
.ui-widget-header .ui-state-default, 
.ui-button, 
html .ui-button.ui-state-disabled:hover, 
html .ui-button.ui-state-disabled:active{background: none; border:none; text-align: center; color: #929292;}

.ui-state-active, 
.ui-widget-content .ui-state-active, 
.ui-widget-header .ui-state-active, 
a.ui-button:active, 
.ui-button:active, 
.ui-button.ui-state-active:hover{background: #ff9900; color: #FFF;}

.ui-state-highlight, 
.ui-widget-content .ui-state-highlight, 
.ui-widget-header .ui-state-highlight{color: #929292;}
.ui-datepicker .ui-datepicker-prev{left: 5px;}
.ui-datepicker .ui-datepicker-next{right: 5px;}
.ui-datepicker .ui-datepicker-next, 
.ui-datepicker .ui-datepicker-prev{height: 20px; top: 50%; transform: translateY(-50%); width:20px; }
.ui-datepicker .ui-datepicker-next:hover, 
.ui-datepicker .ui-datepicker-prev:hover{background: transparent; border:none;}
.ui-icon-circle-triangle-w,
.ui-icon-circle-triangle-e{background-image: none !important; border-top: 7px solid transparent; border-bottom: 7px solid transparent; cursor: pointer; height: 0; width: 0;}
.ui-icon-circle-triangle-w{border-right: 10px solid #000;}
.ui-icon-circle-triangle-e{border-left: 10px solid #000;}
.ui-icon-circle-triangle-w:hover,
.ui-icon-circle-triangle-e:hover{opacity: 0.8;}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span{margin-left: 0; margin-top: 0; transform: translate(-50% ,-50%);}


/*******************************/
/*** password-modify-content ***/
/*******************************/

.content-container.password{height: 100%; display: flex; align-items: flex-start; justify-content: center; padding-top: 90px !important; }
.password-modify-content{max-width: 500px; width: 100%; padding: 15px; border:2px solid #D1D1D1; box-sizing: border-box; border-radius: 10px; background: #FFF;}
.password-modify-content .text-content{width: 300px; margin:0 auto;}
.password-modify-content .text-content ul li{margin-bottom: 10px;}
.password-modify-content .text-content ul li label,
.password-modify-content .text-content ul li input{display: inline-block; vertical-align: middle;}
.password-modify-content .text-content ul li label{font-size: 12px; padding-right: 5px; width: 30%; box-sizing: border-box;}
.password-modify-content .text-content ul li input{width: 65%; box-sizing: border-box; outline: none; border-radius: 15px; background: #EEE; border:1px solid #D1D1D1; font-size: 12px; padding: 5px;}
.password-modify-content .text-content .chang-password-btn{display: block; text-align: center; width: 100%; padding: 10px 0; background: #F87A00; color: #FFF; font-size: 14px; border-radius: 20px;}
.password-modify-content .password-warning{display:block; text-align: center; font-size: 12px; color:#444; margin-top: 20px;}
.password-modify-content .password-warning2{display:block; text-align: left; font-size: 12px; color:#444; margin-top: 20px;}


/******************************/
/*** popup-window-container ***/
/******************************/
.popup-window-container{width: 100%; height: 100%; background:rgba(0,0,0,0.7); position: relative;}
.popup-window-container .popup-content{position: absolute; width: 100%; left: 50%; top: 50%; transform: translate(-50% , -50%); border-radius: 4px; background-image: url(/Resources/Images/popup_pattern.png); padding:20px; box-sizing: border-box; max-width: 95%;}
.popup-window-container h2{text-align: center; padding: 10px 0; box-sizing: border-box; color:#FFF; font-size: 24px; font-weight: 400;}
.popup-window-container .popup-back{background: #FFF; padding: 20px; box-sizing: border-box; border-radius: 4px; margin-top: 20px;}

.popup-window-container .popup-close-btn-box{position: absolute; top: 10px; right: 10px; width: 20px; height: 20px;}
.popup-window-container .popup-close-btn-box a{display: block; width: 100%; height: 100%;}
.popup-window-container .popup-close-btn-box span{display:block; width: 100%; height: 2px; background: #FFF; position: absolute; left: 0; top: 50%; margin-top: -1px; }
.popup-window-container .popup-close-btn-box span.line1{transform: rotate(45deg)}
.popup-window-container .popup-close-btn-box span.line2{transform: rotate(-45deg)}

.popup-window-container .popup-content table{width:100%;}
.popup-window-container .popup-content tr{}
.popup-window-container .popup-content th{text-align: left; width: 100px; font-size: 14px; color: #000; font-weight: 500;}
.popup-window-container .popup-content td{padding: 10px 0; box-sizing: border-box; color: #858585; font-size: 14px; font-weight: 400;}
.popup-window-container .popup-content td select { padding: 3px 10px; outline: none; border: 1px solid #D4D4D4; background: url('/Resources/Images/ico_select_down.png') no-repeat 99% 50%; border-radius: 4px; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.popup-window-container .popup-content td select select::-ms-expand {display: none;}
.popup-window-container .popup-content td input[type="text"]{border:1px solid #D4D4D4; outline: none; border-radius: 4px; padding: 3px 10px;}

.popup-window-container .sale-popup-btn-box{margin: 20px 0; text-align: center;}
.popup-window-container .sale-popup-btn-box a{display:inline-block; font-size: 14px; width: 110px; height: 35px; line-height: 35px; border-radius:4px; box-sizing: border-box; margin:0 9px; text-align: center;}
.popup-window-container .sale-popup-btn-box a.parking-popup-ok-btn{background: #0676C2; color: #FFF; margin-left: 0;}
.popup-window-container .sale-popup-btn-box a.parking-popup-close{background:#FFF; margin-right:0;}

.popup-window-container .sale-popup-form-box td a{display:inline-block; padding: 4px 5px; background: #0676C2; color:#FFF; border-radius: 4px; cursor: pointer;}
.popup-window-container .sale-popup-form-box .sale-status td{vertical-align:top;}
.popup-window-container .sale-popup-form-box .sale-status td ul li{padding-bottom: 3px;}
.popup-window-container .sale-popup-form-box .sale-status td ul li .status-close-btn{display:inline-block; width: 15px; height: 15px; margin-left: 5px; background:#0676C2; vertical-align:middle; position: relative;}
.popup-window-container .sale-popup-form-box .sale-status td ul li .status-close-btn span{position: absolute; left: 0; top:50%; width:100%; height:1px; background: #FFF; margin-top: -0.5px;}
.popup-window-container .sale-popup-form-box .sale-status td ul li .status-close-btn span.line1{transform: rotate(45deg);}
.popup-window-container .sale-popup-form-box .sale-status td ul li .status-close-btn span.line2{transform: rotate(-45deg);}