<!-- S : 이벤트 복사영역 여기서부터 --><style type="text/css">@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css'); body { min-width: 1440px; margin: 0; padding: 0; } .art-container-event { background: #000; color: #fff; font-family: Pretendard, sans-serif !important; position: relative; width: 100%; max-width: 1920px; margin: 0 auto; text-align: center; overflow: hidden; } .art-content-inner img { display: block; width: 100%; } .art-content-inner p, .art-content-inner ul { margin: 0; padding: 0; } .art-content-inner li { list-style: none; } .mv { position: relative; width: 100%; overflow: hidden; } .content01 { padding: 108px 0; background-color: #1D1D1D; } .content01 .category_wrap { display: flex; justify-content: center; align-items: center; gap: 96px; } .content01 .category_wrap .category_ttl { font-size: 40px; font-weight: 600; line-height: 1; } .content01 .category_wrap .category_txt { font-size: 20px; font-weight: 500; line-height: 1.65; letter-spacing: -0.6px; } .content02 { position: relative; padding: 134px 0 132px; } .content02_img01 { max-width: 136px; margin: 0 auto; } .content02_ttl { margin-top: 64px !important; font-size: 42px; font-weight: 700; line-height: 1.29; } .content02_txt { margin-top: 36px !important; font-size: 20px; font-weight: 300; line-height: 1.58; letter-spacing: -0.6px; } .content02_videoWrap { margin-top: 46px !important; } .content02_videoWrap video { max-width: 500px; } .content03 { position: relative; padding: 169px 0 101px; background-image: url(https://image.a-rt.com/art/editor/202509/1757400686405.png); background-repeat: no-repeat; background-size: cover; } .content03_sub_ttl { font-size: 25px; font-weight: 400; line-height: 1; } .content03_main_ttl { width: 837px; margin: 11px auto 0 !important; font-size: 42px; font-weight: 700; line-height: 1.43; background-image: url(https://image.a-rt.com/art/editor/202509/1757400724255.png); background-repeat: no-repeat; background-size: 586px; background-position-x: 165px; background-position-y: 36.52px; } .content03_img_wrap { display: flex; justify-content: center; gap: 13px; margin-top: 66px !important; } .content03_img01 { max-width: 478px; } .content03_img02 { max-width: 346.25px; margin-top: 76px !important; } .content03_txt { width: 682px; margin-top: 72px !important; font-size: 20px; font-weight: 300; line-height: 1.58; letter-spacing: -0.6px; left: 50%; transform: translateX(-50%); } .content04 { padding: 153px 0 95px; background-image: url(https://image.a-rt.com/art/editor/202509/1757400734843.png); background-repeat: no-repeat; background-size: cover; } .content04_img_wrap { display: flex; justify-content: center; } .content04_img01 { max-width: 430px; margin-right: 11px; box-shadow: 5px 4px 30px 0 rgba(0, 0, 0, 0.25); } .content04_img02 { max-width: 427.85px; margin-right: 11.15px; box-shadow: 4px 4px 25px 0 rgba(0, 0, 0, 0.25); } .content04_img03 { max-width: 246px; } .content04_txt { width: 682px; margin-top: 65px !important; font-size: 20px; font-weight: 300; line-height: 1.58; letter-spacing: -0.6px; left: 50%; transform: translateX(-50%); } .content05 { position: relative; padding: 169px 0 105px; background-image: url(https://image.a-rt.com/art/editor/202509/1757400781943.png); background-repeat: no-repeat; background-size: cover; } .content05_sub_ttl { font-size: 25px; font-weight: 400; line-height: 1; } .content05_main_ttl { width: 837px; margin: 11px auto 0 !important; font-size: 42px; font-weight: 700; letter-spacing: -0.82px; line-height: 1.43; background-image: url(https://image.a-rt.com/art/editor/202509/1757400817268.png); background-repeat: no-repeat; background-size: 540px; background-position-x: 185px; background-position-y: 34.52px; } .content05_img_wrap { display: flex; gap: 13px; justify-content: center; margin-top: 66px !important; } .content05_img01 { max-width: 346px; margin-top: 76px !important; } .content05_img02 { max-width: 478px; } .content05_txt { width: 682px; margin-top: 68px !important; font-size: 20px; font-weight: 300; line-height: 1.58; letter-spacing: -0.6px; left: 50%; transform: translateX(-50%); } .content06 { padding: 157px 0 98px; background-image: url(https://image.a-rt.com/art/editor/202509/1757400827739.png); background-repeat: no-repeat; background-size: cover; } .content06_img_wrap { display: flex; gap: 11px; justify-content: center; } .content06_img01 { max-width: 430px; } .content06_img02 { max-width: 430px; box-shadow: 4px 4px 25px 0 rgba(0, 0, 0, 0.25); } .content06_txt { width: 682px; margin-top: 64px !important; font-size: 20px; font-weight: 300; line-height: 1.58; letter-spacing: -0.6px; left: 50%; transform: translateX(-50%); } .content07 { position: relative; padding: 169px 0 108px; background-image: url(https://image.a-rt.com/art/editor/202509/1757400862546.png); background-repeat: no-repeat; background-size: cover; } .content07_sub_ttl { font-size: 25px; font-weight: 400; line-height: 1; } .content07_main_ttl { width: 837px; margin: 11px auto 0 !important; font-size: 42px; font-weight: 700; line-height: 1.43; background-image: url(https://image.a-rt.com/art/editor/202509/1757400899791.png); background-repeat: no-repeat; background-size: 540px; background-position-x: 185px; background-position-y: 34.44px; } .content07_img_wrap { display: flex; justify-content: center; gap: 13px; margin-top: 66px; } .content07_img01 { max-width: 478px; } .content07_img02 { max-width: 346px; margin-top: 76px !important; } .content07_txt { width: 682px; margin-top: 65px !important; font-size: 20px; font-weight: 300; line-height: 1.58; letter-spacing: -0.6px; left: 50%; transform: translateX(-50%); } .content08 { padding: 157px 0 96px; background-image: url(https://image.a-rt.com/art/editor/202509/1757400912380.png); background-repeat: no-repeat; background-size: cover; } .content08_img_wrap { display: flex; gap: 12px; justify-content: center; } .content08_img01 { max-width: 430px; } .content08_img02 { max-width: 429px; } .content08_txt { width: 682px; margin-top: 66px !important; font-size: 20px; font-weight: 300; line-height: 1.6; letter-spacing: -0.6px; left: 50%; transform: translateX(-50%); } .content09 { position: relative; padding: 169px 0 121px; background-image: url(https://image.a-rt.com/art/editor/202509/1757400991689.png); background-repeat: no-repeat; background-size: cover; } .content09_sub_ttl { font-size: 25px; font-weight: 400; line-height: 1; } .content09_main_ttl { width: 837px; margin: 11px auto 0 !important; font-size: 42px; font-weight: 700; line-height: 1.43; background-image: url(https://image.a-rt.com/art/editor/202509/1757401030474.png); background-repeat: no-repeat; background-size: 422px; background-position-x: 237px; background-position-y: 33.56px; } .content09_img_wrap { display: flex; justify-content: center; gap: 12.75px; margin-top: 52px !important; } .content09_img01 { max-width: 346.25px; margin-top: 76px !important; } .content09_img02 { max-width: 478px; } .content09_txt { width: 682px; margin-top: 66px !important; font-size: 20px; font-weight: 300; line-height: 1.58; letter-spacing: -0.6px; left: 50%; transform: translateX(-50%); } .content10 { padding: 157px 0 0; background-image: url(https://image.a-rt.com/art/editor/202509/1757401040926.png); background-repeat: no-repeat; background-size: cover; } .content10_img_wrap { display: flex; justify-content: center; gap: 13px; } .content10_img01 { max-width: 430px; } .content10_img02 { max-width: 429px; } .content10_txt { width: 682px; margin: 63px auto 0 !important; font-size: 20px; font-weight: 300; line-height: 1.58; letter-spacing: -0.6px; left: 50%; transform: translateX(-50%); } /* 애니메이션 */ .animationSection.animation01 { position: relative; width: 500px; height: 671px; margin: 0 auto; } .animationSection.animation02 { position: relative; width: 478px; height: 581px; } .animationSection.animation03 { position: relative; width: 346.25px; height: 506px; } .animationSection.animation04 { position: relative; width: 682px; height: 135px; margin: 0 auto; } .animationSection.animation05 { position: relative; width: 441px; height: 537px; } .animationSection.animation06 { position: relative; width: 438.85px; height: 537px; } .animationSection.animation07 { position: relative; width: 246px; height: 536.83px; } .animationSection.animation08 { position: relative; width: 682px; height: 128px; margin: 0 auto; } .animationSection.animation09 { position: relative; width: 346px; height: 505.68px; } .animationSection.animation10 { position: relative; width: 478px; height: 581px; } .animationSection.animation11 { position: relative; width: 682px; height: 131px; margin: 0 auto; } .animationSection.animation12 { position: relative; width: 430px; height: 537px; } .animationSection.animation13 { position: relative; width: 430px; height: 537px; } .animationSection.animation14 { position: relative; width: 682px; height: 127px; margin: 0 auto; } .animationSection.animation15 { position: relative; width: 478px; height: 581px; } .animationSection.animation16 { position: relative; width: 346px; height: 505.68px; } .animationSection.animation17 { position: relative; width: 682px; height: 128px; margin: 0 auto; } .animationSection.animation18 { position: relative; width: 430px; height: 537px; } .animationSection.animation19 { position: relative; width: 429px; height: 537px; } .animationSection.animation20 { position: relative; width: 682px; height: 129px; margin: 0 auto; } .animationSection.animation21 { position: relative; width: 346.25px; height: 506px; } .animationSection.animation22 { position: relative; width: 478px; height: 581px; } .animationSection.animation23 { position: relative; width: 682px; height: 129px; margin: 0 auto; } .animationSection.animation24 { position: relative; width: 430px; height: 537px; } .animationSection.animation25 { position: relative; width: 429px; height: 537px; } .animationSection.animation26 { position: relative; width: 682px; height: 156px; margin: 0 auto; } .footer { padding: 81px 0 0; background-color: #000000; } .footer .btn { font-size: 20px; font-weight: bold; width: 800px; box-sizing: border-box; display: flex; text-align: center; align-items: center; justify-content: center; height: 80px; border: 2px solid #fff; transition: .3s ease; text-decoration: none; color: #fff; margin: 0 auto; } .footer .btn:hover { color: #000; background: #fff; } .footer .btn .ico { display: inline-block; width: 28px; height: 28px; background: url(https://image.a-rt.com/art/editor/202509/1757401077622.png) center/cover no-repeat; transition: .3s ease; } .footer .btn:hover .ico { background: url(https://image.a-rt.com/art/editor/202509/1757401084198.png) center/cover no-repeat; } .footer .copy { margin: 0; padding: 85px 0 143px; text-align: center; font-size: 22px; } .footer .copy .attention { font-weight: bold; }</style><!-- s : art-container-event --><div class="art-container-event"><div class="art-content-inner"><div class="mv"><img alt="NEW FUTURE, OLD SKOOL" src="https://image.a-rt.com/art/editor/202509/1757401095386.jpg" /></div><div class="content01"><div class="category_wrap"><p class="category_ttl">LAUNCHING</p><p class="category_txt">지금 공개된 신상부터 주목받는 브랜드까지,<br />당신을 위한 첫 번째 소식을 지금 바로 만나보세요.</p></div></div><div class="content02"><div class="content02_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400672252.png" /></div><p class="content02_ttl">올드 스쿨의 미래를 재해석 하다</p><p class="content02_txt">전 세계를 대표하는 4명의 스케이터와의 협업으로<br />반스 올드 스쿨이 새롭게 탄생했습니다.<br />에프론 댄직, 히라키 코코나, 타니아 크루즈, 카리나 로준코<br />각자의 스타일과 스토리를 아이코닉한 실루엣에 담아<br />창조적 비전을 완성한 프리미엄 올드 스쿨을 만나보세요.</p><div class="animationSection animation01"><div class="aniWrap"><div class="aniImg aniImg01"><div class="content02_videoWrap"><video autoplay="" controls="" loop="" muted="" playsinline="" preload="auto"><source src="http://api.wecandeo.com/video/default/BOKNS9AQWrHQg7ii9ipD2jMWlwNOz6xais30eoEA7vT6DZQ51zu97yCRvMxzxNx4FQQqAq9ipJBPSxiiLTLy8QXV3nQieie.mp4" /></video></div></div></div></div></div><div class="content03"><p class="content03_sub_ttl">히라키 코코나의 올드 스쿨</p><p class="content03_main_ttl">&lsquo;다채로운 취미로 빚어가는 삶&rsquo;</p><div class="content03_img_wrap"><div class="animationSection animation02"><div class="aniWrap"><div class="aniImg aniImg02 content03_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400697986.png" /></div></div></div><div class="animationSection animation03"><div class="aniWrap"><div class="aniImg aniImg03 content03_img02"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400704611.png" /></div></div></div></div><div class="animationSection animation04"><div class="aniWrap"><p class="aniImg aniImg04 content03_txt">늘 움직이는 삶을 사는 그녀는 스케이팅과 공예, 드로잉, 팔찌 제작까지 다채로운 취미를 통해<br />세상과 교감하려는 라이프 스타일을 올드 스쿨에 고스란히 담아내었습니다.</p></div></div></div><div class="content04"><div class="content04_img_wrap"><div class="animationSection animation05"><div class="aniWrap"><div class="aniImg aniImg05 content04_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400748673.png" /></div></div></div><div class="animationSection animation06"><div class="aniWrap"><div class="aniImg aniImg06 content04_img02"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400759554.png" /></div></div></div><div class="animationSection animation07"><div class="aniWrap"><div class="aniImg aniImg07 content04_img03"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400772401.png" /></div></div></div></div><div class="animationSection animation08"><div class="aniWrap"><p class="aniImg aniImg08 content04_txt">그녀의 독창적인 아트워크가 담긴 반투명 아웃솔과<br />일본 문화에서 영감을 받은 참 장식 그리고 우정 팔찌를 탈착형으로 함께 구성했습니다.</p></div></div></div><div class="content05"><p class="content05_sub_ttl">카리나 로준코의 올드 스쿨</p><p class="content05_main_ttl">&lsquo;무한히 확장되는 창작의 힘&rsquo;</p><div class="content05_img_wrap"><div class="animationSection animation09"><div class="aniWrap"><div class="aniImg aniImg09 content05_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400794930.png" /></div></div></div><div class="animationSection animation10"><div class="aniWrap"><div class="aniImg aniImg10 content05_img02"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400805666.png" /></div></div></div></div><div class="animationSection animation11"><div class="aniWrap"><p class="aniImg aniImg11 content05_txt">패션, 영화, 주얼리 제작까지.<br />그녀의 다양한 창작 활동을 통해 확장되는 아티스틱한 영역을 올드 스쿨에 녹여내었습니다.</p></div></div></div><div class="content06"><div class="content06_img_wrap"><div class="animationSection animation12"><div class="aniWrap"><div class="aniImg aniImg12 content06_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400840225.png" /></div></div></div><div class="animationSection animation13"><div class="aniWrap"><div class="aniImg aniImg13 content06_img02"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400852850.png" /></div></div></div></div><div class="animationSection animation14"><div class="aniWrap"><p class="aniImg aniImg14 content06_txt">온 보드와 오프보드 전반에서 자연스럽고 세련된 스타일을 추구하는<br />그녀는 빈티지 감성 디자인에 커스텀 금속 장식과 비대칭 어퍼 디테일을 더했습니다.</p></div></div></div><div class="content07"><p class="content07_sub_ttl">타니아 크루즈의 올드 스쿨</p><p class="content07_main_ttl">&lsquo;영감을 주는 아트 커뮤니티&rsquo;</p><div class="content07_img_wrap"><div class="animationSection animation15"><div class="aniWrap"><div class="aniImg aniImg15 content07_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400875065.png" /></div></div></div><div class="animationSection animation16"><div class="aniWrap"><div class="aniImg aniImg16 content07_img02"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400888328.png" /></div></div></div></div><div class="animationSection animation17"><div class="aniWrap"><p class="aniImg aniImg17 content07_txt">그녀가 몸담은 글로벌 스케이트와 아트 커뮤니티로부터 영감을 받아,<br />크루가 신고 싶어 할 디자인을 고안하여 올드 스쿨에 반영하였습니다.</p></div></div></div><div class="content08"><div class="content08_img_wrap"><div class="animationSection animation18"><div class="aniWrap"><div class="aniImg aniImg18 content08_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400940154.png" /></div></div></div><div class="animationSection animation19"><div class="aniWrap"><div class="aniImg aniImg19 content08_img02"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757400963926.png" /></div></div></div></div><div class="animationSection animation20"><div class="aniWrap"><p class="aniImg aniImg20 content08_txt">마모에 따라 점진적으로 빨간색이 드러나는 특별한 블랙 가죽 소재를 사용하여<br />시간의 흐름에 따라 신을수록 더욱 개성 있는 모습으로 변화하게 만들었습니다.</p></div></div></div><div class="content09"><p class="content09_sub_ttl">에프론 댄직의 올드 스쿨</p><p class="content09_main_ttl">&lsquo;하이패션과 스케이트&rsquo;</p><div class="content09_img_wrap"><div class="animationSection animation21"><div class="aniWrap"><div class="aniImg aniImg21 content09_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757401006631.png" /></div></div></div><div class="animationSection animation22"><div class="aniWrap"><div class="aniImg aniImg22 content09_img02"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757401019869.png" /></div></div></div></div><div class="animationSection animation23"><div class="aniWrap"><p class="aniImg aniImg23 content09_txt">스트리트 패션을 대표하는 스케이트 문화에 고급스럽고 아이덴티티가 확실한<br />하이패션을 절묘하게 융합하여 펑크 컬처 감성을 올드 스쿨에 담았습니다.</p></div></div></div><div class="content10"><div class="content10_img_wrap"><div class="animationSection animation24"><div class="aniWrap"><div class="aniImg aniImg24 content10_img01"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757401052560.png" /></div></div></div><div class="animationSection animation25"><div class="aniWrap"><div class="aniImg aniImg25 content10_img02"><img alt="" src="https://image.a-rt.com/art/editor/202509/1757401066510.png" /></div></div></div></div><div class="animationSection animation26"><div class="aniWrap"><p class="aniImg aniImg26 content10_txt">DIY 펑크 컬처에서 출발한 힐 컵솔과 풀그레인 가죽, 실버 하드웨어<br />그리고 코르셋 스타일의 레이싱 디테일을 적용하여 클래식한 실루엣에<br />페미닌한 무드를 더했습니다.</p></div></div></div><div class="footer"><a class="btn" href="https://www.a-rt.com/display/webzine/magazine">더 많은 콘텐츠 보러가기<span class="ico"></span></a><p class="copy">콘텐츠가 마음에 들었다면 <span class="attention">좋아요</span>를 눌러주세요.</p></div></div></div><!-- e : art-container-event --><!-- 애니메이션 --><script> $(function () { $(window).on("scroll", function () { doAnimation(".animation01", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation02", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation03", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 300); doAnimation(".animation04", { opacity: 0 }, { opacity: 1 }, 700, 0.8, 0); doAnimation(".animation05", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation06", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 300); doAnimation(".animation07", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 600); doAnimation(".animation08", { opacity: 0 }, { opacity: 1 }, 700, 0.8, 0); doAnimation(".animation09", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation10", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 300); doAnimation(".animation11", { opacity: 0 }, { opacity: 1 }, 700, 0.8, 0); doAnimation(".animation12", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation13", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 300); doAnimation(".animation14", { opacity: 0 }, { opacity: 1 }, 700, 0.8, 0); doAnimation(".animation15", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation16", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 300); doAnimation(".animation17", { opacity: 0 }, { opacity: 1 }, 700, 0.8, 0); doAnimation(".animation18", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation19", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 300); doAnimation(".animation20", { opacity: 0 }, { opacity: 1 }, 700, 0.8, 0); doAnimation(".animation21", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation22", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 300); doAnimation(".animation23", { opacity: 0 }, { opacity: 1 }, 700, 0.8, 0); doAnimation(".animation24", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 0); doAnimation(".animation25", { opacity: 0 }, { opacity: 1 }, 700, 0.5, 300); doAnimation(".animation26", { opacity: 0 }, { opacity: 1 }, 700, 0.8, 0); }); function doAnimation(selector, startCSS, endCSS, duration, triggerRatio, delay) { var $section = $(selector); var $img = $section.find(".aniImg"); var ratio = (typeof triggerRatio === "number") ? triggerRatio : 0.5; var delayTime = (typeof delay === "number") ? delay : 0; var triggerPoint = $section.offset().top + ($section.outerHeight() * ratio); if ($section.data("shown") === undefined) { $section.data("shown", false); $img.css($.extend({}, startCSS, { position: "absolute" })); } if ($(window).scrollTop() + $(window).height() > triggerPoint) { if (!$section.data("shown")) { $section.data("shown", true); $img.stop(true, true) .delay(delayTime) .animate(endCSS, duration, "swing"); } } else { if ($section.data("shown")) { $section.data("shown", false); $img.stop(true, true) .delay(delayTime) .animate(startCSS, duration, "swing"); } } } $(window).trigger("scroll"); }); </script><!-- E : 이벤트 복사영역 여기까지 -->