/* =========================
   404
========================= */

.error404-sec{
  padding:120px 20px;
  background:#f7f7f7;
}

.error404-box{
  max-width:700px;
  margin:0 auto;
  background:#fff;
  border-radius:20px;
  padding:80px 40px;
  text-align:center;
  box-shadow:0 10px 30px rgba(0,0,0,0.06);
}

.error-code{
  display:block;
  font-size:120px;
  font-weight:700;
  line-height:1;
  color:#1f1f1f;
  margin-bottom:20px;
}

.error-title{
  font-size:32px;
  line-height:1.4;
  margin-bottom:20px;
  color:#1f1f1f;
}

.error-text{
  font-size:16px;
  line-height:2;
  color:#666;
  margin-bottom:40px;
}

.btn-home{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:240px;
  height:56px;
  padding:0 30px;
  border-radius:999px;
  background:#1f1f1f;
  color:#fff;
  text-decoration:none;
  font-size:15px;
  font-weight:500;
  transition:.3s;
}

.btn-home:hover{
  opacity:.8;
  color:#fff;
  text-decoration:none;
}


/* =========================
   Responsive
========================= */

@media(max-width:991px){

  .error404-sec{
    padding:100px 20px;
  }

  .error404-box{
    padding:70px 35px;
  }

  .error-code{
    font-size:90px;
  }

  .error-title{
    font-size:28px;
  }

}


@media(max-width:767px){

  .error404-sec{
    padding:80px 15px;
  }

  .error404-box{
    padding:50px 20px;
    border-radius:16px;
  }

  .error-code{
    font-size:64px;
    margin-bottom:15px;
  }

  .error-title{
    font-size:22px;
    margin-bottom:15px;
  }

  .error-text{
    font-size:14px;
    line-height:1.8;
    margin-bottom:30px;
  }

  .btn-home{
    width:100%;
    min-width:auto;
    height:52px;
    font-size:14px;
  }

}