-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathstrait-gate.html
More file actions
275 lines (265 loc) · 12.9 KB
/
strait-gate.html
File metadata and controls
275 lines (265 loc) · 12.9 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
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>천로역정 : The Pilgrim's Progress</title>
<meta property="og:title" content="천로역정 : The Pilgrim's Progress">
<meta property="og:type" content="website">
<meta property="og:image" content="assets/img/logo.png">
<meta property="og:description" content="멸망도시를 떠나 천국도시로 향하는 크리스천의 이야기">
<!-- Favicons -->
<link href="assets/img/favicon.png" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<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=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,600;1,700&family=Roboto:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&family=Work+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link rel="stylesheet" href="assets/vendor/jquery/css/jquery.fullPage.css">
<!-- Template Main CSS File -->
<link href="assets/css/main.css" rel="stylesheet">
<!-- =======================================================
* Template Name: UpConstruction
* Updated: Sep 18 2023 with Bootstrap v5.3.2
* Template URL: https://bootstrapmade.com/upconstruction-bootstrap-construction-website-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>
<body>
<header id="header" class="header d-flex align-items-center">
<div class="container-fluid container-xl d-flex align-items-center justify-content-between">
<div class="logo d-flex align-items-center">
<h1>천로역정</h1>
</div>
<nav id="navbar" class="navbar">
<ul><li><a href="/">맨 위로</a></li></ul>
</nav>
</div>
</header>
<div class="fullpage">
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h1>좁은 문</h1>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h2>
<img src="assets/img/character/evangelist.png"></img>
<p>전도사</p>
</h2>
<p>주의 말씀을 들려줄 테니 잠시 기다려보시오.</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<p>크리스천은 주의 말씀이라는 소리에 두려워져 몸을 떨며 말씀을 기다렸다.</p>
<p>전도사는 책을 펼치곤 이야기를 했다.</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h2>
<img src="assets/img/character/evangelist.png"></img>
<p>전도사</p>
</h2>
<p>주께서 이 책에 이와 같이 말씀하셨소.</p>
<p>
‘너희는 말씀하신 이를 거역하지 않도록 주의하라.
땅에서 경고한 이를 거역한 그들이 피하지 못하였거늘 하물며 하늘로부터 경고하신 이를 배반하는 우리가 피할 수 있겠느냐?
</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h2>
<img src="assets/img/character/evangelist.png"></img>
<p>전도사</p>
</h2>
<p>의인은 <span>믿음</span>으로 말미암아 살리라.</p>
<p>그러나 누구든지 뒤로 물러나면 내 마음이 그를 기뻐하지 아니하리라.’</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<p>말이 없는 크리스천을 보곤</p>
<p>전도사가 말을 이어갔다.</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h2>
<img src="assets/img/character/evangelist.png"></img>
<p>전도사</p>
</h2>
<p>
당신은 재앙을 스스로 불러오고 있소.
가장 높으신 이의 경고를 거역했고, 평강의 길에서 뒷걸음질하여 영원한 파멸에 이를 뻔 하였소.
</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<p>그제야 크리스천은 자신이 한 행동을 깨닫곤 혼이 나간 듯 바닥에 털썩 주저앉아 울기 시작했다.</p>
<p>크리스천은 짐을 쉽게 풀 수 있다는 말에 넘어가 옳은 길로부터 벗어난 것에 대한 수치심과 자신의 어리석음에 대한 한탄스러움을 느끼기 시작했다.</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h2>
<img src="assets/img/character/christian.png"></img>
<p>크리스천</p>
</h2>
<p>아아! 나는 이제 끝이구나!</p>
<p>
제게는 이제 희망이 없는 것입니까? 이제라도 돌아가 좁은 문을 향해 가면 안될까요?
혹시 이 일로 인해 이제 저는 버림받고 치욕을 받은 채로 고향으로 돌아가느 건가요? 저는 용서받지 못하는 걸까요?
</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<p>엉엉 우는 크리스천의 손을 잡은 전도사는 그를 위로하며 말했다.</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h2>
<img src="assets/img/character/evangelist.png"></img>
<p>전도사</p>
</h2>
<p>크리스천! 당신은 아주 큰 죄를 지었소.</p>
<p>
당신은 두 가지 잘못을 저질렀는데 하나는 옳은 길에서 벗어난 것이요, 또 하나는 가서는 안 될 길에 발을 들인 것이오.
</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h2>
<img src="assets/img/character/evangelist.png"></img>
<p>전도사</p>
</h2>
<p>
그러나 좁은 문에 있는 분은 선하시기에 당신을 받아 주실것이오.
의심치 말고 믿음을 가지시오.
</p>
</div>
</div>
</div>
</div>
</div>
<div id="hero" class="hero section">
<div class="info d-flex align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8 text-center">
<h2>Q. 의인은 무엇으로 살아야 할까요?</h2>
<input type="text" onkeypress="enterkey(event, 1)" id="answer">
<a onclick="sendAnswer(1)" class="btn-get-started">정답</a>
</div>
</div>
</div>
</div>
</div>
<footer id="footer" class="footer section">
<div class="footer-legal container-fluid text-center position-relative">
<div class="container">
<div class="copyright">
© Copyright <strong><span>Riddle Game</span></strong>. All Rights Reserved
</div>
<div class="credits">
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
/ 이미지 출처 : <a href="http://www.freepik.com">Freepik</a>
</div>
</div>
</div>
</footer>
</div>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/jquery/jquery-3.7.1.min.js"></script>
<script src="assets/vendor/jquery/js/jquery.fullPage.js"></script>
<script src="assets/js/main.js"></script>
<script>
$(function() {
var page = $('.fullpage').fullpage({
navigation : true,
navigationPosition : 'right'
});
})
</script>
</body>
</html>