zenn
239f61c506
- ESG 푸터에서 위로 스크롤하면 문서 영역이 먼저 복귀하도록 처리 - 섹션 전환 중 문서 내부 스크롤을 막아 상단 잘림 방지 - 기술 역량 이미지의 상단 여백과 가용 높이를 본문 기준으로 정렬 - 이미지 진입 애니메이션을 고려해 텍스트 겹침과 화면 이탈 방지 - 기술 역량 프로젝트 순서·설명 및 개별 이미지 배치 설정 정리 - 기술 역량 데이터에 맞춰 검색용 정적 HTML 동기화 - 지도 검색용 도로명 주소와 층·호수 안내를 분리해 건물 위치 핀 표시 - 지도 기본 확대 수준을 16으로 설정하고 한국어 표시 적용 - 회사 소개·조직도와 개인정보 동의 거부 안내 문구 정리 검증: - JavaScript 구문 검사 및 git diff --check 통과 - ESG 세 문서의 푸터 복귀·내부 스크롤·키보드 이동 확인 - 기술 역량 29개 슬라이드의 데스크톱 이미지 정렬 및 모바일 이동 확인 - 본사·지사 지도 위치 핀, 상세 주소, 외부 지도 링크 확인
139 lines
6.1 KiB
HTML
139 lines
6.1 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ko" class="home-page">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<meta name="description" content="모비핀테크놀러지 기술 역량형 회사소개 홈페이지 시안" />
|
||
<title>MOBIPINTECH · Company Profile</title>
|
||
<link rel="preconnect" href="https://cdn.jsdelivr.net" />
|
||
<link rel="icon" href="assets/images/mobipin-logo.png" type="image/png" />
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable.css" />
|
||
<link rel="stylesheet" href="css/styles.css" />
|
||
</head>
|
||
<body class="home-body">
|
||
<header class="site-header" data-header>
|
||
<a class="brand" href="index.html" aria-label="모비핀테크놀러지 홈">
|
||
<img class="brand-logo" src="assets/images/mobipin-logo.png" alt="모비핀테크놀러지" width="4399" height="1069" />
|
||
</a>
|
||
<nav class="desktop-nav" aria-label="주요 메뉴">
|
||
<a href="about.html">회사소개</a>
|
||
<a href="capabilities.html">기술 역량</a>
|
||
<a href="esg.html">ESG</a>
|
||
<a href="contact.html">문의하기</a>
|
||
</nav>
|
||
<button class="nav-toggle" type="button" aria-label="메뉴 열기" data-menu-toggle>
|
||
<span></span><span></span><span></span>
|
||
</button>
|
||
</header>
|
||
|
||
<nav class="mobile-menu" aria-label="모바일 메뉴" data-mobile-menu>
|
||
<a href="about.html">회사소개</a>
|
||
<a href="capabilities.html">기술 역량</a>
|
||
<a href="esg.html">ESG</a>
|
||
<a href="contact.html">문의하기</a>
|
||
</nav>
|
||
|
||
<main>
|
||
<section class="home-hero" data-page-title="메인">
|
||
<div class="hero-media" aria-hidden="true"></div>
|
||
<div class="hero-grid">
|
||
<div class="hero-copy">
|
||
<p class="eyebrow">Automotive · Robotics · Solution · SI</p>
|
||
<h1>차량과 디바이스,<br />서비스가 만나는 지점을 설계합니다.</h1>
|
||
<p class="hero-lead">
|
||
모비핀테크놀러지는 지난 10년간 스마트 플랫폼과 AI 로봇 개발을 거쳐
|
||
자동차 전장, 솔루션, SI 영역까지 확장해 온 Total SW 개발 회사입니다.
|
||
</p>
|
||
<div class="hero-actions">
|
||
<a class="button button-primary" href="capabilities.html">기술 역량</a>
|
||
<a class="button button-ghost" href="contact.html">프로젝트 문의</a>
|
||
</div>
|
||
</div>
|
||
<!-- <aside class="hero-panel" aria-label="회사 주요 지표">
|
||
<div>
|
||
<strong>2015</strong>
|
||
<span>법인 설립</span>
|
||
</div>
|
||
<div>
|
||
<strong>40</strong>
|
||
<span>구성원 (2026.03 기준)</span>
|
||
</div>
|
||
<div>
|
||
<strong>2 Bases</strong>
|
||
<span>대구 본사 · 서울 사무소</span>
|
||
</div>
|
||
</aside> -->
|
||
</div>
|
||
<div class="hero-footer">
|
||
<span>Company Profile</span>
|
||
<span>Technical Capabilities</span>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section intro" id="company" data-page-title="회사 소개">
|
||
<div class="section-label">About</div>
|
||
<div class="intro-copy">
|
||
<h2>Network, Data, Human을 연결하는 Total SW 개발 회사입니다.</h2>
|
||
<p>
|
||
AUTOSAR 기반 자동차 전장 개발, AI 기반 관제 스마트 플랫폼, 로봇 SW 개발 및 AI 플랫폼,
|
||
웹·앱 SI 개발까지 다양한 R&D 및 협력 개발을 통해 양질의 기술 지원을 제공합니다.
|
||
</p>
|
||
</div>
|
||
<div class="proof-strip">
|
||
<article>
|
||
<span>Automotive</span>
|
||
<strong>AUTOSAR 기반 자동차 전장 개발</strong>
|
||
<p>BSW, ASW, SBCM, 텔레매틱스 BSP, 검증 자동화까지 차량 소프트웨어 개발 대응.</p>
|
||
</article>
|
||
<article>
|
||
<span>Robotics / Solution</span>
|
||
<strong>AI 로봇과 관제 플랫폼</strong>
|
||
<p>로봇 안내, AI 챗봇, IoT 관제, 데이터 분석 기반의 운영 플랫폼 구축.</p>
|
||
</article>
|
||
<article>
|
||
<span>SI</span>
|
||
<strong>웹·앱 서비스 개발</strong>
|
||
<p>업무 시스템, 관리자 콘솔, 모바일 앱, 서비스 UX까지 필요한 산출물을 통합 구현.</p>
|
||
</article>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="showcase-preview" aria-label="대표 기술 역량" data-page-title="기술 역량">
|
||
<a class="preview-card automotive" href="capabilities.html#automotive">
|
||
<span>Automotive Technical Capabilities</span>
|
||
<strong>전장 기술 역량</strong>
|
||
<p>AUTOSAR, SBCM, BSP, HMI, 테스트 자동화까지 차량 소프트웨어 사례를 확인합니다.</p>
|
||
</a>
|
||
<a class="preview-card robotics" href="capabilities.html#robotics">
|
||
<span>Robotics Technical Capabilities</span>
|
||
<strong>로봇 기술 역량</strong>
|
||
<p>안내 로봇, 큐레이팅 로봇, 로봇 서비스 연동, AI 플랫폼 사례를 확인합니다.</p>
|
||
</a>
|
||
<a class="preview-card solution" href="capabilities.html#solution">
|
||
<span>Solution Technical Capabilities</span>
|
||
<strong>솔루션 기술 역량</strong>
|
||
<p>AI·IoT, 관제, 데이터 분석, 운영 플랫폼 등 솔루션 구축 사례를 확인합니다.</p>
|
||
</a>
|
||
<a class="preview-card si" href="capabilities.html#si">
|
||
<span>SI Technical Capabilities</span>
|
||
<strong>SI 개발사례 보기</strong>
|
||
<p>웹, 앱, 관리자 콘솔, 업무 시스템 구축 사례를 확인합니다.</p>
|
||
</a>
|
||
</section>
|
||
</main>
|
||
|
||
<footer class="site-footer">
|
||
<div>
|
||
<strong>(주)모비핀테크놀러지</strong>
|
||
<span class="footer-copyright">Copyright 2015 – 2026 | Mobipin Technology | All Rights Reserved</span>
|
||
</div>
|
||
<nav class="footer-links" aria-label="사이트 정책">
|
||
<button type="button" data-site-modal="privacy"><strong>개인정보 처리방침</strong></button>
|
||
<button type="button" data-site-modal="sitemap">사이트맵</button>
|
||
</nav>
|
||
</footer>
|
||
|
||
<script src="js/main.js"></script>
|
||
</body>
|
||
</html>
|