/* 로그인페이지 */
.login_page { width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center; }
.login_page .login_wrap { display: flex; flex-direction: column; align-items: center; }
.login_page .LOGO_wrap {
    width: 230px;
    margin-bottom: 35px;
}

/*.login_page .LOGO_wrap img { width: auto; }*/
.login_page .login_input_wrap { width: 448px; max-width: 100%; display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px; }
.login_page .login_input_wrap input { width: 100%; height: 56px; border: solid 1px #c4c4c4; padding: 0 16px; }
.login_page .login_btn { width: 448px; max-width: 100%; height: 56px; background-color: #0b170f; color: #fff; display: flex; justify-content: center; align-items: center; }
.login_page .coworkerweb_logo_Wrap { margin-top: 51px; }
l
/* 공통 콘텐츠 */
.btn-wrap { align-items: center; gap: 16px; display: flex; }
.btn-wrap.border-top { padding-top: 24px; border-top: 2px solid #333; }
.btn { border-width: 1px; border-radius: 4px; border-style: solid; line-height: 46px; text-align: center; font-size: 16px; font-weight: bold; color: #fff; padding: 0 24px; display: block; width: fit-content; }
.btn.darkgray { background-color: #484848; border-color: #484848; }
.btn.black { background-color: #202020; border-color: #202020; }
.btn.white { background-color: #fff; border-color: #202020; color: #202020; }
.btn.gray { background-color: #707070; border-color: #707070; color: #fff; }
.btn.blue { background-color: #0091f0; border-color: #0091f0; color: #fff; }
.btn.red { background-color: #df1818; border-color: #df1818; color: #fff; }

.btn-s { line-height: 40px; font-size: 14px; }
.btn-m { min-width: 160px; line-height: 50px; padding: 0 32px; font-size: 18px; }
.tab-btn { background-color: #ffffff; border-color: #e4e4e4; color: #aeaeae; }
.tab-btn.active { background-color: #484848; border-color: #484848; color: #ffffff; }

.red { color: #df1818; }
.blue { color: #008df9; }
.yellow { color: #f9f100; }
.gray { color: #aeaeae; }

.fs40 { font-size: 40px; }
.fs32 { font-size: 32px; }
.fs28 { font-size: 28px; }
.fs24 { font-size: 24px; }
.fs22 { font-size: 22px; }
.fs20 { font-size: 20px; }
.fs18 { font-size: 18px; }
.fs16 { font-size: 16px; }
.fs14 { font-size: 14px; }
.fs12 { font-size: 12px; }
.fs10 { font-size: 10px; }

.fw800 { font-weight: 800; }
.fw600 { font-weight: 600; }
.fw500 { font-weight: 500; }
.fw300 { font-weight: 300; }

.gap80 { gap: 80px; }
.gap40 { gap: 40px; }
.gap32 { gap: 32px; }
.gap24 { gap: 24px; }
.gap16 { gap: 16px; }
.gap8 { gap: 8px; }
.gap4 { gap: 4px; }

.sp-bt { justify-content: space-between; }
.fl-en { justify-content: flex-end; }
.fl-st { justify-content: flex-start; }
.jc-ce { justify-content: center; }
.al-ce { align-items: center; }
.al-st { align-items: flex-start; }
.al-en { align-items: flex-end; }
.al-bl { align-items: baseline; }

.txt-center { text-align: center; }
.txt-right { text-align: right; }
.underline { text-decoration: underline; }
.overline { text-decoration: line-through; }

.img-container { width: 100%; position: relative; display: flex;}
.img-container img { width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-fit: cover;object-position: center; }

/* 로그인페이지 */
.login-page { width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center; }
.login-page .login-wrap { width: 100%; max-width: 260px; display: flex; flex-direction: column; align-items: center; }
.login-page .login-logo-wrap { width: 100%; display: flex; flex-flow: column; align-items: center; gap: 24px; padding-bottom: 32px; border-bottom: 1px solid #c2c2c2; margin-bottom: 32px; }

.login-page .login-logo-wrap .logo { width: 348px; height: 58px; object-fit: contain; object-position: center; }
.login-page .login-txt { text-align: center; font-size: 15px; font-weight: 300; color: #a8a8a8; }
.login-page .login-input-wrap { width: 100%; display: flex; flex-direction: column; gap: 24px; margin-bottom: 40px; }
.login-page .login-input-item { display: flex; flex-flow: column; gap: 8px; }
.login-page .login-input-item .item-default { font-size: 13px; font-weight: bold; color: #484848; }
.login-page .login-input { width: 100%; height: 40px; border: solid 1px #dededf; border-radius: 4px; padding: 0 10px; font-size: 14px; font-weight: 500; }
.login-page .login-input::placeholder { color: #e4e4e4; }
.login-page .login-input:focus { border: 1px solid #6598d8; box-shadow: 0 0 5px 0 rgba(0, 90, 200, 0.18); }
.login-page .login-btn { width: 100%; height: 48px; background-color: #1890ff; color: #fff; display: flex; justify-content: center; align-items: center; font-size: 14px; font-weight: bold; color: #fff; border-radius: 4px; }


/* 관리자 페이지 */
.admin-container { width: 100%; min-width: 1280px; min-height: 100vh; }
.admin-wrap { margin-left: 240px; padding: 64px 80px 120px; transition: .3s; min-width: 1400px; }
@media screen and (max-width: 1820px) {
	.admin-wrap { padding-left: 40px; padding-right: 40px; }
}
.admin-wrap .title-wrap { justify-content: space-between; flex-direction: column; margin-bottom: 16px; gap: 24px; }
.admin-wrap .title-wrap.row-group { align-items: flex-start; gap: 24px; }
.admin-wrap .title-wrap .main-title { font-size: 40px; }
.admin-wrap .title-wrap .main-title .sub-txt { font-size: 16px; font-weight: normal; }
.admin-wrap .title-wrap .main-title .guide-txt { display: block; line-height: 1.5; font-size: 18px; font-weight: 600; margin-top: 16px; color: #dd7575; }

.admin-wrap .main-title-wrap { margin-bottom: 24px; gap: 24px }
.admin-wrap .main-title-wrap.border { padding-bottom: 24px; border-bottom: 1px solid #333; }
.admin-wrap .main-title-wrap .main-title { font-size: 32px; }
.admin-wrap .border-top { border-top: 2px solid #e4e4e4; padding-top: 40px; }

.search-wrap { overflow: hidden; gap: 8px; }
.search-select { width: 150px; height: 48px; border: solid 1px #e4e4e4; font-size: 16px; padding: 0 16px; border-radius: 4px; outline: 0; color: #666; }
.search-input { width: 250px; border: solid 1px #e4e4e4; border-right: 0; height: 48px; padding: 0 16px; border-radius: 4px; font-size: 16px; }
.search-input::placeholder { color: rgba(0, 0, 0, 0.3); }
.search-btn { display: block; width: 48px; height: 48px; text-align: center; line-height: 52px; background: #484848; cursor: pointer; transition: .2s; border-top-right-radius: 4px; border-bottom-right-radius: 4px; }
.search-btn i { color: #fff; font-size: 20px; line-height: 48px; }
.search-btn:hover { background: #606060; }

.null-txt { color: #a3a3a3; font-weight: bold; text-align: center; padding: 120px 0; width: 100%; }

/* 관리자 페이지 - 보드 (이미지) */
.board-wrap { gap: 24px; flex-flow: wrap; }
.board-item { width: calc( ( 100% - 24px * 3 ) / 4 ); min-width: 240px; border: 1px solid #e9e9e9; position: relative; }
.board-item .img-box { width: 100%; position: relative; padding-top: 100%; }
.board-item .img-box.half { padding-top: 50%; }
.board-item .img-box img { position: absolute; top: 0; right: 0; left: 0; bottom: 0; height: 100%; object-fit: contain; object-position: center; }
.article-board-wrap .board-item .img-box video {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    height: 100%;
    object-fit: contain;
    object-position: center;
    max-width: 210px;
    aspect-ratio: 16 / 9;
    margin: 0 auto;
}
.board-item .txt-box { padding: 24px; gap: 16px; position: relative; }
.board-item .txt-box .title { font-size: 17px; line-height: 1.5; }
.board-item .txt-box .date { font-size: 14px; color: #a4a4a4; align-items: center; justify-content: space-between; }
.board-item .label { display: block; position: absolute; top: 0; left: 0; width: 76px; height: 36px; text-align: center; line-height: 36px; font-size: 16px; color: #fff; background: #df1616; }
.board-item .label.use { background: #1890ff; }
.board-item .label.disuse { background: #7d7d7d; }
.sub-btn-wrap .sub-btn { position: relative; }
.sub-btn-wrap .sub-btn:not(:last-child)::after { content: ''; display: block; position: absolute; width: 1px; height: 12px; background: #aeaeae; right: -9px; top: 50%; transform: translate(-50%, -50%); }

.align-btn-wrap { display: flex; gap: 4px; }
.align-btn { width: 32px; height: 32px; border: 1px solid #e9e9e9; border-radius: 50%; }
.board-item .align-btn-wrap { position: absolute; right: 0; bottom: 0; gap: 0; }
.board-item .align-btn { border-radius: 0; }

/* 관리자 페이지 - 폼 */
.form-container { padding-bottom: 40px; border-bottom: 1px solid #333; margin-bottom: 40px; }
.form-title { font-size: 24px; font-weight: bold; }
.form-sub-title { font-size: 24px; padding: 16px 24px; background: #f5f5f5; border-radius: 4px; margin-bottom: 24px; }
.form-wrap { gap: 32px; margin-bottom: 40px; }
.form-container .form-wrap { margin-bottom: 0; }
.form-wrap.col-group { flex-flow: wrap; }
.form-list { gap: 32px; }
.form-list.margin-bottom { margin-bottom: 24px; }
.form-list.col-group { flex-flow: wrap; width: 100%; }
.form-list.border { padding-bottom: 24px; border-bottom: 1px solid #e4e4e4; }
.form-list.per2 .form-item { width: calc( 50% - 16px ); max-width: 560px; min-width: unset; }
.form-list.per3 .form-item { width: calc( (100% - 96px) / 3 ); max-width: 560px; min-width: unset; }
.form-item { gap: 16px; min-width: 320px; position: relative; width: 100%; }
.form-item .item-default { font-size: 18px; font-weight: bold; color: #333; }
.form-item .error,
.form-item .item-default .red { color: #df1616; font-weight: normal; }
.form-item.col-group .item-default { width: 80px; }
.form-item .item-user { gap: 16px; align-items: center; flex-flow: wrap; position: relative; }
.form-item .sticker-txt { font-size: 20px; font-weight: bold; position: absolute; bottom: 4px; right: -8px; transform: translateX(100%); }
.form-item .guide-txt { font-size: 16px; color: #a4a4a4; display: inline-block; line-height: 1.5; }
.form-item .item-default .guide-txt { padding-left: 16px; }
.form-input, .form-select { width: 100%; max-width: 560px; height: 48px; border: 1px solid #e4e4e4; border-radius: 4px; padding: 0 16px; font-size: 16px; background-color: #fff; }
.form-input.disable { background: #f5f5f5; }
.form-input.half { width: 200px; }
.form-input.quarter { width: 130px; }
.form-input.full { max-width: 100%; }
.form-select { outline: 0; }
.form-textarea { width: 100%; max-width: 560px; height: 104px; border: 1px solid #e4e4e4; border-radius: 4px; padding: 16px; font-size: 16px; outline: 0;}
.form-textarea.wide { max-width: unset; width: 100%; height: 480px; }
.form-textarea.disable { height: auto; background: #f5f5f5; border: 0; white-space: pre-line; }
.form-btn-wrap { gap: 16px; }
.form-submit-btn { width: 168px; height: 52px; background: #0091f0; text-align: center; line-height: 52px; border-radius: 4px; color: #fff; font-size: 16px; font-weight: bold; transition: .2s; }
.form-submit-btn.center{ margin: 0 auto; }
.form-submit-btn:hover { background: #0d72d1; }
.form-prev-btn { width: 168px; height: 52px; background: #666; text-align: center; line-height: 52px; border-radius: 4px; color: #fff; font-size: 16px; font-weight: bold; }

/* 컬러피커 */
.form-color { width: 100%; max-width: 200px; height: 48px; border: 1px solid #e4e4e4; border-radius: 4px; padding: 0 16px; padding-left: 48px; font-size: 16px; background-color: #fff; }
.clr-field button { width: 32px; height: 32px; transform: translate(0); left: 8px; top: 8px; border-radius: 4px; }

.form-label-wrap { flex-flow: wrap; gap: 16px 32px; }

/* form - 체크박스 */
.checked-item { align-items: center; gap: 8px; }
.checked-item .icon { width: 24px; height: 24px; border: 1px solid #9999a6; border-radius: 2px; display: flex; align-items: center; justify-content: center; }
.checked-item .icon i { color: #fff; font-weight: bold; font-size: 14px; line-height: 12px; }
.checked-item .txt { font-size: 16px; font-weight:bold; line-height: 1.5; }
.form-checkbox:checked + .checked-item .icon { border: 1px solid #0091f0; background: #0091f0; }

/* form - 라디오 */
.form-radio + .checked-item .icon { width: 24px; height: 24px; border: 1px solid #aeaeae; background: #fff; border-radius: 50%; display: block; position: relative; }
.form-radio + .checked-item .icon::after { content: ''; position: absolute; width: 16px; height: 16px; border-radius: 50%; background: #0091f0; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none; }
.form-radio:checked + .checked-item { color: #0091f0; }
.form-radio:checked + .checked-item .icon { border: 1px solid #0091f0; }
.form-radio:checked + .checked-item .icon::after { display: block; }

/* form- 스위치 */
.switch-item { display: flex; align-items: center; gap: 16px; }
.switch-item .title { color: #aeaeae; font-size: 16px; font-weight: 600; }
.switch-item .title.check { display: none; }
.switch { width: 64px; height: 32px; border-radius: 16px; background: #aeaeae; position: relative; transition: .2s; }
.switch-core { position: absolute; width: 24px; height: 24px; border-radius: 50%; background: #fff; left: 4px; top: 4px; text-align: center; transition: .2s; }
.switch-core i { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 16px; color: #aeaeae; line-height: 24px; }
.switch-core i.xi-check { display: none; color: #0091f0; }
.form-switch input:checked + .switch-item .title { color: #0091f0; }
.form-switch input:checked + .switch-item .title.check { display: block; }
.form-switch input:checked + .switch-item .title.uncheck { display: none; }
.form-switch input:checked + .switch-item .switch { background: #0091f0; }
.form-switch input:checked + .switch-item .switch .switch-core { transform: translateX(32px); }
.form-switch input:checked + .switch-item .switch .switch-core i.xi-check { display: block; }
.form-switch input:checked + .switch-item .switch .switch-core i.xi-close { display: none; }

/* 관리자 페이지 - 파일 */
.file-upload-btn { display: inline-block; width: 154px; height: 52px; background-color: #666; text-align: center; line-height: 52px; font-size: 16px; font-weight: bold; color: #fff; border-radius: 4px; transition: all.2s; }
.file-upload-btn:hover { background: #555; }
.file-upload-wrap .guide-txt { font-size: 14px; color: #a4a4a4; padding-left: 0; margin-bottom: 8px; }
.file-img { margin-top: 16px; width: 560px; padding-top: calc( 560px * 0.67 ); }
.file-preview { margin-top: 16px; width: 100%; max-width: 560px; height: 52px; background: #f5f5f5; border-radius: 4px; padding: 0 16px; padding-right: 48px; border-radius: 4px; position: relative;  }
.file-preview .file-name { line-height: 52px; font-size: 16px; color: #0091f0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.file-del-btn { font-size: 18px; color: #0091f0; position: absolute; top: 50%; transform: translateY(-50%); right: 16px; cursor: pointer; }

/* 관리자 페이지 - 파일(이미지 여러장/미리보기) */
.file-preview-wrap { margin-top: 24px; gap: 16px; flex-flow: wrap; width: 100%; }
.file-preview-wrap .file-preview { width: auto; height: auto; padding: 12px; margin: 0; }
.file-preview-wrap .file-preview .file-del-btn { top: 0; right: 0; transform: none; }
.file-preview-wrap .file-preview .file-name { line-height: 1.5; max-width: 200px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.file-preview-img { display: block; width: 200px; height: 200px; object-fit: contain; object-position: center; }

/* 관리자 페이지 - 파일(이미지 여러장/미리보기) : "대표이미지" 라벨 */
.img-preview-label { font-size: 12px; color: #fff; width: 36px; height: 18px; line-height: 18px; text-align: center; background: #0091f0; position: absolute; top: 0; left: 0; display: none; }
.img-preview:first-child .img-preview-label { display: block; }

/* 관리자 페이지 - 테이블 */
.admin-table-wrap { border-top: 1px solid #333; border-bottom: 1px solid #333; overflow: auto; user-select: none; }
.admin-table-wrap::-webkit-scrollbar { display: none; }
/* .admin-table { min-width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; } */
.admin-table { min-width: 100%; border-collapse: separate; border-spacing: 0; white-space: nowrap; }
.admin-table thead { position: sticky; top: 0; background-color: #fff; }
.admin-wrap> .admin-table-wrap thead { border-top-width: 2px; }
.admin-table th { border-bottom: 1px solid #333; padding: 16px 8px; font-size: 16px; color: #333; font-weight: bold; text-align: left; background-color: #f5f5f5; }
/* .admin-table th:not(:first-child) { border-left: 1px solid #e4e4e4; } */
.admin-table td { border-bottom: 1px solid #e4e4e4; padding: 8px; font-size: 16px; text-align: left; }
/* .admin-table td:not(:first-child) { border-left: 1px solid #e4e4e4; } */
.admin-table tr.disable td { opacity: .2; }
.admin-table th.center, .admin-table td.center { text-align: center;}

.admin-table tr.light-blue td { background: #ecf7ff; }
.admin-table tr.blue td { background: #008df9; color: #fff; }

.modal-wrap .admin-table-wrap { max-height: 50vh; }
.modal-wrap .modal-scroll-wrap .admin-table-wrap { max-height: 360px; }

.admin-table-wrap.fixed { white-space: wrap; }
.admin-table-wrap.fixed .admin-table { table-layout: fixed; width: 100%; }

.admin-table td .txt-box { width: 100%; white-space: wrap; }

/* 관리자 페이지 - 이미지 여러장 업로드 */
.img-upload-wrap { width: 100%; gap: 16px; flex-flow: wrap; align-items: flex-start; }
.img-upload-btn { display: flex; flex-flow: column; justify-content: center; gap: 8px; width: 180px; height: 180px; background-color: #f5f5f5; text-align: center; font-size: 16px; font-weight: bold; color: #a7a7a7; border: dashed 1px #a7a7a7; border-radius: 4px; }
.img-upload-wrap .xi-plus { font-size: 32px; color: #a7a7a7; }
.img-preview-wrap { gap: 16px; flex-flow: wrap; max-width: calc( 100% - 180px - 16px ); }
.img-preview { width: 180px; height: 180px; border: 1px solid #e4e4e4; padding: 8px; position: relative; border-radius: 4px; }
.img-preview-label { font-size: 14px; color: #fff; width: 56px; height: 24px; line-height: 24px; text-align: center; background: #0091f0; position: absolute; top: 0; left: 0; display: none; }
.img-preview:first-child .img-preview-label { display: block; }
.img-preview-img { height: 100%; object-fit: contain; object-position: center; }
.img-preview-wrap .xi-close { font-size: 18px; color: #0091f0; position: absolute; top: 0; right: 0; cursor: pointer; background: #fff; }

/* 에디터 */
.form-item.editor { width: auto; gap: 0; }
.form-item.editor .item-default { margin-bottom: 16px; }

/* 상품 검색 */
.area-search-wrap { width: 560px; position: relative; cursor: pointer; }
.area-search-wrap .search-input { line-height: 48px; border-radius: 0; border-right: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; width: calc( 100% - 52px ); }
.area-search-wrap .search-input:focus { border-color: #222; }
.area-search-wrap .xi-search { display: inline-block; width: 48px; height: 48px; background: #707070; text-align: center; line-height: 48px; color: #fff; font-size: 24px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; }
.area-search-list { position: absolute; width: 560px; background: #fff; top: 52px; border: 2px solid #d8d8d8; border-radius: 4px; z-index: 9; display: flex; flex-flow: column; max-height: 420px; overflow: auto; }
.area-search-item { gap: 8px; font-size: 16px; font-weight: 300; cursor: pointer; padding: 16px; }
.area-search-item:hover { background: #f5f5f5; }
.area-search-item i { font-size: 18px; color: #aeaeae; }

/* modal */
.modal-container { position: fixed; top: 0; right: 0; left: 0; bottom: 0; z-index: 999; background: rgba(0, 0, 0, 0.6); }
.modal-wrap { background: #fff; width: 100%; max-width: 1024px; height: auto; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 16px; position: absolute; padding: 40px 32px; }
.modal-wrap.w560 { max-width: 560px; }
.modal-wrap.w480 { max-width: 480px; }
.modal-wrap::-webkit-scrollbar { display: none; }
.close-btn { position: absolute; font-size: 32px; cursor: pointer; top: 24px; right: 24px; z-index: 9; }
.modal-scroll-container .modal-scroll-wrap { width: 100%; }
.modal-scroll-wrap { max-height: 60vh; overflow: auto; }
.modal-title-wrap { margin-bottom: 24px; }
.modal-title-wrap.border { padding-bottom: 16px; border-bottom: 1px solid #c4c4c4; }
.modal-title-wrap.center { text-align: center; }
.modal-title { font-size: 24px; font-weight: bold; }
.modal-sub-title { font-size: 16px; line-height: 1.5; margin-top: 12px; color: #707070; }

.modal-footer { display: flex; align-items: center; margin-top: 24px; gap: 8px; justify-content: center; }
.modal-footer .btn { width: 100%; }
.modal-footer-btn { width: 100%; height: 64px; border-radius: 4px; text-align: center; line-height: 62px; font-size: 18px; font-weight: bold; color: #202020; background: #fff; border: 1px solid #202020; padding: 0 24px; }
.modal-footer-btn.close-btn { position: static; font-size: 16px; background: #aeaeae; color: #fff; border: 1px solid #aeaeae; }
.modal-footer-btn.submit-btn { background: #308929; color: #fff; border: 1px solid #308929; }
.modal-footer-btn.submit-btn.disable { background: #aeaeae; border: 1px solid #aeaeae; }
.modal-footer-btn.cancel-btn { background: #707070; color: #fff; border-color: #707070; }
.modal-footer-btn.write-btn { color: #308929; border-color: #308929; }

.modal-alert { border: 2px solid #e4e4e4; height: auto; width: calc( 100% - 80px ); padding: 40px 32px 32px; max-width: 320px; text-align: center; border-radius: 16px; left: 50%; right: unset; top: 50%; bottom: unset; transform: translate(-50%, -50%); }
.modal-alert .icon { display: block; margin: 0 auto; font-size: 24px; margin-bottom: 16px; }
.modal-alert .modal-title-wrap { margin-bottom: 24px; text-align: center; }
.modal-alert .modal-title-wrap .icon { margin-bottom: 8px; }
.modal-alert .modal-title { font-size: 20px; }
.modal-alert-txt { font-size: 16px; line-height: 1.5; }
.modal-alert .modal-footer-btn { width: 100%; height: 48px; line-height: 46px; font-size: 14px; }
.modal-alert .close-btn { font-size: 24px; top: 16px; right: 16px; }

.modal-alert.warning { max-width: 480px; }
.modal-alert.warning .icon { font-size: 40px; margin-bottom: 24px; }
.modal-alert.warning .modal-title-wrap { padding-bottom: 32px; margin-bottom: 40px; }
.modal-alert.warning .modal-title { font-size: 32px; }
.modal-alert.warning .modal-alert-txt { font-size: 18px; }
.modal-alert.warning .modal-footer { margin-top: 40px; }

/* 대시보드 */
.dashboard-section { border: 1px solid #e4e4e4; border-radius: 16px; padding: 40px; }
.dashboard-item { width: 100%; border: 1px solid #e4e4e4; border-radius: 16px; padding: 32px 40px; }
.dashboard-item .item-title { font-size: 20px; margin-bottom: 16px; }
.dashboard-item .item-txt { font-size: 32px; font-weight: bold; }
.dashboard-item .item-sub-txt { font-size: 24px; font-weight: bold; }
.dashboard-section-title-wrap .search-wrap { align-items: center; }

.dashboard-section .chart-wrap { height: 500px; }

/* 회원 관리 */
.sns-item { width: 32px; height: 32px; border-radius: 4px; }
.sns-item.kakao { background-image: url(../images/icon_kakao.png); background-size: cover; }
.sns-item.naver { background-image: url(../images/icon_naver.png); background-size: cover; }
.sns-item.google { background-image: url(../images/icon_google.png); background-size: cover; border: 1px solid #e4e4e4; }

.member-detail-wrap { border-top: 1px solid #333; border-bottom: 1px solid #333; }
.member-detail-list:not(:last-child) { border-bottom: 1px solid #e4e4e4; }
.member-detail-list.per3 .member-detail-item:not(.wide) { width: calc( 100% / 3 ); }
.member-detail-list.per4 .member-detail-item:not(.wide) { width: calc( 100% / 4 ); }
.member-detail-list.per3 .member-detail-item.wide { width: calc( (100% / 3) * 2 ); }
.member-detail-list.row-group .member-detail-item:not(:last-child) { border-bottom: 1px solid #e4e4e4; }
.member-detail-item { display: flex; width: 100%; }
.member-detail-item.bg-light-gray { background: #f5f5f5; }
.member-detail-wrap> .member-detail-item { border-bottom: 1px solid #e4e4e4; }
.member-detail-item .item-default { width: 160px; padding: 16px 0; padding-left: 24px; font-size: 16px; line-height: 1.5; font-weight: 600; background-color: #f5f5f5; }
.member-detail-item .item-user { width: calc( 100% - 160px ); padding: 16px 0; padding-left: 24px; font-size: 16px; line-height: 1.5; }
.member-detail-item .item-user *:not(.subscript-label) { line-height: 1.5; }

.subscript-label { width: fit-content; height: 32px; line-height: 32px; border-radius: 16px; padding: 0 16px; font-size: 16px; color: #fff; background: #707070; }
.subscript-label.default { background: #e4e4e4; color: #202020; }
.subscript-label.active { background: #0091f0; }

.form-item .sns-item { width: 48px; height: 48px; border-radius: 4px; }

.member-profile-wrap { align-items: center; border-bottom: 1px solid #aeaeae; }
.member-profile-wrap .user-profile { width: 280px; padding: 32px 0; }
.member-profile-wrap .member-detail-wrap { width: calc( 100% - 280px ); border: 0; border-left: 1px solid #aeaeae; padding: 0 32px; }
.user-profile { text-align: center; align-items: center; }
.user-profile-img { display: block; width: 88px; height: 88px; border-radius: 50%; object-fit: cover; object-position: center; }

.profile-img-upload-wrap { display: block; width: fit-content; position: relative; cursor: pointer; }
.profile-img-upload-wrap .profile-img { width: 128px; height: 128px; border-radius: 50%; overflow: hidden; }
.profile-img-upload-wrap .profile-img img { height: 100%; object-fit: cover; object-position: center; }
.profile-img-upload-wrap .icon { position: absolute; width: 40px; height: 40px; border-radius: 50%; line-height: 40px; text-align: center; background: #aeaeae; color: #fff; font-size: 20px; bottom: 0; right: 0; }


/* 회원 관리 - 회원 상세 */
.order-state { width: fit-content; line-height: 1.5; border-radius: 6px; padding: 4px 12px; font-size: 16px; color: #fff; background: #484848; }
.state-circle { display: block; width: 16px; height: 16px; border-radius: 50%; }
.state_red { background: #df1818; }
.state_org { background: #f9ae00; }
.state_gre { background: #4fc700; }
.state_blu { background: #008df9; }
.state_pur { background: #7d06f5; }
.state_pin { background: #ff54f9; }
.state_gra { background: #aeaeae; }

.file-download-wrap { margin-bottom: 16px; }
.file-download-item { height: 52px; align-items: center; padding: 0 16px; background: #eff8ff; border-radius: 4px; gap: 8px; }
.file-download-item .icon { font-size: 19px; color: #a4a4a4; }
.file-download-item .file-title { font-size: 16px; width: calc( 100% - 36px ); font-size: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 팝업 관리 */
.board-item .txt-box .title { width: calc( 100% - 80px ); text-align: left; }
.board-item .txt-box .link { width: 80px; text-align: right; }

/* 메타데이터 관리 */
.meta-txt { width: 50vw; white-space: wrap; }

/* 기사 등록 */
#meta_data .modal-wrap { max-width: 1200px; }
.meta-data-wrap { border-top: 1px solid #202020; border-bottom: 1px solid #202020; }
.meta-data-title { font-size: 24px; font-weight: 600; padding: 16px 0; border-bottom: 1px solid #202020; }
.meta-data-group:not(:first-child) .meta-data-title { border-top: 1px solid #202020; }
.meta-data-item:not(:last-child) { border-bottom: 1px solid #e4e4e4; }
.meta-data-toggle-title { padding: 16px 0; font-size: 16px; font-weight: 600; display: flex; align-items: center; gap: 8px; cursor: pointer; }
.meta-data-toggle-title.active .icon { transform: rotate(180deg); }
.meta-data-toggle-content { display: none; padding-top: 8px; padding-bottom: 24px; }
.meta-data-toggle-content .form-label-wrap { gap: 16px 0; }
.meta-data-toggle-content .form-label-wrap label { width: calc( 100% / 6 ); }
.meta-data-toggle-content.active { display: block; }

/* 기사 미리보기 */
.post-txt-wrap { gap: 16px; }
.post-txt-wrap .txt-group { gap: 8px; align-items: baseline; flex-flow: wrap; }
.post-txt-wrap .name { font-size: 16px; font-weight: 500; color: #1fabf3; }
.post-txt-wrap .title { font-size: 24px; font-weight: bold; line-height: 1.33; display: -webkit-box; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; height: calc( (24px * 1.33) * 2 );}
.post-txt-wrap:hover .title { text-decoration: underline; }
.post-txt-wrap .txt { font-size: 16px; line-height: 1.5; color: #aeaeae; display: -webkit-box; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; height: calc( (16px * 1.5) * 2 ); }
.post-txt-wrap .sub-txt { font-size: 12px; font-weight: 300; color: #aeaeae; }
.post-txt-wrap .sub-txt-wrap> * { position: relative; padding-right: 8px; }
.post-txt-wrap .sub-txt-wrap> *:not(:last-child)::after { content: ''; display: block; position: absolute; width: 1px; height: 12px; background-color: #aeaeae; right: 0; top: 50%; transform:translateX(50%) translateY(-50%); }
.post-txt-wrap .sub-txt-group .sub-txt:not(:last-child) { position: relative; padding-right: 8px; }
.post-txt-wrap .sub-txt-group .sub-txt:not(:last-child)::after { content: ''; display: block; position: absolute; width: 3px; height: 3px; border-radius: 50%; background-color: #aeaeae; right: 0; top: 50%; transform:translateX(50%) translateY(-50%); }

.post-detail-wrap { padding-bottom: 40px; border-bottom: 1px solid #222; margin-bottom: 40px; max-width: 800px; }
.post-detail .subpage-container { padding-bottom: 56px; border-bottom: 1px solid #222; }
.post-detail-title-wrap { position: relative; padding-bottom: 40px; border-bottom: 1px solid #e4e4e4; gap: 16px; }
.post-detail-title-wrap .name { font-size: 18px; font-weight: 500; color: #1fabf3; }
.post-detail-title-wrap .title { font-size: 40px; height: auto; -webkit-line-clamp: unset; margin-bottom: 16px; font-weight: bold; line-height: 1.33; }
.post-detail-title-wrap:hover .title { text-decoration: none;  }
.post-detail-title-wrap .sub-txt { font-size: 14px; color: #222; }
.post-detail-txt-wrap { white-space: pre-line; padding: 40px 0 56px; }
.post-detail-txt-wrap * { font-family: inherit; font-size: inherit; }
.post-detail-txt-wrap img { width: auto; max-width: 100%; height: auto; }
.post-detail-txt-wrap hr { background: #222; border: 0; height: 3px; margin: 2.5rem auto; width: 70%; }
.post-detail-txt-wrap blockquote { margin: 24px 0; position: relative; padding-left: 20px; }
.post-detail-txt-wrap blockquote::before { content: ''; display: block; position: absolute; width: 2px; height: 100%; padding: 0; top: 0; left: 0; background: #222; }
.post-detail-txt-wrap .table { float: none !important; width: 100% !important; max-width: 800px; }
.post-detail-txt-wrap .table table { width: 100%; }

.keyword-title { font-size: 20px; font-weight: bold; margin-bottom: 16px; }
.keyword-wrap .tag-list .tag { display: flex; align-items: center; justify-content: center; gap: 8px; height: 34px; padding: 0 12px; border-radius: 18px; border: 1px solid #1fabf3; color: #1fabf3; transition: .2s; cursor: pointer; }
.keyword-wrap .tag-list .tag:hover { background: #1fabf3; color: #fff; transition: .2s; }
.keyword-wrap .tag-list .tag .del-btn { font-size: 14px; color: #707070; }
.keyword-wrap .tag-list .tag:hover .del-btn { color: #fff; }

/* 메인 기사 */
.article-board-wrap .board-item { width: 100%; }
.article-board-wrap .board-item .img-box { width: 320px; padding-top: 210px; }
.article-board-wrap .board-item .txt-box { width: calc( 100% - 320px ); }
.article-board-wrap .board-item .sub-btn-wrap { position: absolute; top: 24px; right: 24px; }

/* TOP 10 관리 */
.article-top10-wrap .board-item .img-box { padding-top: 65%; }
.article-top10-wrap .board-item .txt-box .title { width: 100%; }
.article-top10-wrap .board-item .num { width: 40px; line-height: 40px; text-align: center; background: rgba(0, 0, 0, 0.6); color: #fff; font-size: 18px; font-weight: bold; position: absolute; left: 16px; top: 0; z-index: 9; }

/* 회원 관리 - 회원 상세 */
.user-content-wrap { max-width: 520px; align-items: center; }
.user-content-wrap .img-container { width: 40px; padding-top: 40px; overflow: hidden; }
.user-content-wrap .img-container.w72 { width: 72px; padding-top: 72px; }
.user-content-wrap .img-container + .txt { width: calc( 100% - 56px ); }
.user-content-wrap .img-container.w72 + .txt { width: calc( 100% - 88px ); }
.user-content-wrap .txt { width: 100%; white-space: wrap; font-size: 16px; line-height: 1.5; }
.user-content-txt { max-width: 480px; overflow: hidden; text-overflow: ellipsis; }

/* 불편 신고 상세 */
.inquiry-txt { line-height: 1.5; padding: 40px 16px; }

/* 태그 */
.form-enter-wrap { position: relative; width: 100%; max-width: 560px; }
.form-enter-wrap .form-input { padding-right: 48px; }
.form-enter-wrap .icon { width: 48px; height: 48px; line-height: 48px; text-align: center; font-size: 16px; color: #707070; position: absolute; right: 0; top: 0; cursor: pointer; }
.tag-list { display: flex; flex-flow: wrap; gap: 8px; }
.tag-item { display: flex; gap: 8px; align-items: center; min-height: 36px; border-radius: 4px; border: 1px solid #e4e4e4; padding: 8px; }
.tag-item .txt { white-space: nowrap; font-weight: 500; }
.tag-item .del-btn { width: 16px; text-align: right; cursor: pointer; }
.tag-item .color { width: 24px; height: 24px; border-radius: 2px; }
.tag-item .img { width: 40px; height: 40px; }
.tag-item .img img { height: 100%; object-fit: cover; object-position: center; }

/* 상품 관리 */
.table-input { padding-right: 32px; }
.table { width: max-content; border-collapse: separate; }
.table th { text-align: left; font-size: 18px; font-weight: bold; }
.table th, .table td { padding-top: 8px; padding-bottom: 8px; padding-right: 8px; }

.label-wrap { display: flex; flex-flow: wrap; gap: 4px; }
.label-wrap .label { line-height: 28px; padding: 0 8px; border-radius: 2px;; font-size: 16px; font-weight: 500; color: #fff; }

/* 태그 관리 */
.admin-table .tag-item { width: fit-content; border: 0; padding: 0; }

.create-btn { padding: 0 40px; }

.main-container { max-width: 800px; }
.main-container * { font-family: inherit; font-size: inherit; }

/* 수강 신청 관리 */
.main-filter-wrap { align-items: center; }
.main-filter-wrap .icon { font-size: 14px; }
.main-filter-btn { font-size: 14px; color: #aeaeae; }
.main-filter-btn.active { font-weight: bold; color: #222; }

.lecture-calendar-table-wrap { border: 1px solid #e4e4e4; }
.lecture-calendar-table { border-collapse: collapse; table-layout: fixed; width: 100%; }
.lecture-calendar-table th { height: 64px; padding: 0 8px; background: #222; font-weight: 18px; font-weight: 500; color: #fff; }
.lecture-calendar-table th:first-child { text-align: left; padding-left: 24px; }
.lecture-calendar-table th:not(:last-child) { border-right: 1px solid #e4e4e4; }
.lecture-calendar-table td { padding: 16px 0; text-align: center; }
.lecture-calendar-table td:first-child { text-align: left; padding-left: 24px; }
.lecture-calendar-table td:not(:last-child) { border-right: 1px solid #e4e4e4; }
.lecture-calendar-table tr:not(:last-child) td { border-bottom: 1px solid #e4e4e4; }
.lecture-calendar-table td:nth-child(2),
.lecture-calendar-table td:nth-child(3) { background-color: #f5f5f5; }
.lecture-calendar-table .sub-txt { font-size: 14px; font-weight: normal; }

.lecture-calendar-table th.is-current-month { background-color: #0088db; }
.lecture-calendar-table td.is-current-month { background-color: rgba(0, 136, 219, 0.1);}
.lecture-calendar-table .active { color: #0088db; }
.lecture-calendar-table .prev { color: #aeaeae; }
.lecture-calendar-table a:hover { text-decoration: underline; }

/* 업체 관리 */
.gray-padding-box { padding: 24px; background: #f5f5f5; border-radius: 8px; }

/* 배너 이미지 선택 */
.sample-img-wrap { display: flex; flex-flow: wrap; gap: 8px; }
.sample-img-wrap label { width: calc( ( 100% - 8px * 3 ) / 4 ); }
.sample-img { width: 100%; padding-top: calc( 100% - 8px ); position: relative; border-radius: 4px; overflow: hidden; border: 4px solid transparent;}
.sample-img img { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center; top: 0; left: 0; right: 0; bottom: 0; }
.sample-img-wrap input:checked + .sample-img { border-color: #0088db; }

/* 메일 발송 - 받는 사람 검색 */
.email-search-item { display: flex; align-items: center; padding: 16px; border-radius: 4px; border: 1px solid #d8d8d8; gap: 8px; justify-content: space-between; width: 100%; max-width: 1024px; }

/* 250521 추가 수정 및 반응형 */
@media screen and (max-width: 1280px) {
	.btn { line-height: 38px; font-size: 16px; padding: 0 16px; }

	.btn-s { line-height: 32px; font-size: 14px; }
	.btn-m { min-width: 96px; line-height: 42px; padding: 0 16px; font-size: 16px; }

	.fs40 { font-size: 32px; }
	.fs32 { font-size: 26px; }
	.fs28 { font-size: 24px; }
	.fs24 { font-size: 22px; }
	.fs22 { font-size: 20px; }
	.fs20 { font-size: 18px; }
	.fs18 { font-size: 16px; }
	.fs16 { font-size: 14px; }
	.fs14 { font-size: 12px; }
	.fs12 { font-size: 10px; }

	.gap80 { gap: 40px; }
	.gap40 { gap: 24px; }
	.gap32 { gap: 16px; }
	.gap24 { gap: 12px; }
	.gap16 { gap: 8px; }
	.gap8 { gap: 4px; }

	.admin-container { min-width: unset; }
	.admin-wrap { padding: 64px 16px; min-width: unset; margin-left: unset; }
	.admin-wrap .main-title-wrap { margin-bottom: 16px; }
	.admin-wrap .main-title-wrap.border { padding-bottom: 16px; }
	.admin-wrap .main-title-wrap .main-title { font-size: 26px; }
	.dashboard-section { padding: 0; border: 0; border-radius: 0; }

	.form-input, .form-select { font-size: 14px; }
	.search-input { width: 120px; font-size: 14px; }
	.dashboard-section .chart-wrap { height: 240px; }

	.admin-table th, .admin-table td { font-size: 14px; }

	.board-wrap { gap: 16px; }
	.board-item { width: calc( 50% - 8px ); min-width: unset; }
	.board-item .txt-box { padding: 16px; gap: 8px; }
	.board-item .txt-box .title { font-size: 14px; width: 100%; }
	.board-item .label { width: 56px; height: 28px; line-height: 28px; font-size: 14px; }
	.sub-btn-wrap .sub-btn { font-size: 13px; }
	.sub-btn-wrap .sub-btn:not(:last-child)::after { right: -5px; }

	.article-board-wrap .board-item> .col-group { flex-flow: wrap; }
	.article-board-wrap .board-item .img-box { width: 100%; }
	.article-board-wrap .board-item .txt-box { width: 100%; }
	.article-board-wrap .board-item .txt-box .fs20 { padding-right: 64px; }
	.article-board-wrap .board-item .sub-btn-wrap { top: 226px; right: 16px; }
}

/* 참가자 추가 */
.company-info-wrap { gap: 16px; }
.company-info-item { border: 1px solid #e4e4e4; padding: 24px; }
.company-info-top { display: flex; align-items: center; padding-bottom: 16px; border-bottom: 1px solid #e4e4e4; margin-bottom: 16px; gap: 8px; }
.company-info-top.row-group { align-items: flex-start; gap: 16px; position: relative; }
.company-info-item .item-title-wrap { display: flex; gap: 16px; align-items: baseline;}
.company-info-item .item-title { font-size: 20px; font-weight: 600; }
.company-info-item .item-label { line-height: 24px; padding: 0 12px; border-radius: 8px; background: #aeaeae; font-size: 14px; color: #fff; }
.company-info-item .item-label.active, .company-info-item .item-label.on { background: #3da0dc; }
.company-info-item .item-label.off { background: #0a55a7; }
.company-info-top .item-btn-wrap { margin-left: auto; }
.company-info-top.row-group .item-btn-wrap { position: absolute; top: 0; right: 0; }
.company-info-item .item-btn-wrap { display: flex; align-items: center; gap: 24px; }
.company-info-item .item-btn { font-size: 16px; color: #aeaeae; position: relative; }
.company-info-item .item-btn:hover { text-decoration: underline; }
.company-info-item .item-btn:not(:last-child)::after { content: ''; display: block; width: 1px; height: 16px; background: #aeaeae; position: absolute; right: -13px; top: 50%; transform: translate(-50%, -50%); }
.company-info-item .item-group { display: flex; flex-flow: column; gap: 8px; }
.company-info-item .item { display: flex; align-items: baseline; }
.company-info-item .item-default { width: 80px; font-size: 14px; font-weight: 600; line-height: 1.5; }
.company-info-item .item-user { width: calc( 100% - 80px ); font-size: 14px; line-height: 1.5; }
.company-info-item .item-sub-title-group { display: flex; gap: 24px; align-items: baseline; }
.company-info-item .item-sub-title { font-size: 16px; position: relative; }
.company-info-item .item-sub-title:not(:last-child)::after { content: ''; display: block; position: absolute; width: 1px; height: 12px; background: #aeaeae; right: -12px; top: 50%; transform: translate(-50%, -50%); }

.form-search-wrap { position: relative; width: 100%;}
.form-search-input { height: 52px; padding: 0 16px; padding-right: 48px; width: 100%; background-color: #fff; border: 1px solid #e4e4e4; border-radius: 8px; font-size: 16px; }
.form-search-input:focus { border-color: #0088db; box-shadow: inset 0 3px 6px 0 rgba(0, 136, 219, 0.16); }
.form-search-input::placeholder { color: #aeaeae; }
.form-search-btn { font-size: 20px; color: #0088db; position: absolute; right: 24px; top: 50%; transform: translateY(-50%);}

.null-txt-wrap { padding: 32px 0; background: #f5f5f5; text-align: center; display: flex; flex-flow: column; gap: 16px; align-items: center; justify-content: center; }
.null-txt-wrap .icon { font-size: 24px; color: #aeaeae; }
.null-txt-wrap .title { font-size: 18px; font-weight: 500; color: #707070; }
.null-txt-wrap .txt { font-size: 16px; line-height: 1.5; color: #aeaeae; }

#mail_search_result .modal-wrap .modal-scroll-wrap .admin-table-wrap { max-height: 60vh; }


/* 캘린더 / 모달 추가 */

.calendar-layout {
    display: flex;
    height: 100vh;
    width: 100%;
}

#calendar {
    flex: 1;
    padding: 20px;
    min-width: 420px;
}

.calendar-sidebar {
    width: 400px;
    padding: 30px 20px;
    border-left: 1px solid #ddd;
    box-sizing: border-box;
}

.calendar-layout .date-wrap {
    display: flex;
    align-items: center;
    gap: 24px;
}

.calendar-layout .add-memo {
    width: 28px;
    height: 28px;
    border-radius: 14px;
    background-color: #3662E3;
    display: flex;
    justify-content: center;
    align-items: center;
}

.calendar-layout .add-memo i {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}

.calendar-date {
    font-size: 20px;
    font-weight: bold;
}

.calendar-event-list {
    margin-bottom: 30px;
}

.calendar-event {
    margin-bottom: 15px;
    background-color: #F5F5F5;
    border-radius: 5px;
    padding: 20px 15px;
}

.calendar-event:first-child {
    margin-top: 24px;
}

.calendar-event .role {
    font-size: 16px;
    font-weight: 500;
    color: #000;
}

.calendar-memo {
    display: none;
}

.calendar-memo.show {
    display: block;
}

.calendar-memo .cancel-btn {
    background-color: #DA0000CC;
    margin-left: 8px;
}

.memo-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.memo-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.memo-actions .memo-btn {
    border-radius: 4px;
    height: 26px;
    width: fit-content;
    padding: 0 12px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
}

.memo-actions .memo-btn.edit {
    background-color: #258900CC;
}

.memo-actions .memo-btn.delete {
    background-color: #DA0000CC;
}

.calendar-event .desc {
    font-size: 16px;
    color: #000;
}

.calendar-memo label {
    font-size: 16px;
    font-weight: 600;
    display: block;
    margin-bottom: 12px;
}

.calendar-memo button {
    margin-top: 12px;
    padding: 10px 20px;
    background-color: #2563eb;
    border: none;
    color: #fff;
    border-radius: 6px;
    cursor: pointer;
}

.calendar-memo textarea {
    width: 100%;
    height: 120px;
    padding: 10px;
    border: 1px solid #ccc;
    resize: none;
    border-radius: 4px;
}

#calendar table,
#calendar tbody {
    width: 100% !important;
}

.fc .fc-daygrid-body {
    width:  100% !important;
}

.calendar-buttons  {
    display: none;
}

.calendar-buttons.show  {
    display: flex;
    margin-bottom: 24px;
}

@media screen and (max-width: 920px) {
    .memo-head {
        flex-direction: column;
        align-items: start;
        gap: 8px;
    }
}



.memoModal {
    position:fixed;
    inset:0;
    display:none;
    z-index:10000;
}

.memoModal.is-open {
    display:block;
}

.memoModal .modal-overlay {
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.55);
}

.memoModal .modal-dialog {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:min(680px,calc(100vw - 40px));
    max-height:calc(100vh - 80px);
    background:#fff;
    border-radius:12px;
    box-shadow:0 20px 60px rgba(0,0,0,.28);
    padding:68px 30px 30px;
    overflow:auto
}

.memoModal .modal-close {
    position:absolute;
    right:30px;
    top:30px;
    border:0;
    background:transparent;
    font-size:24px;
    cursor:pointer;
}

.memoModal .head-wrap {
    display: flex;
    gap: 64px;
    margin-bottom: 40px;
}

.memoModal .head-txt,
.memoModal .cont-title  {
    font-size: 16px;
    color: #000;
    font-weight: 700;
    margin-bottom: 20px;
}

.memoModal .cont-txt,
.memoModal .cont {
    font-size: 16px;
    color: #000;
}

.memoModal .modal-cont-wrap.top {
    margin-bottom: 40px;
}

.memoModal .memo-actions {
    margin-top: 50px;
    justify-content: flex-end;
}

/* 0818 */

.fc .fc-daygrid-day.fc-day-today {
    background-color: rgba(144, 159, 137, 0.1);
}

.calendar-wrap .main-title-wrap {
    max-width: calc(100% - 400px);
    min-width: 420px;
}

.calendar-wrap #calendar {
    padding: unset;
}

.calendar-wrap .fc-toolbar.fc-header-toolbar {
    margin: 0;
}

.calendar-wrap .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk {
    display: flex;
    align-items: center;
    gap: 15px;
}

.calendar-wrap .fc-button {
    border:0;
    border-radius:4px;
    background-color: #909F89;
    width: 96px;
    height: 41px;
    font-size: 16px;
    font-family: 'Pretendard';
}

.calendar-wrap .fc-today-button {
    width: 96px;
    height: 41px;
    background-color: #909F89;
    color:#fff;
    font-weight: 500;
}

.calendar-wrap .fc-button-group {
    background:#7F7F7F;
    border-radius: 4px;
    overflow: hidden;
}

.calendar-wrap .fc-prev-button,
.calendar-wrap .fc-next-button {
    width: 48px;
    background:#7F7F7F;
    color:#fff;
}

.calendar-wrap  .fc-icon {
    font-size: 22px;
    line-height: 1.5;
}

/* 0818 */
.fc .fc-daygrid-day.fc-day-today {
    background-color: rgba(144, 159, 137, 0.1);
}

.calendar-wrap .main-title-wrap {
    max-width: calc(100% - 400px);
    min-width: 420px;
}

.calendar-wrap #calendar {
    padding: unset;
}

.calendar-wrap .fc-toolbar.fc-header-toolbar {
    margin: 0;
}

.calendar-wrap .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk {
    display: flex;
    align-items: center;
    gap: 15px;
}

.calendar-wrap .fc-button {
    border:0;
    border-radius:4px;
    background-color: #909F89;
    width: 96px;
    height: 41px;
    font-size: 16px;
    font-family: 'Pretendard';
}

.calendar-wrap .fc-today-button {
    width: 96px;
    height: 41px;
    background-color: #909F89;
    color:#fff;
    font-weight: 500;
}

.calendar-wrap .fc-button-group {
    background:#7F7F7F;
    border-radius: 4px;
    overflow: hidden;
}

.calendar-wrap .fc-prev-button,
.calendar-wrap .fc-next-button {
    width: 48px;
    background:#7F7F7F;
    color:#fff;
}

.calendar-wrap  .fc-icon {
    font-size: 22px;
    line-height: 1.5;
}
/* 캘린더 / 모달 */
.cursor-pointer {
    cursor: pointer;
}
.cursor-default {
    cursor: default;
}
.status-txt{
    z-index: 99;
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 14px;
    padding: 6px 12px;
    border-radius: 999px;
    color: #fff;
}
.status-txt.state_blu{
    background-color: #1890ff;
}
.status-txt.state_red{
    background-color: #df1616;
}
.status-txt.state_gra{
    background-color: #7d7d7d;
}

/* 캘린더 스타일 */
.reservation-page {
    .filter-check-item,
    .filter-check-item * {
        transition: 0.2s;
    }
    .filter-check-item .icon {
        width: 12px;
        height: 12px;
        background-image: url(/images/icons/icon_plus_gold.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
    }
    input:checked + .filter-check-item {
        border: 1px solid var(--color-gold-button);
        background-color: rgba(194, 172, 133, 0.08);
    }
    input:checked + .filter-check-item .icon {
        background-image: url(/images/icons/icon_check_gold.png);
    }
    input:checked + .filter-check-item p {
        color: #c2ac85;
    }

    .fc-theme-standard .fc-scrollgrid {
        border: 0px none;
    }
    .fc .fc-col-header,
    .fc .fc-daygrid-body table {
        border-collapse: separate !important;
        border-spacing: 1px !important;
    }
    .fc-theme-standard td,
    .fc-theme-standard th {
        border: 0;
    }
    .fc-col-header-cell {
        background-color: #000;
    }
    .fc-col-header-cell:first-child {
        border-top-left-radius: 16px;
    }
    .fc-col-header-cell:last-child {
        border-top-right-radius: 16px;
    }
    .fc-col-header-cell > div {
        line-height: 56px;
        font-size: 16px;
        font-weight: 500;
        color: #fff;
    }
    .fc .fc-daygrid-day-top {
        justify-content: center;
        height: 100%;
        align-items: center;
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        font-size: 20px;
        font-weight: 500;
        color: #000;
        transition: 0.2s;
        border: 2px solid transparent;
        border-radius: 8px;
    }
    .fc .fc-daygrid-day {
        height: 120px;
        border-radius: 8px;
        overflow: hidden;
    }
    .fc .fc-daygrid-day.fc-day-today,
    .fc .fc-daygrid-day-frame.fc-scrollgrid-sync-inner {
        background: none;
        box-shadow: none;
    }

    .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number {
        border: 0;
        background: none;
    }
    .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-top {
        background-color: rgba(63, 79, 255, 0.08);
        width: 100%;
        height: 100%;
    }
    .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-top::after {
        content: "TODAY";
        display: block;
        position: absolute;
        width: 70px;
        line-height: 30px;
        background-color: rgba(63, 79, 255, 0.12);
        font-size: 14px;
        font-weight: 500;
        color: #3f4fff;
        text-align: center;
        left: 0;
        top: 0;
        border-radius: 8px;
    }
    .fc .fc-daygrid-day.is-disabled .fc-daygrid-day-top {
        background-color: rgba(0, 0, 0, 0.12);
        color: rgba(0, 0, 0, 0.4);
    }
    /* 캘린더 선택 상태 스타일 */
    .fc-daygrid-day.is-selected-start .fc-daygrid-day-top,
    .fc-daygrid-day.is-selected-end .fc-daygrid-day-top {
        border-color: #c33131;
        color: #c33131;
        border-radius: 8px;
    }
    .fc-daygrid-day.is-in-range .fc-daygrid-day-top {
        background-color: rgba(195, 49, 49, 0.12) !important;
    }

    /* 예약 대기(선택 가능) 셀 배경 */
    .fc-daygrid-day.is-waiting .fc-daygrid-day-top {
        background: #e7dece;
        color: #c2ac85;
    }
}