.insert.relative{position: relative;}

.left_move_btn_container{float:left; width: calc(100% - 112px);}
.right_move_btn_container{float:right; width: 96px;}

/* 디지털 라이브러리 */
.body-container .body-box-gray{background-color: transparent;}
.adm_header .gnb > li{width: 14%;}
.out-tit-container h4 > b { font-weight: 700;}
.lb-btn-con{text-align: right;}
.lb-btn-con .lb-btn{width: 133px; height: 32px;}

.box-search{display: flex; justify-content: space-between;}
.box-search .box_input{width: 100%;}
.box-search button.button_box{height: 36px; margin-left: 4px; line-height: 36px; width: 80px; border: 1px solid #dcdee1; background-color: #dcdee1;}

.samplelist-select{/* height: 400px;  */border: 1px solid #ddd; border-radius: 5px; overflow: hidden;}
.samplelist-select .sample-list{overflow-y: auto; height:400px;}
.samplelist-select table{ width: 100%; table-layout: fixed;}
.samplelist-select table th{background-color: #f9f9f9; height: 40px; border-bottom: 2px solid #eee; text-align: center; padding: 8px 10px;vertical-align: middle;}
.samplelist-select table td{color:#777;font-weight:300; cursor: pointer; height: 40px;padding: 8px 10px; border-bottom: 1px solid #eee;  font-family: 'Noto Sans KR',sans-serif;}
.samplelist-select table .check{text-align: center; width: 40px;}
.samplelist-select table .p-num{letter-spacing: 1.5px; transition: all .2s;}
.samplelist-select table .p-num:hover{background-color: #f5f7fa; }
.samplelist-select table .sms-name{width: 100px; cursor: pointer; transition: all .2s; }
.samplelist-select table .sms-name:hover{background-color: #f5f7fa;}
.samplelist-select table .sms-name p{overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block;}
.samplelist-select table .sms-phone a{overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block;}

.samplelist-select table .added-img{width: 80px;}
.samplelist-select table .added-img img{width: 100%;}
.samplelist-select table .added-location{width: 70px;}
.samplelist-select table .added-location span.block{display: block;}
/* .samplelist-select table .p-num p{overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block;}
.samplelist-select table .p-num a{overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block;} */

.print-box{text-align: right;}
input.btn-print{background-color: #fff;
   cursor: pointer;
   color: #1f6bbb;
   background-image: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/GNG/157340483917304.png);
   background-size: 24px 24px;
   padding-left: 32px;
   padding-right: 8px;
   background-repeat: no-repeat;
   background-position: 6px center;
   background-size: contain;
}



.body-library{min-height: 600px; position: relative;}
.library-gird{display: grid; min-width: 840px; 
    grid-template-columns: [col1-start] 19%  [col2-start] 19%  [col3-start] 19% [col4-start] 19% [col5-start] 19% [col5-end];
    grid-template-rows: [row1-start] auto [row2-start] auto  [row3-start] auto [row4-end];
    /* grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(5,180px); */
    gap:10px
 }
.library-gird .grid-box{display: flex; justify-content: center;  padding: 20px;
box-sizing: border-box; position: relative; /* border: 2px solid #777; */}
.library-gird .grid-box.a{grid-column-start: 1; grid-column-end: 5; grid-row-end: 2;}
.library-gird .grid-box.b{grid-row-start: 1; grid-row-end:4; grid-column-start: 5; grid-column-end: 6;}
.library-gird .grid-box.c{grid-row-start: 2; grid-row-end: 3; grid-column-start: 2; grid-column-end: 1; justify-content: flex-end;}
.library-gird .grid-box.d{grid-row-start: 2; grid-row-end: 3; grid-column-start: 3; grid-column-end: 2;}

.library-gird .grid-box.e{grid-row-start: 2; grid-row-end: 3; grid-column-start: 3; grid-column-end: 4;}
.library-gird .grid-box.f{grid-row-start: 2; grid-row-end: 3; grid-column-start: 4; grid-column-end: 5;}

.library-gird .grid-box.g{grid-column-start: 1; grid-column-end: 5; align-items: flex-end;}


.gird-horizontal ul.step01{width: 100%;}
.gird-horizontal ul.step01>li{width: 20%; float: left; position: relative; }
.gird-horizontal ul.step01>li + li{padding-left: 8px;}
.gird-horizontal ul.step01>li .bookshelf{border-radius:5px;  cursor: pointer; transition: all .4s; padding: 10px 15px; border:1px solid #dcdee1; background-color:#fff; text-align: center; position: relative;}
.gird-horizontal ul.step01>li .bookshelf:hover{background-color: #1f6bbb; color:#fff; border: 1px solid #1f6bbb; box-shadow: 2px 4px 5px rgba(0,0,0,0.2);}
.gird-horizontal ul.step01>li .bookshelf.books_on{background-color: #1f6bbb; color:#fff; border: 1px solid #1f6bbb; box-shadow: 2px 4px 5px rgba(0,0,0,0.2);}
.gird-horizontal ul.step01>li .bookshelf .dot-btn{cursor: pointer;  z-index: 10; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); }
.gird-horizontal ul.step01>li .bookshelf .dot-btn::before{content: ""; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; top: 7px; right: 0;}
.gird-horizontal ul.step01>li .bookshelf .dot-btn::after{content: ""; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; bottom: 7px;  right: 0;}

.bookshefOn{border-radius: 5px;   display: none; padding:15px;  right: 0; min-width: 100px; height: 176px; overflow: hidden; overflow-y: auto;  margin-left: auto; position: absolute; z-index: 99;  box-shadow: 2px 4px 5px rgba(0,0,0,0.2); background-color: #fff;}
.bookshefOn h5{color:#1f6bbb; font-weight: 700; padding:10px; padding-top: 0;}
.bookshefOn .step02 li{padding: 5px 10px; cursor: pointer;  }
.bookshefOn .step02 li span{width: 100%; display: block;}
.bookshefOn .step02 li:hover{background-color: #ddeaf7; border-radius: 5px;}

.gird-column ul.step01{height: 100%;}
.gird-column ul.step01>li{display: block; margin-left: 8px;  position: relative;}
.gird-column ul.step01>li + li{margin-top: 8px; }

.gird-column ul.step01>li .bookshelf{border-radius: 5px; max-width: 60px; width: auto; margin: auto;  cursor: pointer; transition: all .4s;  min-height: 147px; position: relative; display: table; height: 100%; padding: 5px; border: 1px solid #dcdee1;background-color:#fff; text-align: center;}
.gird-column ul.step01>li .bookshelf:hover{background-color: #1f6bbb; color:#fff; border: 1px solid #1f6bbb; box-shadow: 2px 4px 5px rgba(0,0,0,0.2);}
.gird-column ul.step01>li .bookshelf.books_on{background-color: #1f6bbb; color:#fff; border: 1px solid #1f6bbb; box-shadow: 2px 4px 5px rgba(0,0,0,0.2);}
.gird-column ul.step01>li .bookshelf .dot-btn{cursor: pointer; z-index: 10; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; left: 50%; top: 10px; transform: translateX(-50%); }
.gird-column ul.step01>li .bookshelf .dot-btn::before{content: ""; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; top: 0; right: 7px;}
.gird-column ul.step01>li .bookshelf .dot-btn::after{content: ""; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; top: 0px;  left: 7px;}

.f-rotate ul.step01>li .bookshelf span{ display: table-cell; vertical-align: middle;}

.gird-column ul.step01>li .bookshefOn{position: absolute; top: 0; right: 0;}

.library-info{position: relative;}
.library-info .dot-btn{cursor: pointer; z-index: 10; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; right:0; top: 50%; transform: translateY(-50%); }
.library-info .dot-btn::before{content: ""; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; top: 7px; right: 0;}
.library-info .dot-btn::after{content: ""; width: 4px; height: 4px; border-radius: 100%; background-color: #dcdee1; position: absolute; bottom: 7px;  right: 0}

.library-edit{position: absolute;display: block; font-size:14px;  cursor: pointer; transition: all .2s;  background-color:#fff; z-index: 99; border-radius: 5px; border: 1px solid #fff;  display: block; right: 0; padding: 5px 22px; box-shadow: 3px 2px 6px rgba(0,0,0,0.2);}
.library-edit:hover{ color:#fff; background-color: #6398d0; border: 1px solid #6398d0;}

.library-after-wrap{display: flex; justify-content: space-between;}
.library-after-wrap input{width: 100%;}
.library-after-wrap button{width: 80px; margin-left: 4px; border: 1px solid #3e7bbf; background-color: #3e7bbf; color:#fff; }


/* 라이브러리 카테고리별 제고수량 */
.cat-list p{color:#222;}
.cat-list p span{color:#899aae; margin-left: 4px; font-weight: bold;}
.cat-depth01{margin-top: 22px;}
.cat-depth01>p{font-weight: bold; color:#222; position: relative; cursor: pointer;  font-size: 16px;}
.cat-depth01>p i{position: absolute; right: 0; transform: rotate(-90deg); top: 4px; transition: all .2s;}
.cat-depth01.rotate>p i{transform: rotate(0deg);}
.cat-depth02{padding-left: 16px; display: none; }
.cat-depth02 p{padding-top: 6px;}
.cat-depth02>p{position: relative;  font-weight: 700; /* border-top: 1px solid #ddd;margin-top: 16px;padding-top: 14px; */}
.cat-depth02>p>span,.cat-depth01>p span{color:#222; font-weight: bold;}
/* .cat-depth02>p:nth-child(1){   border-top: none;
    margin-top: 0;
    padding-top: 6px; } */
.cat-depth02>p::before{    width: 3px; height: 3px;background-color: #5f5f5f;position: absolute;left: -9px;top: 13px;content: "";}
.cat-tab span{font-weight: bold; cursor: pointer;  font-size: 15px; line-height: 28px; display: inline-block;}
.cat-tab span + span{margin-left: 18px;}
.cat-on{color:#4589d5; border-bottom: 2px solid #4589d5;} 
.cat-depth02 div{margin: 4px 0;}
.cat-depth02 div p{position: relative;}
.cat-depth02>p>div>p{font-size: 13px;}
.cat-depth02 div em.round{position: absolute;  width: 3px; height: 3px; border-radius: 100%; border: 1px solid #333; content: ""; left: -10px; top: 14px;}
.cat-depth02 div em.round.color-round{background-color: #333;  }


.btn-green{background-color: #fff; cursor: pointer;
    border: 1px solid #00c250;
    color: #00c250;  padding: 0 4px; width: 100px; text-align: center;
    background-repeat: no-repeat;
    background-position: 6px center;}

/* 라이브러리 모달창 */
.lib-modal-tableTop  table th:first-child, .lib-modal-tableTop  table td:first-child{width: auto;}
/* .lib-modal-tableTop table{table-layout: fixed;} */

.lib-modal-tableTop table th{background-color:#f5f7fa; height: auto; padding: 5px; font-size:12px; text-align: center; text-transform: uppercase; border-bottom: 1px solid #dcdee1; border-top: 1px solid #dcdee1; border-right: 1px solid #dcdee1;}
.lib-modal-tableTop table th:last-child{border-right: 0;}
.lib-modal-tableTop table td{text-align: center;}
.lib-modal-tableTop table td.qr-code img{width: 60px; height: 60px; display: block; object-fit: contain;  margin: auto;}
.lib-modal-tableTop table td.pr-img img{max-width: 70px; display: block; margin: auto;}

.lib-modal-tableBottom{padding-top: 20px;}
.lib-modal-tableBottom table{width: 100%;} 
.lib-modal-tableBottom table td.pro-img img{max-width: 460px; max-height: 468px; object-fit: contain;}
.lib-modal-tableBottom table td.work-sheet img{max-width: 900px; max-height: 622px; object-fit: contain;} 
.lib-modal-tableBottom table td img{display: block; margin: auto;}
.lib-modal-tableBottom table td{border-top: 1px solid #dcdee1;}

.modal ul.btn-container.lib-eidtbuttn{text-align: center; position: relative; margin: 0; padding-top: 32px;}

.btn-b-primary{border: 1px solid #1f6bbb; color:#1f6bbb; transition: all .2s;}
.btn-b-primary:hover{background-color: #1f6bbb; color:#fff; }

.btn-b-gray{border: 1px solid #d95252; color:#d95252; transition: all .2s;}
.btn-b-gray:hover{background-color: #d95252; color:#fff; }



.lib-center{text-align: center;}
.lib-eidtbuttn .lib-eidtbuttn01{position: absolute; right: 0; top: 0; width: 100%; text-align: right;}
.lib-eidtbuttn .lib-eidtbuttn01 li button{color:#f00; display: block;}


/* 샘플 등록 */
.lb-insert{width: 700px;}
.sample-lb-table table th{background-color: #f5f7fa; border-bottom: 1px solid #dcdee1; text-transform: uppercase;}
.sample-lb-table table td{border-left: 0;}
.sample-lb-table table tr{border-top: 1px solid #dcdee1;}

.filebox{display: inline-block; cursor: pointer; height: 36px; line-height: 36px; vertical-align: middle; border: 1px solid #4589d5; background-color:#4589d5; color:#fff}
.filebox label{width: 100%; display: block;cursor: pointer;} 
.filebox input[type="file"]{position: absolute; width: 1px; height: 1px; padding: 0; overflow:hidden; clip:rect(0,0,0,0); border: 0;}


.lib-firt-book .samplelist-select{height: 393px;}
.lib-firt-book .samplelist-select table .check{text-align: center; width: 14px; padding: 7px;}

.lib-second-book.samplelist-select{height: auto; border: none;}
.lib-second-book .plus-bttn{width: 30px; height:36px; text-align: center; margin-right: 4px; position: relative; border-radius: 0;}
.lib-second-book .plus-bttn span{ width: 26px; height: 26px; line-height: 23px; color:#fff; background-color: #dcdee1; border-radius: 100%; position: absolute; top: 50%; transform: translateY(-50%); display: block; font-size: 20px; font-weight: 600;}
/* .form  .lib-second-book input[type=text]{border: none;} */
.lib-second-book .box-search .box_input{width: 70%;}
.lib-second-book .box-search button.button_box{ width: 50px; }
.sample-lb-table table td .flex-box{display: flex; justify-content: space-between;}
.sample-lb-table table td .search-btttn button.search{width: 80px; color:#1f6bbb; height: 36px; border: 1px solid #1f6bbb; margin-left: 4px;}
.box-table-container table.table01 th{width: 104px;}
.excel-table tbody tr td span.success{color:#4589d5}
.excel-table tbody tr td span.fail{color:#d95252}


/* 지앤지 채팅 css */

.chat-list-wrap{border-top: 2px solid #333; overflow-y: auto; max-height: 600px;}
.chat-list-wrap p.empty-message{padding:50px; text-align: center; color: #888;}
.chat-list-wrap.empty-wrap{border-bottom: 1px solid #ddd;}
.chat-img{width: 70px; height: 70px;}
.chat-img img{width: 100%; height: 100%; max-width: 100%; object-fit: cover;}
.chat-img-info{width: 100%;}
.chat-detail{padding-left: 30px; width: calc(100% - 70px);}
.talk-wrap,.chat-img,.chat-list{display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;}
.chat-list-new-wrap{border-top: 2px solid #333; overflow: hidden;}
.chat-list-n-wrap{border-top: 0;}
.chat-list-n-wrap p.empty-message{padding:50px; text-align: center; color: #888;}
.chat-list-n-wrap.empty-wrap{border-bottom: 1px solid #ddd;}

.check-answer{border-radius: 3px; background-color:#1f6bbb; color:#fff; font-size:14px; text-align: center; padding: 5px 10px;}   
.chat-count{padding: 10px; border-radius: 100%; background-color:#1f6bbb; position: relative; }
.chat-count em{display: block; text-align: center; font-size: 12px; color:#fff; position: absolute; left: 50%; top: 50%;  transform: translate(-50%,-50%);}
.chat-last-talk{position: relative;}
.chat-last-talk p.talking-record{color:#888; font-size: 15px;   font-weight: 500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.chat-top + .chat-last-talk{padding-top: 5px;}
.chat-top-info{position: relative;}
.chat-top-info>span.orderer-name{font-weight: bold; color:#000; padding-bottom: 5px; display: block; font-size: 16px; }
.chat-top-info>span.small{font-size: 12px; padding-right: 10px; }
.chat-top-info>span.small b{padding-right: 10px; display: inline-block; font-weight: bold; color: #000;}
.chat-top-info>span.small i{display: inline-block;}
.chat-top-info .last-time{font-size: 14px; color:#888; position: absolute; right:0; top: 0;}
.chat-top-info .order-p-name{overflow: hidden;  max-width: 300px; text-overflow: ellipsis; white-space: nowrap;}

.chat-deail-2 + .chat-last-talk{padding-top: 15px;}
.chat-deail-2{line-height: 1;}
.chat-detail{transition: all .2s;}
.chat-list{border-bottom: 1px solid #ddd; padding: 10px 12px 10px 0; cursor: pointer; }
.chat-list:hover .chat-detail{opacity: 0.6;}
.talk-wrap{position: relative;}


.chat-header{position: relative; width: 100%; padding-bottom: 20px;}
.chat-header ul li{padding-right: 15px;}
.chat-header ul li b{font-weight: bold;}
.chat-header strong{ font-size: 1.12rem; font-weight: bold; padding-bottom: 10px;}
.chat-header .order-no{font-size: 14px;}
.chat-header .chat-btn-box{width: 40px; height: 40px;  position: absolute; transform: rotate(45deg); cursor: pointer; right: 0; top: 0;}
.chat-header .chat-btn{background-color:#333; height: 20px; width: 2px; position: absolute; left: 50%; top: 50%; transform:translate(-50%,-50%);}
.chat-header .chat-btn::after{background-color:#333; content: ""; height: 20px; width: 2px; left:0; top: 0; position: absolute; transform: rotate(-90deg);}

.chat-header table.chat-order-info th{height: 32px; width: auto; background-color: #f5f5f5; border-bottom: 1px solid #dcdee1;}
.chat-header table.chat-order-info th, .chat-header table.chat-order-info td{padding: 5px;}
/* .chat-header table.chat-order-info td */
.chat-header table.chat-order-info tr{border-bottom: 1px solid #dcdee1;border-top: 1px solid #dcdee1; }
.chat-header table.chat-order-info{border-top: 1px solid #dcdee1;}

.chat_container{position: relative;}
.chat_container .chat_date_container{padding:8px 0 24px; text-align: center; font-size:12px; border-top:1px solid #efefef;}
.text-center{text-align: center;}
.chat_date_con{position: relative; padding: 16px 0;}
.chat_date_con .chat_date{background-color:#fff; padding: 5px 40px; position: relative; z-index: 2;}
.chat_date_con .chat-line{width: 100%; height: 1px; z-index: 0; background-color: #ddd; position: absolute; left: 0; top: 50%;}


.chat-history .check-read{font-size: 14px; color:#aaa}
.chat-history .time{font-size: 14px;}
.chat-history { padding: 30px 30px 20px;border-bottom: 2px solid #fff; height: 500px; overflow: hidden; overflow-y: auto;}
.chat-history .message-con{margin-bottom: 15px;}
.chat-history .message {color: #333;padding: 18px 20px;line-height: 26px;font-size: 16px;border-radius: 7px; position: relative; max-width: 60%; width: fit-content; word-break: break-all; direction: ltr;}
.chat-history .message:last-child{margin-bottom: 30px;}
.chat-history .message img{width: 100%; border-radius: 5px;}

.chat-history .chat-left-person .msg { background: #f5f7fa;border:1px solid #f5f7fa }
.chat-history .chat-left-person .message-list>.msg::after{bottom: 100%;left: 20px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute;pointer-events: none;border-bottom-color: #f5f5f5;border-width: 10px;margin-left: -10px;}
.chat-history .chat-right-person .message-list>.msg::after{bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute;pointer-events: none;border-bottom-color: #4589d5; right:13px; border-width: 10px;margin-left: -10px;}
.chat-history .chat-right-person .msg{background-color:#4589d5; color:#fff; font-weight: 300; border: 1px solid #4589d5; box-sizing: border-box; margin-left: auto;}
.chat-history .chat-right-person .msg::after {border-bottom-color: #4589d5; right:13px;}
.chat-history .other-name{font-size: 16px;}
.chat-history .text-right{text-align: right;}
.chat-send-message{padding: 25px; background-color:#f5f5f5; bottom: 0; position: relative; }
.chat-send-message textarea{border: none; width: 100%; padding: 10px 20px; font-size: 0.9rem; margin-bottom: 10px; border-radius: 5px; resize: none; ;}
.chat-send-message .chat-send-box{display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    /* align-items: center; */
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 100%}
.chat-send-box button.send{font-size: 1.1rem; font-weight: 600; color:#4589d5}
.chat-send-message .filebox{margin-left: 0; min-width: 60px; height:30px; font-weight: 300;}
.chat-send-message .filebox label{line-height: 30px;}

.message + .message{margin-top: 5px;}

.messages .message.new {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-animation: bounce 500ms linear both;
animation: bounce 500ms linear }

.chat-img-sendBox{ display: none; position: absolute; width: 100%; left: 0; background-color: #f5f5f5; padding:0 25px; top:10px;}
.img-upload-list{width: 72px; height: 72px; position: relative; margin-bottom: 8px; display: inline-block; margin-right: 4px; border: 1px solid #dcdee1;}
.img-upload-list img {width: 100%;height: 100%; display: block;}
.img-upload-list .delete-btn {width: 17px; height: 17px; position: absolute; border-radius: 0;top: 0;
    right: 0; background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/GNG/157593697894351.png)no-repeat center center;z-index: 5;
}

.chat-img-view-wrap{position: fixed;
   z-index: 100;
   left: 0;
   top: 0;
   bottom: 0;
   max-width: 100%;
   width: 100%;
   height: 100%;background-color: rgba(0,0,0,0.9);}
.chat-img-view-wrap .chat-img-view-center{
    max-width:1920px;
    width: 100%;    
    height: calc(100% - 120px);
    position: relative;
    display: inline-block;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    overflow-y: auto;
}


.chat-img-view-wrap .chat-img-view-center img{position: absolute; top:0; left: 50%; transform: translateX(-50%); max-width:1440px; width: 100%; }
.chat-img-view{position: fixed;background-color:  rgba(0,0,0,0.9); width: 100%; left: 0; color:#fff; height: 60px; line-height: 60px;}
.chat-img-view button{color: #fff;}
.chat-img-view-top{text-align: right; top: 0;}
.chat-img-view-top button{padding: 0 20px;}
.chat-img-view-bottom{text-align: center; bottom: 0;}
.chat-img-view-bottom button{position: relative;}
.chat-img-view-bottom button::before{width: 19px; height:22px; background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/GNG/15763532683073.png)no-repeat;  background-size: contain;content: ""; position: absolute; left: -20px; top: 0;}


.table3 .col-tit div p{width: 185px;}
.table3 .col-tit div p span{width: 100%;}


.table3 .col-tit p{width: 450px;}
.table3 .col-tit p span{width: 100%;}
.table3 .col-tit p span{display: inline-block; vertical-align: middle; margin-right: -4px;}
.table3 .col-tit .tit{padding-bottom: 8px; border-bottom: 1px solid #ddd; padding-top: 8px;}
.table3 .col-tit .tit:first-child{padding-top: 0;}
.table3 .col-tit .tit:last-child{padding-bottom: 0; border-bottom: 0;}
.table3 .col-tit .tit_pname{width: 100%;}
 /* ********************************************* *
        지앤지 추가 수정 2021-05-11
 * ********************************************* */

 /* 공지사항 - 간격  */
.spacing-table{display: table; width: 100%;}
.spacing-table dt, .spacing-table dd{display: table-cell; vertical-align:middle;}
.spacing-table .input-box{display: flex; align-items: center; justify-content: space-between;}
.spacing-table .edit-btn button span{width: 7px; display: block; height: 12px; background:url(../img/arr_view.svg)no-repeat;}
.spacing-table .edit-btn button.plus span{transform: rotate(90deg);}
.spacing-table .edit-btn button.minus span{transform: rotate(-90deg);}

/* 품목등록 옵션설정 */
.pd-option-button button{height: 36px; padding: 0 24px; border: 1px solid #dcdee1; transition: all .2s;}
.pd-option-button button:hover{background-color: #4589d5; color:#fff; border-color: #4589d5;}


/* 사이즈 테이블 */
.size-table th{text-align: center;}
.size-table td .insert{display: flex;}
.size-table td .insert label{margin-left: 20px;}
/* .size-table td .insert input{width: 80px;} */
.size-table td.delet-btn{text-align: center;}
.size-table td.delet-btn>div{display: flex;}
.size-table td.delet-btn>div>span{width: 100%;}
.size-table td.delet-btn>div>span+ span{margin-left: 8px;}
.size-table td.delet-btn>div span:nth-child(2){display: none;}
.size-table td.delet-btn button{ height: 18px; width: 18px; position: relative;}
.size-table td.delet-btn button.delet{background-color:#d95252; }
.size-table td.delet-btn button.delet span{width: 10px; height: 2px; background-color: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.size-table td.delet-btn button.add{background-color:#4589d5; position: relative;}
.size-table td.delet-btn button.add::before{width: 2px; height: 10px; background-color: #fff; position: absolute; content: ""; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.size-table td.delet-btn button.add::after{width: 10px; height: 2px; background-color: #fff; position: absolute; content: ""; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.size-table tbody tr:last-child td.delet-btn span:nth-child(2){display: block;}

/* z-index */
.modal{z-index: 1000;}
.search_result {margin-top: 24px;box-shadow: inset 1px 1px 10px rgb(0 0 0 / 2%);padding-top: 24px;padding-bottom: 24px;border-top: 1px dashed #ddd;background-color: #f5f5f5;}
.search_result ul{display: flex; align-items: center; justify-content: center;flex-direction: row;
    flex-wrap: wrap; }
.search_result ul li{margin: 8px; }
.search_result ul li .con_wrap{ cursor: pointer; border: 1px solid #ddd; border-radius: 5px;  padding: 8px 22px; display: flex; align-items: center; justify-content: center;}
.search_result ul li:last-child{margin-right: 0;}
.search_result ul li .con_wrap p{font-size: 15px; margin-bottom: 0;}
.search_result ul li .con_wrap span{font-size: 16px; font-weight: 600; margin-left: 12px; cursor: pointer;}
.search_result ul li.result_click .con_wrap{background-color: #4589d5; color: #fff; border: 1px solid #4589d5;}
.search_result .explain{text-align: center; margin-top: 16px; font-weight: 600; font-size: 12px;}

/* ********************************************* *

 * 1400px max
 * ********************************************* */
 @media (max-width:1400px)
 {
    .lib-modal-tableTop{ overflow-x: auto;}
    .lib-modal-tableTop table{width: 1440px;}
    .lib-modal-tableBottom{ overflow-x: auto;}
    .lib-modal-tableBottom table{width: 1440px;}
 }

 /* 버튼 on/off */

.set-switch{/* display: flex */ margin-left: auto; position: relative; }
.switch{position: relative; display: inline-block; width: 30px; height: 16px;}
.main-set-switch:before, .main-set-switch:after {
   
    width: 4rem;
    text-align: center;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    position: relative;
    bottom: 5px;
    opacity:0.5
}
/* .main-set-switch{margin-left: 100px;} */
.main-set-switch::before{content: "사용안함"; }
.main-set-switch::after{content: "사용";}
.main-set-switch.active::before{opacity: 1; }
.main-set-switch.active::after{opacity: 1; }

.main-use-switch:before, .main-use-switch:after {
   
    width: 4rem;
    text-align: center;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    position: relative;
    bottom: 5px;
    opacity:0.5
}
/* .main-set-switch{margin-left: 100px;} */
.main-use-switch::before{content: "미사용"; }
.main-use-switch::after{content: "사용";}
.main-use-switch.active::before{opacity: 1; }
.main-use-switch.active::after{opacity: 1; }

.switch input{opacity: 0; width: 0; height: 0;}
.slide.round{border-radius: 38px;}
.slide.round::before{border-radius: 50%}

input:checked + .slide{background-color: #18b0e2; /* background-image: linear-gradient(to right,#1488cc 0%, #2b32b2 100%); */} 
input:checked + .slide::before { -webkit-transform: translateX(16px); -ms-transform: translateX(16px); transform: translateX(16px);}

.slide{position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;background-color: #ddd; transition:.4s; -webkit-transition:.4s;}
.slide:before{position: absolute; content: ""; height: 17px; width: 17px; left: -2px; bottom: 0; background-color:#fff; box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2); transition:.4s; -webkit-transition:.4s;}

.file_sec{min-width: 90px; text-align: center;}

table th:first-child, table td:first-child{padding-left:6px; border-left:0; padding-right:6px; width:auto !important} /* 달력이랑 부딪힘 */
.ui-timepicker-container{ 
    z-index:1000 !important; 
}

.body-container{padding-left: 275px !important; max-width: 96%; margin-left: 0 !important; width: 100%;}
/* .table-container {
    width: 100%;
    overflow-x: scroll;
} */
/* .body-container .body-box{width: 155%;}*/

/* .adm_header{width: 125%;} */
table {width: 1380px; table-layout: fixed;}
table th:first-child, table td:first-child{width: 60px !important;}
body{overflow: scroll;}

.form input[type=button]{padding-left: 18px; padding-right: 18px;}
.form input.btn-primary{margin-top: 5px;}
.table3 .voteResult{margin-top: 20px;}
.body-container form{width:1500px; padding-right: 40px;}

/* ********************************************* *
 * 1600px
 * ********************************************* */
 @media screen and (max-width: 1660px){
   
}

/* ********************************************* *
* 1400px
* ********************************************* */
@media screen and (max-width: 1400px){

 
}

/* ********************************************* *
* 1200px
* ********************************************* */
@media screen and (max-width: 1200px){

  
}

/* ********************************************* *
* 1024px
* ********************************************* */
@media screen and (max-width: 1024px){

  
}

/* ********************************************* *
* 960px
* ********************************************* */
@media screen and (max-width: 960px){


}

/* ********************************************* *
* 768px
* ********************************************* */
@media screen and (min-width: 769px){
 

}

@media screen and (max-width: 768px){


}

/* ********************************************* *
* 640px
* ********************************************* */
@media screen and (max-width: 640px){
	

}

/* ********************************************* *
* 500px
* ********************************************* */
@media screen and (max-width: 500px){

  
}

/* ********************************************* *
* 400px
* ********************************************* */
@media screen and (max-width: 400px){


}