/* Variation E — B案ベース × A案水彩アース融合 Hand-drawn / playful / cosmic + watercolor earth hero. */ const VarE = (() => { const D = window.LDM_DATA; const c = { bg: '#0f0a2e', bg2: '#1c1547', cream: '#fbf7ee', accent: '#ffd56b', sun: '#f5a847', pink: '#f48ec7', cyan: '#7fdcff', leaf: '#a8e063', btnGreen: '#3fb89a', // ティールグリーン(青寄り) - FVと馴染む btnGreenDeep: '#2d8a73', // 深いティール teal: '#5dbfb0', // 明るめティール(セミナーカード用) tealDeep: '#1f5b5a', // 深い暗ティール indigo: '#3b3577', // 深い青紫(セミナーカード用) earthLeaf: '#88b56a', text: '#f5f0ff', ink: '#2a2238' }; const Star = ({top, left, size=2, op=0.8}) => (

); const Stars = () => ( <> {[[8,12,3,0.9],[15,80,2,0.7],[25,40,2,0.8],[40,20,3,0.9],[55,75,2,0.6],[70,30,2,0.8],[85,60,3,0.9],[20,55,1,0.5],[60,15,2,0.7],[78,85,2,0.6]].map(([t,l,s,o],i)=>( ))} ); // LightStars — ライトテーマセクション用(クリーム背景に微かな星と道) // 「旅」のモチーフがライトセクションでも途切れないよう、極めて控えめな存在感で配置 const LightStars = ({withPath=false}) => ( <> {[[12,8,2.5,0.18],[28,88,2,0.14],[20,45,1.5,0.12],[58,15,2.5,0.16],[72,72,2,0.14],[42,90,1.5,0.10],[88,30,2,0.16],[50,55,1.5,0.10],[78,8,2,0.13]].map(([t,l,s,o],i)=>(

))} {/* 小さな手書き「✦」のサブ装飾 */}

✦

{/* 「道」のモチーフ — withPath=trueの時だけ繊細な曲線を1本 */} {withPath && ( )} ); // HERO — A案の水彩画像をフルブリードで使い、B案の手書きコピー&装飾を重ねる const Hero = () => (

{/* 全体を暗めにする為のオーバーレイ + 上下のグラデ */}

{/* 手書きラベル — ロゴ重複解消のため削除済 */}

let's go ✦

✦ play ✦

{/* メインコピー */}

A new journey begins.

新しい地球を、
仲間と遊ぶ。

LDM月額メンバーシップ

ライフ・デザイン・メソッド開発者・堀内恭隆と、
地球という遊び場を旅するコミュニティ。

{['#堀内との距離','#ゲスト対談','#エネルギーワーク','#リアルの場'].map(t => ( {t} ))}

); // GUEST STRIP — ヒーロー直下の出演実績バナー(モバイル) const GuestStrip = () => (

past guests ✦

これまでに出演してくれた、各界のフロントランナーたち

{D.guests.map((g,i)=>{ const colors=[c.pink,c.cyan,c.leaf,c.accent,c.pink,c.cyan,c.leaf,c.accent,c.pink]; const col = colors[i]; return (

{g.name}

); })}

); // HERO STATS — FV直下のシンプル数字帯(信頼の最低限) const HeroStats = () => (

{D.heroStats.map((s,i)=>(

{s.num}

{s.label}

))}

); // SCENE BANNER — 実際のオンラインセミナー風景 const SceneBanner = () => (

live scene ✦

画面の向こうに、たしかに「場」がある。

{/* ポラロイド風フレーム */}

{/* マスキングテープ */}

{/* Zoomラベルをマスク(左上) */}

LDM
SESSION

{/* 下部の小さい文字をマスク */}

── オンラインセミナー風景より

全国・海外から参加できる、
オンライン中心のジャーニー。
※ 録画アーカイブも視聴可能。

); // FOR-WHOM — もしかして、こんなふうに感じていませんか const ForWhom = () => (

have you ever felt... ✦

{D.forWhom.title}

