diff --git a/app/views/layouts/_flash.html.erb b/app/views/layouts/_flash.html.erb
index aecaf57..9229fb7 100644
--- a/app/views/layouts/_flash.html.erb
+++ b/app/views/layouts/_flash.html.erb
@@ -2,14 +2,20 @@
 <div class="fixed z-50 right-0 mr-4 top-0 mt-[80px]" id="flash">
   <div class="flex justify-center">
     <% if flash[:notice] %>
-      <div class="flash notice" role="alert" data-turbo-temporary data-controller="removeable" data-removeable-after-value="5">
+      <div class="flash notice" role="alert" data-turbo-temporary data-controller="removeable" data-removeable-after-value="10">
         <p class="text-small"><%= flash[:notice] %></p>
+        <button class="absolute top-0 bottom-0 right-0 px-2 py-3" data-action="click->removeable#remove">
+          <svg class="fill-current h-6 w-6 hover:text-primary" role="button" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><title>Close</title><path d="M14.348 14.849a1.2 1.2 0 0 1-1.697 0L10 11.819l-2.651 3.029a1.2 1.2 0 1 1-1.697-1.697l2.758-3.15-2.759-3.152a1.2 1.2 0 1 1 1.697-1.697L10 8.183l2.651-3.031a1.2 1.2 0 1 1 1.697 1.697l-2.758 3.152 2.758 3.15a1.2 1.2 0 0 1 0 1.698z"/></svg>
+        </button>
       </div>
     <% end %>
 
     <% if flash[:alert] %>
       <div class="flash alert" role="alert" data-turbo-temporary data-controller="removeable" data-removeable-after-value="5">
         <p class="text-small"><%= flash[:alert] %></p>
+        <button class="absolute top-0 bottom-0 right-0 px-2 py-3" data-action="click->removeable#remove">
+          <svg class="fill-current h-6 w-6 hover:text-primary" role="button" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><title>Close</title><path d="M14.348 14.849a1.2 1.2 0 0 1-1.697 0L10 11.819l-2.651 3.029a1.2 1.2 0 1 1-1.697-1.697l2.758-3.15-2.759-3.152a1.2 1.2 0 1 1 1.697-1.697L10 8.183l2.651-3.031a1.2 1.2 0 1 1 1.697 1.697l-2.758 3.152 2.758 3.15a1.2 1.2 0 0 1 0 1.698z"/></svg>
+        </button>
       </div>
     <% end %>
   </div>