/* 支給画像は加工・再圧縮せず、そのまま表示します。 */
:root { color-scheme: light; font-family: system-ui, sans-serif; }
* { box-sizing: border-box; }
html { margin: 0; background: #f0f7f3; }
body { margin: 0; }
.lp { width: 100%; max-width: 768px; margin: 0 auto; background: #fff; }
.panel { position: relative; margin: 0; padding: 0; }
.panel-image { display: block; width: 100%; height: auto; margin: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
/* topは各ボタンの縦方向の中心。小さい画面でも中心を保ち、44pxのタップ領域を確保。 */
.hotspot { position: absolute; z-index: 1; display: block; min-height: 44px; transform: translateY(-50%); background: transparent; -webkit-tap-highlight-color: rgb(0 90 45 / 12%); }
.hotspot:focus-visible { outline: 3px solid #1247ce; outline-offset: 3px; box-shadow: 0 0 0 6px white; }
.line-first { left: 7.439%; top: 83.254%; width: 84.697%; height: 5.383%; border-radius: 999px; }
.line-first-text { left: 19.129%; top: 93.182%; width: 54.198%; height: 10.766%; border-radius: 10px; }
.phone { left: 6.771%; top: 15.421%; width: 34.245%; height: 2.446%; border-radius: 4px; }
.line-last-text { left: 18.099%; top: 74.864%; width: 53.906%; height: 9.918%; border-radius: 10px; }
.line-last { left: 6.25%; top: 84.681%; width: 88.542%; height: 4.959%; border-radius: 999px; }
.map { left: 7.031%; top: 92.935%; width: 38.802%; height: 8.832%; border-radius: 20%; }
.website { left: 54.167%; top: 92.935%; width: 38.802%; height: 8.832%; border-radius: 20%; }
.line-dialog { position: fixed; width: min(390px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 34px 24px 28px; overflow: auto; border: 0; border-radius: 20px; background: white; color: #173b28; text-align: center; box-shadow: 0 16px 70px rgb(0 0 0 / 20%); }
.line-dialog::backdrop { background: rgb(17 42 29 / 65%); }
.line-dialog h2 { margin: 4px 0 12px; font-size: 23px; }
.line-dialog p { margin: 0 0 16px; line-height: 1.8; font-size: 15px; }
.dialog-close { position: absolute; top: 2px; right: 4px; width: 44px; height: 44px; border: 0; background: transparent; color: #395849; font: 30px/1 system-ui, sans-serif; cursor: pointer; }
.line-qr { display: block; width: 200px; height: 200px; max-width: 100%; margin: 0 auto 16px; object-fit: contain; }
.official-line-button { display: flex; align-items: center; justify-content: center; width: max-content; min-height: 44px; margin: 0 auto 8px; }
.official-line-button img { display: block; width: auto; height: 36px; border: 0; }
.line-open { display: inline-flex; align-items: center; min-height: 44px; color: #076434; text-underline-offset: 4px; font-size: 15px; }
.line-dialog a:focus-visible, .dialog-close:focus-visible { outline: 3px solid #1247ce; outline-offset: 3px; }