@charset "utf-8";

/*
 *
 * file : header, wrapper, #ft 공통 레이아웃
 * date : 230407
 * writer : eun
 *
 */

/* button */
.btn-popup{position:absolute;top:50%;transform:translateY(-50%);background:url('../img/comm/ico-search.png') var(--color-m) center no-repeat;width:24px;height:24px;text-indent:-999%;overflow:hidden;border-radius:5px;right:5px;background-size:15px}
.btn-base{background-color:var(--color-m);color:#fff}
.btn-popup-rel{display:flex;flex-shrink:0;background:url('../img/comm/ico-search.png') var(--color-m) center no-repeat;width:24px;height:24px;text-indent:-999%;overflow:hidden;border-radius:5px;background-size:15px}
.frm-search:has(.btn-popup-rel){display:flex;gap:5px;align-items:center}
.btn-base:hover{background-color:var(--color-h);color:#fff}
.btn-bg-cancel{background-color:#ff8100;color:#fff}
.btn-bg-cancel:hover{background-color:#fd6811}
.btn-plus{background-color:#033b8f;color:#fff}
.btn-plus:hover{background-color:#032456}
.btn-bg-canceld{background-color:#ff6c03;color:#fff}
.btn-bg-canceld:hover{background-color:#df5f04;color:#fff}
.btn-save{background-color:#47abe5;color:#fff}
.btn-save:hover{background-color:#1b84c1}
.flex-shrink{flex-shrink:0}
.btn-frm{display:flex;align-items:center;height:30px;padding:5px;font-size:.938rem;justify-content:center;background-color:#f5f7ff;border:1px solid var(--color-line);flex-shrink:0;border-radius:5px}
.btn-basic{color:#fff;background:var(--color-m);min-width:135px;height:45px;padding:10px 20px;display:flex;align-items:center;justify-content:center;border-radius:3px;transition:.3s;gap:5px}
.btn-basic:hover{background-color:var(--color-h)}
.btn-basic.btn-cancel{background-color:#888}
.btn-basic.btn-cancel:hover{color:#fff}
.btn-basic.btn-danger{background-color:red}
.btn-excel{background-color:#00895d;color:#fff}
.btn-excel:hover{background-color:#006746;color:#fff}

.input-70{max-width:70px}
.input-100{max-width:100px}
.input-120{max-width:120px}
.input-150{max-width:150px}
.input-170{max-width:170px}

aside{position:fixed;width:130px;top:0;z-index:5000;background-color:#fff;border:1px solid red;padding:10px;right:-130px}
aside.on{right:0}
aside button{color:#fff;transform:translateX(-60px);width:50px;height:50px;border:1px solid red;background-color:#fff;background-color:red;}
aside a{display:block;font-size:14px;margin:2px 0}
aside a:hover{text-decoration:underline;}
.guide-section{font-size:50px;font-weight:600;background-color:var(--color-line);}

.tab-select-wrap{display:flex;justify-content:space-between;margin:20px 0;border-bottom:1px solid var(--color-border)}
.tab-select-wrap .btn-wrap{display:flex;gap:5px;align-items:center}
.tab-select-wrap .btn-wrap .input-text{min-width:100px;width:max-content}
.tab-select-wrap .tab-wrap{border-bottom:0}
.tab-wrap{display:flex}
.tab-wrap .tab-item{display:flex;height:45px;padding:0 10px;min-width:100px;background-color:#f5f5f5;align-items:center;justify-content:center;gap:5px;border-left:1px solid var(--color-border);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
.tab-wrap .tab-item:last-child{border-right:1px solid var(--color-line)}
.tab-wrap .tab-item:hover,
.tab-wrap .tab-item.on{background-color:var(--color-m);color:#fff}

/* 상단 레이아웃 */
body .ds-logo,
body .gn-logo,
body .bdu-logo{display:none}
body .logo .txt{display:block}
body.bdu .ds-logo,
body.bdu .gn-logo,
body.bdu .logo .txt{display:none}
body.bdu .bdu-logo{display:block}
body.ds .bdu-logo,
body.ds .gn-logo,
body.ds .logo .txt{display:none}
body.ds .ds-logo{display:block}
body.gn .bdu-logo,
body.gn .ds-logo,
body.gn .logo .txt{display:none}
body.gn .gn-logo{display:block}
#body-wrap{padding-left:300px;background-color:#eef2ff;min-height:100vh;transition:padding-left .3s}
#body-wrap.body-close #container{width:1560px}
#container{width:1600px;padding:20px;transition:width .3s}
#hd{position:fixed;top:0;left:0;min-height:100vh;width:300px;flex-shrink:0;background-color:#fff;border:1px solid var(--color-border);z-index:1000;transition:.3s;border-top:0}
#hd_h1{position:absolute;font-size:0;line-height:0;overflow:hidden}
#nav .nav-wrap{overflow-y:auto;height:calc(100vh - 110px)}
#nav .logo{height:110px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--color-border)}
#nav .logo h1{font-family:'Paperlogy-8ExtraBold';font-size:1.35rem}
#nav .logo img{width:170px;margin:0 auto}
#nav .inner{padding-left:40px}
#nav .side-menu{position:fixed;top:110px;left:0;min-height:calc(100vh - 110px);background-color:var(--color-m);width:40px;z-index:200}
#nav .side-menu a{display:block;text-indent:-999%;overflow:hidden;width:100%;height:40px}
#nav .side-menu .btn-close{background:url('../img/comm/ico-arrow.png') center no-repeat;transition:.3s}
#nav .side-menu .btn-home{background:url('../img/comm/ico-home.png') center no-repeat}
#nav .gnb-1li{border-bottom:1px solid var(--color-border)}
#nav .gnb-1item{position:relative;display:block;padding:0 20px 0 50px;line-height:50px;color:#787e95;background:url('../img/comm/menu-ico00.png') 20px center no-repeat;font-weight:500}
#nav .gnb-1item.on,
#nav .gnb-1item:hover{background-color:#f5f7ff;color:#000}
#nav .gnb-1item.add-sub:after{position:absolute;transition:.3s;right:20px;top:50%;transform:translateY(-50%);content:"\e943";font-family:'xeicon'}
#nav .gnb-1item.on.add-sub:after{transform:translateY(-50%) rotate(-180deg)}
#nav .gnb-1li:nth-child(2) .gnb-1item{background-image:url('../img/comm/menu-ico01.png')}
#nav .gnb-1li:nth-child(3) .gnb-1item{background-image:url('../img/comm/menu-ico02.png')}
#nav .gnb-1li:nth-child(4) .gnb-1item{background-image:url('../img/comm/menu-ico03.png')}
#nav .gnb-1li:nth-child(5) .gnb-1item{background-image:url('../img/comm/menu-ico04.png')}
#nav .gnb-1li:nth-child(6) .gnb-1item{background-image:url('../img/comm/menu-ico05.png')}
#nav .gnb-1li:nth-child(7) .gnb-1item{background-image:url('../img/comm/menu-ico06.png')}
#nav .gnb-2li:last-child{padding-bottom:10px}
#nav .gnb-2wrap{display:none;padding-left:40px;background-color:#f5f7ff}
#nav .gnb-2item{background:url('../img/comm/ico-plus.png') left center no-repeat;padding-left:30px;line-height:40px;color:#000;display:block;font-weight:500;font-size:.975em}
#nav .gnb-2item.on{background-image:url('../img/comm/ico-minus.png')}
#nav .gnb-3wrap{display:none;padding-left:30px}
#nav .gnb-3item{background:url('../img/comm/ico-book.png') left center no-repeat;color:#000;padding-left:20px;line-height:30px;font-size:.875em}
#nav .gnb-3item:hover,
#nav .gnb-3item.on{color:#000;background-image:url('../img/comm/ico-book-on.png')}

#top-menu{display:flex;justify-content:space-between;align-items:center}
#top-menu .search-wrap{width:60%;align-items:center;position:relative}
#top-menu .search-wrap .radius-wrap{display:flex}
#top-menu .search-wrap .input-text{height:40px}
#top-menu .search-wrap .input-text:first-child{border-right:1px solid var(--color-border)}
#top-menu .search-wrap .btn-search{background:url('../img/comm/ico-search.png') var(--color-m) center no-repeat;border-radius:10px;width:35px;height:35px;position:absolute;right:5px;top:50%;transform:translateY(-50%);text-indent:-999%;overflow:hidden}
#top-menu .search-wrap select.input-text{flex-basis:200px}
#top-menu .tab-list{display:flex;border-left:1px solid var(--color-line);flex-wrap:wrap}
#top-menu .tab-list .tab-item{position:relative;min-width:150px;height:40px;display:flex;align-items:center;padding-right:40px;padding-left:20px;border-bottom:1px solid var(--color-line);border-top:1px solid var(--color-line);background-color:#fff;border-right:1px solid var(--color-line);margin:2px 0}
#top-menu .tab-list .tab-item.on{background-color:var(--color-m);color:#fff}
#top-menu .tab-list .tab-item.on .close{color:#fff}
#top-menu .tab-list .tab-item .close{position:absolute;right:10px;top:50%;transform:translateY(-50%)}
.quick-wrap .radius-wrap{height:40px}
.quick-wrap a{background-color:#fff;color:#747b92;border-left:1px solid #c9d5f7}
.quick-wrap a:first-child{border-left:0}
.quick-wrap a:hover{background-color:var(--color-m);color:#fff}
.quick-wrap .btn-setting{text-indent:-999%;overflow:hidden;width:40px;height:40px;background:url('../img/comm/ico-cog.png') #fff center no-repeat;display:block;background-size:20px; display: none;}
.quick-wrap .btn-setting:hover{background-image:url('../img/comm/ico-cog-on.png')}
.quick-wrap .btn-ico{padding:0 15px}
.quick-wrap .radius-wrap{display:flex}
.radius-wrap{border-radius:10px;box-shadow:3px 2px 14px 4px rgba(75,144,245,.1);overflow:hidden;border:1px solid var(--color-line)}
.radius-wrap .input-text{border:0;border-radius:0}
.address-wrap{display:flex;gap:5px}

.btn-right-wrap{display:flex;gap:5px;justify-content:flex-end;margin:10px 0}
.btn-right-wrap > *{min-width:110px;height:30px;border-radius:5px;font-size:.938rem;align-items:center;justify-content:center;display:flex;padding:0 10px}

#sub-menu{margin:20px 0 10px 10px}
#sub-menu ol{display:flex;align-items:center}
#sub-menu li{position:relative;padding-right:10px}
#sub-menu li:after{font-family:'xeicon';content:"\e940";margin-left:10px}
#sub-menu li:last-child{color:var(--color-m)}
#sub-menu li:last-child:after{display:none}

.h2-tit{font-size:22px;color:#000}
.h2-tit .info{font-size:.875rem;color:#ccc;font-style:italic}

#wrapper{border:1px solid #d6e0ff;padding:20px;background-color:#fff;min-height:calc(100vh - 135px);border-radius:var(--radius)}
.title-wrap{display:flex;justify-content:space-between;margin-bottom:20px;align-items:center}
.title-wrap .btn-wrap{display:flex;height:100%}
.title-wrap .btn-wrap .btn-ico{display:flex;flex:1;width:140px;height:40px;justify-content:center;align-items:center;border-right:1px solid #e0e4f0;color:#747b92;gap:5px}
.title-wrap .btn-wrap .btn-ico:last-child{border-right:0}
.title-wrap .btn-wrap .btn-ico:hover{background-color:var(--color-m);color:#fff}
.title-wrap .btn-wrap i{font-size:1.4em}
.title-wrap .frm-flex{display:flex;gap:5px;align-items:center}
label{font-size:.875em}

.btn-ico{display:flex;gap:5px;align-items:center}

.board-search{border-radius:10px;background-color:#f5f7ff;border:1px solid var(--color-line);padding:10px}
.board-search .inner{display:flex;gap:5px;flex-wrap:wrap}
.board-search .frm-item{position:relative;display:flex;gap:5px;flex:calc(33.333% - 7.5px);align-items:center}
.board-search .frm-item.w40{min-width:40%}
.board-search .label-txt{font-weight:500;min-width:100px;padding-left:10px;margin:0}
.board-search .calendar-wrap{display:flex;gap:5px;align-items:center}
.frm-search{position:relative}
.frm-search .input-text{padding-right:40px}

.con-box{margin:10px 0}
.flex-wrap{display:flex;flex-wrap:wrap;gap:10px}
.flex-wrap .flex-half{flex:1;border-radius:10px;border:1px solid var(--color-line)}
.flex-wrap .flex-full{width:100%;border-radius:var(--radius);border:1px solid var(--color-line)}
.flex-wrap .flex-half{width:calc(50% - 5px)} /* grid 벗어나는 문제 해결 */
.flex-wrap .flex-half:only-child{width:100%} /* grid 벗어나는 문제 해결 1개일 때 */

.flex-wrap .flex-third{flex:1;border-radius:10px;border:1px solid var(--color-line)}
.flex-wrap .flex-third{width:calc(33% - 5px)} /* grid 벗어나는 문제 해결 */
.flex-wrap .flex-third:only-child{width:100%} /* grid 벗어나는 문제 해결 1개일 때 */

.flex-wrap .view-wrap{padding:20px;display:flex;gap:5px;flex-wrap:wrap;flex-direction:column}
.flex-wrap .view-wrap .view-subject{padding:5px 10px;background-color:var(--color-line);font-weight:500}
.flex-wrap .view-wrap .frm-list{display:flex;gap:5px}
.flex-wrap .view-wrap .frm-item{display:flex;gap:5px;align-items:center;flex:1}
.flex-wrap .view-wrap .frm-item.flex-item-half{flex:initial;width:50%}
.flex-wrap .view-wrap .frm-item.flex-auto{flex:initial}
.flex-wrap .view-wrap .file-inner{display:flex;gap:5px;align-items:center}
.flex-wrap .view-wrap .file-inner img{max-width:50%}
.flex-wrap .view-wrap .file-inner .btn-wrap{display:flex;gap:5px;flex-wrap:wrap}
.flex-wrap .view-wrap .file-inner .btn-wrap a{width:calc(50% - 2.5px)}
.flex-wrap .view-wrap .file-inner .info{color:var(--color-p);font-size:.938rem}
.flex-wrap .view-wrap .label-txt{flex-shrink:0;min-width:113px;font-size:14px;text-align:right; font-weight:bold;}
.flex-wrap .calendar-wrap{display:flex;align-items:center;gap:5px}
.flex-wrap .label-txt + *{flex-grow:1}
.flex-wrap .calendar-date-wrap{display:flex;gap:5px}
.flex-wrap .calendar-date-wrap .date{display:flex;gap:5px;align-items:center}
.flex-wrap .calendar-date-wrap .date .label-txt{min-width:auto}
.flex-wrap .calendar-date-wrap .date .input-text{width:60px}
.flex-wrap.move-wrap{position:relative;gap:50px}
.flex-wrap.move-wrap .btn-arrow-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;gap:10px;flex-direction:column}
.flex-wrap.move-wrap .btn-arrow-wrap > *:hover{background-color:var(--color-m);color:#fff;border-color:var(--color-m)}

.flex-wrap .flex-half.tab-layout{border:0;border-radius:0}
.flex-wrap .flex-half.tab-layout .tab-wrap{margin-bottom:10px}
.flex-wrap .flex-half.tab-layout .tab-inner{border:1px solid var(--color-line);border-radius:10px}

.flex-wrap .flex-20{width:20%;border-radius:10px;border:1px solid var(--color-line)}
.flex-wrap .flex-20 + .flex-grow{width:calc(80% - 10px)}
.flex-wrap .flex-grow{flex-grow:1;border-radius:10px;border:1px solid var(--color-line)}
.frm-list-wrap{display:flex;gap:5px;width:100%;flex-wrap:wrap}
.frm-list-wrap .frm-list-half{display:flex;gap:5px;width:calc(50% - 2.5px)}

/* RACK 230427 */
.location-rack-wrap{position:relative;display:flex;gap:40px;margin:20px 0;align-items:flex-start}
.location-rack-wrap .rack-wrap,
.location-rack-wrap .dan-wrap{width:calc(50% - 20px)}
.location-rack-wrap .rack-wrap{background-color:#f5f7ff;border:1px solid var(--color-line);padding:20px;transition:box-shadow .2s}
.location-rack-wrap .rack-wrap:hover{box-shadow:2px 5px 19px 0 rgba(0,0,0,.4)}
.location-rack-wrap .dan-wrap{padding:20px;transition:box-shadow .2s}
.location-rack-wrap .dan-wrap:hover{box-shadow:2px 5px 19px 0 rgba(0,0,0,.4)}
.location-rack-wrap .subject{font-weight:bold;text-align:center;margin-bottom:10px}
.location-rack-wrap .rack-con{display:flex;flex-direction:column;width:100%;gap:5px}
.location-rack-wrap .rack-list{display:flex;align-items:center;gap:5px}
.location-rack-wrap .rack-list .tit{font-weight:500}
.location-rack-wrap .rack-item{display:flex;align-items:center;gap:5px;flex:1}
.location-rack-wrap .rack-item:last-child{flex-direction:row-reverse}
.location-rack-wrap .rack-item table{width:100%}
.location-rack-wrap .rack-item td{border:1px solid var(--color-border);text-align:center;cursor:pointer;background-color:#fff}
.location-rack-wrap .rack-item td.on,
.location-rack-wrap .rack-item td:hover{background-color:var(--color-m);color:#fff}
.location-rack-wrap .rack-item td.last,
.location-rack-wrap .rack-item td:hover{color:#f00}
.location-rack-wrap .dan-con table{width:100%;text-align:center}
.location-rack-wrap .dan-con tr.on td{background-color:var(--color-m);color:#fff}
.location-rack-wrap .dan-con th{width:50px}
.location-rack-wrap .dan-con td{border:1px solid var(--color-border);padding:15px 5px;cursor:pointer}
.location-rack-wrap .dan-con .no-select{background-color:var(--color-p);color:#fff;padding:10px 5px;cursor:default}
.location-rack-wrap .dan-con td.on,
.location-rack-wrap .dan-con td:hover{background-color:var(--color-m);color:#fff}
.location-rack-wrap .btn-arrow-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;gap:10px;flex-direction:column}

/* show loading */
#js-loading{position:fixed;background-color:rgba(0,0,0,0.4);font-size:3rem;color:#fff;width:100vw;height:100vh;top:0;left:0;z-index:1000;display:none;}
#js-loading .inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%}

/* show layer popup */
#js-popup-wrap{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.8);z-index:1000}
#js-popup-wrap .js-popup-inner{position:absolute;top:50%;left:50%;width:1200px;height:600px;max-height:80vh;transform:translate(-50%,-50%);background-color:#fff;border-radius:15px;overflow:hidden}
#js-popup-wrap .header{display:flex;padding:10px 20px;height:50px;background-color:var(--color-m);color:#fff;align-items:center;position:relative}
#js-popup-wrap .popup-con{padding:20px;height:calc(100% - 40px);overflow-y:auto}
#js-popup-wrap .js-popup-close-btn{position:absolute;top:50%;right:20px;font-size:1.6rem;transform:translateY(-50%);color:#fff}

/* 본문 바로가기 */
#skip-to-container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip-to-container a:focus, #skip-to-container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}

/* flexble */
.guide-wrap{background-color:#fff;padding:20px}
.guide-wrap > *{text-align:center;font-weight:500;font-size:1.25rem}
.flex-cnt .flex-1{flex-basis:10%}
.flex-cnt .flex-2{flex-basis:20%}
.flex-cnt .flex-3{flex-basis:30%}
.flex-cnt .flex-4{flex-basis:40%}
.flex-cnt .flex-5{flex-basis:50%}
.flex-cnt .flex-6{flex-basis:60%}
.flex-cnt .flex-7{flex-basis:70%}
.flex-cnt .flex-8{flex-basis:80%}
.flex-cnt .flex-9{flex-basis:90%}
.flex-cnt .flex-10{flex-basis:100%}
.flex-cnt{--columns:3;--gap:10px;--gap-count:calc( var(--columns) - 1 );display:flex;flex-wrap:wrap;gap:var(--gap)}
.flex-item-1{--columns:1}
.flex-item-2{--columns:2}
.flex-item-4{--columns:4}
.flex-item-5{--columns:5}
.flex-item-6{--columns:6}
.flex-cnt{margin:10px 0}
.flex-cnt .flex-1{flex-basis: calc( 10% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-2{flex-basis: calc( 20% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-3{flex-basis: calc( 30% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-33{flex-basis: calc( 33.333% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-4{flex-basis: calc( 40% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-5{flex-basis: calc( 50% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-6{flex-basis: calc( 60% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-7{flex-basis: calc( 70% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-8{flex-basis: calc( 80% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-9{flex-basis: calc( 90% - var(--gap) * var(--gap-count) / var(--columns) ) }
.flex-cnt .flex-10{flex-basis: calc( 100% - var(--gap) * var(--gap-count) / var(--columns) ) }

/* 주소검색 */
#adderss_popup_wrap{position:absolute;top:35px;width:500px;height:300px;z-index:100;border:1px solid var(--color-border)}
#adderss_popup_wrap .btn-address-close{position:absolute;right:-20px;top:-45px;font-size:2.4rem;color:#033b8f;z-index:200}
.address-wrap-api{max-width:50%;display:flex;flex-direction:column;gap:5px}
.address-wrap-api .zip-wrap{position:relative;display:flex;gap:5px}
.address-wrap-api .zip-wrap .input-text{max-width:100px}
.address-wrap-api .detail-wrap{display:flex;gap:5px}

.toast-picker-wrap{position:absolute;top:35px;z-index:100}

.qnaIco{display:inline-block;background-color:#efefef;border-radius:5px;padding:5px 10px;min-width:65px;text-align:center;font-size:1rem}
.qnaIco.qnaIco2{background-color:#00a663;color:#fff}
.qnaIco.qnaIco3{background-color:var(--color-m);color:#fff}
.board-view-header{display:flex;gap:30px;width:100%;padding:30px;background:#f5f5f5;border-left:5px solid #00a663;align-items:center}
.board-view-header .header-img{flex-shrink:0}
.board-view-header .header-txt{flex-grow:1}
.board-view-header .header-tit{font-size:1.25rem; color:#444; font-weight:bold}
.board-view-header .header-info{margin-top:10px; padding-top:10px; border-top:1px solid var(--color-border)}
.board-view-header .header-info > p{font-size:18px; line-height:30px; color:#888;}
.board-view-header .header-info > ul > li{display:inline-block; position:relative; margin-right:15px; color:#8b8b8b}
.board-view-header .header-info > ul > li.name{padding:0 20px;}
.board-view-header .header-info > ul > li.name:before,
.board-view-header .header-info > ul > li.name:after{content:''; width:1px; height:15px; background:var(--color-border); position:absolute; top:50%;transform:translateY(-50%)}
.board-view-header .header-info > ul > li.name:before{left:0}
.board-view-header .header-info > ul > li.name:after{right:0}

.board-view-default{border-bottom:1px solid var(--color-border);padding:20px;min-height:300px}

.board-meeting-view{display:flex;gap:20px}
.board-meeting-view > *{width:calc(50% - 10px)}
.board-meeting-view .chat-wrap{position:relative;background-color:var(--color-m)}
.board-meeting-view .chat-wrap .chat-info{position:absolute;left:0;bottom:0;width:100%;padding:10px;background-color:var(--color-m);}
.board-meeting-view .chat-wrap .inner{display:flex;gap:5px;align-items:center;color:#fff}
.board-meeting-view .chat-wrap .inner > *:not(.input-text){flex-shrink:0}
.board-meeting-view .chat-wrap .inner .btn-basic{min-width:80px}
.board-meeting-view .chat-wrap .chat-inner{height:500px;overflow-y:scroll;padding:20px}
.board-meeting-view .chat-wrap .chat-inner::-webkit-scrollbar{width:10px;background-color:#faf7d4}
.board-meeting-view .chat-wrap .chat-inner::-webkit-scrollbar-thumb{background-color:#fff142}
.board-meeting-view .chat-inner .chat{position:relative;padding:5px 10px;display:inline-block;border-radius:5px;margin:5px 0}
.board-meeting-view .chat-inner .chat::before{position:absolute;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #ebebeb;border-left:5px solid transparent;width:0;height:0;content:"";left:-10px;top:50%;transform:translateY(-50%)}
.board-meeting-view .chat-inner .user .chat{background-color:#ebebeb}
.board-meeting-view .chat-inner .name{color:#ebebeb}
.board-meeting-view .chat-inner .admin{display:flex;justify-content:flex-end;align-items:flex-end;flex-direction:column}
.board-meeting-view .chat-inner .admin .name{color:#fff14e}
.board-meeting-view .chat-inner .admin .chat{background-color:#fff14e}
.board-meeting-view .chat-inner .admin .chat::before{border-right-color:#fff14e;left:auto;right:-10px;transform:translateY(-50%) rotate(180deg)}

.k-grid td:has(.use-date-con){overflow:visible}
.tbl-btn{display:flex;gap:5px}
.tbl-btn i{color:#7d7d7d;font-size:1rem}
.tbl-btn .tbl-btn-box .use-date{position: relative;}
.tbl-btn .tbl-btn-box .use-date-con{position: absolute; left: 50%; top:25px; transform: translateX(-50%); background-color: white; padding: 10px; border: 1px solid var(--color-line); border-radius: 5px; z-index: 1; display:none}
.tbl-btn .tbl-btn-box .use-date:hover .use-date-con{display:block;}
.tbl-square-box{background-color: var(--color-m);color:#fff;padding:5px;border-radius:3px;min-width:15px;aspect-ratio:1/1;display:inline-flex;align-items:center;justify-content:center;line-height:0}

@media (max-width:1900px){
	#container{width:100%}
	#body-wrap.body-close #container{width:100%}
}

@media (max-width:1400px){
	.board-search .frm-item{gap:10px;flex:calc(50% - 5px)}

	.flex-wrap .view-wrap{gap:5px}
	.flex-wrap .view-wrap .label-txt{min-width:70px}
	.flex-wrap .view-wrap .frm-list{flex-wrap:wrap;gap:5px}
	.flex-wrap .view-wrap .frm-item{width:100%;flex:auto}
	.flex-wrap .calendar-wrap .date .input-text{width:40px}
}

@media (max-width:1200px){
	.title-wrap .btn-wrap .btn-ico{width:130px}

	#js-popup-wrap .js-popup-inner{width:90vw}
}

@media (max-width:1024px){
	html{font-size:14px}

	.mode-mobile{display:block}
	.mode-pc{display:none}

	/* mobile */
	#hd{width:250px;left:-210px}
	#body-wrap.body-close #hd{left:0}
	#nav .side-menu .btn-close{transform:rotate(-180deg)}
	#body-wrap{padding-left:40px}
	#body-wrap.body-close #nav .side-menu .btn-close{transform:rotate(0)}
	#top-menu .search-wrap{width:75%}
	#top-menu .tab-list .tab-item{width:120px;padding-left:10px;padding-right:20px}
	#nav .gnb-1item{padding:0 10px 0 40px;background-position-x:10px}
	#nav .gnb-2wrap{padding-left:20px}
	#nav .gnb-2item{padding-left:20px;background-size:13px}
	#nav .gnb-3wrap{padding-left:15px}

	.board-search .inner{gap:5px}
	.board-search .frm-item{flex-direction:column;align-items:flex-start;gap:5px}
	.board-search .label-txt{padding-left:0}
	.title-wrap .btn-wrap .btn-ico{width:120px}

	.flex-wrap .flex-half{flex:none;width:100%}

	.btn-popup{bottom:3px;top:auto;transform:none}

	.btn-menu:focus{outline:none}
	.menu-open .btn-menu:before{color:#59493f}
	.m-menu-box{width:24px;height:22px;display:inline-block;position:relative}
	.m-menu-binner,
	.m-menu-binner:after,
	.m-menu-binner:before{width:24px;height:3px;background-color:#fff;position:absolute;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:.15s;transition-duration:.15s;-webkit-transition-timing-function:ease;transition-timing-function:ease}
	.m-menu-binner{display:block;top:50%;width:20px;-webkit-transition-duration:.22s;transition-duration:.22s;-webkit-transition-timing-function:cubic-bezier(.55,.055,.675,.19);transition-timing-function:cubic-bezier(.55,.055,.675,.19)}
	.menu-open .m-menu-binner{-webkit-transform:rotate(225deg);transform:rotate(225deg);-webkit-transition-delay:.12s;transition-delay:.12s;-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1);background-color:#fff;width:24px}
	.m-menu-binner:before{content:"";display:block;top:-7.5px;-webkit-transition:top .1s ease-in .25s,opacity .1s ease-in;transition:top .1s ease-in .25s,opacity .1s ease-in}
	.menu-open .m-menu-binner:before{top:0;opacity:0;-webkit-transition:top .1s ease-out,opacity .1s ease-out .12s;transition:top .1s ease-out,opacity .1s ease-out .12s}
	.m-menu-binner:after{content:"";display:block;bottom:-7.5px;-webkit-transition:bottom .1s ease-in .25s,-webkit-transform .22s cubic-bezier(.55,.055,.675,.19);transition:bottom .1s ease-in .25s,-webkit-transform .22s cubic-bezier(.55,.055,.675,.19);transition:bottom .1s ease-in .25s,transform .22s cubic-bezier(.55,.055,.675,.19);transition:bottom .1s ease-in .25s,transform .22s cubic-bezier(.55,.055,.675,.19),-webkit-transform .22s cubic-bezier(.55,.055,.675,.19)}
	.menu-open .m-menu-binner:after{bottom:0;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transition:bottom .1s ease-out,-webkit-transform .22s cubic-bezier(.215,.61,.355,1) .12s;transition:bottom .1s ease-out,-webkit-transform .22s cubic-bezier(.215,.61,.355,1) .12s;transition:bottom .1s ease-out,transform .22s cubic-bezier(.215,.61,.355,1) .12s;transition:bottom .1s ease-out,transform .22s cubic-bezier(.215,.61,.355,1) .12s,-webkit-transform .22s cubic-bezier(.215,.61,.355,1) .12s;background-color:#fff}

	.scroll-view{width:100%;overflow-x:auto}
	.scroll-view table{width:1024px}

	.badge{font-size:.8rem;width:80px}

	.flex-cnt .flex-1,
	.flex-cnt .flex-2,
	.flex-cnt .flex-3,
	.flex-cnt .flex-33,
	.flex-cnt .flex-4,
	.flex-cnt .flex-5,
	.flex-cnt .flex-6,
	.flex-cnt .flex-7,
	.flex-cnt .flex-8,
	.flex-cnt .flex-9,
	.flex-cnt .flex-10{flex-basis:100%}

	.frm-list-wrap .frm-list-half{width:100%}
	.location-rack-wrap{gap:20px}
	.location-rack-wrap .rack-wrap, .location-rack-wrap .dan-wrap{width:calc(50% - 10px);padding:10px}

	.flex-wrap .flex-half{width:100%} /* grid 벗어나는 문제 해결 */

	.board-view-header{padding:20px}
	.board-meeting-view{flex-direction:column}
	.board-meeting-view > *{width:100%}
	.board-meeting-view .chat-wrap .inner{flex-wrap:wrap}
	.board-meeting-view .chat-wrap .btn-basic{width:calc(50% - 2.5px)}
	.board-meeting-view .chat-wrap .chat-info{box-shadow:-2px -5px 4px #ffffff0d}
}

/* only pc */
@media (min-width:1025px){
	#body-wrap.body-close{padding-left:40px}
	#body-wrap.body-close #hd{left:-260px}
	#body-wrap.body-close #nav .side-menu .btn-close{transform:rotate(-180deg)}
}

@media (max-width:720px){
	.btn-ico{gap:3px}
	.btn-popup{right:2px;background-size:13px;width:20px;height:20px;border-radius:2px}
	.btn-frm{height:25px}

	#wrapper{min-height:auto;padding:30px 10px}
	#top-menu{flex-direction:column-reverse;align-items:flex-end;gap:5px}
	#top-menu .search-wrap{width:100%}
	#top-menu .search-wrap select.input-text{flex-basis:100px}

	#sub-menu ol{flex-wrap:wrap}
	#sub-menu li{padding-right:5px}
	#sub-menu li:after{margin-left:5px}

	#container{padding:10px}
	.h2-tit{font-size:1.125rem;margin-bottom:10px}
	.title-wrap{flex-direction:column;margin-bottom:10px}
	.title-wrap .btn-wrap .btn-ico{min-width:80px;width:auto;padding:0 3px}
	.flex-wrap .view-wrap{padding:20px 10px}
	.flex-wrap .view-wrap .frm-item{flex-direction:column;gap:5px;align-items:flex-start}
	.flex-wrap .view-wrap .file-inner{flex-direction:column}
	.flex-wrap .calendar-date-wrap{flex-wrap:wrap}
	.flex-wrap.move-wrap .btn-arrow-wrap{gap:5px;flex-direction:row}
	.flex-wrap.move-wrap .btn-arrow-wrap .btn-prev{transform:rotate(-90deg);}
	.flex-wrap.move-wrap .btn-arrow-wrap .btn-next{transform:rotate(-90deg);}
	.radius-wrap{border:1px solid var(--color-line)}
	.address-wrap{flex-wrap:wrap}

	.board-search{padding:20px 10px}
	.board-search .frm-item{flex:100%}

	.btn-right-wrap{flex-wrap:wrap}
	.btn-right-wrap > *{min-width:70px;height:30px;border-radius:3px}

	.tab-select-wrap{flex-direction:column-reverse;gap:5px;margin:10px 0}
	.tab-select-wrap .tab-wrap{justify-content:center}
	.tab-select-wrap .btn-wrap{justify-content:center}
	.tab-wrap .tab-item{flex:1 1 50%;height:35px}

	#adderss_popup_wrap{max-width:70vw}
	.address-wrap-api{max-width:100%;width:100%}

	#js-popup-wrap .js-popup-inner{border-radius:10px}

	.location-rack-wrap{flex-direction:column}
	.location-rack-wrap .rack-wrap, .location-rack-wrap .dan-wrap{width:100%}
	.location-rack-wrap .dan-con th{width:26px}
	.location-rack-wrap .dan-con td{padding:10px 0}
}

/* 멀티 첨부파일 관련 css */
.insert {
    display: block;
    width: 600px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.insert .file-list{border-radius:5px;
    height: 80px;
    overflow: auto;
    border:1px solid #c9d5f7;
    padding: 2px 0 2px 10px;
}
.insert .file-list .filebox p {
    font-size: 14px;
    display: inline-block;
}
.insert .file-list .filebox .delete-file {
    cursor: pointer;
}
.insert .file-list .filebox .delete-file i{
    color: #ff5353;
    margin-left: 5px;
}

.insert label {
  display: inline-block;
  padding: .3em .75em;
  color: #999;
  font-size: inherit;
  line-height: normal;
  vertical-align: middle;
  background-color: #fdfdfd;
  cursor: pointer;
  border: 1px solid #ebebeb;
  border-bottom-color: #e2e2e2;
  border-radius: .25em;
}

.insert input[type="file"] {  /* 파일 필드 숨기기 */
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0;
}