@edu-tosel/design 1.0.334 → 1.0.341
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.
- package/README.md +42 -42
- package/asset/SVG.tsx +47 -47
- package/asset/html/gomito-promotion.html +116 -116
- package/asset/html/speaking-series-promotion.html +58 -58
- package/asset/sizes.ts +202 -202
- package/asset/svg/Close.tsx +32 -32
- package/asset/svg/Collab.tsx +51 -51
- package/asset/svg/Direction.tsx +76 -76
- package/asset/svg/Email.tsx +19 -19
- package/asset/svg/Eye.tsx +48 -48
- package/asset/svg/HallofFame.tsx +179 -179
- package/asset/svg/Icon.tsx +324 -324
- package/asset/svg/Image.tsx +24 -24
- package/asset/svg/Login.tsx +116 -116
- package/asset/svg/MiniCheck.tsx +16 -16
- package/asset/svg/MiniClose.tsx +19 -19
- package/asset/svg/Notification.tsx +34 -34
- package/asset/svg/Operation.tsx +130 -130
- package/asset/svg/Phone.tsx +19 -19
- package/asset/svg/Print.tsx +18 -18
- package/asset/svg/Profile.tsx +27 -27
- package/asset/svg/Search.tsx +24 -24
- package/asset/svg/Symbol.tsx +61 -61
- package/asset/svg/TOSEL.tsx +63 -63
- package/asset/svg/TestOption.tsx +51 -51
- package/asset/svg/User.tsx +18 -18
- package/asset/url.ts +12 -12
- package/globals.css +341 -341
- package/layout/template/home/Announcement.d.ts +2 -1
- package/layout/template/home/Announcement.js +7 -3
- package/package.json +1 -1
- package/tailwind.config.ts +763 -763
- package/version.txt +1 -1
- package/widget/template/Select/Select.LG.js +3 -1
package/README.md
CHANGED
|
@@ -1,42 +1,42 @@
|
|
|
1
|
-
# TOSEL Design Library
|
|
2
|
-
|
|
3
|
-
TOSEL 통합 디자인 시스템에 맞춘 UI 라이브러리
|
|
4
|
-
|
|
5
|
-
## Component
|
|
6
|
-
|
|
7
|
-
컴포넌트들은 기본적으로 기능 단위로만 구성한다.
|
|
8
|
-
|
|
9
|
-
도메인은 구분하지 않는다. 단, Layout 컴포넌트에 대해서만 예외적으로 허용한다.
|
|
10
|
-
|
|
11
|
-
### Board
|
|
12
|
-
|
|
13
|
-
Board 컴포넌트는 가장 큰 단위의 컨테이너이다.
|
|
14
|
-
|
|
15
|
-
일반적으로
|
|
16
|
-
|
|
17
|
-
### Card
|
|
18
|
-
|
|
19
|
-
Card 컴포넌트는 여러가지 요소를 담고 있는 컨테이너이다.
|
|
20
|
-
|
|
21
|
-
일반적으로 가장 최소 단위의 컴포넌트로 사용되며, 다양한 요소를 담을 수 있다.
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
### Layout
|
|
25
|
-
|
|
26
|
-
Layout 컴포넌트는 여러가지 컴포넌트를 담고 있는 컨테이너이다.
|
|
27
|
-
|
|
28
|
-
Layout 컴포넌트는 특정 프로젝트에서 반복적으로 사용되는 컴포넌트의 구조를 형성한다.
|
|
29
|
-
|
|
30
|
-
### Navigation
|
|
31
|
-
|
|
32
|
-
Navigation 컴포넌트는 여러가지 링크를 담고 있는 컨테이너이다.
|
|
33
|
-
|
|
34
|
-
각각의 링크 컴포넌트의 스타일링은 buttonClassNames로 전달받는다.
|
|
35
|
-
|
|
36
|
-
(Next.js의 Link Component와 React의 Link Component는 호환이 되지 않기 때문.)
|
|
37
|
-
|
|
38
|
-
### Shelf
|
|
39
|
-
|
|
40
|
-
Shelf 컴포넌트는 Board 컴포넌트 내부에 위치하며 여러가지 Deck 컴포넌트를 담고 있는 컨테이너이다.
|
|
41
|
-
|
|
42
|
-
Shelf 컴포넌트는 담고있는 Deck 컴포넌트들을 수직 정렬한다.
|
|
1
|
+
# TOSEL Design Library
|
|
2
|
+
|
|
3
|
+
TOSEL 통합 디자인 시스템에 맞춘 UI 라이브러리
|
|
4
|
+
|
|
5
|
+
## Component
|
|
6
|
+
|
|
7
|
+
컴포넌트들은 기본적으로 기능 단위로만 구성한다.
|
|
8
|
+
|
|
9
|
+
도메인은 구분하지 않는다. 단, Layout 컴포넌트에 대해서만 예외적으로 허용한다.
|
|
10
|
+
|
|
11
|
+
### Board
|
|
12
|
+
|
|
13
|
+
Board 컴포넌트는 가장 큰 단위의 컨테이너이다.
|
|
14
|
+
|
|
15
|
+
일반적으로
|
|
16
|
+
|
|
17
|
+
### Card
|
|
18
|
+
|
|
19
|
+
Card 컴포넌트는 여러가지 요소를 담고 있는 컨테이너이다.
|
|
20
|
+
|
|
21
|
+
일반적으로 가장 최소 단위의 컴포넌트로 사용되며, 다양한 요소를 담을 수 있다.
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
### Layout
|
|
25
|
+
|
|
26
|
+
Layout 컴포넌트는 여러가지 컴포넌트를 담고 있는 컨테이너이다.
|
|
27
|
+
|
|
28
|
+
Layout 컴포넌트는 특정 프로젝트에서 반복적으로 사용되는 컴포넌트의 구조를 형성한다.
|
|
29
|
+
|
|
30
|
+
### Navigation
|
|
31
|
+
|
|
32
|
+
Navigation 컴포넌트는 여러가지 링크를 담고 있는 컨테이너이다.
|
|
33
|
+
|
|
34
|
+
각각의 링크 컴포넌트의 스타일링은 buttonClassNames로 전달받는다.
|
|
35
|
+
|
|
36
|
+
(Next.js의 Link Component와 React의 Link Component는 호환이 되지 않기 때문.)
|
|
37
|
+
|
|
38
|
+
### Shelf
|
|
39
|
+
|
|
40
|
+
Shelf 컴포넌트는 Board 컴포넌트 내부에 위치하며 여러가지 Deck 컴포넌트를 담고 있는 컨테이너이다.
|
|
41
|
+
|
|
42
|
+
Shelf 컴포넌트는 담고있는 Deck 컴포넌트들을 수직 정렬한다.
|
package/asset/SVG.tsx
CHANGED
|
@@ -1,47 +1,47 @@
|
|
|
1
|
-
import Close from "./svg/Close";
|
|
2
|
-
import Direction from "./svg/Direction";
|
|
3
|
-
import Email from "./svg/Email";
|
|
4
|
-
import Eye from "./svg/Eye";
|
|
5
|
-
import Icon from "./svg/Icon";
|
|
6
|
-
import Image from "./svg/Image";
|
|
7
|
-
import Notification from "./svg/Notification";
|
|
8
|
-
import Operation from "./svg/Operation";
|
|
9
|
-
import Phone from "./svg/Phone";
|
|
10
|
-
import Profile from "./svg/Profile";
|
|
11
|
-
import Symbol from "./svg/Symbol";
|
|
12
|
-
import TOSEL from "./svg/TOSEL";
|
|
13
|
-
import Login from "./svg/Login";
|
|
14
|
-
import Collab from "./svg/Collab";
|
|
15
|
-
import HallofFame from "./svg/HallofFame";
|
|
16
|
-
import Print from "./svg/Print";
|
|
17
|
-
import User from "./svg/User";
|
|
18
|
-
import Search from "./svg/Search";
|
|
19
|
-
import MiniClose from "./svg/MiniClose";
|
|
20
|
-
import MiniCheck from "./svg/MiniCheck";
|
|
21
|
-
import TestOption from "./svg/TestOption";
|
|
22
|
-
|
|
23
|
-
const SVG = {
|
|
24
|
-
TOSEL,
|
|
25
|
-
Close,
|
|
26
|
-
Direction,
|
|
27
|
-
Eye,
|
|
28
|
-
Email,
|
|
29
|
-
Icon,
|
|
30
|
-
Image,
|
|
31
|
-
Notification,
|
|
32
|
-
Operation,
|
|
33
|
-
Phone,
|
|
34
|
-
Print,
|
|
35
|
-
Profile,
|
|
36
|
-
Symbol,
|
|
37
|
-
Login,
|
|
38
|
-
Collab,
|
|
39
|
-
HallofFame,
|
|
40
|
-
User,
|
|
41
|
-
Search,
|
|
42
|
-
MiniClose,
|
|
43
|
-
MiniCheck,
|
|
44
|
-
TestOption,
|
|
45
|
-
};
|
|
46
|
-
|
|
47
|
-
export default SVG;
|
|
1
|
+
import Close from "./svg/Close";
|
|
2
|
+
import Direction from "./svg/Direction";
|
|
3
|
+
import Email from "./svg/Email";
|
|
4
|
+
import Eye from "./svg/Eye";
|
|
5
|
+
import Icon from "./svg/Icon";
|
|
6
|
+
import Image from "./svg/Image";
|
|
7
|
+
import Notification from "./svg/Notification";
|
|
8
|
+
import Operation from "./svg/Operation";
|
|
9
|
+
import Phone from "./svg/Phone";
|
|
10
|
+
import Profile from "./svg/Profile";
|
|
11
|
+
import Symbol from "./svg/Symbol";
|
|
12
|
+
import TOSEL from "./svg/TOSEL";
|
|
13
|
+
import Login from "./svg/Login";
|
|
14
|
+
import Collab from "./svg/Collab";
|
|
15
|
+
import HallofFame from "./svg/HallofFame";
|
|
16
|
+
import Print from "./svg/Print";
|
|
17
|
+
import User from "./svg/User";
|
|
18
|
+
import Search from "./svg/Search";
|
|
19
|
+
import MiniClose from "./svg/MiniClose";
|
|
20
|
+
import MiniCheck from "./svg/MiniCheck";
|
|
21
|
+
import TestOption from "./svg/TestOption";
|
|
22
|
+
|
|
23
|
+
const SVG = {
|
|
24
|
+
TOSEL,
|
|
25
|
+
Close,
|
|
26
|
+
Direction,
|
|
27
|
+
Eye,
|
|
28
|
+
Email,
|
|
29
|
+
Icon,
|
|
30
|
+
Image,
|
|
31
|
+
Notification,
|
|
32
|
+
Operation,
|
|
33
|
+
Phone,
|
|
34
|
+
Print,
|
|
35
|
+
Profile,
|
|
36
|
+
Symbol,
|
|
37
|
+
Login,
|
|
38
|
+
Collab,
|
|
39
|
+
HallofFame,
|
|
40
|
+
User,
|
|
41
|
+
Search,
|
|
42
|
+
MiniClose,
|
|
43
|
+
MiniCheck,
|
|
44
|
+
TestOption,
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
export default SVG;
|
|
@@ -1,117 +1,117 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8">
|
|
5
|
-
<meta name="viewport" content="width=<device-width>, initial-scale=1.0">
|
|
6
|
-
<title>Document</title>
|
|
7
|
-
<link rel="stylesheet" as="style" crossorigin href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css" />
|
|
8
|
-
<script src="https://cdn.tailwindcss.com"></script>
|
|
9
|
-
</head>
|
|
10
|
-
<body>
|
|
11
|
-
<div style="background-color: #f6f6f6; max-width: 796px;" class="p-6 m-0 h-auto w-full rounded-2xl sm:p-16 break-keep">
|
|
12
|
-
<div class="flex flex-row items-center">
|
|
13
|
-
<div class="w-16"><img src="https://resource.tosel.co.kr/images/img-icon-KU.png" alt="" class="object-cover"></div>
|
|
14
|
-
<div>
|
|
15
|
-
<div class="text-sm text-black break-keep">고려대학교 | 미래교육원</div>
|
|
16
|
-
<div class="text-2xl text-red-800 font-bold">토셀 전문가 과정</div>
|
|
17
|
-
</div>
|
|
18
|
-
</div>
|
|
19
|
-
<div class="flex flex-col-reverse sm:flex-row ">
|
|
20
|
-
<div class="text-base w-full h-fit mt-0 rounded-lg bg-stone-200 p-4 sm:w-80 sm:flex-none sm:mt-6" >
|
|
21
|
-
<div class="flex flex-row p-1">
|
|
22
|
-
<div class="text-red-800 font-bold text-sm sm:text-base">대상</div>
|
|
23
|
-
<div class="ml-4 text-stone-500 font-bold text-sm sm:text-base">토셀 랩 지정교육기관 / 희망기관 학원장 및 소속 강사진</div>
|
|
24
|
-
</div>
|
|
25
|
-
<div class="flex flex-row p-1">
|
|
26
|
-
<div class="text-red-800 font-bold text-sm sm:text-base">혜택</div>
|
|
27
|
-
<div class="ml-4 text-stone-500 font-bold text-sm sm:text-base">
|
|
28
|
-
<div>고려대학교 총장 및 미래교육원장 명의 수료증 발급</div>
|
|
29
|
-
<div>다양한 기관 및 교수진과의 네트워크</div>
|
|
30
|
-
</div>
|
|
31
|
-
</div>
|
|
32
|
-
<div class="flex flex-row p-1">
|
|
33
|
-
<div class="text-red-800 font-bold text-sm sm:text-base">목적</div>
|
|
34
|
-
<div class="ml-4 text-stone-500 font-bold text-sm sm:text-base">TOSEL 교육과정을 기반으로 한 영어교육 전문가 양성</div>
|
|
35
|
-
</div>
|
|
36
|
-
</div>
|
|
37
|
-
<div class="w-auto block ml-4 sm:w-full"><img src="https://resource.tosel.co.kr/images/img-gomito-teacher.png" alt="스피킹시리즈이미지"></div>
|
|
38
|
-
</div>
|
|
39
|
-
<div>
|
|
40
|
-
<div class="text-xl font-bold text-red-800 mt-8">왜 토셀에서 배워야 할까요?</div>
|
|
41
|
-
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">20년간 영어평가시장을 선도해온 토셀은 축적된 데이터를 기반으로 수준 높은 수업을 제공합니다</div>
|
|
42
|
-
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">남다른 관점으로, 토셀 컨텐츠를 활용할 수 있는 확실한 방법을 알려드립니다</div>
|
|
43
|
-
<div class="w-full h-fit overflow-hidden rounded-xl mt-8">
|
|
44
|
-
<img src="https://resource.tosel.co.kr/images/img-koreauniversity.png" alt="">
|
|
45
|
-
</div>
|
|
46
|
-
<div class="text-xl font-bold text-red-800 mt-8">남다른 토셀의 혜택</div>
|
|
47
|
-
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">고려대학교 미래교육원과 함께하는 TOSEL 전문가 과정</div>
|
|
48
|
-
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">참여하면 이런 혜택이 있어요</div>
|
|
49
|
-
<div class="flex flex-wrap w-full gap-4 mt-4">
|
|
50
|
-
<div class="flex-1 bg-stone-200 min-w-60 h-30 p-4 rounded-lg flex flex-row border-2 border-stone-300">
|
|
51
|
-
<div>
|
|
52
|
-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 stroke-stone-800">
|
|
53
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 0 0 8.716-6.747M12 21a9.004 9.004 0 0 1-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 0 1 7.843 4.582M12 3a8.997 8.997 0 0 0-7.843 4.582m15.686 0A11.953 11.953 0 0 1 12 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0 1 21 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0 1 12 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 0 1 3 12c0-1.605.42-3.113 1.157-4.418" />
|
|
54
|
-
</svg>
|
|
55
|
-
</div>
|
|
56
|
-
<div class="flex flex-col ml-4 text-stone-500">
|
|
57
|
-
<div class="font-bold text-base text-stone-800 sm:text-lg">다양한 네트워킹 기회</div>
|
|
58
|
-
<div class="font-medium text-sm mt-2">교수진, 각 기관과의 네트워킹 기회가 주어집니다.</div>
|
|
59
|
-
</div>
|
|
60
|
-
</div>
|
|
61
|
-
<div class="flex-1 bg-stone-200 min-w-60 h-30 p-4 rounded-lg flex flex-row border-2 border-stone-300">
|
|
62
|
-
<div>
|
|
63
|
-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 stroke-stone-800">
|
|
64
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 0 1-1.043 3.296 3.745 3.745 0 0 1-3.296 1.043A3.745 3.745 0 0 1 12 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 0 1-3.296-1.043 3.745 3.745 0 0 1-1.043-3.296A3.745 3.745 0 0 1 3 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 0 1 1.043-3.296 3.746 3.746 0 0 1 3.296-1.043A3.746 3.746 0 0 1 12 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 0 1 3.296 1.043 3.746 3.746 0 0 1 1.043 3.296A3.745 3.745 0 0 1 21 12Z" />
|
|
65
|
-
</svg>
|
|
66
|
-
</div>
|
|
67
|
-
<div class="flex flex-col ml-4 text-stone-500">
|
|
68
|
-
<div class="font-bold text-base text-stone-800 sm:text-lg">공신력 강화</div>
|
|
69
|
-
<div class="font-medium text-sm mt-2">고려대학교 총장 명의의 수료증이 발급됩니다.</div>
|
|
70
|
-
</div>
|
|
71
|
-
</div>
|
|
72
|
-
<div class="flex-1 bg-stone-200 min-w-60 h-30 p-4 rounded-lg flex flex-row border-2 border-stone-300">
|
|
73
|
-
<div>
|
|
74
|
-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 stroke-stone-800">
|
|
75
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6.042A8.967 8.967 0 0 0 6 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 0 1 6 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 0 1 6-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0 0 18 18a8.967 8.967 0 0 0-6 2.292m0-14.25v14.25" />
|
|
76
|
-
</svg>
|
|
77
|
-
|
|
78
|
-
</div>
|
|
79
|
-
<div class="flex flex-col ml-4 text-stone-500">
|
|
80
|
-
<div class="font-bold text-base text-stone-800 sm:text-lg">영어 교육 커리큘럼</div>
|
|
81
|
-
<div class="font-medium text-sm mt-2">토셀 컨텐츠를 활용할 수 있는 커리큘럼을 배울 수 있습니다</div>
|
|
82
|
-
</div>
|
|
83
|
-
</div>
|
|
84
|
-
<div class="flex-1 bg-stone-200 min-w-60 h-30 p-4 rounded-lg flex flex-row border-2 border-stone-300">
|
|
85
|
-
<div>
|
|
86
|
-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 stroke-stone-800">
|
|
87
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M4.26 10.147a60.438 60.438 0 0 0-.491 6.347A48.62 48.62 0 0 1 12 20.904a48.62 48.62 0 0 1 8.232-4.41 60.46 60.46 0 0 0-.491-6.347m-15.482 0a50.636 50.636 0 0 0-2.658-.813A59.906 59.906 0 0 1 12 3.493a59.903 59.903 0 0 1 10.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.717 50.717 0 0 1 12 13.489a50.702 50.702 0 0 1 7.74-3.342M6.75 15a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm0 0v-3.675A55.378 55.378 0 0 1 12 8.443m-7.007 11.55A5.981 5.981 0 0 0 6.75 15.75v-1.5" />
|
|
88
|
-
</svg>
|
|
89
|
-
</div>
|
|
90
|
-
<div class="flex flex-col ml-4 text-stone-500">
|
|
91
|
-
<div class="font-bold text-base text-stone-800 sm:text-lg">전문지식 습득</div>
|
|
92
|
-
<div class="font-medium text-sm mt-2">일반적 영어교수법에 대한 전문지식을 강화합니다</div>
|
|
93
|
-
</div>
|
|
94
|
-
</div>
|
|
95
|
-
</div>
|
|
96
|
-
<div class="text-xl font-bold text-red-800 mt-8">지금 바로 신청하세요</div>
|
|
97
|
-
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">9월에 개강하는 전문가 과정에 지원가능해요</div>
|
|
98
|
-
<div class="w-full h-fit p-4 bg-red-800 rounded-lg mt-4 flex flex-col gap-2">
|
|
99
|
-
<div class="flex flex-row gap-4">
|
|
100
|
-
<div class="text-base text-white font-bold">전형기간</div>
|
|
101
|
-
<div class="text-base text-white">2024년 8월 24일까지</div>
|
|
102
|
-
</div>
|
|
103
|
-
<div class="flex flex-row gap-4">
|
|
104
|
-
<div class="text-base text-white font-bold">전형방법</div>
|
|
105
|
-
<div class="text-base text-white">서류 및 면접전형</div>
|
|
106
|
-
</div>
|
|
107
|
-
<div class="flex flex-row gap-4">
|
|
108
|
-
<div class="text-base text-white font-bold">합격자 발표</div>
|
|
109
|
-
<div class="text-base text-white">2024년 8월 26일</div>
|
|
110
|
-
</div>
|
|
111
|
-
</div>
|
|
112
|
-
<div class="text-xs mt-1 text-red-800">*정원충족에 따라 차후 개강 여부가 결정될 수 있습니다</div>
|
|
113
|
-
<div class="text-sm mt-4 text-red-800 text-center p-4 bg-stone-200 rounded-lg">관련문의: tosel_lab@tosel.co.kr</div>
|
|
114
|
-
</div>
|
|
115
|
-
</div>
|
|
116
|
-
</body>
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=<device-width>, initial-scale=1.0">
|
|
6
|
+
<title>Document</title>
|
|
7
|
+
<link rel="stylesheet" as="style" crossorigin href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css" />
|
|
8
|
+
<script src="https://cdn.tailwindcss.com"></script>
|
|
9
|
+
</head>
|
|
10
|
+
<body>
|
|
11
|
+
<div style="background-color: #f6f6f6; max-width: 796px;" class="p-6 m-0 h-auto w-full rounded-2xl sm:p-16 break-keep">
|
|
12
|
+
<div class="flex flex-row items-center">
|
|
13
|
+
<div class="w-16"><img src="https://resource.tosel.co.kr/images/img-icon-KU.png" alt="" class="object-cover"></div>
|
|
14
|
+
<div>
|
|
15
|
+
<div class="text-sm text-black break-keep">고려대학교 | 미래교육원</div>
|
|
16
|
+
<div class="text-2xl text-red-800 font-bold">토셀 전문가 과정</div>
|
|
17
|
+
</div>
|
|
18
|
+
</div>
|
|
19
|
+
<div class="flex flex-col-reverse sm:flex-row ">
|
|
20
|
+
<div class="text-base w-full h-fit mt-0 rounded-lg bg-stone-200 p-4 sm:w-80 sm:flex-none sm:mt-6" >
|
|
21
|
+
<div class="flex flex-row p-1">
|
|
22
|
+
<div class="text-red-800 font-bold text-sm sm:text-base">대상</div>
|
|
23
|
+
<div class="ml-4 text-stone-500 font-bold text-sm sm:text-base">토셀 랩 지정교육기관 / 희망기관 학원장 및 소속 강사진</div>
|
|
24
|
+
</div>
|
|
25
|
+
<div class="flex flex-row p-1">
|
|
26
|
+
<div class="text-red-800 font-bold text-sm sm:text-base">혜택</div>
|
|
27
|
+
<div class="ml-4 text-stone-500 font-bold text-sm sm:text-base">
|
|
28
|
+
<div>고려대학교 총장 및 미래교육원장 명의 수료증 발급</div>
|
|
29
|
+
<div>다양한 기관 및 교수진과의 네트워크</div>
|
|
30
|
+
</div>
|
|
31
|
+
</div>
|
|
32
|
+
<div class="flex flex-row p-1">
|
|
33
|
+
<div class="text-red-800 font-bold text-sm sm:text-base">목적</div>
|
|
34
|
+
<div class="ml-4 text-stone-500 font-bold text-sm sm:text-base">TOSEL 교육과정을 기반으로 한 영어교육 전문가 양성</div>
|
|
35
|
+
</div>
|
|
36
|
+
</div>
|
|
37
|
+
<div class="w-auto block ml-4 sm:w-full"><img src="https://resource.tosel.co.kr/images/img-gomito-teacher.png" alt="스피킹시리즈이미지"></div>
|
|
38
|
+
</div>
|
|
39
|
+
<div>
|
|
40
|
+
<div class="text-xl font-bold text-red-800 mt-8">왜 토셀에서 배워야 할까요?</div>
|
|
41
|
+
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">20년간 영어평가시장을 선도해온 토셀은 축적된 데이터를 기반으로 수준 높은 수업을 제공합니다</div>
|
|
42
|
+
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">남다른 관점으로, 토셀 컨텐츠를 활용할 수 있는 확실한 방법을 알려드립니다</div>
|
|
43
|
+
<div class="w-full h-fit overflow-hidden rounded-xl mt-8">
|
|
44
|
+
<img src="https://resource.tosel.co.kr/images/img-koreauniversity.png" alt="">
|
|
45
|
+
</div>
|
|
46
|
+
<div class="text-xl font-bold text-red-800 mt-8">남다른 토셀의 혜택</div>
|
|
47
|
+
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">고려대학교 미래교육원과 함께하는 TOSEL 전문가 과정</div>
|
|
48
|
+
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">참여하면 이런 혜택이 있어요</div>
|
|
49
|
+
<div class="flex flex-wrap w-full gap-4 mt-4">
|
|
50
|
+
<div class="flex-1 bg-stone-200 min-w-60 h-30 p-4 rounded-lg flex flex-row border-2 border-stone-300">
|
|
51
|
+
<div>
|
|
52
|
+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 stroke-stone-800">
|
|
53
|
+
<path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 0 0 8.716-6.747M12 21a9.004 9.004 0 0 1-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 0 1 7.843 4.582M12 3a8.997 8.997 0 0 0-7.843 4.582m15.686 0A11.953 11.953 0 0 1 12 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0 1 21 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0 1 12 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 0 1 3 12c0-1.605.42-3.113 1.157-4.418" />
|
|
54
|
+
</svg>
|
|
55
|
+
</div>
|
|
56
|
+
<div class="flex flex-col ml-4 text-stone-500">
|
|
57
|
+
<div class="font-bold text-base text-stone-800 sm:text-lg">다양한 네트워킹 기회</div>
|
|
58
|
+
<div class="font-medium text-sm mt-2">교수진, 각 기관과의 네트워킹 기회가 주어집니다.</div>
|
|
59
|
+
</div>
|
|
60
|
+
</div>
|
|
61
|
+
<div class="flex-1 bg-stone-200 min-w-60 h-30 p-4 rounded-lg flex flex-row border-2 border-stone-300">
|
|
62
|
+
<div>
|
|
63
|
+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 stroke-stone-800">
|
|
64
|
+
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 0 1-1.043 3.296 3.745 3.745 0 0 1-3.296 1.043A3.745 3.745 0 0 1 12 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 0 1-3.296-1.043 3.745 3.745 0 0 1-1.043-3.296A3.745 3.745 0 0 1 3 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 0 1 1.043-3.296 3.746 3.746 0 0 1 3.296-1.043A3.746 3.746 0 0 1 12 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 0 1 3.296 1.043 3.746 3.746 0 0 1 1.043 3.296A3.745 3.745 0 0 1 21 12Z" />
|
|
65
|
+
</svg>
|
|
66
|
+
</div>
|
|
67
|
+
<div class="flex flex-col ml-4 text-stone-500">
|
|
68
|
+
<div class="font-bold text-base text-stone-800 sm:text-lg">공신력 강화</div>
|
|
69
|
+
<div class="font-medium text-sm mt-2">고려대학교 총장 명의의 수료증이 발급됩니다.</div>
|
|
70
|
+
</div>
|
|
71
|
+
</div>
|
|
72
|
+
<div class="flex-1 bg-stone-200 min-w-60 h-30 p-4 rounded-lg flex flex-row border-2 border-stone-300">
|
|
73
|
+
<div>
|
|
74
|
+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 stroke-stone-800">
|
|
75
|
+
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6.042A8.967 8.967 0 0 0 6 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 0 1 6 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 0 1 6-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0 0 18 18a8.967 8.967 0 0 0-6 2.292m0-14.25v14.25" />
|
|
76
|
+
</svg>
|
|
77
|
+
|
|
78
|
+
</div>
|
|
79
|
+
<div class="flex flex-col ml-4 text-stone-500">
|
|
80
|
+
<div class="font-bold text-base text-stone-800 sm:text-lg">영어 교육 커리큘럼</div>
|
|
81
|
+
<div class="font-medium text-sm mt-2">토셀 컨텐츠를 활용할 수 있는 커리큘럼을 배울 수 있습니다</div>
|
|
82
|
+
</div>
|
|
83
|
+
</div>
|
|
84
|
+
<div class="flex-1 bg-stone-200 min-w-60 h-30 p-4 rounded-lg flex flex-row border-2 border-stone-300">
|
|
85
|
+
<div>
|
|
86
|
+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 stroke-stone-800">
|
|
87
|
+
<path stroke-linecap="round" stroke-linejoin="round" d="M4.26 10.147a60.438 60.438 0 0 0-.491 6.347A48.62 48.62 0 0 1 12 20.904a48.62 48.62 0 0 1 8.232-4.41 60.46 60.46 0 0 0-.491-6.347m-15.482 0a50.636 50.636 0 0 0-2.658-.813A59.906 59.906 0 0 1 12 3.493a59.903 59.903 0 0 1 10.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.717 50.717 0 0 1 12 13.489a50.702 50.702 0 0 1 7.74-3.342M6.75 15a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm0 0v-3.675A55.378 55.378 0 0 1 12 8.443m-7.007 11.55A5.981 5.981 0 0 0 6.75 15.75v-1.5" />
|
|
88
|
+
</svg>
|
|
89
|
+
</div>
|
|
90
|
+
<div class="flex flex-col ml-4 text-stone-500">
|
|
91
|
+
<div class="font-bold text-base text-stone-800 sm:text-lg">전문지식 습득</div>
|
|
92
|
+
<div class="font-medium text-sm mt-2">일반적 영어교수법에 대한 전문지식을 강화합니다</div>
|
|
93
|
+
</div>
|
|
94
|
+
</div>
|
|
95
|
+
</div>
|
|
96
|
+
<div class="text-xl font-bold text-red-800 mt-8">지금 바로 신청하세요</div>
|
|
97
|
+
<div class="text-sm font-medium text-stone-500 mt-1 sm:text-base">9월에 개강하는 전문가 과정에 지원가능해요</div>
|
|
98
|
+
<div class="w-full h-fit p-4 bg-red-800 rounded-lg mt-4 flex flex-col gap-2">
|
|
99
|
+
<div class="flex flex-row gap-4">
|
|
100
|
+
<div class="text-base text-white font-bold">전형기간</div>
|
|
101
|
+
<div class="text-base text-white">2024년 8월 24일까지</div>
|
|
102
|
+
</div>
|
|
103
|
+
<div class="flex flex-row gap-4">
|
|
104
|
+
<div class="text-base text-white font-bold">전형방법</div>
|
|
105
|
+
<div class="text-base text-white">서류 및 면접전형</div>
|
|
106
|
+
</div>
|
|
107
|
+
<div class="flex flex-row gap-4">
|
|
108
|
+
<div class="text-base text-white font-bold">합격자 발표</div>
|
|
109
|
+
<div class="text-base text-white">2024년 8월 26일</div>
|
|
110
|
+
</div>
|
|
111
|
+
</div>
|
|
112
|
+
<div class="text-xs mt-1 text-red-800">*정원충족에 따라 차후 개강 여부가 결정될 수 있습니다</div>
|
|
113
|
+
<div class="text-sm mt-4 text-red-800 text-center p-4 bg-stone-200 rounded-lg">관련문의: tosel_lab@tosel.co.kr</div>
|
|
114
|
+
</div>
|
|
115
|
+
</div>
|
|
116
|
+
</body>
|
|
117
117
|
</html>
|
|
@@ -1,59 +1,59 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8">
|
|
5
|
-
<meta name="viewport" content="width=<device-width>, initial-scale=1.0">
|
|
6
|
-
<title>Document</title>
|
|
7
|
-
<link rel="stylesheet" as="style" crossorigin href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css" />
|
|
8
|
-
<script src="https://cdn.tailwindcss.com"></script>
|
|
9
|
-
</head>
|
|
10
|
-
<body>
|
|
11
|
-
<div style="background-color: #f6f6f6; max-width: 796px;" class="p-6 m-0 h-auto w-full rounded-2xl">
|
|
12
|
-
<div style="margin-bottom: 12px;" class="flex flex-row items-center">
|
|
13
|
-
<div style="width:fit-content; height: fit-content; padding: 4px 8px; border-radius: 6px; margin-right: 8px;" class="bg-black text-white text-sm sm:text-base">신규출간</div>
|
|
14
|
-
<div class="text-xl font-bold sm:text-3xl">Speaking Series</div>
|
|
15
|
-
</div>
|
|
16
|
-
<div class="bg-black h-0.5 mb-4"></div>
|
|
17
|
-
<div class="flex flex-col sm:flex-row">
|
|
18
|
-
<div class="flex flex-col m-0 mb-2 sm:mr-4 sm:my-auto sm:w-auto sm:ml-4">
|
|
19
|
-
<div class="text-base font-bold break-keep sm:text-xl">토셀의 노하우가 담긴 새로운 시리즈</div>
|
|
20
|
-
<div class="text-sm break-keep mt-0 sm:text-base sm:mt-4">토셀 스피킹 시리즈를 만나보세요</div>
|
|
21
|
-
<div class="text-sm break-keep sm:text-base">[사전구매 이벤트] 진행중</div>
|
|
22
|
-
</div>
|
|
23
|
-
<img src="https://resource.tosel.co.kr/images/img-ss.png" alt="스피킹시리즈이미지" class="w-auto sm:w-2/3 sm:max-w-sm sm:ml-auto">
|
|
24
|
-
</div>
|
|
25
|
-
<div style="background-color: #f0f0f0;" class="w-auto rounded-xl p-4 mt-4 sm:p-6">
|
|
26
|
-
<div class="text-base font-bold break-keep sm:text-xl">📖 토셀 스피킹은 이런 책이에요</div>
|
|
27
|
-
<ul class="list-disc ml-4 text-sm mt-2 break-keep sm:text-lg sm:mt-4">
|
|
28
|
-
<li>수준별 학습이 가능한 레벨체계</li>
|
|
29
|
-
<li>교과과정을 연계한 설계로 내신과 수행평가 대비</li>
|
|
30
|
-
<li>단어-문법-표현-대화로 이어지는 단계적 학습</li>
|
|
31
|
-
<li>전국 Speaking 올림피아드 공식 대비 교재</li>
|
|
32
|
-
</ul>
|
|
33
|
-
</div>
|
|
34
|
-
<div style="background-color: #f0f0f0;" class="w-auto rounded-xl p-4 mt-4 sm:p-6">
|
|
35
|
-
<div class="text-base font-bold break-keep sm:text-xl">👍 사전구매 혜택</div>
|
|
36
|
-
<div class="text-sm mt-2 break-keep sm:text-lg sm:mt-4">토셀 굿즈 4종 증정</div>
|
|
37
|
-
<div class="flex gap-4 mt-4 flex-wrap">
|
|
38
|
-
<div class="relative bg-white flex-1 rounded-lg min-w-60 overflow-hidden border-2">
|
|
39
|
-
<div class="absolute top-2 left-2 bg-black text-white text-sm rounded-md px-2 py-1 opacity-35 sm:text-base sm:top-4 sm:left-4">단어노트 5권</div>
|
|
40
|
-
<img src="https://resource.tosel.co.kr/images/goods-vocanote.png" alt="스피킹교재이미지" class="object-cover" >
|
|
41
|
-
</div>
|
|
42
|
-
<div class="relative bg-white flex-1 rounded-lg min-w-60 overflow-hidden border-2">
|
|
43
|
-
<div class="absolute top-2 left-2 bg-black text-white text-sm rounded-md px-2 py-1 opacity-35 sm:text-base sm:top-4 sm:left-4">오답노트 5권</div>
|
|
44
|
-
<img src="https://resource.tosel.co.kr/images/goods-checknote.png" alt="스피킹교재이미지" class="object-cover" >
|
|
45
|
-
</div>
|
|
46
|
-
<div class="relative bg-white flex-1 rounded-lg min-w-60 overflow-hidden border-2">
|
|
47
|
-
<div class="absolute top-2 left-2 bg-black text-white text-sm rounded-md px-2 py-1 opacity-35 sm:text-base sm:top-4 sm:left-4">책받침 5개</div>
|
|
48
|
-
<img src="https://resource.tosel.co.kr/images/goods-hardcover.png" alt="스피킹교재이미지" class="object-cover" >
|
|
49
|
-
</div>
|
|
50
|
-
<div class="relative bg-white flex-1 rounded-lg min-w-60 overflow-hidden border-2">
|
|
51
|
-
<div class="absolute top-2 left-2 bg-black text-white text-sm rounded-md px-2 py-1 opacity-35 sm:text-base sm:top-4 sm:left-4">토셀 캘린더</div>
|
|
52
|
-
<img src="https://resource.tosel.co.kr/images/goods-calendar2024.png" alt="스피킹교재이미지" class="object-cover" >
|
|
53
|
-
</div>
|
|
54
|
-
</div>
|
|
55
|
-
</div>
|
|
56
|
-
<div style="background-color:#f0f0f0;" class="w-auto h-auto text-center p-4 mt-8 text-sm rounded-2xl">🛍 지금 토셀 북스토어에서 만날 수 있어요!</div>
|
|
57
|
-
</div>
|
|
58
|
-
</body>
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=<device-width>, initial-scale=1.0">
|
|
6
|
+
<title>Document</title>
|
|
7
|
+
<link rel="stylesheet" as="style" crossorigin href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css" />
|
|
8
|
+
<script src="https://cdn.tailwindcss.com"></script>
|
|
9
|
+
</head>
|
|
10
|
+
<body>
|
|
11
|
+
<div style="background-color: #f6f6f6; max-width: 796px;" class="p-6 m-0 h-auto w-full rounded-2xl">
|
|
12
|
+
<div style="margin-bottom: 12px;" class="flex flex-row items-center">
|
|
13
|
+
<div style="width:fit-content; height: fit-content; padding: 4px 8px; border-radius: 6px; margin-right: 8px;" class="bg-black text-white text-sm sm:text-base">신규출간</div>
|
|
14
|
+
<div class="text-xl font-bold sm:text-3xl">Speaking Series</div>
|
|
15
|
+
</div>
|
|
16
|
+
<div class="bg-black h-0.5 mb-4"></div>
|
|
17
|
+
<div class="flex flex-col sm:flex-row">
|
|
18
|
+
<div class="flex flex-col m-0 mb-2 sm:mr-4 sm:my-auto sm:w-auto sm:ml-4">
|
|
19
|
+
<div class="text-base font-bold break-keep sm:text-xl">토셀의 노하우가 담긴 새로운 시리즈</div>
|
|
20
|
+
<div class="text-sm break-keep mt-0 sm:text-base sm:mt-4">토셀 스피킹 시리즈를 만나보세요</div>
|
|
21
|
+
<div class="text-sm break-keep sm:text-base">[사전구매 이벤트] 진행중</div>
|
|
22
|
+
</div>
|
|
23
|
+
<img src="https://resource.tosel.co.kr/images/img-ss.png" alt="스피킹시리즈이미지" class="w-auto sm:w-2/3 sm:max-w-sm sm:ml-auto">
|
|
24
|
+
</div>
|
|
25
|
+
<div style="background-color: #f0f0f0;" class="w-auto rounded-xl p-4 mt-4 sm:p-6">
|
|
26
|
+
<div class="text-base font-bold break-keep sm:text-xl">📖 토셀 스피킹은 이런 책이에요</div>
|
|
27
|
+
<ul class="list-disc ml-4 text-sm mt-2 break-keep sm:text-lg sm:mt-4">
|
|
28
|
+
<li>수준별 학습이 가능한 레벨체계</li>
|
|
29
|
+
<li>교과과정을 연계한 설계로 내신과 수행평가 대비</li>
|
|
30
|
+
<li>단어-문법-표현-대화로 이어지는 단계적 학습</li>
|
|
31
|
+
<li>전국 Speaking 올림피아드 공식 대비 교재</li>
|
|
32
|
+
</ul>
|
|
33
|
+
</div>
|
|
34
|
+
<div style="background-color: #f0f0f0;" class="w-auto rounded-xl p-4 mt-4 sm:p-6">
|
|
35
|
+
<div class="text-base font-bold break-keep sm:text-xl">👍 사전구매 혜택</div>
|
|
36
|
+
<div class="text-sm mt-2 break-keep sm:text-lg sm:mt-4">토셀 굿즈 4종 증정</div>
|
|
37
|
+
<div class="flex gap-4 mt-4 flex-wrap">
|
|
38
|
+
<div class="relative bg-white flex-1 rounded-lg min-w-60 overflow-hidden border-2">
|
|
39
|
+
<div class="absolute top-2 left-2 bg-black text-white text-sm rounded-md px-2 py-1 opacity-35 sm:text-base sm:top-4 sm:left-4">단어노트 5권</div>
|
|
40
|
+
<img src="https://resource.tosel.co.kr/images/goods-vocanote.png" alt="스피킹교재이미지" class="object-cover" >
|
|
41
|
+
</div>
|
|
42
|
+
<div class="relative bg-white flex-1 rounded-lg min-w-60 overflow-hidden border-2">
|
|
43
|
+
<div class="absolute top-2 left-2 bg-black text-white text-sm rounded-md px-2 py-1 opacity-35 sm:text-base sm:top-4 sm:left-4">오답노트 5권</div>
|
|
44
|
+
<img src="https://resource.tosel.co.kr/images/goods-checknote.png" alt="스피킹교재이미지" class="object-cover" >
|
|
45
|
+
</div>
|
|
46
|
+
<div class="relative bg-white flex-1 rounded-lg min-w-60 overflow-hidden border-2">
|
|
47
|
+
<div class="absolute top-2 left-2 bg-black text-white text-sm rounded-md px-2 py-1 opacity-35 sm:text-base sm:top-4 sm:left-4">책받침 5개</div>
|
|
48
|
+
<img src="https://resource.tosel.co.kr/images/goods-hardcover.png" alt="스피킹교재이미지" class="object-cover" >
|
|
49
|
+
</div>
|
|
50
|
+
<div class="relative bg-white flex-1 rounded-lg min-w-60 overflow-hidden border-2">
|
|
51
|
+
<div class="absolute top-2 left-2 bg-black text-white text-sm rounded-md px-2 py-1 opacity-35 sm:text-base sm:top-4 sm:left-4">토셀 캘린더</div>
|
|
52
|
+
<img src="https://resource.tosel.co.kr/images/goods-calendar2024.png" alt="스피킹교재이미지" class="object-cover" >
|
|
53
|
+
</div>
|
|
54
|
+
</div>
|
|
55
|
+
</div>
|
|
56
|
+
<div style="background-color:#f0f0f0;" class="w-auto h-auto text-center p-4 mt-8 text-sm rounded-2xl">🛍 지금 토셀 북스토어에서 만날 수 있어요!</div>
|
|
57
|
+
</div>
|
|
58
|
+
</body>
|
|
59
59
|
</html>
|