// Common page sections (hero, numbers, problems, reasons, voices, flow, FAQ, CTA) const { useState, useEffect, useRef } = React; // ---------- Reveal-on-scroll ---------- function Reveal({ children, as: Tag = "div", className = "", style = {} }) { return {children}; } // ---------- Header (パーチェ公式 TOP のヘッダーに合わせた構成) ---------- function SiteHeader() { const SITE_BASE = "https://pace.co.jp"; const QUOTE_URL = SITE_BASE + "/#contact"; const { isMobile, isTablet } = (window.useViewport || (() => ({ isMobile: false, isTablet: false })))(); const compact = isMobile || isTablet; const [menuOpen, setMenuOpen] = useState(false); const navItems = [ { label: "サービス一覧", href: SITE_BASE + "/#services" }, { label: "社会貢献活動", href: SITE_BASE + "/#csr" }, { label: "トピックス", href: SITE_BASE + "/#topics" }, { label: "会社概要", href: SITE_BASE + "/about.html" }, ]; const linkStyle = { fontFamily: "'Noto Serif JP', serif", fontSize: 13, color: "rgba(26,26,26,0.7)", textDecoration: "none", letterSpacing: "0.15em", fontWeight: 500, paddingBottom: 4, whiteSpace: "nowrap", transition: "color .3s ease", }; return (
{/* ロゴ */} パーチェ株式会社 {/* PC: ナビ表示 / モバイル: ハンバーガー */} {!compact ? ( ) : ( )}
{/* モバイル: 全画面メニュー */} {compact && menuOpen && (
{navItems.map((it) => ( setMenuOpen(false)} style={{ fontFamily: "'Shippori Mincho', serif", fontSize: 20, color: "rgba(255,255,255,0.85)", textDecoration: "none", letterSpacing: "0.3em", }}>{it.label} ))} setMenuOpen(false)} style={{ marginTop: 8, border: "1px solid rgba(184,148,31,0.6)", padding: "12px 32px", borderRadius: 2, fontFamily: "'Noto Serif JP', serif", fontSize: 14, letterSpacing: "0.2em", color: "#B8941F", fontWeight: 500, textDecoration: "none", }}>お見積りフォーム
)}
); } // ---------- Hero ---------- function Hero() { return (
{/* subtle grain */}
Strategic Novelty Service

ノベルティ戦略の本質は、
経営戦略である。

企業戦略やイベントの本質に沿った、オリジナルノベルティを製作いたします。御社の目指す将来像へ近づくために、戦略的にノベルティをご活用ください。

ECO素材・バイオマス素材など、環境に配慮した仕様もすべてご相談いただけます。

世界陸上・デフリンピック・ホノルルマラソンといった大型イベントから、大企業のノベルティ戦略まで——陰で支えてきた弊社が、「配って終わり」ではないオリジナルノベルティを、圧倒的なコスト感と精度でお届けします。

{[ { tag: "国際スポーツイベント", title: "世界陸上 関連ノベルティ", year: "2020 — 2025", n: "01" }, { tag: "市民マラソン", title: "ホノルルマラソン参加賞", year: "2018 — 2024", n: "02" }, { tag: "企業周年事業", title: "大手企業 創業100周年記念品", year: "2023", n: "03" }, ].map((c, i) => (
{c.tag}
{c.title}
{c.year}
{c.n}
 ))}
