@charset "utf-8";
/* 고향온(TPB 허브) 디자인 리뉴얼(renewal 테마) PC 전용
 * 출처: 고향온 허브 퍼블리싱/메인_pc.html (common.css 의 "리뉴얼 header"/"지역 footer", contents.css 의 "renewal" 구간)
 * 로드: fragments/theme/renewal :: resourceFragment (테마가 매핑된 몰/채널에서만). 퍼블 갱신 시 해당 구간을 그대로 교체한다.
 */

/* ==============================
* 리뉴얼 header (퍼블 common.css)
* ============================== */
#renewalHeaderWrap { position:fixed; top:0; left:0; z-index:999; width:100%; min-width:1320px; background:#fff; }
#renewalHeaderWrap * { font-family:'Pretendard', sans-serif; }
#renewalHeaderWrap #header { height:87px; border-bottom:1px solid #e9e9e9; }
#renewalHeaderWrap #header .section { display:flex; width:1280px; height:100%; padding:0; margin:0 auto; align-items:center; }
#renewalHeaderWrap h1 { flex-shrink:0; }
#renewalHeaderWrap h1 .logo { width:126px; height:38px; font-size:0;}
#renewalHeaderWrap .categoryBox { position:relative; display:flex; align-items:center; align-self:stretch; margin-left:48px; }
#renewalHeaderWrap .btn-category { display:flex; height:100%; align-items:center; gap:8px; font-size:16px; color:#ff7300; font-weight:600; white-space:nowrap; }
#renewalHeaderWrap .btn-category i { position:relative; display:block; width:32px; height:32px; border-radius:50%; }
#renewalHeaderWrap .btn-category i:before { content:''; position:absolute; top:10px; left:8px; width:16px; height:2px; background:currentColor; box-shadow:0 5px currentColor, 0 10px currentColor; }
#renewalHeaderWrap .categoryBox:hover .btn-category i,
#renewalHeaderWrap .categoryBox:focus-within .btn-category i { color:#fff; background:#ff7300; }
#renewalHeaderWrap nav { margin-left:40px; }
#renewalHeaderWrap nav > ul { display:flex; gap:40px; }
#renewalHeaderWrap nav > ul > li > a { display:block; font-size:16px; color:#0c0c0c; font-weight:600; white-space:nowrap; }
#renewalHeaderWrap nav a:hover { color:#ff7300; }
#renewalHeaderWrap .logo-box { display:flex; align-items:center; gap:24px; margin-left:auto; margin-right:40px; }
#renewalHeaderWrap .btn-search { position:relative; display:block; flex-shrink:0; width:28px; height:28px; font-size:0;background-image: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.696 17.7054L17.7061 18.6953L24.705 25.6943L25.6949 24.7043L18.696 17.7054Z' fill='black'/%3E%3Cpath d='M12.25 2.80078C7.02805 2.80078 2.80005 7.02878 2.80005 12.2508C2.80005 17.4728 7.02805 21.7008 12.25 21.7008C17.472 21.7008 21.7 17.4728 21.7 12.2508C21.7 7.02878 17.472 2.80078 12.25 2.80078ZM12.25 20.3008C7.80505 20.3008 4.20005 16.6958 4.20005 12.2508C4.20005 7.80578 7.80505 4.20078 12.25 4.20078C16.695 4.20078 20.3 7.80578 20.3 12.2508C20.3 16.6958 16.695 20.3008 12.25 20.3008Z' fill='black'/%3E%3C/svg%3E%0A");}
#renewalHeaderWrap .btn-my { display:block; flex-shrink:0; width:28px; height:28px; margin-left:16px; font-size:0;background-image: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.0001 14.6992C7.4271 14.6992 2.1001 17.2052 2.1001 20.2992V23.0992C2.1001 24.6462 3.3531 25.8992 4.9001 25.8992H23.1001C24.6471 25.8992 25.9001 24.6462 25.9001 23.0992V20.2992C25.9001 17.2052 20.5731 14.6992 14.0001 14.6992ZM24.5001 23.0992C24.5001 23.8692 23.8701 24.4992 23.1001 24.4992H4.9001C4.1301 24.4992 3.5001 23.8692 3.5001 23.0992V20.2992C3.5001 17.9822 8.2041 16.0992 14.0001 16.0992C19.7961 16.0992 24.5001 17.9822 24.5001 20.2992V23.0992Z' fill='black'/%3E%3Cpath d='M13.9999 2.10156C10.9059 2.10156 8.3999 4.60756 8.3999 7.70156C8.3999 10.7956 10.9059 13.3016 13.9999 13.3016C17.0939 13.3016 19.5999 10.7956 19.5999 7.70156C19.5999 4.60756 17.0939 2.10156 13.9999 2.10156ZM13.9999 11.9016C11.6829 11.9016 9.7999 10.0186 9.7999 7.70156C9.7999 5.38456 11.6829 3.50156 13.9999 3.50156C16.3169 3.50156 18.1999 5.38456 18.1999 7.70156C18.1999 10.0186 16.3169 11.9016 13.9999 11.9016Z' fill='black'/%3E%3C/svg%3E%0A");}
#renewalHeaderWrap .btn-login { display:flex; flex-shrink:0; width:80px; height:34px; margin-left:24px; border:1px solid #0c0c0c; border-radius:20px; align-items:center; justify-content:center; font-size:14px; color:#0c0c0c; font-weight:600; }
#renewalHeaderWrap .btn-login:hover { color:#fff; background:#0c0c0c; }
#renewalHeaderWrap a:focus-visible,
#renewalHeaderWrap button:focus-visible { outline:2px solid #ff7300; outline-offset:3px; }

