-
Notifications
You must be signed in to change notification settings - Fork 0
/
clinic.html
executable file
·361 lines (280 loc) · 11.1 KB
/
clinic.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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Pratt - Free Bootstrap 3 Theme">
<meta name="author" content="Alvarez.is - BlackTie.co">
<link rel="shortcut icon" href="assets/ico/favicon.png">
<title>chat clinic</title>
<!-- Bootstrap core CSS -->
<link href="assets/css/bootstrap.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="assets/css/main.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Raleway:400,300,700' rel='stylesheet' type='text/css'>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/smoothscroll.js"></script>
</head>
<body data-spy="scroll" data-offset="0" data-target="#navigation">
<!-- Fixed navbar -->
<div id="navigation" class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><b>Chat Clinic</b></a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active">
<a href="#home" class="smothscroll">ホーム</a></li>
<li><a href="#desc" class="smothscroll">特徴</a></li>
<li><a href="#howtouse" class="smothscroll">使い方</a></li>
<li><a href="#showcase" class="smothscroll">料金</a></li>
<li><a href="#contact" class="smothscroll">お問い合わせ</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<section id="home" name="home"></section>
<div id="headerwrap">
<div class="container">
<div class="row centered">
<div class="col-lg-12">
<h2><u>AI</u>に身体の症状を相談</h2><!--もう少し大きく-->
<h1>チャット・クリニック <b>誕生</b></h1>
<h3>チャット・クリニックは、ChatGPTをベースに独自開発したAI。<br>
クリニックさまの診療内容や診察時間についてあらかじめ学習し、<br>
患者さまとLINEで自然に会話することができます。<br>
<br>
AIの進化で、社会は変わりつつあります。<br>
誰もがAIに、健康の相談をし、クリニックを探してもらい、<br>
適切な科の受診を予約してもらう。そんな未来を実現します。</h3>
<br>
</div>
<div class="col-xs-2 col-sm-5 col-md-4 col-lg-4"></div>
<div class="col-xs-8 col-sm-2 col-md-4 col-lg-4">
<img class="img-responsive4" src="assets/img/home-phone.png" alt=""><!--もう少し小さく-->
</div>
<div class="col-xs-2 col-sm-5 col-md-4 col-lg-4"></div>
</div>
</div> <!--/ .container -->
</div><!--/ #headerwrap -->
<section id="desc" name="desc"></section>
<!-- INTRO WRAP -->
<div id="intro">
<div class="container">
<div class="row centered kuro">
<h1><u>特徴</u></h1>
<br>
<br>
<div class="col-sm-6">
<img class="img-responsive7" src="assets/img/system-circle.png" alt="">
<p>クリニックの情報を<br>
自動学習既存システムと柔軟に連携<br>
管理画面で強みや特徴を登録 ※1</p>
</div>
<div class="col-sm-6">
<img class="img-responsive7" src="assets/img/services-circle.png" alt="">
<p>質問や問い合わせへ自動対応<br>
自然な会話による受診受付<br>
検索による新規受診の増加</p>
</div>
<!--二つの要素を中央揃えにしたい-->
</div>
<br>
<hr>
</div> <!--/ .container -->
</div><!--/ #introwrap -->
<section id="howtouse" name="howtouse"></section>
<!-- FEATURES WRAP -->
<div id="features">
<div class="container">
<br>
<br>
<div id="orange" class="row centered kuro">
<h1><u>使い方</u></h1>
<br>
<br>
<!-- 左 -->
<div class="break-keep col-sm-5 yohaku">
<div class="row centered oya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/Group 167.png" alt=""></div>
<div class="col-xs-8">
<h3>LINEで会話スタート</h3>
<p>クリニックに掲示されている<wbr>QRコードから<wbr>
または<wbr>チャット・クリニック公式LINEから<wbr>会話を開始</p>
</div>
</div>
<div class="row centered oya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/Group 160.png" alt=""></div>
<div class="col-xs-8">
</div>
</div>
<div class="row centered oya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/Group 168.png" alt=""></div>
<div class="col-xs-8">
<h3>質問・相談</h3>
<p>身体の不調・不安についてや<wbr>
医療・薬などに関する疑問 <wbr>
クリニックの診察時間など</p>
</div>
</div>
<div class="row centered oya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/Group 160.png" alt=""></div>
<div class="col-xs-8">
</div>
</div>
<div class="row centered oya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/Group 159.png" alt=""></div>
<div class="col-xs-8">
<h3>AIが適切に回答</h3>
<p>一般的な医療に関する知識 <wbr>
考えられる可能性や対応方法 <wbr>
何科を受診すれば良いかなど<br>
<small>※診断や、治療・処置の指示等は行いません</small></p>
</div>
</div>
<div class="row centered oya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/Group 160.png" alt=""></div>
<div class="col-xs-8">
</div>
</div>
<div class="row centered oya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/ピン.png" alt=""></div>
<div class="col-xs-8">
<h3>受診を提案</h3>
<p>受診したことのある<wbr>クリニックの再診や<wbr>現在地から診療科・診察時間を考慮して<wbr>検索も可能 <wbr>
強みや特徴を考慮し<wbr>オススメのクリニックを提案
<small>※1</small></p>
</div>
</div>
<div class="row centered oya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/Group 160.png" alt=""></div>
<div class="col-xs-8">
</div>
</div>
<div class="row centeredoya_centered">
<div class="col-xs-4"><img class="img-responsive6" src="assets/img/hospital2.png" alt=""></div>
<div class="col-xs-8">
<h3>LINEでそのまま受付<small>※2</small></h3>
<p>自然な会話で<wbr>AIが診察を受付 <wbr>
診察の順番が近づいたら通知 <br>
さまざまなシステムと連携可能 </p>
</div>
</div>
<div class="row centered oya_centered">
<div class="col-xs-4 table2"><img class="img-responsive8" src="assets/img/system-circle.png" alt=""></div>
<div class="col-xs-8 table2">
<p>AIが全国のクリニック情報を収集<br>
クリニックによる情報登録<small>※1</small>
既存システムとも柔軟に連携</p>
</div>
</div>
</div>
<!-- 右 -->
<div class="col-sm-7 yohaku"><img class="img-responsive9" src="assets/img/LINE.png" alt=""></div>
</div>
</div>
</div>
<section id="showcase" name="showcase"></section>
<div id="showcase">
<div class="container">
<div class="row shiro centered">
<h1><u>料金</u></h1>
<br>
<div id="carousel-example-generic">
<div class="container">
<div class="row centered">
<br>
<br>
<div class="col-md-4 table3">
<img class="img-responsive5" src="assets/img/start-campaign.png" alt="">
</div>
<div class="col-md-8 table2">
<table class="table table-hover white">
<tr><th></th><th>通常価格</th><th>限定特別価格</th></tr>
<tr><th>初期費用</th><th>200,000円</th><th>40,000円</th></tr>
<tr><th>月額費用</th><th>20,000円</th><th>15,000円</th></tr>
<tr><th>月額費用<small>(3年目〜)</small></th><th>20,000円</th><th>10,000円</th></tr>
</table>
</div>
</div>
<br>
<hr>
<div id="headerwrap">
<div class="row centered break-keep">
<h3>T導入補助金の活用でさらにお得に！<wbr>詳しくはお問い合わせください</h3>
</div>
</div>
</div> <!--/ .container -->
</div>
</div>
</div>
<br>
<br>
<br>
</div><!-- /container -->
</div>
<section id="contact" name="contact"></section>
<!-- FEATURES WRAP -->
<div id="features">
<div class="container">
<div class="row centered kuro">
<h1><u>お問い合わせ</u></h1>
<div class="btn-wrap btn-wrap-pc-sp2">
<a id="button-size" href="mailto:[email protected]?subject=チャットクリニックに関する問い合わせ" class="btn btn--contact">
<i class="fas fa-envelope fa-position-left"></i>
お問い合わせはこちら
<i class="fas fa-angle-right fa-position-right"></i>
</a>
<br>
<a id="button-size" href="tel:086-286-9520" class="btn btn--tel">
<i class="fas fa-phone-volume fa-position-left"></i>
お電話でのご予約はこちら<br>
<span class="number phone-number">TEL：0120-12-3456</span>
<i class="fas fa-angle-right fa-position-right"></i>
</a>
</div>
</div>
</div>
</div>
<section id="company" name="contact"></section>
<div id="footerwrap">
<div class="container">
<div class="row centered shiro centered">
<h1><u>会社概要</u></h1>
<br>
<h4>会社名</h4>
<p>アプリル株式会社</p>
<h4>事業</h4>
<p>iOSアプリ開発・クリニック向けサービス・プログラミング教育</p>
<h4>所在地</h4>
<p>〒541-0054<br>大阪市中央区南本町4丁目5-7-7F</p>
<h4>設立</h4>
<p>2011.4.1</p>
<h4>代表取締役</h4>
<p>福嶋 伸之</p>
</div>
</div>
</div>
<div id="c">
<div class="row centered">
<p>© applil all rights reserved. </p>
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="assets/js/bootstrap.js"></script>
<script>
$('.carousel').carousel({
interval: 3500
})
</script>
</body>
</html>