@charset "utf-8";

/* section-hr */
.section-group{position:relative; margin:0 -10px 0 -10px; padding:20px 10px 30px; border-bottom:1px solid #dadada}
.section-group.first{margin-top:-20px}
.section-group:nth-child(2n){background:#f9fafc}
.section-hr{display:block; height:1px; margin:30px 0px; padding:0px; background:#a5a5a5; border:none; font-size:0; clear:both}

/* **************************************** *
*  MEMBER PROFILE
* **************************************** */
.member-profile{display:flex; align-items:center; padding:30px 0 60px 0}
.member-profile .account-img-wrap{position:relative; min-width:80px}
.member-profile .account-img{position:relative; min-width:80px; height:80px; border-radius:50%; background-repeat:no-repeat !important; background-size:cover !important; overflow:hidden}
.member-profile .account-img.default{background:#eaeaea}
.member-profile .account-img.default:before,
.member-profile .account-img.default:after{content:''; position:absolute; left:50%; background-color:rgba(255, 255, 255, .8); border-radius:50%; z-index:1}
.member-profile .account-img.default:before{width:25px; height:25px; top:18px; margin-left:-12px}
.member-profile .account-img.default:after{width:54px; height:54px; top:48px; margin-left:-27px}
.member-profile .account-img img{display:none; width:80px;}
.member-profile .img-upload{display:block; position:absolute; right:0; bottom:0; width:24px; height:24px; padding:0; line-height:21px; background-color:#6c7080; text-align:center; border:2px solid #fff; border-radius:50%; cursor:pointer; box-sizing:border-box}
.member-profile .img-upload i{color:#fff; font-size:13px}
.member-profile .profile-info{display:flex; flex-direction:column; margin-left:15px}
.member-profile .profile-info .info-name{display:flex; align-items:center}
.member-profile .profile-info .info-name .name{display:inline-block; font-size:18px; font-weight:600; color:#202020;  letter-spacing:-0.2px}
.member-profile .profile-info .info-name .info_manager{margin-left:10px; min-width:80px}
.info_manager span{color:#5629ee; border:1px solid #5629ee; border-radius:1000px; padding:1px 6px}
.member-profile .profile-info .info-team{display:flex; align-items:center; margin-top:5px}
.member-profile .profile-info .info-team ul li{position:relative; padding-right:8px; font-weight:normal; font-size:14px; color:#909090; letter-spacing:-0.2px}
.member-profile .profile-info .info-team ul li > span{font-size:15px}
.member-profile .profile-info .info-team ul li:last-child:after{display:none}
.member-profile .profile-info .info-state{display:flex; align-items:center; margin-top:5px}
.member-profile .profile-info .info-state .state{display:inline-block; font-size:15px; font-weight:300; color:#202020; letter-spacing:-0.5px}
.member-profile .profile-info .info-state .state span{margin-right:3px; font-size:15px}

.member-profile .account-img-upload{flex:1; margin-left:15px}

.member_resign span{color:#f10f3a; border:1px solid #f10f3a; border-radius:1000px; padding:1px 6px}

/*조직도 팝업*/
.group_member .member-profile{position:relative; padding:15px; border:1px solid #eaeaea; border-radius:10px}
.group_member .use_mark{position:absolute; top:10px; right:15px}
.group_member .stitArea.group_label{position:relative}
.group_member .stitArea.group_label:after{content:''; position:absolute; bottom:-8px; width:100%; height:1px; background:#ddd}
.group_member .writing-ty1 .writing-tit .tit{font-weight:300}

/* 근무 시간 스피너 */
.memb_time{display:flex; align-items:center}
.memb_time .Spinner{margin:0 5px}

/* **************************************** *
*  MEMBER-STAMP
* **************************************** */
.member-stamp {display:flex; flex-direction:column; padding:20px; border:1px solid #dadada; border-radius:5px}
.member-stamp .account-img-wrap{position:relative}
.member-stamp .account-img{position:relative; min-width:64px; min-height:64px; border-radius:50%; background-repeat:no-repeat !important; background-size:64px 64px !important; overflow:hidden}
.member-stamp .account-img.default{background:#7fccff; background:-webkit-linear-gradient(90deg, #7fccff, #7f7fff); background:-moz-linear-gradient(90deg, #7fccff, #7f7fff); background:linear-gradient(90deg, #7fccff, #7f7fff)}
.member-stamp .account-img.default:before,
.member-stamp .account-img.default:after{content:''; position:absolute; left:50%; background-color:rgba(255, 255, 255, .8); border-radius:50%}
.member-stamp .account-img.default:before{width:20px; height:20px; top:18px; margin-left:-10px}
.member-stamp .account-img.default:after{width:54px; height:54px; top:42px; margin-left:-27px}
.member-stamp .account-img img{display:none; width:64px; height:64px}
.member-stamp .img-upload{display:block; position:absolute; right:0; bottom:0; width:24px; height:24px; padding:0; line-height:21px; background-color:#6c7080; text-align:center; border:2px solid #fff; border-radius:50%; cursor:pointer; box-sizing:border-box}
.member-stamp .img-upload i{color:#fff; font-size:13px}

.member-stamp .member-profile{border:none}


/* **************************************** *
*  MEMBER-LIST
* **************************************** */
.info_box{display:flex; flex-wrap:wrap}
.info_box .info_list{display:flex; justify-content:flex-start; width:48%; margin:0 0 20px 15px; box-sizing:border-box}
.info_box .info_list .list_inner .txt_box dl{position:relative; font-size:16px; display:flex; flex-wrap:wrap; align-items:flex-start}
.info_box .info_list .list_inner .txt_box dl dt,
.info_box .info_list .list_inner .txt_box dl dd{margin-bottom:20px; word-break:break-all}
.info_box .info_list .list_inner .txt_box dl dt,
.info_box .info_list .list_inner .txt_box dl dd:last-child{margin-bottom:0}
.info_box .info_list .list_inner .txt_box dl dt{color:#555; font-weight:300; width: 180px; flex:none; word-break:keep-all; display:block; line-height: 1.3; padding:4px 0px;}
.info_box .info_list .list_inner .txt_box dl dt.info_exp{display:flex; align-items:flex-start;}
.info_box .info_list .list_inner .txt_box dl dt.info_exp i{position:relative; font-size:20px; color:#5629ee; margin-left:5px}
.info_box .info_list .list_inner .txt_box dl dt.info_exp .Tooltip.info_group{top:0 !important; left:98px !important; background:#fff; color:#555; text-align:left; border-radius:5px; box-shadow: 1px 3px 6px rgb(0 0 0 / 13%)}
.info_box .info_list .list_inner .txt_box dl dt.info_exp .Tooltip.info_group span{display:block; color:#555}
.info_box .info_list .list_inner .txt_box dl dt.info_exp .Tooltip:before{display:none}
.info_box .info_list .list_inner .txt_box dl dd{color:#333; width:calc(100% - 220px); padding:4px 0px;}
.info_box .info_list .list_inner .txt_box.day dl dd{width:calc(100% - 180px)}
.info_box.member_edit .info_list .list_inner .txt_box.day dl dd,
.info_box.edit .info_list .list_inner .txt_box.day dl dd{width:calc(100% - 130px)}
.info_box .info_list .list_inner .txt_box.day dl dd p{margin-bottom:5px}
.info_box .info_list .list_inner .txt_box dl dd input.add_detail,
.info_box .info_list .list_inner .txt_box dl dd button.add_btn{margin-top:5px}
.info_box .info_list .list_inner .txt_box dl dd span.group_label1{background:#5629ee; color:#fff; border-radius:1000px; padding:2px 8px; font-size:13px; margin-right:5px; vertical-align:middle}
.info_box .info_list .list_inner .txt_box dl dd span.group_label2{background:#eae5fd; color:#5629ee; border-radius:1000px; padding:2px 8px; font-size:13px; margin-right:5px; vertical-align:middle}
.info_box .info_list .list_inner .txt_box dl dd.info_img_box{position:relative; min-width:180px; max-width:180px; height:70px; border:1px solid #eaeaea; border-radius:8px; display:flex; justify-content:center; align-items:center; margin-right:80px;}
.info_box .info_list .list_inner .txt_box dl dd.info_img_box img{object-fit:cover; max-width:100%; max-height:40px; margin:0 20px}
.info_box .info_list .list_inner .txt_box dl dd.info_img_box span{font-size:15px; color:#999}

.com_info h4{position:relative; padding:60px 0 40px 15px}
.com_info h4:before{content:''; display:block; width:100%; height:1px; background:#aaa; position:absolute; top:48px; left:50%; transform: translate(-50%, 0%)}
.com_info h4:after{content:''; display:block; width:100%; height:1px; background:#eaeaea; position:absolute; bottom:31px; left:50%; transform: translate(-50%, 0%)}


@media (min-width: 2100px) {
  .info_box .info_list .list_inner {width:80%}
  .group_member .info_box.member_edit .info_list .list_inner{width:100%}
}

@media (max-width: 1160px) {
  .info_box .info_list {width:100%}
  .info_box .info_list .list_inner .txt_box dl dd input.add_detail,
  .info_box .info_list .list_inner .txt_box dl dd button.add_btn{margin-top:0}
}


/* 개인정보 변경 페이지 */
.info_box.member_edit{border:1px solid #eaeaea; border-radius:10px; padding:23px 10px}
.member-profile .account-img{position:relative}
.member-profile .account-img:hover .img_upload:after{position:absolute; content:'\ea8a'; font-family:"xeicon"; color:#fff; font-size:28px; width:100%; height:100%; background:rgb(29, 19, 64, 0.58); display:flex; justify-content:center; align-items:center; cursor:pointer; z-index:2}
.member-profile .account-img .img_upload input{position:absolute; top:-50px}
.img_delete{width:30px; height:30px; background:#fa196d; border-radius:1000px; position:absolute; right:0; bottom:0; display:flex; justify-content:center; align-items:center; cursor:pointer; z-index:3}
.img_delete i{color:#fff; font-size:18px}
.Textinput.add_detail{display:inline-block}
.info-team ul li.posn,
.info-team ul li.orgz{display:inline-block}

.user_sign_wrap{display:flex; flex-direction:column; align-items:flex-start; margin-left:100px}
.user_sign_wrap .sign_select{color:#999; cursor:pointer; margin-bottom:3px}
.user_sign_wrap .sign_select span{padding:0 8px}
.user_sign_wrap .sign_select span:first-child{position:relative}
.user_sign_wrap .sign_select span:first-child:after{position:absolute; right:-2px; bottom:5px; content:''; width:1px; height:10px; background:#ddd}
.user_sign_wrap .sign_select span:hover{color:#333}
.user_sign_wrap .sign_select span.on{color:#333}
.user_sign_cont{display:flex; flex-direction:row; align-items:flex-end}
.user_sign_cont .user_sign_img{position:relative; min-width:200px; max-width:200px; border:1px solid #ddd; border-radius:8px; display:flex; flex-direction:column; overflow:hidden;}
.user_sign_cont .user_sign_img .img_area{display:flex; align-items:center; justify-content:center; height:54px}
.user_sign_cont .user_sign_img .img_area img{max-width:100%; max-height:47px; margin:0 20px}
.user_sign_cont .user_sign_img .upload_btn{width:100%; color:#999; text-align:center; background:#f4f4f4; padding:1px 0; display:flex; align-items:center; justify-content:center; cursor:pointer}
.user_sign_cont .user_sign_img .upload_btn label{cursor:pointer}
.user_sign_cont .user_sign_img .upload_btn i{color:#555; margin-left:5px}
.user_sign_cont .user_sign_img .upload_btn label span{font-size:14px}
.user_sign_cont.txt{align-items:center}
.user_sign_cont.txt .user_sign_txt{display:flex; flex-direction:row; align-items:center}
.user_sign_cont.txt .user_sign_txt .txt_area{min-width:45px; height:45px; background:#f4f4f4; border:1px solid #ddd; border-radius:1000px; margin-right:5px; text-align:center; background-size:cover !important}
.user_sign_cont.txt .user_sign_txt .txt_area span{color:#999; line-height:45px; font-size:13px}
.user_sign_img_btn,
.user_sign_txt_btn{margin-left:5px}

.info_box.edit .info_list .list_inner .txt_box dl dt,
.info_box.member_edit .info_list .list_inner .txt_box dl dt{width:130px; line-height:1.3; word-break:keep-all}
/*.info_box.edit .info_list .list_inner .txt_box dl dt span.require:after{content:"\ea0f"; color:#fa196d; font-family:'xeicon'; font-weight:normal; font-size:8px}*/

/* 조직 구성원 팝업 */
.group_member .account_cont{display:flex; align-items:flex-start; min-width:48%}
.group_member .account_cont .info-name{word-break:break-all; flex-wrap:wrap}
.group_member .info_box .info_list{width:100%}
.group_member .info_box.member_edit{border:0; padding:0; margin-top:20px}
.group_member .user_sign_wrap{margin-left:2%; min-width:48%}
.group_member .user_sign_wrap .sign_select{min-width:200px}
.group_member .user_sign_wrap .user_sign_txt_btn{min-width:70px}

/* 회사정보 */
.option_txt{display:inline-block; word-break:keep-all}

/* **************************************** *
*  SYSADM - MEMBER
* **************************************** */
.info_box.member_edit .account-box{display:flex}
.info_box.member_edit .account-img-wrap{position:relative; min-width:80px}
.info_box.member_edit .account-img{position:relative; min-width:64px; height:64px; border-radius:50%; background-repeat:no-repeat !important; background-size:cover !important; overflow:hidden; margin-right: 16px;}
.info_box.member_edit .account-img.default{background:#eaeaea; display: flex; flex-direction: column; align-items:center;  }
.info_box.member_edit .account-img.default:before,
.info_box.member_edit .account-img.default:after{position:absolute; content:''; flex:none; background-color:rgba(255, 255, 255, .8); border-radius:50%; z-index:1}
.info_box.member_edit .account-img.default:before{width:21px; height:21px; top:12px;}
.info_box.member_edit .account-img.default:after{width:52px; height:52px; top:38px;}
.info_box.member_edit .account-img img{display:none; width:64px;}


/* **************************************** *
*  WRITE
* **************************************** */
/* writing-ty1 */
.writing-ty1{position:relative}
.writing-ty1 .writing-list{border-top:1px solid #e9e9e9; border-bottom:1px solid #e9e9e9; padding:12px 0}
.writing-ty1 .writing-list:nth-child(2){border-top:none}
.writing-ty1 .writing-list:nth-child(3){border-top:none}
.writing-ty1 .writing-list:nth-child(4){border-top:none}
.writing-ty1 .writing-list:last-child{border-top:none}

.writing-ty1 .writing-list.lineless{border:0}

.writing-ty1 .writing-list.line,
.writing-ty1.pop{border:1px solid #ddd; padding:20px; border-radius:12px}
.writing-ty1.pop .writing-list{border:0}
.writing-ty1.pop .writing-list{display:flex}
.writing-ty1.pop .writing-tit .tit{font-weight:300}

/* cont 2줄 이상 - flex 해제 */
.writing-ty1 .writing-cont.blck{display:block}

/* 업무 연동 - 연동 등록 팝업 */
.writing-ty1 .writing-list .writing-cont .col-row .row li > span{display:inline-block}
.writing-ty1 .writing-list .writing-cont.certified_list ul li,
.writing-ty1 .writing-list .writing-cont ul li.screen_set{display:flex; width:100%; align-items:center}
.writing-ty1 .writing-list .writing-cont .sub_tit{min-width:100px; display:inline-block}
.writing-ty1 .writing-list .writing-cont .sub_tit.bg{background: #5629ee; color: #fff; border-radius:1000px; text-align:center; min-width:80px; margin-right:15px; line-height:25px; height:25px; display:flex; align-items:center; justify-content:center}
.writing-ty1 .writing-list .writing-cont ul.location > li{display:flex}
.writing-ty1 .writing-list .writing-cont ul.location > li > ul{display:flex; flex-wrap:wrap}
.writing-ty1 .writing-list .writing-cont ul.location > li > ul > li{width:16.66%}


/* Dialog */
.Dialog .writing-ty1 .writing-list:first-child,
.layerpop-box.biz-iframe .writing-ty1 .writing-list:first-child{border:none; padding:0}

.writing-ty1 .writing-list:after{content:''; display:block; clear:both}
.writing-ty1 .writing-list > li{display:flex; align-items:center; position:relative; padding:0; min-height:36px; box-sizing:border-box}
.writing-ty1 .writing-list > li:last-child{border-bottom:none}
.writing-ty1 .writing-list > li.start-top{align-items:flex-start}

.writing-ty1 .writing-list li.col2{min-height:auto; padding:0}
.writing-ty1 .writing-list li.col2 .col-box,
.writing-ty1 .writing-list li.col2 .col-box2{display:flex; align-items:center; width:100%; min-height:36px;}
.writing-ty1 .writing-list li.col2 .col-box > li{display:flex; align-items:center; flex:1; position:relative; padding:11px 0; min-height:36px; box-sizing:border-box}


/* 비율 조정 */
.writing-ty1 .writing-list li.col2 .col-box2 > li{display:flex; align-items:center; position:relative; padding:11px 0; min-height:44px; box-sizing:border-box; width:100%}
.writing-ty1 .writing-list li.col2 .col-box2 > li:last-child{width:60%}

/* 세명 제목 높이 조정 */
.writing-ty1 .writing-list li.col2 .col-box.sme-tit{min-height: 32px;}
.writing-ty1 .writing-list li.col2 .col-box.sme-tit > li{min-height: 32px;}
.writing-ty1 .sme-tit .writing-cont{min-height: 32px !important;}
.writing-ty1 .sme-tit .writing-tit{min-height: 32px !important;}

.layerpop-box .writing-ty1 .writing-list li.col2 .col-box > li,
.layerpop-box .writing-ty1 .writing-list li.col2 .col-box2 > li{margin-left:15px}
.layerpop-box .writing-ty1 .writing-list li.col2 .col-box > li:first-child,
.layerpop-box .writing-ty1 .writing-list li.col2 .col-box2 > li:first-child{margin-left:0}


/* wms 도면/이미지등록 팝업*/
.writing-ty1 .writing-list li.col2.upload .col-box{align-items:flex-end}
.writing-ty1 .writing-list li.col2.upload .col-box > li{flex:auto}
.writing-ty1 .writing-list li.col2.upload .col-box > li .writing-cont >  .writing-cont.upload{margin:0 0 8px 8px}
.writing-ty1 .writing-list li.col2.upload .col-box > li .writing-cont >  .writing-cont.upload > .writing-cont.upload{margin:0}

.writing-ty1 .writing-tit{display:flex; align-items:center; padding:0 10px}
.writing-ty1 .writing-tit.align-right{justify-content:flex-end}
.writing-ty1 .writing-tit .col-row{display:flex; flex-direction:column; flex:auto}
.writing-ty1 .writing-tit .col-row .row{display:flex; align-items:center}
.writing-ty1 .writing-tit .tit{display:inline-block; font-size:15px; letter-spacing:-0.5px; color:#202020; font-weight:300}




.layerpop-box.wms-layout .writing-ty1 .writing-tit .tit{font-weight:300}

.writing-ty1 .writing-cont{display:flex; align-items:center; flex:auto}

.group_member .Tabs .writing-ty1 .writing-list .writing-cont{flex-wrap:wrap}
.group_member .Tabs .writing-ty1 .writing-list .writing-cont p{width:calc(100% - 120px); margin-bottom:5px}


/* wms 도면/이미지등록 팝업*/
.writing-ty1 .writing-cont.upload{display:unset; width:100%}

.writing-ty1 .writing-cont .col-row{display:flex; flex-direction:column; flex:auto}
.writing-ty1 .writing-cont .col-row .row{display:flex; align-items:center}

.writing-ty1 .writing-cont .cont-txt .txt{line-height:155%; font-size:14px; font-weight:normal; color:#505050; letter-spacing:-0.5px}

.writing-ty1 .writing-cont.align-right{justify-content:flex-end; padding-right:10px}
.writing-ty1 .writing-cont > li{margin-bottom: 8px;}
.writing-ty1 .writing-cont > li:last-child{margin-bottom:0}
.writing-ty1 .writing-list > li.other-row{background:#f5f5f5}

.writing-ty1 .form-list:after{content:''; display:block; clear:both}
.writing-ty1 .form-list li{float:left}
.writing-ty1 .form-list.col2 li{width:50%}
.writing-ty1 .form-list li .inner{display:flex; align-items:center}

.writing-ty1 .docapproval:hover .approval-wrap{border:1px solid #dadada}

.writing-ty1 .writing-list > li.in-docform-ty2{display:block; min-height:auto}
.writing-ty1 .writing-list > li.in-docform-ty2 > .writing-tit{margin:5px}
.writing-ty1 .writing-list > li.in-docform-ty2 > .writing-cont{display:block; padding:0 10px}

#tabcont-cpyinfo .writing-ty1{padding:8px 20px;}
#tabcont-cpyinfo .writing-ty1 .writing-list > li{min-height: 42px;}

/* writing-ty2 */
.writing-ty2{position:relative}
.writing-ty2 .writing-list{padding-bottom:4px}

/* writing-ty line */
.writing-ty1.line{position:relative;  border-top:2px solid #9e9e9e;}
.writing-ty1.line .writing-list{padding:0px 0;}
.writing-ty1.line .writing-list li.col2 .col-box > li{ padding:0; border-left:1px solid #e9e9e9;}
.writing-ty1.line .writing-list li.col2 .col-box > li:first-child{ border-left:none;}

.writing-ty1.line .writing-list > li{border-bottom: 1px solid #e9e9e9 ;}
.writing-ty1.line .writing-tit{min-height:36px; background:#f8f8f8}
.writing-ty1.line .writing-tit.bg-dark{background:#e0e0e1}
.writing-ty1.line .writing-cont{border-left:1px solid #e9e9e9; padding:0 12px; min-height:36px;}
.writing-ty1.line .writing-date{flex:none; width:100px; font-size:14px; color:#555; text-align: right; }


/* tit 백그라운드 이슈로 세로 정렬 */
.writing-ty1.line .writing-list li.col2.vert .col-box > li{display:flex; flex-direction:column; align-items:flex-start}
.writing-ty1.line .writing-list li.col2.vert .col-box .writing-tit{background:none; padding:0}
.writing-ty1.line .writing-list li.col2.vert .col-box .writing-cont{width:100%; padding:0 0 10px 0; border-left:0}
.writing-ty1.line .writing-list li.col2.vert .col-box .writing-cont .Fileupload{margin-top:0}


/* **************************************** *
*  LIST
* **************************************** */
/* listing-ty1 */
/*.listing-ty1{position:relative}
.listing-ty1 .listing-list{border-top:1px solid #dadada; border-bottom:1px solid #dadada}
.listing-ty1 .listing-list:after{content:''; display:block; clear:both}
.listing-ty1 .listing-list > li{border-bottom:1px solid #ebebeb}
.listing-ty1 .listing-list > li:last-child{border-bottom:none}
.listing-ty1 .list-box{display:flex; align-items:center; position:relative; min-height:120px; padding:15px 0; box-sizing:border-box}
.listing-ty1 .list-box .cover-ico{display:flex; align-items:center;justify-content:center;  width:100px; height:120px; min-width:100px; margin-right:20px; background-color:#f0f2f5}
.listing-ty1 .list-box .cover-ico img{width:40px}
.listing-ty1 .list-box .content-inner{display:flex; flex-direction:column; flex:auto; min-height:120px; padding-right:20px}
.listing-ty1 .list-box .content-tit,
.listing-ty1 .list-box .content-util{display:flex; align-items:center; justify-content:space-between}

.listing-ty1 .list-box .content-tit .tit-area{display:flex; align-items:center; margin-top:-5px}
.listing-ty1 .list-box .content-tit .tit-area .tit{font-size:16px; font-weight:300; color:#202020; letter-spacing:-0.5px}
.listing-ty1 .list-box .content-tit .tit-area:hover .tit{color:#157efb}
.listing-ty1 .list-box .content-tit .tit-area .stit{margin-left:3px; font-size:14px; font-weight:normal; color:#707070; letter-spacing:-0.2px}
.listing-ty1 .list-box .content-tit .tit-area .stit{margin-left:3px; font-size:14px; font-weight:normal; color:#707070; letter-spacing:-0.2px}

.listing-ty1 .list-box .content-content{margin-top:5px; height:40px}
.listing-ty1 .list-box .content-content p{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; width:70%; height:40px; font-size:14px; font-weight:normal; color:#707070; letter-spacing:-0.2px; text-overflow:ellipsis; word-wrap:break-word;  overflow:hidden}
.listing-ty1 .list-box .content-util{margin-top:15px}
.listing-ty1 .list-box .content-util .date-area{font-size:13px; font-weight:normal; color:#909090; letter-spacing:-0.2px}

.listing-ty1 .list-box .content-util .option-list:after{content:''; display:block; clear:both}
.listing-ty1 .list-box .content-util .option-list li{float:left; margin-left:12px}
.listing-ty1 .list-box .content-util .option-list li:first-child{margin-left:0}
.listing-ty1 .list-box .content-util .option-list li div{display:flex; align-items:center}
.listing-ty1 .list-box .content-util .option-list li i{margin-right:2px; font-size:20px; color:#707070; vertical-align:middle}
.listing-ty1 .list-box .content-util .option-list li span{display:inline-block; margin-top:-2px; font-size:13px; font-weight:normal; color:#707070; letter-spacing:-0.2px}

.listing-ty1 .no-data{position:relative; padding:35px 15px; text-align:center}
.listing-ty1 .no-data .info-message{display:inline-block; font-size:14px; font-weight:normal; color:#909090; letter-spacing:-0.2px}
.listing-ty1 .no-data .info-message i{margin-top:-4px; font-size:18px; vertical-align:middle}
*/

/* 2023ver */
.listing-ty1{position:relative}
.listing-ty1 .listing-list{border-top:1px solid #dadada; border-bottom:1px solid #dadada}
.listing-ty1 .listing-list:after{content:''; display:block; clear:both}
.listing-ty1 .listing-list > li{border-bottom:1px solid #ebebeb; cursor:pointer;}
.listing-ty1 .listing-list > li:hover{background:#fbfbfb; box-shadow: 0px 3px 5px #0000000a;}
.listing-ty1 .listing-list > li:last-child{border-bottom:none}
.listing-ty1 .list-box{display:flex; align-items:center; position:relative; min-height:90px; padding:15px; box-sizing:border-box}
.listing-ty1 .list-box.select{background:#fbfbfb}
.listing-ty1 .list-box.select:before{content:""; position:absolute; width: 2px; height: 100%; left: 0px; background: #5629ee;}
.listing-ty1 .list-box .cover-ico{display:flex; flex-direction:column; align-items:center;justify-content:center;  width:90px; height:90px; min-width:90px; margin-right:20px; background-color:#f0f2f5; border-radius: 20px;}
.listing-ty1 .list-box .cover-ico i{font-size: 42px; margin-top: 4px;}
.listing-ty1 .list-box .cover-ico span{font-size: 13px; letter-spacing: -1px;}
.listing-ty1 .list-box .cover-ico.doc-hwp{background-color:#ecf6fc}
.listing-ty1 .list-box .cover-ico.doc-excel{background-color:#e9f5ef}
.listing-ty1 .list-box .cover-ico.doc-pdf{background-color:#fbeeeb}
.listing-ty1 .list-box .cover-ico.doc-ppt{background-color:#fdf0ed}
.listing-ty1 .list-box .cover-ico.doc-word{background-color:#ecf2fb}
.listing-ty1 .list-box .cover-ico.doc-list{background-color:#f0ecfc; color:#c7bde3}
.listing-ty1 .list-box .cover-ico.doc-file{background-color:#e9f5ef; color:#b2d0c1}
.listing-ty1 .list-box .cover-ico.doc-aprv{background-color:#ecf6fc; color:#b1ccdc}
.listing-ty1 .list-box .cover-ico.doc-report{background-color:#fdf0ed; color:#e4c9c3}
.listing-ty1 .list-box .cover-ico.doc-etc{background-color:#ecf2fb; color:#c4d1e3;}
.listing-ty1 .list-box .cover-ico.doc-workflow{background-color:#693dff; color:#efebff;}

.listing-ty1 .list-box .cover-ico img{width:40px}
.listing-ty1 .list-box .content-inner{display:flex; flex-direction:column; flex:auto; min-height:90px; justify-content:center;}
.listing-ty1 .list-box .content-tit,
.listing-ty1 .list-box .content-util{display:flex; align-items:center; justify-content:space-between}

.listing-ty1 .list-box .content-tit .tit-area{display:flex; align-items:center; margin-top:-5px; max-width:80%;}
.listing-ty1 .list-box .content-tit .tit-area .tit{font-size:17px; font-weight:300; color:#202020; letter-spacing:-0.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.listing-ty1 .list-box .content-tit .tit-area:hover .tit{color:#5629ee}
.listing-ty1 .list-box .content-tit .tit-area .Label-color{flex:none}

.listing-ty1 .list-box .content-content{margin-top:4px;}
.listing-ty1 .list-box .content-content p{width:80%; font-size:14px; font-weight:normal; color:#777; letter-spacing:-0.2px; text-overflow:ellipsis; word-wrap:break-word; white-space:nowrap; overflow:hidden}
.listing-ty1 .list-box .content-util{margin-top:12px}

.listing-ty1 .list-box .date-area{font-size:13px; font-weight:normal; color:#909090; letter-spacing:-0.2px}
.listing-ty1 .list-box .date-area ul li{display:inline-block; margin-right: 8px;}
.listing-ty1 .list-box .date-area ul li .data{margin-left: 12px;}
.listing-ty1 .list-box .option-area .option-list:after{content:''; display:block; clear:both}
.listing-ty1 .list-box .option-area .option-list li{display:inline-flex; align-items:center; margin-left: 8px;}
.listing-ty1 .list-box .option-area .option-list li:first-child{margin-left:0}
.listing-ty1 .list-box .option-area .option-list li div{display:flex; align-items:center}
.listing-ty1 .list-box .option-area .option-list li i{margin-right:2px; font-size:20px; color:#ccc; vertical-align:middle}
.listing-ty1 .list-box .option-area .option-list li div.active i{color:#5629ee}
.listing-ty1 .list-box .option-area .option-list li span{display:inline-block; font-size:13px; font-weight:normal; color:#707070; letter-spacing:-0.2px}

.listing-ty1 .no-data{position:relative; padding:35px 15px; text-align:center}
.listing-ty1 .no-data .info-message{display:inline-block; font-size:14px; font-weight:normal; color:#909090; letter-spacing:-0.2px}
.listing-ty1 .no-data .info-message i{margin-top:-4px; font-size:18px; vertical-align:middle}

.listing-ty1 .list-box.workflow .content-inner{flex-direction:row; align-items:center; justify-content:normal}
.listing-ty1 .list-box.workflow .option-area{display:flex; align-items: center; position:absolute; right:12px; top:8px; z-index: 3;}
.listing-ty1 .list-box.workflow .content-tit{justify-content:normal; width:300px; flex:none; flex-direction:column; align-items:flex-start}
.listing-ty1 .list-box.workflow .content-tit .tit-area .tit{font-size: 20px;}
.listing-ty1 .list-box.workflow .content-util{margin-top: 4px;}
.listing-ty1 .list-box.workflow .content-inner .content-flow{margin-top:14px}

/* **************************************** *
*  PAGING
* **************************************** */
/* paging-ty1 */

.paging-ty1{position:relative; width:100%; margin-top:20px}
.paging-ty1 .pager-center{display:flex; justify-content:center; align-items:center; box-sizing:border-box}
.paging-ty1 .pager-left,
.paging-ty1 .pager-right{display:none}

.paging-ty1 .page-button,
.paging-ty1 .page-list button,
.paging-ty1 .page-button.first-page button,
.paging-ty1 .page-button.prev-page button,
.paging-ty1 .page-button.next-page button,
.paging-ty1 .page-button.last-page button{border:0px;}
.paging-ty1 .page-button.first-page button,
.paging-ty1 .page-button.prev-page button,
.paging-ty1 .page-button.next-page button,
.paging-ty1 .page-button.last-page button{background:none; font-size: 24px;}

.paging-ty1 .page-button.first-page button::before{content:"\F013D"; display:inline-block; font-family: "Material Design Icons"; text-rendering:auto; line-height:inherit; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing:grayscale}
.paging-ty1 .page-button.prev-page button:before{content:"\F0141";  display:inline-block; font-family: "Material Design Icons";  text-rendering:auto; line-height:inherit; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing:grayscale}
.paging-ty1 .page-button.next-page button:before{content:"\F0142"; display:inline-block; font-family: "Material Design Icons";  text-rendering:auto; line-height:inherit; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing:grayscale}
.paging-ty1 .page-button.last-page button:before{content:"\F013E"; display:inline-block; font-family: "Material Design Icons";  text-rendering:auto; line-height:inherit; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing:grayscale}

.paging-ty1 .page-button {display:block; color:#555}
.paging-ty1 .page-button button{display:block; background:none; border:none; padding:0; min-width:30px; height:30px; margin:0 5px; color:#555; font-size:15px; font-weight: normal; letter-spacing:-0.5px; text-align:center;  border-radius:200px; cursor:pointer; transition:all .20s ease;}
.paging-ty1 .page-button.current button{background:#01042f; color:#fff}
.paging-ty1 .page-button.current button:hover{background:#01042f; color:#fff}
.paging-ty1 .page-list button:hover{background:#f4f4f4;}

.paging-ty1 .pager-left{position:absolute; left:0; top:0}
.paging-ty1 .pager-left .total{display:flex; align-items:center; height:31px; line-height:135%; font-size:13px; font-weight:normal; letter-spacing:-0.8px; color:#505050}
.paging-ty1 .pager-center{font-size:0; text-align:center}
.paging-ty1 .page-list{display:flex; margin-top:0; padding:0; list-style:none; font-size:0}


.paging-ty1 .pager-right{position:absolute; right:0; top:10px}

.paging-jqx{display:flex; align-items:center; justify-content:center; position:relative; width:100%; margin-top:10px; box-sizing:border-box}
.paging-jqx .paging-num{display:flex; align-items:center}
.paging-jqx .paging-num .num,
.paging-jqx .paging-num button{
 display:block;
 background:none; border:none; padding:0;
 min-width:24px; height:24px; margin:0 5px; color:#555; font-size:14px; font-weight:normal; letter-spacing:-0.5px; text-align:center; border-radius:200px;
 cursor:pointer; transition:all .20s ease
}
.paging-jqx .paging-num .num:hover{background:#eaeaea}
.paging-jqx .paging-num .num.active,
.paging-jqx .paging-num button.active{background:#eaeaea; font-weight:300}
.paging-jqx .paging-btn
{
 display:block;
 background:none; border:none; padding:0;
 min-width:22px; height:24px; line-height:24px; margin:0 2px; color:#555; font-size:15px; font-weight:normal; letter-spacing:-0.5px; text-align:center; border-radius:200px;
 cursor:pointer;
}
.paging-jqx .paging-btn i{display:inline-block; font-size:18px; color:#888}
.paging-jqx .paging-total{position:absolute; left:0; top:-2px; color:#999; font-size:14px; letter-spacing:-0.5px}
.paging-jqx .paging-perpage{position:absolute; right:0; top:-1px; width:75px; height:26px; color:#555; font-family:'pps','ptd', 'sans-serif' !important; font-size:14px; border:1px solid #ddd; border-radius:5px}


/* **************************************** *
*  DOCPILOT
* **************************************** */
.docpilot-container{display:flex; padding:20px; box-sizing:border-box}
.docpilot-box{display:flex; flex-direction:row-reverse; position:relative; margin-top:-1px; width:1400px; background-color:#fff; border:1px solid #e9e9e9; box-sizing:border-box; border-radius:0 0 8px 8px}
.docpilot-box.overlab{border:none; border-top:1px solid #e9e9e9}
.docpilot-box.overlab .writing-ty1 .writing-list:first-child{border:0}
.docpilot-box.overlab .writing-ty1 .writing-list:nth-child(2){border-top:1px solid #e9e9e9}
.docpilot-box.overlab .docpilot-step{padding:20px;}
.docpilot-box .stitArea.box{margin-top:20px}
.docpilot-box .stitArea.box:first-child{margin-top:10px}

.docpilot-box .tag-list li{float:left; margin-right:2px; margin-bottom:0px}
.docpilot-box .tag-list li .tag-box{position:relative; height:27px; padding:5px 25px 0 8px; background-color:#f3f8ff; border:1px solid #0196fa; box-sizing:border-box}
.docpilot-box .tag-list li .tag-box span{font-size:12px; font-weight:normal; letter-spacing:-0.2px; color:#505050; line-height: 1;}
.docpilot-box .tag-list li .tag-box .del{position:absolute; right:0; top:0; width:20px; height:25px; padding:0; line-height:25px; background:none; font-size:18px; color:#808080; text-align:center; border:0; cursor:pointer}
.docpilot-box .tag-list li .tag-box .del:before{content:"\e922"; font-family:'xeicon'}

.docpilot-box .tag-list li .tag-box.ico {display: flex; align-items: center;}
.docpilot-box .tag-list li .tag-box.ico i{font-size: 16px; margin-right: 4px; color: rgb(80, 80, 80, 1);}

.docpilot-intro-container{display:flex; align-items:center; justify-content:center; height:100%; box-sizing:border-box}
.docpilot-intro-container .docpilot-box{width:1000px}

.docpilot-box.lineless{border:none;}
.docpilot-box.lineless .doc-view{border:none; padding:0px;}
.docpilot-box.lineless .doc-view#connectDocFlow{border:1px solid #e9e9e9; padding:20px; }
.docpilot-box.lineless .doc-view .docform-ty2 .list-tit{margin:25px 0px 0}


/* intro */
.docpilot-intro{position:relative; padding:120px 200px}
.docpilot-intro .intro-message{position:relative; padding-left:160px}
.docpilot-intro .intro-message:before{content:''; position:absolute; left:0; top:-10px; width:114px; height:122px; background:url("/static/fw/images/contents/docpilot_intro_bot.png") 50% 50% no-repeat; background-size:114px 122px}
.docpilot-intro .intro-message .message-tit,
.docpilot-intro .intro-message .message-info{line-height:135%; font-family:'welcome' !important; font-weight:normal}
.docpilot-intro .intro-message .message-tit{font-size:26px; color:#202020; letter-spacing:-1.2px}
.docpilot-intro .intro-message .message-info{display:block; margin-top:10px; font-size:20px; color:#909090; letter-spacing:-0.8px}
.docpilot-intro .intro-message .message-tit .name{font-family:'welcome' !important; font-size:26px; color:#0196fa}

.docpilot-intro .tutorial-confirm{display:flex; justify-content:center; margin-top:65px}
.docpilot-intro .tutorial-confirm .Button{width:50%; padding:9px 0 0; font-family:'welcome' !important; font-weight:300; letter-spacing:-0.5px}
.docpilot-intro .tutorial-confirm .Button:nth-child(1){margin-right:8px}
.docpilot-intro .tutorial-confirm .Button:nth-child(2){margin-left:8px}

/* step */
.docpilot-step{width:100%; padding:20px 32px; box-sizing:border-box}
.docpilot-step .writing-ty1 .writing-list:first-child{border:0}
.docpilot-step .writing-ty1 .writing-list:nth-child(2){border-top:1px solid #e9e9e9}


/* .docpilot-step .writing-ty1 .writing-list{border-left:1px solid #dadada; border-right:1px solid #dadada}
.docpilot-step .writing-ty1 .writing-cont{padding-right:11px} */

.layerpop-box .docpilot-container{display:block; padding:15px 0 0 0}
.layerpop-box .docpilot-box{width:100%}
.layerpop-box .docpilot-step{padding:20px; min-height:500px}

/* doc-upload */
.doc-upload{position:relative; padding:70px 200px 70px; border:1px solid #ebebeb; border-radius:5px}
.doc-upload .upload-message{display:flex; align-items:center; justify-content:center; flex-direction:column}
.doc-upload .upload-message .upload-info{margin-top:15px; line-height:135%; font-family:'welcome' !important; font-size:16px; font-weight:300; color:#505050; letter-spacing:-0.8px}
.doc-upload .doc-list{display:flex; align-items:center; justify-content:center}
.doc-upload .doc-list .doc-deco{display:flex; align-items:center; justify-content:center; margin:0 2px}
.doc-upload .doc-list .doc-deco.disabled{opacity:.2}
.doc-upload .doc-list .doc-deco img{width:38px; height:auto}

/* doc-convert */
.doc-convert{display:flex; flex-direction:column; align-items:center; justify-content:center; padding:70px 0 60px; border:1px solid #ebebeb; border-radius:5px}
.doc-convert .convert-info{line-height:135%; font-family:'welcome' !important; font-size:16px; font-weight:300; color:#909090; letter-spacing:-0.8px}
.doc-convert .convert-info:nth-child(1){color:#5629ee}
.doc-convert .convert-info:nth-child(2){margin-top:5px; font-size:14px; font-weight:normal}


.stitArea.box/* convert-loader */
.convert-loader{position:relative; width:40px; height:40px; margin-top:10px}
.convert-loader40{position:relative; width:40px; height:40px; margin-top:10px}
.convert-loader60{position:relative; width:60px; height:60px; margin-top:10px}
.convert-loader80{position:relative; width:80px; height:80px; margin-top:10px}
.convert-loader:before,
.convert-loader40:before
{
 content:''; position:absolute; top:50%; left:50%; width:40px; height:40px; margin-left:-20px; margin-top:-20px; border:4px solid #e7e6e4; border-top:4px solid #5629ee; border-radius:50%;
 animation:circle_spin 1s ease 0.2s infinite; box-sizing:border-box
}
 @keyframes circle_spin{0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)}}

.convert-loader60:before{
 content:''; position:absolute; top:50%; left:50%; width:60px; height:60px; margin-left:-30px; margin-top:-30px; border:5px solid #e7e6e4; border-top:5px solid #5629ee; border-radius:50%;
 animation:circle_spin 1s ease 0.2s infinite; box-sizing:border-box
}
 @keyframes circle_spin{0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)}}
 
.convert-loader80:before{
 content:''; position:absolute; top:50%; left:50%; width:80px; height:80px; margin-left:-40px; margin-top:-40px; border:6px solid #e7e6e4; border-top:6px solid #5629ee; border-radius:50%;
 animation:circle_spin 1s ease 0.2s infinite; box-sizing:border-box
}
 @keyframes circle_spin{0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)}}

.convert-loader .convert-txt span{color:#202020}


/* toggle-toolbar */
.toggle-toolbar{position:absolute; right:0; top:20px; bottom:0; width:22px; z-index:3}
.toggle-toolbar .toggle{position:sticky; left:0; top:0; width:22px; height:36px; padding:0; border:1px solid #c8c8c8; border-right:none; background:#fff; border-radius:3px 0 0 3px; cursor:pointer}
.toggle-toolbar .toggle:before{content:"\e93c"; font-family:'xeicon'; font-size:20px; color:#808080}
.toggle-toolbar.expansion .toggle:before{content:"\e93f"}

/* doc-master */
.doc-master{position:relative; border:1px solid #e9e9e9; }
.doc-master.overlab{margin-top:-1px;}
.doc-master.preview{border:none}
.doc-master .master-inner{position:relative; min-height:200px; padding:20px; background:#fff; border-radius:8px; z-index:2}

.master-toolbar{min-width:210px; background:#fff; padding:20px; margin:10px;  box-sizing:border-box; box-shadow: 0px 1px 5px #00000012; border-radius: 8px;}

.master-toolbar > div{position:sticky; top:20px}
.master-toolbar.collapse .master-toolbar-inner{right:0}

.master-toolbar .Tabs > ul{overflow:visible}
.master-toolbar .Tabs > ul > li,
.master-toolbar .Tabs .Scroller ul > li{height:46px; padding:9px 0; background:#979aa6; color:#202020; font-size:13px; font-weight:300; letter-spacing:-0.8px; border-radius:0; box-sizing:border-box}
.master-toolbar .Tabs > ul > li > span,
.master-toolbar .Tabs .Scroller ul > li > span{vertical-align:middle}
.master-toolbar .Tabs > ul{width:100%}
.master-toolbar .Tabs > ul > li:first-child,
.master-toolbar .Tabs .Scroller > ul > li:first-child{border:none}
.master-toolbar .Tabs > ul > li.Selected,
.master-toolbar .Tabs .Scroller > ul > li.Selected{border:none}
.master-toolbar .Tabs > ul > li,
.master-toolbar .Tabs > .Scroller > ul > li{border:0}
.master-toolbar .Tabs > ul > li:hover,
.master-toolbar .Tabs .Scroller > ul > li:hover,
.master-toolbar .Tabs > ul > li:active,
.master-toolbar .Tabs .Scroller > ul > li:active{background:none; border-top:none; border-right:none; border-left:none; font-weight:300; color:rgba(255, 255, 255, 1)}
.master-toolbar .Tabs > ul > li.Selected,
.master-toolbar .Tabs .Scroller > ul > li.Selected{border-top:none; border-right:none; border-left:none; font-weight:300; color:#202020}
.master-toolbar .Tabs > ul > li.Selected:before,
.master-toolbar .Tabs .Scroller ul > li.Selected:before{display:none}
.master-toolbar .Tabs > ul > li.Selected:after,
.master-toolbar .Tabs .Scroller ul > li.Selected:after{background:#fff}
.master-toolbar .Tabs > ul > li:before, .Tabs > ul > li:after{display:none}
.master-toolbar .Tabs .af-tabs-content{padding-top:0; border-top:none}

.master-toolbar .tag-inner{padding:10px}
.master-toolbar .tag-write{margin-bottom:10px}
.master-toolbar .tag-list:after{content:''; display:block; clear:both}
.master-toolbar .tag-list > li{float:left; margin-right:2px; margin-bottom:2px}
.master-toolbar .tag-list > li .tag-box{position:relative; height:27px; padding:3px 25px 0 8px; background-color:#f3f8ff; border:1px solid; border:1px solid #0196fa; box-sizing:border-box}
.master-toolbar .tag-list > li .tag-box span{font-size:12px; font-weight:normal; letter-spacing:-0.2px; color:#505050}
.master-toolbar .tag-list > li .tag-box .del{position:absolute; right:0; top:0; width:20px; height:25px; padding:0; line-height:25px; background:none; font-size:18px; color:#808080; text-align:center; border:0; cursor:pointer}
.master-toolbar .tag-list > li .tag-box .del:before{content:"\e922"; font-family:'xeicon'}

.master-toolbar .tool-list > li{margin-bottom:2px}
.master-toolbar .tool-list > li button{display:flex; align-items:center; width:100%; margin:0; padding:10px; padding-left:0; background:none; font-size:14px; letter-spacing:-0.2px; border:0; border-radius:0; cursor:pointer; box-sizing:border-box; transition: all 0.3s}
.master-toolbar .tool-list > li button svg{width:20px; height:20px}
.master-toolbar .tool-list > li button span{margin-left:8px; margin-top:-1px; color:#707070; font-weight:300}
.master-toolbar .tool-list > li button:hover span{color:#202020}

.master-toolbar .step-guide{position:absolute; right:8px; top:13px}

/* docpilot-btn */
.docpilot-btn{display:flex; align-items:center; justify-content:center; margin-top:30px}
.docpilot-btn .Button{margin:0 2px}

/* docform-ty1 */
.docform-ty1{position:relative}
.docform-ty1 .writing-list{border-top:1px solid #dadada; border-bottom:1px solid #dadada; overflow:hidden}
.docform-ty1 .writing-list:after{content:''; display:block; clear:both}
.docform-ty1 .writing-list > li{display:flex; align-items:center; position:relative; border-bottom:1px solid #ebebeb; padding:11px 0; min-height:50px; box-sizing:border-box}
.docform-ty1 .writing-list > li:last-child{border-bottom:none}

.docform-ty1 .writing-list li.col2{min-height:auto; padding:0}
.docform-ty1 .writing-list li.col2 .col-box{display:flex; align-items:center; width:100%}
.docform-ty1 .writing-list li.col2 .col-box > li{display:flex; align-items:center; flex:1; position:relative; padding:11px 0; min-height:50px; box-sizing:border-box}
.docform-ty1 .writing-list li.col2 .col-box > li:nth-child(2){border-left:1px solid #ebebeb}

.docform-ty1 .writing-tit{display:flex; align-items:center; padding:0 10px}
.docform-ty1 .writing-tit .col-row{display:flex; flex-direction:column; flex:auto}
.docform-ty1 .writing-tit .col-row .row{display:flex; align-items:center}
.docform-ty1 .writing-tit .tit{display:inline-block; font-size:13px; letter-spacing:-0.5px; color:#202020; font-weight:300; vertical-align:middle}
.docform-ty1 .writing-cont{display:flex; align-items:center; flex:auto}
.docform-ty1 .writing-cont .col-row{display:flex; flex-direction:column; flex:auto}
.docform-ty1 .writing-cont .col-row .row{display:flex; align-items:center}

.docform-ty1 .form-list:after{content:''; display:block; clear:both}
.docform-ty1 .form-list li{float:left}
.docform-ty1 .form-list.col2 li{width:50%}
.docform-ty1 .form-list li .inner{display:flex; align-items:center}
.docform-ty1 .form-list{margin-top:5px}
.docform-ty1 .form-list:first-child{margin-top:0}

.docform-ty1 .cmmfile-addbtn{display:flex; align-items:center}


/* docform-ty2 */
.docform-ty2{position:relative; margin:5px 0; background-color:#fff}
.docform-ty2 .writing-list{position:relative; border:1px solid #dadada; border-radius:8px}
.docform-ty2 .writing-list:after{content:''; display:block; clear:both}
.docform-ty2 .writing-list > li{display:flex; align-items:stretch; position:relative; min-height:50px; padding:0; border-bottom:1px solid #ebebeb; box-sizing:border-box}
.docform-ty2 .writing-list > li:last-child{border-bottom:none}

.docform-ty2 .writing-list li.col2{min-height:auto; padding:0}
.docform-ty2 .writing-list li.col2 .col-box{display:flex; align-items:center; width:100%}
.docform-ty2 .writing-list li.col2 .col-box > li{display:flex; align-items:stretch; flex:1; position:relative; min-height:49px; height:100%; padding:0; box-sizing:border-box}
.docform-ty2 .writing-list li.col2 .col-box > li:nth-child(2){border-left:1px solid #ebebeb}

.docform-ty2 .writing-list li.col3{min-height:auto; padding:0}
.docform-ty2 .writing-list li.col3 .col-box{display:flex; align-items:center; width:100%}
.docform-ty2 .writing-list li.col3 .col-box > li{display:flex; align-items:stretch; flex:1; position:relative; min-height:49px; height:100%; padding:0; box-sizing:border-box}
.docform-ty2 .writing-list li.col3 .col-box > li:nth-child(2),
.docform-ty2 .writing-list li.col3 .col-box > li:nth-child(3){border-left:1px solid #ebebeb}

.docform-ty2 .writing-tit{display:flex; align-items:center; min-height:50px; padding:0 10px; background:#f9fafc; box-sizing:border-box; border-radius:8px 0 0 8px}
.docform-ty2 .writing-tit .tit{display:inline-block; font-size:15px; letter-spacing:-0.5px; color:#202020; font-weight:300; vertical-align:middle}
.docform-ty2 .writing-tit img{width:20px}
.docform-ty2 .writing-cont{flex:auto; padding:11px;}
.docform-ty2 .writing-cont .col-row{display:flex; flex-direction:column; flex:auto}
.docform-ty2 .writing-cont .col-row .row{display:flex; align-items:center}
.docform-ty2 .writing-cont .col-row .row .spider{flex:auto;}

.docform-ty2 .position-controll{flex:auto; width:100%}
.docform-ty2 .position-controll .controll-list:after{content:''; display:block; clear:both}
.docform-ty2 .position-controll .controll-list li{float:left; margin-right:8px}

.docform-ty2 .writing-list li.col2 .position-controll{display:flex; align-items:center; flex-direction:row-reverse; position:relative; right:auto; top:auto; margin-top:7px; border-top:1px solid #ebebeb}

.docform-ty2 .ImageCheckbox:after{margin-top:-7px}
.docform-ty2 .ImageRadio:after{margin-top:-8px}

.docform-ty2 .check-name li{margin-top:5px}
.docform-ty2 .check-name li:first-child{margin-top:0}

.docform-ty2 .result-checklist{margin-left:-10px}
.docform-ty2 .result-checklist:after{content:''; display:block; clear:both}
.docform-ty2 .result-checklist li{display:inline-block; height:30px}
.docform-ty2 .result-checklist > li > span{line-height:27px; color: #333; font-size:15px; vertical-align:middle}
.docform-ty2 .result-checklist.col li{display:inline-block}
.docform-ty2 .result-checklist.row li{display:flex; padding:2px 0px; align-items:center}
.docform-ty2 .result-checklist li .Textinput{margin-left:8px;}
.docform-ty2 .result-checklist li .ImageCheckbox{height:auto}
.docform-ty2 .result-checklist li .ImageCheckbox span{min-width:10px;}
.docform-ty2 .result-checklist li .ImageCheckbox,
.docform-ty2 .result-checklist li .ImageRadio{margin-left:10px}

.docform-ty2 .single-thum img{max-width:100%; height:auto}

.docform-controll{display:none; position:absolute; align-items:center; right:-28px; top:-1px; border-radius:0 3px 3px 0; z-index:1; overflow:hidden}
.docform-controll .Button.only-ico{min-width:28px; width:28px; height:28px; padding-top:1px !important; border:0; background:#5c6072}
.docform-controll .Button.only-ico{border-radius:0}

.docform-ty2:hover .writing-list{border:1px solid #5c6072; border-radius:8px 0 8px 8px}
.docform-ty2:hover .writing-list .docform-controll{display:flex}
.docform-ty2:hover .datalink-combine .writing-list{border:0}

.docform-ty2 .auto-input{display:inline-block; padding:9px 18px; line-height:155%; font-size:14px; font-weight:300; color:#0196fa; letter-spacing:-0.5px; border:1px solid #cceafe; border-radius:4px}

.docform-ty2 .datalink-combine{position:relative; margin-top:25px}
.docform-ty2 .datalink-combine .combine-top{display:flex; flex-direction:column; height:auto; min-height:68px; padding:0 0 19px; background-color:#f9fafc; border:1px solid #dadada; border-radius:8px; overflow:hidden; box-sizing:border-box}
.docform-ty2 .datalink-combine .combine-top .no-data{display:none; position:relative; padding:0 0; text-align:center}
.docform-ty2 .datalink-combine .combine-top .no-data .message{display:inline-block; font-size:14px; font-weight:normal; color:#909090; letter-spacing:-0.2px}
.docform-ty2 .datalink-combine .combine-top .no-data .message i{margin-top:-3px; font-size:20px; vertical-align:middle}
.docform-ty2 .datalink-combine .combine-top .link-clear{position:absolute; right:11px; top:12px}

.docform-ty2 .datalink-combine .combine-top .combine-top-row{display:flex; align-items:center}
.docform-ty2 .datalink-combine .combine-top .combine-top-row:last-child{margin-bottom:0}
.docform-ty2 .datalink-combine .combine-top .combine-top-row .writing-list{width:100%; border:0; border-radius:0}

.docform-ty2 .datalink-combine .combine-body{display:flex; align-items:stretch; height:268px; margin-top:-20px; border:1px solid #dadada; border-radius:8px; overflow:hidden}
.docform-ty2 .datalink-combine .combine-body-l,
.docform-ty2 .datalink-combine .combine-body-r{flex:1; height:100%; overflow:hidden; overflow-y:auto; box-sizing:border-box}
.docform-ty2 .datalink-combine .combine-body-l{min-width:180px; max-width:180px; padding:10px; background-color:#f9fafc; border-right:1px solid #ecedee}
.docform-ty2 .datalink-combine .combine-body-r{padding:20px 25px; background-color:#fff}

.docform-ty2 .datalink-combine .datalink_tab{position:relative}
.docform-ty2 .datalink-combine .datalink_tab ul{margin-top:-2px}
.docform-ty2 .datalink-combine .datalink_tab ul:after{content:''; display:block; clear:both}
.docform-ty2 .datalink-combine .datalink_tab ul li{display:flex; align-items:center; position:relative; margin-top:2px}
.docform-ty2 .datalink-combine .datalink_tab ul li a{display:flex; align-items:center; position:relative; width:100%; height:38px; padding-left:37px; border-radius:8px; box-sizing:border-box; transition:all .20s ease}
.docform-ty2 .datalink-combine .datalink_tab ul li a span{color:#5c6072; font-size:15px; font-weight:normal; letter-spacing:-0.8spx}
.docform-ty2 .datalink-combine .datalink_tab ul li .ico-area{position:absolute; top:4px; left:12px; z-index:1}
.docform-ty2 .datalink-combine .datalink_tab ul li i{color:#5c6072; font-size:20px}
.docform-ty2 .datalink-combine .datalink_tab ul li:hover a{background-color:#f0f2f2}
.docform-ty2 .datalink-combine .datalink_tab ul li.active a{background-color:#e8e9ea}

.docform-ty2 .datalink-combine .datalink-tab-cont{display:none; position:relative}
.docform-ty2 .datalink-combine .datalink-tab-cont.active{display:block}

.docform-ty2 .datalink-combine .col-group{margin-bottom:20px; padding-bottom:10px; border-bottom:1px solid #ecedee}
.docform-ty2 .datalink-combine .col-group:last-child{margin-bottom:0; border-bottom:none}
.datalink-label{display:flex; align-items:center; flex-wrap:wrap; margin-left:-2px; margin-top:-5px}
.datalink-label .label-btn{
 display:flex; align-items:center; position:relative; line-height:1.5; margin-left:2px; margin-top:5px; padding:5px 14px 5px 14px; background:#f0f2f2; border:0;
 font-weight:normal; font-size:14px; letter-spacing:-0.8px; color:#808080; border-radius:120px; vertical-align:middle; box-sizing:border-box; cursor:pointer;}
.datalink-label .label-btn:before{content:"\e929"; display:none; position:absolute; left:10px; top:3px; color:rgba(255,255,255,.9); font-family:xeicon; font-size:15px;}
.datalink-label .label-btn.active{padding-left:26px; background:#5c6072; color:#fff}
.datalink-label .label-btn.active:before{display:block}

.datalink-select-label{display:flex; align-items:center; flex-wrap:wrap; margin-left:-2px; margin-top:-5px}
.datalink-select-label .label-btn{
 display:flex; align-items:center; position:relative; line-height:1.5; margin-left:2px; margin-top:5px; padding:5px 14px 5px 14px; background:#f0f2f2;
 border:0; font-weight:normal; font-size:13px; letter-spacing:-0.8px; color:#808080; border-radius:120px; vertical-align:middle; box-sizing:border-box; cursor:pointer;}
.datalink-select-label .label-btn.active{background:#5c6072; color:#fff}


/* docform-ty3 */
.docform_wrap{display:flex; gap:30px; flex-wrap:wrap}
.docform-ty3{width:49%}
.docform-ty3 .writing-list{border:1px solid #dadada; border-radius:8px}
.work_set_box_del .del-btn{min-width:30px; background:#ffe9f3; color:#fa167c; border:none; display:inline-flex; align-items:center; justify-content:center; padding:0; min-width:40px; margin-left:5px; opacity:0.6}
.work_set_box_del .del-btn:hover{opacity:1}
.docform-ty3:hover .writing-list{border:1px solid #b7afd4}
.docform-ty3 .writing-list .writing-tit{display:flex; align-items:center; justify-content:space-between; padding:15px 30px; box-sizing:border-box; border-radius:8px 8px 0 0; background:#f6f5fa}
.docform-ty3 .writing-cont{padding:25px 30px}
.docform-ty3 .writing-cont .col-row{display:flex; flex-direction:column; flex:auto}
.docform-ty3 .writing-cont .hours_list_cont .col-row{margin-left:30px}
.docform-ty3 .writing-cont .col-row .row{display:flex; align-items:center}
.docform-ty3 .week_list .week_list_cont{gap:10px}
.docform-ty3 .week_list .week_list_cont li{margin-right:0}
.docform-ty3 .week_list .week_list_cont li .Button,
.docform-ty3 .week_list .week_list_cont li .Button:active,
.docform-ty3 .week_list .week_list_cont li .Button:hover,
.docform-ty3 .week_list .week_list_cont li .Button:focus,
.docform-ty3 .week_list .week_list_cont li .Button.af-hover,
.docform-ty3 .week_list .week_list_cont li .Button.Checked{/*padding:3px 25px 3px*/min-width:90px}
.docform-ty3 .hours_list .hours_list_cont{display:flex; flex-direction:column}
.docform-ty3 .hours_list .hours_list_cont > li{margin-right:0; margin-top:15px; min-height:40px}
.docform-ty3 .hours_list .hours_list_cont > li:first-child{margin-top:0}
.docform-ty3 .add_box{display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:420px; background:#fafafa; border-radius:8px; cursor:pointer}
.docform-ty3 .add_box .add_ico{width:45px; height:45px; background: #fff; box-shadow:1px 3px 9px rgb(0 0 0 / 15%); display:flex; justify-content:center; align-items:center; border-radius:15px; font-size:20px; margin-bottom:10px}
.docform-ty3 .add_box .add_ico i{color:#aaa}
.docform-ty3 .add_box span{color:#888; margin-top:5px; letter-spacing:-0.5px}
.docform-ty3 .add_box:hover{background:#f6f5fa}
.docform-ty3 .add_box:hover .add_ico{box-shadow:1px 3px 9px rgb(86 41 238 / 15%)}
.docform-ty3 .add_box:hover .add_ico i{color:#5629ee}
.docform-ty3 .add_box:hover span{color:#555}


/* docapproval */
.docapproval{display:flex; align-items:center; justify-content:flex-end; position:relative; margin:2px 0}
.docapproval .approval-wrap{display:flex; align-items:center; border:1px solid #dadada}
.docapproval .approval-tit{display:flex; align-items:center; justify-content:center; width:38px; height:102px; line-height:120%; background-color:#f9fafc; color:#505050; font-size:13px; letter-spacing:-0.8px}

.docapproval .approval-list:after{content:''; display:block; clear:both}
.docapproval .approval-list li{float:left; margin-left:-1px}
.docapproval .approval-box{display:flex; flex-direction:column; justify-content:flex-end; align-items:center; width:80px; border-left:1px solid #dadada}

.docapproval .approval-p,
.docapproval .approval-n{display:flex; align-items:center; justify-content:center; width:100%; height:28px; min-height:28px; text-align:center; box-sizing:border-box}
.docapproval .approval-s{display:flex; align-items:center; justify-content:center; width:100%; height:46px; min-height:46px; text-align:center; box-sizing:border-box}
.docapproval .approval-s img{display:inline-block; max-height:40px}
.docapproval .approval-p span,
.docapproval .approval-n span{color:#505050; font-size:13px; letter-spacing:-0.8px}
.docapproval .approval-p{border-bottom:1px solid #dadada}
.docapproval .approval-n{border-top:1px solid #dadada}
.docapproval:hover .approval-wrap{border:1px solid #5c6072}
.docapproval:hover .docform-controll{display:flex}

/* docfile */
.docfile{position:relative;  margin:10px -20px -20px; padding:15px; background-color:#f9fafc; border-top:1px solid #dadada}

/* docscreen */
.docscreen{margin:5px 0; height:auto; border:1px solid #5c6072; border-radius:8px; overflow:hidden}
.docscreen .inner{height:auto}
.se-contents{padding:0 !important}
.se-contents p,
.se-contents div{font-family:initial;}


/* doctext */
.doctxt-anchor{background:#95e3ed; border:1px solid #2bc7db; color:#202020; padding:3px 6px; letter-spacing:-0.5px; border-radius:2px}
.doctxt-fix{background:#ffdc7f; border:1px solid #ffba00; color:#202020; padding:3px 6px; letter-spacing:-0.5px; border-radius:2px}
.doctxt-list{background:#ced88a; border:1px solid #9eb216; color:#202020; padding:3px 6px; letter-spacing:-0.5px; border-radius:2px}


/* docarousel-ty1 */
.docarousel-ty1 .doc-carousel{margin:0 -10px}
.docarousel-ty1 .doc-carousel .carousel-box{display:flex; margin:0 10px; position:relative; padding:10px; border:1px solid #dadada; background-color:#fff; box-sizing:border-box}
.docarousel-ty1 .doc-carousel .cover-img{flex:1; border:1px solid #505050}
.docarousel-ty1 .doc-carousel .cover-img img{width:100%}

.docarousel-ty1 .doc-carousel .doc-overlay{display:none; align-items:flex-start; justify-content:center; position:absolute; left:-1px; top:-1px; right:-1px; bottom:-1px; background-color:rgba(0,0,0,.75)}
.docarousel-ty1 .doc-carousel .doc-overlay .cover-btn{display:flex; position:absolute; bottom:0; left:0; width:100%; background-color:#5629ee}
.docarousel-ty1 .doc-carousel .doc-overlay .cover-btn li{flex:1; border-right:1px solid rgba(255,255,255,.2); list-style:none}
.docarousel-ty1 .doc-carousel .doc-overlay .cover-btn li:last-child{border-right:none}
.docarousel-ty1 .doc-carousel .doc-overlay .cover-btn li button{display:flex; justify-content:center; align-items:center; flex-direction:column; width:100%; height:58px; padding:10px 0; background:none; border:0; cursor:pointer; box-sizing:border-box}
.docarousel-ty1 .doc-carousel .doc-overlay .cover-btn li button:hover{background-color:rgba(255,255,255,.1)}
.docarousel-ty1 .doc-carousel .doc-overlay .cover-btn li button i{margin-bottom:2px; font-size:18px; color:#fff}
.docarousel-ty1 .doc-carousel .doc-overlay .cover-btn li button span{font-size:12px; letter-spacing:-0.5px; color:#fff}
.docarousel-ty1 .doc-carousel .carousel-box:hover .doc-overlay{display:flex}

.docarousel-ty1 .doc-history{flex:auto; margin:35px 20px 0; padding:8px 0; border-top:2px solid #fff; border-bottom:2px solid #fff}
.docarousel-ty1 .doc-history .history-list{margin-top:10px; overflow:hidden}
.docarousel-ty1 .doc-history .history-list:first-child{margin-top:0}
.docarousel-ty1 .doc-history .history-list:after{content:''; display:block; clear:both}
.docarousel-ty1 .doc-history .history-list > li{display:flex; align-items:center; position:relative; padding:4px 0; min-height:27px; box-sizing:border-box}
.docarousel-ty1 .doc-history .history-list > li:last-child{border-bottom:none}
.docarousel-ty1 .doc-history .history-tit{display:flex; align-items:center; padding-left:10px}
.docarousel-ty1 .doc-history .history-tit .tit{display:inline-block; font-size:12px; letter-spacing:-0.5px; color:#fff; font-weight:normal}
.docarousel-ty1 .doc-history .history-cont{display:flex; align-items:center; flex:auto; padding-right:10px}
.docarousel-ty1 .doc-history .history-cont .infoTxt01{font-size:12px; color:#fff}

.docarousel-ty1 .doc-carousel .slick-arrow{display:flex; justify-content:center; align-items:center; position:absolute; top:50%; width:30px; height:30px; margin-top:-15px; padding:0; border:none; border-radius:50%; outline:none; font-size:0; cursor:pointer; z-index:1; transition:all .20s ease}
.docarousel-ty1 .doc-carousel .slick-prev,
.docarousel-ty1 .doc-carousel .slick-next{background:rgba(0,0,0,.5)}
.docarousel-ty1 .doc-carousel .slick-prev{left:5px}
.docarousel-ty1 .doc-carousel .slick-next{right:0}
.docarousel-ty1 .doc-carousel .slick-prev:before,
.docarousel-ty1 .doc-carousel .slick-next:before{content:"\e93c"; color:rgba(255,255,255,.5); font-family:xeicon; font-size:24px; transition:all .20s ease}
.docarousel-ty1 .doc-carousel .slick-next:before{transform:rotate(-180deg)}
.docarousel-ty1 .doc-carousel .slick-prev:hover:before,
.docarousel-ty1 .doc-carousel .slick-next:hover:before{color:rgba(255,255,255,.8)}
.docarousel-ty1 .doc-carousel .slick-prev:hover,
.docarousel-ty1 .doc-carousel .slick-next:hover{background:rgba(0,0,0,.7)}
.docarousel-ty1 .doc-carousel .slick-prev.slick-disabled{display:none !important}
.docarousel-ty1 .doc-carousel .slick-next.slick-disabled{display:none !important}

/* dococr-result */
.dococr-result{position:relative}
.dococr-result .img-area{position:relative; width:100%; overflow:auto}
.dococr-result .img-area img{display:block; margin:0 auto; width:100%;}
.dococr-result .img-area img:before{background:rgba(0,0,0,.7); display:block; content:""; position:absolute; width:100%; height:100%}
.dococr-result.original .img-area img{width:auto; height:auto}
.ocr-text-transform{position:relative; height:808px; overflow:auto}
.ocr-text-transform span{margin:0 3px; font-size:13px; font-weight:normal; letter-spacing:-0.5px; line-height:165%; color:#202020; cursor:pointer}
.ocr-text-transform span.highlight{background-color:#c8c8c8}
.ocr-text-transform span:hover{background-color:#c8c8c8}
.ocr-table-transform{position:relative; height:100%; overflow:auto}

.ocr-rect {position:absolute;border: 2px solid #8bff76}
.ocr-text-select {background-color:#c8c8c8}
.dococr-result .img-area #divOcrImage{display:inline-block; background:rgba(0, 0, 0, 0.75);
}

/* doc-view - 회사업무 */
.doc-view{position:relative; padding:0px; background-color:#fff; border:1px solid #e9e9e9; border-radius:8px}
.doc-view.overlap{margin-top:-1px; border-radius:0px 0px 8px 8px; padding:15px 20px;}
.doc-view.overlap .doc-view.overlap{border:0}
.doc-view .docform-ty2{margin:0}
.doc-view .docform-ty2 .writing-list{border-radius:0; border:0}
.doc-view .docform-ty2 .writing-list > li{min-height:50px; border-bottom:1px solid #e9e9e9}
.doc-view .docform-ty2:first-child .writing-list > li{border-top:1px solid #e9e9e9}
.doc-view .docform-ty2 .writing-tit{min-height:50px; background:none; border-right:1px solid #e9e9e9; background:#f8f8f8; border-radius: 0px;}

.doc-view .docform-ty2 .writing-list li.col2 .writing-tit{border-left:1px solid #e9e9e9;}
.doc-view .docform-ty2 .writing-list li.col2 .col-box li:first-child .writing-tit{border-left:initial;}
.doc-view .docform-ty2 .writing-cont{display:flex; align-items:center; padding:5px 10px;}

.doc-view .docform-ty2 .writing-list li.col2 .col-box > li:nth-child(2){border-left:0}
.doc-view .docform-ty2 .result-checklist{display:flex; flex-wrap:wrap;}
.doc-view .docform-ty2 .result-checklist.row{display:initial}
.doc-view .docform-ty2 .result-checklist.row li{display:flex;}
.doc-view .docform-ty2 .result-checklist li{display:inline-flex; align-items:center; margin-right:5px; min-height: 46px;}
.doc-view .docform-ty2 .result-checklist li:first-child{margin-left:0}
.doc-view .docform-ty2 .result-checklist .switch .label{margin-left:5px}
.doc-view .docform-ty2 .Button.only-ico{margin-left:2px}

.doc-view .docform-ty2 .list-tit{display:flex; align-items:center; width:100%; margin:25px 10px 0; padding-bottom:10px; border-bottom:1px solid #ddd}
.doc-view .docform-ty2 .list-tit img{width:20px}
.doc-view .docform-ty2 .list-tit span{display:inline-block; margin-left:5px; font-size:21px; letter-spacing:-0.5px; color:#202020; font-weight:300}

.doc-view .label-tit{width:100%; margin:5px 10px}

.doc-view .view-inner .docform-ty2:first-child .list-tit{margin-top:0}

.doc-view .writing-ty1 .writing-list:first-child{border:0}
.doc-view .writing-ty1 .writing-list:nth-child(2){border-top:1px solid #e9e9e9}
.doc-view .doc-master .docform-ty2 .writing-cont .col-row .row .spider{min-width:1200px}


/*
#tabcont-view .docform-ty2{border-bottom:1px solid #dadada;}
#tabcont-view .docform-ty2:first-child{border-top:1px solid #dadada;} 
#tabcont-view .docform-ty2 .writing-list{border:none;}
#tabcont-view .docform-ty2 .writing-tit{background:none;}
*/


/* 2023ver */
.toolkit-reg{width:1400px}
.toolkit-reg .toolkit-flow{width:100%; min-height:180px; margin-top: 16px;  overflow:hidden; overflow-x: auto; margin-bottom: 20px;}
.doc-info{width:100%; display:flex; justify-content:center; align-items:center; flex-direction:column; min-height:400px; height:80%}
.doc-info .info-ico{font-size: 56px; position:relative; color:#e3e3e3}
.doc-info .info-ico .close{position:absolute; font-size: 16px; border-radius: 50%; background:#5629ee; width:22px; height:22px; color:#fff; display: flex; align-items: center; justify-content: center; bottom: 14px; right: -5px}
.doc-info .info-tit{font-size: 16px; letter-spacing: -0.8px; color:#333}
.doc-location{display:flex; align-items: center; color:#666; }
.doc-location .tit{font-size: 14px; letter-spacing: -0.5px; margin:0px 4px; cursor:pointer}
.doc-location .tit:hover{color:#5629ee; text-decoration:underline; text-underline-offset:4px}
.doc-location i{font-size:19px}


/* **************************************** *
 * TOOLKIT-STEPER
 * **************************************** */
.toolkit-flow .steper-state{position:relative; margin:0 auto;}
.toolkit-flow .steper-state .state_list{margin-left:50px; margin-top:46px; display:flex; justify-content:center; cursor:pointer}
.toolkit-flow .steper-state .state_list:after{content:''; display:block; clear:both}
.toolkit-flow .steper-state .state_list li{position:relative; flex:none; display:inline-block; flex-wrap:nowrap;  min-width: 300px; width: 300px; box-sizing:border-box;}

.toolkit-flow .steper-state .state_box{position:relative; margin-left:34px; text-align:center; height:80px; background:#fff; background-repeat:no-repeat; border:1px solid #5629ee20; border-radius:12px; box-sizing:border-box; padding:12px 24px;  vertical-align: middle; display: flex; justify-content: center; align-items: center;}
.toolkit-flow .steper-state .state_box:hover{box-shadow: 0px 0px 10px #5629ee12; }
.toolkit-flow .steper-state .state_box .state_top .tit{font-size:16px; font-weight:300; letter-spacing:-1px; color:#505050; word-break: keep-all; overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.toolkit-flow .steper-state .state_box .state_top .next{position:absolute; z-index: 1;  left:-32px; top:50%; width:26px; height:26px; margin-top:-12px; margin-right:-13px; padding-left:2px; background-color:transparent; border-radius:50%; box-sizing:border-box; color:#c9c5d6}
.toolkit-flow .steper-state .state_box .state_top .next i{line-height:22px; font-size:26px}
.toolkit-flow .steper-state .state_list li:first-child .next{display:none}
.toolkit-flow .steper-state .state_box .state_num{display:block; margin-top:5px; letter-spacing:-0.2px; line-height:135%; color:#808080; font-weight:normal; font-size:13px; }
.toolkit-flow .steper-state .state_box .state_del{display:none; position:absolute; right:4px; top:4px; border-radius: 50%; width:20px; height:20px; background:#68666921; align-items: center; justify-content: center;}
.toolkit-flow .steper-state .state_box .state_del i{font-size: 16px; color:#fff}

.toolkit-flow .steper-state .state_box:hover .state_del,
.toolkit-flow .steper-state .state_box.active:hover .state_del{display:flex}
.toolkit-flow .steper-state .state_box.add:hover .state_del{display:none}
.toolkit-flow .steper-state .state_box.active{background-color:#f9f7ff; border:1px solid #5629ee40;}
.toolkit-flow .steper-state .state_box.active .state_top .tit{color:#5629ee}
.toolkit-flow .steper-state .state_box.active .state_top .next{left:-13px; border:2px solid #5629ee; color:#5629ee; background:#fff;  z-index:1}
.toolkit-flow .steper-state .state_box.active .state_top .next i{font-size: 20px;}
.toolkit-flow .steper-state .state_box.active .state_top .next
{
 -webkit-animation: status_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s infinite forwards;
 -moz-animation: status_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s infinite forwards;
 -o-animation: status_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s infinite forwards;
 animation: status_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s infinite forwards;
}
@-webkit-keyframes status_next{0%{margin-left:-36px; opacity:0;} 100%{margin-left:-0px; opacity:1}}
@-moz-keyframes status_next{0%{margin-left:-36px; opacity:0;} 100%{margin-left:-0px; opacity:1}}
@-o-keyframes status_next{0%{margin-left:-36px; opacity:0;} 100%{margin-left:-0px; opacity:1}}
@keyframes status_next{0%{margin-left:-36px; opacity:0;} 100%{margin-left:-0px; opacity:1}}


.toolkit-flow .steper-state .state_box.add {border:1px dashed #e3e3e3; width:150px}
.toolkit-flow .steper-state .state_box.add .state_top .ico-add i{font-size: 22px; color:#ccc}
.toolkit-flow .steper-state .state_box.add .state_top .tit{color:#8b8b8b; font-weight:normal; font-size: 15px;}
.toolkit-flow .steper-state .state_box.add:hover {background:#f9f7ff20; box-shadow: 0px 0px 10px #5629ee1a; border:1px dashed #5629ee40}
.toolkit-flow .steper-state .state_box.add .state_top .next{opacity:0; left:-13px; border:2px solid #ccc; color:#ccc; }
.toolkit-flow .steper-state .state_box.add .state_top .next i{font-size:20px}

.toolkit-flow .steper-state .state_box.add:hover .state_top .next
{ 
 -webkit-animation: status_add_hover 1.8s cubic-bezier(0.7, 0, 0.3, 1) 0s infinite forwards;
 -moz-animation: status_add_hover 1.8s cubic-bezier(0.7, 0, 0.3, 1) 0s infinite forwards;
 -o-animation: status_add_hover 1.8s cubic-bezier(0.7, 0, 0.3, 1) 0s infinite forwards;
 animation: status_add_hover 1.8s cubic-bezier(0.7, 0, 0.3, 1) 0s infinite forwards;
}
@-webkit-keyframes status_add_hover{0%{margin-left:-36px; opacity:0;} 100%{margin-left:-0px; opacity:1}}
@-moz-keyframes status_add_hover{0%{margin-left:-36px; opacity:0;} 100%{margin-left:-0px; opacity:1}}
@-o-keyframes status_add_hover{0%{margin-left:-36px; opacity:0;} 100%{margin-left:-0px; opacity:1}}
@keyframes status_add_hover{0%{margin-left:-36px; opacity:0;} 100%{margin-left:-0px; opacity:1}}

.content-flow .toolkit-flow .steper-state .state_list{margin:16px 0px; justify-content:normal;}
.content-flow .toolkit-flow .steper-state .state_list li{position:relative; flex:none; display:inline-block; min-width:180px; width:auto; max-width:300px; box-sizing:border-box;}

.content-flow .toolkit-flow .steper-state .state_box{position:relative; margin-left:34px; text-align:center; height:48px; background:#eeeaf3; background-repeat:no-repeat; border:0; border-radius:12px; box-sizing:border-box; padding:12px 16px;  vertical-align: middle; display: flex; justify-content: center; align-items: center;}
.content-flow .toolkit-flow .steper-state .state_box:hover{box-shadow:none }
.content-flow .toolkit-flow .steper-state .state_box:hover .state_del{display:none}
.content-flow .toolkit-flow .steper-state .state_box .state_top .tit{font-size:14px; word-break: keep-all; overflow: hidden; line-height: 1.2; padding: 0px 2px;}
.content-flow .toolkit-flow .steper-state .state_box .state_top .next{background:none; color:#5629ee}
.content-flow .toolkit-flow .steper-state .state_box .state_top .next:before{content:"\ea6c"; font-family:'remixicon'; font-size: 23px;}
.content-flow .slick-arrow{display:flex;justify-content:center;align-items:center;position:absolute; top: 0px; width:72px; height:80px; margin-top:-15px; padding:0; border:none; border-radius: 0; outline:none; font-size:0; cursor:pointer;z-index:1;transition:all .20s ease}

.content-flow .slick-prev{background: linear-gradient(90deg, #fff, #fff,  #ffffff00);}
.content-flow .slick-next{background: linear-gradient(90deg, #ffffff00, #fff, #fff);  width:60px;}
.content-flow .slick-prev{left:-16px}
.content-flow .slick-next{right:-16px}
.content-flow .slick-prev:before,
.content-flow .slick-next:before{content:"\e93c"; color: #00000042; font-family:xeicon; font-size:26px; transition:all .20s ease}
.content-flow .slick-next:before{transform:rotate(-180deg)}
.content-flow .slick-prev:before{margin-right: 20px;}
.content-flow .slick-next:before{margin-left: 16px;}
.content-flow .slick-prev:hover:before,
.content-flow .slick-next:hover:before{color: #00000090;}
.listing-ty1 .listing-list > li:hover .content-flow .slick-prev,
.content-flow .slick-prev:hover{background: linear-gradient(90deg, #fbfbfb, #fbfbfb,  #fbfbfb00);}
.listing-ty1 .listing-list > li:hover .content-flow .slick-next,
.content-flow .slick-next:hover{background: linear-gradient(90deg, #fbfbfb00, #fbfbfb, #fbfbfb);}
.content-flow .slick-prev.slick-disabled{display:none !important}
.content-flow .slick-next.slick-disabled{display:none !important}



/* **************************************** *
*  SEARCH
* **************************************** */
/* 검색결과 탭은 임시로 안보이게 처리  */
.Tabs.search > ul{display:none}
.Tabs.search .af-tabs-content{padding:0; border-top:0}

.Tabs.fixed > ul{position:fixed;z-index:12; background:#fff; display:block; width:calc(100% - 408px); top:130px; border-bottom:1px solid #dcdfe2}
.Tabs.fixed > ul:before{position:absolute; content:""; width: 100vw; height:1px; background:#dcdfe2; display:none; top:54px}
.Tabs.fixed > .af-tabs-content{position:relative; top:40px; border:none;}
.Tabs.fixed > ul > li{padding-top: 25px;}
.Tabs.fixed > ul > li.mixitup-control-active{color:#111; border-bottom:4px solid #111}


.searchlist-group{margin-top:30px; padding:0 8px; display:inline-block; width:100%}
.searchlist-group:first-child{margin-top:0}

.searchlist-global{display:flex; flex-direction:column; padding:12px 20px; border:1px solid #ebebeb; border-radius:2px}
.searchlist-global .org{margin-top:2px}
.searchlist-global .org .txt,
.searchlist-global .chg .txt{color:#707070; font-size:13px; letter-spacing:-0.2}
.searchlist-global .org .txt strong{font-size:13px; font-weight:300; color:#0196fa}
.searchlist-global .chg .txt strong{font-size:13px; font-weight:300; color:#202020}
.searchlist-global .org .txt a,
.searchlist-global .chg .txt a{display:inline-block; font-size:13px; font-weight:300; color:#0196fa; text-decoration:underline; vertical-align:middle}

.searchlist-relation{display:flex; align-items:center; padding:12px 20px; border:1px solid #ebebeb; border-radius:2px}
.searchlist-relation .key-tit{display:inline-block; font-size:13px; font-weight:300; color:#202020}
.searchlist-relation .key-list{margin-left:15px}
.searchlist-relation .key-list:after{content:''; display:block; clear:both}
.searchlist-relation .key-list li{float:left; margin-left:2px}
.searchlist-relation .key-list li:first-child{margin-left:0}
.searchlist-relation .key-list li a{display:flex; align-items:center; height:27px; padding:4px 7px; background-color:#fff; border:1px solid #ebebeb; border-radius:2px; box-sizing:border-box; transition: all 0.3s}
.searchlist-relation .key-list li span{display:inline-block; margin-top:-2px; font-size:13px; font-weight:normal; color:#707070; letter-spacing:-0.2px; transition: all 0.3s}
.searchlist-relation .key-list li a:hover{border:1px solid #0196fa}
.searchlist-relation .key-list li a:hover span{color:#0196fa}

.searchlist-global + .searchlist-relation{margin-top:5px}

.searchlist-group .content-util{margin:15px 0px}
.searchlist-group .content-util .tag-list:after{content:''; display:block; clear:both}
.searchlist-group .content-util .tag-list li{float:left; margin-left:2px}
.searchlist-group .content-util .tag-list li:first-child{margin-left:0}
.searchlist-group .content-util .tag-list li a{display:flex; align-items:center; height:36px;  padding:0 12px; background-color:#fff; border:1px solid #ebebeb; border-radius:200px;  margin-right:4px; transition: all 0.3s}
.searchlist-group .content-util .tag-list li span{display:inline-block; font-size:15px; font-weight:normal; color:#555; letter-spacing:-0.2px; transition: all 0.3s}
.searchlist-group .content-util .tag-list li a:hover{border:1px solid #5629ee}
.searchlist-group .content-util .tag-list li a:hover span{color:#5629ee}


.searchlist-group .content-thum{position:relative; width:100%; display:flex; align-items: flex-start;}
.searchlist-group .thum_arrow{width:100%; position:absolute;left:-15px}
.searchlist-group .thum_arrow .Button{position:absolute; z-index:99; top:30px; border:none; background:rgba(0,0,0,.2); width:32px; height:32px; border-radius: 50%; padding:5px 4px;}
.searchlist-group .thum_arrow .Button:hover,
.searchlist-group .thum_arrow .Button:active,
.searchlist-group .thum_arrow .Button:focus,
.searchlist-group .thum_arrow .Button.af-hover,
.searchlist-group .thum_arrow .Button.Checked{border:none; background:rgba(0,0,0,.5); }

.searchlist-group .thum_arrow .Button i{color:#fff}
.searchlist-group .thum_arrow .Button:last-child{right:-25px}

.searchlist-group .content-thum .thum-wrap{display:flex; width:100%;  overflow:auto;}

.searchlist-group .content-thum .pedia-img{margin-right:8px; margin-top:8px;}

.searchlist-group .content-thum > .pedia-img .last {position:absolute; left:1; top:0; content:""; display:block; background:rgba(0,0,0,.5);  width:100%; height:100%}
.searchlist-group .content-thum > .pedia-img .count{position:absolute; width:100%; display:flex; justify-content:center; align-items: center; }
.searchlist-group .content-thum > .pedia-img .count i{color:#fff; z-index:2; font-size:16px; line-height: 6; }

.searchlist-group .content-thum > .pedia-img:first-child::after{display:none;}
.searchlist-group .biz-form.form-list{margin:0px; padding:0px}
.searchlist-group .biz-form.form-list .form-overlay .form-info .infoTxt01 p{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; width:100%; text-overflow:ellipsis; overflow:hidden; }

.searchlist-group .Groupbutton{display:flex; justify-content:center; margin: 16px 0px;}
.searchlist-group .biz-form.form-list .form-box-wrap .form-box{margin:10px;}

/* searchlist-depth1 */
.searchlist-depth1{position:relative}
.searchlist-depth1 .listing-list{border-top:1px solid #ebebeb; border-bottom:1px solid #ebebeb}
.searchlist-depth1 .listing-list:after{content:''; display:block; clear:both}
.searchlist-depth1 .listing-list > li{border-bottom:1px solid #ebebeb}
.searchlist-depth1 .listing-list > li:last-child{border-bottom:none}
.searchlist-depth1 .list-box{display:flex; align-items:flex-start; position:relative; min-height:157px; padding:25px 0; box-sizing:border-box}
.searchlist-depth1 .list-box .cover-ico{display:flex; align-items:center; justify-content:center;  width:24px; height:24px; min-width:24px; background-color:#f0f2f5; text-align:center; border-radius:2px}
.searchlist-depth1 .list-box .cover-ico.list{background-color:#0196fa}
.searchlist-depth1 .list-box .cover-ico.comment{background-color:#f47808}
.searchlist-depth1 .list-box .cover-ico.file{background-color:#08c564}
.searchlist-depth1 .list-box .cover-ico i{color:#fff; font-size:16px}
.searchlist-depth1 .list-box .content-inner{display:flex; flex-direction:column; flex:auto}
.searchlist-depth1 .list-box .cover-ico + .content-inner{margin-left:10px; padding-left:0}
.searchlist-depth1 .list-box .content-tit{position:relative}
.searchlist-depth1 .list-box .content-tit,
.searchlist-depth1 .list-box .content-util{display:flex; align-items:center}

.searchlist-depth1 .list-box .content-tit .tit-area{display:flex; align-items:center; margin-top:-2px}
.searchlist-depth1 .list-box .content-tit .tit-area .tit{font-size:16px; font-weight:300; color:#202020; letter-spacing:-0.5px; transition: all 0.3s}
.searchlist-depth1 .list-box .content-tit .tit-area .tit span{font-size:16px}
.searchlist-depth1 .list-box .content-tit .tit-area .ctit{position:relative; margin-right:8px; padding-right:8px; font-size:16px; font-weight:300; color:#707070; letter-spacing:-0.2px}
.searchlist-depth1 .list-box .content-tit .tit-area .ctit span{font-size:16px}
.searchlist-depth1 .list-box .content-tit .tit-area .ctit:after{content:''; position:absolute; top:50%; right:0; width:1px; height:12px; margin-top:-5px; background-color:#dadada}

.searchlist-depth1 .list-box .content-tit .tit-area .stit{margin-left:3px; font-size:14px; font-weight:normal; color:#707070; letter-spacing:-0.2px}
.searchlist-depth1 .list-box .content-tit .tit-area .stit span{font-size:14px}

.searchlist-depth1 .list-box .content-tit .down-area{position:absolute; right:0; top:0; display:flex; max-width:280px}
.searchlist-depth1 .list-box .content-tit .down-area .Button{display:flex; align-items:center}
.searchlist-depth1 .list-box .content-tit .down-area .Button img{margin-right:5px}
.searchlist-depth1 .list-box .content-tit .down-area span.tit{max-width:150px; margin-left:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.searchlist-depth1 .list-box .content-tit .down-area span.volume{font-size: 13px; color:#909090}

.searchlist-depth1 .list-box .content-tit .down-area .count{margin-left:8px; color:#5629ee}

.searchlist-depth1 .list-box .content-tit .down-area .down-list{position:absolute; z-index:11; border:1px solid #ebebeb; background:#fff;  right:0px; padding:8px; border-radius:8px; max-height: 240px;box-shadow:0 3px 6px 0 rgb(0 0 0 / 5%); overflow:hidden; overflow-y:scroll}
.searchlist-depth1 .list-box .content-tit .down-area .down-list .Button{margin-bottom:8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.searchlist-depth1 .list-box .content-tit .down-area .down-list .Button:last-child{margin-bottom:0}

.searchlist-depth1 .list-box .content-content{margin-top:8px; height:40px}
.searchlist-depth1 .list-box .content-content p{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; width:70%; min-height:46px; font-size:15px; font-weight:normal; color:#707070; letter-spacing:-0.2px; text-overflow:ellipsis; word-wrap:break-word;  overflow:hidden}
.searchlist-depth1 .list-box .content-content p span{font-size:15px}

.searchlist-depth1 .list-box .content-source{margin-top:5px}
.searchlist-depth1 .list-box .content-source .writer-area{font-size:13px; font-weight:normal; color:#505050; letter-spacing:-0.2px}
.searchlist-depth1 .list-box .content-source .writer-area .date{font-size:13px; color:#505050}

.searchlist-depth1 .list-box .content-util{margin-top:10px}
.searchlist-depth1 .list-box .content-util .tag-list:after{content:''; display:block; clear:both}
.searchlist-depth1 .list-box .content-util .tag-list li{float:left; margin-left:2px}
.searchlist-depth1 .list-box .content-util .tag-list li:first-child{margin-left:0}
.searchlist-depth1 .list-box .content-util .tag-list li a{display:flex; align-items:center; padding:4px 7px; background-color:#fff; border:1px solid #ebebeb; border-radius:2px; transition: all 0.3s}
.searchlist-depth1 .list-box .content-util .tag-list li span{display:inline-block; margin-top:-2px; font-size:13px; font-weight:normal; color:#707070; letter-spacing:-0.2px; transition: all 0.3s}
.searchlist-depth1 .list-box .content-util .tag-list li a:hover{border:1px solid #0196fa}
.searchlist-depth1 .list-box .content-util .tag-list li a:hover span{color:#0196fa}

.searchlist-depth1 .list-box .content-util .listing-more a{display:flex; align-items:center; transition: all 0.3s}
.searchlist-depth1 .list-box .content-util .listing-more a span{display:inline-block; font-size:13px; font-weight:normal; color:#0196fa; letter-spacing:-0.2px}

.searchlist-depth1 .no-data{position:relative; padding:35px 15px; text-align:center}
.searchlist-depth1 .no-data .info-message{display:inline-block; font-size:14px; font-weight:normal; color:#909090; letter-spacing:-0.2px}
.searchlist-depth1 .no-data .info-message i{margin-top:-4px; font-size:18px; vertical-align:middle}

.searchlist-depth1.dic .list-box{min-height:auto}
.searchlist-depth1.dic .list-box .content-tit .tit-area{flex-direction:column; align-items:flex-start}
.searchlist-depth1.dic .list-box .content-tit .tit-area .ctit{margin-right:0; padding-right:0; font-size:14px; font-weight:normal}
.searchlist-depth1.dic .list-box .content-tit .tit-area .ctit:after{display:none}
.searchlist-depth1.dic .list-box .content-tit .tit-area .stit{margin-left:0}
.searchlist-depth1.dic .list-box .content-tit .tit-area .tit{color:#0196fa}
.searchlist-depth1.dic .list-box .content-content{height:auto}
.searchlist-depth1.dic .list-box .content-content p{height:auto}

.searchlist-depth1.pedia .list-box .content-tit .tit-area .tit{margin-right:5px}
.searchlist-depth1.pedia .list-box .content-tit .tit-area .ctit{margin-right:5px; padding-right:0; font-size:14px; font-weight:normal}
.searchlist-depth1.pedia .list-box .content-tit .tit-area .ctit:after{display:none}
.searchlist-depth1.pedia .list-box .content-content{height:auto; display:flex; justify-content:space-between}
.searchlist-depth1.pedia .list-box .content-content p{height:auto}
.searchlist-depth1.pedia .list-box .content-source{margin-top:10px}
.searchlist-depth1.pedia .list-box .content-source .writer-area{color:#808080}


.searchlist-depth1.pedia .pedia-img{display:flex; align-items:center; justify-content:center; position:relative; width:132px; height:90px; border-radius:10px; overflow:hidden}
.searchlist-depth1.pedia .pedia-img::before {content:''; position:absolute; left:0; top:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08); border-radius:10px; z-index:10}
.searchlist-depth1.pedia .pedia-img img{max-width:100%; height:auto; vertical-align:middle; transition:all .20s ease}
.searchlist-depth1.pedia .pedia-img:hover img{-ms-transform: scale(1.05); -webkit-transform:scale(1.05); transform: scale(1.05)}

.searchlist-img {display:flex;}
.searchlist-img .content-inner{display:flex; margin-top:16px;flex-wrap:wrap; height:100%; flex:1 }
.content-inner.left{display:block; flex:none; width:700px; position:fixed; right:30px; top:176px; margin:0px; overflow:auto; background:#fff; height:calc(100% - 210px); border-radius:17px; box-shadow: 0 2px 8px 0 rgb(32 33 36 / 24%); margin: 0 16px 0 0; z-index: 12;}
.content-inner.left .ocr-button .Button{border-radius:100px; background:#f2edff; color:#5629ee; border:1px solid #f2edff; margin-right:3px}
.content-inner.left .ocr-button .Button.af-hover{border:1px solid #5629ee}
.content-inner.left .left-close .Button{position:absolute; top: 12px; left:8px}
.content-inner.left .left-close .Button i{position:fixed; color:#999}
.content-inner.left .stitArea{margin: 0 16px; width:640px; padding-top:18px}
.content-inner.left .stitArea .stit03{font-size:18px}
.content-inner.left .enlarge-wrap{ background:#fff; display:block; padding:16px; height:100%}
.content-inner.file-info .enlarge-wrap{ background:#fbfbfb; border-left:1px solid #ececec}
.content-inner.file-info .left-close .Button i{color:#c7c7c7}
.file-info.enlarge-wrap .content-enlarge{ border-bottom: 1px solid #e8e8e8;}
.file-info .enlarge-wrap .content-enlarge > .pedia-tit{color:#555;}
.file-info .enlarge-wrap .content-enlarge > .pedia-tit:first-child{margin-bottom:14px; padding-top:8px}
.file-info .enlarge-wrap .content-enlarge > .pedia-tit span{color:#555;  font-size: 12px;}
.file-info .enlarge-wrap .content-enlarge > .pedia-tit #pItemName{font-weight:lighter; font-size: 14px; margin-bottom:8px;}
.enlarge-wrap .content-enlarge {width:640px;  margin:0 auto; margin-top:16px; padding-bottom:18px; border-bottom: 1px solid #ddd}
.enlarge-wrap .content-enlarge .pedia-img{display:flex; position:relative; width:100%; height:auto; background:#f8f8f8; justify-content:center}
.enlarge-wrap .content-enlarge > .pedia-tit{display:flex; justify-content:space-between;align-items:center; font-size: 16px; width:100%; color:#333; margin:23px 0px 13px 0px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.enlarge-wrap .content-enlarge > .pedia-tit span{font-size:13px; color:#888}
.enlarge-wrap .content-enlarge > .pedia-tit span.tit{font-size:16px; color:#333; width:500px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.enlarge-wrap .content-enlarge > .pedia-txt{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; font-size: 13px; width:100%; color:#555;padding-right:4px; margin:0px 0px 15px 0px; text-overflow:ellipsis; overflow:hidden;}
.searchlist-img .content-img {margin:8px 6px}
.searchlist-img .content-img .pedia-tit{display:block; margin:0px 8px; width:220px;white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:#707070}
.searchlist-img .content-img .pedia-img{display:block; position:relative; width:220px; height:220px; overflow:hidden; margin:8px;}
.searchlist-img .content-img .pedia-img:before{content:''; position:absolute; left:0; top:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08); z-index:10}
.searchlist-img .content-img .pedia-img:hover{box-shadow:0 3px 6px 0 rgb(0 0 0 / 5%), 0 0 3px 0 rgb(0 0 0 / 10%)}
.searchlist-img .content-img .pedia-img img{width:100%; height:auto; vertical-align:middle; transition:all .20s ease}

.enlarge-wrap .content-relate{display:flex; flex-wrap:wrap;}
.enlarge-wrap .content-relate .content-img{flex:1 auto; max-width: 165px; cursor:pointer}
.enlarge-wrap .content-relate .pedia-img{width:190px; height:190px;}
.enlarge-wrap .content-relate .pedia-tit{width:190px; color:#fff}

.enlarge-wrap .content-img .pedia-tit{display:block; margin:0px 8px; width:220px;white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:#707070}
.enlarge-wrap .content-img .pedia-img{display:flex; align-items:center; justify-content:center; position:relative; width:auto; height:90px; overflow:hidden; margin:8px; border-radius:10px}
.enlarge-wrap .content-img .pedia-img:before{content:''; position:absolute; left:0; top:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08); border-radius: 10px; z-index:10}
.enlarge-wrap .content-img .pedia-img:hover{box-shadow:0 3px 6px 0 rgb(0 0 0 / 5%), 0 0 3px 0 rgb(0 0 0 / 10%)}
.enlarge-wrap .content-img .pedia-img img{max-width:100%; height:auto; vertical-align:middle; transition:all .20s ease}

.side-preview{position:relative}
.side-preview .content-inner.left{position:absolute; top:0px; right:0px; height:100%;}
.side-preview .fixCont3 .form-box ul li{text-align: left;}


/* **************************************** *
*  TRANSLATOR
* **************************************** */
.translator{display:flex; align-items:flex-start}
.translator .translator-cont1,
.translator .translator-cont2{flex:1 1 auto; width:50%}
.translator .translator-cont1{margin-right:2px}
.translator .translator-cont2{margin-left:2px}
.translator .translator-box{display:flex; flex-direction:column; position:relative; background:#fff; border:1px solid #ebebeb; overflow:auto; box-sizing:border-box; transition: all 0.2s}
.translator .translator-box:hover{border:1px solid #0196fa}

.translator .language-btn{display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #ebebeb}
.translator .language-btn .language{position:relative; height:45px; margin:0; padding:12px 20px; background:none; border:0; cursor:pointer; box-sizing:border-box}
.translator .language-btn .language span{font-family:'pps', 'ntskr', 'sans-serif' !important; font-size:16px; font-weight:300; letter-spacing:-0.8px; color:#202020; transition: all 0.3s}
.translator .language-btn .language:after{content:'\e942'; position:absolute; right:0; top:50%; margin-top:-11px; font-family:xeicon; font-size:20px; color:#909090}
.translator .language-btn .language:hover span{color:#0196fa}

.translator .language-btn .change{min-width:auto; width:auto; height:45px; padding:0 15px; background:none; border:none; text-align:center; border-radius:0; box-sizing:border-box}
.translator .language-btn .change [class^="xi-"],
.translator .language-btn .change [class*=" xi-"]{margin-top:-1px; font-size:24px; color:#909090; transition: all 0.3s}
.translator .language-btn .change:hover [class^="xi-"],
.translator .language-btn .change:hover [class*=" xi-"]{color:#0196fa}

.translator .translator-edit{padding:20px; padding-bottom:40px}
.translator .translator-edit .edit-inner{position:relative}
.translator .translator-edit .Textarea{resize:none; height:200px; border:none; font-size:16px; color:#202020}
.translator .translator-edit .Textarea::placeholder{font-family:'roboto', 'ntskr', 'sans-serif' !important; font-size:16px; font-weight:normal; color:#ababab}
.translator .translator-edit .txt-count{position:absolute; right:20px; bottom:20px; color:#bbb}


/* msetting  */
.msetBox{position:relative; margin-bottom:10px; border:1px solid #dadada}
.msetBox:last-child{margin-bottom:0}
.msetBox .msetTop{background:#f9fafc; padding:10px; border-bottom:1px solid #dadada}
.msetBox .msetTop .stitArea{margin-bottom:0}
.msetBox .msetBody{min-height:50px}
.msetBox .coverView{padding:5px}
.msetBox .coverView img{width:100%; height:auto}

.msetBox .portletSet:after{content:''; display:block; clear:both}
.msetBox .portletSet .SetBox{display:none; float:left; position:relative; height:80px; padding:10px; box-sizing:border-box}
.msetBox .portletSet .SetBox:after{content:''; position:absolute; right:0; top:0; width:1px; height:100%; background:#ebebeb}
.msetBox .portletSet.col1 .SetBox{width:100%}
.msetBox .portletSet.col1 .SetBox:nth-child(1){display:block; background:url("/static/fw/images/contents/portletset_num1.png") right bottom no-repeat}
.msetBox .portletSet.col1 .SetBox:nth-child(1):after{display:none}
.msetBox .portletSet.col2 .SetBox{width:50%}
.msetBox .portletSet.col2 .SetBox:nth-child(1){display:block; background:url("/static/fw/images/contents/portletset_num1.png") right bottom no-repeat}
.msetBox .portletSet.col2 .SetBox:nth-child(2){display:block; background:url("/static/fw/images/contents/portletset_num2.png") right bottom no-repeat}
.msetBox .portletSet.col2 .SetBox:nth-child(2):after{display:none}
.msetBox .portletSet.col3 .SetBox{width:33.333333%}
.msetBox .portletSet.col3 .SetBox:nth-child(1){display:block; background:url("/static/fw/images/contents/portletset_num1.png") right bottom no-repeat}
.msetBox .portletSet.col3 .SetBox:nth-child(2){display:block; background:url("/static/fw/images/contents/portletset_num2.png") right bottom no-repeat}
.msetBox .portletSet.col3 .SetBox:nth-child(3){display:block; background:url("/static/fw/images/contents/portletset_num3.png") right bottom no-repeat}
.msetBox .portletSet.col3 .SetBox:nth-child(3):after{display:none}
.msetBox .portletSet.colB .SetBox{width:100%}
.msetBox .portletSet.colB .SetBox:nth-child(1){display:block; background:url("/static/fw/images/contents/portletset_num1.png") right bottom no-repeat}
.msetBox .portletSet.colB .SetBox:nth-child(1):after{display:none}
.msetBox .portletSet.colB .SetBox{height:120px}
.fgc-page-container{width:100%; border:1px solid red !important}



/* **************************************** *
*  PROGRESS MESSAGE
* **************************************** */
.progress-message{display:none; align-items:center; justify-content:center; position:absolute; top:2px; right:0; bottom:2px; left:0; align-items:center; background-color:rgba(0,0,0,.6)}
.progress-message .message{font-size:14px; font-weight:normal; color:#fff; line-height:135%; letter-spacing:-0.2px}
.progress-message .message i{margin-top:-2px; font-size:22px; vertical-align:middle}
.progress-message.active{display:flex}


/* **************************************** *
*  NO-DATA
* **************************************** */
.nodata{display:flex; align-items:center; justify-content:center; min-height:50px}
.nodata .message{font-size:15px; font-weight:normal; color:#808080; line-height:135%; letter-spacing:-0.2px}
.nodata .message i{margin-top:-1px; font-size:20px; vertical-align:middle}
.nodata .message span{font-size:15px}


/* **************************************** *
*  BOARD - NOTICE
* **************************************** */
.board-view-top{position:relative;}
.board-view-top .tit-area{display:flex; align-items:flex-start; flex-direction:column; }
.board-view-top .tit-area .tit{line-height:150%; font-size:20px; color:#202020; font-weight:300; letter-spacing:-1px; vertical-align:middle; word-break:break-all; max-width:1000px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.board-view-top .meta-area{position:relative; padding-top:8px;}
.board-view-top .meta-info{display:flex; align-items:center; position:relative; padding:0 0 22px; overflow:hidden}
.board-view-top .meta-info li{line-height:135%; border-left:1px solid #ebebeb; padding:0px 8px}
.board-view-top .meta-info li span.tit{letter-spacing:-0.8px; font-size:13px; font-weight:normal; color:#808080; padding-right:8px;}
.board-view-top .meta-info li:first-child span.tit{border:0}
.board-view-top .meta-info li span.txt{letter-spacing:-1px; font-size: 13px; color:#808080}
.board-view-top .meta-info li:first-child{padding-left:0; border:0}
.board-view-bottom {margin:24px 0px;}
.board-view-bottom .util-area{ display:flex; justify-content:center;}
.board-view-bottom .util-list:after{content:''; display:block; clear:both}
.board-view-bottom .util-list > li{float:left; margin-left:10px}

.board-view-bottom .util-btn{display:flex; flex-direction:column; align-items:center; justify-content:center; margin:0; padding:0; background:none; border:0; cursor:pointer}
.board-view-bottom .util-btn .util-ico:hover{box-shadow: 0px 0px 10px rgb(86 41 238 / 20%);}
.board-view-bottom .util-btn .util-ico{display:flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius: 14px; padding-top:2px; background-color:#fff; box-sizing:border-box; box-shadow: -1px 0px 5px rgb(0 0 0 / 10%)}
.board-view-bottom .util-btn .util-ico i{font-size:22px; color:#999999}
.board-view-bottom .util-btn .util-ico:hover i{color:#5629ee}
.board-view-bottom .util-btn .util-ico .tit{margin-top:2px; line-height:135%; font-size:13px; font-weight:normal; color:#808080; letter-spacing:-0.8px}

.board-view-bottom .like.active .util-ico{background-color:#fff}
.board-view-bottom .like.active .util-ico i{color:#5629ee }

.board-view-bottom .post-share{position:relative}
.board-view-bottom .post-share .share-open{display:none; position:absolute; top:100%; right:0; z-index:8}
.board-view-bottom .post-share .share-open .share-list{margin-top:5px; background:#fff; padding:10px 16px; border-radius: 8px; box-shadow: -1px 0px 8px #00000129;}
.board-view-bottom .post-share .share-open .share-list > li > a{display:block; position:relative; padding:3px 0; line-height:155%; font-weight:normal; font-size:14px; letter-spacing:-0.8px; color:#202020; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; transition:all .30s ease}
.board-view-bottom .post-share .share-open .share-list > li > a:hover,
.board-view-bottom .post-share .share-open .share-list > li.active > a{color:#5629ee}
.board-view-bottom .post-share .share-open .share-list > li > a i{margin-top:-1px; margin-right:2px; font-size:20px; vertical-align:middle}
.board-view-bottom .post-share .share-open .share-list > li > a span{vertical-align:middle}

.board-view-contents{position:relative; margin-top:20px; margin-bottom: 16px; min-height:300px;}
.board-view-contents p{line-height:1.8; font-size:14px; letter-spacing:-0.5px; word-break:break-all}
.board-view-contents img{display:block; max-width:100%}

.board-view-contents.line{border:1px solid #e9e9e9; border-radius:8px; overflow:auto; margin-top:0}

.board-view-file{margin-top:20px; position:relative;}
.board-view-file .Fileupload.multi.down .preview-container{border:0px; overflow-y:auto;}
.board-view-file .Fileupload .multifile-text{font-size: 14px;}
.board-view-file .Fileupload .multifile-text > span{font-size: 13px;}


.board-view-discovery{display:flex; justify-content:space-between;  position:relative; padding-top:20px; border-top:1px solid #ebebeb}
.board-view-discovery > div{display:flex; align-items:center;}
.board-view-discovery .prev,
.board-view-discovery .next{display:flex; align-items: center; position:relative; box-sizing:border-box}
.board-view-discovery .prev:hover,
.board-view-discovery .next:hover{text-decoration:underline;}


.board-view-discovery > div a:first-child::after{content:""; width:1px; height:16px; background:#ebebeb; }
.board-view-discovery .tit{display:flex; justify-content:center; align-items:center; width:70px; height:32px; margin: 0px 5px; line-height:135%; font-size:13px; color:#202020; font-weight:normal; letter-spacing:-0.5px; }
.board-view-discovery .tit i{margin-right:2px; font-size:18px; color:#808080}

/* .board-view-discovery .subject{min-width:50%; width:100vh; line-height:135%; font-size:13px; color:#202020; font-weight:normal; letter-spacing:-0.8px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.board-view-discovery .no-contents{line-height:135%; font-size:13px; color:#808080; font-weight:normal}
.board-view-discovery a:hover .subject{color:#0196fa} */

.board-view-comment{position:relative; margin-top:40px}
.board-view-comment .comment-form{display:block; position:relative;}
.board-view-comment .comment-form textarea{display:block; width:calc(100% - 130px); height:44px; padding:10px 16px; border:1px solid #ddd; background:#fff; color:#202020; font-size:13px; border-radius:10px; resize:vertical; box-sizing:border-box; resize:none; outline:none}

.board-view-comment .comment-form .count-area{position:absolute; left:calc(100% - 200px); top:14px;}
.board-view-comment .comment-form .count-area:after{content:''; display:block; clear:both}
.board-view-comment .comment-form .count-area .counting{float:right; font-size:13px; color:#808080; letter-spacing:-0.8px; line-height:135%}
.board-view-comment .comment-form .count-area .counting span{color:#aaa; text-align: right;}
.board-view-comment .comment-form .confirm-area .confirm{position:absolute; top:-1px; right:-1px;}

.board-view-comment .comment-view{margin-top:15px}
.board-view-comment .comment-list{position:relative; padding:0 8px}
.board-view-comment .comment-list > ul > li{position:relative; padding:18px 0; }
.board-view-comment .comment-list > ul > li .comment-form{margin-top:20px}

.board-view-comment .comment-list .comment-box{position:relative}
.board-view-comment .comment-list .comment-box .re{position:absolute; left:0; top:21px; width:8px; height:8px}
.board-view-comment .comment-list .comment-box .re:before,
.board-view-comment .comment-list .comment-box .re:after{content:''; position:absolute; background:#909090}
.board-view-comment .comment-list .comment-box .re:before{left:0; top:0; width:1px; height:8px}
.board-view-comment .comment-list .comment-box .re:after{left:0; bottom:0; width:8px; height:1px}

.board-view-comment .comment-list .comment-box .comment-cont{position:relative; margin-top:8px; font-size:13px; color:#505050; line-height:160%; letter-spacing:-0.2px}

.board-view-comment .comment-list .comment-box .comment-info{display:flex; align-items:center}
.board-view-comment .comment-list .comment-box .comment-info:after {content:''; display:block; clear:both}
.board-view-comment .comment-list .comment-box .comment-info > li{position:relative; padding:0 8px}
.board-view-comment .comment-list .comment-box .comment-info > li:before{content:''; position:absolute; right:0; top:50%; width:1px; height:14px; margin-top:-7px; background-color:#dadada}
.board-view-comment .comment-list .comment-box .comment-info > li:last-child:before{display:none;}
.board-view-comment .comment-list .comment-box .comment-info > li.name{padding-left:0; color:#202020; font-weight:300}
.board-view-comment .comment-list .comment-box .comment-info > li.team{color:#909090}
.board-view-comment .comment-list .comment-box .comment-info > li.date{color:#909090}

.board-view-comment .comment-list .comment-box .comment-info > li.name,
.board-view-comment .comment-list .comment-box .comment-info > li.team,
.board-view-comment .comment-list .comment-box .comment-info > li.date{font-size:13px; line-height:155%; letter-spacing:-0.2px}

.board-view-comment .comment-list .comment-box .comment-info > li button{margin-top:-2px}

.board-view-comment .comment-list .comment-box .comment-info > li:last-child{border-right:none}
.board-view-comment .comment-list .comment-box.recomment{padding-left:15px; padding-top:18px}

.board-view-comment .paging-ty1{margin-bottom:15px}
.board-view-comment .comment-view .Tabs .af-tabs-content {border-bottom:1px solid #dadada;}

/* board-label */
.notice-label{display:block; text-align:center; vertical-align:middle; box-sizing:border-box}
.notice-cont-txt{display:inline-block; background:#5629ee; padding:4px 10px 3px; border-radius:1000px; color:#fff}


/* **************************************** *
*  SLICK CAROUSEL
* **************************************** */
.carousel-thum{margin:0 -10px}
.carousel-thum .carousel-box{display:flex; margin:0 10px; position:relative; padding:10px; border:1px solid #dadada; background-color:#fff; box-sizing:border-box; cursor:pointer}
.carousel-thum .cover-img{flex:1; position:relative}
.carousel-thum .cover-img:before{content:''; position:absolute; left:0; top:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08); z-index:10}
.carousel-thum .cover-img img{width:100%; height:80px; object-fit:cover}

.carousel-thum .info-overlay{display:none; align-items:center; position:absolute; left:10px; right:10px; bottom:10px; min-height:30px; padding:8px 10px; background-color:rgba(0,0,0,.75); box-sizing:border-box}
.carousel-thum .info-overlay p{color:#fff; font-size:11px; line-height:155%; letter-spacing:-0.2px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.carousel-thum .carousel-box:hover .info-overlay{display:flex}

.carousel-thum .slick-arrow{display:flex; justify-content:center; align-items:center; position:absolute; top:50%; width:38px; height:38px; margin-top:-15px; padding:0; border:none; border-radius:50%; outline:none; font-size:0; cursor:pointer; z-index:1; transition:all .20s ease}
.carousel-thum .slick-prev,
.carousel-thum .slick-next{background:rgba(0,0,0,.2)}
.carousel-thum .slick-prev{left:5px}
.carousel-thum .slick-next{right:0}
.carousel-thum .slick-prev:before,
.carousel-thum .slick-next:before{content:"\ea64"; color:rgba(255,255,255,.5); font-family:remixicon; font-size:24px; transition:all .20s ease}
.carousel-thum .slick-next:before{transform:rotate(-180deg)}
.carousel-thum .slick-prev:hover:before,
.carousel-thum .slick-next:hover:before{color:rgba(255,255,255,.8)}
.carousel-thum .slick-prev:hover,
.carousel-thum .slick-next:hover{background:rgba(0,0,0,.5)}
.carousel-thum .slick-prev.slick-disabled{display:none !important}
.carousel-thum .slick-next.slick-disabled{display:none !important}


/* **************************************** *
*  VIEWER
* **************************************** */
.viewer-img{display:flex; align-items:center; justify-content:center; height:100%; padding:10px; border:1px solid #dadada; overflow:auto; box-sizing:border-box}
.viewer-img-controll{display:flex; align-items:center; position:absolute; top:0; right:0; left:0; height:34px; padding:0 10px; background:rgba(0,0,0,.85); box-sizing:border-box}
.viewer-img-controll .controllL,
.viewer-img-controll .controllR{display:flex; align-items:center}
.viewer-img-controll .controllR{margin-left:auto}
.viewer-img-controll .Button.trans-btn{color:rgba(255,255,255,.7); font-size:13px}
.viewer-img-controll .Button.trans-btn{color:rgba(255,255,255,.7); font-size:13px}
.viewer-img-controll .Button.trans-btn:hover{color:rgba(255,255,255,1)}
.viewer-img img{max-width:100%; height:auto}

.viewer-img .stitArea{width: 100%; display: block; position:absolute; padding:0px 24px; margin-bottom: 50px !important;}
.viewer-img .stitArea .Groupbutton{display: flex; justify-content:space-between}

/* autodesk viewer */
.adsk-memo{position:absolute; top:15px; right:15px; bottom:100px; width:300px; background-color:rgba(34, 34, 34, 0.94); border-radius:5px; overflow:hidden; z-index:9999}
.adsk-memo .memo-wrap{display:flex; flex-direction:column; position:relative; height:100%}
.adsk-memo .memo-top{display:flex; align-items:center; height:44px; padding:0 20px; border-bottom:1px solid #000; box-sizing:border-box}
.adsk-memo .memo-top .tit{font-size:16px; font-weight:300; color:#fff; letter-spacing:-0.5px}
.adsk-memo .memo-top .close{display:flex; align-items:center; justify-content:center; position:relative; width:32px; height:32px; margin-left:auto; margin-right:-10px; background:none; border:0; color:#fff; font-size:16px; cursor:pointer}
.adsk-memo .memo-top .close:before{content:"\F05AD"; font-family:'Material Design Icons'}
.adsk-memo .memo-body{flex:1; overflow:hidden; overflow-y:auto}
.adsk-memo .memo-body .memo-list li{border-bottom:1px solid #000}
.adsk-memo .memo-body .memo-list li:last-child{border-bottom:none}
.adsk-memo .memo-body .memo-box{position:relative; padding:18px 30px}
.adsk-memo .memo-body .memo-box .tit-area .tit{display:block; line-height:145%; font-size:15px; font-weight:300; color:#fff}
.adsk-memo .memo-body .memo-box .cont-area{line-height:155%; color:#fff; font-size:14px; letter-spacing:-0.5px}
.adsk-memo .memo-body .memo-box .meta-area{display:flex; margin-top:3px}
.adsk-memo .memo-body .memo-box .meta-area .date,
.adsk-memo .memo-body .memo-box .meta-area .writer{font-size:13px; color:#999; letter-spacing:-0.2px}
.adsk-memo .memo-body .memo-box .meta-area .writer{margin-left:auto}
.adsk-memo .memo-foot{padding:15px; border-top:1px solid #000}
.adsk-memo .memo-foot .form-area{display:flex; align-items:center; flex-direction:column}
.adsk-memo .memo-foot .form-area textarea{width:100%; background:#000; color:#fff; font-size:14px; font-weight:normal; border-radius:5px 5px 0 0; border:0; resize:none}
.adsk-memo .memo-foot .form-area .input-btn{display:flex; align-items:center; justify-content:center; width:100%; height:44px; color:#fff; font-size:15px; font-weight:normal; letter-spacing:-0.5px; background:linear-gradient(45deg, #be52f2, #5629ee); border:0; border-radius:0 0 5px 5px; cursor:pointer; box-shadow:1px 5px 10px rgb(0 0 0 / 15%)}
.adsk-memo .memo-foot .form-area .input-btn i{margin-right:2px; font-size:15px}

.adsk-custom-btn{position:absolute; bottom:16px; right:15px; background-color:rgba(34, 34, 34, 0.94); border-radius:5px; box-shadow:1px 3px 10px 0 rgb(0 0 0 / 50%); z-index:9999}
.adsk-custom-btn .btn-wrap{display:flex; align-items:center; height:50px; padding:4px 0; box-sizing:border-box}
.adsk-custom-btn .btn-wrap .Button{position:relative; height:42px; margin:0 4px; padding:0 6px; line-height:normal; color:#f4f4f4; border:1px solid #2f2f2f; border-radius:4px; outline:none; background:none}
.adsk-custom-btn .btn-wrap .Button:hover{border:1px solid #00befd; color:#00befd}
.adsk-custom-btn .btn-wrap .Button .badge{position:absolute; right:-10px; top:-12px; padding:5px 7px 5px 6px}

.adsk-memo ::-webkit-scrollbar{width:8px; height:8px;}
.adsk-memo ::-webkit-scrollbar-corner{background:transparent}
.adsk-memo ::-webkit-scrollbar-track{
 background-color:#f2f2f2; background-image:-moz-linear-gradient(left, #000 0%, #000 100%);
 background-image: linear-gradient(to left, #000 0%, #000 100%);
 background-image: -webkit-linear-gradient(left, #000 0%, #000 100%);
 background-image: -o-linear-gradient(left, #000 0%, #000 100%);
 background-image: -ms-linear-gradient(left, #000 0%, #000 100%);
 border: 1px solid #000;}
.adsk-memo ::-webkit-scrollbar-thumb{background:#5629ee; border-radius:0}
.adsk-memo ::-webkit-scrollbar-thumb:hover{background:#5629ee}


/* **************************************** *
*  dashboard
* **************************************** */

.main-dashboard {display: flex; float: left; width: 100%; height: 100%;}
.main-dashboard .widget {background: #fff; border: 1px solid #d1d1d1; width: 100%; height: 334px; margin: 0 8px 8px 0;}
.main-dashboard .widget:hover {border-color: #5629ee;}
.main-dashboard .widget::before { position: absolute; content: ""; width: 0; height: 0; border-top: 14px solid #e6e9ee; border-right: 14px solid transparent; cursor: move;}
.main-dashboard .widget:hover::before{border-top: 14px solid #5629ee; border-right: 14px solid transparent;}

.main-dashboard .widget_header.Header{display: flex; align-items: center; padding: 0 20px 0 30px; height: 55px; font-size: 16px; color:#333; font-weight: 300; letter-spacing: -0.5px; margin: 0; margin-bottom: 15px; text-overflow:ellipsis; white-space:nowrap; background-color: #fafafa}
.main-dashboard .widget_header.Header span{overflow: hidden; white-space: nowrap; text-overflow: ellipsis; flex: 1; font-size: 16px !important}
.main-dashboard .widget_header.Header .widget_btn{margin-left:25px; margin-top:-2px}
.main-dashboard .widget_header.Header .widget_btn:after{content:''; display:block; clear:both}
.main-dashboard .widget_header.Header .chart-date-set{display:flex; position:absolute; right:16px; border-radius: 5px; background:#fff; box-shadow:0px 0px 10px #00000030; width:340px; padding:12px}
.main-dashboard .widget_header.Header .chart-date-set ul li{margin-left: 0; width:100%}
.main-dashboard .board-widget{display: flex;}
.main-dashboard .left-widget{display: flex; flex-direction: column; align-content: flex-start; width: calc(100% - 300px);}

.main-dashboard .left-widget .widget {width: 100%; display: flex; flex-direction:column}
.main-dashboard .right-widget {display: flex; align-content: flex-start; flex-direction: column; width: 300px;}
.main-dashboard .right-widget .widget {margin: 0 8px 8px 0; height: 220px;}
.main-dashboard .widget-select {background: #fff; border-radius: 15px; height: 100%; padding: 8px; width: 280px; margin-left: 15px;}
.main-dashboard .widget-select .stitArea{padding: 8px 4px; height: 72px; align-items:flex-end; margin-bottom:0px;}

.main-dashboard .widget-select ul .widget-select-wrap{background: #fff; border-radius: 8px; padding: 8px; margin-bottom: 16px;}
.main-dashboard .widget-select ul .widget-select-wrap .stit04{padding: 4px 0px;}
.main-dashboard .widget-select ul .widget-select-wrap  li > label{font-weight: 300;}
.main-dashboard .widget-select ul .widget-select-wrap label{position:relative; display:flex; align-items: center; padding: 6px 4px; background: #FFF; letter-spacing: -0.5px; height: 40px;}

.main-dashboard .widget-select .widget-select-wrap .widget-select-list > li label::before{position: absolute; content: '\e942'; font-family: xeicon; font-size: 20px; right: 8px; transition:all .30s ease; color: #e4e4e4;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list > li > label > a{padding-left: 8px;}

.main-dashboard .widget-select .widget-select-wrap .widget-select-list > li.active > label{background: #f9f7ff; border-radius: 4px;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list .select-item.active > label a{color: #5629ee;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list .select-item.active > label::before{color: #5629ee; transform:rotate(-180deg);}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list > li.active > ul{border-bottom:  solid #ebebeb; border-top: none;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul > li.active > ul{border-bottom: 1px solid #ebebeb; border-top: none; }
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul > li > ul { padding-bottom: 8px;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul > li > ul > li > label{height: 36px;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul > li > label > a{padding-left: 10px;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul > li > label.ImageCheckbox {margin-left: 10px;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list a{text-overflow: ellipsis; white-space:ap; overflow: hidden; width:170px;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list label.ImageCheckbox span{text-overflow: ellipsis; white-space:nowrap; overflow: hidden; width:160px;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul{border-top: 1px solid #f2f6fc;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li:last-child > ul{border-top: none;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul > li > ul > li > label.ImageCheckbox{margin-left: 18px; font-weight: 200;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul > li > ul > li > label > span{font-weight: normal;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li:last-child{border-bottom: none;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list li > ul > li > ul > li > label::before{display: none;}
.main-dashboard .widget-select .widget-select-wrap .widget-select-list .ImageCheckbox::before{ display: none;}

.main-dashboard .widget_btn li {float: left; margin-left: 12px;}
.main-dashboard .widget_btn li:first-child {margin-left:0;}

.main-dashboard .widget_btn li button {color: #999;}
.main-dashboard .widget_btn li button:hover {color: #333;}
.main-dashboard .widget_btn i{font-size: 20px;}
.widget_btn .Button {padding: 0;}

.widget .convert-loader{position:relative; margin-top:10vh}
.widget .convert-loader:before{content:''; position:absolute; top:50%; left:50%; width:40px; height:40px; margin-left:-20px; margin-top:-20px; border:4px solid #f9f9f9; border-top:4px solid #0196fa; border-radius:50%; animation:circle_spin 1s ease 0.2s infinite; box-sizing:border-box}
@keyframes circle_spin{0%{trans :rotate(0deg)} 100%{transform:rotate(360deg)}}


.widget .widget_calendar{width: 100%; padding: 16px; overflow: hidden;}

.main-dashboard #calendar-container{padding:15px}
.main-dashboard .dx-calendar-navigator .dx-button{border:none}
.main-dashboard .dx-calendar-navigator-previous-month.dx-button .dx-icon,
.main-dashboard .dx-calendar-navigator-previous-view.dx-button .dx-icon,
.main-dashboard .dx-calendar-navigator-previous-month.dx-button .dx-icon,
.main-dashboard .dx-calendar-navigator-next-month.dx-button .dx-icon,
.main-dashboard .dx-calendar-navigator-next-view.dx-button .dx-icon{color:#9b9b9b;}
.main-dashboard .dx-calendar-navigator .dx-calendar-caption-button.dx-button .dx-button-content{color:#5629ee; font-size: 16px;}
.main-dashboard .dx-button-text{font-size: 16px;}

.main-dashboard .dx-calendar-cell{color:#555; width:29px; height:29px}
.main-dashboard .dx-calendar-cell.dx-calendar-selected-date,
.main-dashboard .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today{color:#fff; box-shadow:inset 0 0 0 1000px #5629ee; border-radius:1000px}

.main-dashboard .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-contoured-date,
.main-dashboard .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today.dx-calendar-contoured-date{box-shadow:inset 0 0 0 1000px #5629ee}
.main-dashboard .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-contoured-date:hover,
.main-dashboard .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today.dx-calendar-contoured-date:hover{color:#fff}

.main-dashboard .dx-calendar-cell.dx-state-hover {-webkit-box-shadow: inset 0 -1px 0 1000px #fff; color:#8764ff}
.main-dashboard .dx-button-mode-contained.dx-state-hover{background:none;}

.main-dashboard .dx-calendar-cell.dx-calendar-empty-cell:not(.dx-calendar-selected-date),
.main-dashboard .dx-calendar-cell.dx-calendar-empty-cell:not(.dx-calendar-selected-date).dx-state-active,
.main-dashboard .dx-calendar-cell.dx-calendar-empty-cell:not(.dx-calendar-selected-date).dx-state-hover,
.main-dashboard .dx-calendar-cell.dx-calendar-other-view:not(.dx-calendar-selected-date),
.main-dashboard .dx-calendar-cell.dx-calendar-other-view:not(.dx-calendar-selected-date).dx-state-active,
.main-dashboard .dx-calendar-cell.dx-calendar-other-view:not(.dx-calendar-selected-date).dx-state-hover{color:#aaa}

.main-dashboard .dx-calendar-body{left:15px; right:15px}
.main-dashboard .dx-calendar-body thead tr{height:35px}
.main-dashboard .dx-calendar-body table th{font-size:14px}
.main-dashboard .dx-calendar-body thead tr th{color:#333}

.main-dashboard .bxslider{display:flex; align-items:center;}
.main-dashboard .bx-wrapper img{padding:8px 24px;}

.widget .widget_header.Header .calendar_tit{display: flex;align-items:center;}
.widget .calendar_tit .year_mon{font-size: 17px;  margin: 0 16px;}
.widget .calendar_tit i{font-size: 14px; color: #909090;}

.widget .widget_calendar #calendar th{text-align: center; font-weight: 600; height: 30px;}
.widget .widget_calendar #calendar .date{position: relative; text-align: center; height: 36px;width: 36px; cursor: pointer; z-index: 1;}
.widget .widget_calendar #calendar .sunday{color:#f53d3d;}
.widget .widget_calendar #calendar .colToday{color: #fff; font-weight: 600;}
.widget .widget_calendar #calendar .colToday::before{position: absolute; content:""; display: inline-block; border-radius: 50%; background-color:#5629ee ; width: 36px; height: 36px; left: 0; top: 0; z-index:-1; }


.biz-counter{ display: flex; justify-content:center; padding: 0 16px; align-items:flex-start}
.biz-counter .counter{ display: flex; flex-direction: column; justify-content:center; align-items: center; padding: 0px 16px;}
.biz-counter .counter .count{ font-size: 16px; font-weight: bold; color: #5629ee; margin-bottom: 8px;}
.biz-counter .counter i{ padding: 4px; font-size: 32px; }

.biz-counter.todo{ margin-top:32px;}

.biz-link .link-item{ padding: 8px 20px 8px 16px; display: flex; flex-direction:column; cursor:pointer;}
.biz-link .link-item:hover{ text-decoration:underline;}
.biz-link .link-item .link-tit i{ font-size: 17px; margin-right: 8px; color: #808080;}

.main-dashboard .post-wrap{ height:100%; overflow-y: scroll; -ms-overflow-style:none;}
.main-dashboard .post-wrap::-webkit-scrollbar{ display: none;}
.main-dashboard .left-widget .post-wrap{height:calc(100% - 84px); overflow-y:auto}
.main-dashboard .left-widget .post-wrap::-webkit-scrollbar{ display:initial}
.main-dashboard .post-item{ padding:10px 30px 10px 30px; display: flex; justify-content:space-between; align-items: center; cursor:pointer; border-left:4px solid rgb(0,0,0,0) }
.main-dashboard .post-item:hover,
.main-dashboard .post-item:active{background:#f8f8f8}
.main-dashboard .post-item > span{font-size: 15px; letter-spacing: -0.5px; color: #555;}
.main-dashboard .post-tit{display:flex; align-items:center; font-size: 15px; letter-spacing: -0.5px; color: #555;}
.main-dashboard .post-tit > span{display:inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.main-dashboard .post-tit > span.category{font-weight: 300; font-size: 13px; color:#5629ee; margin-right: 6px; flex:none; display:inline-block; width:initial}
.main-dashboard .post-tit img{width:20px !important;}
.main-dashboard .post-tit i{ position: relative; top: 2px; font-size: 18px; margin-right: 8px; color: #808080;}
.main-dashboard .post-tit .Label-color{flex:none}
.main-dashboard .post-item .badge-color{min-width: 24px; margin:0px 8px; height:18px; line-height:1.2; padding:0px; line-height:normal}
.main-dashboard .post-item .badge-color .cont-txt{font-size: 13px; letter-spacing: -0.8px}
.main-dashboard .post-date{color: #aaa; width: 100px; text-align: right; min-width: 100px; font-size: 15px; letter-spacing: -0.5px}
.main-dashboard .post-item .account{color: #aaa; width: 100px; text-align: right; min-width: 100px; font-size: 15px; letter-spacing: -0.5px}
.main-dashboard .post-tit .bookmark:before{content:"\f18b";font-family: "remixicon"; font-size: 17px; color:#ccc; margin-right: 8px;}
.main-dashboard .post-tit .bookmark.active:before{content:"\f186"; color:#FFA000}


.left-widget .grid-stack-item-content:after{position:absolute; display: block; content: ""; width: 100%; height: 10px; background:#fff; bottom: 0;}

.grid-stack > .grid-stack-item > .grid-stack-item-content{border:1px solid rgba(255,255,255,0); box-shadow:4px 4px 10px 0 rgb(0 0 0 / 6%); border-radius:15px}
.grid-stack > .grid-stack-item > .grid-stack-item-content:hover{border:1px solid #ebebeb}
.grid-stack > .grid-stack-item > .grid-stack-item-content:hover:before{display:none}
.grid-stack > .grid-stack-item > .ui-resizable-se{right:20px !important; bottom:20px !important; width:34px !important; height:34px !important; line-height:34px; background:none !important; background-color:rgba(255,255,255,1) !important; text-align:center; border-radius:50%; box-shadow:1px 5px 10px rgb(0 0 0 / 10%)}
.grid-stack > .grid-stack-item > .ui-resizable-se:after{content:"\e90f";  font-family:'xeicon'; font-size: 18px; color: #666}

#divWidgetArea .widget-set{position:absolute; top:20px; right:74px; display:flex; align-items:center; cursor:pointer}
#divWidgetArea .widget-set i{font-size: 15px; margin-right:4px; color:#999}
#divWidgetArea .widget-set span{font-size:14px; color:#666; letter-spacing: -1px;}
#divWidgetArea .widget-set:hover i,
#divWidgetArea .widget-set:hover span{color:#5629ee}



/* daniel Diagram Custom css */

.Diagram_header {display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;}
.Diagram_header .Diagram_header_left > h4 {font-size:17px; font-weight:600;}
.Diagram_header .Diagram_header_center > button {outline:0;}
.Diagram_header .Diagram_header_right .help_box {display:flex; justify-content:center; align-items:center; text-align:center; padding-top:3px;}
.Diagram_header .Diagram_header_right .help_box > button {margin-right:7px; outline:0;}
.Diagram_header .Diagram_header_right .help_box > button > span {color:#505050; font-weight:normal;}

.Diagram_main {box-sizing:border-box; height:calc(100% - 120px); position:relative; overflow:hidden;  border:1px solid #e0e0e0;}
.layerpop-box .Diagram_main{min-height:700px; justify-content:center; }
.Diagram_main_container .container_main {position:absolute; display:flex; justify-content:space-between; width:100%; height:100%;}
.Diagram_main_container .container_main .container_main_left {width:300px; min-width:300px; background-color:#f8f8f8; border-right:1px solid #e0e0e0; height:100%; overflow:auto;}
.Diagram_main_container .container_main .container_main_left_inner {height:100vh;}
.Diagram_main_container .container_main .container_main_left_inner .shape_box {padding:15px;}
.Diagram_main_container .container_main .container_main_left_inner .shape_box > ul {display:flex; flex-direction: column; flex-wrap:wrap; align-items:center; justify-content:center;}
.Diagram_main_container .container_main .container_main_left_inner .shape_box > ul li { margin-right:10px; margin-left:10px; width:180px; height:100px; display:flex; justify-content:center; align-items:center;}
.Diagram_main_container .container_main .container_main_left_inner .button_box {position:relative; display:flex; justify-content:center; align-items:center; cursor:pointer; word-break:break-all; text-align:center;}
.Diagram_main_container .container_main .container_main_left_inner .button_box > p, .button {position:absolute;}
.Diagram_main_container .container_main .container_main_left_inner .button_box > p {width:80px; height:60px; display:flex; align-items:center; justify-content:center; word-break:break-all; text-align:center;}
.Diagram_main_container .container_main .container_main_left_inner .button {border:none; display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
.Diagram_main_container .container_main .container_main_left_inner .button_1 {width:100px; height:60px; background-color:#8067c1;}
.Diagram_main_container .container_main .container_main_left_inner .button_2 {width:80px; height:80px; background-color:#71ea94; border-radius:50%;}
.Diagram_main_container .container_main .container_main_left_inner .button_3 {width:100px; height:60px; background-color:#36a2ea; border-radius:30px;}
.Diagram_main_container .container_main .container_main_left_inner .button_4 {width:78px; height:60px; transform:skew(20deg); background:#ff88ae;}
.Diagram_main_container .container_main .container_main_left_inner .button_5 {width:60px;height:60px; background-color:#8067c1;}
.Diagram_main_container .container_main .container_main_left_inner .button_6 {width:0; height:0; border-top:60px solid #71ea94; border-right:60px solid transparent;}
.Diagram_main_container .container_main .container_main_left_inner .button_7 {width:0; height:0; border:40px solid transparent; border-bottom-color:#36a2ea; position:relative; top:-40px;}
.Diagram_main_container .container_main .container_main_left_inner .button_7:after { content:''; position:absolute; left:-40px; top:40px; width:0; height:0; border:40px solid transparent; border-top-color:#36a2ea;}
.Diagram_main_container .container_main .container_main_left_inner .button_8 {width:0; height:0; border-top:60px solid #ff88ae; border-left:60px solid transparent;}

.Diagram_main_container .container_main .container_main_center{width:calc(100% - 300px); height:100%; overflow:auto; flex:1;}
.Diagram_main_container .container_main_center .inner_buttonBox{display:flex; flex-direction:column; justify-content:flex-end; align-items:center; height: 126px; }
.Diagram_main_container .container_main_center .inner_buttonBox:last-child .next{display: none;}
.Diagram_main_container .container_main_center .inner_buttonBox button{display: none;}
.Diagram_main_container .container_main_center .inner_buttonBox:hover button{display: block;}
.Diagram_main_container .container_main_center .inner_buttonBox .buttonBox_toolbox {position: relative; left:160px; top: 50%; width:100px; height:40px; box-shadow:0 1px 5px 0 rgb(0,0,0, 30%), 0 2px 4px 0 rgb(0,0,0,4%); justify-content:space-around; align-items:center; margin-bottom:15px; border-radius:3px; border:none; background-color:#fff;}
.Diagram_main_container .container_main_center .inner_buttonBox .buttonBox_toolbox i{cursor:pointer; font-size:24px;}
.Diagram_main_container .container_main_center .button{width:80px; height:80px; background-color:#71ea94; border-radius:50%; cursor:pointer; border:none; position:relative; display:flex; justify-content:center; align-items:center; word-break:break-all; text-align:center;}
.Diagram_main_container .container_main_center .button_rectangle {width:100px; height:60px; background-color:#8067c1; cursor:pointer; border:none; position:relative; display:flex; justify-content:center; align-items:center;}

.Diagram_footer {display:flex; justify-content:center; margin-top:30px;}
.Diagram_footer button:first-child {margin-right:2px; outline:0;}
.Diagram_footer button:last-child {margin-left:2px; outline:0;}
.Diagram_footer button:last-child i{padding-top:2px;}
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9 .next{position:absolute; top:80%; width:26px; height:26px; background-color:#fff; border:2px solid #909090; border-radius:50%; color:#909090; box-sizing:border-box;}
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9 .next i{line-height:24px; font-size:20px}
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9.active .next{ border:2px solid #0196fa; color:#0196fa; z-index:1}
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9.active .next{
 -webkit-animation: diagram_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s  forwards;
 -moz-animation: diagram_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s  forwards;
 -o-animation: diagram_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s  forwards;
 animation: diagram_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s  forwards;
}
@-webkit-keyframes diagram_next{0%{margin-top:-10px; opacity:0;} 100%{margin-top:48px; opacity:1}}
@-moz-keyframes diagram_next{0%{margin-top:-10px; opacity:0;} 100%{margin-top:32px; opacity:1}}
@-o-keyframes diagram_next{0%{margin-top:-10px; opacity:0;} 100%{margin-top:32px; opacity:1}}
@keyframes diagram_next{0%{margin-top:-10px; opacity:0;} 100%{margin-top:32px; opacity:1}}

.Diagram_main_container .container_main .container_main_left_inner .button_box .button_9,
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9{width:240px; min-height:60px; background:#fff; border:1px solid #ebebeb; border-radius: 50px;  cursor:pointer; position:relative; display:flex; justify-content:center; align-items:center; word-break:break-all; text-align:center; color: #505050; }
.Diagram_main_container .container_main .container_main_left_inner .button_box .button_9 p{font-size: 14px; width:100px; padding-right:16px;}
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9 p{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 14px; padding-right: 16px; text-overflow:ellipsis; overflow:hidden;  width:160px; word-break:keep-all;} 
.Diagram_main_container .container_main .container_main_left_inner .button_box.active .button_9,
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9.active{font-weight: bold;}
.Diagram_main_container .container_main .container_main_left_inner .button_box.active .button_9,
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9.active{background: #0196fa; color:#fff; border:1px solid #0196fa;}
.Diagram_main_container .container_main .container_main_center .inner_buttonBox .button_9.color1{background:#f3f8ff; border: 1px solid rgba(1, 150, 250, .2);}
.Diagram_main_container .container_main .container_main_left_inner .state_icon{left: 24px;}
.Diagram_main_container .container_main .state_icon{content: ""; width: 30px; height:30px;  background-size: contain; background-repeat:no-repeat; background-position: center; margin-right: 16px;}
.Diagram_main_container .container_main .button_box.active .state_start{background-image:red;}

.Diagram_main_container .container_main .button_box.active .state_start,
.Diagram_main_container .container_main_center .button_9.color18 .state_start,
.Diagram_main_container .container_main_center .button_9.active .state_start,
.Diagram_view .container_main .button_9 .state_start {background-image: url("/static/fw/images/contents/diagram_start_active.png")}

.Diagram_main_container .container_main .button_9 .state_start,
.Diagram_view .container_main .button_9.color01 .state_start {background-image: url("/static/fw/images/contents/diagram_start.png")}

.Diagram_main_container .container_main .button_box.active .state_end,
.Diagram_main_container .container_main_center .button_9.color18 .state_end,
.Diagram_main_container .container_main_center .button_9.active .state_end,
.Diagram_view .container_main .button_9 .state_end {background-image: url("/static/fw/images/contents/diagram_end_active.png")}

.Diagram_main_container .container_main .button_9 .state_end,
.Diagram_view .container_main .button_9.color01 .state_end {background-image: url("/static/fw/images/contents/diagram_end.png")}

.Diagram_main_container .container_main .button_box.active .state_work,
.Diagram_main_container .container_main_center .button_9.color18 .state_work,
.Diagram_main_container .container_main_center .button_9.active .state_work,
.Diagram_view .container_main .button_9 .state_work {background-image: url("/static/fw/images/contents/diagram_work_active.png")}

.Diagram_main_container .container_main .button_9 .state_work,
.Diagram_view .container_main .button_9.color01 .state_work {background-image: url("/static/fw/images/contents/diagram_work.png")}

.Diagram_main_container .container_main .button_box.active .state_approval,
.Diagram_main_container .container_main_center .button_9.color18 .state_approval,
.Diagram_main_container .container_main_center .button_9.active .state_approval,
.Diagram_view .container_main .button_9 .state_approval {background-image: url("/static/fw/images/contents/diagram_approval_active.png")}

.Diagram_main_container .container_main .button_9 .state_approval,
.Diagram_view .container_main .button_9.color01 .state_approval {background-image: url("/static/fw/images/contents/diagram_approval.png")}

.Diagram_main_container .container_main .button_box.active .state_receipt,
.Diagram_main_container .container_main_center .button_9.color18 .state_receipt,
.Diagram_main_container .container_main_center .button_9.active .state_receipt,

.Diagram_view .container_main .button_9 .state_receipt {background-image: url("/static/fw/images/contents/diagram_receipt_active.png")}

.Diagram_main_container .container_main .button_9 .state_receipt,
.Diagram_view .container_main .button_9.color01 .state_receipt {background-image: url("/static/fw/images/contents/diagram_receipt.png")}

.Diagram_main_container .container_main .button_box.active .state_report,
.Diagram_main_container .container_main_center .button_9.color18 .state_report,
.Diagram_main_container .container_main_center .button_9.active .state_report,
.Diagram_view .container_main .button_9 .state_report {background-image: url("/static/fw/images/contents/diagram_report_active.png")}

.Diagram_main_container .container_main .button_9 .state_report,
.Diagram_view .container_main .button_9.color01 .state_report {background-image: url("/static/fw/images/contents/diagram_report.png")}


.Diagram_main_container .container_main .button_box.active .state_alarm,
.Diagram_main_container .container_main_center .button_9.color18 .state_alarm,
.Diagram_main_container .container_main_center .button_9.active .state_alarm,
.Diagram_view .container_main .button_9 .state_alarm {background-image: url("/static/fw/images/contents/diagram_alarm_active.png")}

.Diagram_main_container .container_main .button_9 .state_alarm,
.Diagram_view .container_main .button_9.color01 .state_alarm {background-image: url("/static/fw/images/contents/diagram_alarm.png")}

.Diagram_main_container .container_main .button_box.active .state_delivery,
.Diagram_main_container .container_main_center .button_9.color18 .state_delivery,
.Diagram_main_container .container_main_center .button_9.active .state_delivery,
.Diagram_view .container_main .button_9 .state_delivery{background-image: url("/static/fw/images/contents/diagram_delivery_active.png")}

.Diagram_main_container .container_main .button_9 .state_delivery,
.Diagram_view .container_main .button_9.color01 .state_delivery {background-image: url("/static/fw/images/contents/diagram_delivery.png")}

.Diagram_main_container .container_main .button_box.active .state_review,
.Diagram_main_container .container_main_center .button_9.color18 .state_review,
.Diagram_main_container .container_main_center .button_9.active .state_review,
.Diagram_view .container_main .button_9 .state_review {background-image: url("/static/fw/images/contents/diagram_review_active.png")}

.Diagram_main_container .container_main .button_9 .state_review,
.Diagram_view .container_main .button_9.color01 .state_review {background-image: url("/static/fw/images/contents/diagram_review.png")}


/* Diagram view Custom css */


.Diagram_view {box-sizing:border-box; position:relative; overflow:hidden;  border:1px solid #e0e0e0; height:400px; min-width: 100%;}
.Diagram_view .container_main {display:flex;  flex-wrap: wrap; align-content:flex-start; justify-content:flex-start; width:1000px; height:100%; margin: 0 auto;}
.Diagram_view .container_main .inner_buttonBox {display:flex; flex-direction:column; justify-content:flex-end; align-items:center; width: 24%; height: 100px;}
.Diagram_view .container_main .inner_buttonBox:last-child .next{display: none;}
.Diagram_view .container_main .inner_buttonBox .button_9 .next{position:absolute;  right:-25%; width:26px; height:26px;  background-color:#fff;  border:2px solid #d3d3d3;  border-radius:50%;  color:#d3d3d3;  box-sizing:border-box; padding-left:1px}
.Diagram_view .container_main .inner_buttonBox .button_9 .next i{line-height:23px; font-size:20px}
.Diagram_view .container_main .inner_buttonBox .button_9.active .next{ border:2px solid #5629ee; color:#5629ee; z-index:1}
.Diagram_view .container_main .inner_buttonBox .button_9.active .next{
 -webkit-animation: view_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s forwards;
 -moz-animation: view_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s forwards;
 -o-animation: view_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s forwards;
 animation: view_next 1.8s cubic-bezier(0.7, 0, 0.3, 1) 1s forwards;}
@-webkit-keyframes view_next{0%{margin-right:25%; opacity:0;} 100%{margin-right:-1px; opacity:1}}
@-moz-keyframes view_next{0%{margin-right:25%; opacity:0;} 100%{margin-right:-1px; opacity:1}}
@-o-keyframes view_next{0%{margin-right:25%; opacity:0;} 100%{margin-right:-1px; opacity:1}}
@keyframes view_next{0%{margin-right:25%; opacity:0;} 100%{margin-right:-1px; opacity:1}}

.Diagram_view .container_main .inner_buttonBox .button_9{width:180px; height:60px; border:1px solid #ebebeb; border-radius: 50px;  cursor:pointer; position:relative; display:flex; justify-content:center; align-items:center; word-break:break-all; text-align:center;  color: #fff; font-weight: bold;}
.Diagram_view .container_main .inner_buttonBox .button_9.color01{color: #505050; font-weight: normal;}
.Diagram_view .container_main .inner_buttonBox .button_9.color01{background:#f9f9f9; border-color:#ebebeb;}
.Diagram_view .container_main .inner_buttonBox .button_9.color02{background: #5629ee;  border:1px solid #5629ee;}
.Diagram_view .container_main .inner_buttonBox .button_9.color03{background: #7ebe4a; border:1px solid #7ebe4a;}
.Diagram_view .container_main .inner_buttonBox .button_9.color04{background:#df4444; border:1px solid #df4444;}
.Diagram_view .container_main .inner_buttonBox .button_9 p{font-size: 14px; padding-left: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; width: 100px;} 

.Diagram_view .container_main .state_icon{content: ""; width: 30px; height:30px;  background-size: contain; background-repeat:no-repeat; background-position: center;  padding:0px 8px; left:24px;}

.docpilot-container.chart{position: relative;width: 100%; justify-content:flex-start}
.docpilot-container.chart .docpilot-step{margin-left: 200px;}
.master-toolbar.chart{position:absolute; left:200px; top:0; transition: all 0.3s; z-index:1}
.master-toolbar.chart .master-toolbar-inner{position:absolute; left:-200px; top:0; width:200px; background-color:#f0f2f5; border:1px solid #c8c8c8; transition: all 0.3s}
.master-toolbar.chart .collapse .master-toolbar-inner{left:0}

.master-toolbar.chart .Tabs > ul > li,
.master-toolbar.chart .Tabs .Scroller ul > li{height:36px; padding:9px 0; background:#979aa6; color:rgba(255, 255, 255, .8); font-family:'welcome' !important; font-size:14px; font-weight:300; letter-spacing:-0.8px; border-radius:0; box-sizing:border-box}
.master-toolbar.chart .Tabs > ul{width:100%}
.master-toolbar.chart .Tabs > ul > li:first-child,
.master-toolbar.chart .Tabs .Scroller > ul > li:first-child{border:none}
.master-toolbar.chart .Tabs > ul > li.Selected,
.master-toolbar.chart .Tabs .Scroller > ul > li.Selected{border:none}
.master-toolbar.chart .Tabs > ul > li,
.master-toolbar.chart .Tabs > .Scroller > ul > li{border:0}
.master-toolbar.chart .Tabs > ul > li:hover,
.master-toolbar.chart .Tabs .Scroller > ul > li:hover,
.master-toolbar.chart .Tabs > ul > li:active,
.master-toolbar.chart .Tabs .Scroller > ul > li:active{background:#979aa6; border-top:none; border-right:none; border-left:none; font-weight:300; color:rgba(255, 255, 255, 1)}
.master-toolbar.chart .Tabs > ul > li.Selected,
.master-toolbar.chart .Tabs .Scroller > ul > li.Selected{background:#f0f2f5; border-top:none; border-right:none; border-left:none; font-weight:300; color:#4a4e5e}
.master-toolbar.chart .Tabs > ul > li.Selected:before,
.master-toolbar.chart .Tabs .Scroller ul > li.Selected:before{display:none}
.master-toolbar.chart .Tabs > ul > li.Selected:after,
.master-toolbar.chart .Tabs .Scroller ul > li.Selected:after{background:#fff}
.master-toolbar.chart .Tabs > ul > li:before, .Tabs > ul > li:after{display:none}
.master-toolbar.chart .Tabs .af-tabs-content{padding-top:10px}

.master-toolbar.chart .tag-inner{padding:10px}
.master-toolbar.chart .tag-write{margin-bottom:10px}
.master-toolbar.chart .tag-list:after{content:''; display:block; clear:both}
.master-toolbar.chart .tag-list > li{float:left; margin-right:2px; margin-bottom:2px}
.master-toolbar.chart .tag-list > li .tag-box{position:relative; height:27px; padding:3px 25px 0 8px; background-color:#f3f8ff; border:1px solid; border:1px solid #5629ee; box-sizing:border-box}
.master-toolbar.chart .tag-list > li .tag-box span{font-size:12px; font-weight:normal; letter-spacing:-0.2px; color:#505050}
.master-toolbar.chart .tag-list > li .tag-box .del{position:absolute; right:0; top:0; width:20px; height:25px; padding:0; line-height:25px; background:none; font-size:18px; color:#808080; text-align:center; border:0; cursor:pointer}
.master-toolbar.chart .tag-list > li .tag-box .del:before{content:"\e922"; font-family:'xeicon'}

.master-toolbar.chart .tool-inner {padding-bottom: 10px; padding-top: 16px;}
.master-toolbar.chart .tool-list{margin-top: 16px; border-top: 1px solid #d4d4d4;} 
.master-toolbar.chart .tool-list>li button {display: flex; align-items: center; width: 100%; margin: 0; padding: 10px; background: none; font-size: 13px; letter-spacing: -0.2px; border-bottom: 1px solid #d4d4d4; cursor: pointer; box-sizing: border-box; transition: all 0.3s}
.master-toolbar.chart .tool-list .tool-sub button{background:#fbfcfe;}
.master-toolbar.chart .tool-list .tool-sub button i{font-size: 20px;}
.master-toolbar.chart .tool-list>li button svg {width: 24px; height: 24px}
.master-toolbar.chart .tool-list>li button span {margin-left: 5px; color: #505050}
.master-toolbar.chart .tool-list>li button:hover span {color: #202020}
.master-toolbar.chart .tool-list>li button:hover {background-color: #fff}
.master-toolbar.chart .searchkey{display: flex; flex: 1 1 auto;justify-content:center}
.master-toolbar.chart .tool-list > li{position: relative;}
.master-toolbar.chart .tool-list > li button::before{content:'\e942'; position: absolute; right: 10px; top: 21px; margin-top: -9px; font-family: xeicon; font-size: 20px; color: #505050; transition: all .30s ease; transform:rotate(-180deg);}

.main-dashboard .widget-calendar .detail-wrap{border-top:1px solid #eee; width:100%;}
.main-dashboard .widget-calendar .detail-wrap .detail{letter-spacing: -0.5px; display:flex; height:82px; align-items:center; border-bottom: 1px solid #eee;}
.main-dashboard .widget-calendar .detail-wrap  li:nth-child(1).detail{height:200px;}
.main-dashboard .widget-calendar .detail-wrap  li:nth-child(1).detail .detail-info{max-height:200px;}
.main-dashboard .widget-calendar .detail-wrap  li:nth-child(2).detail{height:200px}
.main-dashboard .widget-calendar .detail-wrap  li:nth-child(2).detail .detail-info{max-height:200px;}
.main-dashboard .widget-calendar .detail-wrap .detail:last-child{border:none}
.main-dashboard .widget-calendar .detail-wrap .detail-tit{display:flex; flex-direction:column;  font-weight:300; color:#333; min-width: 70px; font-size: 14px; text-align:center; background:#fbfaff; height:100%; justify-content:center; align-items: center;}
.main-dashboard .widget-calendar .detail-wrap .detail-tit i{color:#5629ee; font-size: 22px;}
.main-dashboard .widget-calendar .detail-wrap .detail-info{max-height: 82px; width:100%; overflow:hidden; overflow-y: auto; color:#333; font-size: 14px;}
.main-dashboard .widget-calendar .detail-wrap .detail-info ul li{padding:4px 8px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color:#333; cursor:pointer}
.main-dashboard .widget-calendar .detail-wrap .detail-info ul li:hover{color:#5629ee}
.main-dashboard .widget-calendar .detail-wrap .detail-info ul li .user{color:#777; margin-left: 6px;}
.main-dashboard .widget-calendar .detail-wrap .detail-info ul li .time{color:#aaa; display:block; font-size: 13px; width:100%;}
.main-dashboard .widget-calendar .detail-wrap .detail-info ul li.nodata:hover{color:#333}
.main-dashboard .widget-calendar .detail-wrap .detail-info ul li.nodata span{color:#333; font-size: 14px;}

/* calendar-sme */
.calendar-sme{font-family:'pps','ptd', 'sans-serif'; padding:12px}
.calendar-sme .dhtmlxcalendar_material{position:relative; font-family:'pps','ptd', 'sans-serif'}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_month_cont{border:none; width:100%; display:flex; justify-content:space-between}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_month_cont .Button.small.trans-ico{border-radius: 50%; width:32px; height:32px}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_month_cont .Button.small.trans-ico:hover{background:#f1f1f1;}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_month_cont ul.dhtmlxcalendar_line{display:block; width:60%;}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_month_cont ul.dhtmlxcalendar_line li.dhtmlxcalendar_cell.dhtmlxcalendar_month_hdr{width:100%; font-size: 18px;}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_days_cont{border:none; width:100%;}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_dates_cont{border:none;  width:100%;}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_dates_cont ul.dhtmlxcalendar_line{margin-left:initial;}
.calendar-sme .dhtmlxcalendar_material ul.dhtmlxcalendar_line{margin-left:initial; width:100%; display:grid; grid-template-columns: repeat(7, 1fr)}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_dates_cont ul.dhtmlxcalendar_line li.dhtmlxcalendar_cell_month_date{background-color:#5629ee}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_dates_cont ul.dhtmlxcalendar_line li.dhtmlxcalendar_cell_month_date_hover{background-color:#4425ac}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_dates_cont ul.dhtmlxcalendar_line li.dhtmlxcalendar_cell_month_hover{background-color:#f1f1f1}
.calendar-sme .dhtmlxcalendar_material div.dhtmlxcalendar_dates_cont ul.dhtmlxcalendar_line li.dhtmlxcalendar_cell_month_weekend{color:#ff6464}

.calendar-wrap{position:relative}
.calendar-wrap button.reg{position:absolute; right:12px; top:12px; z-index: 1;}
.calendar-sme.jqx-calendar .jqx-widget-header{background:#fff}
.calendar-sme.jqx-widget-content{border:0; padding-top: 12px;}
.calendar-sme.jqx-calendar .jqx-widget-content{border:0}
.calendar-sme.jqx-calendar td{position:relative; z-index: 1;}
.calendar-sme.jqx-calendar .calendar-header .jqx-calendar-column-cell{color:#9a9a9a}
.calendar-sme.jqx-calendar .jqx-calendar-title-header td{font-size: 18px;}
.calendar-sme.jqx-calendar .jqx-fill-state-pressed{background:transparent; border-color:transparent; color:#fff}
.calendar-sme.jqx-calendar .jqx-fill-state-pressed:before{content:""; background:#5629ee; border-radius:50%; width:32px; height:32px; display:block; position:absolute; z-index:-1; top:0px; left:50%; right:50%; transform: translate(-48%, -1%);}

.calendar-sme.jqx-calendar .jqx-calendar-cell-hover{background:transparent; border-color:transparent; color:#404040}
.calendar-sme.jqx-calendar .jqx-calendar-cell-hover:before{content:""; background:#f1f1f1; border-radius:50%; width:32px; height:32px; display:block; position:absolute; z-index:-1; top:0px; left:50%; right:50%; transform: translate(-48%, -1%);}

.calendar-sme.jqx-calendar .jqx-fill-state-pressed.jqx-calendar-cell-hover{background:transparent; border-color:transparent; color:#fff}
/*.calendar-sme.jqx-calendar .jqx-fill-state-pressed.jqx-calendar-cell-hover:before{content:""; background:#4425ac; border-radius:50%; width:32px; height:32px; display:block; position:absolute; z-index:-1; top:0px; left:1px}*/
.calendar-sme.jqx-calendar .jqx-fill-state-pressed.jqx-calendar-cell-hover:before{content:""; background:#4425ac; border-radius:50%; width:32px; height:32px; display:block; position:absolute; z-index:-1; top:0px; left:50%; right:50%; transform: translate(-48%, -1%);}

.calendar-sme.jqx-calendar .jqx-calendar-cell-today{background:transparent; border-color:transparent; color:#7264ff; font-weight: 300;}
.calendar-sme.jqx-calendar .jqx-calendar-cell-today.jqx-fill-state-pressed{color:#fff; font-weight: normal;}
.calendar-sme.jqx-calendar .jqx-calendar-cell-year:before,
.calendar-sme.jqx-calendar .jqx-calendar-cell-decade:before{display:none}
.calendar-sme.jqx-calendar .jqx-calendar-cell-year.jqx-fill-state-pressed,
.calendar-sme.jqx-calendar .jqx-calendar-cell-decade.jqx-fill-state-pressed{color:#404040}
.calendar-sme.jqx-calendar .jqx-calendar-cell-year.jqx-calendar-cell-hover,
.calendar-sme.jqx-calendar .jqx-calendar-cell-decade.jqx-calendar-cell-hover{background:#f5f5f5}
.calendar-sme.jqx-calendar .jqx-calendar-cell-year.jqx-calendar-cell-hover:before,
.calendar-sme.jqx-calendar .jqx-calendar-cell-decade.jqx-calendar-cell-hover:before{display:none}

.calendar-sme.jqx-calendar .jqx-calendar-cell-weekend{background:transparent; border-color:transparent; color:#ff6464!important}
.calendar-sme.jqx-calendar .jqx-calendar-cell-weekend.jqx-calendar-cell-hover{background:transparent; border-color:transparent; color:#fff!important}
.calendar-sme.jqx-calendar .jqx-calendar-cell-weekend.jqx-calendar-cell-hover:before{content:""; background:#ff6464; border-radius:50%; width:32px; height:32px; display:block; position:absolute; z-index:-1; top:0px;}
.calendar-sme.jqx-calendar .jqx-calendar-cell-weekend.jqx-fill-state-pressed{background:transparent; border-color:transparent; color:#fff!important}
.calendar-sme.jqx-calendar .jqx-calendar-cell-weekend.jqx-fill-state-pressed:before{content:""; background:#ff6464; border-radius:50%; width:32px; height:32px; display:block; position:absolute; z-index:-1; top:0px;}

.calendar-sme.jqx-calendar .jqx-calendar-cell-weekend.jqx-calendar-cell-othermonth{background:transparent; border-color:transparent; color:#ffadad!important}

.calendar-sme.jqx-calendar .jqx-calendar-cell-specialDate{background:transparent; border-color:transparent; color:#ff6464!important}
.calendar-sme.jqx-calendar .jqx-calendar-cell-specialDate.jqx-calendar-cell-othermonth{background:transparent; border-color:transparent; color:#ffadad!important}

.calendar-sme.jqx-calendar .jqx-calendar-cell-specialDate.jqx-calendar-cell-hover{background:transparent; border-color:transparent; color:#fff!important}
.calendar-sme.jqx-calendar .jqx-calendar-cell-specialDate.jqx-calendar-cell-hover:before{content:""; background:#ff6464; border-radius:50%; width:32px; height:32px; display:block; position:absolute; z-index:-1; top:0px; left:50%}
.calendar-sme.jqx-calendar .jqx-calendar-cell-specialDate.jqx-fill-state-pressed{background:transparent; border-color:transparent; color:#fff!important}
.calendar-sme.jqx-calendar .jqx-calendar-cell-specialDate.jqx-fill-state-pressed:before{content:""; background:#ff6464; border-radius:50%; width:32px; height:32px; display:block; position:absolute; z-index:-1; top:0px; left:50%}

/*.calendar-sme.jqx-calendar .jqx-calendar-cell.specail_date:after{content:""; display:block; position:absolute; top:0px; border-radius: 50%; background:#b691ff; width:8px; height:8px }*/
.calendar-sme.jqx-calendar .jqx-calendar-cell.specail_date:after{content:""; display:block; position:absolute; top:0px; border-radius: 50%; background:#b691ff; width:8px; height:8px; left: 50%; right:50%; transform: translate(-48%, -1%); margin-left:-9px}
.calendar-sme.jqx-calendar .jqx-widget-content table.header-table{display:flex}

/* 통합검색 */

.main-dashboard .grid-stack>.grid-stack-item>.grid-stack-item-content.total-search-widget-from{position:relative; overflow:initial; width:calc(100% - 16px)}
.left-widget .grid-stack-item-content.total-search-widget-from:after{display:none}
.main-dashboard .left-widget .widget-search{padding:24px; height:100%;}
.main-dashboard .left-widget .toolbar-search{position:relative; left:0px; margin:0 auto; }
.main-dashboard .left-widget .toolbar-search .search-area{ width:100%; border:none}
.main-dashboard .left-widget .widget-search .logo_area{position:relative; background: url("/static/fw/images/common/sme_icon.png") 50% 50% no-repeat; background-size:contain; width:42px; height:42px; margin-left: 8px; margin-right: 8px;}

.main-dashboard .left-widget .toolbar-search .logo_area:after{content:""; display:block; width:1px; height:20px; right:-8px; top:11px; background:#d6d6d6; position:absolute;}

.main-dashboard .left-widget .toolbar-search .search-btn button{color:#999}
.main-dashboard .left-widget .toolbar-search .search-btn button i{font-size: 20px; color:#5629ee}
.main-dashboard .left-widget .toolbar-search fieldset.topsearch-layer{
	display: flex;
	align-items:center;
	gap:12px;
    width: 100%; 
    height: 50px;
    padding: 2px;
    font-weight: 300;
    font-size: 15px;
    letter-spacing: 0;
    border: 0;
    text-align: center;
    background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #7b59ed 0%, #d1c4ff 100%);
    background-origin: border-box;
    background-clip: content-box, border-box;
    border-radius: 100px;
    cursor: pointer;
    outline: none;
    box-sizing: border-box}

.main-dashboard .left-widget .toolbar-search .search-btn.search{position:relative; right:initial; left:initial; flex:none; margin-right: 16px;}
.main-dashboard .left-widget .toolbar-search .search-btn.option{position:relative; right:initial; flex:none}
.main-dashboard .left-widget .toolbar-search .search-input{color:#333;   font-size: 16px; height:46px; padding:0px}
.main-dashboard .left-widget .toolbar-search .search-input::-webkit-input-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:16px; color:#999; letter-spacing:-0.8px; font-weight:normal}
.main-dashboard .left-widget .toolbar-search .search-input::-moz-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:16px; color:#999; letter-spacing:-0.8px; font-weight:normal}
.main-dashboard .left-widget .toolbar-search .search-input:-ms-input-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:16px; color:#999; letter-spacing:-0.8px; font-weight:normal}

.main-dashboard .left-widget .toolbar-search .autocomplete-layer{width:100%; left:0px; top:47px; margin-left:initial; border-color:#f9f9f9}



/* 통합검색 결과 */
.main-dashboard .left-widget .search-cont{margin-top: 8px; height:calc(100% - 50px)} 
.main-dashboard .left-widget .search-cont .dev-content{padding:initial; min-width:100%;}
.main-dashboard .left-widget .searchlist-group .content-util .tag-list li{float:initial; display:inline-block; margin-bottom: 4px;}



.toolbar-search.ty2{position:relative; left:0px; margin:0 auto; }
.toolbar-search.ty2 .search-area{ width:100%; border:none}
.toolbar-search.ty2 .logo_area{position:relative; background: url("/static/fw/images/common/sme_icon.png") 50% 50% no-repeat; background-size:contain; width:42px; height:42px; margin-left: 8px; margin-right: 8px;}

.toolbar-search.ty2 .logo_area:after{content:""; display:block; width:1px; height:20px; right:-8px; top:11px; background:#d6d6d6; position:absolute;}

.toolbar-search.ty2 .search-btn button{color:#999}
.toolbar-search.ty2 .search-btn button i{font-size: 20px; color:#5629ee}
.toolbar-search.ty2 fieldset.topsearch-layer{
	display: flex;
	align-items:center;
	gap:12px;
    width: 100%; 
    height: 50px;
    padding: 2px;
    font-weight: 300;
    font-size: 15px;
    letter-spacing: 0;
    border: 0;
    text-align: center;
    background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #7b59ed 0%, #d1c4ff 100%);
    background-origin: border-box;
    background-clip: content-box, border-box;
    border-radius: 100px;
    cursor: pointer;
    outline: none;
    box-sizing: border-box}

.toolbar-search.ty2 .search-btn.search{position:relative; right:initial; left:initial; flex:none; margin-right: 16px;}
.toolbar-search.ty2 .search-btn.option{position:relative; right:initial; flex:none}
.toolbar-search.ty2 .search-input{color:#333;   font-size: 16px; height:46px; padding:0px}
.toolbar-search.ty2 .search-input::-webkit-input-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:16px; color:#999; letter-spacing:-0.8px; font-weight:normal}
.toolbar-search.ty2 .search-input::-moz-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:16px; color:#999; letter-spacing:-0.8px; font-weight:normal}
.toolbar-search.ty2 .search-input:-ms-input-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:16px; color:#999; letter-spacing:-0.8px; font-weight:normal}

.toolbar-search.ty2 .autocomplete-layer{width:100%; left:0px; top:47px; margin-left:initial; border-color:#f9f9f9}






/* **************************************** *
*  CHART
* **************************************** */
/* OLD */
.chart-list{display:flex; justify-content: space-between; width: 100%; height: 300px;}
.chart-list .chart-list_main_left{width: 240px; overflow: auto; height: 100%; border:1px solid #c8c8c8;}
.chart-list .chart-list_main_left ul button:hover{background:#f0f2f5;}
.chart-list .chart-list_main_center{display: flex; flex-direction: column; border:1px solid #c8c8c8; border-left: 0; height: 100%; width:calc(100% - 240px); overflow: hidden;}
.chart-list ul button{display: flex; align-items: center; font-size: 13px; width: 100%; cursor: pointer; letter-spacing: -0.2px; padding: 10px; background: #fff; border: 0; border-bottom: 1px solid #c8c8c8 ; box-sizing:border-box; margin: 0; transition:all 0.3s;}
.chart-list ul button span{margin-left: 8px; color: #505050;}
.chart-list ul button i{font-size: 20px;}
.chart-list .chart-list_main_center ul{width: 100%; border-bottom:1px solid #ebebeb; padding: 8px; margin-bottom: 16px;}
.chart-list .chart-list_main_center ul li{float: left;}
.chart-list .chart-list_main_center ul button{ justify-content:center; height: 50px; width: 50px; border: 0;}
.chart-list .chart-list_main_center ul button:hover{background: #ebebeb;box-sizing: 14px;}
.chart-list .chart-list_main_center .stitArea{padding-left: 24px;}
.chart-list .chart-list_main_center .carousel-thum{position: relative;top:8px; left: 20px; display: flex; margin: 0 -10px;}
.chart-list .chart-list_main_center .carousel-thum .carousel-box{width: 240px;}
.chart-list .chart-list_main_center .carousel-thum .cover-img img{height: 130px;}

/* 2023ver */
.chart-set-wrap{width:100%;}
.chart-set-list{display:flex; flex-wrap:wrap;}
.chart-set-list > li{display:inline-flex;  width:32%; margin:8px; cursor:pointer; min-height: 362px;}
.chart-set-list > li .list-box{position:relative; border:1px solid #eee; background:#fff; width:100%; padding:14px 18px 10px 12px; border-radius: 8px;}
.chart-set-list .list-box .list-del{position:absolute; top:4px; right:4px; z-index:1}
.chart-set-list .list-box .list-del .Button{display:none; border-radius: 50%; height:26px; min-width:26px; background:transparent; border:0}
.chart-set-list .list-box .list-del .Button i{color:#ccc;}
.chart-set-list > li:hover .list-box .list-del .Button{display:inline-block}
.chart-set-list > li:hover .list-box .list-del .Button:hover{display:inline-block; background:#e8e8e8;}
.chart-set-list > li:hover .list-box .list-del .Button:hover i{color:#fff}

.chart-set-list > li .list-box.add{border:1px dashed #e3e3e3; display: flex; flex-direction: column; align-items: center; justify-content:center;}
.chart-set-list > li .list-box.add .ico-add i{font-size: 22px; color:#bbb}
.chart-set-list > li .list-box.add .tit{color:#bbb; font-weight:normal; font-size: 15px; margin-bottom:24px}
.chart-set-list > li .list-box.add:hover {background:#f9f7ff20; box-shadow: 0px 0px 10px #5629ee1a; border:1px dashed #5629ee40}
.chart-set-list > li .list-box.add:hover .tit{color:#555}

.chart-set-list .list-box .writing-ty1 .writing-list{border:none}
.chart-set-list .list-box .writing-ty1 .writing-cont .txt{font-size:15px; letter-spacing:-0.5px; color:#333; font-weight:normal}

.chart-set-list .list-box .chart-type{display:flex; width:100%; justify-content: space-between}
.chart-set-list .list-box .chart-type .type-tit{overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size:15px; letter-spacing:-0.5px; color:#333; font-weight:normal}
.chart-set-list .list-box .chart-preview{flex:none; display:flex; align-items: center;  letter-spacing: -0.8px; font-size: 14px; color:#777; cursor:pointer; margin-right: 8px;}
.chart-set-list .list-box .chart-preview i{font-size:18px; margin-right: 4px; }
.chart-set-list .list-box .chart-preview:hover{color:#5629ee}
.chart-set-list .list-box .chart-preview:hover span{text-decoration:underline; text-underline-offset: 3px; } 

.chart-Ty-wrap{display:flex; margin-bottom: 6px;}

.chart-ser-btn{position:relative; float:right; width:134px; height:40px; display:flex; border-radius:0px 0px 8px 8px; border:1px solid #eaeaea; background:#fff; align-items: center; z-index: 1; padding-left: 4px; padding-right: 2px;}
.chart-ser-btn .tit{margin:0px 8px; letter-spacing: -0.4px; font-size: 14px; color:#555; font-weight: 300;}
.chart-ser-btn .Button{z-index: 2; margin-left: 4px; color:#ccc; border-radius: 50%; min-width:24px; height:24px;}
.chart-ser-btn .Button:hover{ background:#ccc; color:#fff}


/* **************************************** *
*  TEMPLATE
* **************************************** */

.biz-form.form-list{width: 100%; margin-top: 40px; padding: 16px; padding-left: 24px;}

.biz-form.form-list .form-box-wrap{display: flex; flex-wrap:wrap; flex-direction: row; justify-content:flex-start; align-items:center; margin-top: 50px;}
.biz-form.form-list .form-box-wrap .form-box{width: 220px; height: 300px; display: flex; flex-direction:column; justify-content:space-between; overflow: hidden; padding: 0; border-radius: 8px; margin: 32px 38px;}

.biz-form.form-list .form-box-wrap .form-box.new{justify-content:center; align-items: center; border: none; background:#fafafa}

.biz-form.form-list .form-box-wrap .form-box.new:hover i,
.biz-form.form-list .form-box-wrap .form-box.new:hover p,
.biz-form.form-list .form-box-wrap .form-box.new:hover span{color: #5629ee; }
.biz-form.form-list .form-box-wrap .form-box.new p{font-size: 14px; margin: 8px 0;}
.biz-form.form-list .form-box-wrap .form-box .cover-img{width: 100%; display:contents;}
.biz-form.form-list .form-box-wrap .form-overlay{display: none; align-items: flex-start; position: absolute; width: 100%; bottom: 0px; min-height: 50px; box-sizing: border-box; justify-content:center; height: 100%; background-color:rgba(0, 0, 0, 0.75)}

.biz-form.form-list .form-box-wrap .form-box:hover .form-overlay {display: flex}

.biz-form.form-list .form-box-wrap .form-overlay .cover-btn{display:flex; position:absolute; bottom:0; left:0; width:100%; background-color:#5629ee}
.biz-form.form-list .form-box-wrap .form-overlay .cover-btn li{flex:1; border-right:1px solid rgba(255,255,255,.2); list-style:none}
.biz-form.form-list .form-box-wrap .form-overlay .cover-btn li:last-child{border-right:none}
.biz-form.form-list .form-box-wrap .form-overlay .cover-btn li button{display:flex; justify-content:center; align-items:center; flex-direction:column; width:100%; height:58px; padding:10px 0; background:none; border:0; cursor:pointer; box-sizing:border-box}
.biz-form.form-list .form-box-wrap .form-overlay .cover-btn li button:hover{background-color:rgba(255,255,255,.1)}
.biz-form.form-list .form-box-wrap .form-overlay .cover-btn li button i{margin-bottom:2px; font-size:18px; color:#fff}
.biz-form.form-list .form-box-wrap .form-overlay .cover-btn li button span{font-size:12px; letter-spacing:-0.5px; color:#fff}
.biz-form.form-list .form-box:hover .doc-overlay{display:flex}

.biz-form.form-list .form-overlay .form-info{flex:auto; margin:35px 20px 0; padding:8px 0; border-top:2px solid #fff; border-bottom:2px solid #fff}
.biz-form.form-list .form-overlay .form-info .info-list{margin-top:10px; overflow:hidden; width: 100%;  padding: 8px;}
.biz-form.form-list .form-overlay .form-info .info-list:first-child{margin-top:0}
.biz-form.form-list .form-overlay .form-info .info-list:after{content:''; display:block; clear:both}
.biz-form.form-list .form-overlay .form-info .info-tit{display:flex; align-items:center;}
.biz-form.form-list .form-overlay .form-info .info-tit .tit{display:inline-block; font-size:16px; text-align: center; letter-spacing:-0.5px; color:#fff; font-weight:300}
.biz-form.form-list .form-overlay .form-info .infoTxt01{margin-top: 12px; max-height: 100px;}
.biz-form.form-list .form-overlay .form-info .infoTxt01 p {display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; color: #fff; font-size: 12px; line-height: 155%; letter-spacing: -0.2px; text-overflow: ellipsis; overflow: hidden}

.info-message{position:relative; top: 30vh; width: 700px; text-align: center; margin:0 auto; line-height:1.5}
.info-message .message-tit{font-weight:normal; font-size:18px; color:#555; letter-spacing: -1px; margin-bottom:16px}
.info-message .message-tit span{font-weight:300; color:#5629ee}
.info-message .message-img{width:120px; margin:16px auto}
.info-message a{position:relative; font-weight:300; color:#5629ee}
.info-message a:before{content:''; position:absolute; bottom:0; left:0; width:100%; height:2px; background:#5629ee}

.demo-blind{position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(255,255,255,.8); z-index:1}

.Tabs.fixed .guide-box .stitL{flex-direction:column;align-items:flex-start }
.Tabs.fixed .guide-box.line{position:fixed; background:rgb(255 255 255 / 80%); border:1px solid #5629ee; top:220px !important; z-index: 1 ;border-radius:8px; width:800px; left:400px;}
.Tabs.fixed .guide-box.line:before{display:none}
.Tabs.fixed .guide-box.line .dash-tit{font-size:14px; color:#fff; letter-spacing: -0.5px;}
.Tabs.fixed .guide-box.line .dash-tit i{font-size: 28px; margin-right:8px;}
.com-table .stitR{margin-right: 8px;}
.com-table .writing-ty1{margin: 0 8px;}
.com-table .writing-ty1 .writing-list li.col3{width: 33.3%;}
.com-table .writing-ty1 .writing-list li.col3 .col-box > li{justify-content: center}
.com-table .writing-ty1 .writing-list li.col3 .col-box > li:nth-child(3){border-left:1px solid #ebebeb}

.bx-wrapper .bx-controls-direction a{z-index: 1 !important;}

.template_wrap{flex-direction:column}
.template_wrap .biz-form.form-list{margin-top: 0px;}
.template_wrap .biz-form .form-box-wrap{ margin-top:0px;}
.template_wrap .biz-form .form-box-wrap .form-box{justify-content:normal; padding:14px 24px 14px 14px; border:0px; width:23%; min-width:290px; height:140px; margin:14px; box-shadow:0px 0px 4px rgb(0 0 0 / 10%); align-items:center; cursor:pointer;flex-direction:row}
.template_wrap .biz-form .form-box-wrap .form-box:hover{box-shadow:0px 0px 14px rgb(0 0 0 / 10%); }
.template_wrap .biz-form .form-box-wrap .form-box:hover .tit_wrap{color:#5629ee}
.template_wrap .biz-form .form-box-wrap .form-box .tit_wrap{display:flex;flex-direction:column; flex:1 }
.template_wrap .form-box-wrap .form-box .icon{display:flex;justify-content:center;align-items:center; width:80px; height:80px; background:#f7f7f7; border-radius: 16px; margin-right: 16px;}
.template_wrap .form-box-wrap .form-box .tit{font-weight:300; font-size: 15px; text-align:left; word-break:keep-all; padding:8px 0px;}
.template_wrap .form-box-wrap .form-box .txt{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.template_wrap .form-box-wrap .form-box .icon .axl-ico{ width:40px; height:40px; }
.template_wrap .form-box-wrap .form-box .icon .axl-ico svg{ width:40px; height:40px; }



/* **************************************** *
*  NOTIS
* **************************************** */

.notis-time{position: relative; height:120px; margin-bottom: 24px;}

.notis-time .switch_week{display:flex; justify-content:space-between; margin-top: 8px;}

.notis-time .switch_day {display: block; width: 100%; margin: 0 4px;}
.notis-time .switch_day label span{margin: 0 auto;}
.notis-time .switch_day input[type="checkbox"] {display: none}

.notis-time .switch_day .switch_day-ground {display:flex; position: relative; width: 100%; height: 32px; background-color: #909090; cursor: pointer; transition: all .3s; overflow: hidden; text-align: center; color: #fff; line-height: 2.5; border-radius: 8px; justify-content:center; align-items:center;}

.notis-time .switch_day input[type="checkbox"]:checked+.switch_day-ground {background-color: #5629ee}

.notis-time .stitArea{justify-content:center;height: 40px;}

.com-table.notis-set {position:relative; height:140px}
.com-table.notis-set .com-table{margin:16px 0px; letter-spacing:-0.3px}
.com-table.notis-set thead tr th{padding:8px 0px; color:#5629ee;  border-top:3px solid #5629ee; border-bottom: 1px solid #efefef;}
.com-table.notis-set tbody td{border-bottom: 1px solid #efefef;}
.com-table.notis-set tbody tr:last-child td{border-bottom:none;}
.com-table.notis-set .Table-wrapper.Table-wrapper{border-radius: 0px;}

.com-table.notis-set #notisToolkitSet thead th{border-bottom: 1px solid #e9e9e9;} 
.com-table.notis-set tr > td > span{word-break:keep-all; line-height: 1.5;}



/* **************************************** *
*  FIND ID
* **************************************** */

.find_id .find_id_select{display: flex; justify-content:space-evenly; margin: 16px 0 32px;}
.find_id .tel_input li{display:flex; flex-direction:row; align-items:center}
.find_id .tel_input .Textinput{margin-right:5px}
.find_id .tel_input .dash-uni{margin:0 3px}

.find_id_form{margin-bottom: 24px;}
.find_id_form i{font-size:24px; margin-left: 8px; color:#ababab;}
.find_id_form i.active{color: #5629ee;}
.find_id .input_wrap{display: flex; align-items:center}
.find_id .captcha_wrap{display: flex; margin-bottom: 8px; align-items:center}
.find_id .captcha{content: ""; width: 75%; height:100px; border: 1px solid #f3f3f3;}
.find_id .captcha_btn{display:flex; flex-direction: column; margin-left: 8px;}
.find_id .captcha_btn button:first-child{margin-bottom:3px}
.find_id .input_wrap fieldset {height:40px;line-height: 27px; background:#fff; display:flex; align-items:center; justify-content:space-between; border-radius:8px;}
.find_id .input_wrap fieldset .Textinput{height:38px}
.find_id .input_wrap fieldset span{text-align: right; margin: 0 8px; color: #fa5c01}



/* **************************************** *
*  DRIVE
* **************************************** */
.biz-drive{display: flex; height: 100%; position:relative; overflow-x:hidden}

.biz-drive .stitArea{margin-bottom: 0;}
.drive-left{display: flex; flex-direction:column; background: #ffff; top:0px; border-right: 1px solid #e4e4e4; width: 240px; position:fixed; height:100%; box-shadow:1px 5px 30px rgb(0 0 0 / 10%);}

.drive-left .biz-logo{margin:20px; margin-right:10px;}
.drive-left .biz-logo a{display:block}
.drive-left .biz-logo img{display:inline-block; max-height:50px}
.drive-left .left-list{-webkit-box-flex:1; flex: 1 1 auto; overflow:auto}
.drive-left .left-list .left-list-inner{padding-top:4px;}
.drive-left .left-list .left-list-inner ul{overflow:auto; padding: 2px 8px 2px 12px;  height: 100%;}
.drive-left .left-list .left-list-inner ul button{display: flex; align-items: center; font-size: 14px; width: 100%; cursor: pointer; background: none; border: none; padding: 0px 8px; height: 40px;}
.drive-left .left-list .left-list-inner ul button span{font-size: 14px; letter-spacing: -0.2px; font-weight:lighter; color:#333; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.drive-left .left-list .left-list-inner ul li > ul button{height:26px; padding:2px 8px;}
.drive-left .left-list .left-list-inner ul li > ul li button i{font-size: 15px; color:#3e3e3e}
.drive-left .left-list .left-list-inner ul li > ul li button span{font-size:13px; color:#3e3e3e}
.drive-left .left-list .left-list-inner ul li > ul li > ul button{height:24px;}
.drive-left .left-list .left-list-inner ul > li button:hover span,
.drive-left .left-list .left-list-inner ul > li button:hover i,
.drive-left .left-list .left-list-inner ul > li button:active span,
.drive-left .left-list .left-list-inner ul > li button:active i,
.drive-left .left-list .left-list-inner ul > li > ul li:hover button,
.drive-left .left-list .left-list-inner ul > li > ul li:hover button i,
.drive-left .left-list .left-list-inner ul > li > ul li:hover button span,
.drive-left .left-list .left-list-inner ul > li > ul li:active button,
.drive-left .left-list .left-list-inner ul > li > ul li:active button i,
.drive-left .left-list .left-list-inner ul > li > ul li:active button span{color: #5629ee;}
.drive-left .left-list .left-list-inner ul button i{font-size: 20px;  margin-right: 6px;  color:#333}
.drive-left .left-list .left-list-inner ul button i.tree-icon{position:absolute; margin-left:-16px}
.drive-left .myinfo{border-top: 1px solid #e4e4e4; padding: 8px; height: 120px;}

.drive-left .myinfo .capacity-info .Textarea{border: none; background: none; display: flex;}
.drive-left .myinfo .capacity-info .Textarea strong{color: #5629ee;}
.drive-left .myinfo .capacity-info .Textarea .status{flex: 1; -webkit-box-flex:1; overflow: hidden; text-overflow: ellipsis; margin-left: 5px; text-align: right; white-space:nowrap; display: block; line-height: 18px;}
.drive-left .myinfo .capacity-info .Textarea .status a{font-size: 11px; color: #666;}

.drive-main{display: flex; width:calc(100% - 240px); flex-direction:column; padding: 16px; position:relative; left:240px; top:40px;}
.drive-main .thumb-item{ display: flex; margin-bottom: 8px;  align-items:baseline;}
.drive-main .thumb-item li{padding-left: 4px;}
.drive-main .thumb-item li a{letter-spacing: -0.5px; font-size: 17px; color: #999;}
.drive-main .thumb-item li i{color:#999}
.drive-main .thumb-item li:last-child a{color: #202020; font-weight: 600;}
.drive-main .thumb-item li:last-child a::after{display: none;}
.drive-main .thumb-item li i{margin:0px 4px; font-size: 14px;}

.drive-main .main-top{width:calc(100% - 285px); padding-bottom: 8px; border-bottom: 1px solid #e4e4e4; position:fixed; background:#fafafa; height:70px; z-index: 1; top:63px; padding-top:20px;}
.drive-main .main-top button i{margin-right:4px;}

.drive-main .main-recent{display: block; height: 270px; width: 100%; margin-top: 32px; padding: 8px; overflow: hidden;}
.drive-main .main-recent .recent-file{display:flex; flex-wrap:wrap;}
.drive-main .main-recent .recent-file .form-box{flex: 1; padding: 0; margin: 4px; height: 200px; overflow: hidden; display: block; border-radius: 4px; cursor: pointer;}
.drive-main .main-recent .recent-file .form-box img{width: 100%; height: auto;}

.drive-main .main-thumb{display:flex; flex:1 0 auto; align-items: flex-start; flex-direction:column; width: 100%; margin-top: 32px; padding: 8px; position:relative;}
.drive-main .main-thumb .thumb-list{display: flex; width: 100%; flex-wrap:wrap}
.drive-main .main-thumb .empty-list{width:100%; height:calc(100% - 100px); display:flex; justify-content:center; align-items:center}
.drive-main .main-thumb .empty-list .empty{display:flex; flex-direction:column; justify-content:center; align-items: center; font-size:14px; color: #767989}
.drive-main .main-thumb .empty-list .empty::before{display:flex; justify-content:center;  align-items: center; width:80px; height:80px; border-radius: 50%; content: "\ea80"; font-family:"xeicon"; font-size: 32px; background:#efefef; color:#878b99; margin-bottom: 16px;}
.drive-main .main-thumb .thumb-list .thumb{width: 200px; height: 180px; display: flex; -webkit-box-orient:vertical; align-items: center;  flex-direction:column; justify-content: flex-end;  position: relative;}

/*
.drive-main .main-thumb .thumb-list  mb:active,
.drive-main .main-thumb .thumb-list .thumb:hover,
.drive-main .main-thumb .thumb-list .thumb.active{background: #ededed;}*/


.drive-main .main-thumb .thumb-list .thumb .thumb-content{flex: 1; display: inline-block; overflow: hidden; border-radius: 5px; margin: 16px 16px 0 16px;  height: 80px;}
.drive-main .main-thumb .thumb-list .thumb .thumb-content .content{align-items: center; flex-direction: column; justify-content: center; max-width: 100%; max-height: 100%; min-width:32px; min-height:32px; top: 12px; left: 4px; right: 4px; bottom: 4px; overflow:hidden;}
.drive-main .main-thumb .thumb-list .thumb .folder-content{position: relative; display: inline-flex; vertical-align: bottom; align-items: flex-end; flex-direction: row; width: 112px; height: 80px;  cursor: pointer; margin-top:10px;  margin: 16px 16px 10px;}
.drive-main .main-thumb .thumb-list .thumb.folder.secret .folder-content{display: block;}
.drive-main .main-thumb .thumb-list .thumb.folder .folder-content .back{display: block; position: absolute; left: -3px; right: -3px; bottom: -4px;} 
.drive-main .main-thumb .thumb-list .thumb.folder .folder-content .front{display: block; position:absolute; left: -3px; right: -3px; bottom: -4px;}
.drive-main .main-thumb .thumb-list .thumb.folder .folder-content .front.media{display: block; position:absolute; left: -3px; right: -3px; bottom: -4px;}
.drive-main .main-thumb .thumb-list .thumb.folder .folder-content .content{position:absolute;  display: inline-flex; align-items: center; flex-direction: column; justify-content: center; max-width: 100%; max-height: 100%; min-width:32px; min-height:32px; top: 12px; left: 4px; right: 4px; bottom: 4px; overflow:hidden;}
.drive-main .main-thumb .thumb-list .thumb.folder .folder-content .signal{display: block; position: relative; margin-right: 7px; font-size: 16px; margin-bottom: 6px; color: #3480b7;}

.drive-main .main-thumb .thumb-list .thumb .folder-info{margin:8px 0px;   flex-direction: column; align-items: center; text-align: center; cursor: pointer;}
.drive-main .main-thumb .thumb-list .thumb .folder-info .tit{font-size: 14px; width:200px; padding:0px 8px; white-space:nowrap; text-overflow: ellipsis; overflow:hidden}
.drive-main .main-thumb .thumb-list .thumb .folder-info .time{font-size: 12px; color: #a5a5a5; white-space:nowrap; text-overflow: ellipsis;}
.drive-main .main-thumb .thumb-list .thumb .ImageCheckbox.circle{display: none; position: absolute; vertical-align: middle; right:8px; top:8px; width: 18px; height: 18px;}

 /*
.drive-main .main-thumb .thumb-list .thumb.active .ImageCheckbox.circle,
.drive-main .main-thumb .thumb-list .thumb:active .ImageCheckbox.circle, 
.drive-main .main-thumb .thumb-list .thumb:hover .ImageCheckbox.circle{display:inline-block;}*/

.drive-main .main-thumb .thumb-list .thumb .ImageCheckbox.circle > .Checkbox{width: 16px; height: 16px;}
.drive-main .main-thumb .thumb-list .thumb .ImageCheckbox.circle:after{content: "\e9c6"; color:#808080; left: 0; top: 50%; width: 16px; height: 16px; line-height: 16px; margin-top: -8px; background: none;}
.drive-main .main-thumb .thumb-list .thumb .ImageCheckbox.circle.Checked:after{background: none; color: #5629ee; content: "\e92c";}

.biz-drive .drive-overlay{background:rgba(0, 0, 0, 0.5); width:100%; height:100%; position:absolute; top:-10px; left:0px; border:3px solid #5629ee; display:flex;justify-content:center; align-items: center;}
.biz-drive .drive-overlay .txt-wrap{display:flex; flex-direction:column; justify-content:center; align-items: center; font-size:16px; color:#fff}
.biz-drive .drive-overlay .txt-wrap::before{display:flex; justify-content:center; align-items: center; width:80px; height:80px; border-radius: 50%; content: "\ea8a"; font-family:"xeicon"; font-size: 32px; background:#5629ee; margin-bottom: 16px;;}

.biz-drive .content-inner.left{top:124px; height:calc(100% - 125px);}
.biz-drive .thumb .Progressbar{position:absolute; width:130px; height:4px}
.biz-drive .Label{position:absolute; right:38px; top:24px; font-size:10px; color:#fff; background:#0000008f; height:16px; padding:1px 4px 2px; text-align:right; border-radius:2px; vertical-align:middle; box-sizing:border-box}
.biz-drive .Label span{font-size: 10px; color:#ffffff91; margin-right: 2px;}
.biz-drive .convert{position:absolute; display:flex; justify-content:center;align-items:center; bottom:50px; left:40px; width:22px; height:22px; background:#fff; border:2px solid #0196fa; border-radius: 50%; box-shadow: 3px 2px 4px 0px rgb(0 0 0 / 8%)}
.biz-drive .convert i{color:#5629ee; font-size: 18px; padding:4px 0px 2px}


/* **************************************** *
*  DRIVE V2
* **************************************** */
.drive-wrap{display:flex; flex-direction:column; position:relative; height:100%}
.drive-wrap .drive-top{min-height:75px; padding:20px 50px 20px; font-size:14px; border-bottom:1px solid #eaeaea; box-sizing:border-box}
.drive-wrap .drive-top .top-controller{display:flex; position:relative; align-items:center}
.drive-wrap .drive-top .controller-l,
.drive-wrap .drive-top .controller-c,
.drive-wrap .drive-top .controller-r{display:flex; align-items:center}
.drive-wrap .drive-top .controller-c{margin-left:auto}
.drive-wrap .drive-top .controller-r{margin-left:auto}
.drive-wrap .drive-top .controller-btn-crud{display:flex; align-items:center}
.drive-wrap .drive-top .controller-btn-crud .crud-btn{margin-right:8px; height:35px; padding:5px 13px 5px; font-size:14px; font-weight:300; border:1px solid #d3d3d3}
.drive-wrap .drive-top .controller-btn-crud .crud-btn.check_all{padding:6px 5px 5px 8px}
.drive-wrap .drive-top .controller-btn-crud .crud-btn.prev{padding:0; min-width:37px}
.drive-wrap .drive-top .controller-btn-crud .crud-btn.upload{border:1px solid #5629ee !important}
.drive-wrap .drive-top .controller-btn-crud .crud-btn i{font-size:22px}
.drive-wrap .drive-top .controller-btn-crud .crud-btn.upload i{font-size:18px; margin-right:5px}
.drive-wrap .drive-top .controller-btn-crud .crud-btn:first-child{margin-left:0}
.drive-wrap .drive-top .controller-btn-crud .crud-btn.active{border:1px solid #aaaaaa}
.drive-wrap .drive-top .top-controller .Tooltip.check_all{left:-32px !important}
.drive-wrap .drive-top .auto-technical{display:flex; align-items:center}
.drive-wrap .drive-top .auto-technical .technical-btn{height:34px; margin-left:10px; padding:5px 10px 5px; background:#fff; border:1px solid #5629ee; color:rgb(86, 41, 238, 1)}
.drive-wrap .drive-top .auto-technical .technical-btn i{position:relative; top:1px; font-size:18px}
.drive-wrap .drive-top .auto-technical .technical-btn.selected{background:#5629ee; color:#fff}
.drive-wrap .drive-top .view-controll{margin-left:25px}
.drive-wrap .drive-top .view-controll .controll-list{display:flex; align-items:center}
.drive-wrap .drive-top .align-type{position:relative}
.drive-wrap .drive-top .align-btn{
 display:block; position:relative;width:100%; height:35px; margin:0; padding:0 24px 0 12px; line-height:35px;
 color:#555; background:none; font-size:14px; font-weight:300; letter-spacing:-0.8px; text-align:left;
 border:0; border-radius:0; cursor:pointer; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; box-sizing:border-box}
.drive-wrap .drive-top .align-btn:after{content:'\e943'; position:absolute; right:12px; top:0; font-family:xeicon; font-size:20px; color:#9b9b9b; transition:all .20s ease}
.drive-wrap .drive-top .align-detail{display:none; position:absolute; top:35px; width:100%; background:#fff; border-radius:10px; box-shadow:2px 2px 7px rgb(0 0 0 / 12%); overflow:hidden; z-index:2}
.drive-wrap .drive-top .align-detail .align-list{overflow:hidden; overflow-y:auto; cursor:pointer}
.drive-wrap .drive-top .align-detail .align-list li{display:flex; align-items:center; justify-content:center; position:relative; padding:6px 8px; transition:all .20s ease}
.drive-wrap .drive-top .align-detail .align-list li.selected{background-color:#f4f4f4}
.drive-wrap .drive-top .align-detail .align-list li.selected a{color:#5629ee}
.drive-wrap .drive-top .align-detail .align-list li:hover a{color:#5629ee}
.drive-wrap .drive-top .align-detail .align-list li a{display:block; width:100%; color:#555; text-align:center; font-size:14px; font-weight:300; letter-spacing:-0.5px}
.drive-wrap .drive-top .view-type{min-width:auto; height:35px; margin-left:10px; padding:0; border:0}
.drive-wrap .drive-top .view-type i{font-size:24px; color:#555}
.drive-wrap .drive-top .view-type.selected i{color:#5629ee}
.drive-wrap .drive-top .view-type:first-child{margin-left:5px}

.drive-storage{display:flex; align-items:center; margin-left:auto; padding-right:50px}
.drive-storage .storage-tit{display:flex; align-items:center; margin-right:15px}
.drive-storage .storage-tit i{margin-right:5px; font-size:22px; color:#5629ee}
.drive-storage .storage-tit .tit{font-size:15px; font-weight:300; color:#333; letter-spacing:-0.5px}
.drive-storage .storage-state{display:flex; align-items:center}
.drive-storage .storage-state .state-num{font-size:15px; font-weight:normal; letter-spacing:0.5px; color:#555}
.drive-storage .storage-state .state-num.use{font-weight:300; color:#5629ee}
.drive-storage .storage-buy{height:35px; margin-left:20px; color:#5629ee; font-size:14px; font-weight:300; border:1px solid #eaeaea; border-radius:5px}
.drive-storage .storage-buy:hover{background:#5629ee; color:#fff}

.drive-wrap .drive-content{flex:1; position:relative; padding:25px 50px; overflow:auto}
.drive-wrap .pannel-info{display:none; position:fixed; right:0; top:294px; width:350px; height:100%; background:#fff; overflow:hidden; overflow-y:auto; box-shadow:0 0 8px rgb(0 0 0 / 20%); z-index:3}
.drive-wrap .pannel-info.v2{top:363px}
.drive-wrap .pannel-info.top_none{top:226px}
.drive-wrap .pannel-info.active{display:block}
.drive-wrap .pannel-info .info-inner{padding:40px 50px 0}
.drive-wrap .pannel-info .info-group{margin-top:25px}
.drive-wrap .pannel-info .info-group:first-child{margin-top:0}
.drive-wrap .pannel-info .file-meta .meta-list li{padding:5px 0}
.drive-wrap .pannel-info .file-meta .tit,
.drive-wrap .pannel-info .file-meta .meta{display:inline-block; line-height:135%; color:#333; font-size:14px; letter-spacing:-0.5px; vertical-align:middle}
.drive-wrap .pannel-info .file-meta .tit{color:#777; width:103px}
.drive-wrap .pannel-info .file-meta .meta{width:155px}
.drive-wrap .pannel-close{position:absolute; left:10px; top:10px; width:26px; height:26px}
.drive-wrap .pannel-close .close-btn{display:block; position:relative; width:100%; height:26px; border:0; background:none; border-radius:0; cursor:pointer}
.drive-wrap .pannel-close .close-btn:before,
.drive-wrap .pannel-close .close-btn:after{content:''; position:absolute; left:50%; width:16px; height:2px; background:#b0b0b0; margin-left:-8px; transition:all .20s}
.drive-wrap .pannel-close .close-btn:before{top:-1px; transform:translateY(0.9rem) rotate(-45deg);}
.drive-wrap .pannel-close .close-btn:after{top:-1px; transform:translateY(0.9rem) rotate(45deg);}
.drive-wrap .pannel-close .close-btn:hover:before,
.drive-wrap .pannel-close .close-btn:hover:after{background:#555}

.drive-wrap .main-thumb{display:flex; flex:1 0 auto; align-items:flex-start; flex-direction:column; position:relative; width:100%; /*padding:8px*/}
.drive-wrap .thumb-item{display:flex; align-items:center; margin-bottom:20px}
.drive-wrap .thumb-item .tit{font-size:16px; font-weight:600; color:#222; letter-spacing:-0.5px}
.drive-wrap .thumb-item .item-list:after{content:''; display:block; clear:both}
.drive-wrap .thumb-item .item-list li{position:relative; float:left; margin-right:12px; padding-right:12px}
.drive-wrap .thumb-item .item-list li:after{content:"\e93f"; position:absolute; right:-8px; top:4px; font-family:"xeicon"; font-size:14px; color:#888}
.drive-wrap .thumb-item .item-list li:last-child:after{display:none}
.drive-wrap .thumb-item .item-depth{font-size:15px; font-weight:300; color:#888; letter-spacing:-0.5px}
.drive-wrap .thumb-item .item-list li:last-child .item-depth{color:#222}
.drive-wrap .main-thumb .thumb-list{display:flex; width:100%; flex-wrap:wrap}

.drive-wrap .empty-list,
.drive-wrap .warn-list{display:flex; align-items:center; justify-content:center; width:100%; height:100%}
.drive-wrap .empty-list .empty,
.drive-wrap .warn-list .warn{display:flex; flex-direction:column; justify-content:center; align-items:center; font-size:15px; color:#888; font-weight:normal}
.drive-wrap .empty-list .empty:before{content:''; display:flex; justify-content:center; align-items:center; width:39px; height:43px; margin-bottom:10px; background: url("/static/fw/images/common/no_file_drive.png") 50% 50% no-repeat;}

.drive-wrap .warn-list .warn i{font-size:35px; color:#ccc; margin-bottom:8px}

.drive-wrap .empty-list .empty .tit,
.drive-wrap .empty-list .empty .info,
.drive-wrap .warn-list .warn .tit{letter-spacing:-0.5px; line-height:135%; font-weight:normal}
.drive-wrap .empty-list .empty .tit,
.drive-wrap .warn-list .warn .tit{color:#555; font-size:16px}
.drive-wrap .empty-list .empty .info,
.drive-wrap .warn-list .warn .info{margin-top:5px; color:#999; font-size:14px}

/* 드라이브 이전 */
.drive-wrap .main-thumb .thumb-list .thumb{display:flex;  align-items:center; justify-content:flex-end; flex-direction:column; -webkit-box-orient:vertical; position:relative; width:200px; height:180px; border-radius:10px}
.drive-wrap .main-thumb .thumb-list .thumb:hover,
.drive-wrap .main-thumb .thumb-list .thumb.selected{background:#fafafa}
.drive-wrap .main-thumb .thumb-list .thumb .thumb-content{flex:1; display:inline-block; height:80px; margin:16px 16px 0 16px; border-radius:5px; overflow:hidden}
.drive-wrap .main-thumb .thumb-list .thumb .thumb-content .content{align-items:center; flex-direction:column; justify-content:center; top:12px; left:4px; right:4px; bottom:4px; max-width:100%; max-height:100%; min-width:32px; min-height:32px; overflow:hidden}
.drive-wrap .main-thumb .thumb-list .thumb .folder-content{display:inline-flex; align-items:flex-end; flex-direction:row; position:relative; width:112px; height:80px; margin:16px 16px 10px; vertical-align:bottom; cursor:pointer;}
.drive-wrap .main-thumb .thumb-list .thumb.folder.secret .folder-content{display: block}
.drive-wrap .main-thumb .thumb-list .thumb.folder .folder-content .back{display:block; position:absolute; left:-3px; right:-3px; bottom:-18px} 
.drive-wrap .main-thumb .thumb-list .thumb.folder .folder-content .front{display:block; position:absolute; left:-3px; right:-3px; bottom:-19px}
.drive-wrap .main-thumb .thumb-list .thumb.folder .folder-content .content{display:inline-flex; align-items:center; flex-direction:column; justify-content:center; position:absolute; max-width:100%; max-height:100%; min-width:32px; min-height:32px; top:25px; left:4px; right:4px; bottom:4px; overflow:hidden;}
.drive-wrap .main-thumb .thumb-list .thumb.folder .folder-content .metadata{display:block; flex:1 1; position:relative; margin-right:8px; margin-bottom:6px; font-weight:400; text-align:right; font-size:16px; color:#00000066;}
.drive-wrap .main-thumb .thumb-list .thumb.folder .folder-content .signal{display:block; position:relative; margin-right:7px; margin-bottom:6px; font-size:16px; color:#3480b7;}
.drive-wrap .main-thumb .thumb-list .thumb .folder-info{margin: 8px 0px 16px; flex-direction: column; align-items: center; text-align: center; cursor: pointer;}
.drive-wrap .main-thumb .thumb-list .thumb .folder-info .tit{font-size: 14px; width: 200px; padding:0px 8px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden}
.drive-wrap .main-thumb .thumb-list .thumb .folder-info .time{font-size: 12px; color: #a5a5a5; white-space: nowrap; text-overflow: ellipsis;}
.drive-wrap .main-thumb .thumb-list .thumb .ImageCheckbox.drive{display: none; position: absolute; right: 10px; top: 10px;}

.drive-wrap .thumb-list .thumb .Progressbar{position:absolute; width:130px; height:5px; margin:8px 0px}
.drive-wrap .thumb_list .thumb .Progressbar{width:100%; height:5px; margin:8px 0px}
.drive-wrap .Label {position:absolute; right:38px; top:24px; font-size:10px; color:#fff; background:#0000008f; height:16px; padding:1px 4px 2px; text-align:right; border-radius:2px; vertical-align:middle; box-sizing:border-box}
.drive-wrap .Label span{font-size:10px; color:#ffffff91; margin-right: 2px;}
.drive-wrap .convert{position:absolute; display:flex; justify-content:center;align-items:center; bottom:80px; left:40px; width:24px; height:24px; background:#fff; border:2px solid #0196fa; border-radius: 50%; box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 8%)}
.drive-wrap .convert i{color:#5629ee; font-size: 18px; padding:4px 0px 2px}

/* 드라이브 리뉴얼 */
.drive-wrap .main-thumb .thumb_list{display:flex; width:100%; flex-wrap:wrap}
.drive-wrap .main-thumb .thumb_list .thumb{background:#fcfcfc; border:1px solid #f6f5fa; position:relative; width:240px; height:200px; border-radius:10px; padding:13px 15px; margin:0px 10px 10px 0px}
.drive-wrap .main-thumb .thumb_list .thumb.active{background:#f6f5fa !important; border:1px solid #cec3f9 !important}
.drive-wrap .main-thumb .thumb_list .thumb:hover, .drive-wrap .main-thumb .thumb-list .thumb.selected{background:#f6f5fa}
.drive-wrap .main-thumb .thumb_list .file_info{/*margin-bottom:3px;*/ flex-direction:column; align-items:center; text-align:left; cursor:pointer; position:absolute; bottom:13px; width:calc(100% - 30px)}
.drive-wrap .main-thumb .thumb_list .file_info .info_cont{display:flex; justify-content:space-between; align-items:center}
.drive-wrap .main-thumb .thumb_list .file_info .tit{font-size:15px; color:#222; /*width:190px;*/ overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.drive-wrap .main-thumb .thumb_list .file_info .time{font-size:13px; color:#999}
.drive-wrap .main-thumb .thumb_list .file_info .user{font-size:13px; color:#555}
.drive-wrap .main-thumb .thumb_list .file_info .user i{margin-right:2px}
.drive-wrap .main-thumb .thumb_list .thumb .file_cont{display:flex; justify-content:center; align-items:center; /*background:#fff; border:1px solid #eaeaea; border-radius:10px;*/ height:95px; cursor:pointer; position:absolute; width:calc(100% - 30px); top:40px}
.drive-wrap .main-thumb .thumb_list .thumb .file_cont .file_inner{position:relative; width:100%; height:100%; display:flex; justify-content:center}
.drive-wrap .main-thumb .thumb_list .thumb .file_cont .file_inner .img{box-shadow:2px 1px 8px 0 rgb(0 0 0 / 12%)}
.drive-wrap .main-thumb .thumb_list .thumb.folder .file_cont .file_inner .back{display:block; position:absolute; left:-3px; right:-3px; bottom:-18px}
.drive-wrap .main-thumb .thumb_list .thumb.folder .file_cont .file_inner .front{display:block; position:absolute; left:-3px; right:-3px; bottom:-19px}
.drive-wrap .main-thumb .thumb_list .thumb .ImageCheckbox.drive{position:absolute; top:10px; right:10px; display:none}
.drive-wrap .main-thumb .thumb_list .thumb .state_list{display:flex; align-items:center}
.drive-wrap .main-thumb .thumb_list .thumb .state_list li span{font-size:17px; color:#555; margin-left:5px}
.drive-wrap .main-thumb .thumb_list .thumb .state_list li:first-child span{margin-left:0}
.drive-wrap .Label.ver{position:absolute; top:60px; right:50px; font-size:12px; background:#00000070; color:#fff; height:18px; line-height:18px; border-radius:3px; padding:0px 6px}
.drive-wrap .Label.ver span{color:#ffffffde}

.drive-wrap .main-thumb .thumb_list .thumb.folder{display:flex; flex-direction:column; justify-content:space-evenly; background:#fff; border:0}
.drive-wrap .main-thumb .thumb_list .thumb.folder:hover, .drive-wrap .main-thumb .thumb-list .thumb.folder.selected{background:#f6f5fa}
.drive-wrap .main-thumb .thumb_list .thumb .folder-content{display:flex; justify-content:center}
.drive-wrap .main-thumb .thumb_list .thumb .folder-content .folder_inner{position:relative; width:120px; height:100px; cursor:pointer;}
.drive-wrap .main-thumb .thumb_list .thumb.folder .folder-content .back{display:block; position:absolute; left:-3px; right:-3px; bottom:-18px} 
.drive-wrap .main-thumb .thumb_list .thumb.folder .folder-content .front{display:block; position:absolute; left:-3px; right:-3px; bottom:-19px}
.drive-wrap .main-thumb .thumb_list .thumb.folder .folder-content .content{display:inline-flex; align-items:center; flex-direction:column; justify-content:center; position:absolute; max-width:100%; max-height:100%; min-width:32px; min-height:32px; top:25px; left:4px; right:4px; bottom:4px; overflow:hidden;}
.drive-wrap .main-thumb .thumb_list .thumb .folder-info{flex-direction: column; align-items: center; text-align: center; cursor: pointer;}
.drive-wrap .main-thumb .thumb_list .thumb .folder-info .tit{font-size:15px; color:#222; /*width:200px;*/ padding:0px 8px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.drive-wrap .main-thumb .thumb_list .thumb .folder-info .time{font-size:13px; color: #a5a5a5; white-space:nowrap; text-overflow:ellipsis; margin-top:3px}

.drive-wrap .drive-overlay,
.drive-wrap .drive-overlay.drive_list,
.drive-wrap .drive-overlay.drive_icon{width:calc(100% - 300px); height:calc(100% - 295px); background:rgba(0, 0, 0, 0.5); position:fixed; top:auto; left:300px; bottom:0; border:3px solid #5629ee; display:flex; justify-content:center; align-items: center; z-index:1; pointer-events:none}
.drive-wrap .drive-overlay .txt-wrap{display:flex; flex-direction:column; justify-content:center; align-items: center; font-size:16px; color:#fff}
.drive-wrap .drive-overlay .txt-wrap::before{display:flex; justify-content:center;  align-items: center; width:80px; height:80px; border-radius: 50%; content: "\ea8a"; font-family:"xeicon"; font-size: 32px; background:#5629ee; margin-bottom: 16px;}

.drive-wrap .drop_zone{position:fixed; width:calc(100% - 300px); height:calc(100% - 295px)}

.drive-wrap .drive-overlay.drive_list{width:1520px; height:458px; top:408px; left:351px}
.drive-wrap .drive-overlay.drive_icon{width:1520px; height:505px; top:363px; left:351px}

.drive-wrap .pannel-preview{display:none; position:absolute; right:16px; top:20px; width:700px; height:calc(100% - 40px); background:#fff; overflow:hidden; overflow-y:auto; box-shadow:0 0 8px rgb(0 0 0 / 20%); z-index:3; border-radius:20px}
.drive-wrap .pannel-preview .preview-top-btn{position:absolute; top:8px; left:8px;}
.drive-wrap .pannel-preview .preview-top-btn i{color:#999;}
.drive-wrap .pannel-preview .preview-cont{width:660px; margin:0 auto; margin-top: 32px; padding:4px; padding-bottom:24px;}
.drive-wrap .pannel-preview .preview-cont .preview-img{display:flex; width:100%; height:auto;justify-content:center; background:#f4f4f4; }
.drive-wrap .pannel-preview .preview-cont .tit{font-size: 13px; color:#adadad; display:flex; justify-content:space-between;  margin-right: 8px; margin-top:16px;}
.drive-wrap .pannel-preview .preview-cont .txt{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; font-size: 13px; width:100%; color:#555;padding-right:4px; margin:8px  0px 16px 0px; text-overflow:ellipsis; overflow:hidden;}
.drive-wrap .pannel-preview .preview-cont .cont-btn{margin:8px 0px;}
.drive-wrap .pannel-preview .preview-cont .cont-btn .Button{border-radius:100px; background:#f2edff; color:#5629ee; border:0}


/* qms 이미지 썸네일 */
.drive-wrap.qms_file .drive-content{padding:0; overflow:initial}
.drive-wrap.qms_file .main-thumb{height:100%}
.drive-wrap.qms_file .main-thumb .thumb_list .thumb{width:180px; height:180px; padding:0}
.drive-wrap.qms_file .main-thumb .thumb_list .thumb .file_cont{position:initial; width:100%; height:100%; padding:10px}

/* doc-convert - qms */
.doc-convert.qms_file{position:absolute; top:calc(100% - 430px); left:calc(100% - 450px); padding:0; border:0}
.doc-convert.qms_file .convert-loader60{margin-top:0}


/* 공유이력 팝업 */
.jqx-grid .jqx-grid-cell-center-align.shared{display:flex}
.jqx-grid .jqx-grid-cell-center-align.shared .signal-color:before{top:3px}
.layerpop-box .drive_share .Table-wrapper.Table-wrapper{border:1px solid #eaeaea; padding:15px}
.Table.Form-type tbody td.shared_position{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

.drive_wrap .writing-ty1.form-box.work_details{border:1px solid #b7afd48c; border-radius:8px; height:120px; display:flex; align-items:center}
.drive_wrap .writing-ty1.form-box.work_details .writing-tit{position:fixed; min-width:100px}
.drive_wrap .writing-ty1.form-box.work_details .writing-tit .tit{font-weight:300}
.drive_wrap .writing-ty1.form-box.work_details .writing-cont{min-width:600px; position:absolute; left:100px}
.drive_wrap .writing-ty1.form-box.work_details_guide{border-radius:8px; background: #f6f5fa; height:120px; border:0; display:flex; justify-content:center; align-items:center}
.drive_wrap .writing-ty1.form-box.work_details_guide .writing-tit .tit{color: #5629ee; display:flex; align-items:center}
.drive_wrap .writing-ty1.form-box.work_details_guide .writing-tit .tit i{font-size:20px; color:#cac4e4}


.fixConWrap.drive .fixCont1,
.fixConWrap.drive .fixCont2,
.fixConWrap.drive .fixCont3{margin:4px;}

.fixConWrap.drive .graph-area{display:contents;}
.fixConWrap.drive-folder {flex-direction:column; align-items:stretch;}
.fixConWrap.drive-folder .form-box{position:relative; border-radius: 8px; flex:1 auto; display:flex; align-items:center; margin-bottom: 8px;}
.fixConWrap.drive-folder .form-box .icon{width:80px; text-align: center;}
.fixConWrap.drive-folder .form-box .icon svg{width:36px; height:36px;}
.fixConWrap.drive-folder .form-box .drive-info li{padding:2px 0px;}
.fixConWrap.drive-folder .form-box .drive-info li > ul > li{display:inline-block; margin-right: 20px;}
.fixConWrap.drive-folder .form-box .drive-info li span{position:relative; padding-left: 10px; font-size: 14px;}
.fixConWrap.drive-folder .form-box .drive-info li span::before{position:absolute; top:7px; content:""; display:block; width:4px; height:4px; background:#000; border-radius: 50%;}
.fixConWrap.drive-folder .form-box .folder-tit{display:flex; flex-direction:column; align-items:center; width:220px; padding:0px 16px; text-align: center;}
.fixConWrap.drive-folder .form-box .folder-tit .stit04{text-overflow:ellipsis; white-space:nowrap; overflow:hidden; width:200px;}
.fixConWrap.drive-folder .form-box .folder-tit span{color:#999; font-size: 12px;}


#spanFileAllowCnt.label,
#spanFileAllowSize.label{padding-top:3px}

/* toolkit 템플릿 상세 */

.doc-master .docform-ty2{margin:5px 0px; }

.doc-master .docform-ty2 .writing-list{border:1px solid #dadada; border-radius:8px}

.doc-master .docform-ty2 .writing-list > li{border:initial}
.doc-master .docform-ty2:first-child .writing-list > li{border:initial}
.doc-master .docform-ty2 .writing-tit{display:flex;  cursor:grab; align-items:center; min-height:50px; padding:0 10px; background:#f9fafc; box-sizing:border-box; border:initial; border-radius:8px 0 0 8px}
.doc-master .docform-ty2 .writing-tit:active {cursor: grabbing;}
.doc-master .docform-ty2 .writing-tit .tit{display:inline-block; font-size:15px; letter-spacing:-0.5px; color:#202020; font-weight:300; vertical-align:middle}
.doc-master .docform-ty2 .writing-tit img{width:20px}
.doc-view .doc-master .docform-ty2 .writing-cont{flex:auto; padding:11px; align-items: flex-start; flex-direction: column;}
.doc-master .docform-ty2 .writing-cont .col-row{display:flex; flex-direction:column; flex:auto}
.doc-master .docform-ty2 .writing-cont .col-row .row{display:flex; align-items:center; }
.doc-master .docform-ty2 .writing-cont .col-row .row .spider{flex:auto;}
.doc-master .docpilot-step .writing-ty1 .writing-list:first-child{border:0}

.doc-master .docform-ty2 .position-controll .option-viw,
.doc-master .docform-ty2 .position-controll .option-fix{position:absolute; right:8px; color:#555; font-size:14px; cursor:pointer; z-index:1}
.doc-master .docform-ty2 .position-controll .option-viw{top:10px}
.doc-master .docform-ty2 .position-controll .option-fix{bottom:8px}
.doc-master .docform-ty2 .position-controll .option-fix.active{color:#5629ee}

.doc-master .docform-ty2 .controll-list{position:relative; bottom:0px; width:100%; display: flex; align-items: center; margin-top: 8px;}
.doc-master .docform-ty2 .position-controll .list-group{content: ""; display: inline; border-left:1px solid #dadada; margin-left: 10px; }

/*
.doc-master .docform-ty2 .position-controll:hover .controll-list,
.doc-master .docform-ty2 .position-controll:active .controll-list{display: block;}*/

.doc-master .docform-ty2 .controll-select{position: absolute; top:7px; right: 30px; text-align: right;}

.doc-master .docform-ty2 .controll-select li{ position: relative; float: left; color: #808080; padding: 0 7px; line-height: 1.5; font-size: 13px; letter-spacing: -0.6px;}
.doc-master .docform-ty2 .controll-select li:before{content:''; position: absolute; right: 0; top: 50%; width: 1px; height: 12px; margin-top: -6px; background-color: #dadada;}
.doc-master .docform-ty2 .controll-select li:last-child:before{display: none;}
.doc-master .check-list02 li{border:0}

.controll-block{width: 160px; display: block; border: 1px solid #d1d1d1; border-radius: 6px; padding: 4px 12px; background: #fff; z-index: 99999999;}

.controll-block li{margin: 4px 0px; float: none; display: block; position:relative;}
.controll-block li:hover .ImageCheckbox span,
.controll-block li:hover .ImageCheckbox:after,
.controll-block li:hover .IconLabel span,
.controll-block li:hover .IconLabel:after,
.controll-block li:hover .IconLabel i,
.controll-block li:hover .Label span,
.controll-block li:hover .Label::after{color: #5629ee;}
.controll-block .list-group{display: block; border-top:1px solid #dadada; margin: 8px 0px;}
.controll-block li > ul{display:none; position:absolute; width: 160px; left:calc(100% + 6px); border: 1px solid #d1d1d1; border-radius: 6px; padding: 4px 12px; background: #fff; top:-9px; box-shadow:-2px 0px 3px #00000008;}
.controll-block li:hover ul li .IconLabel span,
.controll-block li:hover ul li .IconLabel:after,
.controll-block li:hover ul li .IconLabel i {color:#505050} 
.controll-block li.active > ul{display:block;}

.controll-block li.active > ul li:hover .ImageCheckbox span,
.controll-block li.active > ul li:hover .ImageCheckbox:after,
.controll-block li.active > ul li:hover .IconLabel span,
.controll-block li.active > ul li:hover .IconLabel:after,
.controll-block li.active > ul li:hover .IconLabel i,
.controll-block li.active > ul li:hover .Label span,
.controll-block li.active > ul li:hover .Label::after{color:#5629ee;}
.controll-block li:hover > ul li:hover .ImageCheckbox span,
.controll-block li:hover > ul li:hover .ImageCheckbox:after,
.controll-block li:hover > ul li:hover .IconLabel span,
.controll-block li:hover > ul li:hover .IconLabel:after,
.controll-block li:hover > ul li:hover .IconLabel i,
.controll-block li:hover > ul li:hover .Label span,
.controll-block li:hover > ul li:hover .Label::after{color:#5629ee;}
.controll-block li i.arrow{position:absolute; right:-2px; text-align:right; color:#ccc}
.controll-block .controll-list{display:block !important}
.controll-block label.select i{color:#5629eec4;}
.controll-block label.select span{color:#5629eec4; text-decoration:underline;}
.controll-block li:hover ul li label.select i,
.controll-block li > ul li label.select i{color:#5629eec4;}
.controll-block li:hover ul li label.select span,
.controll-block li > ul li label.select span{color:#5629eec4; text-decoration:underline;}

.helpGuide > li{display: flex; align-items: center;}
.helpGuide > li span{margin-left: 8px;}
.helpGuide > li::before{display: block; content:""; width: 3px; height: 3px; background: #b2b2b2;}

.layerpop-box .fixConWrap.approval .fixCont3{padding-top:0px;}
.dev-content.join{display: flex; justify-content: center;}

/* .aprv-wrap.edit{align-items:flex-start; flex-direction:row;}
.aprv-wrap.edit .sum-approval{display:inline-table; width:auto}
.aprv-wrap.edit .com-table{width:220px;}
.aprv-wrap.edit .com-table .Table{
 min-width:200px;
 max-width: 200px;
 table-layout:auto !important;
 border:none;
}
.aprv-wrap.edit .com-table tr{
 display:flex;
 flex-direction:column;
 flex-direction:row;
 flex-wrap:wrap;
 align-items:center;
 border:none;
}
.aprv-wrap.edit .Table.Form-type tbody tr th:first-of-type{border-left:1px solid #dcdfe2}
.aprv-wrap.edit .com-table tr td{flex:1; border:none;}
 */

.grap-wrap{display:flex;}

#driveList .jqx-grid-empty-cell span:before{display:none}


/* drive list - 드라이브 리스트 형식 */
.cell_head{border-top:1px solid #ccc; border-bottom:1px solid #ddd; padding-right:8px}
.cell_head .cell_tit, .cell_cont .cell_list{display:table; table-layout:fixed; width:100%}
.cell_head .cell_tit .cell, .cell_cont .cell_list .cell{display:table-cell; text-align:center; padding:10px 5px; color:#555; height:44px; vertical-align:middle}
.cell_cont .cell_list .cell{border-bottom:1px solid #eaeaea}
.cell_cont .cell_list .cell .Progressbar{height:5px; margin-top:5px}
.cell_tit .cell.check, .cell_list .cell.check{width:40px}
.cell_tit .cell.check .ImageCheckbox.drive > .Checkbox,  .cell_list .cell.check .ImageCheckbox.drive > .Checkbox,
.cell_tit .cell.check .ImageCheckbox.drive:after, .cell_list .cell.check .ImageCheckbox.drive:after{width:18px; height:18px}
.cell_tit .cell.check .ImageCheckbox.drive.Checked:after, .cell_list .cell.check .ImageCheckbox.drive.Checked:after{font-size:15px}
.cell_tit .cell.type, .cell_list .cell.type{width:60px}
.cell_list .cell.type img{width:20px; height:20px; vertical-align:middle}
.cell_list .cell.type i{font-size:20px; vertical-align:middle}
.cell_tit .cell.ver, .cell_list .cell.ver{width:60px}
.cell_tit .cell.name, .cell_list .cell.name{text-align:left; }
.cell_list .cell.name{color:#333; cursor:pointer; min-width:340px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.cell_tit .cell.state, .cell_list .cell.state{width:130px; text-align:left}
.cell_list .cell.state span{font-size:18px; line-height:18px; margin-left:5px}
.cell_list .cell.state span:first-child{margin-left:0}
.cell_tit .cell.size, .cell_list .cell.size{width:80px}
.cell_list .cell.size{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cell_tit .cell.date, .cell_list .cell.date{width:200px}
.cell_list .cell.size, .cell_list .cell.date, .cell_list .cell.ver, .cell_list .cell.user{color:#999}
.cell_tit .cell.user, .cell_list .cell.user{width:120px}

.cell_cont .cell_list > li{display:table-row; height:44px}
.cell_cont .cell_list > li:hover{background:#fafafa}
.cell_cont .cell_list > li.active{background:#f6f5fa}

.drive_scroll,
.drive_scroll_icon{overflow-y:scroll; height:458px; width:100%; border-bottom:1px solid #eaeaea}
.drive_scroll_icon{height:505px; border-top:1px solid #ddd; padding:15px 0px 5px 0px}

.drive_footer{display:flex; align-items:center; justify-content:space-between; margin-top:20px; width:100%}

.drive_footer .total span{font-size:15px; color:#555}
.drive_footer .total .count{margin-left:5px; color:#5629ee}

.drive_paging{display:flex; justify-content:center; align-items:center}
.drive_paging .paging_btn button{border:0; background:none; cursor:pointer; width:30px; height:30px; font-size:15px; background:#fafafa; border:1px solid #eaeaea; border-radius:1000px}
.drive_paging .controll_btn{display:flex}
.drive_paging .controll_btn .paging_btn button{line-height:28px}
.drive_paging .controll_btn .paging_btn button i{font-size:17px; color:#888}
.drive_paging .controll_btn .paging_btn:hover button{border:1px solid #ddd; border-radius:1000px}
.drive_paging .controll_btn .paging_btn.active button{border:1px solid #cec3f9; background:#f2edff; border-radius:1000px}
.drive_paging .controll_btn .paging_btn:hover button i{color:#5629ee}
.drive_paging .controll_btn .paging_btn.active button i{color:#5629ee}
.drive_paging .paging_btn.numb{margin:0 15px}
.drive_paging .paging_btn.numb button.numb{background:none; border:0; border-radius:0; color:#888; margin-left:5px}
.drive_paging .paging_btn.numb button.numb:first-child{margin-left:0}
.drive_paging .paging_btn.numb button.numb:hover{color:#333}
.drive_paging .paging_btn.numb .numb.active{color:#5629ee; border-bottom:1px solid #5629ee}
.drive_paging .paging_btn.prev{margin-left:5px}
.drive_paging .paging_btn.next{margin-right:5px}

/* 드라이브 공유이력 팝업 */
.stitArea.drive_history{margin-bottom:0px}
.stitArea.drive_history .stitL span.shared{background: #5629ee; border-radius:1000px; color: #fff; padding:2px 8px; margin-right:8px; font-size:14px}


/* **************************************** *
*  Tree
* **************************************** */
.treeBox .Button.round-max{width:8px; height:8px; font-size:0; padding:0}




/* **************************************** *
*  toolbar-util
* **************************************** */

.toolbar-util .custom-list li > .push-box{position:relative; padding:14px 24px}

.toolbar-util .custom-list .push-box .tit-area{display:flex}
.toolbar-util .custom-list .push-box .tit-area .tit-l{flex:1 auto; display:flex}
.toolbar-util .custom-list .push-box .tit-area .tit-l > div,
.toolbar-util .custom-list .push-box .tit-area .tit-l > a > div{display:flex; align-items:center; max-width:100%; margin-bottom: 4px;}

.toolbar-util .custom-list .push-box .tit-area .tit-l .tit{flex:1; display:block; font-size:15px; letter-spacing:-0.6px; text-overflow:ellipsis; white-space:nowrap; font-weight:300; overflow:hidden; color:#333}
.toolbar-util .custom-list .push-box .tit-area .tit-l .tit span{font-weight:normal; font-size:11px; margin-left:8px; color:#a5a5a5;}

.toolbar-util .custom-list .push-box .tit-area .tit-l .date{float:right; margin-bottom: 6px; font-size: 12px; color:#a5a5a5 ; padding:0px; font-weight: 400;}
.toolbar-util .custom-list .push-box .btn-r {display:flex;  cursor:pointer}
.toolbar-util .custom-list .push-box .btn-r .col-delete i{font-size: 23px; color:#b1b1b1;}

.toolbar-util .custom-list .push-box .cont-area{color:#777; font-size:14px; letter-spacing:-0.5px; width:100%; min-height:23px; max-height:46px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2;  -webkit-box-orient:vertical}

.toolbar-util .custom-list .push-box .foot-area{display:flex; margin-top:10px}
.toolbar-util .custom-list .push-box .foot-area .date{font-size:13px; color:#aaa; letter-spacing:-0.2px}
.toolbar-util .custom-list .push-box .foot-area .btn-r{display:flex; align-items:center; margin-left:auto}

.toolbar-util .custom-list .push-box .controll{position:relative; margin-left:10px; line-height:110%; color:#555; letter-spacing:-0.8px}
.toolbar-util .custom-list .push-box .controll span{font-size:13px}
.toolbar-util .custom-list .push-box .controll.read{color:#333}
.toolbar-util .custom-list .push-box .controll.read-not{color:#999}
.toolbar-util .custom-list .push-box .controll.delete{color:#fe657b}
.toolbar-util .custom-list .push-box .controll.delete:hover:before{content:''; position:absolute; bottom:0; left:0; width:100%; height:1px; background-color:#fe657b}

.toolbar-util .custom-list .push-box .ImageCheckbox:after{content:"\e92c"; color:#e1e1e1; font-size:22px;}
.toolbar-util .custom-list .push-box .ImageCheckbox.Checked:after{content:"\e92b"; color:#5629ee; font-size:22px;}

.invite-wrap{padding-bottom:15px;}

.toolbar-util .custom-list .push-box .tit-area .tit-l > a > div .Label-color{border-radius: 50px; padding:2px 8px; height:22px; line-height:100%}



/* **************************************** *
*  join 
* **************************************** */

.join-wrap{display: flex; flex-direction: column; align-items:center; width: 650px;}
.join-wrap .Textinput{height: 40px;}
.join-wrap .writing-ty1 .writing-tit .tit{font-size: 14px;}
.join-wrap .writing-ty1 .writing-list{border:none;}
.join-wrap .writing-ty1 .writing-list > li{padding:16px 0px}

.login-layout .dev-content{position:initial}

.login-layout .stitArea{justify-content:center; }
.login-layout  h2.stit02{font-weight: 300; font-size: 28px; color:#333}
.login-layout .stitArea h2 span.color-blue1{font-size:28px;}
.login-layout .stitArea h4{font-size: 16px; color:#999}
.login-layout .stitArea h3 span{font-size: 14px;}
.login-layout .Table .Button{margin-left: 4px;}
.login-layout .com-table.info-box .Table.Form-type tbody td,
.login-layout .fixConWrap{margin:0 auto}
.login-layout .com-table.top-line .Table-wrapper{padding:0px; margin-top: 36px; border:0px}

.login-layout .btnwrap{display:flex;justify-content:center;}
.login-layout .btnwrap .Button{border-radius: 0px; background:#f4f4f4; font-size: 16px; border:0px; color:#555}
.login-layout .btnwrap .Button.primary{background:#1d1340; color:#fff }
.login-layout .btnwrap .Button.info{background:#5629ee; color:#fff }


/* 이용동의 */
#agreeInfo .ImageCheckbox::after{content: "\e929"; color:#aaa; font-size: 19px;  border-radius: 50%; padding:2px;  display:flex; justify-content:center; border:2px solid #aaa}
#agreeInfo .ImageCheckbox.Checked:after{color:#fff; background:#5629ee; border:2px solid #5629ee;}
#agreeInfo .ImageCheckbox > span{color:#999; font-weight:normal; font-size: 16px; letter-spacing:-0.8px; margin-left: 8px;}
#agreeInfo .ImageCheckbox.Checked > span{color:#555;}
#agreeInfo .ImageCheckbox span.color-blue1{font-size: 16px;}
#agreeInfo .ImageCheckbox > .Checkbox{height:38px;}
#agreeInfo table th{padding:0px; }
#agreeInfo table td{padding:8px 0px;}
#agreeInfo table{position:relative;}
#agreeInfo table tr.chkAll th,
#agreeInfo table tr.chkAll td{border-bottom:1px solid #eaeaea; padding-bottom: 18px;}
#agreeInfo table .Button{border:0px; color:#aaa; font-size: 14px; background:none; padding:0px} 
#agreeInfo table .Button:hover{color:#5629ee}
#agreeInfo table .Button i{margin-left: 8px; font-size: 16px;}


/* 본인인증 */

#divCertify::before{content:""; display:block; position:absolute; left:0px; background:#fafafa; width:100%; height:60%; z-index: -1; bottom:0px;}
#divCertify .info-msg{background:#f2edff; display:block; border-radius: 5px; padding:8px 24px; font-size: 14px ; color:#5629ee; width:100%;}
#divCertify .certify-btnwrap{display:flex; justify-content:space-between}
#divCertify .certify-btnwrap .Button{display:flex; justify-content:center; align-items:center;flex-direction:column; color:#333; font-size: 16px; border-radius: 50%; height:134px; width:134px; word-break:keep-all; border:0px; box-shadow:0px 3px 12px #5629ee12; } 
#divCertify .certify-btnwrap .Button:hover{background:#5629ee; color:#fff}
#divCertify .certify-btnwrap .Button:hover i{color:#fff}
#divCertify .certify-btnwrap .Button i{font-size: 28px; margin-bottom: 16px; color:#555}


/* 회원정보 입력*/
#saveMemberInfo .require:after{color:#5629ee}
#saveMemberInfo .Table tr{height:70px;}
#saveMemberInfo .Table tr th,
#saveMemberInfo .Table tr td{vertical-align:initial;}
#saveMemberInfo .Table tr th{font-size: 16px;}
#saveMemberInfo .Table tr td.col{display:flex; flex-direction:column}
#saveMemberInfo .Table tr td i.rep-check{font-size: 16px; padding:4px; margin-top: 8px; vertical-align:middle; margin-left: 8px; color:#aaa; border:2px solid; border-radius: 50%;}
#saveMemberInfo .Table tr td i.rep-check.checked{color:#5629ee;}
#saveMemberInfo .Table tr td span.msg-box{font-size:13px; margin-top:8px; color:#5729ee; padding-left: 8px; letter-spacing: -0.8px;}
#saveMemberInfo .Table tr td .email-form{position:relative}
#saveMemberInfo .Table tr td .email-form input{padding-right: 120px;}
#saveMemberInfo .Table tr td .email-form .Button{position:absolute; right:0px; border-radius:0px 8px 8px 0px; background:#1d1340; border-color:#1d1340; color:#fff}
#saveMemberInfo .company-info{margin-bottom:40px;}
#saveMemberInfo .company-info .stitArea{border-top:1px solid #aaa; border-bottom: 1px solid #ddd; padding:8px 16px;} 
#saveMemberInfo .company-info .stitArea h3.stit03{font-size: 21px; font-weight: 300; color:#333}
#saveMemberInfo .company-info .stitArea .switch span{font-size:14px; color:#555; letter-spacing: -0.5px;}
#saveMemberInfo .company-info .cpyNo input{position:relative;}
#saveMemberInfo .company-info .cpyNo .Button{position:absolute; right:50px; border:0px; background:transparent; color:#5729ee}




/* **************************************** *
*  admin-main
* **************************************** */
.admin-main .form-box{position:relative; border-radius:8px;}
.admin-main .form-box ul li{font-size:14px;}
.admin-main .fixCont1{display:flex; flex-wrap:wrap; box-sizing:border-box;}
.admin-main .fixCont1 .form-box{position:relative; display:flex; background:#fff; margin:4px; height:140px; color:#555; align-items:center; box-shadow: 0 3px 6px 0 rgb(0 0 0 / 5%), 0 0 3px 0 rgb(0 0 0 / 10%); border:none; width:19.4%; max-width: 320px; cursor:pointer}
.admin-main .fixCont1 .form-box:hover{background:#fafafa}
.admin-main .fixCont1 .form-box:before{content:'\e943'; position:absolute; top:50%; right:15px; margin-top:-11px; font-family:xeicon; font-size:25px; color: #999; transform:rotate(-90deg)}
.admin-main .fixCont1 .form-box .icon{display:flex; justify-content:center; margin:0px 8px}
.admin-main .fixCont1 .form-box .icon i{font-size:38px; color:#333}
.admin-main .fixCont1 .form-box:nth-child(1) .icon i{background:linear-gradient(150deg, #946ad4, #623c9b); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(2) .icon i{background:linear-gradient(150deg, #5593d8, #295280); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(3) .icon i{background:linear-gradient(150deg, #d8747b, #8d3238); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(4) .icon i{background:linear-gradient(150deg, #74afc3, #376d80); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(5) .icon i{background:linear-gradient(150deg, #3b5ab3, #173790); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(6) .icon i{background:linear-gradient(150deg, #6763b9, #39358d); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(7) .icon i{background:linear-gradient(150deg, #77baaa, #317e6b); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(8) .icon i{background:linear-gradient(150deg, #7986e8, #505db9); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(9) .icon i{background:linear-gradient(150deg, #946eed, #6647ac); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box:nth-child(10) .icon i{background:linear-gradient(150deg, #f18e4d, #b1591f); color:transparent; -webkit-background-clip:text}
.admin-main .fixCont1 .form-box ul {flex: 1; margin-left: 8px;}
.admin-main .fixCont1 .form-box ul li{font-size:14px; text-overflow:ellipsis; white-space: nowrap; overflow:hidden; width:150px;}
.admin-main .fixCont1 .form-box ul .form-tit{font-size:18px; font-weight:300; color:#333}

.admin-main .fixCont2 {margin-top:40px; display:flex;}
.admin-main .fixCont2 .form-box{margin:4px;}
.admin-main .fixCont2 .stitArea{margin-top:16px;}
.admin-main .fixCont2  ul li{padding:4px 0px; letter-spacing: -0.5px; color:#333}
.admin-main .fixCont2  ul li span.fr{font-weight: 300; color:#5629ee}
.admin-main .fixCont2  ul li span.key_cont{overflow:hidden; white-space:nowrap; text-overflow:ellipsis; width:50%;}

.admin-main .fixCont3{display:flex; flex-wrap:wrap; box-sizing:border-box;}
.admin-main .fixCont3 .form-box{display:flex; background:#fff; margin:4px; height:150px; color:#555; align-items:center; box-shadow: 0 3px 6px 0 rgb(0 0 0 / 5%), 0 0 3px 0 rgb(0 0 0 / 10%); border:none; max-width: 337.6px;}
.admin-main .fixCont3.apicon .form-box{width:24.4%; max-width: 410px; position:relative; cursor:pointer}
.admin-main .fixCont3.apicon .use_mark{position:absolute; top:0; left:13px}
.admin-main .fixCont3.apicon .form-box:hover{background:#fafafa}
.admin-main .fixCont3 .form-box .icon{display:flex; flex-direction:column; align-items:center}
.admin-main .fixCont3 .form-box .icon i{font-size:35px; color:#333; margin-bottom:8px}
.admin-main .fixCont3 .form-box .txt_box{position:relative; flex:1; margin-left:15px; overflow:hidden;}
.admin-main .fixCont3 .form-box .txt_box:after{content:'\e943'; position:absolute; top:50%; right:0; margin-top:-11px; font-family:xeicon; font-size:25px; color: #999; transform:rotate(-90deg)}
.admin-main .fixCont3 .form-box .txt_box span{display:inline-block; font-size:14px; border:1px solid #5629ee; border-radius:1000px; color:#5629ee; padding:1px 8px; margin-bottom:5px}
.admin-main .fixCont3 .form-box .txt_box p.form-tit{font-size:18px; font-weight:300; color:#333; max-width:210px; word-break:keep-all}

/*.admin-main .fixCont3.apicon .form-box ul li{width:260px}
.admin-main .fixCont3 .form-box .icon svg{width:36px; height:36px;}
.admin-main .fixCont3 .form-box ul {flex: 1; margin-left: 8px;}
.admin-main .fixCont3 .form-box ul::before{cursor:pointer; content: "\e93f"; font-family:'xeicon'; color:#c7c7c7; display:flex; justify-content:center; align-items:center; width:32px; height:32px; font-size:18px; border-radius: 50%; background:#f7f7f7; position: absolute; right:16px; top:35px}
.admin-main .fixCont3 .form-box ul:hover::before{background:#f1f1f1;
.admin-main .fixCont3 .form-box ul li{font-size:14px; text-overflow:ellipsis; white-space: nowrap; overflow:hidden; width:150px;}}
.admin-main .fixCont3 .form-box ul .form-tit{font-size:18px; font-weight:300; color:#333}*/

.admin-main .fixConWrap{flex-direction:column}
.admin-main .form-box .count {display:flex; justify-content:space-between; text-align: center; word-break:keep-all; white-space:nowrap; gap:8px}
.admin-main .form-box .count a{position:relative; font-size:18px; font-weight: 100; letter-spacing: -0.5px; padding:12px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; background:#6f44ff; border-radius: 8px; width:50%;}
.admin-main .form-box .count a:last-child{background:#5281e4}
.admin-main .form-box .count a span{position:absolute; right:12px; top:40px; font-size:14px; margin:0px 4px; color:#ffffff90; font-weight: 400; line-height: 1.1;}
.admin-main .form-box .count a span.num{font-size:26px; color:#fff; top:12px;}
.admin-main .form-box .count a i{font-size:25px; background:#fff; color:#6f44ff; border-radius:16px; width:44px; height:44px; display:flex; align-items: center; justify-content: center;}
.admin-main .form-box .count a:last-child i{color:#5281e4}
.admin-main .form-box .notice li{text-overflow:ellipsis; white-space: nowrap; overflow:hidden;}
.admin-main #orgzStatus.form-box ul{padding:8px 0px}
.admin-main #orgzStatus.form-box ul li{padding:4px 12px;}

.admin-main .form-box.chart-area{display:flex;flex-wrap:wrap}
.admin-main .chart-area .chart{overflow:hidden; padding:4px;}
.admin-main .chart-area .chart-container{padding:16px;}
.admin-main .chart-area .chart > img{width:100%; height:auto; overflow:hidden; padding:8px}

.admin-main .form-box.guide{display:flex; align-items:center; justify-content:space-between; cursor:pointer; height:120px;}
.admin-main .form-box.guide .stitArea{display:flex;flex-direction:column; align-items:flex-start}
.admin-main .form-box.guide p{display:flex; align-items:flex-end; color:#777; cursor:pointer}
.admin-main .form-box.guide i{font-size:18px; color:#c7c7c7}
.admin-main .form-box.guide .guide-icon i{font-size: 24px; color:#5629ee; display:flex; align-items:center; justify-content:center; background:#faf8ff; width:42px; height:42px; border-radius: 50%;; }
.admin-main .form-box.guide:hover .guide-icon i{box-shadow:0px 0px 8px #ded4ff; background:#fff}

/* **************************************** *
*  linkbiz-checkbox
* **************************************** */
 
.biz-checkbox{display:inline-block; height:27px; vertical-align:middle}
.biz-checkbox span{display:inline-block; line-height:27px; vertical-align:middle}
.biz-checkbox > .Checkbox{width:16px; height:16px; margin:0; margin-right:5px}
.biz-checkbox:after{content:"\ea0e"; left:0; top:50%; width:16px; height:16px; line-height:16px; margin-top:-8px; background:none; font-family:'xeicon'; font-size:20px; color:#808080; text-align:center} .biz-checkbox.Checked:after{content:"\e92e"; color:#0196fa; background:none}
.biz-checkbox.Disabled:after{content:"\ea0e"; color:#ccc; background:none}
.biz-checkbox.Checked.Disabled:after{content:"\e92e"; color:#ccc; background:none}
.biz-checkbox.Checked:after{content:"\e92e"; color:#5629ee; background:none}

.Tabs.searchlist .af-tabs-content{position:absolute; top:41px;}

/* **************************************** *
*  toast
* **************************************** */

.dx-toast-content{width:600px !important; border:1px solid;}
.dx-toast-success{background-color:#5629ee !important; width:200px;}



/* **************************************** *
*  viewer-custom
* **************************************** */

.biz-iframe .df-sidemenu{background-color:rgb(249 249 249)}
.biz-iframe .df-vrow > div{position:absolute; bottom:0px; width:100%; border-radius: 0px 0px 5px 5px; background-color:rgb(217 217 217 / 54%)}
.biz-iframe .df-thumb-container .df-vrow{width:96px; border:1px solid rgba(238,238,238,.9) }
.biz-iframe .df-ui-btn.df-active{color:#5f2fff}
.biz-iframe .df-container>.df-ui-next,
.biz-iframe .df-container>.df-ui-prev{font-size: 24px;}
.biz-iframe .df-floating .df-ui-controls{bottom:20px;}
.biz-iframe .df-floating .df-thumb-container .df-vrow:hover, 
.biz-iframe .df-vrow.df-selected{border:1px solid #9d7aff; background-color:#fff}
.biz-iframe [class*=" ti-"]:before,
.biz-iframe [class^=ti-]:before{font-family: 'xeicon'; font-size:18px}
.biz-iframe .ti-sharethis:before{content: "\e9ea";}
.biz-iframe .ti-fullscreen:before{content: "\e90d";}
.biz-iframe .ti-more-alt:before{content: "\e94a";}
.biz-iframe .ti-zoom-in:before{content: "\e97b";}
.biz-iframe .ti-zoom-out:before{content: "\e97c";}
.biz-iframe .df-ui-btn.df-ui-thumbnail{transform:rotate(270deg)}
.biz-iframe .ti-layout-grid2:before{content: "\e98e";}
.biz-iframe .ti-angle-right:before{content: "\e93e";}
.biz-iframe .ti-angle-left:before{content: "\e93b";}
.biz-iframe .ti-close:before{content: "\e922";}
.biz-iframe .df-ui-btn:hover{color:#5629ee;}
.biz-iframe .df-container ::-webkit-scrollbar-thumb{background:#c8c8c8}
.biz-iframe .df-container ::-webkit-scrollbar-track{background:#f2f2f2}
.biz-iframe .df-ui-sidemenu-close{top:0px; right:10px; z-index: 1; background:none; font-size: 16px;}
.biz-iframe .df-thumb-container .df-vrow.df-thumb-loaded{margin-top:24px}


/* **************************************** *
* userConNotisArea
* **************************************** */
#userConNotisArea .com-table.top-line .Table-wrapper{border:none;}
#userNotisArea .writing-ty1 .stitArea {padding:8px 10px; margin-bottom:8px;}
#userNotisArea .writing-ty1.form-box{border-radius: 15px; border:1px solid #eaeaea; padding:2px 8px;}
#userNotisArea .writing-ty1.form-box .stitArea{border-bottom:1px solid #e6e6e6 ;}
#userNotisArea .writing-ty1.form-box .writing-list{border:0px; padding:4px 0px;}
#userNotisArea .writing-ty1.form-box .writing-list > li {min-height: 42px; padding:0px;}
#userNotisArea .writing-ty1.form-box .writing-list > li > ul{display:flex; flex-wrap:wrap; width:100%;}

#userNotisArea .writing-ty1.form-box .writing-list .switch .label{font-size: 14px; color:#777}

.userNotis-wrap{display:flex; flex-wrap:wrap; margin-top: 10px; position:relative;}
.guide-box.conMessage{width:100%; text-align: center; display:none}
.userNotis-wrap .Notis-app{padding:8px; border:1px solid #eaeaea; border-radius: 10px; background:#f8f8f8; margin:4px; min-height: 124px; opacity:0.6; cursor:pointer;}
.userNotis-wrap .Notis-app:hover{opacity:0.9}
.userNotis-wrap .Notis-app.active{background:#fff; opacity:initial;}
.userNotis-wrap .Notis-app.active:hover{box-shadow:0px 0px 8px rgb(86 41 238 / 15%)}
.userNotis-wrap .Notis-app .Notis-app-header{display:flex; justify-content:space-between;}
.userNotis-wrap .Notis-app .app-icon{ margin:4px; width:48px;height:48px;}
.userNotis-wrap .Notis-app.active .app-icon:before{opacity:initial;}
.userNotis-wrap .Notis-app .app-icon:before{content:''; width:48px;height:48px; display:block; opacity:0.5;}
.userNotis-wrap .Notis-app .app-icon.KA::before{background:url(/static/fw/images/messengerIcon/KA.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.LI::before{background:url(/static/fw/images/messengerIcon/LI.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.JA::before{background:url(/static/fw/images/messengerIcon/JA.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.SL::before{background:url(/static/fw/images/messengerIcon/SL.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.SM::before{background:url(/static/fw/images/messengerIcon/SM.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.EM::before{background:url(/static/fw/images/messengerIcon/EM.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.DC::before{background:url(/static/fw/images/messengerIcon/DC.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.DR::before{background:url(/static/fw/images/messengerIcon/DR.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.CL::before{background:url(/static/fw/images/messengerIcon/CL.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.HW::before{background:url(/static/fw/images/messengerIcon/HW.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.NO::before{background:url(/static/fw/images/messengerIcon/NO.svg)no-repeat;}
.userNotis-wrap .Notis-app .app-icon.WH::before{background:url(/static/fw/images/messengerIcon/WH.svg)no-repeat;}

.userNotis-wrap .Notis-app .Notis-app-cont {margin-top: 2px; display:flex; height: 47px;justify-content:space-between; align-items:center; }
.userNotis-wrap .Notis-app .Notis-app-cont .tit{padding:4px; line-height:1.3; max-height: 47px; font-size: 16px; font-weight: 300; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-width: 110px;}
.userNotis-wrap .Notis-app .Notis-app-cont .Label-color:hover{background:#e5e5e5; transition: 0.2s ease-in-out;}
.userNotis-wrap .Notis-app .Notis-app-cont .Label-color.color11:hover{background:#d2edf9; }

.NotisReceive .writing-list > li {align-items: flex-start;}
.NotisReceive li .writing-tit{border-left:3px solid #5629ee;}
.NotisReceive li .writing-tit .tit{font-weight: 300; font-size: 16px;}
.NotisReceive li .writing-cont{flex-wrap:wrap;} 

.NotisReceive li .timeSet{display:flex; align-items:center; margin-right: 8px; }
.NotisReceive li .timeSet span{font-size: 14px;}
.NotisReceive li .timeSet span.day{margin-right: 6px; height:initial; padding:2px 8px; color:#fff; font-size: 13px;}
.NotisReceive li .timeSet span.day.light{color:#755ad0}
.NotisReceive li .Button{margin-right: 4px;}
.NotisReceive li .Button i{font-size: 22px; color:#575757}
.NotisReceive li .Button:hover i{color:#5629ee}
.userNotis td.kakao:hover{position:relative; border-color:red;}
.userNotis td{position:relative}
.userNotis td div .ImageCheckbox{position:absolute; left:20px; top:20px;}
.userNotis td{border-radius: 8px !important;}
.userNotis td > div > label{align-items:center}
.userNotis td > div > label img{width:32px!important; height:32px!important; border-radius: 8px !important;}
.userNotis td > div > label span{font-size:16px !important; }

/* **************************************** *
* popup-notice
* **************************************** */
.Dialog.pop-notice {box-shadow:1px 5px 10px rgb(0 0 0 / 20%);}
.Dialog.pop-notice .content-wrap .page-content{padding-bottom: 40px;}

.notipop{box-shadow:1px 5px 10px rgb(0 0 0 / 10%) !important; }
.notipop iframe{position:relative;}
.layerpop-box.biz-iframe{height:100%; overflow:hidden}
.notice-wrap{height:calc(100% - 35px); overflow:auto}
.notice-wrap .notice-cont {background:#fff;}
.notice-wrap .notice-carousel{position:absolute; top:40%; width:100%;}
.notice-wrap .notice-carousel .prev,
.notice-wrap .notice-carousel .next{position:absolute; background:#0000000d; width:32px; height:32px; display:flex; justify-content:center; align-items:center; border-radius: 50%; cursor:pointer}
.notice-wrap .notice-carousel .prev{left:10px;}
.notice-wrap .notice-carousel .next{right:10px}
.notice-wrap .notice-carousel .prev:hover,
.notice-wrap .notice-carousel .next:hover{background:#00000057;}
.notice-wrap .notice-carousel .prev::before,
.notice-wrap .notice-carousel .next::before{display:block; font-family: 'xeicon'; font-size: 23px; color:#ffffffe0;}

.notice-wrap .notice-carousel .prev::before{content:"\e93c";}
.notice-wrap .notice-carousel .next::before{content:"\e93f";}
.notice-wrap .layerpop-btnwrap{position:absolute; bottom:0; width:100%; background:#fff; border-top:1px solid #eaeaea; left:0px; display: flex; justify-content:space-between; padding:15px 35px 5px 35px; align-items:flex-end;}
.notice-wrap #popupContent{padding:8px 45px; word-break:break-word;}
.notice-wrap #popupContent #noContent ul li,
.notice-wrap #popupContent #noContent p,
.notice-wrap #popupContent #noContent a{font-size: 14px !important; line-height: 1.4 !important;}
.notice-wrap #popupContent #noContent ul li{margin:10px 0px !important; }


/* 링크비즈 메인 팝업 */
.notice_tit{text-align:center}
.notice_tit strong{position:relative; display:block; padding:65px 0 15px 0; font-size:20px; color:#333;}
.notice_tit strong::before{content:''; position:absolute; background:url(/static/fw/images/pop_notice_img.png) no-repeat center center; width:53px; height:49px; top:0; left:50%; transform:translate(-50%, 20%)}
.layerpop-btnwrap .notice_paging{display:flex; align-items:center; justify-content:center}
.layerpop-btnwrap .notice_paging .paging_numb{display:flex; flex-direction:row; align-items:center;}
.layerpop-btnwrap .notice_paging .paging_numb .numb{display:block; border:none; background:none; min-width:25px; height:25px; margin:0 3px; padding:0; border-radius:1000px; cursor:pointer; color:#777}
.layerpop-btnwrap .notice_paging .paging_numb .numb:hover{color:#111}
.layerpop-btnwrap .notice_paging .paging_numb .numb.on{background:#eaeaea; color:#111}
.layerpop-btnwrap .prev_btn,
.layerpop-btnwrap .next_btn{font-size:18px; display:flex; align-items:center; cursor:pointer}
.layerpop-btnwrap .stitR a.todayclose{color:#888; border-bottom:1px solid #bbb; margin-right:12px}


/* **************************************** *
* screenloader-custom
* **************************************** */
.screen_loader{position:relative}
.screen_loader:before{content:''; position:absolute; top:50%; left:50%; width:70px; height:70px; margin-left:-35px; margin-top:-35px; border:6px solid #e7e6e4; border-top:6px solid #5629ee; border-radius:50%; animation:circle_spin 1s ease 0.2s infinite; box-sizing:border-box}
@keyframes circle_spin{0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)}}


/* **************************************** *
*  알림 설정 아이콘
* **************************************** */
.notification-ico{display:flex; align-items:center; justify-content:center}
.notification-ico img{margin:0 2px}


/* **************************************** *
*  템플릿 소개
* **************************************** */
.templet-intro{padding-bottom:10px}
.templet-intro .templet-sumury{display:flex; position:relative; padding:20px 20px 40px}
.templet-intro .templet-sumury .templet-ico{display:flex; align-items:center; justify-content:center; min-width:120px; max-width:120px; min-height:120px; max-height:120px; background:#fff; border:1px solid #e9e9e9; border-radius:8px}
.templet-intro .templet-sumury .templet-ico svg{width:50px; height:50px}
.templet-intro .templet-sumury .templet-info{padding-left:30px; padding-top:10px; width:100%; box-sizing:border}
.templet-intro .templet-sumury .templet-info .tit-area .tit{line-height:125%; font-size:26px; font-weight:600; letter-spacing:-0.8px; color:#202020}
.templet-intro .templet-sumury .templet-info .confirm-area{position:absolute; top:22px; right:20px}
.templet-intro .templet-sumury .templet-info .detail-area{max-height:175px; margin-top:20px; padding-right:20px; overflow-x:hidden; overflow-y:auto; box-sizing:border-box}
.templet-intro .templet-sumury .templet-info .detail-area p{line-height:145%; font-size:15px; font-weight:normal; color:#707070; letter-spacing:-0.5px}

.templet-intro .templet-preview{position:relative; min-height:400px; padding:40px 0; border:1px solid #e9e9e9; background:#fff; border-radius:8px; overflow:hidden; overflow-y:auto; box-sizing:border-box}
.templet-intro .templet-preview .preview-carousel .carousel-box{box-sizing:border-box}
.templet-intro .templet-preview .preview-carousel .cover-tit{margin:20px 0; padding:0 20px; text-align:center}
.templet-intro .templet-preview .preview-carousel .cover-tit .tit{display:inline-block; line-height:125%; font-size:16px; font-weight:normal; color:#505050; letter-spacing:-0.8px}
.templet-intro .templet-preview .preview-carousel .cover-img img{max-width:100%; height:auto; margin:0 auto}

.templet-intro .templet-preview .preview-control{position:absolute; top:50%; left:0; width:100%; height:50px; margin-top:-25px}
.templet-intro .templet-preview .preview-control .slick-arrow{display:flex; justify-content:center; align-items:center; position:absolute; top:50%; width:50px; height:50px; margin-top:-25px; padding:0; border:none; border-radius:50%; outline:none; font-size:0; cursor:pointer; z-index:1; transition:all .20s ease}
.templet-intro .templet-preview .preview-control .slick-prev,
.templet-intro .templet-preview .preview-control .slick-next{background:rgba(0,0,0,.5)}
.templet-intro .templet-preview .preview-control .slick-prev{left:20px}
.templet-intro .templet-preview .preview-control .slick-next{right:20px}
.templet-intro .templet-preview .preview-control .slick-prev:before,
.templet-intro .templet-preview .preview-control .slick-next:before{content:"\e93c"; color:rgba(255,255,255,.5); font-family:xeicon; font-size:24px; transition:all .20s ease}
.templet-intro .templet-preview .preview-control .slick-next:before{transform:rotate(-180deg)}
.templet-intro .templet-preview .preview-control .slick-prev:hover:before,
.templet-intro .templet-preview .preview-control .slick-next:hover:before{color:rgba(255,255,255,.8)}
.templet-intro .templet-preview .preview-control .slick-prev:hover,
.templet-intro .templet-preview .preview-control .slick-next:hover{background:rgba(0,0,0,.7)}
.templet-intro .templet-preview .preview-control .slick-prev.slick-disabled{display:none !important}
.templet-intro .templet-preview .preview-control .slick-next.slick-disabled{display:none !important}


/* **************************************** *
*  BARCODE
* **************************************** */
.barcode_ty1{margin-bottom:100px;}
.barcode_ty1:after{content:''; display:block; clear:both;}

.barcode_ty1 .bc_img{display:block; text-align: center; margin-bottom:30px;}
.barcode_ty1 .bc_img img{width:360px; height:auto;}
.barcode_ty1 .bc_img p{font-size:38px; margin-top:8px;}

.barcode_ty1 .page{display:flex; flex-wrap:wrap; align-items: stretch; margin-left:-20px; margin-top:-20px; margin-bottom:20px;}
.barcode_ty1 .page .barcode_list{display:flex}

.barcode_ty1 .page.col1 .barcode_list{min-width:100%; max-width:100%}
.barcode_ty1 .page.col2 .barcode_list{min-width:50%; max-width:50%}
.barcode_ty1 .page.col3 .barcode_list{min-width:33.333333%; max-width:33.333333%}
.barcode_ty1 .page.col4 .barcode_list{min-width:25%; max-width:25%}
.barcode_ty1 .page.col5 .barcode_list{min-width:20%; max-width:20%}

.barcode_ty1 .page .barcode_list .list_inner{display:flex; flex-direction:column; align-items:stretch; justify-content: space-between; width:100%; box-sizing:border-box; margin-left:20px; margin-top:20px; padding:30px 25px; border:1px solid #eaeaea; border-radius:15px}

.barcode_ty1 .page .barcode_list .list_inner .txt_box dl{position:relative; padding-left:60px;}
.barcode_ty1 .page .barcode_list .list_inner .txt_box dl dt,
.barcode_ty1 .page .barcode_list .list_inner .txt_box dl dd{margin-bottom:10px; font-size:13px; color:#222; word-break:break-all;}
.barcode_ty1 .page .barcode_list .list_inner .txt_box dl dd:last-child{margin-bottom:0}
.barcode_ty1 .page .barcode_list .list_inner .txt_box dl dt{position:absolute; left:0; font-weight:300;}
.barcode_ty1 .page .barcode_list .list_inner .txt_box dl dd{font-weight:normal;}
.barcode_ty1 .page .barcode_list .list_inner .img_box{display:flex; justify-content:space-around; align-items:center; margin-top:25px;}
.barcode_ty1 .page .barcode_list .list_inner .img_box .img_l{display:flex; flex-direction:column; align-items:center;}
.barcode_ty1 .page .barcode_list .list_inner .img_box .img_l span{margin-top:5px;}
.barcode_ty1 .page .barcode_list .list_inner .img_box .img_r{height:30px;}


.barcode_ty2{margin-bottom:100px;}
.barcode_ty2{width:100%;}

.barcode_ty2 .barcode_list{position:relative; display:flex; justify-content: space-around; align-items: center; margin-top:30px;}
.barcode_ty2 .barcode_list:first-child{margin-top:0;}
.barcode_ty2 .barcode_list .txt_box p{word-break:break-all;}
.barcode_ty2 .barcode_list .img_box img{width:260px; height:auto;}


.barcode_ty3{margin-bottom:100px;}
.barcode_ty3:after{content:''; display:block; clear:both;}

.barcode_ty3 .bc_img{display:block; text-align: center; margin-bottom:30px;}
.barcode_ty3 .bc_img img{width:360px; height:auto;}
.barcode_ty3 .bc_img p{font-size:38px; margin-top:8px;}

.barcode_ty3 .page{display:flex; flex-wrap:wrap; align-items: stretch; margin-left:-20px; margin-top:-20px; margin-bottom:20px;}
.barcode_ty3 .page .barcode_list{display:flex}

.barcode_ty3 .page.col1 .barcode_list{min-width:100%; max-width:100%}
.barcode_ty3 .page.col2 .barcode_list{min-width:50%; max-width:50%}
.barcode_ty3 .page.col3 .barcode_list{min-width:33.333333%; max-width:33.333333%}
.barcode_ty3 .page.col4 .barcode_list{min-width:25%; max-width:25%}
.barcode_ty3 .page.col5 .barcode_list{min-width:20%; max-width:20%}

.barcode_ty3 .page .barcode_list .list_inner{display:flex; flex-direction:column; align-items:stretch; justify-content: space-between; width:100%; box-sizing:border-box; margin-left:20px; margin-top:20px; padding:30px 25px; border:1px solid #eaeaea; border-radius:15px}
.barcode_ty3 .page .barcode_list .list_inner .txt_box{display:flex; justify-content: space-between;}
.barcode_ty3 .page .barcode_list .list_inner .txt_box dl{position:relative; padding-left:60px;}
.barcode_ty3 .page .barcode_list .list_inner .txt_box dl.Quant{width:100px; box-sizing:border-box; padding-left: 30px; word-break:break-all;}
.barcode_ty3 .page .barcode_list .list_inner .txt_box dl.Quant dd{text-align:right;}
.barcode_ty3 .page .barcode_list .list_inner .txt_box dl dt,
.barcode_ty3 .page .barcode_list .list_inner .txt_box dl dd{font-size:13px; color:#222; word-break:break-all;}
.barcode_ty3 .page .barcode_list .list_inner .txt_box dl dd:last-child{margin-bottom:0}
.barcode_ty3 .page .barcode_list .list_inner .txt_box dl dt{position:absolute; left:0; font-weight:300;}
.barcode_ty3 .page .barcode_list .list_inner .txt_box dl dd{font-weight:normal;}
.barcode_ty3 .page .barcode_list .list_inner .img_box{display:flex; flex-direction: column; align-items: center; margin-top:25px;}
.barcode_ty3 .page .barcode_list .list_inner .img_box p{word-break:break-all; margin-top:5px;}


/* **************************************** *
*  tag list
* **************************************** */
.writing-list .tag-list li{float:left; margin-right:2px; margin-bottom:0px}
.writing-list .tag-list li .tag-box{position:relative; height:27px; padding:5px 25px 0 8px; background-color:#f3f8ff; border:1px solid #0196fa; box-sizing:border-box}
.writing-list .tag-list li .tag-box span{font-size:12px; font-weight:normal; letter-spacing:-0.2px; color:#505050; line-height: 1;}
.writing-list .tag-list li .tag-box .del{position:absolute; right:0; top:0; width:20px; height:25px; padding:0; line-height:25px; background:none; font-size:18px; color:#808080; text-align:center; border:0; cursor:pointer}
.writing-list .tag-list li .tag-box .del:before{content:"\e922"; font-family:'xeicon'}
.writing-list .tag-list li .tag-box.ico {display: flex; align-items: center;}
.writing-list .tag-list li .tag-box.ico i{font-size: 16px; margin-right: 4px; color: rgb(80, 80, 80, 1);}


/* **************************************** *
*  LOT 생성
* **************************************** */
.lotcore-carousel .carousel-box{padding-top:20px; margin:0 10px}
.lotcore-carousel .lot-result-box{position:relative; min-height:320px; padding:15px; border:1px solid #dadada; border-radius:8px; box-sizing:border-box}
.lotcore-carousel .lot-result-box:hover{border:1px solid rgba(86,41,238,.2)}
.lotcore-carousel .lot-result-box .lot-num .num.select{background:#5629ee; color:#fff}
.lotcore-carousel .lot-modify{display:none; position:absolute; left:-1px; top:-1px; right:-1px; bottom:-1px; background:rgba(86,41,238,.04); border-radius:8px; box-sizing:border-box}
.lotcore-carousel .lot-modify .Button{position:absolute; bottom:10px; right:10px}

.lotcore-carousel .lot-result-box:hover .lot-modify{display:block}
.lotcore-carousel .lot-result-box.default .lot-modify{display:none !important}
.lotcore-carousel .lot-result-box.default:hover{border:1px solid #dadada}
.lotcore-carousel .lot-num{display:flex; align-items:center; justify-content:center; position:relative; margin-top:-23px; text-align:center; z-index:1}
.lotcore-carousel .lot-num .num{display:flex; align-items:center; justify-content:center; min-width:50px; height:32px; background:#fff; border:2px solid #5629ee; font-size:16px; font-weight:normal; color:#5629ee; border-radius:200px}
.lotcore-carousel .lot-start{display:flex; align-items:center; justify-content:center; margin-top:-10px; border:1px solid #ebebeb; height:56px; border-radius:8px}
.lotcore-carousel .lot-start .num{font-size:18px; font-weight:normal; color:#333}
.lotcore-carousel .lot-detail .val-tit{display:flex; align-items:center; position:relative; height:38px; margin-top:12px; padding-left:38px; background-color:#f3f3f3; border-radius:8px; box-sizing:border-box}
.lotcore-carousel .lot-detail .val-tit .tit{color:#5c6072; font-size:13px; font-weight:normal; letter-spacing:-0.5px}
.lotcore-carousel .lot-detail .val-tit .ico-area{position:absolute; top:4px; left:12px; z-index:1}
.lotcore-carousel .lot-detail .val-tit .ico-area i{color:#5c6072; font-size:20px}
.lotcore-carousel .lot-detail .val-info{margin-top:8px}
.lotcore-carousel .lot-detail .val-info li{padding:2px 15px; line-height:135%; color:#505050; font-size:14px; letter-spacing:-0.8px}
.lotcore-carousel .lot-add{display:flex; align-items:center; justify-content:center; height:237px}
.lotcore-carousel .lot-add .add{display:block; position:relative; width:100%; height:100%; margin:0; padding:0; background:0; background:none; border:0; cursor:pointer}
.lotcore-carousel .lot-add .add:before,
.lotcore-carousel .lot-add .add:after{content:''; position:absolute; background-color:#c3c3c3}
.lotcore-carousel .lot-add .add:before{left:50%; top:50%; width:50px; height:4px; margin-top:-2px; margin-left:-25px}
.lotcore-carousel .lot-add .add:after{top:50%; left:50%; width:4px; height:50px; margin-left:-2px; margin-top:-25px}
.lotcore-carousel .slick-list{margin:0 -10px}
.lotcore-carousel .slick-arrow{display:flex; justify-content:center; align-items:center; position:absolute; top:50%; width:38px; height:38px; margin-top:-15px; padding:0; border:none; border-radius:50%; outline:none; font-size:0; cursor:pointer; z-index:1; transition:all .20s ease}
.lotcore-carousel .slick-prev,
.lotcore-carousel .slick-next{background:rgba(0,0,0,.2)}
.lotcore-carousel .slick-prev{left:-10px}
.lotcore-carousel .slick-next{right:-10px}
.lotcore-carousel .slick-prev:before,
.lotcore-carousel .slick-next:before{content:"\e93c"; color:rgba(255,255,255,.5); font-family:xeicon; font-size:24px; transition:all .20s ease}
.lotcore-carousel .slick-next:before{transform:rotate(-180deg)}
.lotcore-carousel .slick-prev:hover:before,
.lotcore-carousel .slick-next:hover:before{color:rgba(255,255,255,.8)}
.lotcore-carousel .slick-prev:hover,
.lotcore-carousel .slick-next:hover{background:rgba(0,0,0,.5)}
.lotcore-carousel .slick-prev.slick-disabled{display:none !important}
.lotcore-carousel .slick-next.slick-disabled{display:none !important}

.lotcore-scroll{display:flex; align-items:center; padding:20px 0; overflow:hidden; overflow-x:auto}
.lotcore-scroll .carousel-box{min-width:200px; max-width:200px; padding-top:20px; margin:0 10px}
.lotcore-scroll .carousel-box:first-child{margin-left:0}
.lotcore-scroll .carousel-box:last-child{margin-right:0}

.lotcore-scroll .lot-result-box{position:relative; min-height:320px; padding:15px; border:1px solid #dadada; border-radius:8px; box-sizing:border-box}
.lotcore-scroll .lot-modify{display:none; position:absolute; left:-1px; top:-1px; right:-1px; bottom:-1px; background:rgba(86,41,238,.04); border-radius:8px; box-sizing:border-box}
.lotcore-scroll .lot-modify .Button{position:absolute; bottom:10px; right:10px}

.lotcore-scroll .lot-result-box.default .lot-modify{display:none !important}
.lotcore-scroll .lot-result-box.default:hover{border:1px solid #dadada}

.lotcore-scroll .lot-num{display:flex; align-items:center; justify-content:center; position:relative; margin-top:-23px; text-align:center; z-index:1}
.lotcore-scroll .lot-num .num{display:flex; align-items:center; justify-content:center; min-width:50px; height:32px; background:#fff; border:2px solid #5629ee; font-size:16px; font-weight:normal; color:#5629ee; border-radius:200px}
.lotcore-scroll .lot-start{display:flex; align-items:center; justify-content:center; margin-top:-10px; border:1px solid #ebebeb; height:56px; border-radius:8px}
.lotcore-scroll .lot-start .num{font-size:18px; font-weight:normal; color:#333}
.lotcore-scroll .lot-detail .val-tit{display:flex; align-items:center; position:relative; height:38px; margin-top:12px; padding-left:38px; background-color:#f3f3f3; border-radius:8px; box-sizing:border-box}
.lotcore-scroll .lot-detail .val-tit .tit{color:#5c6072; font-size:13px; font-weight:normal; letter-spacing:-0.5px}
.lotcore-scroll .lot-detail .val-tit .ico-area{position:absolute; top:8px; left:12px; z-index:1}
.lotcore-scroll .lot-detail .val-tit .ico-area i{color:#5c6072; font-size:20px}
.lotcore-scroll .lot-detail .val-info{margin-top:8px}
.lotcore-scroll .lot-detail .val-info li{padding:2px 15px; line-height:135%; color:#505050; font-size:14px; letter-spacing:-0.8px}
.lotcore-scroll .lot-add{display:flex; align-items:center; justify-content:center; height:237px}
.lotcore-scroll .lot-add .add{display:block; position:relative; width:100%; height:100%; margin:0; padding:0; background:0; background:none; border:0; cursor:default}
.lotcore-scroll .lot-add .add:before,
.lotcore-scroll .lot-add .add:after{content:''; position:absolute; background-color:#c3c3c3}
.lotcore-scroll .lot-add .add:before{left:50%; top:50%; width:50px; height:4px; margin-top:-2px; margin-left:-25px}
.lotcore-scroll .lot-add .add:after{top:50%; left:50%; width:4px; height:50px; margin-left:-2px; margin-top:-25px}
.lotcore-scroll .slick-list{margin:0 -10px}
.lotcore-scroll .slick-arrow{display:flex; justify-content:center; align-items:center; position:absolute; top:50%; width:30px; height:30px; margin-top:-15px; padding:0; border:none; border-radius:50%; outline:none; font-size:0; cursor:pointer; z-index:1; transition:all .20s ease}
.lotcore-scroll .slick-prev,
.lotcore-scroll .slick-next{background:rgba(0,0,0,.5)}
.lotcore-scroll .slick-prev{left:-10px}
.lotcore-scroll .slick-next{right:-10px}
.lotcore-scroll .slick-prev:before,
.lotcore-scroll .slick-next:before{content:"\e93c"; color:rgba(255,255,255,.5); font-family:xeicon; font-size:24px; transition:all .20s ease}
.lotcore-scroll .slick-next:before{transform:rotate(-180deg)}
.lotcore-scroll .slick-prev:hover:before,
.lotcore-scroll .slick-next:hover:before{color:rgba(255,255,255,.8)}
.lotcore-scroll .slick-prev:hover,
.lotcore-scroll .slick-next:hover{background:rgba(0,0,0,.7)}
.lotcore-scroll .slick-prev.slick-disabled{display:none !important}
.lotcore-scroll .slick-next.slick-disabled{display:none !important}


/* **************************************** *
*  PMS
* **************************************** */
.stitArea.pms-titArea .stitL > span{flex:none; font-weight: 300;}
.stitArea.pms-titArea .stit02{overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.stitArea.pms-titArea .stit04{overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.stitArea.pms-titArea .stit03{overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}

.stitL.pjt-list h2.stit02{display:flex; align-items:center; letter-spacing: -0.8px;}
.stitL.pjt-list h2.stit02 > span{color:#5629ee; font-weight: normal; display:flex; align-items:center; }
.stitL.pjt-list h2.stit02 > div{display:flex; align-items:center; max-width: 450px; }
.stitL.pjt-list h2.stit02 > div > .tit{display:inline-block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.stitL.pjt-list h2.stit02 > div > Button i{font-size: 15px; color:#aaa}
.stitL.pjt-list h2.stit02 > div > Button:hover i{color:#5629ee;}


/* Kanban - 업무보드 */
.card-wrap{display:flex; flex-wrap:wrap}
.custom-card{position:relative; border-radius: 10px; background:#fff; min-height: 180px; padding:16px 12px 12px; }
.custom-card .status-color{position:absolute;  top:0px; left:0px; display:block; width:100%;  height:5px; background:#ddd; border-radius: 5px 5px 0px 0px;}
.custom-card .status-color.color01{ background:#8b6eed;}
.custom-card .status-color.color02{ background:#435dcc;}
.custom-card .status-color.color03{ background:#1e94b1}
.custom-card .status-color.color04{ background:#86a44b}
.custom-card .status-color.color05{ background:#007bda}
.custom-card .status-color.color06{ background:#338755}
.custom-card .status-color.color07{ background:#164ec0}
.custom-card .status-color.color08{ background:#da5f00}
.custom-card .status-color.color09{ background:#b2086d}
.custom-card .status-color.color10{ background:#6a2cad}
.custom-card .tit_wrap{margin:12px 0px; display:flex; flex-direction:column}
.custom-card .tit_wrap .tit{font-size: 17px; text-overflow:ellipsis; white-space: nowrap; overflow:hidden; margin-bottom: 4px; margin-right:16px; font-weight:300; letter-spacing: -0.6px;}
.custom-card .tit_wrap .menu{position:absolute;right:10px; cursor:pointer;}
.custom-card .tit_wrap .menu i{color:#555;}
.custom-card .tit_wrap .txt{color:#555; font-weight:normal; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; min-height:40px; line-height: 1.4;}
.custom-card .date{display:flex; align-items:center; font-size: 13px; color:#a1a1a1;}
.custom-card .date i{font-size: 17px; margin-right:4px;}
.custom-card .custom-top .attach{display:flex; align-items:center; position:absolute; bottom:12px; right:16px; color:#a1a1a1; font-size: 12px;}
.custom-card .custom-top .attach i{font-size: 24px; color:#8f8f8f;}
.custom-card .custom-bottom {position:relative;}
.custom-card .custom-bottom .writer{position:absolute; right:0px; top:0px; align-items:baseline; font-size: 12px; overflow:hidden; white-space: nowrap; text-overflow: ellipsis; width:90px;}
.custom-card .custom-bottom .writer .badge-color{display:inline-table; font-size: 10px; margin-right:4px; padding:2px 4px;}
.custom-card .custom-bottom .user-wrap {display:flex; margin-top: 12px;}
.custom-card .custom-bottom .user-wrap .user{border-radius:50%; background:#fff; border:1px solid #fff; display:flex; justify-content: center; overflow:hidden; width:42px; height:42px; box-shadow:-1px 1px 5px #0000001c; line-height: 40px;}
.custom-card .custom-bottom .user-wrap .user img{object-fit: cover;}
.custom-card .custom-bottom .user-wrap .user:nth-child(2){transform:translateX(-10px)}
.custom-card .custom-bottom .user-wrap .user:nth-child(3){transform:translateX(-20px)}

.custom-card.project.color01{background:#fbfaff;}
.custom-card.project.color02{background:#f5f7ff;}
.custom-card.project.color03{background:#f7fdff;}
.custom-card.project.color04{background:#fcfff6;}
.custom-card.project.color05{background:#f4faff;}
.custom-card.project.color06{background:#fafffc;}
.custom-card.project.color07{background:#f1f5ff;}
.custom-card.project.color08{background:#fffcfa;}
.custom-card.project.color09{background:#fff8fc;}
.custom-card.project.color10{background:#faf6ff;}

._display_kanban .picker{border-radius:1000px; width:28px; height:28px; cursor:pointer; margin-right:10px} 
._display_kanban.pop .picker{width:23px; height:23px; margin-right:5.2px}
._display_kanban.pop .picker:last-child{margin-right:0}
._display_kanban .picker.checked{position:relative}
._display_kanban .picker.checked:after{position:absolute; font-family:"xeicon"; content:'\e928'; font-size:18px; color:#fff; text-align:center; line-height:28px; background:rgb(29, 19, 64, 0.35); width:100%; height:100%; border-radius:1000px}
._display_kanban.pop .picker.checked:after{font-size:15px; line-height:23px}
._display_kanban .picker:hover {box-shadow:2px 2px 4px 0px rgb(29, 19, 64, 32%)}
.wx-label-text.svelte-1tls1m0{font-size:15px;}
.wx-column.svelte-125eoms:hover .wx-add-card-tip.svelte-125eoms{font-size:14px;}
.dhx_cal_event_clear.color_white{color:white !important;}
.com-grid .wx-kanban.svelte-1uazi8m.svelte-1uazi8m{background:#f9f9f970; z-index: 0;}
.wx-kanban .wx-collapse-icon.svelte-1tkfa0u{display:none;}

._display_kanban .Label-color{position:absolute; right:calc(100% - 630px)}
.wx-popup.svelte-1nzvv4w{left:initial !important; right:48px; top:207px !important;}


/* PMS - Gantt */


.custom_menu{box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3); border-radius: 2px; z-index: 61;}
.custom_menu input[type=button]{background:#fff; color:#4d4d4d; border:0px; padding: 8px 12px; display:flex; align-items:center}
.custom_menu input[type=button]:hover{background:#ededed}
.com-grid #ganttArea{height:70vh !important}
.com-grid #ganttArea .ganttBtn{height:26px; padding:3px 8px 3px; background:#5629ee; border:1px solid #5629ee; font-weight:normal; font-size:13px; letter-spacing:-0.8px; color:#fff; border-radius:8px; vertical-align:middle; box-sizing:border-box; transition: all 0.3s; margin:0px 4px; cursor:pointer; }
._display_gantt .writing-cont #userUl{height:56px; overflow:auto; display:flex; align-items:center; flex-wrap:wrap; }
._display_gantt .writing-cont #userUl li{float:left; margin-right: 16px; margin-bottom: 0px;}
.custom-seletlist{background:#fff; z-index: 60; box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);  border:1px solid #ebebeb; border-radius: 4px;  width: 200px; display:block; padding:8px}
.custom-seletlist ul li{line-height: 2; padding:4px 6px; border-bottom: 1px solid #ebebeb;}
.custom-seletlist ul li:last-child{border-bottom: none;}
.custom-seletlist ul li:hover{background:#f2edff60}
._display_com #STANDBY.Label-color,
._display_com #COMPLETE.Label-color,
._display_com #INPROGRESS.Label-color{position:absolute; left:454px; border-radius: 30px; padding:7px 13px 8px; height:34px;}
._display_com #STANDBY.Label-color .cont-txt,
._display_com #COMPLETE.Label-color .cont-txt,
._display_com #INPROGRESS.Label-color .cont-txt{font-size: 14px !important;}

.pms-search { position:relative; border: 1px solid #ebebeb; padding:4px 4px 0 12px;  background:#f5f5f5; border-radius: 50px; height:32px; width:440px; margin-left: 4px}
.pms-search .search-wrap{display:flex; align-items:center;}
.pms-search .search-wrap > i.ri-search-line{font-size: 18px; color:#a5a5a5}
.pms-search .search-wrap > .Textinput,
.pms-search .search-wrap > .Textinput:hover,
.pms-search .search-wrap > .Textinput:focus,
.pms-search .search-wrap > .Textinput:active{border:0px; box-shadow:none;}
.pms-search .search-wrap > .Textinput{height:24px; line-height: 1.2; background:#f5f5f5;}

.pms-search-popup{display:none;background:#fff; border-radius:15px; position: absolute; right:0px; top:32px; z-index: 2; width:440px; padding-left: 16px; box-shadow:0px 2px 5px rgb(0 0 0 / 30%)}
.pms-search-popup.active{display:block}
.pms-search-popup .writing-ty1 .writing-list{border:none; margin-top: 15px;}
.pms-search-popup .writing-ty1 .writing-list #srchCardColumnNmDiv{display:flex; flex-wrap:wrap;}
.pms-search-popup .writing-ty1 .writing-list #srchCardColumnNmDiv label{width:96px;}
.pms-search-popup .close{cursor:pointer;  position:absolute; right:10px; top:10px; width:24px; height:24px; line-height:25px; border:0px; background:transparent; padding:0px; z-index: 2;}
.pms-search-popup .close:before{content:"\EB99";font-family:'remixicon'; color:#888; font-size: 18px;}

.pms-search-tag {margin-left:8px;}
.pms-search-tag .tag-list li{float:left; margin-right:2px; margin-bottom:0px}
.pms-search-tag .tag-list li .tag-box{position:relative; height:27px; padding:0px 25px 0 8px; background-color:#f8f7fe; border:1px solid #5629ee; box-sizing:border-box}
.pms-search-tag .tag-list li .tag-box span{font-size:12px; font-weight:normal; letter-spacing:-0.2px; color:#505050; line-height: 1;}
.pms-search-tag .tag-list li .tag-box .del{position:absolute; right:0; top:0; width:20px; height:25px; padding:0; line-height:25px; background:none; font-size:18px; color:#808080; text-align:center; border:0; cursor:pointer}
.pms-search-tag .tag-list li .tag-box .del:before{content:"\EB99";font-family:'remixicon'; color:#5629ee; font-size: 16px; }
.pms-search-tag .tag-list li .tag-box.ico {display: flex; align-items: center;}
.pms-search-tag .tag-list li .tag-box.ico i{font-size: 16px; margin-right: 4px; color: rgb(80, 80, 80, 1);}


/* PMS - todo */
/* .com-grid .wx-todo_list-menu-button.svelte-gd4vi2{display:none}
.menu.svelte-9lfyly{display:none !important}*/

.pms-sidemenu{position:fixed; background:#5629ee; margin-left:-49px; top:125px;  z-index:1; width: 16px; height:36px; border-radius: 0px 8px 8px 0px; display:flex; align-items:center}
.pms-sidemenu::after{content:"\e996"; display:flex; align-items:center; justify-content:center;  width:16px; height:36px; font-family:"xeicon"; color:#fff; font-size:19px}
.pms-sidemenu .project-list{position:fixed; display:none; width:270px; height:calc(100% - 65px); background:#f7f7f7bd; backdrop-filter:blur(8px); padding:16px 18px 16px 24px; top:65px; box-shadow: 1px 5px 10px rgb(0 0 0 / 10%); overflow:auto}
.project-list{display:block; height:100%; overflow:auto; padding:0 8px}

.pms-sidemenu:hover .project-list{display:block;}
.project-list > ul li,
.pms-sidemenu .project-list > ul li{position:relative; display:flex; flex-direction:column; background:#fff; padding:12px 8px; margin:6px 0px; border:1px solid #e9e9e9; border-radius: 10px; cursor:pointer; justify-content:center; }

.project-list > ul li .state,
.project-list > ul li .tit{font-family: 'pps','ptd', 'sans-serif' !important;}
.project-list > ul li:hover,
.project-list > ul li:active,
.pms-sidemenu .project-list > ul li:hover,
.pms-sidemenu .project-list > ul li:active{box-shadow: 0px 0px 5px rgb(86 41 238 / 15%);}
.project-list > ul li .tit{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:160px;}
.project-list > ul li.active{box-shadow: 0px 0px 5px rgb(86 41 238 / 40%); background:#f8f6ff; }
.project-list > ul li:hover:after{content: "\e929"; font-family:'xeicon'; width:20px; color:#5629ee ;height:20px; position:absolute; right:10px; top:12px; background:#fff; border-radius:50%; display:flex; justify-content:center; align-items:center; box-shadow: 0px 0px 5px rgb(86 41 238 / 15%);}
.project-list > ul li.active:after{content: "\e929"; font-family:'xeicon'; width:20px; color:#fff ;height:20px; position:absolute; right:10px; top:12px; background:#5629ee; border-radius:50%; display:flex; justify-content:center; align-items:center; box-shadow: 0px 0px 5px rgb(0 0 0 / 20%);}

.project-list > ul li .state{font-size: 12px; color:#999; width:fit-content; padding:0px 8px; border-radius:20px; background:#555; color:#fff}
.project-list > ul li .state.color01{background:#5629ee;}
.project-list > ul li .state.color02{background:#f34444;}
.project-list > ul li .state.color03{background:#e0f7d9; color:#318e4d}
.project-list > ul li .date{color:#a1a1a1; display:flex;align-items:center; }
.project-list > ul li .date i{margin-right:2px; width:18px}
.project-list > ul li .date span{font-size: 13px;  margin:0px 3px; }
.project-list > ul li .writer{display:flex; align-items:center;  }
.project-list > ul li .writer i{color:#a1a1a1; margin-right:2px; width:18px}
.project-list > ul li .writer span{margin:0px 4px; font-size: 14px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:86px;}
.project-list > ul li .bottom{display:flex; align-items:center; justify-content:space-between; margin-top:2px;}
.project-list.srch-popup{border-top:1px solid #eaeaea; overflow:auto; height:400px;}

.writing-cont .datalink-label{display:flex; align-items:center; flex-wrap:wrap; height:80px; overflow:auto;}
.writing-cont .datalink-label{display:flex; align-items:center; flex-wrap:wrap; height:80px; overflow:auto;}
.writing-cont .datalink-label{display:flex; align-items:center; flex-wrap:wrap; height:74px; overflow:auto;}

.writing-cont .datalink-label .label-btn.active{padding-left:26px; background:#5c6072; color:#fff;}
.writing-cont .datalink-label .label-btn{display:flex; align-items:center; background:#f0f2f2; position:relative;line-height:1.5;margin-left:2px; margin-top:5px; padding:5px 14px 5px 14px; border:0px; font-weight:normal; font-size:14px; letter-spacing:-0.8px; border-radius:120px; vertical-align:middle; box-sizing:border-box; cursor:pointer  }
.writing-cont .datalink-label .label-btn.active:before{display:block}
.writing-cont .datalink-label .label-btn:before{content:"\EB7B"; position:absolute; left:10px; top:3px; display:none; color:rgba(255,255,255,.9); font-family:'remixicon'; font-size:15px; }
.writing-cont .datalink-label li{margin-bottom: 0px;}
.writing-cont .datalink-label .label-btn .del{width:20px; height:inherit; line-height:1; padding:0px; margin-left: 8px;  background:none; font-size: 18px; color:#808080;text-align: center; border:0; cursor: pointer;}
.writing-cont .datalink-label .label-btn .del:before{content:"\e922"; font-family:'xeicon';}
.writing-cont .datalink-label .label-btn.active .del{color:#a7a7a7}
.writing-cont .datalink-label .label-btn.select{background:#5c6072; color:#fff;}
.treeBox .datalink-label{display:inline-flex; flex-direction:column; align-items:flex-start;} 


/* PMS - Scheduler */

.com-grid .dhx_cal_event_line.personal{background:#f1edff !important; color:#5629ee; border:1px solid #5629ee6b;}
.com-grid .dhx_cal_event_line.personal:before{content: "\e9f3"; font-family: 'xeicon'; margin-right:4px;}
.com-grid .dhx_cal_event.personal .dhx_header,
.com-grid .dhx_cal_event.personal .dhx_title,
.com-grid .dhx_cal_event.personal .dhx_body{background:#f1edff !important; color:#5629ee; border:1px solid #5629ee6b;}
.com-grid .dhx_cal_event.personal .dhx_header,
.com-grid .dhx_cal_event.personal .dhx_title{border-bottom:0px;}
.com-grid .dhx_cal_event.personal .dhx_body{border-top:0px;}
.com-grid .dhx_cal_event.personal .dhx_body:before{content: "\e9f3"; font-family: 'xeicon'; margin-right:4px;}

.pms-tooltip.ri-information-line{font-size: 24px; color:#5629ee; margin-left: 6px; cursor:pointer;}
.Tooltip.summury.pms.Right:after{top:10%;}
.Tooltip.pms.Right:before{top:10%;}

.fix.pms{position:absolute;padding-bottom:24px; padding-top:10px;background:#fff;bottom:0px; height:70px; width:102%; display:flex; justify-content:center; }


/* PMS - Workflow */
.fixConWrap .form-wrap.pms .form-box{position:relative; overflow:hidden;  width:32.5%; max-width:initial; display:block;  height:280px; margin:6px;}
.fixConWrap .form-wrap.pms .form-box .Label-color{position:absolute; left:24px; top:24px;}
.fixConWrap .form-wrap.pms .form-box .thum-img{width:100%; height:200px; border: 1px solid #ededed; border-radius:4px; display:flex; align-items:center; justify-content:center; overflow:hidden; margin-bottom: 8px;}
.fixConWrap .form-wrap.pms .form-box .tit{font-size: 17px; font-weight: 300; color:#333; letter-spacing: -0.8px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; width:100%; padding:0 4px}
.fixConWrap .form-wrap.pms .form-box .txt{font-size: 15px; color:#555; letter-spacing: -0.4px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; width:100%; padding:0 4px; line-height: 1.3;}
.fixConWrap .form-wrap.pms .form-box.active{border:1px solid #5629ee30; box-shadow: 3px 4px 8px #5629ee15}
.fixConWrap .form-wrap.pms .form-box.active:before{content:""; width:100%; height:100%; position:absolute; top:0px; left:0px; background:rgba(86,41,238,.04)}
.fixConWrap .form-wrap.pms .form-box.active:after{content: "\e928"; font-family:'xeicon'; position:absolute; top:8px; right:8px; width:32px; height:32px; font-size: 18px; background:#5629ee; color:#fff; display:flex; justify-content:center; align-items:center; border-radius: 50%; }
.editor_scale{display:flex; align-items:center}
.editor_scale .zoom_in,
.editor_scale .zoom_out{color:#777}
.editor_scale .scale_value{margin:0px 8px; color:#777; font-size: 14px;}


/* PDM - 공정프로세스 등록 */
.Tooltip.summury.reg.Right:after{top:15%;}
.Tooltip.summury.reg.Right:before{top:15%;}
.Tooltip.add{left:-15px !important}


/* **************************************** *
*  APRVLINE
* **************************************** */
.aprvline{height:169px; border:1px solid #ebebeb; border-radius:8px; box-sizing:border-box}
.aprvline .body{height:169px; overflow-y:auto}
.aprvline .body li{position:relative; padding:0; box-sizing:border-box}
.aprvline .body li:after{content:''; display:block; clear:both}
.aprvline .col-row{display:flex; align-items:center; border-bottom:1px solid #ebebeb}
.aprvline .col-row > div{display:flex; align-items:center; justify-content:center; flex:auto; padding:5px}
.aprvline .col-row > div.tleft{justify-content:flex-start}
.aprvline .col-row > div.tright{justify-content:flex-end}
.aprvline .col-row > div.cont-txt{line-height:155%; font-size:14px; font-weight:normal; color:#333; letter-spacing:-0.8px}
.aprvline .col-row > div.cont-txt .Label-color{font-size:15px}
.aprvline .body li:last-child .col-row{border-bottom:none}
.aprvline .not-data{display:flex; align-items:center; justify-content:center; height:100%}
.aprvline .not-data .message{font-size:14px; font-weight:normal; color:#888; line-height:135%; letter-spacing:-0.2px}
.aprvline .not-data .message i{margin-top:-1px; font-size:20px; vertical-align:middle}
.aprvline .not-data .message span{font-size:14px}
.aprvline.reviewer,
.aprvline.reviewer .body{height:173px}
.aprvline.approver,
.aprvline.approver .body{height:43px}


/* widget-manager */
.widget-manager{position:relative; height:48px; margin-bottom:40px; background:#fff; border:1px solid #e9e9e9; border-radius:10px}
.widget-manager .manager-inner{padding-right:318px}
.widget-manager .widget-setup > ul{display:flex}
.widget-manager .widget-setup > ul > li{flex:1; position:relative; height:48px; box-sizing:border-box}
.widget-manager .widget-setup > ul > li:before{content:''; position:absolute; right:0; top:50%; width:1px; height:24px; margin-top:-12px; background:#f2f2f2; z-index:1}
.widget-manager .widget-setup > ul > li:last-child:before,
.widget-manager .widget-setup > ul > li.active:before{display:none}
.widget-manager .widget-setup > ul > li .deth{
 display:block; position:relative; top:-1px; left:-1px; width:100%; height:48px; line-height:48px; padding:0 30px; padding-right:55px; color:#333; background:none; font-size:15px; font-weight:300; letter-spacing:-0.8px;
 text-align:left; border:0; margin:0; cursor:pointer; border-radius:0 10px 0 0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; transition:all .20s ease; box-sizing:border-box}
.widget-manager .widget-setup > ul > li .deth:after{content:'\e943'; position:absolute; right:30px; top:0; font-family:'xeicon'; font-size:20px; color:#a7a7a7; transition:all .20s ease}
.widget-manager .widget-setup > ul > li.active .deth{margin-left:-1px; padding-left:31px; color:#5629ee; background:#fff; box-shadow:2px 2px 7px rgb(0 0 0 / 12%); z-index:2}
.widget-manager .widget-setup > ul > li.active .deth:before{content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#e9e9e9}
.widget-manager .widget-setup > ul > li.active .deth:after{transform:rotate(-180deg)}
.widget-manager .widget-setup > ul > li:first-child.active .deth{border-radius:10px 10px 0 0}
.widget-manager .widget-setup > ul > li:last-child.active .deth{border-radius:0}

.widget-manager .widget-detail{display:none; position:absolute; top:47px; left:-1px; right:2px; background:#fff; border-radius:0 0 10px 10px; box-shadow:2px 2px 7px rgb(0 0 0 / 12%); overflow:hidden; z-index:2}
.widget-manager .widget-detail .widget-list{max-height:275px; padding:15px 0; overflow:hidden; overflow-y:auto}
.widget-manager .widget-detail .widget-list li{display:flex; align-items:center; position:relative; padding:11px 20px; transition:all .20s ease}
.widget-manager .widget-detail .widget-list li:hover{background-color:#fafafa}
.widget-manager .widget-detail .widget-list li.on{background-color:#fafafa}

.widget-manager .widget-save{position:absolute; right:-1px; top:-1px; bottom:-1px; width:202px}
.widget-manager .widget-save .save-btn{display:flex; align-items:center; justify-content:center; width:100%; height:100%; background-color:#0d1152; color:#fff; font-size:16px; border:0; border-radius:0; cursor:pointer}
.widget-manager .widget-save .save-btn i{margin-right:2px; font-size:22px}

.widget-manager .widget-confirm{display:flex; align-items:center; position:absolute; right:-1px; top:-1px; bottom:-1px}
.widget-manager .save-btn,
.widget-manager .copy-btn{display:flex; align-items:center; justify-content:center; width:160px; height:100%; color:#fff; font-size:15px; border:0; border-radius:0; cursor:pointer}
.widget-manager .save-btn{background-color:#0d1152; border-radius:0 10px 10px 0}
.widget-manager .copy-btn{background-color:rgb(85, 85, 85)}
.widget-manager .save-btn i,
.widget-manager .copy-btn i{margin-right:2px; font-size:18px}

.widget-manager.unit{margin-bottom: 0px;}
.widget-manager.unit .manager-inner{padding:0}
.widget-manager.unit .widget-setup > ul > li:last-child.active .deth{border-radius: 10px 10px 0px 0px;}


/* preview-file */
.preview-file{position:absolute; min-width:300px; max-width:400px}
.preview-file .preview-inner{padding:18px 22px; background-color:#fff; border:1px solid #e9e9e9; border-radius:10px; box-shadow:2px 2px 7px rgb(0 0 0 / 12%)}
.preview-file .file-list li{margin-bottom:10px}
.preview-file .file-list li:last-child{margin-bottom:0}
.preview-file .file-list a{display:flex; align-items:center}
.preview-file .file-list a .tit{font-size:14px; letter-spacing:-0.5px; color:#555; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.preview-file .file-list a:hover .tit{color:#222}
.preview-file .file-list a img{min-width:20px; max-width:20px; margin-right:5px}


/* preview-file-all */
.preview-file-all{position:relative; padding-top:10px; padding-bottom:35px; border-bottom:1px solid #ebebeb}
.preview-file-all .preview-inner{min-height:272px; max-height:272px; padding:5px; box-sizing:border-box; overflow:hidden; overflow-y:auto}
.preview-file-all .file-list li{position:relative; margin-bottom:17px; padding-right:180px}
.preview-file-all .file-list li:last-child{margin-bottom:0}
.preview-file-all .file-list .tit-area{display:flex; align-items:center}
.preview-file-all .file-list .tit-area .tit{font-size:15px; letter-spacing:-0.5px; color:#555; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.preview-file-all .file-list .tit-area .size{margin-left:2px; color:#888; font-size:13px}
.preview-file-all .file-list .tit-area:hover .tit{color:#222}
.preview-file-all .file-list .tit-area img{position:relative; top:1px; min-width:22px; max-width:22px; margin-right:5px}

.preview-file-all .file-btn{display:flex; align-items:center; position:absolute; right:0; top:-5px}
.preview-file-all .file-btn button{margin-left:2px; padding:5px 6px 5px}
.preview-file-all .file-btn button i{position:relative; top:1px; margin-right:2px; font-size:20px; color:#777}
.preview-file-all .file-btn button:hover{padding:5px 6px 5px}
.preview-file-all .file-btn button:hover i{color:#5629ee}

/* wms 도면/이미지파일 팝업*/
.preview-file-all.list_pop{padding-top:0; padding-bottom:0; border-bottom:0}
.preview-file-all.list_pop .preview-inner{min-height:auto}
.preview-file-all.list_pop .preview-inner .file-list li .list_pop_tit{display:inline-block; min-width:50px}


/* 프로젝트수행 */
.stitArea.bd{margin-bottom: 0px; padding:12px; border-bottom: 0px; background:#f9f9f9; border-radius: 8px 8px 0px 0px;} 



/* **************************************** *
*  Approval
* **************************************** */
.aprv-box{width:100%; border:1px solid #ebebeb; background:#fff; min-width: 1400px; margin:8px 0px; padding:8px 16px; display:flex; border-radius: 10px; align-items:center }
.aprv-box:hover{box-shadow: 1px 5px 5px rgb(0 0 0 / 8%);}
.aprv-cont{flex:1 auto; max-width: calc(100% - 786px); margin-right:16px}
.aprv-cont .tit{font-size: 18px; display:flex; align-items:center; letter-spacing: -0.8px; color:#202020}
.aprv-cont .tit > div{flex:none}
.aprv-cont .tit > span{white-space:nowrap; overflow:hidden;  margin-left:8px; text-overflow:ellipsis; display:block}
.aprv-box .aprv-info{display:flex; font-size: 14px; color:#999; padding-top:2px;}
.aprv-box .aprv-info .info.date{margin-right: 24px; font-size: 13px;}
.aprv-box .aprv-info .info.drafter{margin-right: 8px; font-size: 13px;}
.aprv-state{background:#ddf5ed; color:#37ae84; border:1px solid #b9ded2;  margin: 0px 32px 0px 16px;   width:62px; height:62px; line-height: 1.2; padding:4px; font-size: 13px; border-radius: 20px; display:flex; justify-content:center; align-items:center; flex-direction:column}
.aprv-state i{font-size: 24px;}

.aprv-state.color01{background:#ebe6fb; color:#937cdf; border:1px solid #dfd4ff;}
.aprv-state.color02{background:#ffe3f0; color:#fa167c; border:1px solid #f6d5e4}
.aprv-state.color03{background:#ddf5ed; color:#37ae84; border:1px solid #b9ded2}
.aprv-state.color19{background:#efefef; color:#8d8a8a; border:1px solid #ddd}
.aprv-state.color20{background:#555555; color:#fff; border:1px solid #555555}

.aprv-line{display:flex; width:660px; overflow:auto}
.aprv-line > div {width:130px; display:inline-flex; flex-direction:column; align-items: center; flex:none;}
.aprv-line > div > .state-icon{position:relative; display:flex; height:40px; align-items:center}
.aprv-line > div > .state-icon:before{position:absolute; left:8px;  content:""; display:block; width:130px; height:1px; background:#e5e5e5;}
.aprv-line > div > .state-icon i{display:flex; z-index: 2; justify-content:center; align-items: center; width:20px; height:20px; background:#d9d9d9; border-radius: 50%; color:#fff; font-size: 13px}
.aprv-line > div > span{display:flex; justify-content:center; align-items:center; height:24px; font-size:14px; font-weight:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0px 24px; color:#202020; position:relative; width:140px; text-align: center; letter-spacing: -0.4px;}
.aprv-line > div > span:after{content:"\EA6E"; font-family:'remixicon'; display:block; position:absolute; right:0px; top:4px; color:#c1c1c1; font-size:16px}
.aprv-line > div > span.date{color:#a4a4a4 !important; font-size:12px}

.aprv-line > div:last-child > span::after{display:none;}
.aprv-line > div:last-child > .state-icon::before{display:none;}

.aprv-line > div.state-confirm > .state-icon i{background:#5f21c7}
.aprv-line > div.state-confirm.current .state-icon i{border:3px solid #5f21c7; font-size:20px; color:#5f21c7; background:#fff; width:22px; height:22px; box-shadow:1px 5px 5px rgb(0 0 0 / 15%); box-sizing:content-box}

.aprv-line > div.state-return > .state-icon i{background:#fa167c}
.aprv-line > div.state-return.current .state-icon i{border:3px solid #fa167c; font-size:20px; color:#fa167c; background:#fff; width:22px; height:22px; box-shadow:1px 5px 5px rgb(0 0 0 / 15%); box-sizing:content-box}

.aprv-line > div.state-between > .state-icon i{background:#a38af7}
.aprv-line > div.state-between.current .state-icon i{border:3px solid #a38af7; font-size:20px; color:#a38af7; background:#fff; width:22px; height:22px; box-shadow:1px 5px 5px rgb(0 0 0 / 15%); box-sizing:content-box}

.aprv-line span > .memo{font-size:16px; margin-left:2px; cursor:pointer; color:#a4a4a4}


.aprv-line.detail{flex-wrap:wrap; width:100%; margin-top:-15px; overflow:visible}
.aprv-line.detail > div{width:20%; min-width:20%; max-width:20%; margin-top:25px}
.aprv-line.detail > div > .state-icon{width:100%; justify-content:center}
.aprv-line.detail > div > .state-icon:before,
.aprv-line.detail > div > .state-icon:after{content:""; display:block; position:absolute; width:50%; height:1px; background:#e5e5e5; opacity:1}
.aprv-line.detail > div > .state-icon:before{left:0}
.aprv-line.detail > div > .state-icon:after{right:0}
.aprv-line.detail > div:last-child > .state-icon:before{display:block}
.aprv-line.detail > div:last-child > .state-icon:after{display:none}
.aprv-line.detail > div:first-child > .state-icon:before{display:none}
.aprv-line.detail > div.state-ongoing > .state-icon i{box-sizing:content-box}
.aprv-line.detail > div > span{width:100%; box-sizing:border-box}
.aprv-line.detail > div > span.date:after{display:none}

.aprv-line.detail > div.state-finish > .state-icon:before{opacity:1}


.jqx-aprv-wrap{display:flex; align-items:center}
.jqx-aprv-wrap .more{flex:none; margin-left:auto}
.jqx-aprv-wrap .more .Button{margin:0 5px; color:#5629ee}
.jqx-aprv-line{display:flex; align-items:center; padding-right:40px; overflow:hidden}
.jqx-aprv-line > div{display:flex; align-items:center; flex:none}
.jqx-aprv-line > div:before{
 content: "\EA6C"; display:flex; align-items:center; justify-content:center; position:relative; width:22px; min-width:22px; height:22px; line-height:24px; margin:0px 8px; 
 font-family: "remixicon"; color:#888; font-size:15px; border-radius:50%; background:#fff; border:1px solid #ebebeb}
.jqx-aprv-line > div:first-child:before{display:none}
.jqx-aprv-line .name{display:block; font-size:14px; color:#555; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.jqx-aprv-line .state{margin-right:2px; font-size:18px}
.jqx-aprv-line .state.approval{color:#5f21c7}
.jqx-aprv-line .state.return{color:#fa167c}
.jqx-aprv-line .state i{position:relative; top:-1px; min-width:18px; vertical-align:middle}
.jqx-aprv-line .date{margin-left:2px; font-size:12px; color:#bdbdbd}
.jqx-aprv-line .memo{margin-left:4px; font-size:16px; cursor:pointer; color:#a4a4a4}

.aprv-sidemenu{position:fixed; background:#5629ee; margin-left:-49px; top:125px;  z-index:1; width: 16px; height:36px; border-radius: 0px 8px 8px 0px; display:flex; align-items:center}
.aprv-sidemenu::after{content:"\e996"; display:flex; align-items:center; justify-content:center;  width:16px; height:36px; font-family:"xeicon"; color:#fff; font-size:19px}
.aprv-sidemenu .aprv-tree{position:fixed; display:none; width:380px; height:calc(100% - 65px); background:#f7f7f7bd; backdrop-filter:blur(8px); padding:16px 18px 16px 24px; top:65px; box-shadow: 1px 5px 10px rgb(0 0 0 / 10%); overflow:auto; z-index:1}
.aprv-sidemenu:hover .aprv-tree{display:block}

/* 에디터 트리 메뉴 하단 위치 */
.se:not(#se-t):not(.se-blur){z-index:0 !important}

.aprv-box.ty2 .aprv-line{justify-content:flex-end;}
.aprv-box.ty2 .aprv-line > div{width:140px}
.aprv-box.ty2 .aprv-line > div > span{padding:0px 12px}

.aprv-box.ty2 .aprv-line > div.last > span:after{display:none}
.aprv-box.ty2 .aprv-line > div > .state-icon:before{left:18px}

.aprv-box.ty2 .aprv-line .state-icon i{display:flex; z-index: 2; justify-content:center; align-items: center; width:20px; height:20px; background:#d9d9d9; border-radius: 50%; color:#fff; font-size: 13px}
.aprv-box.ty2 .aprv-line .state-icon i.ico::before{content:"\eb7a"; font-family: 'remixicon'; font-style: normal; font-size: 16px;}

.aprv-box.ty2 .aprv-line .state-return .state-icon i.ico::before{content:"\ea58"; font-size: 14px;}
.aprv-box.ty2 .aprv-line .state-confirm.current .state-icon i.ico::before{content:"\ea8d"; font-size: 18px;}
.aprv-box.ty2 .aprv-line .state-between.current .state-icon i.ico::before{content:"\f3ab"; font-size: 18px;}

.aprv-box.ty2 .aprv-line .state-confirm .state-icon i{background:#b284ff; color:#fff; width:22px; height:22px; font-size: 18px;}
.aprv-box.ty2 .aprv-line .state-between .state-icon i{background:#adc3ba; color:#fff; width:22px; height:22px; font-size: 18px;}
.aprv-box.ty2 .aprv-line .state-return .state-icon i{background:#fa167c; color:#fff; width:22px; height:22px; font-size: 18px;}


.aprv-box.ty2 .aprv-line .state-next:last-child{margin-right:34px;}
.aprv-box.ty2 .aprv-line .state-confirm:last-child{margin-right:34px;}
.aprv-box.ty2 .aprv-line .state-return:last-child{margin-right:34px;}

.aprv-box.ty2 .aprv-line .state-next .state-icon i{display:flex; z-index: 2; justify-content:center; align-items: center; width:20px; height:20px; background:#d9d9d9; border-radius: 50%; color:#fff;}
.aprv-box.ty2 .aprv-line .state-next .state-icon i::before{font-size: 14px;}


.aprv-box.ty2 .aprv-line .state-confirm.current .state-icon i{background:#fff; color:#5f21c7; border:2px solid #5f21c7; width:32px; height:32px}

.aprv-box.ty2 .aprv-line .state-before{width:34px}
.aprv-box.ty2 .aprv-line .state-before .state-icon{position:relative; left:26px; display:flex; height:40px; align-items:center}
.aprv-box.ty2 .aprv-line .state-before .state-icon:before{position:absolute; left:16px;  content:""; display:block; width:74px; height:1px; background:#e5e5e5;}
.aprv-box.ty2 .aprv-line .state-before .state-icon span{display:flex; z-index: 2; min-width: 26px; justify-content:center; align-items: center; background:#b6b6b6; border-radius: 50px; color:#fff; font-size: 12px; padding:0px 4px}

.aprv-box.ty2 .aprv-line .state-after{width:34px;}
.aprv-box.ty2 .aprv-line .state-after .state-icon{position:relative; right:26px; display:flex; height:40px; align-items:center}
.aprv-box.ty2 .aprv-line .state-after .state-icon:before{position:absolute; left:-70px;  content:""; display:block; width:74px; height:1px; background:#e5e5e5;}

.aprv-box.ty2 .aprv-line .state-after .state-icon span{display:flex; z-index: 2; min-width: 26px; justify-content:center; align-items: center; background:#b6b6b6; border-radius: 50px; color:#fff; font-size: 12px; padding:0px 4px}

.aprv-box.ty2 .aprv-line .state-next .state-icon i{display:flex; z-index: 2; justify-content:center; align-items: center; width:20px; height:20px; background:#d9d9d9; border-radius: 50%; color:#fff; font-size: 13px}
.aprv-box.ty2 .aprv-line .state-next .state-icon:before{display:none}

.aprv-box.ty2 .aprv-line > div.state-confirm > .state-icon i{background:#b284ff; width:22px; height:22px; font-size: 18px;}
.aprv-box.ty2 .aprv-line > div.state-confirm.current .state-icon i{background:#fff; border:2px solid #5f21c7; width:32px; height:32px}

.aprv-box.ty2 .aprv-line > div.state-between.current .state-icon i{background:#fff; border:2px solid #4ec493; color:#4ec493; width:32px; height:32px}



/* **************************************** *
*  
* **************************************** */
.retain-app{display:flex; flex-wrap:wrap; position:relative; margin:-5px; box-sizing:border-box}
.retain-app .app-box{display:flex; flex-direction:column; align-items:center; justify-content:center; margin:5px; padding:0; height:140px; background:#fff; border:1px solid #efefef; box-sizing:border-box}

.retain-app .app-info{display:flex; align-items:center; position:relative; top:-5px; width:100%; padding:0 24px; box-sizing:border-box}
.retain-app .app-info .app-ico{margin-right:10px}
.retain-app .app-info .app-ico i{font-size:40px; color:#5629ee}
.retain-app .app-info .app-label{display:flex; align-items:center; flex:1}
.retain-app .app-info .app-label .tit{font-size:18px; font-weight:300; color:#333; letter-spacing:-0.5px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.retain-app .app-info .app-label .Button{min-width:70px; margin-left:auto}

.retain-app .app-state{padding:0 30px; box-sizing:border-box}
.retain-app .app-state .state-list:after{content:''; display:block; clear:both}
.retain-app .app-state .state-list li{float:left; margin-left:20px}
.retain-app .app-state .state-list li:first-child{margin-left:0}
.retain-app .app-state .state-list li .tit,
.retain-app .app-state .state-list li .num{line-height:1em; font-size:15px; letter-spacing:-0.5px}
.retain-app .app-state .state-list li .tit{font-weight:normal; color:#555}
.retain-app .app-state .state-list li .num{position:relative; color:#5629ee; font-weight:300}
.retain-app .app-state .state-list li .num:before{content:''; position:absolute; bottom:2px; left:0; width:100%; height:1px; background:#5629ee}

.retain-app .app-volume{display:flex; align-items:center; justify-content:flex-start; width:100%; margin-top:auto; padding:8px 30px; background:#f8f8f8; box-sizing:border-box}
.retain-app .app-volume .tit{line-height:1em; font-size:14px; letter-spacing:-0.5px; font-weight:normal; color:#555}
.retain-app .app-volume .confirm{margin-left:auto}

.retain-app .app-box.before .app-info .app-ico i{color:#555}
.retain-app .app-box.before .app-info .app-ico,
.retain-app .app-box.before .app-state{opacity:0.2}
.retain-app .app-box.before .app-state .state-list li a{cursor:default}
.retain-app .app-box.before .app-state .state-list li .num{color:#888}
.retain-app .app-box.before .app-state .state-list li .num:before{display:none}

.retain-app .app-box.active{background:rgba(86,41,238,.05); border:1px solid rgba(86,41,238,.2)}

.cart-library .retain-app{margin:0}
.cart-library .retain-app .app-box{width:100%; height:155px; margin:0; margin-bottom:10px; padding-top:20px; border:1px solid #efefef; box-shadow:none}
.cart-library .retain-app .app-box:last-child{margin-bottom:0}
.cart-library .retain-app .app-info{padding:0 20px}
.cart-library .retain-app .app-info .app-ico i{font-size:32px}
.cart-library .retain-app .app-state{display:flex; width:100%; justify-content:flex-start; padding:0 20px}
.cart-library .retain-app .app-volume{padding:8px 20px}

.cart-wrap{display:flex; flex-direction:column; justify-content:flex-start; min-width:1200px; max-width:1200px; height:100%}
.cart-app{flex:1; overflow:hidden; overflow-y:auto}
.cart-app .app-box{display:flex; align-items:center; position:relative; height:100px; border-bottom:1px solid #ebebeb}
.cart-app .app-box:first-child{border-top:1px solid #ebebeb}
.cart-app .app-box > div{flex:1}
.cart-app .app-box .app-select{display:flex; align-items:center; min-width:40px; max-width:40px; box-sizing:border-box}

.cart-app .app-box .app-info{display:flex; align-items:center; box-sizing:border-box}
.cart-app .app-box .app-info .app-ico{margin-right:10px}
.cart-app .app-box .app-info .app-ico i{font-size:40px; color:#5629ee}
.cart-app .app-box .app-info .app-label{display:flex; align-items:center; flex:1}
.cart-app .app-box .app-info .app-label .tit{font-size:18px; font-weight:300; color:#333; letter-spacing:-0.5px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}

.cart-app .app-box .app-volume{display:flex; align-items:center; justify-content:center; min-width:120px; box-sizing:border-box}
.cart-app .app-box .app-duration{display:flex; flex-direction:column; align-items:center; min-width:120px; box-sizing:border-box}

.cart-app .app-box .app-confirm{display:flex; flex-direction:column; min-width:360px; box-sizing:border-box}
.cart-app .app-box .app-confirm .app-term,
.cart-app .app-box .app-confirm .app-price{display:flex; align-items:center; justify-content:flex-end; text-align:right; padding:4px 0}
.cart-app .app-box .app-confirm .price{position:relative; margin-left:15px; font-size:18px; font-weight:300; line-height:1em; color:#333}
.cart-app .app-box .app-confirm .uni{margin-left:2px; font-size:15px; font-weight:normal; line-height:1em}
.cart-app .app-box .app-confirm .price.before{color:#999}
.cart-app .app-box .app-confirm .price.before:before{content:''; position:absolute; left:0; top:50%; width:100%; height:1px; background:#999}
.cart-app .app-box .app-confirm .discount{display:flex; align-items:center; justify-content:center; margin-left:5px; padding:5px 8px; background:#fa196d; border-radius:200px; box-sizing:border-box}
.cart-app .app-box .app-confirm .discount .price,
.cart-app .app-box .app-confirm .discount .uni{color:#fff; font-size:13px}
.cart-app .app-box .app-confirm .discount .price{margin-left:0}

.cart-app .app-box .app-del{display:flex; align-items:center; justify-content:center; min-width:120px; max-width:120px; box-sizing:border-box}
.cart-app .app-box .app-del .del{color:#999}

.cart-final{margin-top:auto}
.cart-final-price{position:relative; margin-top:-1px; border-top:1px solid #d7cefb; border-bottom:1px solid #d7cefb}
.cart-final-price .price-total{display:flex; align-items:center; height:70px; background:#f8f7fe}
.cart-final-price .price-total .total-tit,
.cart-final-price .price-total .total-calc{flex:auto}
.cart-final-price .price-total .total-tit{display:flex; align-items:center; justify-content:center; min-width:200px; max-width:200px; font-size:18px; font-weight:300; letter-spacing:-0.8px; line-height:1em;  color:#222}
.cart-final-price .price-total .total-calc{display:flex; align-items:center}
.cart-final-price .price-total .total-calc > div{display:flex; align-items:center}
.cart-final-price .price-total .total-calc .tit{margin-right:15px; color:#333; font-size:15px; font-weight:normal; line-height:1em; letter-spacing:-0.5px}
.cart-final-price .price-total .total-calc .price{position:relative; color:#333; font-size:18px; font-weight:300; line-height:1em}
.cart-final-price .price-total .total-calc .uni{margin-left:5px; color:#999; font-size:15px; font-weight:normal; line-height:1em}
.cart-final-price .price-total .total-calc .dash{margin:0 12px; color:#999; font-size:15px; font-weight:normal; line-height:1em}

.cart-final-price .price-confirm{display:flex; align-items:center; height:70px; background:#f8f7fe; border-top:1px solid #d7cefb}
.cart-final-price .price-confirm .total-tit{display:flex; align-items:center; justify-content:center; min-width:200px; max-width:200px; color:#222; font-size:18px; font-weight:300; letter-spacing:-0.8px; line-height:1em}
.cart-final-price .price-confirm .total-calc{display:flex; align-items:center; height:70px}
.cart-final-price .price-confirm .total-calc > div{display:flex; align-items:center}
.cart-final-price .price-confirm .total-calc .tit{margin-right:15px; color:#333; font-size:15px; font-weight:normal; line-height:1em; letter-spacing:-0.5px}
.cart-final-price .price-confirm .total-calc .price{position:relative; color:#333; font-size:18px; font-weight:300; line-height:1em}
.cart-final-price .price-confirm .total-calc .uni{margin-left:5px; color:#999; font-size:15px; font-weight:normal; line-height:1em}
.cart-final-price .price-confirm .total-calc .dash{margin:0 12px; color:#999; font-size:15px; font-weight:normal; line-height:1em}
.cart-final-price .price-confirm .total-calc .app-total .tit{font-size:15px}
.cart-final-price .price-confirm .total-calc .app-total .price{font-size:26px; font-weight:600}

.payment-type{display:flex; align-items:center; position:relative; height:70px; margin-top:-1px; border-top:1px solid #d7cefb; border-bottom:1px solid #d7cefb; background:#fff}
.payment-type .payment-tit,
.payment-type .payment-confirm{flex:auto}
.payment-type .payment-tit{display:flex; align-items:center; justify-content:center; min-width:200px; max-width:200px; font-size:18px; font-weight:300; letter-spacing:-0.8px; line-height:1em; color:#222}
.payment-type .payment-confirm .ImageRadio{margin-right:25px}

.payment-pay{position:relative; margin-top:25px; text-align:center; box-sizing:border-box}
.payment-pay .Button{width:180px}


/* **************************************** *
*  DOC-FLOW
* **************************************** */
.doc-flow{display:flex; align-items:center; height:28px; margin-top:50px; margin-bottom:50px}
.doc-flow .flow-point{display:flex; align-items:center; justify-content:center; flex:1; position:relative}
.doc-flow .flow-point:before,
.doc-flow .flow-point:after{content:''; position:absolute; top:50%; width:50%; height:2px; margin-top:-1px; background:#ddd}
.doc-flow .flow-point:before{left:0}
.doc-flow .flow-point:after{right:0}
.doc-flow .flow-point.line_l:before{background:linear-gradient(-43deg, #be52f2, #5629ee)}
.doc-flow .flow-point.line_r:after{background:linear-gradient(-43deg, #5629ee, #be52f2)}
.doc-flow .flow-point .pin{display:flex; align-items:center; justify-content:center; position:relative; width:20px; height:20px; background-color:#5629ee; border-radius:50%; z-index:1; box-sizing:border-box}
.doc-flow .flow-point .pin.gray{background-color: #fff; border:1px solid #aaa}
.doc-flow .flow-point .pin.gray i{color:#555}
.doc-flow .flow-point i{position:relative; left:1px; font-size:14px; color:#fff}
.doc-flow .flow-point .tit{position:absolute; left:0; width:100%; top:-30px; text-align:center; font-size:16px; font-weight:normal; letter-spacing:-0.8px; color:#888}
.doc-flow .flow-point.current i{left:0; font-size:24px; color:#5629ee}
.doc-flow .flow-point.current .tit{top:-27px; color:#333; font-weight:300}
.doc-flow .flow-point.current .pin{width:28px; height:28px; background:#fff; border:3px solid #5629ee; box-shadow:1px 5px 5px rgb(0 0 0 / 15%)}
/*.doc-flow .flow-point.current .pin{animation: pin-motion 2.5s cubic-bezier(0.7, 0, 0.3, 1) 1s infinite forwards}*/
@keyframes pin-motion{0%{margin-right:80px; opacity:0;} 50%{margin-right:0; opacity:1} 100%{margin-right:-80px; opacity:0}}


/* **************************************** *
*  CONTENT-CAROUSEL
* **************************************** */
.content-carousel{position:relative; padding:0 15px}
.content-carousel .carousel-control{position:absolute; top:50%; left:0; width:100%; height:30px; margin-top:-15px}
.content-carousel .carousel-control .control-arrow{display:flex; justify-content:center; align-items:center; position:absolute; top:50%; width:38px; height:38px; margin-top:-15px; padding:0; border:none; border-radius:50%; outline:none; font-size:0; cursor:pointer; z-index:1; transition:all .20s ease}
.content-carousel .carousel-control .control-prev,
.content-carousel .carousel-control .control-next{background:rgba(0,0,0,.2)}
.content-carousel .carousel-control .control-prev{left:-15px}
.content-carousel .carousel-control .control-next{right:-15px}
.content-carousel .carousel-control .control-prev:before,
.content-carousel .carousel-control .control-next:before{content:"\e93c"; color:rgba(255,255,255,.5); font-family:xeicon; font-size:24px; transition:all .20s ease}
.content-carousel .carousel-control .control-next:before{transform:rotate(-180deg)}
.content-carousel .carousel-control .control-prev:hover:before,
.content-carousel .carousel-control .control-next:hover:before{color:rgba(255,255,255,.8)}
.content-carousel .carousel-control .control-prev:hover,
.content-carousel .carousel-control .control-next:hover{background:rgba(0,0,0,.5)}

/* **************************************** *
*  E-BOM
* **************************************** */
.bom-signal {display:flex; align-items:center;}
.bom-signal .icon{display:flex; align-items:center; vertical-align:middle }
.bom-signal .icon .cont-txt{display:block; padding-left:4px; font-size:14px; letter-spacing:-0.2px; color:#707070; }
.bom-signal .icon i{font-size: 20px; font-weight: bold; color:#5629ee}

.gird-attach{display:flex; align-items:center; justify-content:center; cursor:pointer}
.gird-attach i{font-size: 20px;}
.gird-attach span{font-size: 12px; font-weight: 300; margin-left: 4px; color:#5629ee}

.project-list.srch-popup .bomlist > li {padding:14px}
.project-list.srch-popup .bomlist > li > div{width:100%; display:flex; padding:2px 0px;}
.project-list.srch-popup .bomlist > li > div .tit{flex:none; font-weight: 300; letter-spacing:-0.5px;  width:90px; text-overflow:initial; overflow: initial;}
.project-list.srch-popup .bomlist > li > div .txt{text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.project-list.srch-popup .bomlist .bottom{margin-top: 8px;;}
.project-list.srch-popup .bomlist .writer{width:auto; padding-right: 4px;}
.project-list.srch-popup .bomlist .writer span{width:initial; text-overflow:initial; margin:0; }
.project-list.srch-popup .bomlist .writer .Label-color{margin-right: 8px;}
.project-list.srch-popup .bomlist .writer .Label-color .cont-txt{font-size: 13px; line-height:initial}

.sample-grid .bom-tree,
.sample-grid .bom-part{display:flex; align-items:center;}
.sample-grid .bom-tree i{font-size: 17px; margin-right:8px; color:#5629ee}
.sample-grid .bom-part i{font-weight: bold; color:#5629ee; cursor:pointer; margin-left: 4px;}

.jqx-grid .jqx-item .Textinput{height:28px;}
.jqx-grid .jqx-item .Icon.Remove-sign, 
.jqx-grid .jqx-item .Button .Icon.Remove-sign,
.jqx-grid .jqx-item .Button.Typeb .Icon.Remove-sign{position:absolute; width:20px; height:38px; line-height:2; margin:-4px 0 0 -24px; padding:0; background:none; font-size:18px; color:#888; text-align:center; border:0; z-index:1; cursor:pointer}
.jqx-grid .jqx-item .Icon.Remove-sign:after, 
.jqx-grid .jqx-item .Button .Icon.Remove-sign:after,
.jqx-grid .jqx-item .Button.Typeb .Icon.Remove-sign:after{font-family:'remixicon'; content:"\EB99" }

.lf-tag {margin-left:8px;}
.lf-tag .tag-list li{float:left; margin-right:2px; margin-bottom:0px}
.lf-tag .tag-list li .tag-box{position:relative; max-height:40px; padding:4px 25px 4px 8px; line-height:1; background-color:#f8f7fe; border:1px solid #5629ee; box-sizing:border-box}
.lf-tag .tag-list li .tag-box div{font-size:12px; font-weight:normal; letter-spacing:-0.2px; color:#505050; word-break:keep-all;}
.lf-tag .tag-list li .tag-box .del{position:absolute; right:0; top:0; width:20px; height:25px; padding:0; line-height:25px; background:none; font-size:18px; color:#808080; text-align:center; border:0; cursor:pointer}
.lf-tag .tag-list li .tag-box .del:before{content:"\EB99";font-family:'remixicon'; color:#5629ee; font-size: 16px; }
.lf-tag .tag-list li .tag-box.ico {display: flex; align-items: center;}
.lf-tag .tag-list li .tag-box.ico i{font-size: 16px; margin-right: 4px; color: rgb(80, 80, 80, 1);}



/* **************************************** *
*  Change
* **************************************** */

.chg-process-wrap{width:100%; position:relative; display:flex; justify-content:center; background:#fafafa; border:1px solid #ededed; height:250px;  }
.chg-process-wrap ul{width:1460px; margin-top:32px;}
.chg-process-wrap ul li.chg-stage{float:left;}
.chg-process-wrap ul li.chg-stage .arrow-up.solid,
.chg-process-wrap ul li.chg-stage .arrow-right.solid{border-style:solid; border-color:#a38af7;}


.chg-process-wrap ul li.chg-stage .arrow-up.dashed,
.chg-process-wrap ul li.chg-stage .arrow-right.dashed{border-style:dashed; border-color:#4265d6}

.chg-process-wrap ul li.chg-stage .arrow-right:after{content:"";border-color: transparent transparent transparent #a38af7; border-style: solid; border-width: 5px 0 5px 10px; float: left; height: 0; margin: 0 10px; width: 0; position:absolute; right:-10px; top:-5px }
.chg-process-wrap ul li.chg-stage .arrow-right.dashed:after{content:"";border-color: transparent transparent transparent #4265d6; border-style: solid; border-width: 5px 0 5px 10px; float: left; height: 0; margin: 0 10px; width: 0; position:absolute; right:-10px; top:-5px }
.chg-process-wrap ul li.chg-stage .arrow-up.dashed:after{content:"";border-color: transparent transparent #4265d6; border-style: solid; border-width: 0 5px 10px; float: left; height: 0; margin: 0 10px; width: 0; position:absolute; right:-15px; top:0px }


.chg-process-wrap .chg-stage{position:relative; border:1px solid #e1e1e1; background:#fff; border-left:4px solid #5629ee; width: 140px; height:60px; border-radius: 4px; display:flex;justify-content:center; align-items:center;}
.chg-process-wrap .chg-stage.active{background:#f3efff; border:1px solid #c7b7ff; border-left:4px solid #5629ee; box-shadow: 3px 0px 5px #5629ee20;; }
.chg-process-wrap .chg-stage.active:before{content: "\e928"; font-family:'xeicon'; position:absolute; bottom:-5px; right:-7px; width:26px; height:26px; font-size: 18px; background:#5629ee; color:#fff; display:flex; justify-content:center; align-items:center; border-radius: 50%; }

.chg-process-wrap .chg-stage.checkbox:before{content: "\e928"; font-family:'xeicon'; position:absolute; bottom:-5px; right:-7px; width:26px; height:26px; font-size: 18px; background:#e3e3e3; color:#fff; display:flex; justify-content:center; align-items:center; border-radius: 50%; }
.chg-process-wrap .chg-stage:nth-child(1){transform:translateX(30px); top:80px;}
.chg-process-wrap .chg-stage:nth-child(2){transform:translateX(100px)}
.chg-process-wrap .chg-stage:nth-child(3){transform:translateX(170px); top:80px;}
.chg-process-wrap .chg-stage:nth-child(4){transform:translateX(240px)}
.chg-process-wrap .chg-stage:nth-child(5){transform:translateX(310px); top:80px;}
.chg-process-wrap .chg-stage:nth-child(6){transform:translateX(380px); top:80px;}
.chg-process-wrap .chg-stage:nth-child(7){transform:translateX(450px)}

.chg-process-wrap .chg-stage:nth-child(1) .arrow-right{position:absolute; border-left:1px; border-top:1px; top:-52px; left:65px; width:142px; height:51px}

.chg-process-wrap .chg-stage:nth-child(2) span:nth-child(2){position:absolute; border-top:1px; top:28px; left:135px; width:280px; }
.chg-process-wrap .chg-stage:nth-child(2) span:nth-child(3){position:absolute; border-left:1px; border-bottom:1px; top:58px; left:65px; width:142px; height:51px}
.chg-process-wrap .chg-stage:nth-child(2) .arrow-right.dashed::after{top:46px}

.chg-process-wrap .chg-stage:nth-child(3) .arrow-up{position:absolute; border-right:1px; border-bottom:1px; top:-21px; left:135px; width:142px; height:51px}

.chg-process-wrap .chg-stage:nth-child(4) span:nth-child(2){position:absolute;border-top:1px; top:28px; left:135px; width:490px;}
.chg-process-wrap .chg-stage:nth-child(4) span:nth-child(3){position:absolute; border-left:1px; border-bottom:1px; top:29px; left:162px; width:43px; height:82px}
.chg-process-wrap .chg-stage:nth-child(4) .arrow-right.dashed::after{top:77px}

.chg-process-wrap .chg-stage:nth-child(5) .arrow-right{position:absolute;border-top:1px; top:28px; left:135px; width:70px}
.chg-process-wrap .chg-stage:nth-child(6) .arrow-up{position:absolute; border-right:1px; border-bottom:1px; top:-21px; left:135px; width:142px; height:51px}

.chg-process-wrap .chg-stage:last-child{border-radius: 30px; border:1px solid #c7b7ff;}
.chg-process-wrap .chg-stage:last-child.active:before{display:none;}


.chg-category{width:100%; display:flex; flex-wrap:wrap;}
.chg-category .category-form{border:1px solid #dadada; width:32.5%; height: 320px; border-radius:8px; margin: 4px; padding:16px;} 
.chg-category .category-form .category-list{border-top:1px solid #dadada; height:250px; overflow:auto;}
.chg-category .category-form .category-list ul {padding-top:4px}
.chg-category .category-form .category-list ul li{line-height: 1.5; padding:8px 16px; /*border-bottom:1px solid #ebebeb;*/}
.chg-category .category-form .category-list ul li:hover,
.chg-category .category-form .category-list ul li.active{background:#f3f3f3; border-radius: 8px;}

.category{width:100%; display:flex; flex-wrap:wrap; gap:12px}
.category > div{flex:1}
.category .category-form{border-radius:8px; padding:16px; position:relative; box-shadow: -1px 1px 6px #00000014;} 
.category .category-form::before{content:''; display:block; position:absolute; bottom:0px; width:100%; height:4px; background:#5629ee; left:0px; border-radius: 0px 0px 8px 8px;}
.category > div:nth-child(1) .category-form:before{background:#5629ee}
.category > div:nth-child(2) .category-form:before{background:#6892ff}
.category > div:nth-child(3) .category-form:before{background:#82c8b5}
.category .category-form .category-list{border-top:1px solid #eee; height: 200px; overflow:auto;}
.category .category-form .category-list ul{padding-top:4px}
.category .category-form .category-list ul li{line-height: 1.5; padding:8px 16px; letter-spacing: -0.5px; color:#333}
.category .category-form .category-list ul li:hover,
.category .category-form .category-list ul li.active{background:#eee; border-radius: 8px;}
.category > div:nth-child(1) .category-form .category-list ul li:hover,
.category > div:nth-child(1) .category-form .category-list ul li.active{background:#a08ce514; border-radius: 8px;}
.category > div:nth-child(2) .category-form .category-list ul li:hover,
.category > div:nth-child(2) .category-form .category-list ul li.active{background:#a9b9e21a; border-radius: 8px;}
.category > div:nth-child(3) .category-form .category-list ul li:hover,
.category > div:nth-child(3) .category-form .category-list ul li.active{background:#a6c8b620; border-radius: 8px;}

/* **************************************** *
*  PDM-ECR
* **************************************** */
.ecr_cont_left .writing-ty1 .writing-tit{padding:0}
.ecr_cont_left .writing-ty1 .writing-list{border-top:0; border-bottom:0; padding:0}
.ecr_cont_left .columnBox .keySearchbox{padding:15px 0 5px 0;}
.ecr_cont_left .ecr_search .fillCont{height:230px; font-size:14px}
.ecr_cont_left .ecr_search .fillCont a{display:flex; align-items: center}
.ecr_cont_left .ecr_search .fillCont a span{color:#333}
.ecr_cont_left .ecr_search .fillCont a span.clicked{color:#5629ee}
.ecr_cont_left .ecr_search .fillCont a .ecr_ocl{position:relative}
.ecr_cont_left .ecr_search .fillCont a .ecr_ocl:before{content:"\e919"; font-family:'xeicon'; font-style:normal; font-size:19px; color:#ccc;}
.ecr_cont_left .ecr_search .fillCont a .ecr_ocl.clicked:before{content:"\e920"; font-family:'xeicon'; font-style:normal; font-size:19px; color: #5629ee}
.ecr_cont_left .ecr_search .fillCont a>span{margin-left:3px}
.ecr_cont_left .ecr_search .fillCont ul>li>ul>li{margin-left:20px}
.ecr_cont_left .ecr_search .fillCont ul>li>ul>li>.ImageCheckbox span{font-size:14px; max-width:120px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.ecr_cont_left .ecr_search .fillCont ul>li>ul>li>.ImageCheckbox:after{font-size:19px}
.ecr_cont_left .ecr_search .fillCont ul>li>ul>li>.ImageCheckbox>.Checkbox{margin-right:0}

.com-table.top-line .ecr_info .Table-wrapper{border:0; padding:0 0 0 16px}


/* **************************************** *
*  관리자-외부연동-홈텍스-연결정보관리
* **************************************** */
.txtprikey_info{display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; margin-top:5px; color:#999; height:18px}


/* **************************************** *
*  홈텍스-popup_list
* **************************************** */
.approv_numb,
.approv_numb2,
.approv_numb3{display:flex; flex-direction:row; justify-content:flex-start; align-items:center; width:100%; height:50px; border-top:1px solid #eaeaea; border-bottom:1px solid #eaeaea}
.approv_numb p,
.approv_numb2 p,
.approv_numb3 p{min-width:172px; height:49px; display:flex; align-items:center; justify-content:center; margin-right:20px; background:#f2edff; color:#5629ee; font-weight:600}
.approv_numb2 .approv_cts{width:50%; display:flex; align-items:center}
.approv_numb3 .approv_cts{width:33.333%; display:flex; align-items:center}

.sup_tit{display:block; color:#333; font-weight:600; position:relative; padding:0 7px 13px 7px}
.sup_tit.blue{color:#0061ff}
.sup_tit.red{color:#e00e36}
.sup_tit:before{content:''; position:absolute; bottom:8px; left:50%; transform:translate(-50%, 0); width:100%; height:1px; background:#ddd}
.sup_tit.blue:before{background:#0061ff}
.sup_tit.red:before{background:#e00e36}
.columnBox.b_red{border:1px solid #fae2e7}
.columnBox.b_blue{border:1px solid #deeafd}

.columnBox.h428{min-height:428px}


/* **************************************** *
*  프린터/라벨 설정
* **************************************** */
.printer-label{display:flex; flex-wrap:wrap; align-items:stretch; margin-left:-20px; margin-top:-20px; box-sizing:border-box}
.printer-label .printer-label-box{flex:1; min-width:33.33333%; max-width:33.33333%; margin-top:20px; box-sizing:border-box}
.printer-label .printer-label-inner{position:relative; height:100%; margin-left:20px; padding:30px; border:1px solid #ebebeb; box-shadow:4px 4px 10px 0 rgb(0 0 0 / 6%); border-radius:15px; box-sizing:border-box}
.printer-label .printer-label-inner:hover{background:rgba(86,41,238,.04); border:1px solid rgba(86,41,238,.2)}

.printer-label .printer-label-list li{display:flex; position:relative; margin-bottom:8px}
.printer-label .printer-label-list li:last-child{margin-bottom:0}
.printer-label .printer-label-list .label-tit{min-width:140px; max-width:140px}
.printer-label .printer-label-list .label-tit .tit,
.printer-label .printer-label-list .label-info{line-height:135%; font-size:15px; font-weight:normal; letter-spacing:-0.5px; word-break:break-all}
.printer-label .printer-label-list .label-tit .tit{color:#777}
.printer-label .printer-label-list .label-info{color:#222}

.printer-label .printer-label-controll{display:none; position:absolute; right:15px; top:15px}
.printer-label .printer-label-inner:hover .printer-label-controll{display:block}

/* 회사정보 */
.info_company{border:1px solid #eaeaea; border-radius:10px; padding:30px 10px}


/* **************************************** *
*  약관 컨텐츠
* **************************************** */
.terms-wrap{padding:25px}
.terms-tit01,
.terms-tit02{display:block; margin-top:25px; line-height:150%; font-family:ptd !important; font-size:18px; color:#202020; font-weight:300; letter-spacing:-0.8px}
.terms-tit01{font-size:17px}
.terms-tit02{font-size:15px}

.terms-info01{margin-top:8px; line-height:155%; color:#505050; font-family:ptd !important; font-size:14px; font-weight:normal; letter-spacing:-0.5px}
.terms-info02{margin-top:8px; line-height:155%; color:#505050; font-family:ptd !important; font-size:14px; font-weight:normal; letter-spacing:-0.5px}

.terms-list01 > li{position:relative; margin-top:8px; line-height:150%; color:#505050; letter-spacing:-0.5px; margin-bottom:2px; padding-left:25px; font-family:ptd !important; font-size:14px}
.terms-list01 > li:last-child{margin-bottom:0}
.terms-list01 li .unt{position:absolute; top:0; left:0}

.terms-list02 > li{position:relative; margin-top:4px; line-height:150%; color:#505050; letter-spacing:-0.5px; margin-bottom:2px; padding-left:25px; font-family:ptd !important; font-size:14px}
.terms-list02 > li:last-child{margin-bottom:0}
.terms-list02 li .unt{position:absolute; top:0; left:0}

.terms-list03 > li{position:relative; margin-top:4px; line-height:150%; color:#505050; letter-spacing:-0.5px; margin-bottom:2px; padding-left:25px; font-family:ptd !important; font-size:14px}
.terms-list03 > li:last-child{margin-bottom:0}
.terms-list03 li .unt{position:absolute; top:0; left:0}


/* **************************************** *
*  WMS-SEARCHBOX
* **************************************** */

.com-searchbox .search-inner{border:1px solid #eaeaea; border-radius:12px; overflow:auto; padding:6px 0px; }

.Splitter-cont .search-inner{border:0; box-shadow: none;}
.Splitter-cont .com-searchbox .search-inner{padding:4px 12px;}
.Splitter-cont .com-searchbox .searchConfirm{right:-10px; top:-11px}
.Splitter-cont .Table-wrapper.Table-wrapper{border:0; border-radius: 0; border-bottom: 1px solid #ececec;}

.jqx-grid .editcolumn:before{content:""}

/* 팝업 */
.layerpop-box.wms-layout .jqx-widget-content .jqx-splitter-panel{border-radius: 0;}
.layerpop-box.wms-layout .Splitter-cont .columnBox{border:0; padding:0}




/* **************************************** *
*  APPRICE-PAYMENT
* **************************************** */
.apprice-payment{display:flex; flex-direction:column; position:relative; height:100%; padding-top:80px; box-sizing:border-box}
.price-layout .apprice-payment{height:auto}
.apprice-payment .payment-header{position:absolute; top:0; left:0; width:100%; height:80px; box-shadow:0 4px 4px 0 rgb(0 0 0 / 8%)}
.apprice-payment .payment-header .header-top{position:relative; width:1400px; margin:0 auto}
.apprice-payment .payment-header .payment-logo{position:absolute; left:0; top:10px}
.apprice-payment .payment-header .payment-logo img{width:120px}

.apprice-payment .payment-group{display:flex; justify-content:flex-start; width:1400px; height:100%; margin:0 auto}
.layerpop-box .apprice-payment .payment-group{width:100%}
.apprice-payment .payment-l{flex:1; padding:35px 0 35px}
.apprice-payment .payment-r{width:440px; margin-left:20px; padding:40px; border-left:1px solid #dadada; border-right:1px solid #ebebeb; box-sizing:border-box}
.price-layout .apprice-payment .payment-r{height:auto}

.apprice-payment .service-type{display:flex; align-items:center; position:relative}
.apprice-payment .service-type .type-box{display:flex; align-items:center; flex-direction:column; flex:1; padding:40px 20px; border:1px solid #dadada; border-radius:18px; box-sizing:border-box}
.apprice-payment .service-type .type-box.active{border:2px solid #5629ee}
.apprice-payment .service-type .type-box:nth-child(1){margin-right:10px}
.apprice-payment .service-type .type-box:nth-child(2){margin-left:10px}
.apprice-payment .service-type .type-box .type-select{display:flex; align-items:center}
.apprice-payment .service-type .type-box .type-select .ImageRadio span{font-size:18px; font-weight:300; letter-spacing:-0.5px}

.apprice-payment .service-type .type-price{display:flex; align-items:center; flex-direction:column; margin-top:35px}
.apprice-payment .service-type .type-price .price-point{display:flex; align-items:center}
.apprice-payment .service-type .type-price .price-box{display:flex; align-items:center}
.apprice-payment .service-type .type-price .price-box .price-tit{display:flex; align-items:center; justify-content:center; margin-right:10px; width:92px; height:44px; background:#ebe6fb; border-radius:200px}
.apprice-payment .service-type .type-price .price-box .price-tit .tit{color:#5629ee; font-size:15px; letter-spacing:-0.5px; font-weight:300}
.apprice-payment .service-type .type-price .price-box .price-tit.jin{background:#ddf5ed}
.apprice-payment .service-type .type-price .price-box .price-tit.jin .tit{color:#37ae84}
.apprice-payment .service-type .type-price .price-box .price-tit.ssp{background:#dff5ff}
.apprice-payment .service-type .type-price .price-box .price-tit.ssp .tit{color:#26a2dc}

.apprice-payment .service-type .type-price .price-box .price-price{display:flex; align-items:center}
.apprice-payment .service-type .type-price .price-box .price-price .price{color:#333; font-size:44px; font-weight:300; line-height:1em}
.apprice-payment .service-type .type-price .price-box .price-price .uni{margin-left:5px; color:#333; font-size:15px; font-weight:normal; line-height:1em}
.apprice-payment .service-type .type-price .price-box:last-child{margin-left:20px}
.apprice-payment .service-type .type-price .sum-info{margin-top:30px; color:#999; font-size:15px; font-weight:normal; line-height:1em}


.apprice-payment .ucart-final-price{position:relative; margin-top:-1px; border-top:1px solid #d7cefb; border-bottom:1px solid #d7cefb}
.apprice-payment .ucart-final-price .price-confirm{display:flex; align-items:center; height:70px; background:#f8f7fe}
.apprice-payment .ucart-final-price .price-confirm .total-tit{
 display:flex; align-items:center; justify-content:flex-end; min-width:200px; max-width:200px; padding-right:40px;
 color:#222; font-size:18px; font-weight:300; letter-spacing:-0.8px; line-height:1em; box-sizing:border-box}
.apprice-payment .ucart-final-price .price-confirm .total-calc{display:flex; align-items:center; height:70px}
.apprice-payment .ucart-final-price .price-confirm .total-calc > div{display:flex; align-items:center}
.apprice-payment .ucart-final-price .price-confirm .total-calc .tit{margin-right:15px; color:#333; font-size:15px; font-weight:normal; line-height:1em; letter-spacing:-0.5px}
.apprice-payment .ucart-final-price .price-confirm .total-calc .stit{color:#333; font-size:13px; font-weight:normal; line-height:1em; letter-spacing:-0.5px}
.apprice-payment .ucart-final-price .price-confirm .total-calc .price{position:relative; color:#333; font-size:18px; font-weight:300; line-height:1em}
.apprice-payment .ucart-final-price .price-confirm .total-calc .uni{margin-left:5px; color:#999; font-size:15px; font-weight:normal; line-height:1em}
.apprice-payment .ucart-final-price .price-confirm .total-calc .dash{margin:0 12px; color:#999; font-size:15px; font-weight:normal; line-height:1em}

.apprice-payment .ucart-final-price .price-confirm .total-calc .app-total .price{font-size:26px; font-weight:600}

.apprice-payment .ucart-final-price .price-confirm .total-calc .discount{display:flex; align-items:center; justify-content:center; margin-right:5px; padding:5px 8px; background:#fa196d; border-radius:200px; box-sizing:border-box}
.apprice-payment .ucart-final-price .price-confirm .total-calc .discount .price,
.apprice-payment .ucart-final-price .price-confirm .total-calc .discount .uni{color:#fff; font-size:13px}
.apprice-payment .ucart-final-price .price-confirm .total-calc .discount .price{margin-left:0}

.apprice-payment .ucart-final-price .price-total{display:flex; align-items:center; height:70px; background:#f8f7fe; border-top:1px solid #d7cefb}
.apprice-payment .ucart-final-price .price-total .total-tit,
.apprice-payment .ucart-final-price .price-total .total-calc{flex:auto}
.apprice-payment .ucart-final-price .price-total .total-tit{
 display:flex; align-items:center; justify-content:flex-end; min-width:200px; max-width:200px; padding-right:40px;
 color:#222; font-size:18px; font-weight:300; letter-spacing:-0.8px; line-height:1em; box-sizing:border-box}
.apprice-payment .ucart-final-price .price-total .total-calc{display:flex; align-items:center}
.apprice-payment .ucart-final-price .price-total .total-calc > div{display:flex; align-items:center}
.apprice-payment .ucart-final-price .price-total .total-calc .tit{margin-right:15px; color:#333; font-size:15px; font-weight:normal; line-height:1em; letter-spacing:-0.5px}
.apprice-payment .ucart-final-price .price-total .total-calc .price{position:relative; color:#333; font-size:18px; font-weight:300; line-height:1em}
.apprice-payment .ucart-final-price .price-total .total-calc .uni{margin-left:5px; color:#999; font-size:15px; font-weight:normal; line-height:1em}
.apprice-payment .ucart-final-price .price-total .total-calc .vat{margin-left:5px; color:#555; font-size:15px; font-weight:normal; line-height:1em}
.apprice-payment .ucart-final-price .price-total .total-calc .dash{margin:0 12px; color:#999; font-size:15px; font-weight:normal; line-height:1em}
.apprice-payment .ucart-final-price .price-total .total-calc .app-total .price{font-size:26px; font-weight:600}

.apprice-payment .upayment-type{display:flex; align-items:center; position:relative; height:70px; margin-top:-1px; border-top:1px solid #d7cefb; border-bottom:1px solid #d7cefb; background:#fff}

.apprice-payment .upayment-type .payment-tit{display:flex; align-items:center; justify-content:flex-end; padding-right:40px; min-width:200px; max-width:200px; font-size:18px; font-weight:300; letter-spacing:-0.8px; line-height:1em; color:#222; box-sizing:border-box}
.apprice-payment .upayment-type .payment-confirm .ImageRadio{margin-right:15px}
.apprice-payment .upayment-type .payment-confirm .ImageRadio:last-child{margin-right:10px}
.apprice-payment .upayment-type .bank-info{padding:10px 18px; color:#333; font-size:13px; font-weight:normal; letter-spacing:-0.2px; line-height:1em; background:#f0f2f5; border-radius:200px}

.apprice-payment .service-period{display:flex; align-items:center; position:relative; height:70px; margin-top:-1px; border-top:1px solid #d7cefb; border-bottom:1px solid #d7cefb; background:#fff}
.apprice-payment .service-period .period-tit,
.apprice-payment .service-period .period-confirm{flex:auto}
.apprice-payment .service-period .period-tit{display:flex; align-items:center; justify-content:flex-end; padding-right:40px; min-width:200px; max-width:200px; font-size:18px; font-weight:300; letter-spacing:-0.8px; line-height:1em; color:#222; box-sizing:border-box}
.apprice-payment .service-period .period-form .Spinner{margin-right:25px; border-radius:4px}
.apprice-payment .service-period .period-form .ImageRadio{margin-right:15px}


.apprice-payment .service-check{display:flex; flex-wrap:wrap; margin-left:-5px; margin-top:-5px}
.apprice-payment .service-check:after{content:''; display:block; clear:both}
.apprice-payment .service-check li{min-width:50%; max-width:50%}

.apprice-payment .service-option-view{display:flex; align-items:center; flex-direction:column; background:#fff; border-top:3px solid #5629ee; border-bottom:1px solid #5629ee; box-sizing:border-box}
.apprice-payment .service-option-view .option-view-group{display:flex; align-items:flex-start; width:100%; justify-content:space-between}
.apprice-payment .service-option-view .option-view-group .option-tit{min-width:120px; max-width:120px; padding-left:15px; padding-top:17px; box-sizing:border-box}
.apprice-payment .service-option-view .option-view-group .option-tit .tit{font-size:17px; font-weight:300; line-height:1em; letter-spacing:-0.8px}
.apprice-payment .service-option-view .option-view-group .option-view{display:flex; flex-direction:column; flex:1; flex-direction:column; padding:15px 0; border-top:1px solid #dadada; box-sizing:border-box}
.apprice-payment .service-option-view .option-view-group:first-child .option-view{border-top:0}

.apprice-payment .service-option-view .option-view-group .view-box{display:flex; align-items:center; margin-top:5px}
.apprice-payment .service-option-view .option-view-group .view-box:first-child{margin-top:0}
.apprice-payment .service-option-view .option-view-group .view-box .view-tit{width:110px}
.apprice-payment .service-option-view .option-view-group .view-box .view-tit .tit{margin-right:15px; color:#333; font-size:15px; font-weight:normal; line-height:1em; letter-spacing:-0.8px}
.apprice-payment .service-option-view .option-view-group .view-box .view-detail .price{position:relative; color:#333; font-size:18px; font-weight:300; line-height:1em}
.apprice-payment .service-option-view .option-view-group .view-box .view-detail .uni{margin-left:5px; color:#999; font-size:15px; font-weight:normal; line-height:1em}
.apprice-payment .service-option-view .option-view-group .view-box .view-detail{display:flex; align-items:center; flex:1}

.apprice-payment .service-option-view .option-add-group-wrap{display:flex; flex-direction:column; width:100%; padding:13px 0; background:#f8f7fe; border-top:1px solid #d7cefb; box-sizing:border-box}
.apprice-payment .service-option-view .option-add-group{display:flex; align-items:flex-start; position:relative; width:100%; justify-content:space-between}
.apprice-payment .service-option-view .option-add-group .option-tit{min-width:120px; max-width:120px; padding-left:15px; padding-top:15px; box-sizing:border-box}
.apprice-payment .service-option-view .option-add-group .option-tit .tit{font-size:15px; font-weight:300; line-height:1em; letter-spacing:-0.8px}
.apprice-payment .service-option-view .option-add-group .option-form{display:flex; align-items:center; flex:1; padding:3px 0; box-sizing:border-box}
.apprice-payment .service-option-view .option-add-group .Spinner{border-radius:4px}
.apprice-payment .service-option-view .option-add-group .option-form .uni{margin-left:5px; color:#555; font-size:15px; font-weight:normal; line-height:1em}

.appintro,
.appcomplet-result{display:flex; align-items:center; justify-content:center; flex-direction:column; height:100%}
.appcomplet-result .appcomplet-img{margin-bottom:25px}
.appcomplet-result .appcomplet-img img{width:180px}
.appcomplet-result .appcomplet-message .message{line-height:155%; color:#222; font-size:28px; font-weight:normal; text-align:center; letter-spacing:-1.5px}
.appcomplet-result .appcomplet-message .message strong{font-weight:300; color:#5629ee}
.appcomplet-result .appcomplet-help{margin-top:15px; line-height:155%; color:#888; font-size:16px; text-align:center; letter-spacing:-0.5px}
.appcomplet-result .appcomplet-confirm{margin-top:35px}

.appintro .appintro-img{margin-bottom:20px}
.appintro .appintro-img img{width:110px}
.appintro .appintro-message .message{line-height:155%; color:#111; font-size:28px; font-weight:normal; text-align:center; letter-spacing:-1.5px}
.appintro .message.bold{font-weight:600}
.appintro .appintro-message .message strong{color:#5629ee}
.appintro .appintro-btm-message{font-size:18px; line-height:155%; color:#333; text-align:center; letter-spacing:-0.5px; margin-top:30px}


/* **************************************** *
*  TUTORIAL 
* **************************************** */
.tutorial-popup{position:fixed; display:flex; align-items:center; justify-content:center; z-index:1002; background:#00000085; width:100%; height:100%; left:0px; top:0px;}
.welcome-wrap{display:flex; flex-direction:column;  position:relative}
.welcome-wrap .button_wrap{display:flex; height:50px; font-size:20px; letter-spacing:-0.8px;}
.welcome-wrap .btn_close{position:absolute; z-index: 1;  right:-4px; top:25px; width:34px; height:34px; color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.welcome-wrap .btn_close i{font-size: 18px;}
.welcome-wrap .button_wrap .btn_tutorial{width:100%; background:#fff; color:#5d56b4; font-weight:300; display:flex; align-items:center; justify-content:center; cursor:pointer}
.welcome-wrap .btn_tdclose{ letter-spacing:-0.8px; color:#e4e4e4; font-size:16px; margin-top:12px; text-decoration:underline; text-underline-offset:4px; cursor:pointer; padding-left:8px;}
.quick_tutorial{position:absolute; left:calc(100% - 354px); top:44px; display:flex; flex-direction:column;align-items:flex-end;}
.quick_tutorial p{color:#fff; letter-spacing:-0.8px; font-size:20px; line-height:1.2; width:200px; word-break:keep-all; text-align:right; margin-right:20px; margin-top:8px;}
.quick_all{position:absolute; left:50px; top:36px; display:flex; }
.quick_all .icon_arrow{transform: scaleX(-1); width:30px; height:62px}
.quick_all p{color:#fff; letter-spacing:-0.8px; font-size:20px; line-height:1.2; word-break:keep-all; margin-left:12px; margin-top:42px;}

.tutorial-main .stitArea .stit02{font-weight: normal; font-size: 28px;}
.tutorial-main .infoTxt01{font-size: 18px; color:#555}
.tutorial-list .tutorial{position:relative; float:left; background:#fff; box-shadow: 3px 0px 12px #5629ee20; border-radius: 15px; padding:30px; cursor:pointer; width:23%; min-width: 400px;; height:186px; margin:16px;}
.tutorial-list .tutorial .cont{min-width:95%; height:100%; display:flex; flex-direction: column; align-items:flex-start; justify-content:center;}
.tutorial-list .tutorial .category{border-radius: 30px; flex:none; background:#5629ee; color:#fff;padding:4px 10px; font-size: 12px;}
.tutorial-list .tutorial .tit{font-size: 20px; margin-top: 10px; width:85%; color:#222;   text-overflow: ellipsis; overflow: hidden;  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2;}
.tutorial-list .tutorial .cont::after{content:"\e93e"; position:absolute; color:#a9add3; right:24px; top:45%; font-family:"xeicon"; font-size: 24px;} 
.tutorial-list .tutorial:hover,
.tutorial-list .tutorial.active{background:linear-gradient(45deg, #642fef, #af4df2);}
.tutorial-list .tutorial:hover .category,
.tutorial-list .tutorial.active .category{background:#fff; color:#5629ee; }
.tutorial-list .tutorial:hover .tit,
.tutorial-list .tutorial.active .tit{color:#fff;}
.tutorial-list .tutorial:hover .cont::after,
.tutorial-list .tutorial.active .cont::after{color:#fff;}
.tutorial-layout .page-tit-wrap .page-tit .link-tutorial{top:21px; letter-spacing: -0.8px;}
.tutorial-layout .page-tit-wrap .page-tit .link-tutorial i:before{background:#d8cdfe; color:#222; border-radius: 0; width:14px; height:12px;}



/* **************************************** *
*  MODULE SELECT
* **************************************** */
.module-select {min-width:88px; height: 40px; border-radius: 8px; /*border:1px solid #ddd;*/  background-size: 20px; cursor: pointer;}
.module-select:hover,
.module-select:focus,
.module-select:active{/*border:1px solid #b7afd4;*/ box-shadow:2px 2px 4px 0 rgba(0,0,0,0.1)}   
.module-select .label {position:relative; display : flex; align-items: center; width: 100%; height: inherit; border: 0 none; outline: 0 none; font-size: 15px; letter-spacing: -0.8px; padding-left: 15px; background: transparent; cursor: pointer; }
.module-select .optionList {position: absolute; top: 59px; left: 90px; min-width:170px; background: #fff; color: #222; list-style-type: none; padding: 0; border-radius: 6px; overflow: hidden; max-height: 0; transition: .3s ease-in; z-index: 3; box-shadow: -1px 1px 10px #0000001c;}
.module-select.active {z-index: 10;}
.module-select.active .optionList { max-height: 600px; }  
.module-select .optionItem {display:flex; padding: 10px 16px; transition: .1s; height:36px;}
.module-select .optionItem:hover {background:#f1f1f1;  }
  

/* **************************************** *
*  sample - toolkit report
* **************************************** */
.report_wrap,
.report_wrap2{padding-bottom:30px}
.report_print{display:flex; justify-content:flex-end}
.report_cont{border:1px solid #eaeaea; border-radius:10px; padding:20px}
.report_wrap .writing-ty1 .writing-cont span,
.report_wrap2 .writing-ty1 .writing-cont span{display:inline-block; font-size:15px; letter-spacing:-0.5px; color:#555; font-weight:normal}
.report_wrap .writing-ty1 .writing-list:first-child,
.report_wrap2 .writing-ty1 .writing-list:first-child{border-top:1px solid #ddd}
.etc_box{display:flex; align-items:center; box-sizing:border-box}
.etc_box .writing-tit .tit{display:inline-block; font-size:15px; letter-spacing:-0.5px; color: #202020}
.etc_box .writing-cont{display:flex; align-items:center; flex:auto; border:1px solid #ddd; border-radius:10px; min-height:120px; padding:8px}
.etc_box .writing-cont p{font-size:15px; letter-spacing:-0.5px; color: #555}

.writing-ty1 .writing-list .box_line .writing-tit{background: #f4f4f4; height:50px}
.writing-ty1 .writing-list .box_line .writing-cont span{padding-left:8px}
.writing-ty1 .writing-list .box_tline{border-top:1px solid #ddd;}
.writing-ty1 .writing-list .col-box li.box_line{padding:0 !important}
.writing-ty1 .writing-list .col-box .box_line{border-bottom:1px solid #ddd}


/* **************************************** *
*  MOVE-COTROLLER BUTTON
* **************************************** */
.fixConWrap.movectrl .fixMove .Button{min-height:40px; height:auto;}
.fixConWrap.movectrl .fixMove .Button.small{min-height:auto}


/* **************************************** *
*  WAREHOUSE SET
* **************************************** */
.rack-btn{width:40px; height:40px; border-radius:10px; background:#f0f2f2; color:#808080; font-size:15px; letter-spacing: -0.8px; border:0; cursor:pointer}

.rack-btn.active{background:#5c6072; color:#fff}
.rack-set-wrap .carousel-box{border-radius:10px; border-color:#e9e9e9; padding:10px 52px;}
.rack-set-wrap .carousel-box .rack-set{width:100%}
.rack-set-wrap .carousel-box .rack-set ul{display:flex; align-items:flex-end; justify-content:space-evenly;}
.rack-set-wrap .carousel-box .rack-set ul li{display:inline-flex; flex-direction:column; align-items:center; flex:none; margin:0px 4px; width:min-content}
.rack-set-wrap .carousel-box .rack-set ul li .set-tit{font-weight: 300; letter-spacing: -0.8px; color:#333; padding:8px 0px; word-break:keep-all; display:inline-block; width:100%; text-align: center;}
.rack-set-wrap .carousel-box .rack-set ul li .set-info {height:38px; display:flex; align-items:flex-end; }
.rack-set-wrap .carousel-box .rack-set ul li .set-info .rack-btn{width:36px; height:36px}
.rack-set-wrap .cell-box{border-radius:10px; border:1px solid #e9e9e9; width:100%; max-height: 300px; padding:16px; overflow:auto; }
.rack-set-wrap .cell-box ul{display:flex; flex-wrap:nowrap; flex-direction:row}
.rack-set-wrap .cell-box ul li{display:inline-flex; flex-wrap:wrap; flex:none}
.rack-set-wrap .cell-box ul li.depth{border-right:1px dashed #e1e1e1; min-width:60px;}
.rack-set-wrap .cell-box ul li.depth:last-child{border-right: none;}
.rack-set-wrap .cell-box ul li.depth.split{min-width: 116px}
.rack-set-wrap .cell-box ul li .cell{width:54px; height:54px; border-radius: 10px; display:flex; justify-content:center; align-items:center; margin:4px;}
.cell .cell-btn{width:100%; height:100%; border-radius:10px; background:#fff; color:#808080; font-size:12px; padding:0px; letter-spacing: -1px; border:1px solid #efefef;  cursor:pointer; line-height: 1;}
.cell .cell-btn.active{background:#a38af7; border-color:#a38af7; color:#fff ;}
.cell .cell-btn.color01{background:#f10f3a; border-color:#f10f3a; color:#fff ;}
.cell .cell-btn.color11{background:#33beff; border-color:#33beff; color:#ffffff90; }
.cell .cell-btn.color11.light{background:#dff5ff; color:#26a2dc; border-color:#bdeaff;}
.rack-set-wrap .carousel-thum .slick-arrow{top:40%}
.rack-set-wrap .carousel-thum .slick-prev{left:40px}
.rack-set-wrap .carousel-thum .slick-next{right:40px;}
.rack-set-wrap .carousel-thum .slick-dots li{display:none;}
.rack-set-wrap .carousel-thum .slick-dots li[aria-hidden="false"]{display:none !important;}
.rack-set-wrap .carousel-thum .slick-dots li button{justify-content:center; align-items:center; position:absolute; top:40%; margin-top:-15px;  width:38px; height:38px; padding:0; border:none; border-radius:50%; outline:none; font-size:0; cursor:pointer; z-index:1; transition:all .20s ease; background:rgba(0,0,0,.1);}
.rack-set-wrap .carousel-thum .slick-dots li button:hover{background:rgba(0,0,0,.5)}
.rack-set-wrap .carousel-thum .slick-dots li button:before{content:"\f2e3"; font-family:remixicon; color:rgba(255,255,255,.5); font-size:24px; transition:all .20s ease}
.rack-set-wrap .carousel-thum .slick-dots li:first-child,
.rack-set-wrap .carousel-thum .slick-dots li:last-child{display:inline-block;}
.rack-set-wrap .carousel-thum .slick-dots li:first-child button{left:0px}
.rack-set-wrap .carousel-thum .slick-dots li:last-child button{right:0px; transform:rotate(-180deg)}

/* **************************************** *
*  BOI
* **************************************** */
.project-process{width:100%; position:relative; background:#fff; border:1px solid #ededed; height:500px; border-radius: 10px;  }
.project-process .stit04{position:absolute; background:#fff; left:40px; top:-12px; display:block; padding:2px 16px;}

.project-process .writing-ty1{display:flex;}
.project-process .writing-ty1 .writing-list{border:none; width: 50%; margin:24px 48px 8px; }
.project-process .writing-ty1 .writing-list > li{min-height: 42px;}
.project-process .writing-ty1 .writing-list .writing-tit .tit{font-weight: 300;}
.project-process .writing-ty1 .writing-list .infoTxt01 i{font-size: 16px;}
.project-process ul{position:relative; margin: 0 auto; margin-top:8px; width:fit-content;}
.project-process ul li.project-stage .line-solid{border:1px solid #d7d7d7;}
.project-process .project-stage{position:relative; display:inline-flex;  border:1px solid #e1e1e1; background:#fff; width: 160px; height:42px; border-radius: 4px; justify-content:center; align-items:center;}
.project-process .project-stage.active{background:#0061ff; border:1px solid #0061ff;}
.project-process .project-stage.active .txt{color:#fff}

.project-process .project-stage:nth-child(1){top:60px;}
.project-process .project-stage:nth-child(2){margin-left:40px;}
.project-process .project-stage:nth-child(3){margin-left:-164px; top:120px;}
.project-process .project-stage:nth-child(4){margin-left:40px}
.project-process .project-stage:nth-child(5){margin-left:40px;}

.project-process .project-stage:nth-child(1) .line-solid{position:absolute; border-right:0px; top:-40px; left:180px; width:24px; height:122px}
.project-process .project-stage:nth-child(1) .line-solid:before{position:absolute; top:60px; left:-22px; content:""; height:1px; width:21px; background:#d7d7d7}
.project-process .project-stage:nth-child(2) .line-solid{position:absolute; border-right:0px; border-top:0px; top:20px; left:180px; }
.project-process .project-stage:nth-child(2) .line-solid:before{position:absolute; top:0px; left:-22px; content:""; width:45px; height:1px; background:#d7d7d7}
.project-process .project-stage:nth-child(4) .line-solid{position:absolute; border-right:0px; border-top:0px; top:20px; left:180px; }
.project-process .project-stage:nth-child(4) .line-solid:before{position:absolute; top:0px; left:-22px; content:""; width:45px; height:1px; background:#d7d7d7}


.boi-wrap{position:relative;  width:fit-content; overflow:hidden; margin:0 auto}
.boi-wrap > ul > li{position:relative; min-height: 100px; display:flex; align-items:center;}
.boi-wrap > ul > li::after{content:""; position:absolute; left:0px; bottom:0px; width:100%; height:1px; background:#e8e8e8; z-index: 1;}
.boi-wrap > ul > li:nth-child(4):after{display:none}
.boi-wrap > ul > li:last-child:after{display:none}
.boi-wrap > ul > li > ul{width:100%; display:flex; justify-content:flex-start}
.boi-wrap > ul > li:nth-child(4){height:300px; align-items:flex-start}

.boi-wrap .boi-label {width:120px; flex:none}
.boi-wrap .boi-label .tit{font-size: 16px; letter-spacing: -0.6px; color:#222;}
.boi-wrap .boi-stage{display:inline-flex; flex-direction:column; align-items: center; position:relative; min-width: 152px; flex:none;}
.boi-wrap .boi-stage .arrow{display:block; position:absolute; top:-72px; z-index: 2;}
.boi-wrap .boi-stage .arrow::before{content:""; width: 0; height: 0; border-bottom: 6px solid #3fc495; border-left: 4px solid transparent; border-right: 4px solid transparent;}
.boi-wrap .boi-stage .arrow:after{content:""; width:2px; height:46px; background:#3fc495; display:block; margin-left: 3px;}
.boi-wrap .boi-stage .stage-ico{width:20px; height:20px; border-radius: 50%; border:3px solid #999; display:block; box-sizing:border-box; background:#fff; z-index:1;}
.boi-wrap .boi-stage .stage-ico::after{content:""; position:absolute; left:86px; top:10px; width:100%; height:1px; background:#ccc; }
.boi-wrap .boi-stage:last-child .stage-ico::after,
.boi-wrap .boi-stage:last-child .stage-ico::before,
.boi-wrap .boi-stage.last-child .stage-ico::before,
.boi-wrap .boi-stage.last-child .stage-ico::after{display:none;}
.boi-wrap > ul > li:first-child .stage-ico::after,
.boi-wrap > ul > li:first-child .stage-ico::before{display:none}
.boi-wrap .boi-stage .stage-ico.color01{border-color:#4265d6}
.boi-wrap .boi-stage .stage-ico.color02{border-color:#3fc495}
.boi-wrap .boi-stage .stage-ico.color03{border-color:#33beff}
.boi-wrap .boi-stage .stage-ico.only-line{border:none; background:transparent;}
.boi-wrap .boi-stage .stage-ico.only-line:before{content:""; position:absolute; left:86px; top:10px; width:100%; height:1px; background:#ccc; }
.boi-wrap .boi-stage:nth-child(7){margin-left: 20px;}
.boi-wrap > ul > li:nth-child(3) .boi-stage:nth-child(7) .stage-ico::after{left:66px}

.boi-wrap .boi-stage .stage-tit{color:#222; font-size: 14px; margin-top: 4px; z-index: 1;}
.boi-wrap .boi-stage.stage-bg01:after{content:""; width:100%; height:430px; background:#f6f2ff; position:absolute; top:-28px; z-index: 0; border-radius: 0px 0px 10px 10px;}
.boi-wrap .boi-stage.stage-bg02:after{content:""; width:100%; height:430px; background:#f3f8ff; position:absolute; top:-28px; z-index: 0; border-radius: 0px 0px 10px 10px;}
.boi-wrap .boi-stage.stage-bg03:after{content:""; width:100%; height:430px; background:#fff2f8; position:absolute; top:-28px; z-index: 0; border-radius: 0px 0px 10px 10px;}

.boi-wrap .boi-detail{display:inline-flex; align-items: flex-start; position:relative;justify-content:center;}

.boi-wrap > ul > li:nth-child(4) > ul{position:absolute; left:56px; top:70px; display:inline-flex; justify-content:flex-start}
.boi-wrap .boi-detail .detail-tit{color:#222; font-size: 14px; margin-top: 4px; z-index: 1; flex:none; border-radius:30px; border:1px solid #ccc; padding:2px 12px; background:#fff; margin-right: 48px; min-width:80px; text-align:center;}
.boi-wrap .boi-detail .detail-tit:after{content:""; position:absolute; height:82px; width:1px; background:#d7d7d7; top:16px; left:92px}
.boi-wrap .boi-detail:nth-child(1) .detail-tit:before{content:""; position:absolute; height:40px; width:1px; background:#d7d7d7; top:111px; left:92px}
.boi-wrap .boi-detail:nth-child(2) .detail-tit:after{height:55px;}

.boi-wrap .boi-detail > div:nth-child(2){margin-top: 3px;}
.boi-wrap .boi-detail .detail-ico{display:flex; align-items: center; height:27px; position:relative } 
.boi-wrap .boi-detail .detail-ico:before{content:""; position:absolute; height:1px; width:20px; background:#d7d7d7; top:13px; left:-36px}
.boi-wrap .boi-detail .detail-ico:first-child:before{content:""; position:absolute; height:1px; width:30px; background:#d7d7d7; top:13px; left:-48px}
.boi-wrap .boi-detail .detail-ico:nth-child(5):before{content:""; width:23px; top:0px; left:-36px}
.boi-wrap .boi-detail .detail-ico:nth-child(5):after{content:"";  position:absolute; height:16px; width:1px; background:#d7d7d7; top:-6px; left:-14px;}
.boi-wrap .boi-detail:nth-child(3) .detail-ico:before{display:none}

.boi-wrap .boi-detail .detail-ico span:before{content:""; position:absolute; left:-20px; margin-top:3px; flex:none; width:14px; height:14px; border-radius: 50%; display:block; background:#999; z-index:1;}
.boi-wrap .boi-detail .detail-ico.color01 span:before{background:#999}
.boi-wrap .boi-detail .detail-ico.color02 span:before{background:#4265d6}

.boi-wrap .boi-detail .detail-ico .cont-txt{color:#222; font-size: 13px; margin: 4px 0px; z-index: 1; flex:none;}

.boi-wrap .boi-detail .label-group{display:flex; flex-direction:column;}
.boi-wrap .boi-detail .label-group .Label-color{margin:4px 0px}

.boi-wrap .boi-detail .detail-txt{display:flex; align-items: center;}
.boi-wrap .boi-detail .detail-txt .cont-txt{color:#222; font-size: 13px; margin: 4px 0px; z-index: 1; flex:none; height:27px; display:flex; align-items:center}
.boi-wrap .boi-detail:nth-child(2){margin-left:104px;}
.boi-wrap .boi-detail:nth-child(3){margin-left:56px;}
.boi-wrap .boi-detail:nth-child(4){margin-left:56px;}
.boi-wrap .boi-detail:nth-child(5){margin-left:80px;}
.boi-wrap .boi-detail:nth-child(6){margin-left:234px;}
.boi-wrap .boi-detail:nth-child(7){margin-left:52px;}
.boi-wrap .boi-module{display:block; } 
.boi-wrap .boi-module > ul {position:relative; justify-content:flex-start}
.boi-wrap .boi-module > ul > li{border:1px solid #ccc; background:#fff; padding:4px 16px; border-radius: 10px; text-align: center;}
.boi-wrap .boi-module > ul > li:nth-child(1){margin-left:124px; width:152px}
.boi-wrap .boi-module > ul > li:nth-child(2){margin-left:153px;  width:457px}
.boi-wrap .boi-module > ul > li:nth-child(3){width:626px}
.boi-wrap .boi-module > ul > li .module-tit{font-size: 14px; color:#222}



/* **************************************** *
*  PDM
* **************************************** */
.com-table.info-box .Table td .txt-wrap{line-height: 1.5; min-height: 28px; padding:2px 0px; }
.com-table.info-box .Table td .txt-wrap.Table-wrapper{padding:16px; max-height: 300px; overflow:auto;}
.com-table.info-box .Table td .txt{min-height: 28px; display:flex; align-items:center}
.com-table.info-box .Table td .Label-color .cont-txt{font-size: 14px;}
.com-table.info-box .Table td .txt-wrap .Label-color.color19{color:#444}
#divEmptyMessage p.tit{color:#777}



/* **************************************** *
*  PDM - DRAW
* **************************************** */

.FileComp .stitL.flex-col{align-items:flex-start}
.draw-list{border:1px solid #eaeaea; /*padding:8px 0px;*/}
.draw-list ul li{display:flex; align-items:center; justify-content:space-between; padding:6px 12px; border-left:2px solid transparent}
.draw-list ul li:hover{background:#fafafa; border-color: #5629ee}

.draw-list ul li .draw-txt{font-size: 14px; color:#777; letter-spacing: -0.5px; flex:1 0 auto;}
.draw-list ul li .draw-txt.file-size{font-size: 13px; color:#999; margin-left: 8px; text-align:right}
.draw-list ul li .draw-txt.file-rev{text-align: right; padding:0px 24px; min-width: 100px; width:100px}
.draw-list ul li .draw-txt.file-rev .signal-color{text-align: left;}
.draw-list ul li .draw-txt.file-rev .signal-color .cont-txt{min-width: 54px;}
.draw-list ul li .draw-txt.name{overflow:hidden; text-overflow: ellipsis; white-space:nowrap; text-align: center; width:120px; max-width: 120px;}
.draw-list ul li .draw-txt.date{width:160px; max-width: 160px; text-align: right;}

/* .draw-list ul li label{min-width: 60%;}*/
.draw-list.columnBox ul li .ImageCheckbox .Label-color{flex:none}
.draw-list.columnBox ul li .option_btn{font-size:24px; margin-left:24px; width: 72px; flex:none; display:flex; justify-content:flex-end}
.draw-list.columnBox ul li .option_btn .Button{display:inline-flex; align-items:center; border-radius: 4px; vertical-align:middle; height:30px; padding:0px 6px; flex:none; font-size: 13px; border-color: #e5e5e5;}
.draw-list.columnBox ul li .option_btn .Button.only-ico{min-width: 30px; background:#f5f2ff; color:#5629ee; border:none;}
.draw-list.columnBox ul li .option_btn .Button.del-btn{min-width: 30px; background:#ffe9f3; color:#fa167c; border:none}
.draw-list.columnBox ul li .option_btn.Groupbutton .Button:last-child{margin-right: 7px;}
.draw-list.columnBox ul li .ImageCheckbox{display:inline-flex; margin-right: 4px; }
.draw-list.columnBox ul li .ImageCheckbox > .Checkbox{flex:none}
.draw-list.columnBox ul li .ImageCheckbox span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:100%;}



/* fileUpA */
.draw-list .inform-ty1{width:calc(100% - 16px); border:1px dotted #bac8ff; background:#dce3ff0f; height:100%; margin:0 auto; border-radius: 4px; box-sizing: border-box; display:flex; align-items: center; justify-content:center; text-align: center; }
.draw-list .inform-ty1:hover{border-color:#3159ff; background:#a9baff0f}
.draw-list .inform-ty1 p{letter-spacing:-0.5px; font-size:15px; color:#555; position:relative;}
.draw-list .inform-ty1 p:before{content:"\f24d"; font-family:"remixicon"; font-size: 24px; position:absolute; top:-4px; left:-32px; color:#6685e6}
.draw-list.columnBox{padding:0px; border-radius:0px;}
.draw-list .file-list{flex:none; overflow: auto;}
.draw-list .file-preview{border-top: 1px solid #e9e9e9; width: 100%; height:600px; display:flex; flex-direction:column}
.draw-list .file-preview .stitArea{background:#fbfbfb; padding:12px 2px; margin-bottom:0px; border-bottom: 1px solid #eee;}
.draw-list .file-preview .stitArea .stitL span.label{letter-spacing: -0.6px; margin-left: 14px; color:#444}
.draw-list .file-preview .stitArea .stitR Button.Button{border:0; background:#dedede; color:#fff; min-width:22px; height:22px}
.draw-list .file-preview .stitArea .stitR Button.Button i{font-size: 16px; vertical-align:baseline}
.FileComp .file-preview{border: 1px solid #e9e9e9; border-top:0; width: 100%; height:600px; display:flex; flex-direction:column}
.FileComp .file-preview .stitArea{background:#fbfbfb; padding:12px 8px; margin-bottom:0px; border-bottom: 1px solid #eee;}
.FileComp .file-preview .stitArea .stitL span.label{letter-spacing: -0.6px; margin-left: 14px; color:#444}
.FileComp .file-preview .stitArea .stitR Button.Button{border:0; background:#dedede; color:#fff; min-width:22px; height:22px}
.FileComp .file-preview .stitArea .stitR Button.Button i{font-size: 16px; vertical-align:baseline}

/* fileUpB */
.fileUpB .draw-list ul li .draw-txt.file-rev{width:100px; max-width: 100px; min-width: 100px;}
.fileUpB .draw-list ul li .draw-txt.name{width:100px; max-width: 100px;}
.fileUpB .draw-list ul li .draw-txt.date{width:140px; max-width: 140px; text-align:right}
.fileUpB .draw-list.columnBox ul li .option_btn{max-width: 90px; width:80px }


/* fileDnA" */
.draw-list .inform-ty2{width:calc(100% - 16px); height:100%; margin:0 auto; display:flex; align-items: center; justify-content:center; text-align: center; }
.draw-list .inform-ty2 p{letter-spacing:-0.5px; font-size:14px; color:#777; position:relative;}
.draw-list .inform-ty2 p:before{content:"\F0A4B"; font-family:"Material Design Icons"; font-size: 22px; position:absolute; top:-4px; left:-32px; color:#979797}


/* 도면 파일 fileList 라벨 스타일 */
.draw-list > ul > li .ImageCheckbox{min-width:20px}
.draw-list > ul > li > .Label-color{min-width:42px}
.draw-list > ul > li > .Label-color .cont-txt{white-space:nowrap !important}
.draw-list > ul > li > .draw_tit{white-space:nowrap; text-overflow:ellipsis; overflow:hidden; width:100%; line-height: 1.5;}
/*.layerpop-box .draw-list > ul > li .draw_tit{width:100%; min-width:270px}*/


/* 파일업로드 */
.file-loader{position:absolute; left:42vw; top:40vh; z-index: 9999; background:#fff; width: 400px; min-height:94px; height:auto; padding:16px; border-radius: 15px; box-shadow: 0px 0px 10px #00000030;}
.file-loader .stitL{flex-direction:column; align-items:flex-start; width:100%; word-break:break-all;}
.file-loader .stitL span{margin-right: 50px;}
.file-loader .Progressbar_wrap{margin-top:16px}
.file-loader .file-loader-btn{position:absolute; right:16px; top:14px} 
.file-loader .file-loader-btn .Button{border-radius: 50%; min-width: 36px; height:36px;}
.file-loader .file-loader-btn .Button.stop{border-color:#fa167c; color:#fa167c }
.file-loader .file-loader-btn .Button.stop:active,
.file-loader .file-loader-btn .Button.stop:hover,
.file-loader .file-loader-btn .Button.stop:focus,
.file-loader .file-loader-btn .Button.stop.af-hover,
.file-loader .file-loader-btn .Button.stop.Checked{background:#fa167c; border:1px solid #fa167c; color:rgb(255, 255, 255, 1)}

/*추가*/
.all-fileinfo{font-size: 14px; letter-spacing: -0.5px; color:#777}
.draw-list ul li.sort{background:#fff; border-bottom: 1px solid #f0f0f0;}
.draw-list ul li.sort:hover{background:none; border-left-color:transparent; border-bottom: 1px solid #f0f0f0;}
.draw-list ul li.sort .draw_tit,
.draw-list ul li.sort .draw-txt,
.draw-list ul li.sort .draw-txt.date{font-size: 14px; color:#777; letter-spacing: -0.5px; text-align: center;}

/* **************************************** *
*  BOM
* **************************************** */
.bom-process{max-width:968px; width:fit-content; min-width: 375px; position:relative; background:#fbfbfb; border:1px solid #ededed; border-radius: 10px; padding:16px; z-index:1; box-shadow:0px 0px 5px 1px #00000014}
.bom-process .stit04{position:absolute; background:#fff; left:40px; top:-12px; display:block; padding:2px 16px;}
.bom-process ul{position:relative; margin: 0 auto; margin: 0px 24px;}
.bom-process ul li.project-stage .line-solid{border:1px solid #d7d7d7;}
.bom-process .process-stage{position:relative; display:inline-flex;  border:1px solid #e1e1e1;  flex-direction:column; background:#fff; width: 280px; height:210px; border-radius: 4px; justify-content:flex-start; padding:12px; margin:6px; border-radius: 10px;} 
.bom-process .process-stage .stage-cont{font-size: 13px; color:#222; display:flex; min-height:24px; border-bottom: 1px solid #f0f0f0; align-items:center; box-sizing:content-box;}
.bom-process .process-stage .stage-cont .cont-tit{font-weight: 300; flex:none; margin-right: 8px; width:54px; background:#f0f0f0; padding:2px 8px}
.bom-process .process-stage .stage-cont > .cont-txt{overflow:hidden; word-break:break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; padding:0 4px}
.bom-process .process-stage .stage-cont:first-child{align-items:center; }
.bom-process .process-stage .stage-cont:nth-child(2){min-height:auto; align-items:stretch; border-top: 1px solid #f0f0f0; margin-top:8px }
.bom-process .process-stage .stage-cont:nth-child(2) .cont-txt{padding-bottom:2px; line-height: 1.3; padding-top:4px }
.bom-process .process-stage .stage-cont:first-child .Label-color{flex:none}
.bom-process .process-stage .stage-cont:first-child .cont-tit{width:auto; font-size: 14px; background:none}
.bom-process .process-stage .stage-cont:first-child {border-bottom:none;}
.bom-process .process-stage .stage-cont:nth-child(5){border-color: #dbdbdb}
.bom-process .process-stage .stage-cont.split{justify-content:space-evenly;  overflow:hidden; min-height:43px;} 
.bom-process .process-stage .stage-cont.split > div{display:flex; flex-direction:column; flex:1 auto; padding:0; text-align: center;}
.bom-process .process-stage .stage-cont.split .cont-tit{width:100%; text-align: center; background:#f0f0f0;}
.bom-process .process-stage .stage-cont.split .cont-txt{border-bottom: 1px solid #f0f0f0; height:21px}
.bom-process .process-stage.active{background:#0061ff; border:1px solid #0061ff;}
.bom-process .process-stage.active .txt{color:#fff}

.bom-process .process-stage:before{content:"\ea54"; font-family: 'remixicon'; position:absolute; left:-22px; top:45%; background:#5629ee; border-radius: 50%; width:26px; height:26px; z-index: 1; display:flex; justify-content:center; align-items: center; color:#fff; font-size: 24px;}
.bom-process .process-stage:first-child:before{display:none}


/* **************************************** *
*  SAMPLE-WIDGET
* **************************************** */
.sample-widget .grid-stack.left-widget{margin-right: 16px; flex-wrap:wrap; flex-direction:initial}
.sample-widget .grid-stack.left-widget .grid-stack-item{margin-bottom: 16px;}
.sample-widget .grid-stack.left-widget .grid-stack-item.list{margin-right:16px; width:calc(100% - 620px) !important}
.sample-widget .left-widget .grid-stack-item-content:after{display:none}
.sample-widget .bx-viewport{width: 100%; overflow: hidden; position: relative; height:180px; display:flex; align-items:center;}
.sample-widget .bx-viewport .carousel-thum .carousel-box{border:none}
.sample-widget .bx-viewport .carousel-thum .cover-img:before{border:none}
.sample-widget .grid-stack.right-widget .grid-stack-item{margin-bottom: 16px;}




.sample-widget .grid-stack > .grid-stack-item > .grid-stack-item-content{overflow:hidden}
.sample-widget .grid-stack.right-widget .widget_link{display:flex; justify-content:space-evenly; margin-top:-20px}

.sample-widget .grid-stack.right-widget .widget_link .post-item{padding:0; max-width:33.3%; height: 120px; display:flex; flex-direction:column; flex: 1 auto; justify-content:center}
.sample-widget .grid-stack.right-widget .widget_link .post-item:before{content:""; width:42px; height:42px; background:#ccc;}

.sample-widget .grid-stack.right-widget .widget_link .post-item{padding:0; max-width:33.3%; height: 80px; display:flex; flex-direction:column; flex: 1 auto; justify-content:center}
.sample-widget .grid-stack.right-widget .widget_link .post-item:before{content:""; width:42px; height:42px; background:#ccc;}

.sample-widget .grid-stack.right-widget .widget_link .post-item.linkbiz:before{content:""; width:42px; height:42px; background:url(/static/fw/images/symbol_linkbiz.svg) #8131FF no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-item.mylink:before{content:""; width:42px; height:42px; background:url(/static/fw/images/symbol_mylink.svg) #008BD1 no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-item.naver:before{content:""; width:42px; height:42px; background:url(/static/fw/images/symbol_naver.svg) #00BF18 no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-tit{color:#fff}



.sample-widget .grid-stack.right-widget .widget_link .post-item{padding:0; max-width:33.3%; height:100px; display:flex; flex-direction:column; flex: 1 auto; justify-content:center}
.sample-widget .grid-stack.right-widget .widget_link .post-item:before{content:""; width:42px; height:42px; background:#ccc; border-radius:1000px}

.sample-widget .grid-stack.right-widget .widget_link .post-item.linkbiz:before{content:""; width:35px; height:35px; background:url(/static/fw/images/symbol_linkbiz.svg) #8131FF no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-item.mylink:before{content:""; width:35px; height:35px; background:url(/static/fw/images/symbol_mylink.svg) #008BD1 no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-item.naver:before{content:""; width:35px; height:35px; background:url(/static/fw/images/symbol_naver.svg) #00BF18 no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-tit{color:#333; margin-top:3px}
.sample-widget .grid-stack.right-widget .widget_link .post-item.linkbiz:hover .post-tit,
.sample-widget .grid-stack.right-widget .widget_link .post-item.mylink:hover .post-tit,
.sample-widget .grid-stack.right-widget .widget_link .post-item.naver:hover .post-tit{color:#5629ee}

.sample-widget .grid-stack.right-widget .widget_link .post-item.linkbiz:before{content:""; width:42px; height:42px; background:url(/static/fw/images/symbol_linkbiz.svg) no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-item.mylink:before{content:""; width:42px; height:42px; background:url(/static/fw/images/symbol_mylink.svg) no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-item.naver:before{content:""; width:42px; height:42px; background:url(/static/fw/images/symbol_naver.svg) no-repeat;}
.sample-widget .grid-stack.right-widget .widget_link .post-tit{color:#555; margin-top:8px}
.sample-widget .grid-stack.right-widget .widget_link .post-item.linkbiz:hover .post-tit,
.sample-widget .grid-stack.right-widget .widget_link .post-item.mylink:hover .post-tit,
.sample-widget .grid-stack.right-widget .widget_link .post-item.naver:hover .post-tit{color:#5629ee}

.sample-widget .grid-stack.right-widget .cal{height:320px}
.sample-widget .grid-stack.right-widget .cal #calendar-container{margin:20px 0 0 8px}
.sample-widget .grid-stack.right-widget .dx-calendar-cell{width:30px; height:30px}
.sample-widget .grid-stack.right-widget .dx-calendar-cell.dx-calendar-selected-date, .main-dashboard .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today{border-radius:1000px}

.sample-widget .widget_img{display:flex; align-items:center; justify-content:center}
.sample-widget .widget_img.pro{height:325px}
.sample-widget .widget_img.pro img{max-width:100%; margin-bottom:20px}
.sample-widget .widget_img.kanban{height:200px}
.sample-widget .widget_img.kanban img{max-width:100%; margin-bottom:15px}

.sample-widget.main-dashboard .post-table{display: flex; justify-content:center; cursor:pointer;}

.sample-widget.main-dashboard .post-table .table li{display:flex; align-items:center; border-bottom: 1px solid #e7e7e7;}
.sample-widget.main-dashboard .post-table .table li.sort{position:absolute; background:#fff}
.sample-widget.main-dashboard .post-table .table li.sort .tit{font-weight: 300;}
.sample-widget.main-dashboard .post-table .table li > div{text-align: center; padding:8px 0px; color:#555}
.sample-widget.main-dashboard .post-table .table li > .Label-color{padding:4px 8px 3px; color:#fff}
.sample-widget.main-dashboard .post-table .table li:nth-child(2){margin-top: 40px;}
.sample-widget.main-dashboard .post-table .table li:last-child{border:none}

.main-dashboard .messenger_down{background: #fff; box-shadow:1px 2px 8px rgba(86,41,238, 15%); border:1px solid #5629ee0a; border-radius:8px; height:50px; display:flex; align-items:center; justify-content:center; cursor:pointer; margin:10px 0}
.main-dashboard .messenger_down:hover{border:1px solid #5629ee40;}
.main-dashboard .messenger_down i{font-size:18px; color:#5629ee}
.main-dashboard .messenger_down span{color:#333; margin-left:5px}


/* PMS-MAIN-WIDGET */
.sample-widget.pms  .grid-stack.left-widget .grid-stack-item{margin:0px 8px 16px; flex:1 auto}
.sample-widget .grid-stack > .grid-stack-item .project-list{height:500px; overflow:auto;}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li{background:#f5f5f5}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .top{display:flex;align-items: center; justify-content:space-between}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .tit-wrap{display:flex;align-items: center; flex: 1 auto;}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .ico{width:40px; height:40px; border-radius:12px; background:#fff; display:flex; flex:none; align-items: center; justify-content:center; margin-right: 16px;}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .ico i{font-size: 22px;}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .tit{font-size: 17px; font-weight: 300; letter-spacing: -0.6px; width:250px}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .date{flex:none; width:210px}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .date span{font-size:14px; letter-spacing:-0.6px; }
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .Label-color{border-radius: 30px;}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:hover:after{display:none}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .Progressbar{background:#c5c5c56e; border-radius: 50px; height:12px}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li .Progressbar.Progress-text span{padding-top:0px; top:-2px}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(n){background:#eff5fd}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(2n){background:#f3effd}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(3n){background:#e8ebff}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(4n){background:#ecfffc}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(5n){background:#fff9ee}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(6n){background:#eef3ff}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(7n){background:#fff8fe}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(8n){background:#f0faff}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(9n){background:#fffdf0}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(10n){background:#f3f2ff}

.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(n) .ico i{color:#88b1e7}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(2n) .ico i{color:#763eff}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(3n) .ico i{color:#5e73ff}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(4n) .ico i{color:#7ccfc1}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(5n) .ico i{color:#f7c15d}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(6n) .ico i{color:#7393e1}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(7n) .ico i{color:#df8fd4}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(8n) .ico i{color:#83b6cf}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(9n) .ico i{color:#efde6d}
.sample-widget .grid-stack > .grid-stack-item .project-list > ul li:nth-child(10n) .ico i{color:#7c76cb}


.sample-widget .grid-stack > .grid-stack-item .dhx_cal_container .dhx_cal_navline.dhx_cal_navline_flex .dhx_cal_tab{display:none}
.sample-widget .grid-stack > .grid-stack-item .dhx_cal_container .dhx_cal_navline .dhx_cal_today_button{display:none;}
.sample-widget .grid-stack > .grid-stack-item .dhx_cal_navline{height:40px !important;}
.sample-widget .grid-stack > .grid-stack-item .com-grid .dhx_cal_container{height:500px !important;}
.sample-widget .grid-stack > .grid-stack-item .com-grid .dhx_cal_navline .dhx_cal_date{font-size:19px;}
.sample-widget .grid-stack > .grid-stack-item .dhx_cal_navline.dhx_cal_navline_flex .dhx_cal_line_spacer{flex-grow:0}
.sample-widget .grid-stack > .grid-stack-item .dhx_cal_event_line{margin-left:2px; color:transparent; height:8px}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban{margin:0px 16px}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul{display:flex; justify-content:center; flex-wrap:wrap;}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li{background:#ccc; display:inline-flex; align-items: center; padding:24px 16px; border-radius: 12px; justify-content:space-between; width:30%; flex-wrap:wrap; margin:8px 6px; flex:1 auto; cursor:pointer}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li .tit{font-size: 16px; letter-spacing: -0.6px; }
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(1){background:#fff0d9}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(2){background:#dff5ff}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(3){background:#d4dcf4}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(4){background:#ddf5ed}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(5){background:#ffe3f0}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(6){background:linear-gradient(45deg, #6e35ef, #ae4cf2)}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(1) .tit{color:#fea626}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(2) .tit{color:#33beff}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(3) .tit{color:#4265d6}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(4) .tit{color:#3fc495}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(5) .tit{color:#fa167c}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(6) .tit{color:#fff}
.sample-widget .grid-stack > .grid-stack-item .widget_kanban ul li:nth-child(6) i{color:#fff; font-size: 18px;}
.sample-widget .grid-stack > .grid-stack-item .widget_myjob .post-tit{width:50%;}
.sample-widget .grid-stack > .grid-stack-item .widget_myjob .post-progress{font-size: 14px; letter-spacing: -0.6px; color:#333}
.sample-widget .grid-stack > .grid-stack-item .widget_myjob .post-date{min-width: 200px; font-size: 14px; }
.sample-widget .grid-stack > .grid-stack-item .widget_myjob .post-date i{margin-right: 4px;}

/* 가격정책 */
.price-table{width:100%; word-break:keep-all}
.price-table ul li{display:flex; align-items:center; border-bottom:1px solid #ccc;}
.price-table ul li.sort{font-weight:300; color:#333; height:55px; background:#fafafa; border-top:2px solid #5629ee; border-bottom:1px solid #f2edff}
.price-table ul li.sort span{display:block; font-size:15px}

.price-table ul li div{text-align:center; padding:0 5px}
.price-table ul li .tit{color:#333; font-weight:300}
.price-table ul .emport_s{border-top:1px solid #008cd3}
.price-table ul .emport_e{border-bottom:2px solid #008cd3}
.price-table ul li>ul>li{justify-content:space-around; border-bottom:1px solid #eaeaea; padding:15px 0px}
.price-table ul li>ul{border-left:1px solid #eaeaea}
.price-table ul li>ul>li:last-child{border-bottom:0}
.price-table ul li>ul>li .txt{text-align:left}

/* **************************************** *
*  BOARD
* **************************************** */
.board .board-list{margin-right: 40px;}
.board .board-list .post{border-bottom: 1px solid #eee; padding:22px 8px 18px;}
.board .post .board-name{color:#999; font-size: 13px;}
.board .post .tit-wrap{display:flex; align-items: center; margin-top:8px}
.board .post .post-tit{font-size: 18px; font-weight: 300; color:#202020; letter-spacing: -0.6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.board .post .post-txt{font-size: 14px; color:#333; margin-top:8px; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;}
.board .post .post-info{display:flex; align-items:center;}
.board .post .post-info .account-img{position:relative; min-width:32px; max-width:32px; min-height:32px; max-height:32px; border-radius:50%; background-size:cover; background-repeat:no-repeat; overflow:hidden}
.board .post .post-info .account-img.default{background:#fafafa url("/static/fw/images/common/lnb_account_default.png") 50% 50% no-repeat; border:1px solid #ddd; background-size:65%;}
.board .post .post-info {font-size: 13px; color:#999}
.board .post .post-info .name{margin:0px 8px; color:#333}
.board .post .post-info .data{margin-right: 16px;}
.board .post .post-info .data:before{content: ''; display: inline-block; width: 2px; height: 2px; margin: 0 5px 4px 7px; border-radius: 2px; background-color: #999;}
.board .post .post-info .view{margin-right: 11px;}
.board .post .post-info .view .num{margin-left: 4px;}
.board .post .post-info .comment{margin:0px 4px;}
.board .post .post-info .comment i{font-size: 16px;}
.board .post .post-info .comment .num{margin-left: 4px;}
.board .board-box{border:1px solid #f0f0f0; box-shadow: 4px 4px 10px 0 rgb(0 0 0 / 6%); border-radius: 15px; overflow:hidden; max-height: 240px; margin-bottom: 22px;}
.board .board-box .board-tit{font-size: 16px; font-weight: 300; color:#333; padding: 0 20px 0 22px; background:#fafafa; letter-spacing: -0.6px; height: 55px; display: flex; align-items: center; margin: 0; text-overflow:ellipsis; white-space:nowrap; background-color: #fafafa}
.board .board-box .board-tit .Button{margin-left: 25px;}
.board .board-box .board-tit .Button i{font-size: 20px; color:#999;  transition: all 0.3s}
.board .board-box .post-list{overflow:auto; max-height: 160px; height: 160px; padding-top: 8px;}
.board .board-box .post-list ul li{display:inline-flex; width:100%; padding:8px 24px 8px 24px}
.board .board-box .post-list ul li:hover{background:#f8f8f8}
.board .board-box .post-list ul li .post-tit{font-size: 15px; letter-spacing: -0.6px; color:#555; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:75%; }
.board .board-box .post-list ul li .post-data{font-size: 15px; letter-spacing: -0.6px; color:#aaa; width:25%; text-align:right;}
.blog-board{display:flex; flex-wrap:wrap}
.blog-board .board-box{border:1px solid #f0f0f0; box-shadow:1px 2px 5px rgb(0 0 0 / 5%); border-radius: 8px; overflow:hidden; width:286px; height: 390px; margin:8px; flex:none}
.blog-board .board-box .img-thumb{display:block; overflow:hidden}
.blog-board .board-box .img-thumb.default{display:flex; align-items:center; justify-content:center; height:200px; background:linear-gradient(353deg, #403c85, #746ddd)}
.blog-board .board-box:nth-child(1n) .img-thumb.default{background:linear-gradient(353deg, #403c85, #746ddd)}
.blog-board .board-box:nth-child(2n) .img-thumb.default{background:linear-gradient(150deg, #5593d8, #295280)}
.blog-board .board-box:nth-child(3n) .img-thumb.default{background:linear-gradient(150deg, #d8747b, #8d3238)}
.blog-board .board-box:nth-child(4n) .img-thumb.default{background:linear-gradient(150deg, #74afc3, #376d80)}
.blog-board .board-box .img-thumb.default:before{content:""; display:block; width: 52px; height:52px; background:url("/static/fw/images/symbol_linkbiz_b.svg") no-repeat; margin-left:6px; opacity:0.2}
.blog-board .board-box .img-thumb img{width:286px; height:200px; object-fit: cover; }
.blog-board .board-box .tit-wrap{padding: 16px 16px 8px; min-height: 120px;}
.blog-board .board-box .tit-wrap .post-tit{font-size: 20px; letter-spacing: -0.6px; color:#222; font-weight: 300;  display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;}
.blog-board .board-box .name{color:#333; padding:0px 16px; font-size:15px;  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.blog-board .board-box .post-info {padding:8px 16px; display:flex; font-size: 13px; color:#999}
.blog-board .board-box .post-info .data{margin-right: 16px;}
.blog-board .board-box .post-info .view{margin-right: 11px;}
.blog-board .board-box .post-info .view .num{margin-left: 4px;}
.blog-board .board-box .post-info .comment{margin:0px 4px;}
.blog-board .board-box .post-info .comment i{font-size: 16px;}
.blog-board .board-box .post-info .comment .num{margin-left: 4px;}

/* **************************************** *
*  근태 현황
* **************************************** */
.Button.cal-tool-btn{border:0; font-size: 20px; color: #555}
.Button.cal-tool-btn:active,
.Button.cal-tool-btn:hover,
.Button.cal-tool-btn:focus,
.Button.cal-tool-btn.af-hover,
.Button.cal-tool-btn.Checked{background:#fff; border:0; color:#333}

.fixConWrap.my-status {position:relative}
.fixConWrap.my-status .toolbar.cal-toolbar{margin:12px auto;}
.fixConWrap.my-status .toolbar.cal-toolbar .trans-ico{padding:8px; border-radius: 50%; color:#bbb;}
.fixConWrap.my-status .toolbar.cal-toolbar .trans-ico i{font-size: 24px;}
.fixConWrap.my-status .toolbar.cal-toolbar .trans-ico:active,
.fixConWrap.my-status .toolbar.cal-toolbar .trans-ico:hover,
.fixConWrap.my-status .toolbar.cal-toolbar .trans-ico:focus,
.fixConWrap.my-status .toolbar.cal-toolbar .trans-ico.af-hover{background:#faf9ff; color:#5629ee}

.fixConWrap.my-status .account-info{position:relative; top:2px; width:fit-content;  background:#5b5866; color:#fff; padding: 2px 12px; border-radius: 50px; letter-spacing: -0.5px; line-height:1.6; font-size: 14px; }

.fixConWrap.my-status .infoTxt01{position:absolute; right:32px; top:18px; font-size: 14px;}
.fixConWrap.my-status .infoTxt01 i{font-size: 15px; margin-right: 6px; color:#fff; background:#fa167c; border-radius: 50%; padding:3px 5px 4px 4px;}
.fixConWrap.my-status .writing-ty1 .writing-list{border-top:none; border-bottom:none;}
.fixConWrap.my-status .work-plan .tit{font-size: 20px; margin:12px 0px; color:#333 }
.fixConWrap.my-status .work-plan .tit strong{margin-right: 8px; color:#7052d8; font-size:15px; font-weight: 300;}
.fixConWrap.my-status .attend-list{width:100%; margin:4px 0px;}
.fixConWrap.my-status .attend-list li{display:inline-block}

.attend-table .writing-ty1 .writing-list{border-top:none; border-bottom:none;}
.stats-wrap ul{display:flex; gap:6px}
.stats-wrap ul li{position:relative; display:inline-flex; flex-direction:column; border-radius: 8px; padding:10px 14px;} 
.stats-wrap ul li.stats-ty1{background:#f9f9f9; color:#555; letter-spacing: -0.5px; flex:1 auto; }
.stats-wrap ul li.stats-ty2{margin-left: 24px; border:1px solid #bda9ff; flex:1 auto; box-sizing:border-box; background:#fff}
.stats-wrap ul li.stats-ty2:before{content:""; display:block; width:1px; height:80px; background:#ebebeb; flex:none; position:absolute; left: -14px; top:0px}
.stats-wrap ul li.stats-btn{padding:0px 12px; width:120px}
.stats-wrap ul li.stats-btn .Button.info{justify-content:center}
.stats-wrap ul li.extra{background:#fff4f7;}
.stats-wrap ul li.extra:after{content:"\f336"; display:block; position:absolute; top:10px; right:12px; font-family:'remixicon'; font-size: 23px; color:#fa167c80}
.stats-wrap ul li.extra .time{color:#fa167c}
.stats-wrap ul li.remain{background:#f5f2ff;}
.stats-wrap ul li.remain.off{background:#ededed;}
.stats-wrap ul li.remain.off .time{color:#bbbbbb;}
.stats-wrap ul li.remain.off :after{content:"\f337"; display:block; position:absolute; top:10px; right:12px; font-family:'remixicon'; font-size: 22px; color:#ccc}

.stats-wrap ul li .tit{font-size: 15px;}
.stats-wrap ul li .time{font-size: 22px; font-weight: 300; color:#5629ee}
.stats-wrap ul li .count .badge-color{height:auto; padding:4px 12px; line-height:1}
.stats-wrap ul li .count .cont-txt{font-size: 18px !important; }

.stats-wrap.vacation ul li.stats-ty1{flex-direction:initial; align-items:center; justify-content:space-between}
.stats-wrap.vacation ul li.stats-ty1 .tit{font-size: 16px; font-weight: 300; }


/*type2*/
.columnBox.my-status {border:0; padding: 8px}
.columnBox.my-status .toolbar.cal-toolbar{margin:0 auto;}
.columnBox.my-status .toolbar.cal-toolbar .trans-ico{padding:4px; border-radius: 50%; color:#bbb;}
.columnBox.my-status .toolbar.cal-toolbar .trans-ico i{font-size: 24px;}
.columnBox.my-status .toolbar.cal-toolbar .trans-ico:active,
.columnBox.my-status .toolbar.cal-toolbar .trans-ico:hover,
.columnBox.my-status .toolbar.cal-toolbar .trans-ico:focus,
.columnBox.my-status .toolbar.cal-toolbar .trans-ico.af-hover{background:#faf9ff; color:#5629ee}

.columnBox.my-status .account-info{position:relative; width:fit-content;  background:#5b5866; color:#fff; padding: 2px 12px; border-radius: 50px; letter-spacing: -0.5px; line-height:1.6; font-size: 14px; }
.columnBox.my-status .infoTxt01{position:absolute; right:32px; top:18px; font-size: 14px;}
.columnBox.my-status .infoTxt01 i{font-size: 15px; margin-right: 6px; color:#fff; background:#fa167c; border-radius: 50%; padding:3px 5px 4px 4px;}

.columnBox.my-status .writing-ty1 .writing-list{border-top:none; border-bottom:none;}
.columnBox.my-status .attend-list{margin:4px 0px;}
.columnBox.my-status .attend-list li{display:inline-block}
.columnBox.my-status .work-plan{display:flex; flex-direction:column; align-items:center}
.columnBox.my-status .work-plan .tit{font-size: 24px; margin:22px 0px; color:#333; font-weight: 300; }
.columnBox.my-status .work-plan .tit strong{margin-right: 8px; color:#7052d8; font-size:15px;  font-weight: 300;}

.columnBox.my-status .fixConWrap{gap:12px}
.columnBox.my-status .fixConWrap .stitArea{margin-bottom: 0px;}
.columnBox.my-status .fixCont1 .columnBox{border:1px solid #0000000d; box-shadow: 0px 2px 8px #00000012;}
.columnBox.my-status .fixCont2 .columnBox{border:1px solid transparent;}
.columnBox.my-status .stats-wrap ul{flex-direction:column}

.columnBox.my-status .Button.cal-tool-btn{border:0; font-size: 16px; color: #999; height:min-content}
.columnBox.my-status .Button.cal-tool-btn:active,
.columnBox.my-status .Button.cal-tool-btn:hover,
.columnBox.my-status .Button.cal-tool-btn:focus,
.columnBox.my-status .Button.cal-tool-btn.af-hover,
.columnBox.my-status .Button.cal-tool-btn.Checked{background:#fff; border:0; color:#333}


.ml-calendar .bottomOrTop{position:absolute; top:6px; left:8px; color:#aaa; font-size: 12px;}
.ml-calendar .event-tit i{color:#999; background: #eee; border-radius: 50%; z-index: 99; position: absolute; width: 22px;height: 22px; display: flex; justify-content: center; align-items: center;}
.ml-calendar .event-tit span{margin-left: 24px; letter-spacing: -0.5px; padding-top:1px;}

.ml-calendar .event-tit i.commute{color:#f6ebff; background: #d29eff;}
.ml-calendar .event-tit i.vacation{color:#f4fff8; background: #80cb9c;}
.ml-calendar .event-tit i.event{color:#fffafa; background: #ff9b9b;}



/* **************************************** *
*  근태관리
* **************************************** */
.manager_attendance .tit_btn{line-height:18px !important}
.manager_attendance .tit_btn .Button.small.only-ico{min-width:18px}
.manager_attendance .tit_btn .Button.small{height:18px; background:#5c6072; color:#fff; border:0; border-radius:3px}
.manager_attendance .tit_btn .Button.small i{font-size:15px; display:inline-block}
.manager_attendance .off_duty_hours_list{display:flex}
.manager_attendance .Button.delete{border:1px solid #f1b4b4}
.manager_attendance .Button.delete i{color:#db4242}
.manager_attendance Button.delete:active, 
.manager_attendance .Button.delete:hover,
.manager_attendance .Button.delete:focus,
.manager_attendance .Button.delete.af-hover,
.manager_attendance .Button.delete.Checked{background:#fceeee}
.option_list li{margin-top:15px}
.option_list li .conYnDiv{cursor:pointer}

.work_hour_area{display:flex; align-items:center}
.work_hour_area .work_hour_cont{position:relative; background:#fefefe; border:1px solid #eaeaea; border-radius:10px; box-sizing:border-box; display:flex; width:165px}
.work_hour_area .work_hour_cont .work_hour_form{position:relative}
.work_hour_area .work_hour_input::-webkit-input-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:14px; color:#999; letter-spacing:-0.8px; font-weight:normal}
.work_hour_area .work_hour_input::-moz-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:14px; color:#999; letter-spacing:-0.8px; font-weight:normal}
.work_hour_area .work_hour_input:-ms-input-placeholder{font-family:'pps', 'ptd', 'sans-serif' !important; font-size:14px; color:#999; letter-spacing:-0.8px; font-weight:normal}
.work_hour_area .work_hour_input{
 display:block; width:100%; height:38px; line-height:38px; margin:0; padding:0 45px 0 15px; border:0; background:none; text-align:left; font-size:14px; font-weight:normal; letter-spacing:-0.5px; color:#555;
 border-radius:0; box-sizing:border-box; outline:none; cursor:pointer; font-family:'pps', 'ptd', 'sans-serif' !important;}
.work_hour_area .time_dash{margin:0 8px}
.work_hour_area .work_hour_cont .work_hour_form .work_hour_btn.time{position:absolute; bottom:0; right:14px}
.work_hour_area .work_hour_cont .work_hour_form .work_hour_btn button{position:relative; display:block; width:auto; height:38px; line-height:38px; margin:0; padding:0; color:#aaa; border:0; cursor:pointer; text-align:center; background:none; border-radius:0; outline:none}
.work_hour_area .work_hour_cont .work_hour_form .work_hour_btn button i{width:auto; height:auto; font-size:18px; vertical-align:middle}

.work_hour_slider{display:none; position:absolute; top:40px; width:100%; height:170px; background:#fff; z-index:1; box-shadow: 2px 2px 6px 1px rgba(0,0,0,0.1); border-radius:5px; padding:15px 20px}
.work_hour_slider.active{display:block}
.time_set{display:flex; justify-content:center; align-items:center}
.time_set .time_set_cont .time_set_input{border:0; border-bottom:1px solid #ddd; width:45px; padding:0 5px; font-size:15px; color:#333; text-align:center}
.time_set .time_set_cont .time_set_input:hover{border-bottom:1px solid #b7afd4}
.time_set .separator{margin:0 5px}
.time_slider_cont{position:relative}
.time_slider_cont span{font-size:14px; margin-bottom:15px; display:block; letter-spacing:-0.5px; color:#333}
.time_slider_cont .time_slider{border:0; background:#f4f4f4; border:1px solid #e8e8e8; width:100%; height:8px; border-radius:1000px}
.time_slider_cont .time_slider > div{background:#5629ee; height:inherit; border-radius: 50px; margin-top:-1px} 


.time_slider_cont .Button.toggle{position:absolute; top:26px; left:5px; height:14px; width:14px; padding:0; border:1px solid #bababa}
.time_slider_cont .Button.toggle:active, .time_slider_cont .Button.toggle:hover, .time_slider_cont .Button.toggle:focus, .time_slider_cont .Button.toggle.af-hover, .time_slider_cont .Button.toggle.Checked{background:#ece9f8; border:1px solid #b7afd4}

.manager_attendance .docform-ty2 .Label-color.time,
.manager_attendance .Label-color.days{font-size:14px; line-height:18px;}

.manager_attendance .docform-ty2 .writing-list:hover{border:1px solid #b7afd4; border-radius:8px}
.manager_attendance .docform-ty2 .writing-list .writing-tit{flex-direction:column; justify-content:center; background:#f6f5fa}
.week_list .week_list_cont,
.hours_list .hours_list_cont{display:flex}
.week_list .week_list_cont li,
.hours_list .hours_list_cont li{display:flex; align-items:center; /*margin-right:8px*/}
.week_list .week_list_cont li{min-width:70px}
.week_list .week_list_cont li .Button{height:35px; border:1px solid #b7afd4; border-radius:10000px; background:none; color:#998ec2}
.week_list .week_list_cont li .Button.active,
.week_list .week_list_cont li .Button.af-hover.active{background:#8364e8; color:#fff; border:0}
.week_list .week_list_cont li .Button.af-hover{border:1px solid #8364e8; color:#8364e8; background:none}
.week_list .week_list_cont li .Button span{min-width:40px; display:inline-block}

.manager_attendance .docform-controll{right:0; border-radius:0 8px 0 0}
.manager_attendance .docform-controll .Button.only-ico{min-width:30px; width:30px; height:30px}

.manager_attendance .writing-ty1.form-box{border-radius:10px}
.manager_attendance .writing-ty1.form-box .writing-list{display:flex; border:0; padding:0}
.manager_attendance .writing-ty1.form-box .writing-list > li{width:33.333%; padding:0 20px}
.manager_attendance .writing-ty1.form-box .writing-list > li .writing-tit{width:40%}

.manager_attendance .sample-grid table,
.manager_attendance .sample-grid table tbody tr td{font-size:15px}
i.hours_checked{color:#5629ee; font-size:20px !important}
i.hours_checked_none{color:#ddd; font-size:20px !important}
.manager_attendance .Dateinput > .Calendar, .manager_attendance .Daterange .Calendar,
.work_hour_set_pop .Dateinput > .Calendar, .work_hour_set_pop .Daterange .Calendar{top:8px}

.work_hour_set_pop .writing-ty1 .writing-list{display:flex; border:0}
.work_hour_set_pop textarea,
.writing-ty1.pop textarea{border:1px solid #ddd; padding:10px}
.work_hour_set_pop textarea:focus,
.work_hour_set_pop textarea:active,
.writing-ty1.pop textarea:focus,
.work_hour_set_pop textarea:active{border:1px solid #b7afd4}

.work_hour_set_pop .writing-ty1.txt_list .writing-list{padding:5px 0}
.layerpop-box .writing-ty1 .writing-tit .tit{font-weight:300}
.layerpop-box .week_list .week_list_cont li,
.layerpop-box .hours_list .hours_list_cont li{margin-right:8px}
.layerpop-box .vacation_add .writing-ty1 .writing-list > li{margin-top:15px}
.layerpop-box .vacation_add .writing-ty1 .writing-list > li:first-child{margin-top:0}
.writing-ty1 .stitArea.tit{border-bottom:1px solid #ddd; padding-bottom:10px}

.writing-ty1.form-box.holiday{margin-top:30px; box-shadow: 2px 2px 8px 0 rgba(86,41,238,0.1); border:1px solid #f6f5fa}

/* type 2 */
.work_set_form .writing-ty1 .writing-list{border-bottom:none; padding:15px 0}
.work_set_form .writing-ty1 .writing-cont{align-items:normal}
.work_set_form .off_duty_hours_list{margin-top:15px; width:595px}
.work_set_form .off_duty_hours_list:first-child{margin-top:0}
.work_set_form .add_box{background:#fff; box-shadow:1px 2px 8px rgba(0,0,0, 12%); border-radius:8px; height:40px; width:100%; border:0; font-size:15px; color:#999; display:inline-flex; justify-content:center; align-items:center; border:1px solid #eaeaea; cursor:pointer}
.work_set_form .add_box i{margin-right:5px; font-size:18px; color:#555}
.work_set_form .add_box:hover{color:#333; box-shadow:1px 2px 8px rgba(86,41,238, 12%); border:1px solid #5629ee40}
.work_set_form .add_box:hover i{color:#5629ee}
.writing-ty1 .writing-list.flex_row .writing-cont{align-items:center}
.writing-ty1 .writing-list.flex_row li{width:39%}
.writing-list.flex_row{display:flex}
.work_set_form .writing-ty1 .writing-tit{min-width:150px; align-items:normal}
.writing-list .writing-tit .tit.flex_row{display:inline-flex; align-items:center}
.work_set_form .option_list{width:65%; display:flex; flex-wrap:wrap}
.work_set_form .option_list > li{width:50%; margin-top:23px}
.work_set_form .option_list > li:nth-child(1), 
.work_set_form .option_list > li:nth-child(2){margin-top:0}
.work_set_form .option_list li .switch.slide{align-items:center}
.save_time_form{color:#888; margin-right:10px}
.save_time_form i{font-size:18px; color:#5629ee; margin-right:5px}
.save_time_form span{min-width:80px}
.work_set_form .work_hour_slider{height:190px}
.work_set_form .time_slider_cont .Button.toggle{top:32px}

.work_set_form .years_service_list{width:100%; gap:15px}
.work_set_form .years_service_list .years_service_form{width:20%; margin:0}
.work_set_form .years_service_list .years_service_form .years_service_cont{padding:20px}
.work_set_form .years_service_list .years_service_form .years_service_cont .years{font-size:18px}
.work_set_form .years_service_list .years_service_form .years_service_cont span{color:#888}
.work_set_form .years_service_form.add_btn{border:0; height:66px}
.work_set_form .years_service_form.add_btn .add_box{height:100%}
.work_set_form .years_service_list .years_service_form.add_btn:hover{border:0}
.work_set_form .month_service_list .month_service_form{display:flex; align-items:center; margin-top:15px}
.month_service_list .month_service_form .month_service_box{display:flex; align-items:center; border:1px solid #d9d3ee; border-radius:8px; height:40px; align-items:center; margin-left:10px}
.month_service_list .month_service_form .month_service_box:first-child{margin-left:0}
.month_service_list .month_service_form .month_service_box:hover{border:1px solid #b7afd4}
.month_service_list .month_service_form .month_service_box .tit{padding:0 15px; background: #f6f5fa; height:100%; border-radius:8px 0px 0px 8px; display:flex; align-items:center; justify-content:center; min-width:120px; color:#555}
.month_service_list .month_service_form .month_service_box .tit i{font-size:17px; color:#9c8ecb; margin-right:5px}
.month_service_list .month_service_form .month_service_box .day_count_form{padding:0 15px}
.month_service_box .day_count_input{margin:0}
.add_box_form{margin-top:15px; width:655px}

.work_check{display:flex; flex-wrap:wrap}
.work_check .work_hour_area{width:100%; margin-top:15px}
.work_check .work_hour_area span.label{color:#999}
.add_flex_row .off_duty_hours_list{margin-top:0px; width:300px}
.work_set_form .writing-ty1.flex_row .writing-cont{width:50%; flex:0 1 auto; flex-wrap:wrap; gap:15px}


/* **************************************** *
*  구매발주 - 구매발주마감등록 캘린더
* **************************************** */
.fixConWrap.cal_flex_row .columnBox{border:0; padding:0; flex-direction:row; align-items:center; overflow:unset}
.fixConWrap.cal_flex_row .columnBox.between{justify-content:space-between}
.fixConWrap.cal_flex_row .columnBox button.prev{border:1px solid #5629ee40; padding:6px 5px; border-radius:8px 0px 0px 8px; margin-right:-5px}
.fixConWrap.cal_flex_row .columnBox button.next{border:1px solid #5629ee40; padding:6px 5px; border-radius:0px 8px 8px 0px}
.fixConWrap.cal_flex_row .columnBox button.prev i,
.fixConWrap.cal_flex_row .columnBox button.next i{color:#5629ee}
.fixConWrap.cal_flex_row .columnBox button.prev:hover,
.fixConWrap.cal_flex_row .columnBox button.next:hover{background:#5629ee}
.fixConWrap.cal_flex_row .columnBox button.prev:hover i,
.fixConWrap.cal_flex_row .columnBox button.next:hover i{color:#fff}
.fixConWrap.cal_flex_row .dash-tit.line{position:relative}
.fixConWrap.cal_flex_row .dash-tit.line:after{content:''; position:absolute; top:0; right:-15px; width:2px; height:100%; background-color:#ddd}


/* **************************************** *
*  근태설정
* **************************************** */
.years_service_list{display:flex; flex-wrap:wrap; width:1200px}
.years_service_list .years_service_form{border:1px solid #d9d3ee; border-radius:10px; margin:5px; position:relative}
.years_service_list .years_service_form:hover{border:1px solid #b7afd4}
.years_service_list .years_service_form .years_service_cont{display:flex; justify-content:center; align-items:center; padding:15px 20px; min-width:175px}
.day_count_input{border:0; border-bottom:1px solid #d9d3ee; width:42px; padding:0 5px; margin:0 5px 0 15px; font-size:15px; color:#333; text-align:center}
.day_count_input:hover{border-bottom:1px solid #b7afd4}

.month_service_list .month_service_form{margin-top:10px}
.month_service_list .month_service_form:first-child{margin-top:0}

.vacation_details .fixConWrap.my-status .vacation_info{display:flex; align-items:center}
.vacation_details .fixConWrap.my-status .vacation_info .account-info{position:inherit}
.vacation_details .stats-wrap ul li{padding:25px 18px}

.years_service_del .Button.only-ico{position:absolute; top:0; right:0; min-width:30px !important; height:30px; border-radius:0px 8px 0px 8px; background: #5c6072; border:0}
.years_service_del .Button.only-ico.af-hover{background: #5c6072ad; border:0}
.years_service_del button i{color:#fff}


/* **************************************** *
*  결재라인 테스트 
* **************************************** */
.fixConWrap.approval.test .fixCont1{width:280px; min-width:280px; max-width: 20%;}
.fixConWrap.approval.test .fixCont2{margin-left: 0px;}
.fixConWrap.approval.test .fixCont3{margin-left: 0px; max-width:40%; min-width:550px}
.fixConWrap.approval.test .fixCont1 .columnBox{border-radius:8px 0px 0px 8px;}
.fixConWrap.approval.test .fixCont2 .columnBox{border-radius: 0px; border-left:none; border-right:none;}
.fixConWrap.approval.test .fixCont3 .columnBox{border-radius:0px 8px 8px 0px;}
.fixConWrap.approval.test .fixCont3 .columnBox .Groupbutton{z-index: 1;}
.fixConWrap.approval.test .fixCont3 .infoTxt01 i{font-size: 21px;}
.com-grid.test01 .jqx-grid{border:none !important}
.com-grid.test01 .jqx-widget-content{border:none}
.com-grid.test01 .jqx-grid .jqx-grid-cell, 
.com-grid.test01 .jqx-grid .jqx-grid-column-header,
.com-grid.test01 .jqx-grid .jqx-grid-group-cell{border:none}
.com-grid.test01 .jqx-grid .Button.small.only-ico{width:20px; min-width:20px; height:22px; border-radius: 0px; }
.com-grid.test01 .jqx-grid .Button.small.only-ico:last-child{border-left:0px}
.com-grid.test01 .jqx-grid .jqx-grid-cell.jqx-grid-cell-selected:nth-child(1):before{display:none}
.fixConWrap.approval.test .paging-jqx .paging-total{left:14px}
.fixConWrap.approval.test .paging-jqx .paging-perpage{right:14px}
/*.com-grid.test01 .jqx-scrollbar-state-normal{
 background-color:#f2f2f2; background-image:-moz-linear-gradient(left, #f2f2f2 0%, #fff 100%);
  background-image: linear-gradient(to left, #f2f2f2 0%, #fff 100%);
 background-image: -webkit-linear-gradient(left, #f2f2f2 0%, #fff 100%);
 background-image: -o-linear-gradient(left, #f2f2f2 0%, #fff 100%);
 background-image: -ms-linear-gradient(left, #f2f2f2 0%, #fff 100%);
 border: 1px solid #e6e6e6;
 width:8px!important;
}

.com-grid.test01 .jqx-fill-state-normal{width:8px!important; background:#c8c8c8; border:0; border-radius: 0; }
.com-grid.test01 .jqx-scrollbar-button-state-normal{position:relative!important; width:0px!important; height:0px!important; display:none; border:0}
.com-grid.test01 .jqx-grid .jqx-icon-arrow-up, 
.com-grid.test01 .jqx-grid .jqx-icon-arrow-up-hover, 
.com-grid.test01 .jqx-grid .jqx-icon-arrow-up-selected{display:none}
.com-grid.test01 .jqx-grid .jqx-icon-arrow-down:before,
.com-grid.test01 .jqx-grid .jqx-icon-arrow-down-hover:before,
.com-grid.test01 .jqx-grid .jqx-icon-arrow-down-selected:before{content:none;}
.com-grid.test01 .jqx-grid .jqx-icon-arrow-up:before, 
.com-grid.test01 .jqx-grid .jqx-icon-arrow-up-hover:before,
.com-grid.test01 .jqx-grid .jqx-icon-arrow-up-selected:before{content:none;}

*/

.aprvline-group{position:relative; border:1px solid #e9e9e9;}
.aprvline-group.selected{border:1px solid #5629ee}
.aprvline-group .stitArea{margin:12px;}
.trans-btn{background:transparent; position:absolute; width:100%; top:-1px; left:-1px; right:-1px; bottom:-1px; cursor:pointer; z-index: 1; border:1px solid transparent}
.trans-btn:focus{border:1px solid transparent; outline:none}
.aprvline-group .com-grid.test01{position:relative; background:#fff; z-index: 1;}

.recipient-header{height:40px; display:flex; padding:8px 12px; align-items: center;}
.recipient-header .tit{font-size: 15px; font-weight:600; color:#333; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.recipient-header .count{color:#5629ee; margin-left:8px; font-size:13px}
.recipient-list .recipient-item{width:100%; overflow:hidden; display:flex; padding:4px 0px; justify-content:space-between}
.recipient-list .recipient-item .mail-info{display:block; font-size: 14px; color:#333;  text-overflow: ellipsis; overflow: hidden; white-space: nowrap; letter-spacing: -0.5px;}
.recipient-list .recipient-item .gruop{display:flex; align-items:center}
.recipient-list .recipient-item .Button{margin-left: 4px; color:#999;}
.recipient-list .recipient-item .Button i{font-size: 16px;}

/* **************************************** *
*  SYSTEM - ADMIN
* **************************************** */
.fixConWrap.menu .fixCont2 .writing-ty1{border-top:1px solid #dcdfe2; border-bottom:1px solid #dcdfe2;}
.fixConWrap.menu .fixCont2 .writing-ty1 .writing-list{border-bottom: none;}


/* 견적 작성 폼 */ 
.estm_reg_form .Textinput.plant_add{width:74.6%}
.estm_reg_form .add_search_form{position:relative}
.estm_reg_form .add_search_form .delivery_name_form{position:absolute; right:0}
.estm_reg_form .add_search_form_dtl .Textinput.locaddr{width:38%}
.estm_reg_form .add_search_form_dtl .Textinput.locaddr_dtl{width:61.7%}
.estm_reg_form .cusmanager_form{display:flex; justify-content:space-between}
.estm_reg_form .cusmanager_form li{width:33.33%}
.estm_reg_form .Textinput.pay_method{width:63.1% !important}
.estm_reg_form .Tooltip.arrow_top{left:-18px !important}
.estm_reg_form .view_list .tit{color:#888; position:relative}
.estm_reg_form .view_list .tit:after{content:''; position:absolute; top:5px; right:-7px; background:#ccc; width:1px; height:13px}
.estm_reg_form .view_list .cont{margin-left:10px; color:#222}
.estm_reg_form .writing-ty1 .writing-list li.col2 .col-box{min-height:40px}
.estm_reg_form .writing-ty1 .writing-list li.col2 .col-box > li{min-height:40px}
.writing-ty1 .writing-list .box_line.total .writing-tit{height:40px; background:lightgoldenrodyellow}
/* 그리드 합계 셀 */
.jqx-grid .jqx-grid-cell.estm_total{background:lightgoldenrodyellow; font-weight:600}


/* **************************************** *
*  PMS - 프로젝트 등록 팝업 
* **************************************** */
.pro_opt{display:flex; width:100%}
.pro_opt li{width:33.33%; display:flex; align-items:center}
.pro_opt li._display_kanban{display:flex; align-items:center}
.prev_pro_list{width:100%}
.prev_pro_list li{margin-top:10px; display:flex}
.prev_pro_list li:first-child{margin-top:0}
.prev_pro_list li .Groupbutton{min-width:130px}
.pro_cont{width:100%; border:1px solid #ddd; border-radius:8px}


/* **************************************** *
*  SCHEDULE MANAGEMENT 
* **************************************** */
/*
.schedule-list{max-height:470px; overflow:hidden; overflow-y:scroll; border-top:1px solid #ddd; border-bottom:1px solid #f0f0f0 }
.schedule-list .plan-list{position:relative; border-top:1px solid #ddd; } 
.schedule-list .plan-list:first-child{border-top:0}
.schedule-list .plan-list .schedule-info{position:relative; width:100%; background:#f6f4ff; border-bottom: 1px solid #e9e5ff; padding:8px 12px; letter-spacing: -0.6px; color:#333; font-weight: normal; z-index:1}
.schedule-list .plan-list .schedule-info .signal-color{display:inline}
.schedule-list .plan-list .schedule-info .tit{margin-right: 8px; font-weight: 300;}
.schedule-list .plan-list .schedule-info .Button{position:absolute; right:12px; color:#00000030; border-radius:4px;}
.schedule-list .plan-list .schedule-info .Button:hover{color:#5629eecc}
.schedule-list .plan-list .schedule-info .Button.active{color:#5629ee}
.schedule-list .plan-list .schedule-info .info-detail{position:absolute; z-index: 1; margin-top:8px; left:8px;}
.schedule-list .plan-list .schedule-info .info-detail:before{content:"\ef78"; font-family:'remixicon';  width:32px; height:12px; display:flex; align-items: center; justify-content:center; background:#fdfdfd; border:1px solid #e9e5ff;  color:#5629ee; border-radius: 0px 0px 4px 4px;}
.schedule-list .plan-list .schedule-info .info-detail:hover ul{display:block}
.schedule-list .plan-list .schedule-info .info-detail > ul{display:none; position:absolute; background:#fff;  min-width: 240px; padding:12px 16px; border-left: 3px solid #5629ee; box-shadow: 0px 1px 4px 0px #00000024; top:1px}
.schedule-list .plan-list .schedule-info .info-detail > ul li{font-size: 14px; display:flex; gap:2px;}
.schedule-list .plan-list .schedule-info .info-detail > ul li strong{flex:none; word-break:keep-all; width:25%;}

.schedule-list .plan-list > ul{display:flex; gap:42px; overflow:hidden; padding:24px; overflow-x:auto}
.schedule-list .plan-list > ul.slick-slider{padding:24px 42px; overflow-x:hidden; }
.schedule-list .plan-list > ul.slick-slider .slick-list{overflow:initial}
.schedule-list .list-box{position:relative; flex:none; width: 230px; height:150px;  letter-spacing: -0.5px; color:#333; display:block}
.schedule-list .list-box.slick-slide{margin-right: 42px;}
.schedule-list .list-box:after{content:"\ea6b";display:inline-block;  position:absolute; right:-34px; top:40%; font-family: "remixicon"; font-size: 24px; color:#5629ee}

.schedule-list .list-box .plan-top .plan-tit{font-weight: 300; color:#202020; letter-spacing: -0.5px; font-size: 17px; margin-bottom: 8px;}
.schedule-list .list-box .plan-top .Button{position:absolute; right:8px; top:8px; border-radius: 12px; border:0px; color:#888;  box-shadow: 0px 0px 0px 1px #0000001c;}
.schedule-list .list-box .plan-top .Button i{font-size: 19px;}
.schedule-list .list-box .plan ul li{font-size: 14px; color:#0000009c; line-height: 1.5; height:24px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.schedule-list .list-box .plan ul li span{font-size:inherit; color:inherit; line-height: 1.5; vertical-align:baseline; margin-left: 4px;}
.schedule-list .list-box .plan ul li .Button i{font-size: 17px; vertical-align:baseline; color:#5b5866}
.schedule-list .list-box .plan ul li > strong{font-weight: 300;}

.schedule-list .list-box .plan-bottom {position:absolute; right:12px; bottom:12px; display:flex; align-items:center;}
.schedule-list .list-box .plan-bottom .progress{font-size: 13px; font-weight: 300; color:#5629eea1; border-radius: 50px; background:#5629ee1a; padding:0px 10px; margin-left: 8px;}
.schedule-list .list-box .plan-bottom .progress .count{font-size: 16px; color:#5629ee; font-weight:300; vertical-align:baseline; margin-right:2px;}
.schedule-list .list-box .plan-bottom .Button{font-size: 17px;  color:#00000047;}
.schedule-list .list-box .plan-bottom .Button.active{color:#000000e6}
*/
.schedule-list{display:flex; gap:8px; overflow:auto; height:calc(100% - 148px); flex-direction:column; align-items:center}
.schedule-list .plan-list{position:relative; display:flex; width:calc(100% - 8px); background:#fbfbfb; box-shadow: 1px 2px 4px 0px #0000001c; flex:none;overflow:hidden; min-height: 172px; border:1px solid #0000000d; border-radius: 4px;} 
.schedule-list .plan-list .schedule-info{position:relative; display:flex; flex-direction:column; width:25%; min-width: 320px; max-width:380px; padding:14px 12px 14px 12px;  letter-spacing: -0.6px; color:#202020; font-weight: normal; font-size: 15px; }
.schedule-list .plan-list .signal-color{display:inline; width:100%; position:absolute;  top:0px; left:0px}
.schedule-list .plan-list .signal-color:before{width:10px; height:10px; top:4px; left:4px}
.schedule-list .plan-list .schedule-info .tit{margin-right: 8px; font-weight: 600; color:#0000005e; font-size: 13px;}
.schedule-list .plan-list .schedule-info .site{display:block; font-size: 13px;}
.schedule-list .plan-list .schedule-info .tit,
.schedule-list .plan-list .schedule-info .txt,
.schedule-list .plan-list .schedule-info .site{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.schedule-list .plan-list .schedule-info .txt{color:#333; letter-spacing: -0.5px; font-size: 14px;}
.schedule-list .plan-list .schedule-info .Button{position:absolute; top:10px; right:22px; color:#00000030; border-radius:4px;}
.schedule-list .plan-list .schedule-info .Button i{font-size: 16px;}
.schedule-list .plan-list .schedule-info .Button:hover{color:#5629eecc}
.schedule-list .plan-list .schedule-info .Button.active{color:#5629ee}

.schedule-list .plan-list .schedule-info .info-detail{position:absolute; z-index: 1; right:0px; top:8px; }
.schedule-list .plan-list .schedule-info .info-detail:before{content:"\ef76"; font-family:'remixicon';  width:20px; height:24px; display:flex; align-items: center; justify-content:center;  color:#00000061;}
.schedule-list .plan-list .schedule-info .info-detail:hover ul{display:block}
.schedule-list .plan-list .schedule-info .info-detail > ul{display:none; position:absolute; right:4px; background:#fff;  min-width: 240px; padding:12px 16px; box-shadow: 0px 1px 4px 0px #00000024; top:1px; border-radius: 8px;}
.schedule-list .plan-list .schedule-info .info-detail > ul li{font-size: 14px; display:flex; gap:2px;}
.schedule-list .plan-list .schedule-info .info-detail > ul li strong{flex:none; word-break:keep-all; width:25%;}

.schedule-list .plan-list > ul{overflow:auto; height:172px; width:100%; padding:16px 12px 12px; display:flex; overflow-x:hidden; overflow-x: auto; } 
.schedule-list .plan-list.ty2 > ul{overflow:auto; height:100%; width:100%; padding:16px 12px 12px; display:flex; overflow-x:hidden; overflow-x: auto; } 

.schedule-list .plan-list > ul.slick-slider{padding:24px 42px; overflow-x:hidden; }
.schedule-list .plan-list > ul.slick-slider .slick-list{overflow:initial}

.schedule-list .list-box{position:relative; width:240px; height:auto; letter-spacing: -0.5px; color:#333; display:flex; align-items:center; flex:none}
.schedule-list .list-box.slick-slide{margin-right: 42px;}
.schedule-list .list-box:after{content:"\ea6e";display:inline-block;  position:relative; font-family: "remixicon"; font-size: 24px; color:#00000045}
.schedule-list .list-box:last-child:after{display:none}
.schedule-list .list-box .plan-top .plan-tit{font-weight: 300; color:#202020; letter-spacing: -0.5px; font-size: 17px; margin-bottom: 8px;}
.schedule-list .list-box .plan-util{position:absolute; z-index: 1; right:8px; top:8px; }
.schedule-list .list-box .plan-util:before{content:"\ef76"; font-family:'remixicon';  width:24px; height:24px; display:flex; align-items: center; justify-content:center;  color:#888; background:#fff; box-shadow: 0px 0px 0px 1px #0000001c; border-radius:50%; font-size: 13px;}
.schedule-list .list-box .plan-util .Groupbutton{display:flex; opacity:0; position:absolute; top:-1px; right:-2px; background:#fff; height:26px; border-radius: 12px; padding:0px 8px; gap:4px; transition:all 0.3s; box-shadow: 0px 0px 0px 1px #0000001c;}
.schedule-list .list-box .plan-util:hover .Groupbutton{opacity:1;}
.schedule-list .list-box .plan-util .Groupbutton .Button{color:#d5d5d5}
.schedule-list .list-box .plan-util .Groupbutton .Button.small.active{color:#6c42ff}
.schedule-list .list-box .plan-util .Groupbutton .Button.small i{font-size: 16px;}
.schedule-list .list-box .plan-util .Groupbutton .Button:hover{color:#6c42ff}

.schedule-list .plan-list.ty2 .list-box .plan-util:before{content:"\ec86"; font-family:'remixicon';  width:24px; height:24px; display:flex; align-items: center; justify-content:center;  color:#888; background:#fff; box-shadow: 0px 0px 0px 1px #0000001c; border-radius:50%; font-size: 13px;}



.schedule-list .list-box .plan ul li{font-size: 14px; color:#0000009c; line-height: 1.5; height:24px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.schedule-list .list-box .plan ul li span{font-size:inherit; color:inherit; line-height: 1.5; vertical-align:baseline; margin-left: 4px;}
.schedule-list .list-box .plan ul li .Button i{font-size: 17px; vertical-align:baseline; color:#5b5866}
.schedule-list .list-box .plan ul li a.tlink{color:#00000070}
.schedule-list .list-box .plan ul li a.tlink:hover{color:#5629ee}
.schedule-list .list-box .plan ul li > strong{font-weight: 300;}
.schedule-list .list-box label.nodata .plan > ul,
.schedule-list .list-box label.nodata .plan .plan-bottom,
.schedule-list .list-box .plan ul.nodata,
.schedule-list .list-box .plan ul li.nodata,
.schedule-list .list-box .plan-bottom.nodata{display:none}


.schedule-list .list-box .plan-bottom {position:absolute; right:12px; bottom:12px; display:flex; align-items:center;}
.schedule-list .list-box .plan-bottom .progress{font-size: 13px; font-weight: 300; color:#5629eea1; border-radius: 50px; background:#5629ee1a; padding:0px 10px; margin-left: 8px;}
.schedule-list .list-box .plan-bottom .progress .count{font-size: 16px; color:#5629ee; font-weight:300; vertical-align:baseline; margin-right:2px;}
.schedule-list .list-box .plan-bottom .Button{font-size: 17px;  color:#00000047;}
.schedule-list .list-box .plan-bottom .Button.active{color:#000000e6}

.schedule-list .list-box.before .Button.add{display:none; position:absolute; width:calc(100% - 24px); height:100%; font-family:'remixicon';  align-items:center; justify-content: center;  position:absolute; background:#ffffff6e; top:0px; left:0px; border-radius:16px; z-index: 2; font-size: 36px; backdrop-filter:blur(1.5px); cursor:pointer; color:#9066ff; }
.schedule-list .list-box.before .Button.add i{font-size: 36px;}
.schedule-list .list-box.before:hover .Button.add{display:flex;}
.schedule-list .list-box .Button.add{display:none}

.schedule-list .list-box .ImageCheckbox{border-radius: 16px; border:1px solid #00000012; box-shadow:2px 2px 3px 0px #0000000a; background:#fff; height:100%; min-height: 164px; width: 216px; padding:12px;}
.schedule-list .list-box .ImageCheckbox.amethyst{background:#9966CC;}
.schedule-list .list-box .ImageCheckbox.blueberry{background:#4F86F7;}
.schedule-list .list-box .ImageCheckbox.sunglow{background:#FFCC33;}
.schedule-list .list-box .ImageCheckbox.pistachio{background:#93C572}
.schedule-list .list-box .ImageCheckbox.tangerine{background:#FA9336;}
.schedule-list .list-box .ImageCheckbox.tulip{background:#FF878D;}
.schedule-list .list-box .ImageCheckbox.vermillion{background:#E34234}
.schedule-list .list-box .ImageCheckbox.softteal{background:#44A9AA}
.schedule-list .list-box .ImageCheckbox.pear{background:#D1E231}
.schedule-list .list-box .ImageCheckbox.slategray{background:#708090}

.schedule-list .list-box .ImageCheckbox.lavender{background:#f4f4ff;}
.schedule-list .list-box .ImageCheckbox.aliceblue{background:#f0f8ff;}
.schedule-list .list-box .ImageCheckbox.lemon{background:#fffdee;}
.schedule-list .list-box .ImageCheckbox.honeydew{background:#f0fff0;}
.schedule-list .list-box .ImageCheckbox.bisque{background:#FFE2C6 }
.schedule-list .list-box .ImageCheckbox.snow{background:#fffafa;}
.schedule-list .list-box .ImageCheckbox.mistyrose{background:#FFE5E3}
.schedule-list .list-box .ImageCheckbox.powderblue{background:#beebeb}
.schedule-list .list-box .ImageCheckbox.eggshell{background:#ECEFCC}
.schedule-list .list-box .ImageCheckbox.gainsboro{background:#dddddd}

.schedule-list .list-box .ImageCheckbox.laserlemon{background:#FFFF66} 
.schedule-list .list-box .ImageCheckbox.springbud{background:#A7FC00 }  
.schedule-list .list-box .ImageCheckbox.neonteal{background:#00CAB1 } 
.schedule-list .list-box .ImageCheckbox.traditional{background:#0080FF}
.schedule-list .list-box .ImageCheckbox.idorange{background:#FF7722 }
.schedule-list .list-box .ImageCheckbox.veronica{background:#A020F0 }


.schedule-list .list-box .ImageCheckbox.color21{background:#fff3e4}
.schedule-list .list-box .ImageCheckbox.color09{background:#f6f4fd}
.schedule-list .list-box .ImageCheckbox.color05{background:#f2fffa}

.schedule-list .list-box .ImageCheckbox.color01.light{background:#fae2e7}
.schedule-list .list-box .ImageCheckbox.color19.light{background:#efefef}


.schedule-list .list-box .ImageCheckbox.amethyst .plan-top .plan-tit,
.schedule-list .list-box .ImageCheckbox.blueberry .plan-top .plan-tit,
.schedule-list .list-box .ImageCheckbox.pistachio .plan-top .plan-tit,
.schedule-list .list-box .ImageCheckbox.vermillion .plan-top .plan-tit,
.schedule-list .list-box .ImageCheckbox.softteal .plan-top .plan-tit,
.schedule-list .list-box .ImageCheckbox.slategray .plan-top .plan-tit,
.schedule-list .list-box .ImageCheckbox.traditional .plan-top .plan-tit,
.schedule-list .list-box .ImageCheckbox.veronica .plan-top .plan-tit{color:#fff;}

.schedule-list .list-box .ImageCheckbox.amethyst .plan ul li .Button i,
.schedule-list .list-box .ImageCheckbox.blueberry .plan ul li .Button i,
.schedule-list .list-box .ImageCheckbox.pistachio .plan ul li .Button i,
.schedule-list .list-box .ImageCheckbox.tulip .plan ul li .Button i{color:#fff}

.schedule-list .list-box .ImageCheckbox.tulip .plan ul li span.color-blue1{color:#0d56ff !important}
.schedule-list .list-box .ImageCheckbox.amethyst .plan ul li span.color-blue1,
.schedule-list .list-box .ImageCheckbox.blueberry .plan ul li span.color-blue1,
.schedule-list .list-box .ImageCheckbox.veronica .plan ul li span.color-blue1,
.schedule-list .list-box .ImageCheckbox.traditional .plan ul li span.color-blue1,
.schedule-list .list-box .ImageCheckbox.slategray .plan ul li span.color-blue1,
.schedule-list .list-box .ImageCheckbox.veronica .plan ul li span.color-blue1{color:#77e5ff !important}
.schedule-list .list-box .ImageCheckbox.tangerine .plan ul li span.color-blue1{color:#2077c5 !important}
.schedule-list .list-box .ImageCheckbox.softteal .plan ul li span.color-blue1{color:#77feff !important}
.schedule-list .list-box .ImageCheckbox.idorange .plan ul li span.color-blue1,
.schedule-list .list-box .ImageCheckbox.neonteal .plan ul li span.color-blue1{color:#0058ff !important}
.schedule-list .list-box .ImageCheckbox.vermillion .plan ul li span.color-blue1,
.schedule-list .list-box .ImageCheckbox.traditional .plan ul li span.color-blue1{color:#50d5ff  !important}
.schedule-list .list-box .ImageCheckbox.Checked{ box-shadow: 0px 0px 0px 1px #6c42ff;}
.schedule-list .list-box .ImageCheckbox > .Checkbox{display:none;}
.schedule-list .list-box .ImageCheckbox > .Checked{display:none;}
.schedule-list .list-box .ImageCheckbox:after{content:''; top:0px; left:-6px; width:24px; height:24px}

.schedule-list .list-box .ImageCheckbox.Checked:after{content:"\e929"; color:#fff; margin-left: 1px; background:#5629ee; border-radius: 50%; display:flex; align-items:center}

.schedule-list .list-box .ImageCheckbox.amethyst .plan-bottom .progress{color:#ffffffb3; background:#0000002e;}
.schedule-list .list-box .ImageCheckbox.pistachio .plan-bottom .progress{color:#ffffffb3; background:#4c85264d;}
.schedule-list .list-box .ImageCheckbox.tulip .plan-bottom .progress{color:#ffffffb3; background:#9b02092b;}
.schedule-list .list-box .ImageCheckbox.blueberry .plan-bottom .progress{color:#ffffffb3; background:#0000002e;}
.schedule-list .list-box .ImageCheckbox.sunglow .plan-bottom .progress{color:#ffffffb3; background:#7f650036;}
.schedule-list .list-box .ImageCheckbox.tangerine .plan-bottom .progress{color:#ffffffb3; background:#b163004f;}
.schedule-list .list-box .ImageCheckbox.vermillion .plan-bottom .progress{color:#ffffffb3; background:#7509003d;}
.schedule-list .list-box .ImageCheckbox.softteal  .plan-bottom .progress{color:#ffffffb3; background:#0d4c4d2e;}
.schedule-list .list-box .ImageCheckbox.pear .plan-bottom .progress{color:#ffffffb3; background:#98a70d42;}
.schedule-list .list-box .ImageCheckbox.slategray .plan-bottom .progress{color:#ffffffb3; background:#21374d30;}

.schedule-list .list-box .ImageCheckbox.lavender .plan-bottom .progress{color:#ffffffb3; background:#8a6bff;}
.schedule-list .list-box .ImageCheckbox.honeydew .plan-bottom .progress{color:#ffffffb3; background:#93C572;}
.schedule-list .list-box .ImageCheckbox.snow .plan-bottom .progress{color:#ffffffb3; background:#FF878D;}
.schedule-list .list-box .ImageCheckbox.aliceblue .plan-bottom .progress{color:#ffffffb3; background:#4f86f7;}
.schedule-list .list-box .ImageCheckbox.lemon .plan-bottom .progress{color:#0000004f; background:#ffcc33;}
.schedule-list .list-box .ImageCheckbox.bisque .plan-bottom .progress{color:#0000004f; background:#FA9336;}
.schedule-list .list-box .ImageCheckbox.powderblue .plan-bottom .progress{color:#0000004f; background:#44A9AA;}
.schedule-list .list-box .ImageCheckbox.eggshell .plan-bottom .progress {color:#0000004f; background:#c6d726;}
.schedule-list .list-box .ImageCheckbox.gainsboro .plan-bottom .progress {color:#ffffffb3; background:#acaeaf;}
.schedule-list .list-box .ImageCheckbox.laserlemon .plan-bottom .progress {color:#0000004f; background:#00000014;}
.schedule-list .list-box .ImageCheckbox.neonteal .plan-bottom .progress {color:#0000004f; background:#00000014;}
.schedule-list .list-box .ImageCheckbox.traditional .plan-bottom .progress {color:#ffffffb3; background:#00000014;}
.schedule-list .list-box .ImageCheckbox.idorange .plan-bottom .progress {color:#0000004f; background:#00000014;}
.schedule-list .list-box .ImageCheckbox.veronica .plan-bottom .progress {color:#ffffffb3; background:#00000014;}

.schedule-list .list-box .ImageCheckbox.lotuspink .plan-bottom .progress{color:#ffffffb3; background:#EAD0D6;}
.schedule-list .list-box .ImageCheckbox.color05 .plan-bottom .progress{color:#ffffffad; background:#3fc495;}
.schedule-list .list-box .ImageCheckbox.color09 .plan-bottom .progress{color:#ffffffad; background:#8364e8;}
.schedule-list .list-box .ImageCheckbox.color21 .plan-bottom .progress{color:#ffffffad; background:#fea626;}

.schedule-list .list-box .ImageCheckbox.color01.light .plan-bottom .progress{color:#ffffffad; background:#9c3f513b;}
.schedule-list .list-box .ImageCheckbox.color19.light .plan-bottom .progress{color:#0000004f; background:#0000001a;}

.schedule-list .list-box .ImageCheckbox.amethyst .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.pistachio .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.tulip .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.blueberry .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.sunglow .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.tangerine .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.vermillion .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.lavender .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.snow .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.honeydew .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.honeydew .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.aliceblue .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.softteal .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.slategray .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.traditional .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.veronica .plan-bottom .progress .count{color:#fff;}

.schedule-list .list-box .ImageCheckbox.lemon .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.bisque .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.pear .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.powderblue .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.eggshell .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.gainsboro .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.laserlemon .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.springbud .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.neonteal .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .ImageCheckbox.idorange .plan-bottom .progress .count{color:#202020b8;}

.schedule-list .list-box .ImageCheckbox.lotuspink .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.color05 .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.color09 .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.color21 .plan-bottom .progress .count{color:#fff;}

.schedule-list .list-box .ImageCheckbox.color01.light .plan-bottom .progress .count{color:#fff;}
.schedule-list .list-box .ImageCheckbox.color19.light .plan-bottom .progress .count{color:#202020b8;}
.schedule-list .list-box .plan-bottom .issue-ico{position:relative}
.schedule-list .list-box .plan-bottom .issue-ico:before{content:"\ec5c"; font-family:'remixicon';}
.schedule-list .list-box .plan-bottom .issue-ico .tooltip{position:absolute; display:none; background:#fff; border:1px solid #e4e4e4;  border-radius: 6px; z-index: 999; font-size: 13px; }
.schedule-list .list-box .plan-bottom .issue-ico:hover .tooltip{display:block;}
.ml-tooltip{position:absolute; display:none; background:#fff; border:1px solid #e4e4e4;  border-radius: 6px; z-index: 999; font-size: 13px; }

.schedule-list.ty2{overflow:initial; font-family: 'remixicon';}
.schedule-list.ty2 .plan-list .schedule-info{width:initial; min-width:180px; max-width: 180px;}
.schedule-list.ty2 .plan-list.ty2 > ul li{flex:none}
.schedule-list.ty2 .list-box{width:190px}
.schedule-list.ty2 .list-box:last-child{width:160px;}
.schedule-list.ty2 .list-box .ImageCheckbox{width:180px}
.schedule-list.ty2 .list-box .plan-top .plan-tit{text-overflow:ellipsis; overflow:hidden; white-space: nowrap; width:90%}


.plan-list .slick-arrow{display:flex;justify-content:center;align-items:center;position:absolute; top: 14px; width:60px; height:200px; margin-top:-15px; padding:0; border:none; border-radius: 0; outline:none; font-size:0; cursor:pointer;z-index:1;transition:all .20s ease}
.plan-list .slick-prev{background: linear-gradient(90deg, #fff, #fff,  #ffffff00);}
.plan-list .slick-next{background: linear-gradient(90deg, #ffffff00, #fff, #fff);  width:60px;}
.plan-list .slick-prev{left:-0px}
.plan-list .slick-next{right:-0px}
.plan-list .slick-prev:before,
.plan-list .slick-next:before{content:"\e93c"; color: #00000042; font-family:xeicon; font-size:26px; transition:all .20s ease}
.plan-list .slick-next:before{transform:rotate(-180deg)}
.plan-list .slick-prev:before{margin-right: 20px;}
.plan-list .slick-next:before{margin-left: 16px;}
.plan-list .slick-prev:hover:before,
.plan-list .slick-next:hover:before{color: #00000090;}
.plan-list .slick-prev:hover{background: linear-gradient(90deg, #fbfbfb, #fbfbfb,  #fbfbfb00);}
.plan-list .slick-next:hover{background: linear-gradient(90deg, #fbfbfb00, #fbfbfb, #fbfbfb);}
.plan-list .slick-prev.slick-disabled{display:none !important}
.plan-list .slick-next.slick-disabled{display:none !important}

/* schedule-reg */
.fixConWrap.schedule .schedule-list .plan-list{background:none; box-shadow:none; height:100%; padding:0; display:block; width:100%; }
.fixConWrap.schedule .schedule-list .plan-list > ul .plan-top .plan-tit i{font-size: 19px; color:#0006}
.fixConWrap.schedule .schedule-list .plan-list > ul .plan-bottom .progress .count{font-size:13px}

.fixConWrap.schedule .fixCont1 .columnBox{padding:0px; padding-bottom: 15px;}
.fixConWrap.schedule .fixCont1 .columnBox .keySearchbox{padding:15px}
.fixConWrap.schedule .fixCtrl{padding:12px 15px 0px 15px}
.fixConWrap.schedule .fixCont1 .schedule-list{border-top:none; overflow:hidden; overflow-y:auto; height:calc(100% - 200px);}
.fixConWrap.schedule .fixCont1 .schedule-list .list-box{height:130px; flex:none; width:100%}
.fixConWrap.schedule .fixCont1 .schedule-list .list-box:after{display:none}
.fixConWrap.schedule .fixCont2 .schedule-list .list-box .ImageCheckbox{max-width: 240px;}
.fixConWrap.schedule .fixCont1 .schedule-list .plan-list > ul{gap:12px; display:flex; flex-direction:column; max-width:calc(100% - 1px); width:calc(100% - 1px); height:calc(100% - 2px)}

.fixConWrap.schedule .fixCont2 .columnBox{padding:0px; display:block}
.fixConWrap.schedule .fixCont2 .columnBox .writing-ty1{display:flex; gap:24px; padding:0px 15px}
.fixConWrap.schedule .fixCont2 .columnBox .writing-ty1 .writing-list{border:none}
.fixConWrap.schedule .fixCont2 .columnBox .writing-ty1 .writing-list .revision{letter-spacing: -0.5px; color:#999;}
.fixConWrap.schedule .fixCont2 .columnBox .writing-ty1 .writing-list .revision span{color:#202020; margin-left: 4px;}
.fixConWrap.schedule .fixCont2 .schedule-list{border-top:1px solid #ededed; border-bottom:1px solid #ededed; height:auto; align-items:initial}
.fixConWrap.schedule .fixCont2 .schedule-list > .Groupbutton{position:absolute; display:flex; gap:8px; flex-direction:column; background:#ffffff80; height:232px; z-index: 2; border-right:1px solid #ededed; justify-content:center; padding:8px; backdrop-filter:blur(2px); margin-top: 10px;}

.fixConWrap.schedule .fixCont2 .schedule-list .plan-list{width:100%; overflow:hidden; overflow-x:auto; height:250px; padding-left:60px}
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list > ul{display:flex; height:100%; width:100%}

.fixConWrap.schedule .fixCont2 .schedule-list .list-box{flex-direction: row; height:174px; flex:none; width:270px; top:46px }
.fixConWrap.schedule .fixCont2 .schedule-list .list-box:after{content:"\ea6e"}

.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow{display:block; transform:scalex(-1); position:absolute; top:0px; z-index: 1; left:45%}
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow::before{content:""; right:0px; width: 0; height: 0; border-bottom: 6px solid #3fc495; border-left: 4px solid transparent; border-right: 4px solid transparent;}
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow:after{content:""; width:270px; height:14px; border:2px solid #3fc495; border-top:0px; display:block; margin-left: 3px;}
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow.arrow-top{top:-16px; transform:scaley(-1) scalex(-1)} 
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow.arrow-bottom{top:151px; transform:scalex(-1)} 
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow .txt{position:absolute; font-size: 12px; letter-spacing: -0.5px; color:#aaa; top:42px; width:100%; text-align: center;}
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow .txt li{display:inline-block; margin-right: 12px;}
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow.arrow-top .txt{transform:scalex(-1) scaley(-1);}
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .arrow.arrow-bottom .txt{transform:scalex(-1); }
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .plan-bottom{justify-content:flex-end}
.fixConWrap.schedule .fixCont2 .schedule-list .plan-list .plan-bottom .type{font-size: 11px; color:#3fc495;  font-weight: 600; letter-spacing: -0.5px;}
.fixConWrap.schedule .fixCont2 .grid-area{overflow:auto; height:calc(100% - 432px); padding:0px 15px}

/* task-reg */
.task-reg-wrap .writing-list .writing-tit .tit{font-weight: 300;}
.task-reg-wrap .writing-list .writing-tit .tit span{font-weight:initial; color:#999}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .cont-box{display:flex; justify-content:space-between; align-items:center; border-radius: 10px; background:#fefcff; border:1px solid #e9e3ff; box-shadow:2px 2px 3px #00000008;  padding:0px 12px; border-left: 3px solid #a78dff; height:68px}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .cont-box .contL .trans-ico{color:#46415936}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .cont-box .contL .trans-ico:hover{color:#5629ee}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .cont-box .contR .trans-ico{border-radius:4px; color:#00000030}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .cont-box .contR .trans-ico:hover{background:#5629ee17; color:#5629ee}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table{width:100%; border:1px solid #ededed; border-left: 0; border-right:0}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table > li{display:grid; grid-template-columns:30px 15% 15% 5% 14px 30px 40%; align-items:center; gap:12px; padding:8px; border-bottom:1px solid #ededed;}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table li.sort{background:#f9f9f9; border:0; color:#666}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table li:last-child{border-bottom:0}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table li > div.code{width:100%; text-align: center; font-weight: 300; letter-spacing:-0.5px;}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table li > div.state{width:100%; text-align: center; font-weight: 300; letter-spacing:-0.5px;}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table li > div.progress{width:100%; text-align: center; font-weight: 300; letter-spacing:-0.5px;}

.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table li > .mark{font-size: 13px; color:#666; text-align: left;}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table li > .trans-ico{color:#46415936}
.task-reg-wrap .writing-list.task-ty1 .writing-cont .state-table li > .trans-ico:hover{color:#5629ee}

.task-reg-wrap .writing-list.task-ty1 .layer-box .color-picker{display:grid; grid-template-columns: repeat(6, 1fr); gap:4px;}

/* **************************************** *
*  LIST SAMPLE of SM
* **************************************** */
.box-list.company-list ul{display: grid; grid-template-columns: repeat(auto-fill, minmax(19%, 1fr)); gap: 12px; cursor:pointer}
.box-list.company-list ul li .form-box{position:relative; border-radius: 8px; letter-spacing: -0.5px; display:flex; height:130px; justify-content:space-between; border:0; box-shadow: 0px 1px 3px #0000002b; padding:16px; overflow:hidden; gap:12px}
.box-list.company-list ul li .form-box .logo{background:#5629ee; border-radius:13px; flex:none; width:42px; height:42px; color:#fff; display:flex; align-items: center; justify-content:center; font-size: 20px; font-weight: 300; z-index: 1; position:relative}
.box-list.company-list ul li .form-box .logo:before{content:""; display:block; background:inherit; width:50px; height:50px; border-radius: 16px; position:absolute; z-index: -1; opacity:0.1}
.box-list.company-list ul li .form-box .logo img{padding:8px; display:block; overflow:hidden}
.box-list.company-list ul li .form-box .tit{font-weight: 300; font-size: 17px; color:#202020; margin-top:12px;  overflow:hidden; white-space: nowrap; text-overflow: ellipsis;} 
.box-list.company-list ul li .form-box .txt{color:#888; font-size: 14px; display:flex; align-items:center}
.box-list.company-list ul li .form-box .txt span.time{flex: 1; margin-left:16px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; }
.box-list.company-list ul li .form-box .count{position:absolute; right:16px; top:12px; letter-spacing: -1px;  color:#444; font-size: 28px; font-weight: 300; text-align: right; margin-top: 6px;}
.box-list.company-list ul li .form-box .count i{font-size: 16px; color:#bebebe; font-weight:bold}

.box-list.banner-list ul{display: grid; grid-template-columns: repeat(auto-fill, minmax(19%, 1fr)); gap: 12px; cursor:pointer}
.box-list.banner-list ul li .form-box{position:relative; border-radius: 8px; letter-spacing: -0.5px; display:flex; height:130px; justify-content:space-between; border:0; box-shadow: 0px 1px 3px #0000002b; padding:16px; overflow:hidden; gap:12px}
.box-list.banner-list ul li .form-box:after{position:absolute; content:"\ea6e"; font-family:'remixicon'; font-size: 22px; color:#ffffffb5; right:10px; top:12px;}
.box-list.banner-list ul li .form-box .logo{background:#fff; border-radius:13px; flex:none; width:42px; height:42px; color:#fff; display:flex; align-items: center; justify-content:center; font-size: 20px; font-weight: 300; z-index: 1; position:relative}
.box-list.banner-list ul li .form-box .logo:before{content:""; display:block; background:inherit; width:50px; height:50px; border-radius: 16px; position:absolute; z-index: -1; opacity:0.1}
.box-list.banner-list ul li .form-box .logo i{font-size: 22px;}
.box-list.banner-list ul li .form-box .tit{font-weight: 300; font-size: 17px; color:#fff; margin-top:12px;  overflow:hidden; white-space: nowrap; text-overflow: ellipsis;} 
.box-list.banner-list ul li .form-box .txt{color:#ffffffb3; font-size: 15px; overflow:hidden; white-space: nowrap; text-overflow: ellipsis; display: block;}

.box-list.banner-list ul li .form-box .count{color:#777; font-size: 24px; font-weight: 300; text-align: right; margin-top: 6px;}
.box-list.banner-list ul li .form-box .count i{font-size: 16px;}

.box-list.banner-list ul li:nth-child(1n) .form-box{background:#8f87ff}
.box-list.banner-list ul li:nth-child(2n) .form-box{background:#3e64ff }
.box-list.banner-list ul li:nth-child(3n) .form-box{background:#f8748a}
.box-list.banner-list ul li:nth-child(4n) .form-box{background:#173790}
.box-list.banner-list ul li:nth-child(5n) .form-box{background:#a1adce }
.box-list.banner-list ul li:nth-child(6n) .form-box{background:#2db888}
.box-list.banner-list ul li:nth-child(7n) .form-box{background:#f1964d}
.box-list.banner-list ul li:nth-child(8n) .form-box{background:#6f32ff}
.box-list.banner-list ul li:nth-child(9n) .form-box{background:#5b5e67}

.box-list.banner-list ul li:nth-child(1n) .form-box .logo i{color:#8f87ff}
.box-list.banner-list ul li:nth-child(2n) .form-box .logo i{color:#3e64ff }
.box-list.banner-list ul li:nth-child(3n) .form-box .logo i{color:#f8748a}
.box-list.banner-list ul li:nth-child(4n) .form-box .logo i{color:#173790}
.box-list.banner-list ul li:nth-child(5n) .form-box .logo i{color:#a1adce }
.box-list.banner-list ul li:nth-child(6n) .form-box .logo i{color:#2db888}
.box-list.banner-list ul li:nth-child(7n) .form-box .logo i{color:#f1964d}
.box-list.banner-list ul li:nth-child(8n) .form-box .logo i{color:#6f32ff}
.box-list.banner-list ul li:nth-child(9n) .form-box .logo i{color:#5b5e67} 


/*writing-list cont-box*/
.writing-list .writing-cont .cont-box{display:flex; justify-content:space-between; align-items:center; border-radius: 10px; background:#fefcff; border:1px solid #e9e3ff; box-shadow:2px 2px 3px #00000008;  padding:0px 12px; border-left: 3px solid #a78dff; height:68px}
.writing-list .writing-cont .cont-box .contL .trans-ico{color:#46415936}
.writing-list .writing-cont .cont-box .contL .trans-ico:hover{color:#5629ee}
.writing-list .writing-cont .cont-box .contL .txt{display:inline-block; letter-spacing: -0.5px; font-size: 15px; color:#333}
.writing-list .writing-cont .cont-box .contL .txt strong{font-weight: 300;}
.writing-list .writing-cont .cont-box .contL .txt a.tlink{cursor:pointer}
.writing-list .writing-cont .cont-box .contL .txt span.day{font-size: 13px; color:#0000006e}
.writing-list .writing-cont .cont-box .contR .trans-ico{border-radius:4px; color:#00000030}
.writing-list .writing-cont .cont-box .contR .trans-ico:hover{background:#5629ee17; color:#5629ee}

.writing-list .writing-cont .cont-box-wrap{display:grid; grid-template-columns:repeat(auto-fill, minmax(32%, 1fr)); gap:12px}
.writing-list .writing-cont .cont-box.ty2{display:flex; flex-direction:column; justify-content:space-between;  align-items:flex-start; border-radius: 10px; background:#fefcff; border:1px solid #e9e3ff; box-shadow:2px 2px 3px #00000008;  padding:12px; border-left: 3px solid #a78dff; height:160px}
.writing-list .writing-cont .cont-box.ty2 .contL .trans-ico{color:#46415936}
.writing-list .writing-cont .cont-box.ty2 .contL .trans-ico:hover{color:#5629ee}
.writing-list .writing-cont .cont-box.ty2 .contL .tit{display:inline-block; letter-spacing: -0.5px; font-size: 15px; color:#333}
.writing-list .writing-cont .cont-box.ty2 .contL .tit strong{font-weight: 300;}

.writing-list .writing-cont .cont-box.ty2 .contL .txt{display:block; letter-spacing: -0.5px; font-size: 15px; color:#333;}
.writing-list .writing-cont .cont-box.ty2 .contL .txt a{display:-webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; width:100%;}
.writing-list .writing-cont .cont-box.ty2 .contL .txt a.tlink{cursor:pointer}
.writing-list .writing-cont .cont-box.ty2 .contL .txt span.day{font-size: 13px; color:#0000006e}
.writing-list .writing-cont .cont-box.ty2 .contR {display:flex; justify-content:flex-end; width:100%; gap:4px}
.writing-list .writing-cont .cont-box.ty2 .contR .trans-ico{border-radius:4px; color:#00000030}
.writing-list .writing-cont .cont-box.ty2 .contR .trans-ico:hover{background:#5629ee17; color:#5629ee}


/* 수주등록 */
.salemng_list{display:flex; flex-wrap:wrap}
.salemng_list li{min-width:77px; margin:5px 5px 5px 0px}

.expt_add_info{display:flex; align-items:center; width:1330px}
.expt_add_info .expt_add_info_list{width:100%}
.expt_add_info .expt_add_info_list li{display:flex; align-items:center; width:100%; margin:10px 0 0 15px}
.expt_add_info .expt_add_info_list li:first-child{margin-top:0}


/* 제품관리 - 추가팝업 - 도면 경로 */
.file_nav_area{display:flex; align-items:center; width:100%}
.file_nav_area .Textinput{height:35px; border-radius:5px}
.file_nav_area .Button.small{min-width:85px; height:35px; margin-top:5px; margin-left:2px}



/* **************************************** *
*  WMS-TEMPLATE
* **************************************** */

.process-wrap{width:100%; background:#fafafa; border:1px solid #ededed; height:250px; padding:24px 0px; overflow:auto}
.process-wrap > div{width:1510px; display:flex; justify-content:center; margin:0 auto;  position:relative;}
.process-wrap ul{display:flex; flex-direction:column;}
.process-wrap ul.pro-left{position:absolute; left:115px}
.process-wrap ul.pro-center{margin-left:94px;}
.process-wrap ul.pro-right{position:absolute; right:22px}
.process-wrap ul.only{margin-left:0px}
.process-wrap ul.only .pro-stage .arrow{position:relative; height:1px; width:50px; min-width: 50px; background:#a38af7;}
.process-wrap ul.only .pro-stage .arrow.first{position:absolute;  right:0px}
.process-wrap ul.only .pro-stage .arrow.second{position:absolute; right:411px}
.process-wrap ul.only .pro-stage .arrow.second .arrow-right{right:9px; left:initial}
.process-wrap ul.only .pro-stage .arrow.left-top{right:411px}


.process-wrap ul.pro-center li:first-child .stage-info{background:#f6f7ff; border-color:#d8daff}

.process-wrap ul li.pro-stage .arrow.left-top .arrow-left{left:34px;}
.process-wrap ul li.pro-stage{display:flex; align-items:center; margin-bottom: 12px; width:410px; flex:none; position:relative}
.process-wrap ul li.pro-stage .arrow.last{min-width: 50px;}
.process-wrap ul li.pro-stage .arrow.second.last{position:absolute; width:50px; left:-51px}
.process-wrap ul li.pro-stage .arrow.second.last .arrow-right:nth-child(1){left:35px}
.process-wrap ul li.pro-stage .stage-info{position:relative; border:1px solid #e1e1e1; background:#fff;  min-width: 360px; max-width: 360px; border-radius: 4px; display:flex; justify-content:flex-start; align-items:center; justify-content:center; letter-spacing: -0.5px; padding:12px; color:#333}

.process-wrap ul li.pro-stage .arrow{position:relative; height:1px; width:100%; min-width: 120px; background:#a38af7;}
.process-wrap ul li.pro-stage .arrow-non{display:none}

.process-wrap ul li.pro-stage .arrow.right-top{position:relative; height:1px; width:50px; min-width: 50px; background:#a38af7;}
.process-wrap ul li.pro-stage .arrow.right-top:before{content:""; position:absolute; display:block; bottom:0px; right:0px; height:65px; width:1px; min-width:1px; background:#a38af7; }

.process-wrap ul li.pro-stage .arrow.left-top{position:absolute; height:1px; width:50px; min-width: 50px; background:#a38af7; right:411px;}
.process-wrap ul li.pro-stage .arrow.left-top:before{content:""; position:absolute; display:block; bottom:0px; left:0px; height:65px; width:1px; min-width:1px; background:#a38af7; }
.process-wrap ul li.pro-stage .arrow.left-top .arrow-right:nth-child(1){left:34px}

.process-wrap ul li.pro-stage:nth-child(3) .arrow.right-top:before{height:calc(64px + 66px);}
.process-wrap ul li.pro-stage:nth-child(4) .arrow.right-top:before{height:calc(130px + 66px);}
.process-wrap ul li.pro-stage:nth-child(5) .arrow.right-top:before{height:calc(196px + 66px);}
.process-wrap ul li.pro-stage:nth-child(6) .arrow.right-top:before{height:calc(262px + 66px);}
.process-wrap ul li.pro-stage:nth-child(7) .arrow.right-top:before{height:calc(328px + 66px);}
.process-wrap ul li.pro-stage:nth-child(8) .arrow.right-top:before{height:calc(394px + 66px);}
.process-wrap ul li.pro-stage:nth-child(9) .arrow.right-top:before{height:calc(460px + 66px);}
.process-wrap ul li.pro-stage:nth-child(10) .arrow.right-top:before{height:calc(526px + 66px);}

.process-wrap ul li.pro-stage:nth-child(3) .arrow.left-top:before{height:calc(64px + 66px);}
.process-wrap ul li.pro-stage:nth-child(4) .arrow.left-top:before{height:calc(130px + 66px);}
.process-wrap ul li.pro-stage:nth-child(5) .arrow.left-top:before{height:calc(196px + 66px);}
.process-wrap ul li.pro-stage:nth-child(6) .arrow.left-top:before{height:calc(262px + 66px);}
.process-wrap ul li.pro-stage:nth-child(7) .arrow.left-top:before{height:calc(328px + 66px);}
.process-wrap ul li.pro-stage:nth-child(8) .arrow.left-top:before{height:calc(394px + 66px);}
.process-wrap ul li.pro-stage:nth-child(9) .arrow.left-top:before{height:calc(460px + 66px);}
.process-wrap ul li.pro-stage:nth-child(10) .arrow.left-top:before{height:calc(526px + 66px);}

.process-wrap ul li.pro-stage .arrow-right{position:absolute; z-index: 1; font-size: 12px; font-weight: 300; color:#fff; display:flex; justify-content:center; align-items: center;} 
.process-wrap ul li.pro-stage .arrow-right:after{content:""; border-color: transparent transparent transparent #a38af7; border-style: solid; border-width: 12px 0 12px 16px; float: left; height: 0; width: 0; position: absolute; z-index: -1; left:0px}
.process-wrap ul li.pro-stage .arrow-right:nth-child(1){left:0px; top:-9px;}
.process-wrap ul li.pro-stage .arrow-right:nth-child(2){right:9px; top:-9px}

.process-wrap ul li.pro-stage .arrow-left{position:absolute; z-index: 1; font-size: 12px; font-weight: 300; color:#fff; display:flex; justify-content:center; align-items: center; padding-left:7px} 
.process-wrap ul li.pro-stage .arrow-left:after{content:""; border-color: transparent transparent transparent #a38af7; border-style: solid; border-width: 12px 0 12px 16px; float: left; height: 0; width: 0; position: absolute; z-index: -1; left:0px; transform:rotate(180deg)}
.process-wrap ul li.pro-stage .arrow-left:nth-child(1){left:0px; top:-9px}
.process-wrap ul li.pro-stage .arrow-left:nth-child(2){right:9px; top:-9px}

/* **************************************** *
*  calendar
* **************************************** */
div.wx-event-calendar-event:has(div.wrapper_holiday){border: 0 !important; box-shadow: none !important; background: none !important;}
.popup.svelte-3iw5hi .Groupbutton .Button.only-ico{border-radius: 50%; min-width: 36px; height:36px}
.popup.svelte-3iw5hi .Groupbutton .Button.only-ico.del{border-color:#f1b4b4; color:#db4242}
.popup.svelte-3iw5hi .Groupbutton .Button.only-ico.del:active, 
.popup.svelte-3iw5hi .Groupbutton .Button.only-ico.del:hover,
.popup.svelte-3iw5hi .Groupbutton .Button.only-ico.del:focus,
.popup.svelte-3iw5hi .Groupbutton .Button.only-ico.del.af-hover,
.popup.svelte-3iw5hi .Groupbutton .Button.only-ico.del.Checked{background:#fceeee}
.popup.svelte-3iw5hi .Groupbutton .Button.only-ico i{font-size: 18px;}

/* **************************************** *
*  workday-content
* **************************************** */
.workday-content li > div{display:flex; justify-content:space-between}
.workday-content li{background:#e9f0ff; border:1px solid #dbe6ff; border-radius: 8px; padding:8px; margin-bottom:8px}
.workday-content li .del-btn{color:#00000026}
.workday-content li .del-btn:hover{color:#7b7b9bd6}
.workday-content li .add-btn{color:#5629ee}
.workday-content li .add-btn:hover{color:#3d17be}


/* 메일 주소록 버튼 리스트 */
.contact-btn-list .fixMove{height:200px; display:flex; flex-direction:column; justify-content:center; align-items:center}


/* 진행현황 차트 너비 */
.pro_chart .chart_wrap{display:flex; flex-wrap:wrap}
.pro_chart .chart_wrap div{width:49%; margin:0 10px 10px 0}


.stitArea.aprv-fixed{position:relative; width:100%}
.stitArea.aprv-fixed .stitL{width:100%}
.stitArea.aprv-fixed .Groupbutton {display:flex; width:100%;}
.stitArea.aprv-fixed .Groupbutton .Button{flex: 1 auto}

.sme-aprv-wrap{height:calc(100% - 40px); overflow:auto;}


.sme-aprv-top .writing-ty1.line{width:calc(100% - 450px); border-bottom: none;}
.sme-aprv-top:nth-child(2) .writing-ty1.line{width:100%; border-top:none; }
.sme-aprv-top .writing-ty1 .writing-list{display:inline-grid; grid-template-rows: repeat(1, auto 1fr 1fr); border-bottom:none; width:100%; height:100%; }
.sme-aprv-top .writing-ty1 .writing-tit.aprv-tit{text-align: center; justify-content:center; width:100%; padding:26px; background:#f2f7ff; }
.sme-aprv-top .writing-ty1 .writing-tit.aprv-tit .tit{display:inline-block; font-size:22px ; text-align: center; letter-spacing:-0.5px; color:#202020; font-weight:300; padding:16px 0px}
.sme-aprv-top .writing-ty1 .writing-list li{width:100%;}
.sme-aprv-top:nth-child(2) .writing-ty1 .writing-list{display:inline-grid; grid-template-rows: repeat(1, 62px)}

.sme-aprv-top .writing-ty1 .writing-list li .writing-tit{min-height: 100%;}
.sme-aprv-top .writing-ty1.line .writing-cont{min-height: 100%;}

.sme-aprv-top{position:relative; display:flex;}
.sme-aprv-top .flag-approval-wrap{display:flex; flex-direction:column; border-top:2px solid #9e9e9e; border-bottom: 1px solid #e9e9e9; border-left:1px solid #e9e9e9; width:640px;}
.sme-aprv-top .flag-approval-wrap .flag-approval{display:flex; align-items:center; border-bottom: 1px solid #e9e9e9;}
.sme-aprv-top .flag-approval-wrap .flag-approval:last-child{border-bottom: none;}
.sme-aprv-top .flag-approval-wrap .flag-approval > .tit{display:inline-flex;  justify-content:center; align-items:center;  width:fit-content; padding:0px 8px; height:100%;  margin-right: 12px; flex:none; border-right: 1px solid #e9e9e9; text-align: center; letter-spacing: -0.5px; color:#202020; font-weight: 300;}
.sme-aprv-top .flag-approval-wrap .flag-approval .slick-track{flex-wrap: wrap; justify-content:flex-start}
.sme-aprv-top .flag-approval-wrap .lotcore-carousel .slick-list{margin-left:initial;}

@media print{
/* 	.sme-aprv-top.print .writing-ty1{flex:1 auto}	 */
/* 	.sme-aprv-top .flag-approval-wrap{width:440px; max-width:440px;} */
	.docpilot-step{zoom:0.8;}
	.dev-content{zoom:0.8;}
	div[name="divDownBtnGrp"]{display:none;}
	.Groupbutton{display:none;}
}