#contents { width: 100%; } .recommendation_group { padding: 20px 0 0; width: 100%; max-width: 980px; margin: 0 auto; } .box_modInfo, #btm_team_team_marg { max-width: 980px; margin: 0 auto; } .cont_wrap { width: 100%; background-color: #DDBD85; padding: 5% 0; position: relative; } .cont_wrap .swiper-container-wrapper { width: 100%; max-width: 500px; margin: 0 auto; padding: 15px 0; position: relative; } .cont_wrap .swiper { width: 100%; border-radius: 20px; overflow: hidden; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8), 0 0 20px rgba(204, 255, 0, 0.15); position: relative; } .cont_wrap .swiper-slide { width: 100%; position: relative; background: #1a1a1a; overflow: hidden; } .cont_wrap .swiper-slide img { display: block; width: 100%; height: auto; object-fit: cover; transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .cont_wrap .swiper-slide-active img { transform: scale(1.03); } /* 페이지네이션 및 카운터 */ .cont_wrap .swiper-pagination-progressbar { background: rgba(255, 255, 255, 0.1) !important; height: 3px !important; top: 0 !important; } .cont_wrap .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #ccff00 !important; box-shadow: 0 0 10px #ccff00; } .custom-counter { position: absolute; bottom: 0; right: 0; z-index: 10; background: rgba(0, 0, 0, 0.4); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 0; padding: 0 6px; font-size: 12px; font-weight: 700; letter-spacing: 1px; color: #ffffff; } .custom-counter .current { color: #ccff00; } /* 네비게이션 화살표 */ .cont_wrap .swiper-button-next, .cont_wrap .swiper-button-prev { width: 44px; height: 44px; background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-radius: 50%; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.2); transition: all 0.3s ease; position: absolute; top: 50%; transform: translateY(-50%); } .cont_wrap .swiper-button-prev, .swiper-rtl .swiper-button-next { right: auto; left: -7vw; } .cont_wrap .swiper-button-next, .swiper-rtl .swiper-button-prev { right: -7vw; left: auto; } .cont_wrap .swiper-button-next:after, .cont_wrap .swiper-button-prev:after { font-size: 16px; font-weight: bold; } .cont_wrap .swiper-button-next:hover, .cont_wrap .swiper-button-prev:hover { background: #ccff00; color: #000000; border-color: #ccff00; box-shadow: 0 0 15px rgba(204, 255, 0, 0.6); } /* 로고 및 본문 상자 */ .market_logo { position: absolute; left: -15vw; bottom: 0; width: 100%; max-width: 150px; } .market_logo img { width: 100%; } .qu_box pre { width: 100%; max-width: 500px; font-size: inherit; font-family: inherit; white-space: pre-line; margin: 0 auto 5%; color: #fff; height: 200px; display: block; overflow-y: scroll; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.5) transparent; } .qu_box pre::-webkit-scrollbar { width: 10px; height: 10px; } .qu_box pre::-webkit-scrollbar-track { background: transparent; } .qu_box pre::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.5); border-radius: 10px; border: 2px solid transparent; background-clip: padding-box; } .qu_box pre::-webkit-scrollbar-thumb:hover { background-color: rgba(255, 255, 255, 0.8); border: 2px solid transparent; background-clip: padding-box; } .linkbox a { color: #fff !important; } /* 플로팅 버튼 */ .cta-floating-btn { position: absolute; text-align: center; z-index: 10; display: inline-block; align-items: center; background: rgb(0, 0, 0); color: #fff !important; font-weight: 500; font-size: 14px; opacity: 0.4; transition: all 0.3s ease; } .cta-floating-btn:hover { transform: scale(1.1); background: linear-gradient(135deg, #0f2027, #203a43, #2c5364); } .cta-floating-btn.circle-btn { width: 72px; height: 72px; border-radius: 50%; padding: 0; } .cta-floating-btn.blob-btn { padding: 0.5% 1%; } #link01, #link02 { top: 14%; left: 27%; } #link03 { top: 14%; left: 31%; } #link04 { top: 12%; left: 70%; } #link05 { top: 17%; left: 70%; } #link06 { top: 33%; left: 5%; } #link07 { top: 33%; right: 38%; } #link08 { bottom: 24%; left: 5%; } #link09 { bottom: 24%; right: 38%; } @keyframes fadeInButton { 0% { opacity: 0; transform: scale(0.8) translateY(10px); } 100% { opacity: 1; transform: scale(1) translateY(0); } } /* 모바일 반응형 */ @media (max-width: 640px) { .cont_wrap .swiper-container-wrapper { width: 100%; max-width: 100%; padding: 3%; } .cont_wrap .swiper { border-radius: 0; box-shadow: none; } .cont_wrap .swiper-button-next, .cont_wrap .swiper-button-prev { display: none; } .cont_wrap { padding: 3%; } .market_logo { display: none; } .qu_box { padding: 5%; } .qu_box pre { height: unset; } } @media screen and (max-width: 800px) { .cta-floating-btn { font-size: 2.5vw; } } 01 / 08 스마일 캠페인이 도착한 마늘의 고장! | 드라큘라 백작도 반한 그 맛! ‘충북 단양구경시장’ 🧄🏰 알싸한 마늘 향과 달콤 살벌한 매력이 공존하는 ‘충북 단양구경시장’에 캠페인 트럭이 찾아왔습니다! 🚛💚 10.30(금)~31(토) 양일간 누적 방문객 무려 34,799명 방문! 🔥 붉은빛 커튼 너머 펼쳐진 신비로운 <백작의 비밀상점>에서 상인과 여행객이 하나 되어 웃음꽃을 피웠던 K-관광마켓 스마일 캠페인의 뜨거운 현장 소식을 전해드려요! 🎉 💡 스마일 캠페인 in 충북 단양구경시장 🍗 골목마다 침샘 폭발! 백작도 홀려버린 단양의 맛! 겉바속촉 알싸한 마늘통닭부터 갓 쪄낸 육즙 가득 마늘만두, 달콤한 흑마늘빵까지 마늘 먹거리 총출동! 😋✨ 🏰 평범했던 전통시장의 대변신! 상인들과 함께 만든 축제의 장! 마늘 골목이 으스스하고 신비로운 이색 파티장으로 완벽 탈바꿈! 🎈 상인분들도 직접 망토와 코스튬을 챙겨 입고 분장을 얹어 유쾌하게 손님들을 맞이하며 모두가 하나 되어 축제를 즐겼어요 🧙‍♀️🎭 🍷 오직 단양에서만! 눈과 귀가 즐거운 시크릿 프로그램 총집합! • 눈과 입이 호강하는 단양 마늘 4코스 '비밀의 만찬' & 라이브 공연 🍽️🎶 • 특별 레시피 전통주 칵테일과 비트 폭발 디제잉 파티 🍸🎧 • 나랑드사이다 부스부터 스마일 캠페인까지 도장 깨는 비밀 스탬프 투어 🥤🗝️ • 골목을 채우는 바이올린·트럼펫·성악 버스킹 & 귀여운 캐릭터 인형탈 🎻🎺 • 의상 대여소 & 페이스페인팅으로 완벽 변신 후 레드&블랙 거울 포토존에서 인생샷 찰칵! 🪞📸 🎡 스마일 캠페인도 빼놓을 수 없다! 100% 당첨 룰렛 이벤트! 단양구경시장에서 2만 원 이상 알차게 장보고 당일 구매 영수증 챙기고? 꽝 없는 룰렛을 돌려 구경시장에서 현금처럼 팍팍 쓰는 바우처와 푸짐한 선물 득템 성공! 🎟️🎁 👉 다음은 또 어느 전통시장이 HOT해질지 두근두근 기대되신다면? 지금 바로 팔로우하고, 앞으로 펼쳐질 K-관광마켓의 힙하고 빠른 소식들을 누구보다 빠르게 받아보세요! 🔔 var swiper = new Swiper('.mySwiper', { direction: 'horizontal', loop: true, speed: 700, touchRatio: 1.2, resistanceRatio: 0.8, pagination: { el: '.swiper-pagination', type: 'progressbar' }, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev' }, on: { init: function () { var totalSlides = this.slides.length - (this.params.loop ? 2 : 0); var totalEl = document.querySelector('.custom-counter .total'); if (totalEl) { totalEl.textContent = totalSlides