@charset "UTF-8";
/*
 * MoneyX 案内ページ（ハブ）サンプル用 CSS（2026-10-29 新規。このファイル1本だけで組む）
 * - 色・見出しの三角・ボタン・すりガラスのヘッダー・黒いフッターは MoneyX2027 版（assets2027/moneyx2027.css）に合わせた
 * - 開催回のパネルは TOKEN2049 のハブを参考にした（写真を全面に敷き、下に向かって暗くして文字を載せる。ホバーで写真が少し寄る）
 * - 外部 CDN は使わない。2027 版は Adobe Fonts（Typekit）を読んでいるが、ここでは端末にあるフォントで代用する
 */

:root{
	/* MoneyX2027 版と同じ色 */
	--mx-pink:#e8a6c8;
	--mx-pink-l:#f5d3e3;
	--mx-pink-d:#c0579a;
	--mx-purple:#a0509a;
	--mx-purple-d:#8e4a9a;
	--mx-bg:#f3f2f2;
	--mx-black:#0b0b0b;
	--mx-text:#1a1a1a;
	--mx-gray:#777;
	/* 旧 2026 版の差し色（2026 のパネルだけで使う） */
	--mx26-orange-a:#ffb22f;
	--mx26-orange-b:#e73e0e;
	--mx-en:"Montserrat","Helvetica Neue",Arial,"Noto Sans JP",sans-serif;
	--mx-ja:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	--mx-wrap:1200px;
	--mx-header-h:58px;
}