{D.forWhom.sub}

— {String(i+1).padStart(2,'0')} —

{it}

……もし、こうした感覚に覚えがあるなら。
この先のページが、たぶんあなたに向けて書かれています。

); // STATS — 数字でわかる規模感 const Stats = () => (

{D.stats.map((s,i)=>{ const colors=[c.accent,c.pink,c.cyan]; return (

{s.num}

{s.label}

{s.sub}

); })}

); // ABOUT — クリーム背景に手書きのトーンで(D案: 小ポートレート+手書きラベル+水彩テクスチャ) const About = () => (

{/* 背景に薄い水彩テクスチャ */}

about us

コミュニティと、
はじまりの物語。

{/* 小ポートレート + 手書きラベル */}

since 2000 ✦

25年の歩みと、これから

{(D.community.bodyParts || []).map((part, i) => { if (part.type === 'p') return (

{part.text}

); if (part.type === 'quote') return (

{part.text}

); if (part.type === 'sep') return (

✦ ✦

); return null; })}

); // PROFILE — コズミック背景に堀内さん const Profile = () => (

your guide

✦ guide

since 2000

{D.profile.name}

{D.profile.role}

{D.profile.bio}

{/* 実績 */}

✦ {a}

); // CONTENTS — 4 cards 手描き感 const Contents = () => (

what we offer

この場に入ると、何がある？

{D.contents.map((co,i) => { const colors = [c.pink, c.cyan, c.earthLeaf, c.sun]; const col = colors[i]; return (

0{i+1}

{co.tag}

{co.title}

{co.freq}

{co.desc}

); })}

); // EVENTS — ポラロイド風集合写真 const Events = () => (

real gathering

{D.events.title}

{D.events.sub}

{D.events.photos.map((p,i)=>{ const colors=[c.pink,c.cyan,c.earthLeaf]; const layouts=[ {top:0, left:8, rot:-4}, {top:160, left:60, rot:3.5}, {top:310, left:14, rot:-2.5} ]; const L=layouts[i]; return (

{p.caption}

{p.hand}

); })}

); // REAL PHOTOS — マソンリーグリッド(モバイル: 2列) const RealPhotos = () => (

real scene ✦

{D.realPhotos.title}

{D.realPhotos.sub}

{D.realPhotos.photos.map((p,i)=>{ const tall = (i%3===0); return (

{p.caption}

); })}

); // SEMINARS — 過去セミナー一覧 const Seminars = () => { const [openIdx, setOpenIdx] = React.useState(null); return (

past seminars

{D.seminars.title}

{D.seminars.sub}

{D.seminars.list.map((s,i)=>{ // FV統一トーンの3色をローテーション(深い青紫 / ティール / 深ティール) const tones = [ {bg: c.indigo, accent: c.teal}, {bg: c.tealDeep, accent: c.cyan}, {bg: c.bg2, accent: c.teal}, ]; const t = tones[i%3]; const isOpen = openIdx === i; const hasDetail = (s.core && s.core.length) || (s.quotes && s.quotes.length); return (

{s.img ? ( <>

) : ( <>

{s.sym}

)}

#{s.num}

{s.tag}

{s.title}

{hasDetail && ( )} {hasDetail && isOpen && (

{s.core && s.core.length > 0 && ( <>

核心

✦ {x}

)} {s.quotes && s.quotes.length > 0 && ( <>

印象的なフレーズ

{s.quotes.map((q, j) => (

“{q}”

))}

)}

); })}

これらすべてが、この場の中で展開されています。

); }; // EARTH BAND — A案の水彩画像をストライプ的に再利用してリズムを作る const EarthBand = () => (

welcome to

この地球で、
新しいものを生み出す。

let's play together ✦

); // GUESTS — コズミックグリッド const Guests = () => { const [openIdx, setOpenIdx] = React.useState(null); const palette = [c.pink, c.accent, c.cyan, c.leaf, c.pink, c.accent, c.cyan, c.leaf, c.pink]; return (

guest talks

濃密ゲスト対談

