-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
253 lines (249 loc) · 12.6 KB
/
index.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
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>OCONNECT | Enlighten Your Lifestyles</title>
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/slick.css">
<link rel="apple-touch-icon" sizes="180x180" href="./img2/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./img2/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./img2/favicon/favicon-16x16.png">
<link rel="manifest" href="./img2/favicon/site.webmanifest">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/script.js"></script>
<script src="js/splitting.min.js"></script>
<script src="js/slick.min.js"></script>
<script src="js/scrolla.jquery.min.js"></script>
</head>
<body>
<div class="wrap">
<!-- header-->
<header>
<div class="innerHeader">
<h1 class="logo"><a href="index.html">
<img src="img2/logo/exercise/blackoconnect.png" alt="로고2" width="400"></img>
<img src="img2/logo/black_cnt.png" alt="로고">
<p style="font-family: AvenirNextLTPro; font-size:25px;">OCONNECT</p>
</a>
</h1>
<ul class="gnb">
<li><a href="company_brief.html">회사소개</a>
<ul class="inner">
<li><a href="company_brief.html"><span>회사개요</span></a></li>
<!-- <li><a href="#"><span>CEO인사말</span></a></li> -->
<!-- <li><a href="philosophy.html"><span>경영이념</span></a></li> -->
<!-- <li><a href="#"><span>연혁</span></a></li> -->
</ul>
</li>
<li><a href="prod-intro.html">사업영역</a>
<ul class="inner">
<li><a href="prod-intro.html"><span>원스탭</span></a></li>
</ul>
</li>
<li><a href="news.html">홍보센터</a>
<ul class="inner">
<li><a href="news.html"><span>뉴스</span></a></li>
<!-- <li><a href="#"><span>언론</span></a></li> -->
</ul>
</li>
<li><a href="support.html">고객지원</a>
<ul class="inner">
<li><a href="support.html"><span>고객지원안내</span></a></li>
<!-- <li><a href="#"><span>FAQ</span></a></li> -->
</ul>
</li>
</ul>
</div>
</header>
<!--visual -->
<section class="visual">
<ul class="slide">
<li>
=<img src="img2/단체배너샷.jpg" alt="">
<div class="txt en">
<div data-splitting>CONNECT US,</div>
<div data-splitting>CONNECT WORLD</div>
</div>
<a href="company_brief.html" class="en">FIND OUT MORE</a>
<span class="mask a"></span> <span class="mask b"></span> <span class="mask c"></span> <span class="mask d"></span>
</li>
<li>
<img src="img2/병혁호준.jpg" alt="">
<div class="txt en">
<div data-splitting>CONNECT US,</div>
<div data-splitting>CONNECT WORLD</div>
</div>
<a href="company_brief.html" class="en">FIND OUT MORE</a>
<span class="mask a"></span> <span class="mask b"></span> <span class="mask c"></span> <span class="mask d"></span>
</li>
<li>
<img src="img2/회의실단체.jpg" alt="">
<div class="txt en">
<div data-splitting>CONNECT US,</div>
<div data-splitting>CONNECT WORLD</div>
</div>
<a href="company_brief.html" class="en">FIND OUT MORE</a>
<span class="mask a"></span> <span class="mask b"></span> <span class="mask c"></span> <span class="mask d"></span>
</li>
</ul>
</section>
<!--contents-->
<section class="contents">
<span class="line a"></span><span class="line b"></span><span class="line c"></span>
<div class="information">
<div class="scrollBox" id="scroll">
<a href="#" class="scroll en">SCROLL DOWN <span><img src="img/scrolldown.png" alt=""></span></a>
</div>
<div class="inner animate" data-animate = "motion" >
<div class="title ">
<div data-splitting class="en">OUR</div>
<div data-splitting class="en">FOOT PRINT</div>
<P>수많은 불편함과 니즈를 반영하며 개선했습니다.</P>
</div>
</div>
<div class="slideBox">
<ul class="slide2">
<li><a href="#"><p class="img"><span><img src="img2/UNIST Competition.png" alt=""></span></p></a></li>
<li><a href="#"><p class="img"><span><img src="img2/과기특성화대학 창업대회 포스터.gif" alt=""></span></p></a></li>
<li><a href="#"><p class="img"><span><img src="img2/K-Camp_poster.jpg" alt=""></span></p></a></li>
<li><a href="#"><p class="img"><span><img src="img2/2020예비창업패키지.png" alt=""></span></p></a></li>
<li><a href="#"><p class="img"><span><img src="img2/첨부2. IP디딤돌_포스터-1.jpg" alt=""></span></p></a></li>
</ul>
<a href="#" class="more en">FIND OUT MORE</a>
</div>
</div>
<div class="video animate" data-animate = "motion">
<div class="inner">
<div class="title animate" data-animate = "motion">
<div data-splitting class="en">THE FIRST CONNECTION</div>
<P>오커넥트란?</P>
</div>
<a href="company_brief.html" class="more en">FIND OUT MORE</a>
<div class="videoBox">
<!-- <iframe width="690" height="391" src="https://www.youtube.com/watch?v=iiD3NuyX2j4&feature=youtu.be" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
<!-- <iframe width="690" height="391" src="https://www.youtube.com/embed/iiD3NuyX2j4" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
<iframe width="690" height="391" src="https://www.youtube.com/embed/C3fjHDUZ8m8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<p class="mask"><span><img src="img2/vedio_mask.png" alt=""></span></p>
</div>
</div>
</div>
<div class="business">
<div class="inner animate" data-animate = "motion">
<div class="title">
<div data-splitting class="en">OX TAB</div>
<P>방향은 무시. 왼쪽, 오른쪽 어느쪽으로든!<br>쉽고 안전한 OX TAB</P>
</div>
<a href="#" class="more en">FIND OUT MORE</a>
</div>
<ul class="list">
<li class="animate" data-animate = "motion" ><a href="prodinteraction/prod-main.html">
<p class="img"><img src="img2/business1.jpg" alt=""></p>
<div class="txt">
<h3 class="en">MORE<br><span>CONVENIENT</span></h3>
<p>더욱 편리하게, 안보이는 곳에서도<br>꽂히는 OX TAB !</p>
<i class="icon"></i>
</div>
</a></li>
<li class="animate" data-animate = "motion"><a href="prodinteraction/prod-conn.html">
<p class="img"><img src="img2/business2 (1).jpg" alt=""></p>
<div class="txt">
<h3 class="en">MORE<br><span>FAST</span></h3>
<p>더욱 빠르게 꽂히는<br>OX TAB !</p>
<i class="icon"></i>
</div>
</a></li>
<li class="animate" data-animate = "motion"><a href="prodinteraction/prod-comp.html">
<p class="img"><img src="img2/business3.jpg" alt=""></p>
<div class="txt">
<h3 class="en">MORE<br><span> SAFE</span></h3>
<p>기존의 불안요소는 제거! <br>더 안전한 OX TAB !</p>
<i class="icon"></i>
</div>
</a></li>
</ul>
</div>
<div class="news">
<div class="inner animate" data-animate = "motion">
<div class="title">
<div data-splitting class="en">NEWS</div>
</div>
<a href="#" class="more en">FIND OUT MORE</a>
</div>
<p class="symbol animate" data-animate = "motion"><img src="img2/news2.png" alt=""></p>
<ul class="newsList">
<li><a href="https://www.ohmycompany.com/reward/9600" target="_blank">
<span class="category">공지 <br>사항</span>
<span class="subject">크라우드 펀딩 시작</span>
<span class="date en">2020.11.07</span>
<span class="desc">어디서든, 어떻게든 꽃히는 원스탭. OHMYCOMPANY 펀딩 142% 달성 성공</span>
</a></li>
<li><a href="#">
<span class="category">NEW<br>소식</span>
<span class="subject">노가다 ㅆㅇㅇㅇㅂ</span>
<span class="date en">2020.01.02</span>
<span class="desc">과제나할걸아렁ㄴ ㅓㄴㄹ어먼
이것은 뉴스쓰는란 앎널ㄴㅇ에베베베벱오커넥오커넥오커넥오커넥오커넥에베베베벱오커넥오커넥오커넥오커넥오커넥에베베베벱오커넥오커넥오커넥오커넥오커넥</span>
</a></li>
<li><a href="#">
<span class="category">NEW<br>소식</span>
<span class="subject">에베베베벱</span>
<span class="date en">2019.12.23</span>
<span class="desc">베베베베베베베베벱에베베베벱오커넥오커넥오커넥오커넥오커넥에베베베벱오커넥오커넥오커넥오커넥오커넥에베베베벱오커넥오커넥오커넥오커넥오커넥</span>
</a></li>
</ul>
</div>
<!--
<div class="career animate" data-animate = "motion">
<div class="inner animate" data-animate = "motion">
<div class="title">
<div data-splitting class="en">CAREER</div>
<P>열정과 실천의지를 가지고 있는<br>인재를 기다립니다.</P>
</div>
<a href="#" class="more en">FIND OUT MORE</a>
</div>
</div>
<div class="customers animate" data-animate = "motion">
<div class="inner animate" data-animate = "motion">
<div class="left">
<div class="title">
<div data-splitting class="en">CUSTOMERS</div>
<P>기대를 넘어선 품격을 경험해 보세요.</P>
</div>
<a href="#" class="more en">FIND OUT MORE</a>
</div>
<ul class="right">
<li><a href="#"><img src="img/icon1.png" alt="FAQ"></a></li>
<li><a href="#"><img src="img/icon2.png" alt="마감재"></a></li>
<li><a href="#"><img src="img/icon3.png" alt="관심단지등록"></a></li>
<li><a href="#"><img src="img/icon4.png" alt="1:1문의"></a></li>
</ul>
</div>
</div>
</section>
<!-- footer -->
<footer>
<ul>
<li>이용약관</li>
<li>개인정보</li>
<li>취급방침</li>
<li>이메일무단수집거부</li>
</ul>
<ul>
<li>울산과학기술원 울주학사 1층 UNISPARK</li>
<li>사업자등록번호:881-40-00725</li>
<li>대표자 방형준</li>
</ul>
<p>COPYRIGHT 2020 곽병혁,
<a href="mailto:duckracoon@gist.ac.kr">duckracoon@gist.ac.kr
</a>
(with 심규환,
<a href="mailto:skh7343@cnsh.hs.kr">skh7343@cnsh.hs.kr
</a>
)
</p>
</footer>
</div>
</body>
</html>