-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathCustomers.html
More file actions
425 lines (423 loc) · 34.8 KB
/
Copy pathCustomers.html
File metadata and controls
425 lines (423 loc) · 34.8 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
<!DOCTYPE html>
<html class="dark" lang="zh-Hant-TW">
<head>
<meta charset="utf-8" />
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<title>客戶實例 | 先宏資訊</title>
<!-- SEO & Google Analytics -->
<meta name="description"
content="探索先宏資訊橫跨金融業、上市科技大廠與知名連鎖百貨的成功數位轉型案例。從授信核貸系統現代化，到 EIP 行動化與 AI 知識庫導入，見證企業如何藉助先宏克服系統瓶頸，實現高效辦公。">
<link rel="icon" href="assets/img/xred-logo-icon.ico" type="image/x-icon">
<link rel="canonical" href="https://www.xred.com.tw/Customers.html">
<meta property="og:type" content="website">
<meta property="og:site_name" content="先宏資訊">
<meta property="og:title" content="客戶實例 | 先宏資訊">
<meta property="og:description" content="探索先宏資訊橫跨金融業、上市科技大廠與知名連鎖百貨的成功數位轉型案例。從授信核貸系統現代化，到 EIP 行動化與 AI 知識庫導入，見證企業如何藉助先宏克服系統瓶頸，實現高效辦公。">
<meta property="og:url" content="https://www.xred.com.tw/Customers.html">
<meta property="og:image" content="https://www.xred.com.tw/assets/img/xred-logo.png">
<meta name="twitter:card" content="summary_large_image">
<script async src="https://www.googletagmanager.com/gtag/js?id=G-SRBKZG4REL"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag("js", new Date());
gtag("config", "G-SRBKZG4REL");
</script>
<!-- SEO & Google Analytics -->
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700;900&family=IBM+Plex+Mono:wght@300;400;500;600;700&family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap"
rel="stylesheet" />
<script src="assets/js/tailwind-config.js"></script>
<link rel="stylesheet" href="assets/css/common.css" />
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "CollectionPage",
"url": "https://www.xred.com.tw/Customers.html",
"name": "客戶實例 | 先宏資訊",
"description": "探索先宏資訊橫跨金融業、上市科技大廠與知名連鎖百貨的成功數位轉型案例。",
"publisher": {
"@id": "https://www.xred.com.tw/#organization"
}
}
</script>
<script>try{if(localStorage.getItem('theme')==='light'){document.documentElement.classList.remove('dark');document.documentElement.classList.add('light');}}catch(e){}</script>
</head>
<body class="bg-background text-on-background antialiased selection:bg-primary selection:text-on-primary">
<header id="header" class="sticky top-0 z-50 w-full transition-colors duration-300">
<nav class="layout-container flex justify-between items-stretch w-full h-[60px]">
<div id="header-logo" class="pr-3 sm:pr-6 flex items-center justify-start border-b border-outline-variant">
<a href="index.html" class="flex items-center">
<img alt="XRed Information" class="h-10 w-auto"
src="assets/img/xred-logo.webp" width="405" height="151" />
<h2 class="text-xl lg:text-2xl font-black tracking-tight">先宏資訊</h2>
</a>
</div>
<div class="flex-grow lg:hidden border-b border-outline-variant"
style="background-color: var(--logo-bg, #f8faff);"></div>
<div class="hidden lg:flex flex-grow items-stretch justify-end border-b border-outline-variant">
<a class="px-3 flex items-center border-r border-outline-variant hover:bg-surface-container transition-colors text-sm font-bold"
style="color: var(--nav-text);" href="index.html">[ 首頁 ]</a>
<a class="px-3 flex items-center border-r border-outline-variant hover:bg-surface-container transition-colors text-sm font-bold"
style="color: var(--nav-text);" href="AboutUs.html">[ 關於先宏 ]</a>
<div class="relative group flex items-stretch border-r border-outline-variant">
<a class="px-3 flex items-center hover:bg-surface-container transition-colors text-sm font-bold cursor-pointer"
style="color: var(--nav-text);" href="#">[ 產品與服務 ▾ ]</a>
<div
class="hidden group-hover:block absolute top-full right-0 z-50 min-w-[280px] border border-outline-variant shadow-2xl"
style="background-color: var(--header-bg);">
<div
class="px-4 py-2 text-[10px] font-bold font-mono uppercase tracking-[0.3em] border-b border-outline-variant bg-surface-container"
style="color: var(--nav-active);">// AI_賦能應用
</div>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors border-b border-outline-variant"
style="color: var(--nav-text);" href="services_XPertRAG.html">> X-Pert RAG 企業 AI
知識助理</a>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors border-b border-outline-variant"
style="color: var(--nav-text);" href="services_QilinAI.html">> Qilin AI 麒麟悟道</a>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors border-b border-outline-variant"
style="color: var(--nav-text);" href="services_OCR.html">> OCR 智慧文件辨識</a>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors border-b border-outline-variant"
style="color: var(--nav-text);" href="services_DominoClaw.html">> DominoClaw AI Agent</a>
<div
class="px-4 py-2 text-[10px] font-bold font-mono uppercase tracking-[0.3em] border-b border-outline-variant bg-surface-container"
style="color: var(--nav-active);">// 企業協同辦公
</div>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors border-b border-outline-variant"
style="color: var(--nav-text);" href="services_EIP.html">> 企業入口網站 EIP</a>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors border-b border-outline-variant"
style="color: var(--nav-text);" href="services_BPM.html">> Xpower BPM 企業簽核</a>
<div
class="px-4 py-2 text-[10px] font-bold font-mono uppercase tracking-[0.3em] border-b border-outline-variant bg-surface-container"
style="color: var(--nav-active);">// HCL_原廠專區
</div>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors border-b border-outline-variant"
style="color: var(--nav-text);" href="services_notesUpgrade.html">> HCL Notes / Domino</a>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors"
style="color: var(--nav-text);" href="hcl_voltmx.html">> HCL Volt MX</a>
</div>
</div>
<a class="px-3 flex items-center border-r border-outline-variant hover:bg-surface-container transition-colors text-sm font-bold"
style="color: var(--nav-text);" href="Customers.html">[ 客戶實例 ]</a>
<div class="relative group flex items-stretch border-r border-outline-variant">
<a class="px-3 flex items-center hover:bg-surface-container transition-colors text-sm font-bold cursor-pointer"
style="color: var(--nav-text);" href="#">[ 資源中心 ▾ ]</a>
<div
class="hidden group-hover:block absolute top-full right-0 z-50 min-w-[240px] border border-outline-variant shadow-2xl"
style="background-color: var(--header-bg);">
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors border-b border-outline-variant"
style="color: var(--nav-active);" href="http://www.xred.com.tw/hub.nsf" target="_blank">>
Resource Hub ↗</a>
<a class="block px-4 py-3 text-xs font-bold hover:bg-surface-container transition-colors"
style="color: var(--nav-active);" href="https://www.xred.com.tw:8000/ChatBotV2.html"
target="_blank">> X-Pert AI 體驗 ↗</a>
</div>
</div>
</div>
<div class="flex items-stretch">
<a href="ContactUs.html"
class="px-8 border-l border-b border-outline-variant bg-primary text-on-primary font-bold uppercase tracking-tighter transition-all text-sm contact-btn hidden sm:flex items-center">
CONTACT_US.EXE
</a>
<button id="mobile-menu-btn"
class="lg:hidden px-5 border-l border-b border-outline-variant flex items-center transition-all"
style="color: var(--nav-text);" aria-label="選單"
onclick="var m=document.getElementById('mobile-menu'); m.classList.toggle('hidden'); var i=document.getElementById('mobile-menu-icon'); i.textContent = m.classList.contains('hidden')?'menu':'close';">
<span class="material-symbols-outlined text-2xl" id="mobile-menu-icon">menu</span>
</button>
<button id="theme-toggle"
class="px-6 border-l border-b border-outline-variant flex items-center transition-all"
style="color: var(--nav-text);" title="切換主題">
<span class="material-symbols-outlined text-xl" id="theme-icon">dark_mode</span>
</button>
</div>
</nav>
<div id="mobile-menu"
class="hidden lg:hidden border-t border-outline-variant max-h-[calc(100vh-60px)] overflow-y-auto"
style="background-color: var(--header-bg);">
<a class="block px-6 py-3 border-b border-outline-variant text-sm font-bold" style="color: var(--nav-text);"
href="index.html">[ 首頁 ]</a>
<a class="block px-6 py-3 border-b border-outline-variant text-sm font-bold" style="color: var(--nav-text);"
href="AboutUs.html">[ 關於先宏 ]</a>
<div
class="px-6 py-2 text-[10px] font-bold font-mono uppercase tracking-[0.3em] border-b border-outline-variant bg-surface-container"
style="color: var(--nav-active);">// AI_賦能應用
</div>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-text);"
href="services_XPertRAG.html">> X-Pert RAG 企業 AI 知識助理</a>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-text);"
href="services_QilinAI.html">> Qilin AI 麒麟悟道</a>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-text);"
href="services_OCR.html">> OCR 智慧文件辨識</a>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-text);"
href="services_DominoClaw.html">> DominoClaw AI Agent</a>
<div
class="px-6 py-2 text-[10px] font-bold font-mono uppercase tracking-[0.3em] border-b border-outline-variant bg-surface-container"
style="color: var(--nav-active);">// 企業協同辦公
</div>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-text);"
href="services_EIP.html">> 企業入口網站 EIP</a>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-text);"
href="services_BPM.html">> Xpower BPM 企業簽核</a>
<div
class="px-6 py-2 text-[10px] font-bold font-mono uppercase tracking-[0.3em] border-b border-outline-variant bg-surface-container"
style="color: var(--nav-active);">// HCL_原廠專區
</div>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-text);"
href="services_notesUpgrade.html">> HCL Notes / Domino</a>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-text);"
href="hcl_voltmx.html">> HCL Volt MX</a>
<a class="block px-6 py-3 border-b border-outline-variant text-sm font-bold" style="color: var(--nav-text);"
href="Customers.html">[ 客戶實例 ]</a>
<div
class="px-6 py-2 text-[10px] font-bold font-mono uppercase tracking-[0.3em] border-b border-outline-variant bg-surface-container"
style="color: var(--nav-active);">// 資源中心
</div>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-active);"
href="http://www.xred.com.tw/hub.nsf" target="_blank">> Resource Hub ↗</a>
<a class="block px-8 py-3 border-b border-outline-variant text-xs font-bold" style="color: var(--nav-active);"
href="https://www.xred.com.tw:8000/ChatBotV2.html" target="_blank">> X-Pert AI 體驗 ↗</a>
<a href="ContactUs.html"
class="block px-6 py-4 bg-primary text-on-primary font-bold uppercase tracking-tighter text-sm text-center">CONTACT_US.EXE</a>
</div>
</header>
<main class="layout-container border-x border-outline-variant">
<section id="hero" class="border-b border-outline-variant relative overflow-hidden">
<div class="absolute inset-0 pointer-events-none select-none opacity-[0.07]"
style="background-image: linear-gradient(var(--on-background) 1px, transparent 1px), linear-gradient(90deg, var(--on-background) 1px, transparent 1px); background-size: 48px 48px;"></div>
<div
class="absolute right-0 top-1/2 -translate-y-1/2 translate-x-1/4 pointer-events-none select-none opacity-[0.06]">
<span class="material-symbols-outlined text-primary" style="font-size: 480px; line-height: 1;">groups</span>
</div>
<div class="absolute right-6 bottom-4 pointer-events-none select-none opacity-30 hidden md:block">
<pre class="text-[10px] font-mono text-primary leading-[1.2] text-right">// XRED://CLIENT_INDEX
// scope: 27 ORGS │ tiers: ENT/SMB │ sla: GREEN</pre>
</div>
<div class="p-5 md:p-16">
<span class="text-primary text-xs tracking-[0.4em] uppercase mb-8 block font-bold font-mono">// CUSTOMERS.LOG</span>
<h1 class="text-5xl md:text-7xl font-black leading-[1.1] tracking-tighter mb-12">
<span class="text-primary">客戶實例</span> — 來自各產業的信任
</h1>
<p class="text-on-surface-variant max-w-4xl font-medium text-[16px]">
多年來，我們深耕於系統開發與顧問服務，累積了眾多成功案例。涵蓋金融、半導體、製造、零售、公部門等多元產業。
</p>
</div>
</section>
<section id="cat-1" class="border-b border-outline-variant">
<div class="p-5 md:p-16">
<p class="font-mono text-xs tracking-[0.3em] uppercase text-primary mb-2">// FINANCE</p>
<h2 class="text-3xl md:text-4xl font-black mb-8 tracking-tighter flex items-center gap-3"><span
class="material-symbols-outlined text-primary text-3xl shrink-0">account_balance</span>金融業 <span
class="text-on-surface-variant text-lg font-bold ml-3">[5]</span></h2>
<ul class="list-none grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">上海商業儲蓄銀行</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">第一銀行</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">三菱日聯銀行</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">亞東證券</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">凱基人壽</span></li>
</ul>
</div>
</section>
<section id="cat-2" class="border-b border-outline-variant bg-surface-container-low">
<div class="p-5 md:p-16">
<p class="font-mono text-xs tracking-[0.3em] uppercase text-primary mb-2">// SEMICONDUCTOR_TECH</p>
<h2 class="text-3xl md:text-4xl font-black mb-8 tracking-tighter flex items-center gap-3"><span
class="material-symbols-outlined text-primary text-3xl shrink-0">memory</span>半導體 / 科技業 <span
class="text-on-surface-variant text-lg font-bold ml-3">[10]</span></h2>
<ul class="list-none grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">聯華電子</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">景碩科技</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">南茂科技</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">智易科技</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">建興儲存</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">凌陽創新</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">奕力科技</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">南京資訊</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">ELKA</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">榮創能源科技</span></li>
</ul>
</div>
</section>
<section id="cat-3" class="border-b border-outline-variant">
<div class="p-5 md:p-16">
<p class="font-mono text-xs tracking-[0.3em] uppercase text-primary mb-2">// MANUFACTURING</p>
<h2 class="text-3xl md:text-4xl font-black mb-8 tracking-tighter flex items-center gap-3"><span
class="material-symbols-outlined text-primary text-3xl shrink-0">precision_manufacturing</span>製造 / 傳產
<span class="text-on-surface-variant text-lg font-bold ml-3">[7]</span></h2>
<ul class="list-none grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">春源鋼鐵</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">太平洋電線電纜</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">永光化學</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">亞洲水泥</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">台灣櫻花</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">年益實業</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">益實實業</span></li>
</ul>
</div>
</section>
<section id="cat-4" class="border-b border-outline-variant bg-surface-container-low">
<div class="p-5 md:p-16">
<p class="font-mono text-xs tracking-[0.3em] uppercase text-primary mb-2">// RETAIL_SERVICE</p>
<h2 class="text-3xl md:text-4xl font-black mb-8 tracking-tighter flex items-center gap-3"><span
class="material-symbols-outlined text-primary text-3xl shrink-0">storefront</span>零售 / 服務業 <span
class="text-on-surface-variant text-lg font-bold ml-3">[3]</span></h2>
<ul class="list-none grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">遠東百貨</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">愛買</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">鼎鼎企管</span></li>
</ul>
</div>
</section>
<section id="cat-5" class="border-b border-outline-variant">
<div class="p-5 md:p-16">
<p class="font-mono text-xs tracking-[0.3em] uppercase text-primary mb-2">// PUBLIC_OTHER</p>
<h2 class="text-3xl md:text-4xl font-black mb-8 tracking-tighter flex items-center gap-3"><span
class="material-symbols-outlined text-primary text-3xl shrink-0">apartment</span>公部門 / 其他 <span
class="text-on-surface-variant text-lg font-bold ml-3">[2]</span></h2>
<ul class="list-none grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">經濟部能源局</span></li>
<li class="flex gap-3 items-start border border-outline-variant p-4 bg-surface-container hover:bg-surface-container-high transition-colors">
<span class="material-symbols-outlined text-primary shrink-0">check_circle</span><span
class="font-bold text-sm md:text-base">白蓮寺</span></li>
</ul>
</div>
</section>
<section id="closing" class="border-b border-outline-variant">
<div class="p-5 md:p-16">
<p class="text-on-surface-variant text-base md:text-lg leading-relaxed max-w-4xl">
感謝眾多合作夥伴的支援，我們將持續以<span class="text-primary font-black">專業</span>與<span
class="text-primary font-black">創新</span>，成為值得信賴的系統顧問與技術夥伴。
</p>
</div>
</section>
<section id="cta" class="border-b border-outline-variant bg-primary">
<div class="p-5 md:p-16">
<h2 class="text-on-primary text-4xl md:text-5xl font-black mb-6 tracking-tighter">成為下一個成功案例</h2>
<p class="text-on-primary text-lg mb-10 opacity-90 max-w-2xl">
與先宏的資深架構師團隊聊聊，為您的企業量身規劃最務實的系統現代化路徑。</p>
<div class="flex flex-col sm:flex-row gap-4">
<a href="ContactUs.html"
class="bg-on-primary text-primary px-8 py-5 font-bold text-lg tracking-tighter hover:bg-background hover:text-on-background transition-all flex items-center justify-center gap-3 border border-on-primary">
<span class="material-symbols-outlined">calendar_month</span>
預約諮詢
</a>
</div>
</div>
</section>
</main>
<footer id="footer" class="transition-colors duration-300">
<div class="layout-container brutalist-grid border-none">
<div id="footer-info" class="col-span-full lg:col-span-4 grid-block !border-none">
<div class="mb-6"><span class="text-sm tracking-tight leading-relaxed font-medium"
style="color: var(--footer-text);">先宏資訊股份有限公司</span></div>
<p class="tracking-tight max-w-xs font-medium text-[12px]" style="color: var(--footer-text);">
從 Notes 維護到 AI 原生與企業轉型領航者。我們讓沉睡的企業知識庫活起來，為您的數位轉型打造最務實的升級路徑。
</p>
<p class="tracking-tight font-medium text-[12px] mt-3 flex items-start gap-3 lg:whitespace-nowrap"
style="color: var(--footer-text);"><span class="material-symbols-outlined shrink-0"
style="font-size:14px;margin-top:1px;">location_on</span><a href="https://www.google.com/maps/search/?api=1&query=台北市大安區忠孝東路四段270號" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition-colors">10694
台北市大安區忠孝東路四段 270 號 17 樓（近捷運國父紀念館站）</a></p>
<p class="tracking-tight font-medium text-[12px] mt-1 flex items-center gap-3 lg:whitespace-nowrap"
style="color: var(--footer-text);"><span class="material-symbols-outlined shrink-0"
style="font-size:14px;">call</span><a href="tel:+886277252968"
class="hover:text-primary">+886-2-7725-2968</a>
</p>
<p class="tracking-tight font-medium text-[12px] mt-1 flex items-center gap-3 lg:whitespace-nowrap"
style="color: var(--footer-text);"><span class="material-symbols-outlined shrink-0"
style="font-size:14px;">mail</span><a
href="mailto:hello@xred.com.tw" class="hover:text-primary">hello@xred.com.tw</a></p>
</div>
<div
class="col-span-full sm:col-span-4 lg:col-span-3 lg:col-start-10 grid-block !border-none flex flex-col items-end text-right">
<div class="flex gap-4">
<a class="hover:text-primary border border-outline-variant p-2 flex items-center justify-center"
style="color: var(--footer-text);" href="#" aria-label="YouTube" title="YouTube">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="currentColor">
<path
d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z" />
</svg>
</a>
<a class="hover:text-primary border border-outline-variant p-2 flex items-center justify-center"
style="color: var(--footer-text);" href="#" aria-label="Facebook" title="Facebook">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="currentColor">
<path
d="M9.101 23.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085 1.848-5.978 5.858-5.978.401 0 .955.042 1.468.103a8.68 8.68 0 0 1 1.141.195v3.325a8.623 8.623 0 0 0-.653-.036 26.805 26.805 0 0 0-.733-.009c-.707 0-1.259.096-1.675.309a1.686 1.686 0 0 0-.679.622c-.258.42-.374.995-.374 1.752v1.297h3.919l-.386 2.103-.287 1.564h-3.246v8.245C19.396 23.238 24 18.179 24 12.044c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.628 3.874 10.35 9.101 11.647Z" />
</svg>
</a>
<a class="hover:text-primary border border-outline-variant p-2 flex items-center justify-center"
style="color: var(--footer-text);" href="#" aria-label="LinkedIn" title="LinkedIn">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="currentColor">
<path
d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.063 2.063 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" />
</svg>
</a>
</div>
<div class="text-[10px] font-bold tracking-widest font-mono mt-3" style="color: var(--footer-copyright);">
© 2026 XRed Information
</div>
</div>
</div>
</footer>
<script src="assets/js/theme-toggle.js"></script>
</body>
</html>