body{background-image:url(/system_summer2026/assets/top/hakone_top_p.png);background-position:center center;background-repeat:no-repeat;background-attachment:fixed;background-size:cover;background-color:#464646}@media only screen and (max-width: 767px){body{background-image:url(/system_summer2026/assets/top/hakone_top_p_2.png)}}@media only screen and (max-width: 479px){body{background-image:url(/system_summer2026/assets/top/hakone_top_p_2.png)}}#title-overlay{position:absolute;left:50%;transform:translateX(-50%);top:20px;width:70%;max-width:860px;pointer-events:none;text-align:center;box-sizing:border-box;padding:0;overflow:visible}#title-overlay img{display:block;width:100%;height:auto;margin:0 auto;-webkit-user-drag:none;user-select:none;object-fit:contain}#title-overlay .img2{width:50%;max-width:330px;height:auto;margin:0 auto;-webkit-user-drag:none;user-select:none;object-fit:contain}@media only screen and (max-width: 767px){#title-overlay{top:clamp(12px, 6vh, 60px);width:90%;max-width:none;padding:0 20px;box-sizing:border-box}#title-overlay .img2{width:60%;max-width:none}}@media only screen and (max-width: 479px){#title-overlay{top:clamp(12px, 6vh, 80px);width:100%;max-width:none;padding:0 10px;box-sizing:border-box}#title-overlay .img2{width:60%;max-width:none}}.page-note{position:fixed;right:calc(12px + env(safe-area-inset-right));bottom:calc(76px + env(safe-area-inset-bottom));width:140px;max-width:22vw;height:auto;opacity:0.9;pointer-events:none;user-select:none;-webkit-user-drag:none;z-index:10000;transition:bottom 0.25s ease}@media screen and (max-width: 850px){.page-note{bottom:calc(120px + env(safe-area-inset-bottom))}}@media screen and (max-width: 550px){.page-note{bottom:calc(216px + env(safe-area-inset-bottom))}}@media only screen and (max-width: 479px){.page-note{width:110px;max-width:none;right:calc(8px + env(safe-area-inset-right));bottom:calc(216px + env(safe-area-inset-bottom));opacity:0.95}}@media (max-width: 360px){.page-note{width:96px;right:calc(6px + env(safe-area-inset-right));bottom:calc(216px + env(safe-area-inset-bottom))}}.fixed-banner-wrap{position:fixed;bottom:0;left:0;width:100%;padding:12px 0;z-index:9999;background:rgba(10,100,176,0.6);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);border-top:1px solid rgba(255,255,255,0.15);box-shadow:0 -5px 25px rgba(0,0,0,0.4)}.fixed-button-container{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:1px;margin:0 auto;padding:0 16px;width:100%;max-width:1200px;box-sizing:border-box}.cool-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 4px;border:none;background:transparent;font-family:"Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Segoe UI", sans-serif;font-weight:900;text-decoration:none;letter-spacing:0.02em;white-space:nowrap;z-index:1;transition:color 0.25s ease;cursor:pointer;box-sizing:border-box}.cool-btn::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;transform:skewX(-14deg);border-top-left-radius:3px;border-bottom-right-radius:3px;border-top-right-radius:1px;border-bottom-left-radius:1px;transition:background 0.25s ease}.cool-btn.btn-rank-1{flex:2.2;font-size:22px;color:#111111}.cool-btn.btn-rank-1::before{background:#f7e06c}.cool-btn.btn-rank-1:hover{color:#ffffff;text-shadow:0 1px 4px rgba(0,0,0,0.6);opacity:1}.cool-btn.btn-rank-1:hover::before{background:#fcd535}.cool-btn.btn-rank-2,.cool-btn.btn-rank-3,.cool-btn.btn-rank-4{flex:1.0;font-size:18px;color:#0a64b0}.cool-btn.btn-rank-2::before,.cool-btn.btn-rank-3::before,.cool-btn.btn-rank-4::before{background:rgba(235,242,250,0.85)}.cool-btn.btn-rank-2:hover,.cool-btn.btn-rank-3:hover,.cool-btn.btn-rank-4:hover{color:#ffffff;text-shadow:0 1px 4px rgba(0,0,0,0.6)}.cool-btn.btn-rank-2:hover::before,.cool-btn.btn-rank-3:hover::before,.cool-btn.btn-rank-4:hover::before{background:#0a64b0}@media screen and (max-width: 850px){.fixed-button-container{gap:4px 1px}.cool-btn.btn-rank-1{flex:none;width:100%;font-size:clamp(14px, 2.5vw, 20px)}.cool-btn.btn-rank-2,.cool-btn.btn-rank-3,.cool-btn.btn-rank-4{flex:none;width:calc(33.333% - 1px);font-size:clamp(10px, 2vw, 16px)}}@media screen and (max-width: 550px){.fixed-banner-wrap{padding:8px 0}.fixed-button-container{flex-direction:column;gap:3px;padding:0 12px}.cool-btn{flex:none;width:100% !important;height:44px}.cool-btn::before{transform:skewX(-10deg)}.cool-btn.btn-rank-1{font-size:clamp(13px, 5.5vw, 18px)}.cool-btn.btn-rank-2,.cool-btn.btn-rank-3,.cool-btn.btn-rank-4{font-size:clamp(12px, 5vw, 16px)}}
