/* BASIC css start */ #contentWrap { width:1300px; margin:0 auto } .section{margin-bottom:70px;} .sec_inner{width: 1300px; margin: 0 auto;} .section h2{text-align: center; font-size:32px; color:#000; font-weight:600; margin-bottom:34px;font-family: 'Noto Sans KR', sans-serif;} .swiper-button-disabled{opacity:.3} .jakga .jakga_list h2{text-align: center; font-size:32px; color:#000; font-weight:500; margin-bottom:55px;font-family: 'Noto Sans KR', sans-serif;} /* sec1 메인배너 */ #sec1{overflow: hidden; margin-top: 14px;} #sec1 .sec1_cont{} #sec1 .sec1_cont .swiper{padding-bottom: 10px;} #sec1 .sec1_cont .swiper ul{ margin-left:calc((100% / 5) / 4);} #sec1 .sec1_cont .swiper ul li{width:calc(90% / 3);padding: 0 8px;} #sec1 .sec1_cont .swiper>ul>li:not(.swiper-slide-active,.swiper-slide-next){opacity: 1;} #sec1 .sec1_cont .swiper ul li .ban_img{} #sec1 .sec1_cont .swiper ul li .ban_img a{display: block; width: 100%;border-radius: 0px; overflow: hidden;} #sec1 .sec1_cont .swiper ul li .ban_img a img{width: 100%;} #sec1 .sec1_cont .swiper ul li .ban_txt{width: 100%; padding: 16px 0; margin-top: -56px; margin-bottom: 50px; } #sec1 .sec1_cont .swiper ul li .ban_txt p{text-align: center; font-family: 'Jost', 'Noto Sans KR', sans-serif; } #sec1 .sec1_cont .swiper ul li .ban_txt p.big{font-size: 30px; color: #fff; font-weight: 600; margin-bottom: -4px;} #sec1 .sec1_cont .swiper ul li .ban_txt p.small{color: #fff; font-size: 24px; font-weight: 400;margin-bottom: 4px;} #sec1 .swiper .swiper-pagination{bottom: 0px; } #sec1 .swiper .swiper-pagination-bullet{width: 73px; height: 3px; border-radius: 0; background-color: #999; margin: 0px; } #sec1 .swiper .swiper-pagination-bullet-active{width: 48px; height: 3px; border-radius: 0; background-color: #ff7f50; margin: 0px;} /* sec2 go cate */ #sec2_go_cate{margin-bottom:90px;} #sec2_go_cate .sec_inner{} #sec2_go_cate .sec_inner ul{display: flex; flex-wrap: nowrap; justify-content: space-between;} #sec2_go_cate .sec_inner ul li{} #sec2_go_cate .sec_inner ul li a{display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px;} #sec2_go_cate .sec_inner ul li a img{display: inline-block; border-radius:5px;} #sec2_go_cate .sec_inner ul li a img:hover{opacity:.8} #sec2_go_cate .sec_inner ul li a p{ font-family: 'Noto Sans KR', sans-serif; color: #333333; font-size: 15px; font-weight: 500;} /* sec6 카테고리인기상품 */ #sec6{} #sec6 .sec_inner{} #sec6 .sec_inner h2{} #sec6 .sec_inner .sec6_cate{margin-bottom: 24px;} #sec6 .sec_inner .sec6_cate ul{display:flex; gap:20px; justify-content:center; } #sec6 .sec_inner .sec6_cate ul li{} #sec6 .sec_inner .sec6_cate ul li a{display:block; width:100%; text-align:center; font-family: 'Noto Sans KR', sans-serif; color:#9a9a9a; font-size: 18px; font-weight: 600; letter-spacing: -.3px;transition: color .1s, border-color .3s; border-bottom:3px solid transparent; display:block; padding-bottom:6px} #sec6 .sec_inner .sec6_cate ul li.on>a{ color: #111111; border-color:#111111} #sec6 .sec_inner .sec6_cate ul li a:hover{color: #111111; } #sec6 .sec6_prd{} #sec6 .sec6_prd>div .swiper{padding-bottom:20px} #sec6 .sec6_prd>div{display: none;} #sec6 .sec6_prd>div ul{} #sec6 .sec6_prd>div.show{display: block;} #sec6 .swiper .swiper-pagination-progressbar{bottom: 0; top: unset; height:3px; background-color: rgba(0,0,0,.09);} #sec6 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background-color: #333;} /* sec3 띠배너 더핸즈커뮤니티 기획전 */ #sec3{margin-top:100px} #sec3 .sec_inner{} #sec3 .sec_inner ul{display: flex; gap: 17px;} #sec3 .sec_inner ul li{flex-grow: 0; width: 100%;} #sec3 .sec_inner ul li a{display: block;width: 100%;border-radius: 0px; overflow: hidden;} #sec3 .sec_inner ul li a:hover>img{transform: scale(1.02);} #sec3 .sec_inner ul li a img{width: 100%; transition: transform .4s;} /* sec4 더핸즈BEST */ #sec4 .swiper{padding-bottom:20px} #sec4 .swiper ul li{border:0px solid #eee; border-radius:0px; overflow:hidden} #sec4 .swiper ul li .thumb>a{border-radius:0px; } #sec4 .swiper ul li .info{padding:14px 0px;} #sec4 .swiper .swiper-pagination-progressbar{bottom: 0; top: unset; height:3px; background-color: rgba(0,0,0,.09);} #sec4 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background-color: #111111;} /* sec5 기획전 상품3세트 */ #sec5{margin-bottom:40px} #sec5 .sec_inner{} #sec5 .sec_inner h2{} #sec5 .sec_inner .sec5_cont{display: flex;gap: 0px; justify-content: space-between;} #sec5 .sec_inner .sec5_cont>div{width: 50%;} #sec5 .sec_inner .sec5_cont .banner_img{} #sec5 .sec_inner .sec5_cont .banner_img a{display: block;border-radius: 7px; overflow: hidden; width: 100%;} #sec5 .sec_inner .sec5_cont .banner_img a img{width: 100%;} #sec5 .sec_inner .sec5_cont .item_cont{margin-left:14px} #sec5 .sec_inner .sec5_cont .item_cont ul{height: 100%; display: flex; flex-direction: column; justify-content: space-between;} #sec5 .sec_inner .sec5_cont .item_cont ul li{display: flex;height: 160px;} #sec5 .sec_inner .sec5_cont .item_cont ul li .thumb{width: 160px; height: 160px;} #sec5 .sec_inner .sec5_cont .item_cont ul li .thumb a{display: block; width: 100%; height: 100%;} #sec5 .sec_inner .sec5_cont .item_cont ul li .thumb a img{width: 100%; height: 100%; object-fit: cover;} #sec5 .sec_inner .sec5_cont .item_cont ul li .info{padding-left: 30px;display: flex; flex-direction: column; justify-content: center; flex-grow: 1; overflow-y: auto; height: 100%; max-width:427px;} #sec5 .sec_inner .sec5_cont .item_cont ul li .info .prdprice{border-top:none; margin-top:0} #sec5 .sec_inner .sec5_cont .item_cont ul li .info .prdprice .percent{display:none} /* sec7 */ #sec7{} #sec7 a{display: block; width: 100%;} #sec7 a img{width: 100%;} /* sec99 세로형기획전3세트 */ #sec99{margin-top:120px} #sec99 .sec_inner{} #sec99 .sec_inner .sec99_cont{display: flex; justify-content: space-between; gap:14px } #sec99 .sec_inner .sec99_cont>div{ width: calc((100% - 40px) / 2);} #sec99 .sec_inner .sec99_cont>div>.banner>a{display: block;width: 100%; } #sec99 .sec_inner .sec99_cont>div>.banner>a img{width:100%; border-radius: 0px; margin-bottom: 30px;} #sec99 .sec_inner .sec99_cont>div ul.item_cont{display: flex; flex-wrap: wrap; gap: 10px 0; margin-top:10px} #sec99 .sec_inner .sec99_cont>div ul.item_cont li{display:flex; flex-wrap: nowrap; gap: 10px; width: 100%;} #sec99 .sec_inner .sec99_cont>div ul.item_cont li .thumb{width: 120px; height: 120px;} #sec99 .sec_inner .sec99_cont>div ul.item_cont li .info{flex-grow: 1; padding:0; display:flex; justify-content:center; flex-direction:column;} #sec99 .sec_inner .sec99_cont>div .more_item a{width: 100%;} #sec99 .ban_txt{width: 100%; padding: 16px 20px; margin-top: -120px; margin-bottom: 0px; letter-spacing: -.2px; } #sec99 .ban_txt p{text-align: center; font-family: 'Jost', 'Noto Sans KR', sans-serif; } #sec99 .ban_txt p.big{font-size: 22px; color: #fff; font-weight: 600; margin-bottom: 12px;} #sec99 .ban_txt p.big2{font-size: 22px; color: #555; font-weight: 500; margin-bottom: 2px;} #sec99 .ban_txt p.small{color: #fff; font-size: 18px; font-weight: 500;margin-bottom: 2px;} /* sec88 더핸즈인스타 */ #sec88 { margin-bottom: 110px } #sec88 .sec_inner{ } #sec88 .sec_inner h2{ text-align: center; font-size:32px; color:#000; font-weight:600; font-family: 'Noto Sans KR', sans-serif; margin-bottom: 5px !important;} #sec88 p{text-align: center; font-size:18px; color:#555; font-weight:400; margin-bottom:40px;font-family: 'Noto Sans KR', sans-serif;} #sec88 .sec_inner .sec8_cont{ border-radius: 0px;} /* sec9 후기 */ #sec9{padding:60px 0 50px} #sec9 .sec_inner{position:relative;} #sec9 h2{} #sec9 .sec9_review{} #sec9 .sec9_review>div{width: 100%;} #sec9 .sec9_review>div>ul{width: 100%;} #sec9 .sec9_review>div>ul>li{flex-grow:1} #sec9 .li_review .rv_main{ width: 100%; border-bottom: 1px solid #e4e4e4;} #sec9 .li_review .rv_main .thumb{width:100%;} #sec9 .li_review .rv_main .thumb a{display: block; width: 100%; height: 100%;} #sec9 .li_review .rv_main .thumb a img{width: 100%; height: 100%; object-fit: cover;} #sec9 .li_review .rv_main .rv_main_cont{width: 100%; padding: 20px 0; max-width:280px} #sec9 .li_review .rv_main .rv_main_cont .rv_info{margin-bottom: 7px;color:#000; font-size: 15px;font-weight: 500;} #sec9 .li_review .rv_main .rv_main_cont .rv_cont{font-size: 14px; font-family: 'Noto Sans KR', sans-serif; text-overflow: ellipsis; overflow: hidden; font-weight:400; color:#999999; line-height:1.7; } #sec9 .li_review .rv_mini{width: 100%; display: flex; align-items: center; justify-content: left; gap:15px;margin-top:20px } #sec9 .li_review .rv_mini ul { display:flex; flex-direction:column; gap:8px;} #sec9 .li_review .rv_mini ul li {font-family: 'Noto Sans KR', sans-serif;font-size: 13px; color: #000;} #sec9 .li_review .rv_mini ul li{display:flex; align-items:center} #sec9 .li_review .rv_mini ul li span {font-family: 'Jost', sans-serif;display:flex; align-items:center; color:#000; font-size:16px; font-weight: 500; } #sec9 .li_review .rv_mini ul li span img{display:inline-block; margin-right:8px;} #sec9 .swiper_btn_prev,#sec9 .swiper_btn_next{position: absolute;z-index: 2; cursor: pointer; top: 50%; transform: translateY(-50%);} #sec9 .swiper_btn_prev{left:-130px } #sec9 .swiper_btn_next{right:-130px} /* sec3_2 더핸즈작가갤러리 */ #sec3_2{margin-top:140px} #sec3_2{margin-bottom:20px} #sec3_2 .sec_inner{} #sec3_2 .sec_inner ul{display: flex; gap: 14px;} #sec3_2 .sec_inner ul li{flex-grow: 1; width: 50%;} #sec3_2 .sec_inner ul li a{display: block;width: 100%;border-radius: 0px; overflow: hidden;} #sec3_2 .sec_inner ul li a:hover>img{transform: scale(1);} #sec3_2 .sec_inner ul li a img{width: 100%; transition: transform .4s;} /* sec8 자수데이작가작품 */ #sec8{margin-top:10px} #sec8 .sec_inner{} #sec8 .sec_inner h2{} #sec8 .sec_inner .sec8_cont{display: flex;justify-content: space-between;} #sec8 .sec_inner .sec8_cont>div{width: 424px;} #sec8 .sec_inner .sec8_cont>div>ul{width: 100%;display: flex; flex-direction: column; gap: 14px;} #sec8 .sec_inner .sec8_cont>div>ul>li{display: flex; width: 100%;} #sec8 .sec_inner .sec8_cont>div>ul>li:not(:first-child){height: 130px;} #sec8 .sec_inner .sec8_cont>div>ul>li:not(:first-child) .thumb{width: 130px; height: 130px;} #sec8 .sec_inner .sec8_cont>div>ul>li:not(:first-child) .info{flex-grow: 1;padding-left: 20px; display: flex; flex-direction: column; justify-content: center; max-width:285px} #sec8 .sec_inner .sec8_cont>div>ul>li .thumb a{height: 100%;} #sec8 .sec_inner .sec8_cont>div>ul>li .thumb a img{height: 100%; object-fit: cover;} #sec8 .sec_inner .sec8_cont>div>ul>li:first-child{} #sec8 .sec_inner .sec8_cont>div>ul>li:first-child .thumb{width: 100%; height: 415px;} #sec8 .sec_inner .sec8_cont>div>ul>li:first-child .info{display: none;} #sec8 .sec_inner .sec8_cont>div>ul>li.item_list .info .prdprice{border-top:none; margin-top:0} #sec8 .sec_inner .sec8_cont>div>ul>li.item_list .info .prdprice .percent{display:none} /* BASIC css end */