/* BASIC css start */ @import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css"); #productDetail .loc-navi { margin: 40px 30px 10px 30px; padding-bottom: 5px; /*border-bottom: 1px solid #231f20;*/ text-transform: uppercase; text-align:left; } #productDetail .loc-navi img { padding: 2px 2px 0px 2px;} #productDetail .page-body { margin-top: 0px; } .detail_nhn_pay { line-height: 0; } /* 상단 섬네일, 상품 옵션 정보 */ #productDetail .thumb-info { width: 1250px; max-width: 1250px; margin: 0 auto; clear: both; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } #productDetail .thumb-info:after { content: ""; display: block; clear: both; } /* 섬네일 */ #productDetail .thumb-info .thumb-wrap { float: left; height:664px; border-left:1px solid #ffffff; text-align: center; position:relative; margin-left:30px; } #productDetail .thumb-info .thumb { width: 500px; text-align: center; margin: 35px 0px 0px 0px; } #productDetail .thumb-info .thumb img { display: block; width:100%; } #productDetail .thumb-info .thumb .thumbnail { position: relative; width: 100%; cursor: pointer; margin-bottom: 10px;} #productDetail .thumb-info .thumb .thumbnail img { width: 500px; } #productDetail .thumb-info .listImg { overflow: hidden; width: 500px; margin: 0;} #productDetail .thumb-info .listImg ul { min-width: 500px; height: 110px; margin:0; padding: 5px 0; } #productDetail .thumb-info .listImg li { display: inline-block; margin:0;float: left; } #productDetail .thumb-info .listImg li img { width: 70px; height:70px; cursor: pointer; opacity: 0.7; transition: all 0.3s ease; -moz-transition: all 0.3s ease; margin-right:5px;} #productDetail .thumb-info .listImg li img:hover { opacity: 10 ; transition: all 0.3s ease; -moz-transition: all 0.3s ease;} #productDetail .thumb-info .thumb-ctrl { clear: both; position:absolute; left:12%; bottom:10px; } #productDetail .thumb-info .thumb-ctrl a { font-size: 11px; float:left; } #productDetail .thumb-info .thumb-ctrl a img { vertical-align: middle; margin-right: 3px; } #productDetail .thumb-info .thumb-ctrl a:hover { text-decoration: underline; } /* 상품옵션 정보 */ #productDetail .thumb-info .info { float: left; width: 690px; padding:35px 0px 50px 60px; background:#fff; margin-left:9px; } #productDetail .thumb-info .info h3 {padding:10px 0; text-align: center; border-bottom: 1px solid #fff; letter-spacing: 2px; line-height: 20px; font-size:15px; font-weight: 700;} #productDetail .thumb-info .info .tit-sub {padding:10px 0; text-align: center; border-bottom: 2px solid #eeeeee; letter-spacing: 2px; line-height: 10px; font-size:10px; } #productDetail .thumb-info .info .table-opt {margin-top:10px;} #productDetail .thumb-info .info .table-opt td { font-size: 12px; padding: 0px 10px 0px 10px; color:#444444; text-align: left; line-height: 16px; } #productDetail .thumb-info .info .table-opt th { font-weight: normal; letter-spacing: -1px; padding: 5px 0px; color:#444444; text-align: left; line-height: 16px; } #productDetail .thumb-info .info .table-opt .tb-poin {width: 500px; padding-left: 10px; color: #b70f0f; letter-spacing: 1px;} /* 판매가격 */ #productDetail .thumb-info .info .table-opt .price { font-weight: 700; color: #cb170a; font-size: 20px;} #productDetail .thumb-info .info .table-opt .price .per { font-weight: bold; color: #fff; background-color: #0fae13; margin-left: 15px; padding: 4px 4px 4px 4px; border-radius: 4px; line-height: 15px; } #productDetail .thumb-info .info .shop_detail_line1 {} #productDetail .thumb-info .info .shop_detail_line1 td { font-size: 12px; padding: 5px 10px 5px 40px; color: #444444; text-align: left; line-height: 16px; } #productDetail .thumb-info .info .shop_detail_line {} #productDetail .thumb-info .info .shop_detail_line2 {} #productDetail .thumb-info .info .shop_detail_line2 td { padding: 0px 10px 5px;} #productDetail .thumb-info .info .shop_detail_line3 {} #productDetail .thumb-info .info .shop_detail_line3 td { padding: 5px 0px 0px; } #productDetail .thumb-info .info .shop_detail_line5 { padding: 0px 0px 0px 10px; } #productDetail .thumb-info .info .shop_detail_line5 td { font-size: 12px; padding: 5px 10px 5px 40px; color: #444444; text-align: left; line-height: 16px; } /* 주문수량 */ #goods_amount { float: left; width: 32px; border: 0; } #productDetail .thumb-info .info .table-opt .opt-spin { position: relative; width: 52px; height: 15px; border: 1px solid #acacac; } #productDetail .thumb-info .info .table-opt .opt-spin .txt-spin, #productDetail .thumb-info .info .table-opt .opt-spin .btns { float: left; } #productDetail .thumb-info .info .table-opt .opt-spin .txt-spin { width: 41px; height: 13px; padding-left: 2px padding-top: 2px; border: 0; font-size: 11px; } #productDetail .thumb-info .info .table-opt .opt-spin .btns { width: 19px; height: 15px; border-left: 1px solid #aaa; } #productDetail .thumb-info .info .table-opt .opt-spin .btns a { overflow: hidden; float: left; width: 100%; height: 7px; text-indent: -999px; background: none; } #productDetail .thumb-info .info .table-opt .opt-spin .btns a.btn-up { border-bottom: 1px solid #aaa; background: url(/images/d3/modern_simple/btn/btn_h5_spin_up.gif) no-repeat 50% 2px; } #productDetail .thumb-info .info .table-opt .opt-spin .btns a.btn-dw { background: url(/images/d3/modern_simple/btn/btn_h5_spin_dw.gif) no-repeat 50% 2px; } #productDetail .thumb-info .info .prd-btns { margin-top: 0px; margin-left: 10px; height:60px;} #productDetail .thumb-info .info .prd-btns a { /*margin: 0 10px;*/ transition:all 0.4s;} #productDetail .thumb-info .info .prd-btns .soldout { margin-left: 10px; font-weight: bold; } /* 통합옵션 */ #productDetail .thumb-info .info .table-opt .opt-wrap { width: 100%; margin-bottom: 10px; padding: 5px 0 5px 0; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit { margin-bottom: 5px; padding-left: 10px; display:none;} #productDetail .thumb-info .info .table-opt .opt-wrap dl { overflow: hidden; width: 100%; } #productDetail .thumb-info .info .table-opt .opt-wrap dt { float: left; width: 130px; margin-bottom: 5px; padding-left: 0px; line-height: 25px; } #productDetail .thumb-info .info .table-opt .opt-wrap dd { float: left; width: 460px; margin-bottom: 5px; } #productDetail .thumb-info .info .table-opt .opt-wrap .sel-btn { padding-left: 10px; text-align: center; float:right; margin-right:100px; margin-top:-24px; } #productDetail .thumb-info .info .table-opt .opt-wrap select { width: 460px; height: 25px; background: url(/design/cubesnow/2017/btn_con1.png) no-repeat 99% 50%; z-index: 100;} #productDetail .thumb-info .info .table-opt .opt-wrap .opt-btns { position: relative; width: 56px; height: 19px } #productDetail .thumb-info .info .table-opt .opt-wrap .opt-btns input { position: absolute; top: 0; left: 0; width: 40px; height: 17px; border: 1px solid #ddd; text-align: right; } #productDetail .thumb-info .info .table-opt .opt-wrap .opt-btns .btn-up { position: absolute; top: 0; right: 0; } #productDetail .thumb-info .info .table-opt .opt-wrap .opt-btns .btn-dw { position: absolute; bottom: 0; right: 0; } #productDetail .thumb-info .info .table-opt .opt-wrap dl .opt-count select { float: left; width: 180px; } #productDetail .thumb-info .info .table-opt .opt-wrap dl .opt-count .opt-btns { float: left; width: 56px; margin-left: 5px; } /* 타이틀 공통 */ #productDetail .tit-hd { margin-top: 70px; border-bottom: 1px solid #b8b8b8; padding-left: 4px; } #productDetail .tit-hd .tit-detail { height: 16px; padding-top: 8px; padding-left: 20px; background: url(/images/d3/modern_house/bg_tab.gif) no-repeat 0 0; } #productDetail .tit-hd .btns-part { position: relative; } #productDetail .tit-hd .btns { position: absolute; right: 0; top: -26px; text-align: center; } /* 상품 상세 이미지 */ #productDetail .prd-detail table { table-layout: auto; } #productDetail .prd-detail { margin-top: 15px; width: 100%; overflow: hidden; text-align:center; } #productDetail .prd-detail img { max-width: 100%; } /* 관련상품 */ #productDetail .prd-to { margin-top:120px; } #productDetail .prd-list { margin:40px 0 40px 0; width: 1300px; background-color:#fff; text-align: left; border: 5px solid #eeeeee; padding: 0 0 20px 0; } #productDetail .prd-list .rel { margin:20px 0 0 25px; } #productDetail .prd-list .rel h2 { float: left; font-size: 15px; letter-spacing: 1px;font-weight: 800; } #productDetail .prd-list .rel span { float: left; padding: 0 0 0 10px; line-height: 20px; } #productDetail .prd-list .thumb { width: 200px; height: 200px; border:none; border: 1px solid #fff; margin-top:20px; } #productDetail .prd-list th { padding-bottom: 10px; border-bottom: 1px solid #aaa; } #productDetail .prd-list td { padding: 5px 5px; width:240px;} #productDetail .prd-list td .dsc { width:210px; height:42px; text-align:center; margin:10px 0 10px 10px; font-weight: normal; } #productDetail .prd-list td .price {text-align:center; margin-left:10px; } #productDetail .prd-list .prd-amount { position: relative; width: 52px; height: 15px; border: 1px solid #acacac; } #productDetail .prd-list .prd-amount .txt-spin, #productDetail .prd-list .prd-amount .btns { float: left; } #productDetail .prd-list .prd-amount .txt-spin { width: 41px; height: 13px; padding-left: 2px padding-top: 2px; border: 0; font-size: 11px; } #productDetail .prd-list .prd-amount .btns { width: 17px; height: 15px; border-left: 1px solid #aaa; } #productDetail .prd-list .prd-amount .btns a { overflow: hidden; float: left; width: 100%; height: 8px; text-indent: -999px; background: none; } #productDetail .prd-list .prd-amount .btns a.btn-up { border-bottom: 1px solid #aaa; background: url(/images/d3/modern_simple/btn/btn_h5_spin_up.gif) no-repeat 50% 50%; } #productDetail .prd-list .prd-amount .btns a.btn-dw { background: url(/images/d3/modern_simple/btn/btn_h5_spin_dw.gif) no-repeat 50% 50%; } #productDetail .related-allbasket { width: 100%; padding-top: 10px; text-align: right; } #productDetail .prd-list table .info_box { border-left: 1px solid #eee;} #productDetail .prd-list table .info_box:first-child { border:0px; } /* review-write */ #productDetail .review-write { margin-top: 15px; padding-top: 10px; border-top: 1px solid #ccc; } #productDetail .review-write th, #productDetail .review-write td { padding: 5px 0 4px; } #productDetail .review-write th { font-weight: normal; } #productDetail .review-write .frm-w input { width: 300px; height: 18px; line-height: 18px; border: 1px solid #ededed; } /* 댓글리스트 공통 */ #productDetail .table-slide { /*border-top: 1px solid #ccc;*/ } #productDetail .table-slide thead th { font-weight: normal; } #productDetail .table-slide th, #productDetail .table-slide td { padding: 10px 0; cursor: pointer; } #productDetail .table-slide th { font-size: 11px; } #productDetail .table-slide tbody td { background: url(/images/d3/modern_simple/common/dot_h1_w10.gif) repeat-x 0 0; } #productDetail .table-slide tr.cnt { display: none; } #productDetail .table-slide tr.cnt td { cursor: default; } #productDetail .table-slide tr.nbg td { background-image: none; } #productDetail .table-slide tr.ndata td { border-bottom: 2px solid #b4b4b5; } #productDetail .table-slide tr.reply .tb-txt { padding-left: 30px; background: url(/images/d3/modern_simple/common/bull_reply.gif) no-repeat 10px 0; } /* review-list */ #productDetail .review-list { margin-top: 5px; } #productDetail .review-list .bg { padding-top: 35px; background: url(/images/d3/modern_simple/common/dot_h1_w10.gif) repeat-x 0 0; } /* qna board */ #productDetail .qna-list { margin-top: 5px; } /* .board-hd */ #productDetail .board-hd .btn { position: relative; text-align: right; font-size: 0; line-height: 0; margin-top:-27px; } #productDetail .board-hd .btn a { display: inline-block; padding: 5px 15px; margin-left: 20px; border:1px solid #ddd; } #productDetail .s-tit { position: relative; margin-top: 50px; /*padding-top: 24px;*/ font-size: 11px; color: #ababab; /*background: url(/images/d3/sporty_style/common/bg_prd_section.gif) repeat-x 0 0;*/ z-index:-1; } /* .board-btns */ #productDetail .board-btns { text-align: right; } #productDetail .board-btns img { padding: 0 5px; } /* ****************** 상품 상세 옵션 ******************** */ .MK_not_choice { color: red; } .MK_optAddWrap, .MK_optAddWrap * { margin-left: 2px; margin-right: 2px; padding: 0px 0px 3px 5px ;} .MK_optAddWrap { color: #666; font-size: 11px; line-height: 13px; font-family: Dotum; } .MK_optAddWrap li { list-style: none; } /* 옵션선택 */ #MK_optAddList { overflow: hidden; *zoom: 1; } #MK_optAddList li { float: left; width: 100%; margin-top: 5px; } #MK_optAddList .MK_tit, #MK_optAddList .MK_div, #MK_optAddList .MK_st { float: left; } #MK_optAddList .MK_tit, #MK_optAddList .MK_div { font-size: 11px; line-height: 16px; } #MK_optAddList .MK_tit { width: 65px; margin-right: 5px; } #MK_optAddList .MK_div { width: 5px; text-align: center; } #MK_optAddList .MK_st { width: 205px; } #MK_optAddList .MK_st .MK_btn-add { cursor: pointer; } #MK_optAddList .MK_st select { margin-left: 5px; width: 195px; height: 18px; } /* 옵션선택PP */ #MK_optAddListPP { overflow: hidden; *zoom: 1; } #MK_optAddListPP .MK_tit, #MK_optAddListPP .MK_st { float: left; width: auto; } #MK_optAddListPP .MK_tit { margin-right: 5px; margin-top: 3px; } /* 옵션 결과 리스트 */ #MK_innerOptWrap { background-color: #f4f4f4; padding-bottom: 20px; } #MK_innerOptWrap #MK_innerOptScroll.limit { position: relative; height: 150px; overflow-y: auto; } #MK_innerOptWrap .MK_inner-opt-cm li { *zoom: 1; position: relative; min-height:13px; *margin-bottom: -4px; padding: 8px 0px; border-bottom: 1px solid #ddd; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl, #MK_innerOptWrap .MK_inner-opt-cm li .MK_price, #MK_innerOptWrap .MK_inner-opt-cm li .MK_btn-del { position: absolute; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_p-name, #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl, #MK_innerOptWrap .MK_inner-opt-cm li .MK_price, #MK_innerOptWrap .MK_inner-opt-cm li .MK_btn-del { display: block; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_price { right: 20px; top: 10px; color: #333; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_btn-del { right: 5px; top: 8px; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl .basic_option { margin-top: 1px; border: 1px solid #ddd;} /* 사용자 입력 인풋박스 (color, size )*/ .MK_optAddWrap .MK_inner-opt-cm li .MK_txt_uinput { width: 200px; } /* 기본옵션 */ #MK_innerOptWrap #MK_innerOpt_01 { padding-right: 10px;} #MK_innerOptWrap #MK_innerOpt_01 li .MK_p-name { margin-right: 180px; } #MK_innerOptWrap #MK_innerOpt_01 li .MK_qty-ctrl { top: 3px; *top: 2px; right: 120px; } #MK_innerOptWrap #MK_innerOpt_01 li .MK_qty-ctrl input.MK_count { width: 30px; height: 16px; line-height: 16px; padding: 2px 1px 0 2px; } #MK_innerOptWrap #MK_innerOpt_01 li .MK_qty-ctrl a { position: absolute; right: -15px; font-size: 0; line-height: 0; color:#333;} #MK_innerOptWrap #MK_innerOpt_01 li .MK_qty-ctrl a img { vertical-align: top; } #MK_innerOptWrap #MK_innerOpt_01 li .MK_qty-ctrl a.MK_btn-up { top: 2px; } #MK_innerOptWrap #MK_innerOpt_01 li .MK_qty-ctrl a.MK_btn-dw { top: 12px; } /* 개별옵션 */ #MK_innerOptWrap #MK_innerOpt_02 { padding-right: 10px;} #MK_innerOptWrap #MK_innerOpt_02 li .MK_p-name { margin-right: 180px; } #MK_innerOptWrap #MK_innerOpt_02 li .MK_qty-ctrl { top: 3px; *top: 2px; right: 120px; } #MK_innerOptWrap #MK_innerOpt_02 li .MK_qty-ctrl input.MK_count { width: 30px; height: 16px; line-height: 16px; padding: 2px 1px 0 2px; } #MK_innerOptWrap #MK_innerOpt_02 li .MK_qty-ctrl a { position: absolute; right: -15px; font-size: 0; line-height: 0; color:#333;} #MK_innerOptWrap #MK_innerOpt_02 li .MK_qty-ctrl a img { vertical-align: top; } #MK_innerOptWrap #MK_innerOpt_02 li .MK_qty-ctrl a.MK_btn-up { top: 2px; } #MK_innerOptWrap #MK_innerOpt_02 li .MK_qty-ctrl a.MK_btn-dw { top: 12px; } /* 총합계 */ #MK_innerOptTotal { padding: 20px 5px 10px; font-size: 12px; color: #333; text-align: right; } #MK_innerOptTotal .MK_txt-total { } #MK_innerOptTotal .MK_txt-won { } #MK_innerOptTotal .MK_total { color: #ff001f; font-weight: bold; font-size:33px; font-family:Nanum Gothic !important; } /* 소리뷰 */ #sorivu { position: relative; margin-top: 20px; } /* 상품 일반정보(상품정보제공 고시) */ #productWrap { margin: 10px 0; } #productWrap h3.tb-tit { margin-bottom: 10px; text-align: left; } #productWrap table { width: 100%; font-size: 12px; border-collapse: collapse; border-width: 1px 0 1px 0; border-color: #b4b4b4; border-style: solid; table-layout: fixed; } #productWrap table th { border-right: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; background-color: #f8f8f8; color: #3b3b3d; text-align: left; padding: 10px 0 10px 15px; } #productWrap table td { color: #8b8b8b; border-bottom: 1px solid #e0e0e0; word-break: break-all; text-align: left; padding: 10px 0 10px 17px; } /*쇼핑팁*/ #MK_innerOptWrap h2 {padding:5px 0 0 10px; } #MK_innerOptWrap .tip {padding: 0 0 0 12px; } /**사용자 설정**/ /*혜택*/ #pp { margin:0 auto; width:1300px;} #pp .p_service { width:1300px; margin:50px 0 50px 0; padding: 0px 50px ; list-style:none; border: 1px solid #fff; height: 240px; } #pp .p_service .service_box { float:left; text-align: center; width: 239px; padding-top: 30px; padding-left: 2px; } #pp .p_service .service_box img {padding:25px; background-color:#4f4f4f; border-radius:20px; transition: all 0.7s ease; -moz-transition: all 0.7s ease; } #pp .p_service .service_box h2 { font-size: 15px; padding-top: 10px; font-weight: 800; letter-spacing: 2px; padding-bottom: 10px; color: #262626;} #pp .p_service .service_box p { font-size: 12px; line-height: 16px; } #pp .p_service .service_box a { text-decoration:none; } #pp .p_service .service_box img:hover { background-color:#000; border-radius:50%; transition: all 0.7s ease; -moz-transition: all 0.7s ease; } .de_btm_wrap { width:239px; height:117px; float:left; text-align:center; border-left:1px solid #ddd; margin-top:13px; } .de_btm_wrap:first-child { border:none; } .de_btm_img { padding-top:13px; } #productDetail .thumb-info .info .prd-btns a { /*margin:0 -2px;*/ } /*shop info*/ .shop_info { margin-top:50px; position:relative; text-align:center; } .shop_info_img img { border:1px solid #ddd; } .shop_info_btn { position:absolute; top:570px; left:50%; margin-left:420px; } /*상세페이지 품인이미지 위치조정*/ .zoomPad { margin-left:120px !important; } .zoomWindow { left:-2px !important; top:-2px !important; } .zoomWindowShadow { display:none !important; } /*구매버튼*/ .buy {display: block; float: left; background-color: #333;} .buy h2 {color: #eeeeee; text-align: center; font-size: 14px; font-weight: 500; letter-spacing: 2px; } .buy p {color:#b7b7b7;letter-spacing: 1px; text-align: center; } .buy a {display:block; padding: 17px 266px;} .buy a:hover {display:block; background-color:#000;} .kakaotalk {display: block; float:left; margin-right: 4px; margin-top: 4px; transition:all 0.7s; background-color: #f9e000} .kakaotalk h2 {color: #000; text-align: center; font-size: 12px; font-weight: 700; letter-spacing: 2px; } .kakaotalk p {color:#b7b7b7;letter-spacing: 0px; text-align: center; } .kakaotalk a {display:block; padding: 5px 208px; padding-bottom: -2px; padding-top: 7px;} .kakaotalk a:hover {display:block; background-color:#7c7000;} .shop_de_btn1 {float:left; margin-right: 4px; margin-top: 4px; transition:all 0.7s; background-color: #eeeeee; } .shop_de_btn1 a { display:block; padding: 16px 23px; text-align: center;} .shop_de_btn1 a:hover { display:block; background-color:#d4dbe5; } .shop_de_btn2 {float:left; margin-top: 4px; background-color: #eeeeee; padding: } .shop_de_btn2 a { display:block; padding: 16px 33px; text-align: center;} .shop_de_btn2 a:hover { display:block; background-color:#a6a5aa; } .shop_de_btn3 {float: right; display: block; margin: 3px 8px 0 0px;} /*쿠폰*/ .coupon_cj {background-color:#ffffff; margin:auto 40px; TEXT-ALIGN:center; width:1300px; height: 5px;} .coupon_cj ul {} .coupon_cj ul li { width: 290px;; float: left; margin:7px;} /*디테일 타이틀*/ #prdDetail { max-width: 1300px; /* 전체 폭 제한 */ margin: 0 auto; /* 좌우 자동 여백 → 중앙 정렬 */ box-sizing: border-box; } #prdChange, #prdDetail, #prdDelivery, #prdReview, #prdQnA { height:33px; max-width: 1300px; /* 전체 폭 제한 */ border-bottom:1px solid #ddd; margin:20px 0; } .link li { float:left; width:190px; height:33px; border:1px solid #ddd; text-align:center; margin-right:2px; padding-left:10px; } .link li a { font-family:'Nanum Gothic'; line-height:33px; font-size:12px; } .link li a b { font-size:12px; } .link .selected { width:190px; height:33px; border-bottom:1px solid #fff; border-top:3px solid #333333; border-left:3px solid #333333; border-right:3px solid #333333; } .go_to_top { float:right; margin:8px; } /*리뷰 사이즈*/ textarea.MS_review_content_box { width:910px height:57px; } /*카드배너*/ .snip1444 li { display: inline-block; list-style: outside none none; margin: 0; position: relative; } .snip1444 > li:first-of-type { border-left: none; } .snip1444 > li:last-of-type { border-right: none; padding: 0 0 0 0; } .snip1444 a { color: #000000; display: block; padding: ; position: relative; text-decoration: none; padding-left: 0px; margin-left: 0px; } .snip1444 > li:before, .snip1444 > li:after { position: absolute; content: ''; } .snip1444 > li:before { left: 0; right: 0; bottom: 0; top: 100%; opacity: 0; } .snip1444 > li:after { position: absolute; bottom: 0; left: -1px; right: -1px; height: 5px; } .snip1444 ul { display: none; position: absolute; top: 100%; margin: 0; padding: 0px 0; background-color: #eeeeee; z-index: 999; } .snip1444 ul li { display: list-item; float: none; position: relative; } .snip1444 ul li a { padding: 0.8em 1.2em; color: #222222; text-transform: none; } .snip1444 ul li a:hover { opacity: 1; } .snip1444 li:hover > ul { display: inherit; } .snip1444 li > a:after { } .snip1444 li > a:only-child:after { content: ''; } .snip1444 ul ul { background-color: #962d22; top: 0px; left: 100%; list-style: none; font-size: 1em; } .snip1444 > li:hover > a, .snip1444 > li.current > a { color: #222222; } .snip1444 > li:hover:before, .snip1444 > li.current:before { top: 0; opacity: 1; } /* 추가 250918 */ /* 1) 섹션 폭 1300px로 제한 + 중앙정렬 */ #prdDetail, #prdDelivery, #prdChange, #prdReview, #prdQnA, #productDetail .review-write, #productDetail .review-list, #productDetail .qna-list, #productDetail .table-slide, #productDetail .board-btns { max-width: 1300px; margin: 0 auto; box-sizing: border-box; } /* 2) 탭바(ul.link)를 중앙 정렬 + 줄바꿈 허용 */ #prdDetail > ul.link, #prdDelivery > ul.link, #prdChange > ul.link, #prdReview > ul.link, #prdQnA > ul.link { display: flex; justify-content: center; flex-wrap: wrap; gap: 2px; list-style: none; padding: 0; margin: 20px auto 10px; } /* 3) 전역 고정폭/float 무력화 (필요시 !important 추가) */ #prdDetail .link li, #prdDelivery .link li, #prdChange .link li, #prdReview .link li, #prdQnA .link li { float: none; /* 필요시: float:none !important; */ width: auto; /* 필요시: width:auto !important; */ min-width: 150px; max-width: 220px; height: 33px; padding: 0 10px; text-align: center; box-sizing: border-box; } /* 선택 탭도 고정폭 해제 */ #prdDetail .link .selected, #prdDelivery .link .selected, #prdChange .link .selected, #prdReview .link .selected, #prdQnA .link .selected { width: auto; } /* 4) 본문 테이블이 컨테이너를 넘치지 않도록 */ #productDetail .review-write table, #productDetail .review-list table, #productDetail .qna-list table { width: 100%; table-layout: auto; } /* 5) 상단 요약 영역(필요 시 반응형) */ #productDetail .thumb-info { width: 100%; max-width: 1250px; margin: 0 auto; } /* 스마트쿠폰목록 */ #productDetail .smart-coupon-list { padding:0px 0; text-align:center;} #productDetail .smart-coupon-list ul {display: inline-block; *display:inline; zoom:1; overflow:hidden; margin-left:0px; min-width:300px;} #productDetail .smart-coupon-list ul li {position:relative; float:left; width:612px; margin:0 0 3px 3px; border:1px solid #cecece; border-radius:10px; letter-spacing:-1px; overflow:hidden; text-align:left;} #productDetail .smart-coupon-list ul li .c-info {position:relative; float:left; width:245px; padding:20px; border-right: 1px dashed #cecece; } #productDetail .smart-coupon-list ul li .c-image a {display:block;} #productDetail .smart-coupon-list ul li .c-image img { width:100%; height:auto;} #productDetail .smart-coupon-list ul li p { padding-bottom:10px; line-height:18px; font-size:12px; color:#999; word-break:break-all; font-family:"Malgun Gothic"; } #productDetail .smart-coupon-list ul li p:last-child {padding-bottom:0;} #productDetail .smart-coupon-list ul li p.c-name { font-size:14px; color:#000; font-weight:bold; word-break: break-all; } #productDetail .smart-coupon-list ul li p.c-price {font-size:26px; color:#ff3a34; font-weight:bold; line-height:24px;} #productDetail .smart-coupon-list ul li.sc-style1.sc-reserve p.c-price {color:#3b6ce9;} #productDetail .smart-coupon-list ul li .sc-btn-down {position:absolute; top:0; right:0; bottom:0; width:58px; margin:auto; vertical-align:middle; background:#f8f8f8; font-family:"Malgun Gothic"; } #productDetail .smart-coupon-list ul li .sc-btn-down > span {position:absolute; left:0; top:0; right:0; bottom:0; margin:auto; height:22px; text-align:center; font-size:0; } #productDetail .smart-coupon-list ul li .sc-btn-down > span > span.sc-complete {font-size:12px; color:#999;} #productDetail .smart-coupon-list ul li .sc-btn-down > span a { font-size:0; display:inline-block; margin-top:-5px; } #productDetail .smart-coupon-list ul li .sc-btn-down span a > span { font-size:0; text-indent:-9999px; display:inline-block; width:22px; height:22px; background:url('/images/common/ico_h11_down_black_l.png') no-repeat center center; } #productDetail .smart-coupon-list ul li.sc-style2 {border:1px solid #fff;} #productDetail .smart-coupon-list ul li.sc-style2 .c-info { background:#171940; border-color:#171940; } #productDetail .smart-coupon-list ul li.sc-style2 p { color:#fff; } #productDetail .smart-coupon-list ul li.sc-style2 p.c-txt { color:#999; } #productDetail .smart-coupon-list ul li.sc-style2 .sc-btn-down { background:#ff3a34; border:0; color:#fff; } #productDetail .smart-coupon-list ul li.sc-style2.sc-reserve .sc-btn-down { background:#3b6ce9; color:#fff; } #productDetail .smart-coupon-list ul li.sc-style2 .sc-btn-down span a { color:#fff; } #productDetail .smart-coupon-list ul li.sc-style2 .sc-btn-down span .num {color:#fff;} #productDetail .smart-coupon-list ul li.sc-style2 .sc-btn-down span a > span { background:url('/images/common/ico_h11_down_white_l.png') no-repeat center center; } #productDetail .smart-coupon-list ul li.sc-style3 { width:346px; border:0; border-radius:0; } #productDetail .smart-coupon-list ul li.sc-style3 .c-info { width:244px; border:1px solid #000; border-right:2px dotted #272a4d; border-radius:10px; } #productDetail .smart-coupon-list ul li.sc-style3 p.c-price { color:#eb3697;} #productDetail .smart-coupon-list ul li.sc-style3 .sc-btn-down { background:#fff2f9 ; border:1px solid #272a4d; border-left:0; border-radius:10px; } #productDetail .smart-coupon-list ul li.sc-style3 .sc-btn-down span a { color:#999; } #productDetail .smart-coupon-list ul li.sc-style3 .sc-btn-down span a > span { background:url('/images/common/ico_h11_down_pink_l.png') no-repeat center center; } #productDetail .smart-coupon-list ul li.sc-style3.sc-reserve .sc-btn-down { background:#eefff7; } #productDetail .smart-coupon-list ul li.sc-style3.sc-reserve p.c-price {color:#18b776;} #productDetail .smart-coupon-list ul li.sc-style3.sc-reserve .sc-btn-down span a > span { background:url('/images/common/ico_h11_down_green_l.png') no-repeat center center; } /* === PR OPTION BUTTONS : 상품 옵션 전용 === */ #productDetail .thumb-info .info .table-opt .opt-wrap { box-sizing: border-box; width: 100%; margin: 12px 0 18px; padding: 18px; border: 1px solid #e8e8e8; border-radius: 14px; background: #fff; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit { display: block; margin: 0 0 16px; padding: 0 0 12px; border-bottom: 1px solid #eee; color: #777; font-size: 12px; line-height: 1.6; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit strong { color: #171717; font-size: 14px; font-weight: 700; } #productDetail .thumb-info .info .table-opt .opt-wrap dl { display: block; box-sizing: border-box; width: 100%; overflow: visible; margin: 0 0 18px; padding: 0; } #productDetail .thumb-info .info .table-opt .opt-wrap dl:last-child { margin-bottom: 0; } #productDetail .thumb-info .info .table-opt .opt-wrap dt, #productDetail .thumb-info .info .table-opt .opt-wrap dd { float: none; box-sizing: border-box; width: 100%; margin: 0; padding: 0; } #productDetail .thumb-info .info .table-opt .opt-wrap dt { margin-bottom: 9px; color: #333; font-size: 13px; font-weight: 600; line-height: 1.5; letter-spacing: -0.3px; } #productDetail .thumb-info .info .table-opt .opt-wrap dd { position: relative; } #productDetail .thumb-info .info .table-opt .opt-wrap select { box-sizing: border-box; float: none; width: 100%; max-width: 100%; height: 44px; padding: 0 12px; border: 1px solid #ddd; border-radius: 8px; background: #fff; color: #333; } #productDetail .thumb-info .info .table-opt .opt-wrap select.pr-option-native { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; } /* 키보드로 원래 선택창에 접근하면 펼쳐서 표시 */ #productDetail .thumb-info .info .table-opt .opt-wrap select.pr-option-native:focus { position: static !important; width: 100% !important; height: 44px !important; padding: 0 12px !important; clip-path: none !important; margin-bottom: 8px; } #productDetail .pr-option-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; } #productDetail .pr-option-buttons[hidden] { display: none; } #productDetail .pr-option-buttons .pr-option-button { appearance: none; box-sizing: border-box; flex: 0 1 auto; min-width: 62px; max-width: 100%; min-height: 42px; height: auto; margin: 0; padding: 11px 15px; border: 1px solid #dedede; border-radius: 8px; background: #fff; color: #444; font-family: inherit; font-size: 13px; font-weight: 500; line-height: 1.5; text-align: left; white-space: normal; overflow-wrap: anywhere; cursor: pointer; box-shadow: none; transition: background .15s, border-color .15s, color .15s; } #productDetail .pr-option-button:hover:not(:disabled) { border-color: #171717; } #productDetail .pr-option-button[aria-pressed="true"] { border-color: #171717; background: #171717; color: #fff; font-weight: 700; } #productDetail .pr-option-buttons .pr-option-reset { border-style: dashed; font-size: 12px; } #productDetail .pr-option-button:disabled { border-color: #eee; background: #f7f7f7; color: #aaa; cursor: not-allowed; } #productDetail .pr-option-button:focus-visible { outline: 2px solid #171717; outline-offset: 3px; } #productDetail .thumb-info .info .table-opt .opt-wrap .sel-btn { float: none; margin: 16px 0 0; padding: 0; text-align: right; } #productDetail .thumb-info .info .table-opt .opt-wrap .sel-btn a { display: inline-block; padding: 10px 16px; border-radius: 8px; background: #171717; color: #fff; font-size: 13px; text-decoration: none; } #productDetail .thumb-info .info .table-opt .opt-wrap dl .opt-count .opt-btns { float: none; margin: 10px 0 0; } @media (prefers-reduced-motion: reduce) { #productDetail .pr-option-buttons .pr-option-button { transition: none; } } /* 추가옵션은 기본 드롭다운으로 선택 */ #productDetail .thumb-info .info .table-opt .opt-wrap.pr-extra-options select, #productDetail .thumb-info .info .table-opt .opt-wrap.pr-extra-options dl .opt-count select { display: block; position: static; float: none; box-sizing: border-box; width: 100%; max-width: 100%; height: 46px; margin: 0; padding: 0 12px; border: 1px solid #dedede; border-radius: 8px; background: #fff; color: #333; font-family: inherit; font-size: 13px; appearance: auto; cursor: pointer; } #productDetail .thumb-info .info .table-opt .opt-wrap.pr-extra-options select:focus { outline: 2px solid #171717; outline-offset: 2px; } #productDetail .thumb-info .info .table-opt .opt-wrap.pr-extra-options select:disabled { background: #f7f7f7; color: #aaa; cursor: not-allowed; } /* === PR PURCHASE : 구매 안내 · 총금액 · 구매 버튼 === */ #productDetail .thumb-info .info #MK_innerOptWrap { background: transparent; padding-bottom: 0; } #productDetail .thumb-info .info .pr-shopping-guide, #productDetail .thumb-info .info .pr-shopping-guide * { box-sizing: border-box; margin: 0; padding: 0; } #productDetail .thumb-info .info .pr-shopping-guide { margin: 18px 0 0; padding: 20px 22px; border: 1px solid #e9e9e9; border-radius: 14px; background: #fafafa; font-family: inherit; color: #555; font-size: 13px; line-height: 1.7; } #productDetail .thumb-info .info .pr-shopping-guide h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 16px; color: #171717; font-size: 14px; font-weight: 700; line-height: 1.5; } #productDetail .pr-shopping-guide h2 span { color: #909090; font-size: 10px; font-weight: 400; letter-spacing: 1.4px; } #productDetail .thumb-info .info .pr-shopping-guide .pr-guide-row { display: grid; grid-template-columns: 66px minmax(0, 1fr); gap: 12px; margin: 9px 0; } #productDetail .pr-shopping-guide .pr-guide-row dt { color: #333; font-weight: 600; } #productDetail .pr-shopping-guide .pr-guide-row strong { color: #222; font-weight: 600; } #productDetail .pr-shopping-guide .pr-guide-row small { font-size: 11px; color: #888; } #productDetail .thumb-info .info .pr-shopping-guide .pr-installment { margin-top: 15px; padding-top: 12px; border-top: 1px solid #e7e7e7; } #productDetail .pr-installment summary { cursor: pointer; color: #555; font-size: 12px; } #productDetail .pr-installment summary:focus-visible { outline: 2px solid #171717; outline-offset: 4px; } #productDetail .thumb-info .info .pr-shopping-guide .pr-installment-content { padding-top: 12px; } #productDetail .pr-installment-content img { display: block; max-width: 100%; height: auto; } /* 기존 총금액 ID 및 값 갱신 기능 유지 */ #productDetail .thumb-info .info #MK_innerOptTotal.pr-order-total { display: flex; align-items: baseline; gap: 5px; box-sizing: border-box; width: 100%; margin: 22px 0 16px; padding: 20px 4px 4px; border-top: 1px solid #e8e8e8; color: #171717; font-family: inherit; } #productDetail #MK_innerOptTotal.pr-order-total .MK_txt-total { flex: 1; margin: 0; padding: 0; color: #555; font-size: 13px; text-align: left; } #productDetail #MK_innerOptTotal.pr-order-total .MK_total { margin: 0; padding: 0; color: #171717; font-family: inherit !important; font-size: 30px; font-weight: 800; line-height: 1.25; letter-spacing: -1px; font-variant-numeric: tabular-nums; } #productDetail #MK_innerOptTotal.pr-order-total .MK_txt-won { margin: 0; padding: 0; color: #333; font-size: 14px; } /* 버튼은 동일한 너비 기준의 그리드로 배치 */ #productDetail .thumb-info .info .prd-btns.pr-purchase { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; box-sizing: border-box; width: auto; height: auto; margin: 14px 0 0 10px; padding: 0; clear: both; } #productDetail .pr-purchase::before, #productDetail .pr-purchase::after { display: none; } #productDetail .pr-purchase > .buy, #productDetail .pr-purchase > .kakaotalk, #productDetail .pr-purchase > .shop_de_btn1, #productDetail .pr-purchase > .shop_de_btn2, #productDetail .pr-purchase > .shop_de_btn3 { float: none; position: static; box-sizing: border-box; min-width: 0; width: auto; height: auto; margin: 0; padding: 0; background: transparent; } #productDetail .pr-purchase > .buy, #productDetail .pr-purchase > .kakaotalk, #productDetail .pr-purchase > .shop_de_btn3, #productDetail .pr-purchase > .soldout { grid-column: 1 / -1; } #productDetail .pr-purchase > .buy > a { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; box-sizing: border-box; width: 100%; min-height: 60px; margin: 0; padding: 16px 20px; border: 1px solid #171717; border-radius: 11px; background: #171717; color: #fff; text-decoration: none; } #productDetail .pr-purchase .pr-buy-title { font-size: 17px; font-weight: 700; letter-spacing: -.4px; } #productDetail .pr-purchase .pr-buy-caption { color: #bdbdbd; font-size: 10px; letter-spacing: 1.5px; } #productDetail .pr-purchase > .buy > a:hover { background: #333; } #productDetail .pr-purchase > .kakaotalk > a { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; min-height: 48px; padding: 10px 16px; border-radius: 10px; background: #f9e000; } #productDetail .pr-purchase > .kakaotalk > a:hover { background: #f9e000; } #productDetail .pr-purchase > .kakaotalk img { display: block; max-width: 100%; height: auto; margin: 0; border: 0; } #productDetail .pr-purchase > .shop_de_btn1 > a, #productDetail .pr-purchase > .shop_de_btn2 > a { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; min-height: 46px; margin: 0; padding: 12px 6px; border: 1px solid #e2e2e2; border-radius: 9px; background: #fff; color: #444; font-size: 13px; font-weight: 500; line-height: 1.5; text-align: center; text-decoration: none; } #productDetail .pr-purchase > .shop_de_btn1 > a:hover, #productDetail .pr-purchase > .shop_de_btn2 > a:hover { border-color: #777; background: #fafafa; } #productDetail .pr-purchase > div > a:focus-visible { outline: 2px solid #171717; outline-offset: 3px; } #productDetail .pr-purchase > .soldout { margin: 0; padding: 20px; border-radius: 10px; background: #f5f5f5; color: #888; text-align: center; } /* 네이버페이 제공 버튼 내부는 변경하지 않고 별도 행에 배치 */ #productDetail .pr-purchase > .shop_de_btn3 { padding-top: 8px; justify-self: end; max-width: 100%; } @media (prefers-reduced-motion: reduce) { #productDetail .thumb-info .info .pr-purchase a { transition: none; } } /* === PR COMPACT OPTIONS : 원에잇 참고 치수 === */ #productDetail .thumb-info .info .table-opt .opt-wrap { max-width: 600px; margin: 10px 0 14px; padding: 14px 16px; border-radius: 8px; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit { margin-bottom: 12px; padding-bottom: 10px; font-size: 11px; line-height: 1.5; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit strong { font-size: 13px; } #productDetail .thumb-info .info .table-opt .opt-wrap dl { margin-bottom: 12px; } #productDetail .thumb-info .info .table-opt .opt-wrap dl:last-child { margin-bottom: 0; } #productDetail .thumb-info .info .table-opt .opt-wrap dt { margin-bottom: 6px; font-size: 12px; line-height: 18px; } #productDetail .pr-option-buttons { gap: 5px; } #productDetail .pr-option-buttons .pr-option-button { min-width: 63px; min-height: 38px; padding: 9px 20px; border-radius: 6px; border-color: #e0e0e0; font-size: 13px; line-height: 18px; font-weight: 400; text-align: center; } #productDetail .pr-option-buttons .pr-option-button[aria-pressed="true"]:not(:disabled) { border-color: #171717; background: #171717; color: #fff; font-weight: 600; } /* 선택 안내/해제 버튼은 품절 표시와 구분 */ #productDetail .pr-option-buttons .pr-option-reset { min-width: 0; padding-right: 12px; padding-left: 12px; border-style: solid; font-size: 11px; } /* 실제 개별 옵션이 품절일 때: 흰 배경 + 점선 + 연회색 숫자 */ #productDetail .pr-option-buttons .pr-option-button.pr-is-soldout { border: 1px dashed #dcdcdc; background: #fff; color: #dcdcdc; font-weight: 400; text-decoration: none; cursor: not-allowed; opacity: 1; } /* 추가옵션 선택창: 경계선과 같은 전체 너비, 높이 32px */ #productDetail .thumb-info .info .table-opt .opt-wrap.pr-extra-options select, #productDetail .thumb-info .info .table-opt .opt-wrap.pr-extra-options dl .opt-count select { width: 100%; max-width: 100%; height: 32px; min-height: 32px; padding: 0 11px; border: 1px solid #e0e0e0; border-radius: 6px; font-size: 12px; } /* === PR OPTIONS V2 : 구분선 · 옵션 버튼 · 선택 내역 === */ #productDetail .thumb-info .info .table-opt .opt-wrap { max-width: none; margin: 0; padding: 12px 0; border: 0; border-bottom: 1px solid #e9e9e9; border-radius: 0; background: transparent; box-shadow: none; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit { margin: 0 0 10px; padding: 0; border: 0; color: #929292; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit strong { color: #111; font-size: 15px; font-weight: 800; letter-spacing: -0.3px; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit .pr-option-required { margin-left: 3px; color: #e03a32; font-size: 13px; font-weight: 700; } #productDetail .thumb-info .info .table-opt .opt-wrap dl { margin-bottom: 10px; } #productDetail .thumb-info .info .table-opt .opt-wrap dl:last-child { margin-bottom: 0; } #productDetail .thumb-info .info .table-opt .opt-wrap dt { margin-bottom: 8px; color: #666; } #productDetail .pr-option-buttons { gap: 7px; } #productDetail .pr-option-buttons .pr-option-button { min-width: 63px; min-height: 38px; padding: 9px 16px; border: 1px solid #e1e1e1; border-radius: 5px; background: #fff; color: #444; font-size: 13px; line-height: 18px; } #productDetail .pr-option-buttons .pr-option-button:hover:not(:disabled) { border-color: #555; background: #f8f8f8; } #productDetail .pr-option-buttons .pr-option-button[aria-pressed="true"]:not(:disabled) { border-color: #222; background: #222; color: #fff; font-weight: 600; box-shadow: 0 2px 5px rgb(0 0 0 / 8%); } #productDetail .pr-option-buttons .pr-option-button.pr-is-soldout { border: 1px dashed #ddd; background: #fff; color: #ccc; box-shadow: none; } /* 원본 옵션의 값/이벤트는 유지하고 생성된 버튼만 디자인합니다. */ #productDetail .thumb-info .info .MK_optAddWrap { margin: 0; padding: 0; color: #333; font-family: inherit; font-size: 13px; line-height: 1.6; } #productDetail #MK_innerOptWrap #MK_innerOptScroll, #productDetail #MK_innerOptWrap .MK_inner-opt-cm, #productDetail #MK_innerOptWrap .MK_inner-opt-cm * { box-sizing: border-box; margin: 0; padding: 0; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm { list-style: none; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li { display: grid; grid-template-columns: minmax(0, 1fr) 96px minmax(108px, auto) 28px; align-items: center; gap: 12px; width: 100%; min-height: 50px; margin: 6px 0 0; padding: 8px 18px; border: 1px solid #ededed; border-radius: 8px; background: #fafafa; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_p-name, #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl, #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_price, #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_btn-del { position: static; float: none; width: auto; min-width: 0; margin: 0; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_p-name { grid-column: 1; color: #333; font-size: 13px; font-weight: 500; line-height: 1.7; overflow-wrap: anywhere; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl { grid-column: 2; display: grid; grid-template-columns: 30px minmax(0, 1fr) 30px; align-items: center; height: 32px; width: 96px; border: 1px solid #e1e4e8; box-shadow: 0 1px 2px rgb(0 0 0 / 3%); border-radius: 8px; background: #fff; overflow: hidden; } /* 수량 숫자: 기존 인라인 정렬/여백보다 우선하여 가로·세로 중앙 배치 */ #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl input:not([type="hidden"]) { grid-column: 2; grid-row: 1; align-self: center; justify-self: stretch; box-sizing: border-box !important; position: static !important; float: none !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 30px !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0; background: #fff; color: #222; font-family: inherit; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; box-shadow: none; line-height: 30px !important; text-align: center !important; text-indent: 0 !important; letter-spacing: 0 !important; appearance: textfield; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm .MK_qty-ctrl input::-webkit-inner-spin-button, #productDetail #MK_innerOptWrap .MK_inner-opt-cm .MK_qty-ctrl input::-webkit-outer-spin-button { appearance: none; margin: 0; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a { position: relative; inset: auto; grid-row: 1; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 0; background: #fff; color: #111; font-size: 0; line-height: 1; text-decoration: none; cursor: pointer; transition: background-color 120ms ease, color 120ms ease; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.MK_btn-up { grid-column: 3; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.MK_btn-dw { grid-column: 1; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.MK_btn-up::after { content: ''; position: absolute; width: 10px; height: 1px; top: 50%; left: 50%; transform: translate(-50%, -50%); background: currentColor; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.MK_btn-dw::after { content: ''; position: absolute; width: 10px; height: 1px; top: 50%; left: 50%; transform: translate(-50%, -50%); background: currentColor; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a img { display: none; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.MK_btn-up::before { content: ''; position: absolute; width: 1px; height: 10px; top: 50%; left: 50%; transform: translate(-50%, -50%); background: currentColor; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl:focus-within { border-color: #9199a4; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a:hover { background: #f2f4f6; color: #111; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a:active { background: #e6e9ed; } @media (prefers-reduced-motion: reduce) { #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a { transition: none; } } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_price { grid-column: 3; color: #171717; font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_btn-del { grid-column: 4; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 1px solid #e5e5e5; border-radius: 50%; background: #fff; color: #888; font-size: 0; text-decoration: none; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_btn-del img { display: none; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_btn-del::after { content: '×'; font-size: 18px; line-height: 1; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li a:hover { background: #f1f1f1; color: #222; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li a:focus-visible, #productDetail #MK_innerOptWrap .MK_inner-opt-cm li input:focus-visible { outline: 2px solid #555; outline-offset: -2px; } @media (max-width: 600px) { #productDetail #MK_innerOptWrap .MK_inner-opt-cm li { grid-template-columns: 96px minmax(0, 1fr) 28px; gap: 7px 12px; padding: 8px 14px; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_p-name { grid-column: 1 / 3; grid-row: 1; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl { grid-column: 1; grid-row: 2; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_price { grid-column: 2 / 4; grid-row: 2; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_btn-del { grid-column: 3; grid-row: 1; } } /* === PR COMPACT PURCHASE : 옵션부터 네이버페이까지 세로 간격 === */ #productDetail .thumb-info .info .pr-shopping-guide { margin-top: 10px; padding: 12px 16px; } #productDetail .thumb-info .info .pr-shopping-guide h2 { margin-bottom: 8px; } #productDetail .thumb-info .info .pr-shopping-guide .pr-guide-row { margin: 4px 0; } #productDetail .thumb-info .info .pr-shopping-guide .pr-installment { margin-top: 8px; padding-top: 8px; } #productDetail .thumb-info .info #MK_innerOptTotal.pr-order-total { margin: 10px 0 8px; padding: 10px 4px 0; } #productDetail .thumb-info .info .prd-btns.pr-purchase { gap: 6px; margin-top: 8px; } #productDetail .pr-purchase > .shop_de_btn3 { padding-top: 2px; } /* 배송선택: 사이즈와 동일한 버튼을 항상 펼쳐서 표시 */ #productDetail .pr-option-buttons.pr-delivery-buttons { display: flex !important; flex-wrap: wrap; gap: 7px; width: 100%; margin: 0; padding: 0; } /* 기존 select는 주문 값/이벤트용으로 유지. 포커스 때도 드롭다운을 펼치지 않음. */ #productDetail .thumb-info .info .table-opt .opt-wrap select.pr-delivery-select.pr-option-native:focus, #productDetail .thumb-info .info select.pr-delivery-select.pr-option-native, #productDetail .thumb-info .info select.pr-delivery-select.pr-option-native:focus { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; } /* 사이즈 선택 전 숨겨진 배송 영역을 표시 */ #productDetail .thumb-info .info .pr-delivery-visible { display: block !important; } #productDetail .thumb-info .info tr.pr-delivery-visible { display: table-row !important; } #productDetail .thumb-info .info td.pr-delivery-visible { display: table-cell !important; } #productDetail .thumb-info .info tbody.pr-delivery-visible { display: table-row-group !important; } #productDetail .thumb-info .info table.pr-delivery-visible { display: table !important; } #productDetail .pr-delivery-buttons .pr-delivery-preview:disabled { opacity: 1; border: 1px solid #dedede; background: #fff; color: #888; text-decoration: none; cursor: not-allowed; } /* === 옵션 영역 타이포그래피: Pretendard === */ #productDetail { --pr-option-font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif; } #productDetail .thumb-info .info .opt-wrap, #productDetail .thumb-info .info .opt-wrap *, #productDetail .pr-option-buttons, #productDetail .pr-option-buttons *, #productDetail .thumb-info .info select.pr-delivery-select, #productDetail .thumb-info .info .MK_optAddWrap, #productDetail .thumb-info .info .MK_optAddWrap *, #productDetail #MK_innerOptWrap, #productDetail #MK_innerOptWrap *, #productDetail #MK_innerOptTotal, #productDetail #MK_innerOptTotal * { font-family: var(--pr-option-font) !important; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit { font-size: 12px; font-weight: 400; letter-spacing: -0.15px; line-height: 1.5; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit strong { font-size: 15px; font-weight: 700; letter-spacing: -0.3px; } #productDetail .thumb-info .info .table-opt .opt-wrap .tit .pr-option-required { font-size: 13px; font-weight: 600; } #productDetail .thumb-info .info .table-opt .opt-wrap dt { font-size: 13px; font-weight: 500; letter-spacing: -0.15px; } #productDetail .pr-option-buttons .pr-option-button, #productDetail .thumb-info .info .table-opt .opt-wrap select { font-size: 13px; font-weight: 500; letter-spacing: -0.15px; } #productDetail .pr-option-buttons .pr-option-button[aria-pressed="true"]:not(:disabled) { font-weight: 600; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_p-name { font-size: 13px; font-weight: 500; letter-spacing: -0.15px; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl input:not([type="hidden"]) { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; } #productDetail #MK_innerOptWrap .MK_inner-opt-cm li .MK_price { font-size: 15px; font-weight: 700; letter-spacing: -0.2px; font-variant-numeric: tabular-nums; } /* 상품명·영문명·가격 안내: 옵션 영역과 동일한 글꼴 */ #productDetail .thumb-info .info .tit-prd, #productDetail .thumb-info .info .tit-prd *, #productDetail .thumb-info .info .tit-sub, #productDetail .thumb-info .info .tit-sub *, #productDetail .thumb-info .info .table-opt > table > tbody > tr > th, #productDetail .thumb-info .info .table-opt > table > tbody > tr > th *, #productDetail .thumb-info .info .table-opt td.price, #productDetail .thumb-info .info .table-opt td.price *, #productDetail .thumb-info .info .table-opt td.p-price, #productDetail .thumb-info .info .table-opt td.p-price * { font-family: var(--pr-option-font) !important; } /* 구매 / 카카오 상담: 한 줄에 50%씩, 보조 버튼은 다음 줄에 3등분 */ #productDetail .thumb-info .info .prd-btns.pr-purchase { grid-template-columns: repeat(6, minmax(0, 1fr)); } #productDetail .pr-purchase > .buy { grid-column: 1 / 4; } #productDetail .pr-purchase > .kakaotalk { grid-column: 4 / 7; } #productDetail .pr-purchase > .shop_de_btn1, #productDetail .pr-purchase > .shop_de_btn2 { grid-column: span 2; } #productDetail .pr-purchase > .buy > a, #productDetail .pr-purchase > .kakaotalk > a { height: 56px; min-height: 56px; padding: 10px 8px; gap: 7px; border-radius: 10px; line-height: 1.3; text-align: center; } #productDetail .pr-purchase > .buy > a, #productDetail .pr-purchase > .buy > a *, #productDetail .pr-purchase > .kakaotalk > a, #productDetail .pr-purchase > .kakaotalk > a *, #productDetail .pr-purchase > .shop_de_btn1 > a, #productDetail .pr-purchase > .shop_de_btn2 > a { font-family: var(--pr-option-font) !important; } #productDetail .pr-purchase .pr-buy-title, #productDetail .pr-purchase .pr-kakao-title { font-size: 15px; font-weight: 700; letter-spacing: -0.3px; } #productDetail .pr-purchase > .kakaotalk > a { color: #191919; } #productDetail .pr-purchase .pr-kakao-chat-icon { display: block; width: 22px; height: 22px; flex: 0 0 22px; } @media (max-width: 440px) { #productDetail .pr-purchase .pr-buy-caption { display: none; } #productDetail .pr-purchase .pr-buy-title, #productDetail .pr-purchase .pr-kakao-title { font-size: 13px; } } /* 상품 이미지 하단 탐색 버튼 */ #productDetail .thumb-info .thumb-ctrl.pr-image-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; left: 50%; bottom: 10px; transform: translateX(-50%); width: calc(100% - 32px); max-width: 390px; margin: 0; padding: 0; } #productDetail .thumb-info .pr-image-nav a { display: flex; align-items: center; justify-content: center; gap: 6px; float: none; box-sizing: border-box; min-width: 0; min-height: 38px; margin: 0; padding: 8px 9px; border: 1px solid #e3e5e8; border-radius: 9px; background: #fff; color: #62666c; text-decoration: none; line-height: 1.4; transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease; } #productDetail .thumb-info .pr-image-nav a, #productDetail .thumb-info .pr-image-nav a span { font-family: var(--pr-option-font) !important; font-size: 12px; font-weight: 500; letter-spacing: -0.2px; white-space: nowrap; } #productDetail .thumb-info .pr-image-nav svg { display: block; flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; } #productDetail .thumb-info .pr-image-nav a:hover { border-color: #92979e; background: #eef0f2; color: #111; text-decoration: none; } #productDetail .thumb-info .pr-image-nav a:focus-visible { outline: 2px solid #333; outline-offset: 3px; } @media (prefers-reduced-motion: reduce) { #productDetail .thumb-info .pr-image-nav a { transition: none; } } /* BASIC css end */