문의 영역 개편과 공유 미리보기 및 포트폴리오 표시 개선

- 메인 문의 영역을 이메일 주소와 복사 버튼으로 구성하고 복사 결과 안내를 추가
- 문의 폼 페이지를 별도로 보존하고 입력 검증, 파일 첨부 및 완료 안내 동작을 추가
- 제거된 문의 요소를 참조하던 공통 스크립트를 정리해 초기화 오류 방지
- 이메일 복사 버튼의 특수 문자 화살표를 공통 SVG로 통일
- 공유 시 특허증 대신 트론트 로고를 사용하도록 공유 메타 정보 지정
- 공통 스크립트와 포트폴리오 CSS에 버전 URL을 적용해 이전 CDN 캐시 우회
- 프로젝트 및 특허 영역의 자료 기준 안내와 소개서 보기 링크 제거
- 프로젝트 상세 페이지 8개의 상단 썸네일 화살표를 제거하고 마우스 반응 효과 유지
- 특허증 이미지 파일을 갱신하고 문의 구조와 동작 설명을 README에 반영

검증: 공통·이메일·문의 폼 JavaScript 문법 검사 및 변경 공백 검사 통과
확인: 버전이 붙은 운영 사이트 JS와 CSS가 로컬 파일과 동일함
참고: 문의 폼은 서버 전송 없이 화면 동작만 제공하며 이메일 주소는 임시 값 유지

README.md

@@ -12,9 +12,19 @@ python3 -m http.server 8000 --bind 127.0.0.1
 
 이후 `http://127.0.0.1:8000`에 접속합니다.
 
+## 문의 영역
+
+- `index.html#contact`: 이메일 주소와 복사 버튼을 제공하는 문의 영역입니다. 스타일은 `contact-email.css`, 복사 및 결과 안내는 `contact-email.js`에 있습니다.
+- `index-form.html#contact`: 기존 문의 폼형을 그대로 보존한 페이지입니다. 이름·회사명·이메일·연락처·문의내용·파일첨부를 받으며, 필수 입력 확인, 글자 수 표시, 첨부파일 선택·삭제·드래그와 전송 완료 안내 모달을 지원합니다. 모달은 확인 버튼·닫기 버튼·Esc·바깥 영역 클릭으로 닫습니다.
+- 문의 스타일은 `contact-form.css`, 폼 동작은 `contact-form.js`에 있습니다.
+- 현재는 전송 완료 화면까지만 구현되어 있으며 입력 내용과 파일을 전송하거나 저장하지 않습니다. 실제 접수에는 서버 연동이 필요합니다. 첨부는 최대 5개, 합계 20MB까지 선택할 수 있습니다.
+
+메인 페이지의 ‘프로젝트 문의’ 버튼은 이메일 문의 영역으로 이동합니다.
+
 ## 파일
 
-- `index.html`: 회사 소개, 사업 영역, 프로젝트 8개, 연혁, 문의 정보
+- `index.html`: 회사 소개, 사업 영역, 프로젝트 8개, 연혁, 이메일 문의
+- `index-form.html`: 기존 문의 폼을 포함한 회사 홈페이지
 - `styles.css`: 색상, 타이포그래피, 반응형 레이아웃 및 모션
 - `company.css`: 회사 개요·대표이사·조직도를 통합한 패널과 특허 영역. 기존 사업영역의 스타일과 동작은 유지합니다.
 - `script.js`: Canvas 입체 그래픽, 프로젝트 필터, 연혁 탭, 메뉴, 스크롤 효과
@@ -27,17 +37,6 @@ python3 -m http.server 8000 --bind 127.0.0.1
 - `assets/images/archive/`: 현재 화면에서 사용하지 않는 합본 이미지와 이전 버전. 원본 보관용이며 갤러리에 연결하지 않습니다.
 - `docs/`: 원본 회사소개서, 소개서 다운로드 링크의 대상
 
-## 연락처 교체
-
-사용자 요청에 따라 아래 연락처는 **임시 정보**입니다. 실제 인물에게 연결되지 않도록 예약된 `.example` 이메일을 사용했습니다.
-
-- 이메일: `hello@tront.example`
-- 전화번호: `053-000-0000`
-
-`script.js` 상단 `CONTACT`의 `email`, `phone`을 실제 정보로 바꾸고 `temporary`를 `false`로 변경합니다. JavaScript 비활성 환경에서도 같은 정보를 표시하도록 `index.html`의 이메일, 전화번호, `mailto:`, `tel:`도 함께 수정합니다. 실제 정보로 교체한 뒤 `.contact-placeholder`의 임시 연락처 문구를 삭제할 수 있습니다.
-
-문의 버튼은 메일 앱을 엽니다. 이메일 주소 복사는 보안 환경(HTTPS 또는 localhost)에서 작동하며, 사용할 수 없으면 주소를 선택해 수동 복사를 안내합니다. 서버가 없는 정적 사이트이므로 문의 접수나 이메일 발송을 수행하지 않습니다.
-
 ## 콘텐츠 기준
 
 - 설립일: 2008년 12월 1일
@@ -91,4 +90,4 @@ python3 -m http.server 8000 --bind 127.0.0.1
 - Canvas는 화면 밖이나 다른 탭에서 렌더링을 중지합니다.
 - 본문 바로가기, 포커스 표시, 이미지 대체 텍스트, 의미 있는 HTML 구조
 
-외부 CDN이나 폰트 라이브러리를 사용하지 않아 다운로드한 파일만으로 홈페이지 화면을 확인할 수 있습니다. 지도 모달은 외부 지도 서비스를 불러오며 이메일/전화 링크는 기기 앱으로 연결됩니다.
+외부 CDN이나 폰트 라이브러리를 사용하지 않아 다운로드한 파일만으로 홈페이지 화면을 확인할 수 있습니다. 지도 모달은 외부 지도 서비스를 불러옵니다.