/* 로그인 */

.login {
    border: 1px solid #E0E0E0;
    box-shadow: 2px 2px 4px rgba(165, 165, 165, 0.25);
    width:418px;
    height:446px;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    display:flex;
    flex-direction:column;
    gap:22px;
    justify-content:center;
    align-items:center;
    padding:60px 52px;
}

.login h1 {
    margin-bottom:13px;
    font-size:18px;
}

.login .row {
    width:100%;
}

.login .row p {
    font-size:16px;
    margin-bottom:10px;
}

.login .row input {
    border: 1px solid rgba(0, 0, 0, 0.17);
    width:100%;
    height:42px;
    padding:0 10px;
}

.login .row input::placeholder {
    color:#A7A7A7;
}

.login button {
    background:#353535;
    color:#fff;
    font-size:15px;
    width:100%;
    height:40px;
    cursor:pointer;
}



/***** list *****/

/* 테이블 메뉴 */


.table-menu { display:flex; align-items:center; justify-content:flex-end; gap:12px;}
.table-menu.wrap-menu {width: 100%; justify-content: end;}
.table-menu li:not(.input-wrap) { min-width:100px; max-width:110px; text-align:center; height:40px; line-height:40px; border:1px solid #515151; background-color: #fff; cursor:pointer; font-size: 13px;color: #515151;}
.table-menu li.input-wrap label {font-size: 16px; font-weight: 700; height: 100%; display: flex; align-items: center; gap: 12px;}
.table-menu li.input-wrap label input[type="text"] {width: 300px; height: 40px; font-size: 14px; border:1px solid #e2e2e2; padding-left: 12px;}
.table-menu li.input-wrap label input[type="text"]::placeholder {font-size: 14px;}
.table-menu li.btn_register {
    border: 1px solid var(--point-color);
    background:var(--point-color);
    color:#fff;
}
.table-menu li.btn_cancel {
    border:1px solid #e0e0e0;
    background-color: #e0e0e0;
    color: #888;
}

.table-menu li.excelBtn {background-color: #388E3C; border: none; min-width: 154px; color: #fff; display: flex; justify-content: center; align-items: center; gap: 8px; border: 1px solid initial;}

.table-all01, .table-all03 {
    padding-left:14px;
    background: url("data:image/svg+xml,%3Csvg width='11' height='10' viewBox='0 0 11 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.8763 4.08333V0H4.20964V4.08333H0.0429688V5.74999H4.20964V10H5.8763V5.74999H10.043V4.08333H5.8763Z' fill='%23767676'/%3E%3C/svg%3E%0A") 14% 50% no-repeat;
}
.table-menu li.delBtn {
    background-color: #ff0000; color: #fff; border: 1px solid #ff0000;
}



/* 테이블 스타일 */

/* .search-wrap .table-style {margin-top: 26px;} */
.search-wrap .table-style {margin-top: 60px;}

.table-style {width: 100%; border: 1px solid #a7a7a7; border-collapse: collapse;}
.table-style tr:not(:last-of-type) td {border-bottom: 1px solid #a7a7a7;}
.table-style tr.txtarea td {height: 100px; max-height: 100px; padding: 8px 15px;}
.table-style tr td {height: 50px; padding: 0 15px; max-height: 50px;}
.table-style tr td.th {background-color: #f8f8f8; font-weight: 500; padding-left: 12px; padding-right: 0;}
.table-style tr td>span {font-size: 11px; letter-spacing: -0.08px;}
.table-style tr td>:is(input[type="text"], input[type="email"], input[type="tel"], .nice-select) {height: 30px; width: 100%; border: 1px solid #e2e2e2; line-height: 30px; padding: 0 12px;}

.table-style tr td div:is(.num-range, .date-range, .address-wrap) {width: 100%; display: flex; justify-content: space-between; align-items: center;}
.table-style tr td textarea {width: 100%; height: 100%; border: 1px solid #e2e2e2; margin-top: 1px; padding: 8px;}
.table-style tr td .wrap input[type="text"] {width: 50px; border: 1px solid #e2e2e2; height: 30px; padding: 0 12px;}
.table-style tr td .date-wrap {width: 130px; padding: 0 12px; display: flex; border: 1px solid #e2e2e2; height: 30px; padding: 0 12px; justify-content: space-between; align-items: center;}
.table-style tr td .date-wrap input[type="text"] {border: none; width: calc(100% - 15px);}
.table-style tr td .date-wrap::after {display: block; content: ''; width: 15px; height: 15px; background: url('../img/date.svg') no-repeat center/cover;}
.table-style tr td .wrap.date-range .date-wrap {width: 180px; display: flex; border: 1px solid #e2e2e2; height: 30px; padding: 0 12px; justify-content: space-between; align-items: center; padding: 0 12px 0 0;}
.table-style tr td .wrap.date-range input[type="text"] {border: none; width: calc(100% - 15px);}
.table-style tr td .wrap.date-range .date-wrap::after {display: block; content: ''; width: 15px; height: 15px; background: url('../img/date.svg') no-repeat center/cover;}
.table-style tr td .wrap.address-wrap {gap: 13px;}
.table-style tr td .wrap.address-wrap input[type="text"] {width: 130px; border: 1px solid #e2e2e2; height: 30px; border: 1px solid #a7a7a7; border: 1px solid #e2e2e2; padding: 0 12px;}
.table-style tr td .wrap.address-wrap input[type="text"]:last-of-type {width: 100%;}

.table-style tr td.fileUpload label input[type="file"] {display: none;}
.table-style tr td.fileUpload label { width: 100%; height: 30px; color: #222; font-size: 15px; display: flex; justify-content: center; align-items: center; background-color: #e7e7e7; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; gap: 5px;}
.table-style tr td.fileUpload label::after {display: inline-block; content: ''; width: 15px; height: 15px; background: url('../img/upload.svg') no-repeat center/cover;}
.table-style tr td.fileUpload label span {display: none;}

.table-style tr td.fileUpload.load label {display: none;}
.table-style tr td.fileUpload.load {display: flex; justify-content: space-between; align-items: center; width: 100%; max-width: 220px;}
.table-style tr td.fileUpload.load a {display: block; width: 15px; height: 15px; background: url('../img/file-delete.svg') no-repeat center/cover;}
.table-style tr td.fileUpload.load span.fileName {display: block; position: relative; pointer-events: none; width: calc(100% - 20px); text-overflow: ellipsis; text-wrap: nowrap; overflow: hidden; font-size: 14px; font-weight: 500;}

.table-style tr td.fileDownload {display: flex; justify-content: space-between; align-items: center; width: 100%; max-width: 220px;}
.table-style tr td.fileDownload .downloadBtn {display: flex; width: 60px; height: 20px; background-color:  #FE5F01; color: #fff; font-size: 10px; justify-content: center; align-items: center;}
.table-style tr td.fileDownload span.fileName {position: relative; pointer-events: none; width: calc(100% - 65px); text-overflow: ellipsis; text-wrap: nowrap; overflow: hidden; font-size: 14px; font-weight: 500;}
.table-style tr td .nice-select { border-radius:0 ; -webkit-border-radius:0 ; -moz-border-radius:0 ; -ms-border-radius:0 ; -o-border-radius:0 ; width: 135px; max-width: 135px; padding: 0 12px;}
.table-style tr td .nice-select .current {display: inline-block; overflow: hidden; text-wrap: nowrap; text-overflow: ellipsis; max-width: 88px;}
.table-style tr td .nice-select .list {max-height: 200px;}
.table-style tr td .nice-select .list {overflow-y: auto !important;}
.table-style tr td .nice-select .list::-webkit-scrollbar {width: 5px;}
.table-style tr td .nice-select .list::-webkit-scrollbar-thumb {border-radius: 5px; background: #c9caca;}
.table-style tr td .nice-select .list::-webkit-scrollbar-track {border-radius: 4px; background: #ececec;}
/* .table-style tr td .nice-select .list li:first-of-type {display: none;} */

.table-style.mng03-table {width: 500px; margin: 65px 0 0 60px;}
.table-style.mng03-table+.bottom {width: 500px; margin-left: 60px;}
.table-style.mng03-table tr td .nice-select {max-width: 100%;}

.form-wrap .table-style.table01 tr td .nice-select {width: 100%; max-width: 100%;}
.form-wrap .table-style.table02 tr td .nice-select {width: 100%; max-width: 193.39px;}
.form-wrap .table-style tr td .nice-select .list {width: 100%;}
.form-wrap .table-style tr td .nice-select .current {width: 200px; max-width: 200px;}
.form-wrap tr td .date-wrap {width: 100%;}



.nice-select:after {display: none;}
.nice-select::before { display: block; content: ''; background: url('../img/bottom.svg') no-repeat center/cover; position: absolute; width: 8px; height: 5px; right: 8px; top: 50%; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.nice-select.open::before { transform:rotate(180deg) ; -webkit-transform:rotate(180deg) ; -moz-transform:rotate(180deg) ; -ms-transform:rotate(180deg) ; -o-transform:rotate(180deg) ; margin-top: -3px;}
/* .search-wrap>.table-menu li {width: 120px; font-size: 14px; font-weight: 500; color: #fff; height: 40px; background-color: #01B9FF; border: 1px solid #01B9FF; margin: 21px 0 100px; max-width: 120px;} */
.search-wrap>.table-menu li {width: 120px; font-size: 14px; font-weight: 500; color: #fff; height: 40px; background-color: #01B9FF; border: 1px solid #01B9FF; margin: 21px 0 80px; max-width: 120px;}



/* list */

.table {
    border: 1px solid #A7A7A7;
    margin-bottom: 30px;
    max-height: 550px;
}

.table .row-scroll-wrap {width: 100%; max-height: 500px; overflow-y: auto;}
.table .row-scroll-wrap::-webkit-scrollbar {
    width:3px;
    background-color:transparent;
}
.table .row-scroll-wrap::-webkit-scrollbar-thumb {
    height:5%;
    background-color:rgba(0,0,0,0.3);
}
.table .row-scroll-wrap::-webkit-scrollbar-track {
    background-color:transparent;
}

.table00 .row {
    grid-template-columns: 50px 65px 1fr 65px 150px 1fr 1fr 1fr 200px 200px 1fr 1fr 1fr;
}

.table01 .row {
    grid-template-columns: 50px 65px 1fr 80px 150px 80px 100px 1fr 1fr 1fr 200px 200px 1fr 1fr 1fr;
}

.table02 .row {
    grid-template-columns: 50px 65px 200px 1fr 65px 150px 100px 150px 1fr 1fr 1fr 1fr 1fr 100px;
}

.table03 .row {
    grid-template-columns:repeat(8, 1fr);
}


.td {
    padding:5px 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* 폼 스타일 */
.downloadBtn {height: 40px; display: flex; background-color: #FE5F01; color: #fff; justify-content: center; align-items: center; position: relative}

.form-wrap {width: 1314px; margin: 60px auto 0;}
.form-wrap2 {width: 1176px; margin: 60px auto 0;}
.form-wrap .top-wrap {display: flex; gap: 24px; margin-bottom: 18px;}
.form-wrap .top-wrap .profile {width: 114px;}
.form-wrap .top-wrap .profile span {font-size: 12px;}
.form-wrap .top-wrap .profile label {position: relative; display: block; width: 100%; height: 152px; background: url('../img/profile-bg.png') no-repeat center/cover; position: relative; margin-bottom: 8px;}
.form-wrap .top-wrap .profile label .file-delete2 {position: absolute; right: 5px; top: 5px; display: none;}
.form-wrap .top-wrap .profile label .file-delete2.on {display: flex;}
.form-wrap .top-wrap .profile label::before {display: block; content: '프로필 사진'; position: absolute; top: -22px; font-size: 14x;}
.form-wrap .top-wrap .profile label input[type="file"] {display: none;}
.form-wrap .downloadBtn::after {display: block; content: ''; width: 15px; height: 15px; background: url('../img/download.svg') no-repeat center/cover;}
.form-wrap .top-wrap .profile .downloadBtn {width: 100%;  gap: 8px;}
.form-wrap .top-wrap .profile .downloadBtn.off {display: none;}

.form-wrap .upload-wrap {display: flex; gap: 66px; justify-content: space-between;}
.form-wrap .upload-wrap .file-wrap {position: relative;}
.form-wrap .upload-wrap .file-wrap label {display: block; width: 556px; height: 277px; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; margin-top: 56px; position: relative;}
.form-wrap .upload-wrap .file-wrap label input[type="file"] {display: none;}
.form-wrap .upload-wrap .file-wrap label .file-delete {z-index: 10; position: absolute; width: 15px; height: 15px; right: 5px; top: 5px;}
.form-wrap .upload-wrap .file-wrap label .file-delete img {width: 100%; height: 100%; object-fit: cover;}
.form-wrap .upload-wrap .file-wrap label.load .file-delete {display: block;}
.form-wrap .upload-wrap .file-wrap label::before {display: block; content: '프로필 사진'; position: absolute; top: -22px; font-size: 14x;}
.form-wrap .upload-wrap .file-wrap label.pic-label::before {display: block; content: '사진';}
.form-wrap .upload-wrap .file-wrap label.video-label::before {display: block; content: '동영상';}

.upload-wrap .file-wrap .downloadBtn {width: 114px; margin: 15px 0 40px auto;}
.upload-wrap .file-wrap.empty .downloadBtn {display: none;}
.upload-wrap .file-wrap.empty .file-delete {display: none;}
.upload-wrap .file-wrap.empty label.pic-label::before {background-image: url('./img/pic_upload.png');}
.upload-wrap .file-wrap.empty label.video-label::before {background-image: url('./img/video_upload.png');}
.upload-wrap .file-wrap #video {display: none; position: absolute; top: 0; left: 0;  width: 100%; height: 100%; z-index: 10; width: 556px; height: 277px; margin-top: 56px; object-fit: contain;}