.index .hero {
  padding: calc(50vh - 280px) 0 14vh 0;

  h3 {
    color: var(--f-color);
    font-size: 4rem;
    line-height: 4rem;
    text-align: center;

    span {
      position: relative;
      color: var(--btc);

      &:after {
        content: "";
        position: absolute;
        bottom: .55rem;
        left: 0;
        width: 100%;
        height: .2rem;
        border: .2rem solid var(--btc);
      }
    }
  }
}

@media only screen and (max-width: 1440px) {
  .index .hero {
    padding: calc(50vh - 240px) 0 10vh 0;
  }
}

@media only screen and (max-width: 768px) {
  .index .hero {
    padding: 18vh 0;

    h3 {
      font-size: 2.2rem;
      line-height: 2.2rem;

      span:after {
        bottom: .35rem;
        height: .15rem;
        border-width: .15rem;
      }
    }
  }
}