/* 第5段：案内役「いえまる」 */

/* 記事の結論・追記枠：本文と重ならない右下に小さく添える。 */
.post-body blockquote.is-conclusion,
.post-body blockquote.is-notice { position: relative; }
.post-body blockquote.is-conclusion { padding-right: 6.8em; }
.post-body blockquote.is-notice { padding-right: 6.6em; }
.post-body blockquote.is-conclusion > img.iemaru-mark,
.post-body blockquote.is-notice > img.iemaru-mark {
  position: absolute;
  right: 14px;
  bottom: 10px;
  display: block;
  width: clamp(64px, 7vw, 80px);
  height: auto;
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  pointer-events: none;
}

/* 案内：既存の会話吹き出しに合わせた、いえまる＋一言。 */
.iemaru-guide,
.hk-doc .iemaru-guide {
  display: flex;
  align-items: center;
  gap: 14px;
  width: fit-content;
  max-width: 100%;
  margin: 1.35em 0;
}
.iemaru-guide .iemaru-guide-img,
.hk-doc .iemaru-guide .iemaru-guide-img {
  display: block;
  flex: 0 0 auto;
  width: clamp(88px, 8vw, 104px);
  height: auto;
  margin: 0;
  object-fit: contain;
}
.iemaru-guide .iemaru-guide-text,
.hk-doc .iemaru-guide .iemaru-guide-text,
#hk-cta .iemaru-guide .iemaru-guide-text {
  position: relative;
  max-width: min(34em, calc(100vw - 154px));
  margin: 0;
  padding: .7em 1em;
  color: var(--text, #2a2c30);
  background: #fff;
  border: 1px solid #cbd6e5;
  border-radius: 12px;
  font-size: .94em;
  line-height: 1.65;
}
.iemaru-guide .iemaru-guide-text::before,
.iemaru-guide .iemaru-guide-text::after {
  position: absolute;
  top: 50%;
  width: 10px;
  height: 10px;
  content: "";
  transform: translateY(-50%) rotate(-45deg);
}
.iemaru-guide .iemaru-guide-text::before {
  left: -6px;
  background: #fff;
  border-top: 1px solid #cbd6e5;
  border-left: 1px solid #cbd6e5;
}
.iemaru-guide .iemaru-guide-text::after {
  left: -4px;
  background: #fff;
}

/* 404 は案内を少し大きく、中央へ。 */
.notfound .iemaru-guide {
  justify-content: center;
  width: 100%;
  margin: 0 auto 1.7em;
}
.notfound .iemaru-guide .iemaru-guide-img { width: clamp(120px, 14vw, 140px); }
.notfound .iemaru-guide .iemaru-guide-text { max-width: 26em; }

/* 会話内の大家さん：透過画像の下に淡い水色の丸を敷く。 */
.lnvoice .img img[src*="owner_avatar"] {
  box-sizing: border-box;
  background: #eaf4fb;
  border: 1px solid #c9dceb;
  object-fit: contain;
}

@media (prefers-reduced-motion: no-preference) {
  html.hk-anim .iemaru-guide .iemaru-guide-img { animation: iemaru-guide-bounce .55s .12s cubic-bezier(.2, .75, .35, 1.2) both; }
}
@keyframes iemaru-guide-bounce {
  0%, 100% { transform: translateY(0) scale(1); }
  38% { transform: translateY(-5px) scale(1.035); }
  66% { transform: translateY(1px) scale(.99); }
}

@media (max-width: 800px) {
  .post-body blockquote.is-conclusion { padding-right: 5em; }
  .post-body blockquote.is-notice { padding-right: 4.9em; }
  .post-body blockquote.is-conclusion > img.iemaru-mark,
  .post-body blockquote.is-notice > img.iemaru-mark {
    right: 10px;
    bottom: 9px;
    width: 52px;
  }
  .iemaru-guide,
  .hk-doc .iemaru-guide { gap: 10px; }
  .iemaru-guide .iemaru-guide-img,
  .hk-doc .iemaru-guide .iemaru-guide-img { width: 72px; }
  .iemaru-guide .iemaru-guide-text,
  .hk-doc .iemaru-guide .iemaru-guide-text,
  #hk-cta .iemaru-guide .iemaru-guide-text {
    max-width: calc(100vw - 120px);
    padding: .65em .8em;
  }
}

@media (max-width: 440px) {
  .notfound .iemaru-guide { align-items: flex-start; }
}

@media print {
  .post-body blockquote.is-conclusion > img.iemaru-mark,
  .post-body blockquote.is-notice > img.iemaru-mark,
  .iemaru-guide { display: none; }
}