/* 카테고리: 기본 답례품 노출, 마우스 오버 및 키보드 포커스로 하위 메뉴 전환 */
#renewalHeaderWrap .categoryMenu { display:none; position:absolute; top:calc(100% - 16px); left:-16px; width:360px; padding:12px 0; border:1px solid #e4e4e4; border-radius:16px; background:#fff; box-shadow:0 24px 32px rgba(0,0,0,.05); }
#renewalHeaderWrap .categoryBox:hover .categoryMenu,
#renewalHeaderWrap .categoryBox:focus-within .categoryMenu { display:block; }
#renewalHeaderWrap .categoryMenu:before { content:''; position:absolute; top:0; bottom:0; left:178px; width:1px; background:#e4e4e4; }
#renewalHeaderWrap .depth1 { display:grid; grid-template-columns:178px 1fr; grid-template-rows:repeat(3, 50px) auto; }
#renewalHeaderWrap .depth1 > li { display:contents; }
#renewalHeaderWrap .btn-depth { position:relative; grid-column:1; width:154px; height:50px; padding:0 12px; margin:0 12px; border-radius:8px; text-align:left; font-size:16px; font-weight:500; color:#0c0c0c; }
#renewalHeaderWrap .depth1 > li:nth-child(1) > .btn-depth { grid-row:1; }
#renewalHeaderWrap .depth1 > li:nth-child(2) > .btn-depth { grid-row:2; }
#renewalHeaderWrap .depth1 > li:nth-child(3) > .btn-depth { grid-row:3; }
#renewalHeaderWrap .depth2 { display:none; grid-column:2; grid-row:1 / 5; padding:0 24px; }
#renewalHeaderWrap .depth2 a,
#renewalHeaderWrap .depth2 .disabled { display:flex; height:50px; align-items:center; white-space:nowrap; font-size:16px; font-weight:500; color:#0c0c0c; }
#renewalHeaderWrap .depth2 a:hover,
#renewalHeaderWrap .depth2 a:focus-visible { color:#ff7300; }
#renewalHeaderWrap .depth2 .disabled { gap:16px; color:#999; cursor:default; }
#renewalHeaderWrap .depth2 .disabled em { padding:1px 5px; border:1px solid #e4e4e4; border-radius:10px; color:#aaa; font-size:10px; line-height:1.4; }
/* [프로젝트 변경] 하위 메뉴 전환 : 퍼블은 마우스 오버/포커스, 고향온은 클릭(선택된 1depth 에 li.on - fragments/theme/renewal.html 스크립트).
   카테고리 메뉴 열기(.categoryBox 마우스 오버)는 퍼블 그대로. 지자체 목록을 보여주는 메뉴(li.renewalMenuWide)는 넓게 */
#renewalHeaderWrap .depth1 > li.on > .depth2 { display:block; }
#renewalHeaderWrap .depth1 > li.on > .btn-depth { color:#ff7300; background:#fff5d9; }
#renewalHeaderWrap .depth1 > li.on > .btn-depth:after { content:''; position:absolute; top:20px; right:20px; width:8px; height:8px; border:1.5px solid currentColor; border-width:1.5px 1.5px 0 0; transform:rotate(45deg); }
#renewalHeaderWrap .categoryMenu:has(.depth1 > li.renewalMenuWide.on) { width:396px; }

/* ==============================
* 리뉴얼 footer (퍼블 common.css "지역 footer" : 퍼블 푸터가 #localFooterWrap 마크업을 사용)
* ============================== */
#localFooterWrap {}
#localFooterWrap #footer { padding-top:60px; border-top:1px solid #E9E9E9;}
#localFooterWrap #footer .textBox { display: flex;}
#localFooterWrap #footer .textBox .left {}
#localFooterWrap #footer .textBox .left .tit { margin-bottom:28px; font-weight:700; line-height: 1; font-size:28px; color:#0c0c0c;}
#localFooterWrap #footer .textBox .left .text { font-size:14px; color:#767676; font-weight: 400;}
#localFooterWrap #footer .textBox .left .copy { margin-top:40px; font-size:14px; color:#767676; font-weight: 400;}
#localFooterWrap #footer .textBox .left .linkGroup { margin-top:20px;}
#localFooterWrap #footer .textBox .left .linkGroup a { display: inline-block; border:1px solid #E9E9E9; border-radius: 4px; padding:6px 12px; font-size:0;}
#localFooterWrap #footer .textBox .left .linkGroup a + a { margin-left:4px;}
#localFooterWrap #footer .textBox .left .linkGroup a span { font-size:12px; color:#767676; font-weight: 400; line-height: 1;}
#localFooterWrap #footer .textBox .left .linkGroup a:hover { border-color:#000;}
#localFooterWrap #footer .textBox .left .linkGroup a:hover span { color:#000;}
#localFooterWrap #footer .textBox .right {}
#localFooterWrap #footer .textBox .right .footerLink { display: flex; gap:40px; border:0; padding:0; justify-content: flex-end;}
#localFooterWrap #footer .textBox .right .footerLink a { font-size:16px; color:#0c0c0c; font-weight: 400;}
#localFooterWrap #footer .textBox .right .footerLink a + a:before { display: none;}
#localFooterWrap #footer .textBox .right .tel { margin-top:50px; text-align: right; font-size:20px; font-weight: 700; line-height: 1;}
#localFooterWrap #footer .textBox .right .text { margin-top:10px; line-height: 1; color:#767676; font-size:14px; font-weight: 400; text-align: right;}


/* ==============================
* 리뉴얼 메인 (퍼블 contents.css)
* ============================== */
#container.renewalWrap { min-width:1320px; padding-top:147px; padding-bottom:200px; font-family:'Pretendard', sans-serif; color:#0c0c0c; font-weight:300; letter-spacing:-0.34px; }
.renewalWrap .section { width:1280px; padding:0; }
.renewalWrap a { color:inherit; }
.renewalWrap button { font-family:inherit; letter-spacing:inherit; }
.renewalWrap [hidden] { display:none !important; }

