.coupon-dialog{width:max-content;max-width:calc(100vw - 32px);max-height:none;padding:0;margin:auto;border:0;border-radius:0;background:transparent;color:#fff;box-shadow:none;overflow:visible;overscroll-behavior:contain}
.coupon-dialog::backdrop{background:rgba(0,0,0,.78);animation:coupon-backdrop-in .3s ease both}
.coupon-image{display:block;width:auto;height:auto;max-width:min(378px,calc(100vw - 36px));max-height:calc(100vh - 108px);max-height:calc(100dvh - 108px);object-fit:contain;box-shadow:0 18px 64px rgba(0,0,0,.32)}
.coupon-close{position:absolute;right:0;top:-50px;display:grid;place-items:center;width:44px;min-width:0;height:44px;padding:0;border:0;border-radius:50%;background:#fff;color:#004b40;font:34px/1 Arial,sans-serif;cursor:pointer;box-shadow:0 3px 15px #0005}
.coupon-dialog.is-loading .coupon-image{visibility:hidden}
.coupon-dialog.is-loading::after{content:'読み込み中…';position:absolute;inset:45% 0 auto;text-align:center;font:16px/1.5 sans-serif;color:#fff}
.coupon-close:hover{background:#fff7be}
.coupon-close:focus-visible{outline:3px solid #ffdc00;outline-offset:3px}
.coupon-error{max-width:300px;padding:24px;background:#fff;color:#222;font-size:16px;line-height:1.8}
.coupon-dialog [hidden]{display:none!important}
.coupon-dialog[open],.motion-active .coupon-dialog[open]{animation:coupon-in .38s cubic-bezier(.16,.84,.2,1.02) both}
.coupon-dialog[open].is-closing,.motion-active .coupon-dialog[open].is-closing{animation:coupon-out .18s ease-in both}
.coupon-dialog.is-closing::backdrop{animation:coupon-backdrop-out .18s ease-in both}
@keyframes coupon-in{from{opacity:0;transform:translateY(18px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes coupon-out{from{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(8px) scale(.97)}}
@keyframes coupon-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes coupon-backdrop-out{from{opacity:1}to{opacity:0}}
.motion-disabled .coupon-dialog[open],.motion-disabled .coupon-dialog::backdrop{animation:none}
@media(prefers-reduced-motion:reduce){.coupon-dialog[open],.motion-active .coupon-dialog[open],.coupon-dialog[open].is-closing,.motion-active .coupon-dialog[open].is-closing,.coupon-dialog::backdrop{animation:none}}
