@import "https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400&display=swap";
:root{--content-max-width:720px;--content-padding:16px;--center-controls-top:42vh;--start-logo-top:14vh;--start-logo-width:min(72vw,320px);--gap:16px;--story-gap:45px;--gap-lg:28px;--step5-img1-margin-top:70%;--step5-img1-margin-bottom:700px;--step5-img7-margin-top:700px;--step5-img7-margin-bottom:0px;--fixed-bar-height:90px;--header-height:60px;--header-top-logo-top:10%;--header-top-logo-left:10%;--header-top-logo-height:45px}*{box-sizing:border-box}html,body{color:#111;background:#000;height:100%;margin:0;padding:0;font-family:Hiragino Kaku Gothic ProN,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ ProN W3,ヒラギノ角ゴ Pro W3,Hiragino Sans,Yu Gothic,Meiryo,sans-serif}.bg{background-position:50%;background-repeat:no-repeat;background-size:cover;min-height:100dvh}.bgCream{background-color:#faf9f6;background-image:none!important}.bgContain{background-size:contain}.content{max-width:var(--content-max-width);padding:var(--content-padding);margin:0 auto}.pageWithHeader .content{padding-top:calc(var(--content-padding) + var(--header-height) + env(safe-area-inset-top,0px))}.appHeader{z-index:50;padding-top:env(safe-area-inset-top,0px);pointer-events:none;position:fixed;top:0;left:0;right:0}.appHeader-topLogo{top:calc(env(safe-area-inset-top,0px) + var(--header-top-logo-top));left:var(--header-top-logo-left);height:var(--header-top-logo-height);object-fit:contain;z-index:51;width:auto;position:absolute;transform:translateY(0)}.appHeader-inner{max-width:none;height:var(--header-height);align-items:center;margin:0;padding:0;display:flex;position:relative}.appHeader-logo{width:100%;height:var(--header-height);object-fit:cover;display:block}.appHeader-step{color:#fff;letter-spacing:1px;background:#014268;border-radius:2px;padding:6px 10px;font-size:16px;font-weight:900;position:absolute;top:50%;left:70%;transform:translate(-50%,-50%)}.scrollDown{z-index:40;pointer-events:none;animation:1.4s ease-in-out infinite scrollDownFloat;position:fixed;top:70dvh;left:0;transform:translateY(-50%)}.scrollDown-inner{color:#000;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:30px;padding:10px 6px;display:flex}.scrollDown-label{color:#000;letter-spacing:.2em;writing-mode:vertical-rl;text-transform:uppercase;font-family:Josefin Sans,system-ui,sans-serif;font-size:12px;font-weight:400;text-decoration:none}.scrollDown-arrow{width:1px;height:35px;position:relative}.scrollDown-arrow:before{content:"";background:#000;width:1px;height:15px;position:absolute;bottom:5px;right:-5px;transform:skew(-31deg)}.scrollDown-arrow:after{content:"";background:#000;width:1px;height:30px;position:absolute;bottom:5px;right:0}@keyframes scrollDownFloat{0%,to{transform:translateY(-50%)translateY(0)}50%{transform:translateY(-50%)translateY(-10px)}}@media (prefers-reduced-motion:reduce){.scrollDown{animation:none}}.vstack{gap:var(--gap);flex-direction:column;margin-bottom:30px;display:flex}.img{border-radius:0;width:100%;height:auto;display:block}.img80{width:90%;margin-left:auto;margin-right:auto}.instructionLabel,.muted{color:#fff;text-align:left;background:#000000c7;border-radius:1px;width:fit-content;margin-left:0;margin-right:auto;padding:4px 6px;font-size:14px;font-weight:800;display:block}.progressCounter{color:#fff;text-align:left;background:#014268d9;border-radius:4px;width:fit-content;margin-left:0;margin-right:auto;padding:6px 10px;font-size:14px;font-weight:700;display:block}.placeholder{aspect-ratio:4/3;color:#666;background:repeating-linear-gradient(45deg,#f7f7f7,#f7f7f7 12px,#f0f0f0 12px 24px);border:1px dashed #aaa;border-radius:8px;justify-content:center;align-items:center;width:100%;font-size:14px;display:flex}.centerControls{min-height:100dvh;position:relative}.startLogo{left:50%;top:var(--start-logo-top);width:var(--start-logo-width);height:auto;position:absolute;transform:translate(-50%,-50%)}.centerControls-inner{left:50%;top:var(--center-controls-top);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#ffffffdb;border-radius:12px;width:calc(100vw - 40px);max-width:560px;padding:16px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 6px 24px #0003}.inputRow{gap:8px;width:100%;max-width:100%;display:flex}.input{border:1px solid #ccc;border-radius:8px;flex:1;min-width:0;height:44px;padding:0 12px;font-size:16px}.inputSuffix{color:#111;-webkit-user-select:none;user-select:none;flex-shrink:0;justify-content:center;align-items:center;height:44px;padding:0 15px 0 0;font-size:20px;font-weight:600;display:flex}.button{white-space:nowrap;color:#fff;background:#111;border:none;border-radius:8px;flex-shrink:0;height:44px;padding:0 14px;font-size:16px;font-weight:700}.buttonAnswer{background:#ea5c5b}.button[disabled]{color:#fff;background:#c6c6c6}.message{margin-top:6px;font-size:14px}.message.ok{color:#0c7a34}.message.warn{color:red}.message.info{color:#1b74b5}.fixedBarSpace{height:var(--fixed-bar-height)}.fixedBar{height:var(--fixed-bar-height);background-image:url(/img/logo/bottombar.png);background-position:50%;background-repeat:no-repeat;background-size:cover;grid-template-columns:auto auto auto;justify-content:center;place-items:center;gap:15px;padding:4px 6px;display:grid;position:fixed;bottom:0;left:0;right:0}.fixedBar button{cursor:pointer;background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;padding:0;display:flex}.fixedBar button[disabled]{opacity:.6;cursor:not-allowed}.fixedBar button img{width:auto;height:100%;max-height:calc(var(--fixed-bar-height) - 8px);object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;display:block}.modalOverlay{z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000073;justify-content:center;align-items:flex-end;padding:16px;display:flex;position:fixed;inset:0}.modalBody{width:100%;max-width:var(--content-max-width);background:#fff;border-radius:12px;max-height:84dvh;padding:16px;position:relative;overflow:auto}.modalHeader{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.hintModalContent{align-items:center}.hintDisplayBox{box-sizing:border-box;border-radius:8px;width:100%;margin-top:6px;padding:12px 14px}.hintDisplayBox--answer{background:#1b74b514;border:2px solid #1b74b5}.hintDisplayBox--hint{background:#2e9b4f1a;border:2px solid #2e9b4f}.hintDisplayLabel{margin-bottom:6px;font-weight:900}.hintDisplayBox--answer .hintDisplayLabel{color:#1b74b5}.hintDisplayBox--hint .hintDisplayLabel{color:#2e9b4f}.hintDisplayText{color:#0f1a2a}.hintModalTabs{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.hintSelectorTitle{color:#0f1a2a;margin-top:6px;margin-bottom:4px;font-weight:900}.hintSelectorGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%;display:grid}.hintSelectorButton{white-space:normal;text-align:left;word-break:break-word;height:auto;min-height:42px;line-height:1.25}.hintModalFooter{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.modalTitle{font-size:18px;font-weight:800}.modalClose{background:0 0;border:none;font-size:22px;line-height:1}.storyStack{gap:var(--story-gap);flex-direction:column;display:flex}.mapBlock{flex-direction:column;gap:0;display:flex}.mapOverlay{width:100%;position:relative}.mapBase{width:100%;height:auto;display:block}.mapLabel{color:#014268;text-shadow:0 0 6px #fffffff2;white-space:nowrap;font-size:min(4vw,26px);font-weight:1000;position:absolute}.mapLabel-a{top:12%;left:4%}.mapLabel-b{top:4%;left:36%}.mapLabel-c{top:46%;left:9%}.mapLabel-d{top:60%;left:47%}.mapLabel-e{top:40%;right:4%}.mapLabel-f{bottom:8%;left:13%}.storyStack .gapLgAfter+.gapLgBefore{margin-top:var(--gap-lg)}.gapLgAfter{margin-bottom:var(--gap-lg)}.gapLgBefore{margin-top:var(--gap-lg)}.step5-img1{margin-top:var(--step5-img1-margin-top);margin-bottom:var(--step5-img1-margin-bottom)}.step5-img7{margin-top:var(--step5-img7-margin-top);margin-bottom:var(--step5-img7-margin-bottom)}.shareBtn{color:#fff;box-sizing:border-box;background:#111;border:1px solid #222;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:10px 30px;font-family:inherit;font-size:16px;font-weight:800;line-height:1;text-decoration:none;display:inline-flex}.clearHpBtn{background:#1b74b5;border-color:#1b74b5}.clearActionStack{flex-direction:column;align-items:center;gap:30px;display:flex}.clearGuideBox{box-sizing:border-box;color:#0f1a2a;text-align:center;background:#2f6bff14;border:2px solid #1b74b5;border-radius:5px;width:min(90vw,520px);margin:14px auto 18px;padding:14px 16px;font-weight:700;line-height:1.6}.clearGuideEm{color:#fff;background-color:#ea5c5b;font-weight:900}.clearActionBtn{width:min(80vw,320px);height:54px}.shareBtn.withXIcon .xIcon{flex:none;width:15px;height:15px}.clearActionLabel{display:inline-block}.resultPopupOverlay{z-index:2000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0000004d;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.resultPopupBody{background:#fff;border-radius:12px;min-width:200px;max-width:90vw;padding:20px 24px;animation:.2s ease-out resultPopupSlideIn;position:relative;box-shadow:0 8px 32px #0000004d}@keyframes resultPopupSlideIn{0%{opacity:0;transform:translateY(-10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.resultPopupBody-ok{color:#fff;background:#63ba74}.resultPopupBody-error{color:#fff;background:#ea5c5b}.resultPopupBody-info{color:#fff;background:#5aa4ca}.resultPopupMessage{text-align:center;font-size:18px;font-weight:700}