frontend:Change styles to em

frontend/src/pages/Main/TourWrapper.scss

@@ -4,19 +4,19 @@
   border: 1px solid #ccc;
   border-radius: 4px;
   box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
-  padding: 10px;
-  font-size: 14px;
+  padding: 0.8em;
+  font-size: 1em;
   line-height: 1.5;
   color: #333;
-  min-width: 200px;
+  min-width: 13em;
   white-space: normal;
   text-align: left;
   cursor: default;
   transition: opacity 0.3s;
 
   .tooltip__close {
     float: right;
-    font-size: 12px;
+    font-size: 0.8em;
     color: #999;
     cursor: pointer;
   }
@@ -26,49 +26,49 @@
 
     .tooltip__typeIcon {
       width: 120px;
-      padding-left: 14px;
+      padding-left: 0.8em;
       float: left;
 
       p {
         text-align: left;
-        margin-left: 10px;
+        margin-left: 0.6empx;
       }
     }
 
     .tooltip__navigationLink {
-      margin-left: 5px;
+      margin-left: 0.35em;
     }
 
     .tooltip__text {
-      min-width: 300px;
-      min-height: 140px;
-      padding-left: 120px;
+      min-width: 19em;
+      min-height: 9em;
+      padding-left: 7.5em;
 
       .tooltip__content {
         font-size: 1.2em;
       }
 
       .tooltip__clickInfo {
         font-size: 0.8em;
-        margin: 20px 12px;
+        margin: 1.25em 0.8em;
         background-color: #ddd;
         color: #666;
         font-style: italic;
-        padding: 10px;
+        padding: 0.8em;
 
         .tooltip__clickInfo__icon {
           position: absolute;
         }
 
         span {
-          margin-left: 30px;
+          margin-left: 2em;
         }
       }
     }
 
     .tooltip__footer {
-      margin: 10px 0;
-      min-height: 30px;
+      margin: 0.8em 0;
+      min-height: 2em;
 
       .tooltip__button--primary {
         float: right;