Efeito de carregamento de borda no hover

Bom dia Senhores Dev's!

Seguinte gostaria de uma ajudinha e já de antemão agradeço a colaboração de todos que puderem.

Tem uma div de um blog e nela quando passo o mouse fazendo o :hover, aparece o border-bottom:4px solid #09c;

No entanto, queria trocar esse efeito para que ao invés de aparecer, ela encha a mesma borda, começando a aparecer da esquerda para a direita,  parecido com o carregamento barra de uma barra de progresso.

Alguém pode me ajudar com esse script? Muito obrigado!