:root{--color-white: #ffffff;--color-white-soft: #f4f4f4;--color-white-mute: #e0e0e0;--color-black: #000000;--color-black-soft: #656565;--color-black-mute: #b2b2b2;--color-main: #243630;--color-main-soft: #4f5f59;--color-main-mute: #e9ebea}:root{--color-background: var(--color-white);--color-background-soft: var(--color-white-soft);--color-background-mute: var(--color-white-mute);--color-border: var(--color-black);--color-border-hover: var(--color-black-soft);--color-heading: var(--color-white);--color-text: var(--color-black);--section-gap: 1rem}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400}body{min-height:100vh;color:var(--color-text);background:var(--color-background);transition:color .5s,background-color .5s;line-height:1.6;font-family:Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Hiragino Sans,ヒラギノ角ゴシック,Yu Gothic,游ゴシック,YuGothic,游ゴシック体,Meiryo,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:15px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--header-height: 70px;--footer-height: calc(var(--section-gap) + var(--section-gap) + .875rem * 1.6 * 2);--bottom-sheet-height: 54dvh}body{padding-top:var(--header-height);padding-bottom:var(--footer-height)}@keyframes clockwise-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.page-header{position:fixed;top:0;left:0;width:100%;height:var(--header-height);padding:var(--section-gap) var(--section-gap) var(--section-gap) 0;display:flex;justify-content:space-between;align-items:center;gap:var(--section-gap);z-index:1010;background-color:var(--color-main);color:var(--color-heading)}.page-header__logo{max-width:800px;margin:0;padding-left:var(--section-gap);padding-top:10px;display:flex;align-items:center;font-size:150%;line-height:1}.page-header__logo img{max-width:100%}.page-header__button-wrapper{display:flex;gap:0 var(--section-gap);flex-shrink:0}.button-page-header{padding:0 var(--section-gap);display:flex;align-items:center;gap:0 var(--section-gap);border:2px solid var(--color-white);border-radius:4px;font-size:150%;font-weight:700;color:var(--color-heading);text-decoration:none}.button-page-header:active{color:var(--color-heading)}.page-footer{position:fixed;bottom:0;left:0;width:100%;height:var(--footer-height);padding:var(--section-gap);z-index:1010;background-color:var(--color-main);color:var(--color-heading);font-size:.875rem;overflow-x:auto}.page-footer p{text-wrap:nowrap}.main{padding:var(--section-gap)}a.disabled{pointer-events:none;opacity:.2}a:hover{opacity:.75;transition:opacity .2s ease-out}a:active{color:var(--color-text)}.button{padding:.1rem .75rem;display:flex;align-items:center;justify-content:center;gap:.25rem;border:1px solid var(--color-black-soft);border-radius:1rem;color:var(--color-text);text-decoration:none}.button.selected{background-color:var(--color-main-mute);border:1px solid var(--color-black-mute)}.no-device{margin-top:var(--section-gap);height:200px;display:flex;align-items:center;justify-content:center;color:var(--color-black-soft)}.no-data-to-show{height:250px;display:flex;align-items:center;justify-content:center;color:var(--color-black-soft)}.accordion-content{transition:height .25s ease,opacity .25s ease}.error{position:fixed;top:0;left:0;width:100dvw;height:100dvh;display:flex;align-items:center;justify-content:center;z-index:1011;background-color:#0000001a;font-size:150%}.section__header{padding:.25rem var(--section-gap);display:flex;align-items:center;gap:var(--section-gap);background-color:var(--color-main);color:var(--color-heading);font-weight:700;font-size:150%}.section__header__logo{display:flex;justify-content:center;align-items:center;width:43px}.section__body{margin:var(--section-gap) 0;overflow:auto}.address-table{width:100%;border-collapse:collapse}.address-table th{padding:.1rem var(--section-gap);border:1px solid var(--color-border);border-right-color:var(--color-main);border-bottom-color:var(--color-heading);border-width:0 1px 1px 0;background-color:var(--color-main);color:var(--color-heading);text-align:left}.address-table tr:first-child th{border-top-color:var(--color-border)}.address-table tr:last-child th{border-bottom-color:var(--color-border)}.address-table td{padding:.1rem var(--section-gap);border:1px solid var(--color-border);background-color:var(--color-background)}.section--rain-information .section__body{overflow:hidden}.rain-chart-wrapper{margin-top:var(--section-gap);display:flex;align-items:center;justify-content:space-between;gap:.25rem}.rain-chart-wrapper a{width:1.25rem;display:block}.rain-chart{width:100%;flex-grow:2;max-width:500px}.rain-chart--empty{height:200px;display:flex;align-items:center;justify-content:center;color:var(--color-black-soft)}.water-level-chart-wrapper{margin-top:var(--section-gap);display:flex;align-items:center;gap:.25rem}.water-chart-wrapper a{width:1.25rem;display:block}.water-level-chart{width:100%;flex-grow:2}.water-level-chart__legend{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}.water-level-chart__legend__item{position:relative;padding:0 0 0 2rem;font-size:12px}.water-level-chart__legend__item:before{position:absolute;top:40%;left:0;content:"";display:block;width:1.5rem;height:2px}.water-level-chart__legend__item--flood:before{background:plum}.water-level-chart__legend__item--refuge:before{background:red}.water-level-chart__legend__item--danger:before{background:#f90}.water-level-chart__legend__item--standby:before{background:#0a0}.index-cols{display:flex;gap:var(--section-gap);max-height:calc(100dvh - 70px - var(--section-gap) * 2 - var(--footer-height))}.index-col-1{flex-basis:28%;overflow:auto}.index-col-2{display:flex;flex-direction:column;flex-basis:22%;max-width:22%;min-width:22%;overflow:auto}.index-col-3{flex-basis:50%;overflow:auto}.sugumail-list{font-size:calc(14 / 15 * 100%);overflow-x:auto;text-wrap:nowrap}.sugumail-list th{text-align:left;vertical-align:top}.sugumail-list td{padding-left:var(--section-gap);vertical-align:top}.sugumail-list td a{color:var(--color-text)}.external-link-group-list{list-style:none;overflow-x:auto;text-wrap:nowrap}.external-link-group-list>li+.external-link-group-list>li{margin-top:.5rem}.external-link-group-name{display:flex;gap:.25rem;color:var(--color-text);text-decoration:none}.external-link-group--open{transform:rotate(90deg)}.external-link-list{padding-left:1.5rem;list-style:none;text-wrap:nowrap}.external-link-list a{display:flex;gap:.25rem;color:var(--color-text);text-decoration:none}.external-link-list a:hover{text-decoration:underline}.index-cols .section--point-latest{flex-grow:2;flex-shrink:2}.point-latest--empty{padding:0 var(--section-gap);font-weight:700}.point-latest__button-wrapper{margin:var(--section-gap) 0;display:flex;flex-direction:row-reverse}.point-latest__button{padding:.25rem 1.5rem;display:inline-block;border-radius:1.5rem;background-color:var(--color-main);color:var(--color-heading);font-weight:700;font-size:125%;text-align:right;text-decoration:none}.point-latest__button:active{color:var(--color-heading)}.camera-image{text-align:right}.camera-image>*{width:100%}.camera-image img{width:100%}.river-diagram{text-align:right}.svg-wrap{position:relative;width:100%;height:0;padding-top:75%}.svg-wrap svg{display:block;position:absolute;height:100%;width:100%;top:0;left:0;box-sizing:border-box}.water-level-label{text-align:right}.section--marker-legend{margin-top:auto;padding:0 var(--section-gap);flex-grow:0;flex-shrink:0}.section--marker-legend .section__body{display:flex;flex-wrap:wrap;flex-direction:row-reverse;margin-bottom:.5rem}.marker-legend__item{margin-bottom:.5rem;flex-basis:50%;display:flex;align-items:center;gap:.5rem;font-weight:700}.marker-legend__item img{width:24px}.section--marker-legend .section__footer{font-weight:700}.index-map{width:100%;aspect-ratio:2713 / 2245;max-height:calc(100dvh - 70px - var(--section-gap) * 2 - var(--footer-height))}.index-map .leaflet-container{background-color:var(--color-background)}.index-map .leaflet-marker-icon:hover{opacity:.75;transition:opacity .2s ease-out}.list-cols{display:flex;flex-wrap:wrap;gap:.25rem}.section--list-legend .section__body{display:flex;justify-content:flex-end;align-items:center;gap:var(--section-gap);margin:0 0 calc(var(--section-gap) / 2) 0}.list-legend__external{width:2rem;height:1.5rem;background-color:var(--color-main-mute)}.list-cols .section--point-latest{width:calc(25% - .2rem);padding:calc(var(--section-gap) / 2)}.list-cols .section--point-latest.external{background-color:var(--color-main-mute)}.list-cols .section--point-latest .section__body{margin:0;overflow:hidden}.list-cols .section--point-latest .address-table{line-height:1.2}.point-cols{margin:calc(var(--section-gap) / 2) 0;display:flex;align-items:end;gap:var(--section-gap)}.point-cols>*{flex-basis:50%}.point-cols .camera-image,.point-cols .river-diagram{font-size:80%}.list-cols .water-level-chart-wrapper{margin-top:calc(var(--section-gap) / 2)}.detail-cols{display:flex;gap:var(--section-gap)}.detail-col-1{display:flex;flex-direction:column;gap:.5rem;width:25%;max-height:calc(100dvh - 70px - var(--section-gap) * 2 - var(--footer-height))}.detail-col-2{width:100%;display:grid;grid-template-rows:7rem 1fr 1fr;grid-template-columns:1fr 2rem 1fr;gap:var(--section-gap);max-height:calc(100dvh - 70px - var(--section-gap) * 2 - var(--footer-height));overflow:auto}.detail-grid-1-1{grid-row:1 / 2;grid-column:1 / 2}.detail-grid-2-1{grid-row:2 / 3;grid-column:1 / 2}.detail-grid-2-2{grid-row:2 / 3;grid-column:2 / 3}.detail-grid-2-3{grid-row:2 / 3;grid-column:3 / 4}.detail-grid-3-1{grid-row:3 / 4;grid-column:1 / 2;display:flex}.detail-grid-3-3{grid-row:3 / 4;grid-column:3 / 4;display:flex}.section--calendar{flex-shrink:1}.section--calendar .section__header{padding:0;display:flex;align-items:center;justify-content:space-between;background-color:var(--color-background);font-weight:400;font-size:100%;color:var(--color-text)}.calendar__nav{display:flex;gap:.5rem}.calendar__nav a{line-height:1}.section--calendar .section__body{margin:0;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:1px;list-style:none}.section--calendar .section__body li{padding:.25rem;text-align:center;background-color:#f9f9f9;color:#ccc}.section--calendar .section__body li.heading{background-color:transparent;color:var(--color-text)}.section--calendar .section__body li a{display:block;color:var(--color-text);text-decoration:none}.section--calendar .section__body .today{background-color:var(--color-main-soft)}.section--calendar .section__body .today a{color:var(--color-heading)!important;font-weight:700}.section--calendar .section__footer{margin-top:calc(var(--section-gap) * .5);display:flex;justify-content:flex-end}.detail-nav{display:flex;justify-content:flex-start;gap:.5rem;flex-shrink:1}.detail-nav img{width:1.25rem}.section--image-list,.section--water-level-list{flex-shrink:2;overflow:auto}.section--image-list .section__body,.section--water-level-list .section__body{margin:0}.image-list-hour{margin-bottom:1px}.image-list-hour__summary{padding:.25rem .5rem .25rem 1rem;background-color:var(--color-main-soft);color:var(--color-heading);font-weight:700;text-decoration:none;display:flex;align-items:center;justify-content:space-between}.image-list-hour__summary:active{color:var(--color-heading)}.image-list-hour__summary img{filter:brightness(0) invert(1)}.image-list-hour__summary img.loading{animation:2s linear infinite clockwise-rotate}.image-list-hour__body{display:grid;margin:0;padding:.2rem 0;grid-template-columns:repeat(3,1fr);gap:.2rem;list-style:none}.image-thumb{padding:.2rem .2rem 0}.image-thumb a{text-decoration:none}.image-thumb--selected{background-color:var(--color-main)}.image-thumb__thumb{width:100%;vertical-align:bottom}.image-thumb__min{background-color:var(--color-main-soft);color:var(--color-heading);text-align:center;font-size:80%}.image-thumb--selected .image-thumb__min{font-weight:700;background-color:var(--color-main)}.water-level-list__body{margin:0;padding:0}.water-level-row{display:flex;align-items:center;padding:.25rem .5rem;color:var(--color-text);text-decoration:none;font-weight:700;font-size:calc(14 / 15 * 100%)}.water-level-row:hover,.water-level-row--selected{background-color:var(--color-main-mute)}.water-level-row__badge{display:block;box-sizing:border-box;width:1.2rem;min-width:1.2rem;height:1.2rem;margin:0 .5rem;border-radius:100%;background-color:#00f}.water-level-row__level{margin-left:auto}.water-level-row--under-maintenance,.water-level-row--under-maintenance:active{color:#a1af2f}.water-level-row--under-maintenance .water-level-row__badge{background-color:#a1af2f}.water-level-row--standby,.water-level-row--standby:active{color:#0a0}.water-level-row--standby .water-level-row__badge{background-color:#0a0}.water-level-row--danger,.water-level-row--danger:active{color:#f90}.water-level-row--danger .water-level-row__badge{background-color:#f90}.water-level-row--refuge,.water-level-row--refuge:active{color:red}.water-level-row--refuge .water-level-row__badge{background-color:red}.water-level-row--flood,.water-level-row--flood:active{color:plum}.water-level-row--flood .water-level-row__badge{background-color:plum}.image-modal__backdrop{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1002;background-color:#000000bf;color:#fff!important}.image-modal{display:flex;flex-direction:column;justify-content:flex-start}.image-modal__header{text-align:right;z-index:1003}.image-modal__body{cursor:grab}.image-modal__body--grabbing{cursor:grabbing}.image-modal__body img{object-fit:scale-down;width:100%;max-height:calc(100dvh - var(--header-height) - var(--footer-height) - 4rem)}.image-modal__footer{display:flex;align-items:center;justify-content:flex-start;gap:1rem;z-index:1003}.image-modal__close img,.image-modal__previous img,.image-modal__next img,.image-modal__reset img{vertical-align:top;filter:brightness(0) invert(1)}.image-modal__close,.image-modal__previous,.image-modal__next,.image-modal__reset{padding:.5rem 0;text-align:center}.image-modal__slider{width:200px!important;margin-left:2rem;--slider-connect-bg: var(--color-main-soft);--slider-tooltip-bg: var(--color-main-soft);--slider-handle-ring-color: var(--color-main-soft)}.image-modal__time{margin-left:auto;mix-blend-mode:difference}.usual-image{position:relative;padding:2.5rem;background-color:var(--color-main-mute);overflow:visible}.usual-image:before{--padding: 2.5rem;position:absolute;left:-3rem;top:var(--padding);content:"";height:calc(100% - var(--padding) * 2);width:2rem;background-color:var(--color-main);clip-path:polygon(0 50%,100% 0,100% 100%)}.section--current-water-level{width:100%;display:flex;flex-direction:column}.section--current-water-level .section__header{flex-grow:0}.section--current-water-level .section__body{display:flex;justify-content:center;align-items:center;flex-grow:2}.section--current-water-level .river-diagram{width:450px}.section--day-water-levels{width:100%;display:flex;flex-direction:column}.section--day-water-levels .section__header{flex-grow:0}.section--day-water-levels .section__body{display:flex;justify-content:center;align-items:center;flex-grow:2}.section--day-water-levels .water-level-chart{max-width:500px}@media(max-width:1000px){:root{--header-height: 45px}body{font-size:15px}.page-header .page-header__logo{padding-top:4px;padding-left:calc(var(--section-gap) / 2);max-width:100%}.page-header .page-header__logo img{max-width:100%}.page-header__button-wrapper{display:none}.main{padding:var(--section-gap) 0}.section__header{font-size:125%;gap:6px}.section__header__logo{display:flex;justify-content:center;align-items:center;width:22px}.section__header__logo img{width:22px}.page-footer{font-size:.67rem}}.mobile-col{position:relative}.mobile-button__wrapper{margin:calc(var(--section-gap) / 2)}.mobile-button{width:100%;display:flex;flex-wrap:nowrap;align-items:center;gap:1rem;padding-right:1rem;background-color:var(--color-main-soft);color:var(--color-heading);text-decoration:none;font-size:125%;font-weight:700}.mobile-button__logo{display:flex;align-items:center;background-color:var(--color-main);padding:.5rem .6rem}.mobile-button__logo img{width:24px;height:24px}.geolocation-use-dialog__backdrop{position:fixed;top:0;left:0;width:100dvw;height:100dvh;display:flex;align-items:center;justify-content:center;z-index:1011;background-color:#0000001a}.geolocation-use-dialog{max-width:85dvw;padding:var(--section-gap);background-color:var(--color-white);border-radius:.5rem;box-shadow:0 .25rem 1rem #00000040}.geolocation-use-dialog__body{padding-bottom:var(--section-gap);font-size:125%}.geolocation-use-dialog__footer{display:flex;justify-content:flex-end;align-items:center;gap:var(--section-gap)}.geolocation-use-dialog .mobile-button{flex-basis:45%;display:flex;justify-content:center;align-items:center;padding:.25rem .5rem}.back-to-top-button{position:fixed;right:calc(var(--section-gap) / 2);bottom:calc(var(--footer-height) + var(--section-gap) / 2);width:auto;background-color:var(--color-main-soft);color:var(--color-heading);gap:0;opacity:.95;z-index:1003}.back-to-top-button .mobile-button__logo{background-color:var(--color-main-soft)}.back-to-top-button img{filter:brightness(0) invert(1)}.pc-view-button__wrapper{display:flex;justify-content:flex-end;margin-bottom:var(--section-gap);padding:0 calc(var(--section-gap) / 2)}.pc-view-button__wrapper .mobile-button{width:auto;font-size:93%;gap:.5rem;padding-right:.6rem}.pc-view-button__wrapper .mobile-button img{width:20px;height:20px}.mobile-col .rain-chart-wrapper{padding:0 var(--section-gap)}.mobile-map{margin-top:var(--section-gap);aspect-ratio:4 / 3;background-color:#ddd}.mobile-map__attribution{padding:calc(var(--section-gap) / 4) calc(var(--section-gap) / 2) 0 0;text-align:right}.mobile-map__attribution a{color:var(--color-text)}.show-image-button img{filter:brightness(0) invert(1)}.bottom-sheet{position:fixed;left:0;bottom:var(--footer-height);width:100%;z-index:1003}.bottom-sheet__handle{width:100%;height:1.8rem;position:relative;display:block;background-color:var(--color-white-mute);border-radius:2rem 2rem 0 0}.bottom-sheet__handle:hover{opacity:1}.bottom-sheet__handle__bar{--height: 3px;--width: 20%;position:absolute;top:calc(50% - var(--height) / 2);left:calc((100% - var(--width)) / 2);width:var(--width);height:var(--height);background-color:var(--color-black-soft);border-radius:1px}.bottom-sheet__body{height:calc(var(--bottom-sheet-height) - 1.8rem);max-height:calc(var(--bottom-sheet-height) - 1.8rem);display:block;background-color:var(--color-white-soft);overflow:auto}.bottom-sheet--image{height:calc(100vw + 1.8rem);max-height:calc(100vw + 1.8rem)}.bottom-sheet--image .camera-image__datetime{padding-right:calc(var(--section-gap) / 2)}.bottom-sheet--water-level{height:var(--bottom-sheet-height);max-height:var(--bottom-sheet-height)}.bottom-sheet--water-level .river-diagram,.bottom-sheet--water-level .water-level-chart-wrapper{padding:0 var(--section-gap)}