.garan-label { margin: .5rem 0; }
.garan-label__open { display: inline-block; line-height: 0; }
.garan-label__open img { display: block; height: auto; max-width: 100%; }
.garan-label--detail .garan-label__open img { width: 156px; }
.garan-label__dialog {
  position: fixed;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  margin: 0;
  box-sizing: border-box;
  width: min(430px, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
  max-height: calc(100vh - 24px);
  overflow: auto;
  border: 0;
  border-radius: 12px;
  padding: 28px 18px 18px;
  background: #fff;
  box-shadow: 0 18px 60px rgba(0,0,0,.3);
}
.garan-label__dialog::backdrop { background: rgba(0,0,0,.7); }
.garan-label__dialog img {
  display: block;
  width: 100%;
  max-width: 350px;
  max-height: calc(100vh - 72px);
  height: auto;
  object-fit: contain;
  margin: 0 auto;
}
@supports (height: 100dvh) {
  .garan-label__dialog { max-height: calc(100dvh - 24px); }
  .garan-label__dialog img { max-height: calc(100dvh - 72px); }
}
.garan-label__close { position: absolute; top: 0; right: 5px; border: 0; background: transparent; font-size: 27px; line-height: 1; cursor: pointer; }