.gothic{
  font-family: 'Nanum Gothic'; 
}
.mjo{
  font-family: 'MaruBuri'; 
}
html, body {
  font-family: 'MaruBuri', serif; 
  font-size: 1.0rem;
  background-size: auto;
  -moz-transform: scale(1.0, 1.0);
  zoom: 1.0;
  zoom: 100%;
  text-decoration: none;
  }
  
.border-right-2 {border-right:2px solid #ddd !important; }
.border-left-2 {border-left:2px solid #ddd !important;}
.border-top-2 {border-top:2px solid #ddd !important;}
.border-bottom-2 {border-bottom:2px solid #ddd !important;}

.border-right-1 {border-right:1px solid #ddd !important; }
.border-left-1 {border-left:1px solid #ddd !important;}
.border-top-1 {border-top:1px solid #ddd !important;}
.border-bottom-1 {border-bottom:1px solid #ddd !important;}

/* 다크 테마용 테두리 클래스 */
.border-right-2-dark {border-right:2px solid #444 !important; }
.border-left-2-dark {border-left:2px solid #444 !important;}
.border-top-2-dark {border-top:2px solid #444 !important;}
.border-bottom-2-dark {border-bottom:2px solid #444 !important;}

.border-right-1-dark {border-right:1px solid #555 !important; }
.border-left-1-dark {border-left:1px solid #555 !important;}
.border-top-1-dark {border-top:1px solid #555 !important;}
.border-bottom-1-dark {border-bottom:1px solid #555 !important;}

/* 다크 테마용 일반 테두리 */
.border-dark {border:1px solid #555 !important;}
.border-2-dark {border:2px solid #444 !important;}

  .bg-dark-blue {
    background-color: #07283f !important;
  }
  
  .secondary-opt-0{
    --fa-secondary-opacity: 0
  }
  .primary-opt-0{
    --fa-primary-opacity: 1;
  }
  
  .bg-top{
    background-color: #134366;  
  }
  .bg-second{
    background-color: #2073ad;;  
  }
  .color-top{
    background-color: #134366;  
  }
  .color-top-text{
    color: #4f7692 !important; 
  }
  .color-second{
    background-color: #2073ad;;  
  }
  .color-second-text{
    color: #2073ad;;  
  }
  .color-third{
    background-color: #2689cf;;  
  }
  .color-sub{
    background-color: #2995e2;;  
  }
  .bg-input-blue{
    background-color : rgb(243, 244, 247);
}
.text-blue{
  color: #b2d5ee !important;  
}
.text-blue-dark{
  color: #316e9a !important; 
}

.text-blue-light{
  color: #b3cadb !important;  
}
  nav.navbar {
    /* background-color: #2f333e; #2b90d9; */
    background-color: #134366;
  }
  .part-title-select{
    background-color: #2073ad;
    color:white;
    padding:10px;
    border-radius: 4px 0 0 0;
  }
  .title-border-radius{
    border-radius: 20px 0 0 0;
  }
  .title-border-radius-10px{
    border-radius: 10px 0 0 0;
  }
  .live-dark {
    color: #e6e6e6 ;
    background-color: #034a63;
  }    
   .live-btn-outline-info {
    color:  #e6e6e6;
    background-color: #045A70;
    border: none; 
 }
     .live-btn-outline-info:hover, .live-btn-outline-info:hover  {
    color:  #ffffff;
    background-color: #045A70;
    border:  none; 
 }
 .line1 {
   border : 1px solid gray;
 }
 .line-orange {
  border : 1px solid orange;
  border-radius: 4px;
}
.line-gray {
  border : 1px solid #ddd;
  border-radius: 2px;
}
.line-blue {
  border : 1px solid dodgerblue;
  border-radius: 4px;
}
.line-lightblue {
  border : 1px solid rgb(172, 205, 238);
  border-radius: 4px;
}
.line-ghostwhite {
  border : 1px solid ghostwhite;
  border-radius: 4px;
}
 .line-none {
  border : none;
}
.item-1 {
  flex-grow: 0;
  padding: 2px;
  text-align:center;
  margin: 8px;
  }
.item-2 {
flex-grow: 0;
text-align:left;
width:124px;
margin: 2px;
}
.input-class1 {
  padding-left:10px;
  font-size:0.8em;
  }
.text-ivory{
  color:ivory;
}  
.text-left{ text-align:left;padding-left:4px; }
.text-center{ text-align:center; }
.text-right{ text-align:right; padding-right:4px; }
.item-01 {
align-content: center;

}
.item-02 {
flex-grow: 0;
width: 70px;
padding: 1px;
background-color: #f2f2f2;
   border: 1px solid #cccccc;
display: table-cell;
text-align:center;
  color: #044a61 ;

}
.item-03 {
flex-grow: 0;
width: 80px;
padding: 1px;
background-color: #f2f2f2;
display: table-cell;
border: 1px solid #cccccc;
text-align:center;
   color: #044a61 ;

}

.form_css:hover {
background-color: white;
border: none;
}
.form_css {
background-color: #f2f2f2;
text-align: center;	
width: 100%;
height: 35px;
border: none;	
padding-left: 4px;
}
.switch {
  position: relative;
  display: inline-block;
  top: 2px;
  width: 50px;
  height: 28px;
  border:none;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 4px;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
 
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  top: 4px;
  left: 4px;
  bottom:4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
.check_container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 0px;
    cursor: pointer;
  
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.check_container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #eee;
}

/* On mouse-over, add a grey background color */
.check_container:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.check_container input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.check_container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.check_container .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.checks {position: relative;} .checks input[type="checkbox"]{
position: absolute;
width: 1px;
height: 1px; 
padding: 0;
margin: -1px;
overflow: hidden; 
clip:rect(0,0,0,0); border: 0 } 
.checks input[type="checkbox"] + label {
display: inline-block;
position: relative; 
cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; 
} 

.checks input[type="checkbox"] + label:before {
content: ' '; display: inline-block; width: 21px;  
height: 21px; 
line-height: 21px;
margin: -2px 8px 0 0; 
text-align: center; 
vertical-align: middle; background-color: #fafafa; border: 1px solid #cacece; border-radius : 3px; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05); } 
.checks input[type="checkbox"] + label:active:before, .checks input[type="checkbox"]:checked + label:active:before { box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1); } .checks input[type="checkbox"]:checked + label:before { /* üũ�ڽ��� üũ������ */ content: '\2714'; /* üũǥ�� �����ڵ� ��� */ color: #99a1a7; text-shadow: 1px 1px #fff; background-color: #e9ecee; border-color: #adb8c0; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
}
.chat-box{
         display: flex;
        flex-direction: column;
        justify-content: flex-end;
 }   
.pointer{
  cursor:pointer;
}  
.default{
  cursor:default;
}  
.no-pointer{
  cursor:default;
}    
.cursor-default{ cursor:default;}
.cursor-pointer{ cursor:pointer;}
.cursor-text{ cursor:text;}
.cursor-auto{ cursor:auto;}
.no-border{
border:none;

}
.wd35{
  width:35px;
}
/* flex_container --------------------------------------------------*/



.kas-text{
  color: teal
}
.kas-down-icon{
  font-size:1.2em;
  color: #c6d4d4
}
.kas-icon1{
  font-size:1.2em;
  color: #75b8b8
}
.kas-icon-color{
  color: #b9cfcf
}
.title-icon-color{
  color:OrangeRed
}
.text-circle-25{
  width:25px;
  height:25px;
  background-color:#017c7c;
  border-radius:50%;
  text-align:center;
  color: white;
  font-weight:600px;
  font-size: 13px;
  cursor:pointer;
  display: table-cell;
    vertical-align: middle;
}

.sm-title {
  padding:1px ;
  width:20px;
  text-align: center;
  flex-grow: 0;
  border-radius: 3px;
  font-size: 0.8em;
  border:1px solid #eee;
}
.xs-title-left {
  margin-bottom: 2px;
  width:40px;
  padding:4px ;
  background-color:rgb(98, 189, 189);
  color: white;
  font-size: 12px;
  text-align: center;
  flex-grow: 0;
  border-radius: 4px 0 0 4px ;
  border: 1px solid #e6e6e6;
  border-right: none;
}
.xs-title-middle {
  margin-left: 1px;
  margin-bottom: 2px;
  padding:4px;
  background-color:rgb(98, 189, 189);
  color: white;
  font-size: 12px;
  text-align: center;
  flex-grow: 0;
  border: 1px solid #e6e6e6;
  border-left: none;
  border-right: none;
}
.xs-title-right {
  margin-left: 1px;
  margin-bottom: 2px;
  padding:4px;
  background-color:rgb(98, 189, 189);
  color: white;
  font-size: 12px;
  text-align: center;
  flex-grow: 0;
  border-radius: 0 4px 4px 0 ;
  border: 1px solid #e6e6e6;
  border-left: none;
}
.xs-title {
  margin: 2px;
  width:40px;
  padding:2px;
  border-radius: 3px;
  background-color:Gray;
  color: white;
  font-size: 10px;
  text-align: center;
  flex-grow: 0;
}
.xs-day {
  padding:2px;
  border-radius: 3px;
  
  color: #ccc;
  font-size: 11px;
  text-align: center;
  margin-left: 2px;
  margin-right: 2px;
}
.xs1 {
  padding:2px;
  border-radius: 3px;
  background-color:rgb(190, 195, 195);
  color: white;
  font-size: 11px;
  text-align: center;
  margin-left: 2px;
  margin-right: 2px;
}
.xs2 {
  padding:2px;
  padding-left:4px;
  padding-right:4px;
  border-radius: 3px;
  border:1px solid #bbb;
  color: #ccc;
  font-size: 11px;
  text-align: center;
  margin-left: 2px;
  margin-right: 2px;
}
.xs {
  width: 15px;
  border-radius: 3px;
  background-color:LightGray;
  color: white;
  font-size: 10px;
  text-align: center;
}
.text-circle-white{
  width:15px;
  height:15px;
  background-color:RoyalBlue;
  border-radius:50%;
  text-align:center;
  color:white;
  font-size: 7px;
  margin-left:2px;
}
.circle {
  width:15px;
  border-radius:50%;
  text-align:center;
  font-size: 7px;
  margin-left:4px;
  margin-right:2px;
}

.text-circle{
  
  background-color:ghostwhite;
  border-radius:4px;
  text-align:center;
  color:teal;
  cursor:pointer;
  padding:0px 4px 0px 4px;
  margin: 2px;
}
.text-sm-box{
  
  background-color:LightSeaGreen;
  border-radius:4px;
  text-align:center;
  color:rgb(253, 253, 253);
  cursor:pointer;
  padding:2px 4px 2px 4px;

}
.text-royalblue {
  color: RoyalBlue;
}
.text-circle-blue{
  background-color:rgb(3, 187, 243);
  border-radius:4px;
  text-align:center;
  color:white;
  padding:0px 4px 0px 4px;
  margin: 2px;
  cursor:pointer;
 
}
.text-circle-teal{

  background-color:#059090;
  border-radius:4px;
  text-align:center;
  color:white;
  padding:0px 4px 0px 4px;
  margin: 2px;
}
.text-circle-silver{
  background-color:Silver;
  border-radius:4px;
  text-align:center;
  color:white;
  cursor:pointer;
  padding:0px 4px 0px 4px;
  margin: 2px;
}
.text-circle-gray{

  background-color:gray;
  border-radius:4px;
  text-align:center;
  color:white;
  cursor:pointer;
  padding:0px 4px 0px 4px;
  margin: 2px;
}
.text-circle-red{
  background-color:Crimson;
  border-radius:4px;
  text-align:center;
  color:white;
  cursor:pointer;
  padding:0px 4px 0px 4px;
  margin: 2px;
}

.text-circle-yellow{
  background-color:rgb(255, 187, 0);
  border-radius:4px;
  text-align:center;
  color:black;
  cursor:pointer;
  padding:0px 4px 0px 4px;
  margin: 2px;
}
.name-circle{
  cursor: pointer;
  font-size:0.8em;
  font-weight: 500;

  width:40px;
  height:40px;
  background-color:#d6fdfd;
  color:black;
  display:table-cell;
  text-align:center;
  vertical-align:middle
}
.icon-kcas{
  font-weight: 650;
  font-size: 15px;
  color: white ;
  border-radius:4px; 
  min-width:30px;
  padding: 2px 4px 2px 4px;
  background-color: rgb(39, 200, 200);
}
.text-icon{
  padding:2px;
  text-align:center;
  border-radius:3px;
  font-size:0.9em;
  min-width:35px;
  max-width:45px;
  background-color:white;
  color:DarkSlateGray;
  margin-right:4px

}
.font-xssss  {font-size:0.2rem !important;}
.font-xsss  {font-size:0.4rem !important;}
.font-xss  {font-size:0.6rem !important;}
.font-xs  {font-size:0.8rem !important;}
.font-sm  {font-size:0.9rem !important;}
.font-nm {font-size:1rem !important;}
.font-lg {font-size:1.2rem !important;}
.font-xl {font-size:1.6rem !important;}
.font-xll {font-size:1.8rem !important;}
.font-xlll {font-size:2.2rem !important;}

.fs-7 {
  font-family: 'Nanum Gothic', sans-serif;
  font-size:0.9em !important;}
.fs-8 {
  font-family: 'Nanum Gothic', sans-serif;
  font-size:0.8em !important;}
.fs-9 {
font-family: 'Nanum Gothic', sans-serif;
font-size:0.7em !important;}




.casformfront{
  background-color:DodgerBlue;color:white;padding:8px;border-radius: 4Px 0px 0px 4px  ;
}
.ORed{
  background-color:OrangeRed;
  color: white;
}
.DBlue{
  background-color:DodgerBlue;
  color: white;
}
.LGreen{
  background-color:LimeGreen;
  color: white;
  
}
.notcas{
  background-color:LightSkyBlue;
  color: white;
  
}
.casformBack{
  background-color:Gainsboro;
  color:white;
  padding:8px;
  border-radius:0 4px 4px 0px;
 
}
.casform1[type=number] {
  max-width: 100px;
  padding: 5px 10px;
  margin: 4px 0;
  box-sizing: border-box;
  border: 1px solid rgb(228, 228, 228);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: none;
  font-size: 1.2em;
}

.casform1[type=text]:focus {
  border: 1px solid rgb(183, 185, 185);
  font-size:1.3em;
}
.casform[type=text] {
  width: 100%;
  padding: 8px 10px;
  margin: 4px 0;
  box-sizing: border-box;
  border: 1px solid rgb(228, 228, 228);
  border-radius: 4px;;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: none;
}

.casform[type=text]:focus {
  border: 1px solid rgb(183, 185, 185);
}
.under_line{
  border-bottom:1px solid Gainsboro;
}
.btm_px1{
  border-bottom:1px solid Gainsboro;
}
.btm_px2{
  border-bottom:2px solid Gainsboro;
}
.top_px1{
  border-top:1px solid Gainsboro;
}
.top_px2{
  border-top:2px solid Gainsboro;
}
.display-none{
  display: none;
}
.star_color_main{
  color:DarkTurquoise;
}
.star_color_red{
  color:red;
}
.star_color_content{
  color:rgba(113, 218, 9, 0.431)
}

.width-P5{ width: 5%}
.width-P7{ width: 7%}
.width-P10{ width: 10%}

.width-10{ width: 10px}
.width-30{ width: 30px;}
.width-40{ width: 40px;}
.width-50{ width: 50px;}
.width-20{ width: 20px;}
.width-30{ width: 30px;}
.width-40{ width: 40px;}
.width-50{ width: 50px;}
.width-60{ width: 60px;}
.width-70{ width: 70px;}
.width-80{ width: 80px;}
.width-90{ width: 90px;}
.width-100{ width: 100px;}
.width-110{ width: 110px;}
.width-120{ width: 120px;}
.width-130{ width: 130px;}
.width-140{ width: 140px;}
.width-150{ width: 150px;}
.width-160{ width: 160px;}
.width-170{ width: 170px;}
.width-180{ width: 180px;}
.width-190{ width: 190px;}
.width-200{ width: 200px;}
.width-300{ width: 300px;}
.width-400{ width: 400px;}
.width-500{ width: 500px;}
.width-500{ width: 600px;}
.width-500{ width: 700px;}
.maxWidth-10{ max-width: 10px}
.maxWidth-30{ max-width: 30px;}
.maxWidth-40{ max-width: 40px;}
.maxWidth-50{ max-width: 50px;}
.maxWidth-20{ max-width: 20px;}
.maxWidth-30{ max-width: 30px;}
.maxWidth-40{ max-width: 40px;}
.maxWidth-50{ max-width: 50px;}
.maxWidth-60{ max-width: 60px;}
.maxWidth-70{ max-width: 70px;}
.maxWidth-80{ max-width: 80px;}
.maxWidth-90{ max-width: 90px;}
.maxWidth-100{ max-width: 100px;}
.maxWidth-110{ max-width: 110px;}
.maxWidth-120{ max-width: 120px;}
.maxWidth-130{ max-width: 130px;}
.maxWidth-140{ max-width: 140px;}
.maxWidth-150{ max-width: 150px;}
.maxWidth-160{ max-width: 160px;}
.maxWidth-170{ max-width: 170px;}
.maxWidth-180{ max-width: 180px;}
.maxWidth-190{ max-width: 190px;}
.maxWidth-200{ max-width: 200px;}
.maxWidth-300{ max-width: 300px !important;}
.maxWidth-400{ max-width: 400px;}
.maxWidth-500{ max-width: 500px;}
.maxWidth-600{ max-width: 600px;}
.minWidth-10{ min-width: 10px}
.minWidth-30{ min-width: 30px;}
.minWidth-40{ min-width: 40px;}
.minWidth-50{ min-width: 50px;}
.minWidth-20{ min-width: 20px;}
.minWidth-30{ min-width: 30px;}
.minWidth-40{ min-width: 40px;}
.minWidth-50{ min-width: 50px;}
.minWidth-60{ min-width: 60px;}
.minWidth-70{ min-width: 70px;}
.minWidth-80{ min-width: 80px;}
.minWidth-90{ min-width: 90px;}
.minWidth-100{ min-width: 100px;}
.minWidth-110{ min-width: 110px;}
.minWidth-120{ min-width: 120px;}
.minWidth-130{ min-width: 130px;}
.minWidth-140{ min-width: 140px;}
.minWidth-150{ min-width: 150px;}
.minWidth-160{ min-width: 160px;}
.minWidth-170{ min-width: 170px;}
.minWidth-180{ min-width: 180px;}
.minWidth-190{ min-width: 190px;}
.minWidth-200{ min-width: 200px;}

.w-10{ width: 10px}
.w-20{ width: 20px;}
.w-30{ width: 30px;}
.w-40{ width: 40px;}
.w-50{ width: 50px;}
.w-60{ width: 60px;}
.w-70{ width: 70px;}
.w-80{ width: 80px;}
.w-90{ width: 90px;}
.w-100{ width: 100px;}
.w-110{ width: 110px;}
.w-120{ width: 120px;}
.w-130{ width: 130px;}
.w-140{ width: 140px;}
.w-150{ width: 150px;}
.w-160{ width: 160px;}
.w-170{ width: 170px;}
.w-180{ width: 180px;}
.w-190{ width: 190px;}
.w-200{ width: 200px;}

.column{
  flex-direction: column;
}
.input_caption{
  margin-top:10px; 
  font-size:1em;
  padding-right:10px;
  color: SlateGray;
  display:none;
 }
.flex_column{
  display: flex;
  flex-direction: column;
  justify-content:  flex-start ;  /*수평*/
}

.flex_around{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:space-around; /* 수평 */
  align-items: center; /* 수직센터 */     
}
.flex_between{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;  /* justify-content: flex-start ;  justify-content: space-evenly */
  align-items: center; /* 수직 */     
}
.flex_space{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-evenly; 
  align-items: center; /* 수직 */     
}
.flex_right{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end; /* 수평 */
  align-items: center; /* 수직 */     
}
.flex_bottom{
  align-items: flex-end; /* 수직 */  
 }

.flex_left{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start; 
  align-items: center;
}
.nowrap{
  flex-wrap: nowrap;
}
.debugging-text{
  color:gray;
  font-size:0.8em;
  display:none;
}
.ghost {
  color: GhostWhite;
}
.Ivory {
  color: Ivory;
}
.Khaki{
  color:Khaki;
}
.space-1{
  margin-left: 1px ;
  margin-right: 1px ;
}
.space-2{
  margin-left: 2px ;
  margin-right: 2px ;
}
.space{
  margin-left: 4px ;
  margin-right: 4px ;
}
.right-0{
  margin-right: 0px ;
}
.left-0{
  margin-left: 0px ;
}
.p-lt-rt-4{padding-left: 4px ; padding-right: 4px}
.p-lt-rt-8{padding-left: 8px ; padding-right: 8px}
.space-6{  margin-left: 6px ;  margin-right: 6px ;}
.space-8{  margin-left: 8px ;  margin-right: 8px ;}
.space-10{  margin-left: 10px ;  margin-right: 10px ;}

.space-14{  margin-left: 14px ;  margin-right: 14px ;}
.space-18{  margin-left: 18px ;  margin-right: 18px ;}
.space-20{  margin-left: 20px ;  margin-right: 20px ;}
.space-30{  margin-left: 30px ;  margin-right: 30px ;}
.space-40{  margin-left: 40px ;  margin-right: 40px ;}
.space-50{  margin-left: 50px ;  margin-right: 50px ;}

.mleft-1 {  margin-left: 1px !important}
.mleft-2 {  margin-left: 2px !important}
.mleft-3 {  margin-left: 3px !important}
.mleft-4 {  margin-left: 4px !important}

.mright-1 {  margin-right: 1px !important}
.mright-2 {  margin-right: 2px !important}
.mright-3 {  margin-right: 3px !important}
.mright-4 {  margin-right: 4px !important}

.mtop-1 {  margin-top: 1px !important}
.mtop-2 {  margin-top: 2px !important}
.mtop-3 {  margin-top: 3px !important}
.mtop-4 {  margin-top: 4px !important}
.mbottom-1 {  margin-bottom: 1px !important}
.mbottom-2 {  margin-bottom: 2px !important}
.mbottom-3 {  margin-bottom: 3px !important}
.mbottom-4 {  margin-bottom: 4px !important}


.border-right-0 {border-right:none!important; }
.border-left-0 {border-left:none !important;}
.border-top-0 {border-top:none !important;}
.border-bottom-0 {border-bottom:none !important;}
.flex_center{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:center; 
  align-items: center; /* 수직센터 */
}
 .flex_container{
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
     /* justify-content: space-between;  justify-content: flex-start ;  justify-content: space-evenly */
      justify-content: center; 
      align-items: center; /* 수직센터 */
  
    }
   
  .flex_item_grow{
     flex-grow: 1;
     padding: 2px;
     align-items: center; /* 수직센터 */
     display: inline-block;    
     margin-right: 2px;
    }
     .flex_item_nogrow{
     flex-grow: 0;
     padding: 2px;
     align-items: center;
     display: inline-block;    
     margin-right: 2px;
    }
    .cas_item_1{
      flex-grow: 1;
      margin: 0 8px 0 8px ;
     }  
/*-----------------------------------*/
    .flex_container_onair_table {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      margin-left: 4px;
      /*  border: 1px solid green ; */
    /* justify-content: space-between;
      align-content: center;
      align-items: center;
    */
    }
      .flex_container_onair_table_item {
      max-width: 210px;   
       flex-direction: row;
      flex-wrap: wrap;
      /* border: 1px solid red;  */
       margin: 4px;
       padding: 4px;
       background-color: rgba( 255,255,240,0.4);
    /*   align-items: center; */
      }
    .onair_table_item_1{
       flex-grow: 0;
       padding: 2px;
      /* border: 1px solid blue ;  */
       align-items: center;
       display: inline-block;    
        margin-right: 2px;
        /* inline-size: 298px; */
      }
    .onair_table_item_2{
       flex-grow: 0;
       padding: 1px;
      /* border: 1px solid blue ; 
       align-items: left; */
       display:table-cell;
       margin-right: 0px;
       color: gray;  
        /* inline-size: 298px; */
      }
      .round11{
        border: 1px solid red;
        border-radius: 4px;
        padding: 4px;
        
      }
      
 .mouseOver-white:hover {  color:white; }  
/* salvion live -----------------------*/
   
 /*
.flex_container {
  display: flex; flex-direction: row;flex-wrap: wrap;justify-content: space-between;
  align-content: center;
  align-items: center;
  
}
*/
.flex_container1 {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: center;
  align-items: center;

}

.light {
color:  #ccc;  
background-color:Teal;
border: 1px solid #009999;
} 
.light:focus {
color:  #fff;  
background-color: #009999
} 
.light:hover {
  color:  #fff;  
background-color: #009999;
} 
  .light select:focus {
background-color: #009999;
} 
/* 교시 */
.flex_container_gusi { display: flex; flex-direction: column;  justify-content: space-between;  justify-content: center;  align-items: center; }
.popupMenu {
  cursor: pointer;
}
.popupLayer {
  display: none;
}

.popupLayer>.pop_item{
     cursor: default;
     margin: 4px;
     padding: 4px;
    border-bottom: solid 1px #ccc ;
} 
.popupLayer>.pop_item:hover {
    background-color: #fcfcfc; 
   color: #034a63;
 }

    /* Kcas */
    .year0, .year0:hover {
      cursor: default; 
      color: gray;
      background-color: rgba( 255,255,255,0.6);
      border: 1px solid #cccccc;

  }
   .year1 {
     background-color:  #0fafd7;;
     border: none;   
      color:white;
  }
   .year2 {
       background-color: #0D98BA;
       border: none;  
       color:white;
  }
   .year3 {
       background-color: #005666;
       border: none;
       color:white;
  }

  .end_class {
       background-color: rgba( 0,0,0,0.2);
       color: #fafafa;
       border: none
   }
  .padding0 {
    padding:0px;
  }
.loader {
   left: 50%;
  top: 50%;
  z-index: 1;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 40px;
  height: 40px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.form-control-size{
  background-color:white;
  color:silver;
  padding:9px;
  border:1px solid silver;
  border-radius:4px;
}
.r_padding{
  margin-top: 4px;
  align-items: center; /* 수직센터 */ 
  justify-content: center; /* 수평센터 */     
  margin-right: 4px;
 }



 .date-lock-icon{

  --fa-primary-color: rgb(85, 134, 168);
  --fa-primary-opacity: 0.8;
  --fa-secondary-color:rgb(85, 134, 168);
  --fa-secondary-opacity: 0.5;
 }
 .date-lock-icon-period{
  color:black;
  
 }
 .time-line-icon{
  --fa-primary-color: white;
  --fa-primary-opacity: 1;
  --fa-secondary-color:DodgerBlue;
  --fa-secondary-opacity: 1;
 }

 .cas-doc-time-line-all{
  color:white;
  background-color: rgb(71, 71, 71);
  margin:10px;
  margin-top:0px;
  border-radius:0 0 6px 6px;
  padding:15px;  
  font-size:1.2em;
  } 
  .kcas-chart-title{
    width:300px;
    border-bottom:1px solid #bbb;
    height:35px;
    border-right:1px solid Gainsboro;

    color:DarkSlateGrey;
  }
  .kcas-chart-title-bar-box{
    flex-grow: 1;
    border-bottom:1px solid #bbb;
    height:35px;
  
  }
  .GWhite{
    background-color: ghostwhite;
  }
  .time-line-rbd-color{
    border-right:1px solid #bbb;
    color:teal;
  }
 .cas-doc-content{
  margin-left:8px;
  margin-bottom:8px;
  padding:10px;
  border-radius:0 0 8px 8px;
  background-color: rgba(206, 207, 191, 0.05);
  border-bottom:1px solid rgba(119, 128, 0, 0.075);
  } 
  .pie-chart-action-time{
    height:300px;
    min-width:250px;
    max-width:350px;
    display:none;
  }
  .bar-chart-action-targeteds{
    height:300px;
    min-width:350px;
    display:none;
  }
 .섹선타이틀{
  font-size: initial ; 
  display:flex;
  flex-direction: column;
  /* background-color:#155c5c ; */
  border-radius: 5px 5px 0 0;
  opacity:1 ;
  padding: 20px 20px 0 20px ;
  min-height:90px;
  justify-content: center;  
 } 
 .actionWork-title{
  font-size: initial ; 
  display:flex;
  flex-direction: column;
  border-radius: 8px 0px 0 0;
  opacity:1 ;
  min-height:50px;
  justify-content: center; 
  /* margin: 1px 0 1px 4px ; 
  padding: 8px 8px 8px 14px; */
  
 } 
 .섹선메뉴-bg-none-gray{
  font-size: 0.9em ; 
  margin-top: 10px;
  margin-right:4px;
  padding: 1px;
  padding-left:8px;
  padding-right:8px;
  border-radius: 4px 4px 0 0;
  background-color:none;   
  color:WhiteSmoke;
  border:1px solid  WhiteSmoke;
  border-bottom:none;
 }
 

 .섹선메뉴-bg-none{
  font-size: 0.9em ; 
  margin-top: 10px;
  margin-right:4px;
  padding: 0px;
  padding-left:10px;
  padding-right:10px;
  border-radius: 4px 4px 0 0;
  border: none;
  color:white;
  background-color:none;
  }
 .섹선메뉴{
  background-color:#00b3b3;
  font-size: 0.9em ; 
  margin-top: 10px;
  margin-right:4px;
  padding: 2px;
  padding-left:10px;
  padding-right:10px;
  border-radius: 4px 4px 0 0;
  border: none;
  color:white;
 }
 .qtext-title{
   font-size:0.7em;
 }
 .qtext-title-제목{
  font-size:1em;
}
 .kcas-head-title{
  
  background-color: rgb(26, 97, 155);
  font-size:1.3em;
  color:white;
  padding:10px 10px 10px 10px;
  border:0px solid #c8d5d5;
  border-radius: 4px 0 0 4px;

 }
 .kcas-title{
  padding:8px;
  border-top:2px solid rgb(2, 155, 243);
  border-bottom:2px solid rgb(196, 222, 238);
  background-color:#f5f4f4;
  border-radius:0px ;
  font-size:1.2em;
  color:black;

 }
 .kcas-title-qtext{
  padding:0x;
  border-bottom:2px solid #ddd;
  border-radius:4px 0 0 4px;

 }
 .kcas-title-style{
  font-weight: 600; 
  font-size: 1.2em;
  color:rgb(92, 91, 91);
}
.time-name{
  width: 20px;
  height: 20px;
  border-radius: 50% ;
  text-align: center;
  font-size:0.8em;
}

 .kcas-chart-head{
  color:white;
  background-color: black;
  margin:10px;
  margin-bottom:0px;
  border-radius:4px 0 0 0;
  padding:8px;  
  padding-left:14px;  
  font-size:1.2em;
  } 
 .Common-Documents-title{
 padding:8px;
 background-color: teal;
 color:white;
 margin:4px;
 border-radius:2px 0px 0 2px;
 margin-right:0px;
 border-bottom:2px solid rgba(162, 175, 177, 0.459);;
 font-size:1.2em;
 } 
 .icon{
  color:LightSlateGrey;
 --fa-primary-color: LightBlue;
 --fa-primary-opacity: 1;
 --fa-secondary-color:LightSlateGrey;
 --fa-secondary-opacity: 1;
}

 .콘텐츠라인1{
  background-color:#eee;
  border-radius:4px 0 0 4px;
  color:gray;

 }
 .콘텐츠라인2{
  background-color:DarkSlateGrey;
  border-radius:6px 0 0 6px;
  color:White;

 }
 .콘텐츠라인3{
  background-color:#efefef;
  border-radius:6px 0 0 6px;
  color:gray;
}
.bg-blue2{
  background-color:rgba(79, 165, 251, 1);
  border:1px solid rgba(30, 143, 255);
 }
 .bg-blue{
  background-color:rgba(79, 165, 251, 0.644);
  border:1px solid rgba(30, 143, 255, 0.315);
 }
 .bg-blue-dark-1{
  background-color:rgba(41, 102, 162, 0.644);
  border:1px solid rgba(204, 206, 207, 0.315);
  
 }
 
 
 .bg-red{
  background-color:orangered;
  color:white;
 }
 .bg-gray-light{
  background-color:rgb(244, 246, 248) !important
 }
 .bg-gray{
  background-color:#ddd !important
 }
 .bg-gray8{
  background-color:#000
 }
 .bg-teal{
  background-color:teal
 }
 .onair-on{
  background-color:orangered;
  border:none;
}
 .onair-off{
  background-color:#ddd;
  border:none;
 }
.bg-blue-base{
  background-color:#F5FAFF;
  color:black !important;
}
.bg-blue-base1{
  background-color:#e3eef7;
  color:black;
}
.bg-blue-base2{
  background-color:#dbecfb;
  color:black !important;
}
.bg-blue-base0{
  background-color:#F6F9FA;
  color:black !important;
}
 .bg-text{
   background-color: rgb(251, 251, 246);
   color:black !important;
 }
 .코멘트라인{
  background-color:none;
  color:gray ;
 }

.input-text{
  padding:0.375rem 0.5rem;
  border:1px solid #ddd
}

 .내용 {
  padding:2px;
  padding-left:8px;
  border-radius:0px 0px 2px 4px;
  background-color: ivory;
 }
 .작성자1 {color:GhostWhite;}

 .user-light{
  color:rgb(239, 243, 245);
}
.user-dark{
  color:DarkSlateGrey;
}
.user-ripple{
  color:rgb(124, 145, 151);
  font-size:0.9em;
}
.no-hover{
  pointer-events: none;
}
.kas-select-div{

  margin:4px 4px;   
  
  padding:6px;
  border:1px solid rgb(219, 240, 239);
  border-radius:4px;
  background-color:white
}
.kas-help-back{
  padding:16px;
  background-color:white;
  border-radius:4px;
  border:1px solid #ccc;
}
.flex_container_ad {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
  .flex_container_ad_sub {
  flex-grow: 0;
  display: inline-block;}

.ad-item{
  max-width: 440px;
  min-width: 150px;
  flex-grow: 0;
  margin: 2px;
  padding: 0px;
  background-color: white;
 }
 .ad-item-content{
  padding: 8px;
  font-size: 0.9em;
 }
.file-list{
padding-top:8px;  
 max-width: 100px;
}
.kcas-미등록{
 font-size:1.2em;
 padding:20px;
 color:gray;
  }
  
.grow{ flex-grow:1;}
.grow1{ flex-grow:1;}
.grow2{ flex-grow:2;}
.grow3{ flex-grow:3;}
.grow-1{ flex-grow:1;}
.grow-2{ flex-grow:2;}
.grow-3{ flex-grow:3;}
.grow-4{ flex-grow:4;}
.grow-5{ flex-grow:5;}
.grow-6{ flex-grow:6;}
.grow-7{ flex-grow:7;}
.grow-8{ flex-grow:8;}
.grow-9{ flex-grow:9;}
.grow-10{ flex-grow:10;}
.nogrow{ flex-grow:0 !important;}
    
.student-content-title{
  font-size: 1em;
  font-weight: 500;
  
}
.student-content-box{
  padding:6px;
  border-radius: 4px;
  background-color: white;
  border-bottom:1px solid #ccc;
}
.student-content-research{
  font-size: 1em;
  font-weight: 600;
}
.teal{
  color:teal;
}
.RoyalBlue{
  color:RoyalBlue;
}
#student-list-table:hover tbody tr:hover td {
  background-color: rgb(248, 248, 246);
  border-bottom:1px solid dodgerblue;

}
#student-list-table:hover tbody tr:hover td {
  background-color: rgb(248, 248, 246);
  border-bottom:1px solid rgb(70, 119, 119);;
  
}
.student-list-table-data{
  font-size:1em  !important;;
  vertical-align: middle  !important;;
}
.ajaxLoader {
  border: 8px solid #f3f3f3;
  border-radius: 50%;
  border-top: 8px solid #3498db;
  width: 30px;
  height: 30px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.border{
  border:1px solid gray;
  padding:2px;
  border-radius: 4px;
}
.none-border{
  border:none !important;
}

.center{
  text-align: center;
}
.unline-gray{
  
  border-bottom:1px solid  gray!important;
}
.unline{
  
  border-bottom:1px solid  #eee !important;
}
.unline-2{
  border-bottom:2px solid  #eee !important;
}
.unline-ddd{
  border-bottom:1px solid  #ddd !important;
}
.unline-eee{
  border-bottom:1px solid  #ddd !important;
}
.unline-2{
  border-bottom:2px solid  #eee !important;
}
.unline-blue{
  
  border-bottom:1px solid  rgb(161, 196, 235) !important;
}
.unline-blue-2{
  border-bottom:2px solid  rgb(161, 196, 235) !important;
}
.unline-blue-light{
  border-bottom:1px solid  rgb(218, 233, 250) !important;
}
.unline-blue-light-2{
  border-bottom:2px solid  rgb(218, 233, 250) !important;
}
.line-blue-light{
  border:1px solid  rgb(218, 233, 250) !important;
}
.line-blue-light-2{
  border:2px solid  rgb(218, 233, 250) !important;
}
.line-ddd{
  border:1px solid  #dddddd !important;
}
.line-aaa{
  border:1px solid  #aaaaaa !important;
}
.unline-red{
  border-bottom:2px solid  red !important;
}
.textarea-1{
  height:100%;
  width:100%;
  padding:8px;
  border:1px solid blue;
}
.td {
  text-align:center;
  vertical-align:middle;
}
.gray-line  {
  border-bottom:1px solid
}
.btn-xs {
  
  font-family:  'Nanum Gothic';
  font-size: 0.85em !important;
  padding: 2px 5px !important;
  border-radius: 3px !important;
}
.btn-xss {
  
  font-family:  'Nanum Gothic';
  font-size: 0.7em !important;
  padding: 1px 2px !important;
  border-radius: 3px !important;
  margin-top: 1px !important;
  margin-bottom: 1px !important;
}

/* ==========================================================
*     LOGIN PAGE
* ==========================================================
*/
.logo-box {
  position: relative;
}

.logo-box::before {
  content: '';
  /* width: 100%;
  height: 100%; */
  display: block;
  z-index: -1;
  /* background-image: url('/image/bg2.gif'); */
  background-size: cover;
  -webkit-filter: blur(10px);
  filter: blur(10px);
  z-index: 1;
  position: absolute;
  top: 0;
  right: 0;
}
.logo-box .content{
  color:#a1d5f1;
}
.logo-box .container {
  /* min-height: 100vh; */
  z-index: 999;
  padding: 20px;
  position: relative;
}

.logo-box .form-holder {
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
  /* margin-bottom: 50px; */
}

.logo-box .form-holder .info, .logo-box .form-holder .form {
  min-height: 50vh;
  padding: 40px;
  height: 100%;
}

.logo-box .form-holder div[class*='col-'] {
  padding: 0;
}

.logo-box .form-holder .info {
  /* background-color: rgba(43, 144, 217, 0.9); */
  color: #fff;
}

.logo-box .form-holder .info h1 {
  font-size: 2.5em;
  font-weight: 600;
}

.logo-box .form-holder .info p {
  font-weight: 300;
}

.logo-box .form-holder .form .form-group {
  position: relative;
  margin-bottom: 30px;
}

.logo-box .form-holder .form .content {
  width: 100%;
}

.logo-box .form-holder .form form {
  width: 100%;
  max-width: 400px;
}

.logo-box .form-holder .form #login, .logo-box .form-holder .form #register {
  margin-bottom: 20px;
  cursor: pointer;
}

.logo-box .form-holder .form a.forgot-pass, .logo-box .form-holder .form a.signup {
  font-size: 0.9em;
  color: #85b4f2;
}

.logo-box .form-holder .form small {
  color: #aaa;
}

.logo-box .form-holder .form .terms-conditions label {
  cursor: pointer;
  color: #aaa;
  font-size: 0.9em;
}

.logo-box .copyrights {
  width: 100%;
  z-index: 9999;
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
}

@media (max-width: 991px) {
  .logo-box .info, .logo-box .form {
    min-height: auto !important;
  }
  .logo-box .info {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}
.card-close {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start; /* 수평 */
  align-items: center; /* 수직 */    
  /* position: absolute; */
  /* right: 15px; */
}

.btn-text {
  font-weight: 400;
  border: 1px solid transparent;
  padding: 0.45rem 0.75rem;
  font-size: 0.9rem;
  line-height: 1.5;
  border-radius: 4px;
  -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}
.btn-primary-text {
  
  color: white;
  background-color: #2b90d9;
  border-color: #2b90d9;
}
.btn-secondary-text {
  color: #fff;
  background-color: #868e96;
  border-color: #868e96;
}
.btn-success-text {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}
.btn-info-text {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}
.btn-warning-text {
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
}
.btn-danger-text {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}
.btn-light-text {
  color: #212529;
  background-color: #e9f0f6;
  border-color: #b6b7b7;
}

.btn-dark-text {
  color: #fff;
  background-color: #343a40;
  border-color: #343a40;
}
.btn-default-text {
  color: #212529;
  background-color: #ced4da;
  border-color: #ced4da;
}
.btn-outline-primary-text {
  color: DodgerBlue;
  background-color: transparent;
  background-image: none;
  border-color: DodgerBlue;
}
.btn-outline-secondary-text {
  color: #868e96;
  background-color: transparent;
  background-image: none;
  border-color: #868e96;
}
.btn-outline-success-text {
  color: #28a745;
  background-color: transparent;
  background-image: none;
  border-color: #28a745;
}
.btn-outline-info-text {
  color: #17a2b8;
  background-color: transparent;
  background-image: none;
  border-color: #17a2b8;
}
.btn-outline-warning-text {
  color: #ffc107;
  background-color: transparent;
  background-image: none;
  border-color: #ffc107;
}
.btn-outline-danger-text {
  color: #dc3545;
  background-color: transparent;
  background-image: none;
  border-color: #dc3545;
}
.btn-outline-light-text {
  color: #f8f9fa;
  background-color: transparent;
  background-image: none;
  border-color: #f8f9fa;
}
.btn-outline-dark-text {
  color: #343a40;
  background-color: transparent;
  background-image: none;
  border-color: #343a40;
}
.btn-outline-light:hover {
  color: dodgerblue;
  background-color: #f8f9fa;
  border-color: #f8f9fa;
}

table.table_gray {
  width:100%;
  background-color: rgb(243, 243, 243);
  border: 2 solid rgb(233, 232, 232);
  border-left: 0;
  border-right: 0;		
  border-collapse: collapse;
}
table.table_gray th {
  background-color:DarkSlateGrey;
  text-align: center;
  font-weight: 500;
  font-family:"맑은 고딕";
  font-size:1.1em;	
   color:  white;
  vertical-align: middle;
  border: 1px solid #ccc;
  border-top: 2px solid #ddd;  
  border-bottom: 2px solid #ddd;  
  height:45px;

}

table.table_gray td {
  border: 1px solid #ddd;
  height: 40px;	
  padding: 1 1 1 1;
  vertical-align:middle;
  font-family:'맑은 고딕';
  text-align: center;
  font-size:1em;

}
table.table_gray .even {
  background-color: rgb(245, 245, 245);
}
.table_none {
  width:100%;
  border: none;
  border-collapse: collapse;
  border:1px solid red; 
}

.table_none td {
  border: none;
  padding: 2px;
  vertical-align:middle;   
  border:1px solid red;

}
.table.type01 {
    width:100%;
    font-family:'맑은 고딕';
    border-collapse: collapse;
    text-align: center;
    line-height: 1.5;
    border: 1px solid #0593c7;
    border-top: 3px solid #0593c7;
    border-bottom: 3px solid #0593c7;
    margin: 0px 0px;
}
table.type01 th {
    height: 30px;
    background-color: ghostwhite;
    text-align: center;
    font-family:'맑은 고딕';
    font-size:1em;		
    color:  #034a63;
    vertical-align: middle;
    border: 1px solid #ccc;
    border-bottom: 2px solid silver;
}

table.type01 td {
  text-align: center;
    height: 20px;
   font-family:'맑은 고딕';
   font-size:0.9em;		
   padding: 2px;
    color: #666666;
  vertical-align: middle;
   border: 1px solid #ccc;
}
table.type01 .even {
    background-color: rgb(175, 175, 175);
}

table.sub_table {
    width: 100%;
    vertical-align:middle;
    border: none;
    border-collapse: collapse;
    
    
  }
  table.sub_table td {
    border: none;
    padding :4px;
    vertical-align:middle;
    font-family:'맑은 고딕';
    
  }
table.type02 {
    width:100%;
    font-family:"맑은 고딕";
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    border: none;
    margin: 0px 0px;
    table-layout: fixed;
    font-size:1em;	
   background-color:white;
}
table.type02 th {
  background-color:DarkSlateGrey;
  text-align: center;
  font-weight: 600;
  font-family:"맑은 고딕";
  font-size:1em;	
   color:  white;
  vertical-align: middle;
  border: 1px solid #ccc;
  border-top: 2px solid #ddd;  
  border-bottom: 2px solid #ddd;  
  height:45px;

}
table.type02 td {
	font-family:"맑은 고딕";
   font-size:1em;	
   padding: 4px;
   color: gray;
   vertical-align:middle;
  border: 1px solid #ccc;
  }

table.no-border {
  width:100%;
  font-family:"맑은 고딕";
  border-collapse: collapse;
  text-align: left;
  line-height: 1.5;
  border: none;
  margin: 0px 0px;
  table-layout: fixed;
  font-size:1em;	
 background-color:white;
}
table.no-border tr {
   vertical-align:middle;
    border:none !important;
    /* border-bottom: 1px solid gray !important; */
  }
.bottom-line{
  border-bottom: 1px solid #bbb !important; 
}  
.bottom-gray{
  border-bottom: 1px solid gray !important; 
} 
.bottom-royalblue{
  border-bottom: 1px solid royalblue !important; 
} 
.bottom-royalblue-2{border-bottom: 2px solid royalblue !important;}
.bottom-royalblue-4{border-bottom: 4px solid royalblue !important;}  
.margin-2{margin:2px;}
.margin-3{margin:3px;}
.margin-4{margin:4px;}
.margin-8{margin:8px;}
.padding-2{padding:2px;}
.padding-3{padding:3px;}
.padding-4{padding:4px;}
.padding-8{padding:8px;}
.box-line{
  border:1px solid #ccc;
  border-radius: 4px;

  
}
table.no-border th {
  background-color:DarkSlateGrey;
  text-align: center;
  font-weight: 600;
  font-family:"맑은 고딕";
  font-size:1em;	
   color:  white;
  vertical-align: middle;
  border-top: 2px solid #ddd;  
  border-bottom: 2px solid #ddd;  
  height:45px;

}
table.no-border td {
font-family:"맑은 고딕";
 font-size:1em;	
 padding: 4px;
 color: gray;
 vertical-align:middle;
  border:none !important;
}
.bubble
{
    
    /* float:right; */
 
    margin-left:11px;
    background-color: #fff;
    -webkit-border-radius: 2px;
    -webkit-box-shadow: 0px 0px 2px #b2b2b2;
    position:relative;
    z-index:1;
}

.bubble-triangle
{
   position:absolute;

   width: 0;
   height: 0;
   border-top: 15px solid transparent;
   border-bottom: 15px solid transparent;
   border-right: 10px solid #f2f2f2;
   margin-left:-10px;
   z-index:2;
}
.bubble-content{padding:4px}
a {
  
  text-decoration: none;
  cursor: pointer;
}

.fc-toolbar-chunk{
  padding-left:20px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start; 
  align-items: center;
}

.fc-prev-button{
 padding:20px; 
}


.bg-ivory {
  background-color: ivory !important;
}

/* 추가 */
input.sisutime {
  border: none;
  border-bottom: 1px solid rgb(221, 245, 221) ;
  padding-bottom: 0px;
  padding-top: 0px;
  }

input.form-control, select.form-control {
  border-radius: 2px;   
  border: none;
  border-bottom: 1px solid #ddd ;
  padding-bottom: 0px;
  padding-top: 0px;

}
.form-control-white {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: white;
  background-color: #fff;
  background-clip: padding-box;
  border-bottom: 1px solid #ced4da;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border:none;
  /* border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; */
}
input.form-control-white, select.form-control-white {
  border-radius: 2px;   
  border: none;
  color:white;
  border-bottom: 1px solid #ddd ;
  padding-bottom: 0px;
  padding-top: 0px;
}

.form-control-white:focus {
  color: gray;
  /* background-color: #fff; */
  /* border-color: #86b7fe; */
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.form-select-white {
  display: block;

  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  -moz-padding-start: calc(0.75rem - 3px);
  
  font-weight: 400;
  line-height: 1.5;
  color: #f0f2f4;
  
  background-position: right 0.75rem center;
  background-size: 16px 12px;
  /* border-bottom: 1px solid #ced4da; */
  /* border-radius: 0.25rem; */
  /* transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
@media (prefers-reduced-motion: reduce) {
  .form-select-white {
    transition: none;
  }
}

select option {
 
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
 
}
.form-select-white:focus {
  color:white;
}
.form-select-white[multiple], .form-select-white[size]:not([size="1"]) {
  padding-right: 0.75rem;
  background-image: none;
}
.form-select-white:disabled {
  background-color: #e3e6ea;
}
.form-select-white:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #212529;
}

input[type="color"] {
-webkit-appearance: none;
border: none;
width: 30px;
/* height: 20px; */
border-radius: 4px;
}
input[type="color"]::-webkit-color-swatch-wrapper {
      padding: 0;
      /* border-radius: 50%; */
      border-radius: 4px;
      border:none;
}
input[type="color"]::-webkit-color-swatch {
      border: none;
      border-radius: 4px;
      /* border-radius: 50%; */
}
.page2 {
  background-color: ivory;
  /* background-color: #eff5f8; */
  /* background-color: #EEF5F9; */
}
.bg-work-title {
  background-color: #e9f2f9 !important ;
}
.bg-work {
  background-color:#e9f2f9 !important;
}
.bg-work-dark {
  background-color:#aadaff !important;
}
.bg-work-light {
  background-color: #EEF5F9 !important ;
  color: #343a40 !important;
}
.bg-noException{
  background-color: rgb(238, 245, 249) !important;
}
.bg-yellow{
  background-color: rgba(255,255, 0) !important
}
.bg-exception{
  background-color: rgba(205, 205, 205, 0.1) !important;
}
.bg-exceptTeacher{
  background-color: rgba(90, 90, 90, 0.1) !important;
}


.columnFix1 {
  background-color:#e9f2f9 !important;
  left: -4px;
  position: -webkit-sticky;
  position: sticky;
  
  }        
  .columnFix2 {
    background-color:#e9f2f9 !important;
  left: 64px;
  position: -webkit-sticky;
  position: sticky;
  
  padding: 2px;
  }
    
  .rowFix {
  /* background-color: #f9f9f9 ; */
  top: -6px;
  position: -webkit-sticky;
  position: sticky;
  /* background-color: #e9f2f9 !important ; */
  
  }   
  

.px-6 {
  padding-right: 4rem !important;
  padding-left: 4rem !important;
}
.px-7 {
  padding-right: 7rem !important;
  padding-left: 7rem !important;
}
.w-5 {
  width: 5% !important;
}
.w-10 {
  width: 10% !important;
}
.w-15 { width: 15% !important;}
.w-20 { width: 20% !important;}

.btn-info {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

.btn-info:hover {
  color: #fff;
  background-color: #148a9c;
  border-color: #128293;
}

.btn-check:focus + .btn-info, .btn-info:focus {
  color: #fff;
  background-color: #148a9c;
  border-color: #128293;
  -webkit-box-shadow: 0 0 0 0.25rem rgba(58, 176, 195, 0.5);
  box-shadow: 0 0 0 0.25rem rgba(58, 176, 195, 0.5);
}

.btn-check:checked + .btn-info,
.btn-check:active + .btn-info, .btn-info:active, .btn-info.active,
.show > .btn-info.dropdown-toggle {
  color: #fff;
  background-color: #128293;
  border-color: #117a8a;
}

.btn-check:checked + .btn-info:focus,
.btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus,
.show > .btn-info.dropdown-toggle:focus {
  -webkit-box-shadow: 0 0 0 0.25rem rgba(58, 176, 195, 0.5);
  box-shadow: 0 0 0 0.25rem rgba(58, 176, 195, 0.5);
}

.btn-info:disabled, .btn-info.disabled {
  color: #ddd;
  background-color: #1b8c9d;
  border-color:#1b8c9d;
}
.btn-primary {
  color: #fff;
  background-color: #2b90d9;
  border-color: #2b90d9;
}

.btn-primary:hover {
  color: #fff;
  background-color: #257ab8;
  border-color: #2273ae;
}

.btn-check:focus + .btn-primary, .btn-primary:focus {
  color: #fff;
  background-color: #257ab8;
  border-color: #2273ae;
  -webkit-box-shadow: 0 0 0 0.25rem rgba(75, 161, 223, 0.5);
  box-shadow: 0 0 0 0.25rem rgba(75, 161, 223, 0.5);
}

.btn-check:checked + .btn-primary,
.btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #2273ae;
  border-color: #206ca3;
}

.btn-check:checked + .btn-primary:focus,
.btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  -webkit-box-shadow: 0 0 0 0.25rem rgba(75, 161, 223, 0.5);
  box-shadow: 0 0 0 0.25rem rgba(75, 161, 223, 0.5);
}

.btn-primary:disabled, .btn-primary.disabled {
  color: #ddd;
  background-color: #2885c7;
  border-color:  #2885c7;
}

.btn-light-1 {
  color: rgb(0, 0, 0);
  background-color: #dedede;
  border-color: none;
  min-width: 25px;
}
.btn-light-1:hover {
  color: rgb(11, 11, 11);
  border-color: none;
  font-weight: 800;
  min-width: 25px;
  background-color: #dedede;
}
.btn-light-2 {
  color: #ccc;
 
  border-color: none;
  min-width: 25px;
}
.btn-light-2:hover {
  color: rgb(134, 138, 143);
  border-color: none;
  font-weight: 700;
  min-width: 25px;
}
.btn-blue:hover {
  color: #fff;
  background-color: #206fa9;
  border-color: #1c679c;
  
}
.btn-blue {
  color: #fff;
  background-color: #185581;
  border-color: #1c679c;
 
}
.btn-blue:hover {
  color: #fff;
  background-color: #206fa9;
  border-color: #1c679c;
  
}
.btn-blue-1 {
  color: #ccc;
  background-color:  #144a70;
  border-color:  #999;


}
.btn-blue-1:hover {
  color: #fff;
  background-color: #134468;
  border-color:#bbb;

}
.btn-red {
  color: #fff;
  background-color: #c64505;
  border-color: #cb4704;
  min-width: 25px;
}
.btn-red:hover {
  color: #fff;
  background-color: #d44b07;
  border-color: #e85207;
  min-width: 25px;
}
.btn-gray {
  color: rgb(68, 68, 68);
  background-color: #e3eef7;
  border-color: #dbdede;
}

.btn-gray:hover {
  color: rgb(67, 66, 66);
  background-color: #f4f3f3;
  border-color: #dbdede;
}
.btn-gray-light {
  color: rgb(68, 68, 68);
  background-color: #fdfcfc;
  
  border-color: #dbdede;
  border:none;
}

.btn-gray-light:hover {
  color: rgb(67, 66, 66);
  background-color: #f1f1f1;
  border-color: #dbdede;
}
.btn-gray-light-border {
  color: #333;
  background-color: #fefefe;
  
  border-color: #dbdede;
  border:1px solid #fdfcfc;
}

.btn-gray-light-border:hover {
  color: black;
  background-color: #fff;
  
  border-color: rgb(2, 89, 160);
}

.btn-check:focus + .btn-info-light, .btn-info-light:focus {
  color: #fff;
  background-color: #76eafc;
  border-color: #128293;
  -webkit-box-shadow: 0 0 0 0.25rem rgba(58, 176, 195, 0.5);
  box-shadow: 0 0 0 0.25rem rgba(58, 176, 195, 0.5);
}

.btn-check:checked + .btn-info-light,
.btn-check:active + .btn-info-light, .btn-info-light:active, .btn-info-light.active,
.show > .btn-info-light.dropdown-toggle {
  color: #fff;
  background-color: #128293;
  border-color: #117a8a;
}

.btn-check:checked + .btn-info-light:focus,
.btn-check:active + .btn-info-light:focus, .btn-info-light:active:focus, .btn-info-light.active:focus,
.show > .btn-info-light.dropdown-toggle:focus {
  -webkit-box-shadow: 0 0 0 0.25rem rgba(58, 176, 195, 0.5);
  box-shadow: 0 0 0 0.25rem rgba(58, 176, 195, 0.5);
}

.btn-info-light:disabled, .btn-info-light.disabled {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}
.table-xs > :not(caption) > * > * {
  padding: 3px;
}

.text-right {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}

.text-left {
  text-align: left !important;
}
.spin {
  color: official;
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.spin div {
  transform-origin: 40px 40px;
  animation: spin 1.2s linear infinite;
}
.spin div:after {
  content: " ";
  display: block;
  position: absolute;
  top: 3px;
  left: 37px;
  width: 6px;
  height: 18px;
  border-radius: 20%;
  background-color: #fff;
}
.spin div:nth-child(1) {
  transform: rotate(0deg);
  animation-delay: -1.1s;
}
.spin div:nth-child(2) {
  transform: rotate(30deg);
  animation-delay: -1s;
}
.spin div:nth-child(3) {
  transform: rotate(60deg);
  animation-delay: -0.9s;
}
.spin div:nth-child(4) {
  transform: rotate(90deg);
  animation-delay: -0.8s;
}
.spin div:nth-child(5) {
  transform: rotate(120deg);
  animation-delay: -0.7s;
}
.spin div:nth-child(6) {
  transform: rotate(150deg);
  animation-delay: -0.6s;
}
.spin div:nth-child(7) {
  transform: rotate(180deg);
  animation-delay: -0.5s;
}
.spin div:nth-child(8) {
  transform: rotate(210deg);
  animation-delay: -0.4s;
}
.spin div:nth-child(9) {
  transform: rotate(240deg);
  animation-delay: -0.3s;
}
.spin div:nth-child(10) {
  transform: rotate(270deg);
  animation-delay: -0.2s;
}
.spin div:nth-child(11) {
  transform: rotate(300deg);
  animation-delay: -0.1s;
}
.spin div:nth-child(12) {
  transform: rotate(330deg);
  animation-delay: 0s;
}
@keyframes spin {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.text-gray-light{
  color:#ddd;
}
.text-green{
  color: green;
}
.input-group>input.someInput {flex: 0 1 80%}
.border-none{
  border:none
}

/* .border-group{
  border:1px solid rgba(242, 68, 4,0.3) !important;
} */

.bg-click-cell{
  background-color: yellow !important; 
}
/* .color-click-cell{
  color: white !important; 
} */
.bg-f5f5f5{
  background-color: #f5f5f5; 
}
.bg-ddd{
  background-color: #ddd; 
}
.bg-ccc{
  background-color: #ccc ; 
}
.bg-eee{
  background-color: #eee ; 
}
.bg-DarkGrey{
  background-color: DarkGrey; 
}

.layer-dialog-scrollable {
  height: calc(100% - 1rem);
}
.layer-dialog-scrollable .layer-content {
  max-height: 50%;
  overflow: hidden;
}
.layer-dialog-scrollable .layer-body {
  overflow-y: auto;
}
.slash {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="100%" x2="100%" y2="0" stroke="Gainsboro" /></svg>');
}
.backslash {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="0" x2="100%" y2="100%" stroke="Gainsboro" /></svg>');
}
 
#TmPopup{
  border:4px solid #ddd; 
  position:absolute; 
  left:100px; 
  top:100px; 
  background:#fefefe;
  z-index:9999;
}


.dropdown-large{ padding:1rem; }

/* ============ desktop view ============ */
@media all and (min-width: 992px) {
.dropdown-large{min-width:400px;}
.dropdown-large-2{min-width:800px;}
.dropdown-sm{min-width:100px; padding:0rem;}
}	
/* ============ desktop view .end// ============ */
.dropdown-sm{min-width:100px !important; padding:0.1rem;}

/* ============ desktop view ============ */
@media all and (min-width: 992px) {
.dropdown-sm{min-width:100px;}
}	

@media all and (min-width: 992px) {
.dropdown-xs{min-width:60px;}
}	
.overflow-hidden {

overflow: hidden;
white-space: nowrap;

}

.dropdown-icon-box {
position: static;
}

tr[id^='headRow']  th, tr[id^='headRow']  td{
/* border-top: none !important;
border-bottom: none !important; */
box-shadow: inset 0 1px 0 #ddd, inset 0 -1px 0 #ddd;;
padding: 1px 0;
z-index:920;

}


.datepicker.dropdown-menu {z-index: 9999 !important;}
.overflow{
  overflow:auto
}
.text-DarkSlateGray{
  color:DarkSlateGray
}
.bgDarkSlateGray{
  background-color:DarkSlateGray
}
.popover {
  max-width: 900px;
  min-width: 150px;
}
.text-gray{color: gray;}


.text-lightgray{
  color:lightgray;
}
.bg-DarkSlateGrey{
  background-color: DarkSlateGrey;
}
.hasDatepicker {
  position: relative;
  /* z-index: 9999; */
}
.ui-datepicker{ z-index: 9999 !important
}
.anotherhover tbody tr:hover td {
  background:#2351dc;
  cursor:default;
  opacity: 1;
  color : white
 }

 .btn {
  font-family: 'Nanum Gothic', sans-serif;
 }
 .btn-sm, .btn-group-sm > .btn {
  padding: 0.100rem 0.25rem;
  font-size: 0.875rem;
  border-radius: 0.2rem;
}
.text-DodgerBlue{
  color:DodgerBlue;
}
.hover-white:hover{
  background-color:rgb(231, 4, 4);
}
.color-green:hover{
  color: lightGreen;
  }
.color-green{
  color: LimeGreen;
  }
.hover-light:hover{
  background-color: LightYellow;
  }
  .bg-blue-body{
    background-color: #07283f;
    color: #f8f9fa;
  }  
.bg-blue-dark{
  background-color: #144e77;
  border-color: #1c679c;
  color: #fff;
}
.bg-blue-dark-light-1{
  background-color: #145584;
  border-color: #1e72ae;
  color: #fff;
}
.bg-blue-dark-light-2{
  background-color: #07283f;
  border-color: #1e72ae;
  color: #fff;
}
.main-dark-blue{
  background-color: #07283f;
  border-color: #1e72ae;
}
.nav {
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.nav-link {
  display: block;
  padding: 0.5rem 1rem;
  color: #c7cfd8;
  text-decoration: none;
  border:none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
  .nav-link {
    transition: none;
  }
}
.nav-link:hover, .nav-link:focus {
  color: #edf0f3;
}
.nav-link.disabled {
  color: #6c757d;
  pointer-events: none;
  cursor: default;
}

.nav-tabs {
  border-bottom: 1px solid #dee2e6;
}
.nav-tabs .nav-link {
  margin-bottom: -1px;
  background: none;
  border: 1px solid transparent;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
  border-color: #3793d4 #3793d4 #3793d4;
  isolation: isolate;
}
.nav-tabs .nav-link.disabled {
  color: #6c757d;
  background-color: transparent;
  border-color: transparent;
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  font-weight: 550;
  color: white;
  /* background-color: transparent; */
  background-color: #1d6faa;
  
  border:2px solid #1d6faa;
  border-color: #1d6faa #1d6faa #1d6faa;
}
.nav-tabs .dropdown-menu {
  margin-top: -1px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.nav-pills .nav-link {
  background: none;
  border: 0;
  border-radius: 0.25rem;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff;
  background-color: #0d6efd;
}

.nav-fill > .nav-link,
.nav-fill .nav-item {
  flex: 1 1 auto;
  text-align: center;
}

.nav-justified > .nav-link,
.nav-justified .nav-item {
  flex-basis: 0;
  flex-grow: 1;
  text-align: center;
}

.nav-fill .nav-item .nav-link,
.nav-justified .nav-item .nav-link {
  width: 100%;
}

.tab-content > .tab-pane {
  display: none;
}
.tab-content > .active {
  display: block;
}

.navbar {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.navbar > .container,
.navbar > .container-fluid,
.navbar > .container-sm,
.navbar > .container-md,
.navbar > .container-lg,
.navbar > .container-xl,
.navbar > .container-xxl {
  display: flex;
  flex-wrap: inherit;
  align-items: center;
  justify-content: space-between;
}
.navbar-brand {
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem;
  margin-right: 1rem;
  font-size: 1.25rem;
  text-decoration: none;
  white-space: nowrap;
}
.navbar-nav {
  display: flex;
  flex-direction: column;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}
.navbar-nav .nav-link {
  padding-right: 0;
  padding-left: 0;
}
.navbar-nav .dropdown-menu {
  position: static;
}

.navbar-text {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.navbar-collapse {
  flex-basis: 100%;
  flex-grow: 1;
  align-items: center;
}

.navbar-toggler {
  padding: 0.25rem 0.75rem;
  font-size: 1.25rem;
  line-height: 1;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  transition: box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
  .navbar-toggler {
    transition: none;
  }
}
.navbar-toggler:hover {
  text-decoration: none;
}
.navbar-toggler:focus {
  text-decoration: none;
  outline: 0;
  box-shadow: 0 0 0 0.25rem;
}
.text-Aqua{
  color:Aqua;
}
.text-DeepSkyBlue{
  color:DeepSkyBlue
}
.text-LightCyan{
  color:LightCyan
}
.bg-GhostWhite{
  background-color: GhostWhite;
}
.bg-Snow{
  background-color: snow;
}
.placeholder-gray-100::-webkit-input-placeholder {
  color: #aaaaaa
}
/**
 * ==============================================
 * Dot Flashing
 * ==============================================
 */
 .dot-flashing {
  position: relative;
  width: 4px;
  height: 4px;
  border-radius: 2px;
  background-color: #FFFF00;
  color: #FFFF00;
  animation: dot-flashing 1s infinite linear alternate;
  animation-delay: 0.5s;
}
.dot-flashing::before, .dot-flashing::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
}
.dot-flashing::before {
  left: -6px;
  width: 4px;
  height: 4px;
  border-radius: 2px;
  background-color: #FFFF00;
  color: #FFFF00;
  animation: dot-flashing 1s infinite alternate;
  animation-delay: 0s;
}
.dot-flashing::after {
  left: 6px;
  width: 4px;
  height: 4px;
  border-radius: 2px;
  background-color: #FFFF00;
  color: #FFFF00;
  animation: dot-flashing 1s infinite alternate;
  animation-delay: 1s;
}

@keyframes dot-flashing {
  0% {
    background-color: #FFFF00;
  }
  50%, 100% {
    background-color: rgba(255, 255, 0,0.4);
  }
}
.text-nowrap {
  white-space: nowrap !important;
  overflow: hidden !important;

}
.none{
  display:none;
}
.text-tomato{
  color:tomato;
}
.text-teal{
  color:teal;
}
.clickCellTopBorderColor{
  border-top:2px solid 	 #2db300 !important;
  border-bottom:2px solid 	 #2db300 !important
}
/* .btn-light {
  color: #212529;
  background-color: #ffffff;
  border-color: #f8f9fa;
  
} */
.bg-sameGroup{
  background-color:	#c6ffb3 !important;
  border-top:2px solid 	 #2db300 !important;
  border-bottom:2px solid 	 #2db300 !important
}
.bg-sisuRec{
 
 background-color:#39e600 !important
}
.bg-teacher{
  background-color:#9fff80 !important  
}
.bg-exceptTeacher{
  background-color:#cccccc !important  
}
.duplicationCell{
  background-color: #ffba66 !important;
  color: black !important;
}

.clickInfor{
cursor:default;  
}
.textOverHidden{
  overflow:hidden;
  white-space : nowrap;
  text-overflow: ellipsis;
  cursor:default;
}
.placeholderColor::-webkit-input-placeholder {
  color: #aaaaaa;

}
.hidden{
  display: none;
}
.swiper { 
  width: 100%;
  height: 100%;}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
  }
.autoplay-progress {
      position: absolute;
      right: 16px;
      bottom: 16px;
      z-index: 10;
      width: 48px;
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      color: var(--swiper-theme-color);
}

.autoplay-progress svg {
  --progress: 0;
  position: absolute;
  left: 0;
  top: 0px;
  z-index: 10;
  width: 100%;
  height: 100%;
  stroke-width: 4px;
  stroke: var(--swiper-theme-color);
  fill: none;
  stroke-dashoffset: calc(125.6 * (1 - var(--progress)));
  stroke-dasharray: 125.6;
  transform: rotate(-90deg);
}
kbd {
  display: inline-block;
  margin: 0 0.1em;
  padding: 0.1em 0.6em;
  font-family: var(--theme-body-font-family);
  font-size: var(--fs-fine);
  line-height: 1.4;
  color: var(--black-800);
  text-shadow: 0 1px 0 var(--white);
  background-color: var(--black-075);
  border: 1px solid var(--black-300);
  border-radius: 3px;
  box-shadow: 0 1px 1px hsla(210,8%,5%,0.15),inset 0 1px 0 0 var(--white);
  white-space: nowrap;
}
.liveUsers{
  min-width:30px !important;
  
}
/* .timeCell{
 max-width: 400px !important;
} */
.cursor-move{
  cursor: move;
}
.cursor-pointer{
  cursor: pointer;
}
.cursor-default{
  cursor: default;
}