/* いえまる 線画版（部品ごとに表情と動きを切り替える）。原本は 成果物/素材/いえまる/SVG版/（2026-10-24 Ken「B 部品に分けて描き直す」） */
:where(.im-mouth-open,.im-mouth-o,.im-mouth-frown,.im-eye-closed,.im-brows-caution,.im-sweat,.im-hand-point,.im-arm-think,.im-arm-bow-l,.im-arm-bow-r,.im-sparkle){visibility:hidden}
    .im-eye-l,.im-eye-r{transform-box:view-box;transform-origin:210px 227px}
    .im-eye-r{transform-origin:302px 227px}
    .im-arm-l{transform-box:view-box;transform-origin:143px 279px}
    .im-arm-r{transform-box:view-box;transform-origin:369px 279px}
.iemaru { overflow: visible; }
.iemaru .im-eye-l, .iemaru .im-eye-r,
.iemaru .im-brows, .iemaru .im-arm-l, .iemaru .im-arm-r,
.iemaru .im-body { transition: transform .25s ease; }
.iemaru :is(.im-mouth-open,.im-mouth-o,.im-mouth-frown,.im-eye-closed,.im-brows-caution,.im-sweat,.im-hand-point,.im-arm-think,.im-arm-bow-l,.im-arm-bow-r,.im-sparkle) { visibility: hidden; }
.iemaru :is(.im-eye-l,.im-eye-r) { transform-box: view-box; transform-origin: 210px 227px; }
.iemaru .im-eye-r { transform-origin: 302px 227px; }
.iemaru .im-arm-l { transform-box: view-box; transform-origin: 143px 279px; }
.iemaru .im-arm-r { transform-box: view-box; transform-origin: 369px 279px; }
.iemaru .im-eye-closed { transform-box: view-box; transform-origin: 256px 227px; }
.iemaru:is(.is-nod,.is-bow) :is(.im-eye-l,.im-eye-r) { visibility: hidden; }
.iemaru:is(.is-nod,.is-bow) .im-eye-closed { visibility: visible; }
.iemaru:is(.is-happy,.is-surprise,.is-think,.is-caution) .im-mouth-smile { visibility: hidden; }
.iemaru.is-happy :is(.im-mouth-open,.im-sparkle) { visibility: visible; }
.iemaru.is-surprise .im-mouth-o { visibility: visible; }
.iemaru:is(.is-think,.is-caution) .im-mouth-frown { visibility: visible; }
.iemaru.is-caution .im-brows { visibility: hidden; }
.iemaru.is-caution :is(.im-brows-caution,.im-sweat) { visibility: visible; }
.iemaru.is-surprise .im-brows { transform: translateY(-5px); }
.iemaru.is-think .im-brows { transform: translateY(2px); }
.iemaru.is-point .im-hand-open { visibility: hidden; }
.iemaru.is-point .im-hand-point { visibility: visible; }
.iemaru.is-happy .im-arm-l { transform: rotate(99deg); }
.iemaru.is-happy .im-arm-r { transform: rotate(-99deg); }
.iemaru.is-think .im-arm-r { visibility: hidden; }
.iemaru.is-think .im-arm-think { visibility: visible; }
.iemaru.is-bow { transform-origin: 50% 92%; transform: rotate(8deg); } /* 足元を軸に。px 指定は表示の大きさが変わるとずれるため % に */
.iemaru.is-bow :is(.im-arm-l,.im-arm-r) { visibility: hidden; }
.iemaru.is-bow :is(.im-arm-bow-l,.im-arm-bow-r) { visibility: visible; }
.iemaru.do-blink :is(.im-eye-l,.im-eye-r,.im-eye-closed) { animation: iemaru-blink .18s ease-in-out 1; }
.iemaru.do-wave .im-hand-open { visibility: hidden; }
.iemaru.do-wave .im-hand-point { visibility: visible; }
.iemaru:is(.is-think,.is-bow).do-wave .im-arm-r { visibility: visible; }
.iemaru.is-think.do-wave .im-arm-think,
.iemaru.is-bow.do-wave .im-arm-bow-r { visibility: hidden; }
.iemaru.do-wave .im-arm-r { animation: iemaru-wave .8s ease-in-out 2; }
.iemaru.do-nod { transform-origin: 50% 55%; animation: iemaru-nod .45s ease-in-out 2; }
.iemaru.is-bow.do-nod { animation-name: iemaru-bow-nod; }
.iemaru.do-hop { animation: iemaru-hop .55s ease-in-out 2; }
.iemaru.is-bow.do-hop { animation-name: iemaru-bow-hop; }
.iemaru.do-react { animation: iemaru-react-hop .9s ease-in-out 1; }
.iemaru.is-bow.do-react { animation-name: iemaru-bow-react-hop; }
.iemaru.do-react :is(.im-eye-l,.im-eye-r) { animation: iemaru-react-show .9s steps(1,end) 1; }
.iemaru.do-react .im-eye-closed { animation: iemaru-react-hide .9s steps(1,end) 1; }
.iemaru.do-react :is(.im-mouth-smile,.im-mouth-o,.im-mouth-frown,.im-brows-caution,.im-sweat,.im-arm-think,.im-arm-bow-l,.im-arm-bow-r) { animation: iemaru-react-hide .9s steps(1,end) 1; }
.iemaru.do-react :is(.im-mouth-open,.im-sparkle,.im-brows) { animation: iemaru-react-show .9s steps(1,end) 1; }
.iemaru.do-react :is(.im-arm-l,.im-arm-r) { animation: iemaru-react-arm .9s ease-in-out 1; }
.iemaru:is(.is-think,.is-bow).do-react .im-arm-r,
.iemaru.is-bow.do-react .im-arm-l { animation: iemaru-react-arm-show-l .9s ease-in-out 1; }
@keyframes iemaru-blink { 0%,100% { transform: scaleY(1); } 50% { transform: scaleY(.08); } }
@keyframes iemaru-wave { 0%,100% { transform: rotate(0); } 25% { transform: rotate(-9deg); } 75% { transform: rotate(7deg); } }
@keyframes iemaru-nod { 0%,100% { transform: rotate(0); } 50% { transform: rotate(3deg); } }
@keyframes iemaru-bow-nod { 0%,100% { transform: rotate(10deg); } 50% { transform: rotate(13deg); } }
@keyframes iemaru-hop { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes iemaru-bow-hop { 0%,100% { transform: rotate(10deg) translateY(0); } 50% { transform: rotate(10deg) translateY(-14px); } }
@keyframes iemaru-react-hop { 0%,100% { transform: translateY(0); } 35% { transform: translateY(-12px); } }
@keyframes iemaru-bow-react-hop { 0%,100% { transform: rotate(10deg) translateY(0); } 35% { transform: rotate(10deg) translateY(-12px); } }
@keyframes iemaru-react-show { 0%,15%,100% { visibility: visible; opacity: 0; } 17%,83% { visibility: visible; opacity: 1; } }
@keyframes iemaru-react-hide { 0%,15%,100% { opacity: 1; } 17%,83% { opacity: 0; } }
@keyframes iemaru-react-arm { 0%,15%,100% { transform: rotate(0); } 17%,83% { transform: rotate(99deg); } }
@keyframes iemaru-react-arm-show { 0%,15%,100% { visibility: visible; opacity: 0; transform: rotate(0); } 17%,83% { visibility: visible; opacity: 1; transform: rotate(-99deg); } }
@keyframes iemaru-react-arm-show-l { 0%,15%,100% { visibility: visible; opacity: 0; transform: rotate(0); } 17%,83% { visibility: visible; opacity: 1; transform: rotate(99deg); } }
.iemaru.do-react .im-arm-r { animation-name: iemaru-react-arm-r; }
.iemaru.is-happy.do-react :is(.im-mouth-open,.im-sparkle,.im-arm-l,.im-arm-r) { animation: none; }
@keyframes iemaru-react-arm-r { 0%,15%,100% { transform: rotate(0); } 17%,83% { transform: rotate(-99deg); } }
@media (prefers-reduced-motion: reduce) {
  .iemaru, .iemaru * { animation: none !important; transition: none !important; }
}

/* ---- サイトでの大きさ（元の PNG の指定と同じ。PNG 用の弾む動き（design-5）がかからないよう別のクラスにしている） ---- */
.iemaru-who > svg.iemaru-svg { display: block; flex: 0 0 auto; height: auto; margin: 0; }
.iemaru-guide .iemaru-svg-guide { width: clamp(88px, 8vw, 104px); }
.hk-doc .iemaru-guide.iemaru-hint .iemaru-svg-guide { width: clamp(56px, 6vw, 64px); }
.notfound .iemaru-guide .iemaru-svg-guide { width: clamp(120px, 14vw, 140px); }
.iemaru-greet .iemaru-svg-greet { width: clamp(68px, 7vw, 84px); }
.hk-doc .pf-sec .pf-say .iemaru-svg-pf { width: clamp(70px, 9vw, 88px); }
@media (max-width: 800px) { .hk-doc .iemaru-guide .iemaru-svg-guide { width: 72px; } }
@media (max-width: 600px) {
  .iemaru-greet .iemaru-svg-greet { width: 60px; }
  .hk-doc .iemaru-guide.iemaru-hint .iemaru-svg-guide { width: 56px; }
  .hk-doc .pf-sec .pf-say .iemaru-svg-pf { width: 62px; }
}
.iemaru-who { cursor: pointer; -webkit-tap-highlight-color: transparent; }