<style type="text/css">.editor-wrap img { width: 100% !important; height: auto !important; }</style><div class="art-content-표지"><img src="https://image.a-rt.com/art/editor/202507/1751607576963.png" style="width: 1920px; height: 750px;" /> <img src="https://image.a-rt.com/art/editor/202506/1751332822367.jpg" style="width: 1920px; height: 290px;" /><style type="text/css">.art-container-event { width: 1920px; margin: 0 auto; text-align: center; } .art-content-inner { position: relative; width: 100%; margin: 0 auto; } .art-content-inner img { display: block; width: 100%; } @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } .cnt-marquee { border-top: 1px solid #000; border-left: 1px solid #000; border-right: 1px solid #000; } .cnt-marquee .marquee { display: block; overflow-x: hidden; width: 100%; } .cnt-marquee .marquee .img-box { display: flex; align-items: center; animation: marquee 20s linear infinite; width: 5760px; } .cnt-marquee .marquee .img-box > div { border-left: 1px solid #000; } @keyframes fade-in { 0% { opacity: 0; transform: translateY(10%); } 100% { opacity: 1; transform: translateY(0); } } @keyframes fade-out { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(10%); } } .cnt-ani .ani { margin-top: -2px; opacity: 0; animation: fade-out 0.6s ease-in-out forwards; } .cnt-ani .ani.active { animation: fade-in 0.6s ease-in-out forwards; }</style><div class="art-content-inner"><div class="art-content-inner cnt-ani"><img alt="1" class="ani" src="https://image.a-rt.com//art/display/webzine/202506/1751273300623.png" /> <img alt="2" class="ani" src="https://image.a-rt.com//art/display/webzine/202507/1751333103293.jpg" /> <img alt="3" class="ani" src="https://image.a-rt.com//art/display/webzine/202507/1751332278271.jpg" /> <img alt="4" class="ani" src="https://image.a-rt.com//art/display/webzine/202507/1751332278309.jpg" /> <!-- e : art-container-event --><!-- 스크롤 이벤트 스크립트 --><script> $(function () { $(window).on('scroll', function () { const scrollY = $(this).scrollTop() + $(this).height() * 0.7; $('.ani').each(function () { if (scrollY > $(this).offset().top) $(this).addClass('active'); else $(this).removeClass('active'); }); }); }); </script></div></div><a href="https://grandstage.a-rt.com/product/brand/page/main?brandNo=000566&page=1"><img src="https://image.a-rt.com//art/display/webzine/202507/1751332381142.jpg" style="width: 1920px; height: 80px;" /></a> <img src="https://image.a-rt.com//art/display/webzine/202507/1751332381154.jpg" style="width: 1920px; height: 140px;" /></div>