/* 북촌무궁화 V1.31 - 음식 등장 완료 후 흰색 PNG 김만 별도 재생.
   음식 원본 img / 위치 / 크기 / rzo-reveal 애니메이션은 건드리지 않음. */
.intro .intro_food2 .rzo-steam-texture {position:absolute; left:32%; top:14%; width:60%; height:55%; z-index:1; overflow:visible; opacity:0; visibility:hidden; pointer-events:none; user-select:none; transition:opacity 1.1s ease;}
.intro .intro_food2 .rzo-steam-texture.is-ready {visibility:visible;}
.intro .intro_food2 .rzo-steam-texture.is-running {opacity:1;}
    .intro .intro_food2 .rzo-steam-texture > span {position:absolute; bottom:0; display:block; width:76%; height:100%; background:url('../images/intro_steam_texture_01.png') no-repeat center bottom / 100% 100%; opacity:0; transform-origin:50% 90%; pointer-events:none; animation:rzo-texture-steam-rise 8.6s linear infinite; animation-play-state:paused;}
    .intro .intro_food2 .rzo-steam-texture > span:nth-child(1) {left:-7%; --steam-drift:-8%; animation-delay:-1.5s;}
    .intro .intro_food2 .rzo-steam-texture > span:nth-child(2) {left:22%; width:70%; height:94%; --steam-drift:10%; background-image:url('../images/intro_steam_texture_02.png'); animation-duration:10.2s; animation-delay:-5.1s;}
    .intro .intro_food2 .rzo-steam-texture > span:nth-child(3) {left:8%; width:82%; height:105%; --steam-drift:3%; background-image:url('../images/intro_steam_texture_02.png'); animation-duration:9.4s; animation-delay:-7.4s;}
    .intro .intro_food2 .rzo-steam-texture.is-running > span {animation-play-state:running;}
@keyframes rzo-texture-steam-rise {
    0% {opacity:0; transform:translate3d(0,16%,0) scale(.82,.82) rotate(-2deg);}
    18% {opacity:.70; transform:translate3d(calc(var(--steam-drift) * -.2),5%,0) scale(.9,.9) rotate(-1deg);}
    42% {opacity:.86; transform:translate3d(calc(var(--steam-drift) * .4),-9%,0) scale(1,1) rotate(.6deg);}
    70% {opacity:.42; transform:translate3d(var(--steam-drift),-28%,0) scale(1.13,1.09) rotate(2deg);}
    100% {opacity:0; transform:translate3d(calc(var(--steam-drift) * .65),-48%,0) scale(1.25,1.18) rotate(2.8deg);}
}
@media (max-width:750px) {
    .intro .intro_food2 .rzo-steam-texture {left:29%; top:11%; width:65%; height:58%;}
}
@media (prefers-reduced-motion:reduce) {
    .intro .intro_food2 .rzo-steam-texture {display:none;}
    .intro .intro_food2 .rzo-steam-texture > span {animation:none;}
}