Pinetec Website Renewal 2026 — 共通パーツ ワイヤーフレーム v3
1. Header
section-header.php / FV用 + 通常用 + ドロワー
A：FV用（TOPページ / 右上縦並び固定）
PINETEC
ABOUT
SERVICES
MODEL HOUSE
NEWS
RECRUIT
CONTACT
MENU
（FV コンテンツエリア）
※ TOPページのFV上にオーバーレイ。スクロール後→通常用に切り替え。参考：はだしの家TOP
B：通常用（下層ページ / スクロール後 / 最上部固定）
PINETEC
ABOUT
SERVICES ▾
MODEL HOUSE
NEWS
RECRUIT
CONTACT
※ position: fixed / top: 0。SERVICESホバーでドロップダウン（活用/買取/建築/設計/販売）
C：ドロワーメニュー（ハンバーガー展開時）
※ 参考：hadashinoie.co.jp / aitohus.com
×
Home
About
Services
不動産の活用
不動産の買取
建築
設計
販売
Model House
内見予約
News
Recruit
Contact
PINETEC
株式会社パインテック
〒000-0000
千葉県○○市○○町0-0-0
TEL: 0120-312-848
IG
YT
2. ページヘディング
section-page-heading.php / 2パターン自動分岐
A：ヒーローあり（フルスクリーン画像・左下タイトル）
※ 参考：aitohus.com/quality/
ABOUT US
私たちについて
SERVICES
5つのサービス
※ フルスクリーン画像（100vh or 大きめの固定高さ）
※ 英字タイトル：左下配置 / 80px / Cormorant Garamond / weight 300
※ 和字タイトル：英字の下に小さく（SERVICESなら「5つのサービス」のように訴求的に）
※ パンくずは別途（ヘディングの下 or コンテンツエリア上部に配置）
※ 使用ページ：ABOUT US / SERVICES / MODEL HOUSE / NEWS / RECRUIT / CONTACT / 活用 / 買取 / 建築 / 設計 / 販売 / WORKS詳細
B：ヒーローなし（背景色・左寄せタイトル）
※ 参考：hadashinoie.co.jp/service
PRIVACY POLICY
プライバシーポリシー
SERVICE
サービス
※ 背景：#f0eeeb。画像なし
※ タイトル：左寄せ。英字の下に和字
※ 使用ページ：PRIVACY POLICY / confirm / thanks / 404
分岐ロジック：
satc3_get_page_heading() + has_post_thumbnail() で自動判定。
タイトルポジション：ヒーローあり = 左下 / ヒーローなし = 左寄せ（はだしの家 service参考）
single-construction.php は set_query_var() で英語タイトル「WORKS」を渡す
3. CTA
section-cta.php / ステージングサイト バリアントB
バリアントB（中央Get in Touch + 下部2リンク横並び）
※ ステージングサイト バリアントB そのまま
Get in Touch
お問い合わせ・資料請求
Contact us
→
モデルハウス内見予約
Model House
→
※ 背景画像：モノクロ室内写真 + グレースケール + ダークオーバーレイ
※ 「Get in Touch」中央大きく（Cormorant Garamond 64px）
※ 下部に2リンク横並び：和字小さく → 英字大きく + 丸矢印ボタン
※ テンプレート直書き（ACF不使用）
CTA条件分岐：
CTA全体を非表示：
CONTACT / 内見予約 / RECRUIT応募 の各フォーム + confirm + thanks（9ページ）/ PRIVACY POLICY / 404
Model Houseボタンのみ非表示：
MODEL HOUSEページ（固有CTAが別途あるため）
上記以外：
通常表示（ボタン2つとも表示）
4. Footer
footer.php / 最下部固定（リビール方式）
aitohus.com 方式：スクロール終端で「現れる」フッター
リビール方式の実装：
①
main
に
position: relative; z-index: 2; background: #f0eeeb;
②
footer
は main の後ろ（z-index低）に配置。ビューポート下部に固定
③ スクロールして main の終端に達すると、main が上にスライドしてフッターが「現れる」
④ ページがめくれてフッターが覗くような視覚効果
※ aitohus.com は GSAP ScrollTrigger pin で footer wrapper を固定
About
Services
不動産の活用
不動産の買取
建築
設計
販売
Model House
内見予約
News
Recruit
応募フォーム
Contact
プライバシーポリシー
PINETEC
株式会社パインテック
〒000-0000
千葉県○○市○○町0-0-0
TEL: 0120-312-848
0-0-0 ○○machi, ○○-shi,
Chiba-ken 000-0000, Japan.
+81-000-0000-0000
IG
YT
© 2026 Pinetec Inc. All Rights Reserved.
※ リビール方式：mainがスクロールで去るとフッターが「現れる」
※ main: position: relative; z-index: 2; background: #f0eeeb
※ 会社情報：日本語 + 英語の2段構成