<div class="w-full max-w-xs">
  <form class="bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4">
    <div class="mb-6">
      <label class="block text-gray-700 text-sm font-bold mb-2">好きな果物</label> <input
        type="text"
        list="fruits"
        class="shadow appearance-none border border-red-500 rounded w-full py-2 px-3 text-gray-700 mb-3 leading-tight focus:outline-none focus:shadow-outline"
        placeholder="">
      <datalist id="fruits">
        <option value="apple">
        <option value="banana">
        <option value="梨">
        <option value="みかん">
      </datalist>
    </div>
  </form>
</div>