Compare commits
10
Commits
dbf5dc3611
..
main
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
e2e70c13ac | ||
|
|
e2a6168744 | ||
|
|
bed970a175 | ||
|
|
7c09c89da5 | ||
|
|
0d9b1fd703 | ||
|
|
319a8afaab | ||
|
|
beaa2fc423 | ||
|
|
2b37bed2b8 | ||
|
|
308c06516c | ||
|
|
c62630e22d |
No files matched your search
@@ -17,11 +17,12 @@ jobs:
|
||||
SESSION_SECRET: ${{ secrets.PROD_SESSION_SECRET }}
|
||||
ABC_API_KEY: ${{ secrets.PROD_ABC_API_KEY }}
|
||||
AUTH_CLIENT_ID: ${{ vars.PROD_AUTH_CLIENT_ID }}
|
||||
AUTH_ISSUER: ${{ vars.PROD_AUTH_ISSUER }}
|
||||
ABC_API_BASE_URL: ${{ vars.PROD_ABC_API_BASE_URL }}
|
||||
ABC_PROJECT_ID: ${{ vars.PROD_ABC_PROJECT_ID }}
|
||||
ABC_CHANNEL_ID: ${{ vars.PROD_ABC_CHANNEL_ID }}
|
||||
ORG_CONTEXT_ENABLED: ${{ vars.PROD_ORG_CONTEXT_ENABLED }}
|
||||
ORG_CONTEXT_API_URL: ${{ vars.PROD_ORG_CONTEXT_API_URL }}
|
||||
ORG_CONTEXT_API_URL: ${{ vars.PROD_ORG_CONTEXT_API_URL || 'https://app.brsw.kr/api/v1/integrations/org-context' }}
|
||||
ORG_CONTEXT_SCOPE_MODE: ${{ vars.PROD_ORG_CONTEXT_SCOPE_MODE }}
|
||||
ORG_CONTEXT_EXPOSURE: ${{ vars.PROD_ORG_CONTEXT_EXPOSURE }}
|
||||
ORG_CONTEXT_TENANT_IDS: ${{ vars.PROD_ORG_CONTEXT_TENANT_IDS }}
|
||||
@@ -57,6 +58,9 @@ jobs:
|
||||
- name: Verify production organization API
|
||||
run: npm run org:verify
|
||||
|
||||
- name: Verify production ABC project and channel access
|
||||
run: npm run abc:verify
|
||||
|
||||
- name: Build production Worker without deploying
|
||||
run: npm run deploy:production -- --dry-run
|
||||
|
||||
|
||||
+20
-14
@@ -10,17 +10,22 @@ jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-latest
|
||||
env:
|
||||
CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
|
||||
SESSION_SECRET: ${{ secrets.SESSION_SECRET }}
|
||||
ABC_API_KEY: ${{ secrets.ABC_API_KEY }}
|
||||
ORG_CONTEXT_ENABLED: ${{ vars.STAGING_ORG_CONTEXT_ENABLED }}
|
||||
ORG_CONTEXT_API_URL: ${{ vars.STAGING_ORG_CONTEXT_API_URL }}
|
||||
ORG_CONTEXT_SCOPE_MODE: ${{ vars.STAGING_ORG_CONTEXT_SCOPE_MODE }}
|
||||
ORG_CONTEXT_EXPOSURE: ${{ vars.STAGING_ORG_CONTEXT_EXPOSURE }}
|
||||
ORG_CONTEXT_TENANT_IDS: ${{ vars.STAGING_ORG_CONTEXT_TENANT_IDS }}
|
||||
ORG_CONTEXT_CACHE_TTL_SECONDS: ${{ vars.STAGING_ORG_CONTEXT_CACHE_TTL_SECONDS }}
|
||||
ORG_CONTEXT_KEY_ID: ${{ secrets.STAGING_ORG_CONTEXT_KEY_ID }}
|
||||
ORG_CONTEXT_KEY_SECRET: ${{ secrets.STAGING_ORG_CONTEXT_KEY_SECRET }}
|
||||
CLOUDFLARE_API_TOKEN: ${{ secrets.STG_CLOUDFLARE_API_TOKEN }}
|
||||
SESSION_SECRET: ${{ secrets.STG_SESSION_SECRET }}
|
||||
ABC_API_KEY: ${{ secrets.STG_ABC_API_KEY }}
|
||||
AUTH_CLIENT_ID: ${{ vars.STG_AUTH_CLIENT_ID }}
|
||||
AUTH_ISSUER: ${{ vars.STG_AUTH_ISSUER }}
|
||||
ABC_API_BASE_URL: ${{ vars.STG_ABC_API_BASE_URL }}
|
||||
ABC_PROJECT_ID: ${{ vars.STG_ABC_PROJECT_ID }}
|
||||
ABC_CHANNEL_ID: ${{ vars.STG_ABC_CHANNEL_ID }}
|
||||
ORG_CONTEXT_ENABLED: ${{ vars.STG_ORG_CONTEXT_ENABLED }}
|
||||
ORG_CONTEXT_API_URL: ${{ vars.STG_ORG_CONTEXT_API_URL }}
|
||||
ORG_CONTEXT_SCOPE_MODE: ${{ vars.STG_ORG_CONTEXT_SCOPE_MODE }}
|
||||
ORG_CONTEXT_EXPOSURE: ${{ vars.STG_ORG_CONTEXT_EXPOSURE }}
|
||||
ORG_CONTEXT_TENANT_IDS: ${{ vars.STG_ORG_CONTEXT_TENANT_IDS }}
|
||||
ORG_CONTEXT_CACHE_TTL_SECONDS: ${{ vars.STG_ORG_CONTEXT_CACHE_TTL_SECONDS }}
|
||||
ORG_CONTEXT_KEY_ID: ${{ secrets.STG_ORG_CONTEXT_KEY_ID }}
|
||||
ORG_CONTEXT_KEY_SECRET: ${{ secrets.STG_ORG_CONTEXT_KEY_SECRET }}
|
||||
|
||||
steps:
|
||||
- name: Checkout
|
||||
@@ -35,9 +40,10 @@ jobs:
|
||||
shell: bash
|
||||
run: |
|
||||
set -euo pipefail
|
||||
test -n "$CLOUDFLARE_API_TOKEN" || { echo "CLOUDFLARE_API_TOKEN is missing"; exit 1; }
|
||||
test -n "$SESSION_SECRET" || { echo "SESSION_SECRET is missing"; exit 1; }
|
||||
test -n "$ABC_API_KEY" || { echo "ABC_API_KEY is missing"; exit 1; }
|
||||
test -n "$CLOUDFLARE_API_TOKEN" || { echo "STG_CLOUDFLARE_API_TOKEN is missing"; exit 1; }
|
||||
test -n "$SESSION_SECRET" || { echo "STG_SESSION_SECRET is missing"; exit 1; }
|
||||
test -n "$ABC_API_KEY" || { echo "STG_ABC_API_KEY is missing"; exit 1; }
|
||||
node scripts/deploy-worker.mjs --validate-only
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm ci --no-fund --no-audit
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
# EG-BIM Q&A static pages
|
||||
|
||||
`egbim/` 아래의 `index.html`, `write.html`, `detail.html` 세 페이지로 구성한 EG-BIM Q&A UI입니다. 원본 `egbim_homepage`의 Q&A 화면 구성과 패키지 S/W 메뉴 방향을 참고해, PHP/그누보드/DB 의존성 없이 정적 호스팅에서 동작하도록 분리했습니다.
|
||||
`egbim/index.html`의 목록 위에 작성·상세 모달을 여는 EG-BIM Q&A UI입니다. `SW문의_소스패키지`의 히어로·제품 탭·목록·모달 디자인을 적용하고, 기존 첨부·댓글·비밀글·작성자 권한·검색을 유지합니다. 회사 홈페이지의 헤더·메뉴·푸터는 포함하지 않습니다. 기존 `write.html`, `detail.html?id=...` 주소는 같은 목록의 모달로 연결됩니다. 상단 오른쪽 사람 아이콘의 계정 메뉴에서 로그인 사용자 이름을 확인하고 로그아웃할 수 있습니다.
|
||||
|
||||
EG-BIM 탭만 가운데 표시하며 TOVA·GAIA는 오픈 전까지 숨깁니다. 원격지원은 `https://939.co.kr/saman/`으로 열립니다. UI 적용 범위·검증·남은 배포 확인은 [작업 목록](docs/qa-inquiry-ui-redesign-tasks.md)에 정리했습니다.
|
||||
|
||||
로그인부터 글 저장까지의 화면·처리 전이맵은 [`docs/qa-login-to-save-transition.md`](docs/qa-login-to-save-transition.md)에 정리했습니다.
|
||||
|
||||
@@ -12,7 +14,7 @@
|
||||
python3 -m http.server 4173
|
||||
```
|
||||
|
||||
그 다음 `http://localhost:4173/egbim/`에 접속합니다. 브라우저 보안 정책 때문에 `file://` 직접 열기보다 정적 서버를 사용하는 편이 안전합니다.
|
||||
그 다음 `http://localhost:4173/egbim/`에 접속합니다. 정적 서버는 화면 배치 확인용이며 로그인과 저장 API를 제공하지 않습니다. 브라우저 보안 정책 때문에 `file://` 직접 열기보다 정적 서버를 사용하는 편이 안전합니다. 실제 서버 데이터를 변경하지 않는 모달 회귀 검증은 별도 Playwright 환경에서 `npm run test:ui`로 실행할 수 있습니다.
|
||||
|
||||
## feedback.hmac.kr DB 기준 연동
|
||||
|
||||
@@ -24,7 +26,7 @@ python3 -m http.server 4173
|
||||
- 신규 상태: `support_tickets.status_code = RECEIVED`, `feedback_status = NEW`
|
||||
- 첨부 저장소: `storage_bucket = qa_cdn`
|
||||
|
||||
작성 시 브라우저가 UUID를 하나 생성합니다. 같은 UUID를 `feedback.id`, `feedback.source_record_id`, `support_tickets.idempotency_key`에 사용하므로 중복 제출을 판별할 수 있습니다. API 서버는 envelope를 받아 다음 DB 레코드를 하나의 트랜잭션으로 생성해야 합니다.
|
||||
작성 시 브라우저가 기존 UUID v7 방식으로 `feedbackId`를 생성하고 같은 Worker의 `POST /api/feedbacks`에 전달합니다. API 서버의 저장 구조와 작성자·조직 매핑은 이번 UI 변경 범위에 포함하지 않습니다. 기존 저장 대상은 다음과 같습니다.
|
||||
|
||||
- `feedbacks`: `id`, `channel_id`, `source_namespace`, `source_record_id`, `data`
|
||||
- `support_tickets`: 작성자/테넌트/제목/내용/분류/상태/`idempotency_key`
|
||||
@@ -42,7 +44,7 @@ python3 -m http.server 4173
|
||||
## 연동 지점
|
||||
|
||||
- SSO: Q&A는 홈페이지 로그인 정보를 전달받지 않고, `https://sso.hmac.kr/oidc`에 등록된 독립적인 PKCE Public Client로 직접 인증합니다. callback은 `https://qa-test.baroncs.co.kr/auth/callback`이며, Worker가 검증한 claim을 버전이 지정된 HttpOnly 세션 쿠키에 저장합니다. 브라우저의 `GET /auth/session`은 Q&A 세션에 저장된 작성자 정보를 반환합니다. feedback 서버는 반드시 SSO 세션 또는 토큰을 서버 측에서 검증해야 합니다.
|
||||
- 작성자 식별자: `ssoSubject`/`requesterId`, `userUuid`, `tenantId`/`requesterTenantId`, `tenantIds`, `scope`, `roles`, 이메일·이름·부서·전화번호를 payload에 넣습니다. `requester_id`와 `requester_tenant_id`가 없으면 제출을 차단합니다.
|
||||
- 작성자 식별자: Worker가 검증한 세션의 `requesterId`와 `requesterTenantId`를 사용합니다. 브라우저는 회사·부서·이름·이메일을 읽기 전용으로 표시하고, 필수 UUID가 없으면 제출을 차단합니다. 서버가 요청의 작성자·조직 정보를 결정합니다.
|
||||
- API: 작성페이지는 같은 Worker의 `POST /api/feedbacks`를 호출합니다. Worker가 Q&A 세션 쿠키를 검증하고, SSO requester 정보와 `ABC_API_KEY` Secret을 추가한 뒤 `POST https://feedback.hmac.kr/api/projects/{projectId}/channels/{channelId}/feedbacks`로 전달합니다. API Key와 내부 ABC 주소는 브라우저에 노출하지 않습니다.
|
||||
- 첨부파일: 작성페이지가 `multipart/form-data`의 반복 `images` 필드로 파일을 Worker에 전달하고, Worker가 검증된 requester 정보와 API Key를 추가해 ABC API로 전달합니다. ABC API가 `qa_cdn` 저장소에 파일을 저장하므로 R2 access key/secret은 정적 페이지에 넣지 않습니다.
|
||||
- 텍스트만 등록할 때는 기존 JSON 요청을 사용하고, 파일이 있을 때만 multipart 요청을 사용합니다.
|
||||
@@ -76,17 +78,41 @@ npx wrangler secret bulk qa-secrets.json --name baron-qa-gateway-test
|
||||
|
||||
Worker는 OAuth Authorization Code + PKCE를 사용하고, callback에서 검증한 사용자 claim을 서명된 HttpOnly 세션 쿠키에 저장합니다. 브라우저의 `GET /auth/session`은 정규화된 작성자 정보만 반환합니다.
|
||||
|
||||
로그아웃 메뉴는 `/auth/logout`으로 이동해 해당 환경의 Q&A 세션 쿠키를 삭제한 뒤 `https://test.baroncs.co.kr/ko/sw-inquiry.html`로 돌아갑니다. 스테이징·운영의 `AUTH_POST_LOGOUT_REDIRECT_URI`에 같은 목적지를 설정합니다. 목적지는 서버 배포 설정에서만 읽으며 요청 쿼리로 변경할 수 없습니다. 중앙 SSO의 로그인 종료 요청은 별도로 보내지 않습니다.
|
||||
|
||||
## Gitea Actions 등록값
|
||||
|
||||
운영 `qa.baroncs.co.kr` 배포는 [production 파이프라인 안내](docs/qa-production-pipeline.md)를 따른다. 운영 workflow는 `Deploy EG-BIM QA Production`이며 `main`에서 수동으로 실행한다. 아래 기존 등록값은 스테이징 배포용이다.
|
||||
운영 `qa.baroncs.co.kr` 배포는 [production 파이프라인 안내](docs/qa-production-pipeline.md)를 따른다. 운영 workflow는 `Deploy EG-BIM QA Production`이며 `main`에서 수동으로 실행한다. 스테이징 Actions 설정은 `STG_*`, 운영은 `PROD_*` 이름을 사용한다.
|
||||
|
||||
저장소 Settings → Actions → Secrets에 아래 기본 Secret 3개를 등록합니다.
|
||||
저장소 Settings → Actions → Secrets에 아래 스테이징 Secret을 등록합니다. 기존 접두사 없는 이름과 `STAGING_*` 이름은 새 workflow에서 읽지 않습니다.
|
||||
|
||||
| 이름 | 종류 | 값 |
|
||||
|---|---|---|
|
||||
| `CLOUDFLARE_API_TOKEN` | Secret | Workers Scripts Edit + Workers R2 Storage Edit 권한의 Cloudflare API Token |
|
||||
| `SESSION_SECRET` | Secret | `openssl rand -hex 32`로 생성한 세션 서명키 |
|
||||
| `ABC_API_KEY` | Secret | 프로젝트 전용 ABC UserFeedback API Key |
|
||||
| `STG_CLOUDFLARE_API_TOKEN` | Secret | 스테이징 Worker·R2 배포용 Cloudflare API Token |
|
||||
| `STG_SESSION_SECRET` | Secret | 스테이징 세션 서명키. 기존 서명키를 유지하면 기존 로그인 세션도 유지 |
|
||||
| `STG_ABC_API_KEY` | Secret | 스테이징 ABC project/channel API Key |
|
||||
| `STG_ORG_CONTEXT_KEY_ID` | Secret | 스테이징 조직 API Key ID |
|
||||
| `STG_ORG_CONTEXT_KEY_SECRET` | Secret | 스테이징 조직 API Key Secret |
|
||||
|
||||
스테이징 일반 변수는 기존 설정에서 확인한 값으로 아래와 같이 분리한다. 운영 프로젝트·채널 ID를 스테이징에 복사하지 않는다.
|
||||
|
||||
| Variable | 스테이징 값 |
|
||||
|---|---|
|
||||
| `STG_AUTH_CLIENT_ID` | `e16898a7-acd2-420a-a224-cdcd89ff66cd` |
|
||||
| `STG_AUTH_ISSUER` | `https://sso.hmac.kr/oidc` |
|
||||
| `STG_ABC_API_BASE_URL` | `https://feedback.hmac.kr` |
|
||||
| `STG_ABC_PROJECT_ID` | `01a0ae3f-fcf6-74b5-bdc4-70d942d6ad72` |
|
||||
| `STG_ABC_CHANNEL_ID` | `01a0ae40-51c2-7647-a93c-0249b3759777` |
|
||||
| `STG_ORG_CONTEXT_ENABLED` | `true` |
|
||||
| `STG_ORG_CONTEXT_API_URL` | `https://sadmin.hmac.kr/api/v1/integrations/org-context` |
|
||||
| `STG_ORG_CONTEXT_SCOPE_MODE` | `SCOPED` |
|
||||
| `STG_ORG_CONTEXT_EXPOSURE` | `identifiers` |
|
||||
| `STG_ORG_CONTEXT_TENANT_IDS` | 기존 스테이징 기준 tenant 7개 JSON 배열 |
|
||||
| `STG_ORG_CONTEXT_CACHE_TTL_SECONDS` | `300` |
|
||||
|
||||
workflow가 `STG_`를 제거한 Worker/CLI 환경 이름으로 매핑한다. `scripts/deploy-worker.mjs`는 필수 API·SSO 값이 비었을 때 다른 환경으로 대체하지 않고 중단한다. `AUTH_ISSUER`로 authorization·token·userinfo 주소를 구성한다. `--validate-only`와 `--dry-run`은 Worker·Secret을 변경하지 않는다.
|
||||
|
||||
2026-11-11 확인: 일반 변수 11개를 이 저장소의 Gitea Actions Variables에 등록하고 값 일치를 확인했다. `STG_*` Secret 5개는 사용자가 등록한다. 현재 원격 workflow가 사용하는 기존 이름은 새 Secret 등록 및 workflow 반영 이후 정리한다. 운영 등록 목록은 [production 안내](docs/qa-production-pipeline.md)를 따른다.
|
||||
|
||||
`CLOUDFLARE_ACCOUNT_ID`는 secret으로 등록할 필요가 없습니다. `wrangler.toml`에 `81fa2d48964d31dd0da9558f9ce601d1`로 설정되어 있습니다.
|
||||
|
||||
@@ -95,11 +121,12 @@ Cloudflare API Token에는 최소한 다음 권한이 필요합니다.
|
||||
- Account → Workers Scripts → Edit
|
||||
- Account → Workers R2 Storage → Edit
|
||||
- Account → Account Settings → Read
|
||||
- Custom Domain route를 Actions에서 변경할 경우 Zone → Workers Routes → Edit
|
||||
|
||||
스테이징 `qa-test.baroncs.co.kr`과 운영 `qa.baroncs.co.kr`의 도메인 연결은 Cloudflare 대시보드에서 관리합니다. 두 Wrangler 설정 모두 `route`/`routes`를 생략하고 `workers_dev=false`로 지정해 기존 연결을 유지합니다. 배포 시 Zone 라우팅 API를 호출하지 않으므로 이 작업에 Zone 권한을 추가할 필요가 없습니다. [Cloudflare 설정 안내](https://developers.cloudflare.com/workers/wrangler/configuration/#source-of-truth)
|
||||
|
||||
`.gitea/workflows/deploy.yml`은 `main` push 또는 수동 실행 시 세션 secret을 Worker에 등록하고 R2 업로드 후 `baron-qa-gateway-test`를 배포합니다. 실제 secret 값은 로그에 출력하지 않습니다.
|
||||
|
||||
현재 화면은 API 설정 전에도 QA 흐름을 확인할 수 있도록 샘플 글과 로컬 테스트 저장을 포함합니다. 운영 배포 시에는 Gitea Secret `ABC_API_KEY`가 Worker에 등록되어야 하며, 작성페이지는 Worker 프록시를 통해 ABC API를 호출합니다.
|
||||
화면에는 디자인 목업의 예시 글·공지를 넣지 않습니다. 브라우저는 실제 Worker API를 호출하며 기존 localStorage는 조회·저장 결과의 캐시로 유지합니다. API 설정 전 로컬 저장 성공으로 대체하지 않습니다. 운영은 [production 파이프라인 안내](docs/qa-production-pipeline.md)의 `PROD_` 등록값과 기존 수동 배포 절차를 사용합니다.
|
||||
|
||||
|
||||
## 회사·부서 조직 연동 (스테이징)
|
||||
@@ -108,19 +135,23 @@ Gitea의 스테이징 설정을 `.gitea/workflows/deploy.yml`에서 Worker 런
|
||||
|
||||
| Gitea | 위치 | Worker 런타임 |
|
||||
|---|---|---|
|
||||
| `STAGING_ORG_CONTEXT_KEY_ID` | Secrets | `ORG_CONTEXT_KEY_ID` (Secret) |
|
||||
| `STAGING_ORG_CONTEXT_KEY_SECRET` | Secrets | `ORG_CONTEXT_KEY_SECRET` (Secret) |
|
||||
| `STAGING_ORG_CONTEXT_ENABLED` | Variables | `ORG_CONTEXT_ENABLED` |
|
||||
| `STAGING_ORG_CONTEXT_API_URL` | Variables | `ORG_CONTEXT_API_URL` |
|
||||
| `STAGING_ORG_CONTEXT_SCOPE_MODE` | Variables | `ORG_CONTEXT_SCOPE_MODE` |
|
||||
| `STAGING_ORG_CONTEXT_EXPOSURE` | Variables | `ORG_CONTEXT_EXPOSURE` |
|
||||
| `STAGING_ORG_CONTEXT_TENANT_IDS` | Variables | `ORG_CONTEXT_TENANT_IDS` |
|
||||
| `STAGING_ORG_CONTEXT_CACHE_TTL_SECONDS` | Variables, 선택 | `ORG_CONTEXT_CACHE_TTL_SECONDS` (기본 300) |
|
||||
| `STG_ORG_CONTEXT_KEY_ID` | Secrets | `ORG_CONTEXT_KEY_ID` (Secret) |
|
||||
| `STG_ORG_CONTEXT_KEY_SECRET` | Secrets | `ORG_CONTEXT_KEY_SECRET` (Secret) |
|
||||
| `STG_ORG_CONTEXT_ENABLED` | Variables | `ORG_CONTEXT_ENABLED` |
|
||||
| `STG_ORG_CONTEXT_API_URL` | Variables | `ORG_CONTEXT_API_URL` |
|
||||
| `STG_ORG_CONTEXT_SCOPE_MODE` | Variables | `ORG_CONTEXT_SCOPE_MODE` |
|
||||
| `STG_ORG_CONTEXT_EXPOSURE` | Variables | `ORG_CONTEXT_EXPOSURE` |
|
||||
| `STG_ORG_CONTEXT_TENANT_IDS` | Variables | `ORG_CONTEXT_TENANT_IDS` |
|
||||
| `STG_ORG_CONTEXT_CACHE_TTL_SECONDS` | Variables, 선택 | `ORG_CONTEXT_CACHE_TTL_SECONDS` (기본 300) |
|
||||
|
||||
조회는 `SCOPED`, `identifiers`를 사용합니다. 기준 테넌트는 UUID JSON 배열로 등록하며 UUID v4를 허용합니다. 각 테넌트를 최대 3개씩 동시 조회하고, 완전한 응답만 캐시합니다. 페이지 조회 타임아웃은 요청당 5초입니다. 배포 전 `npm run org:verify`는 요청당 15초를 허용하고, 타임아웃·통신 실패·HTTP 429/502/503/504에 한해 2초 간격으로 최대 3회 시도합니다. 인증 실패·범위 불일치·구성원 누락은 재시도 없이 검증 실패로 처리합니다.
|
||||
|
||||
기본 `ORG_CONTEXT_ENABLED=false`에서는 조직 API를 호출하지 않습니다. `true`로 배포하면 `npm run org:verify`가 실제 키로 조직 API를 먼저 검증하며, 실패 시 새 Worker 배포를 진행하지 않습니다. 성공 시에는 조직·사용자·소속 건수만 로그에 출력합니다. 전체 응답·전화번호·키 원문은 출력하지 않습니다.
|
||||
|
||||
배포 전 검증에서 HTTP 401/403이 발생하면 요청한 API 주소·기준 tenant UUID·OperationID `baron.org-context.read`·exposure `identifiers`를 함께 출력합니다. 키 원문과 API 응답 본문은 출력하지 않습니다. 403이면 발급 서버의 API 키 관리에서 이 작업·노출 단계·해당 tenant subtree 조회 범위를 확인합니다. 여러 기준 tenant 중 하나만 거부돼도 전체 검증은 실패하며, 권한 밖 조직을 임의로 제외하거나 검증을 건너뛰지 않습니다.
|
||||
|
||||
서버가 제공하는 오류 중 문서에 정의된 코드만 `upstreamCode`로 출력합니다. `credential_operation_mismatch`는 허용 작업, `credential_scope_exceeded`는 조직 범위, `credential_exposure_exceeded`는 노출 단계 거절입니다. 서버가 반환한 허용/요청 노출 단계도 정해진 enum에 해당할 때만 표시합니다. HTML 응답이나 Cloudflare challenge 여부는 `responseKind`, `proxyChallenge`로 구분합니다. 알 수 없는 코드·오류 메시지·HTML 원문은 출력하지 않습니다.
|
||||
|
||||
Worker는 서명된 세션의 사용자 UUID로 소속을 찾습니다. 조회 조직 컨텍스트·대표 소속을 선택하고, 기존 requester ID·tenant ID·권한은 유지합니다. 새 문의는 `requester_affiliation`에 회사, `requester_department`에 부서를 저장합니다. JSON과 첨부 multipart에 같은 값을 사용합니다. 목록·상세는 글에 저장된 정보를 사용하며 조회 시점의 조직으로 과거 글을 바꾸지 않습니다.
|
||||
|
||||
조직 조회가 실패하면 기존 세션·글쓰기 흐름과 확인된 SSO 정보를 유지합니다. 누락되거나 모호한 사용자는 `orgContextStatus`로 구분하고 다른 작성자의 정보를 대신 쓰지 않습니다. 로그인 후 `/auth/session`의 `user.orgContextStatus=unavailable`이면 `user.orgContextError`에서 허용된 오류 코드만 확인할 수 있습니다. `org_context_missing_credentials`는 Worker의 조직 API 키 누락, `org_context_http_401`은 API 인증 거부, `org_context_http_403`은 API 접근 거부, `org_context_timeout`은 요청 시간 초과를 뜻합니다. 알 수 없는 오류는 `org_context_unavailable`로 표시하며 키·원본 오류 메시지·조직 디렉터리는 응답에 넣지 않습니다. 조회가 정상화되면 이전 `orgContextError`는 제거됩니다. HTTP 200이나 요청 로그의 `outcome=ok`만으로 조직 조회 성공을 판단하지 않습니다.
|
||||
|
||||
@@ -0,0 +1,19 @@
|
||||
# S/W문의 소스 패키지
|
||||
|
||||
## 페이지
|
||||
- `ko/inquiry.html` — 한국어 S/W 문의 페이지
|
||||
- `en/inquiry.html` — 영어 S/W Inquiry 페이지
|
||||
|
||||
## 포함 내용
|
||||
- 페이지별 HTML, 문의 UI CSS/JS 및 ko/en 문구 파일
|
||||
- 페이지가 불러오는 공통 헤더·메뉴·푸터 조각
|
||||
- 공통 CSS, 로그인 UI/SSO 보조 스크립트와 페이지에서 직접 불러오는 라이브러리
|
||||
- 공통 CSS가 참조하는 글꼴 전체
|
||||
- 페이지 및 공통 레이아웃에서 참조하는 이미지
|
||||
- `SW문의_이미지목록.md` — 이미지 경로와 출처 상태
|
||||
|
||||
## 상대 경로
|
||||
저장소 루트 기준 폴더 구조를 유지했습니다. HTML/CSS/JS의 상대 경로가 유지되도록 패키징했습니다.
|
||||
|
||||
## 기능 범위
|
||||
현재 `inquiry.js`는 디자인 확인용 예시 데이터입니다. HTML 주석과 스크립트 설명에 따라 실제 API 조회, 등록, 전송, 저장은 구현되어 있지 않습니다.
|
||||
@@ -0,0 +1,23 @@
|
||||
# S/W문의 페이지 이미지 목록
|
||||
|
||||
대상 페이지: `ko/inquiry.html`, `en/inquiry.html`
|
||||
패키지 경로는 저장소 루트 기준 상대 경로입니다. 페이지에서 직접 참조하는 이미지와 공통 헤더·스타일의 이미지 자산을 정리했습니다.
|
||||
|
||||
| 파일 | 사용 위치/용도 | 패키지 포함 |
|
||||
|---|---|---|
|
||||
| `assets/img/inquiry-hero.webp` | 문의 페이지 상단 배경 (`assets/css/inquiry.css`) | 포함 — 공개 서비스 주소에서 내려받음 |
|
||||
| `ko/egbim/img/egbim_symbol.svg` | 좁은 화면 EG-BIM 탭 심볼 | 포함 — 공개 서비스 주소에서 내려받음 |
|
||||
| `ko/egbim/img/egbim_k.svg` | EG-BIM 탭 로고 | 포함 — 로컬 파일 |
|
||||
| `ko/tova/img/tova_k.svg` | TOVA 탭 로고 | 포함 — 로컬 파일 |
|
||||
| `ko/gaia/img/gaia_k.svg` | GAIA 탭 로고 | 포함 — 로컬 파일 |
|
||||
| `assets/img/favicon.ico` | 페이지 파비콘 | 포함 — 로컬 파일 |
|
||||
| `assets/img/ico_user.svg` | 공통 헤더 로그인 아이콘 | 포함 — 로컬 파일 |
|
||||
| `assets/img/logo.svg`, `logo_c.svg`, `logo_w.svg` | 공통 헤더·푸터 로고 상태 | 포함 — 로컬 파일 |
|
||||
| `assets/img/ico_language.svg`, `ico_language_w.svg` | 언어 선택 아이콘 | 포함 — 로컬 파일 |
|
||||
| `assets/img/ico_more.svg`, `ico_more_hover.svg` | 공통 메뉴 아이콘 | 포함 — 로컬 파일 |
|
||||
| `assets/img/ico_angle.svg`, `ico_home.svg` | 공통 이동/홈 아이콘 | 포함 — 로컬 파일 |
|
||||
| `assets/img/flipbook_corner.png` | 공통 스타일 장식 이미지 | 포함 — 로컬 파일 |
|
||||
|
||||
## 이미지 출처 메모
|
||||
|
||||
이 목록은 페이지와 공통 스타일이 참조하는 이미지 목록이지, R2 버킷 전체 목록은 아닙니다. R2 API 자격증명이 이 실행 환경에 없어 버킷 객체 목록은 조회하지 않았습니다. 로컬에 없던 두 이미지는 공개 서비스 경로에서 받아 패키지에 포함했습니다.
|
||||
@@ -0,0 +1,113 @@
|
||||
<!--영문화-->
|
||||
<style>
|
||||
footer .footer_inner .footer_info .home{background-image: url(/assets/img/eng/logo_w.svg);}
|
||||
footer .footer_inner .footer_info span{font-size: 15px;}
|
||||
/* footer .footer_inner nav ol li.depth1:last-child{display:none;} */
|
||||
</style>
|
||||
<div class="footer_inner">
|
||||
<div class="footer_info">
|
||||
<!-- h1 로고영역은 style.css에서 제어 -->
|
||||
<div class="logo">
|
||||
<a class="home" href="/en/index.html">Baron Consultants</a>
|
||||
</div>
|
||||
|
||||
<span><em>Address.</em>554, Ogeum-ro, Songpa-gu, Seoul, Republic of Korea</span>
|
||||
<span><em>Tel.</em>02-2141-7434</span>
|
||||
<span><em>Mail.</em>baroncs@baroncs.co.kr</span>
|
||||
<span><em>CEO.</em>Jang Jong Chan</span>
|
||||
<span class="copyright"><em>© Baron Consultants Co,.Ltd All Rights Reserved.</em></span>
|
||||
|
||||
<div class="family_wrap">
|
||||
<div class="family_btn"><span>Family Site</span><i></i></div>
|
||||
<ul class="family_list">
|
||||
<li><a href="http://www.hanmaceng.co.kr" target="_blank">hanmac</a></li>
|
||||
<li><a href="https://www.samaneng.co.kr/" target="_blank">saman</a></li>
|
||||
<li><a href="http://www.jangheon.co.kr/" target="_blank">jangheon</a></li>
|
||||
<li><a href="http://jangheon.com/" target="_blank">jangheon Inc.</a></li>
|
||||
<li><a href="http://www.pre-cast.co.kr/" target="_blank">PTC</a></li>
|
||||
<li>
|
||||
<a href="http://www.hallasanup.com/" target="_blank">hallasanup</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav class="nav"></nav>
|
||||
</div>
|
||||
|
||||
<!-- TOP버튼 -->
|
||||
<button class="btn_top js__top" onclick="window.scrollTo(0,0);">
|
||||
<div class="arrow"></div>
|
||||
</button>
|
||||
<!-- //TOP버튼 -->
|
||||
|
||||
<script>
|
||||
// console.log('?');
|
||||
// ^ TOP button
|
||||
const urlParams = location.href;
|
||||
$(function () {
|
||||
if (urlParams.indexOf("recruit") != -1) {
|
||||
$(".footer_info .home").attr("target", "_blank");
|
||||
}
|
||||
});
|
||||
const topButton = document.querySelector(".js__top");
|
||||
function adjustButtonPosition() {
|
||||
const scrollY = window.scrollY; // 현재 스크롤 위치
|
||||
const windowHeight = window.innerHeight; // 윈도우 높이
|
||||
const documentHeight = document.documentElement.scrollHeight; // 문서 전체 높이
|
||||
const bottomSpace = urlParams.indexOf("recruit") != -1 ? 120 : 400; // 탑 버튼이 아래에서 떨어져 있어야 하는 거리
|
||||
|
||||
// 문서의 맨 아래로부터 떨어지기 위한 계산
|
||||
if (scrollY + windowHeight >= documentHeight - bottomSpace) {
|
||||
topButton.style.bottom = `${
|
||||
bottomSpace + (scrollY + windowHeight - documentHeight)
|
||||
}px`;
|
||||
} else {
|
||||
topButton.style.bottom = "80px"; // 원래의 위치
|
||||
}
|
||||
}
|
||||
window.addEventListener("scroll", adjustButtonPosition);
|
||||
window.addEventListener("load", adjustButtonPosition);
|
||||
// 새로운 코드 추가 - topButton의 표시/숨기기 로직
|
||||
function toggleTopButtonClass() {
|
||||
// console.log('*');
|
||||
if (window.scrollY === 0) {
|
||||
topButton.style.display = "none";
|
||||
} else {
|
||||
topButton.style.display = "initial";
|
||||
}
|
||||
}
|
||||
window.addEventListener("scroll", toggleTopButtonClass);
|
||||
window.addEventListener("load", toggleTopButtonClass);
|
||||
|
||||
// FOOTER - 패밀리사이트 열고닫기
|
||||
$(function () {
|
||||
$(".menu_my").mouseover(function () {
|
||||
$(".menu_my_list").show();
|
||||
});
|
||||
|
||||
$(".menu_my").mouseout(function () {
|
||||
$(".menu_my_list").hide();
|
||||
});
|
||||
|
||||
//footer family site toggle
|
||||
$(".family_btn").click(function (event) {
|
||||
event.stopPropagation(); // family_btn 클릭 시 이벤트 전파를 막음
|
||||
$(".family_list").toggleClass("family_on");
|
||||
$(".family_btn").toggleClass("family_on");
|
||||
});
|
||||
|
||||
// 화면 아무 곳이나 클릭했을 때 family_list를 제외한 영역 클릭 시 리스트 닫기
|
||||
$(document).click(function (event) {
|
||||
if (
|
||||
!$(event.target).closest(".family_list").length &&
|
||||
!$(event.target).closest(".family_btn").length
|
||||
) {
|
||||
// family_list와 family_btn 외의 영역을 클릭한 경우
|
||||
$(".family_list").removeClass("family_on");
|
||||
$(".family_btn").removeClass("family_on");
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,91 @@
|
||||
<!--영문화-->
|
||||
<style>
|
||||
header .logo_box a.logo{-webkit-mask-image:url(/assets/img/eng/logo_w.svg);mask-image:url(/assets/img/eng/logo_w.svg);}
|
||||
header .header_inner .header_R{display:flex;align-items:center;margin-left:auto;}
|
||||
header .header_inner .header_R .language{display:inline-flex;align-items:baseline;flex-wrap:nowrap;flex-shrink:0;min-width:84px;padding-right:24px;white-space:nowrap;}
|
||||
header .header_inner .header_R .language a{display:inline-flex;align-items:center;flex:0 0 auto;white-space:nowrap;}
|
||||
|
||||
header .header_inner .header_login{position:relative;display:none;align-items:center;justify-content:center;margin-right:12px;}
|
||||
html[data-baron-page-mode="landing"] header .header_inner .header_login,
|
||||
html[data-baron-page-mode="public-info"] header .header_inner .header_login,
|
||||
html[data-baron-auth-state="authenticated"] header .header_inner .header_login{display:inline-flex;}
|
||||
|
||||
header .header_inner .header_login_trigger{display:flex;align-items:center;justify-content:center;width:36px;height:36px;cursor:pointer;transition:filter 0.2s ease;}
|
||||
header .header_inner .header_login:hover .header_login_trigger,
|
||||
header .header_inner .header_login:focus-within .header_login_trigger{filter:brightness(1.12);}
|
||||
header .header_inner .header_login_trigger img{width:28px;height:28px;filter:brightness(0);}
|
||||
html[data-baron-page-mode="landing"] header .header_inner .header_login_trigger img{filter:none;}
|
||||
html[data-baron-page-mode="landing"] header:hover .header_inner .header_login_trigger img{filter:brightness(0);}
|
||||
|
||||
header .header_inner .header_login_menu{position:absolute;top:100%;left:50%;padding-top:12px;transform:translateX(-50%) translateY(4px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity 0.2s ease, transform 0.2s ease;z-index:20;}
|
||||
header .header_inner .header_login:hover .header_login_menu,
|
||||
header .header_inner .header_login:focus-within .header_login_menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);}
|
||||
header .header_inner .header_login.is-open .header_login_menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);}
|
||||
header .header_inner .header_login.is-dismissed .header_login_menu{opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-50%) translateY(4px);}
|
||||
header .header_inner .header_login_menu::before{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #ffffff;}
|
||||
header .header_inner .header_login_link{display:block;white-space:nowrap;background:#ffffff;color:#111111;font-size:13px;font-weight:700;padding:10px 22px;border:2px solid transparent;border-radius:10px;box-shadow:0 8px 20px rgba(0,0,0,0.18);text-align:center;box-sizing:border-box;transition:background-color 0.15s ease, border-color 0.15s ease;}
|
||||
header .header_inner .header_login_link:hover{background:#ffcc00;border-color:#ffffff;}
|
||||
|
||||
@media (max-width: 768px){
|
||||
header .header_inner .header_login{margin-right:6px;}
|
||||
header .header_inner .header_login_trigger{width:32px;height:32px;}
|
||||
}
|
||||
|
||||
header .header_inner nav ol li.depth1 span,
|
||||
header .header_inner nav ol li.depth1 span em,
|
||||
header .header_inner nav ol li.depth1 ul.depth2 li a,
|
||||
header .header_inner nav ol li.depth1 ul.depth2 li ul.depth3 li a{word-break:keep-all;overflow-wrap:normal;white-space:normal;}
|
||||
header .sitemap nav ol li.depth1 ul.depth2 li.has_depth3 ul.depth3{display:none;}
|
||||
</style>
|
||||
|
||||
<!-- CORP -->
|
||||
<div class="header_inner corp">
|
||||
<div class="logo_box">
|
||||
<!-- a = 홈페이지 로고 -->
|
||||
<!-- a의 이미지는은 style.css에서 제어하세요 -->
|
||||
<a class="logo" href="/en/index.html">Baron Consultants</a>
|
||||
</div>
|
||||
|
||||
<!-- 오픈메뉴 경우 -->
|
||||
<nav class="nav"></nav>
|
||||
|
||||
<!-- 버튼형 경우 -->
|
||||
<div class="header_R">
|
||||
<a class="header_qa header_qa_button" href="/en/inquiry.html" aria-label="Software inquiries">
|
||||
<svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="10" /><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3M12 17h.01" /></svg>
|
||||
<span>S/W Inquiry</span>
|
||||
</a>
|
||||
<div class="language">
|
||||
<a href="/ko/index.html">KR</a>
|
||||
<a href="#" class="on">EN</a>
|
||||
</div>
|
||||
|
||||
<div class="header_login">
|
||||
<button type="button" class="header_login_trigger" aria-label="LOGIN" aria-expanded="false" aria-controls="header-login-menu">
|
||||
<img src="/assets/img/ico_user.svg" alt="" />
|
||||
</button>
|
||||
<div class="header_login_menu" id="header-login-menu">
|
||||
<a class="header_login_link" href="../en/br_future.html">LOGIN</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn_menu" data-value="sitemap">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="popup_wrap sitemap">
|
||||
<div class="popup_contents_wrap" data-lenis-prevent-wheel>
|
||||
<div class="popup_header">
|
||||
<div class="logo_box">
|
||||
<a class="logo" href="/en/index.html">Baron Consultants</a>
|
||||
</div>
|
||||
<button class="btn_close"><i class="close"></i></button>
|
||||
</div>
|
||||
|
||||
<nav class="nav"></nav>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,58 @@
|
||||
<!-- Anonymous menu. Services Provided and D/X Experience stay disabled until sign-in. -->
|
||||
<ol>
|
||||
<li class="depth1">
|
||||
<span><em>Designing the Future</em>Baron Consultants</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/br_future.html">Future Presented by Baron</a></li>
|
||||
<li><a href="/en/br_tech.html">Technology Realized by Baron</a></li>
|
||||
<li><a href="/en/br_value.html">The Values Pursued by Baron</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>Leading the Change</em>Digital Transformation</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/dt_explain.html">D/X <br>Infrastructure Construction</a></li>
|
||||
<li><a href="/en/dt_sw.html">D/X & Software</a></li>
|
||||
<li><a href="/en/dt_use.html">Leveraging D/X<br>Infrastructure Construction</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1 nav-login-required" data-login-tooltip="Sign in to access these services.">
|
||||
<span><em>Realizing Value</em>Services Provided</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/sv_solution.html" data-auth-disabled="true" aria-disabled="true" tabindex="-1">Solution Program</a></li>
|
||||
<li><a href="/en/sv_sw.html" data-auth-disabled="true" aria-disabled="true" tabindex="-1">Package Software</a></li>
|
||||
<li><a href="/en/sv_bigroom.html" data-auth-disabled="true" aria-disabled="true" tabindex="-1">Big Room</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1 nav-login-required" data-login-tooltip="Sign in to access this experience.">
|
||||
<span><em>Experiencing the Vision</em>D/X Experience</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/dx.html" data-auth-disabled="true" aria-disabled="true" tabindex="-1">D/X experience<br>to experience the vision</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>Telling a story</em>PR Center</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/pr_news.html">Baron News</a></li>
|
||||
<li><a href="/en/pr_brochure.html">Brochure</a></li>
|
||||
<li><a href="/en/pr_ci.html">CI</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1 nav-recruit">
|
||||
<span
|
||||
><a href="/recruit/br_recruit.html" target="_blank" rel="noopener noreferrer"
|
||||
><em>Completed by Relationship</em>Recruit<i></i></a
|
||||
></span>
|
||||
<ul class="depth2">
|
||||
<li>
|
||||
<a href="/recruit/br_recruit.html" target="_blank" rel="noopener noreferrer" aria-label="Recruit (opens in a new tab)">Recruit<i aria-hidden="true"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- <li class="depth1">
|
||||
<span onclick="location.href='../en/faq.html'"><em>Supporting customers</em>FAQ</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/faq.html">Frequently Asked Questions</a></li>
|
||||
</ul>
|
||||
</li> -->
|
||||
</ol>
|
||||
@@ -0,0 +1,57 @@
|
||||
<ol>
|
||||
<li class="depth1">
|
||||
<span><em>Designing the Future</em>Baron Consultants</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/br_future.html">Future Presented by Baron</a></li>
|
||||
<li><a href="/en/br_tech.html">Technology Realized by Baron</a></li>
|
||||
<li><a href="/en/br_value.html">The Values Pursued by Baron</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>Leading the Change</em>Digital Transformation</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/dt_explain.html">D/X <br>Infrastructure Construction</a></li>
|
||||
<li><a href="/en/dt_sw.html">D/X & Software</a></li>
|
||||
<li><a href="/en/dt_use.html">Leveraging D/X<br>Infrastructure Construction</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>Realizing Value</em>Services Provided</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/sv_solution.html">Solution Program</a></li>
|
||||
<li><a href="/en/sv_sw.html">Package Software</a></li>
|
||||
<li><a href="/en/sv_bigroom.html">Big Room</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>Experiencing the Vision</em>D/X Experience</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/dx.html">D/X experience<br>to experience the vision</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>Telling a story</em>PR Center</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/pr_news.html">Baron News</a></li>
|
||||
<li><a href="/en/pr_brochure.html">Brochure</a></li>
|
||||
<li><a href="/en/pr_ci.html">CI</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1 nav-recruit">
|
||||
<span
|
||||
><a href="/recruit/br_recruit.html" target="_blank" rel="noopener noreferrer"
|
||||
><em>Completed by Relationship</em>Recruit<i></i></a
|
||||
></span>
|
||||
<ul class="depth2">
|
||||
<li>
|
||||
<a href="/recruit/br_recruit.html" target="_blank" rel="noopener noreferrer" aria-label="Recruit (opens in a new tab)">Recruit<i aria-hidden="true"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- <li class="depth1">
|
||||
<span onclick="location.href='../en/faq.html'"><em>Supporting customers</em>FAQ</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/en/faq.html">Frequently Asked Questions</a></li>
|
||||
</ul>
|
||||
</li> -->
|
||||
</ol>
|
||||
@@ -0,0 +1,122 @@
|
||||
<style>
|
||||
/* footer .footer_inner nav ol li.depth1:last-child{display:none;} */
|
||||
</style>
|
||||
<div class="footer_inner">
|
||||
<div class="footer_info">
|
||||
<!-- h1 로고영역은 style.css에서 제어 -->
|
||||
<div class="logo">
|
||||
<a class="home" href="/ko/index.html">(주) 바론컨설턴트</a>
|
||||
</div>
|
||||
|
||||
<span><em>주소.</em>서울특별시 송파구 오금로 554(거여동)</span>
|
||||
<div class="footer_contact">
|
||||
<span><em>Tel.</em>02-2141-7434</span>
|
||||
<span><em>대표이사.</em>장종찬</span>
|
||||
</div>
|
||||
<span class="copyright"><em>© BARON Consultants Co,.Ltd All Rights Reserved.</em></span>
|
||||
|
||||
<div class="family_wrap">
|
||||
<div class="family_btn"><span>Family Site</span><i></i></div>
|
||||
<ul class="family_list">
|
||||
<li><a href="http://www.hanmaceng.co.kr" target="_blank">한맥기술</a></li>
|
||||
<li><a href="https://www.samaneng.co.kr/" target="_blank">삼안</a></li>
|
||||
<li><a href="http://www.jangheon.co.kr/" target="_blank">장헌산업</a></li>
|
||||
<li><a href="http://jangheon.com/" target="_blank">(주)장헌</a></li>
|
||||
<li><a href="http://www.pre-cast.co.kr/" target="_blank">피티씨</a></li>
|
||||
<li>
|
||||
<a href="http://www.hallasanup.com/" target="_blank">한라산업개발</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav class="nav"></nav>
|
||||
</div>
|
||||
|
||||
<!-- TOP버튼 -->
|
||||
<button class="btn_top js__top" onclick="window.scrollTo(0,0);">
|
||||
<div class="arrow"></div>
|
||||
</button>
|
||||
<!-- //TOP버튼 -->
|
||||
|
||||
<script>
|
||||
// console.log('?');
|
||||
// ^ TOP button
|
||||
const urlParams = location.href;
|
||||
$(function () {
|
||||
if (urlParams.indexOf("recruit") != -1) {
|
||||
$(".footer_info .home").attr("target", "_blank");
|
||||
}
|
||||
});
|
||||
const topButton = document.querySelector(".js__top");
|
||||
function adjustButtonPosition() {
|
||||
if (!topButton) return;
|
||||
const scrollY = window.scrollY; // 현재 스크롤 위치
|
||||
const windowHeight = window.innerHeight; // 윈도우 높이
|
||||
const documentHeight = document.documentElement.scrollHeight; // 문서 전체 높이
|
||||
const bottomSpace = urlParams.indexOf("recruit") != -1 ? 120 : 400; // 탑 버튼이 아래에서 떨어져 있어야 하는 거리
|
||||
|
||||
// 문서의 맨 아래로부터 떨어지기 위한 계산
|
||||
if (scrollY + windowHeight >= documentHeight - bottomSpace) {
|
||||
topButton.style.bottom = `${
|
||||
bottomSpace + (scrollY + windowHeight - documentHeight)
|
||||
}px`;
|
||||
} else {
|
||||
topButton.style.bottom = "80px"; // 원래의 위치
|
||||
}
|
||||
}
|
||||
window.addEventListener("scroll", adjustButtonPosition);
|
||||
window.addEventListener("load", adjustButtonPosition);
|
||||
// 새로운 코드 추가 - topButton의 표시/숨기기 및 투명도 토글 로직
|
||||
function toggleTopButtonClass() {
|
||||
if (!topButton) return;
|
||||
if (window.scrollY === 0) {
|
||||
topButton.classList.remove("topbtn_on");
|
||||
topButton.classList.add("topbtn_off");
|
||||
setTimeout(() => {
|
||||
if (window.scrollY === 0) {
|
||||
topButton.style.display = "none";
|
||||
}
|
||||
}, 300);
|
||||
} else {
|
||||
topButton.style.display = "block";
|
||||
requestAnimationFrame(() => {
|
||||
topButton.classList.remove("topbtn_off");
|
||||
topButton.classList.add("topbtn_on");
|
||||
});
|
||||
}
|
||||
}
|
||||
window.addEventListener("scroll", toggleTopButtonClass);
|
||||
window.addEventListener("load", toggleTopButtonClass);
|
||||
|
||||
// FOOTER - 패밀리사이트 열고닫기
|
||||
$(function () {
|
||||
$(".menu_my").mouseover(function () {
|
||||
$(".menu_my_list").show();
|
||||
});
|
||||
|
||||
$(".menu_my").mouseout(function () {
|
||||
$(".menu_my_list").hide();
|
||||
});
|
||||
|
||||
//footer family site toggle
|
||||
$(".family_btn").click(function (event) {
|
||||
event.stopPropagation(); // family_btn 클릭 시 이벤트 전파를 막음
|
||||
$(".family_list").toggleClass("family_on");
|
||||
$(".family_btn").toggleClass("family_on");
|
||||
});
|
||||
|
||||
// 화면 아무 곳이나 클릭했을 때 family_list를 제외한 영역 클릭 시 리스트 닫기
|
||||
$(document).click(function (event) {
|
||||
if (
|
||||
!$(event.target).closest(".family_list").length &&
|
||||
!$(event.target).closest(".family_btn").length
|
||||
) {
|
||||
// family_list와 family_btn 외의 영역을 클릭한 경우
|
||||
$(".family_list").removeClass("family_on");
|
||||
$(".family_btn").removeClass("family_on");
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,177 @@
|
||||
<style>
|
||||
header .header_login {
|
||||
position: relative;
|
||||
display: none;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
html[data-baron-page-mode="landing"] header .header_login,
|
||||
html[data-baron-page-mode="public-info"] header .header_login,
|
||||
html[data-baron-auth-state="authenticated"] header .header_login {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
header .header_login_trigger {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
cursor: pointer;
|
||||
transition: filter 0.2s ease;
|
||||
}
|
||||
|
||||
header .header_login:hover .header_login_trigger,
|
||||
header .header_login:focus-within .header_login_trigger {
|
||||
filter: brightness(1.12);
|
||||
}
|
||||
|
||||
header .header_login_trigger img {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
filter: brightness(0);
|
||||
}
|
||||
|
||||
html[data-baron-page-mode="landing"] header .header_login_trigger img {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
html[data-baron-page-mode="landing"] header:hover .header_login_trigger img {
|
||||
filter: brightness(0);
|
||||
}
|
||||
|
||||
header .header_login_menu {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 50%;
|
||||
padding-top: 12px;
|
||||
transform: translateX(-50%) translateY(4px);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
transition: opacity 0.2s ease, transform 0.2s ease;
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
header .header_login:hover .header_login_menu,
|
||||
header .header_login:focus-within .header_login_menu {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
pointer-events: auto;
|
||||
transform: translateX(-50%) translateY(0);
|
||||
}
|
||||
|
||||
/* 클릭(터치) 시 열림, Esc로 닫은 뒤에는 포인터/포커스가 벗어날 때까지 닫힘 유지 (header-login.js) */
|
||||
header .header_login.is-open .header_login_menu {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
pointer-events: auto;
|
||||
transform: translateX(-50%) translateY(0);
|
||||
}
|
||||
|
||||
header .header_login.is-dismissed .header_login_menu {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
transform: translateX(-50%) translateY(4px);
|
||||
}
|
||||
|
||||
header .header_login_menu::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 7px solid transparent;
|
||||
border-right: 7px solid transparent;
|
||||
border-bottom: 7px solid #ffffff;
|
||||
}
|
||||
|
||||
header .header_login_link {
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
background: #ffffff;
|
||||
color: #111111;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
padding: 10px 22px;
|
||||
border: 2px solid transparent;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
transition: background-color 0.15s ease, border-color 0.15s ease;
|
||||
}
|
||||
|
||||
header .header_login_link:hover {
|
||||
background: #ffcc00;
|
||||
border-color: #ffffff;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
header .header_login {
|
||||
margin-right: 6px;
|
||||
}
|
||||
header .header_login_trigger {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- CORP -->
|
||||
<div class="header_inner corp">
|
||||
<div class="logo_box">
|
||||
<!-- a = 홈페이지 로고 -->
|
||||
<!-- a의 이미지는은 style.css에서 제어하세요 -->
|
||||
<a class="logo" href="/ko/index.html">(주) 바론컨설턴트</a>
|
||||
</div>
|
||||
|
||||
<!-- 오픈메뉴 경우 -->
|
||||
<nav class="nav"></nav>
|
||||
|
||||
<!-- 버튼형 경우 -->
|
||||
<div class="header_R">
|
||||
<a class="header_qa header_qa_button" href="/ko/inquiry.html" aria-label="소프트웨어 문의">
|
||||
<svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="10" /><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3M12 17h.01" /></svg>
|
||||
<span>S/W문의</span>
|
||||
</a>
|
||||
<div class="language">
|
||||
<a href="#" class="on">KR</a>
|
||||
<a href="/en/index.html">EN</a>
|
||||
</div>
|
||||
|
||||
<div class="header_login">
|
||||
<button type="button" class="header_login_trigger" aria-label="로그인" aria-expanded="false" aria-controls="header-login-menu">
|
||||
<img src="/assets/img/ico_user.svg" alt="" />
|
||||
</button>
|
||||
<div class="header_login_menu" id="header-login-menu">
|
||||
<a class="header_login_link" href="../ko/br_future.html">로그인</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn_menu" data-value="sitemap">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="popup_wrap sitemap">
|
||||
<div class="popup_contents_wrap" data-lenis-prevent-wheel>
|
||||
<div class="popup_header">
|
||||
<div class="logo_box">
|
||||
<a class="logo" href="/ko/index.html">(주) 바론컨설턴트</a>
|
||||
</div>
|
||||
<button class="btn_close"><i class="close"></i></button>
|
||||
</div>
|
||||
|
||||
<nav class="nav"></nav>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,58 @@
|
||||
<!-- 비로그인 사용자용 전체 메뉴. 제공서비스와 D/X 체험은 로그인 전까지 비활성화한다. -->
|
||||
<ol>
|
||||
<li class="depth1">
|
||||
<span><em>미래를 설계하는</em>바론 컨설턴트</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/br_future.html">바론이 제시하는 미래</a></li>
|
||||
<li><a href="/ko/br_tech.html">바론이 실현하는 기술</a></li>
|
||||
<li><a href="/ko/br_value.html">바론이 추구하는 가치</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>변화를 선도하는</em>디지털전환</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/dt_explain.html">건설산업에서의 디지털전환</a></li>
|
||||
<li><a href="/ko/dt_sw.html">디지털전환과 소프트웨어</a></li>
|
||||
<li><a href="/ko/dt_use.html">건설산업에서의 디지털전환 활용</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1 nav-login-required" data-login-tooltip="로그인 후 이용할 수 있습니다.">
|
||||
<span><em>가치를 실현하는</em>제공서비스</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/sv_solution.html" data-auth-disabled="true" aria-disabled="true" tabindex="-1">솔루션 프로그램</a></li>
|
||||
<li><a href="/ko/sv_sw.html" data-auth-disabled="true" aria-disabled="true" tabindex="-1">패키지 소프트웨어</a></li>
|
||||
<li><a href="/ko/sv_bigroom.html" data-auth-disabled="true" aria-disabled="true" tabindex="-1">빅룸</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1 nav-login-required" data-login-tooltip="로그인 후 이용할 수 있습니다.">
|
||||
<span><em>비전을 체험하는</em>D/X 체험</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/dx.html" data-auth-disabled="true" aria-disabled="true" tabindex="-1">비전을 체험하는 D/X체험</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>이야기를 전하는</em>홍보센터</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/pr_news.html">바론뉴스</a></li>
|
||||
<li><a href="/ko/pr_brochure.html">브로슈어</a></li>
|
||||
<li><a href="/ko/pr_ci.html">CI</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1 nav-recruit">
|
||||
<span
|
||||
><a href="/recruit/br_recruit.html" target="_blank" rel="noopener noreferrer"
|
||||
><em>관계로 완성되는</em>인재채용<i></i></a
|
||||
></span>
|
||||
<ul class="depth2">
|
||||
<li>
|
||||
<a href="/recruit/br_recruit.html" target="_blank" rel="noopener noreferrer" aria-label="인재채용 바로가기 (새 창)">인재채용 바로가기<i aria-hidden="true"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- <li class="depth1">
|
||||
<span onclick="location.href='../ko/faq.html'"><em>고객지원을 위한</em>FAQ</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/faq.html">자주 묻는 질문</a></li>
|
||||
</ul>
|
||||
</li> -->
|
||||
</ol>
|
||||
@@ -0,0 +1,57 @@
|
||||
<ol>
|
||||
<li class="depth1">
|
||||
<span><em>미래를 설계하는</em>바론 컨설턴트</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/br_future.html">바론이 제시하는 미래</a></li>
|
||||
<li><a href="/ko/br_tech.html">바론이 실현하는 기술</a></li>
|
||||
<li><a href="/ko/br_value.html">바론이 추구하는 가치</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>변화를 선도하는</em>디지털전환</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/dt_explain.html">건설산업에서의 디지털전환</a></li>
|
||||
<li><a href="/ko/dt_sw.html">디지털전환과 소프트웨어</a></li>
|
||||
<li><a href="/ko/dt_use.html">건설산업에서의 디지털전환 활용</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>가치를 실현하는</em>제공서비스</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/sv_solution.html">솔루션 프로그램</a></li>
|
||||
<li><a href="/ko/sv_sw.html">패키지 소프트웨어</a></li>
|
||||
<li><a href="/ko/sv_bigroom.html">빅룸</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>비전을 체험하는</em>D/X 체험</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/dx.html">비전을 체험하는 D/X체험</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1">
|
||||
<span><em>이야기를 전하는</em>홍보센터</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/pr_news.html">바론뉴스</a></li>
|
||||
<li><a href="/ko/pr_brochure.html">브로슈어</a></li>
|
||||
<li><a href="/ko/pr_ci.html">CI</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="depth1 nav-recruit">
|
||||
<span
|
||||
><a href="/recruit/br_recruit.html" target="_blank" rel="noopener noreferrer"
|
||||
><em>관계로 완성되는</em>인재채용<i></i></a
|
||||
></span>
|
||||
<ul class="depth2">
|
||||
<li>
|
||||
<a href="/recruit/br_recruit.html" target="_blank" rel="noopener noreferrer" aria-label="인재채용 바로가기 (새 창)">인재채용 바로가기<i aria-hidden="true"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- <li class="depth1">
|
||||
<span onclick="location.href='../ko/faq.html'"><em>고객지원을 위한</em>FAQ</span>
|
||||
<ul class="depth2">
|
||||
<li><a href="/ko/faq.html">자주 묻는 질문</a></li>
|
||||
</ul>
|
||||
</li> -->
|
||||
</ol>
|
||||
@@ -0,0 +1,542 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/* 공통적용 - 페이지설정 */
|
||||
::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #bbb;
|
||||
background-clip: padding-box;
|
||||
border: 2px solid transparent;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* 공통적용 - 텍스트에 stroke + 쉐도우 */
|
||||
t {
|
||||
color: #fff;
|
||||
text-shadow: var(--text-stroke);
|
||||
filter: drop-shadow(0 0 2px #000);
|
||||
font-weight: 500;
|
||||
}
|
||||
t.t500 {
|
||||
text-shadow: var(--text-stroke500);
|
||||
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4666666667));
|
||||
}
|
||||
t.t100 {
|
||||
text-shadow: var(--text-stroke100);
|
||||
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.2));
|
||||
}
|
||||
t.t400 {
|
||||
-webkit-text-stroke: 1px black;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 공통적용 - 아이콘 관련 i */
|
||||
i {
|
||||
display: block;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
width: 40px;
|
||||
aspect-ratio: 1/1;
|
||||
position: relative;
|
||||
}
|
||||
i::after,
|
||||
i::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
}
|
||||
i.arrow {
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
}
|
||||
i.arrow::after {
|
||||
width: 30%;
|
||||
aspect-ratio: 1/1;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
border: 2px solid #000;
|
||||
border-width: 0 2px 2px 0;
|
||||
}
|
||||
i.arrow.down::after {
|
||||
transform: translate(-50%, -75%) rotate(45deg);
|
||||
}
|
||||
i.arrow.up::after {
|
||||
transform: translate(-50%, -35%) rotate(-135deg);
|
||||
}
|
||||
i.arrow.right::after {
|
||||
transform: translate(-70%, -50%) rotate(-45deg);
|
||||
}
|
||||
i.arrow.left::after {
|
||||
transform: translate(-35%, -50%) rotate(135deg);
|
||||
}
|
||||
i.close::after,
|
||||
i.close::before {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
height: 2px;
|
||||
background-color: black;
|
||||
}
|
||||
i.close::after {
|
||||
transform: translate(-50%, -50%) rotate(-45deg);
|
||||
}
|
||||
i.close::before {
|
||||
transform: translate(-50%, -50%) rotate(45deg);
|
||||
}
|
||||
|
||||
/* --- 화살표 */
|
||||
/* --- 닫기 X */
|
||||
/* 공통적용 - 자세히보기 팝업 popup_wrap */
|
||||
|
||||
.popup_wrap {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background-color: rgba(0, 0, 0, 0.6666666667);
|
||||
overflow: hidden;
|
||||
z-index: 1000;
|
||||
display: none;
|
||||
}
|
||||
.popup_wrap .btn_close {
|
||||
--size-px: 64px;
|
||||
width: var(--size-px);
|
||||
height: var(--size-px);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
right: 24px;
|
||||
}
|
||||
.popup_wrap .btn_close i {
|
||||
width: initial;
|
||||
height: 100%;
|
||||
_opacity: 0.8;
|
||||
}
|
||||
.popup_wrap .btn_close i::after,
|
||||
.popup_wrap .btn_close i::before {
|
||||
background-color: #fff;
|
||||
}
|
||||
.popup_wrap .btn_close:hover i {
|
||||
opacity: 1;
|
||||
}
|
||||
.popup_wrap .popup_contents_wrap {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
text-align: center;
|
||||
-webkit-overflow-scrolling: touch; /* iOS 부드러운 스크롤 */
|
||||
overscroll-behavior: contain; /* 바운스 효과 제한 */
|
||||
}
|
||||
.popup_wrap img {
|
||||
padding: 40px 0;
|
||||
width: 60%;
|
||||
max-width: 920px;
|
||||
min-width: 600px;
|
||||
object-fit: cover;
|
||||
object-position: top center;
|
||||
}
|
||||
|
||||
.popup_wrap .flip_wrap {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
height: auto;
|
||||
top: 50%;
|
||||
translate: 0 -50%;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flipbook {
|
||||
width: 1120px;
|
||||
height: 792px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flipbook::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
transparent 95%,
|
||||
rgba(0, 0, 0, 0.0666666667) 100%
|
||||
);
|
||||
z-index: 1000;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flipbook .page {
|
||||
width: 560px;
|
||||
height: 792px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flipbook .page img {
|
||||
width: 100%;
|
||||
max-height: 100%;
|
||||
height: auto;
|
||||
object-fit: cover;
|
||||
object-position: center;
|
||||
padding: 0;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
translate: -50% -50%;
|
||||
width: 100%;
|
||||
max-width: 1120px;
|
||||
max-height: 792px;
|
||||
height: 100%;
|
||||
z-index: 1001;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls button {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls button:hover::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url(../img/flipbook_corner.png) no-repeat bottom right/50px;
|
||||
filter: drop-shadow(4px 15px 8px rgba(0, 0, 0, 0.6666666667));
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls button:hover::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
background: linear-gradient(
|
||||
105deg,
|
||||
transparent 80%,
|
||||
rgba(0, 0, 0, 0.4666666667) 100%
|
||||
);
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls button:hover:first-child {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
/* 공통 적용 - 인트로 제목 영역 */
|
||||
section.intro .txt_box {
|
||||
width: 100%;
|
||||
margin-bottom: 2.08333%;
|
||||
}
|
||||
section.intro .txt_box .main_txt {
|
||||
/* font-size: clamp(40px, 2.08333vw, 52px);*/
|
||||
font-size: 52px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
section.intro .txt_box .eng_txt {
|
||||
font-size: clamp(20px, 1.02vw, 24px);
|
||||
font-size: 24px;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
section.intro .txt_box .sub_txt {
|
||||
font-size: clamp(16px, 0.8333vw, 20px);
|
||||
font-size: 20px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
/* 공통적용 - 중제목 영역 txt_box */
|
||||
|
||||
.txt_box {
|
||||
text-align: center;
|
||||
}
|
||||
.txt_box p {
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
}
|
||||
.txt_box.dark p:not(.eng_txt) {
|
||||
color: #000;
|
||||
}
|
||||
.txt_box .eng_txt {
|
||||
color: #00a6ff;
|
||||
font-size: 20px;
|
||||
line-height: 33px;
|
||||
}
|
||||
.txt_box .main_txt {
|
||||
font-size: 40px;
|
||||
}
|
||||
.txt_box .sub_txt {
|
||||
margin-top: 40px;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.con_txt {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 40px;
|
||||
font-size: 18px;
|
||||
line-height: 180%;
|
||||
}
|
||||
|
||||
.con_txt p {
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
word-break: keep-all;
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
.con_txt p b {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
button.btn_more {
|
||||
position: relative;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
padding: 8px 0;
|
||||
border-bottom: 2px solid rgba(0, 0, 0, 0.4);
|
||||
letter-spacing: -0.06em;
|
||||
width: max-content;
|
||||
margin-top: 24px;
|
||||
}
|
||||
button.btn_more::after {
|
||||
content: "";
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
background-image: url(../img/ico_more.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
margin-left: 6px;
|
||||
translate: 0 2px;
|
||||
}
|
||||
button.btn_more:hover {
|
||||
color: var(--color-primary);
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
button.btn_more:hover::after {
|
||||
background-image: url(../img/ico_more_hover.svg);
|
||||
}
|
||||
|
||||
/* 공통적용 - 인트로 스크롤 박스 scroll_box */
|
||||
.scroll_box {
|
||||
width: max-content;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 24px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
translate: -50% 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
.scroll_box > div {
|
||||
width: 2px;
|
||||
height: 140px;
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.scroll_box > div::before {
|
||||
content: " ";
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 0 0 4px 4px;
|
||||
background-color: #fff;
|
||||
animation: scroll-down 2s infinite ease-in-out;
|
||||
}
|
||||
|
||||
@keyframes scroll-down {
|
||||
0% {
|
||||
transform-origin: 50% 100%;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
50% {
|
||||
transform-origin: 50% 100%;
|
||||
transform: scaleY(0);
|
||||
}
|
||||
50.1% {
|
||||
transform-origin: 50% 0;
|
||||
transform: scaleY(0);
|
||||
}
|
||||
to {
|
||||
transform-origin: 50% 0;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
}
|
||||
/* 공통적용 - 체크박스 */
|
||||
label.checkbox {
|
||||
display: inline-flex;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
cursor: pointer;
|
||||
}
|
||||
label.checkbox input[type="checkbox"] {
|
||||
display: block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
||||
background: #fff;
|
||||
appearance: none;
|
||||
}
|
||||
label.checkbox input[type="checkbox"]:checked {
|
||||
background-color: var(--color-primary);
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.3654 4.23423C13.5154 4.38425 13.5997 4.5877 13.5997 4.79983C13.5997 5.01196 13.5154 5.21541 13.3654 5.36543L6.96544 11.7654C6.81542 11.9154 6.61197 11.9997 6.39984 11.9997C6.18771 11.9997 5.98426 11.9154 5.83424 11.7654L2.63424 8.56543C2.48851 8.41455 2.40788 8.21247 2.4097 8.00271C2.41152 7.79295 2.49566 7.5923 2.64398 7.44397C2.79231 7.29565 2.99296 7.21151 3.20272 7.20969C3.41247 7.20787 3.61456 7.2885 3.76544 7.43423L6.39984 10.0686L12.2342 4.23423C12.3843 4.08425 12.5877 4 12.7998 4C13.012 4 13.2154 4.08425 13.3654 4.23423Z' fill='white'/%3E%3C/svg%3E");
|
||||
background-size: 16px;
|
||||
background-position: center;
|
||||
}
|
||||
label.checkbox span {
|
||||
display: inline-flex;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 1.4;
|
||||
letter-spacing: -0.32px;
|
||||
}
|
||||
label.checkbox span .en {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.blind {
|
||||
text-indent: -9999px;
|
||||
color: transparent;
|
||||
font-size: 1px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* --------------------------------- */
|
||||
/* ! 인트로 */
|
||||
/* --------------------------------- */
|
||||
section.intro {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
section.intro .video_bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
section.intro .video_bg video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
section.intro .txt_box .eng_txt {
|
||||
color: #00a6ff;
|
||||
}
|
||||
|
||||
.m_br {
|
||||
display: none;
|
||||
}
|
||||
.pc_br {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 아이콘 */
|
||||
.ico_back {
|
||||
width: 22px;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='20' viewBox='0 0 21 20' fill='none'%3E%3Cpath d='M3.14633 9.41169C2.99011 9.56796 2.90234 9.77988 2.90234 10.0009C2.90234 10.2218 2.99011 10.4337 3.14633 10.59L7.8605 15.3042C7.93737 15.3838 8.02933 15.4473 8.131 15.4909C8.23267 15.5346 8.34202 15.5576 8.45266 15.5586C8.56331 15.5595 8.67305 15.5384 8.77546 15.4965C8.87787 15.4546 8.97092 15.3928 9.04916 15.3145C9.12741 15.2363 9.18928 15.1432 9.23118 15.0408C9.27308 14.9384 9.29417 14.8287 9.29321 14.718C9.29225 14.6074 9.26926 14.498 9.22558 14.3963C9.18191 14.2947 9.11842 14.2027 9.03883 14.1259L5.74717 10.8342L16.783 10.8342C17.004 10.8342 17.216 10.7464 17.3723 10.5901C17.5285 10.4338 17.6163 10.2219 17.6163 10.0009C17.6163 9.77984 17.5285 9.56788 17.3723 9.4116C17.216 9.25532 17.004 9.16752 16.783 9.16752L5.74717 9.16752L9.03883 5.87585C9.19063 5.71868 9.27463 5.50818 9.27273 5.28968C9.27083 5.07119 9.18319 4.86218 9.02868 4.70767C8.87417 4.55316 8.66516 4.46552 8.44667 4.46362C8.22817 4.46173 8.01767 4.54572 7.8605 4.69752L3.14633 9.41169Z' fill='black'/%3E%3C/svg%3E");
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20px;
|
||||
}
|
||||
.ico_list {
|
||||
width: 22px;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='16' viewBox='0 0 17 16' fill='none'%3E%3Cpath d='M4.11719 8H10.1172M4.11719 5.5H10.1172M11.1172 5.5H12.1172M11.1172 8H12.1172M11.1172 10.5H12.1172M4.11719 10.5H10.1172M2.61719 2.5H13.6172V13.5H2.61719V2.5Z' stroke='black' stroke-linejoin='round'/%3E%3C/svg%3E");
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 16px;
|
||||
}
|
||||
|
||||
/* media query */
|
||||
@media all and (max-width: 1400px) {
|
||||
.m_br {
|
||||
display: block;
|
||||
}
|
||||
.pc_br {
|
||||
display: none;
|
||||
}
|
||||
|
||||
section.intro .txt_box .main_txt {
|
||||
font-size: clamp(32px, 8.8888vw, 52px);
|
||||
}
|
||||
|
||||
section.intro .txt_box .eng_txt {
|
||||
font-size: clamp(14px, 3.8888vw, 24px);
|
||||
}
|
||||
section.intro .txt_box .sub_txt {
|
||||
font-size: clamp(14px, 3.8888vw, 20px);
|
||||
}
|
||||
|
||||
.txt_box .eng_txt {
|
||||
color: #006aff;
|
||||
font-size: clamp(12px, 3.3333vw, 20px);
|
||||
line-height: 1.4;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.txt_box .main_txt {
|
||||
font-size: clamp(24px, 6.6666vw, 40px);
|
||||
line-height: 1.4;
|
||||
}
|
||||
.txt_box .sub_txt {
|
||||
margin-top: 40px;
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
button.btn_more {
|
||||
font-size: clamp(12px, 3.33333vw, 18px);
|
||||
}
|
||||
button.btn_more::after {
|
||||
min-width: 12px;
|
||||
width: 3.33333vw;
|
||||
max-width: 18px;
|
||||
min-height: 12px;
|
||||
height: 3.33333vw;
|
||||
max-height: 18px;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
.popup_wrap img {
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
min-width: auto;
|
||||
}
|
||||
}
|
||||
@media all and (max-width: 576px) {
|
||||
.scroll_box > div {
|
||||
width: 1px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,594 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
body:has(.container.sv.sw) header .header_inner {
|
||||
width: min(1760px, calc(100% - 48px));
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
header .header_inner .header_R {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
gap: 0;
|
||||
min-width: max-content;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
header .header_inner .header_R .language {
|
||||
display: inline-flex !important;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap !important;
|
||||
flex-shrink: 0 !important;
|
||||
width: max-content;
|
||||
min-width: 74px;
|
||||
white-space: nowrap !important;
|
||||
writing-mode: horizontal-tb;
|
||||
}
|
||||
|
||||
header .header_inner .header_R .language::before {
|
||||
flex: 0 0 16px;
|
||||
}
|
||||
|
||||
header .header_inner .header_R .language a {
|
||||
display: inline-flex !important;
|
||||
align-items: center;
|
||||
white-space: nowrap !important;
|
||||
flex: 0 0 auto !important;
|
||||
writing-mode: horizontal-tb;
|
||||
}
|
||||
|
||||
header .header_inner .header_R .language a:first-child::after {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
/* 공통적용 - 페이지설정 */
|
||||
::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #bbb;
|
||||
background-clip: padding-box;
|
||||
border: 2px solid transparent;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* 공통적용 - 텍스트에 stroke + 쉐도우 */
|
||||
t {
|
||||
color: #fff;
|
||||
text-shadow: var(--text-stroke);
|
||||
filter: drop-shadow(0 0 2px #000);
|
||||
font-weight: 500;
|
||||
}
|
||||
t.t500 {
|
||||
text-shadow: var(--text-stroke500);
|
||||
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4666666667));
|
||||
}
|
||||
t.t100 {
|
||||
text-shadow: var(--text-stroke100);
|
||||
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.2));
|
||||
}
|
||||
t.t400 {
|
||||
-webkit-text-stroke: 1px black;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 공통적용 - 아이콘 관련 i */
|
||||
i {
|
||||
display: block;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
width: 40px;
|
||||
aspect-ratio: 1/1;
|
||||
position: relative;
|
||||
}
|
||||
i::after,
|
||||
i::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
}
|
||||
i.arrow {
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
}
|
||||
i.arrow::after {
|
||||
width: 30%;
|
||||
aspect-ratio: 1/1;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
border: 2px solid #000;
|
||||
border-width: 0 2px 2px 0;
|
||||
}
|
||||
i.arrow.down::after {
|
||||
transform: translate(-50%, -75%) rotate(45deg);
|
||||
}
|
||||
i.arrow.up::after {
|
||||
transform: translate(-50%, -35%) rotate(-135deg);
|
||||
}
|
||||
i.arrow.right::after {
|
||||
transform: translate(-70%, -50%) rotate(-45deg);
|
||||
}
|
||||
i.arrow.left::after {
|
||||
transform: translate(-35%, -50%) rotate(135deg);
|
||||
}
|
||||
i.close::after,
|
||||
i.close::before {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
height: 2px;
|
||||
background-color: black;
|
||||
}
|
||||
i.close::after {
|
||||
transform: translate(-50%, -50%) rotate(-45deg);
|
||||
}
|
||||
i.close::before {
|
||||
transform: translate(-50%, -50%) rotate(45deg);
|
||||
}
|
||||
|
||||
/* --- 화살표 */
|
||||
/* --- 닫기 X */
|
||||
/* 공통적용 - 자세히보기 팝업 popup_wrap */
|
||||
|
||||
.popup_wrap {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background-color: rgba(0, 0, 0, 0.6666666667);
|
||||
overflow: hidden;
|
||||
z-index: 1000;
|
||||
display: none;
|
||||
}
|
||||
.popup_wrap .btn_close {
|
||||
--size-px: 64px;
|
||||
width: var(--size-px);
|
||||
height: var(--size-px);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
right: 24px;
|
||||
}
|
||||
.popup_wrap .btn_close i {
|
||||
width: initial;
|
||||
height: 100%;
|
||||
_opacity: 0.8;
|
||||
}
|
||||
.popup_wrap .btn_close i::after,
|
||||
.popup_wrap .btn_close i::before {
|
||||
background-color: #fff;
|
||||
}
|
||||
.popup_wrap .btn_close:hover i {
|
||||
opacity: 1;
|
||||
}
|
||||
.popup_wrap .popup_contents_wrap {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
text-align: center;
|
||||
-webkit-overflow-scrolling: touch; /* iOS 부드러운 스크롤 */
|
||||
overscroll-behavior: contain; /* 바운스 효과 제한 */
|
||||
}
|
||||
.popup_wrap img {
|
||||
padding: 80px 0;
|
||||
width: 60%;
|
||||
max-width: 920px;
|
||||
min-width: 600px;
|
||||
object-fit: cover;
|
||||
object-position: top center;
|
||||
}
|
||||
|
||||
.popup_wrap .flip_wrap {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
height: auto;
|
||||
top: 50%;
|
||||
translate: 0 -50%;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flipbook {
|
||||
width: 1120px;
|
||||
height: 792px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flipbook::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
transparent 95%,
|
||||
rgba(0, 0, 0, 0.0666666667) 100%
|
||||
);
|
||||
z-index: 1000;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flipbook .page {
|
||||
width: 560px;
|
||||
height: 792px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flipbook .page img {
|
||||
width: 100%;
|
||||
max-height: 100%;
|
||||
height: auto;
|
||||
object-fit: cover;
|
||||
object-position: center;
|
||||
padding: 0;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
translate: -50% -50%;
|
||||
width: 100%;
|
||||
max-width: 1120px;
|
||||
max-height: 792px;
|
||||
height: 100%;
|
||||
z-index: 1001;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls button {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls button:hover::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url(../../img/flipbook_corner.png) no-repeat bottom right/50px;
|
||||
filter: drop-shadow(4px 15px 8px rgba(0, 0, 0, 0.6666666667));
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls button:hover::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
background: linear-gradient(
|
||||
105deg,
|
||||
transparent 80%,
|
||||
rgba(0, 0, 0, 0.4666666667) 100%
|
||||
);
|
||||
}
|
||||
.popup_wrap .flip_wrap .flip-controls button:hover:first-child {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
/* 공통 적용 - 인트로 제목 영역 */
|
||||
section.intro .txt_box {
|
||||
width: 100%;
|
||||
margin-bottom: 2.08333%;
|
||||
}
|
||||
section.intro .txt_box .main_txt {
|
||||
/* font-size: clamp(40px, 2.08333vw, 52px);*/
|
||||
font-size: 52px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
section.intro .txt_box .eng_txt {
|
||||
font-size: clamp(20px, 1.02vw, 24px);
|
||||
font-size: 24px;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
section.intro .txt_box .sub_txt {
|
||||
font-size: clamp(16px, 0.8333vw, 20px);
|
||||
font-size: 20px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
/* 공통적용 - 중제목 영역 txt_box */
|
||||
|
||||
.txt_box {
|
||||
text-align: center;
|
||||
}
|
||||
.txt_box p {
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
}
|
||||
.txt_box.dark p:not(.eng_txt) {
|
||||
color: #000;
|
||||
}
|
||||
.txt_box .eng_txt {
|
||||
color: #00a6ff;
|
||||
font-size: 20px;
|
||||
line-height: 33px;
|
||||
}
|
||||
.txt_box .main_txt {
|
||||
font-size: 40px;
|
||||
}
|
||||
.txt_box .sub_txt {
|
||||
margin-top: 40px;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.con_txt {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 40px;
|
||||
font-size: 18px;
|
||||
line-height: 180%;
|
||||
}
|
||||
|
||||
.con_txt p {
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
word-break: keep-all;
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
.con_txt p b {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
button.btn_more {
|
||||
position: relative;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
padding: 8px 0;
|
||||
border-bottom: 2px solid rgba(0, 0, 0, 0.4);
|
||||
letter-spacing: -0.06em;
|
||||
width: max-content;
|
||||
margin-top: 24px;
|
||||
}
|
||||
button.btn_more::after {
|
||||
content: "";
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
background-image: url(../../img/ico_more.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
margin-left: 6px;
|
||||
translate: 0 2px;
|
||||
}
|
||||
button.btn_more:hover {
|
||||
color: var(--color-primary);
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
button.btn_more:hover::after {
|
||||
background-image: url(../../img/ico_more_hover.svg);
|
||||
}
|
||||
|
||||
/* 공통적용 - 인트로 스크롤 박스 scroll_box */
|
||||
.scroll_box {
|
||||
width: max-content;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 24px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
translate: -50% 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
.scroll_box > div {
|
||||
width: 2px;
|
||||
height: 140px;
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.scroll_box > div::before {
|
||||
content: " ";
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 0 0 4px 4px;
|
||||
background-color: #fff;
|
||||
animation: scroll-down 2s infinite ease-in-out;
|
||||
}
|
||||
|
||||
@keyframes scroll-down {
|
||||
0% {
|
||||
transform-origin: 50% 100%;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
50% {
|
||||
transform-origin: 50% 100%;
|
||||
transform: scaleY(0);
|
||||
}
|
||||
50.1% {
|
||||
transform-origin: 50% 0;
|
||||
transform: scaleY(0);
|
||||
}
|
||||
to {
|
||||
transform-origin: 50% 0;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
}
|
||||
/* 공통적용 - 체크박스 */
|
||||
label.checkbox {
|
||||
display: inline-flex;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
cursor: pointer;
|
||||
}
|
||||
label.checkbox input[type="checkbox"] {
|
||||
display: block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
||||
background: #fff;
|
||||
appearance: none;
|
||||
}
|
||||
label.checkbox input[type="checkbox"]:checked {
|
||||
background-color: var(--color-primary);
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.3654 4.23423C13.5154 4.38425 13.5997 4.5877 13.5997 4.79983C13.5997 5.01196 13.5154 5.21541 13.3654 5.36543L6.96544 11.7654C6.81542 11.9154 6.61197 11.9997 6.39984 11.9997C6.18771 11.9997 5.98426 11.9154 5.83424 11.7654L2.63424 8.56543C2.48851 8.41455 2.40788 8.21247 2.4097 8.00271C2.41152 7.79295 2.49566 7.5923 2.64398 7.44397C2.79231 7.29565 2.99296 7.21151 3.20272 7.20969C3.41247 7.20787 3.61456 7.2885 3.76544 7.43423L6.39984 10.0686L12.2342 4.23423C12.3843 4.08425 12.5877 4 12.7998 4C13.012 4 13.2154 4.08425 13.3654 4.23423Z' fill='white'/%3E%3C/svg%3E");
|
||||
background-size: 16px;
|
||||
background-position: center;
|
||||
}
|
||||
label.checkbox span {
|
||||
display: inline-flex;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 1.4;
|
||||
letter-spacing: -0.32px;
|
||||
}
|
||||
label.checkbox span .en {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.blind {
|
||||
text-indent: -9999px;
|
||||
color: transparent;
|
||||
font-size: 1px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* --------------------------------- */
|
||||
/* ! 인트로 */
|
||||
/* --------------------------------- */
|
||||
section.intro {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
section.intro .video_bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
section.intro .video_bg video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
section.intro .txt_box .eng_txt {
|
||||
color: #00a6ff;
|
||||
}
|
||||
|
||||
.m_br {
|
||||
display: none;
|
||||
}
|
||||
.pc_br {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 아이콘 */
|
||||
.ico_back {
|
||||
width: 22px;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='20' viewBox='0 0 21 20' fill='none'%3E%3Cpath d='M3.14633 9.41169C2.99011 9.56796 2.90234 9.77988 2.90234 10.0009C2.90234 10.2218 2.99011 10.4337 3.14633 10.59L7.8605 15.3042C7.93737 15.3838 8.02933 15.4473 8.131 15.4909C8.23267 15.5346 8.34202 15.5576 8.45266 15.5586C8.56331 15.5595 8.67305 15.5384 8.77546 15.4965C8.87787 15.4546 8.97092 15.3928 9.04916 15.3145C9.12741 15.2363 9.18928 15.1432 9.23118 15.0408C9.27308 14.9384 9.29417 14.8287 9.29321 14.718C9.29225 14.6074 9.26926 14.498 9.22558 14.3963C9.18191 14.2947 9.11842 14.2027 9.03883 14.1259L5.74717 10.8342L16.783 10.8342C17.004 10.8342 17.216 10.7464 17.3723 10.5901C17.5285 10.4338 17.6163 10.2219 17.6163 10.0009C17.6163 9.77984 17.5285 9.56788 17.3723 9.4116C17.216 9.25532 17.004 9.16752 16.783 9.16752L5.74717 9.16752L9.03883 5.87585C9.19063 5.71868 9.27463 5.50818 9.27273 5.28968C9.27083 5.07119 9.18319 4.86218 9.02868 4.70767C8.87417 4.55316 8.66516 4.46552 8.44667 4.46362C8.22817 4.46173 8.01767 4.54572 7.8605 4.69752L3.14633 9.41169Z' fill='black'/%3E%3C/svg%3E");
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20px;
|
||||
}
|
||||
.ico_list {
|
||||
width: 22px;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='16' viewBox='0 0 17 16' fill='none'%3E%3Cpath d='M4.11719 8H10.1172M4.11719 5.5H10.1172M11.1172 5.5H12.1172M11.1172 8H12.1172M11.1172 10.5H12.1172M4.11719 10.5H10.1172M2.61719 2.5H13.6172V13.5H2.61719V2.5Z' stroke='black' stroke-linejoin='round'/%3E%3C/svg%3E");
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 16px;
|
||||
}
|
||||
|
||||
/* media query */
|
||||
@media all and (max-width: 1400px) {
|
||||
|
||||
.map_list li{ font-size: 12px;}
|
||||
|
||||
.m_br {
|
||||
display: block;
|
||||
}
|
||||
.pc_br {
|
||||
display: none;
|
||||
}
|
||||
|
||||
section.intro .txt_box .main_txt {
|
||||
width: 95%; margin: 0 auto; font-size: clamp(32px, 7.6vw, 52px);
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
section.intro .txt_box .eng_txt {
|
||||
font-size: clamp(14px, 3.8888vw, 24px);
|
||||
word-break: break-word;
|
||||
}
|
||||
section.intro .txt_box .sub_txt {
|
||||
font-size: clamp(14px, 3.8888vw, 20px);
|
||||
width: 95%;
|
||||
margin: 0 auto;
|
||||
word-break: break-word;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.txt_box .eng_txt {
|
||||
color: #006aff;
|
||||
font-size: clamp(12px, 3.3333vw, 20px);
|
||||
line-height: 1.4;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.txt_box .main_txt {
|
||||
font-size: clamp(24px, 6vw, 40px);
|
||||
line-height: 1.4;
|
||||
margin: 0 auto;
|
||||
word-break: break-word;
|
||||
}
|
||||
.txt_box .sub_txt {
|
||||
margin-top: 40px;
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
button.btn_more {
|
||||
font-size: clamp(12px, 3.33333vw, 18px);
|
||||
}
|
||||
button.btn_more::after {
|
||||
min-width: 12px;
|
||||
width: 3.33333vw;
|
||||
max-width: 18px;
|
||||
min-height: 12px;
|
||||
height: 3.33333vw;
|
||||
max-height: 18px;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
.popup_wrap img {
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
min-width: auto;
|
||||
}
|
||||
}
|
||||
@media all and (max-width: 576px) {
|
||||
.scroll_box > div {
|
||||
width: 1px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,129 @@
|
||||
@charset "utf-8";
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "Noto Sans KR";
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
src: local("NotoKR-Thin"),
|
||||
url(../font/NotoKR-Thin/notokr-thin.woff2) format("woff2"),
|
||||
url(../font/NotoKR-Thin/notokr-thin.woff) format("woff"),
|
||||
url(../font/NotoKR-Thin/notokr-thin.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "Noto Sans KR";
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: local("NotoKR-Light"),
|
||||
url(../font/NotoKR-Light/notokr-light.woff2) format("woff2"),
|
||||
url(../font/NotoKR-Light/notokr-light.woff) format("woff"),
|
||||
url(../font/NotoKR-Light/notokr-light.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "Noto Sans KR";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local("NotoKR-Regular"),
|
||||
url(../font/NotoKR-Regular/notokr-regular.woff2) format("woff2"),
|
||||
url(../font/NotoKR-Regular/notokr-regular.woff) format("woff"),
|
||||
url(../font/NotoKR-Regular/notokr-regular.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "Noto Sans KR";
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: local("NotoKR-Medium"),
|
||||
url(../font/NotoKR-Medium/notokr-medium.woff2) format("woff2"),
|
||||
url(../font/NotoKR-Medium/notokr-medium.woff) format("woff"),
|
||||
url(../font/NotoKR-Medium/notokr-medium.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "Noto Sans KR";
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local("NotoKR-Bold"),
|
||||
url(../font/NotoKR-Bold/notokr-bold.woff2) format("woff2"),
|
||||
url(../font/NotoKR-Bold/notokr-bold.woff) format("woff"),
|
||||
url(../font/NotoKR-Bold/notokr-bold.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "Noto Sans KR";
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
src: local("NotoKR-Black"),
|
||||
url(../font/NotoKR-Black/notokr-black.woff2) format("woff2"),
|
||||
url(../font/NotoKR-Black/notokr-black.woff) format("woff"),
|
||||
url(../font/NotoKR-Black/notokr-black.otf) format("opentype");
|
||||
}
|
||||
|
||||
/* 나눔스퀘어 네오 */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "NanumSquare Neo";
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: local("NanumSquareNeo-Light"),
|
||||
url(../font/NanumSquareNeo-Light/NanumSquareNeoTTF-aLt.woff2)
|
||||
format("woff2"),
|
||||
url(../font/NanumSquareNeo-Light/NanumSquareNeoTTF-aLt.woff)
|
||||
format("woff"),
|
||||
url(../font/NanumSquareNeo-Light/NanumSquareNeoOTF-Lt.otf)
|
||||
format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "NanumSquare Neo";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local("NanumSquareNeo-Regular"),
|
||||
url(../font/NanumSquareNeo-Regular/NanumSquareNeoTTF-bRg.woff2)
|
||||
format("woff2"),
|
||||
url(../font/NanumSquareNeo-Regular/NanumSquareNeoTTF-bRg.woff)
|
||||
format("woff"),
|
||||
url(../font/NanumSquareNeo-Regular/NanumSquareNeoOTF-Rg.otf)
|
||||
format("opentype");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "NanumSquare Neo";
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local("NanumSquareNeo-Bold"),
|
||||
url(../font/NanumSquareNeo-Bold/NanumSquareNeoTTF-cBd.woff2)
|
||||
format("woff2"),
|
||||
url(../font/NanumSquareNeo-Bold/NanumSquareNeoTTF-cBd.woff)
|
||||
format("woff"),
|
||||
url(../font/NanumSquareNeo-Bold/NanumSquareNeoOTF-Bd.otf)
|
||||
format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "NanumSquare Neo";
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
src: local("NanumSquareNeo-ExtraBold"),
|
||||
url(../font/NanumSquareNeo-ExtraBold/NanumSquareNeoTTF-dEb.woff2)
|
||||
format("woff2"),
|
||||
url(../font/NanumSquareNeo-ExtraBold/NanumSquareNeoTTF-dEb.woff)
|
||||
format("woff"),
|
||||
url(../font/NanumSquareNeo-ExtraBold/NanumSquareNeoOTF-Eb.otf)
|
||||
format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: "NanumSquare Neo";
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
src: local("NanumSquareNeo-Heavy"),
|
||||
url(../font/NanumSquareNeo-Heavy/NanumSquareNeoTTF-eHv.woff2)
|
||||
format("woff2"),
|
||||
url(../font/NanumSquareNeo-Heavy/NanumSquareNeoTTF-eHv.woff)
|
||||
format("woff"),
|
||||
url(../font/NanumSquareNeo-Heavy/NanumSquareNeoOTF-Hv.otf)
|
||||
format("opentype");
|
||||
}
|
||||
@@ -0,0 +1,183 @@
|
||||
.inquiry-page { --inquiry-blue: #164b91; --inquiry-dark: #26374f; --inquiry-soft: #edf2f6; padding-top: 92px; color: #202a38; }
|
||||
.inquiry-page *, .inquiry-dialog * { box-sizing: border-box; }
|
||||
.inquiry-page button, .inquiry-dialog button { font: inherit; }
|
||||
.inquiry-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip-path: inset(50%); white-space: nowrap; }
|
||||
.inquiry-page :focus-visible, .inquiry-dialog :focus-visible { outline: 2px solid #0c367f; outline-offset: 3px; }
|
||||
.inquiry-page input, .inquiry-dialog input, .inquiry-dialog textarea { user-select: text; }
|
||||
.inquiry-hero { --inquiry-hero-shade: transparent; height: 480px; position: relative; background: #0b2743 linear-gradient(var(--inquiry-hero-shade), var(--inquiry-hero-shade)) center / cover no-repeat; background-image: linear-gradient(var(--inquiry-hero-shade), var(--inquiry-hero-shade)), url(../img/inquiry-hero.webp); }
|
||||
.inquiry-hero__copy { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; text-align: center; padding: 40px 24px; }
|
||||
.inquiry-hero h1 { font-size: 70px; font-weight: 700; line-height: 1.4; letter-spacing: -0.04em; }
|
||||
.inquiry-hero p { font-size: 22px; line-height: 1.6; }
|
||||
.inquiry-workspace { position: relative; z-index: 1; width: min(1248px, 100%); padding: 0 24px; margin: -98px auto 120px; }
|
||||
.inquiry-tabs-shell { --inquiry-tab-curve: 28px; padding: 19px 32px 0; border-radius: 48px 48px 0 0; background: linear-gradient(180deg, #174b64a6, #082f43d9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: inset 0 1px 0 #74c7f4b3, inset 0 0 0 1px #5fadd666, inset 0 8px 16px #ffffff12, 0 -18px 12px #0a2f4843; }
|
||||
.inquiry-tabs { display: flex; gap: 60px; position: relative; isolation: isolate; }
|
||||
.inquiry-tabs button { position: relative; flex: 1; min-width: 0; min-height: 76px; padding: 8px 12px 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border: 0; border-radius: 34px 34px 0 0; color: #b9d4e0a6; background: transparent; cursor: pointer; transition: background-color 0.2s ease, color 0.2s ease; }
|
||||
.inquiry-tabs button:not([aria-selected="true"]):hover { color: #d6f0ff; background: #ffffff12; }
|
||||
.inquiry-tabs [aria-selected="true"] { z-index: 1; color: #00a2ef; background: linear-gradient(180deg, #e8f8ff 0%, #fff 58%); box-shadow: inset 0 2px 0 #ffffffb3, 0 -3px 10px #163f5b08; }
|
||||
/* Concave lower corners join the selected tab to the white board beneath it. */
|
||||
.inquiry-tabs [aria-selected="true"]::before,
|
||||
.inquiry-tabs [aria-selected="true"]::after { content: ""; position: absolute; bottom: 0; width: var(--inquiry-tab-curve); height: var(--inquiry-tab-curve); pointer-events: none; }
|
||||
.inquiry-tabs [aria-selected="true"]::before { left: calc(-1 * var(--inquiry-tab-curve)); background: radial-gradient(circle at 0 0, transparent calc(var(--inquiry-tab-curve) - 0.5px), #fff var(--inquiry-tab-curve)); }
|
||||
.inquiry-tabs [aria-selected="true"]::after { right: calc(-1 * var(--inquiry-tab-curve)); background: radial-gradient(circle at 100% 0, transparent calc(var(--inquiry-tab-curve) - 0.5px), #fff var(--inquiry-tab-curve)); }
|
||||
.inquiry-tab-logo { width: 156px; max-width: 94%; height: 33px; display: flex; align-items: center; justify-content: center; }
|
||||
.inquiry-tab-logo img { display: block; max-width: 100%; max-height: 33px; object-fit: contain; opacity: 0.48; filter: brightness(0) invert(1); transition: opacity 0.2s ease; }
|
||||
.inquiry-tabs [aria-selected="true"] .inquiry-tab-logo img { opacity: 1; filter: none; }
|
||||
.inquiry-tabs button:not([aria-selected="true"]):hover .inquiry-tab-logo img { opacity: 0.8; }
|
||||
.inquiry-tab-description { font-size: 16px; line-height: 1.5; font-weight: 500; letter-spacing: -0.02em; white-space: nowrap; }
|
||||
.inquiry-board { padding: 72px 6px 0; background: #fff; }
|
||||
.inquiry-board__heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 28px; }
|
||||
.inquiry-board h2 { font-size: 24px; line-height: 1.5; font-weight: 600; text-align: left; word-break: keep-all; }
|
||||
.inquiry-remote { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; border: 1px solid #c8d9ef; border-radius: 999px; color: var(--inquiry-blue); background: #fff; font-size: 14px; font-weight: 600; line-height: 1.4; white-space: nowrap; transition: background-color 0.2s ease; }
|
||||
.inquiry-remote:hover { background: #f0f5fc; }
|
||||
.inquiry-remote svg { width: 20px; height: 20px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
|
||||
.inquiry-controls { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-bottom: 28px; }
|
||||
.inquiry-filters { display: flex; align-items: center; gap: 24px; flex-shrink: 0; }
|
||||
.inquiry-categories { display: flex; gap: 6px; border: 0; }
|
||||
.inquiry-categories label { position: relative; cursor: pointer; }
|
||||
.inquiry-categories input { position: absolute; width: 1px; height: 1px; opacity: 0; }
|
||||
.inquiry-categories span { display: flex; align-items: center; justify-content: center; height: 44px; min-width: 60px; padding: 0 16px; border-radius: 999px; color: #758094; font-size: 15px; }
|
||||
.inquiry-categories label:hover span { background: var(--inquiry-soft); }
|
||||
.inquiry-categories input:checked + span { color: var(--inquiry-blue); background: #edf3fd; font-weight: 700; }
|
||||
.inquiry-categories input:focus-visible + span { outline: 2px solid #0c367f; outline-offset: 3px; }
|
||||
.inquiry-mine { display: inline-flex; align-items: center; gap: 8px; color: #697386; font-size: 13px; white-space: nowrap; cursor: pointer; }
|
||||
.inquiry-mine input { appearance: auto; width: 16px; height: 16px; accent-color: var(--inquiry-blue); }
|
||||
.inquiry-search { width: min(360px, 100%); display: flex; align-items: center; gap: 8px; padding: 0 6px 0 20px; border: 1px solid #e6e9ed; border-radius: 999px; background: #f7f8fa; }
|
||||
.inquiry-search input { flex: 1; min-width: 0; width: 100%; height: 44px; border: 0; padding: 0; color: #273448; font-size: 14px; background: transparent; }
|
||||
.inquiry-search input::placeholder { color: #9aa2b0; }
|
||||
.inquiry-search:focus-within { outline: 2px solid #528bdc; outline-offset: 2px; }
|
||||
.inquiry-search input:focus { outline: none; }
|
||||
.inquiry-search-button { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 36px; height: 36px; border: 0; border-radius: 50%; color: #35445b; background: transparent; cursor: pointer; }
|
||||
.inquiry-search-button:hover { background: #e9eef6; }
|
||||
.inquiry-search-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
|
||||
.inquiry-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 45px; padding: 0 20px; border: 1px solid transparent; border-radius: 3px; background: #27241d; color: #fff; font-size: 16px !important; font-weight: 700 !important; white-space: nowrap; cursor: pointer; }
|
||||
.inquiry-button:hover { background: #454035; }
|
||||
.inquiry-button svg { width: 18px; height: 18px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
|
||||
.inquiry-table-scroll { overflow-x: auto; scrollbar-width: thin; }
|
||||
.inquiry-scroll-hint { display: none; }
|
||||
.inquiry-table { table-layout: fixed; min-width: 1024px; width: 100%; font-size: 16px; }
|
||||
.inquiry-table .col-number { width: 5%; }
|
||||
.inquiry-table .col-category { width: 8%; }
|
||||
.inquiry-table .col-company, .inquiry-table .col-team { width: 11%; }
|
||||
.inquiry-table .col-author { width: 8%; }
|
||||
.inquiry-table .col-date { width: 10%; }
|
||||
.inquiry-table .col-status { width: 9%; }
|
||||
.inquiry-table th { height: 48px; color: #657083; border-top: 1.5px solid var(--inquiry-dark); border-bottom: 1px solid #e5e9ef; font-weight: 500; text-align: center; white-space: nowrap; }
|
||||
.inquiry-table td { height: 60px; padding: 0 10px; text-align: center; color: #555; border-bottom: 1px solid #eee; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.inquiry-table .inquiry-notice { background: #f6f8fc; font-weight: 500; }
|
||||
.inquiry-notice .inquiry-subject { color: var(--inquiry-blue); }
|
||||
.inquiry-table tbody tr:hover { background: #fafafa; }
|
||||
.inquiry-table .inquiry-subject { text-align: left; }
|
||||
.inquiry-subject button { display: flex; align-items: center; gap: 6px; width: 100%; color: inherit; text-align: left; }
|
||||
.inquiry-subject button:hover { color: #08734c; }
|
||||
.inquiry-subject button > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.inquiry-comments { display: inline-flex; align-items: center; gap: 2px; color: #008cff; font-size: 14px; font-weight: 700; flex-shrink: 0; }
|
||||
.inquiry-comments svg { width: 15px; height: 15px; fill: currentColor; }
|
||||
.inquiry-status { display: inline-block; padding: 6px 10px; border-radius: 4px; font-size: 14px; line-height: 1.5; font-weight: 600; }
|
||||
.inquiry-status--new { color: #ef4444; background: #ef44441a; }
|
||||
.inquiry-status--done { color: #38b000; background: #38b00014; }
|
||||
.inquiry-status--review, .inquiry-status--patch { color: #777; background: #f0f0f0; }
|
||||
.inquiry-table .inquiry-empty { height: 280px; white-space: normal; }
|
||||
.inquiry-pagination { display: flex; justify-content: center; align-items: center; gap: 12px; margin: 30px 0; }
|
||||
.inquiry-pagination button { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; font-size: 14px; color: #555; }
|
||||
.inquiry-pagination [aria-current="page"] { background: #edf3fd; color: var(--inquiry-blue); }
|
||||
.inquiry-pagination button:disabled { opacity: 0.3; cursor: default; }
|
||||
.inquiry-pagination button:not(:disabled):hover { background: #eee; color: #111; }
|
||||
.inquiry-board__bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
|
||||
.inquiry-preview-note { color: #999; font-size: 13px; font-weight: 400; line-height: 1.6; }
|
||||
.inquiry-write { min-width: 120px; border-radius: 999px; }
|
||||
|
||||
/* The banner starts below the fixed header, which remains legible on its white background. */
|
||||
body:has(.inquiry-page) header { background: #fff; }
|
||||
body:has(.inquiry-page) header .logo_box a.logo { background-color: #0c367f; }
|
||||
body:has(.inquiry-page) header .header_inner .btn_menu div { background-color: #000; }
|
||||
body:has(.inquiry-page) header .header_R .language a,
|
||||
body:has(.inquiry-page) header nav ol li.depth1 > span { color: #000; }
|
||||
body:has(.inquiry-page) header .header_R .language::before { background-image: url(../img/ico_language.svg); }
|
||||
body:has(.inquiry-page) header .header_R .language a:first-child::after { background: #000; }
|
||||
|
||||
.inquiry-dialog { position: fixed; inset: 0; width: min(780px, calc(100% - 40px)); max-height: 88dvh; overflow: auto; margin: auto; border: 0; border-radius: 12px; padding: 32px; color: #222; background: #fff; box-shadow: 0 16px 60px #0004; }
|
||||
.inquiry-dialog::backdrop { background: #17212b99; }
|
||||
.inquiry-dialog__heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; border-bottom: 2px solid #27241d; padding-bottom: 20px; margin-bottom: 20px; }
|
||||
.inquiry-dialog h2 { font-size: 24px; font-weight: 700; line-height: 1.5; word-break: keep-all; }
|
||||
.inquiry-close { font-size: 32px !important; line-height: 1; width: 36px; height: 36px; flex-shrink: 0; }
|
||||
.inquiry-detail__meta { color: #777; font-size: 14px; line-height: 1.8; }
|
||||
.inquiry-detail__body { min-height: 180px; padding: 28px 0; line-height: 1.8; white-space: pre-line; user-select: text; }
|
||||
.inquiry-dialog__actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 24px; }
|
||||
.inquiry-button--light { color: #333; background: #eee; }
|
||||
.inquiry-button--light:hover { background: #ddd; }
|
||||
.inquiry-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 24px 0; }
|
||||
.inquiry-form-grid label, .inquiry-form-wide { display: flex; flex-direction: column; gap: 8px; font-size: 14px; font-weight: 600; }
|
||||
.inquiry-form-wide { margin-top: 20px; }
|
||||
.inquiry-dialog input, .inquiry-dialog select, .inquiry-dialog textarea { width: 100%; border: 1px solid #ddd; border-radius: 3px; padding: 10px 12px; min-height: 44px; font-size: 14px; background: #fff; font-weight: 400; }
|
||||
.inquiry-dialog textarea { resize: vertical; }
|
||||
.inquiry-dialog input:focus, .inquiry-dialog select:focus, .inquiry-dialog textarea:focus { border: 1px solid #1d8467; outline: 2px solid #1d846733; }
|
||||
.inquiry-form-feedback { font-size: 14px; color: #08734c; margin-top: 16px; }
|
||||
body:has(.inquiry-dialog[open]) { overflow: hidden; }
|
||||
/* Lock background scrolling only while a dialog is open; !important is needed to override layout.css html/body { overflow: visible !important }. */
|
||||
html.inquiry-modal-open,
|
||||
html.inquiry-modal-open body { overflow: hidden !important; }
|
||||
@media (max-width: 1400px) {
|
||||
.inquiry-page { padding-top: 50px; }
|
||||
}
|
||||
@media (max-width: 1000px) {
|
||||
.inquiry-scroll-hint { display: block; margin: 0 0 12px; text-align: right; color: #888; font-size: 12px; }
|
||||
.inquiry-controls { flex-wrap: wrap; gap: 20px; }
|
||||
.inquiry-search { width: 100%; max-width: none; }
|
||||
}
|
||||
@media (max-width: 600px) {
|
||||
.inquiry-hero { --inquiry-hero-shade: rgba(5, 24, 44, 0.38); height: 340px; background-position: 22% center; }
|
||||
.inquiry-hero h1 { font-size: 48px; }
|
||||
.inquiry-hero p { font-size: 17px; }
|
||||
.inquiry-workspace { margin: -96px auto 72px; padding: 0 16px; }
|
||||
.inquiry-tabs-shell { --inquiry-tab-curve: 13px; padding: 12px 13px 0; border-radius: 30px 30px 0 0; }
|
||||
.inquiry-tabs { gap: 5px; }
|
||||
.inquiry-tabs button { min-height: 84px; padding: 8px 4px 12px; gap: 4px; border-radius: 22px 22px 0 0; }
|
||||
.inquiry-tab-logo { width: 145px; max-width: 100%; height: 28px; }
|
||||
.inquiry-tab-logo img { height: auto; max-height: 28px; }
|
||||
.inquiry-tabs [data-service="egbim"] img { width: 49px; height: 25px; }
|
||||
.inquiry-tabs [data-service="tova"] img { width: 80px; }
|
||||
.inquiry-tabs [data-service="gaia"] img { width: 58px; }
|
||||
.inquiry-tab-description { display: flex; align-items: center; justify-content: center; min-height: 29px; font-size: 11px; line-height: 1.3; white-space: normal; word-break: keep-all; }
|
||||
.inquiry-board { padding: 24px 4px 0; }
|
||||
.inquiry-board__heading { flex-wrap: nowrap; gap: 12px; margin-bottom: 22px; }
|
||||
.inquiry-board h2 { flex: 1 1 auto; font-size: 20px; }
|
||||
.inquiry-board__heading .inquiry-remote { flex-shrink: 0; margin-left: auto; }
|
||||
.inquiry-remote { gap: 6px; min-height: 40px; padding: 0 12px; font-size: 12px; }
|
||||
.inquiry-remote svg { width: 18px; height: 18px; }
|
||||
.inquiry-filters { width: 100%; flex-wrap: wrap; gap: 16px; }
|
||||
.inquiry-categories { width: 100%; gap: 6px; }
|
||||
.inquiry-categories label { flex: 1; }
|
||||
.inquiry-categories span { min-width: 0; padding: 0 12px; height: 44px; font-size: 14px; }
|
||||
.inquiry-controls { padding-bottom: 24px; }
|
||||
.inquiry-search input { font-size: 16px; }
|
||||
.inquiry-search-button { width: 40px; height: 40px; }
|
||||
.inquiry-board__bottom { align-items: flex-end; }
|
||||
.inquiry-preview-note { font-size: 12px; }
|
||||
.inquiry-dialog { padding: 24px 20px; width: calc(100% - 24px); }
|
||||
.inquiry-dialog h2 { font-size: 20px; }
|
||||
.inquiry-form-grid { grid-template-columns: 1fr; gap: 16px; }
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.inquiry-tabs button, .inquiry-tab-logo img, .inquiry-remote { transition: none; }
|
||||
}
|
||||
|
||||
/* English labels use the same layout, with room for longer words. */
|
||||
html:lang(en) .inquiry-table { min-width: 1180px; font-size: 14px; }
|
||||
html:lang(en) .inquiry-table .col-number { width: 6%; }
|
||||
html:lang(en) .inquiry-table .col-category { width: 9%; }
|
||||
html:lang(en) .inquiry-table .col-company { width: 12%; }
|
||||
html:lang(en) .inquiry-table .col-status { width: 10%; }
|
||||
@media (max-width: 600px) {
|
||||
html:lang(en) .inquiry-hero h1 { font-size: 40px; }
|
||||
html:lang(en) .inquiry-categories span { padding: 0 7px; font-size: 12px; }
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 600px) {
|
||||
html:lang(en) .inquiry-tabs button { padding: 6px 4px 10px; gap: 3px; }
|
||||
html:lang(en) .inquiry-tab-description { min-height: 36px; font-size: 10px; line-height: 1.2; }
|
||||
}
|
||||
|
||||
@media (max-width: 360px) {
|
||||
html:lang(en) .inquiry-categories span { padding: 0 3px; font-size: 11px; white-space: nowrap; }
|
||||
}
|
||||
File diff suppressed because it is too large.
Load diff
+1
@@ -0,0 +1 @@
|
||||
[data-aos][data-aos][data-aos-duration="50"],body[data-aos-duration="50"] [data-aos]{transition-duration:50ms}[data-aos][data-aos][data-aos-delay="50"],body[data-aos-delay="50"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="50"].aos-animate,body[data-aos-delay="50"] [data-aos].aos-animate{transition-delay:50ms}[data-aos][data-aos][data-aos-duration="100"],body[data-aos-duration="100"] [data-aos]{transition-duration:.1s}[data-aos][data-aos][data-aos-delay="100"],body[data-aos-delay="100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="100"].aos-animate,body[data-aos-delay="100"] [data-aos].aos-animate{transition-delay:.1s}[data-aos][data-aos][data-aos-duration="150"],body[data-aos-duration="150"] [data-aos]{transition-duration:.15s}[data-aos][data-aos][data-aos-delay="150"],body[data-aos-delay="150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="150"].aos-animate,body[data-aos-delay="150"] [data-aos].aos-animate{transition-delay:.15s}[data-aos][data-aos][data-aos-duration="200"],body[data-aos-duration="200"] [data-aos]{transition-duration:.2s}[data-aos][data-aos][data-aos-delay="200"],body[data-aos-delay="200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="200"].aos-animate,body[data-aos-delay="200"] [data-aos].aos-animate{transition-delay:.2s}[data-aos][data-aos][data-aos-duration="250"],body[data-aos-duration="250"] [data-aos]{transition-duration:.25s}[data-aos][data-aos][data-aos-delay="250"],body[data-aos-delay="250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="250"].aos-animate,body[data-aos-delay="250"] [data-aos].aos-animate{transition-delay:.25s}[data-aos][data-aos][data-aos-duration="300"],body[data-aos-duration="300"] [data-aos]{transition-duration:.3s}[data-aos][data-aos][data-aos-delay="300"],body[data-aos-delay="300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="300"].aos-animate,body[data-aos-delay="300"] [data-aos].aos-animate{transition-delay:.3s}[data-aos][data-aos][data-aos-duration="350"],body[data-aos-duration="350"] [data-aos]{transition-duration:.35s}[data-aos][data-aos][data-aos-delay="350"],body[data-aos-delay="350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="350"].aos-animate,body[data-aos-delay="350"] [data-aos].aos-animate{transition-delay:.35s}[data-aos][data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos]{transition-duration:.4s}[data-aos][data-aos][data-aos-delay="400"],body[data-aos-delay="400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="400"].aos-animate,body[data-aos-delay="400"] [data-aos].aos-animate{transition-delay:.4s}[data-aos][data-aos][data-aos-duration="450"],body[data-aos-duration="450"] [data-aos]{transition-duration:.45s}[data-aos][data-aos][data-aos-delay="450"],body[data-aos-delay="450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="450"].aos-animate,body[data-aos-delay="450"] [data-aos].aos-animate{transition-delay:.45s}[data-aos][data-aos][data-aos-duration="500"],body[data-aos-duration="500"] [data-aos]{transition-duration:.5s}[data-aos][data-aos][data-aos-delay="500"],body[data-aos-delay="500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="500"].aos-animate,body[data-aos-delay="500"] [data-aos].aos-animate{transition-delay:.5s}[data-aos][data-aos][data-aos-duration="550"],body[data-aos-duration="550"] [data-aos]{transition-duration:.55s}[data-aos][data-aos][data-aos-delay="550"],body[data-aos-delay="550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="550"].aos-animate,body[data-aos-delay="550"] [data-aos].aos-animate{transition-delay:.55s}[data-aos][data-aos][data-aos-duration="600"],body[data-aos-duration="600"] [data-aos]{transition-duration:.6s}[data-aos][data-aos][data-aos-delay="600"],body[data-aos-delay="600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="600"].aos-animate,body[data-aos-delay="600"] [data-aos].aos-animate{transition-delay:.6s}[data-aos][data-aos][data-aos-duration="650"],body[data-aos-duration="650"] [data-aos]{transition-duration:.65s}[data-aos][data-aos][data-aos-delay="650"],body[data-aos-delay="650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="650"].aos-animate,body[data-aos-delay="650"] [data-aos].aos-animate{transition-delay:.65s}[data-aos][data-aos][data-aos-duration="700"],body[data-aos-duration="700"] [data-aos]{transition-duration:.7s}[data-aos][data-aos][data-aos-delay="700"],body[data-aos-delay="700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="700"].aos-animate,body[data-aos-delay="700"] [data-aos].aos-animate{transition-delay:.7s}[data-aos][data-aos][data-aos-duration="750"],body[data-aos-duration="750"] [data-aos]{transition-duration:.75s}[data-aos][data-aos][data-aos-delay="750"],body[data-aos-delay="750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="750"].aos-animate,body[dLine truncated
|
||||
+1
@@ -0,0 +1 @@
|
||||
html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto !important}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}.lenis.lenis-smooth iframe{pointer-events:none}
|
||||
@@ -0,0 +1,42 @@
|
||||
@charset "utf-8";
|
||||
|
||||
/* Reset */
|
||||
* {box-sizing: border-box; margin: 0; padding: 0; user-select:none;}
|
||||
html, body, h1, h2, h3, h4, h5, h6, div, p, pre, code, address, ul, ol, li, menu, nav, section, article, aside,
|
||||
dl ,dt, dd, table, thead, tbody, tfoot, label, caption, th, td, form, fieldset, legend, hr, input, button, textarea, object, figure, figcaption {margin:0; padding:0;}
|
||||
html, body {width:100%; height:100%; font-family: 'Noto Sans KR', sans-serif; }
|
||||
body {background:#fff; min-width:320px; -webkit-text-size-adjust:none; word-wrap:break-word;word-break:break-all; border:none;}
|
||||
input, select, textarea, button {background:none; border:none;}
|
||||
button {background: none; cursor: pointer; user-select: none;}
|
||||
ul, ol, li {list-style:none;}
|
||||
table {width:100%; border-spacing:0; border-collapse:collapse;}
|
||||
img, fieldset {border:0;}
|
||||
address, cite, code {font-style:normal; font-weight:normal;}
|
||||
em {font-style:normal; font-weight:bold;}
|
||||
i {font-style: normal;}
|
||||
label, img, input, select, textarea, button {font-family:inherit; vertical-align:middle;}
|
||||
caption, legend {line-height:0; font-size:1px; overflow:hidden;}
|
||||
hr{display:none;}
|
||||
main, header, section, nav, footer, aside, article, figure {display:block;}
|
||||
a {color:inherit; text-decoration:none;}
|
||||
a:hover {text-decoration:none;}
|
||||
/* Form */
|
||||
input[type=text]::placeholder, input::-webkit-input-placeholder{font-weight:500; color:#bdbdbd;}
|
||||
select:focus,
|
||||
textarea:focus,
|
||||
input:focus {border: 0; outline: none;}
|
||||
input[type=text][readonly],
|
||||
input[type=text][readonly]:focus {border:0;}
|
||||
input[type=tel][readonly],
|
||||
input[type=password][readonly],
|
||||
input[type=email][readonly],
|
||||
input[type=search][readonly],
|
||||
input[type=tel][disabled],
|
||||
input[type=text][disabled],
|
||||
input[type=password][disabled],
|
||||
input[type=search][disabled],
|
||||
input[type=email][disabled] {background:#eaeaea; border-color:#c0c0c0; color:#666; -webkit-appearance: none; font-size:12px;}
|
||||
textarea[readonly],
|
||||
textarea[disabled] {padding:11px; font-size:16px; color:#666; font-weight:normal; line-height:140%; height:78px; background:#eaeaea;border:1px solid #c0c0c0;}
|
||||
input[type="number"]::-webkit-outer-spin-button,
|
||||
input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,5 @@
|
||||
# Font Squirrel Font-face Generator Configuration File
|
||||
# Upload this file to the generator to recreate the settings
|
||||
# you used to create these fonts.
|
||||
|
||||
{"mode":"basic","formats":["ttf","woff","woff2","eotz"],"tt_instructor":"default","fix_vertical_metrics":"Y","fix_gasp":"xy","add_spaces":"Y","add_hyphens":"Y","fallback":"none","fallback_custom":"100","options_subset":"basic","subset_custom":"","subset_custom_range":"","subset_ot_features_list":"","css_stylesheet":"stylesheet.css","filename_suffix":"-webfont","emsquare":"2048","spacing_adjustment":"0"}
|
||||
File diff suppressed because it is too large.
Load diff
Binary file not shown.
File diff suppressed because it is too large.
Load diff
|
After Width: | Height: | Size: 687 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,7 @@
|
||||
(function($){$.fn.easyTabs=function(option){var param=jQuery.extend({fadeSpeed:"fast",defaultContent:1,activeClass:'active'},option);$(this).each(function(){var thisId="#"+this.id;if(param.defaultContent==''){param.defaultContent=1;}
|
||||
if(typeof param.defaultContent=="number")
|
||||
{var defaultTab=$(thisId+" .tabs li:eq("+(param.defaultContent-1)+") a").attr('href').substr(1);}else{var defaultTab=param.defaultContent;}
|
||||
$(thisId+" .tabs li a").each(function(){var tabToHide=$(this).attr('href').substr(1);$("#"+tabToHide).addClass('easytabs-tab-content');});hideAll();changeContent(defaultTab);function hideAll(){$(thisId+" .easytabs-tab-content").hide();}
|
||||
function changeContent(tabId){hideAll();$(thisId+" .tabs li").removeClass(param.activeClass);$(thisId+" .tabs li a[href=#"+tabId+"]").closest('li').addClass(param.activeClass);if(param.fadeSpeed!="none")
|
||||
{$(thisId+" #"+tabId).fadeIn(param.fadeSpeed);}else{$(thisId+" #"+tabId).show();}}
|
||||
$(thisId+" .tabs li").click(function(){var tabId=$(this).find('a').attr('href').substr(1);changeContent(tabId);return false;});});}})(jQuery);
|
||||
@@ -0,0 +1,129 @@
|
||||
/*Notes about grid:
|
||||
Columns: 12
|
||||
Grid Width: 825px
|
||||
Column Width: 55px
|
||||
Gutter Width: 15px
|
||||
-------------------------------*/
|
||||
|
||||
|
||||
|
||||
.section {margin-bottom: 18px;
|
||||
}
|
||||
.section:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
|
||||
.section {*zoom: 1;}
|
||||
|
||||
.section .firstcolumn,
|
||||
.section .firstcol {margin-left: 0;}
|
||||
|
||||
|
||||
/* Border on left hand side of a column. */
|
||||
.border {
|
||||
padding-left: 7px;
|
||||
margin-left: 7px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
/* Border with more whitespace, spans one column. */
|
||||
.colborder {
|
||||
padding-left: 42px;
|
||||
margin-left: 42px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* The Grid Classes */
|
||||
.grid1, .grid1_2cols, .grid1_3cols, .grid1_4cols, .grid2, .grid2_3cols, .grid2_4cols, .grid3, .grid3_2cols, .grid3_4cols, .grid4, .grid4_3cols, .grid5, .grid5_2cols, .grid5_3cols, .grid5_4cols, .grid6, .grid6_4cols, .grid7, .grid7_2cols, .grid7_3cols, .grid7_4cols, .grid8, .grid8_3cols, .grid9, .grid9_2cols, .grid9_4cols, .grid10, .grid10_3cols, .grid10_4cols, .grid11, .grid11_2cols, .grid11_3cols, .grid11_4cols, .grid12
|
||||
{margin-left: 15px;float: left;display: inline; overflow: hidden;}
|
||||
|
||||
|
||||
.width1, .grid1, .span-1 {width: 55px;}
|
||||
.width1_2cols,.grid1_2cols {width: 20px;}
|
||||
.width1_3cols,.grid1_3cols {width: 8px;}
|
||||
.width1_4cols,.grid1_4cols {width: 2px;}
|
||||
.input_width1 {width: 49px;}
|
||||
|
||||
.width2, .grid2, .span-2 {width: 125px;}
|
||||
.width2_3cols,.grid2_3cols {width: 31px;}
|
||||
.width2_4cols,.grid2_4cols {width: 20px;}
|
||||
.input_width2 {width: 119px;}
|
||||
|
||||
.width3, .grid3, .span-3 {width: 195px;}
|
||||
.width3_2cols,.grid3_2cols {width: 90px;}
|
||||
.width3_4cols,.grid3_4cols {width: 37px;}
|
||||
.input_width3 {width: 189px;}
|
||||
|
||||
.width4, .grid4, .span-4 {width: 265px;}
|
||||
.width4_3cols,.grid4_3cols {width: 78px;}
|
||||
.input_width4 {width: 259px;}
|
||||
|
||||
.width5, .grid5, .span-5 {width: 335px;}
|
||||
.width5_2cols,.grid5_2cols {width: 160px;}
|
||||
.width5_3cols,.grid5_3cols {width: 101px;}
|
||||
.width5_4cols,.grid5_4cols {width: 72px;}
|
||||
.input_width5 {width: 329px;}
|
||||
|
||||
.width6, .grid6, .span-6 {width: 405px;}
|
||||
.width6_4cols,.grid6_4cols {width: 90px;}
|
||||
.input_width6 {width: 399px;}
|
||||
|
||||
.width7, .grid7, .span-7 {width: 475px;}
|
||||
.width7_2cols,.grid7_2cols {width: 230px;}
|
||||
.width7_3cols,.grid7_3cols {width: 148px;}
|
||||
.width7_4cols,.grid7_4cols {width: 107px;}
|
||||
.input_width7 {width: 469px;}
|
||||
|
||||
.width8, .grid8, .span-8 {width: 545px;}
|
||||
.width8_3cols,.grid8_3cols {width: 171px;}
|
||||
.input_width8 {width: 539px;}
|
||||
|
||||
.width9, .grid9, .span-9 {width: 615px;}
|
||||
.width9_2cols,.grid9_2cols {width: 300px;}
|
||||
.width9_4cols,.grid9_4cols {width: 142px;}
|
||||
.input_width9 {width: 609px;}
|
||||
|
||||
.width10, .grid10, .span-10 {width: 685px;}
|
||||
.width10_3cols,.grid10_3cols {width: 218px;}
|
||||
.width10_4cols,.grid10_4cols {width: 160px;}
|
||||
.input_width10 {width: 679px;}
|
||||
|
||||
.width11, .grid11, .span-11 {width: 755px;}
|
||||
.width11_2cols,.grid11_2cols {width: 370px;}
|
||||
.width11_3cols,.grid11_3cols {width: 241px;}
|
||||
.width11_4cols,.grid11_4cols {width: 177px;}
|
||||
.input_width11 {width: 749px;}
|
||||
|
||||
.width12, .grid12, .span-12 {width: 825px;}
|
||||
.input_width12 {width: 819px;}
|
||||
|
||||
/* Subdivided grid spaces */
|
||||
.emptycols_left1, .prepend-1 {padding-left: 70px;}
|
||||
.emptycols_right1, .append-1 {padding-right: 70px;}
|
||||
.emptycols_left2, .prepend-2 {padding-left: 140px;}
|
||||
.emptycols_right2, .append-2 {padding-right: 140px;}
|
||||
.emptycols_left3, .prepend-3 {padding-left: 210px;}
|
||||
.emptycols_right3, .append-3 {padding-right: 210px;}
|
||||
.emptycols_left4, .prepend-4 {padding-left: 280px;}
|
||||
.emptycols_right4, .append-4 {padding-right: 280px;}
|
||||
.emptycols_left5, .prepend-5 {padding-left: 350px;}
|
||||
.emptycols_right5, .append-5 {padding-right: 350px;}
|
||||
.emptycols_left6, .prepend-6 {padding-left: 420px;}
|
||||
.emptycols_right6, .append-6 {padding-right: 420px;}
|
||||
.emptycols_left7, .prepend-7 {padding-left: 490px;}
|
||||
.emptycols_right7, .append-7 {padding-right: 490px;}
|
||||
.emptycols_left8, .prepend-8 {padding-left: 560px;}
|
||||
.emptycols_right8, .append-8 {padding-right: 560px;}
|
||||
.emptycols_left9, .prepend-9 {padding-left: 630px;}
|
||||
.emptycols_right9, .append-9 {padding-right: 630px;}
|
||||
.emptycols_left10, .prepend-10 {padding-left: 700px;}
|
||||
.emptycols_right10, .append-10 {padding-right: 700px;}
|
||||
.emptycols_left11, .prepend-11 {padding-left: 770px;}
|
||||
.emptycols_right11, .append-11 {padding-right: 770px;}
|
||||
.pull-1 {margin-left: -70px;}
|
||||
.push-1 {margin-right: -70px;margin-left: 18px;float: right;}
|
||||
.pull-2 {margin-left: -140px;}
|
||||
.push-2 {margin-right: -140px;margin-left: 18px;float: right;}
|
||||
.pull-3 {margin-left: -210px;}
|
||||
.push-3 {margin-right: -210px;margin-left: 18px;float: right;}
|
||||
.pull-4 {margin-left: -280px;}
|
||||
.push-4 {margin-right: -280px;margin-left: 18px;float: right;}
|
||||
@@ -0,0 +1,396 @@
|
||||
@import url('grid_12-825-55-15.css');
|
||||
|
||||
/*
|
||||
CSS Reset by Eric Meyer - Released under Public Domain
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center, dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend, table,
|
||||
caption, tbody, tfoot, thead, tr, th, td
|
||||
{margin: 0;padding: 0;border: 0;outline: 0;
|
||||
font-size: 100%;vertical-align: baseline;
|
||||
background: transparent;}
|
||||
body {line-height: 1;}
|
||||
ol, ul {list-style: none;}
|
||||
blockquote, q {quotes: none;}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {content: ''; content: none;}
|
||||
:focus {outline: 0;}
|
||||
ins {text-decoration: none;}
|
||||
del {text-decoration: line-through;}
|
||||
table {border-collapse: collapse;border-spacing: 0;}
|
||||
|
||||
|
||||
|
||||
|
||||
body {
|
||||
color: #000;
|
||||
background-color: #dcdcdc;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #1883ba;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 32px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#container {
|
||||
width: 865px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
|
||||
#header {
|
||||
padding: 20px;
|
||||
font-size: 36px;
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#header span {
|
||||
color: #666;
|
||||
}
|
||||
#main_content {
|
||||
background-color: #fff;
|
||||
padding: 60px 20px 20px;
|
||||
}
|
||||
|
||||
|
||||
#footer p {
|
||||
margin: 0;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 50px;
|
||||
color: #333;
|
||||
font: 10px Arial, sans-serif;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
width: 100%;
|
||||
height: 31px;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li {
|
||||
float: left;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li a {
|
||||
display: block;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font: bold 11px/11px 'Arial';
|
||||
text-transform: uppercase;
|
||||
padding: 10px 15px;
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
|
||||
.tabs li a:hover {
|
||||
background-color: #00b3ff;
|
||||
|
||||
}
|
||||
|
||||
.tabs li.active a {
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
div.huge {
|
||||
|
||||
font-size: 120px;
|
||||
line-height: 1em;
|
||||
padding: 0;
|
||||
letter-spacing: -.02em;
|
||||
overflow: hidden;
|
||||
}
|
||||
div.glyph_range {
|
||||
font-size: 72px;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
||||
.size10{ font-size: 10px; }
|
||||
.size11{ font-size: 11px; }
|
||||
.size12{ font-size: 12px; }
|
||||
.size13{ font-size: 13px; }
|
||||
.size14{ font-size: 14px; }
|
||||
.size16{ font-size: 16px; }
|
||||
.size18{ font-size: 18px; }
|
||||
.size20{ font-size: 20px; }
|
||||
.size24{ font-size: 24px; }
|
||||
.size30{ font-size: 30px; }
|
||||
.size36{ font-size: 36px; }
|
||||
.size48{ font-size: 48px; }
|
||||
.size60{ font-size: 60px; }
|
||||
.size72{ font-size: 72px; }
|
||||
.size90{ font-size: 90px; }
|
||||
|
||||
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row2 { height: 160px;}
|
||||
.psample_row3 { height: 160px;}
|
||||
.psample_row4 { height: 160px;}
|
||||
|
||||
.psample {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.psample p {
|
||||
line-height: 1.3em;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.psample span {
|
||||
margin-right: .5em;
|
||||
}
|
||||
|
||||
.white_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNrs3TsKgFAMRUE/eer+NxztxMYuEWQG3ECKwwUF58ycAKixOAGAyAKILAAiCyCyACILgMgCiCyAyAIgsgAiCyCyAIgsgMgCiCwAIgsgsgAiC4DIAogsACIL0CWuZ3UGgLrIhjMA1EV2OAOAJQtgyQLwjOzmDAAiCyCyAIgsQFtkd2cAEFkAkQVAZAHaIns4A4AlC2DJAiCyACILILIAiCzAV5H1dQGAJQsgsgCILIDIAvwisl58AViyAJYsACILILIAIgvAe2T9EhxAZAFEFgCRBeiL7HAGgLrIhjMAWLIAliwAt1OAAQDwygTBulLIlQAAAABJRU5ErkJggg==);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.black_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAPJJREFUeNrs3TEKhTAQRVGjibr/9QoxhY2N3Ywo50A28IrLwP9g6b1PAMSYTQAgsgAiC4DIAogsgMgCILIAIgsgsgCILIDIAogsACILILIAIguAyAKILIDIAiCyACILgMgCZCnjLWYAiFGvB0BQZJsZAFyyAC5ZAO6RXc0AILIAIguAyAKkRXYzA4DIAogsACILkBbZ3QwALlkAlywAIgsgsgAiC4DIArwVWf8uAHDJAogsACILILIAv4isH74AXLIALlkARBZAZAFEFoDnyPokOIDIAogsACILkBfZZgaAuMhWMwC4ZAE+p4x3mAEgxinAAJ+XBbPWGkwAAAAAAElFTkSuQmCC);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.fullreverse {
|
||||
background: #000 !important;
|
||||
color: #fff !important;
|
||||
margin-left: -20px;
|
||||
padding-left: 20px;
|
||||
margin-right: -20px;
|
||||
padding-right: 20px;
|
||||
padding: 20px;
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
|
||||
.sample_table td {
|
||||
padding-top: 3px;
|
||||
padding-bottom:5px;
|
||||
padding-left: 5px;
|
||||
vertical-align: middle;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
.sample_table td:first-child {
|
||||
background-color: #eee;
|
||||
text-align: right;
|
||||
padding-right: 5px;
|
||||
padding-left: 0;
|
||||
padding: 5px;
|
||||
font: 11px/12px "Courier New", Courier, mono;
|
||||
}
|
||||
|
||||
code {
|
||||
white-space: pre;
|
||||
background-color: #eee;
|
||||
display: block;
|
||||
padding: 10px;
|
||||
margin-bottom: 18px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
.bottom,.last {margin-bottom:0 !important; padding-bottom:0 !important;}
|
||||
|
||||
.box {
|
||||
padding: 18px;
|
||||
margin-bottom: 18px;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.reverse,.reversed { background: #000 !important;color: #fff !important; border: none !important;}
|
||||
|
||||
#bodycomparison {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
font-size: 72px;
|
||||
height: 90px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#bodycomparison div{
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
display: inline;
|
||||
margin: 0 15px 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#bodycomparison div span{
|
||||
font: 10px Arial;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
#xheight {
|
||||
float: none;
|
||||
position: absolute;
|
||||
color: #d9f3ff;
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
}
|
||||
|
||||
.fontbody {
|
||||
position: relative;
|
||||
}
|
||||
.arialbody{
|
||||
font-family: Arial;
|
||||
position: relative;
|
||||
}
|
||||
.verdanabody{
|
||||
font-family: Verdana;
|
||||
position: relative;
|
||||
}
|
||||
.georgiabody{
|
||||
font-family: Georgia;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* @group Layout page
|
||||
*/
|
||||
|
||||
#layout h1 {
|
||||
font-size: 36px;
|
||||
line-height: 42px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h2 {
|
||||
font-size: 24px;
|
||||
line-height: 23px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h3 {
|
||||
font-size: 22px;
|
||||
line-height: 1.4em;
|
||||
margin-top: 1em;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
||||
#layout p.byline {
|
||||
font-size: 12px;
|
||||
margin-top: 18px;
|
||||
line-height: 12px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#layout p {
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
|
||||
#layout p.large{
|
||||
font-size: 18px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
#layout .sidebar p{
|
||||
font-size: 12px;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
#layout p.caption {
|
||||
font-size: 10px;
|
||||
margin-top: -16px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
/* @group Glyphs */
|
||||
|
||||
#glyph_chart div{
|
||||
background-color: #d9f3ff;
|
||||
color: black;
|
||||
float: left;
|
||||
font-size: 36px;
|
||||
height: 1.2em;
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 1px;
|
||||
margin-right: 1px;
|
||||
text-align: center;
|
||||
width: 1.2em;
|
||||
position: relative;
|
||||
padding: .6em .2em .2em;
|
||||
}
|
||||
|
||||
#glyph_chart div p {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: block;
|
||||
text-align: center;
|
||||
font: bold 9px Arial, sans-serif;
|
||||
background-color: #3a768f;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
padding: 2px 0;
|
||||
}
|
||||
|
||||
|
||||
#glyphs h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
/* @end */
|
||||
|
||||
/* @group Installing */
|
||||
|
||||
#installing {
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
#installing p,
|
||||
#glyphs p{
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 18px;
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#installing h3{
|
||||
font-size: 15px;
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
#rendering h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.render_table td {
|
||||
font: 11px "Courier New", Courier, mono;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 28, 2015 */
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'notokr-black';
|
||||
src: url('notokr-black.eot');
|
||||
src: url('notokr-black.eot?#iefix') format('embedded-opentype'),
|
||||
url('notokr-black.woff2') format('woff2'),
|
||||
url('notokr-black.woff') format('woff'),
|
||||
url('notokr-black.ttf') format('truetype'),
|
||||
url('notokr-black.svg#notokr-black') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
# Font Squirrel Font-face Generator Configuration File
|
||||
# Upload this file to the generator to recreate the settings
|
||||
# you used to create these fonts.
|
||||
|
||||
{"mode":"basic","formats":["ttf","woff","woff2","eotz"],"tt_instructor":"default","fix_vertical_metrics":"Y","fix_gasp":"xy","add_spaces":"Y","add_hyphens":"Y","fallback":"none","fallback_custom":"100","options_subset":"basic","subset_custom":"","subset_custom_range":"","subset_ot_features_list":"","css_stylesheet":"stylesheet.css","filename_suffix":"-webfont","emsquare":"2048","spacing_adjustment":"0"}
|
||||
File diff suppressed because it is too large.
Load diff
Binary file not shown.
File diff suppressed because it is too large.
Load diff
|
After Width: | Height: | Size: 689 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,7 @@
|
||||
(function($){$.fn.easyTabs=function(option){var param=jQuery.extend({fadeSpeed:"fast",defaultContent:1,activeClass:'active'},option);$(this).each(function(){var thisId="#"+this.id;if(param.defaultContent==''){param.defaultContent=1;}
|
||||
if(typeof param.defaultContent=="number")
|
||||
{var defaultTab=$(thisId+" .tabs li:eq("+(param.defaultContent-1)+") a").attr('href').substr(1);}else{var defaultTab=param.defaultContent;}
|
||||
$(thisId+" .tabs li a").each(function(){var tabToHide=$(this).attr('href').substr(1);$("#"+tabToHide).addClass('easytabs-tab-content');});hideAll();changeContent(defaultTab);function hideAll(){$(thisId+" .easytabs-tab-content").hide();}
|
||||
function changeContent(tabId){hideAll();$(thisId+" .tabs li").removeClass(param.activeClass);$(thisId+" .tabs li a[href=#"+tabId+"]").closest('li').addClass(param.activeClass);if(param.fadeSpeed!="none")
|
||||
{$(thisId+" #"+tabId).fadeIn(param.fadeSpeed);}else{$(thisId+" #"+tabId).show();}}
|
||||
$(thisId+" .tabs li").click(function(){var tabId=$(this).find('a').attr('href').substr(1);changeContent(tabId);return false;});});}})(jQuery);
|
||||
@@ -0,0 +1,129 @@
|
||||
/*Notes about grid:
|
||||
Columns: 12
|
||||
Grid Width: 825px
|
||||
Column Width: 55px
|
||||
Gutter Width: 15px
|
||||
-------------------------------*/
|
||||
|
||||
|
||||
|
||||
.section {margin-bottom: 18px;
|
||||
}
|
||||
.section:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
|
||||
.section {*zoom: 1;}
|
||||
|
||||
.section .firstcolumn,
|
||||
.section .firstcol {margin-left: 0;}
|
||||
|
||||
|
||||
/* Border on left hand side of a column. */
|
||||
.border {
|
||||
padding-left: 7px;
|
||||
margin-left: 7px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
/* Border with more whitespace, spans one column. */
|
||||
.colborder {
|
||||
padding-left: 42px;
|
||||
margin-left: 42px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* The Grid Classes */
|
||||
.grid1, .grid1_2cols, .grid1_3cols, .grid1_4cols, .grid2, .grid2_3cols, .grid2_4cols, .grid3, .grid3_2cols, .grid3_4cols, .grid4, .grid4_3cols, .grid5, .grid5_2cols, .grid5_3cols, .grid5_4cols, .grid6, .grid6_4cols, .grid7, .grid7_2cols, .grid7_3cols, .grid7_4cols, .grid8, .grid8_3cols, .grid9, .grid9_2cols, .grid9_4cols, .grid10, .grid10_3cols, .grid10_4cols, .grid11, .grid11_2cols, .grid11_3cols, .grid11_4cols, .grid12
|
||||
{margin-left: 15px;float: left;display: inline; overflow: hidden;}
|
||||
|
||||
|
||||
.width1, .grid1, .span-1 {width: 55px;}
|
||||
.width1_2cols,.grid1_2cols {width: 20px;}
|
||||
.width1_3cols,.grid1_3cols {width: 8px;}
|
||||
.width1_4cols,.grid1_4cols {width: 2px;}
|
||||
.input_width1 {width: 49px;}
|
||||
|
||||
.width2, .grid2, .span-2 {width: 125px;}
|
||||
.width2_3cols,.grid2_3cols {width: 31px;}
|
||||
.width2_4cols,.grid2_4cols {width: 20px;}
|
||||
.input_width2 {width: 119px;}
|
||||
|
||||
.width3, .grid3, .span-3 {width: 195px;}
|
||||
.width3_2cols,.grid3_2cols {width: 90px;}
|
||||
.width3_4cols,.grid3_4cols {width: 37px;}
|
||||
.input_width3 {width: 189px;}
|
||||
|
||||
.width4, .grid4, .span-4 {width: 265px;}
|
||||
.width4_3cols,.grid4_3cols {width: 78px;}
|
||||
.input_width4 {width: 259px;}
|
||||
|
||||
.width5, .grid5, .span-5 {width: 335px;}
|
||||
.width5_2cols,.grid5_2cols {width: 160px;}
|
||||
.width5_3cols,.grid5_3cols {width: 101px;}
|
||||
.width5_4cols,.grid5_4cols {width: 72px;}
|
||||
.input_width5 {width: 329px;}
|
||||
|
||||
.width6, .grid6, .span-6 {width: 405px;}
|
||||
.width6_4cols,.grid6_4cols {width: 90px;}
|
||||
.input_width6 {width: 399px;}
|
||||
|
||||
.width7, .grid7, .span-7 {width: 475px;}
|
||||
.width7_2cols,.grid7_2cols {width: 230px;}
|
||||
.width7_3cols,.grid7_3cols {width: 148px;}
|
||||
.width7_4cols,.grid7_4cols {width: 107px;}
|
||||
.input_width7 {width: 469px;}
|
||||
|
||||
.width8, .grid8, .span-8 {width: 545px;}
|
||||
.width8_3cols,.grid8_3cols {width: 171px;}
|
||||
.input_width8 {width: 539px;}
|
||||
|
||||
.width9, .grid9, .span-9 {width: 615px;}
|
||||
.width9_2cols,.grid9_2cols {width: 300px;}
|
||||
.width9_4cols,.grid9_4cols {width: 142px;}
|
||||
.input_width9 {width: 609px;}
|
||||
|
||||
.width10, .grid10, .span-10 {width: 685px;}
|
||||
.width10_3cols,.grid10_3cols {width: 218px;}
|
||||
.width10_4cols,.grid10_4cols {width: 160px;}
|
||||
.input_width10 {width: 679px;}
|
||||
|
||||
.width11, .grid11, .span-11 {width: 755px;}
|
||||
.width11_2cols,.grid11_2cols {width: 370px;}
|
||||
.width11_3cols,.grid11_3cols {width: 241px;}
|
||||
.width11_4cols,.grid11_4cols {width: 177px;}
|
||||
.input_width11 {width: 749px;}
|
||||
|
||||
.width12, .grid12, .span-12 {width: 825px;}
|
||||
.input_width12 {width: 819px;}
|
||||
|
||||
/* Subdivided grid spaces */
|
||||
.emptycols_left1, .prepend-1 {padding-left: 70px;}
|
||||
.emptycols_right1, .append-1 {padding-right: 70px;}
|
||||
.emptycols_left2, .prepend-2 {padding-left: 140px;}
|
||||
.emptycols_right2, .append-2 {padding-right: 140px;}
|
||||
.emptycols_left3, .prepend-3 {padding-left: 210px;}
|
||||
.emptycols_right3, .append-3 {padding-right: 210px;}
|
||||
.emptycols_left4, .prepend-4 {padding-left: 280px;}
|
||||
.emptycols_right4, .append-4 {padding-right: 280px;}
|
||||
.emptycols_left5, .prepend-5 {padding-left: 350px;}
|
||||
.emptycols_right5, .append-5 {padding-right: 350px;}
|
||||
.emptycols_left6, .prepend-6 {padding-left: 420px;}
|
||||
.emptycols_right6, .append-6 {padding-right: 420px;}
|
||||
.emptycols_left7, .prepend-7 {padding-left: 490px;}
|
||||
.emptycols_right7, .append-7 {padding-right: 490px;}
|
||||
.emptycols_left8, .prepend-8 {padding-left: 560px;}
|
||||
.emptycols_right8, .append-8 {padding-right: 560px;}
|
||||
.emptycols_left9, .prepend-9 {padding-left: 630px;}
|
||||
.emptycols_right9, .append-9 {padding-right: 630px;}
|
||||
.emptycols_left10, .prepend-10 {padding-left: 700px;}
|
||||
.emptycols_right10, .append-10 {padding-right: 700px;}
|
||||
.emptycols_left11, .prepend-11 {padding-left: 770px;}
|
||||
.emptycols_right11, .append-11 {padding-right: 770px;}
|
||||
.pull-1 {margin-left: -70px;}
|
||||
.push-1 {margin-right: -70px;margin-left: 18px;float: right;}
|
||||
.pull-2 {margin-left: -140px;}
|
||||
.push-2 {margin-right: -140px;margin-left: 18px;float: right;}
|
||||
.pull-3 {margin-left: -210px;}
|
||||
.push-3 {margin-right: -210px;margin-left: 18px;float: right;}
|
||||
.pull-4 {margin-left: -280px;}
|
||||
.push-4 {margin-right: -280px;margin-left: 18px;float: right;}
|
||||
@@ -0,0 +1,396 @@
|
||||
@import url('grid_12-825-55-15.css');
|
||||
|
||||
/*
|
||||
CSS Reset by Eric Meyer - Released under Public Domain
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center, dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend, table,
|
||||
caption, tbody, tfoot, thead, tr, th, td
|
||||
{margin: 0;padding: 0;border: 0;outline: 0;
|
||||
font-size: 100%;vertical-align: baseline;
|
||||
background: transparent;}
|
||||
body {line-height: 1;}
|
||||
ol, ul {list-style: none;}
|
||||
blockquote, q {quotes: none;}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {content: ''; content: none;}
|
||||
:focus {outline: 0;}
|
||||
ins {text-decoration: none;}
|
||||
del {text-decoration: line-through;}
|
||||
table {border-collapse: collapse;border-spacing: 0;}
|
||||
|
||||
|
||||
|
||||
|
||||
body {
|
||||
color: #000;
|
||||
background-color: #dcdcdc;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #1883ba;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 32px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#container {
|
||||
width: 865px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
|
||||
#header {
|
||||
padding: 20px;
|
||||
font-size: 36px;
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#header span {
|
||||
color: #666;
|
||||
}
|
||||
#main_content {
|
||||
background-color: #fff;
|
||||
padding: 60px 20px 20px;
|
||||
}
|
||||
|
||||
|
||||
#footer p {
|
||||
margin: 0;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 50px;
|
||||
color: #333;
|
||||
font: 10px Arial, sans-serif;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
width: 100%;
|
||||
height: 31px;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li {
|
||||
float: left;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li a {
|
||||
display: block;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font: bold 11px/11px 'Arial';
|
||||
text-transform: uppercase;
|
||||
padding: 10px 15px;
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
|
||||
.tabs li a:hover {
|
||||
background-color: #00b3ff;
|
||||
|
||||
}
|
||||
|
||||
.tabs li.active a {
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
div.huge {
|
||||
|
||||
font-size: 120px;
|
||||
line-height: 1em;
|
||||
padding: 0;
|
||||
letter-spacing: -.02em;
|
||||
overflow: hidden;
|
||||
}
|
||||
div.glyph_range {
|
||||
font-size: 72px;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
||||
.size10{ font-size: 10px; }
|
||||
.size11{ font-size: 11px; }
|
||||
.size12{ font-size: 12px; }
|
||||
.size13{ font-size: 13px; }
|
||||
.size14{ font-size: 14px; }
|
||||
.size16{ font-size: 16px; }
|
||||
.size18{ font-size: 18px; }
|
||||
.size20{ font-size: 20px; }
|
||||
.size24{ font-size: 24px; }
|
||||
.size30{ font-size: 30px; }
|
||||
.size36{ font-size: 36px; }
|
||||
.size48{ font-size: 48px; }
|
||||
.size60{ font-size: 60px; }
|
||||
.size72{ font-size: 72px; }
|
||||
.size90{ font-size: 90px; }
|
||||
|
||||
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row2 { height: 160px;}
|
||||
.psample_row3 { height: 160px;}
|
||||
.psample_row4 { height: 160px;}
|
||||
|
||||
.psample {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.psample p {
|
||||
line-height: 1.3em;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.psample span {
|
||||
margin-right: .5em;
|
||||
}
|
||||
|
||||
.white_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNrs3TsKgFAMRUE/eer+NxztxMYuEWQG3ECKwwUF58ycAKixOAGAyAKILAAiCyCyACILgMgCiCyAyAIgsgAiCyCyAIgsgMgCiCwAIgsgsgAiC4DIAogsACIL0CWuZ3UGgLrIhjMA1EV2OAOAJQtgyQLwjOzmDAAiCyCyAIgsQFtkd2cAEFkAkQVAZAHaIns4A4AlC2DJAiCyACILILIAiCzAV5H1dQGAJQsgsgCILIDIAvwisl58AViyAJYsACILILIAIgvAe2T9EhxAZAFEFgCRBeiL7HAGgLrIhjMAWLIAliwAt1OAAQDwygTBulLIlQAAAABJRU5ErkJggg==);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.black_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAPJJREFUeNrs3TEKhTAQRVGjibr/9QoxhY2N3Ywo50A28IrLwP9g6b1PAMSYTQAgsgAiC4DIAogsgMgCILIAIgsgsgCILIDIAogsACILILIAIguAyAKILIDIAiCyACILgMgCZCnjLWYAiFGvB0BQZJsZAFyyAC5ZAO6RXc0AILIAIguAyAKkRXYzA4DIAogsACILkBbZ3QwALlkAlywAIgsgsgAiC4DIArwVWf8uAHDJAogsACILILIAv4isH74AXLIALlkARBZAZAFEFoDnyPokOIDIAogsACILkBfZZgaAuMhWMwC4ZAE+p4x3mAEgxinAAJ+XBbPWGkwAAAAAAElFTkSuQmCC);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.fullreverse {
|
||||
background: #000 !important;
|
||||
color: #fff !important;
|
||||
margin-left: -20px;
|
||||
padding-left: 20px;
|
||||
margin-right: -20px;
|
||||
padding-right: 20px;
|
||||
padding: 20px;
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
|
||||
.sample_table td {
|
||||
padding-top: 3px;
|
||||
padding-bottom:5px;
|
||||
padding-left: 5px;
|
||||
vertical-align: middle;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
.sample_table td:first-child {
|
||||
background-color: #eee;
|
||||
text-align: right;
|
||||
padding-right: 5px;
|
||||
padding-left: 0;
|
||||
padding: 5px;
|
||||
font: 11px/12px "Courier New", Courier, mono;
|
||||
}
|
||||
|
||||
code {
|
||||
white-space: pre;
|
||||
background-color: #eee;
|
||||
display: block;
|
||||
padding: 10px;
|
||||
margin-bottom: 18px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
.bottom,.last {margin-bottom:0 !important; padding-bottom:0 !important;}
|
||||
|
||||
.box {
|
||||
padding: 18px;
|
||||
margin-bottom: 18px;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.reverse,.reversed { background: #000 !important;color: #fff !important; border: none !important;}
|
||||
|
||||
#bodycomparison {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
font-size: 72px;
|
||||
height: 90px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#bodycomparison div{
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
display: inline;
|
||||
margin: 0 15px 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#bodycomparison div span{
|
||||
font: 10px Arial;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
#xheight {
|
||||
float: none;
|
||||
position: absolute;
|
||||
color: #d9f3ff;
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
}
|
||||
|
||||
.fontbody {
|
||||
position: relative;
|
||||
}
|
||||
.arialbody{
|
||||
font-family: Arial;
|
||||
position: relative;
|
||||
}
|
||||
.verdanabody{
|
||||
font-family: Verdana;
|
||||
position: relative;
|
||||
}
|
||||
.georgiabody{
|
||||
font-family: Georgia;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* @group Layout page
|
||||
*/
|
||||
|
||||
#layout h1 {
|
||||
font-size: 36px;
|
||||
line-height: 42px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h2 {
|
||||
font-size: 24px;
|
||||
line-height: 23px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h3 {
|
||||
font-size: 22px;
|
||||
line-height: 1.4em;
|
||||
margin-top: 1em;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
||||
#layout p.byline {
|
||||
font-size: 12px;
|
||||
margin-top: 18px;
|
||||
line-height: 12px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#layout p {
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
|
||||
#layout p.large{
|
||||
font-size: 18px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
#layout .sidebar p{
|
||||
font-size: 12px;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
#layout p.caption {
|
||||
font-size: 10px;
|
||||
margin-top: -16px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
/* @group Glyphs */
|
||||
|
||||
#glyph_chart div{
|
||||
background-color: #d9f3ff;
|
||||
color: black;
|
||||
float: left;
|
||||
font-size: 36px;
|
||||
height: 1.2em;
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 1px;
|
||||
margin-right: 1px;
|
||||
text-align: center;
|
||||
width: 1.2em;
|
||||
position: relative;
|
||||
padding: .6em .2em .2em;
|
||||
}
|
||||
|
||||
#glyph_chart div p {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: block;
|
||||
text-align: center;
|
||||
font: bold 9px Arial, sans-serif;
|
||||
background-color: #3a768f;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
padding: 2px 0;
|
||||
}
|
||||
|
||||
|
||||
#glyphs h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
/* @end */
|
||||
|
||||
/* @group Installing */
|
||||
|
||||
#installing {
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
#installing p,
|
||||
#glyphs p{
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 18px;
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#installing h3{
|
||||
font-size: 15px;
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
#rendering h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.render_table td {
|
||||
font: 11px "Courier New", Courier, mono;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 28, 2015 */
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'notokr-bold';
|
||||
src: url('notokr-bold.eot');
|
||||
src: url('notokr-bold.eot?#iefix') format('embedded-opentype'),
|
||||
url('notokr-bold.woff2') format('woff2'),
|
||||
url('notokr-bold.woff') format('woff'),
|
||||
url('notokr-bold.ttf') format('truetype'),
|
||||
url('notokr-bold.svg#notokr-bold') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
# Font Squirrel Font-face Generator Configuration File
|
||||
# Upload this file to the generator to recreate the settings
|
||||
# you used to create these fonts.
|
||||
|
||||
{"mode":"basic","formats":["ttf","woff","woff2","eotz"],"tt_instructor":"default","fix_vertical_metrics":"Y","fix_gasp":"xy","add_spaces":"Y","add_hyphens":"Y","fallback":"none","fallback_custom":"100","options_subset":"basic","subset_custom":"","subset_custom_range":"","subset_ot_features_list":"","css_stylesheet":"stylesheet.css","filename_suffix":"-webfont","emsquare":"2048","spacing_adjustment":"0"}
|
||||
File diff suppressed because it is too large.
Load diff
Binary file not shown.
File diff suppressed because it is too large.
Load diff
|
After Width: | Height: | Size: 717 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,7 @@
|
||||
(function($){$.fn.easyTabs=function(option){var param=jQuery.extend({fadeSpeed:"fast",defaultContent:1,activeClass:'active'},option);$(this).each(function(){var thisId="#"+this.id;if(param.defaultContent==''){param.defaultContent=1;}
|
||||
if(typeof param.defaultContent=="number")
|
||||
{var defaultTab=$(thisId+" .tabs li:eq("+(param.defaultContent-1)+") a").attr('href').substr(1);}else{var defaultTab=param.defaultContent;}
|
||||
$(thisId+" .tabs li a").each(function(){var tabToHide=$(this).attr('href').substr(1);$("#"+tabToHide).addClass('easytabs-tab-content');});hideAll();changeContent(defaultTab);function hideAll(){$(thisId+" .easytabs-tab-content").hide();}
|
||||
function changeContent(tabId){hideAll();$(thisId+" .tabs li").removeClass(param.activeClass);$(thisId+" .tabs li a[href=#"+tabId+"]").closest('li').addClass(param.activeClass);if(param.fadeSpeed!="none")
|
||||
{$(thisId+" #"+tabId).fadeIn(param.fadeSpeed);}else{$(thisId+" #"+tabId).show();}}
|
||||
$(thisId+" .tabs li").click(function(){var tabId=$(this).find('a').attr('href').substr(1);changeContent(tabId);return false;});});}})(jQuery);
|
||||
@@ -0,0 +1,129 @@
|
||||
/*Notes about grid:
|
||||
Columns: 12
|
||||
Grid Width: 825px
|
||||
Column Width: 55px
|
||||
Gutter Width: 15px
|
||||
-------------------------------*/
|
||||
|
||||
|
||||
|
||||
.section {margin-bottom: 18px;
|
||||
}
|
||||
.section:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
|
||||
.section {*zoom: 1;}
|
||||
|
||||
.section .firstcolumn,
|
||||
.section .firstcol {margin-left: 0;}
|
||||
|
||||
|
||||
/* Border on left hand side of a column. */
|
||||
.border {
|
||||
padding-left: 7px;
|
||||
margin-left: 7px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
/* Border with more whitespace, spans one column. */
|
||||
.colborder {
|
||||
padding-left: 42px;
|
||||
margin-left: 42px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* The Grid Classes */
|
||||
.grid1, .grid1_2cols, .grid1_3cols, .grid1_4cols, .grid2, .grid2_3cols, .grid2_4cols, .grid3, .grid3_2cols, .grid3_4cols, .grid4, .grid4_3cols, .grid5, .grid5_2cols, .grid5_3cols, .grid5_4cols, .grid6, .grid6_4cols, .grid7, .grid7_2cols, .grid7_3cols, .grid7_4cols, .grid8, .grid8_3cols, .grid9, .grid9_2cols, .grid9_4cols, .grid10, .grid10_3cols, .grid10_4cols, .grid11, .grid11_2cols, .grid11_3cols, .grid11_4cols, .grid12
|
||||
{margin-left: 15px;float: left;display: inline; overflow: hidden;}
|
||||
|
||||
|
||||
.width1, .grid1, .span-1 {width: 55px;}
|
||||
.width1_2cols,.grid1_2cols {width: 20px;}
|
||||
.width1_3cols,.grid1_3cols {width: 8px;}
|
||||
.width1_4cols,.grid1_4cols {width: 2px;}
|
||||
.input_width1 {width: 49px;}
|
||||
|
||||
.width2, .grid2, .span-2 {width: 125px;}
|
||||
.width2_3cols,.grid2_3cols {width: 31px;}
|
||||
.width2_4cols,.grid2_4cols {width: 20px;}
|
||||
.input_width2 {width: 119px;}
|
||||
|
||||
.width3, .grid3, .span-3 {width: 195px;}
|
||||
.width3_2cols,.grid3_2cols {width: 90px;}
|
||||
.width3_4cols,.grid3_4cols {width: 37px;}
|
||||
.input_width3 {width: 189px;}
|
||||
|
||||
.width4, .grid4, .span-4 {width: 265px;}
|
||||
.width4_3cols,.grid4_3cols {width: 78px;}
|
||||
.input_width4 {width: 259px;}
|
||||
|
||||
.width5, .grid5, .span-5 {width: 335px;}
|
||||
.width5_2cols,.grid5_2cols {width: 160px;}
|
||||
.width5_3cols,.grid5_3cols {width: 101px;}
|
||||
.width5_4cols,.grid5_4cols {width: 72px;}
|
||||
.input_width5 {width: 329px;}
|
||||
|
||||
.width6, .grid6, .span-6 {width: 405px;}
|
||||
.width6_4cols,.grid6_4cols {width: 90px;}
|
||||
.input_width6 {width: 399px;}
|
||||
|
||||
.width7, .grid7, .span-7 {width: 475px;}
|
||||
.width7_2cols,.grid7_2cols {width: 230px;}
|
||||
.width7_3cols,.grid7_3cols {width: 148px;}
|
||||
.width7_4cols,.grid7_4cols {width: 107px;}
|
||||
.input_width7 {width: 469px;}
|
||||
|
||||
.width8, .grid8, .span-8 {width: 545px;}
|
||||
.width8_3cols,.grid8_3cols {width: 171px;}
|
||||
.input_width8 {width: 539px;}
|
||||
|
||||
.width9, .grid9, .span-9 {width: 615px;}
|
||||
.width9_2cols,.grid9_2cols {width: 300px;}
|
||||
.width9_4cols,.grid9_4cols {width: 142px;}
|
||||
.input_width9 {width: 609px;}
|
||||
|
||||
.width10, .grid10, .span-10 {width: 685px;}
|
||||
.width10_3cols,.grid10_3cols {width: 218px;}
|
||||
.width10_4cols,.grid10_4cols {width: 160px;}
|
||||
.input_width10 {width: 679px;}
|
||||
|
||||
.width11, .grid11, .span-11 {width: 755px;}
|
||||
.width11_2cols,.grid11_2cols {width: 370px;}
|
||||
.width11_3cols,.grid11_3cols {width: 241px;}
|
||||
.width11_4cols,.grid11_4cols {width: 177px;}
|
||||
.input_width11 {width: 749px;}
|
||||
|
||||
.width12, .grid12, .span-12 {width: 825px;}
|
||||
.input_width12 {width: 819px;}
|
||||
|
||||
/* Subdivided grid spaces */
|
||||
.emptycols_left1, .prepend-1 {padding-left: 70px;}
|
||||
.emptycols_right1, .append-1 {padding-right: 70px;}
|
||||
.emptycols_left2, .prepend-2 {padding-left: 140px;}
|
||||
.emptycols_right2, .append-2 {padding-right: 140px;}
|
||||
.emptycols_left3, .prepend-3 {padding-left: 210px;}
|
||||
.emptycols_right3, .append-3 {padding-right: 210px;}
|
||||
.emptycols_left4, .prepend-4 {padding-left: 280px;}
|
||||
.emptycols_right4, .append-4 {padding-right: 280px;}
|
||||
.emptycols_left5, .prepend-5 {padding-left: 350px;}
|
||||
.emptycols_right5, .append-5 {padding-right: 350px;}
|
||||
.emptycols_left6, .prepend-6 {padding-left: 420px;}
|
||||
.emptycols_right6, .append-6 {padding-right: 420px;}
|
||||
.emptycols_left7, .prepend-7 {padding-left: 490px;}
|
||||
.emptycols_right7, .append-7 {padding-right: 490px;}
|
||||
.emptycols_left8, .prepend-8 {padding-left: 560px;}
|
||||
.emptycols_right8, .append-8 {padding-right: 560px;}
|
||||
.emptycols_left9, .prepend-9 {padding-left: 630px;}
|
||||
.emptycols_right9, .append-9 {padding-right: 630px;}
|
||||
.emptycols_left10, .prepend-10 {padding-left: 700px;}
|
||||
.emptycols_right10, .append-10 {padding-right: 700px;}
|
||||
.emptycols_left11, .prepend-11 {padding-left: 770px;}
|
||||
.emptycols_right11, .append-11 {padding-right: 770px;}
|
||||
.pull-1 {margin-left: -70px;}
|
||||
.push-1 {margin-right: -70px;margin-left: 18px;float: right;}
|
||||
.pull-2 {margin-left: -140px;}
|
||||
.push-2 {margin-right: -140px;margin-left: 18px;float: right;}
|
||||
.pull-3 {margin-left: -210px;}
|
||||
.push-3 {margin-right: -210px;margin-left: 18px;float: right;}
|
||||
.pull-4 {margin-left: -280px;}
|
||||
.push-4 {margin-right: -280px;margin-left: 18px;float: right;}
|
||||
@@ -0,0 +1,396 @@
|
||||
@import url('grid_12-825-55-15.css');
|
||||
|
||||
/*
|
||||
CSS Reset by Eric Meyer - Released under Public Domain
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center, dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend, table,
|
||||
caption, tbody, tfoot, thead, tr, th, td
|
||||
{margin: 0;padding: 0;border: 0;outline: 0;
|
||||
font-size: 100%;vertical-align: baseline;
|
||||
background: transparent;}
|
||||
body {line-height: 1;}
|
||||
ol, ul {list-style: none;}
|
||||
blockquote, q {quotes: none;}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {content: ''; content: none;}
|
||||
:focus {outline: 0;}
|
||||
ins {text-decoration: none;}
|
||||
del {text-decoration: line-through;}
|
||||
table {border-collapse: collapse;border-spacing: 0;}
|
||||
|
||||
|
||||
|
||||
|
||||
body {
|
||||
color: #000;
|
||||
background-color: #dcdcdc;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #1883ba;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 32px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#container {
|
||||
width: 865px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
|
||||
#header {
|
||||
padding: 20px;
|
||||
font-size: 36px;
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#header span {
|
||||
color: #666;
|
||||
}
|
||||
#main_content {
|
||||
background-color: #fff;
|
||||
padding: 60px 20px 20px;
|
||||
}
|
||||
|
||||
|
||||
#footer p {
|
||||
margin: 0;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 50px;
|
||||
color: #333;
|
||||
font: 10px Arial, sans-serif;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
width: 100%;
|
||||
height: 31px;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li {
|
||||
float: left;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li a {
|
||||
display: block;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font: bold 11px/11px 'Arial';
|
||||
text-transform: uppercase;
|
||||
padding: 10px 15px;
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
|
||||
.tabs li a:hover {
|
||||
background-color: #00b3ff;
|
||||
|
||||
}
|
||||
|
||||
.tabs li.active a {
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
div.huge {
|
||||
|
||||
font-size: 120px;
|
||||
line-height: 1em;
|
||||
padding: 0;
|
||||
letter-spacing: -.02em;
|
||||
overflow: hidden;
|
||||
}
|
||||
div.glyph_range {
|
||||
font-size: 72px;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
||||
.size10{ font-size: 10px; }
|
||||
.size11{ font-size: 11px; }
|
||||
.size12{ font-size: 12px; }
|
||||
.size13{ font-size: 13px; }
|
||||
.size14{ font-size: 14px; }
|
||||
.size16{ font-size: 16px; }
|
||||
.size18{ font-size: 18px; }
|
||||
.size20{ font-size: 20px; }
|
||||
.size24{ font-size: 24px; }
|
||||
.size30{ font-size: 30px; }
|
||||
.size36{ font-size: 36px; }
|
||||
.size48{ font-size: 48px; }
|
||||
.size60{ font-size: 60px; }
|
||||
.size72{ font-size: 72px; }
|
||||
.size90{ font-size: 90px; }
|
||||
|
||||
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row2 { height: 160px;}
|
||||
.psample_row3 { height: 160px;}
|
||||
.psample_row4 { height: 160px;}
|
||||
|
||||
.psample {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.psample p {
|
||||
line-height: 1.3em;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.psample span {
|
||||
margin-right: .5em;
|
||||
}
|
||||
|
||||
.white_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNrs3TsKgFAMRUE/eer+NxztxMYuEWQG3ECKwwUF58ycAKixOAGAyAKILAAiCyCyACILgMgCiCyAyAIgsgAiCyCyAIgsgMgCiCwAIgsgsgAiC4DIAogsACIL0CWuZ3UGgLrIhjMA1EV2OAOAJQtgyQLwjOzmDAAiCyCyAIgsQFtkd2cAEFkAkQVAZAHaIns4A4AlC2DJAiCyACILILIAiCzAV5H1dQGAJQsgsgCILIDIAvwisl58AViyAJYsACILILIAIgvAe2T9EhxAZAFEFgCRBeiL7HAGgLrIhjMAWLIAliwAt1OAAQDwygTBulLIlQAAAABJRU5ErkJggg==);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.black_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAPJJREFUeNrs3TEKhTAQRVGjibr/9QoxhY2N3Ywo50A28IrLwP9g6b1PAMSYTQAgsgAiC4DIAogsgMgCILIAIgsgsgCILIDIAogsACILILIAIguAyAKILIDIAiCyACILgMgCZCnjLWYAiFGvB0BQZJsZAFyyAC5ZAO6RXc0AILIAIguAyAKkRXYzA4DIAogsACILkBbZ3QwALlkAlywAIgsgsgAiC4DIArwVWf8uAHDJAogsACILILIAv4isH74AXLIALlkARBZAZAFEFoDnyPokOIDIAogsACILkBfZZgaAuMhWMwC4ZAE+p4x3mAEgxinAAJ+XBbPWGkwAAAAAAElFTkSuQmCC);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.fullreverse {
|
||||
background: #000 !important;
|
||||
color: #fff !important;
|
||||
margin-left: -20px;
|
||||
padding-left: 20px;
|
||||
margin-right: -20px;
|
||||
padding-right: 20px;
|
||||
padding: 20px;
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
|
||||
.sample_table td {
|
||||
padding-top: 3px;
|
||||
padding-bottom:5px;
|
||||
padding-left: 5px;
|
||||
vertical-align: middle;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
.sample_table td:first-child {
|
||||
background-color: #eee;
|
||||
text-align: right;
|
||||
padding-right: 5px;
|
||||
padding-left: 0;
|
||||
padding: 5px;
|
||||
font: 11px/12px "Courier New", Courier, mono;
|
||||
}
|
||||
|
||||
code {
|
||||
white-space: pre;
|
||||
background-color: #eee;
|
||||
display: block;
|
||||
padding: 10px;
|
||||
margin-bottom: 18px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
.bottom,.last {margin-bottom:0 !important; padding-bottom:0 !important;}
|
||||
|
||||
.box {
|
||||
padding: 18px;
|
||||
margin-bottom: 18px;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.reverse,.reversed { background: #000 !important;color: #fff !important; border: none !important;}
|
||||
|
||||
#bodycomparison {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
font-size: 72px;
|
||||
height: 90px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#bodycomparison div{
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
display: inline;
|
||||
margin: 0 15px 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#bodycomparison div span{
|
||||
font: 10px Arial;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
#xheight {
|
||||
float: none;
|
||||
position: absolute;
|
||||
color: #d9f3ff;
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
}
|
||||
|
||||
.fontbody {
|
||||
position: relative;
|
||||
}
|
||||
.arialbody{
|
||||
font-family: Arial;
|
||||
position: relative;
|
||||
}
|
||||
.verdanabody{
|
||||
font-family: Verdana;
|
||||
position: relative;
|
||||
}
|
||||
.georgiabody{
|
||||
font-family: Georgia;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* @group Layout page
|
||||
*/
|
||||
|
||||
#layout h1 {
|
||||
font-size: 36px;
|
||||
line-height: 42px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h2 {
|
||||
font-size: 24px;
|
||||
line-height: 23px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h3 {
|
||||
font-size: 22px;
|
||||
line-height: 1.4em;
|
||||
margin-top: 1em;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
||||
#layout p.byline {
|
||||
font-size: 12px;
|
||||
margin-top: 18px;
|
||||
line-height: 12px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#layout p {
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
|
||||
#layout p.large{
|
||||
font-size: 18px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
#layout .sidebar p{
|
||||
font-size: 12px;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
#layout p.caption {
|
||||
font-size: 10px;
|
||||
margin-top: -16px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
/* @group Glyphs */
|
||||
|
||||
#glyph_chart div{
|
||||
background-color: #d9f3ff;
|
||||
color: black;
|
||||
float: left;
|
||||
font-size: 36px;
|
||||
height: 1.2em;
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 1px;
|
||||
margin-right: 1px;
|
||||
text-align: center;
|
||||
width: 1.2em;
|
||||
position: relative;
|
||||
padding: .6em .2em .2em;
|
||||
}
|
||||
|
||||
#glyph_chart div p {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: block;
|
||||
text-align: center;
|
||||
font: bold 9px Arial, sans-serif;
|
||||
background-color: #3a768f;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
padding: 2px 0;
|
||||
}
|
||||
|
||||
|
||||
#glyphs h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
/* @end */
|
||||
|
||||
/* @group Installing */
|
||||
|
||||
#installing {
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
#installing p,
|
||||
#glyphs p{
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 18px;
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#installing h3{
|
||||
font-size: 15px;
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
#rendering h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.render_table td {
|
||||
font: 11px "Courier New", Courier, mono;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 28, 2015 */
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'notokr-demilight';
|
||||
src: url('notokr-demilight.eot');
|
||||
src: url('notokr-demilight.eot?#iefix') format('embedded-opentype'),
|
||||
url('notokr-demilight.woff2') format('woff2'),
|
||||
url('notokr-demilight.woff') format('woff'),
|
||||
url('notokr-demilight.ttf') format('truetype'),
|
||||
url('notokr-demilight.svg#notokr-demilight') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
# Font Squirrel Font-face Generator Configuration File
|
||||
# Upload this file to the generator to recreate the settings
|
||||
# you used to create these fonts.
|
||||
|
||||
{"mode":"basic","formats":["ttf","woff","woff2","eotz"],"tt_instructor":"default","fix_vertical_metrics":"Y","fix_gasp":"xy","add_spaces":"Y","add_hyphens":"Y","fallback":"none","fallback_custom":"100","options_subset":"basic","subset_custom":"","subset_custom_range":"","subset_ot_features_list":"","css_stylesheet":"stylesheet.css","filename_suffix":"-webfont","emsquare":"2048","spacing_adjustment":"0"}
|
||||
File diff suppressed because it is too large.
Load diff
Binary file not shown.
File diff suppressed because it is too large.
Load diff
|
After Width: | Height: | Size: 731 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,7 @@
|
||||
(function($){$.fn.easyTabs=function(option){var param=jQuery.extend({fadeSpeed:"fast",defaultContent:1,activeClass:'active'},option);$(this).each(function(){var thisId="#"+this.id;if(param.defaultContent==''){param.defaultContent=1;}
|
||||
if(typeof param.defaultContent=="number")
|
||||
{var defaultTab=$(thisId+" .tabs li:eq("+(param.defaultContent-1)+") a").attr('href').substr(1);}else{var defaultTab=param.defaultContent;}
|
||||
$(thisId+" .tabs li a").each(function(){var tabToHide=$(this).attr('href').substr(1);$("#"+tabToHide).addClass('easytabs-tab-content');});hideAll();changeContent(defaultTab);function hideAll(){$(thisId+" .easytabs-tab-content").hide();}
|
||||
function changeContent(tabId){hideAll();$(thisId+" .tabs li").removeClass(param.activeClass);$(thisId+" .tabs li a[href=#"+tabId+"]").closest('li').addClass(param.activeClass);if(param.fadeSpeed!="none")
|
||||
{$(thisId+" #"+tabId).fadeIn(param.fadeSpeed);}else{$(thisId+" #"+tabId).show();}}
|
||||
$(thisId+" .tabs li").click(function(){var tabId=$(this).find('a').attr('href').substr(1);changeContent(tabId);return false;});});}})(jQuery);
|
||||
@@ -0,0 +1,129 @@
|
||||
/*Notes about grid:
|
||||
Columns: 12
|
||||
Grid Width: 825px
|
||||
Column Width: 55px
|
||||
Gutter Width: 15px
|
||||
-------------------------------*/
|
||||
|
||||
|
||||
|
||||
.section {margin-bottom: 18px;
|
||||
}
|
||||
.section:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
|
||||
.section {*zoom: 1;}
|
||||
|
||||
.section .firstcolumn,
|
||||
.section .firstcol {margin-left: 0;}
|
||||
|
||||
|
||||
/* Border on left hand side of a column. */
|
||||
.border {
|
||||
padding-left: 7px;
|
||||
margin-left: 7px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
/* Border with more whitespace, spans one column. */
|
||||
.colborder {
|
||||
padding-left: 42px;
|
||||
margin-left: 42px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* The Grid Classes */
|
||||
.grid1, .grid1_2cols, .grid1_3cols, .grid1_4cols, .grid2, .grid2_3cols, .grid2_4cols, .grid3, .grid3_2cols, .grid3_4cols, .grid4, .grid4_3cols, .grid5, .grid5_2cols, .grid5_3cols, .grid5_4cols, .grid6, .grid6_4cols, .grid7, .grid7_2cols, .grid7_3cols, .grid7_4cols, .grid8, .grid8_3cols, .grid9, .grid9_2cols, .grid9_4cols, .grid10, .grid10_3cols, .grid10_4cols, .grid11, .grid11_2cols, .grid11_3cols, .grid11_4cols, .grid12
|
||||
{margin-left: 15px;float: left;display: inline; overflow: hidden;}
|
||||
|
||||
|
||||
.width1, .grid1, .span-1 {width: 55px;}
|
||||
.width1_2cols,.grid1_2cols {width: 20px;}
|
||||
.width1_3cols,.grid1_3cols {width: 8px;}
|
||||
.width1_4cols,.grid1_4cols {width: 2px;}
|
||||
.input_width1 {width: 49px;}
|
||||
|
||||
.width2, .grid2, .span-2 {width: 125px;}
|
||||
.width2_3cols,.grid2_3cols {width: 31px;}
|
||||
.width2_4cols,.grid2_4cols {width: 20px;}
|
||||
.input_width2 {width: 119px;}
|
||||
|
||||
.width3, .grid3, .span-3 {width: 195px;}
|
||||
.width3_2cols,.grid3_2cols {width: 90px;}
|
||||
.width3_4cols,.grid3_4cols {width: 37px;}
|
||||
.input_width3 {width: 189px;}
|
||||
|
||||
.width4, .grid4, .span-4 {width: 265px;}
|
||||
.width4_3cols,.grid4_3cols {width: 78px;}
|
||||
.input_width4 {width: 259px;}
|
||||
|
||||
.width5, .grid5, .span-5 {width: 335px;}
|
||||
.width5_2cols,.grid5_2cols {width: 160px;}
|
||||
.width5_3cols,.grid5_3cols {width: 101px;}
|
||||
.width5_4cols,.grid5_4cols {width: 72px;}
|
||||
.input_width5 {width: 329px;}
|
||||
|
||||
.width6, .grid6, .span-6 {width: 405px;}
|
||||
.width6_4cols,.grid6_4cols {width: 90px;}
|
||||
.input_width6 {width: 399px;}
|
||||
|
||||
.width7, .grid7, .span-7 {width: 475px;}
|
||||
.width7_2cols,.grid7_2cols {width: 230px;}
|
||||
.width7_3cols,.grid7_3cols {width: 148px;}
|
||||
.width7_4cols,.grid7_4cols {width: 107px;}
|
||||
.input_width7 {width: 469px;}
|
||||
|
||||
.width8, .grid8, .span-8 {width: 545px;}
|
||||
.width8_3cols,.grid8_3cols {width: 171px;}
|
||||
.input_width8 {width: 539px;}
|
||||
|
||||
.width9, .grid9, .span-9 {width: 615px;}
|
||||
.width9_2cols,.grid9_2cols {width: 300px;}
|
||||
.width9_4cols,.grid9_4cols {width: 142px;}
|
||||
.input_width9 {width: 609px;}
|
||||
|
||||
.width10, .grid10, .span-10 {width: 685px;}
|
||||
.width10_3cols,.grid10_3cols {width: 218px;}
|
||||
.width10_4cols,.grid10_4cols {width: 160px;}
|
||||
.input_width10 {width: 679px;}
|
||||
|
||||
.width11, .grid11, .span-11 {width: 755px;}
|
||||
.width11_2cols,.grid11_2cols {width: 370px;}
|
||||
.width11_3cols,.grid11_3cols {width: 241px;}
|
||||
.width11_4cols,.grid11_4cols {width: 177px;}
|
||||
.input_width11 {width: 749px;}
|
||||
|
||||
.width12, .grid12, .span-12 {width: 825px;}
|
||||
.input_width12 {width: 819px;}
|
||||
|
||||
/* Subdivided grid spaces */
|
||||
.emptycols_left1, .prepend-1 {padding-left: 70px;}
|
||||
.emptycols_right1, .append-1 {padding-right: 70px;}
|
||||
.emptycols_left2, .prepend-2 {padding-left: 140px;}
|
||||
.emptycols_right2, .append-2 {padding-right: 140px;}
|
||||
.emptycols_left3, .prepend-3 {padding-left: 210px;}
|
||||
.emptycols_right3, .append-3 {padding-right: 210px;}
|
||||
.emptycols_left4, .prepend-4 {padding-left: 280px;}
|
||||
.emptycols_right4, .append-4 {padding-right: 280px;}
|
||||
.emptycols_left5, .prepend-5 {padding-left: 350px;}
|
||||
.emptycols_right5, .append-5 {padding-right: 350px;}
|
||||
.emptycols_left6, .prepend-6 {padding-left: 420px;}
|
||||
.emptycols_right6, .append-6 {padding-right: 420px;}
|
||||
.emptycols_left7, .prepend-7 {padding-left: 490px;}
|
||||
.emptycols_right7, .append-7 {padding-right: 490px;}
|
||||
.emptycols_left8, .prepend-8 {padding-left: 560px;}
|
||||
.emptycols_right8, .append-8 {padding-right: 560px;}
|
||||
.emptycols_left9, .prepend-9 {padding-left: 630px;}
|
||||
.emptycols_right9, .append-9 {padding-right: 630px;}
|
||||
.emptycols_left10, .prepend-10 {padding-left: 700px;}
|
||||
.emptycols_right10, .append-10 {padding-right: 700px;}
|
||||
.emptycols_left11, .prepend-11 {padding-left: 770px;}
|
||||
.emptycols_right11, .append-11 {padding-right: 770px;}
|
||||
.pull-1 {margin-left: -70px;}
|
||||
.push-1 {margin-right: -70px;margin-left: 18px;float: right;}
|
||||
.pull-2 {margin-left: -140px;}
|
||||
.push-2 {margin-right: -140px;margin-left: 18px;float: right;}
|
||||
.pull-3 {margin-left: -210px;}
|
||||
.push-3 {margin-right: -210px;margin-left: 18px;float: right;}
|
||||
.pull-4 {margin-left: -280px;}
|
||||
.push-4 {margin-right: -280px;margin-left: 18px;float: right;}
|
||||
@@ -0,0 +1,396 @@
|
||||
@import url('grid_12-825-55-15.css');
|
||||
|
||||
/*
|
||||
CSS Reset by Eric Meyer - Released under Public Domain
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center, dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend, table,
|
||||
caption, tbody, tfoot, thead, tr, th, td
|
||||
{margin: 0;padding: 0;border: 0;outline: 0;
|
||||
font-size: 100%;vertical-align: baseline;
|
||||
background: transparent;}
|
||||
body {line-height: 1;}
|
||||
ol, ul {list-style: none;}
|
||||
blockquote, q {quotes: none;}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {content: ''; content: none;}
|
||||
:focus {outline: 0;}
|
||||
ins {text-decoration: none;}
|
||||
del {text-decoration: line-through;}
|
||||
table {border-collapse: collapse;border-spacing: 0;}
|
||||
|
||||
|
||||
|
||||
|
||||
body {
|
||||
color: #000;
|
||||
background-color: #dcdcdc;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #1883ba;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 32px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#container {
|
||||
width: 865px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
|
||||
#header {
|
||||
padding: 20px;
|
||||
font-size: 36px;
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#header span {
|
||||
color: #666;
|
||||
}
|
||||
#main_content {
|
||||
background-color: #fff;
|
||||
padding: 60px 20px 20px;
|
||||
}
|
||||
|
||||
|
||||
#footer p {
|
||||
margin: 0;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 50px;
|
||||
color: #333;
|
||||
font: 10px Arial, sans-serif;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
width: 100%;
|
||||
height: 31px;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li {
|
||||
float: left;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li a {
|
||||
display: block;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font: bold 11px/11px 'Arial';
|
||||
text-transform: uppercase;
|
||||
padding: 10px 15px;
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
|
||||
.tabs li a:hover {
|
||||
background-color: #00b3ff;
|
||||
|
||||
}
|
||||
|
||||
.tabs li.active a {
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
div.huge {
|
||||
|
||||
font-size: 120px;
|
||||
line-height: 1em;
|
||||
padding: 0;
|
||||
letter-spacing: -.02em;
|
||||
overflow: hidden;
|
||||
}
|
||||
div.glyph_range {
|
||||
font-size: 72px;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
||||
.size10{ font-size: 10px; }
|
||||
.size11{ font-size: 11px; }
|
||||
.size12{ font-size: 12px; }
|
||||
.size13{ font-size: 13px; }
|
||||
.size14{ font-size: 14px; }
|
||||
.size16{ font-size: 16px; }
|
||||
.size18{ font-size: 18px; }
|
||||
.size20{ font-size: 20px; }
|
||||
.size24{ font-size: 24px; }
|
||||
.size30{ font-size: 30px; }
|
||||
.size36{ font-size: 36px; }
|
||||
.size48{ font-size: 48px; }
|
||||
.size60{ font-size: 60px; }
|
||||
.size72{ font-size: 72px; }
|
||||
.size90{ font-size: 90px; }
|
||||
|
||||
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row2 { height: 160px;}
|
||||
.psample_row3 { height: 160px;}
|
||||
.psample_row4 { height: 160px;}
|
||||
|
||||
.psample {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.psample p {
|
||||
line-height: 1.3em;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.psample span {
|
||||
margin-right: .5em;
|
||||
}
|
||||
|
||||
.white_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNrs3TsKgFAMRUE/eer+NxztxMYuEWQG3ECKwwUF58ycAKixOAGAyAKILAAiCyCyACILgMgCiCyAyAIgsgAiCyCyAIgsgMgCiCwAIgsgsgAiC4DIAogsACIL0CWuZ3UGgLrIhjMA1EV2OAOAJQtgyQLwjOzmDAAiCyCyAIgsQFtkd2cAEFkAkQVAZAHaIns4A4AlC2DJAiCyACILILIAiCzAV5H1dQGAJQsgsgCILIDIAvwisl58AViyAJYsACILILIAIgvAe2T9EhxAZAFEFgCRBeiL7HAGgLrIhjMAWLIAliwAt1OAAQDwygTBulLIlQAAAABJRU5ErkJggg==);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.black_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAPJJREFUeNrs3TEKhTAQRVGjibr/9QoxhY2N3Ywo50A28IrLwP9g6b1PAMSYTQAgsgAiC4DIAogsgMgCILIAIgsgsgCILIDIAogsACILILIAIguAyAKILIDIAiCyACILgMgCZCnjLWYAiFGvB0BQZJsZAFyyAC5ZAO6RXc0AILIAIguAyAKkRXYzA4DIAogsACILkBbZ3QwALlkAlywAIgsgsgAiC4DIArwVWf8uAHDJAogsACILILIAv4isH74AXLIALlkARBZAZAFEFoDnyPokOIDIAogsACILkBfZZgaAuMhWMwC4ZAE+p4x3mAEgxinAAJ+XBbPWGkwAAAAAAElFTkSuQmCC);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.fullreverse {
|
||||
background: #000 !important;
|
||||
color: #fff !important;
|
||||
margin-left: -20px;
|
||||
padding-left: 20px;
|
||||
margin-right: -20px;
|
||||
padding-right: 20px;
|
||||
padding: 20px;
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
|
||||
.sample_table td {
|
||||
padding-top: 3px;
|
||||
padding-bottom:5px;
|
||||
padding-left: 5px;
|
||||
vertical-align: middle;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
.sample_table td:first-child {
|
||||
background-color: #eee;
|
||||
text-align: right;
|
||||
padding-right: 5px;
|
||||
padding-left: 0;
|
||||
padding: 5px;
|
||||
font: 11px/12px "Courier New", Courier, mono;
|
||||
}
|
||||
|
||||
code {
|
||||
white-space: pre;
|
||||
background-color: #eee;
|
||||
display: block;
|
||||
padding: 10px;
|
||||
margin-bottom: 18px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
.bottom,.last {margin-bottom:0 !important; padding-bottom:0 !important;}
|
||||
|
||||
.box {
|
||||
padding: 18px;
|
||||
margin-bottom: 18px;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.reverse,.reversed { background: #000 !important;color: #fff !important; border: none !important;}
|
||||
|
||||
#bodycomparison {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
font-size: 72px;
|
||||
height: 90px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#bodycomparison div{
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
display: inline;
|
||||
margin: 0 15px 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#bodycomparison div span{
|
||||
font: 10px Arial;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
#xheight {
|
||||
float: none;
|
||||
position: absolute;
|
||||
color: #d9f3ff;
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
}
|
||||
|
||||
.fontbody {
|
||||
position: relative;
|
||||
}
|
||||
.arialbody{
|
||||
font-family: Arial;
|
||||
position: relative;
|
||||
}
|
||||
.verdanabody{
|
||||
font-family: Verdana;
|
||||
position: relative;
|
||||
}
|
||||
.georgiabody{
|
||||
font-family: Georgia;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* @group Layout page
|
||||
*/
|
||||
|
||||
#layout h1 {
|
||||
font-size: 36px;
|
||||
line-height: 42px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h2 {
|
||||
font-size: 24px;
|
||||
line-height: 23px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h3 {
|
||||
font-size: 22px;
|
||||
line-height: 1.4em;
|
||||
margin-top: 1em;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
||||
#layout p.byline {
|
||||
font-size: 12px;
|
||||
margin-top: 18px;
|
||||
line-height: 12px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#layout p {
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
|
||||
#layout p.large{
|
||||
font-size: 18px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
#layout .sidebar p{
|
||||
font-size: 12px;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
#layout p.caption {
|
||||
font-size: 10px;
|
||||
margin-top: -16px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
/* @group Glyphs */
|
||||
|
||||
#glyph_chart div{
|
||||
background-color: #d9f3ff;
|
||||
color: black;
|
||||
float: left;
|
||||
font-size: 36px;
|
||||
height: 1.2em;
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 1px;
|
||||
margin-right: 1px;
|
||||
text-align: center;
|
||||
width: 1.2em;
|
||||
position: relative;
|
||||
padding: .6em .2em .2em;
|
||||
}
|
||||
|
||||
#glyph_chart div p {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: block;
|
||||
text-align: center;
|
||||
font: bold 9px Arial, sans-serif;
|
||||
background-color: #3a768f;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
padding: 2px 0;
|
||||
}
|
||||
|
||||
|
||||
#glyphs h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
/* @end */
|
||||
|
||||
/* @group Installing */
|
||||
|
||||
#installing {
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
#installing p,
|
||||
#glyphs p{
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 18px;
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#installing h3{
|
||||
font-size: 15px;
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
#rendering h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.render_table td {
|
||||
font: 11px "Courier New", Courier, mono;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 28, 2015 */
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'notokr-light';
|
||||
src: url('notokr-light.eot');
|
||||
src: url('notokr-light.eot?#iefix') format('embedded-opentype'),
|
||||
url('notokr-light.woff2') format('woff2'),
|
||||
url('notokr-light.woff') format('woff'),
|
||||
url('notokr-light.ttf') format('truetype'),
|
||||
url('notokr-light.svg#notokr-light') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
# Font Squirrel Font-face Generator Configuration File
|
||||
# Upload this file to the generator to recreate the settings
|
||||
# you used to create these fonts.
|
||||
|
||||
{"mode":"basic","formats":["ttf","woff","woff2","eotz"],"tt_instructor":"default","fix_vertical_metrics":"Y","fix_gasp":"xy","add_spaces":"Y","add_hyphens":"Y","fallback":"none","fallback_custom":"100","options_subset":"basic","subset_custom":"","subset_custom_range":"","subset_ot_features_list":"","css_stylesheet":"stylesheet.css","filename_suffix":"-webfont","emsquare":"2048","spacing_adjustment":"0"}
|
||||
File diff suppressed because it is too large.
Load diff
Binary file not shown.
File diff suppressed because it is too large.
Load diff
|
After Width: | Height: | Size: 700 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,7 @@
|
||||
(function($){$.fn.easyTabs=function(option){var param=jQuery.extend({fadeSpeed:"fast",defaultContent:1,activeClass:'active'},option);$(this).each(function(){var thisId="#"+this.id;if(param.defaultContent==''){param.defaultContent=1;}
|
||||
if(typeof param.defaultContent=="number")
|
||||
{var defaultTab=$(thisId+" .tabs li:eq("+(param.defaultContent-1)+") a").attr('href').substr(1);}else{var defaultTab=param.defaultContent;}
|
||||
$(thisId+" .tabs li a").each(function(){var tabToHide=$(this).attr('href').substr(1);$("#"+tabToHide).addClass('easytabs-tab-content');});hideAll();changeContent(defaultTab);function hideAll(){$(thisId+" .easytabs-tab-content").hide();}
|
||||
function changeContent(tabId){hideAll();$(thisId+" .tabs li").removeClass(param.activeClass);$(thisId+" .tabs li a[href=#"+tabId+"]").closest('li').addClass(param.activeClass);if(param.fadeSpeed!="none")
|
||||
{$(thisId+" #"+tabId).fadeIn(param.fadeSpeed);}else{$(thisId+" #"+tabId).show();}}
|
||||
$(thisId+" .tabs li").click(function(){var tabId=$(this).find('a').attr('href').substr(1);changeContent(tabId);return false;});});}})(jQuery);
|
||||
@@ -0,0 +1,129 @@
|
||||
/*Notes about grid:
|
||||
Columns: 12
|
||||
Grid Width: 825px
|
||||
Column Width: 55px
|
||||
Gutter Width: 15px
|
||||
-------------------------------*/
|
||||
|
||||
|
||||
|
||||
.section {margin-bottom: 18px;
|
||||
}
|
||||
.section:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
|
||||
.section {*zoom: 1;}
|
||||
|
||||
.section .firstcolumn,
|
||||
.section .firstcol {margin-left: 0;}
|
||||
|
||||
|
||||
/* Border on left hand side of a column. */
|
||||
.border {
|
||||
padding-left: 7px;
|
||||
margin-left: 7px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
/* Border with more whitespace, spans one column. */
|
||||
.colborder {
|
||||
padding-left: 42px;
|
||||
margin-left: 42px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* The Grid Classes */
|
||||
.grid1, .grid1_2cols, .grid1_3cols, .grid1_4cols, .grid2, .grid2_3cols, .grid2_4cols, .grid3, .grid3_2cols, .grid3_4cols, .grid4, .grid4_3cols, .grid5, .grid5_2cols, .grid5_3cols, .grid5_4cols, .grid6, .grid6_4cols, .grid7, .grid7_2cols, .grid7_3cols, .grid7_4cols, .grid8, .grid8_3cols, .grid9, .grid9_2cols, .grid9_4cols, .grid10, .grid10_3cols, .grid10_4cols, .grid11, .grid11_2cols, .grid11_3cols, .grid11_4cols, .grid12
|
||||
{margin-left: 15px;float: left;display: inline; overflow: hidden;}
|
||||
|
||||
|
||||
.width1, .grid1, .span-1 {width: 55px;}
|
||||
.width1_2cols,.grid1_2cols {width: 20px;}
|
||||
.width1_3cols,.grid1_3cols {width: 8px;}
|
||||
.width1_4cols,.grid1_4cols {width: 2px;}
|
||||
.input_width1 {width: 49px;}
|
||||
|
||||
.width2, .grid2, .span-2 {width: 125px;}
|
||||
.width2_3cols,.grid2_3cols {width: 31px;}
|
||||
.width2_4cols,.grid2_4cols {width: 20px;}
|
||||
.input_width2 {width: 119px;}
|
||||
|
||||
.width3, .grid3, .span-3 {width: 195px;}
|
||||
.width3_2cols,.grid3_2cols {width: 90px;}
|
||||
.width3_4cols,.grid3_4cols {width: 37px;}
|
||||
.input_width3 {width: 189px;}
|
||||
|
||||
.width4, .grid4, .span-4 {width: 265px;}
|
||||
.width4_3cols,.grid4_3cols {width: 78px;}
|
||||
.input_width4 {width: 259px;}
|
||||
|
||||
.width5, .grid5, .span-5 {width: 335px;}
|
||||
.width5_2cols,.grid5_2cols {width: 160px;}
|
||||
.width5_3cols,.grid5_3cols {width: 101px;}
|
||||
.width5_4cols,.grid5_4cols {width: 72px;}
|
||||
.input_width5 {width: 329px;}
|
||||
|
||||
.width6, .grid6, .span-6 {width: 405px;}
|
||||
.width6_4cols,.grid6_4cols {width: 90px;}
|
||||
.input_width6 {width: 399px;}
|
||||
|
||||
.width7, .grid7, .span-7 {width: 475px;}
|
||||
.width7_2cols,.grid7_2cols {width: 230px;}
|
||||
.width7_3cols,.grid7_3cols {width: 148px;}
|
||||
.width7_4cols,.grid7_4cols {width: 107px;}
|
||||
.input_width7 {width: 469px;}
|
||||
|
||||
.width8, .grid8, .span-8 {width: 545px;}
|
||||
.width8_3cols,.grid8_3cols {width: 171px;}
|
||||
.input_width8 {width: 539px;}
|
||||
|
||||
.width9, .grid9, .span-9 {width: 615px;}
|
||||
.width9_2cols,.grid9_2cols {width: 300px;}
|
||||
.width9_4cols,.grid9_4cols {width: 142px;}
|
||||
.input_width9 {width: 609px;}
|
||||
|
||||
.width10, .grid10, .span-10 {width: 685px;}
|
||||
.width10_3cols,.grid10_3cols {width: 218px;}
|
||||
.width10_4cols,.grid10_4cols {width: 160px;}
|
||||
.input_width10 {width: 679px;}
|
||||
|
||||
.width11, .grid11, .span-11 {width: 755px;}
|
||||
.width11_2cols,.grid11_2cols {width: 370px;}
|
||||
.width11_3cols,.grid11_3cols {width: 241px;}
|
||||
.width11_4cols,.grid11_4cols {width: 177px;}
|
||||
.input_width11 {width: 749px;}
|
||||
|
||||
.width12, .grid12, .span-12 {width: 825px;}
|
||||
.input_width12 {width: 819px;}
|
||||
|
||||
/* Subdivided grid spaces */
|
||||
.emptycols_left1, .prepend-1 {padding-left: 70px;}
|
||||
.emptycols_right1, .append-1 {padding-right: 70px;}
|
||||
.emptycols_left2, .prepend-2 {padding-left: 140px;}
|
||||
.emptycols_right2, .append-2 {padding-right: 140px;}
|
||||
.emptycols_left3, .prepend-3 {padding-left: 210px;}
|
||||
.emptycols_right3, .append-3 {padding-right: 210px;}
|
||||
.emptycols_left4, .prepend-4 {padding-left: 280px;}
|
||||
.emptycols_right4, .append-4 {padding-right: 280px;}
|
||||
.emptycols_left5, .prepend-5 {padding-left: 350px;}
|
||||
.emptycols_right5, .append-5 {padding-right: 350px;}
|
||||
.emptycols_left6, .prepend-6 {padding-left: 420px;}
|
||||
.emptycols_right6, .append-6 {padding-right: 420px;}
|
||||
.emptycols_left7, .prepend-7 {padding-left: 490px;}
|
||||
.emptycols_right7, .append-7 {padding-right: 490px;}
|
||||
.emptycols_left8, .prepend-8 {padding-left: 560px;}
|
||||
.emptycols_right8, .append-8 {padding-right: 560px;}
|
||||
.emptycols_left9, .prepend-9 {padding-left: 630px;}
|
||||
.emptycols_right9, .append-9 {padding-right: 630px;}
|
||||
.emptycols_left10, .prepend-10 {padding-left: 700px;}
|
||||
.emptycols_right10, .append-10 {padding-right: 700px;}
|
||||
.emptycols_left11, .prepend-11 {padding-left: 770px;}
|
||||
.emptycols_right11, .append-11 {padding-right: 770px;}
|
||||
.pull-1 {margin-left: -70px;}
|
||||
.push-1 {margin-right: -70px;margin-left: 18px;float: right;}
|
||||
.pull-2 {margin-left: -140px;}
|
||||
.push-2 {margin-right: -140px;margin-left: 18px;float: right;}
|
||||
.pull-3 {margin-left: -210px;}
|
||||
.push-3 {margin-right: -210px;margin-left: 18px;float: right;}
|
||||
.pull-4 {margin-left: -280px;}
|
||||
.push-4 {margin-right: -280px;margin-left: 18px;float: right;}
|
||||
@@ -0,0 +1,396 @@
|
||||
@import url('grid_12-825-55-15.css');
|
||||
|
||||
/*
|
||||
CSS Reset by Eric Meyer - Released under Public Domain
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center, dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend, table,
|
||||
caption, tbody, tfoot, thead, tr, th, td
|
||||
{margin: 0;padding: 0;border: 0;outline: 0;
|
||||
font-size: 100%;vertical-align: baseline;
|
||||
background: transparent;}
|
||||
body {line-height: 1;}
|
||||
ol, ul {list-style: none;}
|
||||
blockquote, q {quotes: none;}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {content: ''; content: none;}
|
||||
:focus {outline: 0;}
|
||||
ins {text-decoration: none;}
|
||||
del {text-decoration: line-through;}
|
||||
table {border-collapse: collapse;border-spacing: 0;}
|
||||
|
||||
|
||||
|
||||
|
||||
body {
|
||||
color: #000;
|
||||
background-color: #dcdcdc;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #1883ba;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 32px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#container {
|
||||
width: 865px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
|
||||
#header {
|
||||
padding: 20px;
|
||||
font-size: 36px;
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#header span {
|
||||
color: #666;
|
||||
}
|
||||
#main_content {
|
||||
background-color: #fff;
|
||||
padding: 60px 20px 20px;
|
||||
}
|
||||
|
||||
|
||||
#footer p {
|
||||
margin: 0;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 50px;
|
||||
color: #333;
|
||||
font: 10px Arial, sans-serif;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
width: 100%;
|
||||
height: 31px;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li {
|
||||
float: left;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
background-color: #444;
|
||||
}
|
||||
.tabs li a {
|
||||
display: block;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font: bold 11px/11px 'Arial';
|
||||
text-transform: uppercase;
|
||||
padding: 10px 15px;
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
|
||||
.tabs li a:hover {
|
||||
background-color: #00b3ff;
|
||||
|
||||
}
|
||||
|
||||
.tabs li.active a {
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
div.huge {
|
||||
|
||||
font-size: 120px;
|
||||
line-height: 1em;
|
||||
padding: 0;
|
||||
letter-spacing: -.02em;
|
||||
overflow: hidden;
|
||||
}
|
||||
div.glyph_range {
|
||||
font-size: 72px;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
||||
.size10{ font-size: 10px; }
|
||||
.size11{ font-size: 11px; }
|
||||
.size12{ font-size: 12px; }
|
||||
.size13{ font-size: 13px; }
|
||||
.size14{ font-size: 14px; }
|
||||
.size16{ font-size: 16px; }
|
||||
.size18{ font-size: 18px; }
|
||||
.size20{ font-size: 20px; }
|
||||
.size24{ font-size: 24px; }
|
||||
.size30{ font-size: 30px; }
|
||||
.size36{ font-size: 36px; }
|
||||
.size48{ font-size: 48px; }
|
||||
.size60{ font-size: 60px; }
|
||||
.size72{ font-size: 72px; }
|
||||
.size90{ font-size: 90px; }
|
||||
|
||||
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row1 { height: 120px;}
|
||||
.psample_row2 { height: 160px;}
|
||||
.psample_row3 { height: 160px;}
|
||||
.psample_row4 { height: 160px;}
|
||||
|
||||
.psample {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.psample p {
|
||||
line-height: 1.3em;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.psample span {
|
||||
margin-right: .5em;
|
||||
}
|
||||
|
||||
.white_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNrs3TsKgFAMRUE/eer+NxztxMYuEWQG3ECKwwUF58ycAKixOAGAyAKILAAiCyCyACILgMgCiCyAyAIgsgAiCyCyAIgsgMgCiCwAIgsgsgAiC4DIAogsACIL0CWuZ3UGgLrIhjMA1EV2OAOAJQtgyQLwjOzmDAAiCyCyAIgsQFtkd2cAEFkAkQVAZAHaIns4A4AlC2DJAiCyACILILIAiCzAV5H1dQGAJQsgsgCILIDIAvwisl58AViyAJYsACILILIAIgvAe2T9EhxAZAFEFgCRBeiL7HAGgLrIhjMAWLIAliwAt1OAAQDwygTBulLIlQAAAABJRU5ErkJggg==);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.black_blend {
|
||||
width: 100%;
|
||||
height: 61px;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVkAAAA9CAYAAAAH4BojAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAPJJREFUeNrs3TEKhTAQRVGjibr/9QoxhY2N3Ywo50A28IrLwP9g6b1PAMSYTQAgsgAiC4DIAogsgMgCILIAIgsgsgCILIDIAogsACILILIAIguAyAKILIDIAiCyACILgMgCZCnjLWYAiFGvB0BQZJsZAFyyAC5ZAO6RXc0AILIAIguAyAKkRXYzA4DIAogsACILkBbZ3QwALlkAlywAIgsgsgAiC4DIArwVWf8uAHDJAogsACILILIAv4isH74AXLIALlkARBZAZAFEFoDnyPokOIDIAogsACILkBfZZgaAuMhWMwC4ZAE+p4x3mAEgxinAAJ+XBbPWGkwAAAAAAElFTkSuQmCC);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.fullreverse {
|
||||
background: #000 !important;
|
||||
color: #fff !important;
|
||||
margin-left: -20px;
|
||||
padding-left: 20px;
|
||||
margin-right: -20px;
|
||||
padding-right: 20px;
|
||||
padding: 20px;
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
|
||||
.sample_table td {
|
||||
padding-top: 3px;
|
||||
padding-bottom:5px;
|
||||
padding-left: 5px;
|
||||
vertical-align: middle;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
.sample_table td:first-child {
|
||||
background-color: #eee;
|
||||
text-align: right;
|
||||
padding-right: 5px;
|
||||
padding-left: 0;
|
||||
padding: 5px;
|
||||
font: 11px/12px "Courier New", Courier, mono;
|
||||
}
|
||||
|
||||
code {
|
||||
white-space: pre;
|
||||
background-color: #eee;
|
||||
display: block;
|
||||
padding: 10px;
|
||||
margin-bottom: 18px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
.bottom,.last {margin-bottom:0 !important; padding-bottom:0 !important;}
|
||||
|
||||
.box {
|
||||
padding: 18px;
|
||||
margin-bottom: 18px;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.reverse,.reversed { background: #000 !important;color: #fff !important; border: none !important;}
|
||||
|
||||
#bodycomparison {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
font-size: 72px;
|
||||
height: 90px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#bodycomparison div{
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
display: inline;
|
||||
margin: 0 15px 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#bodycomparison div span{
|
||||
font: 10px Arial;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
#xheight {
|
||||
float: none;
|
||||
position: absolute;
|
||||
color: #d9f3ff;
|
||||
font-size: 72px;
|
||||
line-height: 90px;
|
||||
}
|
||||
|
||||
.fontbody {
|
||||
position: relative;
|
||||
}
|
||||
.arialbody{
|
||||
font-family: Arial;
|
||||
position: relative;
|
||||
}
|
||||
.verdanabody{
|
||||
font-family: Verdana;
|
||||
position: relative;
|
||||
}
|
||||
.georgiabody{
|
||||
font-family: Georgia;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* @group Layout page
|
||||
*/
|
||||
|
||||
#layout h1 {
|
||||
font-size: 36px;
|
||||
line-height: 42px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h2 {
|
||||
font-size: 24px;
|
||||
line-height: 23px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#layout h3 {
|
||||
font-size: 22px;
|
||||
line-height: 1.4em;
|
||||
margin-top: 1em;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
||||
#layout p.byline {
|
||||
font-size: 12px;
|
||||
margin-top: 18px;
|
||||
line-height: 12px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#layout p {
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
|
||||
#layout p.large{
|
||||
font-size: 18px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
#layout .sidebar p{
|
||||
font-size: 12px;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
#layout p.caption {
|
||||
font-size: 10px;
|
||||
margin-top: -16px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
/* @group Glyphs */
|
||||
|
||||
#glyph_chart div{
|
||||
background-color: #d9f3ff;
|
||||
color: black;
|
||||
float: left;
|
||||
font-size: 36px;
|
||||
height: 1.2em;
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 1px;
|
||||
margin-right: 1px;
|
||||
text-align: center;
|
||||
width: 1.2em;
|
||||
position: relative;
|
||||
padding: .6em .2em .2em;
|
||||
}
|
||||
|
||||
#glyph_chart div p {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: block;
|
||||
text-align: center;
|
||||
font: bold 9px Arial, sans-serif;
|
||||
background-color: #3a768f;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
padding: 2px 0;
|
||||
}
|
||||
|
||||
|
||||
#glyphs h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
/* @end */
|
||||
|
||||
/* @group Installing */
|
||||
|
||||
#installing {
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
#installing p,
|
||||
#glyphs p{
|
||||
line-height: 1.2em;
|
||||
margin-bottom: 18px;
|
||||
font: 13px Arial, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#installing h3{
|
||||
font-size: 15px;
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
/* @end */
|
||||
|
||||
#rendering h1 {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.render_table td {
|
||||
font: 11px "Courier New", Courier, mono;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 28, 2015 */
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'notokr-medium';
|
||||
src: url('notokr-medium.eot');
|
||||
src: url('notokr-medium.eot?#iefix') format('embedded-opentype'),
|
||||
url('notokr-medium.woff2') format('woff2'),
|
||||
url('notokr-medium.woff') format('woff'),
|
||||
url('notokr-medium.ttf') format('truetype'),
|
||||
url('notokr-medium.svg#notokr-medium') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
# Font Squirrel Font-face Generator Configuration File
|
||||
# Upload this file to the generator to recreate the settings
|
||||
# you used to create these fonts.
|
||||
|
||||
{"mode":"basic","formats":["ttf","woff","woff2","eotz"],"tt_instructor":"default","fix_vertical_metrics":"Y","fix_gasp":"xy","add_spaces":"Y","add_hyphens":"Y","fallback":"none","fallback_custom":"100","options_subset":"basic","subset_custom":"","subset_custom_range":"","subset_ot_features_list":"","css_stylesheet":"stylesheet.css","filename_suffix":"-webfont","emsquare":"2048","spacing_adjustment":"0"}
|
||||
File diff suppressed because it is too large.
Load diff
Binary file not shown.
File diff suppressed because it is too large.
Load diff
|
After Width: | Height: | Size: 710 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,7 @@
|
||||
(function($){$.fn.easyTabs=function(option){var param=jQuery.extend({fadeSpeed:"fast",defaultContent:1,activeClass:'active'},option);$(this).each(function(){var thisId="#"+this.id;if(param.defaultContent==''){param.defaultContent=1;}
|
||||
if(typeof param.defaultContent=="number")
|
||||
{var defaultTab=$(thisId+" .tabs li:eq("+(param.defaultContent-1)+") a").attr('href').substr(1);}else{var defaultTab=param.defaultContent;}
|
||||
$(thisId+" .tabs li a").each(function(){var tabToHide=$(this).attr('href').substr(1);$("#"+tabToHide).addClass('easytabs-tab-content');});hideAll();changeContent(defaultTab);function hideAll(){$(thisId+" .easytabs-tab-content").hide();}
|
||||
function changeContent(tabId){hideAll();$(thisId+" .tabs li").removeClass(param.activeClass);$(thisId+" .tabs li a[href=#"+tabId+"]").closest('li').addClass(param.activeClass);if(param.fadeSpeed!="none")
|
||||
{$(thisId+" #"+tabId).fadeIn(param.fadeSpeed);}else{$(thisId+" #"+tabId).show();}}
|
||||
$(thisId+" .tabs li").click(function(){var tabId=$(this).find('a').attr('href').substr(1);changeContent(tabId);return false;});});}})(jQuery);
|
||||
@@ -0,0 +1,129 @@
|
||||
/*Notes about grid:
|
||||
Columns: 12
|
||||
Grid Width: 825px
|
||||
Column Width: 55px
|
||||
Gutter Width: 15px
|
||||
-------------------------------*/
|
||||
|
||||
|
||||
|
||||
.section {margin-bottom: 18px;
|
||||
}
|
||||
.section:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
|
||||
.section {*zoom: 1;}
|
||||
|
||||
.section .firstcolumn,
|
||||
.section .firstcol {margin-left: 0;}
|
||||
|
||||
|
||||
/* Border on left hand side of a column. */
|
||||
.border {
|
||||
padding-left: 7px;
|
||||
margin-left: 7px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
/* Border with more whitespace, spans one column. */
|
||||
.colborder {
|
||||
padding-left: 42px;
|
||||
margin-left: 42px;
|
||||
border-left: 1px solid #eee;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* The Grid Classes */
|
||||
.grid1, .grid1_2cols, .grid1_3cols, .grid1_4cols, .grid2, .grid2_3cols, .grid2_4cols, .grid3, .grid3_2cols, .grid3_4cols, .grid4, .grid4_3cols, .grid5, .grid5_2cols, .grid5_3cols, .grid5_4cols, .grid6, .grid6_4cols, .grid7, .grid7_2cols, .grid7_3cols, .grid7_4cols, .grid8, .grid8_3cols, .grid9, .grid9_2cols, .grid9_4cols, .grid10, .grid10_3cols, .grid10_4cols, .grid11, .grid11_2cols, .grid11_3cols, .grid11_4cols, .grid12
|
||||
{margin-left: 15px;float: left;display: inline; overflow: hidden;}
|
||||
|
||||
|
||||
.width1, .grid1, .span-1 {width: 55px;}
|
||||
.width1_2cols,.grid1_2cols {width: 20px;}
|
||||
.width1_3cols,.grid1_3cols {width: 8px;}
|
||||
.width1_4cols,.grid1_4cols {width: 2px;}
|
||||
.input_width1 {width: 49px;}
|
||||
|
||||
.width2, .grid2, .span-2 {width: 125px;}
|
||||
.width2_3cols,.grid2_3cols {width: 31px;}
|
||||
.width2_4cols,.grid2_4cols {width: 20px;}
|
||||
.input_width2 {width: 119px;}
|
||||
|
||||
.width3, .grid3, .span-3 {width: 195px;}
|
||||
.width3_2cols,.grid3_2cols {width: 90px;}
|
||||
.width3_4cols,.grid3_4cols {width: 37px;}
|
||||
.input_width3 {width: 189px;}
|
||||
|
||||
.width4, .grid4, .span-4 {width: 265px;}
|
||||
.width4_3cols,.grid4_3cols {width: 78px;}
|
||||
.input_width4 {width: 259px;}
|
||||
|
||||
.width5, .grid5, .span-5 {width: 335px;}
|
||||
.width5_2cols,.grid5_2cols {width: 160px;}
|
||||
.width5_3cols,.grid5_3cols {width: 101px;}
|
||||
.width5_4cols,.grid5_4cols {width: 72px;}
|
||||
.input_width5 {width: 329px;}
|
||||
|
||||
.width6, .grid6, .span-6 {width: 405px;}
|
||||
.width6_4cols,.grid6_4cols {width: 90px;}
|
||||
.input_width6 {width: 399px;}
|
||||
|
||||
.width7, .grid7, .span-7 {width: 475px;}
|
||||
.width7_2cols,.grid7_2cols {width: 230px;}
|
||||
.width7_3cols,.grid7_3cols {width: 148px;}
|
||||
.width7_4cols,.grid7_4cols {width: 107px;}
|
||||
.input_width7 {width: 469px;}
|
||||
|
||||
.width8, .grid8, .span-8 {width: 545px;}
|
||||
.width8_3cols,.grid8_3cols {width: 171px;}
|
||||
.input_width8 {width: 539px;}
|
||||
|
||||
.width9, .grid9, .span-9 {width: 615px;}
|
||||
.width9_2cols,.grid9_2cols {width: 300px;}
|
||||
.width9_4cols,.grid9_4cols {width: 142px;}
|
||||
.input_width9 {width: 609px;}
|
||||
|
||||
.width10, .grid10, .span-10 {width: 685px;}
|
||||
.width10_3cols,.grid10_3cols {width: 218px;}
|
||||
.width10_4cols,.grid10_4cols {width: 160px;}
|
||||
.input_width10 {width: 679px;}
|
||||
|
||||
.width11, .grid11, .span-11 {width: 755px;}
|
||||
.width11_2cols,.grid11_2cols {width: 370px;}
|
||||
.width11_3cols,.grid11_3cols {width: 241px;}
|
||||
.width11_4cols,.grid11_4cols {width: 177px;}
|
||||
.input_width11 {width: 749px;}
|
||||
|
||||
.width12, .grid12, .span-12 {width: 825px;}
|
||||
.input_width12 {width: 819px;}
|
||||
|
||||
/* Subdivided grid spaces */
|
||||
.emptycols_left1, .prepend-1 {padding-left: 70px;}
|
||||
.emptycols_right1, .append-1 {padding-right: 70px;}
|
||||
.emptycols_left2, .prepend-2 {padding-left: 140px;}
|
||||
.emptycols_right2, .append-2 {padding-right: 140px;}
|
||||
.emptycols_left3, .prepend-3 {padding-left: 210px;}
|
||||
.emptycols_right3, .append-3 {padding-right: 210px;}
|
||||
.emptycols_left4, .prepend-4 {padding-left: 280px;}
|
||||
.emptycols_right4, .append-4 {padding-right: 280px;}
|
||||
.emptycols_left5, .prepend-5 {padding-left: 350px;}
|
||||
.emptycols_right5, .append-5 {padding-right: 350px;}
|
||||
.emptycols_left6, .prepend-6 {padding-left: 420px;}
|
||||
.emptycols_right6, .append-6 {padding-right: 420px;}
|
||||
.emptycols_left7, .prepend-7 {padding-left: 490px;}
|
||||
.emptycols_right7, .append-7 {padding-right: 490px;}
|
||||
.emptycols_left8, .prepend-8 {padding-left: 560px;}
|
||||
.emptycols_right8, .append-8 {padding-right: 560px;}
|
||||
.emptycols_left9, .prepend-9 {padding-left: 630px;}
|
||||
.emptycols_right9, .append-9 {padding-right: 630px;}
|
||||
.emptycols_left10, .prepend-10 {padding-left: 700px;}
|
||||
.emptycols_right10, .append-10 {padding-right: 700px;}
|
||||
.emptycols_left11, .prepend-11 {padding-left: 770px;}
|
||||
.emptycols_right11, .append-11 {padding-right: 770px;}
|
||||
.pull-1 {margin-left: -70px;}
|
||||
.push-1 {margin-right: -70px;margin-left: 18px;float: right;}
|
||||
.pull-2 {margin-left: -140px;}
|
||||
.push-2 {margin-right: -140px;margin-left: 18px;float: right;}
|
||||
.pull-3 {margin-left: -210px;}
|
||||
.push-3 {margin-right: -210px;margin-left: 18px;float: right;}
|
||||
.pull-4 {margin-left: -280px;}
|
||||
.push-4 {margin-right: -280px;margin-left: 18px;float: right;}
|
||||
Loaded 100 of 178 files, more files were not shown because too many files have changed in this diff.
Show more
Reference in new issue
Block a user