"광주 문화예술 인문스토리 플랫폼2"의 두 판 사이의 차이
광주문화예술인문스토리플랫폼
| 1번째 줄: | 1번째 줄: | ||
| − | + | {{#tag:html| | |
| − | + | <!-- 에디터 컨텐츠 등록 영역 --> | |
| − | + | <div class="gwangju-main-wrap"> | |
| − | + | <!-- 메인 베너 영역 --> | |
| − | + | <div class="gwangju-main-section gwangju-main-section01"> | |
| − | + | <div class="main-visual-container"> | |
| − | + | <div class="main-visual-swiper swiper"> | |
| − | + | <div class="swiper-wrapper"> | |
| − | + | <div class="swiper-slide"> | |
| − | + | <a href="#" class="visual-link"> | |
| − | + | <span class="visual-img"> | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
<img | <img | ||
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_visual01.jpg" | |
| − | src="/wiki/skins/ETBSkin/images/new/ | + | alt="Image 1" |
| − | alt="" | ||
/> | /> | ||
| + | </span> | ||
| + | <span class="visual-copy">광주스토리<br />플랫폼</span> | ||
| + | <span class="visual-cont"> | ||
| + | <h2 class="visual-tit-group"> | ||
| + | <span class="tit"> | ||
| + | 빛이 스며든 <br />이야기, <br />예술이 되는 <br />역사 | ||
| + | </span> | ||
| + | <span class="line-group type01"> | ||
| + | <span class="line line01"></span> | ||
| + | <span class="sub">빛고을</span> | ||
| + | <span class="line line02"></span> | ||
| + | </span> | ||
| + | <span class="line-group type02"> | ||
| + | <span class="line line03"></span> | ||
| + | <span class="sub">광주에서 시작됩니다.</span> | ||
| + | </span> | ||
| + | </h2> | ||
| + | <span class="visual-btn"> | ||
| + | <span class="main-btn"> | ||
| + | <span class="btn-txt">VIEW MORE</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </span> | ||
| + | </span> | ||
| + | </span> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide"> | ||
| + | <a href="#" class="visual-link"> | ||
| + | <span class="visual-img"> | ||
<img | <img | ||
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_visual02.jpg" | |
| − | src="/wiki/skins/ETBSkin/images/new/ | + | alt="Image 2" |
| − | alt="" | ||
/> | /> | ||
| + | </span> | ||
| + | <span class="visual-copy">시맨틱<br />데이터베이스</span> | ||
| + | <span class="visual-cont"> | ||
| + | <h2 class="visual-tit-group"> | ||
| + | <span class="tit"> 객체 간의 <br />의미적 관계 <br />시맨틱 </span> | ||
| + | <span class="line-group type03"> | ||
| + | <span class="line line04"></span> | ||
| + | <span class="tit"> 데이터베이스 </span> | ||
| + | </span> | ||
| + | <span class="txt" | ||
| + | >정보의 맥락을 보다 깊이 있게 <br />파악할 수 있도록 설계된 | ||
| + | 데이터베이스</span | ||
| + | > | ||
| + | </h2> | ||
| + | <span class="visual-btn"> | ||
| + | <span class="main-btn"> | ||
| + | <span class="btn-txt">VIEW MORE</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </span> | ||
| + | </span> | ||
| + | </span> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide"> | ||
| + | <a href="#" class="visual-link"> | ||
| + | <span class="visual-img"> | ||
<img | <img | ||
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_visual03.jpg" | |
| − | src="/wiki/skins/ETBSkin/images/new/ | + | alt="Image 3" |
| − | alt="" | ||
/> | /> | ||
| − | </ | + | </span> |
| − | </ | + | <span class="visual-copy">메타버스<br />디지털 교과서</span> |
| + | <span class="visual-cont"> | ||
| + | <h2 class="visual-tit-group"> | ||
| + | <span class="tit"> 메타버스 <br />디지털 교과서 <br />오월의 </span> | ||
| + | <span class="line-group type03"> | ||
| + | <span class="line line04"></span> | ||
| + | <span class="tit"> 달리기 </span> | ||
| + | </span> | ||
| + | <span class="txt">기억의 시간, 회중 시계를 통한 <br />과거로의 여행</span> | ||
| + | </h2> | ||
| + | <span class="visual-btn"> | ||
| + | <span class="main-btn"> | ||
| + | <span class="btn-txt">VIEW MORE</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </span> | ||
| + | </span> | ||
| + | </span> | ||
| + | </a> | ||
</div> | </div> | ||
</div> | </div> | ||
| − | <!-- // | + | <div class="swiper-fraction"></div> |
| + | </div> | ||
| + | </div> | ||
| + | </div> | ||
| + | <!-- //메인 베너 영역 --> | ||
| − | + | <!-- 사적지 배너 영역 --> | |
| − | + | <div class="gwangju-main-section gwangju-main-section02"> | |
| − | + | <div class="main-inner section02-inner"> | |
| − | + | <div class="section02-txt"> | |
| − | + | <div class="main-header"> | |
| − | + | <p class="main-subtit">MEMORIAL SITE</p> | |
| − | + | <h2 class="main-tit">장소로 알아보는 <br />열흘 간의 항쟁 기록</h2> | |
| − | + | </div> | |
| − | + | <p class="txt-desc"> | |
| − | + | 그날의 기억이 머문 장소들을 따라가며, 시간 속에 남은 이야기를 천천히 만나보세요.<br /> | |
| − | + | 번호를 따라가며 클릭하면, 장소마다 담긴 역사적 의미와 당시의 이야기를 자세히 살펴볼 | |
| − | + | 수 있습니다. 광주의 골목골목에 스며든 기억과 그날의 진실과 마주해보세요. | |
| − | + | </p> | |
| − | + | <div class="txt-link"> | |
| − | + | <a href="#" class="main-btn"> | |
| − | + | <span class="btn-txt">VIEW MORE</span> | |
| − | + | <i class="ico-arrow"></i> | |
| − | + | </a> | |
| − | + | </div> | |
| − | + | </div> | |
| − | + | <div class="section02-img"> | |
| − | + | <img | |
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_banner02.jpg" | |
| − | + | alt="" | |
| − | + | class="pc-show" | |
| − | + | /> | |
| − | + | <img | |
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_banner03.jpg" | |
| − | + | alt="" | |
| − | + | class="mb-show" | |
| − | + | /> | |
| − | + | <div class="place-group"> | |
| − | + | <img | |
| − | + | class="img1" | |
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_place01.png" | |
| − | + | alt="" | |
| − | + | /> | |
| − | + | <img | |
| − | + | class="img2" | |
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_place03.png" | |
| − | + | alt="" | |
| − | + | /> | |
| − | + | <img | |
| − | + | class="img3" | |
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_place02.png" | |
| − | + | alt="" | |
| − | + | /> | |
| − | + | </div> | |
| − | + | </div> | |
| − | + | </div> | |
| − | + | </div> | |
| − | + | <!-- //사적지 배너 영역 --> | |
| − | + | ||
| − | + | <!-- 카테고리별 인문스토리 영역 --> | |
| − | + | <div class="gwangju-main-section gwangju-main-section03"> | |
| − | + | <div class="section03-inner"> | |
| − | + | <div class="main-inner"> | |
| − | + | <div class="main-header"> | |
| − | + | <p class="main-subtit lato">STORY DATA</p> | |
| − | + | <h2 class="main-tit">카테고리별로 만나는<br />인문 스토리</h2> | |
| − | + | </div> | |
| − | + | <div class="category-filters"> | |
| − | + | <div class="filter-btn-group"> | |
| − | + | <button type="button" class="filter-btn active" data-category="person"> | |
| − | + | <span class="icon icon-person"></span> | |
| − | + | <span class="filter-txt">인물/단체</span> | |
| − | + | </button> | |
| − | + | <button type="button" class="filter-btn" data-category="term"> | |
| − | + | <span class="icon icon-term"></span> | |
| − | + | <span class="filter-txt">개념/용어</span> | |
| − | + | </button> | |
| − | + | <button type="button" class="filter-btn" data-category="event"> | |
| − | + | <span class="icon icon-event"></span> | |
| − | + | <span class="filter-txt">사건</span> | |
| − | + | </button> | |
| − | + | <button type="button" class="filter-btn" data-category="data"> | |
| − | + | <span class="icon icon-data"></span> | |
| − | + | <span class="filter-txt">자료</span> | |
| − | + | </button> | |
| − | + | <button type="button" class="filter-btn" data-category="object"> | |
| − | + | <span class="icon icon-object"></span> | |
| − | + | <span class="filter-txt">사물</span> | |
| − | + | </button> | |
| − | + | <button type="button" class="filter-btn" data-category="place"> | |
| − | + | <span class="icon icon-place"></span> | |
| − | + | <span class="filter-txt">장소</span> | |
| − | + | </button> | |
| − | + | <button type="button" class="filter-btn" data-category="record"> | |
| − | + | <span class="icon icon-record"></span> | |
| − | + | <span class="filter-txt">기록물</span> | |
| − | + | </button> | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | < | ||
| − | |||
| − | |||
| − | < | ||
| − | </ | ||
</div> | </div> | ||
</div> | </div> | ||
| − | + | <div class="story-swiper"> | |
| − | + | <div class="swiper"> | |
| − | + | <div class="swiper-wrapper"> | |
| − | <div class=" | + | <div class="swiper-slide"> |
| − | <div class=" | + | <a href="#" class="story-card"> |
| − | <div class=" | + | <h3 class="card-tit">5·18광주민주화운동</h3> |
| − | <div class=" | + | <span class="card-tags"> |
| − | < | + | <span class="tag">Event</span> |
| − | < | + | </span> |
| − | < | + | <span class="card-description" |
| − | + | >5·18민주화운동은 1980년 5월 18일부터 27일까지 무장저항이라는 대한민국 | |
| − | + | 역사상 최고 수준의 저항을 행사한 사건으로 공식명칭은 5·18민주화운동이다. | |
| − | < | + | 아시아지역 민주화운동에 끼친 영향이 인정되어 2011년 5·18민주화운동기록물이 |
| − | > | + | 유네스코 인권분야 세계기록유산으로 등재됐다.</span |
> | > | ||
| − | <a href="#" class="story- | + | <span class="card-image"> |
| − | > | + | <img |
| + | src="/wiki/skins/ETBSkin/images/new/img_main_story01.png" | ||
| + | alt="광주비엔날레" | ||
| + | /> | ||
| + | </span> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide"> | ||
| + | <a href="#" class="story-card"> | ||
| + | <h3 class="card-tit">광주 서창 억새축제</h3> | ||
| + | <span class="card-tags"> | ||
| + | <span class="tag">Event</span> | ||
| + | </span> | ||
| + | <span class="card-description" | ||
| + | >광주비엔날레는 광주광역시에서 2년마다 열리는 국제 현대 미술 | ||
| + | 전시회입니다.</span | ||
> | > | ||
| − | <a href="#" class="story- | + | <span class="card-image"> |
| − | > | + | <img |
| + | src="/wiki/skins/ETBSkin/images/new/img_main_story01.png" | ||
| + | alt="광주비엔날레" | ||
| + | /> | ||
| + | </span> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide"> | ||
| + | <a href="#" class="story-card"> | ||
| + | <h3 class="card-tit">광주학생독립운동(윤문)</h3> | ||
| + | <span class="card-tags"> | ||
| + | <span class="tag">Event</span> | ||
| + | </span> | ||
| + | <span class="card-description" | ||
| + | >1929년 11월 3일 광주에서 시작되어 전국으로 확산, 1930년 3월까지 계속된 | ||
| + | 일제하 최대 학생항일운동이었다. 1919년 ‘3.1운동’, 1926년 ‘6.10만세운동’과 | ||
| + | 더불어 일제강점기 3대 독립운동으로 불리며, 일제의 식민지 우민화교육, | ||
| + | 민족차별 등에 항거한 대표적 학생운동이다.</span | ||
> | > | ||
| − | < | + | <span class="card-image"> |
| − | + | <img | |
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_story01.png" | |
| − | < | + | alt="광주비엔날레" |
| − | < | + | /> |
| − | < | + | </span> |
| − | > | + | </a> |
| + | </div> | ||
| + | <div class="swiper-slide"> | ||
| + | <a href="#" class="story-card"> | ||
| + | <h3 class="card-tit">광주인화학교 성폭력 사건</h3> | ||
| + | <span class="card-tags"> | ||
| + | <span class="tag">Event</span> | ||
| + | </span> | ||
| + | <span class="card-description" | ||
| + | >광주인화학교 성폭력 사건(2005)은 광주광역시 광산구 삼거동에 있던 | ||
| + | 청각장애인 특수학교인 인화학교에서 교장과 교직원에 의해 지속적으로 장애인 | ||
| + | 아동 성폭력이 발생해 사회적으로 큰 파장을 일으킨 사건이다.</span | ||
> | > | ||
| − | + | <div class="card-image"> | |
| − | + | <img | |
| − | + | src="/wiki/skins/ETBSkin/images/new/img_main_story01.png" | |
| − | + | alt="광주비엔날레" | |
| − | + | /> | |
| − | |||
| − | < | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
</div> | </div> | ||
| − | + | </a> | |
| − | |||
| − | |||
| − | |||
| − | </ | ||
</div> | </div> | ||
</div> | </div> | ||
| − | <div class=" | + | <div class="swiper-pagination"></div> |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
</div> | </div> | ||
</div> | </div> | ||
| − | <!-- // | + | </div> |
| + | <div class="story-mask"> | ||
| + | <div class="mask-txt">PLATFORM</div> | ||
| + | </div> | ||
| + | </div> | ||
| + | </div> | ||
| + | <!-- //카테고리별 인문스토리 영역 --> | ||
| − | + | <!-- 메타버스 컨텐츠 영역 --> | |
| − | + | <div class="gwangju-main-section gwangju-main-section04"> | |
| − | + | <div class="section04-inner"> | |
| − | + | <div class="panel-group"> | |
| − | + | <div class="left-panel"> | |
| − | + | <div class="main-header"> | |
| − | + | <p class="main-subtit">METAVERSE</p> | |
| − | + | <h2 class="main-tit">기억을 잇는 가상 공간</h2> | |
| − | + | </div> | |
| − | + | <div class="story-links"> | |
| − | </ | + | <a href="#" class="story-link-item active" data-index="0" |
| − | < | + | >5월의 달리기 - 디지털 교과서</a |
| − | + | > | |
| − | + | <a href="#" class="story-link-item" data-index="1" | |
| − | + | >양림동 선교사 마을, 새로운 문화와의 만남</a | |
| − | </a> | + | > |
| − | </ | + | <a href="#" class="story-link-item" data-index="2" |
| + | >기억, 회복 그리고 광주비엔날레</a | ||
| + | > | ||
| + | <a href="#" class="story-link-item" data-index="3">광주의 고려인 마을</a> | ||
| + | <a href="#" class="story-link-item" data-index="4">관광을 품은 무등산</a> | ||
| + | <a href="#" class="story-link-item" data-index="5">극락강 역</a> | ||
| + | <a href="#" class="story-link-item" data-index="6">구 MBC</a> | ||
| + | <a href="#" class="story-link-item" data-index="7">충장로, 광주의 삶을 담다</a> | ||
| + | <a href="#" class="story-link-item" data-index="8" | ||
| + | >영산강과 황룡강이 품은 광주의 유원지</a | ||
| + | > | ||
| + | <a href="#" class="story-link-item" data-index="9">광주로컬음악</a> | ||
</div> | </div> | ||
</div> | </div> | ||
| − | < | + | <div class="right-panel"> |
| − | + | <div class="image-scroll-container swiper"> | |
| − | + | <div class="swiper-wrapper"> | |
| − | + | <div class="swiper-slide" id="story-image-1"> | |
| − | + | <a href="#" class="item-link"> | |
| − | + | <span class="item-img"> | |
| − | <div class=" | + | <img |
| − | < | + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_01.png" |
| + | alt="가상 공간 에셋 1" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">5월의 달리기 - 디지털 교과서</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide" id="story-image-2"> | ||
| + | <a href="#" class="item-link"> | ||
| + | <span class="item-img"> | ||
| + | <img | ||
| + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_02.png" | ||
| + | alt="가상 공간 에셋 2" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">양림동 선교사 마을, 새로운 문화와의 만남</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide" id="story-image-3"> | ||
| + | <a href="#" class="item-link"> | ||
| + | <span class="item-img"> | ||
| + | <img | ||
| + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_03.png" | ||
| + | alt="가상 공간 에셋 3" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">기억, 회복 그리고 광주비엔날레</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide" id="story-image-4"> | ||
| + | <a href="#" class="item-link"> | ||
| + | <span class="item-img"> | ||
| + | <img | ||
| + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_01.png" | ||
| + | alt="가상 공간 에셋 1" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">광주의 고려인 마을</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide" id="story-image-5"> | ||
| + | <a href="#" class="item-link"> | ||
| + | <span class="item-img"> | ||
| + | <img | ||
| + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_02.png" | ||
| + | alt="가상 공간 에셋 2" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">관광을 품은 무등산</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide" id="story-image-6"> | ||
| + | <a href="#" class="item-link"> | ||
| + | <span class="item-img"> | ||
| + | <img | ||
| + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_03.png" | ||
| + | alt="가상 공간 에셋 3" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">극랑강 역</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide" id="story-image-7"> | ||
| + | <a href="#" class="item-link"> | ||
| + | <span class="item-img"> | ||
| + | <img | ||
| + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_01.png" | ||
| + | alt="가상 공간 에셋 1" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">구 MBC</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide" id="story-image-8"> | ||
| + | <a href="#" class="item-link"> | ||
| + | <span class="item-img"> | ||
| + | <img | ||
| + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_02.png" | ||
| + | alt="가상 공간 에셋 2" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">충장로, 광주의 삶을 담다</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | <div class="swiper-slide" id="story-image-9"> | ||
| + | <a href="#" class="item-link"> | ||
| + | <span class="item-img"> | ||
| + | <img | ||
| + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_03.png" | ||
| + | alt="가상 공간 에셋 3" | ||
| + | /> | ||
| + | </span> | ||
| + | <span class="item-txt">영산강과 황룡강이 품은 광주의 유원지</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
</div> | </div> | ||
| − | <div class=" | + | <div class="swiper-slide" id="story-image-10"> |
| − | < | + | <a href="#" class="item-link"> |
| − | + | <span class="item-img"> | |
| − | + | <img | |
| − | + | src="/wiki/skins/ETBSkin/images/new/main_virtual_asset_03.png" | |
| − | + | alt="가상 공간 에셋 3" | |
| − | + | /> | |
| − | + | </span> | |
| − | + | <span class="item-txt">광주로컬음악</span> | |
| − | < | + | <i class="ico-arrow"></i> |
| − | + | </a> | |
| − | |||
| − | |||
| − | |||
</div> | </div> | ||
| + | </div> | ||
| + | <div class="swiper-ui-wrap"> | ||
| + | <div class="swiper-progressbar"><div class="progress-fill"></div></div> | ||
| + | <div class="swiper-fraction"></div> | ||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
| − | |||
</div> | </div> | ||
| − | <link | + | <div class="section04-link"> |
| − | < | + | <a href="#" class="main-btn"> |
| − | < | + | <span class="btn-txt">VIEW MORE</span> |
| − | + | <i class="ico-arrow"></i> | |
| − | < | + | </a> |
| − | + | </div> | |
| − | + | </div> | |
| − | + | </div> | |
| − | + | <!-- //메타버스 컨텐츠 영역 --> | |
| − | <a href=" | + | |
| − | < | + | <!-- 3D 어셋 영역 --> |
| + | <div class="gwangju-main-section gwangju-main-section05"> | ||
| + | <div class="section05-inner"> | ||
| + | <div class="main-header"> | ||
| + | <p class="main-subtit">3D ASSET</p> | ||
| + | <h2 class="main-tit">3D로 보는<br />광주 인문 아카이브</h2> | ||
| + | </div> | ||
| + | <div class="asset-swiper"> | ||
| + | <div id="my-keen-slider" class="keen-slider"></div> | ||
| + | <div id="my-keen-slider2" class="keen-slider"></div> | ||
| + | </div> | ||
| + | <div class="section05-link"> | ||
| + | <a href="#" class="main-btn"> | ||
| + | <span class="btn-txt">VIEW MORE</span> | ||
| + | <i class="ico-arrow"></i> | ||
| + | </a> | ||
| + | </div> | ||
| + | </div> | ||
| + | </div> | ||
| + | <!-- //3D 어셋 영역 --> | ||
| + | |||
| + | <!-- AR Heritage 영역 --> | ||
| + | <div class="gwangju-main-section gwangju-main-section06"> | ||
| + | <div class="main-inner section06-inner"> | ||
| + | <div class="section06-content"> | ||
| + | <div class="main-header"> | ||
| + | <h2 class="main-tit">AR Heritage</h2> | ||
| + | </div> | ||
| + | <div class="section06-txt"> | ||
| + | <h3 class="txt-sub">광주의 근현대 역사와 문화를 엿볼 수 있는 유산들을 증강현실</h3> | ||
| + | <p class="txt-desc"> | ||
| + | 광주의 역사적 명소와 문화예술 거점을 AR 콘텐츠로 체험할 수 있는 투어입니다.<br /> | ||
| + | 실시간 위치 정보와 장소의 맥락을 제공하여 시민들이 지역 인문자원을 향유하도록 | ||
| + | 기획되었습니다.<br /> | ||
| + | AR을 통해 광주 시민들이 공유하는 기억과 감성을 생생하게 느낄 수 있습니다. | ||
| + | </p> | ||
| + | <div class="section06-link"> | ||
| + | <a href="#" class="main-btn"> | ||
| + | <span class="btn-txt">VIEW MORE</span> | ||
| + | <i class="ico-arrow"></i> | ||
</a> | </a> | ||
| − | `; | + | </div> |
| − | + | </div> | |
| − | + | </div> | |
| − | + | </div> | |
| − | + | </div> | |
| − | + | <!-- //AR Heritage 영역 --> | |
| − | + | </div> | |
| − | + | <link rel="stylesheet" href="/wiki/skins/ETBSkin/resources/styles/swiper-bundle.min.css" /> | |
| − | + | <link rel="stylesheet" href="/wiki/skins/ETBSkin/resources/styles/keen-slider.min.css" /> | |
| − | + | <script src="/wiki/skins/ETBSkin/resources/scripts/swiper-bundle.min.js"></script> | |
| − | + | <script src="/wiki/skins/ETBSkin/resources/scripts/storyData.js"></script> | |
| − | + | <script> | |
| − | + | threeDAssetData.forEach((item, index) => { | |
| − | + | const slideDom = document.createElement('div'); | |
| − | + | slideDom.classList.add('keen-slider__slide'); | |
| − | + | slideDom.innerHTML = ` | |
| − | + | <a href="${item.link ? item.link : '#'}" class="asset-link"> | |
| − | + | <img src="/wiki/skins/ETBSkin/images/new/${item.src}" alt="" /> | |
| − | + | </a> | |
| − | + | `; | |
| − | + | if (threeDAssetData.length >= index) { | |
| + | document.getElementById('my-keen-slider').appendChild(slideDom); | ||
| + | } | ||
| + | if (threeDAssetData.length / 2 < index) { | ||
| + | document.getElementById('my-keen-slider2').appendChild(slideDom); | ||
| + | } | ||
| + | }); | ||
| + | </script> | ||
| + | <script src="/wiki/skins/ETBSkin/resources/scripts/keen-slider.min.js"></script> | ||
| + | <script src="/wiki/skins/ETBSkin/resources/scripts/gsap.min.js"></script> | ||
| + | <script src="/wiki/skins/ETBSkin/resources/scripts/ScrollTrigger.min.js"></script> | ||
| + | <script src="/wiki/skins/ETBSkin/resources/scripts/lottie.min.js"></script> | ||
| + | <script src="/wiki/skins/ETBSkin/resources/scripts/storymain.js"></script> | ||
| + | <!-- // 에디터 컨텐츠 등록 영역 --> | ||
| + | <style> | ||
| + | #firstHeading { | ||
| + | display: none !important; | ||
| + | } | ||
| + | </style> | ||
| + | }} | ||
2025년 7월 24일 (목) 16:58 판
MEMORIAL SITE
장소로 알아보는
열흘 간의 항쟁 기록
그날의 기억이 머문 장소들을 따라가며, 시간 속에 남은 이야기를 천천히 만나보세요.
번호를 따라가며 클릭하면, 장소마다 담긴 역사적 의미와 당시의 이야기를 자세히 살펴볼
수 있습니다. 광주의 골목골목에 스며든 기억과 그날의 진실과 마주해보세요.
STORY DATA
카테고리별로 만나는
인문 스토리
PLATFORM
METAVERSE
기억을 잇는 가상 공간
AR Heritage
광주의 근현대 역사와 문화를 엿볼 수 있는 유산들을 증강현실
광주의 역사적 명소와 문화예술 거점을 AR 콘텐츠로 체험할 수 있는 투어입니다.
실시간 위치 정보와 장소의 맥락을 제공하여 시민들이 지역 인문자원을 향유하도록
기획되었습니다.
AR을 통해 광주 시민들이 공유하는 기억과 감성을 생생하게 느낄 수 있습니다.