#contents { width: 100%; } .swiper-container-wrapper { width: 100%; max-width: 600px; margin: 0 auto; padding: 15px 0; position: relative; } .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; } .swiper-slide { width: 100%; position: relative; background: #1a1a1a; overflow: hidden; } .swiper-slide img { display: block; width: 100%; height: auto; object-fit: cover; transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .swiper-slide-active img { transform: scale(1.03); } .swiper-pagination-progressbar { background: rgba(255, 255, 255, 0.1) !important; height: 3px !important; top: 0 !important; } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #ccff00 !important; /* Trend Color: Neon Lime */ box-shadow: 0 0 10px #ccff00; } .custom-counter { position: absolute; bottom: 16px; right: 16px; z-index: 10; background: rgba(0, 0, 0, 0.4); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.15); padding: 6px 14px; border-radius: 100px; font-size: 12px; font-weight: 700; letter-spacing: 1px; color: #ffffff; } .swiper-button-prev, .swiper-rtl .swiper-button-next { right: auto; left: -7vw; } .swiper-button-next, .swiper-rtl .swiper-button-prev { right: -7vw; left: auto; } .custom-counter .current { color: #ccff00; /* 네온 포인트 */ } /* [MZ 요소 3] 미니멀 액센트 화살표 (Hover 시 스케일 업) */ .swiper-button-next, .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%; } .swiper-button-next:after, .swiper-button-prev:after { font-size: 16px; font-weight: bold; } .swiper-button-next:hover, .swiper-button-prev:hover { background: #ccff00; color: #000000; border-color: #ccff00; box-shadow: 0 0 15px rgba(204, 255, 0, 0.6); } .box_modInfo, #btm_team_team_marg { max-width: 980px; margin: 0 auto; } .cont_wrap { width: 100%; background-color: #2b6c75; padding: 5% 0%; }.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: 600px; font-size: inherit; font-family: initial; white-space: pre-line; margin: 0 auto; color: #fff; height: 200px; display: block; margin-bottom: 5%; overflow-y: scroll; scrollbar-width: thin; scrollbar-color: #000000 #9E9E9E;}.qu_box pre::-webkit-scrollbar { width: 10px; /* 세로 스크롤바 너비 */ height: 10px; /* 가로 스크롤바 높이 */}.qu_box pre::-webkit-scrollbar-track { background: #f8fafc; /* 스크롤바 트랙(배경) 색상 */ border-radius: 8px;}.qu_box pre::-webkit-scrollbar-thumb { background-color: #cbd5e1; /* 스크롤바 막대 색상 */ border-radius: 8px; /* 막대 모서리 둥글게 */}.qu_box pre::-webkit-scrollbar-thumb:hover { background-color: #94a3b8; /* 마우스 오버 시 색상 진하게 */}.tit_cont.titleType1, .recommendation_group { max-width: 980px; margin: 0 auto;} @media (max-width: 640px) { .swiper-container-wrapper { width: 100%; max-width: 100%; padding: 3%; /* 모바일 풀스크린 감성 */ } .swiper { border-radius: 0; /* 모바일에서는 꽉 차게 직각 처리 (또는 12px 선택 가능) */ box-shadow: none; } .swiper-button-next, .swiper-button-prev { display: none; /* 모바일에서는 터치 제스처 위주이므로 버튼 숨김으로 깔끔함 유지 */ } .con_wrap { padding: 3%;} .market_logo {display:none;} .qu_box { padding: 5%; } .qu_box pre {height:unset;} } 01 / 05 스마일 캠페인이 도착한 다음 타자! | 맛과 멋에 취해부렀어잉~ ‘전북 전주남부시장’ 🌕🍶 새벽부터 밤까지 전통과 청춘의 열기로 가득했던 스마일 캠페인 현장 소식 전해드려요! 💡 스마일 캠페인 in 전주남부시장 🏃‍♂️ 남부시장의 24시간을 꽉 채워 달리는 논스톱 밤샘 투어! 야시장부터 청년몰, 새벽시장까지 싹 도장 깨는 '올데이 트립 스탬프 투어' 🧭 🚗 전주 역사상 최초! 차가 사라진 거리에 테이블 쫙 깔고 제대로 즐긴 낭만 가득 '차 없는 야장 거리' 🍻 🎧 힙한 DJ 비트와 전통주·칵테일 한 잔, 새벽까지 이어진 감성 충만 '하늘정원 디제잉 & 심야 영화제' (Special Thanks to 직접 빚은 전통주로 자리를 빛내준 @solok.pub) ⚽ 축구 유니폼 입고 인생샷 남기는 포토존부터 구매 영수증 인증 100% 당첨 룰렛 이벤트까지 풍성하게! 🎁 👉 다음은 또 어느 시장이 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