@charset "UTF-8";



/*--------------------------------------------------- ALIGN ---------------------------*/
.txt-left{text-align:left !important;}
.txt-right{text-align:right !important;}
.txt-center{text-align:center !important;}



/*--------------------------------------------------- TABLE ---------------------------*/
/*---- 공통 ----*/
table th,
table td{line-height:1.14;}
table th{font-weight:700;}

.tbl-tit{flex:none; font-size:15px; font-weight:700; margin-bottom:10px;}
.tbl-link{color:#0b5daf; font-weight:700;}
.tbl-link.txt-left{padding-left:20px; padding-right:20px;}


/*---- colgroup ----*/
.col-xs{width:5%;}
.col-ss{width:9.5%;}
.col-s{width:11%;}
.col-m{width:14%;}
.col-l{width:16%;}
.col-xl{width:19%;}
.col-2xl{width:21.5%;}
.col-3xl{width:23%;}

.col-client{width:12%;}/* 고객사 */
.col-date{width:10%;}/* 접수일 */

.col-view{width:13%}
.col-view__title{width:56%;}

@media screen and (max-width:1023px){
    .col-xs{width:7%;}
    .col-ss{width:13%;}
    .col-client{width:17%;}
}

@media screen and (max-width:767px){
    .col-ss{width:15%;}
    .col-client{width:19%;}
}


/*---- pagination ----*/
.pagination{display:flex; align-items:center; justify-content:center; margin-top:30px;}
.pagination a{width:32px; height:32px; line-height:30px; border:1px solid #51575d; border-radius:6px; margin:0 3px; text-align:center; background:no-repeat 50%;}
.pagination a.current{background-color:#51575d; color:#fff;}
.pagination a.pagi__prev{background-image:url(../../images/cmn/ico_tbl_prev.svg); margin:0 9px 0 0;}
.pagination a.pagi__next{background-image:url(../../images/cmn/ico_tbl_next.svg); margin:0 0 0 9px;}

.pagi-wrap{position:relative;}
.pagi-wrap button{position:absolute; top:-2px; right:0; height:36px; border-radius:6px;}


/*---- 게시판 :: 유틸 ----*/
.tbl-util{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:16px;}
.tbl-util div{display:flex; align-items:center;}
.tbl-util select,
.tbl-util button,
.tbl-util input[type="search"]{height:38px; border-radius:3px;}

.tbl-util--right{justify-content:flex-end !important;}

.tbl-util > button{height:32px; border-radius:6px; font-size:14px; margin-bottom:-4px;}

.tbl-util__count{display:inline-flex; font-size:15px;}
.tbl-util__count > em{font-weight:700; color:#fe4529; margin-left:4px;}

.tbl-util select{min-width:110px; margin-right:6px;}
.tbl-util__select div{display:flex;}

.tbl-util .tbl-tit{margin-bottom:0;}
.tbl-util input[type="search"]{width:300px; background-color:#fff; border-top-right-radius:0; border-bottom-right-radius:0; border-right:none;}
.tbl-util input[type="search"] + button{min-width:70px; font-size:14px;}


/*---- 게시판 :: 필수입력 ----*/
.tbl-essential{display:flex; align-items:center; justify-content:flex-end; width:100%; font-size:13px; color:#fe4529;}
.tbl-bullet{display:inline-block; width:4px; height:4px; border-radius:50%; background-color:#fe4529;}

    /* 테이블 밖 */
    .tbl-essential > .tbl-bullet{margin-right:4px;}

    /* 테이블 내부 */
    table .tbl-bullet{vertical-align:text-top; margin:-1px 2px 0 -5px;}


/*---- 게시판 :: 리스트 ----*/
.tbl-list th,
.tbl-list td{padding:10px 8px;}

.tbl-list{overflow-x:auto;}
.tbl-list > table{min-width:620px;}
.tbl-list table thead th{height:50px; background-color:#f5f6f7;}
.tbl-list table thead th:first-child{border-radius:10px 0 0 10px;}
.tbl-list table thead th:last-child{border-radius:0 10px 10px 0;}
.tbl-list table tbody tr:last-child td{border-bottom-style:solid;}
.tbl-list table tbody td{height:60px; border-bottom:1px dashed #e8ebee; text-align:center; word-break:keep-all; overflow-wrap:break-word;}



/*---- 게시판 :: 상세 ----*/
.tbl-view{border-radius:10px; overflow:hidden; border:1px solid #e8ebee; margin-bottom:56px;}
.tbl-view table th,
.tbl-view table td{height:50px; padding:6px 18px; border-bottom:1px solid #e8ebee;}

.tbl-view table tr:last-child th,
.tbl-view table tr:last-child td{border-bottom:none;}

.tbl-view table th{background-color:#f8f8f8; padding-left:30px; word-break:keep-all; text-align:left;}
.tbl-view table td button{height:36px; font-size:13px;}
.tbl-view table td button:not(:first-child){margin-left:8px;}

.tbl-view input[readonly]{background-color:#fff !important;}


/*---- 게시판 :: 이전글, 다음글 ----*/
.post-none{color:#959a9f; cursor:default;}



/*--------------------------------------------------------- FORM COMMON ---------------------------*/
/*---- 공통 ----*/
input[type="text"],
input[type="password"],
input[type="file"],
input[type="search"],
input[type="number"],
select,
textarea,
.search p{width:100%; border-radius:2px; border:1px solid #e5e8eb;}

input[type="text"],
input[type="password"],
input[type="file"],
input[type="search"],
input[type="number"],
input + button,
select,
.search p{max-width:400px; height:36px; padding:0 14px;}

textarea{display:block; padding:6px 10px 6px 14px; width:100%; height:100%; min-height:84px; resize:none; line-height:1.5; font-size:inherit;}
textarea::-webkit-scrollbar{width:6px; height:6px;}
textarea::-webkit-scrollbar-thumb{background:#a7a7a7;}

.input100{max-width:100% !important;}


/*---- row ----*/
.input-row{display:flex; align-items:center;}
.input-row input:not(:last-child),
.input-row .input-dash:not(:last-child),
.input-row button:not(:last-child){margin-right:8px;}


/*---- input + button ----*/
.input-btn{position:relative; max-width:400px; width:100%;}
.input-btn input{padding-right:80px;}
.input-btn input + button,
.input-btn input + .file-upload__btn{position:absolute; top:0; right:0; font-size:13px; border-radius:3px;}
.input-btn input[readonly]{background-color:#fff !important;}


/*---- calendar ----*/
.calendar input[type="text"]{width:130px; background:#fff url(../../images/cmn/ico_calendar.svg) no-repeat 50%; background-position-x:calc(100% - 12px);}

.ui-corner-all > span{display:inline-block; text-indent:-99999px; width:22px; height:22px; background:#eaeef3 url(../../images/cmn/ico_select.svg) no-repeat 50% / 10px; border-radius:50%;}
.ui-datepicker-prev > span{transform:rotate(90deg);}
.ui-datepicker-next > span{transform:rotate(-90deg);}
.ui-datepicker {width:17em; display:none; padding:10px 12px; background:#fff; border:1px solid #e5e8eb; border-radius:3px; margin-top:-1px;}

.ui-datepicker .ui-datepicker-header {position:relative;}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {position:absolute; width:22px; height:22px;}
.ui-datepicker .ui-datepicker-prev {left:0;}
.ui-datepicker .ui-datepicker-next {right:0;}

.ui-datepicker .ui-datepicker-title{display:flex; align-items:center; justify-content:center; height:20px;}
.ui-datepicker .ui-datepicker-title *{font-size:13.5px; font-weight:700;}
.ui-datepicker .ui-datepicker-title select {width:auto; font-size:13.5px; height:20px; padding:0 13px 0 0 !important; border:none; background-size:9px; background-position-x:100%;}
.ui-datepicker .ui-datepicker-title select:not(:last-child){margin-right:14px;}

.ui-datepicker table{margin-top:14px; text-align:center;}
.ui-datepicker table *{font-size:13px;}
.ui-datepicker td span,
.ui-datepicker td a{display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; line-height:1;}
.ui-datepicker-today > a{background:#ffe8e5; color:#fe4529;}
.ui-datepicker td a.ui-state-active{background:#fe4529; color:#fff; font-weight:400;}


/*---- number ----*/
.input-number input[type="text"]{text-align:right; width:140px;}
.input-volume{text-indent:15px !important;}


/*---- file ----*/
.file-name{display:inline-flex; align-items:center; color:#0b5daf; font-weight:600;}
.file-name::after{content:""; width:14px; height:14px; background:url(../../images/cmn/ico_file_blue.svg) no-repeat 50%; margin-left:8px;}

.file-upload input[type="file"]{display:none;}
.file-upload__btn{height:100%; line-height:36px; cursor:pointer;}
.file-upload--notice{max-width:600px;}
.file-upload--notice .file-upload__name{max-width:100%;}

.file-upload + button.btn{min-width:50px; border-radius:3px;}


/*---- hypen ----*/
.input-hypen{margin-right:8px;}


/*---- tel ----*/
.input-tel input[type="text"]{max-width:100px !important;}


/*---- email ----*/
.input-email input[type="text"]:first-of-type{max-width:122px !important;}
.input-email input[type="text"]:last-of-type{max-width:194px !important;}


/*---- edit ----*/
.edit-box{width:100%; height:100%; min-height:300px; padding:6px 0; line-height:1.2; word-wrap: break-word;}
.note-box{width:100%; height:100%; min-height:100px; padding:6px 0; line-height:1.2;}



/*--------------------------------------------------------------------- 체크박스 & 라디오 --------------------------*/
/*-- 공통 --*/
input[type="checkbox"],
input[type="radio"]{display:none;}

input[type="checkbox"] + label,
input[type="radio"] + label{display:flex; align-items:center;}

input[type="checkbox"] + label::before,
input[type="radio"] + label::before{content:''; border:1px solid #e5e8eb; margin-right:8px; box-sizing:border-box; border-radius:2px;}

input[type="checkbox"]:checked + label::before,
input[type="radio"]:checked + label::before{content:''; background:no-repeat 50%;}


/*-- CHECK BOX --*/
input[type="checkbox"] + label::before{width:18px; height:18px;}
input[type="checkbox"]:checked + label::before{background-image:url(../../images/cmn/ico_check.svg);}

input[type="checkbox"].black:checked + label::before{background-image:url(../../images/cmn/ico_check_bk.svg);}



/*--------------------------------------------------------------------- BUTTON --------------------------*/
/*-- group --*/
.btn-group{display:flex; justify-content:space-between; margin-top:70px;}
.btn-group > div{display:flex;}
.btn-group button{width:120px; height:40px;}
.btn-group--right{justify-content:flex-end;}


/*-- size --*/
.btn{text-align:center; min-width:72px; font-size:15px; padding-left:12px; padding-right:12px; border-radius:8px;}
.btn:not(:last-child){margin-right:8px;}


/*-- color --*/
.btn.red{background-color:#fe4529; color:#fff;}
.btn.darkBlue{background-color:#0b5daf; color:#fff;}
.btn.darkGray{background-color:#51575d; color:#fff;}
.btn.gray09{background-color:#9f9f9f; color:#fff;}


/*-- line --*/
.btn.blackLine{border:1px solid #181818; color:#181818;}
.btn.greenLine{border:1px solid #1da159; color:#1da159;}
.btn.redLine{border:1px solid #fe4529; color:#fe4529;}
.btn.gray02{background-color:#2a333b; color:#fff;}


/*-- state --*/
.c-red{background-color:#fe4529;}
.c-redLine{border:1px solid #fe4529; color:#fe4529 !important;}
.c-orange{background-color:#ff9900;}
.c-gray02{background-color:#2a333b;}
.c-gray06{background-color:#6d757d;}
.c-gray07{background-color:#b0b0b1;}



/*--------------------------------------------------------------------- ICON --------------------------*/
.ico{display:inline-flex; align-items:center; justify-content:center; background-size:contain; background-repeat:no-repeat;}
.ico-attach{width:14px; height:14px; background-image:url(../../images/cmn/ico_file.svg);}
.ico-filedown{width:12px; height:12px; background-image:url(../../images/cmn/ico_file_blue.svg); margin-left:8px;}
.ico-new{width:16px; height:16px; background-image:url(../../images/cmn/ico_new.svg); margin-left:6px; vertical-align:middle;}