/* Web-planet Solution (Shop style) v1.0.0 | 2019-11-21 Publisher */ #wp_shop input[type="number"], #wp_shop button, #wp_shop select {border-radius:0;-webkit-appearance:none;} #wp_shop select { background: url('/_wp/app/shop/skin/basic_4_3/img/wp_select_arrow.png') no-repeat 95% 50%; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } #wp_shop select::-ms-expand { display: none; } #wp_shop #wp_header_title {display: none;} /* shop input number */ #wp_shop input[type="number"]::-webkit-outer-spin-button, #wp_shop input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* 2019-11-19 input 리셋 셀렉 화살표 구현 -webkit-appearance: none; appearance: none; -moz-appearance: textfield; */ #wp_shop .ea_wrap {width: 108px;margin: 0 auto;display: block;} #wp_shop .ea_wrap_view {width: 170px;margin-top: 15px; margin-right: 0;display: block;} #wp_shop .ea_wrap .wp_num_close_btn {} #wp_shop .ea_wrap button { position: relative; width: 36px; height: 36px; border: 1px solid #d4d4d4; border-radius: 0; background: #fff; font-size: 20px; font-weight: 400; color: #a0a0a0; cursor: pointer; text-decoration: none; vertical-align: top; box-sizing: border-box; -webkit-appearance: none; appearance: none; -moz-appearance: none; padding: 0; margin: 0; } #wp_shop .ea_wrap input { width: 35px; height: 36px; border: 1px solid #d4d4d4; border-width: 1px 0; margin: 0; padding: 0; font-size: 14px; font-weight: 500; color: #000; text-align: center; box-sizing: border-box; vertical-align: top; -webkit-appearance: none; appearance: none; -moz-appearance: textfield; border-radius: 0; } #wp_shop .ea_wrap .wp_num_close_btn {background: #000;color: #fff;border: 1px solid #000;line-height: 20px;margin-left: 15px;} @media (max-width: 768px){ #wp_shop .prd_choice .ea_wrap {margin-right: 0;display: block;width: 100%;} #wp_shop .ea_wrap button {width: 30px !important;height: 30px;line-height: 20px;padding: 0;} #wp_shop .ea_wrap input {width: 30px !important;height: 30px;line-height: 20px;} } /* shop_list */ #wp_shop .wp_container {max-width: 1200px;} #wp_shop .wp_container .wp_shop {overflow:hidden;margin-top:40px; padding: 0px;} #wp_shop .wp_cate_select_wrap {margin: 0;padding: 0;margin-top: 15px;text-align: right;width: 100%;} #wp_shop .wp_cate_select_wrap select, #wp_shop .wp_cate_select_wrap select option { width: 100%; max-width: 150px; padding: 7px 30px 7px 10px; font-size: 14px; font-family: 'Pretendard-regular', 'Noto Sans KR'!important; border: 1px solid #ddd; line-height: 1.4em; border-radius: 5px; color: darkgrey; } #wp_shop .wp_shop ul {overflow:hidden;} #wp_shop .wp_shop > ul {font-size: 0;} /* inline �뺣젹 */ #wp_shop .wp_shop .list_li {font-size: 12px;letter-spacing: -0.2px; /* width: 25%; 부트스트랩으로 대체 */display: inline-block;margin-bottom: 15px;transition: all 0.5s ease-in-out;vertical-align: top; padding: 0 !important;float: none !important;} #wp_shop .wp_shop .list_li .wp_shop_wrap {padding: 10px;} #wp_shop .wp_shop .list_li .wp_shop_wrap .wp_shop_frame { position: relative; padding-top: 99%; overflow: hidden; border: 1px solid #e7e7e7; box-shadow: 0 3px 6px #00000017; border-radius: 10px; transition: 0.4s; } #wp_shop .wp_shop .list_li .wp_shop_wrap .wp_shop_frame:hover { box-shadow: 0 0px 0px #00000017; } #wp_shop .wp_shop .list_li a {text-decoration: none!important;} /* == wp_shop_frame 비율 == 1:1 : padding-top: 100%; ratio 2:1 : padding-top: 50% 1:2 : padding-top: 200% 4:3 : padding-top: 75% 16:9 : padding-top: 56.25% */ #wp_shop .wp_shop .list_li .wp_shop_wrap .wp_shop_frame img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; max-width: 100%;/* height: auto; */ margin: auto 0;height: 100%; object-fit: cover;} _:-ms-input-placeholder, :root #wp_shop .wp_shop .list_li .wp_shop_wrap .wp_shop_frame img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; min-width: 100%; height: 100%; margin: auto 0; } #wp_shop .wp_shop .list_li .wp_shop_text .wp_shop_tit {padding: 5px 9px 5px 15px;font-size: 16px;font-family:'Pretendard-SemiBold', 'Noto Sans KR'!important;} #wp_shop .wp_shop_tit {font-weight: 700;color: #121212;font-size: 1.3em;margin-bottom: 0;/* text-decoration: underline; */} #wp_shop .brand {padding-top: 0px;font-family:'Pretendard-Light', 'Noto Sans KR'!important;font-size: 15px;min-height: 90px;} #wp_shop .discount {padding-top: 10px;} #wp_shop .discount .sell {display: block;color: #aaa;} #wp_shop .discount .sell .num {text-decoration:line-through;} #wp_shop .discount .sale {display: block;color: #ff4800;padding-top: 0;} #wp_shop .notdiscount .sell {display: block;color: #121212;} #wp_shop .price .soldout * {color: #aaa;text-decoration:line-through;cursor:default;} #wp_shop .sale .num, #wp_shop .sale .price, #wp_shop .notdiscount .num {font-weight: 600;} #wp_shop .wp_shop_frame > img {width: 100%;} #wp_shop .info {padding: 0 15px 10px;color: #5d5d5d;display: none;} /* 아이콘 */ #wp_shop .prd_icon { position:absolute; top:100%; left:0; margin-top:-25px;} #wp_shop .prd_icon:after { display:block; clear:both; content:"";} #wp_shop .prd_icon span { display:inline-block; float:left; border-radius:0; border:0; padding:0 8px; font-size:12px; font-weight:500; color:#fff; text-align:center; vertical-align:top; text-transform:uppercase; } #wp_shop .prd_icon span:first-of-type { margin-left:0;} /* 아이콘종류 */ #wp_shop .prd_icon .coupon { background:#808080;} #wp_shop .prd_icon .best { background:#515151;} #wp_shop .prd_icon .new { background:#020202;} #wp_shop .prd_icon .sale { background:#e1a35e;} #wp_shop .prd_icon .soldout { padding:0 8px; width:auto; font-size:12px; background:#d4d4d4;} /* 장바구니,찜 아이콘 */ #wp_shop .wp_shop_btn {text-align: left;padding-left: 10px;} #wp_shop .wp_shop_btn a { margin: 2px; opacity: 0; -webkit-transform: translateY(50%); transform: translateY(50%); } #wp_shop .wp_shop_btn a i { display: inline-block; font-size: 20px; line-height: 30px; width: 30px; background-color: #ffffff; text-align: center; color: #000000; border: 1px dashed #ddd; } #wp_shop .wp_shop_btn a i:hover { background-color: #4da3e2; color: #ffffff; cursor: pointer; } #wp_shop .list_li:hover a, #wp_shop .list_li.hover a {opacity: 1; transition:all 0.3s; -webkit-transform: translateX(0); transform: translateX(0); width: 40px; } #wp_shop .list_li:hover a:nth-child(2), #wp_shop .wp_shop_btn.hover a:nth-child(2) { -webkit-transition-delay: 0.1s; transition-delay: 0.1s;} #wp_shop .list_li:hover a:nth-child(3), #wp_shop .wp_shop_btn.hover a:nth-child(3) { -webkit-transition-delay: 0.2s; transition-delay: 0.2s;} #wp_shop .wp_container #wp_skin01 .wp_pager a {font-size: 20px;} #wp_shop .wp_list_footer {border-top:1px solid #d6d6d6;} @media (max-width: 1000px){ /* #wp_shop .wp_shop .list_li {width: 33.33%;} */ /* 부트스트랩으로 대체 */ } @media (max-width: 768px){ #wp_shop .wp_shop .list_li {transition: all 0s ease-in-out;} /* #wp_shop .wp_shop .list_li {width: 50%;} */ /* 부트스트랩으로 대체 */ /* #wp_shop .wp_shop .wp_top1 {width: 100%;} */ /* 부트스트랩으로 대체 */ #wp_shop .wp_shop_btn a {opacity: 1;} #wp_shop .wp_container #wp_skin01 .wp_pager a {font-size: 20px;} } @media (min-width: 768px){ /* #wp_shop .wp_shop .wp_top3 {width: 33.33%;} */ /* 부트스트랩으로 대체 */ } @media (max-width: 768px){ #wp_shop .brand{font-size: 12px;line-height: 1.4em;padding:0;} } @media screen and (min-width:541px) { .prd_icon span { /* width:25px; */ height:25px; line-height:25px;} .prd_icon span:first-letter {font-size:12px;} } @media screen and (max-width:540px) { .prd_icon span {/* width:26px; */ height:26px; line-height:26px;} .prd_icon span:first-letter {font-size:12px;} } /* shop_view */ #wp_shop .wp_product_detail {width: 100%;} #wp_shop .wp_img_div { width: 50%; float: left; } /* 47 */ #wp_shop .wp_img_div #wp-pager {font-size: 0;margin-top: 5px;} #wp_shop .wp_img_div #wp-pager a {display: inline-block;width: 20%;padding:5px;} #wp_shop .wp_img_div #wp-pager a img {max-width: 100%;} #wp_shop .wp_detail_div { width: 50%; padding-left: 4%; float: left;} /* 48 */ #wp_shop .wp_detail_div .prd_option {padding: 0 15px;} #wp_shop .wp_detail_div .prd_choice {padding: 0 15px;} #wp_shop .wp_detail_div .prd_choice > div {margin-top: 15px;} #wp_shop .wp_detail_div .prd_choice > div .wp_td_div {padding: 10px;font-size: 14px;vertical-align: middle;border-bottom: 1px dashed #ddd;} #wp_shop .wp_detail_div .prd_choice > div .wp_choice_right {min-width: 150px;} #wp_shop .wp_detail_div .prd_choice .wp_choice_title {vertical-align: middle;} #wp_shop .wp_detail_div .prd_choice .wp_choice_title .choice_tit_txt {margin: 0;} #wp_shop .wp_detail_div .prd_choice .wp_td_div .wp_choice_price {padding-top: 10px;text-align: right;font-size: 15px;} #wp_shop .wp_detail_div .prd_choice .wp_choice_total {padding: 15px 10px 10px;text-align: right;font-size: 13px;} #wp_shop .wp_detail_div .prd_choice .wp_choice_total .wp_choice_total_color {font-size: 30px;color: #ff4800;margin-left: 10px;} /* #wp_shop .wp_detail_div .prd_choice .wp_choice_input {padding: 0;} #wp_shop .wp_detail_div .prd_choice .wp_choice_input i {font-size: 25px;vertical-align: top;} #wp_shop .wp_detail_div .prd_choice .wp_choice_input input{width: 70px;text-align: center;} */ #wp_shop .wp_prd_txt { border-top: 2px solid #c9c9c9; padding: 24px 15px 10px 15px; } #wp_shop .wp_prd_txt .prd_title { font-size: 20px; line-height: 26px; font-weight: 600;font-family:'Pretendard-regular', 'Noto Sans KR'!important;color: #1E1E1E } #wp_shop .wp_prd_txt .prd_rank, .wp_prd_txt .prd_review {display: inline-block;margin-top: 10px;font-size: 13px;font-weight: 600;} #wp_shop .wp_prd_txt .prd_review {padding-left: 15px;} #wp_shop .wp_price{ font-size: 14px; font-weight: 600; text-decoration: line-through; margin-top: 10px; } #wp_shop .wp_price font {color: #a0a0a0; } #wp_shop .wp_sale_default {color: #121212; margin-top: 10px; font-size: 22px; font-weight: 600; } #wp_shop .wp_sale {color: #ff4800; margin-top: 10px; font-size: 22px; font-weight: 600; } #wp_shop .wp_sale_soldout { color: #aaa; margin-top: 10px; font-size: 22px; font-weight: 600; text-decoration: line-through; } #wp_shop .wp_sale_txt{ color: #ff4800; } #wp_shop .prd_price { border-bottom: 1px solid #dbdbdb; padding-bottom: 15px; margin-top: 20px; margin-bottom: 15px; } #wp_shop .prd_discount ul { font-size: 15px; line-height: 22px; overflow: hidden;font-family:'Pretendard-regular', 'Noto Sans KR'!important;} #wp_shop .prd_discount li:nth-child(odd){ float: left; width: 130px; font-weight: 500;font-family:'Pretendard-regular', 'Noto Sans KR'!important; } #wp_shop .prd_discount li:nth-child(2n){ overflow: hidden; color: #303033; font-weight: 500; } #wp_shop .prd_discount li:after{ display: block; clear: both; content: "";} #wp_shop .prd_discount li span{ display: block; font-size: 15px;font-family:'Pretendard-regular', 'Noto Sans KR'!important;color: #636363 } #wp_shop .prd_discount li span a{ text-decoration: underline; } #wp_shop .prd_sel .wp_prd_option { margin-top: 15px;padding: 10px;width: 100%; } #wp_shop .wp_btn { box-sizing:border-box; float: left; width: 33.33%; height: 50px; line-height: 50px; font-size: 14px; color: #fff; text-align: center;font-family:'Pretendard-regular', 'Noto Sans KR'!important;text-decoration: none; } #wp_shop .btn_like { background: #ff4800; color: #fff;} #wp_shop .btn_like:hover { color: #fff; } #wp_shop .btn_shopbag { background: #fff; color: #000; border: 1px solid #d4d4d4;transition: 0.4s } #wp_shop .btn_shopbag:hover {background-color: #1E1E1E ;color:#fff!important;} #wp_shop .btn_shopbag2 { background: #0b327d; color: #fff; } #wp_shop .btn_shopbag:hover {color: #000;} #wp_shop .btn_shopbag2:hover {color: #d0e0ff;} #wp_shop .btn_buynow { background: #000; color: #fff; } #wp_shop .btn_buynow:hover {color: #fff;} #wp_shop .option_btnbx {margin-top: 20px;padding: 0 15px;} #wp_shop .prd_intro_span { padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #dbdbdb; } #wp_shop .prd_intro_span span { font-size: 16px; font-weight: 500;font-family:'Pretendard-regular', 'Noto Sans KR'!important;} #wp_shop .wp_empty {width: 100%;display: inline-block;} /* 빈공간채우기 */ /* 옵션항목 */ #wp_shop .wp_option_wrap {overflow: hidden;border-bottom: 1px solid #888;padding-bottom: 15px;} /* 상세페이지 이미지 반응형 */ #wp_shop .wp_option_wrap img {max-width: 100%;} /* 상세페이지 이미지 반응형 */ #wp_shop .wp_option_wrap .wp_option_li {margin-bottom: 30px;padding: 0 5px !important;} #wp_shop .wp_option_wrap .wp_option_li_title {padding: 5px 0;font-size: 13px;font-weight: 600;} #wp_shop .wp_option_wrap .wp_option_li_ea {font-size: 12px;} /* #wp_shop .wp_option_wrap .wp_option_li_ea input {border: 1px solid #888;width: 40%;text-align: center;} */ #wp_shop .wp_option_wrap .wp_option_li_ea * {display: inline-block;vertical-align: middle;} /* 상세페이지 시작 */ #wp_shop #wp_detail_view { border-bottom: 1px solid #888; margin-bottom: 50px; padding: 0 15px;} #wp_shop #wp_detail_view .wp_view_title { border-top: 1px solid #888; border-bottom: 1px solid #888; font-size: 20px; font-weight: 600; margin: 15px 0; padding: 15px; } #wp_shop #wp_detail_view .wp_view_sub { padding-top: 30px; padding-bottom: 50px; line-height: 1.5; padding-left: 15px;padding-right: 15px;} #wp_shop #wp_detail_view .wp_view_sub p{font-family:'Pretendard-regular', 'Noto Sans KR'!important; border-bottom: 1px solid #b3b3b3;padding-bottom: 10px;margin-bottom: 20px;} #wp_shop #wp_detail_view .wp_view_sub textarea { width: 100%;font-family:'Pretendard-regular', 'Noto Sans KR'!important;} #wp_shop .wp_view_sub img {max-width: 100%;} /* 상세페이지 이미지 반응형 */ /* 2020-06-05 */ /* view_slide */ #wp_shop .wp-swiper-container {min-height: auto !important;} #wp_shop .swiper-button-prev:before, #wp_shop .swiper-container-rtl .swiper-button-next:before {content:"" !important;} #wp_shop .swiper-button-next:before, #wp_shop .swiper-container-rtl .swiper-button-prev:before {content:"" !important;} #wp_shop .wp-swiper-container.gallery-thumbs img,#wp_shop .swiper-slide img {width: 100%;} #wp_shop .gallery-thumbs {margin-top: 10px;} /* 미디어 쿼리 */ @media screen and (max-width:786px) { #wp_shop .wp_img_div { width: 100%; padding: 0px; } #wp_shop .wp_detail_div { width: 100%; padding-left: 0%; } #wp_shop.sel_box .wp_prd_option { margin: 15px auto 0;padding: 10px 30px;width: 100%;display: inline-block; } /* 옵션 */ #wp_shop .wp_img_div #wp-pager {margin: 15px 0;} #wp_shop .wp_img_div #wp-pager a {width: 25%;} /* 상세페이지 이미지 반응형 */ .wp_view_sub img {width: 100%;} #wp_shop .gallery-thumbs {margin-bottom: 15px;} #wp_shop .wp_img_div {padding: 0;} } @media screen and (max-width:480px) { #wp_shop .wp_detail_div .prd_choice > table .wp_choice_title {display: block;border-bottom: none;} #wp_shop .wp_detail_div .prd_choice > table .wp_choice_right {display: block;} } /* search S */ #wp_shop .wp_search_box {text-align: center;padding: 30px 0;border: 1px solid #ddd;margin-top: 30px;} #wp_shop .wp_search_box * {outline:none;} #wp_shop .wp_search_box h5 {padding: 5px 10px;font-size: 14px;} #wp_shop .wp_search_box .wp_select_wrap select {padding: 5px 10px;max-width: 24%;margin-right: 1%;overflow: hidden;font-size: 14px;} #wp_shop .wp_search_box .wp_select_wrap option {width: 50px !important;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;max-width: 100px; } #wp_shop .wp_search_box .important_prd {margin-top: 15px;font-size: 14px;} #wp_shop .important_prd input {padding: 3px 10px;} #wp_shop .important_prd select {padding: 5px 10px;} #wp_shop .search_button button {padding: 3px 10px;width: 100%;font-size: 15px; background-color: #333;color: #fff;border: 1px solid #525252;} #wp_shop .search_button button:hover {background-color: #fff;color: #333;border: 1px solid #525252;} #wp_shop .search_button button i {vertical-align: middle;font-weight: 600;} @media (max-width: 768px){ #wp_shop .wp_search_box .wp_select_wrap {padding:0 15px;overflow: hidden;} #wp_shop .wp_search_box .wp_select_wrap select {padding: 5px 10px;max-width: 100%;margin-bottom: 15px;} #wp_shop .wp_search_box select {padding: 5px 10px;} #wp_shop .wp_search_box h5 {font-size: 18px;text-align: left;} #wp_shop .search_button {margin-top: 15px;} } /* search E */ /* recommend slide S */ #wp_shop_recomm * {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} #wp_shop_recomm .recomm_wrap {margin: 15px 0 50px;} #wp_shop_recomm .recomm_wrap .wp_recomm_head {overflow: hidden;width: 100%;} #wp_shop_recomm .recomm_wrap .wp_recomm_head .wp_recomm_title {margin-bottom: 10px;font-size: 15px;font-weight: 600;float: left;} #wp_shop_recomm .recomm_wrap .wp_recomm_head .wp_arrow_wrap {text-align: right;margin-bottom: 10px;float: right;} #wp_shop_recomm .recomm_wrap .wp_arrow_wrap > div {background-color: #fff;display: inline-block;padding: 0 3px;border: 1px solid #ddd;cursor:pointer;} #wp_shop_recomm .recomm_wrap .wp_arrow_wrap > div:hover {background-color: #f1f1f1;} #wp_shop_recomm .recomm_wrap .wp_ellipsis2 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap:break-word; line-height: 1.2em;height: auto;max-height: 2.4em; } #wp_shop_recomm .recomm_wrap .wp_ellipsis3 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;word-wrap:break-word; line-height: 1.2em;height: auto;max-height: 3.6em; } #wp_shop_recomm .recomm_wrap .wp_ellipsis4 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;word-wrap:break-word; line-height: 1.2em;height: auto;max-height: 4.8em; } #wp_shop_recomm .recomm_wrap .swiper-slide .d_img_frame_wrap {width: 100%;padding-top: 99%;overflow: hidden;position: relative;border: 1px solid #ddd;} #wp_shop_recomm .recomm_wrap .swiper-slide .d_img_frame_wrap img { position: absolute;top: 50%;bottom: 0;left: 50%;right: 0;transform:translate(-50%,-50%); width: 100%;min-width: 100%;height: auto; } #wp_shop_recomm .recomm_wrap .swiper-slide .d_txt_frame_wrap {margin: 5px 0;} #wp_shop_recomm .recomm_wrap .swiper-slide .d_txt_frame_wrap .wp_prod_tit {font-size: 13px;font-weight: 600;color: #121212;} #wp_shop_recomm .recomm_wrap .swiper-slide .d_opt_frame_wrap {overflow: hidden;} #wp_shop_recomm .recomm_wrap .swiper-slide .d_opt_frame_wrap .wp_opt_left {width: 30%;text-align: left;color: #ec2002;float: left;padding: 0 5px;} #wp_shop_recomm .recomm_wrap .swiper-slide .d_opt_frame_wrap .wp_opt_right {display: inline-block;text-align: right;color: #121212;font-weight: 600;float: right;padding: 0 5px;} /* recommend slide E */