SCROLL
); } // ---------- Problems ---------- function Problems() { const items = [ { n: "01", title: "配って終わるノベルティ", body: "「もらった瞬間に忘れられる」「翌週には捨てられている」——配ること自体が目的化し、施策として何を持ち帰ってもらうのかが曖昧なまま予算だけが消えていく。" }, { n: "02", title: "課題と切り離された企画", body: "営業課題・採用課題・広報課題——本来ノベルティで解きたいはずの課題が、商品カタログから選ぶ瞬間に置き去りになる。記念品でも宣伝品でもない一手が欲しい。" }, { n: "03", title: "少ロットだと選択肢が画一的", body: "少量のロットでは、既製品への名入れに収まりがち。ブランドにふさわしい質感や、差別化された設計を、規模を理由に諦めることになる。" }, ]; return (
{items.map((it, i) => (
{it.n}

{it.title}

{it.body}

))}
); } // ---------- Reasons ---------- function Reasons() { const items = [ { n: "01", t: "課題から逆算して設計", b: "商品カタログから選ぶのではなく、御社の経営・営業・広報課題から逆算してノベルティを設計します。" }, { n: "02", t: "国際水準の製造管理", b: "世界陸上・ホノルルマラソンなど、海外メディアの目に触れる現場で選ばれ続けてきた品質基準で製作します。" }, { n: "03", t: "少ロットでもフルカスタム", b: "金型・素材・印刷・パッケージまで、少量でも差別化を前提に組み上げます。" }, { n: "04", t: "企画〜納品まで一貫対応", b: "社内デザイナー・OEM工場・物流網を自社で抱え、複数業者を束ねる手間を引き受けます。" }, ]; return (
{items.map((it, i) => (
REASON {it.n}

{it.t}

{it.b}

))}
); } // ---------- Voices (testimonials) ---------- function Voices() { const items = [ { initial: "A", company: "A社 — 国際スポーツイベント主催", role: "事業推進部 / マネージャー", body: "海外メディアの目にも触れる現場で、品質に妥協はできなかった。短納期にもかかわらず、想定を上回る仕上がりで届いた。", tags: ["世界陸上", "1,200個"] }, { initial: "B", company: "B社 — IT企業マーケティング部", role: "プロダクトマーケティング / 部長", body: "展示会のブースで配布物が埋もれない、というのが選定の決め手。商談数の伸びという施策側のKPIにも数字で返ってきた。", tags: ["展示会", "300個"] }, { initial: "C", company: "C市 — 地方自治体広報課", role: "シティプロモーション / 主査", body: "50個という少ロットでも、課題ヒアリングから入って設計いただけた。市民への配布後、関連事業への問い合わせが増えた。", tags: ["周年記念", "50個"] }, ]; return (
{items.map((v, i) => (
{v.initial}
{v.company}
{v.role}

「{v.body}」

{v.tags.map((t) => ( {t} ))}
))}
); } // ---------- Flow ---------- function Flow() { const steps = [ { n: "01", t: "お問い合わせ", b: "用途・予算・ロット数をお知らせください。" }, { n: "02", t: "ヒアリング・ご提案", b: "経営課題・施策目的を伺った上で、方向性をご提案します。" }, { n: "03", t: "デザイン・校正", b: "デザインデータの確認・校正を進めます。" }, { n: "04", t: "製造・納品", b: "検品の上、ご指定の場所へお届けします。" }, ]; const notes = [ { t: "サンプル制作について", b: "サンプル制作をご希望の方は別途承ります。版代が別途かかります。" }, { t: "作業期間について", b: "作業工程は約3ヶ月かかります。ロットによります。" }, ]; const { isMobile, isTablet } = (window.useViewport || (() => ({ isMobile: false, isTablet: false })))(); return (
{/* connector(PCのみ) */} {!isMobile && !isTablet && (
)} {steps.map((s, i) => (
{s.n}

{s.t}

{s.b}

 ))}
{/* Notes — サンプル制作 / 作業期間(モバイルは縦に2つスタック) */}
{notes.map((n) => (
note

{n.t}

{n.b}

))}
); } // ---------- FAQ ---------- function FAQ() { const qs = [ { q: "最少ロットはどれくらいから対応可能ですか？", a: "ご要望のロット数に応じて柔軟に承ります。少量でも金型・印刷ともにフルカスタム対応が可能です。デザインのみでも、OEMでも、まずはご相談ください。" }, { q: "納期はどれくらいかかりますか？", a: "ご注文内容により異なります。既製品への名入れと、フルオリジナル製作では必要日数が大きく異なりますので、まずはお気軽にご相談ください。スケジュールに合わせて最短ルートをご提案します。" }, { q: "見積もりは無料ですか？", a: "もちろん無料です。用途・予算・ロット数の概要をお知らせいただければ、3営業日以内に概算をお戻しします。" }, ]; const [open, setOpen] = useState(0); const { isMobile } = (window.useViewport || (() => ({ isMobile: false })))(); return (
{qs.map((it, i) => (

{it.a}

 ))}
); } // ---------- Final CTA ---------- function FinalCTA() { const { isMobile } = (window.useViewport || (() => ({ isMobile: false })))(); return (
Get in Touch

お見積もり・ご相談は無料です。
3営業日以内に最初のご提案をお戻しします。

無料お見積りフォーム
); } // ---------- Section label helper ---------- function SectionLabel({ en, jp, dark = false, align = "left" }) { const { isMobile } = (window.useViewport || (() => ({ isMobile: false })))(); return (
{en}

{jp}

); } // ---------- Footer (パーチェ公式 TOP のフッターに合わせた構成) ---------- function SiteFooter() { const SITE_BASE = "https://pace.co.jp"; const QUOTE_URL = SITE_BASE + "/#contact"; const { isMobile, isTablet } = (window.useViewport || (() => ({ isMobile: false, isTablet: false })))(); const services = [ { label: "戦略ノベルティ", href: SITE_BASE + "/novelty/" }, { label: "Immun' Âge", href: SITE_BASE + "/immunage.html" }, { label: "A.E.Köchert", href: SITE_BASE + "/koechert/" }, ]; const company = [ { label: "会社概要", href: SITE_BASE + "/about.html" }, { label: "社会貢献活動", href: SITE_BASE + "/#csr" }, { label: "トピックス", href: SITE_BASE + "/#topics" }, { label: "お見積りフォーム", href: QUOTE_URL, external: true }, ]; const legal = [ { label: "プライバシーポリシー", href: SITE_BASE + "/#" }, { label: "利用規約", href: SITE_BASE + "/#" }, { label: "特定商取引法", href: SITE_BASE + "/#" }, ]; const linkStyle = { fontFamily: "'Noto Serif JP', serif", fontSize: 13, color: "rgba(255,255,255,0.45)", textDecoration: "none", letterSpacing: "0.12em", transition: "color .25s ease", display: "block", }; const navTitleStyle = { fontFamily: "'Cormorant Garamond', serif", fontSize: 13, color: "#B8941F", letterSpacing: "0.25em", textTransform: "uppercase", marginBottom: 22, display: "block", fontWeight: 600, }; return ( ); } Object.assign(window, { Reveal, SiteHeader, SiteFooter, Hero, Problems, Reasons, Voices, Flow, FAQ, FinalCTA, SectionLabel, });