-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
411 lines (409 loc) · 18.8 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
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
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>나이스페이먼츠</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/common.css">
<!-- //구글폰트 -->
<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=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Noto+Sans+KR:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">
<!-- 구글폰트// -->
<!-- 프리텐다드 -->
<link rel="stylesheet" as="style" crossorigin href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css" />
<!-- https://ionic.io/ionicons/v1 -->
<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/1.5.2/css/ionicons.min.css">
<link rel="stylesheet" href="css/font.css">
<link rel="stylesheet" href="css/header.css">
<link rel="stylesheet" href="css/title.css">
<link rel="stylesheet" href="css/company.css">
<link rel="stylesheet" href="css/business.css">
<link rel="stylesheet" href="css/service.css">
<link rel="stylesheet" href="css/notice.css">
<link rel="stylesheet" href="css/responsive.css">
<link rel="stylesheet" href="css/footer.css">
<!-- 자바스크립트 -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//스크롤
$(window).scroll(function(){
if($(window).scrollTop()){
$("header").addClass("scroll");
}else{
$("header").removeClass("scroll");
}
});
// 헤더
$("header .wrap > a").click(function(){
$("header").toggleClass("hamclick");
$(".menuslide").slideToggle();
return false;
});
//서비스 버튼 클릭
$("section#service .wrap ul li:first-child h3 a").addClass("navy");
$("section#service .wrap ul li h3 a").click(function(){
$(this).parents("li").children().show().addClass("addflex");
$(this).parents("li").siblings().children("ul").hide().removeClass("addflex");
$(this).addClass("navy");
$(this).parents("li").siblings().children("h3").children("a").removeClass("navy");
return false;
});
// 푸터
$("footer .wrap .family h3 a").click(function(){
$("footer .wrap .family .familylist").slideToggle();
return false;
});
//반응형 768 오픈
// 타이틀이미지 변경
if($(window).width()<=768){
$("#title video").hide();
$(".titleimg").removeClass("hide");
}
//반응형 1200 오픈
if($(window).width()<=1200){
//메뉴
$(".gnb").wrap("<div class='gnbwrap'></div>");
$(".gnbwrap").hide();
$(".menuslide .menuC ul li h3 a").click(function(){
$(this).parent().siblings(".gnbwrap").slideToggle();
$(this).parent("li").siblings().children(".gnbwrap").hide();
return false;
});
}
//리사이즈
//768기준
$(window).resize(function(){
if($(window).width()<=768){//768이하
$("#title video").hide();
$(".titleimg").removeClass("hide");
}
if($(window).width()>768){//768초과
$("#title video").show();
$(".titleimg").addClass("hide");
}
});
});
</script>
<!-- 슬릭 -->
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css"/>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.Bservice').slick({
infinite: false,
slidesToShow: 2.9,
slidesToScroll: 1,
autoplay: false,
responsive: [{
breakpoint: 768,
settings: {
slidesToShow: 2,
slidesToScroll: 2,
infinite: false,
dots: false
}
}]
});
$('.titleimg').slick({
infinite: true,
slidesToShow: 1,
slidesToScroll: 1,
autoplay: true
});
});
</script>
</head>
<body>
<!-- 헤더 -->
<header>
<div class="wrap flex">
<h1>나이스페이먼츠</h1>
<ul class="lang">
<li><a href="">KOR</a></li>
<li><a href="">ENG</a></li>
</ul>
<a href="" class="menu">
<span></span>
<span></span>
<span></span>
</a>
<div class="menuslide">
<div class="wrap menuC">
<ul class="menuwrap">
<li>
<h3><a href="">회사소개</a></h3>
<ul class="gnb">
<li><a href="">대표이사 인사말</a></li>
<li><a href="">회사개요</a></li>
<li><a href="">NICE 가치체계</a></li>
<li><a href="">연혁</a></li>
<li><a href="">인재채용</a></li>
<li><a href="">오시는 길</a></li>
</ul>
</li>
<li>
<h3><a href="">사업영역</a></h3>
<ul class="gnb">
<li><a href="">전자결제 사업</a></li>
<li><a href="">전자금융관련 사업</a></li>
<li><a href="">VAN 사업</a></li>
<li><a href="">Cross Border 결제사업</a></li>
</ul>
</li>
<li>
<h3><a href="">서비스</a></h3>
<ul class="gnb">
<li><a href="">PG 서비스</a></li>
<li><a href="">VAN 서비스</a></li>
<li><a href="">For Startups</a></li>
</ul>
</li>
<li>
<h3><a href="">제품</a></h3>
<ul class="gnb">
<li><a href="">유선단말기</a></li>
<li><a href="">무선단말기</a></li>
<li><a href="">POS</a></li>
<li><a href="">Tablet Order</a></li>
<li><a href="">KIOSK</a></li>
<li><a href="">멀티패드</a></li>
<li><a href="">서명패드</a></li>
<li><a href="">IC리더기</a></li>
<li><a href="">RF리더기</a></li>
</ul>
</li>
<li>
<h3><a href="">고객지원</a></h3>
<ul class="gnb">
<li><a href="">공지사항</a></li>
<li><a href="">사업제휴</a></li>
</ul>
</li>
<li>
<h3><a href="">입찰정보</a></h3>
<ul class="gnb">
<li><a href="">입찰정보</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</header>
<!-- 타이틀 -->
<div id="title">
<video src="img/titleV.mp4" muted="" loop="" playsinline="" class="video" id="video" autoplay="" allowfullscreen></video>
<div class="titleimg hide">
<img src="img/mtitle1.jpg" alt="타이틀이미지1">
<img src="img/mtitle2.jpg" alt="타이틀이미지2">
</div>
<div class="wrap">
<H2>NICE <span>PAYMENTS</span></H2>
<p>멈추지 않는 통합결제서비스 고객의 성공과 함께합니다.</p>
</div>
</div>
<main>
<!-- 컴퍼니 -->
<section id="company">
<div class="wrap">
<H2 class="cat">COMPANY</H2>
<p class="ph"> 지난 30년간 국내 유일 , 글로벌 유일의<br>
종합 금융인프라 그룹으로 성장한 NICE GROUP의 계열사입니다. </p>
<p class="p">끊임없는 도전정신, 혁신정신, 고도의 전문성을 바탕으로 기술, 통신, 금융을<br>융합한 선도적인 지급 결제 서비스로 시장을 주도해 나갈 것입니다. </p>
<ul>
<li><a href="">NICE가치체계</a></li>
<li><a href="">인재채용</a></li>
<li><a href="">VIEW MORE</a></li>
</ul>
</div>
</section>
<!-- 비지니스 -->
<section id="business">
<div class="wrap">
<span>
<h2 class="cat">BUSINESS</h2>
<p class="ph"> 다양하고 안전한<br>
결제서비스를 제공합니다. </p>
<p class="p">국내 지급결제시장을 선도하는 기업<br>
나이스페이먼츠(주) </p>
</span>
<ul class="Bservice">
<li>
<a href="">
<h4>전자결제 사업</h4>
<p>고객의 다향한 요구에<br>부합하는 통합 Payment<br>Gateway 서비스</p>
</a>
</li>
<li>
<a href="">
<h4>전자금융관련 사업</h4>
<p>CMS(Cash<br>Management Service)<br>대금수납 자동화 서비스</p>
</a>
</li>
<li>
<a href="">
<h4>CP</h4>
<p>국내 및 해외 간편결제<br>시스템네트워크 제공으로<br>보다 편리하고 안전한<br>금융서비스 제공!</p>
</a>
</li>
<li>
<a href="">
<h4>VAN</h4>
<p>국/내외 신용카드부터<br>간편결제, 현금영수증,<br>포인트까지!</p>
</a>
</li>
</ul>
</section>
<!-- 서비스 -->
<section id="service">
<div class="wrap">
<h2 class="cat">SERVICE</h2>
<p class="ph"> 선도적인 지급 결제 서비스를 제공합니다.</p>
<ul>
<li>
<h3><a href="">PG<br>서비스</a></h3>
<ul class="pg">
<li>
<a href="">
<h4>NICE PAY</h4>
<p>view more</p>
</a>
</li>
<li>
<a href="">
<h4>For Startups</h4>
<p>view more</p>
</a>
</li>
<li>
<a href="">
<h4>payat</h4>
<p>view more</p>
</a>
</li>
<li>
<a href="">
<h4>THEBILL</h4>
<p>view more</p>
</a>
</li>
</ul>
</li>
<li>
<h3><a href="">VAN<br>서비스</a></h3>
<ul class="van">
<li>
<a href="">
<h4>NMIS</h4>
<p>view more</p>
</a>
</li>
<li>
<a href="">
<h4>NVIS</h4>
<p>view more</p>
</a>
</li>
<li>
<a href="">
<h4>NGIS</h4>
<p>view more</p>
</a>
</li>
<li>
<a href="">
<h4>부가세신고</h4>
<p>view more</p>
</a>
</li>
</ul>
</li>
</ul>
</div>
</section>
<!-- 공지사항 -->
<section id="notice">
<div class="wrap">
<h2 class="ph">NOTICE</h2>
<ul>
<li>
<a href="">
<h4>Apple Pay 서비스 안내</h4>
<date>2023.03.29</date>
</a>
</li>
<li>
<a href="">
<h4>2022년도 제7기 NICE페이먼츠㈜ 결산 공고</h4>
<date>2023.03.27</date>
</a>
</li>
<li>
<a href="">
<h4>개인정보보호 변경 공지문</h4>
<date>2023.02.23</date>
</a>
</li>
<li>
<a href="">
<h4>홈페이지가 새롭게 오픈했습니다.</h4>
<date>2023.02.23</date>
</a>
</li>
</ul>
</div>
</section>
</main>
<!-- 푸터 -->
<footer>
<div class="wrap">
<h2>나이스페이먼츠</h2>
<ul class="peasonal">
<li><a href="">이메일무단수집거부</a></li>
<li><a href="">이용약관</a></li>
</ul>
<address>주소 : 서울특별시 마포구 마포대로217 크레디트센터빌딩 7층 NICE페이먼츠(주)<br>TEL 1661-0808, 1661-7335 </address>
<p>Copyright ⓒ 2022. NICEPAYMENTS. All rights reserved.</p>
<ul class="sns">
<h3 class="hide">SNS</h3>
<li><a href="">블로그</a></li>
<li><a href="">페이스북</a></li>
<li><a href="">인스타그램</a></li>
<li><a href="">트위터</a></li>
</ul>
<div class="family">
<h3><a href="" class="select">Family Site</a></h3>
<div class="familylist">
<ul>
<li><a class="link" href="http://www.niceinfo.co.kr/main.nice">NICE평가정보(주)</a></li>
<li>
</li>
<li><a class="link" href="https://www.nicerating.com/main.do">NICE신용평가</a></li>
<li><a class="link" href="https://www.nicednb.com/index_new.do">NICE D&B</a></li>
<li><a class="link" href="http://www.nicepni.co.kr/main">NICE피앤아이</a></li>
<li><a class="link" href="http://www.nicevan.co.kr">NICE에프앤아이</a></li>
<li><a class="link" href="http://www.nicezinidata.com">NICE지니데이타</a></li>
<li><a class="link" href="https://www.nicetcm.co.kr">한국전자금융</a></li>
<li><a class="link" href="http://www.nicevan.co.kr">NICE정보통신</a></li>
<li><a class="link" href="https://www.kisvan.co.kr">KIS정보통신</a></li>
<li><a class="link" href="https://www.nicednr.co.kr/ko/index.do">NICE디앤알</a></li>
<li><a class="link" href="https://www.nicecms.co.kr/front/main.act">NICE씨엠에스</a></li>
<li><a class="link" href="https://www.okpos.co.kr">오케이포스</a></li>
<li><a class="link" href="http://www.seoulset.co.kr">서울전자통신</a></li>
<li><a class="link" href="http://it-m.co.kr/home/main.php">아이티엠반도체</a></li>
<li><a class="link" href="https://zinitix.com">지니틱스</a></li>
<li><a class="link" href="http://www.nicelms.com">LMS</a></li>
<li><a class="link" href="http://www.doctorstech.com">닥터스텍</a></li>
<li><a class="link" href="https://www.birdview.kr">버드뷰</a></li>
<li><a class="link" href="https://www.niceabc.co.kr">NICE비즈니스플랫폼</a></li>
<li><a class="link" href="http://www.realhub.co.kr">리얼허브</a></li>
<li><a class="link" href="https://www.posbanksolutions.co.kr">포스뱅크솔루션즈</a></li>
</ul>
</div>
</div>
</div>
</footer>