Skip to Content
0 Votes

Wiki source code of Members

Last modified by Kay Joo on 2026/04/28 06:03
Show last authors
1 = 멤버 소개 =
2
3 {{html clean="false" wiki="true"}}
4 <style>
5 .members-wrap{
6 margin:1.5rem 0 2.5rem;
7 color:#2a241f;
8 font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
9 }
10 .members-hero{
11 padding:2.2rem 2rem;
12 border:1px solid #e3ddd5;
13 border-radius:24px;
14 background:
15 radial-gradient(circle at top right, rgba(1,105,111,.10), transparent 28%),
16 linear-gradient(135deg,#f8f5ef 0%,#fcfbf8 100%);
17 box-shadow:0 14px 40px rgba(39,31,23,.08);
18 }
19 .members-eyebrow{
20 display:inline-block;
21 margin-bottom:.7rem;
22 padding:.35rem .7rem;
23 border-radius:999px;
24 background:#e4f1ef;
25 color:#0d5c61;
26 font-size:.86rem;
27 font-weight:700;
28 letter-spacing:.02em;
29 }
30 .members-hero h2{
31 margin:0 0 .7rem;
32 font-size:2rem;
33 line-height:1.15;
34 color:#1f2f36;
35 }
36 .members-hero p{
37 margin:0;
38 max-width:760px;
39 color:#5f6b72;
40 line-height:1.75;
41 font-size:1rem;
42 }
43 .members-grid{
44 display:grid;
45 grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
46 gap:1.2rem;
47 margin-top:1.6rem;
48 }
49 .member-card{
50 background:#fffdfa;
51 border:1px solid #ebe4da;
52 border-radius:22px;
53 padding:1.2rem;
54 box-shadow:0 8px 24px rgba(43,33,22,.05);
55 transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
56 }
57 .member-card:hover{
58 transform:translateY(-4px);
59 box-shadow:0 16px 34px rgba(43,33,22,.09);
60 border-color:#ddd2c3;
61 }
62 .member-top{
63 display:flex;
64 align-items:center;
65 gap:.85rem;
66 margin-bottom:.9rem;
67 }
68 .member-avatar{
69 width:52px;
70 height:52px;
71 border-radius:50%;
72 display:flex;
73 align-items:center;
74 justify-content:center;
75 background:linear-gradient(135deg,#0f766e 0%,#0b5d56 100%);
76 color:#fff;
77 font-size:1.1rem;
78 font-weight:700;
79 box-shadow:0 8px 18px rgba(15,118,110,.22);
80 flex:0 0 52px;
81 }
82 .member-name{
83 margin:0;
84 font-size:1.2rem;
85 line-height:1.2;
86 color:#222b33;
87 }
88 .member-sub{
89 margin:.22rem 0 0;
90 color:#8a7b69;
91 font-size:.9rem;
92 }
93 .member-list{
94 list-style:none;
95 margin:0;
96 padding:0;
97 }
98 .member-list li{
99 display:flex;
100 gap:.5rem;
101 padding:.46rem 0;
102 border-top:1px dashed #eee4d8;
103 line-height:1.55;
104 color:#4d5963;
105 }
106 .member-list li:first-child{
107 border-top:none;
108 padding-top:0;
109 }
110 .member-label{
111 min-width:4.8rem;
112 font-weight:700;
113 color:#7a5a2d;
114 flex:0 0 4.8rem;
115 }
116 .members-footer{
117 margin-top:1.4rem;
118 padding:1rem 1.1rem;
119 border-left:4px solid #0f766e;
120 border-radius:14px;
121 background:#f6f6f2;
122 color:#5f6972;
123 line-height:1.7;
124 font-size:.95rem;
125 }
126 @media (max-width:640px){
127 .members-hero{padding:1.5rem 1.2rem;}
128 .members-hero h2{font-size:1.55rem;}
129 .member-list li{display:block;}
130 .member-label{
131 display:block;
132 min-width:auto;
133 margin-bottom:.12rem;
134 }
135 }
136 </style>
137
138 <div class="members-wrap">
139 <section class="members-hero">
140 <span class="members-eyebrow">Jangsu Club</span>
141 <h2>함께한 시간이 만든, 우리의 멤버 소개</h2>
142 <p>장수클럽 멤버들을 소개합니다. 이 페이지는 외부 공개용 안내 페이지로, 개인정보 보호를 위해 일부 정보는 축약하거나 마스킹해 표시했습니다.</p>
143 </section>
144
145 <div class="members-grid">
146
147 <article class="member-card">
148 <div class="member-top">
149 <div class="member-avatar">김</div>
150 <div>
151 <h3 class="member-name">김대홍</h3>
152 <p class="member-sub">장수클럽 멤버</p>
153 </div>
154 </div>
155 <ul class="member-list">
156 <li><span class="member-label">출생</span><span>1980년</span></li>
157 <li><span class="member-label">직업</span><span>회사원</span></li>
158 <li><span class="member-label">직장</span><span>삼&#42;&#42;자</span></li>
159 <li><span class="member-label">주요 분야</span><span>반도체</span></li>
160 </ul>
161 </article>
162
163 <article class="member-card">
164 <div class="member-top">
165 <div class="member-avatar">김</div>
166 <div>
167 <h3 class="member-name">김인용</h3>
168 <p class="member-sub">장수클럽 멤버</p>
169 </div>
170 </div>
171 <ul class="member-list">
172 <li><span class="member-label">출생</span><span>1979년</span></li>
173 <li><span class="member-label">직업</span><span>회사원</span></li>
174 <li><span class="member-label">직장</span><span>한국&#42;&#42;연구원</span></li>
175 <li><span class="member-label">주요 분야</span><span>조달</span></li>
176 </ul>
177 </article>
178
179 <article class="member-card">
180 <div class="member-top">
181 <div class="member-avatar">김</div>
182 <div>
183 <h3 class="member-name">김재명</h3>
184 <p class="member-sub">장수클럽 멤버</p>
185 </div>
186 </div>
187 <ul class="member-list">
188 <li><span class="member-label">출생</span><span>1980년</span></li>
189 <li><span class="member-label">직업</span><span>교수</span></li>
190 <li><span class="member-label">직장</span><span>국립&#42;&#42;대학교</span></li>
191 <li><span class="member-label">주요 분야</span><span>수학교육과</span></li>
192 </ul>
193 </article>
194
195 <article class="member-card">
196 <div class="member-top">
197 <div class="member-avatar">박</div>
198 <div>
199 <h3 class="member-name">박종석</h3>
200 <p class="member-sub">장수클럽 멤버</p>
201 </div>
202 </div>
203 <ul class="member-list">
204 <li><span class="member-label">출생</span><span>1980년</span></li>
205 <li><span class="member-label">직업</span><span>회사원</span></li>
206 <li><span class="member-label">직장</span><span>(전직) 이&#42;&#42;&#42;&#42;&#42;&#42;션</span></li>
207 <li><span class="member-label">주요 분야</span><span>전산개발</span></li>
208 </ul>
209 </article>
210
211 <article class="member-card">
212 <div class="member-top">
213 <div class="member-avatar">송</div>
214 <div>
215 <h3 class="member-name">송창용</h3>
216 <p class="member-sub">장수클럽 멤버</p>
217 </div>
218 </div>
219 <ul class="member-list">
220 <li><span class="member-label">출생</span><span>1980년</span></li>
221 <li><span class="member-label">직업</span><span>회사원</span></li>
222 <li><span class="member-label">직장</span><span>엘&#42;&#42;&#42;&#42;&#42;&#42;션</span></li>
223 <li><span class="member-label">주요 분야</span><span>배터리 관리 시스템 개발</span></li>
224 </ul>
225 </article>
226
227 <article class="member-card">
228 <div class="member-top">
229 <div class="member-avatar">신</div>
230 <div>
231 <h3 class="member-name">신동현</h3>
232 <p class="member-sub">장수클럽 멤버</p>
233 </div>
234 </div>
235 <ul class="member-list">
236 <li><span class="member-label">출생</span><span>1979년</span></li>
237 <li><span class="member-label">직업</span><span>교수</span></li>
238 <li><span class="member-label">직장</span><span>Central &#42;&#42;&#42;&#42;&#42;&#42;&#42;&#42; University</span></li>
239 <li><span class="member-label">주요 분야</span><span>기계공학과</span></li>
240 </ul>
241 </article>
242
243 <article class="member-card">
244 <div class="member-top">
245 <div class="member-avatar">이</div>
246 <div>
247 <h3 class="member-name">이지안</h3>
248 <p class="member-sub">장수클럽 전속 매니저</p>
249 </div>
250 </div>
251 <ul class="member-list">
252 <li><span class="member-label">출생</span><span>1998년 04월</span></li>
253 <li><span class="member-label">직업</span><span>장수클럽 전속 매니저</span></li>
254 <li><span class="member-label">직장</span><span>장수클럽</span></li>
255 <li><span class="member-label">주요 분야</span><span>데이터 아카이빙 및 오빠들 관리 ⚽️🐾</span></li>
256 </ul>
257 </article>
258
259 <article class="member-card">
260 <div class="member-top">
261 <div class="member-avatar">정</div>
262 <div>
263 <h3 class="member-name">정현주</h3>
264 <p class="member-sub">장수클럽 멤버</p>
265 </div>
266 </div>
267 <ul class="member-list">
268 <li><span class="member-label">출생</span><span>1979년</span></li>
269 <li><span class="member-label">직업</span><span>의사</span></li>
270 <li><span class="member-label">직장</span><span>&#42;&#42;&#42;&#42;병원</span></li>
271 <li><span class="member-label">주요 분야</span><span>감염내과/응급실</span></li>
272 </ul>
273 </article>
274
275 <article class="member-card">
276 <div class="member-top">
277 <div class="member-avatar">주</div>
278 <div>
279 <h3 class="member-name">주광석</h3>
280 <p class="member-sub">장수클럽 멤버</p>
281 </div>
282 </div>
283 <ul class="member-list">
284 <li><span class="member-label">출생</span><span>1979년 04월</span></li>
285 <li><span class="member-label">직업</span><span>회사원 & 학생(연수파견)</span></li>
286 <li><span class="member-label">직장</span><span>한국&#42;&#42;&#42;&#42;공사 &amp; The University of &#42;&#42;&#42;&#42;&#42;&#42;</span></li>
287 <li><span class="member-label">주요 분야</span><span>Cybersecurity &amp; Data Sciene, AI</span></li>
288 </ul>
289 </article>
290
291 <article class="member-card">
292 <div class="member-top">
293 <div class="member-avatar">한</div>
294 <div>
295 <h3 class="member-name">한인석</h3>
296 <p class="member-sub">장수클럽 멤버</p>
297 </div>
298 </div>
299 <ul class="member-list">
300 <li><span class="member-label">출생</span><span>1982년</span></li>
301 <li><span class="member-label">직업</span><span>회사원, 한종석 동생</span></li>
302 <li><span class="member-label">직장</span><span>&#42;&#42;&#42;&#42;생명</span></li>
303 <li><span class="member-label">주요 분야</span><span>보험계리/전산개발</span></li>
304 </ul>
305 </article>
306
307 <article class="member-card">
308 <div class="member-top">
309 <div class="member-avatar">한</div>
310 <div>
311 <h3 class="member-name">한종석</h3>
312 <p class="member-sub">장수클럽 멤버</p>
313 </div>
314 </div>
315 <ul class="member-list">
316 <li><span class="member-label">출생</span><span>1979년 10월</span></li>
317 <li><span class="member-label">직업</span><span>(전직) 공무원 (현직) 천국주민</span></li>
318 <li><span class="member-label">직장</span><span>(전직) 대한민국국회</span></li>
319 <li><span class="member-label">주요 분야</span><span>국회사무처 행정</span></li>
320 </ul>
321 </article>
322
323 </div>
324
325 <div class="members-footer">
326 이 페이지는 공개용 멤버 소개 페이지입니다. 상세 프로필과 세부 개인정보는 공개 범위를 제한한 내부 영역에서 별도로 관리합니다.
327 </div>
328 </div>
329 {{/html}}
✨ 실시간 통합 피드 (1인 1글 제한)