/* BASIC css start */ .soldout_area img { width:210%; height:auto; } .pageWrap .MK-product-icons img { height: 14px !important; width: auto !important; } #container { } .instaWrap { display: block !important } .shopdetail .shopdetailInfo .shopdetailButton .shopdetailButtonTop .soldOut { display: block; width: calc(100% - 14px); padding: 0px 7px; margin: 0 auto; box-sizing: border-box; height: 48px; line-height: 48px; font-size: 12px; text-align: center; background: #f1f1f1; color: #474852; } .page_location li a,.page_location li i,.page_location li strong { color:#848484; font-weight:300 } .page_location li img { margin: 0 3px; width: 10px; vertical-align: middle; } .shopdetail .shopdetailInfo .shopdetailButton .shopdetailButtonTop a i { font-size: 16px; vertical-align: text-top; margin-top: 1px; margin-left: 3px; color: #b7a591; } /*.header.subHeader .hd_line01 .cateTxtBox li { width:calc(100% - 160px); margin:0 auto; text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; background-color:#fff } */ .shopdetailButton .npay_button_box { border-top:0 !important; } .shopdetailImage > iframe { width:100% } .page_location { position: relative; height: 22px; line-height: 22px; } .shopdetailInfoTop .snsBtn { position: absolute; right: 8px; top: 8px; height: 26px; z-index: 2; } .shopdetailInfoTop .snsBtn a { border: 1px solid #ccc; border-radius: 4px; text-align:center; width: 26px; height: 26px; display: inline-block; background: rgba(255,255,255,0.6); } .shopdetailInfoTop .snsBtn i { font-size: 18px; color: #555; line-height: 28px; } .shopdetailItem img { width: 100% } body .header.subHeader .hd_line01 .cateTxtBox {margin: 0 65px 0 63px;height: 51px;overflow: hidden;line-height: 51px;} /* 상단고정메뉴 */ .subHeader .hd_line01 .sub_left { float: left; margin: 8px 0 0 15px; } .subHeader .hd_line01 .sub_left a { display: inline-block; float: left;} .subHeader .hd_line01 .sub_left .ico { display:inline-block; width: 25px; height: 25px; background: url('/design/maatila2/maatila/phps/m/common/top_subheader_left.png') no-repeat center; background-size: cover; font-size: 0 } .subHeader .hd_line01 .sub_left .ico.ico01 { background-position: 0 0; margin-right: 3px; } .subHeader .hd_line01 .sub_left .ico.ico02 { background-position: 0 -25px; } .subHeader .hd_line01 .sub_left .goback { margin-right:10px; } .subHeader .hd_line01 .right .menu { margin-left:5px; } body .header.subHeader .hd_line01 .right { } /* 썸네일 롤링 */ .thmbWrap { position:relative; width:100%; overflow: hidden; } .thmbWrap img { width:100% } .thmbWrap .banner-button-prev, .thmbWrap .banner-button-next { position: absolute; top: 50%; z-index: 10; margin-top: -21px; } .thmbWrap .banner-button-next { right: 0 } .thmbWrap .banner-button-prev i, .thmbWrap .banner-button-next i { color: #111111; font-size:42px; opacity: 0.7 } .thmbWrap .thmb-pagination { position:absolute; text-align:center; z-index:10 } .thmbWrap .thmb-pagination .swiper-pagination-bullet { background:#efefee; opacity:1 } .thmbWrap .thmb-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background:#ab9883 } .shopdetail .shopdetailInfo { } .shopdetail h3.shopdtlTit { font-weight:bold; padding:10px 3%; background-color: #f8f8f8; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; margin-top: -1px; } .shopdetail h3.shopdtlTit a { display:block; } .shopdetail h3.shopdtlTit a span.ttlCnt { color: #f8574f; } .shopdetail h3.shopdtlTit .fa { float:right; font-size: 1.5em; color: #ccc; } .shopdetail .shopdetailInfo .shopdetailInfoTop {position: relative;/* margin-top: 1px; */} .shopdetail .shopdetailInfo .shopdetailInfoTop figure { } .shopdetail .shopdetailInfo .shopdetailInfoTop figcaption { text-align:left; margin-top:16px; } .shopdetail .shopdetailInfo .shopdetailInfoTop .enlarge img { width: 100% } .shopdetail .shopdetailInfo .shopdetailInfoBottom { background-color:#fff; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap { padding: 15px; position:relative } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .sdInfoIcon img { vertical-align: middle; margin-bottom: 5px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap h2 { line-height: 22px; font-size:16px; margin: 0 0 14px; color: #2f2f2f; font-weight: 700; width:90%; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap figcaption { font-size: 11px; color:#b9b9b9; margin-bottom: 3px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .sPrice { padding-bottom:5px; font-size:18px; color: #111; font-weight:bold; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .sPrice .strike { font-size:11px; color:#999; font-weight:normal; text-decoration:line-through } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .btnShare { position:absolute; top:10px; right:15px; width:32px; height:32px; text-indent:-9999em; background:url(/design/maatila2/maatila/phps/m/common/ico_detail_share.png) 0 0 no-repeat; background-size:32px auto; z-index:10 } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .shareLayer { position:absolute; top:50px; right:15px; background:#fff; -webkit-box-shadow: 2px 1px 10px 0px rgba(0,0,0,0.2); -moz-box-shadow: 2px 1px 10px 0px rgba(0,0,0,0.2); box-shadow: 2px 1px 10px 0px rgba(0,0,0,0.2); visibility:hidden; opacity:0; transform:translateY(-10px); transition:all 0.3s ease; -webkit-transition:all 0.3s ease } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .shareLayer.open { visibility:visible; opacity:1; transform:translateY(0) } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .shareLayer .shareList { padding:8px 12px } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .shareLayer .shareList a { display:inline-block; margin:0 3px; width:32px; height:32px; text-indent:-9999em; background:url(/design/maatila2/maatila/phps/m/common/sp_detail_share.png) 0 0 no-repeat; background-size:32px auto } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .shareLayer .shareList a.btn_fb { background-position:0 0 } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .shareLayer .shareList a.btn_ka { background-position:0 -35px } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .shareLayer .shareList a.btn_ks { background-position:0 -70px } .shopdetail .shopdetailInfo .shopdetailInfoBottom .sdInfoWrap .shareLayer .shareList a.btn_urlCopy { background-position:0 -105px } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue { position: relative; padding: 0px 15px; margin: 0 0 10px 0; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue em { color:#f1191f; font-size:1.333em; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue p { padding: 4px 0 } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue p:last-child { margin-bottom:0px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .shopdetailInfoName { width:35%; display:inline-block; vertical-align: top; color: #66676f; font-weight: 300; text-indent: 3px } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .shopdetailInfoCont { width:65%; display:inline-block; margin-left: -4px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .shopdetailInfoCont.sellWrap { font-weight: 700 } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .shopdetailInfoCont.sellWrap del { } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .region { margin-left: 10px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .btn_relation { position:absolute; top:50%; right:10px; text-align:center; margin-top: -25px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .btn_relation a { width:50px; height:50px; color:#fff; background-color:#636363; display: inline-block; font-size:0.917em; border-radius: 4px; border:1px solid #424242; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .btn_relation a:first-child { } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .btn_relation a .fa { display:block; margin:6px 0 3px 0; } .shopdetailInfoDelivery { padding:10px 15px; } /* 상품옵션 */ .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area { } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area.fixed { width: 100%; position: fixed; z-index: 999; bottom: -1px; left: 0; right: 0; background: #fff; padding-top: 40px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area.fixed { -webkit-animation: qbuy 150ms linear 1 normal; animation: qbuy 150ms linear 1 normal; } @-webkit-keyframes qbuy { from { bottom:-65px; } to { bottom:0; } } @keyframes qbuy { from { bottom:-65px; } to { bottom:0; } } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option_tk { display: none; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area.fixed .option_tk {height: 70vh;overflow-y:auto;background-color: #fff;display:block;} .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn { width:100%; box-sizing: border-box; position:relative; bottom: -1px; left:0; right:0; z-index: 101; text-align: center; margin:0 auto; display:none; background: #2f2f2f; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn.fixed { display: block; position: fixed; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area.fixed .fixed-btn.fixed { display: block; position: relative; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .btn_option { display:none; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area.fixed .btn_option { display:block; position: absolute; top: 17px; right: 17px; width:16px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb { font-size: 0 } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb>a {display: inline-block;width: 43%;font-weight:400;height: 60px;line-height: 58px;font-size: 15px;color:#fff;} .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb a.hisBack, .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb a.wish, .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb a.cart { color: #666; background: #f1f1f1 } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb a.cart i { color:#333; font-size: 20px; vertical-align: middle; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb a i { color: #de0606; font-size: 20px; vertical-align: middle; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn { display: inline-block; width: 57%; vertical-align: top; position: relative; padding-left: 30px; box-sizing:border-box; text-align: left; line-height: 60px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn:after { content:''; background:rgba(255,255,255,.3); width:1px; height:20px; position:absolute; top:50%; transform:translateY(-50%); right:0; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn .url{display:inline-block;width: 18px;height: 22px;vertical-align: middle;margin-right: 19px;background-repeat: no-repeat!important;background-position: center!important;background-size: 100% auto!important;} .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn a{} .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn a span{display:inline-block;width: 18px;height: 22px;vertical-align: middle;margin-right: 19px;background-repeat: no-repeat!important;background-position: center!important;background-size: 100% auto!important;} .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn a.left_btn_01.wish_yes { background: url(/design/maatila2/maatila/2016img/mo_detail_wish_no.png); } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn a.left_btn_01 span { background: url(/design/maatila2/maatila/2016img/mo_detail_wish_no.png); } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn a.left_btn_01 span.wish-on { background: url(/design/maatila2/maatila/2016img/mo_detail_wish_yes.png); } .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn a.left_btn_02 {background: url(/design/maatila2/maatila/2016img/mo_detail_gift.png);display: inline-block;width: 18px;height: 22px;vertical-align: middle;margin-right: 19px;background-repeat: no-repeat !important;background-position: center !important;background-size: 100% auto !important;} .shopdetail .shopdetailInfo .shopdetailInfoBottom .fixed-btn .fxb .left_btn a.left_btn_03 { background: url(/design/maatila2/maatila/2016img/mo_detail_url.png); margin-top: -1px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoMultiSelect { background-color: #fff; margin: 0px 7px; margin-top: 22px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .buy_on { background-color: #2f2f2f; text-align: center; font-size: 0; display:none; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .buy_on a {font-weight: 400;height: 60px;line-height: 58px;font-size: 15px;color: #fff;display: inline-block;width: calc(100% / 3);position: relative;} .shopdetail .shopdetailInfo .shopdetailInfoBottom .buy_on a:after { content:''; background:rgba(255,255,255,.3); width:1px; height:20px; position:absolute; top:50%; transform:translateY(-50%); right:0; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .buy_on a:last-of-type:after { display:none; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .buy_on a.buy { /* background-color: #474852; */color:#fff; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .opt-com { text-align: right; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect { margin: 0px 7px; box-sizing: border-box; padding-top: 25px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect p {padding: 3px 10px;font-size:0} .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect p:last-child { margin-bottom:0px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect p .txt { width: 69%; display: inline-block; margin-left: 2%; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect p .txt input.basic_option { padding:0 10px; border-color: #e2e2e2; line-height: 20px; height: 22px; width: 100%; font-size: 12px; color: #acacac; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .shopdetailInfoName {width: 29%;display: inline-block;vertical-align: middle;font-size: 13px;color: #000;text-indent: 3px;} .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .shopdetailInfoCont { width: 69%; display:inline-block; margin-left: 2%; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .MS_amount_basic { padding-right: 5px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .shopdetailInfoCont select { width:100%; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .shopdetailInfoCount .txt-qnty { text-align:right; padding:0 6px; width: 50px !important; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .shopdetailInfoCount .fa-plus { background-color: #bbb; width: 32px; height: 32px; text-align: center; vertical-align: middle; line-height: 32px; color: #fff; margin: 0 2px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .shopdetailInfoCount .fa-minus { background-color: #bbb; width: 32px; height: 32px; text-align: center; vertical-align: middle; line-height: 32px; color: #fff; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoMultiSelect .MK_optAddWrap #MK_innerOptScroll { } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .add-option-sel { font-weight: 600; font-size: 12px; border-top: 1px solid #ececec; font-size: 15px; color: #2f2f2f; font-weight: 600; padding: 0 10px; padding-top: 22px; padding-bottom: 0; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .add-option select { margin-bottom: 10px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .add-option .shopdetailInfoName { vertical-align: top; padding-top: 11px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .shopdetailInfoCont.listCoupon { position:relative; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .shopdetailInfoCont .btn-coupon { display:inline-block; height:16px; padding:0; margin-left:5px; border:1px solid #000; font-size:10px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .shopdetailInfoCont .btn-coupon span { display:inline-block; height:16px; padding:0 5px; color:#fff; background:#000; vertical-align:top; font-size:11px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoValue .shopdetailInfoCont .btn-coupon em { display:inline-block; height:16px; padding:0 3px 0 0; font-size:10px; vertical-align:top; color:#000; } .shopdetail .shopdetailBoard { text-align:center; margin-bottom: 20px; display: table; width: 100%; } .shopdetail .shopdetailBoard a { width:25%; background-color:#f8f8f8; border-top: 1px solid #bbb; border-left: 1px solid #bbb; border-bottom: 1px solid #bbb; display:inline-block; margin-left: -1px; font-weight:bold; padding: 13px 0; } .shopdetail .shopdetailBoard a.actOn { background-color:#fff; border-top: 1px solid #111; border-bottom:0; } .MK_optAddWrap .MK_inner-opt-cm li { position:relative; padding: 20px 18px; background: #f7f7f7; margin: 0 10px; margin-bottom: 12px; } .MK_optAddWrap .MK_inner-opt-cm li:last-child { /* border-bottom: 0; */ /* margin-bottom: 0; */} .MK_optAddWrap .MK_inner-opt-cm .MK_p-name { padding-right: 30px; display: block; font-size: 13px; color: #2f2f2f; font-weight: 400; } .MK_optAddWrap .MK_inner-opt-cm .MK_qty-ctrl { margin-top: 20px; } .MK_optAddWrap .MK_inner-opt-cm .MK_qty-ctrl input[type="tel"] { padding:0 6px; width: 50px; } .MK_optAddWrap .MK_inner-opt-cm .MK_btn-del {position:absolute;top: 12px;right: 12px;width: 12px;height: 12px;background: url(/design/maatila2/maatila/ico_opt_close.png);background-size: 100% auto;} .MK_optAddWrap .MK_inner-opt-cm .MK_btn-del img { width: 20px; display:none; } .MK_optAddWrap .MK_inner-opt-cm .MK_price { /* position:absolute; *//* bottom:21px; *//* right:0; */font-size: 13px; text-align: right; width: 100%; display: block; font-weight: 400; color: #2f2f2f; margin-top: 15px; } .MK_optAddWrap .MK_inner-opt-cm .MK_price span { font-size:20px; font-weight:700; } .MK_optAddWrap .total {font-size: 13px;font-weight: 400;color: #000;} .MK_optAddWrap .MK_total {font-size: 20px;font-weight: 700;color: #000;} .MK_optAddWrap .MK_txt-won { font-size: 13px; font-weight: 400; } .MK_optAddWrap_div { height:10px; padding:0; background:#f6f6f6; border-top:1px solid #c7c7c7; border-bottom:1px solid #c7c7c7; } .MK_optAddWrap_line { height:1px; padding:0; background:#f6f6f6; border-bottom:1px solid #c7c7c7; } #MK_innerOptTotal { padding: 20px 10px; text-align:left; overflow: hidden; margin-top: 22px; } #MK_innerOptTotal::after { content:''; display:block; clear: both; } #MK_innerOptTotal .MK_txt-total { float: left; width: 35% } #MK_innerOptTotal .ttWrap {float: left;float: right;color: #000;} div#MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl { position: relative; height: 22px; box-sizing: border-box; width: 80px; /* right: 160px!important; */ /* top: 50%; */ /* transform: translateY(-50%); */ /* -webkit-transform: translateY(-50%); */ -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%); border: none; border-radius: 3px; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl .basic_option, #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl .MS_amount_basic, #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl .addition_option { width: 38px; height:24px; line-height:24px; border: 1px solid #dfdfdf; text-align:center !important; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl input { float: none!important; height: 22px!important; line-height: 22px!important; font-size: 13.5px; font-weight: 600; color: #2f2f2f; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); background: none; border: none!important; /* border-right: 1px solid #e7e7e7!important; */ /* border-left: 1px solid #e7e7e7!important; */ box-sizing: border-box; background: none; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a { float: left; display: inline-block; width: 14px; height: 14px; line-height: 16px; background-size: 8px!important; background-position: center!important; text-indent: -9999em; margin: 0; vertical-align: middle; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%); box-sizing: border-box; -webkit-box-sizing: border-box; border: 1px solid #323232; border-radius: 50%; font-size:0; background:#fff; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02 { /* background: #fff url(/design/maatila2/maatila/2016img/plus_icon.png) 0 0 no-repeat; */ right: 0; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02:last-of-type { /* background: #fff url(/design/maatila2/maatila/2016img/minus_icon.png) 0 0 no-repeat; */ left: 0; } /* #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02:after { content: '+'; font-size: 14px; position: absolute; top: 46%; left: 50%; transform: translate(-50%, -50%); color: #2f2f2f; z-index: 10; font-weight: 500; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02:last-of-type:after {content:'ㅡ';font-size: 10px;font-weight: 600;line-height: 18px;height: auto;top: 0;transform: translate(-50%, 0);} body.ios #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02:last-of-type:after { line-height:14px; } */ #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02:after { content: '+'; font-size: 13px; position: absolute; top: 44%; left: 50%; transform: translate(-50%, -50%); color: #2f2f2f; /* width: 100%; */ /* height: 100%; */ z-index: 10; font-weight: 500; } #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02:last-of-type:after {content:'ㅡ';font-size: 9px;font-weight: 600;line-height: 12px;height: auto;top: 0;transform: translate(-50%, 0);} body.ios #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02:first-of-type:after { top:43%; } body.ios #MK_innerOptWrap .MK_inner-opt-cm li .MK_qty-ctrl a.btn-type-02:last-of-type:after { line-height:11px; } /* //착불 아이콘 */ .shopdetail .shopdetailInfo .gray-delivery { padding: 2px; background-color: #fff; color: #656565; font-size: 0.875em; border-radius: 3px; border: 1px solid #656565; } /* //상품옵션 */ .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailTotal { background-color:#fff; text-align:right; padding: 10px; font-size:1.2em; border-top: 1px solid #eee; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailTotal em { color:#f1191f; font-size:1.333em; margin-left:16px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailButton { text-align:center; /* padding: 15px 3%; */ } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailButton .shopdetailButtonTop a { display: inline-block; margin: 2.5px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailButton .shopdetailButtonTop a.wish { background-color:#FFF; border: 1px solid #cfcfcf; color: #666; width: 25%; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailButton .shopdetailButtonTop a.cart { color: #666; background-color: #fff; border: 1px solid #cfcfcf; width: 25%; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailButton .shopdetailButtonTop a.buy { color:#fff; width: calc(100% - 15px); text-align: center; padding: 0; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailButton .naver-checkout { /* margin-top: 20px; */ } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailButton .shopdetailButtonBottom { margin:20px 0; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailButton .shopdetailButtonBottom img { margin:0 2px; width:45px; height:auto; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .appBanner { margin-top: 20px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .appBanner img { width: 100%; max-width: 100%; } .shopdetail .shopdetailCoupon { margin-top:15px; } .shopdetail .shopdetailCoupon .shopdetailCouponGet { padding:0 15px; } .shopdetail .shopdetailCoupon .shopdetailCouponGet .image_src { max-width: 100%; padding-bottom: 5px; } .shopdetail .shopdetailCoupon .shopdetailCouponGet li dl { height:34px; background:url("/images/d3/m_04/bg_coupon@2x.gif") no-repeat left center; padding:10px 0 10px 92px; border-bottom:1px dashed #cbcbcb; position:relative; background-size: 81px auto; } .shopdetail .shopdetailCoupon .shopdetailCouponGet li:last-child { border-bottom:0px none; } .shopdetail .shopdetailCoupon .shopdetailCouponGet .MS_coupon dt { width:82px; position:absolute; top:10px; left:0; color:#fff; text-align:center; } .shopdetail .shopdetailCoupon .shopdetailCouponGet .MS_coupon dt strong { font-weight: normal; } .shopdetail .shopdetailCoupon .shopdetailCouponGet .MS_coupon h4 { font-weight:bold; } .shopdetail .shopdetailItem .shopdetailImage { padding: 3% 0; } .shopdetail .shopdetailItem .shopdetailImage .shopdetailWrap { margin: 20px 0; } .shopdetail .shopdetailItem .shopdetailImage img { max-width:100% !important; height: auto !important; } .shopdetail .shopdetailItem .shopdetailImage table { width:100% !important; } .shopdetail .shopdetailItem .shopdetailImage object { width:100% !important; } .shopdetail .shopdetailItem .shopdetailImage iframe { width:100% !important; } .shopdetail .shopdetailItem .shopdetailImage table { table-layout: auto !important; } .shopdetail .shopdetailItem .shopdetailImage div { width:100% !important; } .shopdetail .shopdetailRelationItem { padding:0 15px 30px 15px; } .shopdetail .shopdetailRelationItem .listName input { float:right; } .shopdetail .shopdetailRelationItem .btn_cart { width:290px; text-align:center; font-weight:bold; color:#fff; background-color:#393939; display:block; padding:10px 0; margin:0 auto; } .shopdetailItem .shopdetailNotify { } .shopdetailItem .shopdetailNotify .shopdetailNotifyInfo { padding: 15px; display: none } .shopdetailItem .shopdetailNotify .shopdtlTit { margin-top: 30px; color: #000; background: #f5f5f5; font-weight: bold; font-size: 12px; padding: 10px 15px; } .shopdetailItem .shopdetailNotify .shopdtlTit span { margin-left: 3px } .shopdetailItem .shopdetailNotify table { border-collapse:collapse; width: 100%; } .shopdetailItem .shopdetailNotify table th { padding:10px; width:80px; border: 1px solid #ddd; border-right:0; background-color: #efefef; color:#666; text-align:left; font-weight: normal; } .shopdetailItem .shopdetailNotify table td { padding:10px; border:1px solid #e8e8e8; border-left:0; background-color:#fff; } .shopdetailItemPopup { display:none } .shopdetailItemPopup a { width: 150px; height: 40px; line-height: 40px; color:#fff; background-color:#b4b3b9; display:block; text-align: center; margin: 30px auto 0; } .shopdetailItemPopup p { text-align: center; color: #b9b9b9 } .shopdetailItemPopup img { width: 30px; margin-right: 5px; vertical-align: bottom; } /* 관련상품 */ .shopdetailRelation { border-top: 1px solid #efefef; padding-top: 15px; } .shopdetailRelation h2 { margin: 0 10px 15px; text-align: left; font-size: 13px; font-weight: bold; } /* //관련상품 */ /* IOS 디바이스 옵션 선택 시 자동 확대 방지 */ input[type="text"], input[type="date"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"], select { font-size:16px; } select {border-color: #dbdbdb;line-height: 33px;height: 35px;width: 100%;font-size: 13px;color: #000;box-sizing: border-box;border-radius:5px!important;} /* //IOS 디바이스 옵션 선택 시 자동 확대 방지 */ /* OKDGG 버튼 */ .shopdetail .okdgg-checkout { margin-top: 15px; } .shopdetail .okdgg-checkout img { max-width: 90%; height: auto; } /* //OKDGG 버튼 */ /* 퀵바이 버튼 노출 시 커뮤니티 탭 위치 변경 */ .cs-button { bottom: 53px !important; } /* //퀵바이 버튼 노출 시 커뮤니티 탭 위치 변경 */ /* 임시품절 재입고 SMS 받기 */ .shopdetail .soldout_anchor { display:block !important; } .shopdetail .MK_btn-sms { display: inline-block; width: 100%; height: 35px; line-height: 35px; text-align: center; border: 1px solid #808080; color: #fff; font-weight: bold; background-color: #636363; background-image: -webkit-gradient(linear, left top, left bottom, from(#636363), to(#5e5e5e)); background-image: -webkit-linear-gradient(top, #636363, #5e5e5e); background-image: -moz-linear-gradient(top, #636363, #5e5e5e); background-image: -o-linear-gradient(top, #636363, #5e5e5e); background-image: linear-gradient(to bottom, #636363, #5e5e5e); -webkit-border-radius: 3px !important; border-radius: 3px !important; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .shopdetail .MK_btn-sms span { padding-left: 24px; background: url(/images/d3/m_01/bull/alarm_fff@2x.png) no-repeat 0 50%; background-size: 18px 14px; } .btn_soldout_m { width: 100%; overflow: hidden; height: 52px; } .btn_soldout_m a .soldout_anchor { width:100%; } .btn_soldout_m .is_soldout { width:230%; } .btn_soldout_m .is_soldout img { width:100% } /* 임시품절 재입고 SMS 받기 끝 */ #nhn_btn { padding-top:10px; } .btn_nTalk { margin-top:10px; color:#fff; background-color: #00c73c; width: 288px; text-align: center; height: 46px; line-height: 46px; display: inline-block; font-size: 13px; } .btn_nTalk i { font-size: 18px; vertical-align: text-top; } #payco_order_btn { padding-top:10px; } #kakaopay_order_btn { padding-top:10px; } blockquote { margin: 0 !important; } /* 버튼 */ .shopdetail .shopdetailInfo .shopdetailButton { width: calc(100% - 30px); margin: 0 auto; overflow: hidden; } .shopdetail .shopdetailInfo .shopdetailButton .shopdetailButtonTop { font-size: 0; text-align: center; margin: 0px -7px; display:none; } .shopdetail .shopdetailInfo .shopdetailButton .shopdetailButtonTop a { display: inline-block; width: calc(50% - 10px); margin: 2.5px; height: 30px; line-height: 30px; font-size: 12px; text-align: center; background: #f1f1f1; color: #474852; } .shopdetail .shopdetailInfo .shopdetailButton .shopdetailButtonTop a.buy { width: calc(100% - 15px); background: #958472; color: #fff; font-size:14px; height: 40px; line-height: 40px; } .shopdetail .shopdetailInfo .shopdetailButton .naver-checkout { margin-bottom:30px; } /* 하이브리드 */ .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap { padding:5px 15px 10px; background:#f6f6f6; border-bottom:1px solid #c7c7c7; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box:not(:last-child) { width:100%; border-bottom:1px solid #cecece; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box.last { border-bottom:none; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .tit { width:100%; padding:10px 0; color:#3b3b3b; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list:after { clear: both; content: ""; display: block; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list { width:100%; font-size:0.875em; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li { float:left; width:20%; list-style:none; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li.last { } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl { width:54px; padding-bottom:10px; text-align:center; color:#333; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdchk { text-align:left; padding-bottom:5px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdchk input { width:12px; height:12px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdimg { position:relative; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdimg img { width:54px; height:54px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdimg.noimg { width:52px; height:52px; border:1px solid #d8d8d8; background:#fff url(/makeshop/newmanager/neoimages/h52_noimg.gif) no-repeat center center; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdimg .soldout { position:absolute; top:0; left:0; display:inline-block; width:54px; height:54px; line-height:56px; color:#fff; text-align:center; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdimg .soldout-bg { position:absolute; top:50%; left:0; display:inline-block; width:54px; height:20px; margin-top:-10px; background:#000; filter:alpha(opacity:40); opacity:0.4; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdimg .sel-img { position:absolute; top:0; left:0; display:inline-block; width:54px; height:54px; background:#000; filter:alpha(opacity:40); opacity:0.4; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdname { padding-top:5px; line-height:14px; word-wrap:break-word; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdnote { padding-bottom:3px; line-height:14px; word-wrap:break-word; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdprice { padding-bottom:3px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdqty { } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdqty input { display:inline-block; width:20px; height:15px; line-height:17px; padding:0 5px; border:1px solid #707070; font-size:11px; text-align:right; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdqty .btn-up-down { display:inline-block; width:11px; height:14px; line-height:0; font-size:0; vertical-align:top; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdqty .btn-up-down a { display:inline-block; width:11px; height:9px; line-height:0; font-size:0; vertical-align:top; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .option-box .list li dl dd.prdqty .btn-up-down .btn-up { margin-bottom:1px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .add-option-sel { font-weight: bold; font-size: 1.1em; padding: 10px 0; border-top:1px solid #cecece; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .shopdetailInfoName { width: 28%; padding-right: 5px; display:inline-block; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .shopdetailInfoCont { width:70%; display:inline-block; margin-left: -4px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .shopdetailInfoCont select { width:100%; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .shopdetailInfoCount .txt-qnty { text-align:right; padding:0 6px; width: 50px !important; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .shopdetailInfoCount .fa-plus { background-color: #bbb; width: 35px; height: 35px; text-align: center; vertical-align: middle; line-height: 35px; color: #fff; margin: 0 5px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .option-wrap .shopdetailInfoCount .fa-minus { background-color: #bbb; width: 35px; height: 35px; text-align: center; vertical-align: middle; line-height: 35px; color: #fff; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .MK_optAddWrap #MK_innerOptPrice, .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .MK_optAddWrap #MK_innerOptAdd { padding-bottom:5px; margin-right: 10px; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .option_area .MK_optAddWrap #MK_optAddWrapList { background-color:#f6f6f6; } /* 추가 구성 상품 */ .shopdetail .shopdetailInfo .shopdetailInfoTit { height:40px; line-height:42px; padding:0 12px; border-top:1px solid #c7c7c7; border-bottom:1px solid #c7c7c7; font-size:14px; color:#000; } .shopdetail .shopdetailInfo .shopdetailInfoWrap:after { clear: both; content: ""; display: block; } .shopdetail .shopdetailInfo .shopdetailInfoWrap { width:100%; border-bottom:1px solid #c7c7c7; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoTop { float:left; width:45%; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoTop figure { padding:15px 12px; border:0; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoValue { float:right; width:52%; padding:15px 0; margin-right:3%; border:0; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoValue .shopdetailInfoprdName { font-size:1.333em; font-weight:bold; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoValue .shopdetailInfoCont { width:auto; margin:0; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoValue .shopdetailInfoName { width:auto; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoSelect p { padding:0; background:none; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoSelect .shopdetailInfoCont .basic_option { width:100%; } .shopdetail .shopdetailInfo .shopdetailInfoWrap .shopdetailInfoSelect .shopdetailInfoName { display:none; width:100%; padding:0 0 5px 0; } /* 원클릭옵션 */ .shopdetailInfoOneclick { clear:both; padding: 0; overflow:hidden; zoom:1; margin-bottom: 25px; position: relative; padding: 0 10px; } .shopdetailInfoOneclick > span { float:left; } .shopdetailInfoOneclick .shopdetailInfoList { width: 100%; } .shopdetail .shopdetailInfo .shopdetailInfoBottom .shopdetailInfoSelect .shopdetailInfoOneclick .shopdetailInfoName { display:block; width: 100%; float: none; } .MK-oneclick-list { overflow:hidden; zoom:1; width: 100%; margin-top: 12px; } .MK-oneclick-list:after { content: ""; display: block; clear: both; } .MK-oneclick-list li {float:left;/* margin: 0 5px 5px 0; */border-radius: 50%;box-sizing: border-box;margin-right: 4px;} .MK-oneclick-list li a { border: 1px solid #d8d8d8; display: block; /* border-radius: 1px; */box-sizing:border-box; /* border-radius: 50%; */ } .MK-oneclick-list li.MK-oneclick-color a, .MK-oneclick-list li.MK-oneclick-image a {border: 1px solid #eee;display: inline-block;border-radius: 1px;box-sizing:border-box;border-radius: 50%;overflow: hidden;box-sizing: border-box; outline:none; } a:link {text-decoration:none} a:visited {text-decoration:none} a:hover {text-decoration:none} .MK-oneclick-list li.MK-oneclick-sel a {border: 2px solid #000000;padding: 0px;} .MK-oneclick-list li.MK-oneclick-dis a {filter:alpha(opacity=50);-moz-opacity:.5;/* opacity:.5; */} .MK-oneclick-list li.MK-oneclick-color.MK-oneclick-sel a { /* padding:1px; */filter:alpha(opacity=100); -moz-opacity:1; opacity:1; } .MK-oneclick-list li a span { display: block; vertical-align: middle; line-height: 19px; } .MK-oneclick-list li a img { width: 100%; height:100%; } .MK-oneclick-list li.MK-oneclick-image a {width: 33px;height: 33px;} .MK-oneclick-list li.MK-oneclick-image a img {width: auto;height: 31px;border-radius: 50%;border: 1px solid #ececec;box-sizing: border-box;} .MK-oneclick-list li.MK-oneclick-image.MK-oneclick-sel a img {height: 29px;width: 29px;} .MK-oneclick-list li.MK-oneclick-color { width: 40px; height: 40px; } .MK-oneclick-list li.MK-oneclick-color a { height: 42px; width: 42px; } .MK-oneclick-list li.MK-oneclick-color span { width: 40px; height: 40px; } .MK-oneclick-list li.MK-oneclick-color .mk-oo-sel span { width: 27px; height: 27px; } .MK-oneclick-list li.MK-oneclick-text .MK-oneclick-list li.MK-oneclick-text { min-width:35px; max-width:100%; height: 50px; } .MK-oneclick-list li.MK-oneclick-text a {height: 100%;width: 100%;border-radius: 5px;color: #000;} .MK-oneclick-list li.MK-oneclick-text.MK-oneclick-sel a { background: #191919; } .MK-oneclick-list l i.MK-oneclick-text span { min-width: 29px; line-height: 44px; max-width: 320px; overflow: hidden; height: 44px; } .MK-oneclick-list li.MK-oneclick-text .MS-oneclick-sel span { min-width: 30px; line-height: 27px; } .MK-oneclick-value { padding: 5px 0; display: none; } .color_dl .MK-oneclick-value {display: inline-block;font-size: 13px;color: #888;font-weight: 400;vertical-align: top;padding: 0;position: absolute;top: 0;left: 45px;} .color_dl .MK-oneclick-value.color_sel{color: #2f2f2f;font-weight: 700;} .MK-oneclick-only-text li.MK-oneclick-text { height: 39px; text-align: center; } .MK-oneclick-only-text li.MK-oneclick-text span {height: auto;line-height: 37px;/* max-width: 320px; */overflow: hidden;height: 100%;font-size: 12px;color: #000;font-weight: 600;letter-spacing: -0.5px;} .MK-oneclick-only-text li.MK-oneclick-text.MK-oneclick-sel span { color:#fff; } .MK-oneclick-list li.MK-oneclick-text.MK-oneclick-sel a { border:1px solid #191919; } .size_dl .MK-oneclick-only-text li.MK-oneclick-text {width: calc((100% - 16px) / 4);margin-right: 4px;color: #000;} .set_dl .MK-oneclick-only-text li.MK-oneclick-text { width: 100%; margin-bottom: 5px; text-align:left } .set_dl .MK-oneclick-only-text li.MK-oneclick-text a span { padding:0 15px; } .MK-oneclick-only-text li.MK-oneclick-text span em { float: right; color: #888; font-size: 13px; } /* 상단고정바 */ .header { display: none; } .header.subHeader { display: block; } /* 페이지네비 */ .pageWrap { display: inline-block; width: calc(100% - 30px); margin: 0 15px; border-bottom: 1px solid #e6e6e6; } .pageWrap .page_location { margin-bottom: 4px; margin-left: 0; } .pageWrap .MK-product-icons { text-align: right; display: block; /* position: absolute; right: 15px; */} /* 멤버쉽혜택 */ .memberTable { width: 100%; border-bottom: 1px solid #ccc; } .memberTable .tit { padding: 10px 0; background: #f1f1f1; font-size: 13px; color: #474852; font-weight: 600; text-align: center; } .memberTable .contents .tb-center { padding:0 5px } .memberTable .contents td { position: relative; text-align: center; padding: 0; } .memberTable .contents td::after { content:''; display: block; position: absolute; right:0; top: 54%; transform: translateY(-50%); width: 1px; height: 75px; background: #ccc; } .memberTable .contents td:nth-last-child(1)::after { display: none } .memberTable .contents span { display: block; } .memberTable .contents .subTit { display: inline-block; margin: 22px 0 8px 0; padding: 0px 0.4rem 1px; background: #ccc; border-radius: 30px; font-size: 0.6rem; color: #fff; } .memberTable .contents .subDetail { font-size: 11.5px; color: #000; letter-spacing: -.8px } .memberTable .contents .subNum { margin: 0.5rem 0 1.2rem 0; font-size: 1rem; font-weight: 900; color: #000; } .memberWrap { position: relative; border-bottom: 1px solid #eee; margin:30px 0 0; } .memberWrap .tit { background: #f1f1f1 } .memberWrap a { position: absolute; top:18%; display: block; font-size: 0 } .memberWrap a.mypage { width: 100%; height: 39% } .memberWrap a.mypage2 { width: 34.5%; height: 43%; bottom: 0; top: inherit; } .memberWrap a.event { left: 33%; top: inherit; bottom: 0; width: 33%; height: 43%; } /* 장바구니팝업 */ #basketpage .layer-confirm { background-color: #fff !important; border: 1px solid #ccc; } #basketpage .layer-confirm h4 { color: #fff !important; border-bottom: 0 !important; } #basketpage .layer-confirm .btns-2 a { font-weight: 400 !important; border-radius: 0 !important; color: #fff !important; padding: 7px 20px !important } #basketpage .layer-confirm .btns-2 a.btn-cart { background: #958472 !important } #basketpage .layer-confirm .btns-2 a.btn-conti { background: #fff !important; border: 1px solid #ddd; color: #333 !important } #basketpage .layer-confirm a.close { top: 10px !important; right: 0 !important; background: url(/design/maatila2/maatila/phps/common/mn_close.png) no-repeat center !important; background-size: contain !important; width: 18px !important; height: auto !important; } #basketpage .layer-confirm .txt { padding: 5px 15px 20px 15px !important; color: #000 !important; font-weight: 400 !important; font-size: 13px !important } /* 텝 - detailTabArea */ .detailTabWrap { font-family:Noto Sans; padding:38px 0 10px; } .detailTabArea { position:relative; font-size:0; text-align:center; border-bottom: 1px solid #e4e4e4; } .detailTabArea .link {position:relative;width:25%;font-size: 13px;font-weight: 600;line-height:38px;color: #888;white-space:nowrap;display:inline-block;margin: 0 3%;} .detailTabArea .link .txt { position:relative; display:inline-block; color: #888; } .detailTabArea .link.on .txt { color: #2f2f2f; } .detailTabArea .link.on { color: #2f2f2f; font-weight: 600; } .shopDetailTabFix { padding-top:29px; } .shopDetailTabFix .detailTabArea.fix { position:fixed; top:0; left:0; right:0; z-index:100; background-color:#fff; } .shopDetailTabFix .detailTabArea.fixLow { position:fixed; top:50px; left:0; right:0; z-index:100; background:rgba(255,255,255,0.8); } .detailTabWrap.fixed { position: fixed; top: 50px; z-index: 10; background: #fff; width: 100%; padding: 0; } /* 스마트 쿠폰 목록 */ .shopdetail .shopdetailCoupon .smart-coupon-list li { position:relative; margin:14px; border:1px solid #cecece; border-radius:10px; letter-spacing:-1px; overflow:hidden; } .shopdetail .shopdetailCoupon .smart-coupon-list li .c-info { width:82%; padding:20px; border-right: 1px dashed #cecece; box-sizing: border-box; } .shopdetail .shopdetailCoupon .smart-coupon-list li .c-image img { width:100%; height:128px; } .shopdetail .shopdetailCoupon .smart-coupon-list li p { padding-bottom:10px; line-height:18px; font-size:13px; color:#999; word-break:break-all; font-family:"Malgun Gothic"; } .shopdetail .shopdetailCoupon .smart-coupon-list li p:last-child { padding-bottom:0; } .shopdetail .shopdetailCoupon .smart-coupon-list li p.c-name { font-size:14px; color:#000; font-weight:bold; word-break: break-all; } .shopdetail .shopdetailCoupon .smart-coupon-list li p.c-price { font-size:22px; color:#ff3a34; font-weight:bold; } .shopdetail .shopdetailCoupon .smart-coupon-list li .btn-down { position:absolute; top:0; right:0; width:18%; height:100%; background:#f8f8f8; text-align:center; box-sizing: border-box; } .shopdetail .shopdetailCoupon .smart-coupon-list li .btn-down span { position:absolute; right:0; top:50%; width:100%; margin-top:-22px; height:44px; font-size:12px; display:flex; word-break:break-all; flex-wrap:wrap; align-items:center; justify-content:center; } .shopdetail .shopdetailCoupon .smart-coupon-list li .btn-down span { color:#999; } .shopdetail .shopdetailCoupon .smart-coupon-list li .btn-down span a { 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; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style1.sc-reserve p.c-price { color:#3b6ce9; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style2 { border:1px solid #fff; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style2 .c-info { background:#171940; border-color:#171940; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style2 p { color:#fff; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style2 p.c-txt { color:#999; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style2 .btn-down { background:#ff3a34; border:0; color:#fff; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style2 .btn-down a { background:url('/images/common/ico_h11_down_white_l.png') no-repeat center right; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style2 .btn-down span { color:#fff; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style2.sc-reserve .btn-down { background:#3b6ce9; color:#fff; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3 { border:0; border-radius:0; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3 .c-info { border:1px solid #000; border-right:2px dotted #272a4d; border-radius:10px; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3 p.c-price { color:#eb3697; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3 .btn-down { background:#fff2f9; border:1px solid #272a4d; border-left:0; border-radius:10px; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3 .btn-down a { background:url('/images/common/ico_h11_down_pink_l.png') no-repeat center right; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3.sc-reserve p.c-price { color:#18b776; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3.sc-reserve .btn-down { background:#eefff7; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3.sc-reserve .btn-down span a { color:#000; } .shopdetail .shopdetailCoupon .smart-coupon-list li.sc-style3.sc-reserve .btn-down a { background:url('/images/common/ico_h11_down_green_l.png') no-repeat center right; } .info_top { padding: 24px 17px; } .info_top .tit-prd { position: relative; font-weight: 400; font-size: 16px; color: #2f2f2f; width: 100%; line-height: 1.3; } .shopdetail .info_top .prd_price_box { margin-top: 20px; } .shopdetail .info_top .prd_price_box>div { font-size: 0; margin-bottom: 9px; line-height: 1; } .shopdetail .info_top .prd_price_box>div>p, .shopdetail .info_top .prd_price_box>div>span { display: inline-block; } .shopdetail .info_top .prd_price_box>div>p { font-size: 15px; color: #888; font-weight: 500; width: 113px; } .shopdetail .info_top .prd_price_box>div>span.consumer_tt { font-size: 12px; color: #79797a; font-weight: 300; margin-left: 7px; } .shopdetail .info_top .prd_price_box>div>span.consumer_tt font { font-size: 13px; } .shopdetail .info_top .prd_price_box>div>span.price_tt { font-size: 17px; color: #2f2f2f; font-weight: 700; } .shopdetail .info_top .prd_price_box>div>span.price_tt font { font-size: 18px; display: inline-block; margin-top: -2px; vertical-align: middle; } .shopdetail .info_top .prd_price_box>div>span.percent_tt { font-size: 17px; color: #f45a20; font-weight: 600; margin-right: 10px; } .shopdetail .info_top .prd_price_box>div>span.percent_tt font { font-size: 18px; } .toastPopup { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); background: rgba(0,0,0,.7); padding: 32.5px 0; width: 160px; text-align: center; display: none; z-index: 10; } .toastPopup img { width:46px; } .toastPopup p { font-size:14px; color:#fffefe; line-height:1.3; margin-top: 19px; } .toastPopup_wish { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); background: rgba(0,0,0,.7); padding: 32.5px 0; width: 160px; text-align: center; display: none; z-index: 999999999999; } .toastPopup_wish img { width:46px; } .toastPopup_wish p { font-size:14px; color:#fffefe; line-height:1.3; margin-top: 19px; } .share_back { position: fixed; width: 100%; height: 100%; background: rgba(0,0,0,.8); top: 0; left: 0; z-index: 1001; display:none; } input#shareLink { position: absolute; left: 0; bottom: 0; height: 0; opacity: 0; } .share_pop { position: absolute; bottom: 0; left: 0; width: 100%; text-align: center; background: #fff; border-top-left-radius: 20px; border-top-right-radius: 20px; box-sizing: border-box; padding-top: 36px; } .share_pop>h1 { font-size:16px; color:#2f2f2f; font-weight: 600; margin-bottom: 20px; } .share_pop>img { width: 65px; margin-bottom: 14px; } .share_pop .share_name { font-size: 12px; color: #2f2f2f; font-weight: 400; } .share_pop .shareList { font-size: 0; text-align: center; padding: 27px 0; } .share_pop .shareList a { display: inline-block; } .share_pop .shareList a { display: inline-block; width: 44px; height: 44px; margin: 0 10px; } .share_pop .shareList a.btn_ka { background: url(/design/maatila2/maatila/2016img/btn_kakao.png); background-repeat: no-repeat; background-size: 100% auto; } .share_pop .shareList a.btn_fb { background: url(/design/maatila2/maatila/2016img/btn_facebook.png); background-repeat: no-repeat; background-size: 100% auto; } .share_pop .shareList a.btn_urlCopy { background: url(/design/maatila2/maatila/2016img/btn_url.png); background-repeat: no-repeat; background-size: 100% auto; } .share_pop .close_share { height: 50px; line-height: 50px; display: block; border-top: 1px solid #e5e5e5; font-size: 14px; color: #2f2f2f; font-weight: 400; } .shopdetail .opt-wrap { padding: 22px 7px; margin: 0 10px; border-top: 1px solid #f5f5f5; } .shopdetail .opt-wrap .info_title {font-size: 16px;color: #2f2f2f;font-weight: 600;margin-bottom: 22px;line-height: 1;} .shopdetail .opt-wrap .tit { margin-bottom: 18px; padding-left: 0; color: #2f2f2f; font-weight: 600; } .shopdetail .opt-wrap .tit strong { font-weight: 600; font-size: 18px; } .shopdetail .opt-wrap dl { overflow: hidden; width: 100%; display: block; font-size: 0; margin-bottom: 10px; } .shopdetail .opt-wrap dl:last-of-type { margin-bottom:0; } .shopdetail .opt-wrap dt { padding: 0; padding-left: 0; display: inline-block; width: 16.6%; font-weight: 400; color: #888; vertical-align: middle; font-size: 13px; /* min-height: 39px; */ /* line-height: 39px; */} .shopdetail .opt-wrap dd { /* padding: 21px 0; */ display: inline-block; vertical-align: middle; width: 83.4%; font-size: 13px; color: #2f2f2f; } .shopdetail .opt-wrap dd input.basic_option { width: 100%; height: 34px; border: 1px solid #e2e2e2; padding: 0 8px; box-sizing: border-box; } .shopdetail .opt-wrap.first dd { font-weight: 400; color: #2f2f2f; padding: 8px 0; } .shopdetail .opt-wrap.first dt { font-weight: 400; color: #888; padding: 8px 0; line-height: 1; min-height: auto; } .shopdetail .opt-wrap.first dd .tb-left, .shopdetail .opt-wrap.first dt .tb-left { padding-left: 0} .membership_info { display:none; margin-top:18px; } .membership_info.open { display:block; } .membership_info>p { } .membership_info>p>a {font-size: 12px;color:#2f2f2f;line-height: 1.7;display:block;} .membership_info .card_btn { font-size: 0; margin-top:10px } .membership_info .card_btn p, .membership_info .card_btn a { display:inline-block; vertical-align:middle; } .membership_info .card_btn p {margin-right:20px;font-size: 13px;color:#888;font-weight:400;} .membership_info .card_btn a {font-size: 13px;color:#2f2f2f;padding-right: 21px;background:url(/design/maatila2/maatila/2016img/icon_more.png);background-repeat:no-repeat;background-position: 100% 65%;background-size: 11px auto;} .membership_div { border-top: 1px solid #ececec; border-bottom: 1px solid #ececec; padding: 22px 7px; text-align: left; margin: 0 10px; } .membership_div>h1 { position: relative; font-size: 17px; color:#2f2f2f; font-weight: 600; } .membership_div>h1 a{font-size:13px; margin-left:30px; font-weight:500;} .membership_div>h1 img { position: absolute; right: 0; top: 4px; width: 15px; } .membership_div>h1.rotate img { transform:rotate(180deg); } .card_pop_back {position: fixed;width: 100%;height: 100%;top: 0;left: 0;background: rgba(0,0,0,.8);z-index: 9999999999;display:none;} .card_pop_back .card_pop {background:#fff;position:absolute;bottom: 0;box-sizing: border-box;width: 100%;height: 90vh;padding: 60px 17px 14px;overflow: hidden;padding-right: 2px;padding-bottom: 35px;} .card_pop_back .card_pop>h1 { font-size: 17px; color:#000; font-weight:700; position:relative; line-height: 1; background: #fff; margin-bottom: 30px; } .card_close { position:absolute; top: 17px; right: 17px; width: 16px; height: 16px; cursor: pointer; } .card_pop_inner {padding-bottom: 40px;box-sizing: border-box;padding-right: 15px;} .card_pop_back .card_pop h1.info_card { font-size: 15px; color: #2f2f2f; font-weight: 600; position: relative; line-height: 1; margin-bottom: 17px; } .card_pop_inner table { border-top: 1px solid #898989; width: 100%; } .card_pop_inner table td { font-size: 13px; color: #888; font-weight: 400; border-bottom: 1px solid #d8d8d8; min-height: 60px; box-sizing: border-box; letter-spacing: -1px; } .card_pop_inner table td:first-of-type { font-size: 13px; font-weight: 600; text-align:center; background: #f7f7f7; color: #2f2f2f; } .card_pop_inner table td:last-of-type { padding: 14px 0; padding-left: 20px; line-height: 1.4; height: 60px; } .card_pop_inner table tr:last-of-type td { border-bottom: 1px solid #898989; } .card_pop_inner table td em:first-of-type { position: relative; margin-right: 8px; padding-right: 8px; } .card_pop_inner table td em:first-of-type:after { content: ''; background: #bbb; width: 1px; height: 13px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .card_pop_inner table.second_table tr td:first-of-type { background:#fbfbfb; } .add_info_card { margin-top: 30px; line-height: 1.7; text-align: left; } .add_info_card p { font-size:0; } .add_info_card p span:first-of-type { width:9px; } .add_info_card p span { display:inline-block; color: #2f2f2f; font-size: 11px; font-weight: 400; width:calc(100% - 9px); vertical-align:top; } .add_opt { margin-top: 22px; padding-bottom:22px; border-bottom: 1px solid #ececec; } .add_opt .add-option-sel { position: relative; } .add_opt .add-option-sel img { position: absolute; right: 10px; top: 25px; width: 14px; } .add_opt .add-option-sel.rotate img { transform:rotate(180deg); } .add_inner { display:none; /* padding: 0 10px; */ } .add_inner.open { display:block; } .header .hd_line01 .right a {display: inline-block;margin-left: 9px;} .header .hd_line01.act .right .home span.ico.ico02 {background: url(/design/maatila2/maatila/2016img/header_home.png) center!important;background-size: 100% auto!important;background-repeat: no-repeat!important;width: 21px;margin-right: 4px;} .header .hd_line01.act .right .basket_link span.ico {background: url(/design/maatila2/maatila/2016img/header_cart.png) center!important;background-size: 100% auto!important;background-repeat: no-repeat!important;width: 20px;margin-right: 4px;} .header .hd_line01.act .right .search .ico.ico01 {width: 25px;height: 25px;background: url(/design/maatila2/maatila/phps/common/top_menuIcons_new.png)!important;background-size: 100% auto!important;background-position: center!important;background-repeat: no-repeat!important;padding-top: 0;background-position: 0 0 !important;} #mask1 {width:100%;height:100%;position:fixed;top: 0;left:0;right:0;bottom:0;background-color:#000;z-index:97 ;display:none;opacity: 0.8;} .detailTag { margin-bottom:25px; } .empty-board { text-align: center; padding: 40px 0; } .shopdetailNotify {} .shopdetailNotify .shopdetailNotifyInfo {padding: 15px; display: none } .shopdetailNotify .shopdtlTit { margin-top: 30px; color: #000; background: #f5f5f5; font-weight: bold; font-size: 12px; padding: 10px 15px; } .shopdetailNotify .shopdtlTit span { margin-left: 3px } .shopdetailNotify table {border-collapse:collapse; width: 100%; } .shopdetailNotify table th {padding:10px;width:80px;border: 1px solid #ddd;border-right:0;background-color: #efefef;color:#666;text-align:left;font-weight: normal;} .shopdetailNotify table td {padding:10px; border:1px solid #e8e8e8; border-left:0; background-color:#fff;} .card_cont{height: calc(100% - 40px);overflow-y: scroll;} /* BASIC css end */