-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcharge.html
142 lines (142 loc) · 4.84 KB
/
charge.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>計費方式說明 - ChatTalker</title>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./css/reset.css">
<link rel="stylesheet" href="./css/all.css">
<link rel="stylesheet" href="./css/charge.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<button class="btn-top">TOP</button>
<div class="header-background">
<div class="banner-img"></div>
<header class="d-flex container">
<a href="index.html" class="logo">ChatTalker</a>
<a href="charge.html" class="charge-header">方案費用</a>
</header>
<div class="header-banner container">
<h1>計費方式說明</h1>
<p>聊天機器人幫你實現增粉、轉單、客服等目標</p>
</div>
</div>
<div class="main-background">
<div class="plan container">
<h2>彈性選擇，提供您選擇最適合的方案</h2>
<ul class="plan-number d-flex">
<li><a href="#">10000位</a></li>
<li><a href="#">15000位</a></li>
<li><a href="#">20000位</a></li>
<li><a href="#">25000位</a></li>
<li><a href="#">>25000位</a></li>
</ul>
</div>
<div class="charge-plan d-flex">
<div class="charge-content d-flex">
<h3>基本版</h3>
<hr class="line">
<p>
提供中小企業最必要的功能<br>
完整建立分眾以達到精準的行銷自動化
</p>
<div class="charge-calculate d-flex">
<div class="charge-box">
<p>訂閱用戶數</p>
<p class="user-number">
<span>10000 </span><sub> 位</sub>
</p>
</div>
<div class="equal">=</div>
<div class="charge-box">
<p>試算每月的費用</p>
<p class="cost-number1">
<span>600 </span><sub> TWD</sub>
</p>
</div>
</div>
<ul class="charge-info">
<li>
<p>支援 Messenger / Instagram 或 LINE 渠道</p>
</li>
<li>
<p>10 個進階套件</p>
</li>
<li>
<p>可設定 50 種分眾標籤</p>
</li>
<li>
<p>客服人機轉接</p>
</li>
</ul>
<a href="#" target="_blank">立即體驗</a>
</div>
<div class="charge-content d-flex">
<h3>標準版</h3>
<hr class="line">
<p>
建立企業流量池，全通路數據整合與交換<br>
高可靠性服務
</p>
<div class="charge-calculate d-flex">
<div class="charge-box">
<p>訂閱用戶數</p>
<p class="user-number">
<span>10000 </span><sub> 位</sub>
</p>
</div>
<div class="equal">=</div>
<div class="charge-box">
<p>試算每月的費用</p>
<p class="cost-number2">
<span>1600 </span><sub> TWD</sub>
</p>
</div>
</div>
<ul class="charge-info">
<li>
<p>支援多個 Messenger、Instagram 和 LINE 渠道</p>
</li>
<li>
<p>20 個進階及行銷互動套件</p>
</li>
<li>
<p>可設定 500 種分眾標籤</p>
</li>
<li>
<p>客服人機轉接＋自動指派專員處理</p>
</li>
</ul>
<a href="#" target="_blank">立即體驗</a>
</div>
</div>
<div class="ball-4"></div>
</div>
<div class="faq container">
<h2>常見問題</h2>
<div class="question">
<details>
<summary>我要怎麼變更方案？</summary>
<p>請聯絡您的業務專員修改訂閱方案，我們將為您進行變更流程。</p>
</details>
<details>
<summary>如果我沒有LINE官方帳號怎麼辦？</summary>
<p>沒關係的，只要您是我們任何一個方案的夥伴，我們的專員可以協助辦理哦！</p>
</details>
<details>
<summary>非上班日有客服支援嗎?</summary>
<p>當然哦！我們錢都收了，不會拋棄你的！<br>
請您直接來我們公司，我們假日也都在辦公室。</p>
</details>
</div>
</div>
<footer class="d-flex">
<p>©2022 chatTalker. All Rights Reserved.</p>
</footer>
<script src="./js/all.js"></script>
</body>
</html>