.page-container {position: relative;top: 0;left: 0; bottom: 0;width: 100%;height: 100%;margin: 0px auto;}
.content {display: block;padding: 50px;margin: 50px auto;box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);background: #fff;overflow: hidden;}

.page-container.sidebar-collapsed {/*padding-right: 65px;*/transition: all 100ms linear;transition-delay: 300ms;}
.page-container.sidebar-collapsed-back {padding-right: 280px;transition: all 100ms linear;}

.page-container.sidebar-collapsed .sidebar-menu {width: 65px;transition: all 100ms ease-in-out;transition-delay: 300ms;}
.page-container.sidebar-collapsed-back .sidebar-menu {/*width: 280px*/width:182px;transition: all 100ms ease-in-out;}

.page-container.sidebar-collapsed .sidebar-icon {transform: rotate(-180deg);transition: all 300ms ease-in-out;}
.page-container.sidebar-collapsed-back .sidebar-icon {transform: rotate(0deg);transition: all 300ms ease-in-out;}

.page-container.sidebar-collapsed .logo {padding: 21px;height: 100px;box-sizing: border-box;transition: all 100ms ease-in-out;transition-delay: 300ms;}
.page-container.sidebar-collapsed-back .logo {width: 100%;padding: 21px;height: 100px;box-sizing: border-box;transition: all 100ms ease-in-out;}

.page-container.sidebar-collapsed #logo {opacity: 0;transition: all 200ms ease-in-out;}
.page-container.sidebar-collapsed-back #logo {opacity: 1;transition: all 200ms ease-in-out;transition-delay: 300ms;}

.page-container.sidebar-collapsed #menu span {opacity: 0;transition: all 50ms linear; overflow:hidden; width:10px !important;}/*닫혔을때, 마우스 영역 설정*/
.page-container.sidebar-collapsed-back #menu span {opacity: 1;transition: all 200ms linear;transition-delay: 300ms;}

.sidebar-menu {position: fixed;float:left;/*width: 280px*/width:182px;top: 0;/*right: 0;*/bottom: 0;background-color: #303641;color: #aaabae;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);z-index:999;}


#menu {list-style: none;margin: 0;padding: 0;margin-bottom: 20px; }
#menu li {position: relative;margin: 0;font-size: 14px;height:42px;border-bottom: 1px solid rgba(69, 74, 84, 0.7);padding: 0; }
#menu li ul {opacity: 0;height: 0px;}
#menu li a {font-weight: 400;position: relative;display: block;padding: 10px 20px;color: #aaabae;white-space: nowrap;z-index: 2; }
#menu li a:hover {color: #fff;background-color: #333944;transition: color 250ms ease-in-out, background-color 250ms ease-in-out;}


/*하단 배너 관련*/
#menu li.slid-banner{border-top: 1px solid rgba(69, 74, 84, 0.7);color:#fff;background:#301d66;height:auto !important;}
#menu li.slid-banner a:hover {background-color: #301d66;color:#fff200;transition: color 250ms ease-in-out, background-color 250ms ease-in-out; }

#menu li.active > a {background-color: #2b303a;color: #ffffff;}
#menu ul li { background-color: #2b303a; }
#menu ul {list-style-type: none;margin: 0;padding: 0; }
#menu li ul {position: absolute;visibility: hidden;left: 100%;top: -1px;background-color: #2b303a;box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5); opacity: 0;transition: opacity 0.1s linear;border-top: 1px solid rgba(69, 74, 84, 0.7);z-index:99999;}
#menu li:hover > ul {visibility: visible;opacity: 1;}
#menu li li ul {right: 100%;visibility: hidden;top: -1px;opacity: 0;transition: opacity 0.1s linear;}
#menu li li:hover ul {visibility: visible;opacity: 1; }
#menu .fa { margin-right: 5px;}
.logo {width: 100%;padding: 21px;height: 100px;box-sizing: border-box;}
.sidebar-icon {/*position: relative;*/float: right;border: 1px solid #454a54;text-align: center;
line-height: 1;font-size: 18px;padding: 6px 8px;border-radius: 3px;color: #888;background-clip: padding-box;}
.fa-html5 {color: #fff;margin-left: 50px;}