.renewalWrap .visualWrap .section { display:flex; height:460px; gap:20px; }
.renewalWrap .heroSlider { position:relative; min-width:0; height:460px; }
.renewalWrap .heroVisualSlider { width:880px; flex:0 0 880px; }
.renewalWrap .heroEventSlider { width:380px; flex:0 0 380px; }
.renewalWrap .heroSwiper { overflow:hidden; height:100%; border-radius:24px; touch-action:pan-y; }
/* Swiper 공통 content-box 설정으로 배너 패딩이 슬라이드 폭에 더해지지 않도록 제한 */

.renewalWrap .heroSwiper .swiper-slide { box-sizing:border-box; }
.renewalWrap .heroArrow { display:flex; position:absolute; top:50%; z-index:3; width:52px; height:52px; border:1px solid #e4e4e4; border-radius:50%; align-items:center; justify-content:center; opacity: 0; transition: all .3s ease; background:#fff url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_18231_20942)'%3E%3Cpath d='M8.40002 14.0004C8.40002 14.3574 8.54001 14.7144 8.81301 14.9874L17.213 23.3874C17.759 23.9334 18.648 23.9334 19.194 23.3874C19.74 22.8414 19.74 21.9524 19.194 21.4064L11.781 13.9934L19.194 6.58038C19.74 6.03438 19.74 5.14538 19.194 4.59938C18.648 4.05338 17.759 4.05338 17.213 4.59938L8.81301 12.9994C8.54001 13.2724 8.40002 13.6294 8.40002 13.9864V14.0004Z' fill='%230C0C0C'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_18231_20942'%3E%3Crect width='28' height='28' fill='white' transform='matrix(0 -1 -1 0 28 28)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A") no-repeat center center / 28px;}
.renewalWrap .heroArrow.prev { left:-24px; }
.renewalWrap .heroArrow.next { right:-24px; transform:rotate(180deg); }
.renewalWrap .heroSlider:hover .heroArrow { opacity:1; pointer-events:auto; }
.renewalWrap .heroArrow.swiper-button-lock { display:none; }

.renewalWrap .visualWrap .heroPagination { position:absolute; left:auto; right:28px; bottom:28px; z-index:1; width:auto; min-width:77px; padding:8px 20px; border-radius:21px; color:#fff; font-size:16px; line-height:16px; text-align:center; pointer-events:none; background:rgba(0,0,0,.5); }
.renewalWrap .visualWrap .heroPagination .swiper-pagination-current { font-weight:600; }

.renewalWrap .visualWrap .visual { overflow:hidden; display:block; position:relative; width:880px; height:460px; border-radius:24px; flex-shrink:0; }
.renewalWrap .visualWrap .visual > img { width:880px; height:460px; object-fit:cover; }
.renewalWrap .visualWrap .visual:after { content:''; position:absolute; inset:0; pointer-events: none; background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.5));}

