body{ 
/*min-height:100vh;*/
margin:0; padding:0;

  position: relative;
color: #666;
font-size:14px; 
}
*{ outline:0;}
 button:focus {outline:0;}
 .btn.focus, .btn:focus {
    outline: 0; 
    box-shadow: none; -webkit-box-shadow: none;
}
input:focus,
select:focus,
textarea:focus,
button:focus {
    outline-width: 0;
    outline: none; 
    box-shadow: none; -webkit-box-shadow: none;
}
 
.container {
    max-width: 1280px;
}
 
.container.inn{
    max-width: 1024px;
}

.shbox{-webkit-box-shadow: 0 0 8px  rgba(102,102,102,0.76);
-moz-box-shadow: 0 0 8px  rgba(102,102,102,0.76);
box-shadow: 0 0 8px  rgba(102,102,102,0.76);}
section{ margin:0; padding:0; }
.section_p{ padding:25px 25px 40px 25px; margin:0 0 0 0;
}

body.home{

}


body.inner{ max-height:100vh; max-width:100vw; overflow: auto; 
min-height:100vh; width:100%;display:block; position:relative;/*
 -moz-background-size:cover;
-webkit-background-size:cover;
-o-background-size:cover;
background-size:cover;
background-repeat:  repeat; 
background-position: 50% 50%; 
 background-image:url(../images/bg_base.jpg)*/
 background:#fff; 
}


body.home #footer_section{ padding:0; position:fixed; bottom:0; left:0; width:100%; background:rgba(0,0,0,0.5)}

body.home  #footer_cnt{ padding:15px 25px 15px 25px; text-align:right}
body.home  #footer_cnt ,
body.home  #footer_cnt a{ color:#fff; font-size:12px}

#tt_cnt{ display:inline-block; position:fixed; left:0; top:20px; width:100%; z-index:100}
#tt_cnt.nofix{ width:100%; display:block; left:0; top:0;  position: relative}
#logo_home { display:block; padding:0 0 0 0; background:0; width:100%; width:150px; }
#logo_home.inner{ }
#logo_home h1{ font-size:18px; line-height:18px; font-weight:bold; color:#fff; margin:0; letter-spacing:0; text-transform:uppercase} 
#logo_home h2{ font-size:14px;  line-height:14px;font-weight:bold; color:#fff; letter-spacing:4px;} 
#bg_cnt{ height:100vh; width:100vw; display:block; position:fixed; left:0; top:0; z-index:-1}

#bg_mask,
#bg_base,
#bg_sd,
#bg_th{ height:100vh; width:100vw; display:block; position:fixed; left:0; top:0; z-index:1; opacity:0;}

 
.modal-open .so_nav{ opacity:0;}
body  #bg_base{opacity:1;}
body.xleft  #bg_cnt  #bg_base{opacity:0;  }
body.xleft  #bg_cnt   #bg_sd{opacity:0;}
body.xleft  #bg_cnt  #bg_th{opacity:1;}

body.xright  #bg_cnt  #bg_base{opacity:0;}
body.xright  #bg_cnt   #bg_sd{opacity:1;}
body.xright   #bg_cnt  #bg_th{opacity:0;}
	
#bg_mask{ z-index:2 ;opacity:1; 
/*background:rgba(255,255,255,0.5);*/
background:rgba(0,0,0,0);
}




#home_cnt{ min-height:100vh; width:100%;display:block; position:relative;/*
 -moz-background-size:cover;
-webkit-background-size:cover;
-o-background-size:cover;
background-size:cover;
background-repeat: no-repeat; 
background-position: 50% 50%; 
 background-image:url(../images/bg_base.jpg)*;*/ background:#fff;} 

#home_cnt.reg{  margin:0;}
#home_cnt.reg #logo_home{ margin-bottom:20px}

#inner_reg{ padding:20px 15px 0 15px;}
#home_cnt_inner{flex-wrap: no-wrap; padding:10vh 0 0 0;}

.loginbox{ padding:45px 25px 25px 25px; display:inline-block; background:rgba(255,255,255,0.9); text-align:center; width:100%;
position:relative
}

