/* BASIC css start */
/* °øÅë css */
.moreWrap::after{content: ''; display: block; clear: both;}
.moreWrap.title h2 { float: left;}
.title h2 { font-weight: 500; font-size: 32px; color: #111; margin-bottom: 20px; }
.title .more { float: right; font-weight: 500; font-size: 15px; color: #555; line-height: 40px; }
.title .more img { display: inline-block; width: 16px; height: 16px; vertical-align: middle; margin-left: 2px; }
.hoverBtn{opacity: 0; transition: 0.3s;}
.hoverBtn.active{opacity: 1; transition: 0.3s;}
.swiper-pagination-progressbar {background: #e5e5e5; position: relative; height: 2px ! important;}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background-color: #111;}

[class*="section"]:not(.section01,.section02){margin-bottom: 120px; position: relative;}

.noIcon .icons{display:none;}


.section01 { padding-top: 24px; position:relative; }
.section01 .mainBannerSwiper { width: 100%; overflow: hidden; }
.section01 .mainBannerSwiper li { border-radius: 20px; overflow: hidden; position: relative; width: 430px;}
.section01 .mainBannerSwiper li a { display: block; height: 100%;}
.section01 .mainBannerSwiper li img { width: 100%;}

/* ¸ÞÀÎ ½½¶óÀ̵å Àӽà css */
.section01 .mainBannerSwiper li .txt-bg{display: none;}

.section01 .mainBannerSwiper li .txt-bg { position: absolute; bottom: 0; padding: 48px 40px; background: linear-gradient(to bottom, rgba(0,0,0,0) 67%, rgba(0,0,0,0.1)); color: #fff; }
.section01 .mainBannerSwiper li .txt-bg .txtWrap span {font-weight: 600; font-size: 32px; line-height: 40px; }
.section01 .mainBannerSwiper li .txt-bg .txtWrap p {font-weight: 500; font-size: 16px; }

.section01 .controls { width: 1330px; margin: 16px auto 0; display: flex; align-items: center; gap: 32px;}
.section01 .controls .nav { width: 85px; display: flex; align-items: center; gap: 4px;}
.section01 .controls .nav > div { display: inline-block; width: 24px; height: 24px; cursor: pointer;}
.section01 .controls .nav .grey-bar{content: ''; display: inline-block; background-color: #E5E5E5; width: 1px; height: 14px;}

.section02 { padding: 32px 0 56px; text-align: center; }
.section02 .brand_category { display: flex; align-items: center; justify-content: center; gap:20px;}
.section02 .brand{flex-shrink:0;}
.section02 .brand li { display: inline-block; margin-right: 6px; vertical-align: top; width:86px;}
.section02 .brand li a { display: block; width: 86px; height: 92px; border-radius: 14px; overflow: hidden; }
.section02 .brand li a img { width: 100%; height: 100%; object-fit: cover; display: block; }
.section02 .category { width: 512px; text-align: left; display: flex; flex-wrap: wrap; gap: 8px;flex-shrink:0;}
.section02 .category li { display: inline-block; vertical-align: top;}
.section02 .category li a { display: block; line-height: 30px; padding: 5px 11px 5px 4px; border: 1px solid #e5e5e5; border-radius: 999px; }
.section02 .category li img { display: inline-block; width: 30px; height: 30px; border-radius: 50%; object-fit: cover; vertical-align: middle; margin-right: 4px; }
.section02 .category li span { display: inline-block; font-weight: 400; font-size: 15px; color: #111; vertical-align: middle; }

.section03 .swiper-wrapper{transition-timing-function: linear;}
.section03 .swiper-slide{width: 267px;}

.section04 .pr-list li{counter-increment:number;}
.section04 .pr-list li::before{width: 36px; height: 36px; text-align: center; display: grid; align-items: center; content: counter(number) " "; position: absolute; left: 0; top: 0; color: #111; background-color: #fff; font-weight: 600; font-size: 14px;}

.section05{background-color: #111;}
.section05 .pc_product3{max-width: 1576px; margin: 0 auto; position: relative; padding: 60px 0 80px;}
.section05 .pc_product3 .title h2{color: #fff; text-align: center;}
.section05 .pc_product3 .swiper-slide { width: 440px !important; height: auto !important; }
.section05 .pc_product3 .card { border: 1px solid #e5e5e5; background: #fff; margin-right: 40px;}
.section05 .pc_product3 .card .banner { position: relative; height: 352px; overflow: hidden; }
.section05 .pc_product3 .card .banner > a { display: block; width: 100%; height: 100%; position: relative;}
/* ÀÓ½Ãcss */
.section05 .pc_product3 .card .banner > a .txt-bg{display: none;}

.section05 .pc_product3 .card .banner > a .txt-bg{position: absolute; bottom: 0; padding: 48px 40px; background: linear-gradient(to bottom, rgb(0 0 0 / 0%) 0%, rgb(0 0 0 / 50%)); width: 100%;}
.section05 .pc_product3 .card .banner > a .txt-wrap{text-align: center; font-size: 26px; line-height: 34px; font-weight: 600; color: #fff;}
.section05 .pc_product3 .card .banner img { width: 100%; height: 100%; object-fit: cover; }
.section05 .pc_product3 .swiper-button-prev{left: 30px; background-color: rgba(255, 255, 255, 0.5);}
.section05 .pc_product3 .swiper-button-next{right: 30px; background-color: rgba(255, 255, 255, 0.5);}

.prd-wrap-02{padding: 16px;}
.prd-wrap-02 .thumb{flex-shrink: 0; width: 72px;}
.prd-wrap-02 .pr-info{width: 100%; position: relative;}
.prd-wrap-02 .icon_wish{position: absolute; top: 0; right: 0;}

.section06 .pc_product4 .swiper-container{overflow: hidden;}
.section06 .pc_product4 .prd-wrap{display: flex;}
.section06 .pc_product4 .prd-wrap .thumb{position: relative; margin-bottom: 33px;}
.section06 .pc_product4 .prd-wrap .salePer{display: block; position: absolute; bottom: -35px; left: 8px; font-size: 56px; font-weight: 500; color: #fe7900;}
.section06 .pc_product4 .prd-wrap .pr-sub,
.section06 .pc_product4 .prd-wrap .pr-info .sale_percent,
.section06 .pc_product4 .prd-wrap .pr-info .pr-color{display: none;}
.section06 .pc_product4 .title h2{display: inline-block;}
.section06 .pc_product4 .title .timer{color: #333; font-weight: 500; font-size: 30px; display: inline-block; margin-left: 24px;}
.section06 .pc_product4 .title .timer .colon{color: #AAAAAA; font-size: 30px; font-weight: 500;}
.section06 .prd-wrap .pr-info .pr-price{display: flex; align-items: center; gap: 8px;}
.section06 .prd-wrap .pr-info .pr-price .strike{margin-bottom: 0; order: 2;}
.section06 .prd-wrap .pr-info .pr-price .price{order: 1;}


.section07 [class*="pc_product"]::after{content: ''; display: block; clear: both;}
.section07 [class*="pc_product"]{margin-bottom: 56px;}

.section07 .tabArea .tab-menu { margin-bottom: 20px; }
.section07 .tabArea .tab-menu li { display: inline-block; padding: 0 16px; line-height: 36px; border: 1px solid #e5e5e5; border-radius: 999px; font-weight: 400; font-size: 15px; color: #555; cursor: pointer; margin-right: 8px; }
.section07 .tabArea .tab-menu li:last-child { margin-right: 0; }
.section07 .tabArea .tab-menu li.active { background: #111; border-color: #111; color: #fff; }
.section07 .tabArea .prd-wrap{display: none;}
.section07 .tabArea .prd-wrap.active{display: flex;}

.section07 .left {float: left; position: relative; width: 616px; height: 100%; padding-bottom: 10px;}
.section07 .right { float: left; width: calc(100% - 616px); padding-left: 64px;}
.section07 .right .desc { margin-bottom: 99px;}
.section07 .right .desc h3 { font-weight: 600; font-size: 40px; line-height: 1.4; margin-bottom: 8px; }
.section07 .right .desc p { font-weight: 400; font-size: 16px; color: #555; }
.section07 .right .prd-wrap .pr-info .bottom{padding-top: 0; border-top: none;}
.section07 .right .pr-sub,
.section07 .right .pr-review,
.section07 .right .icons,
.section07 .right .pr-color{display: none;}
.section07 .right .swiper-pagination-progressbar{ position: relative; margin-top: 30px;}
.section07 .right .hoverBtn02{top: 170px;}

.section09 [class*="slide-wrap"] a{display: flex; align-items: center; justify-content: center; gap: 48px; flex-direction: row;}
.section09 .right{padding-top: 45px;}
.section09 .swiper-pagination{transform: translateX(-50%); position: absolute; left: calc(50% + 45px); top:50px; color: #fff; text-align: center; background-color: rgba(255, 255, 255, 0.3); width: 35px; height: 20px; line-height: 20px; border-radius: 50px; font-size: 10px;}


.section10 .pc_product11{max-width: 1576px; margin: 0 auto; position: relative;}
.section10 .txt-wrap{margin: 16px 0 24px;}
.section10 .txt-wrap strong{font-size: 26px; font-weight: 600; display: block; margin-bottom: 10px;}
.section10 .txt-wrap p{font-size: 16px; line-height: 22px; height:44px;  color: #575757; font-weight: 400;  overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.section10 .card{width: 440px; margin-right: 40px;}
.section10 .card .pr-brand{display: none;}
.section10 .hoverBtn{top: 50%;}
.section010 .pc_product11 .swiper-button-prev{left: 30px;}
.section010 .pc_product11 .swiper-button-next{right: 30px;}

/* ========== Swiper Ä¿½ºÅÒ ========== */
.swiper-button-next, .swiper-button-prev { width: 36px; height: 36px; background: rgba(0,0,0,0.4); border-radius: 10px; }
.swiper-button-next::after, .swiper-button-prev::after { font-size: 16px; color: #fff; }

.section07 .hoverBtn02.swiper-button-disabled{display: none;}
.section07 .hoverBtn02{background: rgba(0,0,0,0.1);}
.section07 .hoverBtn02:hover{background: rgba(0,0,0,0.7);}
/* BASIC css end */