.mfo_input_wrapper {
  margin-bottom: 16px;
}

.mfo_input_wrapper label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  margin-bottom: 7px;
}

.mfo_input_wrapper input {
  outline: none;
  width: 374px;
  height: 50px;
  border: 1px solid #828282;
  border-radius: 8px;
  font-size: 14px;
  padding: 0 18px;
  line-height: 20.2px;
  margin-bottom: 7px;
}

.mfo_input_wrapper input::placeholder {
  color: rgba(134, 134, 134, 0.8);
}

.mfo_input_wrapper input:focus {
  border: 1px solid var( --colorOrange);
}

.mfo_input_wrapper .hint {
  font-size: 14px;
  color: #868686;
  line-height: 20.2px;
  margin-bottom: 6px;
}

.mfo_input_wrapper.error input {
  border: 1px solid var( --colorOrange);
}

.mfo_input_wrapper.error label {
  color: var( --colorOrange);
}

.mfo_input_wrapper .error-message {
  font-size: 14px;
  font-weight: 500;
  color: var( --colorOrange);
  line-height: 20.2px;
}

.mfo_input_wrapper input:disabled {
  background-color: #F4F4F4;
  border: 1px solid #C9C9C9;
}

@media (max-width: 767px) {
  .mfo_input_wrapper label,
  .mfo_input_wrapper input,
  .mfo_input_wrapper .hint,
  .mfo_input_wrapper .error-message {
    font-size: 12px;
    line-height: 17.3px;
  }

  .mfo_input_wrapper input {
    width: 100%;
    height: 42px;
  }
}