@charset "UTF-8";body{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,sans-serif;margin:0;padding:0;background:#fff;color:#333;text-align:center}#root{min-height:100vh;display:flex;flex-direction:column}.title{background-color:#fff;height:30px;margin-bottom:80px;margin-top:70px}.title h1{margin:0 0 20px;font-size:30px;color:#199fbe;display:inline-block;padding-bottom:5px;position:relative}.title h1:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:30px;height:2px;background:#199fbe}@media (max-aspect-ratio: 1/1){.title{background-color:#fff;height:100px;margin-bottom:70px;margin-top:0}.title h1{margin:60px 0 20px;font-size:30px;color:#199fbe;display:inline-block;padding-bottom:5px;position:relative}.title h1:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:30px;height:2px;background:#199fbe}}.cardcontainer{background-color:#199fbe;padding:15px 0;display:flex;justify-content:center;align-items:center;min-height:200px}.forecast{background-color:#e4f1f8}.graph{background:#e4f1f8;padding-bottom:80px}.graph .text{margin-top:50px;font-size:25px;color:#199fbe;margin-bottom:30px}@media (max-aspect-ratio: 1/1){.graph .text{margin-top:50px;font-size:21px;color:#199fbe;margin-bottom:30px}}.bottom{background-color:#eee;height:130px}@media (max-aspect-ratio: 1/1){.bottom{background-color:#eee;height:130px}}.black{background-color:#071b21}.black p{color:#fff;font-size:12px;margin-top:10px}@media (max-aspect-ratio: 1/1){.black p{color:#fff;font-size:12px;margin-top:15px}}.loading-container,.error-container{padding:40px;text-align:center}.loading-container p,.error-container p{font-size:14px;color:#666}.card-graph{padding:60px 50px;width:50%;max-width:940px;margin:0 auto;background-color:#fff}.graph-container{width:100%;overflow-x:auto;overflow-y:hidden;padding:10px 0;background-color:#fff;margin:0 auto}.graph-svg{display:block;min-width:1800px}.graph-circle{cursor:pointer;transition:all .2s ease}.graph-circle:hover circle{r:6;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.graph-tooltip-panel{opacity:.95;stroke:#e5e7eb;stroke-width:1}.graph-tooltip-bg{fill:#fff;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.graph-tooltip-text{text-anchor:middle;font-size:14px;fill:#111827;font-weight:700}.graph-tooltip-pointer{fill:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}@media screen and (max-width: 768px){.card-graph,body .card-graph,html .card-graph{padding:5px!important;width:100%!important;max-width:none!important;margin:0!important;box-sizing:border-box!important}.graph-container,body .graph-container,html .graph-container{width:100%!important;padding:10px 5px!important;position:relative!important;min-height:450px!important;margin:0!important;box-sizing:border-box!important;overflow-x:auto!important;overflow-y:hidden!important;background-color:#fff!important}.graph-container:after,body .graph-container:after,html .graph-container:after{content:"→"!important;position:absolute!important;right:15px!important;top:50%!important;transform:translateY(-50%)!important;font-size:24px!important;color:#999!important;animation:scroll-hint 1.5s infinite!important;pointer-events:none!important;z-index:10!important}.graph-svg,body .graph-svg,html .graph-svg{min-width:1400px!important;width:auto!important;height:auto!important;max-height:400px!important;display:block!important}.graph-tooltip-text,body .graph-tooltip-text,html .graph-tooltip-text{font-size:10px!important}@keyframes scroll-hint{0%,to{opacity:.5;transform:translateY(-50%) translate(0)}50%{opacity:1;transform:translateY(-50%) translate(5px)}}}@media (max-aspect-ratio: 1/1){.card-graph,body .card-graph,html .card-graph{padding:5px!important;width:100%!important;max-width:none!important;margin:0!important;box-sizing:border-box!important}.graph-container,body .graph-container,html .graph-container{width:100%!important;padding:10px 5px!important;position:relative!important;min-height:450px!important;margin:0!important;box-sizing:border-box!important;overflow-x:auto!important;overflow-y:hidden!important;background-color:#fff!important}.graph-container:after,body .graph-container:after,html .graph-container:after{content:"→"!important;position:absolute!important;right:15px!important;top:50%!important;transform:translateY(-50%)!important;font-size:24px!important;color:#999!important;animation:scroll-hint 1.5s infinite!important;pointer-events:none!important;z-index:10!important}.graph-svg,body .graph-svg,html .graph-svg{min-width:1400px!important;width:auto!important;height:auto!important;max-height:400px!important;display:block!important}.graph-tooltip-text,body .graph-tooltip-text,html .graph-tooltip-text{font-size:10px!important}}.date-select h4{color:#fff;margin:0 0 10px;font-size:16px}.date-select .mb-3{margin-bottom:1.5rem}.flex{display:flex;justify-content:center;align-items:center}.flex.gap-md{gap:10px}.date-select .flex button{-webkit-appearance:none;appearance:none;all:unset;display:inline-block;background:#cceaf2;color:#fff;border:none;border-radius:4px;padding:15px 30px;font-size:18px;font-weight:700;line-height:1;text-align:center;cursor:pointer;box-sizing:border-box;-webkit-tap-highlight-color:transparent;background-clip:padding-box;transition:background-color .2s ease,transform .05s ease}.date-select .flex button.primary{background:#199fbe}.date-select .flex button.secondary{background:#85d3e8}.date-select .flex button:hover:not(:disabled){background:#199fbe;color:#fff}.date-select .flex button:active{transform:translateY(1px)}.date-select .flex button:disabled{opacity:.5;cursor:not-allowed}.date-select .flex button:focus-visible{outline:3px solid rgba(25,159,190,.45);outline-offset:2px}@media (min-aspect-ratio: 16/9){.date-select .flex button{padding:15px 140px;font-size:20px;border-radius:4px}}@media (max-aspect-ratio: 16/9){.date-select .flex button{padding:15px 30px;font-size:18px;border-radius:4px}}.card{background-color:#fff;padding:30px;border-radius:6px;box-shadow:0 6px 16px #00000026;text-align:center;min-width:300px}.card .region-text{font-size:16px;margin-bottom:20px;color:#0e0e0e;font-weight:500}.card .select-wrap{position:relative;display:inline-block}.card .select-wrap:after{content:"▼";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:14px;color:#000;pointer-events:none}.card .region-select{background:#e4f1f8;border:2px solid #199fbe;border-radius:9999px;color:#0e0e0e;font-size:16px;font-weight:500;padding:12px 60px 12px 24px;cursor:pointer;box-shadow:0 2px 6px #0000001a;outline:none;appearance:none;-webkit-appearance:none;-moz-appearance:none}.card .region-select:focus{border-color:#007a99;box-shadow:0 0 0 3px #007a9933}.card .region-select:hover{background:#d9edf7}.header{background-color:#fff;box-shadow:0 2px 4px #0000001a;width:100%;position:relative;z-index:1000;height:100px}.header .header-inner{position:absolute;top:20px;left:60px}.header .header-inner .logo{height:60px}@media (max-aspect-ratio: 1/1){.header{background-color:#fff;box-shadow:0 2px 4px #0000001a;width:100%;position:relative;z-index:1000;height:55px}.header .header-inner{position:absolute;top:0;left:-3px}.header .header-inner .logo{height:60px}}.bottomlogo{display:flex;justify-content:center;align-items:center;height:110px}.bottomlogo .logoimg{height:50px}@media (max-aspect-ratio: 1/1){.bottomlogo{display:flex;justify-content:center;align-items:center;height:130px}.bottomlogo .logoimg{height:50px}}.detail{display:flex;justify-content:center;align-items:center;margin-top:-29px}.detail a{color:#5a5959;font-weight:700;cursor:pointer;position:relative;font-size:13px}.detail a:hover{color:#a2a2a4}@media (max-aspect-ratio: 1/1){.detail{display:flex;justify-content:center;align-items:center;margin-top:-45px}.detail a{color:#5a5959;font-weight:700;cursor:pointer;position:relative;font-size:10px}.detail a:hover{color:#a2a2a4}}.forecast-container{background-color:#fefefe;box-shadow:0 2px 8px #0000001a;padding:24px;margin:60px auto 20px;max-width:1000px;transition:box-shadow .3s ease;text-align:center}.forecast-container:hover{box-shadow:0 4px 16px #00000026}.forecast-container .forecast-title{margin:0 0 16px;color:#333;font-size:16px;font-weight:600}.forecast-container .forecast-price{margin:0 0 12px;color:#2196f3;font-size:36px;font-weight:700}.forecast-container .forecast-region{margin:0 0 32px;color:#999;font-size:12px}.forecast-container .price-summary{margin-top:24px;padding-top:24px;border-top:1px solid #eee}.forecast-container .price-summary .summary-title{margin:0 0 16px;color:#333;font-size:16px;font-weight:600}.forecast-container .price-summary .price-chart-container{position:relative}.forecast-container .price-summary .price-icons{display:flex;width:80%;margin:0 auto 4px;height:24px}.forecast-container .price-summary .price-icons .icon-slot{flex:1;display:flex;justify-content:center;align-items:center}.forecast-container .price-summary .price-icons .icon-slot .high-price-icon{color:#ff5722;font-size:20px;animation:pulse 1.5s infinite}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.7}to{transform:scale(1);opacity:1}}.forecast-container .price-summary .price-bar-horizontal{display:flex;width:80%;height:70px;margin:0 auto 8px;border:2px solid #c1c1c1;border-radius:4px;overflow:hidden}.forecast-container .price-summary .price-bar-horizontal .time-segment{flex:1;background-color:#fff;border-right:1px solid #e2e2e2;cursor:pointer;transition:opacity .2s ease}.forecast-container .price-summary .price-bar-horizontal .time-segment:last-child{border-right:none}.forecast-container .price-summary .price-bar-horizontal .time-segment.low-price{background-color:#d4f0ff}.forecast-container .price-summary .price-bar-horizontal .time-segment.normal-price{background-color:#e8f5e9}.forecast-container .price-summary .price-bar-horizontal .time-segment.high-price{background-color:#ffc5c5}.forecast-container .price-summary .price-bar-horizontal .time-segment:hover{opacity:.8}.forecast-container .price-summary .time-labels{display:flex;justify-content:space-between;width:80%;margin:0 auto;color:#666;font-size:12px}.forecast-container .price-summary .price-legend{margin-top:16px}.forecast-container .price-summary .price-legend .legend-row{display:flex;justify-content:center;gap:30px;margin-bottom:8px}.forecast-container .price-summary .price-legend .legend-row:last-child{margin-bottom:0}.forecast-container .price-summary .price-legend .legend-item{display:flex;align-items:center;gap:8px}.forecast-container .price-summary .price-legend .legend-item .legend-color{width:20px;height:20px;border:1px solid #ddd;border-radius:3px}.forecast-container .price-summary .price-legend .legend-item .legend-color.low{background-color:#d4f0ff}.forecast-container .price-summary .price-legend .legend-item .legend-color.normal{background-color:#e8f5e9}.forecast-container .price-summary .price-legend .legend-item .legend-color.high{background-color:#ffc5c5}.forecast-container .price-summary .price-legend .legend-item .legend-bolt-icon{width:20px;height:20px;color:#ff5722;font-size:18px}.forecast-container .price-summary .price-legend .legend-item .legend-text{color:#666;font-size:13px}@media (max-aspect-ratio: 1/1){.forecast-container{background-color:#fefefe;box-shadow:0 2px 8px #0000001a;padding:24px;margin:50px auto 20px;max-width:1000px;transition:box-shadow .3s ease;text-align:center}.forecast-container:hover{box-shadow:0 4px 16px #00000026}.forecast-container .forecast-title{margin:0 0 16px;color:#333;font-size:16px;font-weight:600}.forecast-container .forecast-price{margin:0 0 12px;color:#2196f3;font-size:36px;font-weight:700}.forecast-container .forecast-region{margin:0 0 32px;color:#999;font-size:12px}.forecast-container .price-summary{margin-top:24px;padding-top:24px;border-top:1px solid #eee}.forecast-container .price-summary .summary-title{margin:0 0 16px;color:#333;font-size:16px;font-weight:600}.forecast-container .price-summary .price-chart-container{position:relative}.forecast-container .price-summary .price-icons{display:flex;width:80%;margin:0 auto 4px;height:24px}.forecast-container .price-summary .price-icons .icon-slot{flex:1;display:flex;justify-content:center;align-items:center}.forecast-container .price-summary .price-icons .icon-slot .high-price-icon{color:#ff5722;font-size:20px;animation:pulse 1.5s infinite}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.7}to{transform:scale(1);opacity:1}}.forecast-container .price-summary .price-bar-horizontal{display:flex;width:80%;height:70px;margin:0 auto 8px;border:2px solid #c1c1c1;border-radius:4px;overflow:hidden}.forecast-container .price-summary .price-bar-horizontal .time-segment{flex:1;background-color:#fff;border-right:1px solid #e2e2e2;cursor:pointer;transition:opacity .2s ease}.forecast-container .price-summary .price-bar-horizontal .time-segment:last-child{border-right:none}.forecast-container .price-summary .price-bar-horizontal .time-segment.low-price{background-color:#d4f0ff}.forecast-container .price-summary .price-bar-horizontal .time-segment.normal-price{background-color:#e8f5e9}.forecast-container .price-summary .price-bar-horizontal .time-segment.high-price{background-color:#ffc5c5}.forecast-container .price-summary .price-bar-horizontal .time-segment:hover{opacity:.8}.forecast-container .price-summary .time-labels{display:flex;justify-content:space-between;width:80%;margin:0 auto;color:#666;font-size:12px}.forecast-container .price-summary .price-legend{margin-top:16px}.forecast-container .price-summary .price-legend .legend-row{display:flex;justify-content:center;gap:30px;margin-bottom:8px}.forecast-container .price-summary .price-legend .legend-row:last-child{margin-bottom:0}.forecast-container .price-summary .price-legend .legend-item{display:flex;align-items:center;gap:8px}.forecast-container .price-summary .price-legend .legend-item .legend-color{width:20px;height:20px;border:1px solid #ddd;border-radius:3px}.forecast-container .price-summary .price-legend .legend-item .legend-color.low{background-color:#d4f0ff}.forecast-container .price-summary .price-legend .legend-item .legend-color.normal{background-color:#e8f5e9}.forecast-container .price-summary .price-legend .legend-item .legend-color.high{background-color:#ffc5c5}.forecast-container .price-summary .price-legend .legend-item .legend-bolt-icon{width:20px;height:20px;color:#ff5722;font-size:18px}.forecast-container .price-summary .price-legend .legend-item .legend-text{color:#666;font-size:13px}}