Form Tag Custom Style -- Bootstrap4

<!DOCTYPE html>
<html>
<head>
  <link data-require="bootstrap@4.0.5" data-semver="4.0.5" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" />
  <script data-require="bootstrap@4.0.5" data-semver="4.0.5" src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.9/css/all.css" integrity="sha384-5SOiIsAziJl6AWe0HWRKTXlfcSHKmYV4RBF18PPJ173Kzn7jzMyFuTtk8JA7QQG1" crossorigin="anonymous" />
</head>
<body>
  <form class="form-horizontal">
    <div class="form-content">
      <h4 class="heading">정보</h4>
      <div class="form-group row">
        <div class="col-sm-6">
          <label for="formName" class="control-label">
            <i class="fa fa-user"></i>
          </label>
          <input type="text" name="name" class="form-control" id="formName" placeholder="Your Name" required="required" />
        </div>
        <div class="col-sm-6">
          <label for="formPhone" class="control-label">
            <i class="fas fa-mobile-alt"></i>
          </label>
          <input type="text" name="phoneNum" class="form-control" id="formPhone" placeholder="Phone Number" required="required" />
        </div>
      </div>
      <div class="form-group row">
        <div class="col-sm-12">
          <label class="control-label" for="formEmail">
            <i class="fas fa-envelope"></i>
          </label>
          <input class="form-control" name="email" id="formEmail" placeholder="Email" type="email" required="required">
        </div>
      </div>
      <div class="form-group row">
        <div class="col-sm-12">
          <button type="submit" class="btn btn-custom btn-lg">확인</button>
        </div>
      </div>
    </div>
  </form>
</body>
</html>

.form-horizontal {
  border-top: 1px solid #4e4e4e;
}
.form-horizontal .heading {
  font-size: 16px;
  color: #3f9cb5;
  margin: 10px 0 20px 0;
  text-transform: capitalize;
}
.form-horizontal .form-content {
  padding: 25px;
  background: #fff;
}
.form-horizontal .form-control {
  padding: 12px 16px 12px 39px;
  height: 50px;
  font-size: 14px;
  color: #2b2a2a;
  border: none;
  border-bottom: 2px solid #ccc;
  border-radius: 0;
  box-shadow: none;
  margin-bottom: 15px;
}
.form-horizontal .form-control:focus {
  border-color: #3f9cb5;
  box-shadow: none;
}
.form-horizontal .control-label {
  font-size: 17px;
  color: #ccc;
  position: absolute;
  top: 12px;
  left: 27px;
  text-align: center;
}
.form-horizontal textarea.form-control {
  resize: vertical;
  height: 130px;
}
.form-horizontal .btn {
  font-size: 18px;
  color: #4e4e4e;
  float: right;
  margin: 10px 0;
  border: 2px solid #ccc;
  border-radius: 0;
  padding: 10px 25px;
  transition: all 0.5s ease 0s;
  background-color:#fff;
}
.form-horizontal .btn:hover {
  background: #fff;
  border-color: #3f9cb5;
}