diff --git a/App.js b/App.js
index ef60457..1a82db6 100644
--- a/App.js
+++ b/App.js
@@ -15,6 +15,8 @@ const Stack = createNativeStackNavigator();
 const Tab = createBottomTabNavigator();
 
 export default function App({navigation}) {
+
+  
   const [isLogin,setIsLogin]=useState(null);
   const [accessToken,setAccessToken]=useState('');
   const [userId,setUserId]=useState('');
@@ -28,8 +30,8 @@ export default function App({navigation}) {
       setIsLogin(false);
     }
 }
+
   useEffect(() => {
-    
     // AsyncStorage에 저장된 데이터가 있다면, 불러온다.
     getData();
     
diff --git a/assets/fonts/NotoSansKR-Black.ttf b/assets/fonts/NotoSansKR-Black.ttf
new file mode 100644
index 0000000..3e0ac2d
Binary files /dev/null and b/assets/fonts/NotoSansKR-Black.ttf differ
diff --git a/assets/fonts/NotoSansKR-Bold.ttf b/assets/fonts/NotoSansKR-Bold.ttf
new file mode 100644
index 0000000..6cf639e
Binary files /dev/null and b/assets/fonts/NotoSansKR-Bold.ttf differ
diff --git a/assets/fonts/NotoSansKR-ExtraBold.ttf b/assets/fonts/NotoSansKR-ExtraBold.ttf
new file mode 100644
index 0000000..a2e47fd
Binary files /dev/null and b/assets/fonts/NotoSansKR-ExtraBold.ttf differ
diff --git a/assets/fonts/NotoSansKR-ExtraLight.ttf b/assets/fonts/NotoSansKR-ExtraLight.ttf
new file mode 100644
index 0000000..a0ef172
Binary files /dev/null and b/assets/fonts/NotoSansKR-ExtraLight.ttf differ
diff --git a/assets/fonts/NotoSansKR-Light.ttf b/assets/fonts/NotoSansKR-Light.ttf
new file mode 100644
index 0000000..db0a223
Binary files /dev/null and b/assets/fonts/NotoSansKR-Light.ttf differ
diff --git a/assets/fonts/NotoSansKR-Medium.ttf b/assets/fonts/NotoSansKR-Medium.ttf
new file mode 100644
index 0000000..5311c8a
Binary files /dev/null and b/assets/fonts/NotoSansKR-Medium.ttf differ
diff --git a/assets/fonts/NotoSansKR-Regular.ttf b/assets/fonts/NotoSansKR-Regular.ttf
new file mode 100644
index 0000000..1b14d32
Binary files /dev/null and b/assets/fonts/NotoSansKR-Regular.ttf differ
diff --git a/assets/fonts/NotoSansKR-SemiBold.ttf b/assets/fonts/NotoSansKR-SemiBold.ttf
new file mode 100644
index 0000000..616bb09
Binary files /dev/null and b/assets/fonts/NotoSansKR-SemiBold.ttf differ
diff --git a/assets/fonts/NotoSansKR-Thin.ttf b/assets/fonts/NotoSansKR-Thin.ttf
new file mode 100644
index 0000000..73ec7bc
Binary files /dev/null and b/assets/fonts/NotoSansKR-Thin.ttf differ
diff --git a/components/MessageBox.js b/components/MessageBox.js
index 24bcc9a..c87c613 100644
--- a/components/MessageBox.js
+++ b/components/MessageBox.js
@@ -62,7 +62,7 @@ const MessageBox = ({navigation}) => {
     <View style={styles.container}>
       <StatusBar style="auto" />
       <Image source={images.inbox} style={commomStyle.backgroundImage}/>
-      <View style={{ marginVertical: 60}}></View>
+      <View style={{ marginVertical: 60 }}></View>
       <ScrollView contentContainerStyle={styles.scrollViewContainer}>
       {messages.map((message) => (
         <View style={styles.messageContainer}>
@@ -95,70 +95,43 @@ export default MessageBox;
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    //flexDirection: 'column', // 수평으로 배치하기 위해 flexDirection를 row로 설정
     padding: 10,
     backgroundColor: color.bg,
-    // backgroundColor: "#FAF3EB",
   },
   messageContainer: {
     flexDirection: 'row',
     flex: 0.6,
-    backgroundColor: '#D2E0FB',
+    backgroundColor: '#E8EDF4',
     padding: 10,
     paddingVertical: 18,
     borderRadius: 20,
     width: "100%",
-    // borderWidth: 2,
-    // borderBottomWidth: 2,
-    borderColor:"#D2E0FB",
+    borderColor:"#E8F1F9",
     borderStyle: 'solid',
-    marginBottom: 15,
+    marginBottom: 10,
   },
   scrollViewContainer:{
-    // backgroundColor:'green',
     alignItems: 'center',
-    // marginTop:15,
     padding:10,
-    //width: SCREEN_WIDTH-60,
-		//height: SCREEN_HEIGHT-200,
   },
   messageLeftContainer: {
     flex: 1,
     marginRight:5,
-    // backgroundColor: 'blue',
-    // justifyContent: 'center',
     alignItems: 'center',
   },
   messageRightContainer: {
     flex: 2,
-    // backgroundColor: 'purple',
     justifyContent:'space-between',
-    // flexDirection: 'column',
-  },
-  image: {
-    // height: 100,
-    // width:100,
-    // width: "90%",
-    // height: "100%",
-    // marginLeft: "5%",
   },
+  
   messageText:{
-    // height: 20,
     fontSize: 18,
-    color: '#3B628C',
+    color: '#5E86B1',
     fontWeight:'bold',
-    // backgroundColor: 'pink',
     paddingLeft: 10,
-    // margin: 5,
-    // textAlign: 'center',
   },
   buttonContainer:{
-    //paddingTop: 20,
-    // height: "30%",
-    // marginBottom: 40,
     alignItems:'flex-end',
-    
-    // backgroundColor: "red",
   },
   buttonMargin: {
     marginHorizontal: 8, // Add horizontal margin between buttons
@@ -166,7 +139,7 @@ const styles = StyleSheet.create({
   buttonText: {
     fontSize: 18,
     color: 'white',
-    backgroundColor: '#5E86B1',
+    backgroundColor: '#8EACCD',
     paddingHorizontal:10,
     paddingVertical:5,
     borderRadius: 20, 
diff --git a/package.json b/package.json
index 2e703e9..36bfb54 100644
--- a/package.json
+++ b/package.json
@@ -21,10 +21,13 @@
     "expo-media-library": "~15.4.1",
     "expo-permissions": "~14.2.1",
     "expo-status-bar": "~1.6.0",
+    "link": "^1.5.1",
     "react": "18.2.0",
-    "react-native": "0.72.4",
+    "react-native": "^0.72.4",
+    "react-native-asset": "^2.1.1",
     "react-native-calendars": "^1.1300.0",
     "react-native-dropdown-picker": "^5.4.6",
+    "react-native-global-props": "^1.1.5",
     "react-native-material-dropdown": "^0.11.1",
     "react-native-safe-area-context": "4.6.3",
     "react-native-screens": "~3.22.0",
diff --git a/react-native.config.js b/react-native.config.js
new file mode 100644
index 0000000..029a912
--- /dev/null
+++ b/react-native.config.js
@@ -0,0 +1,7 @@
+module.exports = {
+  project: {
+      ios: {},
+      android: {},
+  },
+  assets: ['./assets/fonts/'],
+};
\ No newline at end of file