@charset "EUC-KR";
body {
  overflow-x: hidden;
}

#wrapper{
	/* display: flex;
	height: 100%; */
	position: fixed;
	top: 56px;
	width: 100%;
	height: calc(100% - 106px);
	overflow-y: auto;
}

#tree{
	width: 300px;
	height: 100%;
}

#tree ul{
	word-break: break-all;
}

#sidebar-wrapper {
  height: calc(100% - 106px);
  margin-left: -300px;
  transition: all 0.3s; 
  position: fixed;  
  top: 56px;
}

#sidebar-wrapper ul{
  width: 300px;
}

#page-content-wrapper { 
  position: absolute;
  width: 100% !important;
  height: calc(100% - 106px) !important;
  right: 0;
  padding: 20px;
  transition: all 0.3s;
}

#wrapper.toggled #page-content-wrapper {
  right: 0;
  width: calc(100% - 300px) !important;
}

#wrapper.toggled #page-content-wrapper width{
  -webkit-calc(100% - 300px) !important;
}

#wrapper.toggled #sidebar-wrapper {
  margin-left: 0;
  transition: all 0.3s;
  -ms-transition: all 0.3s;

}

/* 768px ÀÌ»ó */
@media (min-width: 768px) {
  #sidebar-wrapper {
    margin-left: 0;
  	height: calc(100% - 106px);  
  	}
  

  #page-content-wrapper {
    position: absolute;
    width: calc(100% - 300px) !important;
    height: calc(100% - 106px) !important;
    display: table;
    padding: 20px;
    transition: all 0.3s; 
    -ms-transition: all 0.3s; 
  }
  
  #wrapper.toggled #page-content-wrapper {
  	right: 0;
  	width: calc(100% - 300px) !important;
   }
  
  
  #wrapper.toggled #page-content-wrapper {
  	width: 100% !important;
  	transition: all 0.3s;
  	-ms-transition: all 0.3s;
  }

  #wrapper.toggled #sidebar-wrapper {
    margin-left: -300px;
    transition: all 0.3s;
    -ms-transition: all 0.3s;
  }
}