.logsaver-side-nav{
    position: fixed;
    width: 200px;
    height: 100%;
    z-index: 100;
    overflow-y: auto;
    overflow-x:hidden;
    background:linear-gradient(to bottom, #3e3c3d 0%, #2d2c2d 100%);
    box-shadow: 6px 0px 4.8px 1.2px rgba(0, 0, 0, 0.16);
}

.nav-item{
    position: relative;
    top: 0;
}

.logsaver-side-nav .user-info{
    background:linear-gradient(to right, #3e3c3d 0%, #2d2c2d 100%);
    box-shadow: 6px 0px 4.8px 1.2px rgba(0, 0, 0, 0.16);
    
}

/*오른쪽으로*/
@media(width){
    .logsaver-side-nav.right-nav{
        width: 200px;
        right:0;
        box-shadow: 0px 10px 1px 8px rgba(0, 0, 0, 0.1);
    }

    .logsaver-side-nav.right-nav .nav-item a{
        padding-left:30px; 
    } 

    .content-layout.right-nav{
        padding: 20px;
        padding-left: 16px;
        padding-top:1px; 
        padding-right: 216px;
    }

    .logsaver-top-menu.right-nav{
        padding: 0px;
        padding-right: 200px;
    }
} 

/*편집모드 시 오른쪽으로*/
@media(width){
    .wrapper .logsaver-side-nav.right-nav{
        width: 200px;
        right:0px;
        margin-right:20%;
        box-shadow: 0px 10px 1px 8px rgba(0, 0, 0, 0.1);
    }


    .wrapper .content-layout.edit.right-nav{
        padding: 16px;
        padding-right:320px;
    }

    .wrapper .logsaver-top-menu.right-nav{
        padding: 0px;
        padding-right: 200px;

    }

    .wrapper .logsaver-side-nav .user-info{
        box-shadow: inherit;
    }
}

/*display:none*/
@media(width){
    .logsaver-side-nav.list-closed {
        display:none;
    }

    .logsaver-top-menu.list-closed{
        padding: 0;
    }

    .content-layout.list-closed{
        padding: 20px;
    }

    .top-info.list-closed{
        padding-right:0px ;
    }
}

.brand {
    width: 100%;
    height: 52px;    
    background-color: white;
    background-image: linear-gradient(to right, #999999, #999999 0%, #ffffff 5%, #ffffff 95%, #999999 100%, #999999);
  
}

.back{
    background-image: none;
    height: 52px;
}

.brand img{
    width: 120px;
    height: 26px;
    margin: 14px 40px;
}

.user-info{
    margin-top: 0px;
    background-color: white;
    padding: 20px;
    height: 68px;
    border-top: 1px solid #b8b8e6;
}

.user-info h4{
    font-size: 14px;
    color: #fffefe;
}

.user-info h6{
    font-size:10px;
    color: #fffefe;
}

.logsaver-side-nav ul li{
    width: 100%;
    position: relative;
    font-size: 14px;

}

.logsaver-side-nav ul li i{
    margin-right: 10px;
}

.logsaver-side-nav ul li:hover,
.logsaver-side-nav ul li.active{
    background:#272526;
}

.logsaver-side-nav ul li{
    width: 100%;
    border-top: 1px solid #444444;
    border-bottom: 1px solid #222222;
}

.logsaver-side-nav ul li a{
    display: block;
    width: 100%;
    color: white;
    text-decoration: none;
    padding-left:16px;
    line-height:40px; 
    height: 40px;
}

.logsaver-side-nav ul li ul li {
    list-style: none;
    padding: 0;
    padding-left: 30px;
    background: linear-gradient(to right, #3e3c3d 0%, #2d2c2d 100%);
    border-top: 1px solid #444444;
    border-bottom: 1px solid #222222;
}

.logsaver-side-nav ul li ul li.active {
    background: #272526;
}

.logsaver-side-nav ul li ul li.active a{
    color: white

}

.logsaver-side-nav ul li ul li:hover{
    background-color: #4a4a4a;
}

.logsaver-side-nav ul li ul li a{
    color: #b2b2b2;
    line-height:36px; 
    height: 36px;
    font-size: 12px;
    
}

.logsaver-side-nav ul li ul li a:hover{
    color: white;
}


@media(max-width:576px){
    .logsaver-side-nav.list-closed {
        display:block;
    }
    .logsaver-top-menu.list-closed{
        padding-left: 200px;
    }


    .logsaver-top-menu.list-closed .float-left,
    .logsaver-top-menu.list-closed .float-right{

    }

}