Fix. css 충돌 해결

map-container 충돌
-> .module.css 사용해야함

.

FE/src/pages/AccommodationDetail.jsx

@@ -7,6 +7,7 @@ import HostInfo from "../components/accommodation_detail/HostInfo";
 import BookingInfo from "../components/accommodation_detail/BookingInfo";
 import Map from "../components/list/Map";
 import "../styles/AccommodationDetail.css";
+import styles from "../styles/Detail.module.css";
 
 const AccommodationDetail = () => {
   const { state } = useLocation();
@@ -79,7 +80,7 @@ const AccommodationDetail = () => {
         checkOut={checkOut}
         headCount={headCount}
       />
-      <div className="map-container">
+      <div className={styles.mapContainer}>
         <Map
           currentPosition={currentPosition}
           mapLevel={mapLevel}

FE/src/styles/AccommodationDetail.css

@@ -142,16 +142,3 @@
 .booking-info button:hover {
   background-color: #e04850;
 }
-
-.map-container {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 400px;
-  width: 50%;
-  max-width: 450px;
-  padding: 10px;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
-  border-radius: 20%;
-  margin: 0 auto;
-}

FE/src/styles/Detail.module.css

@@ -0,0 +1,12 @@
+.mapContainer {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 400px;
+  width: 50%;
+  max-width: 450px;
+  padding: 10px;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+  border-radius: 20%;
+  margin: 0 auto;
+}