@pop-ui/core 0.0.10 → 0.0.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/README.md +184 -0
  2. package/dist/assets/PretendardVariable.woff2 +0 -0
  3. package/dist/assets/core-O7aPPk54.css +1 -0
  4. package/dist/core.js +490 -463
  5. package/dist/core.umd.cjs +1 -1
  6. package/package.json +138 -65
  7. package/dist/components/Alert/Alert.stories.js +0 -18
  8. package/dist/components/Alert/index.js +0 -38
  9. package/dist/components/Button/Button.stories.js +0 -42
  10. package/dist/components/Button/index.js +0 -33
  11. package/dist/components/Checkbox/Checkbox.stories.js +0 -14
  12. package/dist/components/Checkbox/index.js +0 -27
  13. package/dist/components/DatePicker/DatePicker.stories.js +0 -27
  14. package/dist/components/DatePicker/index.js +0 -29
  15. package/dist/components/Dropdown/Dropdown.stories.js +0 -16
  16. package/dist/components/Dropdown/index.js +0 -50
  17. package/dist/components/ImageUploader/ImageUploader.stories.js +0 -9
  18. package/dist/components/ImageUploader/index.js +0 -37
  19. package/dist/components/Modal/Modal.stories.js +0 -13
  20. package/dist/components/Modal/index.js +0 -25
  21. package/dist/components/Pagination/Pagination.stories.js +0 -14
  22. package/dist/components/Pagination/index.js +0 -56
  23. package/dist/components/Radio/Radio.stories.js +0 -14
  24. package/dist/components/Radio/index.js +0 -19
  25. package/dist/components/SearchBar/SearchBar.stories.js +0 -16
  26. package/dist/components/SearchBar/index.js +0 -46
  27. package/dist/components/SegmentButton/SegmentButton.stories.js +0 -14
  28. package/dist/components/SegmentButton/index.js +0 -24
  29. package/dist/components/Tab/Tab.stories.js +0 -28
  30. package/dist/components/Tab/index.js +0 -18
  31. package/dist/components/Table/Table.stories.js +0 -127
  32. package/dist/components/Table/index.js +0 -129
  33. package/dist/components/TextField/TextField.stories.js +0 -36
  34. package/dist/components/TextField/index.js +0 -60
  35. package/dist/components/TimePicker/TimePicker.stories.js +0 -13
  36. package/dist/components/TimePicker/index.js +0 -30
  37. package/dist/components/Toggle/Toggle.stories.js +0 -15
  38. package/dist/components/Toggle/index.js +0 -41
  39. package/dist/components/Tooltip/Tooltip.stories.js +0 -24
  40. package/dist/components/Tooltip/index.js +0 -13
  41. package/dist/components/index.js +0 -17
  42. package/dist/components/shared/styles.js +0 -219
  43. package/dist/core.css +0 -1
  44. package/dist/helpers/checkMessage/checkMessage.test.js +0 -9
  45. package/dist/helpers/checkMessage/index.js +0 -8
  46. package/dist/index.js +0 -1
  47. package/dist/types/components/Alert/Alert.stories.d.ts +0 -3
  48. package/dist/types/components/Alert/index.d.ts +0 -17
  49. package/dist/types/components/Button/Button.stories.d.ts +0 -7
  50. package/dist/types/components/Button/index.d.ts +0 -14
  51. package/dist/types/components/Checkbox/Checkbox.stories.d.ts +0 -3
  52. package/dist/types/components/Checkbox/index.d.ts +0 -11
  53. package/dist/types/components/DatePicker/DatePicker.stories.d.ts +0 -5
  54. package/dist/types/components/DatePicker/index.d.ts +0 -16
  55. package/dist/types/components/Dropdown/Dropdown.stories.d.ts +0 -3
  56. package/dist/types/components/Dropdown/index.d.ts +0 -23
  57. package/dist/types/components/ImageUploader/ImageUploader.stories.d.ts +0 -3
  58. package/dist/types/components/ImageUploader/index.d.ts +0 -22
  59. package/dist/types/components/Modal/Modal.stories.d.ts +0 -3
  60. package/dist/types/components/Modal/index.d.ts +0 -13
  61. package/dist/types/components/Pagination/Pagination.stories.d.ts +0 -3
  62. package/dist/types/components/Pagination/index.d.ts +0 -18
  63. package/dist/types/components/Radio/Radio.stories.d.ts +0 -3
  64. package/dist/types/components/Radio/index.d.ts +0 -11
  65. package/dist/types/components/SearchBar/SearchBar.stories.d.ts +0 -3
  66. package/dist/types/components/SearchBar/index.d.ts +0 -27
  67. package/dist/types/components/SegmentButton/SegmentButton.stories.d.ts +0 -3
  68. package/dist/types/components/SegmentButton/index.d.ts +0 -13
  69. package/dist/types/components/Tab/Tab.stories.d.ts +0 -3
  70. package/dist/types/components/Tab/index.d.ts +0 -24
  71. package/dist/types/components/Table/Table.stories.d.ts +0 -5
  72. package/dist/types/components/Table/index.d.ts +0 -41
  73. package/dist/types/components/TextField/TextField.stories.d.ts +0 -5
  74. package/dist/types/components/TextField/index.d.ts +0 -35
  75. package/dist/types/components/TimePicker/TimePicker.stories.d.ts +0 -3
  76. package/dist/types/components/TimePicker/index.d.ts +0 -11
  77. package/dist/types/components/Toggle/Toggle.stories.d.ts +0 -3
  78. package/dist/types/components/Toggle/index.d.ts +0 -17
  79. package/dist/types/components/Tooltip/Tooltip.stories.d.ts +0 -3
  80. package/dist/types/components/Tooltip/index.d.ts +0 -13
  81. package/dist/types/components/index.d.ts +0 -17
  82. package/dist/types/components/shared/styles.d.ts +0 -86
  83. package/dist/types/helpers/checkMessage/checkMessage.test.d.ts +0 -1
  84. package/dist/types/helpers/checkMessage/index.d.ts +0 -1
  85. package/dist/types/index.d.ts +0 -1
