.error-container {
  background-color: var(--gray-color05);
  padding-left: 30px;
  padding-right: 30px;

  @media screen and (min-width: 380px) {
    font-size: var(--font-size-70);
  }

  @media screen and (min-width: 768px) {
    font-size: var(--font-size-74);
    padding-left: 0px;
    padding-right: 0px;
  }
}

.error-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.error-content__title {
  font-size: var(--font-size-60);
  font-weight: bold;
  letter-spacing: 6px;
  color: var(--main--color);

  @media screen and (min-width: 380px) {
    font-size: var(--font-size-70);
  }

  @media screen and (min-width: 768px) {
    font-size: var(--font-size-74);
  }
}

.error-content__txt {
  font-weight: bold;
  margin-top: 16px;
  font-size: var(--font-size-12);
  letter-spacing: 1.4px;
  line-height: 2;

  @media screen and (min-width: 380px) {
    font-size: var(--font-size-14);
  }

  @media screen and (min-width: 768px) {
    font-size:var(--font-size-16);
    text-align: center;
  }
}

.error-content__button {
  margin-top: 32px;
  font-weight: bold;
  color: var(--white-color);
  font-size: var(--font-size-12);
  &:hover {
    color: var(--white-color);
  }

  @media screen and (min-width: 380px) {
    font-size: var(--font-size-14);
  }

  @media screen and (min-width: 768px) {
    font-size:var(--font-size-16);
  }
}
