-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
786 lines (677 loc) · 30.5 KB
/
Copy pathindex.html
File metadata and controls
786 lines (677 loc) · 30.5 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
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
<!doctype html>
<html class="h-100" lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
<title>푸른숲 발도르프 학교 어린이집 홈페이지</title>
<meta name="description" content="경기 광주 퇴촌에 위치한 푸른숲 발도르프 학교 어린이집은 발도르프 유아교육을 추구합니다. 푸른숲 발도르프 학교와 자매기관입니다.">
<meta name="keyword" content="푸른숲 어린이집, 발도르프, 발도르프 유아교육, 발도르프어린이집, 발도르프 학교, 루돌프 슈타이너, 전인교육, 경기광주어린이집">
<meta property="og:url" content="https://gforestkid.github.io/">
<meta property="og:title" content="푸른숲 발도르프 학교 어린이집 홈페이지">
<meta property="og:type" content="website">
<meta property="og:image" content="img/main01.jpg">
<meta property="og:description" content="경기 광주 퇴촌에 위치한 푸른숲 발도르프 학교 어린이집은 발도르프 유아교육을 추구합니다. 푸른숲 발도르프 학교와 자매기관입니다.">
<meta name="author" content="gforestkid@naver.com">
<meta name="Date" content="2025-03-05T00:00:00+09:00">
<meta name="robots" content="index,follow">
<meta http-equiv="Content-Script-Type" content="Text/javascript">
<meta http-equiv="Subject" content="푸른숲 발도르프 학교 어린이집 홈페이지">
<meta http-equiv="Reply-To" content="gforestkid@naver.com">
<meta http-equiv="Email" content="gforestkid@naver.com">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&family=MaruBuri:wght@400;700&display=swap" rel="stylesheet">
<link rel="apple-touch-icon" sizes="180x180" href="img/favicon-180x180.png">
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="img/favicon-96x96.png">
<link rel="icon" href="/favicon.ico">
<!-- <link rel="stylesheet" href="css/theme.min.css"> -->
<link rel="stylesheet" href="css/theme.css">
<style>
body{
font-family: 'MaruBuri', 'Noto Sans KR', serif;
line-height: 1.7;
color: #333;
}
h1, h2, h3{
font-family: 'MaruBuri', serif;
font-weight: 700;
letter-spacing: -0.5px;
}
p{
font-family: 'Noto Sans KR', sans-serif;
font-weight: 300;
max-width: 520px;
}
</style>
<style>
.navbar-brand {
max-width: 320px;
}
.navbar .nav-link {
font-size: 0.95rem;
letter-spacing: -0.01em;
}
.navbar {
background: rgba(255, 255, 255, 0.92) !important;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
box-shadow: 0 1px 8px rgba(0,0,0,0.06);
padding-top: 8px !important;
padding-bottom: 8px !important;
}
.navbar .nav-link {
color: #333 !important;
font-weight: 500;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus {
color: #111 !important;
}
.navbar-brand span {
color: #222 !important;
}
.navbar-toggler {
border-color: rgba(0,0,0,0.15);
}
.navbar-light .navbar-toggler-icon {
filter: contrast(1.2);
}
.section-title {
max-width: 680px;
}
.btn-custom {
background: linear-gradient(135deg, #f6c667, #e89a5b);
color: white;
border-radius: 30px;
padding: 14px 28px;
font-weight: 500;
border: none;
transition: all 0.3s ease;
}
.btn-custom:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(0,0,0,0.15);
}
@media (max-width: 768px) {
.section-image {
width: 100%;
height: 400px;
border-radius: 12px;
margin-bottom: 12px;
background-size: cover;
background-position: center;
/* 기본 톤 */
background-color: #ddd;
}
#contact h2 {
font-size: 1.45rem !important;
line-height: 1.5 !important;
letter-spacing: -0.3px;
margin-bottom: 28px !important;
}
#contact .btn-custom {
padding: 12px 22px !important;
font-size: 0.95rem !important;
border-radius: 24px !important;
}
html, body, p, li, a, span, div {
font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}
h1, h2, h3, h4, h5, h6,
.hero-title,
.hero-subtitle,
.section-title,
.navbar-brand span,
.growth-section.item h3,
.day-schedule h3 {
font-family: 'MaruBuri', 'Noto Sans KR', serif !important;
font-weight: 700 !important;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.section-title,
#about h2,
#point h2,
#purpose h2 {
text-align: right !important;
margin-left: 0 !important;
}
#about,
#point,
#purpose {
padding-top: 36px !important;
padding-bottom: 36px !important;
}
#top {
background: #f7f5f2 !important;
}
#top .container {
padding-left: 0 !important;
padding-right: 0 !important;
}
#top .position-absolute.top-0.end-0 {
position: relative !important;
width: 100% !important;
height: 380px !important;
min-height: 380px !important;
top: auto !important;
right: auto !important;
filter: brightness(0.9) contrast(1.05) !important;
background-size: cover !important;
background-position: center center !important;
}
#top .row {
display: flex !important;
flex-direction: column-reverse !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
#top .col-lg-7.py-vh-6.position-relative {
width: 100% !important;
max-width: 100% !important;
background: #f7f5f2 !important;
padding: 28px 22px 24px 22px !important;
border-radius: 0 !important;
backdrop-filter: none !important;
}
.hero-title {
font-size: 1.8rem !important;
line-height: 1.2 !important;
margin-top: 0 !important;
margin-bottom: 0.8rem !important;
word-break: keep-all;
}
.hero-subtitle {
font-size: 1.15rem !important;
line-height: 1.45 !important;
margin-bottom: 1rem !important;
}
.hero-text {
font-size: 0.98rem !important;
line-height: 1.75 !important;
color: #555 !important;
margin-top: 0.8rem !important;
}
.navbar {
padding-top: 6px !important;
padding-bottom: 6px !important;
}
.navbar-brand {
max-width: calc(100% - 72px);
}
.navbar-brand img {
width: 36px !important;
height: 36px !important;
}
.navbar-brand span {
font-size: 0.95rem !important;
line-height: 1.25 !important;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.navbar-toggler {
padding: 6px 8px !important;
}
.growth-section.item,
.day-item,
.about-card {
border-top: 1px solid #e5e5e5;
padding-top: 14px !important;
margin-top: 18px !important;
margin-bottom: 20px !important;
}
.growth-section.item h3,
.about-card h3 {
font-size: 1.15rem !important;
margin-bottom: 8px !important;
}
.growth-section.item p,
.about-card p,
.day-intro,
.day-outro,
.growth-intro,
.growth-outro {
font-size: 1rem !important;
line-height: 1.7 !important;
color: #555 !important;
}
h3,
.section-title {
margin-bottom: 10px !important;
}
}
</style>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-X3DX7TBM97"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-X3DX7TBM97');
</script>
</head>
<body data-bs-spy="scroll" data-bs-target="#navScroll">
<nav id="navScroll" class="navbar navbar-expand-lg navbar-light fixed-top" tabindex="0">
<div class="container">
<a class="navbar-brand pe-2 fs-4" href="#top">
<div style="display: flex; align-items: center;">
<img src="./img/favicon-114x114.png" alt="푸른숲 발도르프 학교 어린이집 로고" width="50" height="50">
<span class="fw-bolder ms-2">푸른숲 발도르프 어린이집</span>
</div>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="#about">푸른숲 이야기</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#point">아이의 하루</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#purpose">푸른숲에서 자라나는 힘</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">함께하기</a>
</li>
</ul>
</div>
</div>
</nav>
<main>
<div class="w-100 overflow-hidden bg-gray-100" id="top">
<div class="container position-relative">
<div class="col-12 col-lg-8 mt-0 h-100 position-absolute top-0 end-0 bg-cover" data-aos="fade-left"
style="background-image: url(img/main01.jpg);">
</div>
<div class="row">
<div style="display: none;">
<p>
경기 광주 퇴촌에 위치한 푸른숲 발도르프 학교 어린이집은 발도르프 유아교육을 추구합니다.
푸른숲 발도르프 학교와 자매기관입니다.
푸른숲 발도르프 어린이집, 푸른숲 어린이집, 발도르프, 발도르프 유아교육,
발도르프 어린이집, 발도르프 학교, 루돌프 슈타이너, 전인교육, 경기 광주 어린이집
</p>
</div>
<div class="col-lg-7 py-vh-6 position-relative" data-aos="fade-right">
<h1 class="hero-title fw-bold mt-5">푸른숲 발도르프 어린이집</h1>
<h2 class="hero-subtitle">
아이를 바꾸려 하지 않습니다.<br>
아이 안에 있는 힘이 자라나도록 돕습니다.
</h2>
<p class="hero-text">
푸른숲은<br>
무언가를 더 가르치는 곳이 아니라 <br>
아이의 리듬을 지키고 <br>
몸과 마음이 편안한 상태에서 <br>
스스로 자라날 수 있도록 돕는 공간입니다.<br>
</p>
</div>
</div>
</div>
</div>
<div class="py-vh-5 w-100 overflow-hidden" id="about">
<div class="container">
<div class="row d-flex justify-content-between align-items-start">
<div class="col-lg-5">
<h2 class="py-5 border-top border-dark" data-aos="fade-right" style="font-size:1.6rem; font-weight:700;" >
푸른숲 이야기
</h2>
<p class="day-intro" style="text-align:right;">
이곳에서 아이는 바뀌지 않습니다<br>
대신 아이가 자기 모습으로 자라납니다.<br>
</p>
<div class="section-image" style="background-image:url('img/about01.jpg')"></div>
</div>
<div class="col-lg-6">
<div class="growth-section item" data-aos="fade-left">
<h3> 리듬 있는 하루</h3>
<p>
아이들은 반복 속에서 안정감을 느낍니다.<br>
매일 같은 흐름 속에서<br>
다음을 예측할 수 있을 때,<br>
아이의 몸과 마음은 편안해집니다.<br><br>
그 편안함 위에서<br>
놀이와 배움이 시작됩니다.<br><br>
</p>
</div>
<div class="growth-section item" data-aos="fade-left">
<h3>자연과 함께 자라는 아이</h3>
<p>
아이들은 자연 속에서 살아갑니다.<br>
흙을 만지고,<br>
바람을 느끼고,<br>
계절의 변화를 몸으로 경험하며<br>
세상과 연결됩니다.<br><br>
자연은 아이에게<br>
가장 좋은 배움의 공간입니다.<br>
</p>
</div>
<div class="growth-section item" data-aos="fade-left">
<h3>놀이 속에서 자라는 힘</h3>
<p>
놀이는 아이의 일입니다.<br>
스스로 시작하고 몰입하는 과정 속에서<br>
집중력과 상상력,<br>
그리고 문제를 해결하는 힘이 자랍니다.<br>
푸른숲은<br>
아이의 놀이를 지켜주는 곳입니다.<br>
</p>
</div>
<div class="growth-section item" data-aos="fade-left">
<h3>함께 가꾸는 공동체</h3>
<p>
푸른숲은 아이만 다니는 곳이 아니라<br>
어른들도 함께 성장하는 공동체입니다.<br>
교사와 부모가 함께 고민하고<br>
아이에게 필요한 환경을 만들어 갑니다.<br>
</p>
</div>
<div class="growth-section item" data-aos="fade-left">
<h3>
아이를 바꾸려 하기보다<br>
아이가 스스로 자라날 수 있도록 돕는 곳
</h3>
<p>
이곳은 경기 광주 퇴촌의<br>
푸른숲 발도르프 학교 어린이집입니다.<br>
직접 보고 느껴보시길 바랍니다.<br>
</p>
</div>
</div>
</div>
</div>
</div>
<div class="py-vh-5 w-100 overflow-hidden" id="point">
<div class="container">
<div class="row d-flex justify-content-between align-items-start">
<div class="col-lg-5">
<h2 class="py-5 border-top border-dark" data-aos="fade-right">아이의 하루</h2>
<p class="day-intro" style="text-align:right;" >
푸른숲의 하루는 빠르게 흘러가지 않습니다.<br>
아이의 속도에 맞춰 천천히 이어집니다.<br>
그 안에서 아이는 편안해지고,<br>
편안함 속에서 스스로 움직이기 시작합니다.
</p>
<div class="section-image" style="background-image:url('img/point01.jpg')"></div>
</div>
<div class="col-lg-6">
<div class="growth-section" data-aos="fade-left">
<div class="inner">
<div class="growth-grid">
<div class="growth-section item">
<h3>아침,<br>천천히 하루를 여는 시간<br></h3>
<p>
등원 후<br>
아이들은 자유놀이와 실내놀이로 하루를 시작합니다.<br>
각자의 속도로 교실에 스며들며 몸과 마음을 깨웁니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>오전,<br>놀이와 리듬이 이어지는 시간<br></h3>
<p>
실내외 놀이, 아침 열기와 라이겐, 간식 시간이 이어집니다.<br>
요일에 따라 예술작업도 진행되며,<br>
아이들은 반복되는 흐름 속에서 안정감을 느낍니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>낮,<br>자연과 함께 움직이는 시간<br></h3>
<p>
바깥놀이와 산책, 점심식사가 이어집니다.<br>
흙을 밟고, 바람을 느끼고, 계절을 몸으로 경험하며<br>
아이들은 자연 속에서 자라납니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>오후,<br>쉬고 다시 채워지는 시간<br></h3>
<p>
실내놀이와 이야기 듣기, 낮기, 하원이 이어집니다.<br>
햇살반은 오후에 집으로 향하고,<br>
낮잠반은 편안한 분위기 속에서 충분히 쉽니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>늦은 오후,<br>하루를 천천히 마무리하는 시간<br></h3>
<p>
오후 간식과 자유놀이, 닫기가 이어집니다.<br>
놀이를 정리하며 하루를 돌아보고,<br>
아이들은 편안한 마음으로 집으로 돌아갑니다.<br>
</p>
</div>
</div>
<div class="growth-section">
<h3>하루 리듬 한눈에 보기</h3>
<ul>
<li><strong>07:30–09:00</strong> 자유놀이 및 실내놀이</li>
<li><strong>09:00–10:00</strong> 실내 / 바깥놀이</li>
<li><strong>10:00–10:30</strong> 아침 열기와 라이겐</li>
<li><strong>10:30–11:00</strong> 오전 간식</li>
<li><strong>11:00–12:00</strong> 바깥놀이 / 산책</li>
<li><strong>12:00–13:00</strong> 점심식사</li>
<li><strong>13:00–13:30</strong> 실내놀이</li>
<li><strong>13:30–14:00</strong> 이야기 듣기, 낮기</li>
<li><strong>14:00</strong> 햇살반 하원</li>
<li><strong>14:30–16:00</strong> 낮잠반 낮잠</li>
<li><strong>16:00</strong> 낮잠반 하원</li>
<li><strong>16:30–17:00</strong> 오후 간식</li>
<li><strong>17:00–18:00</strong> 자유놀이, 닫기</li>
</ul>
</div>
<p class="day-outro">
푸른숲의 하루는 무언가를 더 시키기 위해 채워지지 않습니다.
아이에게 필요한 만큼, 아이의 속도로 채워집니다.
</p>
</div>
</div>
</div>
</div>
<div class="py-vh-5 w-100 overflow-hidden" id="purpose">
<div class="container">
<div class="row d-flex justify-content-between align-items-start">
<div class="col-lg-5">
<h2 class="py-5 border-top border-dark" data-aos="fade-right">푸른숲에서 자라나는 힘</h2>
<p class="day-intro" style="text-align:right;" >
푸른숲은 아이를 더 빠르게 앞서가게 하기보다<br>
제때 깊이 자라게 하는 곳입니다.<br>
놀이와 리듬, 관계와 자연 속에서<br>
아이는 자기 안의 힘을 조금씩 키워갑니다.
</p>
<div class="section-image" style="background-image:url('img/purpose01.jpg')"></div>
</div>
<div class="col-lg-6">
<div class="growth-section" data-aos="fade-left">
<div class="inner">
<div class="growth-grid">
<div class="growth-section item">
<h3>스스로 시작하는 힘</h3>
<p>
아이는 정해진 답을 따라가기보다<br>
스스로 놀이를 만들고 움직이며<br>
자기 안의 의지를 키워갑니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>몰입하는 힘</h3>
<p>
반복되는 리듬과 충분한 놀이 속에서<br>
아이는 한 가지에 깊이 머무는 경험을 합니다.<br>
그 경험은 집중력의 바탕이 됩니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>느끼는 힘</h3>
<p>
흙을 만지고, 바람을 느끼고,<br>
계절의 변화를 몸으로 경험하며<br>
아이의 감각과 정서는 풍성하게 자라납니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>관계를 맺는 힘</h3>
<p>
친구와 함께 놀고, 기다리고, 부딪히고,<br>
다시 이어가는 과정 속에서<br>
아이는 관계의 감각을 배워갑니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>감정을 다루는 힘</h3>
<p>
안정된 하루의 흐름과 따뜻한 관계 안에서<br>
아이는 자기 감정을 조금씩 알아차리고<br>
편안하게 다루는 힘을 키워갑니다.<br>
</p>
</div>
<div class="growth-section item">
<h3>자기답게 자라는 힘</h3>
<p>
푸른숲은 아이를 같은 모습으로 만들지 않습니다.<br>
각자의 리듬과 기질을 존중하며,<br>
아이가 자기답게 자라도록 돕습니다.<br>
</p>
</div>
</div>
<p class="growth-outro">
푸른숲에서의 성장은<br>
더 빨리, 더 많이 해내는 것이 아닙니다.<br>
편안한 몸과 마음 위에서<br>
스스로 살아갈 힘을 키워가는 과정입니다.<br>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="py-vh-6 bg-gray-900 text-light w-100 overflow-hidden" id="contact">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="row d-flex justify-content-center text-center">
<div class="col-lg-8 text-center" data-aos="fade">
<h5 class="display-6 mb-5">
아이를 바꾸는 교육이 아니라 <br>
아이를 이해하는 교육을 찾고 계신다면<br>
푸른숲을 직접 만나보세요.
</h5>
<div class="col-12">
<a href="https://forms.gle/6Uh6zfwhLY8cvy7b6"
target="_blank"
class="btn btn-custom shadow mt-4">
입소 상담 신청하기
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="small py-vh-3 w-100 overflow-hidden">
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-3 border-end" data-aos="fade-up" style="cursor:pointer;"
onclick="window.open('https://blog.naver.com/gforestkid')">
<div class="d-flex">
<div class="col-md-3 flex-fill pt-3 pe-3 pe-md-0">
<img src="img/logo_blog.svg" width="42" height="42" alt="네이버 블로그 로고">
</div>
<div class="col-md-9 flex-fill">
<h3 class="h5 my-2">블로그</h3>
<p>푸른숲의 하루와 아이들의 변화가 차곡차곡 담겨 있습니다. 글을 통해 천천히 느껴보세요.</p>
</div>
</div>
</div>
<div class="col-md-6 col-lg-3 border-end" data-aos="fade-up" data-aos-delay="200" style="cursor:pointer;"
onclick="window.open('https://www.instagram.com/purunsup_kids')">
<div class="d-flex">
<div class="col-md-3 flex-fill pt-3 pe-3 pe-md-0">
<img src="img/logo_instagram.png" width="40" height="40" alt="인스타그램 로고">
</div>
<div class="col-md-9 flex-fill">
<h3 class="h5 my-2">인스타그램</h3>
<p>아이들의 일상과 순간들을 가장 빠르게 전합니다. 지금의 푸른숲을 가볍게 만나보세요.</p>
</div>
</div>
</div>
<div class="col-md-6 col-lg-3 border-end" data-aos="fade-up" data-aos-delay="400" style="cursor:pointer;"
onclick="window.open('https://www.gforest.or.kr/xe/')">
<div class="d-flex">
<div class="col-md-3 pt-3 pe-3 pe-md-0">
<img src="img/logo_school.jpg" width="42" height="42" alt="학교 홈페이지 로고">
</div>
<div class="col-md-9 flex-fill">
<h3 class="h5 my-2">푸른숲발도르프 학교</h3>
<p>어린이집 이후의 성장까지 이어지는 공간입니다.
아이들의 다음 이야기를 확인해보세요.</p>
</div>
</div>
</div>
<div class="col-md-6 col-lg-3 border-end" data-aos="fade-up" data-aos-delay="600" style="cursor:pointer;"
onclick="window.open('https://www.youtube.com/@%ED%91%B8%EB%A5%B8%EC%88%B2%EB%B0%9C%EB%8F%84%EB%A5%B4%ED%94%84%ED%95%99%EA%B5%90')">
<div class="d-flex">
<div class="col-md-3 pt-3 pe-3 pe-md-0">
<img src="img/logo_youtube.png" width="42" height="42" alt="유튜브 로고">
</div>
<div class="col-md-9 flex-fill">
<h3 class="h5 my-2">유튜브</h3>
<p>어린이집 이후, 아이들은 어떻게 자라날까요?<br>
푸른숲 발도르프 학교의 이야기를 영상으로 확인해보세요.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="container small border-top">
<div class="row py-5 d-flex justify-content-center text-center">
<div class="col-12 col-lg-6">
<p style="font-size:14px; color:#999; margin-bottom:20px;">
아이의 속도를 믿고 기다리는 공간
</p>
<h3 style="font-weight:600; margin-bottom:20px; text-align:center;">
푸른숲 발도르프 학교 어린이집
</h3>
<p style="line-height:1.8; color:#666;">
경기 광주시 퇴촌면 산수로 870-81<br>
070-4139-9865<br>
purunsup.waldorf@gmail.com
</p>
<div style="margin-top:30px; font-size:13px; color:#aaa;">
© Purunsup Waldorf Kindergarten
</div>
</div>
</div>
</div>
</footer>
<script src="js/bootstrap.bundle.min.js"></script>
<script src="js/aos.js"></script>
<script>
AOS.init({
duration: 800
});
</script>
<script>
let scrollpos = window.scrollY;
const header = document.querySelector(".navbar");
const header_height = header.offsetHeight;
const add_class_on_scroll = () => header.classList.add("scrolled", "shadow-sm");
const remove_class_on_scroll = () => header.classList.remove("scrolled", "shadow-sm");
window.addEventListener('scroll', function () {
scrollpos = window.scrollY;
if (scrollpos >= header_height) {
add_class_on_scroll();
} else {
remove_class_on_scroll();
}
});
</script>
</body>
</html>