@edu-tosel/design 1.0.275 → 1.0.276

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.
@@ -1,712 +1,712 @@
1
- import tailwindcssAnimate from "tailwindcss-animate";
2
- import type { Config } from "tailwindcss";
3
- import type { PluginAPI } from "tailwindcss/types/config";
4
-
5
- // import twElements from "tw-elements/dist/plugin";
6
- // import tailwindcssDirectionalShadows from "tailwindcss-directional-shadows";
7
-
8
- export default {
9
- content: [
10
- // "./node_modules/tw-elements/dist/js/**/*.js",
11
- "./index.html",
12
- "./src/**/*.{js,jsx,ts,tsx}",
13
- ],
14
- theme: {
15
- extend: {
16
- fontFamily: {
17
- "pretendard-medium": ["pretendard-medium"],
18
- "pretendard-bold": ["pretendard-bold"],
19
- "pretendard-light": ["pretendard-light"],
20
- "pretendard-var": ["PretendardVariable"],
21
- kostar: ["kostar"],
22
- nicomoji: ["nicomoji"],
23
- megrim: ["megrim"],
24
- "times-newer-roman-bold": ["times-newer-roman-bold"],
25
- "times-newer-roman-bolditalic": ["times-newer-roman-bolditalic"],
26
- },
27
- backgroundImage: {
28
- "image-space": "url('/images/space/space.png')",
29
- },
30
- scrollbar: {
31
- hidden: "hidden",
32
- },
33
- boxShadow: {
34
- main: "0 2px 10px 0px rgba(0, 0, 0, 0.14)",
35
- "main-small": "0 0px 5px 0px rgba(0, 0, 0, 0.1)",
36
- "main-hover": "0 10px 12px 0px rgba(0, 0, 0, 0.3)",
37
- "icon-default": "0 3px 7px 0px rgba(0, 0, 0, 0.1)",
38
- "icon-hover": "0 3px 10px 0px rgba(6, 86, 82, 0.38)",
39
- green: "0 0px 10px 0px rgba(16, 86, 82, 0.38)",
40
- },
41
- flex: {
42
- 2: "2 2 0%",
43
- 3: "3 3 0%",
44
- },
45
- keyframes: {
46
- smallBounce: {
47
- "0%, 100%": { transform: "translateY(-5%)" },
48
- "50%": { transform: "translateY(0)" },
49
- },
50
- grow: {
51
- "0%": { height: "60px" },
52
- "100%": { height: "120px" },
53
- },
54
- shrink: {
55
- "0%": { height: "120px" },
56
- "100%": { height: "60px" },
57
- },
58
-
59
- slideBackground: {
60
- "0%, 100%": { backgroundPosition: "left center" },
61
- "50%": { backgroundPosition: "right center" },
62
- },
63
- fadeIn: {
64
- from: { opacity: "0" },
65
- to: { opacity: "1" },
66
- },
67
- fadeOut: {
68
- from: { opacity: "1" },
69
- to: { opacity: "0" },
70
- },
71
- increaseWidth: {
72
- from: { width: "0%" },
73
- to: { width: "33.3%" },
74
- },
75
- decreaseWidth: {
76
- from: { width: "33.3%" },
77
- to: { width: "0%" },
78
- },
79
- },
80
- animation: {
81
- grow: "grow 0.2s ease-in-out forwards",
82
- shrink: "shrink 0.2s ease-in-out forwards",
83
- smallBounce: "smallBounce 1s infinite",
84
- },
85
-
86
- colors: {
87
- "white-off": "#F5F5F5",
88
- "red-burgundy": "#933652",
89
- "crimson-burgundy": "#910023",
90
- "crimson-burgundy-light": "#EDDFE2",
91
- "crimson-dark": "#760023",
92
- "red-crimson": "#760023",
93
- "red-velvet": "#AC647A",
94
- "green-dark": "#105652",
95
- "green-light": "#DFE5E4",
96
- "blue-sky": "#44C5F3",
97
- "blue-navy": "#173A8B",
98
- "blue-navy-light": "#E1E4EB",
99
- "blue-pastel": "#CED6E6",
100
- "violet-light": "#9979F6",
101
- "gray-light": "#F0F0F0",
102
- "gray-light-super": "#D9D9D9",
103
- "gray-medium": "#7F7F7F",
104
- "gray-dim": "#4C4C4C",
105
- "gray-dark": "#4C4C4C",
106
- "silver-lavender": "#E7E9F2",
107
- "silver-latte": "#FBF3E4",
108
- "silver-pale": "#DFD8CA",
109
-
110
- // Brand Colors
111
- "co-green": "#4FCA3E",
112
- "co-green-light": "#DCF4D8",
113
- "ps-pink": "#E3006E",
114
- "ps-pink-light": "#FFBADB",
115
- "st-orange": "#ED6A00",
116
- "st-orange-light": "#F5D2B6",
117
- "ba-yellow": "#FCCE30",
118
- "ba-yellow-light": "#FFEFB7",
119
- "jr-blue": "#52A2DA",
120
- "jr-blue-light": "#D6EEFF",
121
- "hj-blue": "#385EAB",
122
- "hj-blue-light": "#A8BFE5",
123
- "ad-gray": "#4C4C4C",
124
- "ad-gray-light": "#F0F0F0",
125
- // Gradation Colors
126
- },
127
- maxHeight: {
128
- 44: "11rem",
129
- "9/10": "90%",
130
- },
131
- maxWidth: {
132
- 256: "64rem",
133
- 262: "65.5rem",
134
- 290: "72.5rem",
135
- },
136
- spacing: {
137
- "sun-calc": "calc(50% - 6rem)",
138
- 0.5: "0.125rem",
139
- 1: "0.25rem",
140
- 1.25: "0.3125rem",
141
- 1.5: "0.375rem",
142
- 2.125: "0.53125rem",
143
- 2.25: "0.5625rem",
144
- 2.5: "0.625rem",
145
- 2.625: "0.65625rem",
146
- 2.75: "0.6875rem",
147
- 3.5: "0.875rem",
148
- 3.75: "0.9375rem",
149
- 4.25: "1.0625rem",
150
- 4.375: "1.09375rem",
151
- 4.5: "1.125rem",
152
- 4.75: "1.1875rem",
153
- 5.25: "1.3125rem",
154
- 5.5: "1.375rem",
155
- 5.75: "1.4375rem",
156
- 6.25: "1.5625rem",
157
- 6.4: "1.6rem",
158
- 6.5: "1.625rem",
159
- 6.75: "1.6875rem",
160
- 7: "1.75rem",
161
- 7.5: "1.875rem",
162
- 8: "2rem",
163
- 8.5: "2.125rem",
164
- 9: "2.25rem",
165
- 9.25: "2.3125rem",
166
- 9.5: "2.375rem",
167
- 10: "2.5rem",
168
- 10.25: "2.5625rem",
169
- 10.5: "2.625rem",
170
- 11: "2.75rem",
171
- 11.25: "2.8125rem",
172
- 11.375: "2.84375rem",
173
- 11.5: "2.875rem",
174
- 12: "3rem",
175
- 12.25: "3.0625rem",
176
- 12.5: "3.125rem",
177
- 13: "3.25rem",
178
- 13.25: "3.3125rem",
179
- 13.5: "3.375rem",
180
- 13.75: "3.4375rem",
181
- 14: "3.5rem",
182
- 14.125: "3.53125rem",
183
- 14.25: "3.5625rem",
184
- 14.5: "3.625rem",
185
- 15: "3.75rem",
186
- 15.5: "3.875rem",
187
- 16: "4rem",
188
- 17: "4.25rem",
189
- 17.75: "4.4375rem",
190
- 18: "4.5rem",
191
- 18.5: "4.625rem",
192
- 18.75: "4.6875rem",
193
- 19: "4.75rem",
194
- 19.25: "4.8125rem",
195
- 19.5: "4.875rem",
196
- 20: "5rem",
197
- 20.5: "5.125rem",
198
- 20.75: "5.1875rem",
199
- 21: "5.25rem",
200
- 21.5: "5.375rem",
201
- 21.75: "5.4375rem",
202
- 22: "5.5rem",
203
- 22.5: "5.625rem",
204
- 23: "5.75rem",
205
- 23.25: "5.8125rem",
206
- 23.5: "5.875rem",
207
- 23.75: "5.9375rem",
208
- 25: "6.25rem",
209
- 25.75: "6.4375rem",
210
- 26: "6.5rem",
211
- 27: "6.75rem",
212
- 27.5: "6.875rem",
213
- 28.78: "7.195rem",
214
- 29: "7.25rem",
215
- 30: "7.5rem",
216
- 32.5: "8.125rem",
217
- 34: "8.5rem",
218
- 36: "9rem",
219
- 36.5: "9.125rem",
220
- 36.75: "9.1875rem",
221
- 38: "9.5rem",
222
- 39.5: "9.875rem",
223
- 40: "10rem",
224
- 41: "10.25rem",
225
- 42: "10.5rem",
226
- 43: "10.75rem",
227
- 44: "11rem",
228
- 45: "11.25rem",
229
- 46: "11.5rem",
230
- 46.5: "11.625rem",
231
- 47.5: "11.875rem",
232
- 48: "12rem",
233
- 49: "12.25rem",
234
- 50: "12.5rem",
235
- 51: "12.75rem",
236
- 52: "13rem",
237
- 52.5: "13.125rem",
238
- 53.75: "13.4375rem",
239
- 54: "13.5rem",
240
- 55: "13.75rem",
241
- 56: "14rem",
242
- 57.5: "14.375rem",
243
- 62: "15.5rem",
244
- 64: "16rem",
245
- 65: "16.25rem",
246
- 67.5: "16.875rem",
247
- 68: "17rem",
248
- 69: "17.25rem",
249
- 70: "17.5rem",
250
- 72: "18rem",
251
- 73: "18.25rem",
252
- 75: "18.75rem",
253
- 76: "19rem",
254
- 78: "20rem",
255
- 81: "20.25rem",
256
- 82: "20.5rem",
257
- 84: "21rem",
258
- 85: "21.25rem",
259
- 88: "22rem",
260
- 88.5: "22.125rem",
261
- 90: "22.5rem",
262
- 92: "23rem",
263
- 93: "23.25rem",
264
- 93.25: "23.3125rem",
265
- 95: "23.75rem",
266
- 96: "24rem",
267
- 98: "24.5rem",
268
- 100: "25rem",
269
- 102.5: "25.625rem",
270
- 104: "26rem",
271
- 104.5: "26.125rem",
272
- 106: "26.5rem",
273
- 108: "27rem",
274
- 110: "27.5rem",
275
- 112: "28rem",
276
- 112.5: "28.125rem",
277
- 114: "28.5rem",
278
- 116: "29rem",
279
- 120: "30rem",
280
- 122: "30.5rem",
281
- 124: "31rem",
282
- 125: "31.25rem",
283
- 125.5: "31.375rem",
284
- 126: "31.5rem",
285
- 127.5: "31.875rem",
286
- 128: "32rem",
287
- 132: "33rem",
288
- 135: "33.75rem",
289
- 136: "34rem",
290
- 138.5: "34.625rem",
291
- 138.75: "34.6875rem",
292
- 140: "35rem",
293
- 144: "36rem",
294
- 145: "36.25rem",
295
- 145.25: "36.375rem",
296
- 146: "36.5rem",
297
- 147: "36.75rem",
298
- 148: "37rem",
299
- 150: "37.5rem",
300
- 151.5: "37.875rem",
301
- 151.75: "37.9375rem",
302
- 152: "38rem",
303
- 153: "38.25rem",
304
- 154: "38.5rem",
305
- 155: "38.75rem",
306
- 156: "39rem",
307
- 157: "39.25rem",
308
- 158: "39.5rem",
309
- 159: "39.75rem",
310
- 160: "40rem",
311
- 164: "41rem",
312
- 168: "42rem",
313
- 171.5: "42.875rem",
314
- 172: "43rem",
315
- 176: "44rem",
316
- 178: "44.5rem",
317
- 180: "45rem",
318
- 182: "45.5rem",
319
- 184: "46rem",
320
- 186: "46.5rem",
321
- 187.5: "46.875rem",
322
- 188: "47rem",
323
- 190: "47.5rem",
324
- 192: "48rem",
325
- 200: "50rem",
326
- 216: "54rem",
327
- 220: "55rem",
328
- 224: "56rem",
329
- 225: "56.25rem",
330
- 228: "57rem",
331
- 232: "58rem",
332
- 240: "60rem",
333
- 247.5: "61.875rem",
334
- 248: "62rem",
335
- 255: "63.75rem",
336
- 256: "64rem",
337
- 260: "65rem",
338
- 264: "66rem",
339
- 272: "68rem",
340
- 280: "70rem",
341
- 288: "72rem",
342
- 300: "75rem",
343
- 312: "78rem",
344
- 320: "80rem",
345
- 360: "90rem",
346
- 386: "96.5rem",
347
- 408: "102rem",
348
- 480: "120rem",
349
- 500: "125rem",
350
- 520: "140rem",
351
- },
352
- backgroundSize: {
353
- auto: "auto",
354
- cover: "cover",
355
- contain: "contain",
356
- 16: "4rem",
357
- 64: "16rem",
358
- 80: "20rem",
359
- 88: "22rem",
360
- 92: "23rem",
361
- 96: "24rem",
362
- 100: "25rem",
363
- 128: "32rem",
364
- },
365
-
366
- aspectRatio: {
367
- "3/4": "3 / 4", // 인물사진
368
- "7/9": "7 / 9", // 증명사진
369
- },
370
-
371
- borderRadius: {
372
- lgx: "0.625rem",
373
- },
374
- transitionDelay: {
375
- 450: "450ms",
376
- 600: "600ms",
377
- 750: "750ms",
378
- 800: "800ms",
379
- 900: "900ms",
380
- 1000: "1000ms",
381
- 1050: "1050ms",
382
- 1100: "1100ms",
383
- 1150: "1150ms",
384
- 1200: "1200ms",
385
- 1250: "1250ms",
386
- 1300: "1300ms",
387
- 1350: "1350ms",
388
- 1400: "1400ms",
389
- 1500: "1500ms",
390
- 1600: "1600ms",
391
- 1650: "1650ms",
392
- 1700: "1700ms",
393
- 1750: "1750ms",
394
- 1800: "1800ms",
395
- 1950: "1950ms",
396
- 2000: "2000ms",
397
- 2100: "2100ms",
398
- 2200: "2200ms",
399
- 2250: "2250ms",
400
- 2400: "2400ms",
401
- 2500: "2500ms",
402
- 2550: "2550ms",
403
- 2600: "2600ms",
404
- 2700: "2700ms",
405
- 2800: "2800ms",
406
- 3000: "3000ms",
407
- 3300: "3300ms",
408
- 3900: "3900ms",
409
- 4000: "4000ms",
410
- 5000: "5000ms",
411
- },
412
- transitionDuration: {
413
- 300: "300ms",
414
- 1000: "1000ms",
415
- 2000: "2000ms",
416
- 5000: "5000ms",
417
- 60000: "60000ms",
418
- 300000: "300000ms",
419
- },
420
- borderWidth: {
421
- 1: "1px",
422
- 2: "2px",
423
- 3: "3px",
424
- 4: "4px",
425
- 5: "5px",
426
- 6: "6px",
427
- 7: "7px",
428
- 8: "8px",
429
- },
430
- opacity: {
431
- 32: ".32",
432
- },
433
- scale: {
434
- 101: "1.01",
435
- 103: "1.03",
436
- 110: "1.1",
437
- 120: "1.2",
438
- 200: "2",
439
- },
440
- skew: {
441
- 20: "20deg",
442
- 30: "30deg",
443
- 39: "39deg",
444
- 45: "45deg",
445
- 60: "60deg",
446
- },
447
- brightness: {
448
- 10: ".1",
449
- 20: ".2",
450
- 30: ".3",
451
- 40: ".4",
452
- },
453
- fontSize: {
454
- "2xs": "0.625rem",
455
- xs: "0.75rem",
456
- sm: "0.875rem",
457
- base: "1rem",
458
- lg: "1.125rem",
459
- xl: "1.25rem",
460
- "2xl": "1.5rem",
461
- "3xl": "1.875rem",
462
- "4xl": "2.25rem",
463
- "5xl": "3rem",
464
- "6xl": "3.75rem",
465
- "7xl": "4.5rem",
466
- "8xl": "6rem",
467
- "9xl": "8rem",
468
- "10xl": "10rem",
469
- "11xl": "12rem",
470
- },
471
- screens: {
472
- xxxs: "332px",
473
- xxs: "393px",
474
- xs: "480px",
475
- sm: "640px",
476
- md: "768px", // IPad Mini
477
- mmd: "840px",
478
- xm: "964px", // IPad Air, IPad Pro 11.
479
- lg: "1024px", // IPad Mini Horizontal Viewport
480
- ml: "1160px", // IPad Air, IPad Pro 11.
481
- xl: "1280px",
482
- "2xl": "1536px",
483
- },
484
- inset: {
485
- "1/20": "5%",
486
- "1/10": "10%",
487
- "2/10": "5%",
488
- "1/5": "20%",
489
- "2/5": "40%",
490
- "4/5": "80%",
491
- "1/4": "25%",
492
- "1/3": "33.3333333%",
493
- "5/100": "5%",
494
- "10/100": "10%",
495
- "15/100": "15%",
496
- "36/100": "36%",
497
- "43/100": "43%",
498
- "46/100": "46%",
499
- },
500
- width: {
501
- 90: "22.5rem",
502
- 120: "30rem",
503
- 176: "44rem",
504
- "2/3": "66.6666667%",
505
- "1/7": "14.2857143%",
506
- "2/7": "28.5714286%",
507
- "3/7": "42.8571429%",
508
- "4/7": "57.1428571%",
509
- "1/8": "12.5%",
510
- "3/10": "30%",
511
- "1/10": "10%",
512
- "4/10": "40%",
513
- "6/10": "60%",
514
- "7/10": "70%",
515
- "9/10": "90%",
516
- // percentile width
517
- "1/100": "1%",
518
- "2/100": "2%",
519
- "3/100": "3%",
520
- "4/100": "4%",
521
- "5/100": "5%",
522
- "6/100": "6%",
523
- "7/100": "7%",
524
- "8/100": "8%",
525
- "9/100": "9%",
526
- "10/100": "10%",
527
- "11/100": "11%",
528
- "12/100": "12%",
529
- "13/100": "13%",
530
- "14/100": "14%",
531
- "15/100": "15%",
532
- "16/100": "16%",
533
- "17/100": "17%",
534
- "18/100": "18%",
535
- "19/100": "19%",
536
- "20/100": "20%",
537
- "21/100": "21%",
538
- "22/100": "22%",
539
- "23/100": "23%",
540
- "24/100": "24%",
541
- "25/100": "25%",
542
- "26/100": "26%",
543
- "27/100": "27%",
544
- "28/100": "28%",
545
- "29/100": "29%",
546
- "30/100": "30%",
547
- "31/100": "31%",
548
- "32/100": "32%",
549
- "33/100": "33%",
550
- "34/100": "34%",
551
- "35/100": "35%",
552
- "36/100": "36%",
553
- "37/100": "37%",
554
- "38/100": "38%",
555
- "39/100": "39%",
556
- "40/100": "40%",
557
- "41/100": "41%",
558
- "42/100": "42%",
559
- "43/100": "43%",
560
- "44/100": "44%",
561
- "45/100": "45%",
562
- "46/100": "46%",
563
- "47/100": "47%",
564
- "48/100": "48%",
565
- "49/100": "49%",
566
- "50/100": "50%",
567
- "51/100": "51%",
568
- "52/100": "52%",
569
- "53/100": "53%",
570
- "54/100": "54%",
571
- "55/100": "55%",
572
- "56/100": "56%",
573
- "57/100": "57%",
574
- "58/100": "58%",
575
- "59/100": "59%",
576
- "60/100": "60%",
577
- "61/100": "61%",
578
- "62/100": "62%",
579
- "63/100": "63%",
580
- "64/100": "64%",
581
- "65/100": "65%",
582
- "66/100": "66%",
583
- "67/100": "67%",
584
- "68/100": "68%",
585
- "69/100": "69%",
586
- "70/100": "70%",
587
- "71/100": "71%",
588
- "72/100": "72%",
589
- "73/100": "73%",
590
- "74/100": "74%",
591
- "75/100": "75%",
592
- "76/100": "76%",
593
- "77/100": "77%",
594
- "78/100": "78%",
595
- "79/100": "79%",
596
- "80/100": "80%",
597
- "81/100": "81%",
598
- "82/100": "82%",
599
- "83/100": "83%",
600
- "84/100": "84%",
601
- "85/100": "85%",
602
- "86/100": "86%",
603
- "87/100": "87%",
604
- "88/100": "88%",
605
- "89/100": "89%",
606
- "90/100": "90%",
607
- "91/100": "91%",
608
- "92/100": "92%",
609
- "93/100": "93%",
610
- "94/100": "94%",
611
- "95/100": "95%",
612
- "96/100": "96%",
613
- "97/100": "97%",
614
- "98/100": "98%",
615
- "99/100": "99%",
616
- "100/100": "100%",
617
- },
618
- height: {
619
- "2/3": "66.6666667%",
620
- "4/7": "57.1428571%",
621
- "3/7": "42.8571429%",
622
- "5/12": "41.6666667%",
623
- "1/10": "10%",
624
- "3/10": "30%",
625
- "4/10": "40%",
626
- "6/10": "60%",
627
- "7/10": "70%",
628
- "9/10": "90%",
629
- },
630
- zIndex: {
631
- "100": "100",
632
- "90": "90",
633
- "50": "50",
634
- "49": "49",
635
- "48": "48",
636
- "47": "47",
637
- "46": "46",
638
- "45": "45",
639
- "44": "44",
640
- "43": "43",
641
- "42": "42",
642
- "41": "41",
643
- "40": "40",
644
- "30": "30",
645
- "20": "20",
646
- "10": "10",
647
- "0": "0",
648
- },
649
- },
650
- },
651
- safelist: [
652
- {
653
- pattern: /top-.*/,
654
- },
655
- {
656
- pattern: /-top-.*/,
657
- },
658
- {
659
- pattern: /bottom*.*/,
660
- },
661
- {
662
- pattern: /left-.*/,
663
- },
664
- {
665
- pattern: /-left-.*/,
666
- },
667
- {
668
- pattern: /right*.*/,
669
- },
670
- {
671
- pattern: /delay-.*/,
672
- },
673
- ],
674
- plugins: [
675
- tailwindcssAnimate,
676
- function ({ addUtilities }: PluginAPI) {
677
- addUtilities(
678
- {
679
- ".scrollbar-hidden::-webkit-scrollbar": {
680
- display: "none", // For WebKit browsers
681
- },
682
- ".scrollbar-hidden": {
683
- "-ms-overflow-style": "none", // For Internet Explorer and Edge
684
- "scrollbar-width": "none", // For Firefox
685
- },
686
- ".scrollbar-custom": {
687
- /* Fully custom scrollbar style */
688
- "&::-webkit-scrollbar": {
689
- width: "8px",
690
- },
691
-
692
- "&::-webkit-scrollbar-thumb": {
693
- backgroundColor: "#BABABA",
694
- borderRadius: "10px",
695
- margin: "4px",
696
- },
697
- },
698
- ".page-break": {
699
- "@media print": {
700
- "page-break-before": "always",
701
- },
702
- },
703
- },
704
- {
705
- respectPrefix: false,
706
- respectImportant: false,
707
- }
708
- );
709
- },
710
- ],
711
- darkMode: "selector",
712
- } satisfies Config;
1
+ import tailwindcssAnimate from "tailwindcss-animate";
2
+ import type { Config } from "tailwindcss";
3
+ import type { PluginAPI } from "tailwindcss/types/config";
4
+
5
+ // import twElements from "tw-elements/dist/plugin";
6
+ // import tailwindcssDirectionalShadows from "tailwindcss-directional-shadows";
7
+
8
+ export default {
9
+ content: [
10
+ // "./node_modules/tw-elements/dist/js/**/*.js",
11
+ "./index.html",
12
+ "./src/**/*.{js,jsx,ts,tsx}",
13
+ ],
14
+ theme: {
15
+ extend: {
16
+ fontFamily: {
17
+ "pretendard-medium": ["pretendard-medium"],
18
+ "pretendard-bold": ["pretendard-bold"],
19
+ "pretendard-light": ["pretendard-light"],
20
+ "pretendard-var": ["PretendardVariable"],
21
+ kostar: ["kostar"],
22
+ nicomoji: ["nicomoji"],
23
+ megrim: ["megrim"],
24
+ "times-newer-roman-bold": ["times-newer-roman-bold"],
25
+ "times-newer-roman-bolditalic": ["times-newer-roman-bolditalic"],
26
+ },
27
+ backgroundImage: {
28
+ "image-space": "url('/images/space/space.png')",
29
+ },
30
+ scrollbar: {
31
+ hidden: "hidden",
32
+ },
33
+ boxShadow: {
34
+ main: "0 2px 10px 0px rgba(0, 0, 0, 0.14)",
35
+ "main-small": "0 0px 5px 0px rgba(0, 0, 0, 0.1)",
36
+ "main-hover": "0 10px 12px 0px rgba(0, 0, 0, 0.3)",
37
+ "icon-default": "0 3px 7px 0px rgba(0, 0, 0, 0.1)",
38
+ "icon-hover": "0 3px 10px 0px rgba(6, 86, 82, 0.38)",
39
+ green: "0 0px 10px 0px rgba(16, 86, 82, 0.38)",
40
+ },
41
+ flex: {
42
+ 2: "2 2 0%",
43
+ 3: "3 3 0%",
44
+ },
45
+ keyframes: {
46
+ smallBounce: {
47
+ "0%, 100%": { transform: "translateY(-5%)" },
48
+ "50%": { transform: "translateY(0)" },
49
+ },
50
+ grow: {
51
+ "0%": { height: "60px" },
52
+ "100%": { height: "120px" },
53
+ },
54
+ shrink: {
55
+ "0%": { height: "120px" },
56
+ "100%": { height: "60px" },
57
+ },
58
+
59
+ slideBackground: {
60
+ "0%, 100%": { backgroundPosition: "left center" },
61
+ "50%": { backgroundPosition: "right center" },
62
+ },
63
+ fadeIn: {
64
+ from: { opacity: "0" },
65
+ to: { opacity: "1" },
66
+ },
67
+ fadeOut: {
68
+ from: { opacity: "1" },
69
+ to: { opacity: "0" },
70
+ },
71
+ increaseWidth: {
72
+ from: { width: "0%" },
73
+ to: { width: "33.3%" },
74
+ },
75
+ decreaseWidth: {
76
+ from: { width: "33.3%" },
77
+ to: { width: "0%" },
78
+ },
79
+ },
80
+ animation: {
81
+ grow: "grow 0.2s ease-in-out forwards",
82
+ shrink: "shrink 0.2s ease-in-out forwards",
83
+ smallBounce: "smallBounce 1s infinite",
84
+ },
85
+
86
+ colors: {
87
+ "white-off": "#F5F5F5",
88
+ "red-burgundy": "#933652",
89
+ "crimson-burgundy": "#910023",
90
+ "crimson-burgundy-light": "#EDDFE2",
91
+ "crimson-dark": "#760023",
92
+ "red-crimson": "#760023",
93
+ "red-velvet": "#AC647A",
94
+ "green-dark": "#105652",
95
+ "green-light": "#DFE5E4",
96
+ "blue-sky": "#44C5F3",
97
+ "blue-navy": "#173A8B",
98
+ "blue-navy-light": "#E1E4EB",
99
+ "blue-pastel": "#CED6E6",
100
+ "violet-light": "#9979F6",
101
+ "gray-light": "#F0F0F0",
102
+ "gray-light-super": "#D9D9D9",
103
+ "gray-medium": "#7F7F7F",
104
+ "gray-dim": "#4C4C4C",
105
+ "gray-dark": "#4C4C4C",
106
+ "silver-lavender": "#E7E9F2",
107
+ "silver-latte": "#FBF3E4",
108
+ "silver-pale": "#DFD8CA",
109
+
110
+ // Brand Colors
111
+ "co-green": "#4FCA3E",
112
+ "co-green-light": "#DCF4D8",
113
+ "ps-pink": "#E3006E",
114
+ "ps-pink-light": "#FFBADB",
115
+ "st-orange": "#ED6A00",
116
+ "st-orange-light": "#F5D2B6",
117
+ "ba-yellow": "#FCCE30",
118
+ "ba-yellow-light": "#FFEFB7",
119
+ "jr-blue": "#52A2DA",
120
+ "jr-blue-light": "#D6EEFF",
121
+ "hj-blue": "#385EAB",
122
+ "hj-blue-light": "#A8BFE5",
123
+ "ad-gray": "#4C4C4C",
124
+ "ad-gray-light": "#F0F0F0",
125
+ // Gradation Colors
126
+ },
127
+ maxHeight: {
128
+ 44: "11rem",
129
+ "9/10": "90%",
130
+ },
131
+ maxWidth: {
132
+ 256: "64rem",
133
+ 262: "65.5rem",
134
+ 290: "72.5rem",
135
+ },
136
+ spacing: {
137
+ "sun-calc": "calc(50% - 6rem)",
138
+ 0.5: "0.125rem",
139
+ 1: "0.25rem",
140
+ 1.25: "0.3125rem",
141
+ 1.5: "0.375rem",
142
+ 2.125: "0.53125rem",
143
+ 2.25: "0.5625rem",
144
+ 2.5: "0.625rem",
145
+ 2.625: "0.65625rem",
146
+ 2.75: "0.6875rem",
147
+ 3.5: "0.875rem",
148
+ 3.75: "0.9375rem",
149
+ 4.25: "1.0625rem",
150
+ 4.375: "1.09375rem",
151
+ 4.5: "1.125rem",
152
+ 4.75: "1.1875rem",
153
+ 5.25: "1.3125rem",
154
+ 5.5: "1.375rem",
155
+ 5.75: "1.4375rem",
156
+ 6.25: "1.5625rem",
157
+ 6.4: "1.6rem",
158
+ 6.5: "1.625rem",
159
+ 6.75: "1.6875rem",
160
+ 7: "1.75rem",
161
+ 7.5: "1.875rem",
162
+ 8: "2rem",
163
+ 8.5: "2.125rem",
164
+ 9: "2.25rem",
165
+ 9.25: "2.3125rem",
166
+ 9.5: "2.375rem",
167
+ 10: "2.5rem",
168
+ 10.25: "2.5625rem",
169
+ 10.5: "2.625rem",
170
+ 11: "2.75rem",
171
+ 11.25: "2.8125rem",
172
+ 11.375: "2.84375rem",
173
+ 11.5: "2.875rem",
174
+ 12: "3rem",
175
+ 12.25: "3.0625rem",
176
+ 12.5: "3.125rem",
177
+ 13: "3.25rem",
178
+ 13.25: "3.3125rem",
179
+ 13.5: "3.375rem",
180
+ 13.75: "3.4375rem",
181
+ 14: "3.5rem",
182
+ 14.125: "3.53125rem",
183
+ 14.25: "3.5625rem",
184
+ 14.5: "3.625rem",
185
+ 15: "3.75rem",
186
+ 15.5: "3.875rem",
187
+ 16: "4rem",
188
+ 17: "4.25rem",
189
+ 17.75: "4.4375rem",
190
+ 18: "4.5rem",
191
+ 18.5: "4.625rem",
192
+ 18.75: "4.6875rem",
193
+ 19: "4.75rem",
194
+ 19.25: "4.8125rem",
195
+ 19.5: "4.875rem",
196
+ 20: "5rem",
197
+ 20.5: "5.125rem",
198
+ 20.75: "5.1875rem",
199
+ 21: "5.25rem",
200
+ 21.5: "5.375rem",
201
+ 21.75: "5.4375rem",
202
+ 22: "5.5rem",
203
+ 22.5: "5.625rem",
204
+ 23: "5.75rem",
205
+ 23.25: "5.8125rem",
206
+ 23.5: "5.875rem",
207
+ 23.75: "5.9375rem",
208
+ 25: "6.25rem",
209
+ 25.75: "6.4375rem",
210
+ 26: "6.5rem",
211
+ 27: "6.75rem",
212
+ 27.5: "6.875rem",
213
+ 28.78: "7.195rem",
214
+ 29: "7.25rem",
215
+ 30: "7.5rem",
216
+ 32.5: "8.125rem",
217
+ 34: "8.5rem",
218
+ 36: "9rem",
219
+ 36.5: "9.125rem",
220
+ 36.75: "9.1875rem",
221
+ 38: "9.5rem",
222
+ 39.5: "9.875rem",
223
+ 40: "10rem",
224
+ 41: "10.25rem",
225
+ 42: "10.5rem",
226
+ 43: "10.75rem",
227
+ 44: "11rem",
228
+ 45: "11.25rem",
229
+ 46: "11.5rem",
230
+ 46.5: "11.625rem",
231
+ 47.5: "11.875rem",
232
+ 48: "12rem",
233
+ 49: "12.25rem",
234
+ 50: "12.5rem",
235
+ 51: "12.75rem",
236
+ 52: "13rem",
237
+ 52.5: "13.125rem",
238
+ 53.75: "13.4375rem",
239
+ 54: "13.5rem",
240
+ 55: "13.75rem",
241
+ 56: "14rem",
242
+ 57.5: "14.375rem",
243
+ 62: "15.5rem",
244
+ 64: "16rem",
245
+ 65: "16.25rem",
246
+ 67.5: "16.875rem",
247
+ 68: "17rem",
248
+ 69: "17.25rem",
249
+ 70: "17.5rem",
250
+ 72: "18rem",
251
+ 73: "18.25rem",
252
+ 75: "18.75rem",
253
+ 76: "19rem",
254
+ 78: "20rem",
255
+ 81: "20.25rem",
256
+ 82: "20.5rem",
257
+ 84: "21rem",
258
+ 85: "21.25rem",
259
+ 88: "22rem",
260
+ 88.5: "22.125rem",
261
+ 90: "22.5rem",
262
+ 92: "23rem",
263
+ 93: "23.25rem",
264
+ 93.25: "23.3125rem",
265
+ 95: "23.75rem",
266
+ 96: "24rem",
267
+ 98: "24.5rem",
268
+ 100: "25rem",
269
+ 102.5: "25.625rem",
270
+ 104: "26rem",
271
+ 104.5: "26.125rem",
272
+ 106: "26.5rem",
273
+ 108: "27rem",
274
+ 110: "27.5rem",
275
+ 112: "28rem",
276
+ 112.5: "28.125rem",
277
+ 114: "28.5rem",
278
+ 116: "29rem",
279
+ 120: "30rem",
280
+ 122: "30.5rem",
281
+ 124: "31rem",
282
+ 125: "31.25rem",
283
+ 125.5: "31.375rem",
284
+ 126: "31.5rem",
285
+ 127.5: "31.875rem",
286
+ 128: "32rem",
287
+ 132: "33rem",
288
+ 135: "33.75rem",
289
+ 136: "34rem",
290
+ 138.5: "34.625rem",
291
+ 138.75: "34.6875rem",
292
+ 140: "35rem",
293
+ 144: "36rem",
294
+ 145: "36.25rem",
295
+ 145.25: "36.375rem",
296
+ 146: "36.5rem",
297
+ 147: "36.75rem",
298
+ 148: "37rem",
299
+ 150: "37.5rem",
300
+ 151.5: "37.875rem",
301
+ 151.75: "37.9375rem",
302
+ 152: "38rem",
303
+ 153: "38.25rem",
304
+ 154: "38.5rem",
305
+ 155: "38.75rem",
306
+ 156: "39rem",
307
+ 157: "39.25rem",
308
+ 158: "39.5rem",
309
+ 159: "39.75rem",
310
+ 160: "40rem",
311
+ 164: "41rem",
312
+ 168: "42rem",
313
+ 171.5: "42.875rem",
314
+ 172: "43rem",
315
+ 176: "44rem",
316
+ 178: "44.5rem",
317
+ 180: "45rem",
318
+ 182: "45.5rem",
319
+ 184: "46rem",
320
+ 186: "46.5rem",
321
+ 187.5: "46.875rem",
322
+ 188: "47rem",
323
+ 190: "47.5rem",
324
+ 192: "48rem",
325
+ 200: "50rem",
326
+ 216: "54rem",
327
+ 220: "55rem",
328
+ 224: "56rem",
329
+ 225: "56.25rem",
330
+ 228: "57rem",
331
+ 232: "58rem",
332
+ 240: "60rem",
333
+ 247.5: "61.875rem",
334
+ 248: "62rem",
335
+ 255: "63.75rem",
336
+ 256: "64rem",
337
+ 260: "65rem",
338
+ 264: "66rem",
339
+ 272: "68rem",
340
+ 280: "70rem",
341
+ 288: "72rem",
342
+ 300: "75rem",
343
+ 312: "78rem",
344
+ 320: "80rem",
345
+ 360: "90rem",
346
+ 386: "96.5rem",
347
+ 408: "102rem",
348
+ 480: "120rem",
349
+ 500: "125rem",
350
+ 520: "140rem",
351
+ },
352
+ backgroundSize: {
353
+ auto: "auto",
354
+ cover: "cover",
355
+ contain: "contain",
356
+ 16: "4rem",
357
+ 64: "16rem",
358
+ 80: "20rem",
359
+ 88: "22rem",
360
+ 92: "23rem",
361
+ 96: "24rem",
362
+ 100: "25rem",
363
+ 128: "32rem",
364
+ },
365
+
366
+ aspectRatio: {
367
+ "3/4": "3 / 4", // 인물사진
368
+ "7/9": "7 / 9", // 증명사진
369
+ },
370
+
371
+ borderRadius: {
372
+ lgx: "0.625rem",
373
+ },
374
+ transitionDelay: {
375
+ 450: "450ms",
376
+ 600: "600ms",
377
+ 750: "750ms",
378
+ 800: "800ms",
379
+ 900: "900ms",
380
+ 1000: "1000ms",
381
+ 1050: "1050ms",
382
+ 1100: "1100ms",
383
+ 1150: "1150ms",
384
+ 1200: "1200ms",
385
+ 1250: "1250ms",
386
+ 1300: "1300ms",
387
+ 1350: "1350ms",
388
+ 1400: "1400ms",
389
+ 1500: "1500ms",
390
+ 1600: "1600ms",
391
+ 1650: "1650ms",
392
+ 1700: "1700ms",
393
+ 1750: "1750ms",
394
+ 1800: "1800ms",
395
+ 1950: "1950ms",
396
+ 2000: "2000ms",
397
+ 2100: "2100ms",
398
+ 2200: "2200ms",
399
+ 2250: "2250ms",
400
+ 2400: "2400ms",
401
+ 2500: "2500ms",
402
+ 2550: "2550ms",
403
+ 2600: "2600ms",
404
+ 2700: "2700ms",
405
+ 2800: "2800ms",
406
+ 3000: "3000ms",
407
+ 3300: "3300ms",
408
+ 3900: "3900ms",
409
+ 4000: "4000ms",
410
+ 5000: "5000ms",
411
+ },
412
+ transitionDuration: {
413
+ 300: "300ms",
414
+ 1000: "1000ms",
415
+ 2000: "2000ms",
416
+ 5000: "5000ms",
417
+ 60000: "60000ms",
418
+ 300000: "300000ms",
419
+ },
420
+ borderWidth: {
421
+ 1: "1px",
422
+ 2: "2px",
423
+ 3: "3px",
424
+ 4: "4px",
425
+ 5: "5px",
426
+ 6: "6px",
427
+ 7: "7px",
428
+ 8: "8px",
429
+ },
430
+ opacity: {
431
+ 32: ".32",
432
+ },
433
+ scale: {
434
+ 101: "1.01",
435
+ 103: "1.03",
436
+ 110: "1.1",
437
+ 120: "1.2",
438
+ 200: "2",
439
+ },
440
+ skew: {
441
+ 20: "20deg",
442
+ 30: "30deg",
443
+ 39: "39deg",
444
+ 45: "45deg",
445
+ 60: "60deg",
446
+ },
447
+ brightness: {
448
+ 10: ".1",
449
+ 20: ".2",
450
+ 30: ".3",
451
+ 40: ".4",
452
+ },
453
+ fontSize: {
454
+ "2xs": "0.625rem",
455
+ xs: "0.75rem",
456
+ sm: "0.875rem",
457
+ base: "1rem",
458
+ lg: "1.125rem",
459
+ xl: "1.25rem",
460
+ "2xl": "1.5rem",
461
+ "3xl": "1.875rem",
462
+ "4xl": "2.25rem",
463
+ "5xl": "3rem",
464
+ "6xl": "3.75rem",
465
+ "7xl": "4.5rem",
466
+ "8xl": "6rem",
467
+ "9xl": "8rem",
468
+ "10xl": "10rem",
469
+ "11xl": "12rem",
470
+ },
471
+ screens: {
472
+ xxxs: "332px",
473
+ xxs: "393px",
474
+ xs: "480px",
475
+ sm: "640px",
476
+ md: "768px", // IPad Mini
477
+ mmd: "840px",
478
+ xm: "964px", // IPad Air, IPad Pro 11.
479
+ lg: "1024px", // IPad Mini Horizontal Viewport
480
+ ml: "1160px", // IPad Air, IPad Pro 11.
481
+ xl: "1280px",
482
+ "2xl": "1536px",
483
+ },
484
+ inset: {
485
+ "1/20": "5%",
486
+ "1/10": "10%",
487
+ "2/10": "5%",
488
+ "1/5": "20%",
489
+ "2/5": "40%",
490
+ "4/5": "80%",
491
+ "1/4": "25%",
492
+ "1/3": "33.3333333%",
493
+ "5/100": "5%",
494
+ "10/100": "10%",
495
+ "15/100": "15%",
496
+ "36/100": "36%",
497
+ "43/100": "43%",
498
+ "46/100": "46%",
499
+ },
500
+ width: {
501
+ 90: "22.5rem",
502
+ 120: "30rem",
503
+ 176: "44rem",
504
+ "2/3": "66.6666667%",
505
+ "1/7": "14.2857143%",
506
+ "2/7": "28.5714286%",
507
+ "3/7": "42.8571429%",
508
+ "4/7": "57.1428571%",
509
+ "1/8": "12.5%",
510
+ "3/10": "30%",
511
+ "1/10": "10%",
512
+ "4/10": "40%",
513
+ "6/10": "60%",
514
+ "7/10": "70%",
515
+ "9/10": "90%",
516
+ // percentile width
517
+ "1/100": "1%",
518
+ "2/100": "2%",
519
+ "3/100": "3%",
520
+ "4/100": "4%",
521
+ "5/100": "5%",
522
+ "6/100": "6%",
523
+ "7/100": "7%",
524
+ "8/100": "8%",
525
+ "9/100": "9%",
526
+ "10/100": "10%",
527
+ "11/100": "11%",
528
+ "12/100": "12%",
529
+ "13/100": "13%",
530
+ "14/100": "14%",
531
+ "15/100": "15%",
532
+ "16/100": "16%",
533
+ "17/100": "17%",
534
+ "18/100": "18%",
535
+ "19/100": "19%",
536
+ "20/100": "20%",
537
+ "21/100": "21%",
538
+ "22/100": "22%",
539
+ "23/100": "23%",
540
+ "24/100": "24%",
541
+ "25/100": "25%",
542
+ "26/100": "26%",
543
+ "27/100": "27%",
544
+ "28/100": "28%",
545
+ "29/100": "29%",
546
+ "30/100": "30%",
547
+ "31/100": "31%",
548
+ "32/100": "32%",
549
+ "33/100": "33%",
550
+ "34/100": "34%",
551
+ "35/100": "35%",
552
+ "36/100": "36%",
553
+ "37/100": "37%",
554
+ "38/100": "38%",
555
+ "39/100": "39%",
556
+ "40/100": "40%",
557
+ "41/100": "41%",
558
+ "42/100": "42%",
559
+ "43/100": "43%",
560
+ "44/100": "44%",
561
+ "45/100": "45%",
562
+ "46/100": "46%",
563
+ "47/100": "47%",
564
+ "48/100": "48%",
565
+ "49/100": "49%",
566
+ "50/100": "50%",
567
+ "51/100": "51%",
568
+ "52/100": "52%",
569
+ "53/100": "53%",
570
+ "54/100": "54%",
571
+ "55/100": "55%",
572
+ "56/100": "56%",
573
+ "57/100": "57%",
574
+ "58/100": "58%",
575
+ "59/100": "59%",
576
+ "60/100": "60%",
577
+ "61/100": "61%",
578
+ "62/100": "62%",
579
+ "63/100": "63%",
580
+ "64/100": "64%",
581
+ "65/100": "65%",
582
+ "66/100": "66%",
583
+ "67/100": "67%",
584
+ "68/100": "68%",
585
+ "69/100": "69%",
586
+ "70/100": "70%",
587
+ "71/100": "71%",
588
+ "72/100": "72%",
589
+ "73/100": "73%",
590
+ "74/100": "74%",
591
+ "75/100": "75%",
592
+ "76/100": "76%",
593
+ "77/100": "77%",
594
+ "78/100": "78%",
595
+ "79/100": "79%",
596
+ "80/100": "80%",
597
+ "81/100": "81%",
598
+ "82/100": "82%",
599
+ "83/100": "83%",
600
+ "84/100": "84%",
601
+ "85/100": "85%",
602
+ "86/100": "86%",
603
+ "87/100": "87%",
604
+ "88/100": "88%",
605
+ "89/100": "89%",
606
+ "90/100": "90%",
607
+ "91/100": "91%",
608
+ "92/100": "92%",
609
+ "93/100": "93%",
610
+ "94/100": "94%",
611
+ "95/100": "95%",
612
+ "96/100": "96%",
613
+ "97/100": "97%",
614
+ "98/100": "98%",
615
+ "99/100": "99%",
616
+ "100/100": "100%",
617
+ },
618
+ height: {
619
+ "2/3": "66.6666667%",
620
+ "4/7": "57.1428571%",
621
+ "3/7": "42.8571429%",
622
+ "5/12": "41.6666667%",
623
+ "1/10": "10%",
624
+ "3/10": "30%",
625
+ "4/10": "40%",
626
+ "6/10": "60%",
627
+ "7/10": "70%",
628
+ "9/10": "90%",
629
+ },
630
+ zIndex: {
631
+ "100": "100",
632
+ "90": "90",
633
+ "50": "50",
634
+ "49": "49",
635
+ "48": "48",
636
+ "47": "47",
637
+ "46": "46",
638
+ "45": "45",
639
+ "44": "44",
640
+ "43": "43",
641
+ "42": "42",
642
+ "41": "41",
643
+ "40": "40",
644
+ "30": "30",
645
+ "20": "20",
646
+ "10": "10",
647
+ "0": "0",
648
+ },
649
+ },
650
+ },
651
+ safelist: [
652
+ {
653
+ pattern: /top-.*/,
654
+ },
655
+ {
656
+ pattern: /-top-.*/,
657
+ },
658
+ {
659
+ pattern: /bottom*.*/,
660
+ },
661
+ {
662
+ pattern: /left-.*/,
663
+ },
664
+ {
665
+ pattern: /-left-.*/,
666
+ },
667
+ {
668
+ pattern: /right*.*/,
669
+ },
670
+ {
671
+ pattern: /delay-.*/,
672
+ },
673
+ ],
674
+ plugins: [
675
+ tailwindcssAnimate,
676
+ function ({ addUtilities }: PluginAPI) {
677
+ addUtilities(
678
+ {
679
+ ".scrollbar-hidden::-webkit-scrollbar": {
680
+ display: "none", // For WebKit browsers
681
+ },
682
+ ".scrollbar-hidden": {
683
+ "-ms-overflow-style": "none", // For Internet Explorer and Edge
684
+ "scrollbar-width": "none", // For Firefox
685
+ },
686
+ ".scrollbar-custom": {
687
+ /* Fully custom scrollbar style */
688
+ "&::-webkit-scrollbar": {
689
+ width: "8px",
690
+ },
691
+
692
+ "&::-webkit-scrollbar-thumb": {
693
+ backgroundColor: "#BABABA",
694
+ borderRadius: "10px",
695
+ margin: "4px",
696
+ },
697
+ },
698
+ ".page-break": {
699
+ "@media print": {
700
+ "page-break-before": "always",
701
+ },
702
+ },
703
+ },
704
+ {
705
+ respectPrefix: false,
706
+ respectImportant: false,
707
+ }
708
+ );
709
+ },
710
+ ],
711
+ darkMode: "selector",
712
+ } satisfies Config;