/* BASIC css start */
/* 롤링배너 */
.sliderWrap{padding-bottom:0px;}
.sliderArea{position:relative;max-width:100%;}
.sliderArea .bx-viewport a{display:block;}
.sliderArea img{width:100%;}
.sliderArea .bx-pager{position:absolute;bottom:15px;left:0;right:0;z-index:60;text-align:center;}
.sliderArea .bx-pager-item{transition:all 0.3s ease;display:inline-block;position:relative;}
.sliderArea .bx-pager-link{display:inline-block;width:23px;height:5px;background-color:rgba(255,255,255,0.5);font-size:0;margin:2px;}
.sliderArea .bx-pager-link.active{background-color:#fff;}
.sliderArea .bx-controls{}
.sliderArea .bx-controls-direction{position:absolute;top:50%;left:0;right:0;z-index:60;text-align:center;}
.sliderArea .bx-prev, .sliderArea .bx-next{position:absolute;top:0;margin-top:-15px;font-size:24px;color:#fff;display:inline-block;width:30px;height:30px;vertical-align:middle;box-sizing:border-box;border:1px solid transparent;}
.sliderArea .bx-prev{left:1px;}
.sliderArea .bx-next{right:1px;}
.sliderArea .bx-prev i, .sliderArea .bx-next i{vertical-align:top;padding-top:3px;}

/* 메인 category */
.main .mnCate{border-top:1px solid #e1e1e1;}
.main .mnCate .listWrap{display:table;table-layout:fixed;width:100%;border-bottom:1px solid #e1e1e1;}
.main .mnCate .list{display:table-cell;width:25%;border-left:1px solid #e1e1e1;text-align:center;height: 32px;}
.main .mnCate .list:first-child{border-left:0;}
.main .mnCate .link{padding: 5px 0;display:block;height:100%;}
.main .mnCate .link:after{content:"";display:inline-block;height:100%;vertical-align:middle;}
.main .mnCate .link .title{display:inline-block;vertical-align:middle;line-height:1.1;word-break:break-word;font-size:11px;}

/* 배너 영역 */
.banArea { zoom: 1; overflow: hidden; position:relative; margin: 40px 2% 0;}
.banArea:after{content:""; clear:both; display:block; }
.banArea li{width: 48%;  float: left; padding: 0px 1% 2%;}
.banArea li a { /*display: block; margin: 5% auto;*/}
.banArea li a img { width:100%; }



/* OUR BRAND PRODUCT */

#spProduct{ position:relative; overflow:hidden;  padding: 0% 0 10%;}
#spProduct .best-container .swiper-slide { margin-left:10px; width:60%; padding:10px 5px;}
#spProduct .best-container .swiper-slide a { display:block; padding:4px }
#spProduct .best-container .swiper-slide .listPic { width:100% }
#spProduct .best-container .swiper-slide .list_shoppingInfo { min-height: 90px; }
#spProduct .best-container .swiper-slide .list_shoppingInfo .listName { padding-top:10px; font-size:12px; color:#555 }
#spProduct .best-container .swiper-pagination-fraction { bottom:21px;}





/* tabProduct */
#tabProduct {visibility:hidden;position:relative;}
#tabProduct .tabCate_prod { position:relative }
#tabProduct .tabCate_prod .tabCateTab {zoom: 1;overflow: hidden;text-align:center; }
#tabProduct .tabCate_prod .tabCateTab li{ display:inline-block;/*margin: 0 3%; */}
#tabProduct .tabCate_prod .tabCateTab li a {display:block;height: 34px;font-size: 13px;color:#777; background:#fff; border:1px solid #ddd; border-radius: 34px; text-align:center;line-height: 34px;text-overflow: clip;white-space: nowrap;overflow: hidden; padding:0 10px;}
#tabProduct .tabCate_prod .tabCateTab li a.active { color:#fff; background:#444; border:0; font-weight:bold;  border-radius: 34px }
#tabProduct .tabCate_prod .tabCateList {position:relative;padding: 15px 0;}
#tabProduct .tabCate_prod .tabCateList a {display:block;padding:0 2px;}
#tabProduct .tabCate_prod .slideList .item-cont { padding: 0 4px; }
#tabProduct .tabCate_prod .slideList ul { zoom:1; overflow:hidden;}
#tabProduct .tabCate_prod .slideList li.itemWrap {float: left;position:relative;width: 50%;padding: 0 2px 16px;box-sizing:border-box; }
#tabProduct .tabCate_prod .slideList li.itemWrap2 {width: 33.33% !important;}
#tabProduct .tabCate_prod .slideList li .thumb img {width:100%;}
#tabProduct .tabCate_prod .prd-info-bx {left:0;right:0;text-align:left;margin-top: 5px; min-height:110px;}
#tabProduct .tabCate_prod .prd-info-bx .prd-info {background:#fff;opacity:0.8;filter:alpha(opacity=80);padding: 2px 0;}
#tabProduct .tabCate_prod .prd-info-bx .prd-price del {color:#999;font-weight: normal;font-size: 12px;margin-right: 4px;}
#tabProduct .tabCate_prod .prd-info-bx .prd-price {font-weight: bold;color: #292929; margin:6px 0;}
#tabProduct .tabCate_prod .prd-info-bx .prd-name{padding:5px 0px;color:#2e2e2e; font-weight:bold;font-size:14px;}
#tabProduct .tabCate_prod .prd-info-bx .subname{padding-bottom:5px; color:#787878; }
#tabProduct .tabCate_prod .slideList li.itemWrap2 .prd-price del { display:block;}


/*영상*/
.movieWrap { position: relative; overflow: hidden;  padding: 40px 0px;  background: #f7f7f7; text-align: center;}
.movieWrap:after{content:""; clear:both; display:block; } 
.movieWrap .movieSubject{font-size: 20px; font-weight: 700;}
.movieWrap .movieTit{    padding: 10px 20px 30px;  font-size: 16px;  line-height: 20px;}
.movieWrap .goToBtn{    width: 35%; margin: 30px auto 0px; background: #fff;   height: 40px;line-height: 40px;}
.movieWrap .goToBtn a{display:block; }

/* 메인 타이틀 */
.main h3 {font-size: 20px;display: inline-block;margin: 60px auto 20px;width: 100%;text-align: center; font-weight:bold; letter-spacing:1px; }
.main .specialProduct h3 {font-size: 18px;display: inline-block;margin: 50px auto 15px;width: 100%;text-align: center;}


.longban { margin:30px 0 0; }
.longban a img { width:100%; }



/* M1. 모바일 메인 - 10월 8일 추가 */
.vcm-main, .vcm-main * { font-family: 'Pretendard', 'Malgun Gothic', sans-serif !important; letter-spacing: -0.3px; box-sizing: border-box; }
.vcm-main .vcm-sec { padding: 40px 20px; }
.vcm-main .vcm-gray { background: #F6F8FB; }
.vcm-main .vcm-eyebrow { margin: 0 0 4px; font-size: 14px; font-weight: 700; color: #1E5BC6; }
.vcm-main .vcm-title { margin: 0 0 20px; font-size: 24px; font-weight: 800; color: #0F1B33; letter-spacing: -0.8px; line-height: 1.35; text-align: left; }
.vcm-main .vcm-cats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.vcm-main .vcm-cat { display: flex; flex-direction: column; gap: 4px; padding: 18px 16px; border-radius: 16px; text-decoration: none; }
.vcm-main .vcm-cat:last-child { grid-column: 1 / -1; }
.vcm-main .vcm-ic { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 8px; }
.vcm-main .vcm-ic svg { width: 24px; height: 24px; fill: none; stroke: #fff; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.vcm-main .vcm-cat b { font-size: 16px; font-weight: 700; color: #0F1B33; }
.vcm-main .vcm-desc { font-size: 13px; font-weight: 500; color: #4A5568; line-height: 1.45; }
.vcm-main .vcm-cat em { margin-top: 6px; font-style: normal; font-size: 13px; font-weight: 700; }
.vcm-main .c-commerce { background: #FFEDE4; } .vcm-main .c-commerce .vcm-ic { background: #F2703C; } .vcm-main .c-commerce em { color: #C24D1A; }
.vcm-main .c-basic { background: #E7F0FE; } .vcm-main .c-basic .vcm-ic { background: #3B82F6; } .vcm-main .c-basic em { color: #1E5BC6; }
.vcm-main .c-cert { background: #E2F6EE; } .vcm-main .c-cert .vcm-ic { background: #1FAF7A; } .vcm-main .c-cert em { color: #0E7A52; }
.vcm-main .c-design { background: #F1EBFE; } .vcm-main .c-design .vcm-ic { background: #8B5CF6; } .vcm-main .c-design em { color: #6A3CD6; }
.vcm-main .c-ai { background: #FDE8F0; } .vcm-main .c-ai .vcm-ic { background: #EC5C93; } .vcm-main .c-ai em { color: #C2346C; }
.vcm-main .newProduct .list_shopping2x h3, .vcm-main .newProduct h3.vcm-title { padding: 0 !important; text-align: left !important; }
.vcm-main .newProduct .items { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 14px !important; padding: 0 !important; margin: 0 !important; }
.vcm-main .newProduct .items li { width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; }
.vcm-main .newProduct .listPic { display: block; width: 100% !important; height: auto !important; border-radius: 12px; }
.vcm-main .newProduct .list_shoppingInfo { padding: 0 !important; text-align: left !important; }
.vcm-main .newProduct .listReplce { display: inline-block; margin: 10px 0 0 !important; padding: 3px 8px; border-radius: 6px; background: #E7F0FE; color: #1E5BC6 !important; font-size: 12px !important; font-weight: 700 !important; }
.vcm-main .newProduct .listName { margin: 6px 0 0 !important; font-size: 14px !important; font-weight: 600 !important; color: #1B2433 !important; line-height: 1.45 !important; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.9em; }
.vcm-main .newProduct .btn_moreGray { width: 100%; margin-top: 20px; padding: 14px 0; border-radius: 12px; border: 1.5px solid #D5DCE6; background: #fff; font-size: 15px; font-weight: 700; color: #1B2433; }
.vcm-main .vcm-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.vcm-main .vcm-steps li { display: flex; gap: 14px; align-items: flex-start; background: #F6F8FB; border-radius: 16px; padding: 18px 16px; }
.vcm-main .vcm-num { flex: none; width: 34px; height: 34px; border-radius: 50%; background: #1E5BC6; color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.vcm-main .vcm-steps b { display: block; font-size: 16px; font-weight: 700; color: #0F1B33; margin-bottom: 3px; }
.vcm-main .vcm-steps p { margin: 0; font-size: 14px; font-weight: 500; color: #4A5568; line-height: 1.55; }
.vcm-main .movieSubject { font-weight: 700 !important; }
.vcm-main .movieTit { font-weight: 800 !important; }
.vcm-main .vcm-cta { background: #0F1B33; padding: 40px 20px; text-align: left; }
.vcm-main .vcm-cta h3 { margin: 0 0 8px; font-size: 22px; font-weight: 800; color: #fff; line-height: 1.4; }
.vcm-main .vcm-cta p { margin: 0 0 20px; font-size: 14px; color: #C9D3E6; line-height: 1.6; }
.vcm-main .vcm-btn-y, .vcm-main .vcm-btn-line { display: block; text-align: center; padding: 15px 0; border-radius: 12px; font-size: 16px; font-weight: 700; text-decoration: none; }
.vcm-main .vcm-btn-y { background: #FFE14D; color: #0F1B33 !important; margin-bottom: 8px; }
.vcm-main .vcm-btn-line { border: 2px solid #fff; color: #fff !important; }

/* M2. 모바일 모션 배너 - 10월 8일 추가 */
.vcm-banner li a { display: block; }
.vcm-banner .vcm-svg { display: block; width: 100%; height: auto; }
.vcm-banner g { transform-box: fill-box; transform-origin: center; }
@keyframes vcmFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes vcmFloat2 { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-10px) rotate(2deg); } }
@keyframes vcmPop { 0%,8% { opacity: 0; transform: scale(.85) translateY(10px); } 16% { opacity: 1; transform: scale(1.04); } 22%,88% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(.95); } }
@keyframes vcmTwinkle { 0%,100% { opacity: .35; transform: scale(.7); } 50% { opacity: 1; transform: scale(1.1); } }
@keyframes vcmPulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.06); } }
@keyframes vcmDraw { 0% { stroke-dashoffset: 1; } 40%,100% { stroke-dashoffset: 0; } }
.vcm-banner .vcm-f1 { animation: vcmFloat 5s ease-in-out infinite; }
.vcm-banner .vcm-f2 { animation: vcmFloat2 4.2s ease-in-out infinite .6s; }
.vcm-banner .vcm-f3 { animation: vcmFloat 6s ease-in-out infinite 1.2s; }
.vcm-banner .vcm-f4 { animation: vcmFloat 3.6s ease-in-out infinite .3s; }
.vcm-banner .vcm-pop { animation: vcmPop 6s ease-out infinite 1s; }
.vcm-banner .vcm-tw1 { animation: vcmTwinkle 2.4s ease-in-out infinite; }
.vcm-banner .vcm-tw2 { animation: vcmTwinkle 2.4s ease-in-out infinite .8s; }
.vcm-banner .vcm-tw3 { animation: vcmTwinkle 2.4s ease-in-out infinite 1.6s; }
.vcm-banner .vcm-pulse { animation: vcmPulse 6s ease-in-out infinite; }
.vcm-banner .vcm-draw { stroke-dasharray: 1; animation: vcmDraw 6s ease-out infinite; }
@media (prefers-reduced-motion: reduce) { .vcm-banner * { animation: none !important; } .vcm-banner .vcm-draw { stroke-dasharray: none; } }



/* M5. 모바일 영상 영역 (새 디자인) - 10월 8일 추가 */
.vcm-main .vcm-video { background: #F6F8FB; }
.vcm-main .vcm-video-box { position: relative; width: 100%; padding-top: 56.25%; border-radius: 16px; overflow: hidden; box-shadow: 0 16px 32px -20px rgba(15,27,51,.45); }
.vcm-main .vcm-video-box iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.vcm-main .vcm-video-desc { margin: 16px 0 20px; font-size: 14px; font-weight: 500; color: #4A5568; line-height: 1.7; }
.vcm-main .vcm-video-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.vcm-main .vcm-btn-navy, .vcm-main .vcm-btn-outline { display: block; text-align: center; padding: 14px 0; border-radius: 12px; font-size: 15px; font-weight: 700; text-decoration: none; }
.vcm-main .vcm-btn-navy { background: #0F1B33; color: #fff !important; }
.vcm-main .vcm-btn-outline { border: 2px solid #0F1B33; color: #0F1B33 !important; }


/* BASIC css end */