html,body{background-color:#F7F7F7;color: #2E2E2E;font-family: "myriad-pro","Microsoft JhengHei","Arial",STHeitiTC,STHeitiSC,sans-serif;font-size: 16px;font-weight: 400;line-height: 1.125em;min-height: 100vh;z-index: 0;}
@media (max-width: 1199px){
    html,body{font-size: 16px;}
}
@media (max-width: 991px){
    html,body{font-size: 16px;}
}
@media (max-width: 767px){
    html,body{font-size: 16px;}
}
/*html,body{min-width: 768px;overflow-x: auto;}*/
html.noscroll{overflow-y: hidden;}  
a,.btl_container a{color: #1B5FAC;}
a:active, a:focus, a:hover{color: #1B5FAC;text-decoration: none;}
h1{font-size: 2.25rem;line-height: 1.375rem;}
h2{font-size: 1.75rem;line-height: 1.875rem;}
h3{font-size: 1.25rem;line-height: 1.375rem;}
h1,h2,h3{margin: 10px 0;font-weight: 700;}
iframe{border: 0;width: 100%;height: 100%;}
.modal-open{padding-right: 0px !important;overflow: auto !important;overflow-x: hidden !important;}
@media (max-width: 991px){
    #container .btl_container_withsidebar_group .html_content iframe{width: 100%;max-width: 700px;margin: 0; }
}
.btl_bt{background-color: #1B5FAC;border-color: #1B5FAC;color: #FFF;}
.btl_bt:hover,.btl_bt:active,.btl_bt:focus{background-color: #FFF;border-color: #1B5FAC;color: #1B5FAC;}
a.btl_bt{background-color: #1B5FAC;border-color: #1B5FAC;color: #FFF;}
a.btl_bt:hover,a.btl_bt:active,a.btl_bt:focus{background-color: #FFF;border-color: #1B5FAC;color: #1B5FAC;text-decoration: none;}
a.btn:hover,a.btn:active,a.btn:focus{text-decoration: none;}
.material-icons{font-size: 1rem;line-height: 1rem;display:inline-flex;vertical-align:top;}
.btl_banktop .fa{background-color: #1B5FAC;border-radius: 50%;font-size: 2rem;}

.load{display: block;width: 100%;height: 100%;max-width: 100%;max-height: 100%;min-height: 150px;overflow: hidden;}
.load::after{border: .25em solid #343a40;border-right-color: transparent;border-radius: 50%;content: '';display: block;width: 2rem;height: 2rem;margin: 60px auto;-webkit-animation: spinner-border .75s linear infinite;animation: spinner-border .75s linear infinite;}
.load.light::after{border-color: #f8f9fa!important;}

.msg{font-size: 1rem;font-weight: 600;line-height: 1rem;text-align: center;display: block;width: 100%;padding: 20px 15px;}
.msg.error{color: #F73434;}
.msg.info{color: #2E2E2E;}

.table_row{display: table;width: 100%;height: 100%;}
.table_row .table_col{display: table-cell;text-align: left;height: 100%;vertical-align: middle;}
.table_row .table_col.right{text-align: right;padding-right: 15px;}
.table_row .table_item{display: inline-block;margin-right: 10px;position: relative;}
.table_row .table_col.right .table_item{margin-right: 0;margin-left: 10px;}

/*Login*/
.login_panel{height: 100%;}
.login_panel>div{height: 100vh;min-height: 500px;}
.login_bg{background-image: url('../images/login_bg.jpg');background-repeat: no-repeat;background-position: center;background-size: cover;text-align:right;display:table;width: 100%;height: 100%;position: relative;opacity:1;z-index: 0;}
.login_bg::before{background-color: rgba(0, 0, 0, 0.2);content: '';display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 0;}
.login_bg > div{display:table-cell;vertical-align:middle;position: relative;z-index: 1}
.login_bg > div > div{color:#ffffff;display:inline-block;width:100%;}
.login_bg .animated{width:100%;}
.login_bg .animated img{width:40%;}
.login_form{background-color: #e8e8e8;text-align:center;display:table;height: 100%;}
.login_form > div{display:table-cell;vertical-align:middle;}
.login_form .panel_box{background-color: #fff;border: 1px solid #e3e3e3;border-radius: 10px;box-shadow: inset 0 1px 1px 1px rgba(0,0,0,0.05);color: #777;display:inline-block;padding: 0;}
.login_form .panel_box .alert{text-align: left;}
.login_form .panel_box hr{border-top: 2px solid #214c7f;width: 100%;margin: 0;}
.login_form .panel_header{padding: 15px 0;}
.login_form .panel_header img{width: auto;max-width: 200px;height: auto;}
.login_form .panel_body{padding: 0;}

/*Header*/
#header{box-shadow: 0 5px 10px rgba(136, 136, 136, .2);display: block;width: 100%;height: 80px;position: relative;z-index: 1;}
#header .img_btn{display: block;}
#header .img_btn img{display: inline-block;width: auto;height: 80px;padding: 15px;}

.dropdown_bg{display: none;width: 100vw;height: 100vh;position: fixed;top: 0;left: 0;z-index: 5;}
.dropdown_bg:hover{opacity: 0.7;}
.on .dropdown_bg{display: block;}
.dropdown_btn{background-color: #ECEFF4;border: 0;border-radius: 10px;color: #1B5FAC;font-size: 1rem;line-height: 1rem;font-weight: 600;display: block;padding: 10px 40px 10px 20px;position: relative;}
.dropdown_btn .arrow{font-size: 1.5rem;line-height: 1.5rem;text-align: center;display: block;width: 25px;height: 25px;position: absolute;top: 6px;right: 10px;}
.on .dropdown_btn .arrow{transform: rotate(180deg);-ms-transform: rotate(180deg);-moz-transform: rotate(180deg);-webkit-transform: rotate(180deg);-o-transform: rotate(180deg);}
.dropdown_menu{background-color: #ECEFF4;border-radius: 10px;box-shadow: 5px 5px 20px rgba(0, 0, 0, .2);text-align: left;list-style: none;display: none;min-width: 200px;margin: 0;padding: 0;position: absolute;top: calc(100% + 10px);overflow: hidden;z-index: 10;}
.table_col.left .dropdown_menu{left: 0;}
.table_col.right .dropdown_menu{right: 0;}
.dropdown_menu li{display: block;}
.dropdown_menu a{font-size: 1rem;font-weight: 600;line-height: 1rem;display: block;padding: 15px 15px;position: relative;}
.dropdown_menu a:hover{background-color: #E2E6EB;}
.submenu ul{list-style: none;display: block;width: 100%;max-height: calc(100vh - 180px);margin: 0;padding: 0 0 10px 0;overflow-y: auto;}
.submenu ul::-webkit-scrollbar{width: 8px;}
.submenu ul::-webkit-scrollbar-track{background: transparent; border-radius: 10px;}
.submenu ul::-webkit-scrollbar-thumb{background: #C2C8D0;border-radius: 10px;}
.submenu ul a{color: #2E2E2E;font-weight: 400;padding: 15px 15px 15px 60px;}
.submenu ul a:hover{color: #2E2E2E;}
.submenu ul a .staff_icon{position: absolute;top: 6px;left: 15px;}
.create .dropdown_btn{background-color: #1B5FAC;border-radius: 50px;color: #fff;}
.create .dropdown_btn:hover{opacity: 0.7;}
.create .dropdown_menu{background-color: #1B5FAC;min-width: 155px;}
.create .dropdown_menu a{color: #fff;font-size: 1rem;font-weight: 600;text-align: center;padding: 15px;}
.create .dropdown_menu a:hover{background-color: rgba(255, 255, 255, 0.3);}
.staff_status .dropdown_menu{background-color: #fff;max-height: calc(100vh - 180px);overflow-y: auto;}
.staff_status .dropdown_menu::-webkit-scrollbar{width: 8px;}
.staff_status .dropdown_menu::-webkit-scrollbar-track{background: transparent; border-radius: 10px;}
.staff_status .dropdown_menu::-webkit-scrollbar-thumb{background: #C2C8D0;border-radius: 10px;}
.staff_status .dropdown_menu .staff_row{padding: 6px 15px;position: relative;}
.staff_status .dropdown_menu .staff_row:after{background-color: #BCBCBC;border-radius: 50%;content: '';display: block;width: 8px;height: 8px;position: absolute;top: 18px;right: 25px;}
.staff_status .dropdown_menu .staff_row.status_on:after{background-color: #4DD687;}
.staff_status .dropdown_menu .staff_row.status_yellow:after{background-color: #FFCE29;}
.staff_status .dropdown_menu .staff_row.status_red:after{background-color: #F83D3D;}
.staff_status .dropdown_menu .staff_icon{margin-right: 10px;}
.notify .dropdown_menu{background-color: #fff;min-width: 300px;max-height: calc(100vh - 180px);overflow-y: auto;}
.notify .dropdown_menu::-webkit-scrollbar{width: 8px;}
.notify .dropdown_menu::-webkit-scrollbar-track{background: transparent; border-radius: 10px;}
.notify .dropdown_menu::-webkit-scrollbar-thumb{background: #C2C8D0;border-radius: 10px;}
.notify .dropdown_menu li{border-bottom: 2px solid #F2F3F5;cursor: pointer;display: block;padding: 20px 15px 10px 15px;}
.notify .dropdown_menu li.read{background-color: #F2F3F5;border-bottom: 2px solid #FFF;}
.notify .dropdown_menu li p{color: #2E2E2E;font-size: 1rem;font-weight: 400;text-align: justify;display: block;margin: 0;padding: 0 0 10px 0;}
.notify .dropdown_menu li.read p{color: #a3a4a5;}
.notify .dropdown_menu li p b{font-weight: 600;}
.notify .dropdown_menu li span{color: #2E2E2E;font-size: 0.75rem;font-weight: 400;text-align: right;display: block;}
.notify .dropdown_menu li.read span{color: #a3a4a5;}
.notify .dropdown_btn .num{background-color: #FF4646;border: 0;border-radius: 50%;color: #fff;font-size: 0.75rem;font-weight: 700;line-height: 0.75rem;text-align: center;display: none;min-width: 25px;min-height: 25px;padding: 6px 0;position: absolute;top: -10px;right: -10px;z-index: 1;}
.notify .dropdown_btn .num.on{display: inline-block;}
.circle_btn{background-color: #ECEFF4;border: 0;border-radius: 50%;font-size: 1rem;line-height: 1rem;text-align: center;display: block;width: 40px;height: 40px;padding: 0;position: relative;}
.circle_btn.link{padding: 10px;}
.circle_btn .material-icons{color: #1B5FAC;font-size: 1.5rem;position: absolute;top: 12px;left: 8px;}
.circle_btn:hover{opacity: 0.7;}

.create_btn{background-color: #1B5FAC;border: 0;border-radius: 50px;color: #fff;font-size: 1rem;line-height: 1rem;font-weight: 600;display: block;padding: 10px 20px 10px 20px;position: relative;}
.create_btn:hover{color: #fff;opacity: 0.9;}

.staff_icon{background-color: transparent;border-radius: 50%;color: #fff;font-size: 0.75rem;font-weight: 600;font-style: normal;line-height: 0.75rem;text-align: center;display: inline-block;width: 30px;height: 30px;padding: 9px 0;}
.staff_icon.large{line-height: 1rem;width: 40px;height: 40px;padding: 12px 0;}
.staff_icon.cs{background-color: #FF8BF6;}
.staff_icon.cthk{background-color: #48D2D8;}
.staff_icon.ctsz{background-color: #48D2D8;}
.staff_icon.tdm{background-color: #D6742C;}
.staff_icon.tdhk{background-color: #8B8BFF;}
.staff_icon.tdsz{background-color: #8B8BFF;}

/*Dashboard*/
.dashboard{background-color:#F7F7F7;display: block;height: calc(100vh - 80px);overflow-x: auto;overflow-y: hidden;}
.dashboard_row{display: table;width: 100%;height: 100%;}
.dashboard_col{display: table-cell;width: 33.33%;min-width: 450px;height: calc(100vh - 80px);padding: 15px;position: relative;overflow: hidden;vertical-align: top;}
.dashboard_col.col1{background-color: #ECEDEF;width: 35%;min-width: 450px;}
.dashboard_col.col2{background-color: #F7F7F7;width: 25%;min-width: 400px;}
.dashboard_col.col3{background-color: #1B5FAC;width: 40%;min-width: 500px;}
.style_2col .dashboard_col.col1{background-color: #F7F7F7;width: 50%;min-width: 400px;}
.style_2col .dashboard_col.col2{background-color: #F7F7F7;border-left: 4px solid #DCDFE5;width: 50%;min-width: 400px;}
.style_2col.tdm_mode .tasklist{height: calc(100vh - 150px);}
.style_2col.tdm_mode .dashboard_col.col1 .tasklist{height: calc(100vh - 190px);}

.col_title{display: block;padding-bottom: 8px;position: relative;}
.col_title h3{color: #2E2E2E;font-size: 1rem;font-weight: 600;line-height: 1rem;text-align: left;margin: 0;padding: 8px 0;}
.col3 .col_title h3{color: #fff;}
.col_title .pdf_btn{background-color: #fff;border: 0;border-radius: 5px;color: #1B5FAC;font-size: .875rem;font-weight: 600;line-height: 1rem;text-align: center;padding: 8px 10px;position: absolute;top: 0;right: 8px;}

/*Task List*/
.tasklist{display: block;width: 100%;height: calc(100vh - 150px);padding-right: 8px;overflow-x: hidden;overflow-y: auto;}
.tasklist::-webkit-scrollbar{width: 8px;}
.tasklist::-webkit-scrollbar-track{background: transparent; border-radius: 10px;}
.tasklist::-webkit-scrollbar-thumb{background: #B2B2B2;border-radius : 10px;}
.col3 .tasklist::-webkit-scrollbar-thumb{background: #6591C4;}
.tasklist .list_not,
.tasklist .list_inq{display: block;position: relative;}
.tasklist .list_not.underline{border-bottom: 1px solid #DBDBDB;border-radius: 0;margin-bottom: 10px;}
.tasklist button{background-color: transparent;border: 0;border-radius: 5px;}
.tasklist .task{background-color: #fff;border: 2px solid #E8E8E8;border-radius: 5px;display: block;margin-bottom: 10px;padding: 10px 0 10px 15px;position: relative;}
.tasklist .task.wait{background-color: #AFAFAF;border: 2px dashed #fff;}
.tasklist .task.yellow{background-color: #FDF4DA;border-color: #FCE196;}
.tasklist .task.red{background-color: #FFEDED;border-color: #FDCDCD;}
.tasklist .tinfo{display: block;padding-right: 140px;position: relative;}
.tasklist .theader{display: table;width: 100%;padding-bottom: 2px;}
.tasklist .theader span{background-color: transparent;border: 1px solid transparent;border-radius: 5px;font-size: .75rem;font-weight: 600;line-height: .75rem;display: inline-block;margin: 0 5px 5px 0;padding: 5px;}
.tasklist .theader span.tordernum{background-color: #8CA2BC;color: #fff;}
.tasklist .theader span.tnum{border-color: #6A7C91;color: #6A7C91;}
.tasklist .theader span.tdeadline{background-color: #FDCDCD;color: #F73434;}
.tasklist .tdeadline .material-icons{line-height: .625rem;margin: 0;margin-right: 5px;padding: 0;}
.tasklist .torder{color: #1B5FAC;font-size: 1.25rem;font-weight: 600;line-height: 1.375rem;text-align: left;padding: 2px 0;}
.tasklist .tcustomer{color: #2E2E2E;font-size: 1rem;font-weight: 600;line-height: 1.125rem;text-align: left;padding: 4px 0;}
.tasklist .tlang{color: #676767;font-size: .875rem;font-weight: 400;line-height: .875rem;text-align: left;padding: 6px 0;}
.tasklist .tstaff{display: table;list-style: none;margin: 0;padding: 8px 0;}
.tasklist .tstaff li{background-color: rgba(227,227,227,0.6);border: 0;border-radius: 50px;font-size: 0.875rem;font-weight: 600;line-height: 0.875rem;text-align: left;display: inline-block;float: left;margin: 0 5px 5px 0;padding: 0 10px 0 3px;}
.tasklist .tstaff .staff_icon{transform: scale(0.8);transform-origin: center left;}
.tasklist .tstaff .tregion{border-radius: 10px;padding: 8px 10px;}
.tasklist .tcontrol{display: block;width: 140px;height: 100%;position: absolute;top: 0;right: 0;}
.tasklist .tcontrol button:hover{opacity: 0.9;}
.tasklist .task_btn{background-color: #1B5FAC;border: 0;border-radius: 50px;color: #fff;font-size: 1rem;font-weight: 600;line-height: 1rem;display: inline-block;min-width: 100px;padding: 12px 5px;position: absolute;top: 0;right: 40px;}
.tasklist .working .task_btn{background-color: #1AC174;}
.tasklist .done .task_btn{background-color: #FF845F;}
.tasklist .tstatus{background-color: #ECEFF4;border: 0;border-radius: 5px;color: #54779F;font-size: .75rem;font-weight: 400;line-height: .75rem;text-align: center;display: none;min-width: 100px;padding: 8px 4px;position: absolute;top: 5px;right: 40px;}
.tasklist .tstatus.show{display: inline-block;}
.tasklist .tstatus.under{top: 45px;}
.tasklist .option_btn{display: inline-block;width: 40px;height: 40px;padding: 8px 0;position: absolute;top: 0;right: 0;}
.tasklist .option_btn .material-icons{color: #B2B2B2;font-size: 1.5rem;font-weight: 600;line-height: 1.5rem;}
.tasklist .toption{display: block;width: 180px;position: absolute;top: 40px;right: 0;z-index: 2;}
.tasklist .toption ul{border-radius: 10px;box-shadow: 0 8px 15px rgba(0,0,0,0.3);display: none;list-style: none;margin: 0;padding: 0;position: relative;overflow: hidden;z-index: 1;}
.tasklist .toption li{border-top: 1px solid #F5F5F5;display: block;}
.tasklist .toption li:first-child{border-top: 0;}
.tasklist .toption button{background-color: #fff;border: 0;border-radius: 0;color: #2E2E2E;font-size: 1rem;font-weight: 400;line-height: 1rem;text-align: left;display: block;width: 100%;padding: 15px;}
.tasklist .toption button:hover{background-color: #eaeaea;}
.tasklist .toption button.collab_btn{}
.tasklist .toption button.urgent_btn{}
.tasklist .toption button.delete_btn{color: #F75454;}
.tasklist .toption button.checkin_btn{}
.tasklist .toption button.queuehk_btn{}
.tasklist .toption button.queuesz_btn{}
.tasklist .toption button.assign_btn{}
.tasklist .toption button.uncheck_btn{color: #F75454;}
.tasklist .toption .material-icons{margin-right: 8px;}
.tasklist .toption .toption_bg{display: none;width: 100vw;height: 100vh;position: fixed;top: 0;left: 0;z-index: 0;}
.tasklist .toption.on .toption_bg{display: block;}
.tasklist .slide_btn{text-align: right;display: inline-block;width: 140px;height: calc(100% - 50px);padding: 8px 10px;position: absolute;bottom: 7px;right: 0;z-index: 0;}
.tasklist .slide_btn .material-icons{color: #676767;font-size: 1.5rem;font-weight: 600;line-height: 1.5rem;position: absolute;bottom: 8px;right: 8px;z-index: 1;}
.tasklist .task.on .slide_btn .material-icons{transform: rotate(180deg);-ms-transform: rotate(180deg);-moz-transform: rotate(180deg);-webkit-transform: rotate(180deg);-o-transform: rotate(180deg);}
.tasklist .tts{color: #676767;font-size: 0.875rem;font-weight: 400;line-height: 0.875rem;text-align: right;display: inline-block;min-width: 100px;position: absolute;bottom: 20px;right: 40px;z-index: 0;}
.tcontent{display: none;padding-right: 15px;position: relative;}
.on .tcontent{display: block;}
.subtasklist{border-left: 3px solid #B2B2B2;display: block;width: 100%;padding-left: 15px;}
.subtasklist .subtask{display: block;margin-bottom: 15px;}
.subtasklist .stremark{color: #2E2E2E;font-size: 1rem;font-weight: 400;line-height: 1.125rem;text-align: left;display: block;padding-bottom: 10px;}
.subtasklist .stoption{background-color: rgba(247, 247, 247, 0.6);border-radius: 5px;display: table;width: 100%;margin: 0 0 10px 0;padding: 6px 8px 8px 8px;position: relative;}
.subtasklist .stoption span{border-left: 1px solid #2E2E2E;color: #2E2E2E;font-size: 0.75rem;font-weight: 600;line-height: 0.75rem;display: inline-block;padding: 0 5px;}
.subtasklist .stoption span:first-child{border-left: 0;padding-left: 0;}
.subtasklist .stcontrol{display: table;width: 100%;;position: relative;}
.subtasklist .control_btn{background-color: #ECEFF4;border-radius: 5px;color: #1B5FAC;font-size: 0.875rem;font-weight: 600;line-height: 0.875rem;padding: 8px 8px;}
.subtasklist .file_btn{float: left;}
.subtasklist .edit_btn{float: right;}
.task.wait .subtasklist .control_btn,
.task.yellow .subtasklist .control_btn,
.task.red .subtasklist .control_btn{background-color: #fff;}
.subtasklist .control_btn .material-icons{color: #1B5FAC;font-size: inherit;font-weight: 600;line-height: inherit;margin-right: 5px;}

.tasklist .rev_btn{background-color: transparent;border-top: 2px dashed #B2B2B2;border-radius: 0;color: #1B5FAC;font-size: 0.875rem;font-weight: 600;line-height: 0.875rem;text-align: center;display: block;width: 100%;padding: 10px;}

.tasklist .wait .theader span.tordernum{background-color: #cecece;color: #fff;}
.tasklist .wait .theader span.tnum{border-color: #fff;color: #fff;}
.tasklist .wait .theader span.tdeadline{background-color: #FFEBEB;color: #F73434;}
.tasklist .wait .task_btn{background-color: #fff;color: #1B5FAC;}
.tasklist .wait .option_btn .material-icons{color: #fff;}
.tasklist .wait .slide_btn .material-icons{color: #fff;}
.tasklist .wait .tts{color: #fff;}
.tasklist .wait .torder{color: #fff;}
.tasklist .wait .tcustomer{color: #fff;}
.tasklist .wait .tlang{color: #fff;}
.tasklist .wait .tstaff li{background-color: #E3E3E3;}
.tasklist .wait .subtasklist{border-color: #fff;}

/*Popup Modal*/
.modal{}
.modal.lockclose.modal-static .modal-dialog{-webkit-transform: none;transform: none;}
.modal-content{border-radius: 5px;}
.modal-header{border: 0;border-radius: 0;padding: 1.5rem 1.5rem;}
.modal-header h3{color: #2E2E2E;font-size: 1.25rem;font-weight: 400;line-height: 1.125rem;text-align: left;display: block;width: 100%;margin: 0;padding-right: 4rem;}
.modal-header .close{font-size: 2rem;font-weight: 400;line-height: 1.3rem;}
.modal-body{padding: 1rem;word-break: break-word;max-height: calc(100vh - 2rem - 180px);padding: 0 1.5rem;overflow: hidden;}
.modal-body::-webkit-scrollbar{width: 8px;}
.modal-body::-webkit-scrollbar{height: 8px;}
.modal-body::-webkit-scrollbar-track{background: transparent; border-radius: 10px;}
.modal-body::-webkit-scrollbar-thumb{background: #E2E2E2;border-radius : 10px;}
.modal-body p{margin: 0;}
.modal-footer{border: 0;border-radius: 0;text-align: right;padding: 1rem 1.5rem;}
.modal-footer .btn{background-color: transparent;border: 0;border-radius: 50px;color: #676767;font-size: 1rem;font-weight: 600;line-height: 1rem;text-align: center;display: inline-block;margin: 0 0 0 15px;padding: 15px 20px;}
.modal-footer .btn.btn-primary{background-color: #1B5FAC;color: #fff;}
.modal-footer .btn.btn-success{background-color: #1AC174;color: #fff;}
.modal-footer .btn.btn-danger{background-color: #DB574C;color: #fff;}
.modal-footer .btn.off{opacity: 0.7;cursor: no-drop;}
.modal-lg.full{max-width: calc(100vw - 2rem);min-height: calc(100% - 2rem);margin: 1rem auto;}
.modal.show:after{background-color: rgba(0, 0, 0, 0.5);}
@media (min-width: 576px){
    .modal-dialog{max-width: 550px;margin: 1.75rem auto;}
    .modal-sm{max-width: 400px;}
}

.popup_pool .modal-body{overflow-x: auto;overflow-y: auto;}
.popup_pool .poollist{border-collapse:separate;border-spacing:0 5px;width: 100%;min-width: 600px;}
.popup_pool .poollist thead th{color: #8E99AD;font-size: 1rem;font-weight: 600;line-height: 1rem;text-align: center;min-width: 60px;padding: 0 5px;}
.popup_pool .poollist tbody td{background-color: #FAFAFC;color: #2E2E2E;cursor: pointer;font-size: 1.125rem;font-weight: 600;line-height: 1.25rem;text-align: center;min-width: 60px;padding: 20px 5px;}
.popup_pool .poollist thead th.col_6{min-width: 110px;}
.popup_pool .poollist tbody .on td{background-color: #ECEFF4;}

.msgbox h2{color: #2E2E2E;font-size: 1.75rem;line-height: 1.75rem;text-align: center;display: block;width: 100%;margin: 0;padding-left: 30px;}
.msgbox p{color: #2E2E2E;font-size: 1.125rem;line-height: 1.25rem;text-align: center;margin-bottom: 15px;}
.msgbox .modal-footer .btn{padding: 15px 35px;}

.choice p{color: #2E2E2E;font-size: 1.125rem;font-weight: 600;line-height: 1.25rem;text-align: center;margin-bottom: 15px;}
.choice .modal-footer{text-align: center;justify-content: center;}
.choice .modal-footer .btn{width: 40%;margin: .25rem 15px;padding: 15px 20px;}

.popup_tasklist .modal-header{padding: 1rem;padding-right: 1.5rem;}
.popup_tasklist .modal-header h3{color: #fff;}
.popup_tasklist .modal-header .close{color: #fff;}
.popup_tasklist .modal-content{background-color: transparent;border-color: transparent;}
.popup_tasklist .modal-body{padding: 0 1rem;overflow-y: auto;}
.popup_tasklist .tasklist{height: auto;padding-right: 0;overflow-y: visible;}
.popup_tasklist .modal-footer{padding: 1rem;padding-right: 1.5rem;}

.popup_urgent .modal-footer .btn{padding: 15px 35px;}
.popup_urgent .modal-footer .btn-primary.dis{cursor: no-drop;opacity: 0.5;}
.urgent_list{display: block;list-style: none;margin: 0 0 15px 0;padding: 0;}
.urgent_list li{display: block;margin: 0 0 5px 0;}
.urgent_list .reason_btn{background-color: #fff;border: 0;color: #2E2E2E;font-size: 1rem;font-weight: 400;line-height: 1.125rem;text-align: left;display: block;width: 100%;padding: 15px 15px 15px 40px;position: relative;}
.urgent_list .reason_btn.dis{cursor: no-drop;opacity: 0.5;}
.urgent_list .reason_btn .material-icons{color: #2E2E2E;font-size: 1rem;line-height: 1rem;text-align: left;width: 20px;height: 20px;position: absolute;top: 15px;left: 15px;}
.urgent_list .reason_btn .material-icons.radio_on{display: none;}
.urgent_list .reason_btn .material-icons.radio_off{display: block;}
.urgent_list .reason_btn.on .material-icons.radio_on{display: block;}
.urgent_list .reason_btn.on .material-icons.radio_off{display: none;}

.popup_form .btl_form{padding: 0;}
.popup_form .form_label{font-size: 1rem;font-weight: 700;padding: 15px 0;}
.popup_form .form_input{border: 1px solid #D8D8D8;border-radius: 5px;}

.popup_redo .modal-body{padding-top: 1rem;max-height: none;}
.upload_input{display: block;position: relative;}
.upload_input .upload_file{display: none;}
.upload_area{background-color: #fff;border: 1px solid #D8D8D8;border-radius: 5px;display: table;width: 100%;padding: 20px;}
.upload_area .material-icons{color: #919191;font-size: 4rem;line-height: 4rem;text-align: center;display: block;margin-bottom: 10px;}
.upload_area p{color: #8D9398;font-size: 1rem;text-align: center;display: block;margin: 0;}
.upload_area p .upload_btn{color: #1B5FAC;text-decoration: underline;cursor: pointer;}
.upload_preview{display: block;padding: 5px 0;position: relative;}
.upload_preview p{background-color: #E8E8E8;border-radius: 5px;color: #2E2E2E;font-size: 0.875rem;font-weight: 600;line-height: 1rem;display: inline-block;width: auto;margin: 0 5px 5px 0;padding: 8px 35px 8px 15px;position: relative;}
.upload_preview p:nth-child(even){background-color: #f1f1f1;}
.upload_preview p .btn{background-color: #FF2E2E;border-color: #FF2E2E;border-radius: 50%;color: #fff;font-size: 0.875rem;font-weight: 700;line-height: 0.875rem;padding: 0 5px 2px;margin: 0 0 0 10px;position: absolute;top: 6px;right: 3px;}

.popup_collaborator .modal-body{max-height: none;}
.popup_collaborator .bc_group{display: block;padding: 0 0 10px 0;position: relative;}
.popup_collaborator .form_label{display: block;color: #2E2E2E;font-size: 1rem;font-weight: 600;margin: 10px 0;}
.popup_collaborator .bc_staff{background-color: #F4F5F7;border: 1px solid #BFBFBF;border-radius: 5px;min-height: 40px;padding: 5px 5px;}
.popup_collaborator .bc_btn{background-color: transparent;border: 0;color: #1B5FAC;font-size: 0.875rem;font-weight: 600;display: block;padding: .375rem 0;}
.popup_collaborator .bc_btn.off{color: #B2B2B2;cursor: no-drop;}
.popup_collaborator .bc_staff li{list-style: none;}
.popup_collaborator .bc_staff .staff_icon{margin-right: 10px;}

.popup_assign .modal-header h3{font-size: 1rem;line-height: 1rem;font-weight: 600;}
.popup_assign .modal-body{max-height: unset;overflow: unset;}
.popup_assign .modal-body{font-size: 1rem;line-height: 1rem;font-weight: 600;}
.popup_assign .form_group{margin-bottom: 20px;}
.popup_assign .ss-main .ss-single-selected{height: 45px;padding: 5px 15px;}
.popup_assign .ss-content .ss-list .ss-option{padding: 10px 15px 10px 30px;position: relative;}
.popup_assign .ss-content .ss-list .ss-option.rowBlank{padding: 0;}
.popup_assign .ss-option.staff_row:after{background-color: #BCBCBC;border-radius: 50%;content: '';display: block;width: 8px;height: 8px;position: absolute;top: 20px;left: 10px;}
.popup_assign .ss-option.staff_row.status_on:after{background-color: #4DD687;}
.popup_assign .ss-option.staff_row.status_yellow:after{background-color: #FFCE29;}
.popup_assign .ss-option.staff_row.status_red:after{background-color: #F83D3D;}
.popup_assign .ss-option.staff_row i.staff_icon{margin-right: 10px;}
.ss-main .ss-single-selected .placeholder i.staff_icon{display: inline-block;width: 30px;margin-right: 10px;}
@media (min-width: 576px){
    .popup_assign .modal-dialog{max-width: 350px;}
}

/*Task Form*/
.task_form .task_info{color: #2E2E2E;font-size: 1rem;font-weight: 400;line-height: 1.125rem;text-align: right;}
.task_form .btl_form{background-color: #fff;border: 1px solid #E0E0E0;display: block;width: calc(100% - 30px);max-width: 800px;margin: 40px auto;padding: 10px 15px;}
.task_form .btl_form .form_label{padding: 5px 0;}
.task_form .btl_form .form_input{border: 1px solid #BFBFBF;}
.task_form .btl_form .form_input.form_select.ss-main{display: block;}
.task_form .btl_form .form_input{border-radius: 5px;}
.task_form .form_group{padding-bottom: 15px}
.task_form .form_group.oneline label{display: inline-block}
.task_form .form_group.oneline .form_block{display: inline-block;margin-left: 10px;}
.task_form .form_group.oneline .form_input{display: inline-block;width: 70px;}
.task_form .form_session{border-bottom: 1px solid #E0E0E0;}
.task_form .form_session.session_6{border-bottom: 0;}
.task_form .form_session.row>div{padding: 0 30px;}
.task_form .session_name{color: #2B2F31;font-size: 1.25rem;font-weight: 600;line-height: 1.25rem;text-align: left;display: block;margin: 30px 0 20px 0;}
.task_form .btl_form .form_block.type_checkbox .form_checkbox_btn{position: relative;padding-left: 30px;}
.task_form .btl_form .form_block.type_checkbox .form_checkbox_btn i{color: #707070;font-size: 1.5rem;position: absolute;top: calc((100% - 20px) / 2);left: 0;}
.task_form .btl_form .form_block.type_checkbox .form_checkbox_btn span{color: #2E2E2E;font-size: 1rem;font-weight: 400;line-height: 1rem;}

.task_form .btl_form .form_input.form_select .ss-option.ss-option-selected::before{font-weight: 700;padding: 2px;}
.ss-main .ss-single-selected{background-color: #F4F5F7;}
.task_form .btl_form .form_block.type_radio{margin-bottom: 15px;}
.task_form .btl_form .form_block.type_radio .input_div{width: calc(33.33% - 15px);}
.task_form .btl_form .form_block.type_radio.full .input_div{width: 100%;}
.task_form .btl_form .form_block.type_radio .form_radiobox_btn{color: #2E2E2E;}
.task_form .btl_form .form_block.type_radio .form_radiobox_btn i{border: 1px solid #2E2E2E;font-size: 0.875rem;}
.task_form .btl_form .form_block.type_radio .form_radiobox_btn i.fa-circle-o::before{opacity: 0;}
.task_form .btl_form .form_block.type_checkbox .form_checkbox_input{margin-left: 10px;}
.task_form .btl_form .form_block.type_checkbox.full .withtxt{display: block;}
.task_form .btl_form .form_block.type_checkbox.full .withtxt .form_checkbox_input{display: block;width: calc(100% - 30px);margin-left: 30px;}
.task_form .btl_form .form_block.type_checkbox .form_checkbox_input#f_remove_input{width: 70px;min-height: 30px;margin-bottom: 0;}
.task_form .form_action{border: 0;display: block;padding: 10px 0 30px 0;text-align: right;}
.task_form .form_action .btn{border-radius: 50px;margin: 0 0 0 15px;padding: 8px 20px 8px 20px;}
.task_form .form_action .btn.btn-primary{background-color: #1B5FAC;}
.task_form .form_action .alert{text-align: left;}
@media (max-width: 767px){
    .task_form .btl_form .form_block.type_radio .input_div {width: 100%;}
}

/*TDM Filter*/
.taskFilter{display: table;width: 100%;padding-bottom: 10px;}
.filter_queue{display: inline-block;float: left;margin-right: 5px;}
.filter_checked{display: inline-block;float: left;margin-right: 5px;}
.search_btn{background-color: transparent;border: 0;float: right;text-align: center;padding: 5px;}
.search_btn .material-icons{color: #1B5FAC;font-size: 1.8rem;line-height: 1.8rem;}

.taskSearchBox{display: none;width: 100%;padding: 10px 15px;position: absolute;top: 50px;left: 0;right: 0;z-index: 1;}
.taskSearchBox .search_input{background-color: #fff;border: 1px solid #E6E6E6;border-radius: 5px;display: block;padding-bottom: 10px;position: relative;}
.taskSearchBox .search_input input{background-color: #fff;border: 0;border-bottom: 1px solid #E2E2E2;border-radius: 0;display: block;width: calc(100% - 30px);margin: 0 15px;padding: 10px 25px 10px 0;}
.taskSearchBox .taskSearch_btn{background-color: transparent;border: 0;display: block;width: 40px;height: 40px;padding: 0;position: absolute;top: 0;right: 5px;}
.taskSearchBox .taskSearch_btn .material-icons{color: #1B5FAC;font-size: 2rem;line-height: 2rem;}
.taskSearchBox .searchtips{display: block;}
.taskSearchBox .searchtips label{font-weight: 700;display: block;margin: 0;padding: 20px 15px 10px 15px;}
.taskSearchBox .searchtips .tipsItem{display: block;padding: 10px 15px 10px 15px;cursor: pointer;}
.taskSearchBox .searchtips .tipsItem b{color: #1B5FAC;font-weight: 700;}

.btl_form .form_input.form_select .ss-option{padding-left: 10px;}
.btl_form .form_input.form_select .ss-option::before{display: none;}
.ss-content .ss-list .ss-option.ss-disabled{background-color: #fff;}