{/* リード文 */}

{D.guestTalks.lead}

{/* カードリスト */}

{D.guestTalks.cards.map((g, i) => { const col = palette[i]; const isOpen = openIdx === i; return (

{/* 上部:写真 + 基本情報 */}

{g.month}

{g.name}

{g.caption}

{/* キャッチコピー */}

“{g.tagline}”

{/* 開閉ボタン */} {/* 展開部分 */} {isOpen && (

{g.profile && ( <>

プロフィール

{g.profile}

)}

対談テーマ

{g.theme}

ハイライト

✦ {h}

)}

); })}

{/* +α 過去ゲスト一覧の余白 */}

{D.guestTalks.plus}

); }; // PROGRAMS — 5つの本格連続講座(モバイル) const Programs = () => { const [openIdx, setOpenIdx] = React.useState(0); // 1個目だけ開いた状態でスタート const totalSessions = D.programs.list.reduce((s,p)=>s + p.sessions, 0); const totalHours = D.programs.list.reduce((s,p)=>s + p.totalHours, 0); return (

{/* Header */}

{D.programs.en}

{D.programs.title}

{/* Big numbers headline */}

{totalSessions}

全講義回数

{totalHours}h

合計時間

{D.programs.leadHeadline}

{D.programs.leadBody}

{/* Program cards */}

{D.programs.list.map((p,i)=>{ const col = c[p.color]; const isOpen = openIdx === i; return (

{/* Hero image with LIVE badge */}

{p.img &&

}

{/* Number badge */}

{i+1}

{/* LIVE badge */}

LIVE

{/* Title block */}

{p.name}

{p.tagline}

{/* Volume badge */}

LIVE 全{p.sessions}回 × 各3時間 = {p.totalHours}h

{/* Intro text */}

{p.intro}

{/* Accordion toggle */} {/* Accordion content */} {isOpen && (

{p.curriculum.map((day,di)=>(

DAY

{day.day}

{day.title}

{day.body}

))}

)}

); })}

{/* Closing - membership inclusion */}

これらすべてが、
月額メンバーシップに含まれています。

{/* Closing note - free LINE */}

{D.programs.closingNote}

); }; // VOICE STORIES — ストーリー型の声(参加前→参加後の変化) const VoiceStories = () => (

their stories ✦

ここで起きた、
参加前と、参加後。

{D.voiceStories.map((s,i)=>{ const col = i===0 ? c.cyan : c.accent; return (

{s.tag}

{s.headline}

BEFORE

{s.before}

↓

AFTER

{s.after}

— {s.meta}

); })}

); // VOICES — リアルな声(ポラロイド/付箋風カード・モバイル) const Voices = () => { const [open, setOpen] = React.useState(null); return (

real voices ✦

参加者のリアルな声

セミナー後・対談後に、
メンバーがそれぞれの言葉で書いた「アウトプット」をそのまま。

{/* 横スクロール */}

{D.voices.map((v,i)=>{ const col = c[v.color]; const rot = (i%4 === 0) ? ((i%8 < 4) ? -1.2 : 1.2) : 0; const isOpen = open === i; return (

{/* マスキングテープ */}

{v.tag}

{isOpen ? v.full : v.excerpt}

); })}

← 横にスワイプ →

); }; // COMMITMENT — この場で、何が起きているか(覚悟・本人の言葉) const Commitment = () => (

{/* セクションヘッダ */}

— {D.commitment.eyebrow} —

{D.commitment.title}

{/* 3ブロック */}

{D.commitment.blocks.map((b, i) => { const accents = [c.sun, c.pink, c.cyan]; const col = accents[i]; return (

{/* 装飾的なナンバー */}

0{i+1}

{/* 引用ブロック */}

“

{b.quote}

{/* 本文 */}

{b.body}

); })}

{/* 余韻のクロージング */}

{D.commitment.closing}

); // FIRST MONTH — 最初の1ヶ月の過ごし方(プレッシャーゼロ) const FirstMonth = () => (

your first month ✦

{D.firstMonth.title}

