.#{$prefix}-mobile-menu{
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 10;
    top: 0;
    bottom: 0;
    left: -100%;
    background-color: $color_white;
    padding: 30px;
    color: $color_white;
    overflow-y: auto; 
    transition: all 0.5s ease;
    
    @include media(sm){
        width: 300px;
    }

    &.show{
        left: 0;
    }
    .#{$prefix}-mobile-close-icon{
        text-align: right;
    }

    ul{
        @extend %reset-ul;
        li{
            a{
                display: block;
                font-weight: $font_semi_bold;
                font-size: 1.2rem;
                line-height: 1;
                padding: 10px 0;
            }
        }
    }
   
    
    
    
}