/* ========================================================================== ROROCLE.COM FULL DESIGN RENEWAL STYLESHEET ========================================================================== */ @charset "utf-8"; @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;700&display=swap'); @font-face { font-family: 'JSongMyung-Regular-KO'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2110@1.0/JSongMyung-Regular-KO.woff2') format('woff2'); font-weight: normal; font-style: normal; display: swap; } /* 초기화 */ html {overflow-y:scroll;height:100%} body {margin:0;padding:0;font-size:0.75em;height:100%;font-weight:400;color:#1b1b1b;font-family: "Noto sans KR","맑은 고딕", "Malgun Gothic",sans-serif;} html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0} h1, h2, h3, h4, h5, h6 {font-size:1em;color:#1b1b1b;font-weight:400;font-family: "Noto sans KR","맑은 고딕", "Malgun Gothic",sans-serif;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block} header ul, nav ul, footer ul {margin:0;padding:0;list-style:none} legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden} label, input, button, select,img{vertical-align:middle} input, button {margin:0;padding:0;font-size:1em;} button,input[type=submit]{cursor:pointer;font-family:"Noto sans KR","맑은 고딕", "Malgun Gothic",sans-serif;outline:none} input[type=text], input[type=password], input[type=submit], input[type=image], button {border-radius:0;font-size:1em;-webkit-appearance:none} textarea, select {font-size:1em;font-family: "Noto sans KR","맑은 고딕", "Malgun Gothic",sans-serif} textarea {border-radius:0;-webkit-appearance:none} p {margin:0;padding:0;word-break:break-all} hr {display:none} pre {overflow-x:scroll;font-size:1.1em} a:link, a:visited {color:#1b1b1b;font-weight:400;text-decoration:none} a:hover,a:focus{color:#000;} ul,li,ol,dt,dd,dl{list-style:none;padding:0;margin:0;} *, :after, :before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } h1 {font-size:1.4em;font-weight:700;font-family: "Noto sans KR","맑은 고딕", "Malgun Gothic",sans-serif } input[type=text],input[type=password], textarea { -webkit-transition: all 0.30s ease-in-out; -moz-transition: all 0.30s ease-in-out; -ms-transition: all 0.30s ease-in-out; -o-transition: all 0.30s ease-in-out; outline: none; } input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus { -webkit-box-shadow: 0 0 5px #9ed4ff; -moz-box-shadow: 0 0 5px #9ed4ff; box-shadow: 0 0 5px #9ed4ff; border: 1px solid #558ab7 !important; } @media (max-width: 640px){ .m_no{display:none} } /* 팝업레이어 */ #hd_pop {z-index:1000;position:relative;margin:0 auto;width:100%;height:0px} #hd_pop h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} .hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff} .hd_pops_con {} .hd_pops img{max-width:100%;height:auto} .hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right} .hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff} /* 상단 레이아웃 */ #hd {position:relative;margin:0 0 ;padding: 0;text-align:center} #hd h1 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #hd_tnb{border-bottom:1px solid #eee;border-top:2px solid #ef7777;position:relative} #hd_tnb:after {display:block;visibility:hidden;clear:both;content:""} #hd_tnb li{float:left;width:20%;position:relative} #hd_tnb li a{line-height:38px;color:#555;display:block;} #hd_tnb li a:hover{color:#d63154} #hd_tnb .join-point,#hd_tnb .cart-num{z-index: 1;position: absolute;bottom:-13px;text-align: center;width:100%;left: 0;} #hd_tnb .join-point span{white-space: nowrap;padding: 2px 7px 1px 7px;border-radius: 4px;font-size: 0.833em;line-height: 18px;;background: #b7b7b7;color: #fff;text-align: center;display:inline-block;} #hd_tnb li:hover .join-point span{background:#111} #hd_tnb .cart-num span{white-space: nowrap;padding: 2px 7px 1px 7px;border-radius: 4px;font-size: 0.833em;line-height: 18px;;background: #b7b7b7;color: #fff;text-align: center;display:inline-block;} #hd_tnb li:hover .cart-num span{background:#d63154} .hd_wr{margin:0 auto;max-width:1220px;position:relative} #logo{padding:20px 0 20px;} @media (max-width: 640px){ #logo{padding:5px 0 5px;} #logo img{width:110px;height:auto;} } #hd_sch_open {overflow:hidden;position:absolute;top:15px;right:10px;padding:0 10px;height:2.6em;border:0;background:url(../image/sch.gif) no-repeat 100% 100%;color:#fff;font-size:0.01em;width:25px;height:25px;-webkit-appearance:none;text-indent:-999px;} #hd_sch h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #hd_sch {display:none;z-index:10;} #hd_sch .btn_submit{text-indent:-999px;overflow:hidden;} #hd_sch .frm_input:focus{outline:0;border-color:#ff0000} #ppl_word{margin:7px 0;text-align:right} #ppl_word a{display:inline-block;color:#333;font-size:0.92em;display:inline-block;padding-left:10px;text-align:center} #hd_ct {width:30px;height:30px;border:0;background:url('../image/icon-menu.png') no-repeat 50% 50%;background-size:19px;color:#fff;font-size:1em;text-indent:-9999px;-webkit-appearance:none;float:left} #hd_mb:after {display:block;visibility:hidden;clear:both;content:""} #hd_mb li{float:left;width:25%;} #hd_mb li a{display:block;background:#34b5a1;color:#fff;height:40px;line-height:40px;border-left:1px solid #2d9e8c;font-weight:bold} #hd_mb li a:hover{background:#2d9e8c} #hd_mb li:first-child a{border-left:none} .hd-admin{background:#333;text-align:left; -webkit-box-shadow:0 3px 5px #ccc; -moz-box-shadow:0 3px 5px #ccc; box-shadow:0 3px 5px #ccc;} .hd-admin:after {display:block;visibility:hidden;clear:both;content:""} .hd-admin span{color:#fff;padding:13px 10px;display:inline-block;line-height:15px;} .hd-admin span strong{color:#e14d64} .hd-admin a{color:#fff;padding:13px 15px;display:inline-block;float:right;border-left:1px solid #222;line-height:15px;} .hd-admin a:hover{background:#e14d64} @media (min-width: 970px){ #hd_ct{border-right:1px solid #eee;width:50px;height:38px;background-size:15px;} #hd_ct:hover{background-color:#f3f3f3} #hd_tnb ul{text-align:right;float:right} #hd_tnb ul li{width:auto;padding:0 10px;display:inline-block;float:none} #hd_sch {display:block;float:left} #hd_sch_open{display:none;} #hd_sch .pop_close{display:none;} #hd_sch .sch_inner{border-right:1px solid #eee;position:relative;} #hd_sch .frm_input{background:none;border:0;height:38px;padding:0 15px;padding-right:40px;width:160px} #hd_sch .frm_input:focus{background:#f3f3f3} #hd_sch .btn_submit{background:url('../image/icon-sch-pc.png') no-repeat 50% 50%;width:40px;height:38px;position:absolute;top:0;right:0} } @media (max-width: 969px){ #hd_sch{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.9);z-index:999} #hd_sch .sch_inner{position:absolute;top:50%;left:0;width:100%;padding:0 10%;margin-top:-40px;} #hd_sch .frm_input{background:none;border:0;border-bottom:2px solid #fff;height:40px;padding:0 5px;width:100%;color:#fff;font-size:1.25em} #hd_sch .btn_submit{background:url('../image/icon-sch.png') no-repeat 50% 50%;width:30px;height:40px;position:absolute;top:0;right:10%;background-size:20px} #hd_sch .pop_close{position:fixed;top:0;left:0;width:100%;background:url('../image/icon-close.png') no-repeat 50% 50%;background-size:40px;border:0;height:70px;text-indent:-999px;overflow:hidden} #ppl_word{text-align:center} #ppl_word a{color:#fff;font-size:1.25em;padding:0 10px;line-height:30px;} #logo{padding:10px 0 10px } #logo img{max-height:60px} #hd_ct{position:absolute;top:52px;left:10px;width:30px;height:30px;z-index:9} .hd-admin a{padding: 13px 10px} } /*카테고리*/ #category{display:none;position:fixed;top:0;left:0;width:260px;overflow-y:auto;height:100%; -webkit-backface-visibility: hidden;background:#fff;z-index:909;padding:15px 10px;text-align:left; -webkit-box-shadow:0 3px 5px #ccc; -moz-box-shadow:0 3px 5px #ccc; box-shadow:3px 0 8px rgba(0,0,0,0.3);} .ct_login h2{font-size:1.5em;margin:0 0 10px;} .ct_login p{line-height:1.4em;margin:0 0 10px;color:#737373} .ct_login ul:after {display:block;visibility:hidden;clear:both;content:""} .ct_login .ct-btn li{float:left;width:50%;} .ct_login .ct-btn a{display:block;border:1px solid #ddd;text-align:center;line-height:37px;color:#3d3e3e} .ct_login .ct-btn a:hover{background:#f3f3f3;} .ct_login .ct-btn .btn_1{background:#3d3e3e;border-color:#3d3e3e;color:#fff} .ct_login .ct-btn .btn_1:hover{background:#111} .ct_login .ct-info{margin:20px 0;position:relative} .ct_login .ct-info li{float:left;width:25%;text-align:center} .ct_login .ct-info a{display:block;position:relative} .ct_login .ct-info img{width:20px;height:20px} .ct_login .ct-info strong{display:block;font-weight:normal;font-size:0.92em;padding:5px 0 0;color:#777} .ct_login .ct-info li .num{display:block;position:absolute;top:-5px;left:36px;padding:0 5px;background:#888;color:#fff;border-radius:15px;line-height:15px} .ct_login .ct-info button{border:0;background:none} .ct_logout h2{font-size:1.16em} .ct_logout dl{padding:5px 10px;background:#f3f3f3;margin:10px 0} .ct_logout dl:after {display:block;visibility:hidden;clear:both;content:""} #category ul.cate{background:#fff;;width:100%;text-align:left;text-indent:10px;padding:8px 0} #category ul.cate>li{line-height:20px;font-size:1.083em;font-weight:bold} #category ul.cate li{position:relative;} #category ul.cate li a{display:block;padding:9px 0;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;padding-right:30px;} #category ul.cate li .ct_op{display:inline-block;text-indent:-999px;background:url(../mobile/shop/img/cate_op.gif) no-repeat 10px 50% ;height:35px; width:30px;position:absolute;top:0;right:0;border:none} #category ul.cate li a:hover{color:#d63154;font-weight:bold} #category ul.cate li .ct_cl{background-position:-12px 50%} #category ul.sub_cate{display:none;font-size:12px} #category ul.sub_cate1 li{text-indent:14px;background:#fafafa;font-weight:normal} #category ul.sub_cate2 li{text-indent:25px;background:#f6f6f6;} #category ul.sub_cate3 li{text-indent:40px;background:#f3f3f3;} #category ul.sub_cate4 li{text-indent:55px;background:#efefef;} #category .pop_close{position:absolute;top:5px;right:5px;width:30px;height:30px; background:url('../mobile/shop/img/icon-close-bl.png') no-repeat 50% 50%;;border:none;text-indent:-99999px;background-size:15px;opacity:0.5} #category .pop_close:hover,#category .pop_close:focus{opacity:1} #category .cate-com:before{width:15px;height:2px;content:'';background:#000;display:block;margin:0 10px 20px} #category ul.cate-com li a{padding:6px 0;font-weight:normal} #category ul.cate-com li{font-size:1em} /* 중간 레이아웃 */ #container {} .container{margin:0 auto;} .container{margin:0 auto;max-width:1220px;padding:0 10px} .idx-container{margin:0 auto;} #container_title {margin:60px 0 0;padding:0;font-size:2em;color:#888;text-align:center;font-weight:bold;} #container_title span{display:inline-block;padding-bottom:10px;} .idx-container #container_title{display:none} @media (max-width: 969px){ #container_title{margin:30px 0 0;font-size:1.25em} } /* 하단 레이아웃 */ #ft {margin:20px 0 0;text-align:left;border-top:1px solid #eaeaea;line-height:1.5em} #ft h2{position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #ft h3{margin:0 0 15px;font-weight:normal;letter-spacing:1px;font-weight:normal;font-size:11px;color:#000} .ft_wr{margin:0 auto;max-width:1200px;padding:00px 10px 0;} .ft_wr:after {display:block;visibility:hidden;clear:both;content:""} .ft_con{width:33%;float:left;padding: 10px 3%;color:#777;line-height:1.7em;word-wrap: break-word;border-left:1px solid #eee;min-height:180px} #ft_cs{border-left:0} #ft_cs strong{color:#000;font-size:1.5em} #ft_cs p{font-size:0.92em;margin:5px 0 0;color:#777 } #ft_cs .qa_link{display:inline-block;background:#3d3e3e; width: 100%; height: 40px; margin: 5px 0; font-size: 1.083em; font-weight: 700;border: 0; background: #3d3e3e; color: #fff !important; letter-spacing: -0.1em; padding: 10px;} #ft_bank p{margin:0 0 10px;color:#000;font-weight:bold} #ft_if strong{display:block;color:#000} #ft_if span{font-size:0.92em;margin-right:5px;display:inline-block} #ft_link{background:#f3f3f3;padding:25px 0;text-align:center} #ft_link li{display:inline-block;line-height:14px;padding:0 10px;text-align:left;font-weight:normal;border-left:1px solid #bbb} #ft_link li:first-child{border:0} #ft_link li a{color:#555} #top_btn{position:fixed;right:10px;bottom:10px;border:0;background:none;opacity:0.6;z-index:99} #top_btn:hover,#top_btn:focus{opacity:1} #top_btn2{position:fixed;right:10px;bottom:10px;border:0;background:none;opacity:0.9;z-index:99} #top_btn2:hover,#top_btn2:focus{opacity:1} #ft .copy{clear:both;padding:20px 10px;text-align:center;border-top:1px solid #f3f3f3;color:#777;font-size:0.92em} #ft .copy a{clear:both;padding:20px 10px;text-align:center;color:red;font-weight:700;font-size:0.92em} @media (max-width: 969px){ .ft_con{width:100%;padding:20px 10px;min-height:auto;border-left:0;border-top:1px solid #eee} .ft_wr{padding:10px} #ft_cs{border-top:0} #ft_cs a{width:100%;text-align:center} #ft_link{padding:15px} #ft_link li{padding:0 5px} } /* 목록 바로가기 */ .sanchor{border-bottom:1px solid #000;margin:30px 0 10px;text-align:center;font-size:0} .sanchor:after {display:block;visibility:hidden;clear:both;content:""} .sanchor li {display:inline-block;margin-bottom:-1px;text-align:center;line-height:40px;font-size:0.92em;font-size:12px;margin-left:-1px} .sanchor a{display:block;color:#646464;border:1px solid #ddd;border-bottom-color:#000;background:#fcfcfc;padding:0 30px} .sanchor a:hover{background:#fff} .sanchor a.sanchor_on {;border:1px solid #000;border-bottom:1px solid #fff;font-weight:bold;color:#000;background:#fff;position:relative} .sanchor a span{display:inline-block;line-height:18px;padding:0 5px;background:#aaa;color:#fff;border-radius:5px} .sanchor a.sanchor_on span{background:#ef7878} @media (max-width: 969px){ .sanchor{border:none;border-bottom:0;margin-bottom:15px} .sanchor li {width:33.333%;margin-left:-1px} .sanchor a{padding:0 5px;border-color:#ddd} .sanchor a.sanchor_on{background:#fff;border-color:#000;color:#333} } /*아이콘*/ .icon{display:inline-block;font-size:10px;padding:0 5px;line-height:14px;color:#fff;margin:2px} .icon_soldout{background:#ff0000} .icon_hit{background:#d5b46c} .icon_new{background:#a4a4a4} .icon_rec{background:#99d7a5} .icon_best{background:#cbb1b5} .icon_cp{background:#708bcf} .icon_sale{position:absolute;top:0;left:15px;} .icon_sale img{width:25px;height:auto} .icon_plus{display:inline-block;float:right;font-size:12px;color:#2c2c2c;padding:0px;margin:0px;} @media (max-width: 640px){ .icon_sale img{width:20px;height:auto} } /* ########## 쇼핑몰 컨텐츠 ########## */ #sidx{margin:0 auto;padding:0 ;max-width:1200px} .sct-size {text-align:center;margin:30px 0 10px} .sct-size button{background:none;border:0;width:30px;height:30px;overflow:hidden;text-indent:-999px;opacity:0.2} .sct-size #btn-small{background:url(../image/btn-small.png) no-repeat 50% 50%;background-size:20px;} .sct-size #btn-big{background:url(../image/btn-big.png) no-repeat 50% 50%;background-size:20px;;} .sct-size .active{opacity:1} #sidx .sct_wrap{margin:10px} /* 메인리뷰*/ #rvtop{display:block;font-size:1.5em;font-family:"Noto Sans KR", "Antic Didone",sans-serif;text-align:center;font-weight:700;margin:auto;margin-top:-10px;} #idx_review{display:block;position:relative;} #idx_review_word{text-align:center;font-size:30px;font-family: "Antic Didone",sans-serif;} #idx_review .review {display:inline-block;} #idx_review .rv_li {position:relative;float:left;margin-bottom:25px;padding:0 10px ;width:25%;text-align:left;} #idx_review .rv_li:nth-child(4+1){clear:both} #idx_review .li_wr {border: 1px solid #e5e5e5;padding: 0;box-shadow: 0 3px 3px #fafafa;position: relative; } #idx_review .li_wr img{width:100%;height:auto; } #idx_review .txt_wr{padding:10px;} #idx_review .rv_tit{display:block;font-size:1.1em;font-weight:900;} #idx_review .rv_con{display:block;font-size:1.05em;font-weight:300;padding:0px 0 5px;min-height:70px;} #idx_review .rv_con a{display:block;color:#4c4c4c;font-size:1.05em;font-weight:300;padding:5px 0 5px;min-height:70px;} #idx_review .rv_prd{display:inline-block;padding:10px 0 0px;font-weight:600;display:block;border-top:1px solid #eee;} #idx_review .rv_prd img{width:100%;height:auto;max-width:30px;} @media (max-width: 640px){ #idx_review .rv_li {width:50%} #idx_review .rv_li:nth-child(2n+1){clear:both} #idx_review_word{text-align:center;font-size:24px;font-family: "Antic Didone",sans-serif;} } /* 기존 메인리뷰 #idx_review{position:relative} #idx_review .review {padding:0 45px} #idx_review .rv_li {padding-bottom:10px} #idx_review .li_wr {border: 1px solid #e5e5e5;padding: 0;box-shadow: 0 3px 3px #fafafa;position: relative; object-fit:cover;} #idx_review .li_wr img{width:100%;height:auto; } #idx_review .txt_wr{padding:10px;} #idx_review .rv_tit{display:block;font-size:1.083em} #idx_review .rv_prd{padding:5px 0 10px;color:#ef7878;display:block;border-bottom:1px solid #eee;font-style:italic} #idx_review p{margin-top:10px;line-height:1.5em} #idx_review .owl-next{position:absolute;top:50%;right:0;margin-top:-18px;background:url(../img/btn_next.png) no-repeat 50% 50%;width:40px;height:40px;text-indent:-999px;overflow:hidden;opacity:0.4} #idx_review .owl-prev{;position:absolute;top:50%;left:0;margin-top:-18px;background:url(../img/btn_prev.png) no-repeat 50% 50% ;width:40px;height:40px;text-indent:-999px;overflow:hidden;opacity:0.4} #idx_review .owl-prev:hover,#idx_review .owl-next:hover{opacity:1} #idx_review .owl-next,#idx_review .owl-prev {background-size:20px} #idx_review .disabled,#sit_pvi .disabled:hover{opacity:0} */ .sev_admin{text-align:right} .sev_admin .btn_admin{line-height:35px;padding:0 10px;} /* 장바구니 주문서 공통 */ #sod_chk {margin:10px;} .sod_list {} .sod_list .sod_li {background:#fff;border:1px solid #ddd;margin:10px 0} /*.sod_list .sod_li:hover{border-color:#ef7878;position:relative;}*/ .sod_list .li_name{border-bottom:1px solid #dcdcdc;line-height:1.3em;padding: 10px 10px;font-size:1.083em} .sod_list .li_op_wr{position:relative;margin:10px;padding-left:90px;min-height:80px} .sod_list .total_img{position:absolute;top:0;left:0} .sod_list .mod_options{padding: 0 7px;border: 1px solid #38b2b9;color: #38b2b9;background: #fff;height: 23px;line-height: 21px;margin: 5px 0 0;} .sod_list .li_prqty{margin:10px 10px ;border-top:1px solid #dcdcdc;padding:10px 0 0} .sod_list .li_prqty:after {display:block;visibility:hidden;clear:both;content:''} .sod_list .li_prqty_sp{float:left;width:50%;display:block;line-height:20px;padding:0 7px;text-align :right;} .sod_list .li_prqty_sp span{float:left} .sod_list .prqty_sc,.sod_list .prqty_price{border-right:1px solid #dcdcdc} .sod_list .total_price{background:#f5f5f5;border:1px solid #e2e2e2;display:block;clear:both;margin:10px;text-align:right;padding:5px 10px;line-height:20px} .sod_list .total_price span{float:left} .sod_list .total_price strong{font-size:1.25em;color:#ff006c} .sod_opt li {padding-left: 10px;background: url('../img/bullet.gif') no-repeat 3px 50%;color: #777;margin: 3px 0 5px;line-height: 1.3em;} #sit_opt_added {margin:0;padding:0;border-bottom:0;background:#fff;list-style:none;} #sit_opt_added li {padding:10px 0;border-bottom:1px solid #cdcdcd;position:relative} #sit_opt_added li .opt_name{line-height:18px;padding:0 0 5px;width:100%;text-align:left;} #sit_opt_added li .opt_count{width:100%} #sit_opt_added li .opt_count:after {display:block;visibility:hidden;clear:both;content:""} #sit_opt_added button {float:left;width:30px;height:30px;border:1px solid #cdcdcd;background:#fff;color:#666;font-size:0.92em} #sit_opt_added button:hover{color:#000} #sit_opt_added .num_input {float:left;border:0;height:30px;width:40px;border-top:1px solid #e6c6c6;border-bottom:1px solid #e6c6c6;text-align:center;} #sit_opt_added .num_input:focus{background:#f6d5d5;outline:0} #sit_opt_added .sit_opt_del{border:0;font-size:15px;background:#d3d3d3;margin-left:3px;background:url(../mobile/shop/img/icon-close-s.png) no-repeat 50% 50% #ed7c7c;;text-indent:-999px;width:30px;height:30px;overflow:hidden} #sit_opt_added .sit_opt_del:hover{color:#be334a} #sit_opt_added .sit_opt_prc{float:right;display:block;padding:0 3px;text-align:right;line-height:30px;font-size:1.183em;font-weight:bold;} #sit_opt_added .btn_frmline {height:1.85em;line-height:1.85em;background:url(../mobile/shop/img/icon-close-s.png) no-repeat 50% 50% #ed7c7c;;text-indent:-999px;width:30px;height:30px;padding:0} #sit_opt_added .btn_frmline:hover{background-color:#cd7070} #sit_opt_added li div .sit_qty_plus{overflow:hidden;background:url(../mobile/shop/img/add.png) no-repeat 2px 2px #fff; text-indent:-999px;border:0;width:30px;height:30px;border: 1px solid #e6c6c6;} #sit_opt_added li div .sit_qty_minus{overflow: hidden;background: url(../mobile/shop/img/add.png) no-repeat -24px 2px #fff;text-indent: -999px;border: 0;width: 30px;height: 30px;border: 1px solid #e6c6c6;} #sit_opt_added li div .sit_qty_minus:hover,#sit_opt_added li div .sit_qty_plus:hover{background-color:#fcf5f5} #sit_opt_added li div .frm_input{width:34px;border:0;height:30px;padding:0 !important;line-height:30px;text-align:center;background:#faf4f4;float:left;border:1px solid #e6c6c6} #sit_tot_price {margin:15px 0;font-size:1.3em;font-weight:bold;text-align:right;position:relative} #sit_tot_price span{;font-weight:normal;font-size:13px} select.it_option,select.it_supply { width: 100%;height: 40px;line-height: 38px;font-size: 13px;color: #862525;border: 1px solid #e7c7c7 ;background: url(../mobile/shop/img/select.png) no-repeat right #fff; text-indent: 10px;vertical-align: middle !important;outline: none;-webkit-appearance: none;-moz-appearance: none;} select.it_option:hover,select.it_supply:hover{background-color:#feefef} select.it_option:focus,select.it_supply:focus{background-color:#e7c7c7} select.it_option option{background:#e7c7c7;} @media (min-width: 970px){ .sod_list .li_op_wr{width:70%;float:left;margin:10px 0;padding-left: 100px;} .sod_list .li_prqty{width:30%;float:right;margin:0;border:0;padding:15px;} .sod_list .li_prqty_sp{width:100%;border:0} .sod_list .total_img{left:10px} } /* 장바구니 */ #mod_option_frm{position:absolute;top:0;left:0;background:#fff;width:100%;z-index:99;border-radius:0 0 3px 3px;border:1px solid #caa8a8; -webkit-box-shadow:1px 1px 5px rgba(0,0,0,0.4); -moz-box-shadow: 1px 1px 5px rgba(0,0,0,0.4); box-shadow: 1px 1px 5px rgba(0,0,0,0.4);} #mod_option_frm h2{height:45px;line-height:45px;font-size:1.167em;padding:0 15px} #mod_option_frm #sit_sel_option{margin:0 15px 10px } #mod_option_frm #sit_tot_price{margin:15px } #mod_option_frm #sit_sel_option ul{;background:#f3f3f3;border:0 } #mod_option_frm h3{margin: 0 0 10px;color:#5772d5;} #mod_option_frm .option_wr {margin:15px ; } #mod_option_frm .option_wr label{margin: 0 0 5px;display:block} #mod_option_frm .btn_confirm{margin:15px ; } #mod_option_frm .btn_confirm .btn_submit{height:40px;font-size:1.167em;font-weight:bold;padding:0 10px} #mod_option_frm .btn_confirm .btn_close{position:absolute;top:0;right:0;width:45px;height:45px;border:0;background:none;color:#333;font-size:1.25em} #mod_option_frm #sit_opt_added li{padding:10px} #sod_bsk .btn_del_wr{margin:10px 0} #sod_bsk .sod_ta_wr{background:#fff;} #sod_bsk .go_shopping{margin: 10px} #sod_bsk .go_shopping .btn01{height:45px;line-height:43px;font-size:1.167em;font-weight:bold;width:100%;text-align:center} #m_sod_bsk_tot{background:#f4f4f4;border-radius:5px;padding:5px 10px} #m_sod_bsk_tot:after{display:block;visibility:hidden;clear:both;content:""} #m_sod_bsk_tot dt{float:left;width:40%;padding:5px 0 ;line-height:20px;clear:both} #m_sod_bsk_tot dd{float:left;width:60%;padding:5px 0;text-align:right;line-height:20px} #m_sod_bsk_tot .sod_bsk_cnt{border-top:1px solid #cdcdcd;font-weight:bold;margin-top:5px;line-height:25px} #m_sod_bsk_tot .sod_bsk_cnt strong{color:#ff006c;font-size:1.25em} #sod_bsk_act .btn_submit{height:45px;font-size:1.167em;font-weight:bold;width:100%;margin:10px 0;} @media (min-width: 970px){ #sod_bsk_act .btn_submit{width:300px} } /* 주문서 작성 */ #sod_frm .od_prd_list{margin:20px 0;background:#fff;} .od_prd_list .td_chk{border-left:0;} .od_prd_list .td_prd{border-left:0;position:relative;padding-left:90px;min-height:100px} .od_prd_list .td_prd .sod_img{position:absolute;top:15px;left:0} .od_prd_list .td_prd .sod_name{min-height:80px} .od_prd_list .td_prd .prd_name{font-size:1.167em} .od_prd_list .total_prc{color:#ff006c;font-weight:bold;font-size:1.167em} #sod_frm_orderer{padding:10px} #sod_frm_taker{padding:10px;border-top:1px solid #f3f3f3} #sod_frm_taker h2,#sod_frm_orderer h2{margin:10px 0;font-size:1.25em} .odf_list li{} .odf_list label,.odf_list strong{display:block;margin:7px 0 5px;color:#444;font-weight:normal} .odf_list .frm_input{width:100%;margin:0 0 5px} .odf_list .dlv_slt div {background:#f3f3f3;border:1px solid #ccc;margin:5px 0;padding:10px} .odf_list .dlv_slt div label{display:inline-block;margin:3px 0;color:#000} #order_address{display:block;width:80px;text-align:center;border: 1px solid #3476be;color: #3476be;;height:30px;line-height:28px;margin:5px 0 0;background:none} .odf_list .ad_default{display:inline-block;margin:0} .odf_list .btn_addsch{position:absolute;top:5px;right:5px;border-radius:3px;height:30px;} .odf_list .add_num{position:relative;display:block;} .odf_list textarea{border: 1px solid #ccc;background: #fff;color: #000;vertical-align: middle;border-radius: 3px;padding: 5px;width:100%;height:70px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); } #m_sod_frm_paysel {margin:10px 0 ;} #m_sod_frm_paysel ul {margin:0 0 ;background:#fff;padding:0 0 10px;} #m_sod_frm_paysel ul:after {display:block;visibility:hidden;clear:both;content:""} #m_sod_frm_paysel li {float:left;padding:5px ;width:46%;height:25px} #m_sod_frm_paysel .KPAY{background:url('../../../img/kpay.png') no-repeat;width:37px;height:15px;overflow:hidden;text-indent:-999px;display:inline-block;background-size:100%} #m_sod_frm_paysel .PAYNOW{background:url('../../../img/paynow.png') no-repeat;width:46px;height:15px;overflow:hidden;text-indent:-999px;display:inline-block;background-size:100%;} #m_sod_frm_paysel .PAYCO{background:url('../../../img/payco.png') no-repeat 1px;width:46px;height:15px;overflow:hidden;text-indent:-999px;display:inline-block;background-size:100%;} #m_sod_frm_paysel .inicis_lpay{background:url('../../../img/lpay_logo.png') no-repeat;width:35px;height:12px;overflow:hidden;text-indent:-999px;display:inline-block;background-size:100%;} #m_sod_frm_paysel .inicis_kakaopay{background:url('../../../img/kakao.png') no-repeat 50% 50% #ffeb00;border-radius:30px;height:22px;width:74px;display:inline-block;overflow:hidden;text-indent:-999px;background-size:35px auto} #m_sod_frm_paysel .kakaopay_icon{background:url('../../../img/kakao.png') no-repeat 50% 50% #ffeb00;border-radius:30px;height:22px;width:74px;display:inline-block;overflow:hidden;text-indent:-999px;background-size:35px auto} #m_sod_frm_paysel .samsung_pay{margin-left:-23px;background:url('../../../img/samsungpay.png') no-repeat 24px 3px;height:25px;width:106px;display:inline-block;overflow:hidden;text-indent:-999px} #sod_frm_pay{padding:10px;;border-top:1px solid #f3f3f3} #sod_frm_pay h2{margin:10px 0;font-size:1.25em} #sod_frm_pay .cp_btn1,#sod_frm_pay .cp_cancel1{margin-top:0} .odf_tbl{position:relative} .odf_tbl table{background:#fff;width:100%;border-collapse:collapse;border-bottom:1px solid #ccc} .odf_tbl table th{border-top:1px solid #ddd;border-left:1px solid #ddd;background:#f3f3f3;padding: 10px;text-align:left;width:120px;font-weight:normal} .odf_tbl table td{border-top:1px solid #ddd;border-right:1px solid #ddd;background:#f3f3f3;padding:7px 10px;text-align:right} #sod_frm_pt_alert{margin:10px 0;color:#328abd;} .sod_frm_point {padding-top:10px;clear:both;} .sod_frm_point div{background:#fff;border-bottom:1px solid #ddd;padding:10px;text-align:right} .sod_frm_point div:after {display:block;visibility:hidden;clear:both;content:''} .sod_frm_point div label{float:left;line-height:30px} .sod_frm_point div span{display:block;font-size:0.92em} .sod_frm_point div span:after {display:block;visibility:hidden;clear:both;content:''} .sod_frm_point div strong{float:left;color:#666;font-weight:normal} .sod_frm_point #od_temp_point{height:30px;border:1px solid #ccc;text-align:right} #settle_bank{background:#fff;border-bottom:1px solid #ccc;padding:10px;text-align:right; clear:both} #settle_bank select{height:30px;margin:0 0 5px;width:100%;} #settle_bank #od_deposit_name{height:30px;border:1px solid #ccc;text-align:center;} #settle_bank label{float:left;line-height:30px} #sod_frm_pt_info{border-bottom:1px solid #ccc} .od_coupon{position:absolute;top:0;left:0;background:#fff;width:100%;z-index:99;border-radius:0 0 3px 3px;border:1px solid #caa8a8; -webkit-box-shadow:1px 1px 5px rgba(0,0,0,0.4); -moz-box-shadow: 1px 1px 5px rgba(0,0,0,0.4); box-shadow: 1px 1px 5px rgba(0,0,0,0.4);} .od_coupon h3{height:45px;line-height:45px;font-size:1.167em;padding:0 15px;text-align:left} .od_coupon .tbl_head02{margin:0 15px 15px} .od_coupon .tbl_head02 .btn_frmline {background:#3b67c2;color:#fff;border:0;padding:0 5px;line-height:25px } .od_coupon .tbl_head02 td{text-align:left;background:#fff !important;border-right:0} .od_coupon .tbl_head02 th{width:auto !important;border-left:0} .od_coupon .tbl_head02 .td_mngsmall{width:60px;text-align:center} .od_coupon .tbl_head02 .td_numbig{width:80px;text-align:right} .od_coupon .btn_confirm{margin:20px ; } .od_coupon .btn_confirm .btn_submit{height:40px;font-size:1.167em;font-weight:bold;width:100%;} .od_coupon .btn_confirm .btn_close{position:absolute;top:0;right:0;width:45px;height:45px;border:0;background:none;color:#333;font-size:1.25em} .cp_btn ,.cp_btn1{padding:0 7px;border:1px solid #38b2b9;color:#38b2b9;background:#fff;height:23px;line-height:21px;margin:5px 0 0 } .cp_apply{background:#3b67c2;color:#fff;border:0;padding:0 5px;line-height:25px } .cp_cancel,.cp_cancel1 {padding:0 7px;border:1px solid #aaa;color:#666;background:#fff;height:23px;line-height:21px;margin:10px 0 0 2px;} #sod_frm_escrow{margin:10px;} #sod_frm_escrow h2{font-size:1.25em} #od_pay_sl h3{font-size:1.25em} @media (max-width: 640px){ .sod_frm_point div{background:#f3f3f3;} } /* 쿠폰 */ #scp_list li{position:relative;padding: 0} #scp_list .li_pd{position:relative;padding:10px} #scp_list .li_title{font-weight:bold;font-size:1.167em;} #scp_list .pd_price{position:absolute;top:10px;right:10px} #scp_list .pd_price strong{color:#ff006c;font-size:1.5em;} #scp_list .li_target{color:#666;margin:5px 0 0;background:#f5f5f5;border-top:1px dashed #ddd;padding:5px 10px;line-height:25px;} #scp_list .pd_date{float:right;color:#777} /* 배송지 목록 */ #sod_addr {} #sod_addr ul {margin:0;padding:0;list-style:none} #sod_addr li {position:relative;padding:0;border-bottom:1px solid #e9e9e9} #sod_addr .addr_title{border-bottom:1px solid #ddd;padding:10px 10px 10px 30px;} #sod_addr .ad_subject{height:30px ;border:1px solid #bbb;width:100%;padding:0 10px} #sod_addr .ad_chk{position:absolute;top:17px;left:10px} #sod_addr .addr_info{padding:15px} #sod_addr .addr_name{margin:0 0 10px;font-weight:bold;font-size:1.083em} #sod_addr .addr_addr{line-height:1.5em;margin:5px 0;} #sod_addr .addr_tel{margin:5px 0;color:#666} #sod_addr .fa-mobile{font-size:14px} #sod_addr .addr_btn{border-radius:0 0 3px 3px;padding:10px} #sod_addr .addr_btn:after {display:block;visibility:hidden;clear:both;content:""} #sod_addr .sel_address{width:32%;float:left;margin-right:1%;height:30px;background:none;border:1px solid #333;color:#333;;padding:0 5px;} #sod_addr .del_address{display:block;width:32%;text-align:center;float:left;margin-right:1%;border:1px solid #aaa;background:none;color:#888;padding:0 5px;height:30px;line-height:28px;vertical-align:middle} #sod_addr input[type="radio"]{position:absolute;width:0;height:0;overflow:hidden;visibility:hidden;text-indent:-999px;left: 0;z-index: -1px;} #sod_addr .add_lb {display: inline-block;float:left;width:32%;text-align:center;border:1px solid #4162ff;color:#4162ff;height:30px;line-height:28px} #sod_addr input[type="radio"]:checked+.add_lb {;z-index:3;background:#4162ff;color:#fff} /* 주문내역 */ #sod_v {margin:10px} #sod_v .td_stat {width:100px} #sod_v_info {margin:0 0 10px;padding:10px;background:#faecec;color:#883d1a;text-align:center} /* 주문상세내역 */ #sod_list_inq{} .sod_fin_list .sod_ta_wr{margin:15px 0;background:#fff} .sod_fin_list h2 {position:absolute;border:0;font-size:0;line-height:0;content:""} .sod_fin_list .prqty_stat{margin-top:5px;display:inline-block;padding:3px 5px;background:#6583c5;color:#fff} .sod_fin_list .li_opt{color: #777;margin: 3px 0;line-height: 1.3em;padding-right:50px} #sod_sts_wrap{margin:10px 0} #sod_sts_wrap .btn_wr{border-top:1px solid #bbb;text-align:center} #sod_sts_explan_open{padding: 0 10px;height: 30px;border: 1px solid #bbb;border-top:1px solid #fff;margin-top:-1px;color: #333;background:none} #sod_sts_explan{display:none} #sod_fin_legend{background:#f7f7f7;;margin:0 0 10px;padding:10px;line-height:20px} #sod_fin_legend:after {display:block;visibility:hidden;clear:both;content:""} #sod_fin_legend dt{float:left;width:20%} #sod_fin_legend dd{float:left;width:80%} #sod_fin_view{margin:10px 0;} #sod_fin_view h2 {position:absolute;border:0;font-size:0;line-height:0;content:""} #sod_fin_view h3{font-size:1.167em;margin:20px 0 10px} #sod_fin_no{margin:10px 0;border:2px solid #b9b9b9;background:#f3f3f3;;color:#444;text-align:center;padding:10px} #sod_fin_no strong{font-size:1.167em} #sod_fin_tot{margin:10px 0} #sod_fin_tot h2{font-size:1.167em;margin:20px 0 10px} #sod_fin_tot ul{margin:0;padding:0;list-style:none} #sod_fin_tot li{padding:10px;background:#38b2b9;border-bottom:1px solid #5ec2c7;color:#fff;zoom:1} #sod_fin_tot li:after{display:block;visibility:hidden;clear:both;content:""} #sod_fin_tot #alrdy{border-bottom:0 !important} #sod_fin_tot strong {float:right} #sod_fin_cancel{margin:10px 0;text-align:center} #sod_fin_cancel h2{position:absolute;border:0;font-size:0;line-height:0;content:""} #sod_fin_cancel h2 {position:absolute;font-size:0;line-height:0;overflow:hidden} #sod_fin_cancel button {height:40px;border:1px solid #5e6b6f;font-weight:bold;padding:0 10px;background:none;color:#5e6b6f;} #sod_fin_cancel p{text-align:center;background:#ffe0e0;border:2px solid #d50c0c;padding:15px;color:#d50c0c;font-size:1.167em;font-weight:bold} #sod_fin_cancelfrm {display:none;margin:10px 0 0;text-align:center;background:#fff;padding:15px;max-width:600px;margin:0 auto} #sod_fin_cancelfrm:after {display:block;visibility:hidden;clear:both;content:""} #sod_fin_cancelfrm .frm_input {background:#fff;margin: 0 0 ;width:80%;float:left;} #sod_fin_cancelfrm .btn_frmline{background:#5e6b6f;color:#fff;border:0;height:40px;width:20%;float:left;cursor:pointer} #sod_fin_test {padding:10px} /* 마이페이지 */ #smb_my {position:relative;} #smb_my_ov{;border:1px solid #e6e6e6;margin:0 0 15px;} #smb_my_ov .hello_name{background:#f8f8f8;text-align:center;padding-bottom:20px;border-bottom:1px solid #e6e6e6;position:relative;} #smb_my_ov h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #smb_my_ov .my_img{display:inline-block;border-radius:50%;overflow:hidden;position:relative;margin:35px 0 0; -webkit-box-shadow:0 6px 10px rgba(0,0,0,0.1); -moz-box-shadow:0 6px 10px rgba(0,0,0,0.1); box-shadow:0 6px 10px rgba(0,0,0,0.1);} #smb_my_ov .btn_edit{position:Absolute;bottom:0;left:0;width:100%;background:#959595;line-height:23px;color: #fff;} #smb_my_ov .btn_edit:hover{background:#d25959;color:#fff} #smb_my_ov .my_name{margin:10px 0} #smb_my_ov .btn_out{position:absolute;top:0;right:0;background:#fff;border-bottom:1px solid #e6e6e6;border-left:1px solid #e6e6e6;border-radius:0 0 0 5px;padding:0 5px;line-height:22px;font-size:11px;color:#777} #smb_my_wr {min-height:560px} .my_cou_wr{border-bottom:1px solid #e6e6e6;font-weight:bold;} .my_cou_wr:after {display:block;visibility:hidden;clear:both;content:""} .my_cou_wr .my_cou{float:left;width:50%;border-right:1px solid #e6e6e6;text-align:center;padding:10px 0} .my_cou_wr .my_po{float:left;width:50%;text-align:center;padding:10px 0} .my_cou_wr img{padding:5px 0 0;width:23px;height:auto;} .my_cou_wr a{color:#d63154} .my_cou_wr span{display:block;line-height:20px;color:#000} .my_info{padding:0 10px;line-height:18px} .my_info dt{border-top:1px solid #e6e6e6;color:#5366ae;padding:10px 0 0;font-size:0.92em} .my_info dd{padding:0 0 10px;} .my_info dt:first-child{border:0} .btn_my_if{width:100%;border:0;background:#fff;padding:10px;background:#f3f3f3} #smb_my_od{margin:0 0 50px;padding: 0} #smb_my_od h2{margin:0 0 10px;font-size:1.25em} #smb_my_wish{margin:0 0 35px} #smb_my_wish h2{margin:0 0 10px;font-size:1.25em} #smb_my_wish ul:after {display:block;visibility:hidden;clear:both;content:""} #smb_my_wish li{float:left;width:25%;padding:5px} #smb_my_wish li img{width:100%;height:auto;} #smb_my_wish li a{display:block;margin:5px 0;font-weight:bold} @media (min-width: 970px){ #smb_my_ov{position:absolute;top:0;left:0;width:280px} #smb_my {padding:10px;padding-left:300px} .btn_my_if{display:none;} } @media (max-width: 969px){ .my_info{display:none} } @media (max-width: 640px){ #smb_my_wish li {width:50%} } /* 위시리스트 */ #sod_ws {margin:10px;border-top:1px solid #ddd;} #sod_ws li{background:#fff;border-bottom:1px solid #ddd;margin:10px 0;position:relative;border-radius:3px} #sod_ws .wish_img{ position: absolute;top: 50%;left: 20px;z-index: 10;width: 70px;height: 70px;margin-top: -35px;border-radius:50%;overflow:hidden;z-index:4} #sod_ws .wish_info{padding:15px 15px 15px 100px;min-height:90px} #sod_ws .wish_chk{position:absolute;top:5px;left:5px;z-index:9} #sod_ws .info_date{color:#777;display:block;font-size:0.92em;margin:5px 0 0} #sod_ws .wish_prd{display:block;font-weight:bold;font-size:1.083em} #sod_ws .wish_del{position:absolute;bottom:10px;right:10px;} #sod_ws .wish_del a{display:block;width:30px;height:30px;line-height:30px;background:#eee;border-radius:3px;color:#777;text-align:center;font-size:1.25em} #sod_ws .sold_out{display:inline-block;padding:3px 5px;background:#ff0000;color:#fff} #sod_ws_act {text-align:center;margin:10px 0;} #sod_ws_act:after {display:block;visibility:hidden;clear:both;content:''} #sod_ws_act .btn01{float:left;width:49%;height: 45px;background: #3d3e3e;;font-weight: bold;border: 0;color: #fff;font-weight: bold;font-size:1.25em} #sod_ws_act .btn01:hover{background:#222} #sod_ws_act .btn02{float:right;width:49%;height: 45px;border:1px solid #ddd;color: #333;font-weight: bold;background: #fff;font-weight: bold;font-size:1.25em;} #sod_ws_act .btn02:hover{background:#f3f3f3} @media (min-width: 970px){ #sod_ws_act {max-width:400px;margin:20px auto 0} } /* 주문내역 include */ #sod_inquiry li:first-child{border-top:1px solid #ccc} #sod_inquiry li {background:#fff;border:1px solid #ccc;border-top:0;padding:15px;margin:0;border-bottom:1px dashed #ccc;position:relative;border-radius:5px} #sod_inquiry li .idtime_link{font-weight:bold;font-size:1.167em} #sod_inquiry li .idtime_time{position:absolute;top:15px;right:15px;color:#999} #sod_inquiry li .inquiry_name{margin:10px 0;color:#666} #sod_inquiry li .inquiry_price{font-size:1.25em;font-weight:bold} #sod_inquiry li .inv_status{display:block;text-align:center;margin:5px 0 0;font-weight:bold} #sod_inquiry li .inv_inv{display:inline-block;text-align:center;line-height:23px;background: #ebf1f6;color: #002c84;border: 1px solid #d6e2f8;border-radius:3px;padding:0 10px;} #sod_inquiry li .inv_inv i{} #sod_inquiry .inquiry_idtime{padding-bottom:10px;border-bottom:1px solid #eee} .status_01{display:block;background:#fda83c;color:#fff;line-height:30px;} .status_02{display:block;background:#ff6f6f;color:#fff;line-height:30px;} .status_03{display:block;background:#5bd085;color:#fff;line-height:30px;} .status_04{display:block;background:#6fa8ff;color:#fff;line-height:30px;} .status_05{display:block;background:#333;color:#fff;line-height:30px;} .status_06{display:block;background:#f3f3f3;border:1px solid #ddd;color:#666;line-height:30px;font-weight:bold} @media (min-width: 970px){ #sod_inquiry .inquiry_inv{position:absolute;bottom:10px;right:10px;max-width:30%;text-align:right} #sod_inquiry li .inquiry_name{padding-right:30%} #sod_inquiry li .inv_status{display:inline-block} #sod_inquiry li .inv_status span{line-height:25px;padding:0 10px;display:inline-block;font-size:0.92em;border-radius:5px} } @media (max-width: 969px){ #sod_inquiry li .inv_inv{width:100%;margin-top:10px} } /* 주문상세내역 중 현금영수증 발급 */ #scash {} #scash section {padding:10px 0} #scash h2 {margin:0 0 10px;text-align:center} #scash .tbl_head01 th {padding:0 10px;border-top:1px solid #eee;border-bottom:1px solid #eee;background:#f2f5f9;text-align:left;} #scash_apply {padding:10px 0 15px;text-align:center} #scash_apply button {padding:10px;border:0;background:#565e60;color:#fff} #scash_copy {text-align:center} /* 화면낭독기 사용자용 */ #hd_login_msg {position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden} .msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;width:1px !important;height:1px !important;font-size:0;text-indent:-9999em;line-height:0;border:0 !important;overflow:hidden !important} /* 본문 바로가기 */ #skip_to_container a {z-index:100000;position:absolute;font-size:0;line-height:0;overflow:hidden;left:0} #skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:1.5em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em} /* 이미지 등비율 리사이징 */ .img_fix {width:100%;height:auto} /* 캡챠 자동등록(입력)방지 기본 -pc */ #captcha {position:relative} #captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden;} #captcha #captcha_img {;height:40px;border:1px solid #898989;;vertical-align:top;padding:0;margin:0} #captcha #captcha_mp3 {;margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;width:40px;height:40px;background:url('../../../img/captcha.png') no-repeat;text-indent:-999px;;border-radius:3px} #captcha #captcha_reload {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha.png') no-repeat 0 -40px;text-indent:-999px;border-radius:3px} #captcha #captcha_key {margin:0 0 0 3px;padding:0 5px;width:90px;height:40px;border:1px solid #ccc;background:#fff;font-size:1.333em;font-weight:bold;text-align:center;border-radius:3px;vertical-align:top} #captcha #captcha_info {display:block;margin:3px 0 5px ;font-size:0.95em;letter-spacing:-0.1em} /* 캡챠 자동등록(입력)방지 기본 - mobile */ #captcha.m_captcha audio {display:block;margin:0 0 5px} /* Mobile화면으로 */ #mobile_cng {display:block;margin:5px;padding:5px 0;border:1px solid #eee;border-radius:2em;background:#fff;color:#000;font-size:2em;text-decoration:none;text-align:center} /* ckeditor 단축키 */ .cke_sc {margin:0 0 5px;text-align:right} .btn_cke_sc{display:inline-block;padding:0 10px;height:23px;border:1px solid #ccc !important;background:#fafafa !important;color:#000 !important;text-decoration:none !important;line-height:1.9em;vertical-align:middle} .cke_sc_def {margin:0 0 5px;padding:10px;border:1px solid #ccc;background:#f2f5f9;text-align:center} .cke_sc_def dl {margin:0 0 5px;text-align:left} .cke_sc_def dl:after {display:block;visibility:hidden;clear:both;content:""} .cke_sc_def dt, .cke_sc_def dd {float:left;margin:0;padding:5px 0;border-bottom:1px solid #e9e9e9} .cke_sc_def dt {width:20%;font-weight:bold} .cke_sc_def dd {width:30%} /* 콘텐츠별 스타일 */ .cnt_cmt {display:inline-block;margin:0 0 0 5px;font-weight:bold} /* 버튼 */ .btn{display:inline-block;padding:0 10px;height:35px;line-height:35px;font-weight:bold} a.btn01 {display:inline-block;border:1px solid #ccc;background:#fff;color:#000;text-decoration:none;vertical-align:middle;padding:9px} a.btn01:focus, a.btn01:hover {text-decoration:none} button.btn01 {display:inline-block;margin:0;padding:7px;border:1px solid #ccc;background:#fff;color:#666;text-decoration:none} a.btn02 {display:inline-block;padding:8px 7px 7px;border:1px solid #3b3c3f;background:#4b545e;color:#fff;text-decoration:none;vertical-align:middle} a.btn02:focus, .btn02:hover {text-decoration:none} button.btn02 {display:inline-block;margin:0;padding:7px;border:1px solid #3b3c3f;background:#4b545e;color:#fff;text-decoration:none} .btn_confirm {text-align:center} /* 서식단계 진행 */ .btn_submit {border:0;background:#3d3e3e;color:#fff !important;letter-spacing:-0.1em;padding:10px;border-radius:0px !important;} fieldset .btn_submit {height:24px;line-height:1em;color:#fff} .btn_submit:hover{background:#222} a.btn_cancel {display:inline-block;border:1px solid #ccc;background:#fff;color:#000;text-decoration:none;vertical-align:middle;padding:9px} button.btn_cancel {display:inline-block;padding:7px;border:1px solid #ccc;background:#fafafa;color:#000;vertical-align:top;text-decoration:none} a.btn_frmline, button.btn_frmline {display:inline-block;padding:0 5px;height:1.9em;border:0;background:#333;color:#fff;letter-spacing:-0.1em;text-decoration:none;vertical-align:top;line-height:1.9em} /* 우편번호검색버튼 등 */ button.btn_frmline {font-size:1em} /* 게시판용 버튼 */ a.btn_b01,.btn_b01 {display:inline-block;border: 1px solid #ddd;background:#fff;color: #3d3e3e;text-decoration:none;vertical-align:middle} .btn_b01:hover, .btn_b01:hover {} a.btn_b02 ,.btn_b02{display:inline-block;background:#333;color:#fff;text-decoration:none;vertical-align:middle;border:0} a.btn_b02:hover, .btn_b02:hover {} a.btn_b03, .btn_b03 {display:inline-block;line-height:28px;border:1px solid #ed6478;color:#ed6478;background:none;text-decoration:none;vertical-align:middle} a.btn_b03:hover, .btn_b03:hover {} a.btn_admin ,.btn_admin{display:inline-block;background:#e8180c;border:0;color:#fff;text-decoration:none;vertical-align:middle} /* 관리자 전용 버튼 */ a.btn_admin:focus, a.btn_admin:hover {} /*버튼효과*/ .owl-stage{ margin: 0 auto; } /* 기본테이블 */ .tbl_wrap {margin:0 0 10px} .tbl_wrap table {width:100%;border-collapse:collapse;border-spacing:0} .tbl_wrap caption {padding:10px 0;color:#4b8b99;font-weight:bold;text-align:left} .tbl_head01 {margin:0 0 10px} .tbl_head01 caption {padding:0;font-size:0;line-height:0;overflow:hidden} .tbl_head01 thead th {padding:10px 0;font-weight:normal;text-align:center;border-top:1px solid #ddd;border-bottom:1px solid #ddd;background:#fafafa;height:40px} .tbl_head01 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head01 tfoot th, .tbl_head01 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center} .tbl_head01 tbody th {padding:8px 0;border-bottom:1px solid #e8e8e8} .tbl_head01 td {color:#666;background:#fff;;padding:10px 5px;border-bottom:1px solid #ecf0f1;line-height:1.4em;height:60px;word-break:break-all} .tbl_head01 tbody tr:hover td{background:#fafafa;} .tbl_head01 a:hover {text-decoration:underline} .tbl_head02 {margin:15px} .tbl_head02 caption {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} .tbl_head02 thead th {padding:7px 0;border-top:1px solid #333;border-bottom:1px solid #ddd;background:#f3f3f3;color:#333;font-size:0.95em;text-align:center;} .tbl_head02 thead a {color:#383838} .tbl_head02 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head02 tfoot th {border-top:1px solid #666;border-bottom:1px solid #666;background:#484848;color:#fff} .tbl_head02 tfoot td {background:#484848;color:#fff;font-weight:bold;text-align:center} .tbl_head02 tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9} .tbl_head02 td {padding:5px 3px;border-bottom:1px solid #e9e9e9;line-height:1.4em;word-break:break-all} .tbl_head03 {margin:0 0 10px} .tbl_head03 table{border-bottom:1px solid #d3d3d3} .tbl_head03 caption {padding:0;font-size:0;line-height:0;overflow:hidden} .tbl_head03 thead th {padding:12px 0;border-top:2px solid #000;border-bottom:1px solid #d3d3d3;background:#fff;color:#383838;font-size:0.95em;text-align:center;letter-spacing:-0.1em} .tbl_head03 thead a {color:#383838} .tbl_head03 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head03 tfoot th, .tbl_head03 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center} .tbl_head03 tbody th {padding:10px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9} .tbl_head03 td {padding:15px 5px;border-top:1px solid #f3f3f3;border-left:1px solid #f3f3f3;line-height:1.5em;word-break:break-all} .tbl_head03 td:first-child{border-left:0} .tbl_head03 a {} /* 폼 테이블 */ .tbl_frm01 {} .tbl_frm01 th {padding:10px 0;width:90px;border:1px solid #e9e9e9;border-left:0;text-align:left} .tbl_frm01 td {padding:10px 5px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:transparent} .wr_content textarea,.tbl_frm01 textarea,.form_01 textarea, .frm_input {border:1px solid #ccc;background:#fff;color:#000;vertical-align:middle;border-radius:3px;padding:5px;font-size:1.083em;max-width:100%; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);} .frm_input {height:40px;} .tbl_frm01 textarea {width:100%;height:100px} .tbl_frm01 a {text-decoration:none} .tbl_frm01 .frm_address {margin-top:5px;width:100%} .tbl_frm01 .frm_file {display:block;margin-bottom:5px;width:100%} .tbl_frm01 .frm_info {display:block;padding:5px 0 0;color:#666;line-height:1.3em} /* 기본리스트 */ .list_01{padding:0 ;} .list_01 li{background:#fff;border-radius:3px;margin:10px 0;padding:10px 15px;border:1px solid #ccc} /* 기본폼 */ .form_01{margin:10px} .form_01 div{margin:5px 0;position:relative} .form_01 li{margin:5px 0;position:relative} .form_01 textarea, .frm_input {border:1px solid #ccc;background:#fff;color:#000;vertical-align:middle;border-radius:3px;padding:5px;max-width:100%;} .form_01 textarea {width:100%;height:100px} .frm_input {height:40px} .full_input{width:100%} .form_01 .frm_file {display:block;margin-bottom:5px;width:100%} .form_01 select{height:40px;border-radius:3px} .form_01 .frm_info{font-size:0.92em;color:#4162ff;text-align:left;margin:3px 0 10px;display:block;line-height:1.3em} /* 자료 없는 목록 */ .empty_table {padding:50px 0 !important;text-align:center !important;color:#666 !important} .empty_list {padding:50px 0 !important;text-align:center !important;color:#666 !important} /* 필수입력 */ .required, textarea.required {background-image:url('../img/require.png') !important;background-repeat:no-repeat !important;background-position:right top !important;} /* 테이블 그리드 padding 0 5px 고려한 넓이 */ .grid_1 {width:40px} .grid_2 {width:100px} .grid_3 {width:120px} .grid_4 {width:190px} .grid_5 {width:240px} .grid_6 {width:290px} .grid_7 {width:340px} .grid_8 {width:390px} .grid_9 {width:440px} .grid_10 {width:490px} .grid_11 {width:540px} .grid_12 {width:590px} .grid_13 {width:640px} .grid_14 {width:690px} .grid_15 {width:740px} .grid_16 {width:790px} .grid_17 {width:840px} .grid_18 {width:890px} /* 테이블 항목별 정의 */ .td_chk {width:50px;text-align:center} .td_group {width:100px;text-align:center} .td_board {width:120px;text-align:center} .td_statsmall {width:50px;text-align:center} .td_num {width:50px;text-align:center} .td_numbig {width:100px;text-align:center} .td_mb_id {width:100px;text-align:center} .td_nick {width:100px;text-align:center} .td_name {width:100px;text-align:left} .td_namesmall {width:100px;text-align:left} .td_date {width:50px;text-align:center} .td_datetime {text-align:center} .td_mngsmall {width:50px;text-align:center} .td_mng {width:80px;text-align:center} .td_stat {text-align:center} .td_dvr{text-align:center} /* 새창 기본 스타일 */ .new_win {} .new_win #win_title {font-size: 1.2em;font-weight: bold;height: 50px;padding: 10px;line-height: 30px;background:#ef7878;color: #fff;} .new_win #win_title .sv {font-size:0.75em;line-height:1.2em} .new_win_con{margin:10px} .new_win .list_01{margin:10px} .new_win .win_ul {margin:10px} .new_win .win_ul li{display:inline-block;} .new_win .win_ul li a{display: block;line-height: 24px;padding: 0 10px;} .new_win .win_ul li .selected {background: #4162ff;color: #fff;border-radius: 13px; -webkit-box-shadow: 0 0 5px rgba(65,98,255,0.8); -moz-box-shadow: 0 0 5px rgba(65,98,255,0.8); box-shadow: 0 0 8px rgba(65,98,255,0.8);} .new_win .win_desc {margin:5px 0;font-size:0.92em;color:#4162ff} .new_win .win_btn {clear:both;margin:10px;text-align:center} .new_win .win_btn a {display:inline-block;height:40px;line-height:40px;font-weight:bold} .new_win .win_btn .btn_close {display:inline-block;padding:0 10px;border:0;background:#c6c6d2;color:#666;text-decoration:none;font-weight:bold;height:40px;border-radius:3px;margin:10px 0} .new_win .win_btn .btn_submit{width:100%;height:40px;line-height:40px;border-radius:3px;margin:0 0 20px;display:inline-block;font-weight:bold} /* 자바스크립트 alert 대안 */ #validation_check {margin:100px auto;width:500px} #validation_check h1 {margin-bottom:20px;font-size:1.3em} #validation_check p {margin-bottom:20px;padding:30px 20px;border:1px solid #e9e9e9;background:#fff} /* 사이드뷰*/ .sv_wrap {display:inline-block;position:relative;font-weight:normal} .sv_wrap .sv {z-index:1000;display:none;margin:5px 0 0;border:1px solid #283646;background:#111} .sv_wrap .sv a {display:inline-block !important;margin:0 !important;padding:5px !important;width:94px;border-bottom:1px solid #283646;color:#fff !important} .sv_wrap a:focus, .sv_wrap a:hover, .sv_wrap a:active {text-decoration:none !important} .sv_on {display:block !important;position:absolute;top:10px;left:20px;width:auto;height:auto !important} .sv_nojs .sv {display:block} /* 페이징 */ .pg_wrap {clear:both;margin:10px 0;text-align:center} .pg {display:inline-block} .pg_page, .pg_current, .qa_page {display:inline-block;padding:0 10px;height:30px;color:#000;line-height:28px;vertical-align:middle} .pg a:focus, .pg a:hover {text-decoration:none} .pg_page,.qa_page {background:#fff;border:1px solid #d4d4d4;border-radius:3px} .pg_start {background:url(../img/btn_first.gif) no-repeat 50% 50% #fff;width:30px;height:30px ;text-indent:-999px;overflow:hidden} .pg_prev {background:url(../img/btn_prev.gif) no-repeat 50% 50% #fff;width:30px;height:30px ;text-indent:-999px;overflow:hidden} .pg_next {background:url(../img/btn_next.gif) no-repeat 50% 50% #fff;width:30px;height:30px ;text-indent:-999px;overflow:hidden} .pg_end {background:url(../img/btn_end.gif) no-repeat 50% 50% #fff;width:30px;height:30px ;text-indent:-999px;overflow:hidden} .pg_current {display:inline-block;background:#444;color:#fff;font-weight:normal;border-radius:3px;line-height:30px;} /* 상품상세 메뉴 floating */ #info_top_layer {display:none;position:absolute; top:0; left:0; width:100%; background-color: #eee;} #form_btn_layer { display:none;position:absolute; top:0; left: 0; width: 100%; height: 60px; background-color: #eee;} /*현금영수증*/ #kcp_req_rx .tbl_head01 tbody th {text-align:left;} /*배송지목록*/ #sod_addr .win_desc{padding:10px 20px} /*이벤트*/ #sev_hhtml,#sev_thtml{padding:10px} #sev_hhtml img,#sev_thtml img{width:100%} /*네이버페이*/ .naverpay-item{padding-top:15px;clear:both} #sod_bsk_act .naverpay-cart{margin-top:15px;clear:both;position:static} /*PC 주문서*/ #sod_frm_orderer .tbl_frm01,#sod_frm_taker .tbl_frm01{background:#fafafa;padding:10px 0;} #sod_frm_orderer table th,#sod_frm_taker table th{border:0;padding:10px 5px;text-align:right} #sod_frm_orderer table td,#sod_frm_taker table td{border:0;padding:5px 10px;vertical-align:middle} #od_pay_sl input[type="radio"]{position:absolute;width:0;height:0;overflow:hidden;visibility:hidden;text-indent:-999px;left: 0;z-index: -1px;} #od_pay_sl .lb_icon {display: inline-block;float:left;width:50%;background:#fff;border:1px solid #eceff4;margin:-1px 0 0 -1px;cursor: pointer;height:60px;position:relative;padding-left:65px;padding-top:20px;z-index:1} #od_pay_sl input[type="radio"]:checked+.lb_icon {border:1px solid #ff006c;z-index:3} #sod_frm_paysel {} #sod_frm_paysel legend {position:absolute;font-size:0;line-height:0;overflow:hidden} #sod_frm_paysel .KPAY{background:url('../../../img/kpay.png') no-repeat 50% 50% #fff;overflow:hidden;text-indent:-999px} #sod_frm_paysel .PAYNOW{background:url('../../../img/paynow.png') no-repeat 50% 50% #fff;overflow:hidden;text-indent:-999px} #sod_frm_paysel .PAYCO{background:url('../../../img/payco.png') no-repeat 50% 50% #fff;overflow:hidden;text-indent:-999px} #sod_frm_paysel .kakaopay_icon{background:url('../../../img/kakao.png') no-repeat 50% 50% #f4dc34;overflow:hidden;text-indent:-999px} #sod_frm_paysel .bank_icon{background:url('../../../img/pay_icon1.png') no-repeat 15px 50% #fff} #sod_frm_paysel .vbank_icon{background:url('../../../img/pay_icon2.png') no-repeat 15px 50% #fff;padding-top:13px} #sod_frm_paysel .iche_icon{background:url('../../../img/pay_icon2.png') no-repeat 15px 50% #fff;padding-top:13px} #sod_frm_paysel .hp_icon{background:url('../../../img/pay_icon3.png') no-repeat 24px 50% #fff} #sod_frm_paysel .card_icon{background:url('../../../img/pay_icon4.png') no-repeat 17px 50% #fff} #sod_frm:after {display:block;visibility:hidden;clear:both;content:""} #sod_frm #sod_bsk_tot{margin:10px;} #sod_frm #sod_bsk_tot:after {display:block;visibility:hidden;clear:both;content:""} #sod_frm #sod_bsk_tot li{position:relative;float:left;background:#fff;width:33.333%;height:70px;text-align:center;border-bottom:1px solid #e7ebf1;padding:15px 0} #sod_frm #sod_bsk_tot li:after {display:block;visibility:hidden;clear:both;content:""} #sod_frm #sod_bsk_tot li span{display:block;color:#777;margin-bottom:5px;font-weight:bold} #sod_frm #sod_bsk_tot .sod_bsk_sell,#sod_frm #sod_bsk_tot .sod_bsk_coupon{border-right:1px solid #e7ebf1} #sod_frm #sod_bsk_tot .sod_bsk_point,#sod_frm #sod_bsk_tot .sod_bsk_cnt{width:100%;clear:both;height:40px;padding:0 15px;line-height:40px;text-align:right} #sod_frm #sod_bsk_tot .sod_bsk_point span,#sod_frm #sod_bsk_tot .sod_bsk_cnt span {float:left;margin:0} #sod_frm #sod_bsk_tot .sod_bsk_coupon:before{display:block;content:"-";position:absolute;top:25px;left:-10px;width:20px;height:20px;background:#fff;color:#ff006c;border-radius:50%;border:1px solid #e7ebf1;font-weight:bold;font-size: 16px;line-height: 14px;} #sod_frm #sod_bsk_tot .sod_bsk_dvr:before{display:block;content:"+";position:absolute;top:25px;left:-10px;width:20px;height:20px;background:#fff;color:#ff006c;border-radius:50%;border:1px solid #e7ebf1;font-weight:bold;font-size: 16px;line-height: 14px;} #sod_frm #sod_bsk_tot .sod_bsk_cnt strong{color:#ff006c;font-size:1.25em} #sod_frm_pay {position:relative} #sod_frm_pay .pay_tbl table{width:100%;border-collapse:collapse} #sod_frm_pay .pay_tbl th{text-align:left;padding:10px;width:80px;border-bottom:1px solid #e7ebf1;background:#fff;font-weight:bold;color:#777} #sod_frm_pay .pay_tbl td{text-align:right;padding: 10px;height:30px;border-bottom:1px solid #e7ebf1;background:#fff} #sod_frm_pay .pay_tbl td .cp_cancel{margin:0 0 0 2px} #sod_frm_pay .pay_tbl td .btn_frmline{padding: 0 7px;border: 1px solid #38b2b9;color: #38b2b9;background: #fff;height: 23px;line-height: 21px;margin: 0;} #sod_frm_pay #od_pay_sl{margin-top:20px} #od_tot_price{margin: 0;font-weight:bold;text-align:right;padding:10px;background:#fff} .odf_tbl #od_tot_price {background:none} #od_tot_price span{float:left;font-weight:bold} #od_tot_price strong{font-size:1.5em;color:#ff006c} .btn_address{background:#70aff2;border:1px solid #3476be;height:40px;color:#fff;padding:0 10px;font-size:1.083em;font-weight:bold} .sod_left{display: table-cell;width:65%;padding:0 10px;vertical-align:top;} .sod_right{display: table-cell;width:35%;background:#eceff4;padding:20px;vertical-align:top;height:100%} @media (max-width: 970px){ .sod_right,.sod_left{display:block;width:100%;padding:10px} #sod_frm .frm_input{width:100%} } /*개인결제 폼*/ #m_sod_frm_orderer {margin:10px;} #m_sod_frm_orderer h2{position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #m_sod_frm_orderer ul{background:#fff;margin:10px 0;border-bottom:1px solid #ccc;padding:10px 15px} #m_sod_frm_orderer li{line-height:20px} #m_sod_frm_orderer th{width:80px} #m_sod_frm_orderer td .frm_input{width:100%} #m_sod_frm_orderer #sod_frm_paysel ul{border:1px solid #ddd} #m_pv_sod_frm .btn_confirm{margin:10px} #m_pv_sod_frm .btn_confirm .btn_submit{width:100%;height: 45px;font-size: 1.167em;font-weight: bold;margin:0 0 3px;} #m_pv_sod_frm .btn_confirm .btn_cancel{width:100%;height: 45px;line-height: 43px;font-size: 1.167em;font-weight: bold;padding:0} #forderform{display:table;width:100%} #forderform .pesonal table th{text-align:right;border:0;padding-right:10px} #forderform .pesonal table td{border:0} #personal_pay h2{margin:0 0 10px} #personal_pay input[type="radio"]{position:absolute;width:0;height:0;overflow:hidden;visibility:hidden;text-indent:-999px;left: 0;z-index: -1px;} #personal_pay .lb_icon {display: inline-block;float:left;width:50%;background:#fff;border:1px solid #eceff4;margin:-1px 0 0 -1px;cursor: pointer;height:60px;position:relative;padding-left:65px;padding-top:20px;z-index:1} #personal_pay input[type="radio"]:checked+.lb_icon {border:1px solid #ff006c;z-index:3} #personal_pay legend {position:absolute;font-size:0;line-height:0;overflow:hidden} #personal_pay .KPAY{background:url('../../../img/kpay.png') no-repeat 50% 50% #fff;overflow:hidden;text-indent:-999px} #personal_pay .PAYNOW{background:url('../../../img/paynow.png') no-repeat 50% 50% #fff;overflow:hidden;text-indent:-999px} #personal_pay .PAYCO{background:url('../../../img/payco.png') no-repeat 50% 50% #fff;overflow:hidden;text-indent:-999px} #personal_pay .kakaopay_icon{background:url('../../../img/kakao.png') no-repeat 50% 50% #f4dc34;overflow:hidden;text-indent:-999px} #personal_pay .bank_icon{background:url('../../../img/pay_icon1.png') no-repeat 15px 50% #fff} #personal_pay .vbank_icon{background:url('../../../img/pay_icon2.png') no-repeat 15px 50% #fff;padding-top:13px} #personal_pay .iche_icon{background:url('../../../img/pay_icon2.png') no-repeat 15px 50% #fff;padding-top:13px} #personal_pay .hp_icon{background:url('../../../img/pay_icon3.png') no-repeat 24px 50% #fff} #personal_pay .card_icon{background:url('../../../img/pay_icon4.png') no-repeat 17px 50% #fff} #personal_pay .btn_confirm .btn_submit{width:100%;line-height:45px;margin:10px 0 5px} #personal_pay .btn_confirm a{width:100%;line-height:45px;} @charset "utf-8"; /*메인배너*/ #main_bn2{} #main_bn2 .owl-item{background:#000;min-width:320px;} #main_bn2 .owl-item div{opacity:0.7;} #main_bn2 .center div{opacity:1;} #main_bn2 .owl-next{background:url(./img/nx_btn_3.png) no-repeat 50% 50% #fff;opacity:0;display:inline-block;width:50px;height:50px;position:absolute;top:50%;right:0;margin-top:-25px;border-radius:5px 0 0 5px;text-indent:-999px;overflow:hidden} #main_bn2 .owl-prev{background:url(./img/pv_btn_3.png) no-repeat 50% 50% #fff;opacity:0;display:inline-block;width:50px;height:50px;position:absolute;top:50%;left:0;margin-top:-25px;border-radius:0 5px 5px 0;text-indent:-999px;overflow:hidden;} #main_bn2 .owl-next:hover,#main_bn2 .owl-prev:hover{opacity:0;} @media (max-width: 640px){ #main_bn2 .owl-next,#main_bn2 .owl-prev {background-size:18px;width:30px;height:40px;margin-top:-20px;background-color:transparent } #main_bn2 .owl-item img {min-height: 400px;object-fit: cover;} } /*왼쪽배너*/ #sbn_side{position:fixed;bottom:0;left:0;z-index:9;width:100%;height:100%;z-index:99} #sbn_side .sbn_bg{width:100%;height:100%;position:absolute;top:0;left:0;} #sbn_side_wr{display:inline-block;width:450px;max-width:100%;position:relative; -webkit-box-shadow:0 3px 5px rgba(0,0,0,0.3); -moz-box-shadow:0 3px 5px rgba(0,0,0,0.3); box-shadow:0 3px 5px rgba(0,0,0,0.3);} #sbn_side_wr img{width:100%;height:auto } #sbn_side_close{position:relative;width:100%;height:40px;padding:0 10px;text-align:right;border:0;background:rgba(230,230,230,0.8)} .sbn_slide {background:#333} .sbn_slide .owl-dots {text-align:center;position:absolute;bottom:10px;right:10px;z-index:99;} .sbn_slide .owl-dots .owl-dot{display:inline-block;width:8px;height:8px;background:#fff;margin:0 2px;opacity:0.5;border-radius:50%} .sbn_slide .owl-dots .active{opacity:1} @media (min-width: 970px){ #sbn_side{bottom:10px;left:10px;width:auto;height:auto} #sbn_side .sbn_bg{display:none} #sbn_side_wr{position:static !important;margin:0 !important} } .commu{font-size: 16px;margin-top:-30px;line-height:25px} .commu p{font-size: 12px;} .common {text-align:center;border: 0px solid #CDCDCD; padding: 7px 15px; width: auto; display: inline-block; margin: 5px 10px 20px; line-height: 17px; font-size: 12px;} .commonactive {text-align:center;border: 0px solid #CDCDCD; background: #f5f5f5; padding: 7px 15px; width: auto; display: inline-block; margin: 5px 10px 20px; line-height: 17px; font-size: 12px;} .hidden {text-align:center;border: 0px solid #CDCDCD; color:#898989; background: #f5f5f5; padding: 7px 15px; width: auto; display: inline-block; margin: 5px 10px 20px; line-height: 17px; font-size: 12px;} .hiddenactive {text-align:center;border: 0px solid #CDCDCD; color:#565656; background: #f5f5f5; padding: 7px 15px; width: auto; display: inline-block; margin: 5px 10px 20px; line-height: 17px; font-size: 12px;} /* gnb */ #gnb{border-bottom:1px solid #f0f0f0;border-top:1px solid #f0f0f0} #gnb li{display:inline-block;} #gnb li a{line-height:40px;font-size:12px;padding:0 ;display:block;font-weight:400;transition: all 0.2s;letter-spacing:1px;vertical-align:top} #gnb li a:hover{background:#f3f3f3} #gnb ul{border:0;vertical-align:top} #gnb ul:after {display:block;visibility:hidden;clear:both;content:""} @media (min-width: 970px){ #gnb li a{font-size:13px;padding:10px 15px;} } @media (max-width:969px){ #gnb{border-bottom:0;border-color:#dfdfdf} #gnb li{float:left;width:25%;border-right:1px solid #dfdfdf;border-bottom:1px solid #dfdfdf} #gnb li:nth-child(4n+1){clear:both} #gnb li a{letter-spacing:0} } /*오늘본상품*/ #today-view{display:none;position:absolute;top:50px;right:0;width:100%;background:#fff;border:1px solid #ddd;z-index:9999} #today-view h3{line-height:30px;} #today-view h3 span{font-weight:normal} #today-view img{width:100%;height:auto} #today-view ul{padding:0 10px} #today-view li{width:50%;padding:5px;} #today-view li:nth-child(2n+1){clear:both} #today-view li:after{display:block;visibility:hidden;clear:both;content:""} #today-view .stv_name{text-overflow: ellipsis;overflow: hidden;white-space: nowrap;} #stv_ul{border-top:1px solid #e6e6e6;text-align:left;} .c2{display:none} #up{position:absolute;top:0;left:0;width:50px;height:30px;border-right:1px solid #ddd;background:#f3f3f3} #down{position:absolute;top:0;right:0;width:50px;height:30px;border-left:1px solid #ddd;background:#f3f3f3} #up:hover,#down:hover{background:#f3f3f3} .stv_pgwr i{color:#aaa} .stv_no{color:#999;padding:50px 0 } #today-view .btn_close{width:100%;background:#f3f3f3;padding:10px 0} .stv_item {display:none;padding:0 9px;text-align:center;word-break:break-all} /* 쇼핑몰 이벤트 */ #sev {margin: 0 } #sev ul:after{display:block;visibility:hidden;clear:both;content:""} #sev h2{position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sev li{margin: 0} #sev li img{width:100%;height:auto} #sev li img { filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 3.5+ */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */ } #sev li img:hover { filter: none; -webkit-filter: grayscale(0%); } @media (min-width:641px){ #sev li {float:left;width:33.333%;padding:0 } } /* ##### main.(nn).skin.php, list.(nn).skin.php 공통 적용 시작 ##### */ /* 공통 */ .sct_wrap {margin:0 0 30px;zoom:1} .sct_wrap:after {display:block;visibility:hidden;clear:both;content:""} .sct {;padding:0;list-style:none;zoom:1;clear:both;} .sct:after {display:block;visibility:hidden;clear:both;content:""} .sct_li {position:relative;text-align:center} .sct_noitem {padding:50px 0;text-align:center} .sct_icon img {margin:0 1px 0 0} .sct_sns a {display:inline-block;margin:0 4px 0 0} .sct_sns button {margin:0 4px 0 0;padding:0;border:0} .mli_btn button{background:url(img/mainlist_btn.gif) no-repeat; width:30px; height:30px;border:none;text-indent:-9999px} .mli_btn button.mli_pre{position:absolute;top:0;left:10px} .mli_btn button.mli_next{background-position: -33px 0;position:absolute;top:0;right:10px} /* 상품 목록 스킨 10 */ .sct_10 .sct_li {position:relative;float:left;margin-bottom:25px;padding:0 10px ;width:25%;text-align:left;} .sct_10 .sct_li:nth-child(4n+1){clear:both} .sct_10 .sct_li_wr{position:relative} .sct_10 .sct_last {margin:0 0 15px !important} .sct_10 .sct_clear {clear:both;} .sct_10 .sct_txt {display:block;text-decoration:none;font-weight:500;line-height:20px;padding:10px 0 5px;font-size:1.083em} .sct_10 .sct_id {display:block;margin:0 0 5px} .sct_10 .sct_basic {margin:0 0 10px} .sct_10 .sct_cost {display:block;margin:0 0 5px;font-weight:bold} .sct_10 .sct_cost strike {display:block;margin:0 0 5px;color:#999;font-weight:normal} .sct_10 .sct_icon {margin:0 0 10px} .sct_10 .sct_sns {margin:15px 0 0} .sct_10 .sct_img{text-align:center} .sct_10 .sct_img img{width:100%;height:auto;} .li_more{text-align:center} .li_more img{width:30px;margin:5px 0} .li_more p{color:#aaa;margin-top:5px;display:none;} .li_more button{background:#fff;border:3px double #e9e9e9;width:205px;padding:8px 0 ;font-size:0.917em;color:#797979;margin-top:15px} .sct_10 .img_wr{position:relative;} .sct_10 .sct_btn {position:absolute;bottom:5px;right:5px} .sct_10 .sct_btn button{display:block;width:35px;height:35px;border:0;margin:2px;background:#fff;background:rgba(255,255,255,0.7);} .sct_10 .sct_btn button:hover{;background:#ef7878;color:#fff} .sct_10 .sct_cartop{display:none;position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;background:rgba(255,255,255,0.9);padding:20px;text-align:left;margin-left:-1px;z-index:90} .sct_10 .sct_cartop label{display:inline-block;margin-bottom:5px;font-weight:bold} .sct_10 .sct_cartop select{margin-bottom:10px;height:30px;line-height:28px;background-size:30px} .sct_10 .sct_cartop .cartopt_cart_btn{background:#333;color:#fff;border:0;width:100%;height:35px} .sct_10 .sct_cartop .cartopt_close_btn{background:#fff;border:1px solid #aaa;margin-top:4px;color:#333;width:100%;height:35px} @media (max-width: 640px){ .sct_10 .sct_li {width:50%} .sct_10 .sct_li:nth-child(2n+1){clear:both} .sct_10 .sct_cartop{padding:5px} } /* 기존 .sct_wrap h2{text-align:center;font-size:1.5em;font-weight:bold;border-bottom:1px solid #eee;margin:50px 0 25px} */ .sct_wrap h2{text-align:center;border: 1px solid #CDCDCD; border-radius: 50px; padding: 10px 60px; width: 230px; display: inline-block; color: #999; margin: 20px 0 20px; line-height: 17px; font-size: 12px;} .sct_wrap h3{ display: inline-block; width: 100%; padding: 13px 0; border: 0; color: #fff; margin: 0px 0 50px; font-weight: normal; letter-spacing: 0.3px; background: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#F2F3F4)); border: 1px solid #E0E1E2; border-left: 0; border-right: 0; color: #000;} .sct_wrap.big .sct_li {width:50%;} .sct_wrap.big .sct_li:nth-child(2n+1){clear:both} @media (min-width: 970px){ .sct_wrap.big .sct_li{padding:0 5%} } @media (max-width: 640px){ .sct_wrap.big .sct_li {width:100%;} #sidx .sct_wrap h2{font-size:1.25em} .sct-size li #btn-big,.sct-size li #btn-small{background-size:15px;width:25px;height:25px} } /* 관련상품 목록 스킨 10 */ #sit_rel{padding:10px 0} #sit_rel h2{position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sit_rel .sct_wrap{margin: 0} #sit_rel .sct_rel li{float:left;text-align:center;padding:5px;width:16.666%} #sit_rel .sct_rel li img{max-width:100%;height:auto} @media (max-width: 969px){ #sit_rel .sct_rel li{width:33.333%} #sit_rel .sct_rel li:nth-child(3n+1){clear:both} } /*같이구매한 상품*/ #sit_relbuy{border-top:3px double #ddd;border-bottom:1px solid #ddd;padding:20px;text-align:center} #sit_relbuy h2{text-align:center;margin:0 0 10px;font-size:1.083em;font-weight:normal} #sit_relbuy h2 strong{color:#ef7878} #sit_relbuy ul:after {display:block;visibility:hidden;clear:both;content:""} #sit_relbuy li{float:left;padding:5px;width:16.666%;text-align:center} #sit_relbuy li img{max-width:100%;height:auto} @media (max-width: 640px){ #sit_relbuy li{width:33.333%} #sit_relbuy li:nth-child(3n+1){clear:both} } /* 베스트상품 스킨 10 */ #best_item{margin-top: 20px;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;padding: 20px 0;position: relative;} /* 기존 #best_item h2{position:absolute;top:-43px;left:50%;margin-left:-70px;background:#ef7878;font-weight:normal;display: inline-block;color: #FFFFFF;font-size: 1.25em;line-height: 36px;position: relative;width: 140px;text-align:center;z-index:9} */ #best_item h2{ font-weight: 100; border: 1px solid #CDCDCD; border-radius: 50px; padding: 9px 30px; display: block; color: #999999; width:260px; line-height: 17px; font-size: 12px; margin: 20px auto; text-align: center; background: #fff;text-align:center;} /* #best_item h2:before,#best_item h2:after{ content: "";border-style: solid;border-width: 0;height: 0;position: absolute;width: 0;z-index:10} #best_item h2:before,#best_item h2:after {top:5px;z-index: -15;} #best_item h2:before {border-color: #da6161 #da6161 #da6161 transparent;border-width: 18px;left: -25px;} #best_item h2:after { border-color: #da6161 transparent #da6161 #da6161; border-width: 18px; right: -25px;} */ #best_item .owl-item{position:relative;text-align:left;} #best_item .owl-item img{width:100%;height:auto} #best_item .best_wr{position:relative} /* #best_item .best_icon{display:block;overflow:hidden;text-indent:-999px;background:url(./img/best-icon.png) 50% 0 no-repeat;background-size:40px;width:40px;height:81px;position:absolute;top:0;left:10px;opacity:0.7} */ #best_item .sct_txt{padding:10px 0;} #best_item .sct_cost{font-weight:bold;color:#e44941;padding:0 0 10px;font-size:0.92em} #best_item .owl-dots{text-align:center} #best_item .owl-dots .owl-dot{background:#aaa;width:8px;height:8px;display:inline-block;border-radius:15px;margin:3px} #best_item .owl-dots .active{background: #d63154; width: 20px;} @media (max-width: 640px){ #best_item .owl-item{padding:5px} #best_item .best_icon{width:30px;background-size:30px} } /* 개인결제 목록 */ .sct_pv {margin-top:10px} .sct_pv .sct_li {position:relative;float:left;position:relative;float:left;margin-bottom:10px;} .sct_pv .sct_img{padding:0 5px} .sct_pv .sct_img a{border:1px solid #e2edef} .sct_pv .sct_img img{width:100%;} .sct_pv .sct_last {margin:0 0 15px !important} .sct_pv .sct_clear {clear:both} .sct_pv .sct_a {display:block;position:relative;margin:0 0 5px;text-decoration:none; font-weight: bold; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; line-height: 20px;} .sct_pv .sct_id {display:block;margin:0 0 5px} .sct_pv .sct_basic {margin:0 0 10px} .sct_pv .sct_cost {display:block;margin:0 0 10px;} .sct_pv .sct_cost strike {display:block;margin:0 0 5px;color:#999;font-weight:normal} .sct_pv .sct_icon {margin:0 0 10px} /* ##### maint.(nn).skin.php, list.(nn).skin.php 공통 적용 끝 ##### */ /* 상품 목록 */ #sct {} .sct_admin {margin:0 0 10px;text-align:right} /* 상품 목록 현재 위치 */ #sct_location {border:1px solid #e9e9e9;background:#f2f5f9;letter-spacing:-4px} #sct_location a {display:inline-block;padding:5px 10px;text-decoration:none;letter-spacing:0 !important} .sct_here {font-weight:bold} .sct_bg {padding-right:13px !important;background:url('img/sct_bg_toright.gif') right 8px no-repeat} /* 상품 목록 카테고리 목록 */ .sct_ct {text-align:center;width:100%;} .sct_ct h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} .sct_ct ul {text-align:left;list-style:none;margin:0;padding:10px 0;} .sct_ct ul:after {display:block;visibility:hidden;clear:both;content:""} /* 기존 .sct_ct ul li {display:block;padding:0 15px;line-height:30px;} */ .sct_ct ul li {margin:5px 0;background:#fff;float:left;width:20%;text-align:left;} .sct_ct ul li a:hover{color:#d63154;font-weight:bold;} .sct_ct ul li span{color:#d63154;} .sct_ct ul li:first-child{background:none} .sct_ct a {text-decoration:none;color:#656565} .sct_ct_parent {font-weight:bold} .sct_ct_here {color:#ff3600 !important} @media (min-width: 970px){ .sct_ct ul li:nth-child(5n+1){border-left:0;clear:both} } @media (max-width: 639px){ .sct_ct ul li{width:33%} .sct_ct ul li:nth-child(3n+1){border-left:0;clear:both} } #sct_ct_2 li {margin:0 0 10px} #sct_ct_2 a {display:inline-block;width:120px} #sct_ct_3 li {float:left;margin:0 10px 10px 0;width:120px} /* 상품 정렬 */ #sct_sort {padding:10px 0;clear:both; ;margin:20px 0 } #sct_sort:after {display:block;visibility:hidden;clear:both;content:""} #sct_sort h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sct_sort ul {float:right;margin:0;padding:0 0 0 1px;list-style:none;} #sct_sort ul:after {display:block;visibility:hidden;clear:both;content:""} #sct_sort li {float:left;position:relative;font-size:0.92em;padding:5px 0} #sct_sort li a{display:block;padding:0 10px;border-left:1px solid #ddd;line-height:15px;color:#777} #sct_sort li:first-child a{border-left:0;} @media (max-width: 640px){ #sct_sort ul{float:none} #sct_sort li{width:33.33%;text-align:center} #sct_sort li:nth-child(3n+1) a{border-left:0;} } /* 상품 리스트 스타일 선택 */ #sct_lst {float:right;margin:10px 0;padding:0;list-style:none} #sct_lst:after {display:block;visibility:hidden;clear:both;content:""} #sct_lst li {position:relative;float:left;margin:0 0 0 -1px} #sct_lst button {position:relative;margin:0 0 0 -1px;padding:0;width:25px;height:25px;border:1px solid #ccc} #sct_lst button span {position:absolute;top:0;left:0;width:100%;height:100%;background:url('../shop/img/is_button.gif')} #sct_lst button.sct_lst_list span {background-position:0 0} #sct_lst button.sct_lst_list span.sct_lst_on {background-position:0 -30px} #sct_lst button.sct_lst_gallery span {background-position:-30px 0} #sct_lst button.sct_lst_gallery span.sct_lst_on {background-position:-30px -30px} /* 상품 상세보기 */ .sit_con{margin:15px 0 30px} #sit {margin: 0;} .sit_admin {margin:10px 10px 0;text-align:right} .sit_empty {padding:30px 0;text-align:center;color:#666} /* 상품상세 */ #info_content {padding:0 10px 30px;zoom:1} #info_content:after {display:block;visibility:hidden;clear:both;content:""} #info_content h3 {margin:0 0 10px} .if_tit{text-align:center;margin-top:10px;padding:10px;background:#f5f5f5;border:1px solid #e9e9e9;} .win_desc_if{border:1px solid #e9e9e9;padding:10px;border-top:none;} .win_desc{margin-top:10px} /* 상품 상세보기 - 개요 */ #sit_ov_wrap {margin:20px 0 ;} #sit_ov_wrap:after {display:block;visibility:hidden;clear:both;content:""} /* 상품 상세보기 - 이미지 미리보기 */ #sit_pvi {position:relative;float:left;width:63%;margin:0%;text-align:center;} #sit_pvi img{max-width:100%;height:auto;position:relative;min-width:300px} #sit_pvi .owl-next{position:absolute;top:50%;right:0;margin-top:-18px;background:url(img/btn_next.png) no-repeat 50% 50%;width:37px;height:37px;text-indent:-999px;overflow:hidden;opacity:0.4} #sit_pvi .owl-prev{;position:absolute;top:50%;left:0;margin-top:-18px;background:url(img/btn_prev.png) no-repeat 50% 50%;width:37px;height:37px;text-indent:-999px;overflow:hidden;opacity:0.4} #sit_pvi .owl-prev:hover,#sit_pvi .owl-next:hover{opacity:1} #sit_pvi .disabled,#sit_pvi .disabled:hover{opacity:0} #sit_pvi .owl-wrapper{position:relative} #sit_pvi_nw h1 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sit_pvi_nwbig {padding:10px 0;text-align:center} #sit_pvi_nwbig span {display:none} #sit_pvi_nwbig span.visible {display:inline} #sit_pvi_nw ul {margin:0 0 20px;padding:0 10px;list-style:none;text-align:center;zoom:1} #sit_pvi_nw ul:after {display:block;visibility:hidden;clear:both;content:""} #sit_pvi_nw li {display:inline-block;margin:0 0 1px 1px} #sit_pvi_nw li img {width:60px;height:60px} @media (max-width: 970px){ #sit_pvi{padding:0;width:100%;margin:0} } /* 상품 상세보기 - sns */ #sit_star_sns {position:relative;margin:10px 0;background:#fff;border:1px solid #ddd;height:45px;padding:10px;line-height:25px; } #sit_star_sns span {display:inline-block;margin:0 5px 0 0;color:#666;letter-spacing:0} #sit_star_sns .sit_star {position:relative;;margin:0 5px 0 0;vertical-align:top} #sit_star_sns a {display:inline-block;vertical-align:middle} #sit_star_sns .btn_sns_share{position:absolute;top:0;right:0;width:45px;height:45px;background:none;border:0;border-left:1px solid #e5e5e5} #sit_star_sns .sns_area{display:none;position:absolute;top:45px;right:0;background:#fff;border:1px solid #333;padding:10px;z-index:10} #sit_star_sns .sns_area:before{content: "";position: absolute;top: -8px;right: 13px;width: 0;height: 0;border-style: solid;border-width: 0 6px 8px 6px;border-color: transparent transparent #000 transparent;} #sit_star_sns .sns_area:after{content: "";position: absolute;top: -7px;right: 13px;width: 0;height: 0;border-style: solid;border-width: 0 6px 8px 6px;border-color: transparent transparent #fff transparent;} #sit_star_sns .sns_area a{display:inline-block;width:35px;height:35px;line-height:35px;background:#eee;text-align:center;} #sit_star_sns .sns_area a img{width:24px;height:auto;vertical-align:top} #sit_star_sns .sns_area #sit_btn_rec {font-size:15px} #sit_star_sns .sns_area .share-googleplus{background:#d5503a;padding:5px 0} #sit_star_sns .sns_area .share-facebook{background:#415b92;padding:5px 0} #sit_star_sns .sns_area .share-twitter{background:#35b3dc;padding:5px 0} #sit_star_sns .sns_area .share-kakaotalk{background:#ffeb00;padding:5px 0} /* 상품 상세보기 - 간략정보 및 구매기능 */ #sit_hhtml img{width:100%;height:auto} #sit_ov {position:relative;float:right;width:30%;padding: 0;height:auto !important;} #sit_ov h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sit_ov h3 {margin:0 0 5px;font-size:1em} #sit_ov section{margin: 10px 0 0;border-bottom:1px solid #d3d3d3;padding-bottom:5px} .btn_buy_wr{display:none;} #sit_ov.static .scroll_show{display:block !important;} #sit_ov.scroll_no {display:block;} #sit_ov.fixed{position:fixed;bottom:0;left:0;width:400px;max-width:100%;z-index: 999;margin:0;padding:0;max-height:100%;overflow-y:auto} #sit_ov.fixed .btn_buy_wr{display:block;text-align:left;padding-left:20px} #sit_ov.fixed .btn_buy_wr button{;padding:0 15px;padding-right:55px;background:#d63154;border:0;line-height:40px;color:#fff;font-size:1.083em;position:relative} #sit_ov.fixed .btn_buy_wr button:hover{;background:#c01d3f;} #sit_ov.fixed .btn_buy_wr button i{position:absolute;top:0;right:0;background:#c01d3f;width:40px;line-height:40px;} #sit_ov.fixed .scroll_no{display:none} #sit_ov.fixed .scroll_show{display:none;background:#fff;border:1px solid #c01d3f;border-bottom:0;padding:10px 5%;} #sit_title {display:block;margin:10px 0 0;font-size:1.25em;font-family:'Nanum Gothic',sans-serif;;} #sit_desc {display:inline-block;margin:5px 0 0;color:#999} #sit_opt_info {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} .sit_icon {display:block;margin: 0 0;} .sit_icon img {margin:0 1px 0 0;vertical-align:top;margin:0 1px} #sit_star {color:#b8afa2;font-size:0.95em;padding:0 ;line-height:2.2em} #sit_star span {display:inline-block;margin:0 5px 0 0;color:#666;letter-spacing:0} #sit_star .sit_star {position:relative;top:-2px;margin:0 5px 0 0;width:100px;height:auto} #sit_star a {display:inline-block;vertical-align:middle} #sit_star button {margin:0;padding:0;border:0} .sit_ov_tbl {margin:10px 0px 0;padding:10px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;color:#444} .sit_ov_tbl table{border-collapse:collapse;width:100%;border:0} .sit_ov_tbl th {font-weight:normal;text-align:left;padding:8px 0;} .sit_ov_tbl td {padding:5px 0} .sit_ov_tbl tr:first-child td,.sit_ov_tbl tr:first-child th{border:none} .sit_ov_ro {padding:2px 2px 3px;border:0;background:transparent;text-align:right;vertical-align:middle} .sit_ov_opt {padding:2px 2px 3px;border:0;background:transparent;vertical-align:middle} .sit_ov_input {height:1.8em;border:1px solid #b8c9c2;background:transparent;vertical-align:middle} .sit_ov_tbl button {margin:0} .sit_option{background:#fff;} .sit_option label{display:block;margin: 0 0 5px;color:#8b4e4e} .sit_option select{width:100%;margin:0 0 5px} .sit_op_sl{width:100%;border-collapse:collapse;} .sit_op_sl th{font-weight:normal;text-align:left;padding:5px;display:block;color:#777} .sit_op_sl td{text-align:left;padding:5px;display:block} .sit_op_sl td select{width:100%;} .sit_sel_btn {position:relative;top:-15px;right:-2px} /* 선택옵션용 추가 버튼 */ .sit_sel_btn button {width:100%} #sit_ov_soldout {margin:20px 0;color:#ff3061;font-weight:bold;text-align:center} #sit_ov_btn {;padding:0 0 10px;text-align:center;} #sit_ov_btn:after {display:block;visibility:hidden;clear:both;content:""} #sit_ov_btn a {display:inline-block;padding: 0;vertical-align:middle;text-decoration:none;line-height:42px;height:42px;border:1px solid #ddd;color:#3d3e3e;font-weight:bold;background:#fff;width:100%;margin:2px 0} #sit_ov_btn a:hover{background:#f3f3f3} #sit_ov_btn input {height:42px;line-height:42px;vertical-align:middle;font-weight:bold;} #sit_btn_buy {background:#3d3e3e;border:0;color:#fff;width:100%;margin:0 0 2px} #sit_btn_buy:hover{background:#111} #sit_btn_cart{background:#fff;border: 1px solid #ddd;color:#3d3e3e;width:100%;margin:2px 0 15px} #sit_btn_cart:hover{background:#f3f3f3} #sit_sns{text-align:center; padding:10px 0 20px;} #sit_sns img{width:20px;height:auto} #sit_sel_option,#sit_tot_price{padding:0 } @media (max-width: 970px){ #sit_ov{width:100%;float:none;clear:both;padding:10px} .sit_ov_height{clear:both} } /* 상품 상세보기 - 다른 상품 보기 */ #sit_siblings {text-align:center;position:relative} #sit_siblings h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sit_siblings a {display:inline-block;background:#383838;color:#fff;} #sit_siblings a#siblings_prev {position:absolute;bottom:16px;left:0px;background: url(img/item_next_btn.png) no-repeat #eee; width: 30px; height: 30px;text-indent:-999px;overflow:hidden;} #sit_siblings a#siblings_next {position:absolute;bottom:16px;right:0px;background: url(img/item_next_btn.png) no-repeat -29px 0 #eee; width: 30px; height: 30px;text-indent:-999px;overflow:hidden} #sit_siblings a span {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} /* 상품 상세보기 - 상품정보 */ .sit_con h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} .close_btn{margin:30px 10px 10px;} #sit_inf{background:#fff;padding:20px} #sit_inf h3{margin-top:10px} #iteminfo_close{width:100%;background:#000;border:none;color:#fff;padding:10px 0;} #sit_inf_basic {margin:0 0 20px} #sit_inf_explan {margin:0 0 10px;line-height:1.5em} #sit_inf_explan img {max-width:100%;height:auto} #sit_inf_open {margin:0;padding:0;list-style:none} #sit_inf_open {border-collapse:collapse;width:100%;font-size:0.92em;} #sit_inf_open th{background:#f3f3f3} #sit_inf_open th,#sit_inf_open td{text-align:left;border:1px solid #eee;padding:7px;color:#666} #sit_inf_open li {margin:0 0 1px;padding:8px 0;background:#fff;border:1px solid #f2f2f2;border-top:none;color:#727272} #sit_inf_open li:after {display:block;visibility:hidden;clear:both;content:""} #sit_inf_open strong {clear:both;float:left;padding:0 1%;width:28%;letter-spacing:-0.1em} #sit_inf_open span {float:left;margin:0;padding:0 1%;width:68%} #sit_inf h3{margin-bottom:5px} @media (max-width: 640px){ #sit_inf_open th{text-align:center} #sit_inf_open th,#sit_inf_open td{width:100%;display:block} #sit_inf{padding:10px} } /* 상품 상세보기 - 사용후기 */ .tit_no{position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sit_use_ol {margin:0 0 5px;padding:0;list-style:none} .sit_use_li {position:relative;border:1px solid #e9e9e9;background:#fff;margin-top:-1px} .sit_use_li:after {display:block;visibility:hidden;clear:both;content:""} .sit_use_li_title {display:block;margin:0;padding:0 10px;line-height:45px;width:100%;border:0;background:transparent;text-align:left;padding-right:200px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap} .sit_use_li_title b{font-weight:normal;margin-right:2px} .sit_use_dl {margin:0;padding:0 10px;position:absolute;top:0;right:0;line-height:45px;font-size:0.92em} .sit_use_dl:after {display:block;visibility:hidden;clear:both;content:""} .sit_use_dl dt {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} .sit_use_dl dd {float:left;margin:0 10px 0 0;color:#888;} .sit_use_dl dd img{width:80px;height:auto} .sit_use_con {display:none;border-top:1px solid #eee;padding:15px} .sit_use_p {margin:0 10px 10px;} .sit_use_cmd {text-align:right} .sit_use_cmd a.btn01{padding: 5px;} #sit_use_wbtn {margin:10px 0 ;text-align:right;} #sit_use_wbtn a{vertical-align:middle;font-weight:bold} #sit_use_write {} #sit_use_write #is_subject {width:100%} #sit_use_write ul {margin:5px 0 0} #sit_use_write li {margin:0 0 5px} #sit_use_write li label {display:inline-block;width:80px} #sit_use_write_star {margin:0;padding:0;list-style:none} /* 상품 상세보기 - 상품문의 */ #sit_qa_ol {margin:0 0 5px;padding:0;list-style:none;} .sit_qa_li{position:relative;border:1px solid #e9e9e9;background:#fff;margin-top:-1px} .sit_qa_li_title {display:block;margin:0;padding:0 10px;line-height:45px;width:100%;border:0;background:transparent;text-align:left;padding-right:200px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;} .sit_qa_li_title b{font-weight:normal;margin-right:2px} .sit_qa_dl {margin:0;padding:0 10px;position:absolute;top:0;right:0;line-height:45px;font-size:0.92em} .sit_qa_dl:after {display:block;visibility:hidden;clear:both;content:""} .sit_qa_dl dt {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} .sit_qa_dl dd {float:left;margin:0 10px 0 0;color:#888;} .sit_qa_dl dd.sit_qaa_yet,.sit_qa_dl dd.sit_qaa_done{display:inline-block;width:50px;text-align:center;font-weight:bold;margin:0} .sit_qa_dl dd.sit_qaa_done{color:#ef7878} .sit_qa_con {display:none;padding:15px ;border-top:1px solid #eee;} .sit_qa_p {;background:#fff;line-height:1.8em;} .sit_qa_p strong {display:inline-block;margin:0 0 10px;} .sit_qa_qaq{margin-bottom:10px;padding-bottom:10px ;border-bottom:1px dotted #eee} .sit_qa_con textarea {display:none} .sit_qa_cmd {text-align:right} .sit_qa_cmd a.btn01{padding:5px;} .sit_qa_pw {display:none;position:absolute;top:30px;left:175px;padding:10px;width:348px;border:1px solid #000;background:#fff;text-align:center} .sit_qa_pw span {display:block;margin:0 0 5px} #sit_qa_wbtn {margin:10px 0 ;text-align:right} #sit_qa_wbtn a{vertical-align:middle;font-weight:bold} #sit_qa_w {display:none} a.qa_wr{padding: 0 10px;height:35px;line-height:35px;display:inline-block;text-align:center;background:#3d3e3e;color:#fff;} #itemqa_list,#itemuse_list{height:35px;line-height:35px;border:1px solid #d0d0d0;background:#fff;cursor:pointer;padding:0 10px;color:#666;} @media (max-width: 640px){ .sit_use_dl,.sit_qa_dl{position:relative;line-height:20px;padding-bottom:5px} .sit_qa_li_title,.sit_use_li_title{line-height:20px;padding-top:5px;} } /* 사용후기 모음 */ #sps_sch {margin:10px 10px} #sps_sch a {display:block;padding:0 8px;height:40px;line-height:40px;vertical-align:top;border-radius:3px;color:#fff;font-weight:bold;background:#ef7878;text-decoration:none;text-align:center;margin: 5px 0} #sps_sch .sch_wr{background:#fff;border:1px solid #ddd;position:relative;border-radius:3px} #sps_sch .sch_wr:after {display:block;visibility:hidden;clear:both;content:""} #sps_sch select{border:0;background:#fff;margin:9px 0;height:20px;border-right:1px solid #ddd;float:left;width:40%} #sps_sch .sch_input{height:38px;border:0;padding:0;background-color:transparent;float:left;width:60%;padding:0 40px 0 10px} #sps_sch .sch_btn{height:38px;position:absolute;top:0;right:0;border:0;width:40px;background:none;font-size:15px} #sps {zoom:1} #sps ol {margin:10px;padding:0;border-top:1px solid #ddd;list-style:none;} #sps li {position:relative;padding:10px;border-bottom:1px solid #ccc;background:#fff;margin: 0 0 5px} #sps li:after {display:block;visibility:hidden;clear:both;content:""} .sps_img{position:relative;top:10px;left:10px;} .sps_img img{border-radius:5%;} .sps_img span {position:rea;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sps dl {margin:5px 0 ; color: #888; font-size: 0.917em;overflow:hidden} #sps dt {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sps dd {float:left;margin:0 10px 0 0 ;line-height:18px;height:18px } #sps dd img {position:relative;top:-2px} .sps_section {margin-left:0px;display:block;} .sps_section .is_use_reply{background:url('../mobile/shop/img/use_reply.png') no-repeat;text-indent:30px;line-height:1.5em} .sps_section p {padding:0;width:100%} .sps_con_full {padding:0;height:auto !important} .sps_con_btn {margin:5px 0 0;} .sps_con_btn button {border: 1px solid #ddd;padding: 5px 8px;color: #666;font-size: 0.92em;margin: 5px 0;background: #fff;} .sps_reply{margin-top:10px;padding-top:10px;border-top:1px dotted #bbb;position:relative} .sps_reply .sps_img {;width:50px;text-align:center} .sps_reply .sps_section h2{background:url('./img/use_reply.png') no-repeat 0 0;text-indent:30px;line-height:1.5em;} .sps_reply .sps_section{margin-left:70px;min-height:50px} #sps_empty{text-align:center;color:#777;padding:50px 0} @media (min-width: 641px){ #sps_sch .sch_wr{width:300px;display:inline-block} #sps_sch a{display:inline-block;margin:0} } /* 상품문의 모음 */ #sqa_sch {margin:10px 10px} #sqa_sch a {display:block;padding:0 8px;height:40px;line-height:40px;vertical-align:top;border-radius:3px;color:#fff;font-weight:bold;background:#ef7878;text-decoration:none;text-align:center;margin: 5px 0} #sqa_sch .sch_wr{background:#fff;border:1px solid #ddd;position:relative;border-radius:3px} #sqa_sch .sch_wr:after {display:block;visibility:hidden;clear:both;content:""} #sqa_sch select{border:0;background:#fff;margin:9px 0;height:20px;border-right:1px solid #ddd;float:left;width:40%} #sqa_sch .sch_input{height:38px;border:0;padding:0;background-color:transparent;float:left;width:60%;padding:0 40px 0 10px} #sqa_sch .sch_btn{height:38px;position:absolute;top:0;right:0;border:0;width:40px;background:none;font-size:15px} #sqa {zoom:1;} #sqa ol {margin:10px;padding:0;border-top:1px solid #e9e9e9;list-style:none;} #sqa li {position:relative;padding:10px;border-bottom:1px solid #ccc;background:#fff;margin: 0 0 5px} #sqa li:after {display:block;visibility:hidden;clear:both;content:""} .sqa_img {position:absolute;top:10px;left:10px;} .sqa_img img{border-radius:50%;} .sqa_img span {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sqa dl {margin:5px 0 10px; color: #888; font-size: 0.917em;overflow:hidden;} #sqa dt {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #sqa dd {float:left;margin:0 10px 0 0;} #sqa dd img {position:relative;top:-2px} .sqa_section {margin-left:80px;display:block} .sqa_section h2{font-size:1.167em;font-weight:bold;margin:5px 0} .sqa_section .sqa_con {background:#f3f3f3;line-height:1.7em} .sqa_section p {padding:0;width:100%} .sqa_con_full {padding:0;height:auto !important} .sqa_con_btn {margin:5px 0 0} .sqa_con_btn button {border: 1px solid #ddd;padding: 5px 8px;color: #666;font-size: 0.92em;margin: 5px 0;background: #fff;} #sqa .sit_qa_qaq,#sqa .sit_qa_qaa {padding:10px 5px 10px 40px;position:relative;margin:0} .sqa_con .qa_alp{position:absolute;top:10px;left:15px;font-size:1.75em;color:#bbb} #sqa .sit_qa_qaa{border-top:1px solid #ddd;} #sqa_empty{text-align:center;color:#777;padding:50px 0} @media (min-width: 641px){ #sqa_sch .sch_wr{width:300px;display:inline-block} #sqa_sch a{display:inline-block;margin:0} } /* 로딩안내 레이어 */ #loading_message {z-index:10000;position:absolute;top:0;left:0;background:#fff;opacity:0.7} #loading_message img {position:relative;opacity:1.0} /* 알림 box */ #fancyalert {display:block;z-index:10000;position:absolute;top:0;left:0} #fancyalert_inner {display:table;z-index:2;position:relative} #fancyalert_inner div {display:table-cell;vertical-align:middle;text-align:center} #fancyalert_inner span {display:block;margin:0 auto;padding:30px;width:200px;background:#1f1f1f;color:#f0f1f2} #fancyalert_inner button {margin:15px 0 0;padding:10px 30px;border:0;background:#000;color:#fff} #fancyalert_bg {z-index:0;position:absolute;top:0;left:0;width:100%;height:100%;vertical-align:middle;background:#000;text-align:center;opacity: 0.7} #sit_sms_new .tbl_frm01 th {width:100px} /*쿠폰존 리스트*/ .couponzone_list{margin:10px 0;text-align:left;padding:20px 20px 40px;background:url(img/coupon_bg.png) repeat-x left bottom #eee;} .couponzone_list h2{margin:0 0 5px;font-size:1.35em;font-family:'Nanum Gothic',sans-serif} .couponzone_list p{margin:0 0 10px;} .couponzone_list ul{padding:0;margin:0;list-style:none;border-left:1px dotted #ddd;background:#fff;padding:20px 0} .couponzone_list ul:after {display:block;visibility:hidden;clear:both;content:""} .couponzone_list ul li{float:left;width:25%;border-right:1px dotted #ddd;background:#fff;padding:15px;;line-height:1.2em} .couponzone_list ul li:nth-child(4n+1){clear:both;} .couponzone_list ul li img{width:100%;height:auto} .couponzone_list ul li .coupon_img{} .couponzone_list ul li .coupon_tit{margin:10px 0 5px;font-weight:bold;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;} .couponzone_list ul li .coupon_date{margin: 5px 0px;font-size:0.92em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;color:#777} .couponzone_list ul li .coupon_target{margin: 5px 0px;font-size:0.92em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;color:#777} .couponzone_list ul li .coupon_target a{color:#777;text-decoration:underline} .couponzone_list ul li .coupon_point{margin: 5px 0px;font-size:0.92em;;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;color:#777} .couponzone_list ul li .coupon_btn{margin:10px 0 0;text-align:center} .couponzone_list ul li .coupon_btn .btn02{width:100%;height:35px;padding:0;font-weight:bold;background:#ef7878;border:0} .couponzone_list ul li .coupon_btn .btn02:hover{background:#d63154;color:#fff} .couponzone_list ul li .coupon_btn .disabled {background: #ddd;border:1px;color:#999;border-color:#ddd} .couponzone_list ul li .coupon_btn .disabled:hover {background: #ddd;border:1px;color:#999;border-color:#ddd} .couponzone_list .no_coupon{padding: 100px 0;text-align:center;color:#999} #point_coupon li{height:250px;} @media (max-width: 970px){ .couponzone_list ul li{width:50%} .couponzone_list ul li:nth-child(3n+1){clear:none;} .couponzone_list ul li:nth-child(2n+1){clear:both;} } @media (max-width: 640px){ .couponzone_list ul li{padding:7px} } /* 상품검색 */ #ssch_frm {margin:20px 0;border:1px solid #d7d7d7;zoom:1} #ssch_frm h2{border-bottom:1px solid #d7d7d7;color:#888;font-size:1.25em;height:50px;line-height:30px;padding:10px 15px;} #ssch_frm h2 span{font-size:1.333em;color:#000} #ssch_frm h2 strong{color:#d50c0d} #ssch_frm .ssch_scharea{border-bottom:1px solid #d7d7d7;min-height:50px;padding:10px 15px} #ssch_frm .ssch_scharea:after {display:block;visibility:hidden;clear:both;content:""} #ssch_frm .ssch_scharea label{display:inline-block;margin:0 8px 0 0} #ssch_frm .ssch_left{float:left;position:relative} #ssch_frm .ssch_right{float:right} #ssch_frm .ssch_input{height:30px;border:1px solid #bbb;padding:0 10px} #ssch_frm .btn_submit{background: url(./img/icon-sch-pc.png) no-repeat 50% 50%;width: 30px;height: 30px;text-indent:-999px;overflow:hidden;position:absolute;top:0;right:0} #ssch_frm p{padding:15px; background:#f5f5f5;color:#737373} @media (max-width: 970px){ #ssch_frm .ssch_left{float:none;display:inline-block;} #ssch_frm .ssch_right{float:none} #ssch_frm .ssch_right span{display:block;margin:10px 0} } @media (max-width: 640px){ #ssch_frm .ssch_left .ssch_input{width:100%} #ssch_frm h2 span{font-size:1.083em} } /* ========================================================================== ROROCLE.COM HIGH-FIDELITY OVERRIDES & POLISH ========================================================================== */ body, button, input, select, textarea { font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif; letter-spacing: -0.02em; } /* 상단 툴바 */ #hd_tnb { border-top: 2px solid #ef7777 !important; border-bottom: 1px solid #eee !important; background: #fff !important; position: relative !important; height: 38px !important; box-sizing: border-box !important; } #hd_tnb:after { content: ""; display: block; clear: both; } #hd_tnb .hd_tnb_menu { list-style: none !important; padding: 0 !important; margin: 0 !important; } #hd_tnb .hd_tnb_menu li { position: relative !important; } #hd_tnb .hd_tnb_menu li a { display: block !important; line-height: 38px !important; font-size: 12px !important; color: #555 !important; text-decoration: none !important; font-weight: 500 !important; } #hd_tnb .hd_tnb_menu li a:hover { color: #ef7777 !important; } #hd_tnb .join-point, #hd_tnb .cart-num { position: absolute !important; bottom: 2px !important; left: 0 !important; width: 100% !important; text-align: center !important; pointer-events: none !important; } #hd_tnb .join-point span { display: inline-block !important; background: #ff5252 !important; color: #fff !important; font-size: 8px !important; line-height: 12px !important; padding: 0 4px !important; border-radius: 6px !important; font-weight: 700 !important; } #hd_tnb .cart-num span { display: inline-block !important; background: #111 !important; color: #fff !important; font-size: 8px !important; line-height: 12px !important; padding: 0 4px !important; border-radius: 6px !important; font-weight: 700 !important; } /* PC 전용 툴바 & 검색 (970px 이상) */ @media (min-width: 970px) { #hd_ct { float: left !important; width: 50px !important; height: 38px !important; border: none !important; border-right: 1px solid #eee !important; background: url('../image/icon-menu.png') no-repeat 50% 50% !important; background-size: 15px !important; text-indent: -9999px !important; cursor: pointer !important; display: block !important; } #hd_ct:hover { background-color: #f7f7f7 !important; } #hd_tnb form[name="frmsearch1"] { float: left !important; } #hd_sch { display: block !important; float: left !important; position: static !important; width: auto !important; height: 38px !important; background: transparent !important; z-index: auto !important; } #hd_sch .sch_inner { position: relative !important; border-right: 1px solid #eee !important; height: 38px !important; width: 180px !important; max-width: none !important; } #hd_sch .sch_inner h2 { display: none !important; } #hd_sch .frm_input { background: none !important; border: 0 !important; height: 38px !important; padding: 0 38px 0 12px !important; width: 100% !important; color: #333 !important; font-size: 12px !important; outline: none !important; box-sizing: border-box !important; } #hd_sch .frm_input:focus { background: #f8f8f8 !important; } #hd_sch .btn_submit { background: url('../image/icon-sch-pc.png') no-repeat 50% 50% !important; width: 38px !important; height: 38px !important; position: absolute !important; top: 0 !important; right: 0 !important; border: none !important; text-indent: -9999px !important; cursor: pointer !important; } #hd_sch .pop_close { display: none !important; } #hd_sch_open { display: none !important; } #hd_tnb .hd_tnb_menu { float: right !important; text-align: right !important; } #hd_tnb .hd_tnb_menu li { display: inline-block !important; padding: 0 12px !important; width: auto !important; float: none !important; } } /* 모바일 전용 툴바 & 검색 (969px 이하) */ @media (max-width: 969px) { #hd_tnb { height: 38px !important; } #hd_tnb .hd_tnb_menu { display: flex !important; width: 100% !important; } #hd_tnb .hd_tnb_menu li { flex: 1 !important; text-align: center !important; float: none !important; width: auto !important; } #hd_tnb .hd_tnb_menu li a { font-size: 11px !important; } #hd_tnb form[name="frmsearch1"] { display: contents !important; } .hd_wr { position: relative !important; min-height: 52px !important; } #hd_ct { position: absolute !important; top: 10px !important; left: 10px !important; width: 32px !important; height: 32px !important; border: none !important; background: url('../image/icon-menu.png') no-repeat 50% 50% !important; background-size: 19px !important; text-indent: -9999px !important; cursor: pointer !important; z-index: 10 !important; display: block !important; } #hd_sch_open { position: absolute !important; top: 10px !important; right: 10px !important; width: 32px !important; height: 32px !important; border: none !important; background: url('../image/icon-sch.png') no-repeat 50% 50% !important; background-size: 19px !important; text-indent: -9999px !important; cursor: pointer !important; z-index: 10 !important; display: block !important; } #hd_sch { display: none; position: fixed !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; background: rgba(0,0,0,0.9) !important; z-index: 9999 !important; } #hd_sch.active { display: block !important; } #hd_sch .sch_inner { position: absolute !important; top: 50% !important; left: 0 !important; width: 100% !important; padding: 0 10% !important; margin-top: -30px !important; box-sizing: border-box !important; } #hd_sch .sch_inner h2 { display: none !important; } #hd_sch .frm_input { background: none !important; border: 0 !important; border-bottom: 2px solid #fff !important; height: 44px !important; padding: 0 45px 0 5px !important; width: 100% !important; color: #fff !important; font-size: 18px !important; outline: none !important; box-sizing: border-box !important; } #hd_sch .btn_submit { background: url('../image/icon-sch.png') no-repeat 50% 50% !important; background-size: 22px !important; width: 36px !important; height: 44px !important; position: absolute !important; top: 0 !important; right: 10% !important; border: none !important; text-indent: -9999px !important; cursor: pointer !important; } #hd_sch .pop_close { position: fixed !important; top: 15px !important; right: 15px !important; width: 40px !important; height: 40px !important; background: url('../image/icon-close.png') no-repeat 50% 50% !important; background-size: 24px !important; border: none !important; text-indent: -9999px !important; cursor: pointer !important; display: block !important; } } /* 로고 영역 */ #logo { padding: 22px 0 18px !important; text-align: center !important; display: block !important; width: 100% !important; } .roro-logo-wrap { display: inline-block !important; text-align: center !important; } .roro-logo-main { display: block !important; font-size: 28px !important; font-weight: 900 !important; color: #111 !important; letter-spacing: -0.04em !important; line-height: 1.1 !important; } .roro-logo-main span { color: #ef7777 !important; } .roro-logo-sub { display: block !important; font-size: 11px !important; color: #888 !important; font-weight: 500 !important; letter-spacing: -0.02em !important; margin-top: 4px !important; } @media (max-width: 969px) { #logo { padding: 8px 0 !important; } .roro-logo-main { font-size: 20px !important; } .roro-logo-sub { font-size: 10px !important; } } /* GNB 가로 네비게이션 */ #gnb { border-top: 1px solid #f0f0f0 !important; border-bottom: 1px solid #f0f0f0 !important; background: #fff !important; width: 100% !important; clear: both !important; position: relative !important; } #gnb ul { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; } @media (min-width: 970px) { #gnb ul { justify-content: center !important; } #gnb li.gnb_1dli a { padding: 13px 20px !important; font-size: 14px !important; font-weight: 700 !important; color: #222 !important; text-decoration: none !important; display: block !important; letter-spacing: 0.5px !important; } } @media (max-width: 969px) { #gnb { overflow-x: auto !important; white-space: nowrap !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; } #gnb::-webkit-scrollbar { display: none !important; } #gnb ul { justify-content: flex-start !important; padding: 0 8px !important; } #gnb li.gnb_1dli { flex-shrink: 0 !important; } #gnb li.gnb_1dli a { padding: 10px 14px !important; font-size: 13px !important; font-weight: 600 !important; color: #222 !important; display: block !important; } } #gnb li.gnb_1dli a:hover, #gnb li.gnb_1dli a.active { color: #ef7777 !important; } #gnb li.gnb_1dli a.gnb_sale { color: #ff385c !important; font-weight: 800 !important; } /* 카테고리 드로어 */ #category { position: fixed !important; top: 0 !important; left: 0 !important; width: 280px !important; max-width: 85vw !important; height: 100% !important; background: #fff !important; z-index: 999 !important; box-shadow: 4px 0 15px rgba(0,0,0,0.25) !important; overflow-y: auto !important; padding: 20px 15px !important; text-align: left !important; box-sizing: border-box !important; } #category .ct_login { background: #f8f9fa !important; padding: 15px !important; border-radius: 8px !important; margin-bottom: 20px !important; } #category .ct_login h2 { font-size: 18px !important; font-weight: 800 !important; color: #111 !important; margin: 0 0 6px 0 !important; } #category .ct_login p { font-size: 12px !important; color: #666 !important; margin: 0 0 12px 0 !important; line-height: 1.4 !important; } #category .ct-btn { display: flex !important; gap: 8px !important; list-style: none !important; padding: 0 !important; margin: 0 !important; } #category .ct-btn li { flex: 1 !important; } #category .ct-btn .btn_1 { display: block !important; background: #111 !important; color: #fff !important; text-align: center !important; padding: 8px 0 !important; font-size: 12px !important; font-weight: 700 !important; border-radius: 4px !important; text-decoration: none !important; } #category .ct-btn .btn_2 { display: block !important; background: #fff !important; border: 1px solid #ccc !important; color: #333 !important; text-align: center !important; padding: 8px 0 !important; font-size: 12px !important; font-weight: 700 !important; border-radius: 4px !important; text-decoration: none !important; } #category ul.cate { list-style: none !important; padding: 0 !important; margin: 0 0 20px 0 !important; } #category ul.cate li { border-bottom: 1px solid #f0f0f0 !important; position: relative !important; } #category ul.cate li a { display: block !important; padding: 12px 0 !important; font-size: 14px !important; color: #222 !important; font-weight: 600 !important; text-decoration: none !important; } #category ul.cate li a:hover { color: #ef7777 !important; } #category ul.cate li .sub_ct_toggle { position: absolute !important; top: 8px !important; right: 0 !important; width: 32px !important; height: 32px !important; background: url('../image/icon-menu.png') no-repeat 50% 50% !important; background-size: 14px !important; border: none !important; text-indent: -9999px !important; opacity: 0.4 !important; cursor: pointer !important; } #category ul.sub_cate { list-style: none !important; padding: 0 0 10px 15px !important; margin: 0 !important; background: #fafafa !important; } #category ul.sub_cate li { border-bottom: none !important; } #category ul.sub_cate li a { padding: 8px 0 !important; font-size: 13px !important; color: #666 !important; font-weight: 400 !important; } #category .cate-com { border-top: 2px solid #eee !important; padding-top: 10px !important; } #category .cate-com li a { color: #555 !important; font-size: 13px !important; padding: 8px 0 !important; } #category .pop_close { position: absolute !important; top: 15px !important; right: 15px !important; width: 28px !important; height: 28px !important; background: url('../image/icon-close.png') no-repeat 50% 50% !important; background-size: 16px !important; border: none !important; text-indent: -9999px !important; cursor: pointer !important; } /* 그리드 스위처 */ .sct-size { text-align: center !important; margin: 25px 0 15px !important; } .sct-size button.btn-size { background: none !important; border: none !important; width: 32px !important; height: 32px !important; text-indent: -9999px !important; opacity: 0.25 !important; cursor: pointer !important; margin: 0 4px !important; display: inline-block !important; vertical-align: middle !important; transition: opacity 0.2s ease !important; } .sct-size button.btn-size.active { opacity: 1 !important; } .sct-size #btn-small { background: url('../image/btn-small.png') no-repeat 50% 50% !important; background-size: 22px !important; } .sct-size #btn-big { background: url('../image/btn-big.png') no-repeat 50% 50% !important; background-size: 22px !important; } /* 상품 섹션 및 타이틀 */ .sct_wrap { max-width: 1200px !important; margin: 20px auto 40px !important; padding: 0 10px !important; box-sizing: border-box !important; } .sct_wrap h2 { text-align: center !important; border: 1px solid #CDCDCD !important; border-radius: 50px !important; padding: 8px 45px !important; display: inline-block !important; color: #666 !important; margin: 15px 0 25px !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0.05em !important; } .sct_wrap h2 a { color: inherit !important; text-decoration: none !important; } .sct_wrap h3 { display: block !important; width: 100% !important; max-width: 600px !important; margin: 30px auto !important; padding: 13px 0 !important; border: 1px solid #E0E1E2 !important; border-radius: 4px !important; background: linear-gradient(180deg, #fff 0%, #f4f5f6 100%) !important; font-size: 14px !important; font-weight: 700 !important; color: #333 !important; text-align: center !important; } .sct_wrap h3 a { color: inherit !important; text-decoration: none !important; display: block !important; } /* 상품 카드 그리드 */ .sct_10 { list-style: none !important; padding: 0 !important; margin: 0 -8px !important; display: flex !important; flex-wrap: wrap !important; } .sct_wrap.small .sct_10 .sct_li { width: 25% !important; padding: 0 8px !important; margin-bottom: 24px !important; box-sizing: border-box !important; float: none !important; } @media (max-width: 969px) { .sct_wrap.small .sct_10 .sct_li { width: 50% !important; padding: 0 5px !important; margin-bottom: 16px !important; } } .sct_wrap.big .sct_10 .sct_li { width: 50% !important; padding: 0 10px !important; margin-bottom: 30px !important; box-sizing: border-box !important; float: none !important; } @media (max-width: 969px) { .sct_wrap.big .sct_10 .sct_li { width: 100% !important; padding: 0 10px !important; margin-bottom: 20px !important; } } .sct_li_wr { background: #fff !important; text-align: left !important; } .sct_img { position: relative !important; width: 100% !important; aspect-ratio: 1 / 1 !important; overflow: hidden !important; background: #fafafa !important; border-radius: 4px !important; } .sct_img img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; transition: transform 0.3s ease !important; } .sct_li:hover .sct_img img { transform: scale(1.04) !important; } .sct_txt { margin-top: 10px !important; min-height: 38px !important; } .sct_txt a, .sct_txt span, .sct_txt_name { font-size: 13px !important; font-weight: 500 !important; color: #222 !important; line-height: 1.4 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-decoration: none !important; } .sct_txt_name.no-click, .no-click { cursor: default !important; pointer-events: none !important; user-select: text !important; } .sct_txt_name.is-clickable, .sct_txt a.is-clickable, a.is-clickable { cursor: pointer !important; pointer-events: auto !important; } .sct_txt a.is-clickable:hover { text-decoration: underline !important; color: #111 !important; } .sct_cost { font-size: 15px !important; font-weight: 800 !important; color: #111 !important; margin-top: 6px !important; } .sct_icon_wr { margin-top: 6px !important; } .sit_icon .icon { display: inline-block !important; font-size: 10px !important; font-weight: 700 !important; padding: 2px 6px !important; border-radius: 3px !important; margin-right: 4px !important; vertical-align: middle !important; } .sit_icon .icon_new { background: #ff4757 !important; color: #fff !important; } .sit_icon .icon_hit { background: #ff6b81 !important; color: #fff !important; } .sit_icon .icon_sale img { height: 16px !important; vertical-align: middle !important; } /* ========================================================================== 메인 리뷰 쇼케이스 (한 화면 2개 대형 슬라이더 & 캐러셀) ========================================================================== */ .main-review-section { max-width: 1200px !important; margin: 25px auto 40px !important; padding: 0 15px !important; box-sizing: border-box !important; position: relative !important; } .main-review-header { display: flex !important; justify-content: space-between !important; align-items: flex-end !important; margin-bottom: 20px !important; padding-bottom: 12px !important; border-bottom: 2px solid #111 !important; } .main-review-header .header-left .sub-label { display: inline-block !important; font-size: 11px !important; font-weight: 700 !important; color: #e11d48 !important; letter-spacing: 0.1em !important; margin-bottom: 4px !important; text-transform: uppercase !important; } .main-review-header .header-left .main-title { font-size: 26px !important; font-weight: 800 !important; letter-spacing: 0.04em !important; color: #111 !important; margin: 0 0 4px 0 !important; line-height: 1.2 !important; font-family: 'Montserrat', 'Pretendard', sans-serif !important; } .main-review-header .header-left .main-title a { color: inherit !important; text-decoration: none !important; } .main-review-header .header-left .desc-text { font-size: 13px !important; color: #64748b !important; margin: 0 !important; } .main-review-header .header-right .btn-more-reviews { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-size: 13px !important; font-weight: 600 !important; color: #111 !important; text-decoration: none !important; padding: 7px 16px !important; border: 1px solid #111 !important; border-radius: 20px !important; transition: all 0.25s ease !important; white-space: nowrap !important; } .main-review-header .header-right .btn-more-reviews:hover { background: #111 !important; color: #ffffff !important; } /* Swiper Container Wrap */ .main-review-swiper-wrap { position: relative !important; padding: 0 4px !important; } .main-review-swiper { width: 100% !important; overflow: hidden !important; padding: 6px 2px 20px 2px !important; } /* Swiper Slide (2 Cards Per Screen, Big & Prominent) */ .main-review-slide { height: auto !important; display: flex !important; box-sizing: border-box !important; } .review-card-item { width: 100% !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 14px !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05) !important; transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important; text-decoration: none !important; color: inherit !important; } .review-card-item:hover { transform: translateY(-5px) !important; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.1) !important; border-color: #cbd5e1 !important; color: inherit !important; } /* Photo Area */ .review-card-photo { position: relative !important; width: 100% !important; height: 320px !important; overflow: hidden !important; background: #f8fafc !important; display: block !important; } .review-card-photo img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; transition: transform 0.4s ease !important; } .review-card-item:hover .review-card-photo img { transform: scale(1.04) !important; } /* Badges on Photo */ .review-card-badges { position: absolute !important; top: 12px !important; left: 12px !important; right: 12px !important; display: flex !important; justify-content: space-between !important; align-items: center !important; pointer-events: none !important; z-index: 2 !important; } .badge-photo-tag { background: rgba(15, 23, 42, 0.75) !important; backdrop-filter: blur(4px) !important; color: #ffffff !important; font-size: 11px !important; font-weight: 600 !important; padding: 4px 10px !important; border-radius: 20px !important; display: inline-flex !important; align-items: center !important; gap: 4px !important; } .badge-score-tag { background: #ffffff !important; color: #0f172a !important; font-size: 12px !important; font-weight: 700 !important; padding: 4px 10px !important; border-radius: 20px !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important; display: inline-flex !important; align-items: center !important; gap: 4px !important; } .badge-score-tag i { color: #f59e0b !important; } /* Content Area */ .review-card-content { padding: 18px 20px !important; display: flex !important; flex-direction: column !important; flex: 1 !important; background: #ffffff !important; } .review-meta-row { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 8px !important; font-size: 12px !important; } .review-stars { color: #f59e0b !important; font-size: 13px !important; letter-spacing: 1px !important; } .review-author-date { color: #64748b !important; font-size: 12px !important; } .review-author-date .sep { margin: 0 6px !important; color: #cbd5e1 !important; } .review-title { font-size: 16px !important; font-weight: 700 !important; color: #0f172a !important; margin: 0 0 8px 0 !important; line-height: 1.4 !important; display: -webkit-box !important; -webkit-line-clamp: 1 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } .review-title a { color: inherit !important; text-decoration: none !important; } .review-snippet { font-size: 13.5px !important; color: #475569 !important; line-height: 1.6 !important; margin: 0 0 14px 0 !important; flex: 1 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } .review-snippet a { color: inherit !important; text-decoration: none !important; } /* Product Tag Box */ .review-product-box { margin-top: auto !important; padding: 10px 14px !important; background: #f8fafc !important; border-radius: 8px !important; border: 1px solid #e2e8f0 !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; font-size: 12px !important; text-decoration: none !important; cursor: default !important; pointer-events: none !important; } .review-product-box:hover { background: #f8fafc !important; } .review-product-title { color: #334155 !important; font-weight: 600 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; display: flex !important; align-items: center !important; gap: 6px !important; flex: 1 !important; } .review-product-title i { color: #64748b !important; font-size: 12px !important; } .review-product-action { color: #2563eb !important; font-weight: 700 !important; font-size: 11px !important; white-space: nowrap !important; } /* Swiper Arrows */ .review-swiper-arrow { position: absolute !important; top: 45% !important; transform: translateY(-50%) !important; width: 44px !important; height: 44px !important; background: #ffffff !important; border-radius: 50% !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; z-index: 10 !important; color: #1e293b !important; font-size: 15px !important; transition: all 0.25s ease !important; border: 1px solid #e2e8f0 !important; } .review-swiper-arrow:hover { background: #0f172a !important; color: #ffffff !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25) !important; transform: translateY(-50%) scale(1.08) !important; } .review-swiper-prev { left: -18px !important; } .review-swiper-next { right: -18px !important; } /* Pagination */ .main-review-pagination { position: static !important; margin-top: 16px !important; display: flex !important; justify-content: center !important; align-items: center !important; gap: 6px !important; } .main-review-pagination .swiper-pagination-bullet { width: 8px !important; height: 8px !important; background: #cbd5e1 !important; opacity: 1 !important; border-radius: 4px !important; transition: all 0.3s ease !important; margin: 0 !important; cursor: pointer !important; } .main-review-pagination .swiper-pagination-bullet-active { width: 24px !important; background: #0f172a !important; } /* Backwards-compatibility for .rv_wrap if used elsewhere */ .rv_wrap { max-width: 1200px !important; margin: 0 auto !important; padding: 0 10px !important; } /* Responsive Breakpoints */ @media (max-width: 991px) { .review-card-photo { height: 260px !important; } .review-swiper-prev { left: -10px !important; } .review-swiper-next { right: -10px !important; } } @media (max-width: 768px) { .main-review-section { margin: 20px auto 30px !important; padding: 0 10px !important; } .main-review-header { margin-bottom: 14px !important; padding-bottom: 10px !important; } .main-review-header .header-left .main-title { font-size: 20px !important; } .main-review-header .header-left .desc-text { font-size: 11.5px !important; } .main-review-header .header-right .btn-more-reviews { font-size: 11.5px !important; padding: 5px 12px !important; } .review-card-photo { height: 200px !important; } .review-card-content { padding: 12px 14px !important; } .review-title { font-size: 14px !important; margin-bottom: 4px !important; } .review-snippet { font-size: 12px !important; line-height: 1.5 !important; margin-bottom: 10px !important; } .review-product-box { padding: 8px 10px !important; font-size: 11px !important; } .review-swiper-arrow { width: 36px !important; height: 36px !important; font-size: 13px !important; } .review-swiper-prev { left: -8px !important; } .review-swiper-next { right: -8px !important; } } @media (max-width: 540px) { .review-card-photo { height: 165px !important; } .review-card-content { padding: 10px 10px !important; } .review-title { font-size: 13px !important; } .review-snippet { font-size: 11px !important; line-height: 1.4 !important; } .review-meta-row { font-size: 10.5px !important; } .review-stars { font-size: 11px !important; } .badge-photo-tag { font-size: 9px !important; padding: 2px 7px !important; } .badge-score-tag { font-size: 10px !important; padding: 2px 7px !important; } .review-product-action { display: none !important; } .review-swiper-arrow { display: none !important; /* 모바일 터치 스와이프 */ } } /* 푸터 레이아웃 */ #ft { background: #fff !important; border-top: 1px solid #eee !important; margin-top: 50px !important; position: relative !important; } .ft_wr { max-width: 1200px !important; margin: 0 auto !important; padding: 40px 15px 30px !important; display: flex !important; flex-wrap: wrap !important; box-sizing: border-box !important; } .ft_con { width: 33.333% !important; padding: 0 20px !important; box-sizing: border-box !important; border-right: 1px solid #eee !important; border-left: none !important; text-align: left !important; } .ft_con:last-of-type { border-right: none !important; } @media (max-width: 768px) { .ft_con { width: 100% !important; padding: 20px 0 !important; border-right: none !important; border-bottom: 1px solid #eee !important; } } #ft_cs .cs_tel a { display: block !important; background: #fae100 !important; color: #3b1e1e !important; text-align: center !important; padding: 12px 0 !important; font-size: 17px !important; font-weight: 900 !important; border-radius: 4px !important; text-decoration: none !important; margin-bottom: 10px !important; } #ft_cs .cs_info { font-size: 12px !important; color: #777 !important; margin: 0 0 10px 0 !important; line-height: 1.4 !important; } #ft_cs .qa_link { display: block !important; background: #333 !important; color: #fff !important; text-align: center !important; padding: 10px 0 !important; font-size: 13px !important; font-weight: 700 !important; border-radius: 4px !important; text-decoration: none !important; } .ft_notice h3 { font-size: 15px !important; font-weight: 800 !important; color: #111 !important; margin: 0 0 12px 0 !important; } .ft_notice h3 a { color: inherit !important; text-decoration: none !important; } .ft_notice ul { list-style: none !important; padding: 0 !important; margin: 0 !important; } .ft_notice ul li { margin-bottom: 8px !important; font-size: 13px !important; } .ft_notice ul li a { color: #666 !important; text-decoration: none !important; } .ft_notice ul li a:hover { color: #111 !important; } .ft_stat { display: flex !important; align-items: center !important; justify-content: center !important; } #ft .copy { width: 100% !important; margin-top: 30px !important; padding-top: 25px !important; border-top: 1px solid #f0f0f0 !important; text-align: center !important; color: #888 !important; font-size: 12px !important; } #ft .copy h1 { font-size: 13px !important; color: #444 !important; font-weight: 700 !important; margin-bottom: 10px !important; } #ft .roro_ft_company_info { margin-bottom: 10px !important; line-height: 1.6 !important; } #top_btn2 { position: fixed !important; right: 15px !important; bottom: 15px !important; border: none !important; background: transparent !important; z-index: 999 !important; cursor: pointer !important; padding: 0 !important; } #top_btn2 img { width: 115px !important; height: auto !important; display: block !important; filter: drop-shadow(0 4px 10px rgba(0,0,0,0.15)) !important; } #top_btn { position: fixed !important; right: 15px !important; bottom: 85px !important; width: 40px !important; height: 40px !important; background: #fff !important; border: 1px solid #ddd !important; border-radius: 50% !important; box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important; z-index: 998 !important; cursor: pointer !important; display: none; } /* ========================================================================== KUMASHOP PERFECT MOBILE RESPONSIVE SUITE ========================================================================== */ /* 전역 반응형 기초 설정 (가로 스크롤 및 이미지 튀어나옴 방지) */ html, body { width: 100% !important; max-width: 100vw !important; overflow-x: hidden !important; -webkit-text-size-adjust: 100% !important; } *, *::before, *::after { box-sizing: border-box !important; } img { max-width: 100% !important; height: auto !important; } .wrapper, #main, .container, .idx-container, #container, #sidx, .ft_wr, .hd_wr { max-width: 100% !important; box-sizing: border-box !important; } /* 데스크톱(970px 이상) 모바일 전용 버튼 숨김 */ @media (min-width: 970px) { #hd_ct_m { display: none !important; } #kuma_bottom_nav { display: none !important; } } /* 모바일 완벽 대응 (969px 이하) */ @media (max-width: 969px) { body { padding-bottom: 64px !important; } /* 상단 툴바(TNB) 정리 */ #hd_tnb { height: 36px !important; border-top: 2px solid #ef7777 !important; border-bottom: 1px solid #f0f0f0 !important; background: #fafafa !important; } #hd_tnb #hd_ct { display: none !important; /* 모바일에서는 로고 옆 hd_ct_m으로 대체 */ } #hd_tnb .hd_tnb_menu { display: flex !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } #hd_tnb .hd_tnb_menu li { flex: 1 !important; text-align: center !important; width: auto !important; float: none !important; position: relative !important; } #hd_tnb .hd_tnb_menu li a { font-size: 11px !important; line-height: 36px !important; display: block !important; color: #666 !important; padding: 0 2px !important; } #hd_tnb .join-point, #hd_tnb .cart-num { display: none !important; /* 모바일에서 배지 절대위치가 로고를 가리지 않도록 숨김 */ } /* 헤더 로고 바 (.hd_wr) 3단 플렉스 레이아웃: [메뉴] [로고] [검색] */ .hd_wr { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 8px 14px !important; min-height: 54px !important; position: relative !important; background: #fff !important; } #hd_ct_m { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; background: url('../image/icon-menu.png') no-repeat 50% 50% !important; background-size: 21px !important; border: none !important; cursor: pointer !important; text-indent: -9999px !important; margin: 0 !important; padding: 0 !important; flex-shrink: 0 !important; } #logo { flex: 1 !important; text-align: center !important; padding: 4px 0 !important; margin: 0 !important; } #logo a { display: inline-block !important; } .roro-logo-main { font-size: 20px !important; line-height: 1.1 !important; } .roro-logo-sub { font-size: 9.5px !important; margin-top: 2px !important; } #hd_sch_open { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; background: url('../image/icon-sch.png') no-repeat 50% 50% !important; background-size: 20px !important; border: none !important; cursor: pointer !important; text-indent: -9999px !important; position: static !important; margin: 0 !important; padding: 0 !important; flex-shrink: 0 !important; } /* GNB 가로 카테고리 슬라이드 스크롤 */ #gnb { width: 100% !important; max-width: 100vw !important; overflow-x: auto !important; white-space: nowrap !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; background: #fff !important; border-top: 1px solid #f0f0f0 !important; border-bottom: 1px solid #f0f0f0 !important; } #gnb::-webkit-scrollbar { display: none !important; } #gnb ul { display: flex !important; flex-wrap: nowrap !important; padding: 0 8px !important; margin: 0 !important; width: max-content !important; min-width: 100% !important; } #gnb li.gnb_1dli { flex-shrink: 0 !important; float: none !important; width: auto !important; border: none !important; } #gnb li.gnb_1dli a { padding: 10px 13px !important; font-size: 13px !important; font-weight: 600 !important; display: block !important; } /* 실시간 리뷰 쇼케이스 모바일 2열 정렬 */ .rv_wrap { display: flex !important; flex-wrap: wrap !important; margin: 0 -4px !important; padding: 0 8px !important; } .rv_li { width: 50% !important; padding: 0 4px !important; margin-bottom: 14px !important; float: none !important; box-sizing: border-box !important; } .rv_li .li_wr { border-radius: 6px !important; overflow: hidden !important; border: 1px solid #eee !important; } .rv_img { aspect-ratio: 1 / 1 !important; width: 100% !important; } .rv_img img { width: 100% !important; height: 100% !important; object-fit: cover !important; } .rv_li .txt_wr { padding: 8px 6px !important; } .rv_tit { font-size: 12px !important; line-height: 1.3 !important; } .rv_con { font-size: 11px !important; line-height: 1.35 !important; } .rv_prd { font-size: 10px !important; } /* 메인 & 카테고리 상품 목록 2열 완벽 그리드 */ .sct_wrap { padding: 0 8px !important; margin: 15px auto 30px !important; } .sct_10 { display: flex !important; flex-wrap: wrap !important; margin: 0 -4px !important; padding: 0 !important; list-style: none !important; } .sct_10 .sct_li { width: 50% !important; padding: 0 4px !important; margin-bottom: 16px !important; float: none !important; box-sizing: border-box !important; } .sct_10 .sct_img { width: 100% !important; aspect-ratio: 1 / 1 !important; border-radius: 4px !important; overflow: hidden !important; background: #fafafa !important; } .sct_10 .sct_img img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; } .sct_10 .sct_txt { font-size: 12.5px !important; line-height: 1.35 !important; padding: 7px 0 2px !important; height: 35px !important; overflow: hidden !important; text-overflow: ellipsis !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; } .sct_10 .sct_cost { font-size: 14px !important; font-weight: 800 !important; color: #111 !important; margin: 2px 0 4px !important; } /* 하단 모바일 고정 네비게이션 바 (#kuma_bottom_nav) */ #kuma_bottom_nav { position: fixed !important; bottom: 0 !important; left: 0 !important; width: 100% !important; height: 56px !important; background: #ffffff !important; border-top: 1px solid #e5e5e5 !important; display: flex !important; align-items: center !important; justify-content: space-around !important; z-index: 1000 !important; box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important; padding: 0 !important; margin: 0 !important; } #kuma_bottom_nav .nav-item { flex: 1 !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; color: #555 !important; text-decoration: none !important; font-size: 10px !important; font-weight: 500 !important; background: none !important; border: none !important; padding: 5px 0 !important; cursor: pointer !important; position: relative !important; line-height: 1.2 !important; } #kuma_bottom_nav .nav-item i { font-size: 18px !important; margin-bottom: 3px !important; color: #444 !important; } #kuma_bottom_nav .nav-item.active, #kuma_bottom_nav .nav-item:hover, #kuma_bottom_nav .nav-item.active i { color: #ef7777 !important; } #kuma_bottom_nav .cart-badge { position: absolute !important; top: 2px !important; right: calc(50% - 18px) !important; background: #ef7777 !important; color: #fff !important; font-size: 10px !important; font-weight: 700 !important; border-radius: 10px !important; padding: 1px 5px !important; min-width: 14px !important; text-align: center !important; line-height: 13px !important; } /* 플로팅 버튼들 하단 네비게이션과 간격 확보 */ #top_btn2 { bottom: 68px !important; right: 12px !important; } #top_btn2 img { width: 95px !important; } #top_btn { bottom: 130px !important; right: 14px !important; } } /* ========================================================================== 상품 클릭 분기 처리: - 기존 세팅된 상품: 클릭 완전 무반응 (.no-click) - 앞으로 업로드할 신규 상품: 클릭 시 상세페이지 이동 가능 (.is-clickable) ========================================================================== */ .sct_txt_name.no-click, .product-name-txt.no-click, .product-name.no-click, .no-click, .review-product-box.no-link, .review-product-box.no-link * { cursor: default !important; pointer-events: none !important; text-decoration: none !important; user-select: text !important; } .sct_txt_name.is-clickable, .sct_txt a.is-clickable, .product-name a.is-clickable, .product-name-txt.is-clickable, a.is-clickable, .is-clickable, .review-product-box.has-link, .review-product-box.has-link * { cursor: pointer !important; pointer-events: auto !important; } .review-product-box.has-link:hover { background: #f1f5f9 !important; border-color: #cbd5e1 !important; } .review-product-box.has-link .review-product-action { color: #2563eb !important; font-weight: 700 !important; }