.renewalWrap .visualWrap .textBox { position:absolute; left:48px; bottom:48px; z-index:1; color:#fff; }
.renewalWrap .visualWrap .textBox h2 { font-size:36px; line-height:1.4; font-weight:600; letter-spacing:-0.72px; }
.renewalWrap .visualWrap .textBox p { margin-top:6px; font-size:16px; }

.renewalWrap .visualWrap .heroEvent { display:block; position:relative; width:380px; height:460px; padding:48px 24px; border-radius:24px; text-align:center; background:#ff7e61; }
.renewalWrap .visualWrap .heroEventLabel { display:inline-block; padding:6px 12px; border-radius:12px; font-size:12px; line-height:1; background:#ffe7c5; }
.renewalWrap .visualWrap .heroEvent h2 { margin-top:12px; font-size:30px; line-height:1.4; font-weight:600; }
.renewalWrap .visualWrap .heroEvent p { margin-top:4px; font-size:14px; }
.renewalWrap .visualWrap .heroEventLink { display:inline-block; padding:12px 24px; margin-top:150px; border:1px solid rgba(12,12,12,.25); border-radius:24px; font-size:16px; }

.renewalWrap .renewalLive .section { display:flex; height:74px; padding:24px 40px; margin-top:60px; border:1px solid #e4e4e4; border-radius:38px; align-items:center; gap:24px; font-size:16px; }
.renewalWrap .renewalLive .section > strong { display:flex; align-items:center; gap:4px; color:#ff7300; font-weight:600; white-space:nowrap; }
.renewalWrap .renewalLive .section > strong i { display: inline-block; width:24px; height:24px; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11.9998' cy='12.0008' r='10.2' fill='%23FF7300'/%3E%3Cpath d='M11.9998 13.2008C12.6625 13.2008 13.1998 12.6635 13.1998 12.0008C13.1998 11.338 12.6625 10.8008 11.9998 10.8008C11.3371 10.8008 10.7998 11.338 10.7998 12.0008C10.7998 12.6635 11.3371 13.2008 11.9998 13.2008Z' fill='white'/%3E%3Cpath d='M13.1998 12H10.7998V16.2H13.1998V12Z' fill='white'/%3E%3Cpath d='M11.9998 17.4C12.6625 17.4 13.1998 16.8627 13.1998 16.2C13.1998 15.5373 12.6625 15 11.9998 15C11.3371 15 10.7998 15.5373 10.7998 16.2C10.7998 16.8627 11.3371 17.4 11.9998 17.4Z' fill='white'/%3E%3Cpath d='M11.9998 9.00156C12.6625 9.00156 13.1998 8.4643 13.1998 7.80156C13.1998 7.13882 12.6625 6.60156 11.9998 6.60156C11.3371 6.60156 10.7998 7.13882 10.7998 7.80156C10.7998 8.4643 11.3371 9.00156 11.9998 9.00156Z' fill='white'/%3E%3C/svg%3E%0A");}
.renewalWrap .renewalLive .section > strong:after { content:''; width:1px; height:12px; margin-left:20px; background:#e4e4e4; }
.renewalWrap .renewalLive .regionName { flex:0 0 auto;}
.renewalWrap .renewalLive b { overflow: hidden; margin-right:4px; font-weight:600; text-overflow: ellipsis; white-space: nowrap;}
.renewalWrap .renewalLive .dot { margin:0 8px; flex:0 0 auto; color:#8d8d8d; }
.renewalWrap .renewalLive .rollingLive { position:relative; height:24px; flex:1 1 auto;}
.renewalWrap .renewalLive .rollingLive p { overflow: hidden; display: flex; position:absolute; top:100%; width:100%; visibility: hidden; opacity: 0; transition: all .3s ease;}
.renewalWrap .renewalLive .rollingLive p span { flex:0 0 auto;}
.renewalWrap .renewalLive .rollingLive p b + span { margin-right:10px;}
.renewalWrap .renewalLive .rollingLive p.on { top:0; visibility:visible; opacity: 1;}

.renewalWrap .renewalLive .liveTime { display: inline-block; margin-left:auto; flex:0 0 auto; color:#8d8d8d; white-space:nowrap; }

.renewalWrap .renewalBlock { margin-top:100px; }
.renewalWrap .renewalBlock .renewalPaging { position:relative; z-index:2; margin-top:28px;}

.renewalWrap .renewalHeading { display:flex; min-height:42px; margin-bottom:28px; align-items:center; justify-content:space-between; }
.renewalWrap .renewalHeading h2, 
.renewalWrap .renewalHeading h2 span { font-size:30px; line-height:1.4; font-weight:600; letter-spacing:-0.6px; }
.renewalWrap .renewalHeading .text { margin-top:4px; font-size:16px; font-weight: 300; line-height: 1.5; color:#8D8D8D;}

.renewalWrap .renewalHeading.type2 { display: block;}

.renewalWrap .popularSwiper ~ .renewalPaging { position:static; margin:0;}
.renewalWrap .popularSwiper ~ .renewalPaging button { position:absolute; top:170px; z-index:2;}
.renewalWrap .popularSwiper ~ .renewalPaging button.prev { left:-20px;}
.renewalWrap .popularSwiper ~ .renewalPaging button.next { right:-20px;}


.renewalWrap .renewalPaging { display:flex; align-items:center; justify-content:center; gap:16px; font-size:18px; }
.renewalWrap .renewalPaging button { display:flex; width:40px; height:40px; border:1px solid #e4e4e4; border-radius:50%; align-items:center; justify-content:center; background:#fff url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_18231_20942)'%3E%3Cpath d='M8.40002 14.0004C8.40002 14.3574 8.54001 14.7144 8.81301 14.9874L17.213 23.3874C17.759 23.9334 18.648 23.9334 19.194 23.3874C19.74 22.8414 19.74 21.9524 19.194 21.4064L11.781 13.9934L19.194 6.58038C19.74 6.03438 19.74 5.14538 19.194 4.59938C18.648 4.05338 17.759 4.05338 17.213 4.59938L8.81301 12.9994C8.54001 13.2724 8.40002 13.6294 8.40002 13.9864V14.0004Z' fill='%230C0C0C'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_18231_20942'%3E%3Crect width='28' height='28' fill='white' transform='matrix(0 -1 -1 0 28 28)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A") no-repeat center center / 20px;}
.renewalWrap .renewalPaging .next { transform:rotate(180deg); }
.renewalWrap .renewalPaging strong { font-weight:600; }

.renewalWrap .regionSwiper { overflow:hidden; width:100%; padding-bottom:64px; margin-bottom:-64px; touch-action:pan-y; }
.renewalWrap .renewalRegions { display:flex; gap:0; }
.renewalWrap .regionSwiper .regionCard { width:305px; flex-shrink:0; box-sizing:border-box; }
.renewalWrap .regionCard { overflow:hidden; position:relative; height:360px; border-radius:24px; transition: all .3s ease;}
.renewalWrap .regionCard > a { display:block; height:100%; }
.renewalWrap .regionCard img { width:305px; height:360px; object-fit:cover; }
.renewalWrap .regionCard:after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 20%,rgba(0,0,0,.5)); }
.renewalWrap .regionCard .regionName { position:absolute; left:28px; bottom:32px; z-index:1; font-size:24px; font-weight:600; color:#fff; transition:opacity .25s; }
.renewalWrap .regionCard.preparing:after { background:rgba(0,0,0,.7); }
.renewalWrap .regionCard .preparingLabel { position:absolute; top:162px; left:50%; z-index:1; padding:8px 16px; border-radius:18px; transform:translateX(-50%); white-space:nowrap; font-size:20px; line-height:1; background:#fff; }
.renewalWrap .regionCard .regionInfo { position:absolute; bottom:0; left:0; z-index:2; width:100%; padding:32px 28px; border-radius:24px 24px 0 0; transform:translateY(100%); visibility:hidden; transition:transform .25s, visibility .25s; background:#fff; }
.renewalWrap .regionCard:not(:has(.preparingLabel)):hover, 
.renewalWrap .regionCard:not(:has(.preparingLabel)):focus-within { box-shadow:0 32px 32px rgba(0,0,0,.06); }
.renewalWrap .regionCard:not(:has(.preparingLabel)):hover .regionInfo, 
.renewalWrap .regionCard:not(:has(.preparingLabel)):focus-within .regionInfo { transform:translateY(0); visibility:visible; }
.renewalWrap .regionCard:not(:has(.preparingLabel)):hover .regionName, 
.renewalWrap .regionCard:not(:has(.preparingLabel)):focus-within .regionName,
.renewalWrap .regionCard:not(:has(.preparingLabel)):hover .preparingLabel, 
.renewalWrap .regionCard:not(:has(.preparingLabel)):focus-within .preparingLabel { opacity:0; }

.renewalWrap .regionInfo h3 { font-size:22px; font-weight:600; line-height:32px; }
.renewalWrap .regionInfo h3 .symbol { display: inline-flex; width:32px; height:32px; margin-right:4px; margin-top:-4px; border-radius: 50%; border: 1px solid #E4E4E4; vertical-align: middle; align-items: center; justify-content: center;}
.renewalWrap .regionInfo h3 .symbol img { width:28px; height:27px;}
.renewalWrap .regionInfo p { margin-top:8px; font-size:14px; line-height:1.6; }
.renewalWrap .regionInfo .info { display:block; margin-top:16px; font-size:12px; }
.renewalWrap .regionInfo .info span { font-weight: 600;}
.renewalWrap .regionInfo .info span + span { margin-left:12px; }

.renewalWrap .productSwiper { overflow:hidden; width:100%; touch-action:pan-y; }
.renewalWrap .renewalProducts { display:flex; gap:0; }
.renewalWrap .popularProducts { min-height:411px; }
.renewalWrap .productSwiper .productList { height:auto; box-sizing:border-box; flex-shrink:0; }
.renewalWrap .categoryProducts { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:40px 20px; }
.renewalWrap .categoryProducts > .productList { width:auto; min-width:0; margin:0; box-sizing:border-box; }
.renewalWrap .renewalPaging button.swiper-button-disabled { opacity:.35; cursor:default; }
.renewalWrap .productList { min-width:0; margin:0;}
.renewalWrap .productList > a { display:block; }
.renewalWrap .productList > a:hover .productPhoto > img,
.renewalWrap .productList > a:focus-visible .productPhoto > img { transform: scale(1.05);}
.renewalWrap .productList .productPhoto { overflow:hidden; position:relative; height:240px; border-radius:24px;}
.renewalWrap .productList .productPhoto > img { display:block; width:100%; height:100%; object-fit:cover; transition:all .3s ease;}
.renewalWrap .productList .productPhoto.large { width:305px; height:305px;}
.renewalWrap .productList .productPhoto.size2 { width:250px; height:250px;}
.renewalWrap .productList .viewers { display:flex; position:absolute; inset:0; padding-bottom:16px; justify-content:center; align-items:flex-end; color:#fff; font-size:14px; font-weight:600; background:linear-gradient(180deg,transparent 20%,rgba(0,0,0,.5)); }
.renewalWrap .productList .productInfo { padding:0 4px; margin-top:12px; }
.renewalWrap .productList .productInfo h3 { overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:16px; font-weight:300; line-height:24px; }
.renewalWrap .productList .productInfo .seller { margin-bottom:4px; font-size:12px; color:#8d8d8d; line-height:20px; }
.renewalWrap .productList .productInfo .eventLabel { display:table; padding:4px 6px; margin-bottom:4px; border:1px solid red; border-radius:11px; color:#fff; font-size:11px; font-weight:600; line-height:1; background:#ff3838; }
.renewalWrap .productList .productInfo .donationPrice { display:flex; margin-top:4px; align-items:center; gap:4px; font-size:18px; }
.renewalWrap .productList .productInfo .donationPrice strong { font-weight:800; }
.renewalWrap .productList .productInfo .donationPrice em { padding:6px 12px; border-radius:100px; font-size:12px; font-weight:600; line-height:1; color:#ff7300; background:#fff5d8; }
.renewalWrap .productList .productInfo .productRating, 
.renewalWrap .productList .productInfo .productRegion { display:flex; min-height:22px; align-items:center; font-size:14px; line-height:1.6; }
.renewalWrap .productList .productInfo .productRating { margin-top:8px; }
.renewalWrap .productList .productInfo .productRating:before { content:''; display: inline-block; width:20px; height:20px; margin-right:4px; margin-top:-2px; vertical-align: middle; background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 15.3068L5.91946 17.8792C5.78293 17.9693 5.63882 18.009 5.48712 17.9983C5.33543 17.9877 5.20141 17.9374 5.08505 17.8475C4.9687 17.7575 4.88019 17.6424 4.81951 17.5022C4.75883 17.3618 4.74624 17.2043 4.78174 17.0296L5.8587 12.1627L2.256 8.88361C2.12448 8.76197 2.04484 8.62573 2.01708 8.47488C1.98917 8.32403 1.99546 8.17714 2.03597 8.03423C2.07647 7.89132 2.15232 7.77223 2.26351 7.67695C2.3747 7.58168 2.51631 7.5234 2.68834 7.50212L7.45151 7.06552L9.29461 2.47637C9.3603 2.31758 9.46019 2.19849 9.59429 2.11909C9.72824 2.0397 9.86347 2 10 2C10.1365 2 10.2718 2.0397 10.4057 2.11909C10.5398 2.19849 10.6397 2.31758 10.7054 2.47637L12.5485 7.06552L17.3117 7.50212C17.4837 7.5234 17.6253 7.58168 17.7365 7.67695C17.8477 7.77223 17.9235 7.89132 17.964 8.03423C18.0045 8.17714 18.0108 8.32403 17.9829 8.47488C17.9552 8.62573 17.8755 8.76197 17.744 8.88361L14.1413 12.1627L15.2183 17.0296C15.2538 17.2043 15.2412 17.3618 15.1805 17.5022C15.1198 17.6424 15.0313 17.7575 14.9149 17.8475C14.7986 17.9374 14.6646 17.9877 14.5129 17.9983C14.3612 18.009 14.2171 17.9693 14.0805 17.8792L10 15.3068Z' fill='%23FF7300'/%3E%3C/svg%3E%0A");}
.renewalWrap .productList .productInfo .productRating img, .renewalWrap .productRegion img { margin-right:4px; }
.renewalWrap .productList .productInfo .productRating strong { font-weight:600; }
.renewalWrap .productList .productInfo .productRating span { color:#767676; }
.renewalWrap .productListAll { margin-top:40px; text-align: center;}
.renewalWrap .productListAll a { display: inline-flex; min-width:264px; height:58px; border: 1px solid #E4E4E4; border-radius: 50px; align-items: center; justify-content: center; text-align: center;}
.renewalWrap .productListAll a:after { content:''; display: block; width:14px; height:14px; margin-left:8px; background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_18396_19095)'%3E%3Cpath d='M6.99981 9.80097C6.82131 9.80097 6.64281 9.73097 6.50631 9.59447L2.30631 5.39447C2.03331 5.12147 2.03331 4.67697 2.30631 4.40397C2.57931 4.13097 3.02381 4.13097 3.29681 4.40397L7.00331 8.11047L10.7098 4.40397C10.9828 4.13097 11.4273 4.13097 11.7003 4.40397C11.9733 4.67697 11.9733 5.12147 11.7003 5.39447L7.50031 9.59447C7.36381 9.73097 7.18531 9.80097 7.00681 9.80097H6.99981Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_18396_19095'%3E%3Crect width='14' height='14' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");}

.renewalWrap .productRegion { margin-top:4px; }
.renewalWrap .productRegion:before { content:''; display: inline-block; width:20px; height:20px; margin-right:4px; vertical-align: middle;background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.1772 9.51172C11.5036 9.18533 11.6668 8.79297 11.6668 8.33463C11.6668 7.8763 11.5036 7.48394 11.1772 7.15755C10.8509 6.83116 10.4585 6.66797 10.0002 6.66797C9.54183 6.66797 9.14947 6.83116 8.82308 7.15755C8.49669 7.48394 8.3335 7.8763 8.3335 8.33463C8.3335 8.79297 8.49669 9.18533 8.82308 9.51172C9.14947 9.83811 9.54183 10.0013 10.0002 10.0013C10.4585 10.0013 10.8509 9.83811 11.1772 9.51172ZM10.0002 18.3346C7.76405 16.4319 6.09391 14.6645 4.98975 13.0326C3.88558 11.4006 3.3335 9.89019 3.3335 8.5013C3.3335 6.41797 4.00363 4.75825 5.34391 3.52214C6.68419 2.28602 8.23627 1.66797 10.0002 1.66797C11.7641 1.66797 13.3161 2.28602 14.6564 3.52214C15.9967 4.75825 16.6668 6.41797 16.6668 8.5013C16.6668 9.89019 16.1147 11.4006 15.0106 13.0326C13.9064 14.6645 12.2363 16.4319 10.0002 18.3346Z' fill='%238D8D8D'/%3E%3C/svg%3E%0A");}

.renewalWrap .renewalCategories { display:flex; margin-top:-8px; margin-bottom:28px; align-items:center; }
.renewalWrap .renewalCategories button { display:flex; padding:8px 16px; border:1px solid transparent; border-radius:26px; align-items:center; gap:4px; font-size:16px; line-height:24px; color:#767676; white-space:nowrap; }
.renewalWrap .renewalCategories button.active { border-color:#0c0c0c; color:#0c0c0c; font-weight:600; }
.renewalWrap .renewalCategories button span { font-size:14px; color:#ff7300; }

.renewalWrap .tabList { display:flex; margin-top:48px; margin-bottom:48px; align-items:center; }
.renewalWrap .tabList button { display:flex; padding:8px 16px; border:1px solid transparent; border-radius:26px; align-items:center; gap:4px; font-size:16px; line-height:24px; color:#767676; white-space:nowrap; background:#fff;}
.renewalWrap .tabList button.active { border-color:#0c0c0c; color:#0c0c0c; font-weight:600; }

.renewalWrap .renewalEmpty { padding:100px 0; text-align:center; color:#767676; }
.renewalWrap .renewalCampaigns { overflow:hidden; padding:100px 0; margin-top:100px; background:#f4f4f4; }
.renewalWrap .renewalCampaigns.type2 { overflow:hidden; padding:0 0 120px; margin-top:120px; background:#fff; }
.renewalWrap .renewalMore { display:flex; align-items:center; gap:6px; font-size:16px; font-weight:600; }
.renewalWrap .renewalMore:after { content:''; display: inline-block; width:20px; height:20px; margin-left:6px; vertical-align: middle; background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.5 10.0016C18.5 10.0016 18.5 9.95663 18.5 9.93163C18.5 9.90663 18.49 9.88163 18.48 9.86163C18.475 9.84163 18.475 9.82163 18.465 9.80663C18.465 9.80663 18.465 9.80163 18.46 9.79663C18.45 9.77663 18.435 9.75663 18.425 9.73663C18.41 9.71663 18.4 9.69163 18.38 9.67163C18.38 9.67163 18.38 9.66663 18.375 9.66163L12.375 3.16163C12.19 2.95663 11.87 2.94663 11.67 3.13163C11.465 3.31663 11.455 3.63663 11.64 3.83663L16.865 9.49663H2C1.725 9.49663 1.5 9.72163 1.5 9.99663C1.5 10.0666 1.515 10.1316 1.54 10.1916C1.565 10.2516 1.6 10.3066 1.645 10.3516C1.735 10.4416 1.86 10.4966 2 10.4966H16.86L11.635 16.1566C11.445 16.3616 11.46 16.6766 11.665 16.8616C11.87 17.0466 12.185 17.0366 12.37 16.8316L18.37 10.3316C18.37 10.3316 18.37 10.3266 18.375 10.3216C18.39 10.3016 18.405 10.2816 18.42 10.2566C18.435 10.2366 18.445 10.2166 18.455 10.1966C18.455 10.1966 18.455 10.1916 18.46 10.1866C18.47 10.1666 18.47 10.1466 18.475 10.1316C18.48 10.1066 18.49 10.0816 18.495 10.0566C18.495 10.0316 18.495 10.0116 18.495 9.98663L18.5 10.0016Z' fill='%230D0D0D'/%3E%3C/svg%3E%0A");}
.renewalWrap .campaignViewport { overflow:visible; width:1280px; margin:0 auto; touch-action:pan-y; }
.renewalWrap .campaignTrack { display:flex; width:100%; margin:0; gap:0; }
.renewalWrap .campaignTrack.type2 { display:grid; grid-template-columns:repeat(3,340px); gap:40px 20px; }
.renewalWrap .campaignTrack.type2 li { width:340px; flex:0 0 340px; }
.renewalWrap .campaignTrack.type3 { display:grid; grid-template-columns:repeat(3,400px); gap:40px 40px; }
.renewalWrap .campaignTrack.type3 li { width:400px; flex:0 0 400px; }
.renewalWrap .campaignCard { overflow:hidden; width:400px; height:auto; border-radius:24px; flex:0 0 400px; box-shadow: 0px 32px 32px 0px #0000000A; background:#fff;}
.renewalWrap .campaignCard > a { display:block; }
.renewalWrap .campaignCard.type2 { border-radius: 0; box-shadow: none;}
.renewalWrap .campaignCard.type2 .campaignPhoto { overflow: hidden; border-radius: 24px;}
.renewalWrap .campaignCard.type2 .campaignInfo { height:auto; padding:0; margin-top:20px; background:none;}
.renewalWrap .campaignPhoto { position:relative; height:267px; }
.renewalWrap .campaignPhoto > img { width:400px; height:267px; object-fit:cover; }
.renewalWrap .campaignDeadline { position:absolute; top:20px; left:20px; padding:6px 12px; border-radius:20px; font-size:12px; background:#fff; }
.renewalWrap .campaignInfo { position:relative; height:211px; padding:32px 28px; }
.renewalWrap .campaignInfo h3 { font-size:20px; font-weight:600; line-height:28px; }
.renewalWrap .campaignInfo .text { margin-top:4px; font-size: 14px; font-weight: 300; line-height: 1.6; color:#8D8D8D;}
.renewalWrap .campaignMeta { display:flex; margin-top:8px; align-items:center; gap:4px; font-size:14px; line-height:22px; }
.renewalWrap .campaignMeta:before { content:''; display: inline-block; width:20px; height:20px; vertical-align: middle;background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.1772 9.51172C11.5036 9.18533 11.6668 8.79297 11.6668 8.33463C11.6668 7.8763 11.5036 7.48394 11.1772 7.15755C10.8509 6.83116 10.4585 6.66797 10.0002 6.66797C9.54183 6.66797 9.14947 6.83116 8.82308 7.15755C8.49669 7.48394 8.3335 7.8763 8.3335 8.33463C8.3335 8.79297 8.49669 9.18533 8.82308 9.51172C9.14947 9.83811 9.54183 10.0013 10.0002 10.0013C10.4585 10.0013 10.8509 9.83811 11.1772 9.51172ZM10.0002 18.3346C7.76405 16.4319 6.09391 14.6645 4.98975 13.0326C3.88558 11.4006 3.3335 9.89019 3.3335 8.5013C3.3335 6.41797 4.00363 4.75825 5.34391 3.52214C6.68419 2.28602 8.23627 1.66797 10.0002 1.66797C11.7641 1.66797 13.3161 2.28602 14.6564 3.52214C15.9967 4.75825 16.6668 6.41797 16.6668 8.5013C16.6668 9.89019 16.1147 11.4006 15.0106 13.0326C13.9064 14.6645 12.2363 16.4319 10.0002 18.3346Z' fill='%238D8D8D'/%3E%3C/svg%3E%0A");}
.renewalWrap .campaignMeta span { display:flex; align-items:center; }
.renewalWrap .campaignMeta span:before { content:''; width:1px; height:10px; margin:0 8px; background:#e4e4e4; }
.renewalWrap .campaignFunding { position:absolute; left:28px; right:28px; bottom:32px; }
.renewalWrap .campaignFunding progress { overflow:hidden; display:block; width:100%; height:10px; border:0; border-radius:10px; appearance:none; background:#f4f4f4; }
.renewalWrap .campaignFunding progress::-webkit-progress-bar { border-radius:10px; background:#f4f4f4; }
.renewalWrap .campaignFunding progress::-webkit-progress-value { border-radius:10px; background:#ff7300; }
.renewalWrap .campaignFunding progress::-moz-progress-bar { border-radius:10px; background:#ff7300; }
.renewalWrap .campaignFunding p { display:flex; margin-top:4px; justify-content:space-between; font-size:18px; line-height:27px; }
.renewalWrap .campaignFunding strong { color:#ff7300; font-weight:600; }
.renewalWrap .campaignFunding b { font-weight:600; }
.renewalWrap .renewalCampaigns .renewalPaging { margin-top:40px; }
.renewalWrap .renewalReviews { margin-top:100px; }
/* 포토후기 : 8건(4열 x 2행) 블럭 단위 슬라이드 */
.renewalWrap .reviewGrid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:20px; }
.renewalWrap .renewalReviews .renewalPaging { margin-top:40px; }
.renewalWrap .reviewCard { display:flex; padding:28px; border:1px solid #e4e4e4; border-radius:24px; flex-direction:column; gap:28px; }
.renewalWrap .reviewTop { display:flex; align-items:center; justify-content:space-between; font-size:14px; }
.renewalWrap .reviewTop time { margin-left:8px; }
.renewalWrap .reviewStars { display:flex; width:100px; align-items:center; }
.renewalWrap .reviewStars:before { content:''; display: inline-block; width:100%; height:20px; vertical-align: middle; background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 15.3068L5.91946 17.8792C5.78293 17.9693 5.63882 18.009 5.48712 17.9983C5.33543 17.9877 5.20141 17.9374 5.08505 17.8475C4.9687 17.7575 4.88019 17.6424 4.81951 17.5022C4.75883 17.3618 4.74624 17.2043 4.78174 17.0296L5.8587 12.1627L2.256 8.88361C2.12448 8.76197 2.04484 8.62573 2.01708 8.47488C1.98917 8.32403 1.99546 8.17714 2.03597 8.03423C2.07647 7.89132 2.15232 7.77223 2.26351 7.67695C2.3747 7.58168 2.51631 7.5234 2.68834 7.50212L7.45151 7.06552L9.29461 2.47637C9.3603 2.31758 9.46019 2.19849 9.59429 2.11909C9.72824 2.0397 9.86347 2 10 2C10.1365 2 10.2718 2.0397 10.4057 2.11909C10.5398 2.19849 10.6397 2.31758 10.7054 2.47637L12.5485 7.06552L17.3117 7.50212C17.4837 7.5234 17.6253 7.58168 17.7365 7.67695C17.8477 7.77223 17.9235 7.89132 17.964 8.03423C18.0045 8.17714 18.0108 8.32403 17.9829 8.47488C17.9552 8.62573 17.8755 8.76197 17.744 8.88361L14.1413 12.1627L15.2183 17.0296C15.2538 17.2043 15.2412 17.3618 15.1805 17.5022C15.1198 17.6424 15.0313 17.7575 14.9149 17.8475C14.7986 17.9374 14.6646 17.9877 14.5129 17.9983C14.3612 18.009 14.2171 17.9693 14.0805 17.8792L10 15.3068Z' fill='%23FF7300'/%3E%3C/svg%3E%0A");}
.renewalWrap .reviewStars.star1:before { width:20px;}
.renewalWrap .reviewStars.star2:before { width:40px;}
.renewalWrap .reviewStars.star3:before { width:60px;}
.renewalWrap .reviewStars.star4:before { width:80px;}
.renewalWrap .reviewStars.star5:before { width:100px;}
.renewalWrap .reviewQuote { overflow:hidden; display:-webkit-box; height:54px; margin-top:28px; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:18px; line-height:27px; font-weight:600; }
.renewalWrap .reviewProduct { display:flex; padding-top:28px; border-top:1px solid #e4e4e4; gap:16px; align-items:center; }
.renewalWrap .reviewProduct > img { width:80px; height:80px; border-radius:16px; flex-shrink:0; object-fit:cover; }
.renewalWrap .reviewProduct div { min-width:0; flex:1; }
.renewalWrap .reviewProduct span { font-size:14px; color:#8d8d8d; }
.renewalWrap .reviewProduct h3 { margin-top:4px; font-size:16px; line-height:1.6; font-weight:300; }

.renewalWrap .renewalBanner li + li { margin-top:20px;}
.renewalWrap .renewalBanner li a { overflow: hidden; display: flex; height:220px; border-radius: 24px; align-items: center; justify-content: center; background:#D9D9D9;}
.renewalWrap .renewalBanner li img { width:100%; height:220px; object-fit: cover;}



/* ==============================
* 프로젝트 추가 (퍼블 외)
* ============================== */
/* 히어로: 진행중 이벤트가 없으면 메인 비주얼이 전체 폭(1280)을 사용(heroFull), 이미지 배너는 하단 그라데이션 없음 */
.renewalWrap .heroVisualSlider.heroFull { width:1280px; flex:0 0 1280px; }
.renewalWrap .heroFull .visual,
.renewalWrap .heroFull .visual > img { width:100%; }
.renewalWrap .visualWrap .visual.imgOnly:after { display:none; }
/* 상품 0건: 영역 크기를 유지한 빈 목록 안내 */
.renewalWrap .renewalProdEmpty { display:flex; align-items:center; justify-content:center; border-radius:24px; background:#f7f7f7; color:#8d8d8d; font-size:16px; text-align:center; }
.renewalWrap .renewalProdEmpty.swipe { min-height:411px; }
.renewalWrap .renewalProdEmpty.grid { min-height:432px; }
/* 포토후기 상세 팝업 (#popReviewDetail.renewalReviewPop) : 서구청 TPC 후기 팝업과 같은 모양 + 상품명/상품 링크 */
.renewalReviewPop .layerPopCont { max-width:960px; }
.renewalReviewPop .reviewVisualBox { flex:0 0 440px; width:440px; }
.renewalReviewPop .reviewVisualBox .mainImg img { width:440px; height:440px; object-fit:cover; border-radius:8px; background:#D9D9D9; }
.renewalReviewPop .thumbnailBox { display:flex; gap:8px; margin-top:8px; }
.renewalReviewPop .thumbnailBox a { display:block; position:relative; width:68px; height:68px; border-radius:8px; background:#D9D9D9; }
.renewalReviewPop .thumbnailBox a img { width:100%; height:100%; border-radius:8px; object-fit:cover; }
.renewalReviewPop .thumbnailBox a:after { content:''; display:none; position:absolute; top:0; left:0; right:0; bottom:0; border-radius:8px; border:2px solid #000; }
.renewalReviewPop .thumbnailBox a.on:after { display:block; }
.renewalReviewPop .reviewProdNm { font-size:18px; font-weight:600; line-height:1.5; color:#0c0c0c; }
.renewalReviewPop .reviewProdLink { margin-top:20px; }
.renewalReviewPop .reviewProdLink a { display:inline-flex; height:44px; padding:0 20px; border:1px solid #0c0c0c; border-radius:22px; align-items:center; font-size:15px; font-weight:600; color:#0c0c0c; }
/* Swiper 5.x(전역) 호환: 컨테이너 기준 위치 */
.renewalWrap .swiper-container { position:relative; z-index:1; }
/* 이벤트 배너: 이벤트 관리의 PC 이미지가 있으면 이미지로 노출 */
.renewalWrap .visualWrap .heroEvent.hasImage { overflow:hidden; padding:0; background:none; }
.renewalWrap .visualWrap .heroEvent.hasImage > img { display:block; width:100%; height:100%; object-fit:cover; }