/* ================= 基本 ================= */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body.hub{margin:0;background:var(--mx-bg);color:var(--mx-text);font-family:var(--mx-ja);font-size:15px;line-height:1.8;-webkit-font-smoothing:antialiased;}
.en body.hub{font-family:var(--mx-en);}
/* リセットは :where で詳細度0にし、後続のクラス指定が必ず勝つようにする（2027 版と同じ考え方） */
:where(.hub) :where(h1,h2,p,dl,dd){margin:0;padding:0;}
:where(.hub) :where(img){max-width:100%;height:auto;border:0;}
:where(.hub) :where(a){color:inherit;text-decoration:none;}
.hub a:focus-visible{outline:3px solid var(--mx-pink);outline-offset:3px;}
.hub-vh{position:absolute !important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.hub-skip{position:absolute;left:12px;top:-60px;z-index:2000;padding:8px 14px;border-radius:8px;background:#fff;color:var(--mx-text);font-weight:700;}
.hub-skip:focus{top:12px;}
.hub-wrap{position:relative;z-index:1;max-width:var(--mx-wrap);margin:0 auto;padding:0 24px;}

/* 【仮】の印：本文の流れを邪魔しないよう、小さく・薄く出す（サンプル確認用） */
.hub-tbd{display:inline-block;margin-left:.35em;font-family:var(--mx-ja);font-size:10px;font-weight:500;line-height:1;letter-spacing:0;vertical-align:.2em;opacity:.55;white-space:nowrap;}

/* ================= ヘッダー（2027 版の .mxh と同じすりガラスのバー） ================= */
.hub-h{position:absolute;top:0;left:0;right:0;z-index:100;padding:0 max(16px, calc((100% - 1280px) / 2));pointer-events:none;}
.hub-h__bar{
	pointer-events:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;
	height:var(--mx-header-h);padding:0 12px 0 20px;
	background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
	border:1px solid rgba(255,255,255,.8);border-top:0;border-radius:0 0 18px 18px;
	box-shadow:0 6px 20px rgba(0,0,0,.10);
}
.hub-h__logo img{display:block;height:34px;width:auto;}
.hub-lang{display:flex;align-items:center;gap:2px;padding:2px 6px;border:1px solid rgba(0,0,0,.12);border-radius:999px;background:linear-gradient(#fff,rgba(240,240,244,.9));box-shadow:inset 0 1px 2px rgba(0,0,0,.06);font-family:var(--mx-en);font-size:14px;font-weight:600;line-height:1;}
.hub-lang a,.hub-lang span{display:block;padding:8px 12px;border-radius:999px;}
.hub-lang a{color:#888;}
.hub-lang a:hover{color:var(--mx-text);}
.hub-lang span{background:var(--mx-text);color:#fff;}

/* ================= 開催回のパネル ================= */
.hub-eds{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);min-height:clamp(680px, 100svh, 980px);background:var(--mx-black);}
.hub-ed{
	position:relative;isolation:isolate;overflow:hidden;
	display:flex;flex-direction:column;justify-content:flex-end;
	padding:120px clamp(24px, 4.4vw, 72px) clamp(40px, 5vw, 72px);
	color:#fff;
}
/* 写真・影・装飾はパネルの奥（isolation でパネル内に閉じた重なり順の中で -1） */
.hub-ed__bg,.hub-ed__shade,.hub-ed__deco{position:absolute;inset:0;z-index:-1;pointer-events:none;}
.hub-ed__bg{background-repeat:no-repeat;transition:transform .8s cubic-bezier(.2,.7,.2,1);}
.hub-ed:hover .hub-ed__bg,.hub-ed:focus-within .hub-ed__bg{transform:scale(1.04);}
.hub-ed__in{max-width:640px;}

/* ---- 最新回（2027）：会場の写真に、2027 版 KV と同じ紫寄りの影＋花模様 ---- */
.hub-ed--latest .hub-ed__bg{background-size:cover;background-position:40% 50%;}
.hub-ed--latest .hub-ed__shade{
	background:
		linear-gradient(180deg, rgba(20,18,40,.50) 0%, rgba(20,18,40,.10) 30%, rgba(70,28,80,.55) 62%, rgba(11,11,11,.94) 100%),
		linear-gradient(90deg, rgba(20,18,40,.45), rgba(20,18,40,0) 70%);
}
.hub-ed__deco{background:url(/assets/back.webp) right -260px bottom -300px / 900px auto no-repeat;opacity:.22;mix-blend-mode:screen;}

/* ---- 過去回（2026）：2026 版の KV（下半分のロゴ・日付は焼き込みなので、上側の模様だけ見せて下を黒へ落とす） ---- */
.hub-ed--archive{border-left:1px solid rgba(255,255,255,.12);}
.hub-ed--archive .hub-ed__bg{background-size:auto 150%;background-position:50% 0;filter:saturate(.9);}
.hub-ed--archive .hub-ed__shade{background:linear-gradient(180deg, rgba(11,11,11,.30) 0%, rgba(11,11,11,.25) 28%, rgba(11,11,11,.86) 58%, var(--mx-black) 100%);}

/* ---- パネルの中身 ---- */
.hub-ed__badge{
	display:inline-block;margin:0 0 18px;padding:5px 14px;border-radius:999px;
	font-family:var(--mx-en);font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.14em;text-transform:uppercase;
}
.hub-ed--latest .hub-ed__badge{background:var(--mx-pink);color:var(--mx-black);}
.hub-ed--archive .hub-ed__badge{border:1px solid var(--mx26-orange-a);color:var(--mx26-orange-a);}
.ja .hub-ed__badge{letter-spacing:.1em;}

.hub-ed__title{display:flex;align-items:flex-end;flex-wrap:wrap;gap:.18em;margin:0;line-height:1;font-size:clamp(40px, 5vw, 76px);}
.hub-ed__title img{display:block;height:.92em;width:auto;filter:brightness(0) invert(1);}
.hub-ed__title span{font-family:var(--mx-en);font-weight:800;letter-spacing:.01em;line-height:.8;}
.hub-ed--latest .hub-ed__title span{color:var(--mx-pink);}
.hub-ed--archive .hub-ed__title{font-size:clamp(32px, 3.2vw, 50px);}
.hub-ed--archive .hub-ed__title span{background:linear-gradient(to right, var(--mx26-orange-a), var(--mx26-orange-b));-webkit-background-clip:text;background-clip:text;color:transparent;}

.hub-ed__catch{margin-top:22px;font-family:var(--mx-en);font-weight:700;font-size:clamp(24px, 2.6vw, 40px);line-height:1.2;letter-spacing:.01em;}
.ja .hub-ed__catch{letter-spacing:.02em;}
.hub-ed--archive .hub-ed__catch{font-size:clamp(20px, 1.8vw, 28px);}
.ja .hub-ed--archive .hub-ed__catch{font-family:var(--mx-ja);font-weight:900;}
.hub-ed__sub{margin-top:8px;font-size:14px;font-weight:600;line-height:1.6;letter-spacing:.06em;color:rgba(255,255,255,.82);}
.en .hub-ed__sub{font-family:var(--mx-en);letter-spacing:.04em;}

/* 開催日・会場・参加形式（2027 版フッターの開催情報と同じく、ラベルはピンクの小さな英字） */
.hub-ed__facts{display:grid;gap:10px;margin:26px 0 0;padding:20px 0 0;border-top:1px solid rgba(255,255,255,.22);position:relative;}
.hub-ed__facts::before{content:"";position:absolute;top:-1px;left:0;width:36px;height:2px;background:var(--mx-pink);}
.hub-ed--archive .hub-ed__facts::before{background:linear-gradient(to right, var(--mx26-orange-a), var(--mx26-orange-b));}
.hub-ed__facts div{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:12px;align-items:baseline;}
.hub-ed__facts dt{font-family:var(--mx-en);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mx-pink);}
.ja .hub-ed__facts dt{font-family:var(--mx-ja);font-size:12px;letter-spacing:.08em;}
.hub-ed--archive .hub-ed__facts dt{color:var(--mx26-orange-a);}
.hub-ed__facts dd{font-size:15px;font-weight:600;line-height:1.5;}
.en .hub-ed__facts dd{font-family:var(--mx-en);}
.hub-ed--archive .hub-ed__facts dd{font-size:14px;}

.hub-ed__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}

/* ================= ボタン（2027 版の .mx-btn と同じピル型＋三角の矢印） ================= */
.hub-btn{
	position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:50px;
	padding:12px 54px 12px 30px;border-radius:999px;
	font-family:var(--mx-ja);font-weight:700;font-size:15px;line-height:1.4;letter-spacing:.08em;
	transition:filter .2s,transform .2s,background-color .2s;
}
.en .hub-btn{font-family:var(--mx-en);letter-spacing:.04em;}
.hub-btn__arw{position:absolute;right:22px;top:50%;width:8px;height:15px;margin-top:-7px;background:url(/assets/try.png) center/contain no-repeat;transform:scaleX(-1);}   /* try.png は左向きの三角なので、進む方向（右向き）に反転する */
/* 最新回：2027 版のアーカイブ帯と同じ紫のグラデーション（白文字とのコントラスト 4.5:1 以上を確保した配色） */
.hub-btn--main{min-width:260px;background:linear-gradient(to right,#b24d91,var(--mx-purple-d));color:#fff;box-shadow:0 6px 18px rgba(140,60,130,.35);border:1px solid rgba(255,255,255,.35);}
.hub-btn--main .hub-btn__arw{filter:brightness(0) invert(1);}
/* 過去回：旧 2026 版のオレンジ。明るい側でも読めるよう文字は黒 */
.hub-btn--arch{background:linear-gradient(to right, var(--mx26-orange-a), var(--mx26-orange-b));color:var(--mx-black);}
.hub-btn--arch .hub-btn__arw{filter:brightness(0);}
.hub-btn--sub{padding:12px 26px;border:1px solid rgba(255,255,255,.6);color:#fff;background:rgba(255,255,255,.04);}
.hub-btn--sub:hover{background:rgba(255,255,255,.14);}
.hub-ed:hover .hub-btn--main,.hub-btn--main:focus-visible{transform:translateY(-2px);filter:brightness(1.08);}
.hub-ed:hover .hub-btn--arch,.hub-btn--arch:focus-visible{transform:translateY(-2px);filter:brightness(1.05);}

/* パネル全体をクリックできるようにする（TOKEN2049 と同じ）。主ボタンの ::after をパネル全面に広げる。
   2 つ目のボタン（.hub-btn--sub）はその上に出す */
.hub-ed__link::after{content:"";position:absolute;inset:0;z-index:1;}
.hub-btn--sub{position:relative;z-index:2;}

/* ================= MoneyX について ================= */
.hub-about{position:relative;overflow:hidden;padding:96px 0 110px;background:var(--mx-bg);}
/* 2027 版と同じ花模様の装飾（右上） */
.hub-about::before{content:"";position:absolute;z-index:0;top:-160px;right:-380px;width:1000px;height:1000px;background:url(/assets/back.webp) center/contain no-repeat;opacity:.45;pointer-events:none;}
/* 見出し（2027 版の .mx-head と同じ：頭にピンクの三角 try.png） */
.hub-head{margin:0 0 36px -24px;}
.hub-head__en,.hub-head__main{position:relative;padding-left:44px;}
.hub-head__en::before,.hub-head__main::before{content:"";position:absolute;top:50%;background:url(/assets/try.png) center/contain no-repeat;}
.hub-head__en{font-family:var(--mx-en);font-weight:400;font-size:26px;line-height:1.3;letter-spacing:.04em;color:var(--mx-pink-d);margin-bottom:6px;}
.hub-head__en::before{left:0;width:18px;height:35px;margin-top:-18px;}
.hub-head__main{font-family:var(--mx-ja);font-weight:900;font-size:46px;line-height:1.3;letter-spacing:.06em;}
.en .hub-head__main{font-family:var(--mx-en);font-weight:700;letter-spacing:.01em;}
.hub-head__main::before{left:-22px;width:20px;height:39px;margin-top:-20px;}
.en .hub-head__en{display:none;}   /* 英語ページは小見出しと見出しが同じ文言になるので小見出しを出さない */
.en .hub-head__main{padding-left:44px;}

.hub-about__catch{max-width:760px;font-weight:900;font-size:26px;line-height:1.5;letter-spacing:.04em;}
.en .hub-about__catch{font-weight:700;letter-spacing:.01em;}
.hub-about__text{max-width:760px;margin-top:16px;font-size:15px;line-height:1.95;letter-spacing:.02em;}
.en .hub-about__text{font-size:14.5px;line-height:1.85;letter-spacing:0;}

/* 主催者表記（2027 版の .mx-org と同じ白い角丸の枠） */
.hub-org{max-width:690px;margin:48px auto 0;padding:18px 32px 24px;text-align:center;background:#fff;border-radius:14px;box-shadow:0 4px 16px rgba(0,0,0,.08);}
.hub-org__h{font-family:var(--mx-en);font-size:13px;font-weight:600;letter-spacing:.02em;margin-bottom:10px;}
.hub-org__logos{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;}
.hub-org__logos img{display:block;width:200px;max-width:100%;height:auto;}

/* ================= フッター（2027 版の .mxf と同じ黒地） ================= */
.hub-f{background:var(--mx-black);color:#fff;font-family:var(--mx-en);font-size:14px;line-height:1.6;}
.hub-f__in{max-width:var(--mx-wrap);margin:0 auto;padding:64px 24px 40px;display:flex;justify-content:space-between;gap:48px;}
.hub-f__brand{text-align:center;min-width:240px;}
.hub-f__logo{display:inline-block;}
.hub-f__logo img{display:block;width:200px;height:auto;filter:brightness(0) invert(1);}
.hub-f__tag{margin:14px 0 0;color:#aaa;font-size:11px;letter-spacing:.14em;text-transform:uppercase;}
.hub-f__nav{display:flex;gap:64px;}
.hub-f__col{display:flex;flex-direction:column;gap:8px;min-width:140px;}
.hub-f__h{margin:0 0 6px;color:var(--mx-pink);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;}
.hub-f__col a{color:#fff;font-weight:500;}
.hub-f__col a:hover,.hub-f__col a[aria-current]{color:var(--mx-pink);}
.hub-f__copy{border-top:1px solid #222;padding:18px 16px;text-align:center;color:#888;font-size:12px;}
.ja .hub-f__col a:lang(ja),.hub-f__copy{font-family:var(--mx-ja);}

/* ================= 中間幅 ================= */
@media (max-width:1080px){
	.hub-eds{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);}
	.hub-f__in{flex-direction:column;align-items:center;gap:44px;}
	.hub-f__col{align-items:center;text-align:center;}
}

/* ================= スマホ（パネルを縦に積む。最新回が先） ================= */
@media (max-width:800px){
	.hub-h__bar{padding:0 8px 0 16px;}
	.hub-h__logo img{height:28px;}
	.hub-lang{font-size:13px;}
	.hub-lang a,.hub-lang span{padding:7px 10px;}

	.hub-eds{grid-template-columns:minmax(0,1fr);min-height:0;}
	.hub-ed{padding:104px 20px 44px;}
	.hub-ed--latest{min-height:clamp(600px, 92svh, 760px);}   /* 縦に長い端末でも間延びしないよう上限を付ける */
	.hub-ed--archive{min-height:560px;padding-top:190px;border-left:0;border-top:1px solid rgba(255,255,255,.12);}
	/* 縦積みのときは写真を上の帯だけ見せ、文字が載る所から下は黒に落とす（明るい KV の上でバッジや年号が読めなくなるため） */
	.hub-ed--archive .hub-ed__shade{background:linear-gradient(180deg, rgba(11,11,11,.20) 0, rgba(11,11,11,.55) 110px, rgba(11,11,11,.93) 190px, var(--mx-black) 100%);}
	.hub-ed__deco{background-position:right -300px bottom -260px;background-size:700px auto;}
	.hub-ed__title{font-size:44px;}
	.hub-ed--archive .hub-ed__title{font-size:36px;}
	.hub-ed__catch{margin-top:16px;font-size:26px;}
	.hub-ed--archive .hub-ed__catch{font-size:21px;}
	.hub-ed__sub{font-size:13px;}
	.hub-ed__facts{margin-top:20px;padding-top:16px;gap:8px;}
	.hub-ed__facts div{grid-template-columns:6.5em minmax(0,1fr);gap:8px;}
	.en .hub-ed__facts div{grid-template-columns:8.4em minmax(0,1fr);}
	.en .hub-ed__facts dt{letter-spacing:.08em;}
	.hub-ed__facts dd{font-size:14px;}
	.hub-ed__cta{margin-top:24px;}
	.hub-btn{width:100%;}
	.hub-btn--main{min-width:0;}

	.hub-about{padding:64px 0 72px;}
	.hub-about::before{width:700px;height:700px;top:-120px;right:-360px;}
	.hub-wrap{padding:0 20px;}
	.hub-head{margin:0 0 24px -4px;}
	.hub-head__en{font-size:18px;padding-left:36px;}
	.hub-head__en::before{width:14px;height:27px;margin-top:-14px;}
	.hub-head__main{font-size:30px;padding-left:36px;}
	.en .hub-head__main{padding-left:36px;}
	.hub-head__main::before{left:-14px;width:16px;height:31px;margin-top:-16px;}
	.hub-about__catch{font-size:20px;}
	.hub-about__text{font-size:14px;}
	.hub-org{margin-top:32px;padding:16px 16px 20px;}
	.hub-org__logos{gap:4px 10px;}
	.hub-org__logos{flex-wrap:nowrap;}
	.hub-org__logos img{width:calc((100% - 20px) / 3);}

	.hub-f__in{padding:48px 16px 32px;gap:32px;}
	.hub-f__nav{flex-direction:column;gap:28px;}
}

/* 動きを減らす設定の端末ではズームを止める */
@media (prefers-reduced-motion:reduce){
	.hub-ed__bg,.hub-btn{transition:none;}
	.hub-ed:hover .hub-ed__bg,.hub-ed:focus-within .hub-ed__bg{transform:none;}
}