package/README.md ADDED
@@ -0,0 +1,184 @@
1
+ # @pop-ui/core
2
+
3
+ 사내 디자인 시스템을 위한 React UI 컴포넌트 라이브러리입니다.
4
+
5
+ ## 설치
6
+
7
+ ### 기본 설치
8
+
9
+ 모든 컴포넌트를 사용하기 위한 필수 패키지를 설치합니다.
10
+
11
+ ```bash
12
+ yarn add @pop-ui/core react react-dom @mantine/core @mantine/hooks @emotion/react @emotion/cache @emotion/serialize @emotion/utils
13
+ ```
14
+
15
+ ### 컴포넌트별 추가 패키지
16
+
17
+ 일부 컴포넌트는 추가 패키지가 필요합니다. 사용하는 컴포넌트에 따라 필요한 패키지를 설치하세요.
18
+
19
+ #### Button, TextField, SearchBar, Dropdown, Checkbox, Radio, Toggle
20
+
21
+ 추가 패키지 불필요 (기본 설치만으로 사용 가능)
22
+
23
+ #### DatePicker, TimePicker
24
+
25
+ ```bash
26
+ yarn add @mantine/dates dayjs
27
+ ```
28
+
29
+ #### ImageUploader
30
+
31
+ ```bash
32
+ yarn add @mantine/dropzone
33
+ ```
34
+
35
+ #### Table
36
+
37
+ ```bash
38
+ yarn add react-beautiful-dnd @tabler/icons-react
39
+ ```
40
+
41
+ #### Pagination
42
+
43
+ ```bash
44
+ yarn add @tabler/icons-react
45
+ ```
46
+
47
+ #### Modal
48
+
49
+ ```bash
50
+ yarn add @mantine/modals
51
+ ```
52
+
53
+ #### Alert, Tooltip
54
+
55
+ ```bash
56
+ yarn add @mantine/notifications
57
+ ```
58
+
59
+ #### 에디터 컴포넌트
60
+
61
+ ```bash
62
+ yarn add @mantine/tiptap @tiptap/react @tiptap/starter-kit @tiptap/extension-link
63
+ ```
64
+
65
+ ## 사용 방법
66
+
67
+ ### React (Vite)
68
+
69
+ ```tsx
70
+ import { Button, TextField } from '@pop-ui/core';
71
+
72
+ function App() {
73
+ return (
74
+ <div>
75
+ <Button styleType="primary" size="md">
76
+ 클릭하세요
77
+ </Button>
78
+ <TextField placeholder="텍스트를 입력하세요" />
79
+ </div>
80
+ );
81
+ }
82
+ ```
83
+
84
+ ### Next.js
85
+
86
+ Next.js에서 사용하려면 Mantine Provider 설정이 필요합니다.
87
+
88
+ #### App Router (Next.js 13+)
89
+
90
+ 1. Providers 컴포넌트 생성:
91
+
92
+ ```tsx
93
+ // app/providers.tsx
94
+ 'use client'
95
+
96
+ import { MantineProvider } from '@mantine/core'
97
+ import '@mantine/core/styles.css'
98
+
99
+ export function Providers({ children }: { children: React.ReactNode }) {
100
+ return <MantineProvider>{children}</MantineProvider>
101
+ }
102
+ ```
103
+
104
+ 2. Layout에서 사용:
105
+
106
+ ```tsx
107
+ // app/layout.tsx
108
+ import { Providers } from './providers'
109
+
110
+ export default function RootLayout({
111
+ children,
112
+ }: {
113
+ children: React.ReactNode
114
+ }) {
115
+ return (
116
+ <html lang="ko">
117
+ <body>
118
+ <Providers>{children}</Providers>
119
+ </body>
120
+ </html>
121
+ )
122
+ }
123
+ ```
124
+
125
+ 3. 컴포넌트 사용:
126
+
127
+ ```tsx
128
+ // app/page.tsx
129
+ 'use client'
130
+
131
+ import { Button } from '@pop-ui/core'
132
+
133
+ export default function Page() {
134
+ return <Button onClick={() => alert('클릭!')}>클릭하세요</Button>
135
+ }
136
+ ```
137
+
138
+ #### Pages Router (Next.js 12 이하)
139
+
140
+ ```tsx
141
+ // pages/_app.tsx
142
+ import { MantineProvider } from '@mantine/core'
143
+ import '@mantine/core/styles.css'
144
+ import type { AppProps } from 'next/app'
145
+
146
+ export default function App({ Component, pageProps }: AppProps) {
147
+ return (
148
+ <MantineProvider>
149
+ <Component {...pageProps} />
150
+ </MantineProvider>
151
+ )
152
+ }
153
+ ```
154
+
155
+ ## 제공 컴포넌트
156
+
157
+ - **Button** - 다양한 스타일의 버튼
158
+ - **TextField** - 텍스트 입력 필드
159
+ - **SearchBar** - 검색 입력 필드
160
+ - **Dropdown** - 드롭다운 선택
161
+ - **Checkbox** - 체크박스
162
+ - **Radio** - 라디오 버튼
163
+ - **Toggle** - 토글 스위치
164
+ - **DatePicker** - 날짜 선택
165
+ - **TimePicker** - 시간 선택
166
+ - **Pagination** - 페이지네이션
167
+ - **Tab** - 탭 메뉴
168
+ - **SegmentButton** - 세그먼트 버튼
169
+ - **Alert** - 알림 메시지
170
+ - **Tooltip** - 툴팁
171
+ - **Table** - 데이터 테이블
172
+ - **Modal** - 모달 다이얼로그
173
+ - **ImageUploader** - 이미지 업로드
174
+
175
+ ## 기술 스택
176
+
177
+ - React 18
178
+ - TypeScript
179
+ - Mantine UI 6.x
180
+ - SCSS Modules
181
+
182
+ ## 라이센스
183
+
184
+ MIT
package/dist/assets/core-O7aPPk54.css ADDED
@@ -0,0 +1 @@
1
+ @font-face{font-family:Pretendard;font-weight:500;font-style:normal;font-display:swap;src:url(./PretendardVariable.woff2) format("woff2-variations")}._baseButton_hyakm_1{cursor:pointer}._baseButton--sizeLg_hyakm_4{font-family:Pretendard;font-size:18;font-weight:700;line-height:130%;height:50px;padding:20;border-radius:6px}._baseButton--sizeMd_hyakm_13{font-family:Pretendard;font-size:16;font-weight:SemiBold;line-height:130%;height:40px;padding:16;border-radius:6px}._baseButton--sizeSm_hyakm_22{font-family:Pretendard;font-size:14;font-weight:SemiBold;line-height:130%;height:30px;padding:12;border-radius:4px}._baseButton--primary_hyakm_31{background-color:#0fd3d8;color:#fff}._baseButton--primary_hyakm_31:focus{background-color:#11badd;color:#fff}._baseButton--primary_hyakm_31:hover{background-color:#11badd;color:#fff}._baseButton--primary_hyakm_31:active{background-color:#07a3c6;color:#fff}._baseButton--primary_hyakm_31:disabled{background-color:#b0b0b0;color:#fff}._baseButton--primaryLine_hyakm_51{background-color:#fff;color:#0fd3d8;border:1px solid #0fd3d8}._baseButton--primaryLine_hyakm_51:focus{background-color:#e7e7e7;color:#11badd;border-color:#11badd}._baseButton--primaryLine_hyakm_51:hover{background-color:#e7e7e7;color:#11badd;border-color:#11badd}._baseButton--primaryLine_hyakm_51:active{background-color:#cdcdcd;color:#07a3c6;border-color:#07a3c6}._baseButton--primaryLine_hyakm_51:disabled{background-color:#b0b0b0;color:#fff}._baseButton--basic_hyakm_75{background-color:#fff;color:#4a4a4a;border:1px solid #b0b0b0}._baseButton--basic_hyakm_75:focus{background-color:#e7e7e7;color:#4a4a4a;border-color:#b0b0b0}._baseButton--basic_hyakm_75:hover{background-color:#e7e7e7;color:#4a4a4a;border-color:#b0b0b0}._baseButton--basic_hyakm_75:active{background-color:#cdcdcd;color:#4a4a4a;border-color:#b0b0b0}._baseButton--basic_hyakm_75:disabled{background-color:#b0b0b0;color:#fff}._baseButton--danger_hyakm_99{background-color:#fa5252;color:#fff}._baseButton--danger_hyakm_99:focus{background-color:#e03131;color:#fff}._baseButton--danger_hyakm_99:hover{background-color:#e03131;color:#fff}._baseButton--danger_hyakm_99:active{background-color:#c92a2a;color:#fff}._baseButton--danger_hyakm_99:disabled{background-color:#b0b0b0;color:#fff}._baseButton--setting_hyakm_119{background-color:#9b9b9b;color:#fff}._baseButton--setting_hyakm_119:focus{background-color:gray;color:#fff}._baseButton--setting_hyakm_119:hover{background-color:gray;color:#fff}._baseButton--setting_hyakm_119:active{background-color:#666;color:#fff}._baseButton--setting_hyakm_119:disabled{background-color:#b0b0b0;color:#fff}._baseButton--warning_hyakm_139{background-color:#fa5252;color:#fff}._baseButton--warning_hyakm_139:focus{background-color:#e03131;color:#fff}._baseButton--warning_hyakm_139:hover{background-color:#e03131;color:#fff}._baseButton--warning_hyakm_139:active{background-color:#c92a2a;color:#fff}._baseButton--warning_hyakm_139:disabled{background-color:#b0b0b0;color:#fff}._left_label_textfield_vch3r_1{display:flex;flex-direction:row;gap:20px}._top_label_textfield_vch3r_7{display:flex;flex-direction:column}._sm_label_vch3r_12{font-family:Pretendard;font-size:14px;font-weight:600;letter-spacing:0em;text-align:left;margin:8px 3px}._md_label_vch3r_21{font-family:Pretendard;font-size:16px;font-weight:600;letter-spacing:0em;text-align:left;margin:12px 4px}._lg_label_vch3r_30{font-family:Pretendard;font-size:18px;font-weight:600;letter-spacing:0em;text-align:left;margin:16px 4px}._sm_tooltip_vch3r_39{width:14px;height:14px}._md_tooltip_vch3r_44{width:16px;height:16px}._lg_tooltip_vch3r_49{width:18px;height:18px}._textfield_wrapper_vch3r_54{position:relative}._text_counter_vch3r_58{position:absolute;bottom:-16px;right:0;font-family:Pretendard;font-size:12px;font-weight:500;letter-spacing:0em;text-align:right;color:gray}._textarea_vch3r_70 textarea:hover{outline:1.5px solid #72eef1;border-color:transparent}._textarea_vch3r_70 textarea:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._sm_textfield_vch3r_79 input{height:30px;min-height:30px;padding:8px;font-size:14px}._sm_textfield_vch3r_79 input:hover{outline:1.5px solid #72eef1;border-color:transparent}._sm_textfield_vch3r_79 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._md_textfield_vch3r_94 input{height:40px;min-height:40px;padding:12px;font-size:14px}._md_textfield_vch3r_94 input:hover{outline:1.5px solid #72eef1;border-color:transparent}._md_textfield_vch3r_94 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._lg_textfield_vch3r_109 input{height:50px;min-height:50px;padding:16px;font-size:16px}._lg_textfield_vch3r_109 input:hover{outline:1.5px solid #72eef1;border-color:transparent}._lg_textfield_vch3r_109 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._input_description_vch3r_124{margin-top:8px}._input_error_msg_vch3r_128{margin-top:4px}._clear_button_vch3r_132{display:flex;align-items:center;justify-content:center;cursor:pointer}._left_label_textfield_1kz7w_1{display:flex;flex-direction:row;gap:20px}._top_label_textfield_1kz7w_7{display:flex;flex-direction:column}._sm_label_1kz7w_12{font-family:Pretendard;font-size:14px;font-weight:600;letter-spacing:0em;text-align:left;margin:8px 3px}._md_label_1kz7w_21{font-family:Pretendard;font-size:16px;font-weight:600;letter-spacing:0em;text-align:left;margin:12px 4px}._lg_label_1kz7w_30{font-family:Pretendard;font-size:18px;font-weight:600;letter-spacing:0em;text-align:left;margin:16px 4px}._sm_tooltip_1kz7w_39{width:14px;height:14px}._md_tooltip_1kz7w_44{width:16px;height:16px}._lg_tooltip_1kz7w_49{width:18px;height:18px}._sm_textfield_1kz7w_54 input{height:30px;padding:8px;font-size:14px;min-height:30px}._sm_textfield_1kz7w_54 input:hover{outline:1.5px solid #72eef1;border-color:transparent}._sm_textfield_1kz7w_54 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._md_textfield_1kz7w_69 input{height:40px;padding:12px;font-size:14px;min-height:40px}._md_textfield_1kz7w_69 input:hover{outline:1.5px solid #72eef1;border-color:transparent}._md_textfield_1kz7w_69 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._lg_textfield_1kz7w_84 input{height:50px;padding:16px;font-size:16px;min-height:50px}._lg_textfield_1kz7w_84 input:hover{outline:1.5px solid #72eef1;border-color:transparent}._lg_textfield_1kz7w_84 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._input_description_1kz7w_99{margin-top:8px}._input_error_msg_1kz7w_103{margin-top:4px}._sm_checkbox_16c4m_1 input:hover{background-color:#edfcff;border-color:#72eef1;border-width:2px}._sm_checkbox_16c4m_1 input:checked{background-color:#0fd3d8;border-color:#0fd3d8}._sm_checkbox_16c4m_1 input:disabled{background-color:#e7e7e7;border-color:#d8d8d8;border-width:2px}._sm_checkbox_16c4m_1 input{width:18px;height:18px}._sm_checkbox_16c4m_1 label{height:18px;color:#333;font-family:Pretendard;font-size:16px;font-style:normal;font-weight:500;display:flex;align-items:center}._sm_checkbox_16c4m_1 div{color:gray;font-family:Pretendard;font-size:12px;font-style:normal;font-weight:500}._md_checkbox_16c4m_37 input:hover{background-color:#edfcff;border-color:#72eef1;border-width:2px}._md_checkbox_16c4m_37 input:checked{background-color:#0fd3d8;border-color:#0fd3d8}._md_checkbox_16c4m_37 input:disabled{background-color:#e7e7e7;border-color:#d8d8d8;border-width:2px}._md_checkbox_16c4m_37 input{width:24px;height:24px}._md_checkbox_16c4m_37 label{height:24px;color:#333;font-family:Pretendard;font-size:18px;font-style:normal;font-weight:600;display:flex;align-items:center}._md_checkbox_16c4m_37 div{color:gray;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500}._lg_checkbox_16c4m_73 input:hover{background-color:#edfcff;border-color:#72eef1;border-width:2px}._lg_checkbox_16c4m_73 input:checked{background-color:#0fd3d8;border-color:#0fd3d8}._lg_checkbox_16c4m_73 input:disabled{background-color:#e7e7e7;border-color:#d8d8d8;border-width:2px}._lg_checkbox_16c4m_73 input{width:32px;height:32px}._lg_checkbox_16c4m_73 label{height:32px;color:#333;font-family:Pretendard;font-size:24px;font-style:normal;font-weight:700;display:flex;align-items:center}._lg_checkbox_16c4m_73 div{color:gray;font-family:Pretendard;font-size:16px;font-style:normal;font-weight:500}._sm_radio_11yia_1 input:hover{background-color:#edfcff;border-color:#72eef1;border-width:2px}._sm_radio_11yia_1 input:checked{background-color:#0fd3d8;border-color:#0fd3d8}._sm_radio_11yia_1 input:disabled{background-color:#e7e7e7;border-color:#d8d8d8;border-width:2px}._sm_radio_11yia_1 input{width:18px;height:18px}._sm_radio_11yia_1 label{height:18px;color:#333;font-family:Pretendard;font-size:16px;font-style:normal;font-weight:500;display:flex;align-items:center}._sm_radio_11yia_1 div{color:gray;font-family:Pretendard;font-size:12px;font-style:normal;font-weight:500}._md_radio_11yia_37 input:hover{background-color:#edfcff;border-color:#72eef1;border-width:2px}._md_radio_11yia_37 input:checked{background-color:#0fd3d8;border-color:#0fd3d8}._md_radio_11yia_37 input:disabled{background-color:#e7e7e7;border-color:#d8d8d8;border-width:2px}._md_radio_11yia_37 input{width:24px;height:24px}._md_radio_11yia_37 label{height:24px;color:#333;font-family:Pretendard;font-size:18px;font-style:normal;font-weight:600;display:flex;align-items:center}._md_radio_11yia_37 div{color:gray;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500}._lg_radio_11yia_73 input:hover{background-color:#edfcff;border-color:#72eef1;border-width:2px}._lg_radio_11yia_73 input:checked{background-color:#0fd3d8;border-color:#0fd3d8}._lg_radio_11yia_73 input:disabled{background-color:#e7e7e7;border-color:#d8d8d8;border-width:2px}._lg_radio_11yia_73 input{width:32px;height:32px}._lg_radio_11yia_73 label{height:32px;color:#333;font-family:Pretendard;font-size:24px;font-style:normal;font-weight:700;display:flex;align-items:center}._lg_radio_11yia_73 div{color:gray;font-family:Pretendard;font-size:16px;font-style:normal;font-weight:500}._sm_toggle_1xeob_1 label{height:18px;color:#333;font-family:Pretendard;font-size:16px;font-style:normal;font-weight:500;display:flex;align-items:center}._sm_toggle_1xeob_1 div{color:gray;font-family:Pretendard;font-size:12px;font-style:normal;font-weight:500}._md_toggle_1xeob_19 label{height:24px;color:#333;font-family:Pretendard;font-size:18px;font-style:normal;font-weight:600;display:flex;align-items:center}._md_toggle_1xeob_19 div{color:gray;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500}._lg_toggle_1xeob_37 label{height:32px;color:#333;font-family:Pretendard;font-size:24px;font-style:normal;font-weight:700;display:flex;align-items:center}._lg_toggle_1xeob_37 div{color:gray;font-family:Pretendard;font-size:16px;font-style:normal;font-weight:500}._sm_textfield_1jcnj_1 button{height:30px;min-height:30px;padding:8px;font-size:14px;line-height:100%}._sm_textfield_1jcnj_1 button:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._sm_textfield_1jcnj_1 button:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._sm_textfield_1jcnj_1 button[data-in-range]{background-color:#edfcff}._sm_textfield_1jcnj_1 button[data-selected]{background-color:#0fd3d8}._sm_textfield_1jcnj_1 button[data-selected]:hover{outline:1.5px solid #72eef1;background-color:#edfcff;color:#000;border-color:transparent}._sm_textfield_1jcnj_1 input:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._sm_textfield_1jcnj_1 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._sm_textfield_1jcnj_1 input[data-in-range]{background-color:#edfcff}._sm_textfield_1jcnj_1 input[data-selected]{background-color:#0fd3d8}._sm_textfield_1jcnj_1 input[data-selected]:hover{outline:1.5px solid #72eef1;background-color:#edfcff;color:#000;border-color:transparent}._md_textfield_1jcnj_51 button{height:40px;min-height:40px;padding:12px;font-size:14px;line-height:100%}._md_textfield_1jcnj_51 button:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._md_textfield_1jcnj_51 button:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._md_textfield_1jcnj_51 button[data-in-range]{background-color:#edfcff}._md_textfield_1jcnj_51 button[data-selected]{background-color:#0fd3d8}._md_textfield_1jcnj_51 button[data-selected]:hover{outline:1.5px solid #72eef1;background-color:#edfcff;color:#000;border-color:transparent}._md_textfield_1jcnj_51 input:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._md_textfield_1jcnj_51 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._md_textfield_1jcnj_51 input[data-in-range]{background-color:#edfcff}._md_textfield_1jcnj_51 input[data-selected]{background-color:#0fd3d8}._md_textfield_1jcnj_51 input[data-selected]:hover{outline:1.5px solid #72eef1;background-color:#edfcff;color:#000;border-color:transparent}._lg_textfield_1jcnj_101 button{height:50px;min-height:50px;padding:16px;font-size:16px;line-height:100%}._lg_textfield_1jcnj_101 button:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._lg_textfield_1jcnj_101 button:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._lg_textfield_1jcnj_101 button[data-in-range]{background-color:#edfcff}._lg_textfield_1jcnj_101 button[data-selected]{background-color:#0fd3d8}._lg_textfield_1jcnj_101 button[data-selected]:hover{outline:1.5px solid #72eef1;background-color:#edfcff;color:#000;border-color:transparent}._lg_textfield_1jcnj_101 input:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._lg_textfield_1jcnj_101 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._lg_textfield_1jcnj_101 input[data-in-range]{background-color:#edfcff}._lg_textfield_1jcnj_101 input[data-selected]{background-color:#0fd3d8}._lg_textfield_1jcnj_101 input[data-selected]:hover{outline:1.5px solid #72eef1;background-color:#edfcff;color:#000;border-color:transparent}._sm_textfield_30pfv_1 input{height:30px;min-height:30px;padding:8px;font-size:14px;line-height:100%}._sm_textfield_30pfv_1 input:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._sm_textfield_30pfv_1 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._md_textfield_30pfv_18 input{height:40px;min-height:40px;padding:12px;font-size:14px;line-height:100%}._md_textfield_30pfv_18 input:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._md_textfield_30pfv_18 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}._lg_textfield_30pfv_35 input{height:50px;min-height:50px;padding:16px;font-size:16px;line-height:100%}._lg_textfield_30pfv_35 input:hover{outline:1.5px solid #72eef1;border-color:transparent;background-color:#fff}._lg_textfield_30pfv_35 input:focus-within{outline:1.5px solid #0fd3d8;border-color:transparent}@font-face{font-family:Pretendard;font-weight:500;font-style:normal;font-display:swap;src:url(./PretendardVariable.woff2) format("woff2-variations")}._pagination_9fk1g_16{display:flex;flex-direction:row;width:100%;align-items:center;justify-content:center;flex-wrap:wrap}._pagination_9fk1g_16 ._page_index_9fk1g_24{display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;border-radius:8px;gap:10px;font-family:Pretendard;font-size:14px;font-weight:400;letter-spacing:0px;text-align:center;color:gray;border:none;cursor:pointer}._pagination_9fk1g_16 ._page_index_9fk1g_24:hover{background-color:#f6f6f6}._pagination_9fk1g_16 ._page_index_9fk1g_24:active{background-color:#e7e7e7}._pagination_9fk1g_16 ._page_index_9fk1g_24{background-color:#fff0}._pagination_9fk1g_16 ._page_index_active_9fk1g_50{display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;border-radius:8px;gap:10px;font-family:Pretendard;font-size:14px;font-weight:400;letter-spacing:0px;text-align:center;color:gray;border:none;cursor:pointer}._pagination_9fk1g_16 ._page_index_active_9fk1g_50:hover{background-color:#f6f6f6}._pagination_9fk1g_16 ._page_index_active_9fk1g_50:active{background-color:#e7e7e7}._pagination_9fk1g_16 ._page_index_active_9fk1g_50{font-weight:700;background-color:#e7e7e7;color:#4a4a4a}._pagination_9fk1g_16 ._arrow_9fk1g_78{display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;border-radius:8px;gap:10px;font-family:Pretendard;font-size:14px;font-weight:400;letter-spacing:0px;text-align:center;color:gray;border:none;cursor:pointer}._pagination_9fk1g_16 ._arrow_9fk1g_78:hover{background-color:#f6f6f6}._pagination_9fk1g_16 ._arrow_9fk1g_78:active{background-color:#e7e7e7}._pagination_9fk1g_16 ._arrow_9fk1g_78{border:1px solid #b0b0b0;margin:0 8px;width:40px;height:40px;background-color:#fff}._tab_title_list_1o4cm_1{border-bottom:2px solid #d8d8d8}._tab_title_list_1o4cm_1 button{margin-bottom:7px;display:flex;align-items:center;text-align:center;font-family:Pretendard;font-size:18px;font-style:normal;font-weight:700;height:50px;color:#b0b0b0;border-radius:6px;border:none;padding:0 20px;cursor:pointer}._tab_title_list_1o4cm_1 button:hover{background-color:#f6f6f6}._tab_title_list_1o4cm_1 button ._border_bottom_1o4cm_23{position:absolute;bottom:-9px;left:0;width:100%}._tab_title_list_1o4cm_1 button[data-active]{position:relative;color:#006180}._tab_title_list_1o4cm_1 button[data-active] ._border_bottom_1o4cm_23{position:absolute;bottom:-9px;left:0;width:100%;border-bottom:2px solid #006180;border-color:#006180}._sm_segment_button_22f7n_1 label{box-sizing:border-box;display:flex;align-items:center;color:#9b9b9b}._sm_segment_button_22f7n_1 label[data-active]{color:#4a4a4a}._sm_segment_button_22f7n_1 label{height:30px;padding:0 8px;font-size:14px}._md_segment_button_22f7n_16 label{box-sizing:border-box;display:flex;align-items:center;color:#9b9b9b}._md_segment_button_22f7n_16 label[data-active]{color:#4a4a4a}._md_segment_button_22f7n_16 label{height:40px;padding:0 12px;font-size:14px}._lg_segment_button_22f7n_31 label{box-sizing:border-box;display:flex;align-items:center;color:#9b9b9b}._lg_segment_button_22f7n_31 label[data-active]{color:#4a4a4a}._lg_segment_button_22f7n_31 label{height:50px;padding:0 16px;font-size:16px}._light_success_nikyj_1{background-color:#efffef;border-radius:6px;border:1.5px solid #30cc37}._light_success_nikyj_1 span{font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%;color:#30cc37}._light_success_nikyj_1 div{color:#333;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%}._light_error_nikyj_23{background-color:#fef3f2;border-radius:6px;border:1.5px solid #fa5252}._light_error_nikyj_23 span{font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%;color:#fa5252}._light_error_nikyj_23 div{color:#333;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%}._fill_success_nikyj_45{background-color:#d1fcd3;border-radius:6px}._fill_success_nikyj_45 span{font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%;color:#30cc37}._fill_success_nikyj_45 div{color:#333;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%}._fill_error_nikyj_66{background-color:#fee4e2;border-radius:6px}._fill_error_nikyj_66 span{font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%;color:#fa5252}._fill_error_nikyj_66 div{color:#333;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%}._tooltip_body_130js_1{display:flex;flex-direction:column}._tooltip_title_130js_6{font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%;color:#fff;margin-bottom:8px}._tooltip_content_130js_16{font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:150%;color:#fff}._table_1pmr3_1{width:max-content;border-collapse:collapse}._table_1pmr3_1 ._tr_gray_1pmr3_5{background-color:#fbfbfb}._table_1pmr3_1 th,._table_1pmr3_1 td{font-family:Pretendard;font-size:14px;font-style:normal;box-sizing:border-box;height:52px;text-align:center;padding:16px}@media (max-width: 767px){._table_1pmr3_1 th,._table_1pmr3_1 td{white-space:nowrap}}._table_1pmr3_1 ._th_cell_1pmr3_24>div{color:#333;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:700;line-height:100%;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:center}._table_1pmr3_1 ._th_cell_1pmr3_24{border-bottom:1px solid #d8d8d8;background-color:#f6f6f6}._table_1pmr3_1 ._th_cell_sortable_1pmr3_41>div{color:#333;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:700;line-height:100%;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:center}._table_1pmr3_1 ._th_cell_sortable_1pmr3_41 img{width:14px;height:14px;margin-left:4px}._table_1pmr3_1 ._th_cell_sortable_1pmr3_41{border-bottom:1px solid #d8d8d8;background-color:#f6f6f6}._table_1pmr3_1 ._th_cell_sortable_1pmr3_41:hover{cursor:pointer;background-color:#e7e7e7}._table_1pmr3_1 ._td_cell_1pmr3_67{color:#4a4a4a;font-family:Pretendard;font-size:14px;font-style:normal;font-weight:500;line-height:140%;border-bottom:1px solid #e7e7e7}._table_1pmr3_1 ._td_cell_1pmr3_67>div{display:flex;align-items:center;justify-content:center}._image_uploader_169lo_1{width:200px;height:200px;border:none;border-radius:6px;background-color:#edfcff;padding:0;overflow:hidden}._image_uploader_169lo_1[data-accept]{opacity:.7}._image_uploader_169lo_1:hover{background-color:#c8fdff}._image_uploader_169lo_1 ._preview_169lo_16{object-fit:cover;width:100%;height:100%}._image_uploader_169lo_1 div{display:flex;width:100%;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:12px}._image_uploader_169lo_1 div span{color:#07a3c6;text-align:center;font-family:Pretendard;font-size:16px;font-style:normal;font-weight:500;line-height:140%}._image_uploader_wrapper_169lo_40{position:relative;width:fit-content;height:fit-content}._image_uploader_wrapper_169lo_40 ._file_clear_button_169lo_45{position:absolute;display:flex;align-items:center;justify-content:center;top:-12px;right:-12px;width:24px;height:24px;z-index:1;cursor:pointer}._image_uploader_wrapper_169lo_40 ._file_clear_button_169lo_45:hover{opacity:.9}