-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathguide.html
More file actions
466 lines (387 loc) · 29.8 KB
/
Copy pathguide.html
File metadata and controls
466 lines (387 loc) · 29.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
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes" />
<!-- Page Title -->
<title>Vox - スマートボックス</title>
<!-- Compressed Styles -->
<link href="css/slides.min.css?425341" rel="stylesheet" type="text/css">
<!-- Custom Styles -->
<link href="css/custom.css" rel="stylesheet" type="text/css">
<!-- jQuery 3.4.1 -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Compressed Scripts -->
<script src="js/slides.min.js?425341" type="text/javascript"></script>
<!-- Custom Scripts -->
<!-- <script src="js/custom.js" type="text/javascript"></script> -->
<!-- Fonts and Material Icons -->
<link href="https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700&display=swap&subset=japanese" rel="stylesheet">
<style type="text/css">
.slides,
.slides p {
font-family: 'TazuganeGothicStdN', sans-serif;
font-weight: 400;
}
.tiny {
font-family: 'TazuganeGothicStdN', sans-serif !important;
font-weight: 600 !important;
}
.slides h3 {
font-family: 'TazuganeGothicStdN', sans-serif !important;
font-size: 42px;
line-height: 1.37;
color: #F9FBFC;
letter-spacing: .0em;
font-weight: 200;
}
.slides h1,
.slides h2,
.slides h6 {
font-family: 'TazuganeGothicStdN', sans-serif;
font-weight: 600;
}
.slides h4,
.slides h5 {
font-family: 'GothamPro', sans-serif;
font-weight: 500;
}
.slides .button,
.slides .slides-form {
font-family: 'GothamPro', sans-serif;
font-weight: 600;
}
.voxshadow{
filter: drop-shadow(0px 53px 124px rgba(68, 73, 78, 0.2));
}
@media (max-width:1023px){
.slides h3 {
font-family: 'TazuganeGothicStdN', sans-serif !important;
font-size: 26px;
color: #F9FBFC;
letter-spacing: .0em;
font-weight: 200;
}
}
</style>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-47963279-3"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-47963279-3');
</script>
</head>
<body class="slides fast noPreload animated">
<!-- SVG Library -->
<svg xmlns="http://www.w3.org/2000/svg" style="display:none">
<svg xmlns="http://www.w3.org/2000/svg" style="display:none">
<defs>
<linearGradient x1="50.783596%" y1="0%" x2="50.783596%" y2="100%" id="g">
<stop stop-color="#85CFE8" offset="0%"></stop>
<stop stop-color="#4C8AC3" offset="100%"></stop>
</linearGradient>
</defs>
</svg>
<symbol id="logo" viewBox="0 0 101 27"><title>Vox</title>
<g id="Style-Guide">
<g id="_x32_.-Logo-Pattern-1" transform="translate(-272.000000, -554.000000)">
<linearGradient id="g" gradientUnits="userSpaceOnUse" x1="-1361" y1="1793.8544" x2="-1361" y2="1792.8544" gradientTransform="matrix(100 0 0 -25.585 136422.1562 46450.3008)">
<stop offset="0" style="stop-color:#85CFE8"/>
<stop offset="1" style="stop-color:#4C8AC3"/>
</linearGradient>
<path id="Shape" fill="url(#g)" d="M322.8,554.5c7,0,12.7,5.7,12.7,12.8c0,7.1-5.7,12.8-12.7,12.8c-7,0-12.7-5.7-12.7-12.8
C310.1,560.2,315.8,554.5,322.8,554.5z M294.9,554.5c2.8,0,5.1,2.3,5.1,5.1c0,0.9-0.2,1.8-0.7,2.6l-8.8,15.4
c-1.4,2.4-4.5,3.3-7,1.9c-0.8-0.4-1.4-1.1-1.9-1.9l-8.8-15.4c-1.4-2.4-0.6-5.6,1.9-7c0.8-0.4,1.7-0.7,2.5-0.7H294.9z M351,555.2
l4.8,4.8c2,2,5.2,2,7.2,0l4.8-4.8c1-1,2.6-1,3.6,0c1,1,1,2.6,0,3.6l-7,7c-0.8,0.8-0.8,2.1,0,2.9l7,7c1,1,1,2.6,0,3.6
c-1,1-2.6,1-3.6,0l-4.8-4.8c-2-2-5.2-2-7.2,0l-4.8,4.8c-1,1-2.6,1-3.6,0c-1-1-1-2.6,0-3.6l7-7c0.8-0.8,0.8-2.1,0-2.9l-7-7
c-1-1-1-2.6,0-3.6C348.4,554.3,350,554.3,351,555.2z M322.8,559.6c-4.2,0-7.6,3.4-7.6,7.7c0,4.2,3.4,7.7,7.6,7.7
c4.2,0,7.6-3.4,7.6-7.7C330.4,563.1,327,559.6,322.8,559.6z M291.4,559.6h-10.6c-0.4,0-0.7,0.1-1,0.3c-1,0.6-1.3,1.8-0.7,2.8
l5.3,9.2c0.2,0.3,0.4,0.6,0.7,0.7c1,0.6,2.2,0.2,2.8-0.7l5.3-9.2c0.2-0.3,0.3-0.7,0.3-1C293.4,560.5,292.5,559.6,291.4,559.6z"/>
</g>
</g>
</symbol>
<symbol id="logo-icon" viewBox="0 0 50 41"><title>Vox</title><path d="M4,12h42c2.2,0,4,1.8,4,4v21c0,2.2-1.8,4-4,4H4c-2.2,0-4-1.8-4-4V16C0,13.8,1.8,12,4,12z"/><path opacity="0.6" d="M45.5,9h-41C3.7,9,3,8.3,3,7.5v0C3,6.7,3.7,6,4.5,6h41C46.3,6,47,6.7,47,7.5v0C47,8.3,46.3,9,45.5,9z"/><path opacity="0.4" d="M7.5,0h35C43.3,0,44,0.7,44,1.5v0C44,2.3,43.3,3,42.5,3h-35C6.7,3,6,2.3,6,1.5v0C6,0.7,6.7,0,7.5,0z"/></symbol>
<symbol id="close" viewBox="0 0 30 30"><path d="M15 0c-8.3 0-15 6.7-15 15s6.7 15 15 15 15-6.7 15-15-6.7-15-15-15zm5.7 19.3c.4.4.4 1 0 1.4-.2.2-.4.3-.7.3s-.5-.1-.7-.3l-4.3-4.3-4.3 4.3c-.2.2-.4.3-.7.3s-.5-.1-.7-.3c-.4-.4-.4-1 0-1.4l4.3-4.3-4.3-4.3c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l4.3 4.3 4.3-4.3c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-4.3 4.3 4.3 4.3z"/></symbol>
<symbol id="close-small" viewBox="0 0 11 11"><path d="M6.914 5.5l3.793-3.793c.391-.391.391-1.023 0-1.414s-1.023-.391-1.414 0l-3.793 3.793-3.793-3.793c-.391-.391-1.023-.391-1.414 0s-.391 1.023 0 1.414l3.793 3.793-3.793 3.793c-.391.391-.391 1.023 0 1.414.195.195.451.293.707.293s.512-.098.707-.293l3.793-3.793 3.793 3.793c.195.195.451.293.707.293s.512-.098.707-.293c.391-.391.391-1.023 0-1.414l-3.793-3.793z"/></symbol>
<symbol id="arrow-left" viewBox="0 0 29 56"><path d="M28.7.3c.4.4.4 1 0 1.4l-26.3 26.3 26.3 26.3c.4.4.4 1 0 1.4-.4.4-1 .4-1.4 0l-27-27c-.4-.4-.4-1 0-1.4l27-27c.3-.3 1-.4 1.4 0z"/></symbol>
<symbol id="arrow-right" viewBox="0 0 29 56"><path d="M.3 55.7c-.4-.4-.4-1 0-1.4l26.3-26.3-26.3-26.3c-.4-.4-.4-1 0-1.4.4-.4 1-.4 1.4 0l27 27c.4.4.4 1 0 1.4l-27 27c-.3.3-1 .4-1.4 0z"/></symbol>
<symbol id="back" viewBox="0 0 20 20"><path d="M2.3 10.7l5 5c.4.4 1 .4 1.4 0s.4-1 0-1.4l-3.3-3.3h11.6c.6 0 1-.4 1-1s-.4-1-1-1h-11.6l3.3-3.3c.4-.4.4-1 0-1.4-.2-.2-.4-.3-.7-.3s-.5.1-.7.3l-5 5c-.2.2-.3.5-.3.7 0 .2.1.5.3.7z"/></symbol>
<symbol id="menu" viewBox="0 0 18 18"><path d="M16 5h-14c-.6 0-1-.4-1-1 0-.5.4-1 1-1h14c.5 0 1 .4 1 1s-.4 1-1 1zm-14 5h14c.5 0 1-.4 1-1 0-.5-.4-1-1-1h-14c-.6 0-1 .4-1 1s.4 1 1 1zm14 3h-14c-.5 0-1 .4-1 1 0 .5.4 1 1 1h14c.5 0 1-.4 1-1s-.4-1-1-1z"/></symbol>
<symbol id="share" viewBox="0 0 18 18"><path d="M16 8c-.6 0-1 .4-1 1v6h-12v-6c0-.6-.4-1-1-1s-1 .4-1 1v6c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-6c0-.6-.4-1-1-1zm-2.3-2.3c.4-.4.4-1 0-1.4l-4-4c-.4-.4-1-.4-1.4 0l-4 4c-.4.4-.4 1 0 1.4s1 .4 1.4 0l2.3-2.3v7.6c0 .6.4 1 1 1s1-.4 1-1v-7.6l2.3 2.3c.4.4 1 .4 1.4 0z"/></symbol>
<symbol id="arrow-down" viewBox="0 0 24 24"><path d="M12 18c-.2 0-.5-.1-.7-.3l-11-10c-.4-.4-.4-1-.1-1.4.4-.4 1-.4 1.4-.1l10.4 9.4 10.3-9.4c.4-.4 1-.3 1.4.1.4.4.3 1-.1 1.4l-11 10c-.1.2-.4.3-.6.3z"/></symbol>
<symbol id="arrow-up" viewBox="0 0 24 24"><path d="M11.9 5.9c.2 0 .5.1.7.3l11 10c.4.4.4 1 .1 1.4-.4.4-1 .4-1.4.1l-10.4-9.4-10.3 9.4c-.4.4-1 .3-1.4-.1-.4-.4-.3-1 .1-1.4l11-10c.1-.2.4-.3.6-.3z"/></symbol>
<symbol id="arrow-top" viewBox="0 0 18 18"><path d="M15.7 7.3l-6-6c-.4-.4-1-.4-1.4 0l-6 6c-.4.4-.4 1 0 1.4.4.4 1 .4 1.4 0l4.3-4.3v11.6c0 .6.4 1 1 1s1-.4 1-1v-11.6l4.3 4.3c.2.2.4.3.7.3s.5-.1.7-.3c.4-.4.4-1 0-1.4z"/></symbol>
<symbol id="play" viewBox="0 0 30 30"><path d="M7 30v-30l22 15z"/></symbol>
<symbol id="chat" viewBox="0 0 18 18"><path d="M5,17c-0.2,0-0.3,0-0.4-0.1C4.2,16.7,4,16.4,4,16v-2H2c-1.1,0-2-0.9-2-2V3c0-1.1,0.9-2,2-2h14c1.1,0,2,0.9,2,2v9 c0,1.1-0.9,2-2,2H9.3l-3.7,2.8C5.4,16.9,5.2,17,5,17z M2,12h3.5C5.8,12,6,12.2,6,12.5V14l2.4-1.8C8.6,12.1,8.8,12,9,12h7V3H2V12z M13,7H5C4.4,7,4,6.6,4,6s0.4-1,1-1h8c0.6,0,1,0.4,1,1S13.6,7,13,7z M13,10H5c-0.6,0-1-0.4-1-1s0.4-1,1-1h8c0.6,0,1,0.4,1,1 S13.6,10,13,10z"/></symbol>
<symbol id="mail" viewBox="0 0 18 18"><path d="M16 2h-14c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-10c0-1.1-.9-2-2-2zm0 2v.5l-7 4.3-7-4.4v-.4h14zm-14 10v-7.2l6.5 4c.1.1.3.2.5.2s.4-.1.5-.2l6.5-4v7.2h-14z"/></symbol>
<symbol id="sound-on" viewBox="0 0 18 18"><path d="M8.5,0.1C8.1-0.1,7.7,0,7.4,0.2L3.7,3H2C0.9,3,0,3.9,0,5v6c0,1.1,0.9,2,2,2h1.7l3.7,2.8C7.6,15.9,7.8,16,8,16 c0.2,0,0.3,0,0.4-0.1C8.8,15.7,9,15.4,9,15V1C9,0.6,8.8,0.3,8.5,0.1z M7,13l-2.4-1.8C4.4,11.1,4.2,11,4,11l-2,0l0-6h2 c0.2,0,0.4-0.1,0.6-0.2L7,3V13z M11.7,9.9l0.7,1.9C13.9,11.2,15,9.7,15,8c0-1.7-1.1-3.2-2.7-3.8l-0.7,1.9C12.5,6.4,13,7.2,13,8C13,8.9,12.5,9.6,11.7,9.9z M12.2,1.1l-0.3,2C14.3,3.5,16,5.6,16,8s-1.8,4.5-4.2,4.9l0.3,2C15.6,14.3,18,11.4,18,8C18,4.6,15.6,1.7,12.2,1.1z"/></symbol>
<symbol id="sound-off" viewBox="0 0 18 18"><path d="M15.9,8l1.8-1.8c0.4-0.4,0.4-1,0-1.4s-1-0.4-1.4,0l-1.8,1.8l-1.8-1.8c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4L13.1,8l-1.8,1.8 c-0.4,0.4-0.4,1,0,1.4c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3l1.8-1.8l1.8,1.8c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3 c0.4-0.4,0.4-1,0-1.4L15.9,8z M8.5,0.1C8.1-0.1,7.7,0,7.4,0.2L3.7,3H2C0.9,3,0,3.9,0,5v6c0,1.1,0.9,2,2,2h1.7l3.7,2.8C7.6,15.9,7.8,16,8,16 c0.2,0,0.3,0,0.4-0.1C8.8,15.7,9,15.4,9,15V1C9,0.6,8.8,0.3,8.5,0.1z M7,13l-2.4-1.8C4.4,11.1,4.2,11,4,11l-2,0l0-6h2 c0.2,0,0.4-0.1,0.6-0.2L7,3V13z"/></symbol>
<!-- social -->
<symbol id="apple" viewBox="-1 1 24 24"><path d="M17.6 13.8c0-3 2.5-4.5 2.6-4.6-1.4-2.1-3.6-2.3-4.4-2.4-1.9-.2-3.6 1.1-4.6 1.1-.9 0-2.4-1.1-4-1-2 0-3.9 1.2-5 3-2.1 3.7-.5 9.1 1.5 12.1 1 1.5 2.2 3.1 3.8 3 1.5-.1 2.1-1 3.9-1s2.4 1 4 1 2.7-1.5 3.7-2.9c1.2-1.7 1.6-3.3 1.7-3.4-.1-.1-3.2-1.3-3.2-4.9zm-3.1-9c.8-1 1.4-2.4 1.2-3.8-1.2 0-2.7.8-3.5 1.8-.8.9-1.5 2.3-1.3 3.7 1.4.1 2.8-.7 3.6-1.7z"/></symbol>
<symbol id="dribbble" viewBox="0 0 24 24"><path d="M12 0c-6.7 0-12 5.3-12 12s5.3 12 12 12 12-5.3 12-12-5.3-12-12-12zm7.9 5.7c1.3 1.7 2.1 3.9 2.3 6.1-.4-.1-2.4-.4-4.7-.4-.8 0-1.5 0-2.3.1 0-.1-.1-.3-.3-.5l-.7-1.5c3.7-1.4 5.3-3.4 5.7-3.8zm-7.9-3.8c2.5 0 4.9.9 6.7 2.5-.3.4-1.9 2.3-5.2 3.6-1.6-2.9-3.3-5.3-3.7-5.9.6-.1 1.4-.2 2.2-.2zm-4.4 1c.4.6 2.1 3 3.7 5.8-4.4 1.2-8.2 1.2-9.2 1.2h-.1c.8-3.1 2.9-5.6 5.6-7zm-5.7 9.1v-.3h.3c1.2 0 5.6-.1 10.1-1.5l.8 1.6c-.1 0-.3 0-.4.1-5.1 1.6-7.9 6-8.3 6.7-1.6-1.7-2.5-4.1-2.5-6.6zm10.1 10.1c-2.3 0-4.4-.8-6.1-2.1.3-.5 2.4-4.4 7.9-6.3 1.3 3.6 2 6.7 2.1 7.6-1.2.6-2.6.8-3.9.8zm5.7-1.8c-.1-.8-.7-3.6-2-7.1.7-.1 1.3-.1 2-.1 2.1 0 3.7.4 4.1.5-.3 2.8-1.8 5.2-4.1 6.7z"/></symbol>
<symbol id="facebook" viewBox="0 0 24 24"><path d="M24 1.3v21.3c0 .7-.6 1.3-1.3 1.3h-6.1v-9.3h3.1l.5-3.6h-3.6v-2.2c0-1.1.3-1.8 1.8-1.8h1.9v-3.2c-.3 0-1.5-.1-2.8-.1-2.8 0-4.7 1.7-4.7 4.8v2.7h-3.1v3.6h3.1v9.2h-11.5c-.7 0-1.3-.6-1.3-1.3v-21.4c0-.7.6-1.3 1.3-1.3h21.3c.8 0 1.4.6 1.4 1.3z"/></symbol>
<symbol id="facebook2" viewBox="0 0 512 512"><path d="M288 176v-64c0-17.664 14.336-32 32-32h32v-80h-64c-53.024 0-96 42.976-96 96v80h-64v80h64v256h96v-256h64l32-80h-96z"/></symbol>
<symbol id="fb-like" viewBox="0 0 20 20"><path d="M0 8v12h5v-12h-5zm2.5 10.8c-.4 0-.8-.3-.8-.8 0-.4.3-.8.8-.8s.8.3.8.8c0 .4-.4.8-.8.8zm3.5-.8h9.5c1.1 0 1.7-1 1.7-1.7 0-.3-.4-1-.4-1 1.4-.3 1.7-1.2 1.7-1.7-.1-.5-.3-.9-.5-1 1-.4 1.5-1.1 1.4-1.9-.1-.8-1-1.5-1-1.5 1-.6.9-1.5.9-1.5-.3-1.3-1.5-1.7-1.7-1.7h-5.6s.3-.5.3-2.4-1.3-3.6-2.6-3.6c0 0-.7.1-1 .3v3.5l-2.7 4.4v9.8z"/></symbol>
<symbol id="googlePlus" viewBox="0 1 24 24"><path d="M7.8 13.5h4.6c-.6 2-2.5 3.4-4.6 3.4-2.7 0-4.9-2.2-4.9-4.9s2.2-4.9 4.9-4.9c1.1 0 2.1.3 3 1l1.8-2.4c-1.4-1.1-3-1.6-4.8-1.6-4.3 0-7.9 3.5-7.9 7.9s3.5 7.9 7.9 7.9 7.9-3.5 7.9-7.9v-1.5h-7.9v3zM21.7 11v-2.2h-2v2.2h-2.2v2h2.2v2.2h2v-2.2h2.2v-2z"/></symbol>
<symbol id="instagram" viewBox="0 0 20 20"><circle cx="10" cy="10" r="3.3"/><path d="M13,0H7C2.2,0,0,2.2,0,7v6c0,4.8,2.1,7,7,7h6c4.8,0,7-2.2,7-7V7C20,2.2,17.9,0,13,0z M10,15.1c-2.8,0-5.1-2.3-5.1-5.1 S7.2,4.9,10,4.9s5.1,2.3,5.1,5.1S12.8,15.1,10,15.1z M15.3,5.9c-0.7,0-1.2-0.5-1.2-1.2c0-0.7,0.5-1.2,1.2-1.2s1.2,0.5,1.2,1.2 C16.5,5.3,16,5.9,15.3,5.9z"/></symbol>
<symbol id="behance" viewBox="0 0 511.958 511.958"><path d="M210.624 240.619c10.624-5.344 18.656-11.296 24.16-17.728 9.792-11.584 14.624-26.944 14.624-45.984 0-18.528-4.832-34.368-14.496-47.648-16.128-21.632-43.424-32.704-82.016-33.28h-152.896v312.096h142.56c16.064 0 30.944-1.376 44.704-4.192 13.76-2.848 25.664-8.064 35.744-15.68 8.96-6.624 16.448-14.848 22.4-24.544 9.408-14.656 14.112-31.264 14.112-49.76 0-17.92-4.128-33.184-12.32-45.728-8.288-12.544-20.448-21.728-36.576-27.552zm-147.552-90.432h68.864c15.136 0 27.616 1.632 37.408 4.864 11.328 4.704 16.992 14.272 16.992 28.864 0 13.088-4.32 22.24-12.864 27.392-8.608 5.152-19.776 7.744-33.472 7.744h-76.928v-68.864zm108.896 198.24c-7.616 3.68-18.336 5.504-32.064 5.504h-76.832v-83.232h77.888c13.568.096 24.128 1.888 31.68 5.248 13.44 6.08 20.128 17.216 20.128 33.504 0 19.2-6.912 32.128-20.8 38.976zM327.168 110.539h135.584v38.848h-135.584zM509.856 263.851c-2.816-18.08-9.024-33.984-18.688-47.712-10.592-15.552-24.032-26.944-40.384-34.144-16.288-7.232-34.624-10.848-55.04-10.816-34.272 0-62.112 10.72-83.648 32-21.472 21.344-32.224 52.032-32.224 92.032 0 42.656 11.872 73.472 35.744 92.384 23.776 18.944 51.232 28.384 82.4 28.384 37.728 0 67.072-11.232 88.032-33.632 13.408-14.144 20.992-28.064 22.656-41.728h-62.464c-3.616 6.752-7.808 12.032-12.608 15.872-8.704 7.04-20.032 10.56-33.92 10.56-13.216 0-24.416-2.912-33.76-8.704-15.424-9.28-23.488-25.536-24.512-48.672h170.464c.256-19.936-.384-35.264-2.048-45.824zm-166.88 5.984c2.24-15.008 7.68-26.912 16.32-35.712 8.64-8.768 20.864-13.184 36.512-13.216 14.432 0 26.496 4.128 36.32 12.416 9.696 8.352 15.168 20.48 16.288 36.512h-105.44z"/></symbol>
<symbol id="linkedin" viewBox="0 0 24 24"><path d="M5.9 21.9h-4.7v-14.2h4.7v14.2zm-2.3-16.1c-1.6 0-2.6-1.1-2.6-2.5s1-2.5 2.7-2.5c1.6 0 2.6 1 2.6 2.5-.1 1.4-1.2 2.5-2.7 2.5zm19.2 16.1h-4.7v-7.6c0-2-.7-3.3-2.3-3.3-1.3 0-2.1.9-2.5 1.7-.1.3-.1.8-.1 1.2v7.9h-4.7v-14.1h4.7v2c.7-.9 1.7-2.3 4.3-2.3 3.1 0 5.5 2.1 5.5 6.4v8.2h-.2z"/></symbol>
<symbol id="medium" viewBox="0 0 130.8 104"><path d="M15.5 21.2c.2-1.6-.5-3.2-1.7-4.3l-12.1-14.7v-2.2h38l29.3 64.4 25.8-64.4h36.2v2.2l-10.5 10c-.9.7-1.3 1.8-1.2 2.9v73.7c0 1.1.3 2.2 1.2 2.9l10.2 10v2.2h-51.3v-2.2l10.6-10.2c1-1 1-1.3 1-2.9v-59.6l-29.4 74.7h-4l-34.2-74.7v50.3c0 2.2.4 4.2 1.9 5.7l13.7 16.8v2.2h-39v-2.2l13.8-16.7c1.5-1.5 1.8-3.3 1.8-5.7l-.1-58.2z"/></symbol>
<symbol id="pinterest" viewBox="0 0 24 24"><path d="M5.9 13.9c1.2-2-.4-2.5-.6-4-1-6.1 7.1-10.2 11.4-6 2.9 2.9 1 12-3.7 11-4.6-.9 2.2-8.1-1.4-9.5-3-1.1-4.6 3.6-3.2 5.9-.8 4-2.5 7.7-1.8 12.7 2.3-1.7 3.1-4.8 3.7-8.1 1.2.7 1.8 1.4 3.3 1.5 5.5.4 8.6-5.4 7.8-10.7-.7-4.7-5.5-7.1-10.6-6.6-4.1.4-8.1 3.7-8.3 8.3-.1 2.8.7 4.9 3.4 5.5z"/></symbol>
<symbol id="stumbleupon" viewBox="0 0 24 24"><path d="M13.3 9.6l1.6.8 2.5-.8v-1.4c0-3-2.4-5.4-5.4-5.4s-5.4 2.4-5.4 5.4v7.5c0 .7-.6 1.3-1.3 1.3s-1.3-.6-1.3-1.3v-3.2h-4v3.2c0 3 2.4 5.4 5.4 5.4s5.4-2.4 5.4-5.4v-7.5c0-.7.6-1.3 1.3-1.3s1.3.6 1.3 1.3l-.1 1.4zm6.6 2.9v3.2c0 .7-.6 1.3-1.3 1.3s-1.3-.6-1.3-1.3v-3.2l-2.5.8-1.6-.8v3.2c0 3 2.4 5.4 5.4 5.4s5.4-2.4 5.4-5.4v-3.2h-4.1z"/></symbol>
<symbol id="twitter" viewBox="0 1 24 23"><path d="M21.5 7.6v.6c0 6.6-5 14.1-14 14.1-2.8 0-5.4-.8-7.6-2.2l1.2.1c2.3 0 4.4-.8 6.1-2.1-2.2 0-4-1.5-4.6-3.4.3.1.6.1.9.1.5 0 .9-.1 1.3-.2-2.1-.6-3.8-2.6-3.8-5 .7.4 1.4.6 2.2.6-1.3-.9-2.2-2.4-2.2-4.1 0-.9.2-1.8.7-2.5 2.4 3 6.1 5 10.2 5.2-.1-.4-.1-.7-.1-1.1 0-2.7 2.2-5 4.9-5 1.4 0 2.7.6 3.6 1.6 1-.3 2.1-.7 3-1.3-.4 1.2-1.1 2.1-2.2 2.7 1-.1 1.9-.4 2.8-.8-.6 1.1-1.4 2-2.4 2.7z"/></symbol>
<symbol id="tumblr" viewBox="0 0 23 23"><path d="M12.573 4.94v-4.94h-3.188c-.072.183-.11.4-.11.622-.034.107-.072.184-.072.293-.328 1.829-1.28 3.11-2.892 3.807-.476.218-.914.253-1.39.218v3.987h2.342c.039 5.603.039 8.493.039 8.64v.332c.294 2.449 1.573 3.914 3.843 4.463.914.257 1.901.366 2.892.366 1.279-.036 2.525-.256 3.771-.659v-4.685c-.731.22-1.395.402-1.977.583-1.135.333-2.087.113-2.857-.619-.073-.11-.183-.257-.221-.403-.106-.586-.178-1.206-.178-1.795v-6.222h5.083v-3.988h-5.085z"/></symbol>
<symbol id="xing" viewBox="0 0 24 24"><path d="M3.647 4.74c-.208 0-.384.073-.472.216-.091.148-.077.338.02.531l2.34 4.051v.02l-3.678 6.49c-.096.191-.091.383 0 .531.088.142.244.236.452.236h3.461c.518 0 .767-.349.944-.669l3.737-6.608-2.38-4.15c-.172-.307-.433-.649-.964-.649h-3.46zm14.542-4.74c-.517 0-.741.326-.927.659l-7.702 13.658 4.918 9.023c.172.307.437.659.967.659h3.457c.208 0 .371-.079.459-.221.092-.148.09-.343-.007-.535l-4.88-8.915v-.023l7.664-13.551c.096-.191.098-.386.007-.534-.088-.142-.252-.221-.46-.221h-3.496z"/></symbol>
<symbol id="whatsapp" viewBox="0 0 512 512"><path d="M256.064 0h-.128c-141.152 0-255.936 114.816-255.936 256 0 56 18.048 107.904 48.736 150.048l-31.904 95.104 98.4-31.456c40.48 26.816 88.768 42.304 140.832 42.304 141.152 0 255.936-114.848 255.936-256s-114.784-256-255.936-256zm148.96 361.504c-6.176 17.44-30.688 31.904-50.24 36.128-13.376 2.848-30.848 5.12-89.664-19.264-75.232-31.168-123.68-107.616-127.456-112.576-3.616-4.96-30.4-40.48-30.4-77.216s18.656-54.624 26.176-62.304c6.176-6.304 16.384-9.184 26.176-9.184 3.168 0 6.016.16 8.576.288 7.52.32 11.296.768 16.256 12.64 6.176 14.88 21.216 51.616 23.008 55.392 1.824 3.776 3.648 8.896 1.088 13.856-2.4 5.12-4.512 7.392-8.288 11.744-3.776 4.352-7.36 7.68-11.136 12.352-3.456 4.064-7.36 8.416-3.008 15.936 4.352 7.36 19.392 31.904 41.536 51.616 28.576 25.44 51.744 33.568 60.032 37.024 6.176 2.56 13.536 1.952 18.048-2.848 5.728-6.176 12.8-16.416 20-26.496 5.12-7.232 11.584-8.128 18.368-5.568 6.912 2.4 43.488 20.48 51.008 24.224 7.52 3.776 12.48 5.568 14.304 8.736 1.792 3.168 1.792 18.048-4.384 35.52z"/></symbol>
<symbol id="youtube" viewBox="0 0 24 24"><path d="M23.6 6.3c-.3-1.2-1.4-2.2-2.6-2.3-3-.3-6-.3-9-.3s-6 0-9 .3c-1.2.1-2.3 1.1-2.6 2.3-.4 1.8-.4 3.8-.4 5.7 0 1.9 0 3.9.4 5.7.3 1.2 1.4 2.2 2.6 2.3 3 .3 6 .3 9 .3s6 0 9-.3c1.3-.1 2.3-1.1 2.6-2.4.4-1.7.4-3.7.4-5.6 0-1.9 0-3.9-.4-5.7zm-14.1 9v-6.6l6.5 3.3-6.5 3.3z"/></symbol>
</svg>
<!-- Navigation -->
<nav class="side pole medium left">
<div class="navigation">
<ul></ul>
</div>
</nav>
<!-- Panel Top #library/panel/panel-top-06.html -->
<nav class="panel top hideOnScroll ">
<div class="sections desktop">
<div class="left"><a href="#top" title="Vox"><img src="assets/svg/logo.svg" width="101"></a></div>
<div class="center">
<ul class="menu">
<li><a href="#push">配達プッシュ通知</a></li>
<li><a href="#unlock">ボックス解錠認証</a></li>
<li><a href="#pickup">解錠･荷物取り出し</a></li>
<li><a href="#reopen">再度解錠荷物取り出し</a></li>
<li><a href="#menu">アプリメニュー</a></li>
<li><a href="#video">ビデオガイド</a></li>
</ul>
</div>
<div class="right"><span class="actionButton sidebarTrigger" data-sidebar-id="1"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#menu"></use></svg></span></div>
</div>
<div class="sections compact hidden">
<div class="left"><a href="#top" title="Vox"><img src="assets/svg/logo.svg" width="91"></a></div>
<div class="right"><span class="actionButton sidebarTrigger" data-sidebar-id="1"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#menu"></use></svg></span></div>
</div>
</nav>
<!-- Sidebar -->
<nav class="sidebar" data-sidebar-id="1">
<div class="close"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#close"></use></svg></div>
<div class="content">
<a href="#top" class="logo"><img src="assets/svg/logo_s.svg" width="50"></a>
<ul class="mainMenu margin-top-3">
<li><a href="#push">配達プッシュ通知</a></li>
<li><a href="#unlock">ボックス解錠認証</a></li>
<li><a href="#pickup">解錠･荷物取り出し</a></li>
<li><a href="#reopen">再度解錠荷物取り出し</a></li>
<li><a href="#menu">アプリメニュー</a></li>
<li><a href="#video">ビデオガイド</a></li>
</ul>
<ul class="subMenu small opacity-8">
<li><a href="privacy_app.html" target="_blank">プライバシーポリシー</a></li>
</ul>
</div>
</nav>
<!-- 1 -->
<section data-title="ユーザー利用ガイド" class="slide whiteSlide" id="top">
<div class="content">
<div class="container">
<div class="wrap">
<ul class="grid">
<li class="col-12-12">
<div class="fix-8-12">
<h4 class="ae-1 padding-bottom-2">User Guide</h4>
<h2 class="ae-1">モニターユーザー利用ガイド</h2>
<div class="fix-6-12">
<p class="tiny ae-1">スマホ制御型宅配ボックス</p>
</div>
</div>
</li>
<li class="col-12-12">
<div class="fix-8-12 ae-2 margin-top-6">
<img width="1080" src="assets/img/voxq2.png" class="voxshadow shiftImage iphone-jp" alt="Smart Box System" data-action="zoom"/>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="background" style="background:linear-gradient(-0deg, #DFEBEF, #FFFFFF);"></div>
</section>
<!-- 2 -->
<section data-title="配達プッシュ通知" class="slide fade-6 kenBurns" id="push">
<div class="content">
<div class="container">
<div class="wrap">
<div class="fix-12-12">
<ul class="flex verticalCenter later">
<li class="col-5-12 ae-1 cell-29">
<img width="280" src="assets/img/device1.png" class="iphone-29" data-action="zoom"/>
</li>
<li class="col-7-12 left">
<h4 class="ae-1 fromLeft padding-bottom-2">Push Notification</h4>
<h2 class="ae-1 fromLeft">配達プッシュ通知</h2>
<p class="tiny ae-2 light fromLeft padding-bottom-2">宅配荷物配達時にプッシュ通知でお知らせ</p>
<p class="ae-2 light fromLeft"><span class="opacity-8"><small>初回アプリ起動時に通知を許可していない場合は、プッシュ通知が表示されず荷物の到着が分かりません</small></span></p>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="background" style="background:linear-gradient(-0deg, #182029, #394C5F);"></div>
</section>
<!-- 3 -->
<section data-title="ボックス解錠認証" class="slide whiteSlide" id="unlock">
<div class="content">
<div class="container">
<div class="wrap">
<div class="fix-12-12">
<ul class="flex verticalCenter later reverse">
<li class="col-7-12 left">
<h4 class="ae-1 fromLeft padding-bottom-2">Unlock Authentication</h4>
<h2 class="ae-1 fromLeft">ボックス解錠認証</h2>
<p class="tiny ae-2 light fromLeft padding-bottom-2">アプリを開いた状態で近づくと解錠ボタンが青く点滅</p>
<p class="ae-2 light fromLeft"><span class="opacity-8"><small>スマートフォンを下記のとおりに設定して下さい</small></span></p>
<img class="ae-3 fromLeft" src="assets/img/setting.png" width="240">
</li>
<li class="col-5-12 cell-28 ae-1">
<img src="assets/img/device2.png" width="280" class="iphone-28" data-action="zoom"/>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="background" style="background:linear-gradient(-0deg, #DFEBEF, #FFFFFF);"></div>
</section>
<!-- 4 -->
<section data-title="解錠･荷物取り出し" class="slide fade-6 kenBurns fromLeft" id="pickup">
<div class="content">
<div class="container">
<div class="wrap">
<div class="fix-12-12">
<ul class="flex reverse">
<li class="col-6-12 left cell-32">
<h4 class="ae-1 fromLeft padding-bottom-2">PICK UP</h4>
<h2 class="ae-1 fromLeft">解錠･荷物取り出し</h2>
<p class="tiny ae-2 light fromLeft padding-bottom-2">青く点滅しているボタンを押し、取手を引いて扉を開き荷物受け取り</p>
<p class="ae-2 light fromLeft"><span class="opacity-8"><small>ボタンが光るまで多少時間がかかることがあります (最大10秒程度)</small></span></p>
<p class="ae-2 light fromLeft"><span class="opacity-8"><small>ボタンが光らない場合はアプリ画面の｢更新スキャン｣ボタンを一度タップしてください (連続でタップはしないでください)</small></span></p>
<p class="ae-2 light fromLeft"><span class="opacity-8"><small>荷物取り出し後､「受取予定のお荷物はございません」とアプリ画面に表示されたことをご確認ください</small></span></p>
</li>
<li class="col-6-12 left ae-1 fromRight">
<img class="ipad-32" width="1000" src="assets/img/voxpush.png"/>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="background" style="background:linear-gradient(-0deg, #182029, #394C5F);"></div>
</section>
<!-- 5 -->
<section data-title="再度解錠荷物取り出し" class="slide whiteSlide" id="reopen">
<div class="content">
<div class="container">
<div class="wrap">
<div class="fix-12-12">
<ul class="flex verticalCenter later reverse">
<li class="col-7-12 left">
<h4 class="ae-1 fromLeft padding-bottom-2">Re-open</h4>
<h2 class="ae-1 fromLeft">再度解錠荷物取り出し</h2>
<p class="tiny ae-2 light fromLeft padding-bottom-2">荷物を取り出さずに扉を閉めた場合などに､再度解錠認証</p>
<p class="ae-2 light fromLeft"><span class="opacity-8"><small>メニューよりStatusページを開き「再度解錠取り出し」ボタンをタップすると解錠認証が開始 (受取取り出し操作後2分以内)</small></span></p>
<p class="ae-2 light fromLeft"><span class="opacity-8"><small>「解錠権限がありません」と表示された場合は閉扉後2分経過しているため､事務局までご連絡ください</small></span></p>
<p class="ae-2 light fromLeft"><span class="opacity-8"><small>受取解錠したにもかかわらず､荷物を取り出さずに放置した場合は､次の配達受入れが可能になるため荷物紛失等トラブルの責任は負いかねます</small></span></p>
</li>
<li class="col-5-12 cell-28 ae-1">
<img src="assets/img/device3.png" width="280" class="iphone-28" data-action="zoom"/>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="background" style="background:linear-gradient(-0deg, #DFEBEF, #FFFFFF);"></div>
</section>
<!-- 6 -->
<section data-title="アプリメニュー" class="slide fade-6 kenBurns" id="menu">
<div class="content">
<div class="container">
<div class="wrap">
<div class="fix-12-12">
<ul class="flex verticalCenter later">
<li class="col-5-12 ae-1 cell-29">
<img width="280" src="assets/img/device4.png" class="iphone-29" data-action="zoom"/>
</li>
<li class="col-7-12 left">
<h4 class="ae-1 fromLeft padding-bottom-1">App Menu</h4>
<p class="tiny ae-2 light fromLeft padding-bottom-6"><small>右上のメニューアイコンをタップして表示</small> </p>
<h5 class="ae-1 fromLeft padding-bottom-1">Delivery</h5>
<p class="ae-2 light fromLeft padding-bottom-2 opacity-6">受取解錠認証ページ (荷物受け取り時)</p>
<h5 class="ae-1 fromLeft padding-bottom-1">Status</h5>
<p class="ae-2 light fromLeft padding-bottom-2 opacity-6">荷物配達･受取ステータス (再度解錠荷物取り出し時)</p>
<h5 class="ae-1 fromLeft padding-bottom-1">Account</h5>
<p class="ae-2 light fromLeft padding-bottom-2 opacity-6">アカウント管理</p>
<h5 class="ae-1 fromLeft padding-bottom-1">Privacy Policy</h5>
<p class="ae-2 light fromLeft padding-bottom-2 opacity-6">プライバリーポリシー</p>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="background" style="background:linear-gradient(-0deg, #182029, #394C5F);"></div>
</section>
<!-- 7 -->
<section data-title="ビデオガイド" class="slide fade-6 kenBurns" id="video">
<div class="content">
<div class="container">
<div class="wrap">
<div class="fix-11-12">
<h3 class="cropBottom ae-1 fromCenter">
宅配ボックス
<span class="button play small white popupTrigger button-7" data-popup-id="7">
<svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#play"></use></svg>
</span>
ユーザー利用ガイド
</h3>
</div>
</div>
</div>
</div>
<div class="background" style="background-image:url(assets/img/background/img-07.jpg)"></div>
</section>
<!-- Popup Video -->
<div class="popup autoplay" data-popup-id="7">
<div class="close"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#close"></use></svg></div>
<div class="content">
<div class="container">
<div class="wrap">
<div class="fix-12-12">
<div class="embedVideo popupContent">
<iframe src="https://player.vimeo.com/video/363105312" frameborder="0" allow=" autoplay; fullscreen" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Panel Bottom #09 -->
<nav class="panel bottom hideOnScroll ">
<div class="sections">
<div class="left padding-bottom-1">
<a href="http://www.kyuden.co.jp/press_h180822-1" target="_blank" class="button hollow"><img src="assets/img/mark.png" width="240"/></a>
</div>
<div class="center"><span class="nextSlide"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#arrow-down"></use></svg></span></div>
<div class="right">
<ul class="copy trim">
<li class="cropRight"><a href="https://www.kyuden.co.jp" target="_blank" class="trim">© Kyushu Electric Power</a> & <a href="https://mashroo.me" target="_blank" class="trim">Mashroom</a></li>
</ul>
</div>
</div>
</nav>
</body>
</html>