.box-1 * {
    box-sizing: border-box;
    transition: all .35s ease;
  }
.box-1 p {
    padding: .5em .8em;
    color: rgb(0, 0, 0);
    position: relative;
    text-decoration: none;
    font-size: 20px;
  }
.box-1 p::before,
.box-1 p::after {
  content: '';
  height: 14px;
  width: 14px;
  position: absolute;
  transition: all .35s ease;
  opacity: 0;
}

.box-1 p::before {
  content: '';
  right: 0;
  top: 0;
  border-top: 3px solid #bc1d23;
  border-right: 3px solid #bc1d23;
  transform: translate(-100%, 50%);
}

.box-1 p:after {
  content: '';
  left: 0;
  bottom: 0;
  border-bottom: 3px solid #bc1d23;
  border-left: 3px solid #bc1d23;
  transform: translate(100%, -50%)
}

.box-1 p:hover:before,
.box-1 p:hover:after{
  transform: translate(0,0);
  opacity: 1;
}

.box-1 p:hover {
  color: #bc1d23;
}