@charset "utf-8";

/* ============================================================
   ページ背景 — スマホエリア(640px)外を水色に
   ※ gameon.css/js は index.html のみ読み込み（変更禁止ページに影響なし）
   ============================================================ */
html{background:var(--ds-color-page)}
body{background:var(--ds-color-white)}
.container{position:relative;z-index:1}

/* ============================================================
   GAME ON! PROJECT 2026 — 月別イベントカレンダー
   ============================================================ */
.gameon{
	--base:var(--ds-color-surface);--navy:var(--ds-color-text-primary);--blue:var(--ds-color-blue);--bar:#c3e5fb;
	position:relative;width:100%;max-width:var(--ds-content-max);margin:10% auto 0;overflow:clip;
	background:var(--base);color:var(--navy);text-align:center;
	font-family:var(--ds-font-display);
}
.gameon *,.gameon *::before,.gameon *::after{box-sizing:border-box}

/* ロゴ */
.ge_logo{margin:0;line-height:1}
.ge_logo_img{display:block;width:80%;max-width:430px;height:auto;margin:0 auto;filter:drop-shadow(0 8px 18px rgba(20,80,160,.18))}

/* ROADMAP */
.ge_roadmap{
	position:relative;margin-top:0;padding:34px 5.5% 82px;overflow:hidden;
	background-color:var(--ds-color-surface-light);
	background-image:linear-gradient(180deg,#dff3ff 0,#f8fcff 22%,#eef9ff 100%);
}
.ge_roadmap::before,.ge_roadmap::after{position:absolute;z-index:0;pointer-events:none;font-family:var(--ds-font-display);line-height:1}
.ge_roadmap::before{content:"✦";top:-54px;left:-48px;color:rgba(38,163,231,.13);font-size:230px;transform:rotate(-10deg)}
.ge_roadmap::after{display:none}
.ge_logo,.ge_rm_intro{position:relative;z-index:1}
.ge_rm_intro{margin-top:14px}
.ge_rm_label{position:relative;isolation:isolate;display:inline-block;margin:0;font-family:"Arial Black","Noto Sans JP",sans-serif;font-size:39px;font-weight:900;letter-spacing:-.03em;line-height:1.15;transform:skew(-12deg);color:transparent;background:linear-gradient(155deg,#00cafa 0%,#009dff 35%,#0064ff 36%,#0050ed 68%,#00bdeb 100%);background-clip:text;-webkit-background-clip:text;filter:drop-shadow(0 2px 0 #b5e7fa)}
.ge_rm_label::before{content:attr(data-text);position:absolute;inset:0;z-index:-1;color:#fff;-webkit-text-stroke:.15em #fff}
.ge_rm_label span{position:relative;background:inherit;background-clip:text;-webkit-background-clip:text;color:transparent}
.ge_rm_jp{margin:6px 0 0;color:#5680a2;font-size:12px;font-weight:700;letter-spacing:.1em}
.ge_rm_intro .ge_start{position:relative;display:table;margin:20px auto 0;padding-bottom:9px;color:#12528b;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;font-size:28px;font-weight:800;line-height:1.4;letter-spacing:.06em}
.ge_rm_intro .ge_start::after{content:"";position:absolute;left:24%;right:24%;bottom:0;height:3px;background:linear-gradient(90deg,#00bde9,#1677ee);border-radius:2px}
.ge_rm_intro .ge_lead{max-width:500px;margin:11px auto 0;color:var(--ds-color-text-secondary);font-size:13px;font-weight:700;line-height:1.95;letter-spacing:.01em}
.ge_rm_intro .ge_lead strong{font-weight:700}

#go-projects{position:relative;z-index:1;margin-top:52px}
#go-projects::before{content:"";position:absolute;top:62px;bottom:-38px;left:59px;width:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='65' viewBox='0 0 14 65'%3E%3Cg fill='%2383c9f2'%3E%3Ccircle cx='7' cy='3' r='3'/%3E%3Ccircle cx='7' cy='16' r='3'/%3E%3Ccircle cx='7' cy='29' r='3'/%3E%3Ccircle cx='7' cy='55' r='3'/%3E%3C/g%3E%3Cpath d='M2 38 7 43l5-5' fill='none' stroke='%2383c9f2' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center top/14px 65px repeat-y;pointer-events:none}
.ge_month{--month:var(--ds-color-pink);--month-deep:rgba(225,54,117,.72);--month-text:#b91553;--month-shadow:rgba(255,120,170,.32);position:relative;display:grid;grid-template-columns:132px minmax(0,1fr);gap:20px;align-items:start;text-align:left}
.ge_month+.ge_month{margin-top:var(--ds-space-xl)}
.ge_theme_orange{--month:var(--ds-color-orange);--month-deep:rgba(236,112,30,.72);--month-text:#b64b05;--month-shadow:rgba(255,156,82,.32)}.ge_theme_mint{--month:var(--ds-color-mint);--month-deep:rgba(14,160,119,.72);--month-text:#08725e;--month-shadow:rgba(49,205,160,.3)}.ge_theme_blue{--month:var(--ds-color-blue);--month-deep:rgba(22,126,194,.72);--month-text:#075f9c;--month-shadow:rgba(54,169,232,.3)}
.ge_month_badge{position:relative;z-index:2;display:flex;width:116px;height:116px;margin:0 auto;overflow:hidden;flex-direction:column;align-items:center;justify-content:center;border:6px solid var(--ds-color-white);border-radius:50%;background-color:var(--month);background-image:linear-gradient(var(--month-deep),var(--month-deep)),url("../img/bg_hexagon.jpg");background-position:center;background-size:100% 100%,64px 73px;background-repeat:no-repeat,repeat;background-blend-mode:color,normal;box-shadow:0 8px 20px var(--month-shadow),inset 0 0 0 1px rgba(255,255,255,.24);color:var(--month-text);text-align:center}
.ge_month_number{position:relative;z-index:2;font-family:var(--ds-font-display);font-size:49px;font-weight:800;line-height:.85;text-shadow:-2px -2px 1px #fff,2px -2px 1px #fff,-2px 2px 1px #fff,2px 2px 1px #fff,0 -2px 1px #fff,2px 0 1px #fff,0 2px 1px #fff,-2px 0 1px #fff}
.ge_month_number::after{content:"月";margin-left:2px;font-family:inherit;font-size:13px;font-weight:800}
.ge_month_events{display:grid;gap:13px;min-width:0;padding-top:3px}
.ge_event{position:relative;padding:20px 20px 20px 23px;overflow:hidden;border:0;border-radius:0 var(--ds-radius-lg) var(--ds-radius-lg) var(--ds-radius-lg);background:rgba(255,255,255,.96);clip-path:polygon(14px 0,100% 0,100% 100%,0 100%,0 14px);filter:drop-shadow(0 8px 11px rgba(37,113,164,.12));box-shadow:inset 0 0 0 1px var(--ds-color-border)}
.ge_event::before{content:"";position:absolute;top:0;left:14px;width:78px;height:4px;border:0;background:linear-gradient(90deg,var(--month),rgba(255,255,255,0));transform:none}
.ge_event_meta{position:relative;display:inline-flex;align-items:center;gap:0;overflow:hidden;border-radius:var(--ds-radius-pill);background:color-mix(in srgb,var(--month),white 88%);color:var(--month-text);font-size:8px;font-weight:800;letter-spacing:.1em}
.ge_event_meta::before{content:"◆";margin-left:8px;color:var(--month);font-size:6px}
.ge_event_meta span{padding:5px 7px}
.ge_event_meta span+span{border-left:1px solid color-mix(in srgb,var(--month),white 67%)}
.ge_event_date{position:relative;margin:8px 0 0;color:var(--month);font-family:var(--ds-font-display);font-size:17px;font-weight:800;line-height:1}
.ge_event_title{position:relative;margin:8px 0 0;color:var(--navy);font-size:18px;font-weight:900;line-height:1.45;letter-spacing:.03em}
.ge_event_teaser{padding:23px 24px;background-color:var(--ds-color-white);background-image:linear-gradient(135deg,rgba(255,255,255,.95),color-mix(in srgb,var(--month),white 88%));box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--month),white 50%),inset 0 0 28px color-mix(in srgb,var(--month),transparent 88%)}
.ge_event_teaser:has(.ge_event_icon){padding-right:132px}
.ge_event_teaser::before{width:58%;height:5px;background:linear-gradient(90deg,var(--month),#ffd12d,rgba(255,255,255,0))}
.ge_event_icon{position:absolute;top:54px;right:12px;width:96px;height:96px;border-radius:22%;object-fit:cover;opacity:.68}
.ge_teaser_kicker{display:inline-block;margin:0;padding:6px 11px;border-radius:4px 999px 999px 999px;background:var(--month-text);color:var(--ds-color-white);font-size:9px;font-weight:800;letter-spacing:.14em;box-shadow:3px 3px 0 color-mix(in srgb,var(--month),white 48%)}
.ge_event_teaser .ge_event_date{margin-top:17px;color:var(--month-text);font-size:17px}
.ge_event_teaser .ge_event_title{max-width:90%;margin-top:8px;font-size:21px;line-height:1.45}
.ge_teaser_copy{position:relative;max-width:94%;margin:8px 0 0;color:#4f7593;font-size:10px;font-weight:700;line-height:1.75}
.ge_teaser_footer{position:relative;display:flex;margin-top:15px;align-items:center;gap:9px;flex-wrap:wrap}
.ge_teaser_footer span{padding:5px 9px;border-radius:var(--ds-radius-pill);background:var(--ds-color-white);color:var(--month-text);font-size:8px;font-weight:800;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--month),white 54%)}
.ge_event_completed{padding:0;overflow:hidden;border:1px solid rgba(20,155,118,.26);border-radius:var(--ds-radius-lg);background:#fff;clip-path:none;filter:saturate(.88);box-shadow:0 2px 6px rgba(37,113,164,.05)}
.ge_event_completed::before{display:none}
.ge_completed_header{display:flex;min-height:52px;padding:11px 22px;align-items:center;background:#149b76;color:var(--ds-color-white)}
.ge_completed_status{display:inline-flex;margin:0;align-items:center;gap:9px;color:var(--ds-color-white);font-size:11px;font-weight:800;letter-spacing:.08em}
.ge_completed_status span{display:grid;width:25px;height:25px;place-items:center;border-radius:50%;background:var(--ds-color-white);color:#149b76;font-size:15px;line-height:1}
.ge_completed_body{position:relative;padding:20px 23px}
.ge_event_completed .ge_event_date{margin-top:0;color:#149b76;font-size:17px}
.ge_event_completed .ge_event_title{display:block;margin-top:8px;padding:0;font-size:21px}
.ge_event_completed .ge_event_title::after{display:none}
.ge_completed_copy{position:relative;max-width:94%;margin:10px 0 0;color:var(--ds-color-text-muted);font-size:10px;font-weight:700;line-height:1.75}
.ge_completed_footer{position:relative;display:flex;margin-top:15px;align-items:center;gap:8px;flex-wrap:wrap}
.ge_completed_footer span,.ge_completed_footer strong{padding:5px 9px;border-radius:var(--ds-radius-pill);font-size:8px;font-weight:800;letter-spacing:.06em}
.ge_completed_footer span{background:var(--ds-color-white);color:var(--month-text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--month),white 54%)}
.ge_completed_footer strong{background:#dff7ef;color:#0d7558}
.ge_event_academy{padding:24px 142px 24px 25px;background-color:#f8fcff;background-image:linear-gradient(135deg,rgba(255,255,255,.96),rgba(220,243,255,.9)),url("../img/bg_hexagon.jpg");background-position:center;background-size:100% 100%,82px 94px;background-blend-mode:normal,soft-light;box-shadow:inset 0 0 0 2px rgba(54,169,232,.3),inset 0 0 30px rgba(54,169,232,.08)}
.ge_event_academy::before{width:72%;height:5px;background:linear-gradient(90deg,#1e9ee5 0 62%,#ffd12d 62% 78%,rgba(255,255,255,0) 100%)}
.ge_academy_ribbon{display:inline-flex;margin:0;padding:7px 11px;align-items:center;gap:8px;border-radius:4px 12px 12px 12px;background:var(--ds-color-text-primary);color:var(--ds-color-white);font-size:9px;font-weight:800;letter-spacing:.12em;box-shadow:3px 3px 0 rgba(255,209,45,.7)}
.ge_academy_ribbon span{padding-left:8px;border-left:1px solid rgba(255,255,255,.38);color:#ffd12d}
.ge_academy_emblem{position:absolute;top:54px;right:12px;width:122px;height:auto;filter:drop-shadow(0 6px 8px rgba(27,74,120,.2))}
.ge_event_academy .ge_event_date{margin-top:18px;color:#238fd2;font-size:17px}
.ge_event_academy .ge_event_title{width:fit-content;margin-top:7px;padding:0 .08em;background:linear-gradient(transparent 57%,rgba(255,157,54,.5) 57% 91%,transparent 91%);font-size:24px;line-height:1.35}
.ge_academy_copy{margin:8px 0 0;color:#2e668f;font-size:11px;font-weight:800;line-height:1.7}
.ge_academy_detail{margin:6px 0 0;color:#5d7f99;font-size:9px;font-weight:700;line-height:1.7}
.ge_academy_tag{display:inline-block;margin:12px 0 0;padding:5px 10px;border-radius:var(--ds-radius-pill);background:#fff4cf;color:#9a6a00;font-size:8px;font-weight:800;letter-spacing:.08em}
.ge_event_upcoming{background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(220,244,255,.88));box-shadow:inset 0 0 0 1px rgba(54,169,232,.34),inset 0 0 24px rgba(54,169,232,.08)}
.ge_event_upcoming:has(.ge_upcoming_icon){padding-right:154px;padding-bottom:68px}
.ge_upcoming_icon{position:absolute;top:54px;right:12px;width:126px;height:auto;opacity:.65}
.ge_event_upcoming .ge_event_title{font-size:20px}
.ge_event_soon{margin:0;color:var(--month-text);font-size:15px;font-weight:800;letter-spacing:.14em;text-shadow:0 0 10px rgba(54,169,232,.2)}
.ge_event_text{margin:7px 0 0;color:var(--ds-color-text-muted);font-size:11px;font-weight:500;line-height:1.7}
.ge_schedule_note{position:relative;z-index:1;display:inline-block;margin:34px auto 0;padding:13px 22px;border:1px solid var(--ds-color-border-strong);border-radius:18px;background:rgba(255,255,255,.72);box-shadow:var(--ds-shadow-soft);color:var(--ds-color-text-muted);font-size:10px;font-weight:700;line-height:1.8;letter-spacing:.02em}
.ge_schedule_note span{margin-right:6px;color:var(--ds-color-yellow);font-size:13px}
.ge_calendar_continue{position:relative;z-index:2;width:6px;height:32px;margin:14px 0 0 63px}
.ge_calendar_continue::before{content:"";position:absolute;top:0;left:0;width:6px;height:6px;border-radius:50%;background:#83c9f2;box-shadow:0 13px 0 rgba(131,201,242,.7),0 26px 0 rgba(131,201,242,.4)}

/* スクロール連動表示 */
.go_reveal{opacity:0;transform:translateY(24px);transition:opacity var(--ds-motion-reveal) ease,transform var(--ds-motion-reveal) var(--ds-ease-out)}
.go_reveal.is_visible{opacity:1;transform:none}

/* SP */
@media(max-width:480px){
	.ge_logo_img{width:84%}
	.ge_roadmap{padding:28px 5% 68px}
	.ge_roadmap::before{top:-38px;left:-38px;font-size:160px}
	.ge_rm_intro{margin-top:10px}
	.ge_rm_label{font-size:28px}
	.ge_rm_jp{margin-top:5px;font-size:10px}
	.ge_rm_intro .ge_start{margin-top:17px;font-size:21px}
	.ge_rm_intro .ge_lead{max-width:94%;margin-top:9px;font-size:11px;line-height:1.9}
	#go-projects{margin-top:38px}
	#go-projects::before{top:47px;bottom:-36px;left:42px}
	.ge_month{grid-template-columns:98px minmax(0,1fr);gap:11px}
	.ge_month+.ge_month{margin-top:25px}
	.ge_month_badge{width:90px;height:90px;border-width:5px}
	.ge_month_number{font-size:38px}
	.ge_month_number::after{font-size:10px}
	.ge_event{padding:16px 13px 16px 17px;border-radius:0 17px 17px 17px;clip-path:polygon(11px 0,100% 0,100% 100%,0 100%,0 11px)}
	.ge_event::before{left:11px;width:58px;height:3px}
	.ge_event_meta{font-size:6px;letter-spacing:.06em}
	.ge_event_meta::before{margin-left:6px;font-size:5px}
	.ge_event_meta span{padding:4px 5px}
	.ge_event_date{margin-top:7px;font-size:13px}
	.ge_event_title{margin-top:6px;font-size:14px}
	.ge_event_teaser{padding:16px 14px}
	.ge_event_teaser:has(.ge_event_icon){padding-right:96px}
	.ge_event_icon{top:54px;right:9px;width:76px;height:76px}
	.ge_teaser_kicker{padding:5px 8px;font-size:6.5px}
	.ge_event_teaser .ge_event_date{margin-top:14px;font-size:13px}
	.ge_event_teaser .ge_event_title{max-width:88%;font-size:16px}
	.ge_teaser_copy{font-size:8.5px}
	.ge_teaser_footer{margin-top:12px;gap:6px}
	.ge_teaser_footer span{font-size:6.5px}
	.ge_completed_header{min-height:44px;padding:8px 12px}
	.ge_completed_status{gap:6px;font-size:9px}
	.ge_completed_status span{width:21px;height:21px;font-size:12px}
	.ge_completed_body{padding:15px 14px 16px}
	.ge_event_completed .ge_event_date{margin-top:0;font-size:14px}
	.ge_event_completed .ge_event_title{font-size:17px}
	.ge_completed_copy{margin-top:8px;font-size:8.5px}
	.ge_completed_footer{margin-top:12px;gap:6px}
	.ge_completed_footer span,.ge_completed_footer strong{font-size:6.5px}
	.ge_event_academy{padding:15px 112px 18px 17px;text-align:left}
	.ge_academy_ribbon{font-size:6.5px}
	.ge_academy_emblem{top:54px;right:9px;width:96px}
	.ge_event_academy .ge_event_date{margin-top:14px;font-size:14px}
	.ge_event_academy .ge_event_title{font-size:18px}
	.ge_academy_copy{font-size:9px}
	.ge_academy_detail{font-size:8px}
	.ge_academy_tag{margin-top:9px;font-size:7px}
	.ge_event_upcoming .ge_event_title{font-size:15px}
	.ge_event_upcoming:has(.ge_upcoming_icon){padding-right:106px;padding-bottom:36px}
	.ge_upcoming_icon{top:54px;right:9px;width:90px}
	.ge_event_soon{font-size:11px}
	.ge_event_text{font-size:9px}
	.ge_calendar_continue{margin:12px 0 0 46px}
	.ge_schedule_note{width:92%;margin-top:28px;padding:11px 12px;border-radius:15px;font-size:8.5px}
}
@media(prefers-reduced-motion:reduce){
	.go_reveal{opacity:1;transform:none;transition:none}
}