/***********************************************
메인비주얼
***********************************************/
.br-block{display: none;}

.main-visual { width: 100%; background: #fff; } 
.main-visual-swiper { width: 100%; height: auto; min-height: 0; max-height: none; position: relative; overflow: hidden; background: #fafafa } 
.main-visual-swiper .swiper-slide { height: auto; } 
.main-visual-inner { max-width: 1440px; margin: 0 auto; width: 100%; padding: 0 22px; } 

.mv-title { font-size: 44px; line-height: 1.3; letter-spacing: -0.7px; font-weight: 700; color: #111; word-break: keep-all; } 
.mv-desc { margin-top: 16px; font-size: 16px; line-height: 1.8; color: #555; font-weight: 650; word-break: keep-all; } 
.mv-cta { margin-top: 28px; display: flex; gap: 12px; flex-wrap: wrap; } 
.mv-btn { height: 50px; padding: 0 20px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 600; border: 1px solid transparent; } 
.mv-btn.primary { color: #fff; background: linear-gradient(90deg, #2563eb, #3b82f6); } 
.mv-btn.ghost { color: #2563eb; background: #eff6ff; border-color: #cfe1ff; } 
.mv-media { width: 100%; aspect-ratio: 3 / 1; overflow: hidden; } 
.mv-img { width: 100%; height: 100%; object-fit: cover; object-position: center; display:block; } 


/* arrows */
.mv-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 999px; border: 1px solid #ededed; background: rgba(255,255,255,0.92); box-shadow: 0 10px 24px rgba(0,0,0,.10); cursor: pointer; font-size: 26px; line-height: 44px; text-align: center; color: #111; z-index: 10; } 
.mv-prev { left: 14px; } 
.mv-next { right: 14px; } 

.mv-pagination { position: absolute; left: 0; right: 0; bottom: 50px !important; display: flex; justify-content: center; z-index: 10; } 
.mv-pagination .swiper-pagination-bullet { width: 8px; height: 8px; opacity: 1; background: rgba(17,17,17,.18); border-radius: 999px; transition: width .2s ease, background .2s ease; } 
.mv-pagination .swiper-pagination-bullet-active { width: 22px; background: rgba(37,99,235,.85); } 

@media screen and (max-width: 1380px) {.mv-img { object-fit: cover; } 
}
@media screen and (max-width: 1024px) {
.mv-title { font-size: 40px; } 
.mv-illu { width: 460px; max-height: 380px; } 
}

@media screen and (max-width: 768px) {
.main-visual-swiper { height: auto; min-height: 0; max-height: none; } 
.main-visual-inner { padding: 0 16px; } 

.mv-title { font-size: 34px; } 
.mv-media { height: auto; } 
.mv-illu { width: 100%; max-width: 520px; height: 100%; } 
.mv-arrow { display: none; } 
.mv-pagination { bottom: 15px !important } 
}

@media screen and (max-width: 500px) {
.main-visual-swiper { height: auto;  max-height: none; } 
.main-visual-inner{}
.mv-title { font-size: 25px; } 
.mv-btn { height: 46px; padding: 0 18px; } 
}
@media screen and (max-width: 430px) {

}


/***********************************************
베스트 상품권
***********************************************/

.best-gift { position: relative; overflow: hidden; background: linear-gradient(90deg, #2563eb 0%, #3b82f6 55%, #cfe1ff 100%); padding: 56px 0; } 

/* background layer */
.best-gift-bg { position:absolute; inset:0; pointer-events:none; } 

.best-gift-watermark { position:absolute; left: -40px; top: 50%; transform: translateY(-50%); font-size: 210px; font-weight: 900; letter-spacing: 10px; color: rgba(255,255,255,0.10); user-select:none; } 

.best-gift-marquee { position:absolute; left:0; right:0; bottom: 16px; height: 28px; overflow:hidden; opacity: .35; } 

.best-gift-marquee .track { display:flex; gap: 40px; white-space: nowrap; animation: bestMarquee 13s linear infinite; padding-left: 18px; } 
.best-gift-marquee span { color: rgba(255,255,255,0.72); font-weight: 900; letter-spacing: 2px; font-size: 13px; } 

@keyframes bestMarquee {from { transform: translateX(0); } 
to { transform: translateX(-50%); } 
}

/* dots */
.best-dot { position:absolute; width: 6px; height: 6px; border-radius: 999px; background: rgba(255,255,255,0.9); opacity:.55; animation: bestDot 4.2s ease-in-out infinite; } 
.best-dot.d1 { right: 26%; top: 22%; animation-delay: 0s; } 
.best-dot.d2 { right: 34%; top: 42%; animation-delay: .9s; } 
.best-dot.d3 { right: 18%; top: 30%; animation-delay: 1.6s; } 

@keyframes bestDot { 0%,100% { transform: translateY(0); opacity:.35; } 
50% { transform: translateY(-10px); opacity:.75; } 
}

/* inner layout */
.best-gift-inner { max-width: 1440px; margin: 0 auto; padding: 0 22px; position: relative; z-index: 2; display:grid; grid-template-columns: 1.25fr 1.05fr; gap: 55px; align-items: center; } 

/* head */
.best-eyebrow { font-size: 12px; font-weight: 900; letter-spacing: 2px; color: rgba(255,255,255,0.88); } 

.best-title { margin-top: 10px; font-size: 44px; line-height: 1.12; letter-spacing: -0.6px; font-weight: 800; color:#fff; } 

.best-sub { margin-top: 12px; font-size: 18px; line-height: 1.7; font-weight: 600; color: rgba(255,255,255,0.82); max-width: 480px;  word-break: keep-all;} 

.best-actions { margin-top: 22px; display:flex; gap: 12px; flex-wrap: wrap; } 

.best-btn { height: 46px; padding: 0 18px; border-radius: 999px; display:inline-flex; align-items:center; justify-content:center; font-size: 16px; font-weight: 600; border: 1px solid transparent; } 

.best-btn.primary { color:#111; background: rgba(255,255,255,0.95); } 
.best-btn.ghost { color:#fff; background: rgba(255,255,255,0.14); border-color: rgba(255,255,255,0.18); } 

/* cards layout */
.best-cards { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; } 

/* card */
.best-card2 { position: relative; border-radius: 18px; padding: 18px 18px 16px; min-height: 280px; overflow:hidden; /* glassy */
background: rgba(255,255,255,1); border: 1px solid rgba(255,255,255,0.65); box-shadow: 0 18px 44px rgba(0,0,0,0.18); transform: translateY(0); transition: transform .18s ease, box-shadow .18s ease; } 

.best-card2:hover { transform: translateY(-3px); box-shadow: 0 22px 52px rgba(0,0,0,0.22); } 


.best-card2:nth-child(1) { } 
.best-card2:nth-child(2) { } 
.best-card2:nth-child(3) { } 

/* top pills */
.best-card2-top { display:flex; gap: 8px; align-items:center; } 

.pill { font-size: 11px; font-weight: 900; color:#ff3b30; background: rgba(255,59,48,0.10); border: 1px solid rgba(255,59,48,0.16); padding: 6px 10px; border-radius: 999px; } 

.tag { font-size: 11px; font-weight: 900; color:#111; background: rgba(17,17,17,0.06); border: 1px solid rgba(17,17,17,0.10); padding: 6px 10px; border-radius: 999px; } 

.best-card2-name { margin-top: 12px; font-size: 18px; font-weight: 700; color:#111; letter-spacing: -0.2px; line-height: 1.25; word-break: keep-all; } 

.best-card2-desc { margin-top: 8px; font-size: 15px; font-weight: 600; color:#6b7280; } 

.best-card2-cta { margin-top: 12px; display:inline-flex; align-items:center; gap:6px; font-size: 13px; font-weight: 800; color:#2563eb; letter-spacing: -0.1px; }
.best-card2-cta::after { content:'›'; font-size: 15px; line-height: 1; }
.best-card2:hover .best-card2-cta { color:#1d4ed8; }

/* logo area */
.best-card2-logo { position:absolute; left: 18px; bottom: 18px; font-weight: 900; letter-spacing: 1px; opacity: .95; } 

.lg-culture { color:#ff3b30; font-size: 16px; line-height: 1.05; } 
.lg-google { color:#111; font-size: 16px; } 
.lg-soop { color:#111; font-size: 22px; } 

/* arrow */
.best-card2-go { position:absolute; right: 14px; top: 14px; width: 34px; height: 34px; border-radius: 999px; display:flex; align-items:center; justify-content:center; background: rgba(37,99,235,0.10); color:#2563eb; font-weight: 900; } 

/* shine */
.best-card2 .shine { position:absolute; inset:-20%; background: linear-gradient(120deg, transparent 40%, rgba(255,255,255,0.55) 50%, transparent 60%); transform: translateX(-60%) rotate(6deg); opacity: 0; transition: opacity .2s ease; pointer-events:none; } 
.best-card2:hover .shine { opacity: 1; animation: shineMove .9s ease; } 
@keyframes shineMove {from { transform: translateX(-60%) rotate(6deg); } 
to { transform: translateX(40%) rotate(6deg); } 
}

/* floating motion (subtle) */
.best-card2:nth-child(1) { animation: floatCard 4.6s ease-in-out infinite; } 
.best-card2:nth-child(2) { animation: floatCard 4.6s ease-in-out infinite; animation-delay: .6s; } 
.best-card2:nth-child(3) { animation: floatCard 4.6s ease-in-out infinite; animation-delay: 1.2s; } 
@keyframes floatCard { 0%,100% { transform: translateY(0); } 
50% { transform: translateY(-8px); } 
}

/* reduce motion */
@media (prefers-reduced-motion: reduce) {.best-gift-marquee .track,
.best-card2 { animation: none !important; } 
}


@media screen and (max-width: 1024px) {.best-gift-inner { grid-template-columns: 1fr; gap: 20px; } 
.best-title { font-size: 38px; } 
.best-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } 
.best-gift-watermark { font-size: 160px; left: -24px; } 

.best-gift-inner > :nth-child(1) { order: 2; } 

.best-gift-inner > :nth-child(2) { order: 1; } 
}

@media screen and (max-width: 768px) {.best-gift { padding: 46px 0; } 
.best-title { font-size: 32px; } 
.best-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } 

.best-gift-inner { padding: 0 16px; } 

}

@media screen and (max-width: 480px) {
.mo-box{}
.best-cards { grid-template-columns: 1fr; } 
.best-card2 { min-height: 220px; } 
.best-gift-watermark { font-size: 120px; } 


/* 모바일에서 로고 오른쪽으로 */
.best-card2{display: flex; justify-content: space-between; align-items: center; min-height: 160px; padding-top: 10px 18px 18px; }
.best-card2 .shine{display: none;}
.best-card2-logo{position: static;}
.best-card2-logo .br-none{display: none;}
.lg-culture{font-size:12px;}
}

/* @media screen and (max-width: 360px) {
  .best-card2{flex-direction: column;  align-items: flex-start;}
} */

/***********************************************
모바일 상품권
***********************************************/
.gift-vertical { background:#fff; padding: 24px 0 84px; } 

/* shared inner */
.gift-v-inner { max-width: 1440px; margin: 0 auto; padding: 0 22px; word-break: keep-all; } 


.gift-v-head { position: relative; overflow: hidden; /* border-top: 1px solid #f1f1f1; */ /* border-bottom: 1px solid #f1f1f1; */ padding: 52px 0 46px; background: #ffffff; } 
.gift-v-bg { position:absolute; inset:0; pointer-events:none; } 
.gift-v-watermark { position:absolute; right: 24px; top: 50%; transform: translateY(-50%); font-size: 120px; font-weight: 900; letter-spacing: 4px; color: rgba(37,99,235,0.06); white-space: nowrap; } 
.gift-v-marquee { position:absolute; left:0; right:0; bottom: 16px; height: 26px; overflow:hidden; opacity: .35; } 
.gift-v-marquee .track { display:flex; gap: 36px; white-space: nowrap; animation: gvMarquee 14s linear infinite; padding-left: 20px; } 
.gift-v-marquee span { color: rgba(37,99,235,0.55); font-weight: 900; letter-spacing: 2px; font-size: 13px; } 

@keyframes gvMarquee {from { transform: translateX(0); } 
to { transform: translateX(-50%); } 
}

.gift-v-dot { position:absolute; width: 200px; height: 200px; opacity: .8; animation: gvDot 4.6s ease-in-out infinite; background-position: center center; background-size: cover; background-repeat: no-repeat; } 
/* .gift-v-dot.d1 { left: 18%; top: 28%; animation-delay: .0s; } */
.gift-v-dot.d2 { left: 42%; top: 2%; background-image: url(../../images/main/obj2.png); } 
.gift-v-dot.d3 { right: 12%; top: 42%; background-image: url(../../images/main/obj1.png); } 

@keyframes gvDot { 0%,100% { transform: translateY(0); opacity:.25; } 
50% { transform: translateY(-10px); opacity:.55; } 
}

/* head copy */
.gift-v-eyebrow { font-size: 28px; font-weight: 900; color: rgba(37,99,235,0.9); letter-spacing: 2px; } 
.gift-v-title { margin-top: 10px; font-size: 40px; line-height: 1.1; letter-spacing: -0.6px; font-weight: 800; color:#111; } 
.gift-v-desc { margin-top: 12px; font-size: 18px; line-height: 1.8; color:#666; font-weight: 600; max-width: 640px; word-break: keep-all;} 
.gift-v-actions { margin-top: 22px; display:flex; gap: 12px; flex-wrap: wrap; } 
.gift-v-btn { height: 46px; padding: 0 18px; border-radius: 999px; display:inline-flex; align-items:center; justify-content:center; font-size: 16px; font-weight: 600; border: 1px solid transparent; } 
.gift-v-btn.primary { background: linear-gradient(90deg, #2563eb, #3b82f6); color:#fff; } 
.gift-v-btn.ghost { background: #eff6ff; color:#2563eb; border-color: #cfe1ff; } 


.gift-v-body { margin-top: 34px; } 
.gift-v-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; } 
.gift-v-card { border: 1px solid #ededed; border-radius: 16px; background:#fff; box-shadow: 0 14px 30px rgba(0,0,0,0.06); padding: 18px; position: relative; transition: transform .18s ease, box-shadow .18s ease; } 
.gift-v-card:hover { transform: translateY(-2px); box-shadow: 0 18px 36px rgba(0,0,0,0.08); } 
.gift-v-thumb { width: 100%; /* min-height: 170px; */ aspect-ratio:2 / 1; border-radius: 14px; flex: 0 0 auto; box-shadow: 0 10px 22px rgba(0,0,0,0.08); } 

/* thumbnail placeholders */
.gift-v-thumb.t1 { background: linear-gradient(135deg, rgba(255,59,48,0.92), rgba(255,128,110,0.72)); } 
.gift-v-thumb.t2 { background: linear-gradient(135deg, rgba(255,59,48,0.88), rgba(255,170,120,0.70)); } 
.gift-v-thumb.t3 { background: linear-gradient(135deg, #111, #2c2c2c); } 
.gift-v-thumb.t4 { background:
linear-gradient(135deg, #fff, #f3f4f6),
radial-gradient(circle at 35% 45%, rgba(255,200,0,0.35) 0 32px, transparent 33px); border: 1px solid #ededed; } 

.gift-v-meta { flex: 1; min-width: 0; padding-top: 2px; } 
.gift-v-name { font-size: 20px; font-weight: 700; margin-top: 12px; color:#111; white-space: nowrap; overflow:hidden; text-overflow: ellipsis; } 
.gift-v-sub { margin-top: 8px; font-size: 16px; font-weight: 600; color:#7a7a7a; } 
.gift-v-arrow { width: 34px; height: 34px; border-radius: 999px; display:inline-flex; align-items:center; justify-content:center; background: rgba(37,99,235,0.10); color:#2563eb; font-weight: 900; flex: 0 0 auto; margin-top: 2px; } 


@media screen and (max-width: 1024px) {.gift-v-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); /* 태블릿: 2x2 */ } 
.gift-v-title { font-size: 36px; } 


.gift-v-dot { width: 100px; height: 100px; } 
.gift-v-watermark { top: 93%; font-size: 65px; } 
.gift-v-dot.d2 { left: auto; right: 0; bottom: 44px; top: auto; } 
.gift-v-dot.d3 { right: 97px; bottom: 54px; left: auto; } 
}

@media screen and (max-width: 768px){
.gift-v-inner { padding: 0 16px; } 
.gift-vertical { padding: 40px 0 30px; } 
.gift-v-head { padding: 40px 0 36px; } 
.gift-v-title { font-size: 30px; } 
.gift-v-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); /* 모바일: 2열 */
gap: 14px; } 
.gift-v-card { padding: 16px; } 


.gift-v-dot { width: 60px; height: 60px; } 
.gift-v-dot.d2 { left: auto; right: 0; bottom: 60px; top: auto; } 
.gift-v-dot.d3 { right: 80px; bottom: 20px; left: auto; top: auto; } 

.gift-v-watermark { font-size: 48px; } 
}

@media screen and (max-width: 480px) {
  .gift-v-name { font-size: 16px; } 
  .gift-v-watermark{font-size: 36px; top: 95%;}
  .gift-v-body{margin-top: 10px;}
  .gift-v-grid{grid-template-columns: repeat(2, minmax(0, 1fr));}
}


@media screen and (max-width: 360px) {.gift-v-inner { padding: 0 16px; } 
.gift-v-title { font-size: 28px; } 
}


/***********************************************
공지사항 / 고객센터 배너
***********************************************/
.notice-section { background:#fff; padding: 64px 0; } 

.notice-wrap { max-width: 1440px; margin: 0 auto; padding: 0 22px; display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 24px; } 

/* card base */
.notice-card,
.cs-card { background:#fff; border: 1px solid #ededed; border-radius: 16px; box-shadow: 0 14px 30px rgba(0,0,0,0.06); } 

/* LEFT : notice */
.notice-card { padding: 26px 26px 18px; } 
.notice-head { display:flex; align-items:center; justify-content:space-between; gap: 12px; } 
.notice-title { font-size: 26px; font-weight: 700; color:#111; letter-spacing: -0.3px; } 
.notice-more { width: 34px; height: 34px; border-radius: 999px; display:inline-flex; align-items:center; justify-content:center; background:#2563eb24;; color:#2563eb; font-weight: 900; } 
.notice-more i { font-weight: 600; } 
.notice-line { height: 1px; margin-top: 16px; background: #2563eb; opacity: .9; } 
.notice-list { margin-top: 16px; display:flex; flex-direction: column; gap: 2px; } 
.notice-link { display:flex; align-items:center; justify-content:space-between; gap: 18px; padding: 14px 6px; border-radius: 12px; } 
.notice-link:hover { background: #f8fafc; } 
.notice-text { font-size: 16px; font-weight: 600; color:#111; line-height: 1.45; /* overflow:hidden; text-overflow:ellipsis; white-space:nowrap; */ max-width: 100%; word-break: keep-all; } 
.notice-text .tag-pin { display: inline-flex; align-items: center; justify-content: center; height: 24px; padding: 0 10px; border-radius: 999px; background: rgba(37,99,235,0.12); color: #2563eb; font-size: 12px; font-weight: 900; vertical-align: middle; }

.notice-date { font-size: 13px; font-weight: 700; color:#8b8b8b; flex: 0 0 auto; } 

/* RIGHT : cs column */
.cs-col { display:flex; flex-direction: column; gap: 18px; } 
.cs-card { padding: 22px; display:flex; align-items:center; justify-content:space-between; gap: 16px; min-height: 187px; } 
.cs-ico { width: 66px; height: 66px; border-radius: 16px; background: #2563eb24; display:flex; align-items:center; justify-content:center; flex: 0 0 auto; } 
.cs-ico svg { width: 32px; height: 32px; fill: #2563eb; } 
.cs-copy { flex: 1; min-width: 0; } 
.cs-title { font-size: 18px; font-weight: 700; color:#111; letter-spacing: -0.2px; } 
.cs-strong { color:#2563eb; } 
.cs-desc { margin-top: 10px; font-size: 16px; line-height: 1.6; color:#6b7280; font-weight: 600; } 
.cs-more { width: 34px; height: 34px; border-radius: 999px; display:inline-flex; align-items:center; justify-content:center; background: #2563eb24; color:#2563eb; font-weight: 900; flex: 0 0 auto; } 
.cs-more i { font-weight: 600; } 
.cs-card:hover { transform: translateY(-1px); box-shadow: 0 18px 36px rgba(0,0,0,0.08); transition: transform .2s ease, box-shadow .2s ease; } 

@media screen and (max-width: 1024px) {
.notice-wrap { grid-template-columns: 1fr; } 
}
@media screen and (max-width: 768px){
.notice-wrap{padding: 0 16px;}
}


@media screen and (max-width: 480px) {
.notice-section { padding: 46px 0; } 
.notice-card { padding: 20px 18px 12px; } 
.cs-card { padding: 18px; min-height: auto; } 
.notice-title { font-size: 20px; } 
.cs-title { font-size: 16px; line-height: 1.5;} 
.notice-text { font-size: 14px; } 
.notice-date { font-size: 11px; } 
.cs-desc { font-size: 13px; word-break: keep-all;} 
.notice-link { padding: 7px 6px; flex-direction: column; align-items: flex-start; } 
.cs-title .br-block{display: block;}
.cs-desc .br-block{display: block;}
}