ご提案資料

はじめに

この度はご覧いただきありがとうございます。
LUMO WEB STUDIO（ルモ ウェブスタジオ）の窓口担当です。
社会保険労務士法人イデア様の「1997年創業 × 25年超の中小企業伴走実績 × 経営パートナーとしての深い関わり × 健康経営優良法人2025認定 × 大阪・南本町という関西の中核拠点」という、他事務所にはない強みを軸に、
イデア様 専用のサンプルサイトを制作いたしました。

サイト設計の意図

• カラー：信頼ネイビー（#1B2D4F）×ヘルシーオリーブ（#6B7A52）×クラフトベージュ（#E8DFCB）×アイボリー（#F8F4EC）×アンバー（#B88947）の落ち着いた5色構成。士業らしい硬さと「健康経営」の柔らかさを両立し、過剰な装飾を避けて中小企業経営者層に信頼感を持っていただける配色を採用しました。
• ナビゲーション：士業のため完全日本語横並び（ホーム／事務所案内／業務内容／健康経営支援／お客様の声／料金／ご相談の流れ／アクセス／お問い合わせ）。CTAボタンはネイビー×アンバーで重厚かつ温かみのある印象に。
• フォント：Shippori Mincho（明朝・見出しの硬さ）＋ Cormorant Garamond italic（英文アクセント）＋ Noto Sans JP（本文・読みやすさ）＋ Inter（数字・英字）。士業の権威感と現代的な可読性を両立しています。
• イントロアニメ：「5本の水平線が左から右へ描画（6つの業務領域 + 中央軸を象徴）」→「中央に円が拡大（人と組織の交点を象徴）」→「IDEA英字＋社会保険労務士法人イデア＋Since 1997」の3段階・約3秒構成。ビジュアルとテキストは重ねず、sessionStorage（lumo-intro-played-idea-sr）で同一セッション内は初回のみ再生。SKIPボタン・prefers-reduced-motion 対応。
• スクロール演出：IntersectionObserver による fade-up・fade-left・fade-right、ヘッダーshrink、画像のグレースケール薄フィルター、額縁ボーダーフレーム ─ 過剰なインタラクション（マウス追従blob・3D tilt・magnetic多用・カウントアップ多用）を避け、士業らしい落ち着きと「読みやすさ」を最優先しました。
• 構成：ホーム／事務所案内／業務内容／健康経営支援／お客様の声／料金／ご相談の流れ／アクセス／お問い合わせ の9ページ＋本提案資料の構成。
• 業界配慮（社労士・士業共通）：「絶対に通る」「必ず受給できる」等の効果断定を排除。「助成金は個別案件審査」「税務相談は税理士の専門領域」「労使紛争の代理権は特定社労士の範囲」「裁判所での代理は弁護士の領域」を明記しています。
• 料金表記：本提案資料の他サービス料金はすべて税別表記で統一しています（クライアントHP本体の料金表記もイデア様の現公式HPに準拠した税別表記としています）。
  ※価格はすべて税別表記です

LUMOの他サービス

※価格はすべて税別表記です

LUMO WEB STUDIOについて

士業・建築・クリニック・整骨院・教室・アーティストを中心に、
小規模事業者の Webサイト制作を専門に行うスタジオです。
Cloudflareのインフラを活用し、表示が速く・運用が軽い・修正にもすぐ対応できる
小回りの効く制作体制を整えています。