.loginbox .reg_btn{/*border-radius: 10px; */ color:#fff; background:#81d8d0; font-weight:bold; font-size:12px; padding:5px 20px  5px 20px; display:inline-block; margin:40px auto; margin-bottom:0;}
.loginbox .reg_btn:hover{ background:#b0080f; }



.loginbox h2{ margin:0; font-size:32px; font-weight:bold}
.loginbox .myinp{ font-size:24px; padding:10px; line-height:25px; font-size:16px; text-align:center; background:0; border:0; border-bottom:1px solid #666; color:#666}

.lbx_left,
.lbx_right{
 -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;}
.lbx_left,
.lbx_right{ overflow:hidden; width:300px; margin:0 15px 0 15px;  /* border-radius: 25px;*/
-webkit-box-shadow: 0 0 4px  rgba(102,102,102,0.76);
-moz-box-shadow: 0 0 4px  rgba(102,102,102,0.76);
box-shadow: 0 0 4px  rgba(102,102,102,0.76);
}
.lbx_main{
	overflow:hidden; padding:0; margin:0;  /* border-radius: 25px;*/
-webkit-box-shadow: 0 0 4px  rgba(102,102,102,0.76);
-moz-box-shadow: 0 0 4px  rgba(102,102,102,0.76);
box-shadow: 0 0 4px  rgba(102,102,102,0.76); min-height:400px; background:#fff;  
	}

.lbx_left.round{border-radius: 0; padding:  0;  }
.lbx_left.round  .loginbox{ background:rgba(255,255,255,.6)}

body .cngboxBtn2{ display: none ; position:absolute; left:50%; bottom:10px; z-index:20; width:120px; margin-left:-60px; color:#fff; text-align:center; font-size:12px;padding:3px 5px 3px 5px; border-radius:  5px;
cursor:pointer } 

body.xleft .lbx_left{  } 
body.xleft .lbx_left .cngboxBtn2{ display:inline-block ;   background:rgba(144,191,94,0.5);  color:#fff;   } 
body.xleft .lbx_right{ width:0; opacity:0; margin:0} 
body.xright .lbx_left{  width:0; opacity:0 ; margin:0} 
body.xright .lbx_right  .cngboxBtn2{ display:inline-block;  background:rgba(238,119,0,0.5);color:#fff;  } 

.mybtn{ border:0; padding:15px ;display:inline-block; text-align:center; width:60px; height:60px; line-height:10px; font-size:20px; color:#fff;
    border-radius: 35px; background:#aaa; cursor:pointer;}
.mybtn.smb_sd{ background:rgba(116,73,61,0.9);  }
.mybtn.smb_th{  background:#0057a6 ; }

.mybtn.exit{ background:rgba(255,255,255,0.9); color:#aaa; position:absolute; left:20px; bottom:20px;  line-height:30px; }

.mybtn.smb_th .fa{ line-height:30px; color:#fff;}
.mybtn.smb_th:hover .fa{ line-height:30px; color:#fff;

-webkit-animation:spin 1s linear infinite;
    -moz-animation:spin 1s linear infinite;
    animation:spin 1s linear infinite;
}
 
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }


.mylabel{ white-space:nowrap; padding:5px; display:inline-block; margin:0 0 2px 0;}


.modal-backdrop{  background:#000; } 
.modal-backdrop.fade {
  filter: alpha(opacity=0) !important;;
  opacity: 0 !important;;
}
.modal-backdrop.fade.show {
  filter: alpha(opacity=75) !important;;
  opacity: .75 !important;;
}

#ckbox{ max-height:70vh;}
#ckbox_inner{max-height:50vh; padding:0 30px 0 0; overflow:auto !important;  -webkit-overflow-scrolling: touch; }

  
.cform label.error{ display:block; background:rgba(255,0,0,0.7); color:#fff; font-size:12px; padding:5px; border-radius:5px; float: none;}


/*-------------------------------------MENU--------------------------------------------*/



.navbar{ padding:0 15px 0 15px; background:#005aab;}
.navbar .navbar-nav{}


.navbar .navbar-nav .lang{ position:absolute; top:18px; right:40px;}

.navbar .navbar-nav .logout_btn{position:absolute; top:18px;  right:2px}


.navbar .navbar-nav .nav-item.logout{ display:none}
 
.navbar .navbar-nav .nav-item { margin:0 10px 0 10px}

.navbar .navbar-nav .dropdown-menu a{ font-size:14px;}

.navbar-toggler.collapsed .fa.fa-bars{ display:block}
.navbar-toggler.collapsed .fa.fa-times{ display:none}
.navbar-toggler .fa.fa-bars{ display:none}
.navbar-toggler .fa.fa-times{ display:block}

.navbar-collapse.collapse.show{ padding-bottom:15px;}

.navbar .navbar-nav .dropdown.user{position:absolute; top:0;  right:60px; text-align:center; }
.navbar .navbar-nav .dropdown.user a{ font-size:20px;}

.navbar .navbar-nav .dropdown.user.nav-item a.nav-link{ padding:0; line-height:70px;}
.navbar .navbar-nav .dropdown.user .dropdown-menu{ max-width:1000px; padding:15px; text-align:center; width:auto}
.navbar .navbar-nav .dropdown.user .dropdown-menu p{ font-size:16px; font-weight:bold; margin:0;}
.navbar .navbar-nav .dropdown.user .dropdown-menu span{font-size:14px; white-space:nowrap;  font-weight: normal; }


.navbar .navbar-nav .nav-item  a.nav-link{ color:#fff; padding:25px 8px 25px 8px}
.navbar .navbar-nav .nav-item.active a.nav-link{ background:#fff; color:#444;} 
/*-------------------------------------MENU--------------------------------------------*/




/*---------------------------------------------------------------------------------*/
#nav_gap{ border:0px solid #f00; width:100%; height:70px; display:block}
nav.navbar{  }
#all_cnt{ overflow:hidden}
 #card_cnt{ z-index:100;}
 #opt_overlap{ padding:0; background:#fff; position:relative; z-index:500}
 #opt_overlap{ color:#444;}
 .lb_col{ text-align:left}
 /*
#opt_overlap{   display:block;    background:#fff;

-webkit-box-shadow: 0 0 4px  rgba(102,102,102,0.76);
-moz-box-shadow: 0 0 4px  rgba(102,102,102,0.76);
box-shadow: 0 0 4px  rgba(102,102,102,0.76);
}
#opt_overlap.hide_pnl{ height:40px;}
#opt_onoffBtn{ height:25px; width:60px; position:absolute; top:-35px; left:50%; font-size:14px; margin-left:-30px; background:rgba(0,0,0,0.7); border:0; border-radius: 10px 10px 0 0;}
#opt_onoffBtn .fa-arrow-up{ display:none}
#opt_onoffBtn .fa-arrow-down{ display:block}
#opt_overlap.hide_pnl #opt_onoffBtn .fa-arrow-up{ display:block}
#opt_overlap.hide_pnl #opt_onoffBtn .fa-arrow-down{ display:none}

#opt_cnt{   margin:5px 0 0 0;}
.form_stp{ color:#fff;}
.form_stp input,
.form_stp select{ color:#444;}
.form_stp  textarea.form-control{ height:110px; font-size:18px;}
*/


#opt_cnt .form-group{ margin-bottom:5px}
#opt_cnt .tab-pane{ overflow:auto;height:300px; margin:5px 0 0 0;}
#myTab{} 
#myTab li{ margin-right:20px;}
#myTab .nav-link{ color:#fff; padding:5px 10px 5px 10px; font-size:16px;}
#myTab .nav-link.active{ color:#444;  background-color: #fff;  }
 
#myModal .modal-content{   background:rgba(0,0,0,0.2)}
#myModal  .modal-title{ color:#fff; text-align:center}
#myModal  .close{ color:#fff; opacity:1; }
 #prvCard_cnt{} 
 
 #prv_onoffBtn{ height:60px; width:25px; position:absolute; color:#fff !important; border:2px solid #ccc; border-right:0; right:0; top:30%; font-size:14px;  background:rgba(0,0,0,0.8); border-radius: 10px  0 0 10px;}
#prv_onoffBtn .fa-arrow-left{ display:none}
#prv_onoffBtn .fa-arrow-right{ display:block}
 
#prvCard_cnt.hide_pnl #prv_onoffBtn .fa-arrow-left{ display:block}
#prvCard_cnt.hide_pnl #prv_onoffBtn .fa-arrow-right{ display:none}
	
	#prvCard_cnt .col-lg-9{  border-right:0 solid #ccc;  }
	#prvCard_cnt .col-lg-3{ /*padding:10px 10px 10px 10px;*/ padding:0;  overflow:hidden}

#prvCard_cnt.hide_pnl{flex-wrap: nowrap;}
#prvCard_cnt.hide_pnl .col-lg-9{ max-width:100%;flex:0 0 100%; padding:0; width:100% !important;}
#prvCard_cnt.hide_pnl .col-lg-3{ padding:00; visibility:hidden; flex:0;width:1% !important;  }

#XmyTab{ position:absolute; top:30%; left:0; width:90px;  border:2px solid #ccc; border-left:0; }
#XmyTab li{ width:90px}
#XmyTab li a{ width:90px; border-radius: 0; font-size:12px; text-align:center; white-space: nowrap; line-height:60px; display:block; text-align:center; padding:0; border:0;  background:rgba(255,255,255,0.6); color:#444; font-weight:bold;}
#XmyTab li a.active{ background:rgba(0,0,0,0.8); color:#fff; font-weight:bold;} 


.esgn_cnt{  /*display:flex;
flex-wrap: nowrap; align-items: flex-start;
 justify-content: flex-start; width: calc(100% - 10px);   position:relative; margin:0 -10px 0 5px;*/}
 
 
.esgn_cnt .esgn_item{ width:auto;/* padding:5px 5px 5px 5px; border:2px solid rgba(0,0,0,0); border-radius: 10px; */overflow:hidden;
display:flex;
flex-wrap:   wrap; align-items: center;
 justify-content: flex-start; margin:0 0 15px 0;
 }
.esgn_cnt .esgn_item p{ width:100%; display:block}
.esgn_cnt .esgn_item.active{  /* border:2px solid #fff;*/ }
.esgn_cnt .esgn_item_sp{ width:10%; height:100%; padding:0 10px 0 10px;
 display:flex;
flex-wrap: nowrap; align-items: center;
 justify-content: center; position:absolute; top:0; right:0;
}
 
.esgn_cnt .esgn_item .imgitem{ border:1px solid #ccc; width:140px; margin:0 8px 0 8px; height:90px; background-color:#eee;}
.esgn_cnt .row{ width:100%; padding:0; margin:0 auto;}
.incol{ padding:0;}
.esgn_cnt button{ font-size:12px;}

.esgn_cnt .esgn_item .esgn_select{ height:90px; line-height:90px; background:#fff; border-color:#444; color:#039}
.esgn_cnt .esgn_item.active .esgn_select.btn-success{ background:#fff; border-color:#444; color:#039}
.esgn_cnt .esgn_item.active .esgn_select.btn-success b{ display:none} 
.esgn_cnt .esgn_item.active .esgn_select.btn-success i{ display:block; width:30px; text-align:center} 

.esgn_cnt .esgn_item .esgn_select.btn-success b{ display:none} 
.esgn_cnt .esgn_item .esgn_select.btn-success i{ display: none} 

.esgn_cnt .esg_btn{ width:90px; height: auto;}
.esgn_cnt .esg_btn .btn-sm    { border:0; border-radius: 0; margin:3px; height:40px; width:60px; text-align:center}


.esgn_cnt  .esg_btn_bk{ display:flex;
flex-wrap: nowrap; align-items: flex-start;
 justify-content:flex-start; width:100%;}

.esgn_cnt .esgn_item .esgn_select.btn-sm,
.esgn_cnt .esgn_item .esgn_select{ height:30px; line-height:20px; padding:0; width:30px; margin-top:10px; border:1px solid #444;   text-align:center}
 
  .form-row > .col,
  .form-row > [class*="col-"],
.esgn_cnt .form-row .form-group{ padding-left:0 !important; padding-right:0 !important;}

.part_tt{ display:block; border-bottom:1px solid #444; margin:0 0 10px 0; font-size:20px; font-weight:bold; padding:10px 0 10px 0;}

#preview_side{  background:#fff;}
/*-------- -------------------------------------------------------------------------*/



#slider1{/* height:calc(100vh - 140px);*/ height:auto; padding:10px 0 0 0 !important; width:100%; overflow: hidden;}

   
#slider1  li.gh{
display:flex;
flex-wrap: nowrap; padding:0;position:relative; 
 justify-content: center;align-items:center; /*height: 100%;*/ height:auto; width: 100%;    
} 
#slider1  li.gh .innitem{  position:relative; /* height:100%;*/ height:auto !important;   width: auto;

display:flex;
flex-wrap: nowrap; padding:0;position:relative; 
 justify-content: center;align-items:flex-start;
}


#slider1  li.gh .card_self{ border:0 solid #0057a6; max-height:100%;  
 
 display:inline-block}
#slider1  li.gh .card_tt{ position:absolute;display:inline-block; left:-120px; top:30%; font-size:32px; font-weight:bold; background:#000; padding:5px 15px 5px 15px;}


#slider1  li.gh .img-spsp{
	display:inline-block; float:none;
width:auto;
 /*height: 100%; */
}

#slider1  li.gh .card_self,
#slider1   .scard_p {/* height:100%;*/ height:auto !important; margin-top:50px; position:relative}
#slider1   .scard_p { margin-right:15px; margin-left:15px;}

#slider1  .ttp  { /*position:absolute; left:0; top:-50px; */height:50px; line-height:22px; width:100%; display:block; font-weight:bold; font-size:18px;}


 .dtk_gap{ display:block; height:10%; margin:0}




.rslides_tabs { /*position: absolute; left:0; bottom: 20px; */ 
  position:relative !important;
  
  width:50%; z-index:4000; height:72px; margin:30px 0 0 0;
   

 }
 
  /* .rslides_tabs li{ margin:0; padding:0; list-style:none;}*/
.rslides_tabs li{ margin:0; padding:0; list-style:none; width:100%;  
  display:flex;
flex-wrap:  wrap; padding:0;
 justify-content: flex-end;align-items:center;  overflow:hidden;

   }
   .rslides_tabs li::after{ content:" "; height:1px;width:1000%; overflow:hidden;
   display:block;}
.rslides_tabs li a{ 
 width:364px;  
font-size:18px;     white-space: nowrap; border:0px solid #f0f; text-align:right; display: block; height:36px; line-height:36px; 
margin:0 110px 0 0; color:#222; 
   }
   .rslides_tabs li  b{ cursor:pointer; margin: 0 10px 0 10px; text-indent:-999em;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
background:#fff; display:inline-block;

 -webkit-box-shadow: 0 4px 4px 2px rgba(0,0,0,0.16);
-moz-box-shadow:  0 4px 4px 2px  rgba(0,0,0,0.16);
box-shadow:  0 4px 4px 2px  rgba(0,0,0,0.16); border:2px solid #fff;

border:0;
font-size:5px; line-height:5px; overflow:hidden; cursor:pointer; 
	padding:0; width:15px; height:15px; }
	
  .rslides_tabs li.rslides_here a b{ border:2px solid #fff; background:#0057a6;}
   /*
   .rslides_tabs li  a{ cursor:pointer; margin: 0 10px 0 10px; text-indent:-999em;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
background:#fff; display:inline-block;

 -webkit-box-shadow: 0 4px 4px 2px rgba(0,0,0,0.16);
-moz-box-shadow:  0 4px 4px 2px  rgba(0,0,0,0.16);
box-shadow:  0 4px 4px 2px  rgba(0,0,0,0.16); border:2px solid #fff;

border:0;
font-size:5px; line-height:5px; overflow:hidden; cursor:pointer; 
	padding:0; width:15px; height:15px; }
	
  .rslides_tabs li.rslides_here a{ border:2px solid #fff; background:#0057a6;}
  */



/*---------------------------------------------------------------------------------*/


/*---------------------------------------------------------------------------------*/
#accordionSide{ min-height:100%; height:auto; overflow:auto; background:#fff;}

#accordionSide .card{border-radius:0; border:0; border-bottom:1px solid #ccc; padding:0;}
#accordionSide .card-header{  padding:0; background:0; border:0;}
#accordionSide .btn.btn-link{ border-radius:0; border:0; padding:10px 15px 10px 15px; font-size:14px; font-weight:bold;}
#accordionSide .btn.btn-link:hover{ text-decoration:none;}

#accordionSide .btn.btn-link.collapsed{ background:#fff; color:#666}
#accordionSide .btn.btn-link{  text-decoration:none;background:#0057a6; color:#fff;}


/*---------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------*/


#record_cnt{ height:calc(100vh - 120px); margin-top:15px;  }
#record_cnf_cnt{ height:auto; max-height:calc(80vh - 120px); overflow:auto; }
#record_table{
  position: relative;
  border-collapse: collapse; 
}
#record_table_inner{ position:relative;  background:rgba(255,255,255,0.9);  max-height:calc(80vh - 120px); overflow:auto;}
#record_thead{ position: absolute; left:0; top:0; }
#record_table th {
  background: white;
  position: sticky;
  top: 0; /* Don't forget this, required for the stickiness */
  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}
#search_cnt{ position:absolute;  top:-40px; left:0; width:100%;  padding:0 0 10px 0;}
 
#search_cnt  .form-control::placeholder{  color:#666;}
#search_cnt .form-control{transition:none; color:#444; border-radius:0; background:0; border:0; border-bottom:2px solid #444; color:#444; font-size:16px; font-weight:bold}
#search_cnt .form-control:focus {
    box-shadow: none; -webkit-box-shadow: none;
} 


 .sort_th{ cursor:pointer}
 .sort_th .fa-sort{ display:inline-block}
 .sort_th .fa-sort-asc{ display:none}
 .sort_th .fa-sort-desc{ display:none}
 
 .sort_th.tablesort-asc .fa-sort{ display:none}
 .sort_th.tablesort-asc .fa-sort-asc{ display:inline-block}
 .sort_th.tablesort-asc .fa-sort-desc{ display:none}

 .sort_th.tablesort-desc .fa-sort{ display:none}
 .sort_th.tablesort-desc .fa-sort-asc{ display:none}
 .sort_th.tablesort-desc .fa-sort-desc{ display:inline-block}
 
 
 #myModal.record .modal-content{ background:#fff;}
 #myModal.record .modal-title{ color:#222; padding:10px}
 #myModal.record .close{ color:#222; opacity:1}
 
 #scc_msg{ width:200px; margin-left:-100px; color:#005aab; font-weight:bold; font-size:18px; text-align:center; position:absolute; left:50%; top:96px;}
#close_ovbtn{ padding:3px 5px 3px 5px; border:1px solid #fff; background:#444; color:#fff; border-radius: 5px; font-size:12px;
position: absolute; left:-100px; top:10px; width:96px;  }
.scard_p{ width: auto;}
.myalert{border-radius: 0 !important; border:0;}
#pside_ax{ z-index:40000; position:absolute; top:0; right:0; width:100%; height:100%;  }
#pside_ax_cnt{ z-index:50000; position:absolute; top:0; right:0; width:calc(100% - 100px); height:100%; background:#fff;}


.cbox_cnt{
display:flex;
flex-wrap: nowrap; align-items: flex-start; width:100%; max-width:500px;
 justify-content: flex-start; background:#fff; border:1px solid #005aab; border-radius: 5px; padding:10px 10px 10px 10px;
 }
.cbox_cnt.active{ background:#005aab;  }
.cbox_cnt.active p{ color:#fff;}
.cbox_cnt  input{ position:absolute; right:0; top:0; visibility:hidden}
.cbox_cnt .cbox{ height: 20px; position:relative;
line-height: 20px;
padding: 0;
width: 20px;
margin: 0 5px 0 0; background:#fff;
border: 1px solid #444; text-align:center }
.cbox_cnt .cbox .fa{ display: none; line-height:17px;  }
.cbox_cnt.active .cbox .fa{ display:block;  }



.cbox_cnt p{ display:inline-block; line-height:20px; margin:0; padding:0 0 0 0;}
/*---------------------------------------------------------------------------------*/