JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<div class="col-sm-7 five-three">
    
             <h4 tabindex="0">Company</h4>

            <ul>
                <li><a href="#">Login</a>
                </li>
                <li><a href="#">About us</a>
                </li>
            </ul>
        
    </div>

CSS

@media screen and (max-width: 768px) {
    .five-three ul {
        display:none;
    }
    .five-three h4:focus + ul {
        display:block;
    }
}