{D.firstMonth.sub}

{D.firstMonth.items.map((it,i)=>{ const colors=[c.pink,c.cyan,c.earthLeaf,c.sun]; const col = colors[i]; return (

{it.hand}

{it.text}

); })}

{D.firstMonth.note}

); // REASSURANCE — 安心ポイント(肯定形) const Reassurance = () => (

be at ease ✦

{D.reassurance.title}

{D.reassurance.sub}

{D.reassurance.items.map((it,i)=>{ const colors=[c.pink,c.cyan,c.earthLeaf,c.sun,c.accent,c.pink]; const col = colors[i%6]; return (

✓

{it.hand}

{it.title}

{it.body}

); })}

); // PRICE const Price = () => (

membership

この場に、
一緒に居ませんか

¥8,800 /月

払い続けられる、でも適当にはできない
そんなちょうどいい関係性で。

✦ コミュニティに参加する ✦

いつでも退会できます。
追加料金もありません。

); const FAQ = () => (

faq

よくある質問

{D.faqs.map((f,i) => (

Q.{f.q}

{f.a}

))}

); // OPEN CHAT — 離脱者の受け皿(無料の入口) const OpenChat = () => (

— still wondering? —

まだ迷っている方へ。

まずは無料のオープンチャットで、
堀内の世界観に触れてみてください。

オープンチャットを見てみる →

{D.openChat.label}・「{D.openChat.name}」

); // 中間CTA — 「発見」と「確信」の間で、軽く呼びかける(価格表示なし) const MidCTA = () => (

— a quiet invitation —

ここまでの空気感、
少しでも「いいな」と感じたなら。

まずは、いま、この場の温度を
そばで眺めてみてください。

✦ コミュニティに参加する ✦

詳しくは、もう少し読み進めてから。

); const Footer = () => ( ); // STICKY CTA — モバイル下部に常時表示(position: sticky でframe内に貼り付く) const StickyCTA = () => { const [visible, setVisible] = React.useState(false); const ref = React.useRef(null); React.useEffect(()=>{ const el = ref.current ? ref.current.closest('.lp-frame') : null; const scroller = el || window; const onScroll = () => { const top = scroller === window ? window.scrollY : scroller.scrollTop; const h = scroller === window ? window.innerHeight : scroller.clientHeight; setVisible(top > h * 0.6); }; onScroll(); scroller.addEventListener('scroll', onScroll, { passive:true }); return () => scroller.removeEventListener('scroll', onScroll); }, []); return (

✦ コミュニティに参加する ✦

); }; return () => (

{/* ❶ 共感 */} {/* ❷ 納得 — 堀内が世界に出ていくプロジェクト */} {/* ❸ 発見 — 旅の中で展開されるもの */} {/* — 中間CTA① — */} {/* ❹ 確信 — ゲスト・セミナー・講座 */} {/* ❺ 覚悟 — この場で何が起きているか */} {/* ❻ 安心 — 参加者の声と安心の場 */} {/* ❼ 決意 — 価格は最下部のここで初出 */}

); })(); window.VarE = VarE;

新しい地球を、 仲間と遊ぶ。

{D.forWhom.title}

コミュニティと、はじまりの物語。

{D.profile.name}

この場に入ると、何がある？

{co.title}

{D.events.title}

{D.realPhotos.title}

{D.seminars.title}

この地球で、新しいものを生み出す。

濃密ゲスト対談

{D.programs.title}

ここで起きた、参加前と、参加後。

{s.headline}

参加者のリアルな声

{D.commitment.title}

{D.firstMonth.title}

{D.reassurance.title}

この場に、一緒に居ませんか

よくある質問

まだ迷っている方へ。

ここまでの空気感、 少しでも「いいな」と感じたなら。

新しい地球を、
仲間と遊ぶ。

コミュニティと、
はじまりの物語。

この地球で、
新しいものを生み出す。

ここで起きた、
参加前と、参加後。

この場に、
一緒に居ませんか

ここまでの空気感、
少しでも「いいな」と感じたなら。