You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

581 lines
45 KiB

5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
  1. <!DOCTYPE html>
  2. <html lang="ko">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
  6. <title>국민염금 소식 - 국민연금 인스타 툰 상세</title>
  7. <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
  8. <link rel="stylesheet" href="..//assets/css/style.min.css?v=240805">
  9. <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  10. <script type="text/javascript" src="//developers.kakao.com/sdk/js/kakao.min.js"></script>
  11. <script src="..//assets/js/common.min.js"></script>
  12. </head>
  13. <body>
  14. <!--S: 숨김 메뉴-->
  15. <ul class="sr-only sr-only-focusable">
  16. <li><a href="#contents">컨텐츠 바로가기</a></li>
  17. <li><a href="#nav">메뉴 바로가기</a></li>
  18. </ul>
  19. <!--E: 숨김 메뉴-->
  20. <!--S: 헤더 영역-->
  21. <header id="header">
  22. <div class="container">
  23. <div class="logo-box">
  24. <a class="display-flex align-center justify-center" href="https://www.nps.or.kr" target="_blank">
  25. <svg id="logo" viewBox="0 0 309.14 49.01">
  26. <defs>
  27. <linearGradient id="linear-gradient" x1="-1641.66" y1="-1552.09" x2="-1727.37" y2="-1520.89" gradientTransform="translate(1211.44 1082.87) scale(.68)" gradientUnits="userSpaceOnUse">
  28. <stop offset="0" stop-color="#bfd72f"/>
  29. <stop offset=".1" stop-color="#aed331"/>
  30. <stop offset=".29" stop-color="#84ca38"/>
  31. <stop offset=".55" stop-color="#40bc42"/>
  32. <stop offset=".74" stop-color="#0ab14b"/>
  33. <stop offset="1" stop-color="#007f49"/>
  34. </linearGradient>
  35. <linearGradient id="linear-gradient-2" x1="-1697.8" y1="-1521.42" x2="-1783.38" y2="-1552.57" gradientTransform="translate(1211.44 1082.87) scale(.68)" gradientUnits="userSpaceOnUse">
  36. <stop offset="0" stop-color="#ffcb02"/>
  37. <stop offset=".09" stop-color="#fdc105"/>
  38. <stop offset=".49" stop-color="#f89a13"/>
  39. <stop offset=".8" stop-color="#f5811b"/>
  40. <stop offset="1" stop-color="#f4791f"/>
  41. </linearGradient>
  42. </defs>
  43. <g>
  44. <path d="M149.14.83h-23.48v3.09h20.8v7.32h-21.15v3.09h10.19v3.04h-10.19v3.1h21.15v6.88h5.13v-7.53c0-1.35-1.1-2.46-2.45-2.46h-8.51v-3.04h10.96V3.27c0-1.35-1.1-2.44-2.45-2.44Z" style="fill: #52565b; stroke-width: 0px;"/>
  45. <g>
  46. <rect x="177.3" y=".83" width="5.13" height="14.1" style="fill: #52565b; stroke-width: 0px;"/>
  47. <path d="M161.65,17.45h-5.13v7.45c0,1.35,1.09,2.45,2.44,2.45h23.47v-3.09h-20.79v-6.81Z" style="fill: #52565b; stroke-width: 0px;"/>
  48. <path d="M171.1,14.93c1.35,0,2.45-1.09,2.45-2.45V.83h-17.4v11.65c0,1.35,1.09,2.45,2.44,2.45h12.51ZM161.27,3.92h7.13v7.92h-7.13V3.92Z" style="fill: #52565b; stroke-width: 0px;"/>
  49. </g>
  50. <g>
  51. <path d="M218.12,17.39v7.51c0,1.36,1.1,2.45,2.45,2.45h21.03c1.35,0,2.44-1.09,2.44-2.45v-7.51h-25.92ZM238.91,24.26h-15.65v-3.77h15.65v3.77Z" style="fill: #52565b; stroke-width: 0px;"/>
  52. <path d="M241.6.83h-23.48v3.09h20.79v7.32h-21.16v3.09h26.29V3.27c0-1.35-1.09-2.44-2.44-2.44Z" style="fill: #52565b; stroke-width: 0px;"/>
  53. </g>
  54. <g>
  55. <path d="M208.41.83v2.44h-5.9c-1.65-1.98-4.34-3.27-7.4-3.27-5.01,0-9.07,3.46-9.07,7.74s4.06,7.73,9.07,7.73c3.09,0,5.82-1.33,7.46-3.34h5.84v2.81h5.13V.83h-5.13ZM195.11,12.26c-2.17,0-3.93-2.03-3.93-4.53s1.75-4.54,3.93-4.54,3.93,2.04,3.93,4.54-1.76,4.53-3.93,4.53ZM208.41,9.04h-4.37c.09-.43.14-.86.14-1.3,0-.47-.06-.93-.15-1.38h4.38v2.68Z" style="fill: #52565b; stroke-width: 0px;"/>
  56. <path d="M192.75,17.45h-5.14v7.45c0,1.35,1.1,2.45,2.45,2.45h23.48v-3.09h-20.79v-6.81Z" style="fill: #52565b; stroke-width: 0px;"/>
  57. </g>
  58. <g>
  59. <path d="M285.25,17.37h-5.13v7.55c0,1.35,1.09,2.45,2.45,2.45h23.47v-3.09h-20.79v-6.91Z" style="fill: #52565b; stroke-width: 0px;"/>
  60. <path d="M306.05,5.53V.83h-5.14v11.01h-16.03V3.92h11.12V.83h-16.27v11.65c0,1.35,1.1,2.45,2.45,2.45h23.86v-6.31h3.1v-3.09h-3.1Z" style="fill: #52565b; stroke-width: 0px;"/>
  61. </g>
  62. <g>
  63. <path d="M275.39,3.27c0-1.35-1.09-2.44-2.45-2.44h-23.48v3.09h20.79v7.32h-6.98v-3.69h-5.14v3.69h-9.04v3.09h26.29V3.27Z" style="fill: #52565b; stroke-width: 0px;"/>
  64. <path d="M262.21,16.37c-8.67,0-13.44,2.63-13.44,5.88s4.77,5.87,13.44,5.87,13.44-2.63,13.44-5.87-4.77-5.88-13.44-5.88ZM262.21,25.32c-4.23,0-7.66-1.38-7.66-3.07s3.43-3.09,7.66-3.09,7.67,1.38,7.67,3.09-3.43,3.07-7.67,3.07Z" style="fill: #52565b; stroke-width: 0px;"/>
  65. </g>
  66. </g>
  67. <g>
  68. <path d="M37.62,48.15c26.36.59,39.31-22.89,40.29-24.32.97-1.42,2.09-1.22,2.66-1.22h10.5s-14.93,30.54-53.45,25.92c-.32-.04-.36-.4,0-.38Z" style="fill: url(#linear-gradient); stroke-width: 0px;"/>
  69. <path d="M68.21,25.3c0,1.13-.92,2.05-2.05,2.05h-3.91V5.24c0-3.53,1.45-4.88,4.86-4.88h12.38c3.32,0,5.74.65,7.26,1.98,1.52,1.33,2.29,3.44,2.29,6.32v1.02c0,2.88-.76,4.74-2.29,6.07-1.52,1.33-3.94,1.99-7.26,2h-9.18s1.5-4.76,6.86-4.76h2.04c1.29,0,2.19-.27,2.82-.82.72-.62,1.06-1.95,1.06-3.21s-.38-2.3-1.14-2.91c-.77-.61-1.58-.92-3.22-.92h-.04s-7.45,0-7.45,0c-2.35,0-3.04,1.03-3.04,3.04v17.13Z" style="fill: #25237b; stroke-width: 0px;"/>
  70. <path d="M93.65,22.6c-1.13,0-2.05.92-2.05,2.05v2.7h15.76c3.28,0,5.69-.65,7.21-1.96,1.53-1.31,2.3-3.26,2.3-6.06s-.66-4.73-1.99-5.91c-1.32-1.18-3.55-1.77-6.69-1.77h-6.81c-1.2,0-2.37-.25-2.98-.74-.61-.49-1.24-1.29-1.24-2.22,0-1.23.35-2.13,1.06-2.7.71-.57,1.47-.87,2.99-.87h12.29c1.13,0,2.05-.92,2.05-2.05V.36h-14.82c-3.32,0-5.73.67-7.26,2-1.52,1.33-2.29,3.35-2.29,6.23,0,2.7.73,4.67,2.17,5.93,1.45,1.25,3.74,1.88,6.87,1.88h6.6c1.48,0,2.52.24,3.13.72.61.48.92,1.29.92,2.42s-.33,1.88-1,2.35c-.66.47-1.81.71-3.44.71h-12.81Z" style="fill: #25237b; stroke-width: 0px;"/>
  71. <path d="M54.96.36c-1.13,0-2.05.92-2.05,2.05v16.92L41.27,2.27c-.72-1.25-1.66-1.91-2.88-1.91h-6.18v26.98h3.91c1.13,0,2.05-.92,2.05-2.05V7.63h0s12.22,17.81,12.22,17.81c0,0,1.18,1.9,3.01,1.9h5.46V.36h-3.91Z" style="fill: #25237b; stroke-width: 0px;"/>
  72. <path d="M0,22.62h10.85c1.39,0,1.97.8,2.54,1.71,16.52,25.99,41.83,18.65,41.83,18.65.31-.09.4.17.11.28,0,0-11.33,5.26-24.56,2.68-13.22-2.57-24.34-12.17-30.77-23.32Z" style="fill: url(#linear-gradient-2); stroke-width: 0px;"/>
  73. </g>
  74. </svg>
  75. </a>
  76. <a href="https://www.nps.or.kr/jsppage/csa/csa.jsp" target="_blank" class="link">내연금 알아보기</a>
  77. </div>
  78. </div>
  79. </header>
  80. <!--E: 헤더 영역-->
  81. <header class="mobile-header">
  82. <button class="m-button toggle-menu" type="button" data-button="toggle-menu">메뉴 토글</button>
  83. <a href="/" class="mobile-logo">국민연금 ON AIR</a>
  84. <button class="m-button toggle-search" type="button" id="toggle-search">검색 메뉴 토글</button>
  85. </header>
  86. <aside id="mobile-left-menu">
  87. <header class="mobile-header">
  88. <span class="m-button"></span>
  89. <a href="/" class="mobile-logo">국민연금 ON AIR</a>
  90. <button class="m-button close-menu" type="button" data-button="toggle-menu">검색 메뉴 토글</button>
  91. </header>
  92. <nav class="mobile-nav">
  93. <ul>
  94. <li>
  95. <a href="" class="depth-1 active">국민연금 소식</a>
  96. <ul class="sub-menu open">
  97. <li><a href="..//news/news.html">새소식</a></li>
  98. <li><a href="">ESG</a></li>
  99. <li><a href="">이벤트</a></li>
  100. <li><a href="">대학생 홍보대사</a></li>
  101. <li><a href="..//toons/toons.html">국민연금 인스타툰</a></li>
  102. <li><a href="">국민연금 수기</a></li>
  103. </ul>
  104. </li>
  105. <li>
  106. <a href="" class="depth-1">국민연금 제도</a>
  107. <ul class="sub-menu">
  108. <li><a href="">제도 정보</a></li>
  109. <li><a href="">NPS 팩트체크</a></li>
  110. <li><a href="">연금 개혁</a></li>
  111. <li><a href="">국민연금 용어사전</a></li>
  112. <li><a href="">전문가 시선</a></li>
  113. </ul>
  114. </li>
  115. <li>
  116. <a href="" class="depth-1">국민연금 기금</a>
  117. <ul class="sub-menu">
  118. <li><a href="">기금운용 현황</a></li>
  119. <li><a href="">기금운용 이슈</a></li>
  120. <li><a href="">전문가 시선</a></li>
  121. </ul>
  122. </li>
  123. <li>
  124. <a href="" class="depth-1">영상갤러리</a>
  125. <ul class="sub-menu">
  126. <li><a href="..//clips/clips.html">동영상</a></li>
  127. <li><a href="..//shorts/shorts.html">Shorts</a></li>
  128. </ul>
  129. </li>
  130. </ul>
  131. <a href="#" target="_blank" class="btn-more">내 연금 알아보기</a>
  132. </nav>
  133. </aside>
  134. <script>
  135. const mainMenuLinks = document.querySelectorAll('.depth-1');
  136. mainMenuLinks.forEach(link => {
  137. link.addEventListener('click', function(event) {
  138. event.preventDefault(); // Prevent the default link behavior
  139. // Close all other sub-menus
  140. mainMenuLinks.forEach(otherLink => {
  141. if (otherLink !== link) {
  142. const otherSubMenu = otherLink.nextElementSibling;
  143. otherSubMenu.classList.remove('open');
  144. otherLink.classList.remove('active');
  145. }
  146. });
  147. // Toggle the clicked sub-menu
  148. const subMenu = this.nextElementSibling; // Get the next sibling element (the sub-menu)
  149. if (!subMenu.classList.contains('open')) {
  150. subMenu.classList.add('open');
  151. this.classList.add('active');
  152. } else {
  153. subMenu.classList.remove('open');
  154. this.classList.remove('active');
  155. }
  156. });
  157. });
  158. document.addEventListener('DOMContentLoaded', function() {
  159. const toggleButton = document.getElementById('toggle-search');
  160. const form = document.querySelector('.search-box');
  161. toggleButton.addEventListener('click', function() {
  162. form.classList.toggle('open');
  163. });
  164. });
  165. </script>
  166. <!--S: 컨텐츠 영역-->
  167. <section id="contents">
  168. <div class="container">
  169. <nav class="breadcrumb">
  170. <ol>
  171. <li><a href="../index.html"></a></li>
  172. <li><a href="../clips/clips.html">영상갤러리</a></li>
  173. <li><span>Shorts</span></li>
  174. </ol>
  175. </nav>
  176. </div>
  177. <div class="sub-main container" id="board">
  178. <aside class="left-nav">
  179. <div class="search-box">
  180. <a href="../index.html" class="link">국민연금 ON AIR</a>
  181. <form class="search-form">
  182. <input type="text" class="input"/>
  183. <button type="button" class="search-btn" title="검색"><span class="material-symbols-outlined icon">search</span></button>
  184. </form>
  185. </div>
  186. <ul class="menu-list">
  187. <li class="item ">
  188. <a href="../news/news.html" class="link">국민연금 소식</a>
  189. <ul class="submenu">
  190. <li class=""><a href="../news/news.html">새소식</a></li>
  191. <li><a href="#">ESG</a></li>
  192. <li><a href="#">이벤트</a></li>
  193. <li><a href="#">대학생 홍보대사</a></li>
  194. <li class=""><a href="../toons/toons.html">국민연금 인스타툰</a></li>
  195. </ul>
  196. </li>
  197. <li class="item">
  198. <a href="#" class="link">국민연금 제도</a>
  199. </li>
  200. <li class="item">
  201. <a href="#" class="link">국민연금 기금</a>
  202. </li>
  203. <li class="item last first active ">
  204. <a href="../clips/clips.html" class="link">영상갤러리</a>
  205. <ul class="submenu">
  206. <li class=""><a href="../clips/clips.html">동영상</a></li>
  207. <li class="active"><a href="../shorts/shorts.html">Shorts</a></li>
  208. </ul>
  209. </li>
  210. </ul>
  211. </aside>
  212. <main class="page-contents detail">
  213. <div class="contents-header">
  214. <header class="page-header">
  215. <h2 class="contents-title">국민연금, 내고 싶은 사람만 내면 안되나요?</h2>
  216. </header>
  217. <div class="page-header-info">
  218. <dl class="date">
  219. <dt class="sr-only">게시글 날짜</dt>
  220. <dd>24-08-02</dd>
  221. </dl>
  222. <div class="list-detail-sns">
  223. <a href="javascript:;" data-button="share-sns" data-type="facebook" data-url="http://www.naver.com" class="sns-facebook" data-title="[7월 달력이미지무료배포] 해변에서 휴양을 즐기는 국민연금공단" data-image="" target="_self">페이스북</a>
  224. <a href="javascript:;" data-button="share-sns" data-type="twitter" data-url="http://www.naver.com" class="sns-twitter" data-title="[7월 달력이미지무료배포] 해변에서 휴양을 즐기는 국민연금공단." data-image="" data-description="&nbsp;" target="_self">트위터</a>
  225. <a href="javascript:;" id="npsShKakaoTalk" data-button="share-sns" data-type="kakaotalk" data-url="http://www.naver.com" class="sns-kakaotalk" data-title="[7월 달력이미지무료배포] 해변에서 휴양을 즐기는 국민연금공단" data-image="" data-description="&nbsp;" target="_self">카카오톡</a>
  226. <a href="javascript:;" data-button="share-sns" data-type="url" data-url="http://www.naver.com" data-title="[7월 달력이미지무료배포] 해변에서 휴양을 즐기는 국민연금공단." class="url-copy" target="_self">URL 복사</a>
  227. </div>
  228. </div>
  229. </div>
  230. <div class="detail-contents">
  231. <div class="video-container shorts">
  232. <iframe src="https://youtube.com/shorts/BvvayvDQib0?si=UHd4PyISW0wMD9iO" loading="lazy" frameborder="no" scrolling="no" marginwidth="0" marginheight="0" width="544" height="306" allow="autoplay" allowfullscreen=""></iframe>
  233. </div>
  234. <p><br></p>
  235. <p class="0" style="margin-left: 23.2pt; text-indent: -23.2pt; text-align: center; word-break: keep-all; line-height: 1.8;"><span style="font-family: Tahoma; font-size: 14pt;"><br></span></p><p class="0" style="margin-left: 23.2pt; text-indent: -23.2pt; text-align: center; word-break: keep-all; line-height: 1.8;"><span lang="EN-US" style="font-weight: bold; font-size: 15pt;"></span><span style="font-family: Tahoma; font-size: 14pt;">지난&nbsp;</span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;">3</span><span style="font-family: Tahoma; font-size: 14pt;">&nbsp;</span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;">18</span><span style="font-family: Tahoma; font-size: 14pt;">일부터&nbsp;</span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;">5</span><span style="font-family: Tahoma; font-size: 14pt;">&nbsp;</span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;">6</span><span style="font-family: Tahoma; font-size: 14pt;">일까지&nbsp;</span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;">50</span><span style="font-family: Tahoma; font-size: 14pt;">일간 진행되었던</span></p><p class="0" style="margin-left: 23.2pt; text-indent: -23.2pt; text-align: center; word-break: keep-all; line-height: 1.8;"><span lang="EN-US" style="font-size: 14pt; font-family: Tahoma;"></span><span style="font-family: Tahoma; font-weight: bold; font-size: 14pt;">기초연금 제도&nbsp;</span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-weight: bold; font-size: 14pt;">10</span><span style="font-family: Tahoma; font-weight: bold; font-size: 14pt;">주년 기념&nbsp;</span><span style="font-family: Tahoma; letter-spacing: 0pt; font-weight: bold; font-size: 14pt;"></span><span style="font-family: Tahoma; font-weight: bold; font-size: 14pt;">국민참여 공모전</span><span style="font-family: Tahoma; letter-spacing: 0pt; font-weight: bold; font-size: 14pt;"></span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-weight: bold; font-size: 14pt;">!</span></p><p class="0" style="margin-left: 23.2pt; line-height: 1.8; text-indent: -23.2pt; text-align: center; word-break: keep-all; font-size: 15pt;"><span style="font-family: Tahoma; font-size: 14pt;"></span><span style="font-family: Tahoma; font-size: 14pt;">&nbsp;</span><span style="font-family: Tahoma; font-size: 14pt;"></span><o:p></o:p></p><p class="0" style="margin-left: 23.2pt; text-indent: -23.2pt; text-align: center; word-break: keep-all; line-height: 1.8;"><span style="font-family: Tahoma; font-size: 14pt;">전 세대가 쉽게 참여하실 수 있도록</span></p><p class="0" style="margin-left: 23.2pt; text-indent: -23.2pt; text-align: center; word-break: keep-all; line-height: 1.8;"><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;"></span><span style="font-family: Tahoma; font-size: 14pt;">나의 노후생활을 지켜주는 기초연금</span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;">’,</span></p><p class="0" style="margin-left: 23.2pt; text-indent: -23.2pt; text-align: center; word-break: keep-all; line-height: 1.8;"><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;"></span><span style="font-family: Tahoma; font-size: 14pt;">기초연금과 함께하는 나와 내 가족의 일상</span><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;">&nbsp;</span><span style="font-family: Tahoma; font-size: 14pt;"></span></p><p class="0" style="margin-left: 23.2pt; text-indent: -23.2pt; text-align: center; word-break: keep-all; line-height: 1.8;"><span lang="EN-US" style="font-family: Tahoma; letter-spacing: 0pt; font-size: 14pt;"></span><span style="font-family: Tahoma; font-weight: bold; font-size: 14pt;">기초연금과 관련된 모든 이야기</span><span lang=
  236. <!-- 단락 시작 -->
  237. <ul class="hash-tag">
  238. <li>국민연금</li>
  239. <li>국민연금공단</li>
  240. <li>사연툰</li>
  241. <li>일상툰</li>
  242. <li>연대리툰</li>
  243. </ul>
  244. </div>
  245. <div class="page-list">
  246. <h3 class="title">더 많은 [영상 갤러리] 보기</h3>
  247. <ul class="common-list shorts inner">
  248. <li class="item">
  249. <figure class="thumbnail">
  250. <a class="thumbnail-link" href="detail.html">
  251. <img class="thumbnail-img" src="../assets/images/ex/shorts-01.jpg" alt="">
  252. </a>
  253. </figure>
  254. <div class="item-content">
  255. <h4 class="item-title">
  256. <a href="detail.html">국민연금, 내고 싶은 사람만 내면 안되나요?</a>
  257. </h4>
  258. </div>
  259. </li>
  260. <li class="item">
  261. <figure class="thumbnail">
  262. <a class="thumbnail-link" href="detail.html">
  263. <img class="thumbnail-img" src="../assets/images/ex/shorts-02.jpg" alt="">
  264. </a>
  265. </figure>
  266. <div class="item-content">
  267. <h4 class="item-title">
  268. <a href="detail.html">국민연금은 도대체 왜?
  269. 국가에서 운영하는거죠?</a>
  270. </h4>
  271. </div>
  272. </li>
  273. <li class="item">
  274. <figure class="thumbnail">
  275. <a class="thumbnail-link" href="detail.html">
  276. <img class="thumbnail-img" src="../assets/images/ex/shorts-03.jpg" alt="">
  277. </a>
  278. </figure>
  279. <div class="item-content">
  280. <h4 class="item-title">
  281. <a href="detail.html">국민연금공단 쉽게
  282. 취업하는 꿀팁?! </a>
  283. </h4>
  284. </div>
  285. </li>
  286. <li class="item">
  287. <figure class="thumbnail">
  288. <a class="thumbnail-link" href="detail.html">
  289. <img class="thumbnail-img" src="../assets/images/ex/shorts-04.jpg" alt="">
  290. </a>
  291. </figure>
  292. <div class="item-content">
  293. <h4 class="item-title">
  294. <a href="detail.html">국민연금 3인방의
  295. 🏠 Home🏠 댄스챌린지</a>
  296. </h4>
  297. </div>
  298. </li>
  299. </ul>
  300. </div>
  301. <div class="form-content-wrap">
  302. <h5 class="form-title">콘텐츠 품질 향상을 위해<br> 이해도와 만족도 조사를 실시하고 있습니다.</h5>
  303. <!-- 폼 1 시작 -->
  304. <div class="form">
  305. <!-- 만족도 시작 -->
  306. <div class="form-content-box">
  307. <div class="form-box">
  308. <h6 class="question-title">현재 콘텐츠의 내용과 설명에 대해 만족하십니까?</h6>
  309. <div class="form-radio-box">
  310. <div class="radio-item"><input type="radio" id="radio01-01" name="radio01" value="5"><label for="radio01-01">매우만족</label></div>
  311. <div class="radio-item"><input type="radio" id="radio01-02" name="radio01" value="4"><label for="radio01-02">만족</label></div>
  312. <div class="radio-item"><input type="radio" id="radio01-03" name="radio01" value="3"><label for="radio01-03">보통</label></div>
  313. <div class="radio-item"><input type="radio" id="radio01-04" name="radio01" value="2"><label for="radio01-04">불만족</label></div>
  314. <div class="radio-item"><input type="radio" id="radio01-05" name="radio01" value="1"><label for="radio01-05">매우불만족</label></div>
  315. </div>
  316. </div>
  317. <div class="form-box">
  318. <h6 class="question-title">이 페이지에서 제공하는 콘텐츠가 얼마나 이해되십니까?</h6>
  319. <div class="form-radio-box">
  320. <div class="radio-item"><input type="radio" id="radio02-01" name="radio02" value="5"><label for="radio02-01">매우만족</label></div>
  321. <div class="radio-item"><input type="radio" id="radio02-02" name="radio02" value="4"><label for="radio02-02">만족</label></div>
  322. <div class="radio-item"><input type="radio" id="radio02-03" name="radio02" value="3"><label for="radio02-03">보통</label></div>
  323. <div class="radio-item"><input type="radio" id="radio02-04" name="radio02" value="2"><label for="radio02-04">불만족</label></div>
  324. <div class="radio-item"><input type="radio" id="radio02-05" name="radio02" value="1"><label for="radio02-05">매우불만족</label></div>
  325. </div>
  326. </div>
  327. </div>
  328. <button id="submit-survey" class="form-btn">확인</button>
  329. <!-- 만족도 끝 -->
  330. </div>
  331. <!-- 폼 1 끝 -->
  332. <!-- 폼 2 시작 -->
  333. <div class="form-02 cf">
  334. <!-- 만족도 시작 -->
  335. <div class="form-content-box cf" style="border:0; padding-bottom:0;">
  336. <div class="form-box">
  337. <h5 class="question-title">콘텐츠에 대한 자유로운 의견을 남겨주세요.</h5>
  338. <div class="form-radio-box other">
  339. <textarea placeholder="보내주신 의견은 검토하여 콘텐츠 제작에 반영할 예정입니다.(200자 이내) " name="strSurveyText" id="strSurveyText" onkeyup="fncChkByte(this,400)"></textarea>
  340. </div>
  341. <div class="textarea-num">
  342. <span id="byteInfo">0</span>
  343. / 400
  344. <span>byte</span>
  345. </div>
  346. </div>
  347. </div>
  348. <!-- 만족도 끝 -->
  349. <button id="submit-recommand" class="form-btn">확인</button>
  350. </div>
  351. <!-- 폼 2 끝 -->
  352. </div>
  353. <a href="shorts.html" class="btn-list-prev">목록으로</a>
  354. <ul class="sns-sub">
  355. <li>
  356. <a href="https://www.youtube.com/channel/UCqNLvq_8xZM0hhw-spFnLQg" class="sns_bg1" target="_blank" id="npsShYutube" title="유튜브">
  357. <svg viewBox="0 0 20 20">
  358. <path d="M16.1,4.8H3.9c-1.3,0-2.3,1-2.3,2.3v5.8c0,1.3,1,2.3,2.3,2.3h12.3c1.3,0,2.3-1,2.3-2.3V7.1C18.5,5.8,17.4,4.8,16.1,4.8z
  359. M13.1,10.2l-4.7,2.7c-0.1,0.1-0.3,0-0.3-0.2V7.3c0-0.1,0.2-0.2,0.3-0.2l4.7,2.7C13.2,9.9,13.2,10.1,13.1,10.2z"></path>
  360. </svg>
  361. </a>
  362. </li>
  363. <li>
  364. <a href="https://www.instagram.com/npstagram/" class="sns_bg2" target="_blank" id="npsShInstar" title="인스타그램">
  365. <svg viewBox="0 0 20 20">
  366. <path d="M13.4,2H6.6C4.1,2,2,4.1,2,6.6v6.8C2,15.9,4.1,18,6.6,18h6.8c2.6,0,4.6-2.1,4.6-4.6V6.6C18,4.1,15.9,2,13.4,2 M16.5,13.5
  367. c0,1.7-1.4,3.1-3.1,3.1H6.5c-1.7,0-3.1-1.4-3.1-3.1V6.6c0-1.7,1.4-3.1,3.1-3.1h6.9c1.7,0,3.1,1.4,3.1,3.1V13.5z"></path>
  368. <path d="M10,5.9c-2.3,0-4.2,1.9-4.2,4.2c0,2.3,1.9,4.2,4.2,4.2s4.2-1.9,4.2-4.2C14.2,7.7,12.3,5.9,10,5.9 M10,12.7
  369. c-1.5,0-2.7-1.2-2.7-2.7c0-1.5,1.2-2.7,2.7-2.7c1.5,0,2.7,1.2,2.7,2.7C12.7,11.5,11.5,12.7,10,12.7"></path>
  370. <path d="M14.3,4.8c-0.5,0-1,0.4-1,1c0,0.5,0.4,1,1,1c0.5,0,1-0.4,1-1C15.3,5.2,14.8,4.8,14.3,4.8"></path>
  371. </svg>
  372. </a>
  373. </li>
  374. <li>
  375. <a href="https://blog.naver.com/pro_nps" class="sns_bg3" target="_blank" id="npsShNaverBlog" title="네이버블로그">
  376. <svg viewBox="0 0 20 20">
  377. <path d="M15,8.5c-0.4,0-0.7,0.3-0.7,0.7c0,0.4,0.3,0.7,0.7,0.7c0.4,0,0.7-0.3,0.7-0.7C15.7,8.8,15.4,8.5,15,8.5z"></path>
  378. <path d="M11,8.5c-0.4,0-0.7,0.3-0.7,0.7c0,0.4,0.3,0.7,0.7,0.7c0.4,0,0.7-0.3,0.7-0.7C11.7,8.8,11.4,8.5,11,8.5z"></path>
  379. <path d="M5,8.5c-0.4,0-0.7,0.3-0.7,0.7c0,0.4,0.3,0.7,0.7,0.7c0.4,0,0.7-0.3,0.7-0.7C5.7,8.8,5.4,8.5,5,8.5z"></path>
  380. <path d="M15.8,2.8H4.2C2.7,2.8,1.5,4,1.5,5.5v6.4c0,1.5,1.2,2.7,2.7,2.7h4l1.4,2.2c0,0,0,0,0,0.1c0.1,0.1,0.2,0.2,0.4,0.2
  381. c0.2,0,0.3-0.1,0.4-0.2c0,0,0-0.1,0-0.1l1.4-2.2h4c1.5,0,2.7-1.2,2.7-2.7V5.5C18.5,4,17.3,2.8,15.8,2.8z M5.3,10.7
  382. c-0.6,0-0.9-0.4-0.9-0.4v0.3H3.3V6.3h1v1.7c0.4-0.4,0.9-0.4,0.9-0.4c1.4,0,1.5,1.6,1.5,1.6C6.7,10.7,5.3,10.7,5.3,10.7z M8.5,10.6
  383. h-1V8.1c0-0.9-0.5-0.9-0.5-0.9v-1c1.5,0,1.5,1.6,1.5,1.6V10.6z M11,10.7c-1.8,0-1.7-1.6-1.7-1.6c0-1.6,1.7-1.6,1.7-1.6
  384. c1.8,0,1.8,1.6,1.8,1.6C12.8,10.7,11,10.7,11,10.7z M16.7,10.6c0,1.6-1.5,1.6-1.5,1.6h-0.4v-0.9H15c0.7,0,0.7-0.8,0.7-0.8v-0.2
  385. c-0.3,0.4-0.9,0.4-0.9,0.4c-1.5,0-1.4-1.6-1.4-1.6c0-1.7,1.5-1.6,1.5-1.6c0.6,0,0.9,0.4,0.9,0.4V7.6h1V10.6z"></path>
  386. </svg>
  387. </a>
  388. </li>
  389. <li>
  390. <a href="https://post.naver.com/pro_nps" class="sns_bg4" target="_blank" id="npsShNaverCafe" title="네이버포스트">
  391. <svg viewBox="0 0 20 20">
  392. <polygon points="5.1,12.6 14.9,12.6 12.7,15.1 7.2,15.1 "></polygon>
  393. <polygon points="8.1,16 11.9,16 10.1,18.2 "></polygon>
  394. <path d="M5.1,1.8v9.9h9.9V1.8H5.1z M12,8.5h-1.4L9.5,6.8v1.6H8V4.9h1.5l1.3,1.9V4.9H12V8.5z"></path>
  395. </svg>
  396. </a>
  397. </li>
  398. <li>
  399. <a href="https://www.facebook.com/proNPS" class="sns_bg5" target="_blank" id="npsShFacebook" title="페이스북">
  400. <svg viewBox="0 0 20 20">
  401. <path d="M11.3,18.3v-7.6h2.5l0.4-2.9h-2.9V5.9c0-0.9,0.2-1.4,1.5-1.4l1.6,0V1.8c-0.3,0-1.2-0.1-2.3-0.1c-2.3,0-3.8,1.4-3.8,3.9v2.2
  402. H5.7v2.9h2.5v7.6H11.3z"></path>
  403. </svg>
  404. </a>
  405. </li>
  406. <li style="display: none;">
  407. <a href="https://content.v.daum.net/3194/home" class="sns_bg6" target="_blank" id="npsSh1boon" title="콘텐츠뷰">
  408. <svg viewBox="0 0 20 20">
  409. <path d="M6.8,0.7l2-0.4v17.1h-2V0.7z"></path>
  410. <polygon points="9.5,11.2 14.1,5.2 15.6,6.4 11.8,11.1 16.3,16.5 14.8,17.7 "></polygon>
  411. </svg>
  412. </a>
  413. </li>
  414. <li>
  415. <a href="http://pf.kakao.com/_Kqxoxfq" class="sns_bg7" target="_blank" id="npsShKakaoStroy" title="카카오톡채널">
  416. <svg viewBox="0 0 20 20">
  417. <path d="M10,2.8c-4,0-7.2,2.8-7.2,6.2c0,2.1,1.2,4,3.1,5.1c-0.1,0.5-0.5,2-0.7,2.8c0,0.2,0.2,0.3,0.3,0.2l2.7-2.1
  418. c0.6,0.1,1.2,0.2,1.8,0.2c4,0,7.2-2.8,7.2-6.2C17.2,5.6,14,2.8,10,2.8z"></path>
  419. </svg>
  420. </a>
  421. </li>
  422. <!-- <li>
  423. <a href="https://twitter.com/NPS_2010" class="sns_bg8" target="_blank" id="npsShtwiter" title="트위터">
  424. <svg viewBox="0 0 20 20">
  425. <path d="M7.4,15.8c5.4,0,8.3-4.5,8.3-8.3c0-0.1,0-0.3,0-0.4c0.6-0.4,1.1-0.9,1.5-1.5C16.6,5.8,16,6,15.5,6c0.6-0.4,1.1-0.9,1.3-1.6
  426. c-0.6,0.3-1.2,0.6-1.9,0.7c-0.5-0.6-1.3-0.9-2.1-0.9c-1.6,0-2.9,1.3-2.9,2.9c0,0.2,0,0.5,0.1,0.7c-2.4-0.1-4.6-1.3-6-3.1
  427. C3.6,5.2,3.5,5.7,3.5,6.2c0,1,0.5,1.9,1.3,2.4c-0.5,0-0.9-0.1-1.3-0.4c0,0,0,0,0,0c0,1.4,1,2.6,2.3,2.9c-0.2,0.1-0.5,0.1-0.8,0.1
  428. c-0.2,0-0.4,0-0.6-0.1c0.4,1.2,1.5,2,2.7,2c-1,0.8-2.3,1.3-3.6,1.3c-0.2,0-0.5,0-0.7,0C4.2,15.3,5.7,15.8,7.4,15.8"/>
  429. </svg>
  430. </a>
  431. </li> -->
  432. <li>
  433. <a href="https://tv.naver.com/npstv" class="sns_bg9" target="_blank" id="npsShNaverTv" title="네이버TV">
  434. <svg viewBox="0 0 20 20">
  435. <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="5.7296" y1="14.8178" x2="5.4671" y2="3.0398">
  436. <stop offset="0" style="stop-color:#fff"></stop>
  437. <stop offset="1" style="stop-color:#fff;stop-opacity:0"></stop>
  438. </linearGradient>
  439. <path class="sns_n_play_col1" d="M5.6,17.3L5.6,17.3c-1.1,0-2-0.9-2-2V4.6c0-1.1,0.9-2,2-2l0,0c1.1,0,2,0.9,2,2v10.7
  440. C7.6,16.4,6.7,17.3,5.6,17.3z"></path>
  441. <path d="M3.9,3.6L3.9,3.6c0.6-1,1.8-1.3,2.7-0.7l8.8,5.4c0.9,0.6,1.2,1.8,0.6,2.7l0,0.1c-0.6,0.9-1.8,1.2-2.7,0.6
  442. L4.6,6.3C3.6,5.8,3.4,4.6,3.9,3.6z"></path>
  443. <path d="M3.9,16.3L3.9,16.3c0.6,1,1.8,1.3,2.7,0.7l8.6-5.2c0.9-0.6,1.2-1.7,0.6-2.7l-0.1-0.1c-0.6-0.9-1.7-1.2-2.7-0.6
  444. l-8.6,5.2C3.6,14.2,3.4,15.4,3.9,16.3z"></path>
  445. </svg>
  446. </a>
  447. </li>
  448. <li>
  449. <a href="https://tv.kakao.com/channel/3135613/video" class="sns_bg10" target="_blank" id="npsShKakaoTv" title="카카오TV">
  450. <svg viewBox="0 0 20 20">
  451. <path d="M4.5,4.2v11.6c0,0.3,0.3,0.5,0.6,0.3l10.2-5.8c0.3-0.2,0.3-0.5,0-0.7L5.1,3.9C4.8,3.7,4.5,3.9,4.5,4.2z"></path>
  452. </svg>
  453. </a>
  454. </li>
  455. <li>
  456. <a href="http://www.npswebzine.kr/" class="sns_bg11" target="_blank" id="npswebzine" title="내곁에 국민연금 웹진">
  457. <svg viewBox="0 0 20 20">
  458. <path d="M4.98864 17.0909L1 4H3.11364L5.94318 14.0227H6.07955L8.875 4H11.0227L13.7841 13.9886H13.9205L16.75 4H18.8636L14.875 17.0909H12.8977L10.0341 7.03409H9.82955L6.96591 17.0909H4.98864Z"></path>
  459. </svg>
  460. </a>
  461. </li>
  462. </ul>
  463. <a href="#contents" class="move-top">
  464. <svg viewBox="0 0 20 20">
  465. <path d="M17.9,8.1l-7.3-7.3h7.1c0.2,0,0.3-0.1,0.3-0.3s-0.1-0.3-0.3-0.3H2.4c-0.2,0-0.3,0.1-0.3,0.3s0.1,0.3,0.3,0.3
  466. h7.1L2.1,8.1C2,8.2,2,8.4,2.1,8.6c0.1,0.1,0.3,0.1,0.4,0l7.1-7.1v18c0,0.2,0.1,0.3,0.3,0.3s0.3-0.1,0.3-0.3V1.4l7.1,7.1
  467. c0.1,0.1,0.1,0.1,0.2,0.1s0.2,0,0.2-0.1C18,8.5,18,8.3,17.9,8.1z"></path>
  468. </svg>
  469. </a>
  470. </main>
  471. </div>
  472. </section>
  473. <!--E: 컨텐츠 영역-->
  474. <!--S: 푸터 영역-->
  475. <footer id="footer">
  476. <div class="logo-box">
  477. <svg id="logo" viewBox="0 0 309.14 49.01" xml:space="preserve">
  478. <defs>
  479. <linearGradient id="linear-gradient" x1="-1641.66" y1="-1552.09" x2="-1727.37" y2="-1520.89" gradientTransform="translate(1211.44 1082.87) scale(.68)" gradientUnits="userSpaceOnUse">
  480. <stop offset="0" stop-color="#bfd72f"/>
  481. <stop offset=".1" stop-color="#aed331"/>
  482. <stop offset=".29" stop-color="#84ca38"/>
  483. <stop offset=".55" stop-color="#40bc42"/>
  484. <stop offset=".74" stop-color="#0ab14b"/>
  485. <stop offset="1" stop-color="#007f49"/>
  486. </linearGradient>
  487. <linearGradient id="linear-gradient-2" x1="-1697.8" y1="-1521.42" x2="-1783.38" y2="-1552.57" gradientTransform="translate(1211.44 1082.87) scale(.68)" gradientUnits="userSpaceOnUse">
  488. <stop offset="0" stop-color="#ffcb02"/>
  489. <stop offset=".09" stop-color="#fdc105"/>
  490. <stop offset=".49" stop-color="#f89a13"/>
  491. <stop offset=".8" stop-color="#f5811b"/>
  492. <stop offset="1" stop-color="#f4791f"/>
  493. </linearGradient>
  494. </defs>
  495. <g>
  496. <path d="M149.14.83h-23.48v3.09h20.8v7.32h-21.15v3.09h10.19v3.04h-10.19v3.1h21.15v6.88h5.13v-7.53c0-1.35-1.1-2.46-2.45-2.46h-8.51v-3.04h10.96V3.27c0-1.35-1.1-2.44-2.45-2.44Z" style="fill: #fff; stroke-width: 0px;"/>
  497. <g>
  498. <rect x="177.3" y=".83" width="5.13" height="14.1" style="fill: #fff; stroke-width: 0px;"/>
  499. <path d="M161.65,17.45h-5.13v7.45c0,1.35,1.09,2.45,2.44,2.45h23.47v-3.09h-20.79v-6.81Z" style="fill: #fff; stroke-width: 0px;"/>
  500. <path d="M171.1,14.93c1.35,0,2.45-1.09,2.45-2.45V.83h-17.4v11.65c0,1.35,1.09,2.45,2.44,2.45h12.51ZM161.27,3.92h7.13v7.92h-7.13V3.92Z" style="fill: #fff; stroke-width: 0px;"/>
  501. </g>
  502. <g>
  503. <path d="M218.12,17.39v7.51c0,1.36,1.1,2.45,2.45,2.45h21.03c1.35,0,2.44-1.09,2.44-2.45v-7.51h-25.92ZM238.91,24.26h-15.65v-3.77h15.65v3.77Z" style="fill: #fff; stroke-width: 0px;"/>
  504. <path d="M241.6.83h-23.48v3.09h20.79v7.32h-21.16v3.09h26.29V3.27c0-1.35-1.09-2.44-2.44-2.44Z" style="fill: #fff; stroke-width: 0px;"/>
  505. </g>
  506. <g>
  507. <path d="M208.41.83v2.44h-5.9c-1.65-1.98-4.34-3.27-7.4-3.27-5.01,0-9.07,3.46-9.07,7.74s4.06,7.73,9.07,7.73c3.09,0,5.82-1.33,7.46-3.34h5.84v2.81h5.13V.83h-5.13ZM195.11,12.26c-2.17,0-3.93-2.03-3.93-4.53s1.75-4.54,3.93-4.54,3.93,2.04,3.93,4.54-1.76,4.53-3.93,4.53ZM208.41,9.04h-4.37c.09-.43.14-.86.14-1.3,0-.47-.06-.93-.15-1.38h4.38v2.68Z" style="fill: #fff; stroke-width: 0px;"/>
  508. <path d="M192.75,17.45h-5.14v7.45c0,1.35,1.1,2.45,2.45,2.45h23.48v-3.09h-20.79v-6.81Z" style="fill: #fff; stroke-width: 0px;"/>
  509. </g>
  510. <g>
  511. <path d="M285.25,17.37h-5.13v7.55c0,1.35,1.09,2.45,2.45,2.45h23.47v-3.09h-20.79v-6.91Z" style="fill: #fff; stroke-width: 0px;"/>
  512. <path d="M306.05,5.53V.83h-5.14v11.01h-16.03V3.92h11.12V.83h-16.27v11.65c0,1.35,1.1,2.45,2.45,2.45h23.86v-6.31h3.1v-3.09h-3.1Z" style="fill: #fff; stroke-width: 0px;"/>
  513. </g>
  514. <g>
  515. <path d="M275.39,3.27c0-1.35-1.09-2.44-2.45-2.44h-23.48v3.09h20.79v7.32h-6.98v-3.69h-5.14v3.69h-9.04v3.09h26.29V3.27Z" style="fill: #fff; stroke-width: 0px;"/>
  516. <path d="M262.21,16.37c-8.67,0-13.44,2.63-13.44,5.88s4.77,5.87,13.44,5.87,13.44-2.63,13.44-5.87-4.77-5.88-13.44-5.88ZM262.21,25.32c-4.23,0-7.66-1.38-7.66-3.07s3.43-3.09,7.66-3.09,7.67,1.38,7.67,3.09-3.43,3.07-7.67,3.07Z" style="fill: #fff; stroke-width: 0px;"/>
  517. </g>
  518. </g>
  519. <g>
  520. <path d="M37.62,48.15c26.36.59,39.31-22.89,40.29-24.32.97-1.42,2.09-1.22,2.66-1.22h10.5s-14.93,30.54-53.45,25.92c-.32-.04-.36-.4,0-.38Z" style="fill: url(#linear-gradient); stroke-width: 0px;"/>
  521. <path d="M68.21,25.3c0,1.13-.92,2.05-2.05,2.05h-3.91V5.24c0-3.53,1.45-4.88,4.86-4.88h12.38c3.32,0,5.74.65,7.26,1.98,1.52,1.33,2.29,3.44,2.29,6.32v1.02c0,2.88-.76,4.74-2.29,6.07-1.52,1.33-3.94,1.99-7.26,2h-9.18s1.5-4.76,6.86-4.76h2.04c1.29,0,2.19-.27,2.82-.82.72-.62,1.06-1.95,1.06-3.21s-.38-2.3-1.14-2.91c-.77-.61-1.58-.92-3.22-.92h-.04s-7.45,0-7.45,0c-2.35,0-3.04,1.03-3.04,3.04v17.13Z" style="fill: #25237b; stroke-width: 0px;"/>
  522. <path d="M93.65,22.6c-1.13,0-2.05.92-2.05,2.05v2.7h15.76c3.28,0,5.69-.65,7.21-1.96,1.53-1.31,2.3-3.26,2.3-6.06s-.66-4.73-1.99-5.91c-1.32-1.18-3.55-1.77-6.69-1.77h-6.81c-1.2,0-2.37-.25-2.98-.74-.61-.49-1.24-1.29-1.24-2.22,0-1.23.35-2.13,1.06-2.7.71-.57,1.47-.87,2.99-.87h12.29c1.13,0,2.05-.92,2.05-2.05V.36h-14.82c-3.32,0-5.73.67-7.26,2-1.52,1.33-2.29,3.35-2.29,6.23,0,2.7.73,4.67,2.17,5.93,1.45,1.25,3.74,1.88,6.87,1.88h6.6c1.48,0,2.52.24,3.13.72.61.48.92,1.29.92,2.42s-.33,1.88-1,2.35c-.66.47-1.81.71-3.44.71h-12.81Z" style="fill: #25237b; stroke-width: 0px;"/>
  523. <path d="M54.96.36c-1.13,0-2.05.92-2.05,2.05v16.92L41.27,2.27c-.72-1.25-1.66-1.91-2.88-1.91h-6.18v26.98h3.91c1.13,0,2.05-.92,2.05-2.05V7.63h0s12.22,17.81,12.22,17.81c0,0,1.18,1.9,3.01,1.9h5.46V.36h-3.91Z" style="fill: #25237b; stroke-width: 0px;"/>
  524. <path d="M0,22.62h10.85c1.39,0,1.97.8,2.54,1.71,16.52,25.99,41.83,18.65,41.83,18.65.31-.09.4.17.11.28,0,0-11.33,5.26-24.56,2.68-13.22-2.57-24.34-12.17-30.77-23.32Z" style="fill: url(#linear-gradient-2); stroke-width: 0px;"/>
  525. </g>
  526. </svg>
  527. </div>
  528. <div class="footer-info">
  529. <dl>
  530. <dt>우편번호</dt>
  531. <dd>54870</dd>
  532. </dl>
  533. <dl>
  534. <dt class="sr-only">주소</dt>
  535. <dd>전북특별자치도 전주시 덕진구 기지로 180(만성동, 국민연금) <br>국민연금공단 I</dd>
  536. </dl>
  537. <dl>
  538. <dt>고객센터</dt>
  539. <dd>1355(유료)</dd>
  540. </dl>
  541. </div>
  542. <p class="copyright">Copyright© 2024 NPS All Rights Reserved.</p>
  543. </footer>
  544. <!--E: 푸터 영역-->
  545. </body>
  546. </html>